ariadne_view_components 0.0.70 → 0.0.71

data/app/components/ariadne/ui/typography/component.rb

@@ -13,8 +13,18 @@ module Ariadne
 
         def tag_name
           case type
-          when :heading
+          when :title
             :h1
+          when :heading
+            :h2
+          when :subheading
+            :h3
+          when :ann
+            :h4
+          when :lead
+            :p
+          when :code
+            :code
           else
             :span
           end
@@ -23,7 +33,7 @@ module Ariadne
         style do
           variants do
             type do
-              heading do
+              title do
                 [
                   "ariadne-scroll-m-20",
                   "ariadne-text-4xl",
@@ -32,6 +42,56 @@ module Ariadne
                   "lg:ariadne-text-5xl",
                 ]
               end
+
+              heading do
+                [
+                  "ariadne-scroll-m-20",
+                  "ariadne-border-b",
+                  "ariadne-pb-2",
+                  "ariadne-text-3xl",
+                  "ariadne-font-semibold",
+                  "ariadne-tracking-tight",
+                  "first:ariadne-mt-0",
+                ]
+              end
+
+              subheading do
+                [
+                  "ariadne-scroll-m-20",
+                  "ariadne-text-2xl",
+                  "ariadne-font-semibold",
+                  "ariadne-tracking-tight",
+                ]
+              end
+
+              ann do
+                [
+                  "ariadne-scroll-m-20",
+                  "ariadne-text-xl",
+                  "ariadne-font-semibold",
+                  "ariadne-tracking-tight",
+                ]
+              end
+
+              lede do
+                [
+                  "ariadne-text-xl",
+                  "ariadne-gray-90",
+                ]
+              end
+
+              code do
+                [
+                  "ariadne-relative",
+                  "ariadne-rounded",
+                  "ariadne-bg-neutral-100",
+                  "ariadne-px-[0.3rem]",
+                  "ariadne-py-[0.2rem]",
+                  "ariadne-font-mono",
+                  "ariadne-text-sm",
+                  "ariadne-font-semibold",
+                ]
+              end
             end
           end
         end

data/app/frontend/ariadne/index.ts

@@ -7,7 +7,6 @@ import '@github/markdown-toolbar-element'
 import '@github/relative-time-element'
 
 import '~/stylesheets/ariadne_view_components.css'
-import '~/stylesheets/typography.css'
 
 import './theme'
 

data/app/frontend/controllers/autosubmittable_controller.ts

@@ -0,0 +1,25 @@
+import {Controller} from '@hotwired/stimulus'
+
+import {useDebounce} from 'stimulus-use'
+
+// can't use controllerFactory because it  seems to conflict with `useDebounce`
+export default class AutoSubmittableController extends Controller<HTMLFormElement> {
+  static debounces = ['save']
+  static targets = ['form']
+  declare readonly formTarget: HTMLFormElement
+  declare readonly formTargets: HTMLFormElement[]
+
+  declare readonly hasFormTarget: boolean
+
+  connect(): void {
+    useDebounce(this)
+  }
+
+  save(): void {
+    if (this.hasFormTarget) {
+      this.formTarget.requestSubmit()
+    } else {
+      this.element.requestSubmit()
+    }
+  }
+}

data/lib/ariadne/forms/base.html.erb

@@ -1,8 +1,7 @@
-<div class="ariadne-flex ariadne-flex-col ariadne-gap-8">
-  <% inputs.each do |input| %>
-    <%= render(input.to_component) %>
-  <% end %>
-</div>
+<% inputs.each do |input| %>
+  <%= render(input.to_component) %>
+<% end %>
+
 <% if after_content? %>
   <%= render_after_content %>
 <% end %>

data/lib/ariadne/forms/dsl/badge.rb

@@ -0,0 +1,35 @@
+# frozen_string_literal: true
+
+module Ariadne
+  module Forms
+    module Dsl
+      # :nodoc:
+      class Badge
+        include InputMethods
+
+        attr_reader :builder, :form, :text, :options
+
+        def initialize(builder:, form:, text:, **options)
+          @builder = builder
+          @form = form
+          @text = text
+          @options = options
+
+          yield(self) if block_given?
+        end
+
+        def to_component
+          Ariadne::UI::Badge::Component.new(text: @text, **@options)
+        end
+
+        def type
+          :group
+        end
+
+        def input?
+          true
+        end
+      end
+    end
+  end
+end

data/lib/ariadne/forms/dsl/button_input.rb

@@ -7,16 +7,17 @@ module Ariadne
       class ButtonInput < Input
         attr_reader :name, :label, :block
 
