glib-web 3.24.3 → 3.25.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 2aae0523d109fcf8f7e6b368ea3b64bc262f08fd3a7c1017a8ade64eba3185df
-  data.tar.gz: 63d3d5b00d8b25e5450ed4eb5ebdd5658aaa4b4302f326e55bd7a5a5902d976e
+  metadata.gz: d2f5d2ae1abeb1b4204f3879a5561f0396f610ebc2805ff684ce1989b08041f5
+  data.tar.gz: 2ceb705bdc581a4e4fcf1b3f70b9ace090fb4af8576995310f2ec46813c7c1eb
 SHA512:
-  metadata.gz: 103f9b75cab3048bd231a5cca4c94779031d57743bca95b631322dc82af1f956eb54e8220711230337594e28dda40d786fb58fd3491255e18f656a0ec07cdbff
-  data.tar.gz: bd77f29f8ab4952f46840f9e18060140673f3de43d1f05de76e8a9cb4ba03ef58b05ca0f6a11919719bbab53cee8111cee12ba120c01e94d2391e16d515c7931
+  metadata.gz: 1f97d523b8eedd779e93c2cd54a27d5af356e4fc16287d141c0b3ec647596e7d0661713a2849c27b255684b2d7c8185a77f5a43bdcd625f15a621f86cacfa6dd
+  data.tar.gz: a87a2e17a6763771cb606910f3ce9c3011bde9b8e6d935c7a44616a66713ccc4aabade5d0b849b2b1c6ac078308c24ebc32ddecf7bbeb99ef6984f991be5cdda

data/app/controllers/glib/home_controller.rb

@@ -35,7 +35,7 @@ module Glib
       eos
 
       # We can't use prepend_view_path because it affects the app, not the gem
-      path = "#{@path_prefix}/#{params[:path] || 'home/index'}"
+      path = "#{@path_prefix}/#{params[:override_path] || params[:path] || 'home/index'}"
       render path
     end
 

data/app/helpers/glib/json_ui/action_builder/components.rb

@@ -16,6 +16,12 @@ class Glib::JsonUi::ActionBuilder
     end
 
     # Experimental
+    class ReplaceChildren < Action
+      string :targetId
+      views :childViews
+    end
+
+    # Experimental. Can this be merged with `components_set` ?
     class Replace < Action
       string :targetId
       action :onReplace

data/app/helpers/glib/json_ui/action_builder.rb

@@ -109,6 +109,30 @@ module Glib
         end
       end
 
+      module Logics
+        # Future: Replace showIf and loadIf
+        # Example:
+        # `submitWhenNotDisplayed` is false by default
+        # fields_text id: 'my_text', displayed: false, submitWhenNotDisplayed: true
+        #
+        # logics_if condition: { '==', BLAH1, BLAH2 }, true: ->(action) do
+        #   action.components_set targetId: 'my_text', displayed: true
+        # end
+        #
+        # class If < Action
+        #   hash :condition
+        #   action :true
+        #   action :false
+        # end
+
+        class Set < Action
+          string :targetId
+          hash :conditionalData
+          hash :variables
+          action :onSet
+        end
+      end
+
       module Timeouts
         class Set < Action
           string :timerId
@@ -141,7 +165,24 @@ module Glib
         end
       end
 
+      module Cookies
+        class Save < Action
+          string :key
+          string :value
+          action :onSave
+        end
+
+        # FUTURE
+        # class Remove < Action
+        # end
+
+        # FUTURE
+        # class Clear < Action
+        # end
+      end
+
       # FUTURE
+
       module Data
         class Save < Action
           string :key

data/app/helpers/glib/json_ui/page_helper.rb

@@ -183,6 +183,12 @@ module Glib
           end
         end
 
+        def bodyFooter(options = {})
+          json.bodyFooter do
+            vertical_content(options)
+          end
+        end
+
         def header(options = {})
           json.header do
             vertical_content(options)

data/app/helpers/glib/json_ui/styling_helper.rb

@@ -50,6 +50,17 @@ module Glib
 
       ###
 
+      ### Chart
+
+      def glib_chart_tooltip_template(options)
+        %{
+          <div style="border: 1px solid gray; border-radius: 6px;">
+            <div style="border-radius: 6px 6px 0 0; background-color: gray; padding: 4px; color: white;">#{options[:title]}</div>
+            <div style="border-radius: 0 0 6px 6px; background-color: white; padding: 4px" color: black;>#{options[:content]}</div>
+          </div>
+        }
+      end
+
     end
   end
 end

