Class: Shadcn::CalendarComponent

Inherits:
BaseComponent
  • Object
show all
Defined in:
app/components/shadcn/calendar_component.rb

Overview

Calendar component - date picker grid Matches shadcn/ui Calendar component

Examples:

Basic calendar

<%= render Shadcn::CalendarComponent.new %>

With selected date

<%= render Shadcn::CalendarComponent.new(selected: Date.today) %>

With name for form submission

<%= render Shadcn::CalendarComponent.new(name: "event[date]") %>

Constant Summary collapse

CONTAINER_CLASSES = 
"p-3 rounded-md border bg-background"
HEADER_CLASSES = 
"flex items-center justify-between mb-4"
MONTH_YEAR_CLASSES = 
"text-sm font-medium"
"inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground h-7 w-7"
WEEKDAY_CLASSES = 
"text-center text-xs font-medium text-muted-foreground"
DAY_CLASSES = 
"h-8 w-8 text-center text-sm p-0 relative flex items-center justify-center rounded-md cursor-pointer hover:bg-accent hover:text-accent-foreground focus:outline-none focus:ring-1 focus:ring-ring"
DAY_SELECTED_CLASSES = 
"bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground"
DAY_TODAY_CLASSES = 
"bg-accent text-accent-foreground"
DAY_OUTSIDE_CLASSES = 
"text-muted-foreground opacity-50"
DAY_DISABLED_CLASSES = 
"text-muted-foreground opacity-50 pointer-events-none"
WEEKDAYS = 
%w[Su Mo Tu We Th Fr Sa].freeze
WEEK_START_SYMBOLS =

Mapping for Rails beginning_of_week symbols

{
  0 => :sunday,
  1 => :monday,
  2 => :tuesday,
  3 => :wednesday,
  4 => :thursday,
  5 => :friday,
  6 => :saturday
}.freeze
MONTHS = 
%w[January February March April May June July August September October November December].freeze
MODES = 
%i[single multiple range].freeze

Instance Attribute Summary

Attributes inherited from BaseComponent

#class_name, #data, #html_options

Instance Method Summary collapse

Methods inherited from BaseComponent

#content

Methods included from Rails::Helpers::ClassNameHelper

#cn

Constructor Details

#initialize(selected: nil, month: nil, min_date: nil, max_date: nil, name: nil, disabled_dates: [], disabled_days_of_week: [], show_outside_days: true, mode: :single, required: false, week_starts_on: 0, **options) ⇒ CalendarComponent

Returns a new instance of CalendarComponent.

Parameters:

  • selected (Date, Array<Date>, nil) (defaults to: nil) —

    Currently selected date(s)

  • month (Date, nil) (defaults to: nil) —

    Month to display (defaults to current month)

  • min_date (Date, nil) (defaults to: nil) —

    Minimum selectable date

  • max_date (Date, nil) (defaults to: nil) —

    Maximum selectable date

  • name (String, nil) (defaults to: nil) —

    Form field name for hidden input

  • disabled_dates (Array<Date>) (defaults to: []) —

    Specific dates that cannot be selected

  • disabled_days_of_week (Array<Integer>) (defaults to: []) —

    Days of week to disable (0=Sun, 6=Sat)

  • show_outside_days (Boolean) (defaults to: true) —

    Whether to show days outside current month

  • mode (Symbol) (defaults to: :single) —

    Selection mode: :single, :multiple, or :range

  • required (Boolean) (defaults to: false) —

    Whether a selection is required (prevents deselection)

  • week_starts_on (Integer) (defaults to: 0) —

    First day of week (0=Sunday, 1=Monday, etc.)



54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
 
# File 'app/components/shadcn/calendar_component.rb', line 54

def initialize(
  selected: nil,
  month: nil,
  min_date: nil,
  max_date: nil,
  name: nil,
  disabled_dates: [],
  disabled_days_of_week: [],
  show_outside_days: true,
  mode: :single,
  required: false,
  week_starts_on: 0,
  **options
)
  super(**options)
  @selected = selected
  @month = month || (selected.is_a?(Array) ? selected.first : selected) || Date.today
  @min_date = min_date
  @max_date = max_date
  @name = name
  @disabled_dates = disabled_dates
  @disabled_days_of_week = disabled_days_of_week
  @show_outside_days = show_outside_days
  @mode = mode.to_sym
  @required = required
  @week_starts_on = week_starts_on
end

Instance Method Details

#call ⇒ Object 



82
83
84
 
# File 'app/components/shadcn/calendar_component.rb', line 82

def call
  content_tag(:div, calendar_content, **calendar_attributes)
end