-        def initialize(name:, label:, **system_arguments, &block)
+        def initialize(name:, label:, **options, &block)
           @name = name
           @label = label
+          @caption = options.delete(:caption)
           @block = block
 
-          super(**system_arguments)
+          super(**options)
         end
 
         def to_component
-          Ariadne::UI::Button::Component.new(label: @label).with_content(@label)
+          Ariadne::UI::Button::Component.new.with_caption(@caption).with_block(@block)
         end
 
         # :nocov:

data/lib/ariadne/forms/dsl/form_object.rb

@@ -20,6 +20,14 @@ module Ariadne
         def group(**options, &block)
           add_input(InputGroup.new(builder: @builder, form: @form, **options, &block))
         end
+
+        def button(**options, &block)
+          add_input(ButtonInput.new(builder: @builder, form: @form, **options, &block))
+        end
+
+        def badge(**options, &block)
+          add_input(Badge.new(builder: @builder, form: @form, **options, &block))
+        end
       end
     end
   end

data/lib/ariadne/forms/dsl/form_reference_input.rb

@@ -0,0 +1,59 @@
+# frozen_string_literal: true
+
+module Ariadne
+  module Forms
+    module Dsl
+      # :nodoc:
+      class FormReferenceInput < Input
+        attr_reader :ref_block, :fields_for_args, :fields_for_kwargs, :nested
+        alias_method :nested?, :nested
+
+        # Pass `nested: false` to prevent the referenced form fields from being treated as nested
+        # under the parent form's model. For example, consider these models:
+
+        # class User < ActiveRecord::Base
+        #   has_many :addresses
+        # end
+
+        # class Address < ActiveRecord::Base
+        #   belongs_to :user
+        # end
+
+        # A sign-up form might include fields from `User` as well as `Address`. Since addresses are
+        # associated with users, it's perfectly natural to accept the address fields as nested
+        # attributes. Rails will name each field accordingly. For example, the `street` field on
+        # `Address` will be named `user[address][street]`.
+
+        # For situations like this where an association exists between two models, the nested
+        # attributes approach works great. However sometimes all you want is to compose two forms
+        # together that aren't connected by an association. In such cases the fields will still
+        # include the name of the parent model, eg. `user[address][street]` instead of what we want,
+        # `address[street]`. To render the form independent of the parent, pass `nested: false`.
+        def initialize(*fields_for_args, builder:, form:, nested: true, **fields_for_kwargs, &block)
+          @fields_for_args = fields_for_args
+          @fields_for_kwargs = fields_for_kwargs
+          @nested = nested
+          @ref_block = block
+
+          super(builder: builder, form: form, **fields_for_kwargs)
+        end
+
+        def to_component
+          Ariadne::Form::FormReference::Component.new(input: self)
+        end
+
+        def name
+          nil
+        end
+
+        def label
+          nil
+        end
+
+        def type
+          :form
+        end
+      end
+    end
+  end
+end

data/lib/ariadne/forms/dsl/hidden_input.rb

@@ -0,0 +1,32 @@
+# frozen_string_literal: true
+
+module Ariadne
+  module Forms
+    module Dsl
+      # :nodoc:
+      class HiddenInput < Input
+        attr_reader :name, :value
+
+        def initialize(name:, value:, **options)
+          @name = name
+          @value = value
+          super(**options)
+        end
+
+        def to_component
+          html_attrs = @input_attributes || {}
+          Ariadne::Form::HiddenField::Component.new(name:, value:, html_attrs: html_attrs)
+        end
+
+        # :nocov:
+        def type
+          :hidden
+        end
+
+        def supports_validation?
+          false
+        end
+      end
+    end
+  end
+end

data/lib/ariadne/forms/dsl/input.rb

@@ -55,7 +55,7 @@ module Ariadne
           @builder = builder
           @form = form
 
-          @options = options
+          @options = options.dup
           @input_attributes = @options.delete(:html_attrs) || {}
           @input_attributes.delete(:id) if @input_attributes[:id].blank?
           @label_attributes = @options[:label_html_attributes] || {}
@@ -70,6 +70,8 @@ module Ariadne
           @label_attributes.delete(:class) if @label_attributes[:class].blank?
 
           @caption = @options.delete(:caption)
+          @placeholder = @options.delete(:placeholder)
+          @disabled = @options.delete(:disabled)
           @validation_message = @options.delete(:validation_message)
           @invalid = @options.delete(:invalid)
           @full_width = @options.delete(:full_width) { true }
