glib-web 4.3.0 → 4.4.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 414da1c14521998494a3274989ed77b5db19a4bea80d386aee773aefb3af390d
-  data.tar.gz: a1b803901c4c2da2c7dc618905c3b5d05c995dffc02cfd84f69be2826d0326af
+  metadata.gz: 73e075cfe5041ccb4a1f0f6836a9fb5fe294fff00698ad0974a1ef70e34d8bb8
+  data.tar.gz: 5ebb6ca2859d77329531ebec64019f655da409adc0a617c6567be6ef3acf9c88
 SHA512:
-  metadata.gz: 17ca569d203c3b13bcae9f666e04693e0dd0a38f31c785be4d9d62d405568db41532c1a5229ef5892d37a1e9d7f21047593798b396d8f3286584d88e5f9e5edf
-  data.tar.gz: b9a6f5a64dac552532c2152ce28d1db7365e8a32bd71a6d1547f2d712baa84975fa9a594227f0874d0cc8bde6d1f4bc03d23ac72bf8558a3d790ea287379c948
+  metadata.gz: 6dc692a9e877c4686fb64600813c1b14e6c9926a69a2d9ffaf0c65cb7ac7a48976ad727eea965c024694e79f5b2af9ae945bb013e02f68d0d434fe57f1bb2640
+  data.tar.gz: 6e8a5f227bc198f957372c7de511f8e5b65d197419f3bc6a2e461cf894f6c26e3dbfab25859b0b76b22775186f8ed2106d58d309bfc1118ee68c9f33186389e0

data/app/controllers/glib/glib_direct_uploads_controller.rb

@@ -1,5 +1,5 @@
 module Glib
-  class GlibDirectUploadsController < ::ActiveStorage::DirectUploadsController
+  class GlibDirectUploadsController < ::ActionController::Base
     before_action :authenticate_user!
 
     rescue_from StandardError do |e|

data/app/controllers/glib/home_controller.rb

@@ -35,6 +35,11 @@ module Glib
         .ma-2 {
           margin: 8px;
         }
+
+        .align-right {
+          display: flex;
+          flex-direction: row-reverse;
+        }
         </style>
       eos
 

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

@@ -287,7 +287,7 @@ module Glib
             optional = options[:optional] || []
 
             required.each do |req|
-              raise ArgumentError, "Hash property: '#{req}' is requred" if value[req.to_s].blank?
+              raise ArgumentError, "Hash property: '#{req}' is required" if value[req.to_s].blank?
             end
 
             if optional.present?

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

@@ -0,0 +1,12 @@
+class Glib::JsonUi::ActionBuilder
+  # FUTURE
+  module Browsers
+    class DetectCountry < Action
+      action :onDetect
+    end
+
+    class DetectTimeZoe < Action
+      action :onDetect
+    end
+  end
+end

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

@@ -13,5 +13,11 @@ class Glib::JsonUi::ActionBuilder
       string :targetId
       action :onReset
     end
+
+
+    class GetDynamicGroupEntryValues < Action
+      array :names
+      action :onGet
+    end
   end
 end

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

@@ -7,6 +7,8 @@ class Glib::JsonUi::ActionBuilder
       hash :data
       hash :variables
       action :onSet
+      bool :cacheData
+      bool :debug
 
       def dataBuilder(block)
         json.data do
@@ -15,6 +17,13 @@ class Glib::JsonUi::ActionBuilder
       end
     end
 
+    class Run < Action
+      hash :condition
+      hash :variables
+      action :onTrue
+      action :onFalse
+    end
+
     # Under consideration, likely not a good idea.
     # class Append < Action
     #   string :targetId

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

@@ -0,0 +1,23 @@
+class Glib::JsonUi::ActionBuilder
+  # FUTURE
+  module StorageItems
+    class Set < Action
+      string :key
+      string :value
+      action :onSet
+    end
+
+    class Get < Action
+      string :key
+      action :onGet
+    end
+
+    class Remove < Action
+      action :onRemove
+    end
+
+    class Clear < Action
+      action :onClear
+    end
+  end
+end

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

@@ -157,24 +157,6 @@ module Glib
         # class Clear < Action
         # end
       end
-
-      # FUTURE
-
-      module Data
-        class Save < Action
-          string :key
-          string :value
-          action :onSave
-        end
-
-        class Remove < Action
-        end
-
-        class Clear < Action
-        end
-      end
-
-      ###
     end
   end
 end

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

@@ -8,7 +8,7 @@ module Glib
       class MenuItem < JsonUiElement
         include Builder::MouseEvents
 
-        hash :analytics
+        hash :analytics, optional: [:featured, :disabled]
       end
 
       class Button < MenuItem

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

@@ -43,8 +43,9 @@ class Glib::JsonUi::ViewBuilder
         string :suffix
         int :min
         int :max
-        hash :legend
-        hash :plugins
+        # https://www.chartjs.org/docs/latest/configuration/legend.html
+        hash :legend, optional: [:position, :align, :display, :maxHeight, :maxWidth, :fullSize, :reverse, :labels, :rtl, :title]
+        hash :plugins, optional: [:datalabels, :centerLabel, :customTooltip]
       end
     end
 

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

@@ -6,7 +6,6 @@ class Glib::JsonUi::ViewBuilder
 
       bool :readOnly
       bool :disabled
-      hash :validation
       bool :disableDirtyCheck
       action :onChange
       action :onChangeAndLoad
@@ -17,6 +16,16 @@ class Glib::JsonUi::ViewBuilder
         { only_path: true }
       end
 
+      def validation(validation)
+        return if validation.blank?
+
+        if validation[:format].present?
+          context.cast_to_js_regex(validation[:format])
+        end
+
+        json.validation validation
+      end
+
       def label(label)
         @label = label
       end
@@ -127,7 +136,7 @@ class Glib::JsonUi::ViewBuilder
     end
 
     class Timer < Text
-      hash :actionCable
+      # hash :actionCable
       int :min
       int :max
       bool :forward
@@ -168,7 +177,7 @@ class Glib::JsonUi::ViewBuilder
 
     class RichText < Text
       array :images
-      hash :imageUploader
+      hash :imageUploader, required: [:name], optional: [:accepts, :directUploadUrl]
       # `html` or `markdown`
       string :produce
       string :accept
@@ -180,7 +189,7 @@ class Glib::JsonUi::ViewBuilder
       # bool :readOnly
       bool :multiple, cache: true
       # bool :manualEntry
-      hash :append
+      hash :append, optional: [:icon]
 
       panels_builder :accessory, :header, :footer
     end
@@ -269,16 +278,14 @@ class Glib::JsonUi::ViewBuilder
       # file_rules = { fileType: 'image/*', maxFileSize: 5000 }
       # file_rules = { fileType: 'video/*', maxFileSize: 50000 }
       # file_rules = { fileType: 'application/pdf', maxFileSize: 5000 }
-      hash :accepts
 
-      string :directUploadUrl
+      include Glib::JsonUi::Upload
+
       string :fileUrl
       string :fileTitle
       string :uploadText
-      hash :placeholderView
-      hash :infoSpec
-      string :storagePrefix
-      hash :metadata
+      hash :placeholderView # deprecated
+      hash :infoSpec # deprecated
 
       def buttonLabels(obj)
         @buttonLabels = ActiveSupport::HashWithIndifferentAccess.new(obj)
