shadcn_view_components 0.2.0

data/app/components/shadcn/empty.rb

@@ -0,0 +1,40 @@
+# typed: strict
+# frozen_string_literal: true
+
+module Shadcn
+  class Empty < BaseComponent
+    class Header < BaseComponent; end
+
+    class Title < BaseComponent; end
+
+    class Description < BaseComponent; end
+
+    class Content < BaseComponent; end
+
+    class Media < BaseComponent
+      sig do
+        params(
+          variant: T.any(Symbol, String),
+          args: T::Hash[Symbol, T.untyped]
+        ).void.checked(:never)
+      end
+      def initialize(variant: ShadcnViewComponents::Contracts::Empty::Media::DEFAULTS.fetch(:variant), **args)
+        @variant = T.let(normalize_option(:variant, variant), Symbol)
+        super(**args)
+      end
+
+      sig { returns(Symbol) }
+      attr_reader :variant
+
+      sig { override.returns(T::Hash[Symbol, VariantOption]) }
+      def variant_options
+        { variant: @variant }
+      end
+
+      sig { override.returns(T::Hash[Symbol, T.untyped]) }
+      def contract_data_attributes
+        super.merge(variant: @variant)
+      end
+    end
+  end
+end

data/app/components/shadcn/field.rb

@@ -0,0 +1,106 @@
+# typed: strict
+# frozen_string_literal: true
+
+module Shadcn
+  # フィールドコンテナ(Phase 4)。orientation(vertical/horizontal/responsive)の
+  # cva バリアントを持つ。フォーム組み立て(upstream docs/forms ガイド)の基盤で、
+  # Shadcn::Form::Item もこの構造の上に成り立つ
+  class Field < BaseComponent
+    sig { params(orientation: T.any(Symbol, String), args: T::Hash[Symbol, T.untyped]).void.checked(:never) }
+    def initialize(orientation: ShadcnViewComponents::Contracts::Field::DEFAULTS.fetch(:orientation), **args)
+      @orientation = T.let(normalize_option(:orientation, orientation), Symbol)
+      super(**args)
+    end
+
+    sig { override.returns(T::Hash[Symbol, VariantOption]) }
+    def variant_options
+      { orientation: @orientation }
+    end
+
+    sig { override.returns(T::Hash[Symbol, T.untyped]) }
+    def html_attributes
+      attributes = super
+      # upstream は data-orientation={orientation} を常に出力する
+      merge_nested(attributes, :data, { orientation: @orientation.to_s })
+      attributes
+    end
+
+    class Content < BaseComponent
+      # div
+    end
+
+    class Description < BaseComponent
+      sig { override.returns(String) }
+      def default_tag
+        "p"
+      end
+    end
+
+    class Error < BaseComponent
+      # div(契約静的クラスは自動付与)。upstream と同じく「本文が無ければ描かない」。
+      # なお upstream の errors: 配列→ul リスト化は本クラスでは提供しない
+      # (upstream の ul は data-slot を持たず field 契約に取込めないため。
+      # 文字列配列を受けたい場合は Shadcn::Form::Error を使う)
+      sig { override.returns(String) }
+      def call
+        body = content.to_s
+        return "" if body.empty?
+
+        content_tag(tag, **html_attributes) { body }
+      end
+    end
+
+    class Group < BaseComponent
+      # div
+    end
+
+    class Label < BaseComponent
+      sig { override.returns(String) }
+      def default_tag
+        "label"
+      end
+
+      # upstream の FieldLabel は <Label> プリミティブを描く: ラベル契約のクラスを
+      # 土台に field 側のクラスを重ねる(cn(labelVariants(), fieldLabelClasses) と同じ順)。
+      # 描画は label 契約のクラス群を含むため、適合試験は allowances の
+      # class_mode: contains で緩和する
+      sig { override.returns(T::Hash[Symbol, T.untyped]) }
+      def html_attributes
+        attributes = super
+        attributes[:class] = ShadcnViewComponents::Classes.resolve(:label, extra: attributes[:class].to_s)
+        attributes
+      end
+    end
+
+    class Legend < BaseComponent
+      sig { override.returns(String) }
+      def default_tag
+        "legend"
+      end
+    end
+
+    class Separator < BaseComponent
+      # 契約スロット構成: field-separator > field-separator-content(span)
+      sig { override.returns(String) }
+      def call
+        content_tag(tag, **html_attributes) do
+          content_tag(:span,
+                      class: T.cast(contract_slot("field-separator-content").dig(:static_attributes, :class), T.nilable(String)),
+                      data: { slot: "field-separator-content" }) { content }
+        end
+      end
+    end
+
+    class Set < BaseComponent
+      # fieldset
+      sig { override.returns(String) }
+      def default_tag
+        "fieldset"
+      end
+    end
+
+    class Title < BaseComponent
+      # div(契約の data-slot は field-label を共有する)
+    end
+  end
+end