@@ -209,7 +211,7 @@ module Ariadne
         end
 
         def disabled?
-          !!@input_attributes[:disabled]
+          @disabled.present?
         end
 
         def size

data/lib/ariadne/forms/dsl/input_group.rb

@@ -9,16 +9,16 @@ module Ariadne
 
         attr_reader :builder, :form, :system_arguments
 
-        def initialize(builder:, form:, **system_arguments)
+        def initialize(builder:, form:, **options)
           @builder = builder
           @form = form
-          @system_arguments = system_arguments
+          @options = options
 
           yield(self) if block_given?
         end
 
         def to_component
-          Ariadne::Form::Group::Component.new(inputs: inputs, builder: builder, form: form, **@system_arguments)
+          Ariadne::Form::Group::Component.new(inputs: inputs, builder: builder, form: form, **@options)
         end
 
         def type

data/lib/ariadne/forms/dsl/radio_button_group_input.rb

@@ -0,0 +1,50 @@
+# frozen_string_literal: true
+
+module Ariadne
+  module Forms
+    module Dsl
+      # :nodoc:
+      class RadioButtonGroupInput < Input
+        attr_reader :name, :label, :radio_buttons
+
+        def initialize(name:, label: nil, **options)
+          @name = name
+          @label = label
+          @radio_buttons = []
+
+          super(**options)
+
+          yield(self) if block_given?
+        end
+
+        def to_component
+          component = Ariadne::Form::RadioButtonGroup::Component.new(name:, label:, **@options)
+          @radio_buttons.each do |radio_button|
+            component.rendered_radio_button(radio_button)
+          end
+          component
+        end
+
+        def type
+          :radio_button_group
+        end
+
+        def autofocus!
+          @radio_buttons.first&.autofocus!
+        end
+
+        def focusable?
+          true
+        end
+
+        def radio_button(**options, &block)
+          @radio_buttons << RadioButtonInput.new(
+            builder: @builder, form: @form, name: @name, disabled: disabled?,
+            **options,
+            &block
+          ).to_component
+        end
+      end
+    end
+  end
+end

data/lib/ariadne/forms/dsl/radio_button_input.rb

@@ -0,0 +1,48 @@
+# frozen_string_literal: true
+
+module Ariadne
+  module Forms
+    module Dsl
+      # :nodoc:
+      class RadioButtonInput < Input
+        attr_reader :name, :value, :label, :nested_form_block, :nested_form_arguments
+
+        def initialize(name:, value:, label:, **options)
+          @name = name
+          @value = value
+          @label = label
+
+          super(**options)
+
+          yield(self) if block_given?
+        end
+
+        # radio buttons cannot be invalid, as both selected and unselected are valid states
+        # :nocov:
+        def valid?
+          true
+        end
+        # :nocov:
+
+        def to_component
+          Ariadne::Form::RadioButton::Component.new(name:, value:, label:, **@options)
+        end
+
+        def nested_form(**system_arguments, &block)
+          @nested_form_arguments = system_arguments
+          @nested_form_block = block
+        end
+
+        # :nocov:
+        def type
+          :radio_button
+        end
+        # :nocov:
+
+        def supports_validation?
+          false
+        end
+      end
+    end
+  end
+end

data/lib/ariadne/forms/dsl/text_field_input.rb

@@ -25,7 +25,10 @@ module Ariadne
 
         def to_component
           html_attrs = @input_attributes || {}
-          Ariadne::Form::TextField::Component.new(name: @name, label: @label, **@options, html_attrs: html_attrs)
+          html_attrs[:placeholder] = @placeholder if @placeholder.present?
+          html_attrs[:disabled] = true if @disabled
+
+          Ariadne::Form::TextField::Component.new(name: @name, label: @label, caption: @caption, html_attrs: html_attrs, **@options)
         end
 
         def type

data/lib/ariadne/view_components/version.rb

@@ -3,6 +3,6 @@
 # :nocov:
 module Ariadne
   module ViewComponents
-    VERSION = "0.0.70"
+    VERSION = "0.0.71"
   end
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: ariadne_view_components
 version: !ruby/object:Gem::Version
-  version: 0.0.70
+  version: 0.0.71
 platform: ruby
 authors:
 - Garen J. Torikian
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2024-04-09 00:00:00.000000000 Z
+date: 2024-04-17 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: tailwind_merge
@@ -130,12 +130,13 @@ files:
 - app/assets/stylesheets/ariadne_view_components.css.gz
 - app/components/ariadne/ariadne-form.ts
 - app/components/ariadne/base_component.rb