@@ -314,23 +321,14 @@ class Glib::JsonUi::ViewBuilder
 
     class MultiUpload < AbstractField
       include Glib::JsonUi::Default
+      include Glib::JsonUi::Upload
 
-      # hash :accepts
       array :files
-      string :directUploadUrl
       string :uploadTitle
       action :onFinishUpload
-      string :strategy # can be "delegate" or "dropUpload"
       string :url # http post end point if you don't want to use onFinishUpload
-
-      string :storagePrefix
-      hash :metadata
-      string :tagging
-      hash :tags
-
       required :accepts, :directUploadUrl
 
-
       def accepts(value)
         @accepts = value
       end
@@ -378,7 +376,6 @@ class Glib::JsonUi::ViewBuilder
 
     class Sign < AbstractField
       string :directUploadUrl
-
       required :directUploadUrl
 
       # Override
@@ -422,7 +419,8 @@ class Glib::JsonUi::ViewBuilder
       hash :latitudeField
       hash :longitudeField
       hash :zoomField
-      hash :autocompleteOptions
+      # https://developers.google.com/maps/documentation/javascript/reference/places-widget#AutocompleteOptions
+      hash :autocompleteOptions, optional: [:bounds, :componentRestrictions, :fields, :strictBounds, :types]
     end
 
     class StripeToken < AbstractField

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

@@ -125,6 +125,10 @@ class Glib::JsonUi::ViewBuilder
         self.class.field_validation(@model, prop)
       end
 
+      def cast_to_js_regex(format_validation)
+        self.class.cast_to_js_regex(format_validation)
+      end
+
       def self.lookup_error_message(model_name, attribute_name, key)
         message = I18n.t("activerecord.errors.models.#{model_name}.attributes.#{attribute_name}.#{key}", default: nil) if model_name.present? && attribute_name.present?
         message ||= I18n.t("activerecord.errors.models.#{model_name}.#{key}", default: nil) if model_name.present?
@@ -134,6 +138,18 @@ class Glib::JsonUi::ViewBuilder
         message
       end
 
+      def self.cast_to_js_regex(format_validation)
+        if format_validation[:with].instance_of?(Regexp)
+          format_validation[:with] = JsRegex.new(format_validation[:with]).source
+        end
+        if format_validation[:without].instance_of?(Regexp)
+          format_validation[:without] = JsRegex.new(format_validation[:without]).source
+        end
+        if format_validation[:regex].instance_of?(Regexp)
+          format_validation[:regex] = JsRegex.new(format_validation[:regex]).source
+        end
+      end
+
       def self.field_validation(model, prop)
         validations = {}
         ignored = ['confirmation', 'comparison', 'uniqueness', 'validates_associated', 'validates_each', 'validates_with']
@@ -157,12 +173,7 @@ class Glib::JsonUi::ViewBuilder
               'less_than_or_equal_to', 'other_than', 'in', 'odd', 'even'
             ].inject({}) { |prev, curr| prev.merge(curr => lookup_error_message(model.to_s.underscore, prop, curr)) }
           when :format
-            if validations[validator.kind][:with].instance_of?(Regexp)
-              validations[validator.kind][:with] = JsRegex.new(validations[validator.kind][:with]).source
-            end
-            if validations[validator.kind][:without].instance_of?(Regexp)
-              validations[validator.kind][:without] = JsRegex.new(validations[validator.kind][:without]).source
-            end
+            cast_to_js_regex(validations[validator.kind])
             validations[validator.kind][:message] ||= lookup_error_message(model.to_s.underscore, prop, 'invalid')
           when :inclusion
             validations[validator.kind][:message] ||= lookup_error_message(model.to_s.underscore, prop, 'inclusion')
@@ -250,10 +261,11 @@ class Glib::JsonUi::ViewBuilder
       string :fieldSubsubtitleName
 
       # This can be used to implement "check all" and "uncheck all".
+      # deprecated?
       hash :fieldCheckValueIf
 
       hash :phoenixSocket
-      hash :actionCable
+      # hash :actionCable
 
       hash :nextPage
       hash :prevPage
@@ -289,8 +301,8 @@ class Glib::JsonUi::ViewBuilder
 
     class Table < View
       hash :nextPage
-      hash :export
-      hash :import
+      hash :export, required: [:label, :fileName]
+      hash :import, required: [:submitUrl, :paramName]
       action :onScrollToTop
       action :onScrollToBottom
 
@@ -371,11 +383,11 @@ class Glib::JsonUi::ViewBuilder
       string :distribution
       string :align
       action :onClick
-      hash :dragSupport
+      hash :dragSupport, optional: [:onDrop, :paramNameForFormData, :paramNameForNewIndex]
     end
 
     class Flow < View
-      hash :innerPadding
+      hash :innerPadding, optional: [:top, :right, :bottom, :left, :x, :y]
       views :childViews
 
       required :innerPadding

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

@@ -1,5 +1,20 @@
 module Glib
   module JsonUi
+
+    module Upload
+      extend ActiveSupport::Concern
+
+      included do
+        string :directUploadUrl
+        hash :accepts, optional: [:fileType, :maxFileSize, :maxFileLength, :maxFileSizeErrorText, :maxFileLengthErrorText]
+        string :strategy # can be "delegate" or "dropUpload"
+        string :storagePrefix
+        hash :metadata
+        string :tagging
+        hash :tags
+      end
+    end
+
     class ViewBuilder < AbstractBuilder
       def initialize(json, page, multiple)
         super(json, page)
@@ -38,7 +53,7 @@ module Glib
         length :width
         length :height
         color :backgroundColor
-        hash :padding
+        hash :padding, optional: [:top, :right, :bottom, :left, :x, :y, :all]
         singleton_array :styleClass, :styleClasses
 
         hash :showIf
@@ -49,7 +64,7 @@ module Glib
         bool :displayed
         bool :submitWhenNotDisplayed
 
-        hash :analytics
+        hash :analytics, optional: [:featured, :disabled]
         hash :dragData
 
         def self.component_name
@@ -139,7 +154,7 @@ module Glib
       end
 
       class Label < AbstractText
-        hash :actionCable
+        # hash :actionCable
         # string :format
         action :onClick
       end
@@ -315,16 +330,13 @@ module Glib
       end
 
       class TreeView < View
+        include Glib::JsonUi::Upload
+
         string :inputName
         string :url
-        string :directUploadUrl
-        hash :accepts
         string :selected
         array :items
         hash :dropData
-        string :strategy
-        string :storagePrefix
-        hash :metadata
       end
     end
   end

data/app/models/glib/dummy_job_application.rb

@@ -1,9 +1,10 @@
 module Glib
   class DummyJobApplication
+    include ActiveModel::Model
     include ActiveModel::Validations
     include ActiveModel::AttributeMethods
 
-    attr_accessor :name, :age, :position, :words, :accept
+    attr_accessor :name, :age, :position, :words, :accept, :pet_you_have
 
     validates :name, :position, presence: true
     validates :accept, acceptance: {}, allow_nil: false
@@ -11,6 +12,6 @@ module Glib
     validates :age, numericality: { only_integer: true, less_than_or_equal_to: 30, greater_than_or_equal_to: 18 }, allow_blank: true
     validates :name, format: { with: /Doe\z/, message: 'This job is for person end with Doe' }
     validates :position, inclusion: { in: ['programmer', 'devops', 'designer'] }, allow_blank: true
