Class: Daisy::DataInput::CallyComponent

Inherits:
LocoMotion::BaseComponent show all
Includes:
ViewComponent::SlotableDefault
Defined in:
app/components/daisy/data_input/cally_component.rb

Overview

The Cally component provides a customizable calendar interface for date selection. It supports both single date and date range selection, with configurable display options including the number of months to show and navigation controls.

Defined Under Namespace

Classes: MonthComponent, NextIcon, PreviousIcon

Constant Summary

Constants inherited from LocoMotion::BaseComponent

LocoMotion::BaseComponent::EMPTY_PART_IGNORED_TAGS, LocoMotion::BaseComponent::SELF_CLOSING_TAGS

Instance Attribute Summary

Attributes inherited from LocoMotion::BaseComponent

#config, #loco_parent

Instance Method Summary collapse

Methods inherited from LocoMotion::BaseComponent

build, #component_ref, #config_option, #cssify, define_modifier, define_modifiers, define_part, define_parts, define_size, define_sizes, #empty_part_content, #inspect, #part, register_component_initializer, register_component_setup, #rendered_css, #rendered_data, #rendered_html, #rendered_stimulus_controllers, #rendered_tag_name, renders_many, renders_one, set_component_name, #set_loco_parent, #strip_spaces

Methods included from LocoMotion::Concerns::InspectableComponent

#build_inspect_string

Constructor Details

#initialize(**kws) ⇒ CallyComponent

Instantiate a new Cally component.

Parameters:

  • kws (Hash) —

    The keyword arguments for the component.

Options Hash (**kws):

  • change (String) —

    ID of an input to update with the selected date. Mutually exclusive with update.

  • update (String) —

    ID of an element to update with the selected date. Mutually exclusive with change.

  • id (String) —

    The ID of the calendar element.

  • value (String, Date) —

    The currently selected date or range.

  • min (String, Date) —

    The minimum selectable date.

  • max (String, Date) —

    The maximum selectable date.

  • today (String, Date) —

    The date to consider as 'today'.

  • modifier (Symbol) —

    Optional modifier for the calendar's behavior. Use :range to enable date range selection.

  • months (Integer) —

    Number of months to display. Defaults to 1 when no modifier is set; left unset (no forced default) when a modifier like range is active.



120
121
122
123
124
125
126
127
128
129
130
131
132
133
 
# File 'app/components/daisy/data_input/cally_component.rb', line 120

def initialize(**kws)
  super

  # If we don't have any modifiers, assume we want a single month for a date select
  @month_count = config_option(:months, modifiers.blank? ? 1 : nil)
  @change = config_option(:change)
  @update = config_option(:update)

  @id = config_option(:id)
  @value = config_option(:value)
  @min = config_option(:min)
  @max = config_option(:max)
  @today = config_option(:today)
end

Instance Method Details

#before_render ⇒ Object

Configures the calendar component before rendering.

Sets up the appropriate tag name based on whether range selection is enabled, adds CSS classes, and configures HTML attributes for the calendar component.



140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
 
# File 'app/components/daisy/data_input/cally_component.rb', line 140

def before_render
  super

  if modifiers.include?(:range)
    set_tag_name(:component, "calendar-range")
  else
    set_tag_name(:component, "calendar-date")
  end

  add_css(:component, "cally")
  add_html(:component, { months: @month_count }) if @month_count

  add_html(:component, {
             id: @id,
             value: @value,
             min: @min,
             max: @max,
             today: @today
           })

  add_html(:component, { onchange: "document.getElementById('#{@change}').value = this.value" }) if @change

  return unless @update

  add_html(:component, { onchange: "document.getElementById('#{@update}').innerHTML = this.value" })
end

#default_next_icon ⇒ NextIcon

Provides a default next icon if none is specified.

Returns:



189
190
191
 
# File 'app/components/daisy/data_input/cally_component.rb', line 189

def default_next_icon
  NextIcon.new(icon: "chevron-right")
end

#default_previous_icon ⇒ PreviousIcon

Provides a default previous icon if none is specified.

Returns:



182
183
184
 
# File 'app/components/daisy/data_input/cally_component.rb', line 182

def default_previous_icon
  PreviousIcon.new(icon: "chevron-left")
end

#month_options(index) ⇒ Hash

Generates options for a month component at the given index.

Parameters:

  • index (Integer) —

    The 0-based index of the month

Returns:

  • (Hash) —

    Options hash for the month component



171
172
173
174
175
176
177
 
# File 'app/components/daisy/data_input/cally_component.rb', line 171

def month_options(index)
  options = {}

  options[:offset] = index if index.positive?

  options
end