data/app/components/shadcn/floating_position_options.rb

@@ -0,0 +1,132 @@
+# typed: strict
+# frozen_string_literal: true
+
+module Shadcn
+  # 浮動要素の希望配置を、各コンポーネントで共通の data 属性へ変換する。
+  # 実際の配置結果に使う data-side / data-align とは属性を分け、衝突回避後の
+  # 値が次回表示時の希望配置へ混入しないようにする。
+  module FloatingPositionOptions
+    extend T::Sig
+
+    SIDES = %w[top right bottom left inline-start inline-end].freeze
+    ALIGNS = %w[start center end].freeze
+    INTEGER_PATTERN = /\A[+-]?\d+\z/
+    NUMBER_PATTERN = /\A[+-]?(?:\d+(?:\.\d*)?|\.\d+)(?:e[+-]?\d+)?\z/i
+
+    class Values < T::Struct
+      const :side, String
+      const :align, String
+      const :side_offset, T.any(Integer, Float)
+      const :align_offset, T.any(Integer, Float)
+      const :collision_padding, T.any(Integer, Float)
+    end
+
+    sig { params(args: T::Hash[Symbol, T.untyped]).void.checked(:never) }
+    def initialize(**args)
+      defaults = T.cast(T.unsafe(self).class.const_get(:FLOATING_POSITION_DEFAULTS), T::Hash[Symbol, T.untyped])
+      @floating_position = T.let(normalize_position_options(args, defaults), Values)
+      super
+    end
+
+    private
+
+    sig { params(attributes: T::Hash[Symbol, T.untyped], defaults: T::Hash[Symbol, T.untyped]).returns(T::Hash[Symbol, T.untyped]) }
+    def merge_floating_position_data(attributes, defaults = {})
+      user_data = T.cast(attributes[:data], T.nilable(T::Hash[Symbol, T.untyped])) || {}
+      attributes[:data] = defaults.merge(floating_position_data).merge(user_data)
+      attributes
+    end
+
+    sig { returns(T::Hash[Symbol, T.untyped]) }
+    def floating_position_data
+      {
+        position_side: @floating_position.side,
+        position_align: @floating_position.align,
+        position_side_offset: @floating_position.side_offset,
+        position_align_offset: @floating_position.align_offset,
+        position_collision_padding: @floating_position.collision_padding
+      }
+    end
+
+    sig do
+      params(
+        args: T::Hash[Symbol, T.untyped],
+        defaults: T::Hash[Symbol, T.untyped]
+      ).returns(Values)
+    end
+    def normalize_position_options(args, defaults)
+      Values.new(
+        side: normalize_position_choice(:side, extract_position_option(args, defaults, :side), SIDES),
+        align: normalize_position_choice(:align, extract_position_option(args, defaults, :align), ALIGNS),
+        side_offset: normalize_position_number(:side_offset, extract_position_option(args, defaults, :side_offset)),
+        align_offset: normalize_position_number(:align_offset, extract_position_option(args, defaults, :align_offset)),
+        collision_padding: normalize_position_number(
+          :collision_padding,
+          extract_position_option(args, defaults, :collision_padding),
+          non_negative: true
+        )
+      )
+    end
+
+    sig do
+      params(
+        args: T::Hash[Symbol, T.untyped],
+        defaults: T::Hash[Symbol, T.untyped],
+        name: Symbol
+      ).returns(T.untyped)
+    end
+    def extract_position_option(args, defaults, name)
+      return args.delete(name) if args.key?(name)
+
+      defaults.fetch(name)
+    end
+
+    sig do
+      params(
+        name: Symbol,
+        value: T.untyped,
+        allowed: T::Array[String]
+      ).returns(String)
+    end
+    def normalize_position_choice(name, value, allowed)
+      normalized = value.to_s
+      return normalized if (value.is_a?(String) || value.is_a?(Symbol)) && allowed.include?(normalized)
+
+      Kernel.raise ArgumentError,
+                   "unknown floating position #{name} #{value.inspect} (valid: #{allowed.join(', ')})"
+    end
+
+    sig do
+      params(
+        name: Symbol,
+        value: T.untyped,
+        non_negative: T::Boolean
+      ).returns(T.any(Integer, Float))
+    end
+    def normalize_position_number(name, value, non_negative: false)
+      number = parse_position_number(value)
+      invalid_position_number!(name, value, non_negative) unless number
+      invalid_position_number!(name, value, non_negative) unless number.to_f.finite?
+      invalid_position_number!(name, value, non_negative) if non_negative && number.negative?
+
+      number
+    end
+
+    sig { params(value: T.untyped).returns(T.nilable(T.any(Integer, Float))) }
+    def parse_position_number(value)
+      return value if value.is_a?(Integer) || value.is_a?(Float)
+      return unless value.is_a?(String)
+
+      normalized = value.strip
+      return normalized.to_i if INTEGER_PATTERN.match?(normalized)
+
+      normalized.to_f if NUMBER_PATTERN.match?(normalized)
+    end
+
+    sig { params(name: Symbol, value: T.untyped, non_negative: T::Boolean).returns(T.noreturn) }
+    def invalid_position_number!(name, value, non_negative)
+      requirement = non_negative ? "a finite non-negative number" : "a finite number"
+      Kernel.raise ArgumentError, "floating position #{name} must be #{requirement}, got #{value.inspect}"
+    end
+  end
+end

