funicular-datepicker 0.1.1 → 0.2.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 6d95ca094c408765d950bfdbcb1af695783998e7d1a7f64a334f46dfe7fb1dae
-  data.tar.gz: 54c5927016a32b382ba639c3542e60da0bcd625d4aefdc02a311bb9670cb7901
+  metadata.gz: 0cccdef7050f58fdae30fccc488a56e5015674d0e1fe00f1639f5fdad238fc67
+  data.tar.gz: 394fa0df64acc89c947c36bae88c621f435373f977bfb0098346cfc1f00e2e27
 SHA512:
-  metadata.gz: c37569a0336ec47423b204692d129537afe7f81ac4492d7ed19921899ed98440b5d1d05aea86ebc4f0d514f854d755894c1609d726cad485c67df9159490da45
-  data.tar.gz: 8ddb59f662b6a631fd3e5775ee4bd9a486e79116d90e01f5f4acf4e05e0ffe7dc366506f02c928d222ca2f448df623912f1dc4083c9941446aace39e67958323
+  metadata.gz: 43936b1c205fcd1e365e9d591a8628c0475a59b38731a162dd6c4dbbb90b4173475f8bcaf9bd10cf154a84f4547aa060b97fdf7711266bc967dc5cab323ec334
+  data.tar.gz: 3c27d85680a4002065382787fd8b8a003f4e178a802b6fcd6b921915ac77b4b6a747e7d16ff1ef3747c98ec5b47195371cb07842070cd5b1ade266fafd613d53

data/README.md