-
+    validates :pet_you_have, exclusion: { in: ['crocodile', 'shark' ], message: 'We dont accept that kind of animal!' }, allow_blank: true
   end
 end

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

@@ -52,7 +52,7 @@ if local_assigns[:top_nav] || json_ui_app_is_web?
       end
 
       menu.button text: 'Test Page', onClick: ->(action) do
-        action.windows_open url: json_ui_garage_url(path: 'test_page/index')
+        action.windows_open url: json_ui_garage_url(path: 'test_page/form')
       end
 
       menu.divider

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

@@ -17,7 +17,7 @@ page.form options.merge(childViews: ->(form) do
     fileTitle: '1 month ago',
     placeholderView: { type: 'image', width: 100, height: 75, url: 'https://www.atms.com.au/wp-content/uploads/2019/10/placeholder-1-1024x683.png?x93630' }
 
-  rules = { fileType: 'image', maxFileSize: 1, fileTypeErrorText: 'Invalid!', maxFileSizeErrorText: 'Too big!' }
+  rules = { fileType: 'image', maxFileSize: 1,  maxFileSizeErrorText: 'Too big!' }
   form.fields_file name: 'user[photo][]', width: 'matchParent', label: 'Avatar', accepts: rules, directUploadUrl: glib_direct_uploads_url,
     placeholderView: { type: 'avatar', width: 100, height: 100, url: 'data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBxMREBUREhAWFhUWGBcVFRgXFxUVFxcWGRUWFxYVFRUYHSggGB0lHRgVITEhJSkrLi4uGB8zODMtNygtLisBCgoKBQUFDgUFDisZExkrKysrKysrKysrKysrKysrKysrKysrKysrKysrKysrKysrKysrKysrKysrKysrKysrK//AABEIAOMA3gMBIgACEQEDEQH/xAAbAAEAAgMBAQAAAAAAAAAAAAAABgcBAwQFAv/EAEAQAAECAwMKAwYEBAYDAAAAAAEAAgMRIQQSMQUGIjJBUWFxgZEHE6FCUnKxwdEUI2LwM4KSskNzg6LC4WOz8f/EABQBAQAAAAAAAAAAAAAAAAAAAAD/xAAUEQEAAAAAAAAAAAAAAAAAAAAA/9oADAMBAAIRAxEAPwC6XuvCQRj7okcUe27UYoxt4TOKDDG3Knkjm3jeGCMdeoeaOcWmQwQZe6/Qc0a+6Lpx+6PbcqOSNbeF44oMMbcqeSOZeN4YIx1+h5oXEG6MEGXuv0HNGuui6cfuvMytl6zWTXi6XuN039hh1koflPxDe4nyILW/qfpO/pFB6oLDhMLTX0XLbLbChmcSNDZ8T2tPqVUNuy/aY38S0PI3A3W/0tkF5qC4bVnZYsPxLT8Ic71AWgZ72ICXmuP+m/7KpUQWzAzzsQP8Y9Ybx9F0szlsb3TFqhjDWJZ6uAVOogvcR2RR+XEa7bouB+S2B0hdOOHCqoVjiDMEg7xQ917FgzqtcHVjucNz9Mf7qjoUFwMFzHahbM3tmPZQfJ3iG10m2mCR+qGZjqw17EqXZNynCtDZwIrXt2gawn7zTUIOt7r1BzRj7ounFHtu1GOCMbeEzigwxtyp5I5t43hgjHXqHmjnXTdGCDL3X6DmjXXRdOP3R7blRyRrZi8cfsgwxtyp5I9t+o5Iw36Hmj3XaDmgMZcqeVEcy8Zj1Rji4yOHZHuLTIYIMvdfoOdUa+6LpxR7btW44b0Y0OEzigwxtyp5URzLxvDD7JDJdR3NRfOnPFlmnBgSfFwJxbD5+87hs27kHt5byzBs7A6M+7ta3F7vhb9cFXeXM9o8abIX5MPc06ZH6n7OQl1UdtdqfFeYkR5c44k4/wDQ4LSgFERAREQEREBERAREQF9wIzmOD2OLXDAtJBHUL4RBOMgZ/OYQ21NvjDzGgB4+Joo7pI81O7PHZHaIsJ7XsO0H0O48FRi78j5Yi2V9+E+XvNNWuG5w+uKC63uv0HOqNfdF04/deLm5nFCtbNDQigacMmstpZ7wXtNaCJnFBhjblTyojmXjeGH2RhvUdz3I5xBujBBl7r9BzqjHXKHnRHi7Vv3Rjb1XY9kBz79BzqjX3KH0R7Q2rce6MaHCbseyDDG3KnlRCy8bw9UYS6jsOyiGfecvkNNlgO/McNNw9hp9kH3j6BBoz2zxul1mszq4RIg2b2sO/edirxEQEREBERAREJQEXZZskx4mpAiO4hpl3NF3Q81LYf8AAI5uYPqg8VF7UTNS1j/AJ5OYfquC05MjQ/4kGI3iWul3wQciIiAiIgIiINlnjuhvD2OLXNMwRQgq0s1M5G2wXHybHaKjY8D2mcd4VUrZZ47ob2vY4tc0zaRiCgvZ7r9BzqjX3RdOPpVeJmtl8WuDeoIzZCI3/m0bj6VXttaCJnH97EGGNuVPKiObfqOVUYb1HfZHuLaNw7oDWXKnlRHMv1HqjCSZOw7I5100Mm4k7BvM0HlZ05ebZbOXgabtGEDtdLWI3DHsqeixC9xc4kucSSTiSaklernXlj8XaHPH8NuhDH6Rt5nHsvHQEREBERARF6WbuSzabQ2H7Os87mjHqcOqDtzczXiWrTcbkL3pVdvDB9fmp7k3INns8rkIXvedpO7nDpJejChhrQ1oAaAAAMABgF9ICIiAiIg8nKeblnjzvQw13vM0XdZUPVQHOHNyJZDenfhkyDwMDsDhsKtRarTZ2xGOhvE2uEiOCClUXblnJ5s8d8I+ydE72mrT2+q4kBERAREQd2RspvssZsZmLcRsc04tPP7K5LFaW2iG2PDM2uAI3jeDxBmFRqmfhxlry4psrzoRKs4RJYfzAdwN6Cx3Ov0HOqNdcoedEeLurj3RgDqux7IDn36Dmoxn/lT8PZfJadOMS2mxntn1A6qUOaBq491UmfWUfPtr5GbYf5bf5dY/1T7BBH0REBERAREQFYfh3YbsB0YisR0h8LafOfZV4VcGQYHl2WC3dDbPmQCfUlB3oiICIiAiIgIiIIX4j2GbYccCoPlu5GrfW93UEVsZ2QA+xRgdjbw5tId9FU6AiIgIiIC+oby0hzTIgggjEEVBC+UQXXkLKYj2dloGLhJwGx4o4dwu5zL9RyUB8MLfpRLM7AjzW8xJrvS72U+eSKNw7oOfKMb8PBiRidRjnDmBQd5Kj3OJMzianmrT8QbW5lhLTjEe1nSrj/bJVWgIiICIiAiIgK3834/mWWC7/wAbQeYF0+oKqBWJ4d2u9Z3wtsN0x8L6/MOQStERAREQEREBERB4+d0e5Yox3tujm4gfVVQp54kWuTIUEe0S88m0HqT2UDQEREBERAREQelm5bvItcGLOQDwHfC7Rd6Eq6L1ynVUKVeOSLQI1nhRTi+Gwmu26J+s0EP8U7RNlnZvMR3a6B/cVXym3ik786CBgIbj3d/0oSgIiICIiAiIgKW+HN/z4khoXJOO4zm35OUSU88NXjy4w9q80nlIgeoKCZoiICIiAiIgIiIK1z/D/wAXNzSG3GhnECcz3J9FGlNfEt4vQBtk8nkS2XyKhSAiIgIiICIiArazFPmWCFXVL29nlVKrP8OHn8CZbIrx/tYfqg8TxRZKPB/yyP8AeVC1O/FKGZ2d53RGnoWEfMqCICIiAiIgIiIC78iZVfZYoiMrsc3Y5u7hzXAiC5cmZQZaITYsMzB7g7WniF1KBeHFuk+JAJ1gHtHFtHS6Ef0qeoCIiAiIgLiyxlRlmhGJE5NAxc7YAu1V14hW6/aGwgaQ21+J1T6BqDwsr5SfaYpivxNABg1owaFxIiAiIgIiICIiArP8M3XbE874zv7If2VYK1/DuEBYGl3tPe6vOX0QcniZDv2VkSWpEAPJzSPmAqzV0Z02QRrFGY2RNwuA4s0h8lS6AiIgIiICIiAiIg6LBa3QYrIrNZhmOO8HgRMdVcFgtbY0NsVh0XCY4bweINFS6n/hvaSYUWGcGOBH8wMx3bPqgmCIiAiIg48rW9tngviuwaKDe40a0cyqgtEd0R7nuM3OJcTxJmpn4k2kzgwtmk88TQDtXuoQgIiICIiAiIgIiICufNixXbFAbgfLDjzdpH5qn7DZjFishDF7mtHUymrxc0iQZgABThRBny7tTUYd1S2X7B+HtMWDsa43fhOk30IV0snPSw4qC+J2TJ+XamCn8N/zYfmOyCAIiICIiAiIgIi3WWyviuDIbC5x2AT77hxQaVaGZmSjZ7PpiT4hvuG4Sk1p4yr1XHm1miIJEWPJ0QVa3FrDv/UfQKVoCIiAiIgjGfeSTGgiIwTdCmSBiWGV6XKQPdVurvUOzlzOvkxbMAHGroeAJ3s3HhhyQQFFsjwXMcWvaWuGIIkR0WtAREQEREBERBK/DfJ/mWvzCKQml38zptb/AMj0Vn37lMdu5R3MfJhgWNplpxT5jt4aRoDtXqVImS9rHjuQYv36YbVz5RsbYsJ9nfqvBE9xOBHEGRXS+Xs48EZKWljxQUZbrI6DFfCeJOYS0/ccCK9VoVjeIWQTEh/imN02CUUe8wYP5t28OSrlARF9wYTnuDWtLnEyAAmSeSD4XRYrDEjOuwobnngKDmcB1UzyFmQAA+0mZx8sGg+Jwx5D1UwgQGw2hrGhrRgGgAdgghOSsxCZOtESX6GVPV+Hbupjk/J8KA27Chho2yxPM4nqulEBERAREQEREBERBxZTyVBtDZRYYduODhycKhQzKuYsRs3QH3x7rpNd0OB9FYCIKWtVlfCddiMcw7nAjtvWlXVarKyK27EY1zdzgD/8UNy5mQKvsx/03H+1x+R7oIOi+osMtcWuBDgZEESIO4hfKAvZzSyP+KtLWEflt04nwj2epp3XjtaSQAJk0AGJJwAVwZpZFbY7PddLzXydE5yo0cB85oPadoV6SwksXL9cNiwyft4cao+fs4cN6DJZcrjsQMv6WCwwEHSw41R4JOjhwogy19+hFNu2YwkQqqz1zbNki32D8l50f0OxuH6cOStV5B1ceFKLTarMyLCdCjCYcJEH0M9h3FBR0GE57gxoJc4gADEk7FaGbGbzbKy8ZOiuGk7d+lvDjtWnIOaX4SO+I43hhBO0NOJduds771IkBERAREQEREBERAREQEREBERAREQeFnPm621MvNAbGA0Xe9+l3DjsVYRoRY4tcCHNJBBxBGIV2Lx7bmpCj2lloiaoGkyX8Rw1Z8N++QQeNmDm7dlbIzf8lp/9h+nfcp5cvaX7osMEtYSGwbByCOBnTV9ONEAOv0w2oX3KY7Vl8jqY8KURhA1seNaIMB9+mG1C+5o4rLyDq48KIwgCTseNUAsuVx2IGXtJYYCNbDjWqOBJm3Dsg+mRL1CFoiwZcv3itzyDq48KUWWOAEjj+5IONF0PgbcDu+y0ESxQYREQEREBERAREQEREBERARfTGE4BdDGNbiaoNbYUhN3QfdbQy9penJYZMGbsONao4EmbcO3OiAHX6YbUL7uj+6rLyDq48KURpAEjj+5VQC25XHYgbfrhsWGAjWw41R4J1cOFKoMllyo5IGX6lYYCDN2HdHgkzbh2QGvv0NNqF93RWXkGjce1EaQBJ2Pf1QC25UV2IGXtL90WGAjWw71RwJM24dudEBrr9DTasRDLRIn819PIOrj2ojSAJOx7+qD4iWbce60uYRiF0MBGth3qskkmYw/exByIustacBPlRa3QW4TIPGvyQaEW91nl7QWPw53hBpRbhZydo7p5FZFwQaUXSYDRiSshu1rRLf8APFBoZDJwC2CEAZEzO4LbEde1T9FgESkdb67KoPqJo1HKWxfIZe0lhgIq7DujgSZtw7eiA11+hptQvu6P7qsvIOrj2ojSAJOx7+qAW3KiuxAy9pfuiwwEa2HeqOBJmMO3OiAHX6Gm1C65QV2rLzPVx7IwgUdj3QfVp1eqWfVREGqy49PskfW7IiDZasOv3WYGr3REGuy49FiPrdkRBstWHX7rMHV7rKINVlx6LEXX7IiDZasBzWYOp3+qyiDVZcTyWIuv2+iIg2WrAc1mHqdD9URB8WXEr5fr9R9ERBttOr1Sz6vdZRBpsuPT7JH1uyIg2WrDqswdTuiINdlxPJYtOt0REH//2Q==' }
 
@@ -32,7 +32,7 @@ page.form options.merge(childViews: ->(form) do
   form.fields_file name: 'user[zip][]', width: 'matchParent', label: 'ZIP Document', accepts: rules, directUploadUrl: glib_direct_uploads_url
 
   # TODO
-  # rules = { fileType: 'image/*', maxFileSize: 1, fileTypeErrorText: 'Invalid!', maxFileSizeErrorText: 'Too big!' }
+  # rules = { fileType: 'image/*', maxFileSize: 1,  maxFileSizeErrorText: 'Too big!' }
   # form.fields_multiImage name: 'user[photos][]', width: 'matchParent', label: 'Avatar', accepts: rules, directUploadUrl: glib_direct_uploads_url,
   #   placeholderView: { type: 'avatar', width: 100, height: 100, url: 'data:image/jpeg;base64,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' }
 

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

@@ -349,12 +349,14 @@ page.form \
     form.spacer height: 20
     options = [
       { text: 'Option 1', value: 'option1' },
-      { text: 'Option 2', value: 'option2' }
+      { text: 'Option 2', value: 'option2' },
+      { text: 'Option 3', value: 'option3' }
     ]
     form.fields_select name: 'user[loadif7]', width: 'matchParent', label: 'Select "show"', options: options, value: '', onChangeAndLoad: ->(action) do
       action.runMultiple childActions: ->(saction) do
         saction.logics_set targetId: 'panel7a', conditionalData: { displayed: { "==": [{ "var": 'user[loadif7]' }, 'option1'] } }
         saction.logics_set targetId: 'panel7b', conditionalData: { displayed: { "==": [{ "var": 'user[loadif7]' }, 'option2'] } }
+        saction.logics_set targetId: 'panel7c', conditionalData: { displayed: { "==": [{ "var": 'user[loadif7]' }, 'option3'] } }
       end
     end
 
@@ -363,8 +365,8 @@ page.form \
       styleClass: 'border-2',
       width: 'matchParent',
       padding: { top: 8, right: 8, bottom: 8, left: 8 },
-      childViews: ->(res) do
-        res.fields_text name: 'user[loadif_target9]', width: 'matchParent', value: 'Value 7a'
+      childViews: ->(vertical) do
+        vertical.fields_text name: 'user[0][loadif_target9]', width: 'matchParent', value: 'Value 7a'
       end
 
     form.panels_vertical \
@@ -372,8 +374,17 @@ page.form \
       styleClass: 'border-2',
       width: 'matchParent',
       padding: { top: 8, right: 8, bottom: 8, left: 8 },
-      childViews: ->(res) do
-        res.fields_text name: 'user[loadif_target9]', width: 'matchParent', value: 'Value 7b'
+      childViews: ->(vertical) do
+        vertical.fields_text name: 'user[1][loadif_target9]', width: 'matchParent', value: 'Value 7b'
+      end
+
+    form.panels_vertical \
+      id: 'panel7c',
+      styleClass: 'border-2',
+      width: 'matchParent',
+      padding: { top: 8, right: 8, bottom: 8, left: 8 },
+      childViews: ->(vertical) do
+        vertical.fields_text id: 'target_panel_3', name: 'user[2][loadif_target9]', width: 'matchParent', value: 'Value 7c'
       end
 
     form.spacer height: 20

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

@@ -107,7 +107,7 @@ page.scroll childViews: ->(scroll) do
         end
 
       form.spacer height: 20
-      rules = { fileType: 'image', maxFileSize: 5000, fileTypeErrorText: 'Invalid!', maxFileSizeErrorText: 'Too big!' }
+      rules = { fileType: 'image', maxFileSize: 5000, maxFileSizeErrorText: 'Too big!' }
       form.fields_file \
         name: 'user[photo][]',
         width: 'matchParent',

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

@@ -15,29 +15,32 @@ page.form \
       name: 'user[name]',
       width: 'matchParent',
       label: 'Name'
-
+    form.spacer height: 8
 
     form.fields_email \
       name: 'user[email]',
       width: 'matchParent',
       label: 'Email'
+    form.spacer height: 8
 
     form.fields_url \
       name: 'user[url]',
       width: 'matchParent',
       label: 'URL'
+    form.spacer height: 8
 
     form.fields_number \
       prop: :age,
       name: 'user[age]',
       width: 'matchParent',
       label: 'Age'
-
+    form.spacer height: 8
 
     form.fields_phone \
       name: 'user[phone1]',
       width: 'matchParent',
       label: 'Phone field'
+    form.spacer height: 8
 
     form.fields_phone \
       name: 'user[phone2]',
@@ -45,6 +48,7 @@ page.form \
       label: 'Phone field with Australia as the default country',
       disableAutoDetect: true, # Disable country auto detect by user IP
       defaultCountry: 'AU' # ISO Country code, see: https://en.wikipedia.org/wiki/List_of_ISO_3166_country_codes
+    form.spacer height: 8
 
     form.fields_password \
       name: 'user[password]',
@@ -52,6 +56,7 @@ page.form \
       label: 'Password',
       hint: 'Should contain at least 6 characters',
       leftIcon: 'lock'
+    form.spacer height: 8
 
     form.fields_textarea \
       prop: :words,
@@ -59,6 +64,7 @@ page.form \
       width: 'matchParent',
       label: 'Textarea with maxLength',
       maxLength: 1000
+    form.spacer height: 8
 
 
     options = ['programmer', 'devops', 'designer', 'ceo', 'office_boy'].map { |v| { text: v.humanize, value: v } }
@@ -68,11 +74,10 @@ page.form \
       width: 'matchParent',
       label: 'Position',
       options: options
+    form.spacer height: 8
 
 
-    form.spacer height: 10
     form.h4 text: 'Gender'
-    form.spacer height: 4
     form.fields_radioGroup \
       name: 'user[gender]',
       validation: { required: { message: 'Required' } },
@@ -82,9 +87,9 @@ page.form \
         group.fields_radio value: 'F', label: 'Female'
       end
 
-    form.spacer height: 10
+    form.spacer height: 8
+
     form.h4 text: 'Skills'
-    form.spacer height: 4
     form.fields_checkGroup \
       name: 'user[skills][]',
       uncheckValue: 1,
@@ -95,10 +100,10 @@ page.form \
         group.fields_check checkValue: 4, label: 'Mobile Development'
       end
 
-    form.spacer height: 10
+    form.spacer height: 8
     form.fields_check prop: :accept, label: 'Accept terms & condition', name: 'user[accept]'
 
-    form.spacer height: 30
+    form.spacer height: 8
     form.fields_submit text: 'Submit'
     form.fields_submit text: 'Submit (disable if form invalid)', disableIfFormInvalid: true
   end

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

@@ -0,0 +1,14 @@
+navs = ['form', 'dialog', 'form_dynamic', 'auto_validate', 'multiupload']
+
+view.panels_flow innerPadding: { bottom: 0 }, styleClass: 'align-right', width: 'matchParent', childViews: ->(res) do
+  navs.each_with_index do |nav, index|
+    if index < navs.size && index != 0
+      res.spacer width: 4
+      res.label text: '|'
+      res.spacer width: 4
+    end
+    res.label text: nav, onClick: ->(action) do
+      action.windows_open url: json_ui_garage_url(path: "test_page/#{nav}")
+    end
+  end
+end

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

@@ -0,0 +1,77 @@
+json.title 'Test Page (Form)'
+
+page = json_ui_page json
+
+page.body childViews: ->(body) do
+  render 'json_ui/garage/test_page/header', view: body
+
+  model = Glib::DummyJobApplication.new(
+    name: 'John Deo',
+    accept: '0',
+    words: '',
+    age: 17,
+    position: 'ceo',
+    pet_you_have: 'crocodile'
+  )
+
+  body.panels_responsive padding: glib_json_padding_body, childViews: ->(res) do
+    res.h2 text: 'Job Application'
+    res.spacer height: 8
+    res.panels_form \
+      url: json_ui_garage_url(path: 'forms/generic_post'),
+      method: 'post',
+      model: model,
+      autoValidate: true,
+      childViews: ->(form) do
+        form.fields_text prop: :name, label: 'name', name: 'user[name]', width: 'matchParent'
+        form.spacer height: 4
+
+        form.fields_text label: 'say hello', name: 'user[say]', width: 'matchParent', validation: { format: { regex: 'hello', message: 'Say hello!' } }, value: 'sup'
+        form.spacer height: 4
+
+        form.fields_number prop: :age, label: 'age', name: 'user[age]', width: 'matchParent'
+        form.spacer height: 4
+
+        form.fields_number \
+          name: 'user[height]',
+          label: 'height',
+          width: 'matchParent',
+          validation: { numericality: { greater_than_or_equal_to: 155, less_than_or_equal_to: 190, message: { greater_than_or_equal_to: 'Too short', less_than_or_equal_to: 'Too long' } } },
+          value: 150
+        form.spacer height: 4
+
+        form.fields_textarea prop: :words, label: 'words', name: 'user[words]', width: 'matchParent'
+        form.spacer height: 4
+
+        form.fields_textarea label: 'Tell me story', name: 'user[story]', width: 'matchParent', validation: { length: { minimum: 1, message: { too_short: { one: 'Min %{count} word', other: 'Min %{count} words' } } } }
+        form.spacer height: 4
+
+        options = ['programmer', 'devops', 'designer', 'ceo', 'office_boy'].map { |v| { text: v.humanize, value: v } }
+        form.fields_select prop: :position, label: 'postion', name: 'user[position]', width: 'matchParent', options: options
+        form.spacer height: 4
+
+        options2 = ['crocodile', 'cat', 'dog', 'bird', 'shark'].map { |v| { text: v.humanize, value: v } }
+        form.fields_select prop: :pet_you_have, label: 'Pet you have', name: 'user[pet_you_have]', width: 'matchParent', options: options2
+        form.spacer height: 4
+
+        form.label text: 'Decision'
+        options3 = ['choose me', 'dont choose me', 'whatever']
+        form.fields_radioGroup value: 'dont choose me', validation: { exclusion: { in: ['dont choose me'], message: 'dont choose me' } }, childViews: ->(radio) do
+          options3.each do |option|
+            radio.fields_radio label: option, value: option
+          end
+        end
+        form.spacer height: 4
+
+        form.fields_check prop: :accept, label: 'accept', name: 'user[accept]', width: 'matchParent', checkValue: '1'
+        form.spacer height: 4
+
+        form.spacer height: 4
+        form.fields_submit text: 'submit'
+        form.spacer height: 2
+        form.fields_submit text: 'submit (if form valid)', disableIfFormInvalid: true
+      end
+
+    res.spacer height: 16
+  end
+end

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

@@ -0,0 +1,38 @@
+
+
+json.title 'Test Page (Form)'
+
+page = json_ui_page json
+
+page.body childViews: ->(body) do
+  render 'json_ui/garage/test_page/header', view: body
+
+  body.panels_responsive padding: glib_json_padding_body, childViews: ->(res) do
+    res.h2 text: 'Dialog'
+    res.spacer height: 8
+    res.button text: 'Dialog updateExisting', onClick: ->(action) do
+      action.runMultiple childActions: ->(saction) do
+        saction.dialogs_show content: ->(dialog) do
+          dialog.body padding: glib_json_padding_body, childViews: ->(sbody) do
+            sbody.h1 text: 'Hello world'
+            sbody.button text: 'change dialog content', onClick: ->(ssaction) do
+              ssaction.dialogs_show updateExisting: true, disableCloseButton: true, content: ->(sdialog) do
+                sdialog.body padding: glib_json_padding_body, childViews: ->(ssbody) do
+                  ssbody.h1 text: 'Hello world (updated)'
+                  ssbody.spacer height: 8
+                  ssbody.button text: 'close', onClick: ->(xaction) do
+                    xaction.dialogs_close
+                  end
+                end
+              end
+            end
+          end
+        end
+      end
+    end
+    res.spacer height: 4
+    res.button text: 'Dialog open', onClick: ->(action) do
+      action.dialogs_open url: json_ui_garage_url(path: 'test_page/dialog_open')
+    end
+  end
+end

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

@@ -0,0 +1,14 @@
+page = json_ui_page json
+
+page.body padding: glib_json_padding_body, childViews: ->(body) do
+  body.panels_responsive width: 'matchParent', childViews: ->(res) do
+    res.h2 text: 'Title'
+    res.spacer height: 16
+    res.button text: 'open', onClick: ->(action) do
+      action.dialogs_open url: json_ui_garage_url(path: 'test_page/dialog_open')
+    end
+    res.button text: 'close', onClick: ->(action) do
+      action.dialogs_close
+    end
+  end
+end

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

@@ -0,0 +1,111 @@
+json.title 'Test Page (Form)'
+
+page = json_ui_page json
+
+page.body childViews: ->(body) do
+  render 'json_ui/garage/test_page/header', view: body
+
+  body.panels_responsive padding: glib_json_padding_body, childViews: ->(res) do
+    res.h2 text: 'Form'
+    res.spacer height: 8
+    res.panels_form \
+      url: json_ui_garage_url(path: 'forms/generic_post'),
+      method: 'post',
+      childViews: ->(form) do
+        form.panels_flow innerPadding: { bottom: 0 }, width: 'matchParent', childViews: ->(hori) do
+          hori.button text: 'components/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' }
+              new_options = [{ text: 'Option99', value: 'option99' }]
+              ['select', 'chip_group'].each do |id|
+                saction.components_set targetId: id, data: { options: new_options, value: ['option99'] }
+              end
+            end
+          end
+          hori.spacer width: 4
+          hori.button text: 'logics/set', onClick: ->(action) do
+            action.logics_set targetId: 'date', conditionalData: { value: { "+": [{ "var": ['user[date]'] }, 60 * 60 * 24 * 3] } }
+          end
+          hori.spacer width: 4
+          hori.button text: 'components/replace', onClick: ->(action) do
+            action.runMultiple childActions: ->(saction) do
+              saction.components_replace targetId: 'radio_group', newView: ->(view) do
+                view.fields_radioGroup value: '', childViews: ->(sview) do
+                  sview.fields_radio label: 'Option99', value: 'option99'
+                end
+              end
+
+              saction.components_replace targetId: 'check_group', newView: ->(view) do
+                view.fields_checkGroup value: '', childViews: ->(sview) do
+                  sview.fields_check label: 'Option99', value: nil, checkValue: 'option99'
+                end
+              end
+            end
+          end
+          hori.spacer width: 4
+          hori.button text: 'hide select', onClick: ->(action) do
+            action.components_set targetId: 'select', data: { displayed: false }
+          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 }
+            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 }
+            end
+          end
+        end
+
+        form.spacer height: 8
+        form.hr width: 'matchParent'
+        form.spacer height: 8
+
+        validation = { required: { message: 'Required' } }
+        options = ['option1', 'option2', 'option3', 'option4'].map { |option| { 'text'=> option.humanize, 'value' => option } }
+
+        form.fields_date width: 'matchParent', name: 'user[date]', id: 'date', value: Date.new(2024, 7, 24), validation: validation
+        form.hr width: 'matchParent'
+        form.fields_select multiple: true, width: 'matchParent', name: 'user[select][]', id: 'select', options: options, value: ['option1', 'option2'], validation: validation
+        form.hr width: 'matchParent'
+        form.fields_chipGroup width: 'matchParent', name: 'user[chip_group]', id: 'chip_group', options: options, value: ['option2'], validation: validation
+        form.hr width: 'matchParent'
+        form.fields_radioGroup width: 'matchParent', name: 'user[radio_group]', id: 'radio_group', value: 'option3', validation: validation, childViews: ->(radio) do
+          options.each do |option|
+            radio.fields_radio label: option['text'], value: option['value']
+          end
+        end
+        form.hr width: 'matchParent'
+        check_group_value = ['option3', 'option1']
+        form.fields_checkGroup width: 'matchParent', name: 'user[check_group]', id: 'check_group', value: check_group_value, validation: validation, childViews: ->(radio) do
+          options.each do |option|
+            radio.fields_check label: option['text'], checkValue: option['value']
+          end
+        end
+        form.hr width: 'matchParent'
+        form.panels_vertical width: 'matchParent', id: 'ver', childViews: ->(ver) do
+          form.fields_text width: 'matchParent', name: 'user[text]', id: 'text', value: 'John Doe', validation: validation.merge(format: { regex: /Doe\z/, message: 'Must end with Doe' })
+        end
+        form.panels_vertical width: 'matchParent', id: 'ver1', displayed: false, childViews: ->(ver) do
+          form.fields_text width: 'matchParent', name: 'user[text]', value: 'Jack Doe', validation: validation.merge(format: { regex: /Doe\z/, message: 'Must end with Doe' })
+        end
+
+        form.hr width: 'matchParent'
+
+        form.fields_textarea width: 'matchParent', name: 'user[textarea]', id: 'textarea', value: 'Lorem ipsum et dumet bla bla bla...'
+
+        form.hr width: 'matchParent'
+        form.fields_submit text: 'submit'
+        form.spacer height: 2
+        form.fields_submit text: 'submit (if form valid)', disableIfFormInvalid: true
+      end
+
+
+    res.spacer height: 16
+  end
+end

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