data/app/helpers/glib/json_ui/view_builder/fields.rb

@@ -10,6 +10,7 @@ class Glib::JsonUi::ViewBuilder
       bool :disableDirtyCheck
       action :onChange
       string :paramNameForFormData
+      string :paramNameForFieldName
 
       def default_url_options
         { only_path: true }
@@ -172,6 +173,11 @@ class Glib::JsonUi::ViewBuilder
       string :cacheKey
     end
 
+    # Deprecated
+    # Just use fields_select with options provided by the backend. This allows greater flexibility,
+    # which is important because different systems might want to use different values for
+    # countries as well as for regions, e.g. alpha2 vs alpha3
+    # See app/views/json_ui/garage/forms/pickers.json.jbuilder for an example
     class Country < AbstractField
       hash :region
     end

data/app/views/json_ui/garage/actions/_components.json.jbuilder

@@ -0,0 +1,18 @@
+
+section.header padding: glib_json_padding_list, childViews: ->(header) do
+  header.h3 text: 'Components'
+end
+
+section.rows builder: ->(template) do
+  template.thumbnail title: 'components/update (Deprecated)', onClick: ->(action) do
+    action.windows_open url: json_ui_garage_url(path: 'views/components_update')
+  end
+
+  # template.thumbnail title: 'components/replace', onClick: ->(action) do
+  #   action.windows_open url: json_ui_garage_url(path: 'views/components')
+  # end
+
+  template.thumbnail title: 'components/set', onClick: ->(action) do
+    action.windows_open url: json_ui_garage_url(path: 'views/components_set')
+  end
+end

data/app/views/json_ui/garage/actions/_cookies.json.jbuilder

@@ -0,0 +1,12 @@
+
+section.header padding: glib_json_padding_list, childViews: ->(header) do
+  header.h3 id: 'cookie', text: 'Cookies'
+end
+
+section.rows builder: ->(template) do
+  template.thumbnail title: 'cookies/save', onClick: ->(action) do
+    action.cookies_save key: 'glib_cookie', value: "test_cookie_#{DateTime.current.to_i}", onSave: ->(subaction) do
+      subaction.snackbars_alert message: 'Saved'
+    end
+  end
+end

data/app/views/json_ui/garage/actions/_dialogs.json.jbuilder

@@ -84,10 +84,18 @@ section.rows builder: ->(template) do
     action.dialogs_open url: json_ui_garage_url(path: 'forms/dialogs_update2')
   end
 
+  template.thumbnail title: 'dialogs/open (update form inside dialog)', onClick: ->(action) do
+    action.dialogs_open url: json_ui_garage_url(path: 'forms/dialogs_form')
+  end
+
   template.thumbnail title: 'dialogs/open (with filePaster)', onClick: ->(action) do
     action.dialogs_open url: json_ui_garage_url(path: 'forms/dialogs_update3')
   end
 