+- app/components/ariadne/behaviors/captionable.rb
 - app/components/ariadne/behaviors/tooltipable.rb
 - app/components/ariadne/conditional_wrapper.rb
 - app/components/ariadne/form/base_component.rb
 - app/components/ariadne/form/base_input_component.rb
-- app/components/ariadne/form/caption/component.html.erb
-- app/components/ariadne/form/caption/component.rb
+- app/components/ariadne/form/checkbox/component.html.erb
+- app/components/ariadne/form/checkbox/component.rb
 - app/components/ariadne/form/form_control/component.html.erb
 - app/components/ariadne/form/form_control/component.rb
 - app/components/ariadne/form/form_reference/component.html.erb
@@ -144,47 +145,85 @@ files:
 - app/components/ariadne/form/group/component.rb
 - app/components/ariadne/form/hidden_field/component.html.erb
 - app/components/ariadne/form/hidden_field/component.rb
+- app/components/ariadne/form/radio/component.html.erb
+- app/components/ariadne/form/radio/component.rb
+- app/components/ariadne/form/radio_button/component.html.erb
+- app/components/ariadne/form/radio_button/component.rb
+- app/components/ariadne/form/radio_button_group/component.html.erb
+- app/components/ariadne/form/radio_button_group/component.rb
 - app/components/ariadne/form/separator/component.html.erb
 - app/components/ariadne/form/separator/component.rb
-- app/components/ariadne/form/spacing_wrapper/component.html.erb
-- app/components/ariadne/form/spacing_wrapper/component.rb
 - app/components/ariadne/form/text_field/component.html.erb
 - app/components/ariadne/form/text_field/component.rb
 - app/components/ariadne/form/validation_message/component.html.erb
 - app/components/ariadne/form/validation_message/component.rb
+- app/components/ariadne/layout/grid/component.html.erb
+- app/components/ariadne/layout/grid/component.rb
 - app/components/ariadne/layout/narrow/component.html.erb
 - app/components/ariadne/layout/narrow/component.rb
 - app/components/ariadne/layout/nav_bar/component.css
 - app/components/ariadne/layout/nav_bar/component.html.erb
 - app/components/ariadne/layout/nav_bar/component.rb
+- app/components/ariadne/layout/two_panel/component.html.erb
+- app/components/ariadne/layout/two_panel/component.rb
+- app/components/ariadne/layout/wide/component.html.erb
+- app/components/ariadne/layout/wide/component.rb
+- app/components/ariadne/turbo/frame/component.html.erb
+- app/components/ariadne/turbo/frame/component.rb
+- app/components/ariadne/turbo/stream_action/component.html.erb
+- app/components/ariadne/turbo/stream_action/component.rb
+- app/components/ariadne/ui/badge/component.html.erb
+- app/components/ariadne/ui/badge/component.rb
+- app/components/ariadne/ui/blankslate/component.html.erb
+- app/components/ariadne/ui/blankslate/component.rb
 - app/components/ariadne/ui/button/component.html.erb
 - app/components/ariadne/ui/button/component.rb
 - app/components/ariadne/ui/clipboard_copy/component.html.erb
 - app/components/ariadne/ui/clipboard_copy/component.rb
 - app/components/ariadne/ui/clipboard_copy/component.ts
+- app/components/ariadne/ui/color_dot/component.html.erb
+- app/components/ariadne/ui/color_dot/component.rb
 - app/components/ariadne/ui/combobox/component.html.erb
 - app/components/ariadne/ui/combobox/component.rb
 - app/components/ariadne/ui/combobox/component.ts
-- app/components/ariadne/ui/combobox/menu_item/component.html.erb
-- app/components/ariadne/ui/combobox/menu_item/component.rb
+- app/components/ariadne/ui/combobox/item/component.html.erb
+- app/components/ariadne/ui/combobox/item/component.rb
 - app/components/ariadne/ui/combobox/option/component.html.erb
 - app/components/ariadne/ui/combobox/option/component.rb
+- app/components/ariadne/ui/data_table/component.html.erb
+- app/components/ariadne/ui/data_table/component.rb
+- app/components/ariadne/ui/dialog/component.html.erb
+- app/components/ariadne/ui/dialog/component.rb
+- app/components/ariadne/ui/dialog/component.ts
 - app/components/ariadne/ui/heroicon/component.html.erb
 - app/components/ariadne/ui/heroicon/component.rb
 - app/components/ariadne/ui/image/component.rb
 - app/components/ariadne/ui/link/component.html.erb
 - app/components/ariadne/ui/link/component.rb