@@ -0,0 +1,63 @@
+json.title 'Test Page (Form)'
+
+page = json_ui_page json
+
+page.body childViews: ->(body) do
+  render 'json_ui/garage/test_page/header', view: body
+
+  body.panels_responsive padding: glib_json_padding_body, childViews: ->(res) do
+    res.h2 text: 'Form'
+    res.spacer height: 8
+    res.panels_form \
+      url: json_ui_garage_url(path: 'forms/generic_post'),
+      method: 'post',
+      childViews: ->(form) do
+
+        properties = [
+          [
+            { name: 'question', value: 'Punctuality' },
+            { name: 'type', value: 'rating' },
+          ],
+          [
+            { name: 'question', value: 'Quality of work' },
+            { name: 'type', value: 'rating' },
+            { name: 'enabled', value: '1' },
+          ],
+          [
+            { name: 'question', value: 'Satisfied?' },
+            { name: 'type', value: 'yes_no' },
+          ]
+        ]
+        validation = { required: { message: 'Required' } }
+        form.fields_dynamicGroup width: 'matchParent', name: 'user[evaluation]', groupFieldProperties: properties, titlePrefix: 'Entry', content: ->(group) do
+          group.template padding: { left: 32 }, childViews: ->(template) do
+            template.spacer height: 10
+            template.fields_text width: 'matchParent', name: 'question', label: 'Question', placeholder: 'Question', validation: validation
+
+            options = [ :rating, :yes_no ]
+            template.fields_select \
+              width: 'matchParent',
+              name: 'type',
+              label: 'Answer Type',
+              placeholder: 'Answer Type',
+              options: options.map { |o| { text: o.to_s.humanize, value: o } },
+              validation: validation
+
+            template.fields_check \
+              width: 'matchParent',
+              name: 'enabled',
+              label: 'Enable',
+              checkValue: '1',
+              showIf: { "==": [{ "var": 'user[evaluation][{{index}}][type]' }, 'rating'] }
+
+            template.spacer height: 14
+          end
+        end
+        form.fields_submit text: 'submit'
+        form.spacer height: 2
+        form.fields_submit text: 'submit (if form valid)', disableIfFormInvalid: true
+      end
+
+    res.spacer height: 16
+  end
+end

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

