Add form previews

app/components/beyond_essence/clipboard_copy_component/clipboard_copy_component.scss

@@ -8,6 +8,6 @@
 
   &-link {
     margin-left: 30px;
-    padding: 6px 0;
+    padding: 6px 0 !important;
   }
 }

site/app/views/lookbook/previews/forms/boolean_inputs/_boolean.html.erb

@@ -0,0 +1,8 @@
+<%= simple_fields_for nil do |f| %>
+  <%= f.input :boolean,
+              as: :boolean,
+              required:,
+              label: label ? nil : false,
+              disabled:,
+              error: error ? t('simple_form.errors.boolean') : false %>
+<% end %>

site/app/views/lookbook/previews/forms/collection_inputs/_check_boxes.html.erb

@@ -0,0 +1,12 @@
+<%= simple_fields_for nil do |f| %>
+  <%= f.input :check_boxes,
+              as: :check_boxes,
+              collection: [[0, 'Email'], [1, 'Phone (SMS)'], [2, 'Push notification']],
+              label_method: :second,
+              value_method: :first,
+              label: label ? nil : false,
+              checked: 0,
+              disabled:,
+              required:,
+              error: error ? t('simple_form.errors.check_boxes') : false %>
+<% end %>

site/app/views/lookbook/previews/forms/collection_inputs/_radio_buttons.html.erb

@@ -0,0 +1,12 @@
+<%= simple_fields_for nil do |f| %>
+  <%= f.input :radio_buttons,
+              as: :radio_buttons,
+              collection: [[0, 'Email'], [1, 'Phone (SMS)'], [2, 'Push notification']],
+              label_method: :second,
+              value_method: :first,
+              label: label ? nil : false,
+              checked: 0,
+              disabled:,
+              required:,
+              error: error ? t('simple_form.errors.radio_buttons') : false %>
+<% end %>

site/app/views/lookbook/previews/forms/select_inputs/_country.html.erb

@@ -0,0 +1,11 @@
+<%= simple_fields_for nil do |f| %>
+  <%= f.input :country,
+              as: :country,
+              required:,
+              label: label ? nil : false,
+              hint: hint ? nil : false,
+              prompt: prompt ? :translate : false,
+              disabled:,
+              error: error ? t('simple_form.errors.country') : false,
+              selected: error ? t('simple_form.values.country') : false %>
+<% end %>

site/app/views/lookbook/previews/forms/select_inputs/_select.html.erb

@@ -0,0 +1,11 @@
+<%= simple_fields_for nil do |f| %>
+  <%= f.input :select,
+              collection: collection_for(:select),
+              required:,
+              label: label ? nil : false,
+              hint: hint ? nil : false,
+              prompt: prompt ? :translate : false,
+              disabled:,
+              error: error ? t('simple_form.errors.select') : false,
+              selected: disabled || error ? t('simple_form.values.select') : false %>
+<% end %>

site/app/views/lookbook/previews/forms/text_inputs/_decimal.html.erb

@@ -0,0 +1,11 @@
+<%= simple_fields_for nil do |f| %>
+  <%= f.input :decimal,
+              as: :decimal,
+              required:,
+              label: label ? nil : false,
+              hint: hint ? nil : false,
+              placeholder: placeholder ? nil : false,
+              disabled:,
+              error: error ? t('simple_form.errors.decimal') : false,
+              input_html: { value: disabled || error ? t('simple_form.values.decimal') : false } %>
+<% end %>

site/app/views/lookbook/previews/forms/text_inputs/_email.html.erb

@@ -0,0 +1,11 @@
+<%= simple_fields_for nil do |f| %>
+  <%= f.input :email,
+              as: :email,
+              required:,
+              label: label ? nil : false,
+              hint: hint ? nil : false,
+              placeholder: placeholder ? nil : false,
+              disabled:,
+              error: error ? t('simple_form.errors.email') : false,
+              input_html: { value: disabled || error ? t('simple_form.values.email') : false } %>
+<% end %>

site/app/views/lookbook/previews/forms/text_inputs/_float.html.erb

@@ -0,0 +1,11 @@
+<%= simple_fields_for nil do |f| %>
+  <%= f.input :float,
+              as: :float,
+              required:,
+              label: label ? nil : false,
+              hint: hint ? nil : false,
+              placeholder: placeholder ? nil : false,
+              disabled:,
+              error: error ? t('simple_form.errors.float') : false,
+              input_html: { value: disabled || error ? t('simple_form.values.float') : false } %>
+<% end %>

