Module: UI::DatePickerInputBehavior

Included in:
DatePickerInput, DatePickerInputComponent
Defined in:
app/behaviors/ui/date_picker_input_behavior.rb

Overview

Shared behavior for DatePicker input mode (text input + icon button)

Instance Method Summary collapse

Instance Method Details

#date_picker_icon_button_classes ⇒ Object

Icon button classes (positioned inside input)



51
52
53
54
55
56
57
58
59
60
61
 
# File 'app/behaviors/ui/date_picker_input_behavior.rb', line 51

def date_picker_icon_button_classes
  TailwindMerge::Merger.new.merge([
    "absolute top-1/2 right-2 -translate-y-1/2",
    "inline-flex items-center justify-center",
    "h-6 w-6 rounded-sm",
    "hover:bg-accent hover:text-accent-foreground",
    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
    "transition-colors",
    @icon_classes
  ].compact.join(" "))
end

#date_picker_icon_button_data_attributes ⇒ Object

Icon button data attributes



43
44
45
46
47
48
 
# File 'app/behaviors/ui/date_picker_input_behavior.rb', line 43

def date_picker_icon_button_data_attributes
  {
    ui__datepicker_target: "trigger",
    ui__popover_target: "trigger"
  }
end

#date_picker_input_classes ⇒ Object

Input classes



27
28
29
30
31
32
33
34
35
36
37
38
39
40
 
# File 'app/behaviors/ui/date_picker_input_behavior.rb', line 27

def date_picker_input_classes
  TailwindMerge::Merger.new.merge([
    # Input base styles
    "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm",
    "ring-offset-background",
    "file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground",
    "placeholder:text-muted-foreground",
    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
    "disabled:cursor-not-allowed disabled:opacity-50",
    # Extra padding for icon button
    "pr-10",
    @classes
  ].compact.join(" "))
end

#date_picker_input_data_attributes ⇒ Object

Generate data attributes for text input



6
7
8
9
10
11
 
# File 'app/behaviors/ui/date_picker_input_behavior.rb', line 6

def date_picker_input_data_attributes
  {
    ui__datepicker_target: "input",
    action: "input->ui--datepicker#handleInput keydown->ui--datepicker#handleInputKeydown"
  }
end

#date_picker_input_html_attributes ⇒ Object

Build complete HTML attributes hash for text input



14
15
16
17
18
19
20
21
22
23
24
 
# File 'app/behaviors/ui/date_picker_input_behavior.rb', line 14

def date_picker_input_html_attributes
  base_attrs = @attributes&.except(:data) || {}
  user_data = @attributes&.fetch(:data, {}) || {}
  base_attrs.merge(
    class: date_picker_input_classes,
    type: "text",
    placeholder: @placeholder,
    value: @value,
    data: user_data.merge(date_picker_input_data_attributes)
  )
end