@@ -0,0 +1,65 @@
+json.title 'Test Page (Form)'
+
+page = json_ui_page json
+
+page.body childViews: ->(body) do
+  render 'json_ui/garage/test_page/header', view: body
+
+  body.panels_responsive padding: glib_json_padding_body, childViews: ->(res) do
+    res.h2 text: 'MultiUpload'
+    res.spacer height: 8
+    res.panels_form \
+      url: json_ui_garage_url(path: 'forms/generic_post'),
+      method: 'post',
+      childViews: ->(form) do
+
+        form.spacer height: 16
+        form.label text: 'Simple file upload'
+        form.spacer height: 8
+        form.fields_multiUpload \
+          name: 'user[multi][]',
+          id: 'upload_1',
+          width: 360,
+          accepts: { fileType: 'image', maxFileSize: 10 },
+          directUploadUrl: glib_direct_uploads_url,
+          uploadTitle: 'Files uploaded:',
+          storagePrefix: 'glib',
+          metadata: {
+            foo: 'bar',
+            zoo: 'baz'
+          },
+          # tagging: 'key=value&key1=value1',
+          tags: { key: 'value', key1: 'value1' },
+          files: [
+            { name: 'File (Example)', signed_id: ActiveStorage::Attachment.first&.signed_id }
+          ]
+        form.button text: 'clear files', onClick: ->(action) do
+          action.components_set targetId: 'upload_1', data: { files: [], value: nil }
+        end
+
+        form.spacer height: 16
+        form.label text: 'File upload with onFinishUpload'
+        form.spacer height: 8
+        form.fields_multiUpload \
+          name: 'user[multi2][]',
+          id: 'upload_2',
+          width: 360,
+          accepts: { fileType: 'image', maxFileSize: 5000 },
+          directUploadUrl: glib_direct_uploads_url,
+          uploadTitle: 'Files uploaded:',
+          onFinishUpload: ->(action) { action.forms_submit }
+        form.button text: 'populate files', onClick: ->(action) do
+          action.components_set targetId: 'upload_2', data: {
+            files: [
+              { name: 'File (Example)', signed_id: ActiveStorage::Attachment.last&.signed_id }
+            ],
+            value: [1]
+          }
+        end
+
+        form.fields_submit text: 'submit'
+      end
+
+    res.spacer height: 16
+  end
+end

