simple_form-theme 0.1.0 → 0.1.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 5e275530d19251b93ce0131fa8f50fde91594a5dc39cc5d3cc6a9e120218d86f
-  data.tar.gz: d1c5054ad31b75e7275773414d3fc773bf51b18b8a03ee33bf887fdb3f0887f4
+  metadata.gz: 6d934b32592b1a73bb0bc657301447d61a96ec793002ee096e700b176000120d
+  data.tar.gz: 3a7dcde3dea07205f7f4542d68061fca65f696ebe41c17eab3c059fb1029b8e6
 SHA512:
-  metadata.gz: 32bf9ba67047d0309dff1b7265a295f382067f605fc9112bb1a7a58960d62e2b94e25435994659750e2c68801049964b06250e527b8fad49a7b55490ecb53420
-  data.tar.gz: 43c9616ac3ae8c74bd5a76e273d4dce6093d8e6c54c38775b672ca51be9c3d605d9870938f24f8ceeec012ee837a1c542f4d21c2712a841d6aa258abe04e3dee
+  metadata.gz: 4cfd8957eb26b23fa26fd3d981c28d08f21c3c9b7955feac799380f1a2f9421d8b9723c160e124544fa88f5902eb52eb237ffa91a8a0e98a476530a825c76d4c
+  data.tar.gz: b49bffcde5d65de881e966d0c36da9fc953ac0c09b451d517151a05fe40d7f9a23b48b7b0bc7488382395f8ec4b0899bab5742ac54ba393c123d15bef256d8b8

data/README.md