+  template.thumbnail title: 'dialogs/open (update form inside dialog)', onClick: ->(action) do
+    action.dialogs_open url: json_ui_garage_url(path: 'forms/dialogs_form')
+  end
+
   template.thumbnail title: 'dialogs/oauth', onClick: ->(action) do
     if respond_to?(:user_facebook_omniauth_authorize_url)
       provider = {

data/app/views/json_ui/garage/actions/_fields.json.jbuilder

@@ -0,0 +1,10 @@
+
+section.header padding: glib_json_padding_list, childViews: ->(header) do
+  header.h3 text: 'Fields'
+end
+
+section.rows builder: ->(template) do
+  template.thumbnail title: 'fields/focus, fields/blur, fields/reset', onClick: ->(action) do
+    action.windows_open url: json_ui_garage_url(path: 'views/fields_focus')
+  end
+end

data/app/views/json_ui/garage/actions/_list.json.jbuilder

@@ -19,5 +19,11 @@ panel.panels_list id: 'action_list', sections: [
     render "#{@path_prefix}/actions/commands", section: section
   end, ->(section) do
     render "#{@path_prefix}/actions/tours", section: section
+  end, ->(section) do
+    render "#{@path_prefix}/actions/components", section: section
+  end, ->(section) do
+    render "#{@path_prefix}/actions/fields", section: section
+  end, ->(section) do
+    render "#{@path_prefix}/actions/cookies", section: section
   end
 ]

data/app/views/json_ui/garage/forms/dialogs_form.json.jbuilder

@@ -0,0 +1,40 @@
+json.title 'Forms'
+
+page = json_ui_page json
+render "#{@path_prefix}/nav_menu", json: json, page: page
+
+data = params[:user] || { cities: [] }
+
+page.scroll childViews: ->(scroll) do
+  cities = {
+    'Brisbane' => 'Brisbane',
+    'Canberra' => 'Canberra',
+    'Melbourne' => 'Melbourne',
+    'Sydney' => 'Sydney',
+  }
+  scroll.panels_form \
+    url: json_ui_garage_url(path: 'forms/generic_post'),
+    method: 'post',
+    width: 'matchParent',
+    id: 'dialogs_form',
+    padding: glib_json_padding_body,
+    childViews: ->(form) do
+      form.fields_select \
+        name: 'user[cities][]',
+        width: 'matchParent',
+        label: 'Cities',
+        options: cities.map { |k, v| { value: k, text: v } },
+        value: data[:cities] + [params[:new_city]],
+        multiple: true,
+        accessory: ->(accessory) do
+          accessory.footer padding: { all: 20 }, childViews: ->(footer) do
+            footer.label text: 'Can\'t find a city? Enter a new one', onClick: ->(action) do
+              action.dialogs_open url: json_ui_garage_url(path: 'forms/dialogs_subform')
+            end
+          end
+        end
+
+      form.spacer height: 20
+      form.button text: 'Submit', onClick: ->(action) { action.forms_submit }
+    end
+end

data/app/views/json_ui/garage/forms/dialogs_subform.json.jbuilder

@@ -0,0 +1,21 @@
+json.title 'Forms'
+
+page = json_ui_page json
+render "#{@path_prefix}/nav_menu", json: json, page: page
+
+page.scroll childViews: ->(scroll) do
+  scroll.panels_form \
+    url: json_ui_garage_url(path: 'forms/dialogs_subform_post'),
+    method: 'post',
+    width: 'matchParent',
+    padding: glib_json_padding_body,
+    childViews: ->(form) do
+      form.fields_text \
+        name: 'user[city]',
+        width: 'matchParent',
+        label: 'City'
+
+      form.spacer height: 20
+      form.button text: 'Submit', onClick: ->(action) { action.forms_submit }
+    end
+end

data/app/views/json_ui/garage/forms/dialogs_subform_post.json.jbuilder

@@ -0,0 +1,13 @@
+data = params[:user] || {}
+
+json_ui_response json do |action|
+  action.dialogs_close onClose: ->(subaction) do
+    subaction.components_find targetId: 'dialogs_form', onFind: ->(subsubaction) do
+      # Use `override_path` to override the form's original form, which gets submitted in form data,
+      # so it needs to be explicitly overriden using a different param name.
+      subsubaction.forms_submit \
+        overrideUrl: json_ui_garage_url(override_path: 'forms/dialogs_form', new_city: data[:city]),
+        overrideMethod: :get
+    end
+  end
+end

data/app/views/json_ui/garage/forms/pickers.json.jbuilder

@@ -81,9 +81,82 @@ page.form \
   form.spacer height: 20
   form.h2 text: 'Country'
   form.spacer height: 6
-  region_field = { name: 'user[city]', label: 'City' }
-  form.fields_country name: 'user[country]', width: 'matchParent', label: 'Country', region: nil
-  form.fields_country name: 'user[country_with_region]', width: 'matchParent', label: 'Country with region', region: region_field
+  # region_field = { name: 'user[city]', label: 'City' }
+  # form.fields_country name: 'user[country]', width: 'matchParent', label: 'Country', region: nil
+  # form.fields_country name: 'user[country_with_region]', width: 'matchParent', label: 'Country with region', region: region_field
+
+  countries = [
+    {
+      code: 'AU',
+      name: 'Australia',
+      regions: ['ACT', 'New South Wales', 'Victoria', 'Western Australia']
+    },
+    {
+      code: 'ID',
+      name: 'Indonesia',
+      regions: ['Jawa Barat', 'Java Tengah', 'Jawa Timur', 'Sumatra Utara', 'Sumatra Barat', 'Sumatra Selatan']
+    }
+  ]
+  region_registry = countries.map do |c|
+    [c[:code], c[:regions].map { |r| { value: r, text: r } } ]
+  end.to_h
+  form.fields_select \
+    name: 'user[country1]',
+    width: 'matchParent',
+    label: 'Country',
+    options: countries.map { |c| { value: c[:code], text: c[:name] } },
+    paramNameForFormData: 'variables',
+    onChange: ->(action) do
+      action.logics_set targetId: 'region_code1', conditionalData: {
+        options: {
+          '[]' => [{ 'var': 'static[region_registry]' }, { 'var': 'user[country1]' }]
+        }
+      }, variables: {
+        'static[region_registry]' => region_registry
+      }
+    end
+
+  form.fields_select \
+    name: 'user[region1]',
+    width: 'matchParent',
+    label: 'Region',
+    id: 'region_code1',
+    options: []
+
+  form.spacer height: 20
+
+  selected_country = 'AU'
+  form.fields_select \
+    name: 'user[country2]',
+    width: 'matchParent',
+    label: 'Country',
+    options: countries.map { |c| { value: c[:code], text: c[:name] } },
+    paramNameForFormData: 'variables',
+    value: selected_country,
+    onChange: ->(action) do
+      action.logics_set targetId: 'region_code2', conditionalData: {
+        options: {
+          '??' => [
+            {
+              '[]' => [{ 'var': 'static[region_registry]' }, { 'var': 'user[country2]' }]
+            },
+            []
+          ]
+        },
+        value: nil
+      }, variables: {
+        'static[region_registry]' => region_registry
+      }
+    end
+
+  form.fields_select \
+    name: 'user[region2]',
+    width: 'matchParent',
+    label: 'Region',
+    id: 'region_code2',
+    value: 'Victoria',
+    options: region_registry[selected_country]
+  form.label text: 'This select options should not be blank'
 
   form.spacer height: 20
   form.h2 text: 'Map'

data/app/views/json_ui/garage/forms/selects.json.jbuilder

@@ -70,8 +70,12 @@ page.form url: json_ui_garage_url(path: 'forms/generic_post'), method: 'post', p
       accessory.header padding: { x: 16, y: 10 }, childViews: ->(header) do
         header.label text: 'Header'
       end
-      accessory.footer padding: { x: 16, y: 10 }, childViews: ->(footer) do
-        footer.label text: 'Footer'
+      accessory.footer styleClass: 'select-footer', padding: { x: 16, y: 10 }, childViews: ->(footer) do
+        footer.h3 text: 'Footer'
+        # footer.spacer height: 4
+        footer.p styleClass: 'select-footer-paragraph', text: %(
+          Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Tortor consequat id porta nibh venenatis cras sed. Amet consectetur adipiscing elit duis tristique sollicitudin nibh. Proin sagittis nisl rhoncus mattis rhoncus urna neque viverra justo. Velit egestas dui id ornare arcu odio. Pretium nibh ipsum consequat nisl vel pretium. Bibendum at varius vel pharetra. Leo duis ut diam quam nulla porttitor massa id. Consectetur libero id faucibus nisl tincidunt eget nullam non. Eu facilisis sed odio morbi quis. Eu volutpat odio facilisis mauris sit amet massa vitae tortor. Sed odio morbi quis commodo odio aenean sed. Sit amet justo donec enim diam. Ullamcorper a lacus vestibulum sed arcu non odio euismod.
+        )
         footer.spacer height: 14
         footer.label text: 'Click me', onClick: ->(action) do
           action.components_findClosest view: 'fields/select', onFind: ->(subaction) do

data/app/views/json_ui/garage/views/charts.json.jbuilder

@@ -61,6 +61,32 @@ else
       # scroll.h1 text: 'Line chart using remote data'
       # render "#{@path_prefix}/views/chart_data", json: json, builder: scroll
 
+      scroll.h2 text: 'Line chart with custom tooltip'
+      scroll.charts_line \
+        plugins: { customTooltip: true },
+        colors: ['#79AC78', '#3085C3'], legend: { display: false },
+        dataSeries: [
+          -> do
+            json.title 'Line'
+
+            points = {
+              'Jan' => 100,
+              'Feb' => 78,
+              'Mar' => 70,
+              'Apr' => 62,
+            }
+            prev = points['Jan']
+
+
+            json.points points.map { |k, v|
+              delta = prev - v
+              tooltip = v < prev ? "<div>Delta</div><div>▼ #{delta}</div>" : "<div>Delta</div><div>▲ #{delta}</div>"
+              prev = v
+              { x: k, y: v, tooltip: glib_chart_tooltip_template(title: "Summary #{k}", content: tooltip) }
+            }
+          end
+        ]
+
       scroll.h2 text: 'Column chart (Clustered)'
       scroll.charts_column dataGroups: [
         -> do

data/app/views/json_ui/garage/views/components_set.json.jbuilder

@@ -0,0 +1,37 @@
+json.title 'Component set'
+
+page = json_ui_page json
+
+render "#{@path_prefix}/nav_menu", json: json, page: page, top_nav: true
+
+page.body padding: glib_json_padding_body, childViews: ->(body) do
+  body.panels_responsive width: 'matchParent', childViews: ->(res) do
+    res.label id: 'label', text: 'Hello world!'
+    res.spacer height: 8
+    res.button text: 'set', onClick: ->(action) do
+      action.components_set targetId: 'label', data: { text: 'Hello too!' }, onSet: ->(saction) do
+        saction.snackbars_alert styleClasses: ['success'], message: 'Changed!'
+      end
+    end
+    res.spacer height: 16
+
+    res.panels_form \
+      url: json_ui_garage_url(path: 'forms/generic_post'),
+      method: 'post',
+      childViews: ->(form) do
+        res.fields_text id: 'ftext', name: 'user[full_name]', value: 'John Doe', label: 'Full name', placeholder: 'Full name', width: 300
+        res.spacer height: 8
+        res.panels_horizontal childViews: ->(hori) do
+        res.button text: 'set', onClick: ->(action) do
+          action.components_set targetId: 'ftext', data: { name: 'user[city]', value: 'Taipei', label: 'City', placeholder: 'City' }
+        end
+        res.spacer width: 4
+        res.fields_submit text: 'submit'
+      end
+      end
+
+
+    res.spacer height: 16
+
+  end
+end

data/app/views/json_ui/garage/views/components_update.json.jbuilder

@@ -0,0 +1,148 @@
+json.title 'Component update'
+
+page = json_ui_page json
+
+render "#{@path_prefix}/nav_menu", json: json, page: page, top_nav: true
+
+panels_ids = {
+  'pres' => 'panels_responsive',
+  'pcol' => 'panels_column',
+  'phor' => 'panels_horizontal',
+  'pver' => 'panels_vertical',
+  'pflow' => 'panels_flow',
+  'psplit' => 'panels_split',
+}
+other_ids = {
+  'paragraph' => 'p',
+  'label' => 'label'
+}
+comp_ids = panels_ids.merge(other_ids)
+cities = [{ text: 'Bali', value: 'bali' }, { text: 'Jakarta', value: 'jakarta' }]
+
+small_image_url = 'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSGQpSWjtELISLBlmugOZ6wzl1JamYXQvbFeYywpfg3E8b8DrO0Kg&s'
+
+page.body padding: glib_json_padding_body, childViews: ->(body) do
+  body.panels_responsive width: 'matchParent', childViews: ->(res) do
+    res.panels_column lg: { cols: 3 }, childViews: ->(col) do
+      res.h3 text: 'Props changes'
+      res.spacer height: 8
+      res.panels_flow innerPadding: { top: 4, right: 4, bottom: 4, left: 4 }, childViews: ->(hori) do
+        hori.button text: 'change bgcolor', onClick: ->(action) do
+          action.runMultiple childActions: ->(saction) do
+            comp_ids.each do |id, method|
+            saction.components_update targetId: id, views: ->(view) do
+              if id == 'pflow'
+                view.public_send(method, { backgroundColor: '#00FFFF', innerPadding: { bottom: 0 } })
+              else
+                view.public_send(method, { backgroundColor: '#00FFFF' })
+              end
+            end
+          end
+          end
+        end
+
+        hori.button text: 'change text (p & label)', onClick: ->(action) do
+          action.runMultiple childActions: ->(saction) do
+            saction.components_update targetId: 'paragraph', views: ->(view) do
+              view.p text: 'changed!'
+            end
+            saction.components_update targetId: 'label', views: ->(view) do
+              view.label text: 'changed!'
+            end
+          end
+        end
+
+        hori.button text: 'Change fields text', onClick: ->(action) do
+          action.components_update targetId: 'inp-text', views: ->(view) do
+            view.fields_text name: 'user[city]', value: 'Jakarta', placeholder: 'City', label: 'City'
+          end
+        end
+
+        hori.button text: 'Change fields select', onClick: ->(action) do
+          action.components_update targetId: 'inp-select', views: ->(view) do
+            view.fields_select options: cities + [{ text: 'Taipei', value: 'taipei' }]
+          end
+        end
+      end
+      res.spacer height: 16
+      res.h3 text: 'Childviews changes'
+      res.spacer height: 8
+      res.panels_flow innerPadding: { top: 4, right: 4, bottom: 4, left: 4 }, childViews: ->(hori) do
+        hori.button text: 'Add child to panel', onClick: ->(action) do
+          action.runMultiple childActions: ->(saction) do
+            panels_ids.each do |id, method|
+            saction.components_update targetId: id, views: ->(view) do
+              props = {
+                childViews: ->(sview) do
+                  sview.label text: method
+                  sview.image url: small_image_url, width: 'matchParent', height: 'matchParent'
+                end
+              }
+              props.merge!({ innerPadding: { bottom: 0 } }) if id == 'pflow'
+              if id == 'psplit'
+                props.delete(:childViews)
+                props.merge({
+                  content: ->(split) do
+                    split.left childViews: ->(sview) do
+                      sview.label text: method
+                    end
+                    split.right childViews: ->(sview) do
+                      sview.image url: small_image_url, width: 'matchParent', height: 'matchParent'
+                    end
+                  end
+                })
+              end
+              view.public_send(method, props)
+            end
+          end
+          end
+        end
+      end
+      res.spacer height: 16
+    end
+
+    res.panels_column lg: { cols: 9 }, childViews: ->(col) do
+      col.panels_responsive id: 'pres', width: 200, childViews: ->(cview) do
+        cview.label text: 'Panels responsive'
+      end
+      col.spacer height: 4
+      col.panels_column id: 'pcol', lg: { cols: 6 }, childViews: ->(cview) do
+        cview.label text: 'Panels column'
+      end
+      col.spacer height: 4
+      col.panels_horizontal id: 'phor', width: 200, childViews: ->(cview) do
+        cview.label text: 'Panels horizontal'
+      end
+      col.spacer height: 4
+      col.panels_vertical id: 'pver', width: 200, childViews: ->(cview) do
+        cview.label text: 'Panels vertical'
+      end
+      col.spacer height: 4
+      col.panels_flow innerPadding: { bottom: 0 }, id: 'pflow', width: 200, childViews: ->(cview) do
+        cview.label text: 'Panels flow'
+      end
+      col.spacer height: 4
+      col.panels_split id: 'psplit', width: 200, content: ->(cview) do
+        cview.left childViews: ->(ccview) do
+          ccview.label text: 'Panels split (not supported)'
+        end
+      end
+      col.spacer height: 4
+      col.p id: 'paragraph', width: 500, text: 'In publishing and graphic design, Lorem ipsum is a placeholder text commonly used to demonstrate the visual form of a document or a typeface without relying on meaningful content.'
+      col.spacer height: 4
+      col.label id: 'label', text: 'birds flying'
+      col.spacer height: 8
+      col.panels_form \
+        url: json_ui_garage_url(path: 'forms/generic_post'),
+        method: 'post',
+        childViews: ->(form) do
+          col.fields_text id: 'inp-text', name: 'user[full_name]', width: 300, label: 'Full name', placeholder: 'Full name'
+          col.spacer height: 4
+
+          col.fields_select id: 'inp-select', options: cities, width: 300, name: 'user[city]'
+          col.spacer height: 4
+          col.fields_submit text: 'Submit'
+        end
+    end
+  end
+end

data/app/views/json_ui/garage/views/fields_focus.json.jbuilder

@@ -0,0 +1,47 @@
+json.title 'Field focus'
+
+page = json_ui_page json
+
+render "#{@path_prefix}/nav_menu", json: json, page: page, top_nav: true
+
+page.body padding: glib_json_padding_body, childViews: ->(body) do
+  body.panels_responsive width: 'matchParent', childViews: ->(res) do
+    res.panels_form \
+      url: json_ui_garage_url(path: 'forms/generic_post'),
+      method: 'post',
+      width: 300,
+      childViews: ->(form) do
+        res.fields_text id: 'first', name: 'user[full_name]', label: 'Full name', placeholder: 'Full name', width: 'matchParent'
+        res.spacer height: 8
+        res.fields_number id: 'second', name: 'user[age]', label: 'Age', placeholder: 'Age', width: 'matchParent'
+        res.spacer height: 4
+        res.panels_horizontal childViews: ->(hori) do
+          res.button text: 'focus1', onClick: ->(action) do
+            action.fields_focus targetId: 'first'
+          end
+          res.spacer width: 4
+          res.button text: 'focus2', onClick: ->(action) do
+            action.fields_focus targetId: 'second'
+          end
+          res.spacer width: 4
+          res.button text: 'blur', onClick: ->(action) do
+            action.fields_focus targetId: 'first', onFocus: ->(saction) do
+              saction.timeouts_set interval: 1000, onTimeout: ->(ssaction) { ssaction.fields_blur }
+            end
+          end
+          res.spacer width: 4
+          res.button text: 'reset', onClick: ->(action) do
+            action.fields_reset targetId: 'first', onReset: ->(saction) do
+              saction.snackbars_alert styleClasses: ['success'], message: 'Reset full name!'
+            end
+          end
+          res.spacer width: 4
+          res.fields_submit text: 'submit'
+        end
+      end
+
+
+    res.spacer height: 16
+
+  end
+end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: glib-web
 version: !ruby/object:Gem::Version
-  version: 3.24.3
+  version: 3.25.0
 platform: ruby
 authors:
 - ''
@@ -139,8 +139,11 @@ files:
 - app/validators/url_validator.rb
 - app/views/json_ui/garage/_nav_menu.json.jbuilder
 - app/views/json_ui/garage/actions/_commands.json.jbuilder
+- app/views/json_ui/garage/actions/_components.json.jbuilder
+- app/views/json_ui/garage/actions/_cookies.json.jbuilder
 - app/views/json_ui/garage/actions/_dialogs.json.jbuilder
 - app/views/json_ui/garage/actions/_dialogs_show.json.jbuilder
+- app/views/json_ui/garage/actions/_fields.json.jbuilder
 - app/views/json_ui/garage/actions/_http.json.jbuilder
 - app/views/json_ui/garage/actions/_list.json.jbuilder
 - app/views/json_ui/garage/actions/_panels.json.jbuilder
@@ -164,6 +167,9 @@ files:
 - app/views/json_ui/garage/forms/chip_group.json.jbuilder
 - app/views/json_ui/garage/forms/conditional_value.json.jbuilder
 - app/views/json_ui/garage/forms/dialogs_close.json.jbuilder
+- app/views/json_ui/garage/forms/dialogs_form.json.jbuilder
+- app/views/json_ui/garage/forms/dialogs_subform.json.jbuilder
+- app/views/json_ui/garage/forms/dialogs_subform_post.json.jbuilder
 - app/views/json_ui/garage/forms/dialogs_update.json.jbuilder
 - app/views/json_ui/garage/forms/dialogs_update2.json.jbuilder
 - app/views/json_ui/garage/forms/dialogs_update3.json.jbuilder
@@ -264,7 +270,10 @@ files:
 - app/views/json_ui/garage/views/banners.json.jbuilder
 - app/views/json_ui/garage/views/calendar_data.json.jbuilder
 - app/views/json_ui/garage/views/charts.json.jbuilder
+- app/views/json_ui/garage/views/components_set.json.jbuilder
+- app/views/json_ui/garage/views/components_update.json.jbuilder
 - app/views/json_ui/garage/views/controls.json.jbuilder
+- app/views/json_ui/garage/views/fields_focus.json.jbuilder
 - app/views/json_ui/garage/views/iap.json.jbuilder
 - app/views/json_ui/garage/views/icon_names.json.jbuilder
 - app/views/json_ui/garage/views/icons.json.jbuilder