data/lib/glib/mailer_tester.rb

@@ -61,7 +61,7 @@ module Glib
     end
 
     def mails
-      @mails ||= ActionMailer::Base.deliveries
+      ActionMailer::Base.deliveries
     end
 
     def last_mail

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: glib-web
 version: !ruby/object:Gem::Version
-  version: 4.3.0
+  version: 4.4.0
 platform: ruby
 authors:
 - ''
@@ -111,6 +111,7 @@ files:
 - app/helpers/glib/json_ui/abstract_builder.rb
 - app/helpers/glib/json_ui/action_builder.rb
 - app/helpers/glib/json_ui/action_builder/bottom_banners.rb
+- app/helpers/glib/json_ui/action_builder/browsers.rb
 - app/helpers/glib/json_ui/action_builder/commands.rb
 - app/helpers/glib/json_ui/action_builder/components.rb
 - app/helpers/glib/json_ui/action_builder/dialogs.rb
@@ -123,6 +124,7 @@ files:
 - app/helpers/glib/json_ui/action_builder/popovers.rb
 - app/helpers/glib/json_ui/action_builder/sheets.rb
 - app/helpers/glib/json_ui/action_builder/snackbars.rb
+- app/helpers/glib/json_ui/action_builder/storage_items.rb
 - app/helpers/glib/json_ui/action_builder/tours.rb
 - app/helpers/glib/json_ui/action_builder/windows.rb
 - app/helpers/glib/json_ui/analytics_helper.rb
