glib-web 6.12.0 → 7.0.0.beta1

data/app/views/json_ui/garage/test_page/fields_sign.json.jbuilder

@@ -1,8 +1,5 @@
 json.title 'Test Page (Fields Sign)'
 
-# 60x20 ink stand-in used by the pre-filled examples.
-preview_data_uri = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAAUCAYAAADRA14pAAAAoklEQVR4nO2XUQrAIAxDcwjvf9WNfQzG1NFqUt1mwL8a8hBtxfYzYXSAaC1glVJK2RohOXAJdCS4FNgCGw0tA7YAjQCXAHsBoqAPbzpwa3A19OkLpjkjsAL66gmWOTOo0gtvOJXe/VcP9JpH3DvmewBLkdeUKfaLD09xqSaid7bkqilrS57pKHJCYmWq9uFZQD2ZLLkeB49ZQO/qybX+w1/XDujJvn2bufeCAAAAAElFTkSuQmCC'
-
 page = json_ui_page json
 
 render 'json_ui/garage/test_page/header', json: json, page: page
@@ -28,11 +25,6 @@ page.body(
             form.fields_sign(
               id: 'signature_main',
               name: 'user[signature]',
-              label: 'Your signature',
-              # Single-param contract: the typed name is submitted through the
-              # field's own param, so typedName carries only the input's
-              # decoration and pre-filled value.
-              typedName: { label: 'Type your full name', placeholder: 'Full name' },
               directUploadUrl: glib_direct_uploads_url,
               width: 320,
               height: 160,
@@ -55,21 +47,21 @@ page.body(
                 flow.button(
                   text: 'Large (480x220)',
                   onClick: ->(action) do
-                    action.components_set targetId: 'signature_main', data: { width: 480, height: 220 }
+                    action.logics_set targetId: 'signature_main', data: { width: 480, height: 220 }
                   end
                 )
                 flow.spacer width: 8
                 flow.button(
                   text: 'Compact (260x120)',
                   onClick: ->(action) do
-                    action.components_set targetId: 'signature_main', data: { width: 260, height: 120 }
+                    action.logics_set targetId: 'signature_main', data: { width: 260, height: 120 }
                   end
                 )
                 flow.spacer width: 8
                 flow.button(
                   text: 'Required',
                   onClick: ->(action) do
-                    action.components_set targetId: 'signature_main',
+                    action.logics_set targetId: 'signature_main',
                       data: { validation: { required: { message: 'signature is required' } } }
                   end
                 )
@@ -77,21 +69,21 @@ page.body(
                 flow.button(
                   text: 'Optional',
                   onClick: ->(action) do
-                    action.components_set targetId: 'signature_main', data: { validation: nil }
+                    action.logics_set targetId: 'signature_main', data: { validation: nil }
                   end
                 )
                 flow.spacer width: 8
                 flow.button(
                   text: 'Disable',
                   onClick: ->(action) do
-                    action.components_set targetId: 'signature_main', data: { disabled: true }
+                    action.logics_set targetId: 'signature_main', data: { disabled: true }
                   end
                 )
                 flow.spacer width: 8
                 flow.button(
                   text: 'Enable',
                   onClick: ->(action) do
-                    action.components_set targetId: 'signature_main', data: { disabled: nil }
+                    action.logics_set targetId: 'signature_main', data: { disabled: nil }
                   end
                 )
               end
@@ -121,7 +113,7 @@ page.body(
                   text: 'Clear value',
                   onClick: ->(action) do
                     action.runMultiple childActions: ->(multiple) do
-                      multiple.components_set targetId: 'signature_main', data: { value: '' }
+                      multiple.logics_set targetId: 'signature_main', data: { value: nil }
                       multiple.logics_set targetId: 'signature_status', data: { text: 'Status: cleared' }
                     end
                   end
@@ -145,7 +137,7 @@ page.body(
 
             form.h2 text: 'Edge/advanced'
             form.spacer height: 8
-            form.label text: 'A small, draw-only slot (no typedName, so the dialog has no tabs).'
+            form.label text: 'Use a small canvas to test tighter layouts.'
             form.spacer height: 8
             form.fields_sign(
               id: 'signature_compact',
@@ -154,46 +146,6 @@ page.body(
               width: 220,
               height: 100
             )
-
-            form.spacer height: 12
-            form.hr width: 'matchParent'
-            form.spacer height: 12
-
-            form.h2 text: 'Pre-filled (re-edit)'
-            form.spacer height: 8
-            form.label text: 'A saved signature: value carries the signed id, fileUrl renders the preview.'
-            form.spacer height: 8
-            form.fields_sign(
-              id: 'signature_prefilled',
-              name: 'user[signature_prefilled]',
-              # A stand-in for the signed id the Sign builder derives from
-              # `prop:` on a re-edit (see Sign#determine_value).
-              value: 'prefilled-signed-id',
-              fileUrl: preview_data_uri,
-              typedName: { label: 'Type your full name', placeholder: 'Full name' },
-              directUploadUrl: glib_direct_uploads_url,
-              width: 320,
-              height: 160
-            )
-
-            form.spacer height: 12
-            form.hr width: 'matchParent'
-            form.spacer height: 12
-
-            form.h2 text: 'Read-only (pre-filled)'
-            form.spacer height: 8
-            form.label text: 'A saved signature on a read-only field: the preview shows, the edit overlay does not.'
-            form.spacer height: 8
-            form.fields_sign(
-              id: 'signature_readonly',
-              name: 'user[signature_readonly]',
-              value: 'readonly-signed-id',
-              fileUrl: preview_data_uri,
-              directUploadUrl: glib_direct_uploads_url,
-              width: 320,
-              height: 160,
-              readOnly: true
-            )
           end
         )
       end

data/app/views/json_ui/garage/test_page/fields_stripeExternalAccount.json.jbuilder

@@ -60,7 +60,7 @@ page.body(
             #     flow.button(
             #       text: 'Individual (AU/AUD)',
             #       onClick: ->(action) do
-            #         action.components_set(
+            #         action.logics_set(
             #           targetId: 'stripe_external_basic',
             #           data: {
             #             accountHolderName: 'John Doe',
@@ -75,7 +75,7 @@ page.body(
             #     flow.button(
             #       text: 'Company (US/USD)',
             #       onClick: ->(action) do
-            #         action.components_set(
+            #         action.logics_set(
             #           targetId: 'stripe_external_basic',
             #           data: {
             #             accountHolderName: 'Acme Corp',
@@ -90,7 +90,7 @@ page.body(
             #     flow.button(
             #       text: 'Company (GB/GBP)',
             #       onClick: ->(action) do
-            #         action.components_set(
+            #         action.logics_set(
             #           targetId: 'stripe_external_basic',
             #           data: {
             #             accountHolderName: 'London Ltd',
@@ -117,21 +117,21 @@ page.body(
             #     flow.button(
             #       text: 'Disable field',
             #       onClick: ->(action) do
-            #         action.components_set targetId: 'stripe_external_basic', data: { disabled: true }
+            #         action.logics_set targetId: 'stripe_external_basic', data: { disabled: true }
             #       end
             #     )
             #     flow.spacer width: 8
             #     flow.button(
             #       text: 'Enable field',
             #       onClick: ->(action) do
-            #         action.components_set targetId: 'stripe_external_basic', data: { disabled: nil }
+            #         action.logics_set targetId: 'stripe_external_basic', data: { disabled: nil }
             #       end
             #     )
             #     flow.spacer width: 8
             #     flow.button(
             #       text: 'Reset label',
             #       onClick: ->(action) do
-            #         action.components_set targetId: 'stripe_external_basic', data: { label: 'Bank account' }
+            #         action.logics_set targetId: 'stripe_external_basic', data: { label: 'Bank account' }
             #       end
             #     )
             #   end

data/app/views/json_ui/garage/test_page/fields_stripeToken.json.jbuilder

@@ -56,21 +56,21 @@ page.body(
                 flow.button(
                   text: 'Default style',
                   onClick: ->(action) do
-                    action.components_set targetId: 'stripe_token_basic', data: { styleClass: nil, label: 'Card details', hint: nil }
+                    action.logics_set targetId: 'stripe_token_basic', data: { styleClass: nil, label: 'Card details', hint: nil }
                   end
                 )
                 flow.spacer width: 8
                 flow.button(
                   text: 'Outlined',
                   onClick: ->(action) do
-                    action.components_set targetId: 'stripe_token_basic', data: { styleClass: 'outlined', label: 'Card details', hint: nil }
+                    action.logics_set targetId: 'stripe_token_basic', data: { styleClass: 'outlined', label: 'Card details', hint: nil }
                   end
                 )
                 flow.spacer width: 8
                 flow.button(
                   text: 'Individual',
                   onClick: ->(action) do
-                    action.components_set targetId: 'stripe_token_basic', data: { styleClass: 'individual', label: 'Card details', hint: 'Personal card' }
+                    action.logics_set targetId: 'stripe_token_basic', data: { styleClass: 'individual', label: 'Card details', hint: 'Personal card' }
                   end
                 )
               end
@@ -89,21 +89,21 @@ page.body(
             #     flow.button(
             #       text: 'Disable field',
             #       onClick: ->(action) do
-            #         action.components_set targetId: 'stripe_token_basic', data: { disabled: true }
+            #         action.logics_set targetId: 'stripe_token_basic', data: { disabled: true }
             #       end
             #     )
             #     flow.spacer width: 8
             #     flow.button(
             #       text: 'Enable field',
             #       onClick: ->(action) do
-            #         action.components_set targetId: 'stripe_token_basic', data: { disabled: nil }
+            #         action.logics_set targetId: 'stripe_token_basic', data: { disabled: nil }
             #       end
             #     )
             #     flow.spacer width: 8
             #     flow.button(
             #       text: 'Clear hint',
             #       onClick: ->(action) do
-            #         action.components_set targetId: 'stripe_token_basic', data: { hint: nil }
+            #         action.logics_set targetId: 'stripe_token_basic', data: { hint: nil }
             #       end
             #     )
             #   end

data/app/views/json_ui/garage/test_page/fields_text.json.jbuilder

@@ -159,7 +159,7 @@ page.body(
             # ── Actions/events ────────────────────────────────────────────────
             form.h2 text: 'Actions/events'
             form.spacer height: 8
-            form.label text: 'Buttons target the basic fields_text field (id: text_main) via components_set and fields_focus.'
+            form.label text: 'Buttons target the basic fields_text field (id: text_main) via logics_set and fields_focus.'
             form.spacer height: 8
             form.panels_flow(
               innerPadding: { bottom: 0 },
@@ -170,7 +170,7 @@ page.body(
                   onClick: ->(action) do
                     action.runMultiple(
                       childActions: ->(multi) do
-                        multi.components_set targetId: 'text_main', data: { value: 'Hello world' }
+                        multi.logics_set targetId: 'text_main', data: { value: 'Hello world' }
                         multi.logics_set targetId: 'text_status', data: { text: 'Status: value set' }
                       end
                     )
@@ -182,7 +182,7 @@ page.body(
                   onClick: ->(action) do
                     action.runMultiple(
                       childActions: ->(multi) do
-                        multi.components_set targetId: 'text_main', data: { value: '' }
+                        multi.logics_set targetId: 'text_main', data: { value: '' }
                         multi.logics_set targetId: 'text_status', data: { text: 'Status: cleared' }
                       end
                     )
@@ -227,14 +227,14 @@ page.body(
                 flow.button(
                   text: 'Disable',
                   onClick: ->(action) do
-                    action.components_set targetId: 'text_disabled', data: { disabled: true }
+                    action.logics_set targetId: 'text_disabled', data: { disabled: true }
                   end
                 )
                 flow.spacer width: 8
                 flow.button(
                   text: 'Enable',
                   onClick: ->(action) do
-                    action.components_set targetId: 'text_disabled', data: { disabled: nil }
+                    action.logics_set targetId: 'text_disabled', data: { disabled: nil }
                   end
                 )
               end

data/app/views/json_ui/garage/test_page/fields_timer.json.jbuilder

@@ -75,14 +75,14 @@ page.body(
                 flow.button(
                   text: 'Set 2 minutes',
                   onClick: ->(action) do
-                    action.components_set targetId: 'timer_basic', data: { value: 120 }
+                    action.logics_set targetId: 'timer_basic', data: { value: 120 }
                   end
                 )
                 flow.spacer width: 8
                 flow.button(
                   text: 'Set 45 seconds',
                   onClick: ->(action) do
-                    action.components_set targetId: 'timer_basic', data: { value: 45 }
+                    action.logics_set targetId: 'timer_basic', data: { value: 45 }
                   end
                 )
                 flow.spacer width: 8
@@ -90,7 +90,7 @@ page.body(
                   text: 'Swap to stopwatch',
                   onClick: ->(action) do
                     action.runMultiple childActions: ->(multiple) do
-                      multiple.components_set targetId: 'timer_basic', data: { value: 5, min: nil, max: 30, forward: true }
+                      multiple.logics_set targetId: 'timer_basic', data: { value: 5, min: nil, max: 30, forward: true }
                       multiple.logics_set targetId: 'timer_status', data: { text: 'Status: forward (max 30s)' }
                     end
                   end
@@ -122,21 +122,21 @@ page.body(
                 flow.button(
                   text: 'Set 2s (below min)',
                   onClick: ->(action) do
-                    action.components_set targetId: 'timer_limits', data: { value: 2 }
+                    action.logics_set targetId: 'timer_limits', data: { value: 2 }
                   end
                 )
                 flow.spacer width: 8
                 flow.button(
                   text: 'Set 7s',
                   onClick: ->(action) do
-                    action.components_set targetId: 'timer_limits', data: { value: 7 }
+                    action.logics_set targetId: 'timer_limits', data: { value: 7 }
                   end
                 )
                 flow.spacer width: 8
                 flow.button(
                   text: 'Set 15s (above max)',
                   onClick: ->(action) do
-                    action.components_set targetId: 'timer_limits', data: { value: 15 }
+                    action.logics_set targetId: 'timer_limits', data: { value: 15 }
                   end
                 )
               end

data/app/views/json_ui/garage/test_page/flow.json.jbuilder

@@ -28,19 +28,19 @@ page.body childViews: ->(body) do
     res.spacer height: 8
     res.panels_flow innerPadding: { bottom: 0 }, childViews: ->(flow) do
       flow.button text: 'Tight gap', onClick: ->(action) do
-        action.components_set targetId: 'flow_main', data: { innerPadding: { x: 2, y: 2 } }
+        action.logics_set targetId: 'flow_main', data: { innerPadding: { x: 2, y: 2 } }
       end
       flow.spacer width: 4
       flow.button text: 'Loose gap', onClick: ->(action) do
-        action.components_set targetId: 'flow_main', data: { innerPadding: { x: 12, y: 12 } }
+        action.logics_set targetId: 'flow_main', data: { innerPadding: { x: 12, y: 12 } }
       end
       flow.spacer width: 4
       flow.button text: 'Align middle', onClick: ->(action) do
-        action.components_set targetId: 'flow_main', data: { align: 'middle' }
+        action.logics_set targetId: 'flow_main', data: { align: 'middle' }
       end
       flow.spacer width: 4
       flow.button text: 'Align bottom', onClick: ->(action) do
-        action.components_set targetId: 'flow_main', data: { align: 'bottom' }
+        action.logics_set targetId: 'flow_main', data: { align: 'bottom' }
       end
     end
 
@@ -52,9 +52,9 @@ page.body childViews: ->(body) do
     res.label id: 'flow_action_status', text: 'Hover status: idle'
     res.spacer height: 6
     res.panels_flow width: 200, innerPadding: { x: 6, y: 6 }, backgroundColor: '#e6e6e6', onMouseEnter: ->(action) do
-      action.components_set targetId: 'flow_action_status', data: { text: 'Hover status: entered' }
+      action.logics_set targetId: 'flow_action_status', data: { text: 'Hover status: entered' }
     end, onMouseLeave: ->(action) do
-      action.components_set targetId: 'flow_action_status', data: { text: 'Hover status: left' }
+      action.logics_set targetId: 'flow_action_status', data: { text: 'Hover status: left' }
     end, childViews: ->(flow) do
       flow.label text: 'Hover this panel'
     end

data/app/views/json_ui/garage/test_page/form.json.jbuilder

@@ -14,14 +14,14 @@ page.body childViews: ->(body) do
       method: 'post',
       childViews: ->(form) do
         form.panels_flow innerPadding: { bottom: 0 }, width: 'matchParent', childViews: ->(hori) do
-          hori.button text: 'components/set', onClick: ->(action) do
+          hori.button text: 'logics/set', onClick: ->(action) do
             action.runMultiple childActions: ->(saction) do
-              saction.components_set targetId: 'textarea', data: { value: 'The quick brown fox jumps over the lazy dog' }
+              saction.logics_set targetId: 'textarea', data: { value: 'The quick brown fox jumps over the lazy dog' }
               new_options = [{ text: 'Option99', value: 'option99' }]
 
-              saction.components_set targetId: 'select', data: { options: new_options, value: 'option99' }
+              saction.logics_set targetId: 'select', data: { options: new_options, value: 'option99' }
 
-              saction.components_set targetId: 'chip_group', data: { options: new_options, value: 0 }
+              saction.logics_set targetId: 'chip_group', data: { options: new_options, value: 0 }
             end
           end
           hori.spacer width: 4
@@ -48,22 +48,22 @@ page.body childViews: ->(body) do
           hori.button text: 'hide select', onClick: ->(action) do
             action.runMultiple childActions: ->(saction) do
               ['select', 'select1', 'select2', 'select3'].each do |id|
-                saction.components_set targetId: id, data: { displayed: false }
+                saction.logics_set targetId: id, data: { displayed: false }
               end
             end
           end
           hori.spacer height: 4
           hori.button text: 'hide jack', onClick: ->(action) do
             action.runMultiple childActions: ->(saction) do
-              saction.components_set targetId: 'ver', data: { displayed: true }
-              saction.components_set targetId: 'ver1', data: { displayed: false }
+              saction.logics_set targetId: 'ver', data: { displayed: true }
+              saction.logics_set targetId: 'ver1', data: { displayed: false }
             end
           end
           hori.spacer height: 4
           hori.button text: 'show jack', onClick: ->(action) do
             action.runMultiple childActions: ->(saction) do
-              saction.components_set targetId: 'ver', data: { displayed: false }
-              saction.components_set targetId: 'ver1', data: { displayed: true }
+              saction.logics_set targetId: 'ver', data: { displayed: false }
+              saction.logics_set targetId: 'ver1', data: { displayed: true }
             end
           end
         end

data/app/views/json_ui/garage/test_page/grid.json.jbuilder

@@ -30,11 +30,11 @@ page.body childViews: ->(body) do
     res.spacer height: 8
     res.panels_flow innerPadding: { bottom: 0 }, childViews: ->(flow) do
       flow.button text: 'Small boxes', onClick: ->(action) do
-        action.components_set targetId: 'grid_main', data: { boxMinWidth: 100, columnGap: 8, rowGap: 8 }
+        action.logics_set targetId: 'grid_main', data: { boxMinWidth: 100, columnGap: 8, rowGap: 8 }
       end
       flow.spacer width: 4
       flow.button text: 'Large boxes', onClick: ->(action) do
-        action.components_set targetId: 'grid_main', data: { boxMinWidth: 180, columnGap: 16, rowGap: 16 }
+        action.logics_set targetId: 'grid_main', data: { boxMinWidth: 180, columnGap: 16, rowGap: 16 }
       end
     end
 
@@ -46,9 +46,9 @@ page.body childViews: ->(body) do
     res.label id: 'grid_action_status', text: 'Hover status: idle'
     res.spacer height: 6
     res.panels_grid width: 'matchParent', boxMinWidth: 120, columnGap: 8, rowGap: 8, onMouseEnter: ->(action) do
-      action.components_set targetId: 'grid_action_status', data: { text: 'Hover status: entered' }
+      action.logics_set targetId: 'grid_action_status', data: { text: 'Hover status: entered' }
     end, onMouseLeave: ->(action) do
-      action.components_set targetId: 'grid_action_status', data: { text: 'Hover status: left' }
+      action.logics_set targetId: 'grid_action_status', data: { text: 'Hover status: left' }
     end, childViews: ->(box) do
       (1..4).each do |index|
         box.panels_vertical height: 50, backgroundColor: '#e6e6e6', align: 'center', childViews: ->(panel) do

data/app/views/json_ui/garage/test_page/horizontal.json.jbuilder

@@ -28,19 +28,19 @@ page.body childViews: ->(body) do
     res.spacer height: 8
     res.panels_flow innerPadding: { bottom: 0 }, childViews: ->(flow) do
       flow.button text: 'Fill equally', onClick: ->(action) do
-        action.components_set targetId: 'horizontal_main', data: { width: 300, distribution: 'fillEqually' }
+        action.logics_set targetId: 'horizontal_main', data: { width: 300, distribution: 'fillEqually' }
       end
       flow.spacer width: 4
       flow.button text: 'Space equally', onClick: ->(action) do
-        action.components_set targetId: 'horizontal_main', data: { width: 300, distribution: 'spaceEqually' }
+        action.logics_set targetId: 'horizontal_main', data: { width: 300, distribution: 'spaceEqually' }
       end
       flow.spacer width: 4
       flow.button text: 'Overlap 3', onClick: ->(action) do
-        action.components_set targetId: 'horizontal_main', data: { distribution: 'overlap-3' }
+        action.logics_set targetId: 'horizontal_main', data: { distribution: 'overlap-3' }
       end
       flow.spacer width: 4
       flow.button text: 'Align middle', onClick: ->(action) do
-        action.components_set targetId: 'horizontal_main', data: { align: 'middle' }
+        action.logics_set targetId: 'horizontal_main', data: { align: 'middle' }
       end
     end
 
@@ -52,7 +52,7 @@ page.body childViews: ->(body) do
     res.label id: 'horizontal_action_status', text: 'Click status: idle'
     res.spacer height: 6
     res.panels_horizontal width: 180, height: 60, align: 'middle', backgroundColor: '#e6e6e6', onClick: ->(action) do
-      action.components_set targetId: 'horizontal_action_status', data: { text: 'Click status: clicked' }
+      action.logics_set targetId: 'horizontal_action_status', data: { text: 'Click status: clicked' }
     end, childViews: ->(panel) do
       panel.label text: 'Click panel'
     end

data/app/views/json_ui/garage/test_page/image.json.jbuilder

@@ -44,7 +44,7 @@ page.body(
             flow.button(
               text: 'Default',
               onClick: ->(action) do
-                action.components_set(
+                action.logics_set(
                   targetId: 'image_main',
                   data: {
                   width: 320,
@@ -61,7 +61,7 @@ page.body(
             flow.button(
               text: 'Crop square',
               onClick: ->(action) do
-                action.components_set(
+                action.logics_set(
                   targetId: 'image_main',
                   data: { width: 160, height: 160, url: small_image_url, fit: :crop }
                 )
@@ -71,7 +71,7 @@ page.body(
             flow.button(
               text: 'Full width',
               onClick: ->(action) do
-                action.components_set(
+                action.logics_set(
                   targetId: 'image_main',
                   data: { width: 'matchParent', height: 220, url: glib_json_image_standard_url, fit: :clip }
                 )
@@ -81,7 +81,7 @@ page.body(
             flow.button(
               text: 'Tall crop',
               onClick: ->(action) do
-                action.components_set(
+                action.logics_set(
                   targetId: 'image_main',
                   data: { width: 200, height: 320, url: glib_json_image_standard_url, fit: :crop }
                 )
@@ -91,7 +91,7 @@ page.body(
             flow.button(
               text: 'Height clip',
               onClick: ->(action) do
-                action.components_set(
+                action.logics_set(
                   targetId: 'image_main',
                   data: { width: nil, height: 200, url: glib_json_image_standard_url, fit: :clip }
                 )
@@ -101,7 +101,7 @@ page.body(
             flow.button(
               text: 'Height crop',
               onClick: ->(action) do
-                action.components_set(
+                action.logics_set(
                   targetId: 'image_main',
                   data: { width: nil, height: 160, url: small_image_url, fit: :crop }
                 )
@@ -123,7 +123,7 @@ page.body(
             flow.button(
               text: 'Show badge',
               onClick: ->(action) do
-                action.components_set(
+                action.logics_set(
                   targetId: 'image_main',
                   data: { badge: { text: '3', backgroundColor: '#2B3A67' } }
                 )
@@ -145,7 +145,7 @@ page.body(
             flow.button(
               text: 'Tiny thumbnail',
               onClick: ->(action) do
-                action.components_set(
+                action.logics_set(
                   targetId: 'image_main',
                   data: { width: 64, height: 64, url: small_image_url, fit: :crop }
                 )
@@ -155,7 +155,7 @@ page.body(
             flow.button(
               text: 'Restore size',
               onClick: ->(action) do
-                action.components_set(
+                action.logics_set(
                   targetId: 'image_main',
                   data: { width: 320, height: 200, url: glib_json_image_standard_url, fit: :clip }
                 )

data/app/views/json_ui/garage/test_page/lifecycle.json.jbuilder

@@ -23,10 +23,10 @@ page.body childViews: ->(body) do
       id: 'button',
       text: 'you should not see this',
       onLoad: ->(action) do
-        action.components_set targetId: 'button', data: { text: 'onLoad' }
+        action.logics_set targetId: 'button', data: { text: 'onLoad' }
       end,
       onRerender: ->(action) do
-        action.components_set targetId: 'button', data: { text: 'onRerender' }
+        action.logics_set targetId: 'button', data: { text: 'onRerender' }
       end
     res.spacer height: 8
     res.chip \
@@ -34,22 +34,22 @@ page.body childViews: ->(body) do
       text: 'hover me',
       tooltip: { text: 'you should not see this' },
       onLoad: ->(action) do
-        action.components_set targetId: 'chip', data: { 'tooltip.text' => 'onLoad' }
+        action.logics_set targetId: 'chip', data: { 'tooltip.text' => 'onLoad' }
       end,
       onRerender: ->(action) do
-        action.components_set targetId: 'chip', data: { 'tooltip.text' => 'onRerender' }
+        action.logics_set targetId: 'chip', data: { 'tooltip.text' => 'onRerender' }
       end
     res.spacer height: 8
     res.icon \
       id: 'icon',
       name: 'autorenew',
       onLoad: ->(action) do
-        action.components_set targetId: 'icon', data: {
+        action.logics_set targetId: 'icon', data: {
           'material.name' => 'home'
         }
       end,
       onRerender: ->(action) do
-        action.components_set targetId: 'icon', data: {
+        action.logics_set targetId: 'icon', data: {
           'material.name' => 'person'
         }
       end

data/app/views/json_ui/garage/test_page/list.json.jbuilder

@@ -37,28 +37,28 @@ page.body(
             flow.button(
               text: 'One column',
               onClick: ->(action) do
-                action.components_set targetId: 'list_main', data: { responsiveCols: 1 }
+                action.logics_set targetId: 'list_main', data: { responsiveCols: 1 }
               end
             )
             flow.spacer width: 4
             flow.button(
               text: 'Three columns',
               onClick: ->(action) do
-                action.components_set targetId: 'list_main', data: { responsiveCols: 3 }
+                action.logics_set targetId: 'list_main', data: { responsiveCols: 3 }
               end
             )
             flow.spacer width: 4
             flow.button(
               text: 'Card style',
               onClick: ->(action) do
-                action.components_set targetId: 'list_main', data: { styleClasses: ['card'], padding: glib_json_padding_list }
+                action.logics_set targetId: 'list_main', data: { styleClasses: ['card'], padding: glib_json_padding_list }
               end
             )
             flow.spacer width: 4
             flow.button(
               text: 'Clear style',
               onClick: ->(action) do
-                action.components_set targetId: 'list_main', data: { styleClasses: nil, padding: nil }
+                action.logics_set targetId: 'list_main', data: { styleClasses: nil, padding: nil }
               end
             )
           end
@@ -73,10 +73,10 @@ page.body(
           id: 'list_events',
           height: 180,
           onScrollToTop: ->(action) do
-            action.components_set targetId: 'list_event_status', data: { text: 'Scroll events: top reached' }
+            action.logics_set targetId: 'list_event_status', data: { text: 'Scroll events: top reached' }
           end,
           onScrollToBottom: ->(action) do
-            action.components_set targetId: 'list_event_status', data: { text: 'Scroll events: bottom reached' }
+            action.logics_set targetId: 'list_event_status', data: { text: 'Scroll events: bottom reached' }
           end,
           firstSection: ->(section) do
             section.rows(