data/app/components/shadcn/form.rb

@@ -0,0 +1,105 @@
+# typed: strict
+# frozen_string_literal: true
+
+module Shadcn
+  # Railsフォーム統合層。upstream(base-nova)は form アイテムを廃止し、公式 docs/forms
+  # ガイドは Field プリミティブ + data-invalid / aria-invalid の手動ワイヤリングへ移行した
+  # (Issue #3)。本gemもそれに倣い、Field の上に最小2部品で構成する:
+  #
+  #   <%= form_with model: user do |f| %>
+  #     <%= render Shadcn::Form::Item.new(invalid: user.errors[:email].any?) do %>
+  #       <%= render Shadcn::Field::Label.new(for: "user-email") { "メールアドレス" } %>
+  #       <%= render Shadcn::Input.new(id: "user-email",
+  #             aria: { invalid: user.errors[:email].any? }) %>
+  #       <%= render Shadcn::Field::Description.new { "ログインに使うアドレスです" } %>
+  #       <%= render Shadcn::Form::Error.new(errors: user.errors.full_messages_for(:email)) %>
+  #     <% end %>
+  #   <% end %>
+  #
+  # ラベル・説明には Shadcn::Field::Label / Shadcn::Field::Description を直接使う。
+  # Form::Item は Field と同じ DOM 構造(data-slot="field")を描くため、Field 部品を
+  # そのまま内側に置ける。JS無効時フォールバック: Graceful(表示は全てサーバ側で完結する)
+  # aria-invalid / aria-describedby の紐付けは利用者(またはフォームビルダ拡張)が
+  # 持つ — upstream の useFormField 相当の暗黙接続はRailsの流儀に無い
+  # Form自体は名前空間であり、描画にはItemまたはErrorを使う。
+  module Form
+    # upstream docs/forms の <Field data-invalid={...}> 相当。DOM構造・クラスは
+    # Field 契約と同一(契約側で fieldVariants を事前解決済み)。
+    # data-slot を "field" に保つのは Field 部品の group/field セレクタ互換のため
+    class Item < BaseComponent
+      sig do
+        params(invalid: T::Boolean,
+               orientation: T.any(Symbol, String),
+               args: T::Hash[Symbol, T.untyped]).void.checked(:never)
+      end
+      def initialize(invalid: false, orientation: ShadcnViewComponents::Contracts::Form::Item::DEFAULTS.fetch(:orientation), **args)
+        @invalid = invalid
+        @orientation = T.let(normalize_option(:orientation, orientation), Symbol)
+        super(**args)
+      end
+
+      sig { override.returns(T::Hash[Symbol, VariantOption]) }
+      def variant_options
+        { orientation: @orientation }
+      end
+
+      sig { override.returns(T::Hash[Symbol, T.untyped]) }
+      def html_attributes
+        attributes = super
+        # upstream は boolean prop を常に "true"/"false" として出力する
+        merge_nested(attributes, :data, { invalid: @invalid.to_s, orientation: @orientation.to_s })
+        attributes
+      end
+    end
+
+    # upstream の FieldError セマンティクス(upstream準拠、入力はRails流の文字列配列):
+    # 本文 > errors(重複除去) の優先で、1件は平文・複数は ul リスト・無ければ非描画。
+    # Rails では model.errors.full_messages_for(:attr) をそのまま渡せる
+    class Error < BaseComponent
+      sig do
+        params(message: T.nilable(String),
+               errors: T.nilable(T::Array[T.nilable(String)]),
+               args: T::Hash[Symbol, T.untyped]).void.checked(:never)
+      end
+      def initialize(message: nil, errors: nil, **args)
+        @message = message
+        @errors = T.let(errors, T.nilable(T::Array[T.nilable(String)]))
+        super(**args)
+      end
+
+      sig { override.returns(String) }
+      def call
+        body = content.to_s
+        messages = unique_messages
+        return "" if body.empty? && messages.empty?
+
+        content_tag(tag, **html_attributes) do
+          if body.present?
+            body
+          elsif messages.length == 1
+            messages.first.to_s
+          else
+            error_list(messages)
+          end
+        end
+      end
+
+      private
+
+      sig { returns(T::Array[String]) }
+      def unique_messages
+        ([@message].compact + (@errors || []).compact).uniq
+      end
+
+      # 複数件は ul リスト。リストのクラスは契約に記録済み
+      # (upstream の ul は data-slot を持たないため、名前無しスロットとして契約化した)
+      sig { params(messages: T::Array[String]).returns(String) }
+      def error_list(messages)
+        list_class = T.cast(contract_slot("").dig(:static_attributes, :class), T.nilable(String))
+        content_tag(:ul, class: list_class, data: { slot: "form-error-list" }) do
+          safe_join(messages.map { |message| content_tag(:li) { message.to_s } })
+        end
+      end
+    end
+  end
+end