@@ -13,6 +13,7 @@ end
 ```ruby
 component(
   Funicular::Plugins::DatePicker::Component,
+  name: "birthday",
   value: state.birthday,
   input_class: "birthday-input",
   button_class: "birthday-calendar-button",

data/lib/components/date_picker_component.rb

@@ -20,8 +20,8 @@ class DatePickerComponent < Funicular::Component
     year, month, = parse_date(props[:value])
     patch(
       calendar_open: true,
-      view_year: year || state.view_year,
-      view_month: month || state.view_month
+      view_year: year || state[:view_year],
+      view_month: month || state[:view_month]
     )
   end
 
@@ -30,18 +30,18 @@ class DatePickerComponent < Funicular::Component
   end
 
   def prev_month
-    if state.view_month == 1
-      patch(view_year: state.view_year - 1, view_month: 12)
+    if state[:view_month] == 1
+      patch(view_year: state[:view_year] - 1, view_month: 12)
     else
-      patch(view_month: state.view_month - 1)
+      patch(view_month: state[:view_month] - 1)
     end
   end
 
   def next_month
-    if state.view_month == 12
-      patch(view_year: state.view_year + 1, view_month: 1)
+    if state[:view_month] == 12
+      patch(view_year: state[:view_year] + 1, view_month: 1)
     else
-      patch(view_month: state.view_month + 1)
+      patch(view_month: state[:view_month] + 1)
     end
   end
 
@@ -55,26 +55,27 @@ class DatePickerComponent < Funicular::Component
   end
 
   def select_day(day)
-    value = date_string(state.view_year, state.view_month, day)
+    value = date_string(state[:view_year], state[:view_month], day)
     emit_change(value)
     patch(calendar_open: false)
   end
 
-  def render
-    div(class: "funicular-date-picker") do
-      div(class: "funicular-date-picker__input_row") do
-        input(
+  def render(h)
+    h.div(class: "funicular-date-picker") do
+      h.div(class: "funicular-date-picker__input_row") do
+        h.input(
           type: "text",
+          name: props[:name],
           value: props[:value].to_s,
           placeholder: props[:placeholder] || "YYYY-MM-DD",
           class: props[:input_class] || "funicular-date-picker__input",
           oninput: :handle_input,
           onfocus: -> { open_calendar }
         )
-        button(type: "button", class: button_class, onclick: -> { open_calendar }) { "Calendar" }
+        h.button(type: "button", class: button_class, onclick: -> { open_calendar }) { "Calendar" }
       end
 
-      render_calendar if state.calendar_open
+      render_calendar(h) if state[:calendar_open]
     end
   end
 
@@ -84,31 +85,31 @@ class DatePickerComponent < Funicular::Component
     props[:button_class] || "funicular-date-picker__button"
   end
 
-  def render_calendar
-    div(class: "funicular-date-picker__panel") do
-      div(class: "funicular-date-picker__header") do
-        button(type: "button", class: "funicular-date-picker__nav", onclick: -> { prev_month }) { "<" }
-        div(class: "funicular-date-picker__month") do
-          "#{MONTH_NAMES[state.view_month - 1]} #{state.view_year}"
+  def render_calendar(h)
+    h.div(class: "funicular-date-picker__panel") do
+      h.div(class: "funicular-date-picker__header") do
+        h.button(type: "button", class: "funicular-date-picker__nav", onclick: -> { prev_month }) { "<" }
+        h.div(class: "funicular-date-picker__month") do
+          "#{MONTH_NAMES[state[:view_month] - 1]} #{state[:view_year]}"
         end
-        button(type: "button", class: "funicular-date-picker__nav", onclick: -> { next_month }) { ">" }
+        h.button(type: "button", class: "funicular-date-picker__nav", onclick: -> { next_month }) { ">" }
       end
 
-      div(class: "funicular-date-picker__grid") do
+      h.div(class: "funicular-date-picker__grid") do
         WEEKDAYS.each do |day|
-          div(class: "funicular-date-picker__weekday") { day }
+          h.div(class: "funicular-date-picker__weekday") { day }
         end
 
-        first_weekday(state.view_year, state.view_month).times do
-          div(class: "funicular-date-picker__empty") { "" }
+        first_weekday(state[:view_year], state[:view_month]).times do
+          h.div(class: "funicular-date-picker__empty") { "" }
         end
 
         selected_year, selected_month, selected_day = parse_date(props[:value])
-        (1..days_in_month(state.view_year, state.view_month)).each do |day|
-          selected = selected_year == state.view_year &&
-                     selected_month == state.view_month &&
+        (1..days_in_month(state[:view_year], state[:view_month])).each do |day|
+          selected = selected_year == state[:view_year] &&
+                     selected_month == state[:view_month] &&
                      selected_day == day
-          button(
+          h.button(
             type: "button",
             class: selected ? "funicular-date-picker__day funicular-date-picker__day--selected" : "funicular-date-picker__day",
             onclick: -> { select_day(day) }
@@ -118,9 +119,9 @@ class DatePickerComponent < Funicular::Component
         end
       end
 
-      div(class: "funicular-date-picker__footer") do
-        button(type: "button", class: "funicular-date-picker__footer_button", onclick: -> { clear }) { "Clear" }
-        button(type: "button", class: "funicular-date-picker__footer_button", onclick: -> { close_calendar }) { "Close" }
+      h.div(class: "funicular-date-picker__footer") do
+        h.button(type: "button", class: "funicular-date-picker__footer_button", onclick: -> { clear }) { "Clear" }
+        h.button(type: "button", class: "funicular-date-picker__footer_button", onclick: -> { close_calendar }) { "Close" }
       end
     end
   end

metadata

@@ -1,14 +1,28 @@
 --- !ruby/object:Gem::Specification
 name: funicular-datepicker
 version: !ruby/object:Gem::Version
-  version: 0.1.1
+  version: 0.2.0
 platform: ruby
 authors:
 - HASUMI Hitoshi
 bindir: bin
 cert_chain: []
 date: 1980-01-02 00:00:00.000000000 Z
-dependencies: []
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: funicular
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 0.3.0
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 0.3.0
 description: A Funicular date picker component packaged as a Ruby-script CRubygem.
 email:
 - hasumikin@gmail.com