site/app/views/lookbook/previews/forms/text_inputs/_integer.html.erb

@@ -0,0 +1,11 @@
+<%= simple_fields_for nil do |f| %>
+  <%= f.input :integer,
+              as: :integer,
+              required:,
+              label: label ? nil : false,
+              hint: hint ? nil : false,
+              placeholder: placeholder ? nil : false,
+              disabled:,
+              error: error ? t('simple_form.errors.integer') : false,
+              input_html: { value: disabled || error ? t('simple_form.values.integer') : false } %>
+<% end %>

site/app/views/lookbook/previews/forms/text_inputs/_password.html.erb

@@ -0,0 +1,11 @@
+<%= simple_fields_for nil do |f| %>
+  <%= f.input :password,
+              as: :password,
+              required:,
+              label: label ? nil : false,
+              hint: hint ? nil : false,
+              placeholder: placeholder ? nil : false,
+              disabled:,
+              error: error ? t('simple_form.errors.password') : false,
+              input_html: { value: disabled || error ? t('simple_form.values.password') : false } %>
+<% end %>

site/app/views/lookbook/previews/forms/text_inputs/_string.html.erb

@@ -0,0 +1,11 @@
+<%= simple_fields_for nil do |f| %>
+  <%= f.input :string,
+              as: :string,
+              required:,
+              label: label ? nil : false,
+              hint: hint ? nil : false,
+              placeholder: placeholder ? nil : false,
+              disabled:,
+              error: error ? t('simple_form.errors.string') : false,
+              input_html: { value: disabled || error ? t('simple_form.values.string') : false } %>
+<% end %>

site/app/views/lookbook/previews/forms/text_inputs/_tel.html.erb

@@ -0,0 +1,11 @@
+<%= simple_fields_for nil do |f| %>
+  <%= f.input :tel,
+              as: :tel,
+              required:,
+              label: label ? nil : false,
+              hint: hint ? nil : false,
+              placeholder: placeholder ? nil : false,
+              disabled:,
+              error: error ? t('simple_form.errors.tel') : false,
+              input_html: { value: disabled || error ? t('simple_form.values.tel') : false } %>
+<% end %>

site/app/views/lookbook/previews/forms/text_inputs/_url.html.erb

@@ -0,0 +1,11 @@
+<%= simple_fields_for nil do |f| %>
+  <%= f.input :url,
+              as: :url,
+              required:,
+              label: label ? nil : false,
+              hint: hint ? nil : false,
+              placeholder: placeholder ? nil : false,
+              disabled:,
+              error: error ? t('simple_form.errors.url') : false,
+              input_html: { value: disabled || error ? t('simple_form.values.url') : false } %>
+<% end %>

site/config/application.rb

@@ -24,9 +24,6 @@ module Site
   class Application < Rails::Application
     config.load_defaults Rails::VERSION::STRING.to_f
 
-    # For compatibility with applications that use this config
-    config.action_controller.include_all_helpers = false
-
     # Please, add to the `ignore` list any other `lib` subdirectories that do
     # not contain `.rb` files, or that should not be reloaded or eager loaded.
     # Common ones are `templates`, `generators`, or `middleware`, for example.
@@ -51,7 +48,8 @@ def fetch_asset_files(data)
         end
       end
 
-      asset_panel_config = {
+      Lookbook.define_panel(
+        'assets',
         label: 'Assets',
         partial: 'lookbook/panels/assets',
         hotkey: 'a',
@@ -64,8 +62,7 @@ def fetch_asset_files(data)
 
           { assets: }
         end
-      }
-      Lookbook.define_panel('assets', asset_panel_config)
+      )
 
       config.lookbook.project_name                     = "Beyond Essence v#{BeyondEssence::VERSION}"
       config.lookbook.component_paths                  = [BeyondEssence::Engine.root.join('app/components')]

site/config/locales/en.yml