@@ -287,7 +289,13 @@ files:
 - app/views/json_ui/garage/tables/index.json.jbuilder
 - app/views/json_ui/garage/tables/layout.json.jbuilder
 - app/views/json_ui/garage/tables/panel_content.json.jbuilder
-- app/views/json_ui/garage/test_page/index.json.jbuilder
+- app/views/json_ui/garage/test_page/_header.json.jbuilder
+- app/views/json_ui/garage/test_page/auto_validate.json.jbuilder
+- app/views/json_ui/garage/test_page/dialog.json.jbuilder
+- app/views/json_ui/garage/test_page/dialog_open.json.jbuilder
+- app/views/json_ui/garage/test_page/form.json.jbuilder
+- app/views/json_ui/garage/test_page/form_dynamic.json.jbuilder
+- app/views/json_ui/garage/test_page/multiupload.json.jbuilder
 - app/views/json_ui/garage/views/_chart_data.json.jbuilder
 - app/views/json_ui/garage/views/banners.json.jbuilder
 - app/views/json_ui/garage/views/calendar_data.json.jbuilder

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

@@ -1,120 +0,0 @@
-json.title 'Test Page'
-
-page = json_ui_page json
-
-page.body childViews: ->(body) do
-  body.panels_responsive padding: glib_json_padding_body, childViews: ->(res) do
-    res.panels_column lg: { cols: 6 }, childViews: ->(col) do
-      res.h2 text: 'Reactivity & validation'
-      res.spacer height: 8
-      res.panels_form \
-        url: json_ui_garage_url(path: 'forms/generic_post'),
-        method: 'post',
-        childViews: ->(form) do
-          form.panels_flow innerPadding: { bottom: 0 }, width: 'matchParent', childViews: ->(hori) do
-            hori.button text: 'components/set', onClick: ->(action) do
-              action.runMultiple childActions: ->(saction) do
-                saction.components_set targetId: 'text', data: { value: 'Doe John' }
-                saction.components_set targetId: 'textarea', data: { value: 'The quick brown fox jumps over the lazy dog' }
-                new_options = [{ text: 'Option99', value: 'option99' }]
-                ['select', 'chip_group'].each do |id|
-                  saction.components_set targetId: id, data: { options: new_options, value: ['option99'] }
-                end
-              end
-            end
-            hori.spacer width: 4
-            hori.button text: 'logics/set', onClick: ->(action) do
-              action.logics_set targetId: 'date', conditionalData: { value: { "+": [{ "var": ['user[date]'] }, 60 * 60 * 24 * 3] } }
-            end
-            hori.spacer width: 4
-            hori.button text: 'components/replace', onClick: ->(action) do
-              action.runMultiple childActions: ->(saction) do
-                saction.components_replace targetId: 'radio_group', newView: ->(view) do
-                  view.fields_radioGroup value: '', childViews: ->(sview) do
-                    sview.fields_radio label: 'Option99', value: 'option99'
-                  end
-                end
-
-                saction.components_replace targetId: 'check_group', newView: ->(view) do
-                  view.fields_checkGroup value: '', childViews: ->(sview) do
-                    sview.fields_check label: 'Option99', value: nil, checkValue: 'option99'
-                  end
-                end
-              end
-            end
-            hori.spacer width: 4
-            hori.button text: 'hide select', onClick: ->(action) do
-              action.components_set targetId: 'select', data: { displayed: false }
-            end
-          end
-
-          form.spacer height: 8
-          form.hr width: 'matchParent'
-          form.spacer height: 8
-
-          validation = { required: { message: 'Required' } }
-          options = ['option1', 'option2', 'option3', 'option4'].map { |option| { 'text'=> option.humanize, 'value' => option } }
-
-          form.fields_date width: 'matchParent', name: 'user[date]', id: 'date', value: Date.new(2024, 7, 24), validation: validation
-          form.hr width: 'matchParent'
-          form.fields_select multiple: true, width: 'matchParent', name: 'user[select][]', id: 'select', options: options, value: ['option1', 'option2'], validation: validation
-          form.hr width: 'matchParent'
-          form.fields_chipGroup width: 'matchParent', name: 'user[chip_group]', id: 'chip_group', options: options, value: ['option2'], validation: validation
-          form.hr width: 'matchParent'
-          form.fields_radioGroup width: 'matchParent', name: 'user[radio_group]', id: 'radio_group', value: 'option3', validation: validation, childViews: ->(radio) do
-            options.each do |option|
-              radio.fields_radio label: option['text'], value: option['value']
-            end
-          end
-          form.hr width: 'matchParent'
-          check_group_value = ['option3', 'option1']
-          form.fields_checkGroup width: 'matchParent', name: 'user[check_group]', id: 'check_group', value: check_group_value, validation: validation, childViews: ->(radio) do
-            options.each do |option|
-              radio.fields_check label: option['text'], checkValue: option['value']
-            end
-          end
-          form.hr width: 'matchParent'
-          form.fields_text width: 'matchParent', name: 'user[text]', id: 'text', value: 'John Doe', validation: validation
-
-          form.hr width: 'matchParent'
-
-          form.fields_textarea width: 'matchParent', name: 'user[textarea]', id: 'textarea', value: 'Lorem ipsum et dumet bla bla bla...'
-
-          form.hr width: 'matchParent'
-          form.fields_submit text: 'submit'
-          form.spacer height: 2
-          form.fields_submit text: 'submit (if form valid)', disableIfFormInvalid: true
-        end
-
-
-      res.spacer height: 16
-
-    end
-
-
-    res.panels_column lg: { cols: 6 }, childViews: ->(col) do
-      res.h2 text: 'Dialog'
-      res.spacer height: 8
-      res.button text: 'Dialog updateExisting', onClick: ->(action) do
-        action.runMultiple childActions: ->(saction) do
-          saction.dialogs_show updateExisting: true, content: ->(dialog) do
-            dialog.body padding: glib_json_padding_body, childViews: ->(sbody) do
-              sbody.h1 text: 'Hello world'
-              sbody.button text: 'change dialog content', onClick: ->(ssaction) do
-                ssaction.dialogs_show updateExisting: true, disableCloseButton: true, content: ->(sdialog) do
-                  sdialog.body padding: glib_json_padding_body, childViews: ->(ssbody) do
-                    ssbody.h1 text: 'Hello world (updated)'
-                    ssbody.spacer height: 8
-                    ssbody.button text: 'close', onClick: ->(xaction) do
-                      xaction.dialogs_close
-                    end
-                  end
-                end
-              end
-            end
-          end
-        end
-      end
-    end
-  end
-end