data/app/components/shadcn/hover_card.rb

@@ -0,0 +1,66 @@
+# typed: strict
+# frozen_string_literal: true
+
+module Shadcn
+  # hover intent 付きのホバーカード(05 §3「hover-card = Popover API + hover intent」)。
+  # JS無効時フォールバック: Readable(内容はSSR済みで読める。展開はJS依存)
+  class HoverCard < BaseComponent
+    CONTROLLER = "shadcn--hover-card"
+
+    sig { override.returns(T::Hash[Symbol, T.untyped]) }
+    def contract_data_attributes
+      super.merge(controller: CONTROLLER)
+    end
+
+    class Trigger < BaseComponent
+      # 契約タグは HoverCardPrimitive.Trigger(HTML名ではない)。upstream の慣行は
+      # <a>(href を渡した場合)なので、href の有無でリンクかボタンかに切り替える
+      sig { override.returns(String) }
+      def default_tag
+        @html_args.key?(:href) ? "a" : "button"
+      end
+
+      sig { override.returns(T::Hash[Symbol, T.untyped]) }
+      def html_attributes
+        attributes = super
+        merge_nested(attributes, :data, {
+                       action: "mouseenter->#{CONTROLLER}#show mouseleave->#{CONTROLLER}#hide focus->#{CONTROLLER}#show blur->#{CONTROLLER}#hide"
+                     })
+        attributes
+      end
+    end
+
+    class Content < BaseComponent
+      include Shadcn::FloatingPositionOptions
+
+      FLOATING_POSITION_DEFAULTS = T.let(
+        { side: :bottom, align: :center, side_offset: 4, align_offset: 4, collision_padding: 5 }.freeze,
+        T::Hash[Symbol, T.untyped]
+      )
+
+      # 契約スロット構成: hover-card-portal(ラッパー) > hover-card-content。
+      # 表示切替は hidden 属性 + data-state で行う
+      sig { override.returns(String) }
+      def call
+        content_tag(:div, data: { slot: "hover-card-portal" }) do
+          content_tag(:div, **content_attributes) { content }
+        end
+      end
+
+      private
+
+      sig { returns(T::Hash[Symbol, T.untyped]) }
+      def content_attributes
+        attributes = @html_args.merge(class: self.class.classes(extra: @user_class))
+        merge_floating_position_data(
+          attributes,
+          slot: "hover-card-content",
+          state: "closed",
+          action: "mouseenter->#{CONTROLLER}#show mouseleave->#{CONTROLLER}#hide"
+        )
+        attributes[:hidden] = true
+        attributes
+      end
+    end
+  end
+end