@@ -1,31 +1,68 @@
-# Files in the config/locales directory are used for internationalization and
-# are automatically loaded by Rails. If you want to use locales other than
-# English, add the necessary files in this directory.
-#
-# To use the locales, use `I18n.t`:
-#
-#     I18n.t "hello"
-#
-# In views, this is aliased to just `t`:
-#
-#     <%= t("hello") %>
-#
-# To use a different locale, set it with `I18n.locale`:
-#
-#     I18n.locale = :es
-#
-# This would use the information in config/locales/es.yml.
-#
-# To learn more about the API, please read the Rails Internationalization guide
-# at https://guides.rubyonrails.org/i18n.html.
-#
-# Be aware that YAML interprets the following case-insensitive strings as
-# booleans: `true`, `false`, `on`, `off`, `yes`, `no`. Therefore, these strings
-# must be quoted to be interpreted as strings. For example:
-#
-#     en:
-#       "yes": yup
-#       enabled: "ON"
-
 en:
-  hello: "Hello world"
+  simple_form:
+    errors:
+      boolean: 'You must accept the terms and conditions.'
+      check_boxes: 'Not a valid option.'
+      country: 'Not a valid country.'
+      email: 'Enter a valid email.'
+      float: 'Enter a valid height.'
+      decimal: 'Enter a valid price.'
+      integer: 'Enter a valid age.'
+      password: 'Enter a valid password.'
+      radio_buttons: 'Not a valid option.'
+      select: 'Not a valid gender.'
+      string: 'Enter a valid name.'
+      tel: 'Enter a valid phone number.'
+      url: 'Enter a valid URL.'
+    values:
+      country: 'ES'
+      email: 'you@example'
+      float: '3.67'
+      decimal: '1234.56'
+      integer: '30.5'
+      password: 'password'
+      select: 'female'
+      string: 'John'
+      tel: '123456789'
+      url: 'https:/example.com'
+    labels:
+      defaults:
+        boolean: 'Accept terms and conditions'
+        check_boxes: 'Notifications'
+        country: 'Country'
+        decimal: 'Price'
+        email: 'Email'
+        float: 'Height'
+        integer: 'Age'
+        password: 'Password'
+        radio_buttons: 'Notifications'
+        select: 'Gender'
+        string: 'Name'
+        tel: 'Phone number'
+        url: 'Website URL'
+    hints:
+      defaults:
+        country: 'Choose the country where you reside or operate.'
+        decimal: 'Enter the amount in dollars and cents (e.g., 1234.56).'
+        email: 'Make sure to include "@" and a domain name (e.g., ".com", ".org").'
+        float: 'Enter the height in meters and centimeters (e.g., 1.75).'
+        integer: 'Age should be a whole number without any decimal points.'
+        password: 'Password must be at least 8 characters long and contain a mix of letters and numbers.'
+        select: 'Choose a gender with which you identify.'
+        string: 'Enter your first name and last name.'
+        tel: 'Please include your country code.'
+        url: 'Include http:// or https:// in the URL.'
+    placeholders:
+      defaults:
+        decimal: '1234.56'
+        email: 'you@example.com'
+        float: '1.75'
+        integer: '30'
+        password: 'Password123!'
+        string: 'John Doe'
+        tel: '+1234567890'
+        url: 'https://www.example.com'
+    prompts:
+      defaults:
+        country: 'Select your country'
+        select: 'Select your gender'

spec/components/previews/forms/boolean_inputs/boolean_preview.rb

@@ -0,0 +1,23 @@
+# frozen_string_literal: true
+
+module Forms
+  module BooleanInputs
+    #
+    # @display wrapper card
+    #
+    class BooleanPreview < Lookbook::Preview
+      #
+      # @param required toggle
+      # @param label toggle
+      # @param disabled toggle
+      # @param error toggle
+      #
+      def base(required: true,
+               label: true,
+               disabled: false,
+               error: false)
+        render 'lookbook/previews/forms/boolean_inputs/boolean', required:, disabled:, label:, error:
+      end
+    end
+  end
+end

spec/components/previews/forms/collection_inputs/check_boxes_preview.rb

@@ -0,0 +1,23 @@
+# frozen_string_literal: true
+
+module Forms
+  module CollectionInputs
+    #
+    # @display wrapper card
+    #
+    class CheckBoxesPreview < Lookbook::Preview
+      #
+      # @param required toggle
+      # @param label toggle
+      # @param disabled toggle
+      # @param error toggle
+      #
+      def base(required: true,
+               label: true,
+               disabled: false,
+               error: false)
+        render 'lookbook/previews/forms/collection_inputs/check_boxes', required:, disabled:, label:, error:
+      end
+    end
+  end
+end