@@ -1,8 +1,11 @@
+[![Gem Version](https://badge.fury.io/rb/simple_form-theme.svg)](https://badge.fury.io/rb/simple_form-theme)
+
 # SimpleForm::Theme
 Short description and motivation.
 
-## Usage
-How to use my plugin.
+### Supported CSS Frameworks
+* [Tailwind CSS](https://tailwindcss.com/docs/installation)
+* [Bulma](https://bulma.io/documentation/start/installation)
 
 ## Installation
 Add this line to your application's Gemfile:
@@ -13,16 +16,40 @@ gem 'simple_form-theme'
 
 And then execute:
 ```bash
-$ bundle
+bundle
+```
+
+As an alternative instead of adding an additional dependency to your project,
+you can copy the initializer file to your project from the GitHub repository.
+
+Example:
+```bash
+cp lib/generators/simple_form/theme/templates/config/initializers/simple_form_tailwindcss.rb yourapp/config/initializers/simple_form_tailwindcss.rb
+```
+
+However, if you install the gem, you will get the latest updates and improvements.
+
+## Requirements
+
+* Make sure you have installed [simple_form](https://github.com/heartcombo/simple_form) gem.
+* Make sure you have installed the decired css framework.
+
+## Usage
+
+### Install Tailwind CSS initializer
+
+```bash
+bin/rails generate simple_form:theme:tailwind install
 ```
 
-Or install it yourself as:
+### Install Bulma CSS initializer
+
 ```bash
-$ gem install simple_form-theme
+bin/rails generate simple_form:theme:bulma install
 ```
 
 ## Contributing
-Contribution directions go here.
+Bug reports and pull requests are welcome on GitHub at https://github.com/JuanVqz/simple_form-theme
 
 ## License
 The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).

data/config/initializers/simple_form.rb

@@ -0,0 +1,176 @@
+# frozen_string_literal: true
+#
+# Uncomment this and change the path if necessary to include your own
+# components.
+# See https://github.com/heartcombo/simple_form#custom-components to know
+# more about custom components.
+# Dir[Rails.root.join('lib/components/**/*.rb')].each { |f| require f }
+#
+# Use this setup block to configure all options available in SimpleForm.
+SimpleForm.setup do |config|
+  # Wrappers are used by the form builder to generate a
+  # complete input. You can remove any component from the
+  # wrapper, change the order or even add your own to the
+  # stack. The options given below are used to wrap the
+  # whole input.
+  config.wrappers :default, class: :input,
+    hint_class: :field_with_hint, error_class: :field_with_errors, valid_class: :field_without_errors do |b|
+    ## Extensions enabled by default
+    # Any of these extensions can be disabled for a
+    # given input by passing: `f.input EXTENSION_NAME => false`.
+    # You can make any of these extensions optional by
+    # renaming `b.use` to `b.optional`.
+
+    # Determines whether to use HTML5 (:email, :url, ...)
+    # and required attributes
+    b.use :html5
+
+    # Calculates placeholders automatically from I18n
+    # You can also pass a string as f.input placeholder: "Placeholder"
+    b.use :placeholder
+
+    ## Optional extensions
+    # They are disabled unless you pass `f.input EXTENSION_NAME => true`
+    # to the input. If so, they will retrieve the values from the model
+    # if any exists. If you want to enable any of those
+    # extensions by default, you can change `b.optional` to `b.use`.
+
+    # Calculates maxlength from length validations for string inputs
+    # and/or database column lengths
+    b.optional :maxlength
+
+    # Calculate minlength from length validations for string inputs
+    b.optional :minlength
+
+    # Calculates pattern from format validations for string inputs
+    b.optional :pattern
+
+    # Calculates min and max from length validations for numeric inputs
+    b.optional :min_max
+
+    # Calculates readonly automatically from readonly attributes
+    b.optional :readonly
+
+    ## Inputs
+    # b.use :input, class: 'input', error_class: 'is-invalid', valid_class: 'is-valid'
+    b.use :label_input
+    b.use :hint,  wrap_with: { tag: :span, class: :hint }
+    b.use :error, wrap_with: { tag: :span, class: :error }
+
+    ## full_messages_for
+    # If you want to display the full error message for the attribute, you can
+    # use the component :full_error, like:
+    #
+    # b.use :full_error, wrap_with: { tag: :span, class: :error }
+  end
+
+  # The default wrapper to be used by the FormBuilder.
+  config.default_wrapper = :default
+
+  # Define the way to render check boxes / radio buttons with labels.
+  # Defaults to :nested for bootstrap config.
+  #   inline: input + label
+  #   nested: label > input
+  config.boolean_style = :nested
+
+  # Default class for buttons
+  config.button_class = 'btn'
+
+  # Method used to tidy up errors. Specify any Rails Array method.
+  # :first lists the first message for each field.
+  # Use :to_sentence to list all errors for each field.
+  # config.error_method = :first
+
+  # Default tag used for error notification helper.
+  config.error_notification_tag = :div
+
+  # CSS class to add for error notification helper.
+  config.error_notification_class = 'error_notification'
+
+  # Series of attempts to detect a default label method for collection.
+  # config.collection_label_methods = [ :to_label, :name, :title, :to_s ]
+
+  # Series of attempts to detect a default value method for collection.
+  # config.collection_value_methods = [ :id, :to_s ]
+
+  # You can wrap a collection of radio/check boxes in a pre-defined tag, defaulting to none.
+  # config.collection_wrapper_tag = nil
+
+  # You can define the class to use on all collection wrappers. Defaulting to none.
+  # config.collection_wrapper_class = nil
+
+  # You can wrap each item in a collection of radio/check boxes with a tag,
+  # defaulting to :span.
+  # config.item_wrapper_tag = :span
+
+  # You can define a class to use in all item wrappers. Defaulting to none.
+  # config.item_wrapper_class = nil
+
+  # How the label text should be generated altogether with the required text.
+  # config.label_text = lambda { |label, required, explicit_label| "#{required} #{label}" }
+
+  # You can define the class to use on all labels. Default is nil.
+  # config.label_class = nil
+
+  # You can define the default class to be used on forms. Can be overridden
+  # with `html: { :class }`. Defaulting to none.
+  # config.default_form_class = nil
+
+  # You can define which elements should obtain additional classes
+  # config.generate_additional_classes_for = [:wrapper, :label, :input]
+
+  # Whether attributes are required by default (or not). Default is true.
+  # config.required_by_default = true
+
+  # Tell browsers whether to use the native HTML5 validations (novalidate form option).
+  # These validations are enabled in SimpleForm's internal config but disabled by default
+  # in this configuration, which is recommended due to some quirks from different browsers.
+  # To stop SimpleForm from generating the novalidate option, enabling the HTML5 validations,
+  # change this configuration to true.
+  config.browser_validations = false
+
+  # Custom mappings for input types. This should be a hash containing a regexp
+  # to match as key, and the input type that will be used when the field name
+  # matches the regexp as value.
+  # config.input_mappings = { /count/ => :integer }
+
+  # Custom wrappers for input types. This should be a hash containing an input
+  # type as key and the wrapper that will be used for all inputs with specified type.
+  # config.wrapper_mappings = { string: :prepend }
+
+  # Namespaces where SimpleForm should look for custom input classes that
+  # override default inputs.
+  # config.custom_inputs_namespaces << "CustomInputs"
+
+  # Default priority for time_zone inputs.
+  # config.time_zone_priority = nil
+
+  # Default priority for country inputs.
+  # config.country_priority = nil
+
+  # When false, do not use translations for labels.
+  # config.translate_labels = true
+
+  # Automatically discover new inputs in Rails' autoload path.
+  # config.inputs_discovery = true
+
+  # Cache SimpleForm inputs discovery
+  # config.cache_discovery = !Rails.env.development?
+
+  # Default class for inputs
+  # config.input_class = nil
+
+  # Define the default class of the input wrapper of the boolean input.
+  config.boolean_label_class = 'checkbox'
+
+  # Defines if the default input wrapper class should be included in radio
+  # collection wrappers.
+  # config.include_default_input_wrapper_class = true
+
+  # Defines which i18n scope will be used in Simple Form.
+  # config.i18n_scope = 'simple_form'
+
+  # Defines validation classes to the input_field. By default it's nil.
+  # config.input_field_valid_class = 'is-valid'
+  # config.input_field_error_class = 'is-invalid'
+end

data/lib/generators/simple_form/theme/bulma/USAGE

@@ -0,0 +1,8 @@
+Description:
+    Install the simple form bulma config file in your app.
+
+Example:
+    bin/rails generate simple_form:theme:bulma install
+
+    This will create:
+        config/initializers/simple_form_bulma.rb

data/lib/generators/simple_form/theme/bulma/bulma_generator.rb

@@ -0,0 +1,10 @@
+# frozen_string_literal: true
+
+class SimpleForm::Theme::BulmaGenerator < Rails::Generators::NamedBase
+  source_root File.expand_path('templates', __dir__)
+
+  desc 'Copy the bulma initializer file for simple_form'
+  def copy_initializer_file
+    template 'config/initializers/simple_form_bulma.rb', 'config/initializers/simple_form_bulma.rb'
+  end
+end

data/lib/generators/simple_form/theme/bulma/templates/config/initializers/simple_form_bulma.rb

@@ -0,0 +1,126 @@
+# frozen_string_literal: true
+
+# Use this setup block to configure all options available in SimpleForm.
+SimpleForm.setup do |config|
+  # Default class for buttons
+  config.button_class = 'button'
+
+  # Define the default class of the input wrapper of the boolean input.
+  config.boolean_label_class = 'checkbox'
+
+  # How the label text should be generated altogether with the required text.
+  config.label_text = ->(label, required, _explicit_label) { "#{label} #{required}" }
+
+  # Define the way to render check boxes / radio buttons with labels.
+  config.boolean_style = :inline
+
+  # You can wrap each item in a collection of radio/check boxes with a tag
+  config.item_wrapper_tag = :div
+
+  # Defines if the default input wrapper class should be included in radio
+  # collection wrappers.
+  config.include_default_input_wrapper_class = false
+
+  # CSS class to add for error notification helper.
+  config.error_notification_class = 'notification is-danger'
+
+  # Method used to tidy up errors. Specify any Rails Array method.
+  # :first lists the first message for each field.
+  # :to_sentence to list all errors for each field.
+  config.error_method = :to_sentence
+
+  # add validation classes to `input_field`
+  config.input_field_error_class = 'is-danger'
+  config.input_field_valid_class = 'is-success'
+
+  # vertical forms
+  #
+  # bulma vertical default_wrapper
+  config.wrappers :vertical_form, tag: 'div', class: 'field' do |b|
+    b.use :html5
+    b.use :placeholder
+    b.optional :maxlength
+    b.optional :minlength
+    b.optional :pattern
+    b.optional :min_max
+    b.optional :readonly
+    b.use :label, class: 'label'
+    b.use :input, class: 'input', wrap_with: { tag: 'div', class: 'control' }, error_class: 'is-danger', valid_class: 'is-success'
+    b.use :full_error, wrap_with: { tag: 'div', class: 'help is-danger' }
+    b.use :hint, wrap_with: { tag: 'small', class: 'form-text text-muted' }
+  end
+
+  # bulma vertical select_form
+  config.wrappers :select_form, tag: 'div', class: 'control' do |b|
+    b.use :html5
+    b.use :placeholder
+    b.optional :pattern
+    b.optional :readonly
+    b.use :input, wrap_with: { tag: 'div', class: 'select' }
+    b.use :full_error, wrap_with: { tag: 'div', class: 'help is-danger' }
+    b.use :hint, wrap_with: { tag: 'small', class: 'form-text text-muted' }
+  end
+
+  # bulma extension vertical input for boolean
+  config.wrappers :vertical_boolean, tag: 'div', class: 'field' do |b|
+    b.use :html5
+    b.optional :readonly
+    b.use :input, class: 'is-checkradio is-info'
+    b.use :label
+    # b.wrapper :form_check_wrapper, tag: 'div', class: 'control' do |bb|
+    #   bb.use :input, wrap_with: { tag: 'label', class: 'checkbox' }
+    #   bb.use :label, class: 'checkbox'
+    #   bb.use :full_error, wrap_with: { tag: 'div', class: 'help is-danger' }
+    #   bb.use :hint, wrap_with: { tag: 'small', class: 'form-text text-muted' }
+    # end
+  end
+
+  ## vertical input for radio buttons and check boxes
+  config.wrappers :vertical_collection, item_wrapper_class: 'form-check', tag: 'fieldset', class: 'form-group', error_class: 'form-group-invalid', valid_class: 'form-group-valid' do |b|
+    b.use :html5
+    b.optional :readonly
+    b.wrapper :legend_tag, tag: 'legend', class: 'col-form-label pt-0' do |ba|
+      ba.use :label_text
+    end
+    b.use :input, class: 'form-check-input', error_class: 'is-invalid', valid_class: 'is-valid'
+    b.use :full_error, wrap_with: { tag: 'div', class: 'invalid-feedback d-block' }
+    b.use :hint, wrap_with: { tag: 'small', class: 'form-text text-muted' }
+  end
+
+  ## bulma vertical file input
+  config.wrappers :vertical_file, tag: 'div', class: 'file' do |b|
+    b.use :html5
+    b.optional :readonly
+    b.use :input, class: 'file-input', wrap_with: { tag: 'label', class: 'file-label' }
+    b.use :full_error, wrap_with: { tag: 'div', class: 'invalid-feedback d-block' }
+    b.use :hint, wrap_with: { tag: 'small', class: 'form-text text-muted' }
+  end
+
+  ## bulma vertical multi select
+  config.wrappers :vertical_multi_select, tag: 'div', class: 'field' do |b|
+    b.use :html5
+    b.optional :readonly
+    b.use :label, class: 'label'
+    b.wrapper tag: 'div', class: 'control' do |ba|
+      ba.use :input, class: 'input', error_class: 'is-danger', valid_class: 'is-success'
+    end
+    b.use :full_error, wrap_with: { tag: 'div', class: 'is-danger' }
+    b.use :hint, wrap_with: { tag: 'small', class: 'help' }
+  end
+
+  # The default wrapper to be used by the FormBuilder.
+  config.default_wrapper = :vertical_form
+
+  # Custom wrappers for input types. This should be a hash containing an input
+  # type as key and the wrapper that will be used for all inputs with specified type.
+  config.wrapper_mappings = {
+    boolean: :vertical_boolean,
+    check_boxes: :vertical_collection,
+    date: :vertical_multi_select,
+    datetime: :vertical_multi_select,
+    file: :vertical_file,
+    radio_buttons: :vertical_collection,
+    range: :vertical_range,
+    time: :vertical_multi_select
+  }
+end

data/lib/generators/simple_form/theme/tailwind/USAGE

@@ -0,0 +1,8 @@
+Description:
+    Install the simple form tailwindcss config file in your app.
+
+Example:
+    bin/rails generate simple_form:theme:tailwind install
+
+    This will create:
+        config/initializers/simple_form_tailwindcss.rb

data/lib/generators/simple_form/theme/tailwind/tailwind_generator.rb

@@ -0,0 +1,10 @@
+# frozen_string_literal: true
+
+class SimpleForm::Theme::TailwindGenerator < Rails::Generators::NamedBase
+  source_root File.expand_path('templates', __dir__)
+
+  desc 'Copy the tailwindcss initializer file for simple_form'
+  def copy_initializer_file
+    template 'config/initializers/simple_form_tailwindcss.rb', 'config/initializers/simple_form_tailwindcss.rb'
+  end
+end

data/lib/generators/simple_form/theme/tailwind/templates/config/initializers/simple_form_tailwindcss.rb

@@ -0,0 +1,161 @@
+# frozen_string_literal: true
+
+# Use this setup block to configure all options available in SimpleForm.
+SimpleForm.setup do |config|
+  config.wrappers :vertical_form, tag: :div, class: 'mb-4' do |b|
+    b.use :html5
+    b.use :placeholder
+    b.optional :maxlength
+    b.optional :minlength
+    b.optional :pattern
+    b.optional :min_max
+    b.optional :readonly
+    b.use :label, class: 'block mb-2 text-sm font-medium text-gray-900 dark:text-white'
+    b.use :input,
+          class: 'bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500',
+          error_class: 'bg-red-50 border-red-500 text-red-900 placeholder-red-700 focus:ring-red-500 dark:bg-gray-700 focus:border-red-500 dark:text-red-500 dark:placeholder-red-500 dark:border-red-500',
+          valid_class: 'bg-green-50 border-green-500 text-green-900 dark:text-green-400 placeholder-green-700 dark:placeholder-green-500 focus:ring-green-500 focus:border-green-500 dark:bg-gray-700 dark:border-green-500'
+    b.use :full_error, wrap_with: { tag: :p, class: 'mt-2 text-sm text-red-600 dark:text-red-600' }
+    b.use :hint, wrap_with: { tag: :small, class: 'text-sm text-gray-400 dark:text-gray-400' }
+  end
+
+  # vertical input for radio buttons and check boxes
+  config.wrappers :vertical_collection, item_wrapper_class: 'form-check',
+                                        item_label_class: 'form-check-label',
+                                        tag: :fieldset,
+                                        class: 'form-group mb-3',
+                                        error_class: 'form-group-invalid',
+                                        valid_class: 'form-group-valid' do |b|
+    b.use :html5
+    b.optional :readonly
+    b.wrapper :legend_tag, tag: :legend, class: 'col-form-label pt-0' do |ba|
+      ba.use :label_text, class: 'ml-3 block text-sm font-medium text-gray-700'
+    end
+    b.use :input, class: 'focus:ring-indigo-500 h-4 w-4 text-sky-600 border-gray-300 mr-2',
+                  error_class: 'is-invalid border-red-400',
+                  valid_class: 'is-valid'
+    b.use :full_error, wrap_with: { tag: :p, class: 'mt-2 text-sm text-red-600 dark:text-red-600' }
+    b.use :hint, wrap_with: { tag: :small, class: 'text-gray-400' }
+  end
+
+  # vertical input for radio buttons and check boxes
+  # config.wrappers :vertical_check_boxes_collection, item_wrapper_class: 'form-check',
+  #                                                   item_label_class: 'form-check-label',
+  #                                                   tag: 'fieldset', class: 'form-group mb-3',
+  #                                                   error_class: 'form-group-invalid',
+  #                                                   valid_class: 'form-group-valid' do |b|
+  #   b.use :html5
+  #   b.optional :readonly
+  #   b.wrapper :legend_tag, tag: 'legend', class: 'col-form-label pt-0' do |ba|
+  #     ba.use :label_text, class: 'ml-3 block text-sm font-medium text-gray-700'
+  #   end
+  #   b.use :input, class: 'focus:ring-indigo-500 h-4 w-4 text-sky-600 border-gray-300 rounded mr-2',
+  #                 error_class: 'is-invalid border-red-400',
+  #                 valid_class: 'is-valid'
+  #   b.use :full_error, wrap_with: {tag: :p, class: "mt-2 text-sm text-red-600 dark:text-red-600"}
+  #   b.use :hint, wrap_with: { tag: :small, class: 'text-gray-400' }
+  # end
+
+  # horizontal input for inline radio buttons and check boxes
+  config.wrappers :horizontal_collection_inline, item_wrapper_class: 'form-check form-check-inline',
+                                                 item_label_class: 'form-check-label',
+                                                 tag: :div,
+                                                 class: 'form-group flex flex-row-reverse w-fit mb-3',
+                                                 error_class: 'form-group-invalid',
+                                                 valid_class: 'form-group-valid' do |b|
+    b.use :html5
+    b.optional :readonly
+    b.use :label, class: 'pt-0 mb-2'
+    b.wrapper :grid_wrapper, tag: :div do |ba|
+      ba.use :input, class: 'focus:ring-indigo-500 h-4 w-4 text-sky-600 border-gray-300 rounded mr-2',
+                     error_class: 'is-invalid', valid_class: 'is-valid'
+      ba.use :full_error, wrap_with: { tag: :p, class: 'mt-2 text-sm text-red-600 dark:text-red-600' }
+      ba.use :hint, wrap_with: { tag: :small, class: 'text-gray-400' }
+    end
+  end
+
+  # vertical multi select
+  config.wrappers :vertical_multi_select, tag: :div, class: 'mb-4' do |b|
+    b.use :html5
+    b.optional :readonly
+    b.use :label, class: 'block mb-2 text-sm font-medium text-gray-900 dark:text-white'
+    b.wrapper tag: :div, class: 'flex flex-col md:flex-row gap-1 justify-between items-center' do |ba|
+      ba.use :input,
+             class: 'bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500',
+             error_class: 'bg-red-50 border-red-500 text-red-900 placeholder-red-700 focus:ring-red-500 dark:bg-gray-700 focus:border-red-500 dark:text-red-500 dark:placeholder-red-500 dark:border-red-500',
+             valid_class: 'bg-green-50 border-green-500 text-green-900 dark:text-green-400 placeholder-green-700 dark:placeholder-green-500 focus:ring-green-500 focus:border-green-500 dark:bg-gray-700 dark:border-green-500'
+    end
+    b.use :full_error, wrap_with: { tag: :p, class: 'mt-2 text-sm text-red-600 dark:text-red-600' }
+    b.use :hint, wrap_with: { tag: :small, class: 'text-gray-400' }
+  end
+
+  # vertical input for boolean
+  config.wrappers :vertical_boolean, tag: :fieldset, class: 'mb-3',
+                                     error_class: 'form-group-invalid',
+                                     valid_class: 'form-group-valid' do |b|
+    b.use :html5
+    b.optional :readonly
+    b.wrapper :form_check_wrapper, tag: 'div' do |bb|
+      bb.use :input, class: 'focus:ring-indigo-500 h-4 w-4 text-sky-600 border-gray-300 rounded mr-2',
+                     error_class: '!border-red-500',
+                     valid_class: 'is-valid'
+      bb.use :label, class: 'mb-2'
+    end
+    b.use :full_error, wrap_with: { tag: :p, class: 'mt-2 text-sm text-red-600 dark:text-red-600' }
+    b.use :hint, wrap_with: { tag: :small, class: 'text-gray-400' }
+  end
+
+  # vertical file input
+  config.wrappers :vertical_file, tag: :div, class: 'mb-4' do |b|
+    b.use :html5
+    b.use :placeholder
+    b.optional :maxlength
+    b.optional :minlength
+    b.optional :readonly
+    b.use :label, class: 'block mb-2 text-sm font-medium text-gray-900 dark:text-white'
+    b.use :input,
+          class: 'block w-full text-sm text-gray-900 border border-gray-300 rounded-lg cursor-pointer bg-gray-50 dark:text-gray-400 focus:outline-none dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400',
+          error_class: 'bg-red-50 border-red-500 text-red-900 placeholder-red-700 focus:ring-red-500 dark:bg-gray-700 focus:border-red-500 dark:text-red-500 dark:placeholder-red-500 dark:border-red-500',
+          valid_class: 'bg-green-50 border-green-500 text-green-900 dark:text-green-400 placeholder-green-700 dark:placeholder-green-500 focus:ring-green-500 focus:border-green-500 dark:bg-gray-700 dark:border-green-500'
+    b.use :full_error, wrap_with: { tag: :p, class: 'mt-2 text-sm text-red-600 dark:text-red-600' }
+    b.use :hint, wrap_with: { tag: :small, class: 'text-sm text-gray-400 dark:text-gray-400' }
+  end
+
+  # Custom wrappers for input types. This should be a hash containing an input
+  # type as key and the wrapper that will be used for all inputs with specified type.
+  config.wrapper_mappings = {
+    boolean: :vertical_boolean,
+    check_boxes: :vertical_collection,
+    date: :vertical_multi_select,
+    file: :vertical_file,
+    datetime: :vertical_multi_select,
+    radio_buttons: :vertical_collection,
+    time: :vertical_multi_select
+  }
+
+  # How the label text should be generated altogether with the required text.
+  config.label_text = ->(label, required, _explicit_label) { "#{label} #{required}" }
+
+  # CSS class for buttons
+  config.button_class = 'text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 dark:bg-blue-600 dark:hover:bg-blue-700 focus:outline-none dark:focus:ring-blue-800'
+
+  # Set this to div to make the checkbox and radio properly work
+  # otherwise simple_form adds a label tag instead of a div around
+  # the nested label
+  config.item_wrapper_tag = :div
+
+  # CSS class to add for error notification helper.
+  config.error_notification_class = 'bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded'
+
+  # Method used to tidy up errors. Specify any Rails Array method.
+  # :first lists the first message for each field.
+  # :to_sentence to list all errors for each field.
+  config.error_method = :to_sentence
+
+  # The default wrapper to be used by the FormBuilder.
+  config.default_wrapper = :vertical_form
+
+  # add validation classes to `input_field`
+  config.input_field_error_class = 'bg-red-50'
+  config.input_field_valid_class = 'bg-green-50'
+end

data/lib/simple_form/theme/version.rb

@@ -1,5 +1,5 @@
 module SimpleForm
   module Theme
-    VERSION = '0.1.0'
+    VERSION = '0.1.2'
   end
 end

data/lib/simple_form/theme.rb

@@ -1,7 +1,12 @@
-require "simple_form/theme/version"
-require "simple_form/theme/engine"
+# frozen_string_literal: true
+
+require 'simple_form/theme/version'
+require 'simple_form/theme/engine'
+
+require 'simple_form'
 
 module SimpleForm
+  # SimpleFormTheme
   module Theme
     # Your code goes here...
   end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: simple_form-theme
 version: !ruby/object:Gem::Version
-  version: 0.1.0
+  version: 0.1.2
 platform: ruby
 authors:
 - Juan Vasquez
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2024-06-28 00:00:00.000000000 Z
+date: 2024-07-06 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -62,7 +62,14 @@ files:
 - app/mailers/simple_form/theme/application_mailer.rb
 - app/models/simple_form/theme/application_record.rb
 - app/views/layouts/simple_form/theme/application.html.erb
+- config/initializers/simple_form.rb
 - config/routes.rb
+- lib/generators/simple_form/theme/bulma/USAGE
+- lib/generators/simple_form/theme/bulma/bulma_generator.rb
+- lib/generators/simple_form/theme/bulma/templates/config/initializers/simple_form_bulma.rb
+- lib/generators/simple_form/theme/tailwind/USAGE
+- lib/generators/simple_form/theme/tailwind/tailwind_generator.rb
+- lib/generators/simple_form/theme/tailwind/templates/config/initializers/simple_form_tailwindcss.rb
 - lib/simple_form/theme.rb
 - lib/simple_form/theme/engine.rb
 - lib/simple_form/theme/version.rb
@@ -89,7 +96,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.2.3
+rubygems_version: 3.1.6
 signing_key: 
 specification_version: 4
 summary: The most modern themes for SimpleForm gem.