data/app/components/shadcn/input.rb

@@ -0,0 +1,13 @@
+# typed: strict
+# frozen_string_literal: true
+
+module Shadcn
+  class Input < BaseComponent
+    # input タグ・クラス・data-slot は契約由来。type 等の属性はパススルー。
+    # base-nova の契約タグは InputPrimitive のため HTML input を明示する
+    sig { override.returns(String) }
+    def default_tag
+      "input"
+    end
+  end
+end

data/app/components/shadcn/input_group/button.rb

@@ -0,0 +1,48 @@
+# typed: strict
+# frozen_string_literal: true
+
+module Shadcn
+  class InputGroup < BaseComponent
+    # upstream は Button を asChild で重ねる。本gemでは Button 描画結果に
+    # data-slot を差し替える(Phase 3 の AlertDialogAction と同じ構成)。
+    # NOTE: Shadcn::Button の sidecar テンプレートと名前が衝突するため専用ファイルに置く
+    class Button < BaseComponent
+      sig do
+        params(
+          variant: T.any(Symbol, String),
+          size: T.any(Symbol, String),
+          args: T::Hash[Symbol, T.untyped]
+        ).void.checked(:never)
+      end
+      def initialize(variant: :ghost, size: "xs", **args)
+        @variant = T.let(
+          ShadcnViewComponents::Classes.normalize_option(:button, :variant, variant),
+          Symbol
+        )
+        @size = T.let(normalize_option(:size, size), Symbol)
+        super(**args)
+      end
+
+      sig { override.returns(T::Hash[Symbol, VariantOption]) }
+      def variant_options
+        { size: @size }
+      end
+
+      # 契約は Button(ba_buttonVariants) との合成結果を事前解決済みのため、
+      # ここではその最終クラスをそのまま描く(upstream の DOM と同一)
+      sig { override.returns(String) }
+      def default_tag
+        "button"
+      end
+
+      sig { override.returns(T::Hash[Symbol, T.untyped]) }
+      def html_attributes
+        attributes = super
+        attributes[:type] = "button" unless attributes.key?(:type)
+        data = T.cast(attributes[:data], T.nilable(T::Hash[Symbol, T.untyped])) || {}
+        attributes[:data] = { size: @size }.merge(data)
+        attributes
+      end
+    end
+  end
+end

data/app/components/shadcn/input_group.rb

@@ -0,0 +1,51 @@
+# typed: strict
+# frozen_string_literal: true
+
+module Shadcn
+  # 入力要素の前後にボタンやテキストを並べるコンテナ(Phase 4)
+  class InputGroup < BaseComponent
+    # div(契約静的クラスは自動付与)
+
+    class Addon < BaseComponent
+      sig { params(align: T.any(Symbol, String), args: T::Hash[Symbol, T.untyped]).void.checked(:never) }
+      def initialize(align: ShadcnViewComponents::Contracts::InputGroup::Addon::DEFAULTS.fetch(:align), **args)
+        @align = T.let(normalize_option(:align, align), Symbol)
+        super(**args)
+      end
+
+      sig { override.returns(T::Hash[Symbol, VariantOption]) }
+      def variant_options
+        { align: @align }
+      end
+
+      sig { override.returns(T::Hash[Symbol, T.untyped]) }
+      def contract_data_attributes
+        super.merge(align: @align)
+      end
+    end
+
+    class Input < BaseComponent
+      # upstream は Input(別アイテム)に上書きクラスを足す
+      sig { override.returns(String) }
+      def call
+        attributes = @html_args.merge(class: self.class.classes(extra: @user_class))
+        merge_nested(attributes, :data, { slot: "input-group-control" })
+        render(::Shadcn::Input.new(**attributes)) { content }
+      end
+    end
+
+    class Textarea < BaseComponent
+      # upstream は Textarea(別アイテム)に上書きクラスを足す
+      sig { override.returns(String) }
+      def call
+        attributes = @html_args.merge(class: self.class.classes(extra: @user_class))
+        merge_nested(attributes, :data, { slot: "input-group-control" })
+        render(::Shadcn::Textarea.new(**attributes)) { content }
+      end
+    end
+
+    class Text < BaseComponent
+      # span(契約クラスのみ。data-slot は契約上ルートに無い)
+    end
+  end
+end