+- app/components/ariadne/ui/list/component.html.erb
+- app/components/ariadne/ui/list/component.rb
+- app/components/ariadne/ui/list/item/component.html.erb
+- app/components/ariadne/ui/list/item/component.rb
+- app/components/ariadne/ui/table/cell/component.html.erb
+- app/components/ariadne/ui/table/cell/component.rb
+- app/components/ariadne/ui/table/component.html.erb
+- app/components/ariadne/ui/table/component.rb
+- app/components/ariadne/ui/table/footer/component.html.erb
+- app/components/ariadne/ui/table/footer/component.rb
+- app/components/ariadne/ui/table/header/component.html.erb
+- app/components/ariadne/ui/table/header/component.rb
+- app/components/ariadne/ui/table/row/component.html.erb
+- app/components/ariadne/ui/table/row/component.rb
 - app/components/ariadne/ui/typography/component.html.erb
 - app/components/ariadne/ui/typography/component.rb
 - app/frontend/ariadne/index.ts
 - app/frontend/ariadne/stimulus_app.ts
 - app/frontend/ariadne/theme.ts
-- app/frontend/controllers/tooltip.ts
+- app/frontend/controllers/autosubmittable_controller.ts
 - app/frontend/entrypoints/application.ts
 - app/frontend/stylesheets/ariadne_view_components.css
 - app/frontend/stylesheets/scrollbar.css
 - app/frontend/stylesheets/tippy.js/themes/tomato.css
-- app/frontend/stylesheets/typography.css
 - app/frontend/utils/createController.ts
 - app/helpers/ariadne/form_helper.rb
 - app/lib/ariadne/attributes_helper.rb
@@ -201,11 +240,16 @@ files:
 - lib/ariadne/forms/base.rb
 - lib/ariadne/forms/buffer_rewriter.rb
 - lib/ariadne/forms/builder.rb
+- lib/ariadne/forms/dsl/badge.rb
 - lib/ariadne/forms/dsl/button_input.rb
 - lib/ariadne/forms/dsl/form_object.rb
+- lib/ariadne/forms/dsl/form_reference_input.rb
+- lib/ariadne/forms/dsl/hidden_input.rb
 - lib/ariadne/forms/dsl/input.rb
 - lib/ariadne/forms/dsl/input_group.rb
 - lib/ariadne/forms/dsl/input_methods.rb
+- lib/ariadne/forms/dsl/radio_button_group_input.rb
+- lib/ariadne/forms/dsl/radio_button_input.rb
 - lib/ariadne/forms/dsl/submit_button_input.rb
 - lib/ariadne/forms/dsl/text_field_input.rb
 - lib/ariadne/forms/utils.rb

data/app/components/ariadne/form/caption/component.html.erb

@@ -1,10 +0,0 @@
-<% if @input.caption? && !@input.caption.blank? %>
-  <span class="FormControl-caption" id="<%= @input.caption_id %>"><%= @input.caption %></span>
-<% elsif caption_template? %>
-  <% caption_template = render_caption_template %>
-  <% unless caption_template.blank? %>
-    <span class="FormControl-caption" id="<%= @input.caption_id %>">
-      <%= caption_template %>
-    </span>
-  <% end %>
-<% end %>

data/app/components/ariadne/form/caption/component.rb

@@ -1,32 +0,0 @@
-# frozen_string_literal: true
-
-module Ariadne
-  module Form
-    # :nodoc:
-    module Caption
-      class Component
-        Ariadne::Form::BaseInputComponent
-        def initialize(input:)
-          @input = input
-        end
-
-        def caption_template?
-          @input.caption_template?
-        end
-
-        def render_caption_template
-          @input.render_caption_template
-        end
-
-        def before_render
-          return unless @input.caption? && caption_template?
-
-          raise <<~MESSAGE
-            Please provide either a caption: argument or caption template for the
-            '#{@input.name}' input; both were found.
-          MESSAGE
-        end
-      end
-    end
-  end
-end

data/app/components/ariadne/form/spacing_wrapper/component.html.erb

@@ -1,3 +0,0 @@
-<div class="FormControl-spacingWrapper">
-  <%= content %>
-</div>

data/app/components/ariadne/form/spacing_wrapper/component.rb

@@ -1,10 +0,0 @@
-# frozen_string_literal: true
-
-module Ariadne
-  module Form
-    module SpacingWrapper
-      class Component < Ariadne::Form::BaseComponent
-      end
-    end
-  end
-end