plutonium 0.66.0 → 0.68.0

data/lib/plutonium/ui/form/components/secure_association_radio_buttons.rb

@@ -0,0 +1,45 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Form
+      module Components
+        # A belongs_to / has_one association rendered as one radio button per
+        # authorized record (`input :category, as: :association_radio_buttons`).
+        #
+        # An optional association also gets a blank "None" choice, since a
+        # radio group can't otherwise be cleared once something is picked.
+        # `include_blank: false` drops it. A required association never gets
+        # one: a checked "None" would satisfy the group's `required`.
+        class SecureAssociationRadioButtons < SecureAssociationChoices
+          protected
+
+          def control_type = :radio
+
+          def control_theme = :association_radio_button
+
+          def supported_macros = %i[belongs_to has_one]
+
+          def group_role = "radiogroup"
+
+          def include_blank?
+            return false if attributes[:required]
+
+            @include_blank != false
+          end
+
+          # `required` on any radio in a group makes picking one of them required.
+          def control_required? = attributes[:required]
+
+          def render_blank_choice
+            render_choice(value: "", text: blank_choice_text, id: "#{attributes[:id]}_blank", checked: singular_field_value.nil?)
+          end
+
+          def blank_choice_text
+            field.placeholder.presence || Plutonium::Translation.t("plutonium.ui.form.association_choices.none")
+          end
+        end
+      end
+    end
+  end
+end

data/lib/plutonium/ui/form/components/secure_association_toggles.rb

@@ -0,0 +1,18 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Form
+      module Components
+        # Switch-styled {SecureAssociationCheckboxes}
+        # (`input :tags, as: :association_toggles`). Same behavior; only the
+        # `.pu-toggle` styling differs.
+        class SecureAssociationToggles < SecureAssociationCheckboxes
+          protected
+
+          def control_theme = :association_toggle
+        end
+      end
+    end
+  end
+end

data/lib/plutonium/ui/form/components/tags.rb

@@ -0,0 +1,45 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Form
+      module Components
+        # Chip input for a no_fly_list `has_tags` context. Suggests the tags
+        # that already exist in the record's tag scope (its tenant), follows
+        # the context's `restrict_to_existing` and `limit`, and submits to the
+        # `<context>_list` writer.
+        class Tags < List
+          SUGGESTION_LIMIT = 200
+
+          protected
+
+          def build_attributes
+            context = Plutonium::UI::Options::TagsField.context(field.object, field.key)
+            attributes[:input_param] ||= :"#{field.key}_list"
+            attributes[:addable] = !context[:restrict_to_existing] unless attributes.key?(:addable)
+            attributes[:limit] ||= context[:limit]
+            attributes[:suggestions] ||= existing_tags(context)
+            super
+          end
+
+          # The proxy, not the association: on a failed save it still holds
+          # what was submitted.
+          def current_values
+            field.object.public_send(:"#{field.key}_list").to_a
+          end
+
+          private
+
+          def existing_tags(context)
+            tags = context[:tag_class_name].constantize.order(:name).limit(SUGGESTION_LIMIT)
+            if (scope = context[:scope])
+              column = field.object.class.reflect_on_association(scope)&.foreign_key || scope
+              tags = tags.where(column => field.object[column])
+            end
+            tags.pluck(:name)
+          end
+        end
+      end
+    end
+  end
+end

data/lib/plutonium/ui/form/components/tags_filter.rb

@@ -0,0 +1,40 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Form
+      module Components
+        # The {Plutonium::Query::Filters::Tags} input. Offers only the tags on
+        # records the user can see (the policy scope), so a tenant never sees
+        # another tenant's vocabulary and every option matches something.
+        class TagsFilter < List
+          include Plutonium::UI::Component::Methods
+
+          protected
+
+          def build_attributes
+            @context = attributes.delete(:context)
+            attributes[:addable] = false
+            attributes[:data_controller] = tokens(attributes[:data_controller], "slim-select")
+            attributes[:class] = ""
+            super
+          end
+
+          # Built at render time: the policy scope needs the view context,
+          # which doesn't exist yet when attributes are built.
+          def choices
+            @choices ||= build_choice_mapper(current_values | visible_tags)
+          end
+
+          private
+
+          def visible_tags
+            tag_class = Plutonium::UI::Options::TagsField.context(resource_class.new, @context)[:tag_class_name].constantize
+            name = tag_class.arel_table[:name]
+            authorized_resource_scope(resource_class).unscope(:order, :select).joins(@context).distinct.order(name).pluck(name)
+          end
+        end
+      end
+    end
+  end
+end

data/lib/plutonium/ui/form/components/uppy.rb

@@ -155,7 +155,7 @@ module Plutonium
               class: "w-full py-2 px-4 text-sm text-danger-600 dark:text-danger-400 bg-[var(--pu-surface)] hover:bg-danger-50 dark:hover:bg-danger-900/50 rounded-b-[var(--pu-radius-md)] transition-colors duration-200 flex items-center justify-center gap-2 border-t border-[var(--pu-border)]",
               data: {action: "click->attachment-preview#remove"}
             ) do
-              span(class: "bi bi-trash")
+              render Phlex::TablerIcons::Trash.new(class: "w-4 h-4")
               plain Plutonium::Translation.t("plutonium.ui.form.attachment.delete")
             end
           end

data/lib/plutonium/ui/form/options/inferred_types.rb

@@ -6,16 +6,23 @@ module Plutonium
       module Options
         module InferredTypes
           include Plutonium::UI::Options::HasCentsField
+          include Plutonium::UI::Options::SecretField
+          include Plutonium::UI::Options::TagsField
+          include Plutonium::UI::Options::RichTextField
 
           private
 
           def infer_field_component
+            # A tag context is also a has_many of tag records; claim it first.
+            return :tags if tags_field?
+            return :rich_text if rich_text_field?
+
             # Password detection lives in the string-type inference, not the
             # component-type inference (a `password` column infers as :string).
             # Route every inferred password/secret field to the masking Password
             # component so the stored value never reaches the DOM. We also widen
             # the heuristic to secret-bearing names Phlexi misses (`*_secret`,
-            # `*_key`, `salt`, ...) — see #secret_field_name?.
+            # `*_key`, `salt`, ...) — see Options::SecretField.
             return :password if inferred_string_field_type == :password || secret_field_name?
 
             # has_cents decimal accessors render as a currency input (number field
@@ -23,8 +30,14 @@ module Plutonium
             return :currency if has_cents_field?
 
             case inferred_field_type
-            when :rich_text
-              return :markdown
+            when :binary
+              # phlexi-form infers :file, which Plutonium renders as an Uppy
+              # attachment; a binary column holds the file's bytes instead.
+              return :binary
+            when :json, :jsonb
+              # phlexi-form infers these as a plain :text textarea, which
+              # renders `Hash#to_s` and never parses the submission back.
+              return :json
             end
 
             inferred_field_component = super
@@ -39,18 +52,6 @@ module Plutonium
               inferred_field_component
             end
           end
-
-          # Secret-bearing names Phlexi's `is_password_field?` does not catch
-          # (it only handles `password`, `encrypted_*`, `*_password`, `*_digest`,
-          # `*_hash`, `*_token`). Mask these too so their value never reaches the
-          # DOM. Still a name heuristic, not a guarantee — opt in/out per field
-          # with `as: :password` / `as: :string`.
-          def secret_field_name?
-            name = key.to_s.downcase
-            name == "token" || name == "salt" ||
-              name.include?("secret") ||
-              name.end_with?("_key", "_salt")
-          end
         end
       end
     end

data/lib/plutonium/ui/form/theme.rb

@@ -117,6 +117,22 @@ module Plutonium
             invalid_json: :invalid_input,
             neutral_json: :neutral_input,
 
+            # EasyMDE replaces the textarea once its JS boots; until then (or
+            # without JS) the textarea should look like every other one.
+            easymde: :textarea,
+            valid_easymde: :valid_textarea,
+            invalid_easymde: :invalid_textarea,
+            neutral_easymde: :neutral_textarea,
+
+            # Action Text editor: Trix / Lexxy style themselves.
+            rich_text: "",
+
+            # Star picker: styled by .pu-rating (components.css).
+            rating: "",
+
+            # Key/value editor: the component lays out its own rows and inputs.
+            key_value_store: "",
+
             # Uppy file upload
             uppy: :file,
             valid_uppy: :valid_file,
@@ -130,10 +146,24 @@ module Plutonium
             neutral_association: :neutral_select,
 
             # Polymorphic association
-            polymorpic_association: :association,
-            valid_polymorpic_association: :valid_association,
-            invalid_polymorpic_association: :invalid_association,
-            neutral_polymorpic_association: :neutral_association
+            polymorphic_association: :association,
+            valid_polymorphic_association: :valid_association,
+            invalid_polymorphic_association: :invalid_association,
+            neutral_polymorphic_association: :neutral_association,
+
+            # List-style association variants (`as: :association_checkboxes`,
+            # `:association_toggles`, `:association_radio_buttons`). The bare key
+            # styles the list; `association_<control>` styles each control.
+            association_checkboxes: "flex flex-col gap-2",
+            association_toggles: "flex flex-col gap-2",
+            association_radio_buttons: "flex flex-col gap-2",
+            association_choice_label: "inline-flex items-center gap-2 text-sm text-[var(--pu-text)] cursor-pointer",
+            association_checkbox: :checkbox,
+            invalid_association_checkbox: :invalid_boolean,
+            association_toggle: :toggle,
+            invalid_association_toggle: :invalid_toggle,
+            association_radio_button: :radio_button,
+            invalid_association_radio_button: "pu-radio pu-input-invalid"
           })
         end
       end

data/lib/plutonium/ui/grid/card.rb

@@ -105,13 +105,21 @@ module Plutonium
           value = field_value(slots[:image])
 
           if size == :cover
-            # Cover is a full-width banner, not an avatar: only render when an
-            # actual image resolves (no deterministic fallback).
+            # Cover is a full-width banner, not an avatar, so a record with no
+            # image gets no generated stand-in. It still gets the banner's
+            # space, as an empty slot elsewhere gets its em-dash: without it the
+            # card is a banner shorter than its neighbours, and the row stretches
+            # it into a block of blank card under its text.
             src = Plutonium::UI::Avatar.resolve_image_src(value, helpers)
-            return unless src
 
             div(class: "w-full aspect-video bg-[var(--pu-surface-alt)] overflow-hidden") do
-              img(src: src, alt: header_text.to_s, class: "w-full h-full object-cover")
+              if src
+                img(src: src, alt: header_text.to_s, class: "w-full h-full object-cover")
+              else
+                div(class: "w-full h-full flex items-center justify-center text-[var(--pu-text-subtle)]", aria_hidden: "true") do
+                  render Phlex::TablerIcons::Photo.new(class: "w-8 h-8")
+                end
+              end
             end
           else
             # Small avatar slot: render the resolved image, or Avatar's generic
@@ -314,7 +322,19 @@ module Plutonium
               "#{record.class.name} doesn't respond to it. " \
               "Define the method on the model or remove the slot."
           end
-          record.public_send(name)
+          value = record.public_send(name)
+          # Slots render raw values, so mask secrets here. Blank stays blank so
+          # the slot still collapses.
+          (value.present? && secret_slot?(name)) ? Plutonium::UI::Options::SecretField::MASK : value
+        end
+
+        # Same rule as the show page: an explicit `as:` (display over field)
+        # decides; otherwise the secret-name heuristic does.
+        def secret_slot?(name)
+          name = name.to_sym
+          declared = resource_definition.defined_displays.dig(name, :options, :as) ||
+            resource_definition.defined_fields.dig(name, :options, :as)
+          declared ? %i[password secret].include?(declared.to_sym) : Plutonium::UI::Options::SecretField.secret_name?(name)
         end
 
         def row_actions

data/lib/plutonium/ui/layout/base.rb

@@ -241,7 +241,16 @@ module Plutonium
             href:
               "https://cdn.jsdelivr.net/npm/easymde@2.18.0/dist/easymde.min.css",
             integrity:
-              "uqD/OYCNfagd1EgXMgl5QedTD5K+B3e9b8GYo/41t7+Serf7CBxvl+tU1gHd+qd1",
+              "sha384-uqD/OYCNfagd1EgXMgl5QedTD5K+B3e9b8GYo/41t7+Serf7CBxvl+tU1gHd+qd1",
+            crossorigin: "anonymous"
+          )
+          # EasyMDE's toolbar uses Font Awesome 4 class names (renamed in 5+).
+          link(
+            rel: "stylesheet",
+            href:
+              "https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css",
+            integrity:
+              "sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN",
             crossorigin: "anonymous"
           )
         end

data/lib/plutonium/ui/options/rich_text_field.rb

@@ -0,0 +1,18 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Options
+      # Detects `has_rich_text` fields by the `rich_text_<name>` association
+      # Action Text defines. phlexi-field stopped inferring :rich_text, so
+      # without this they fall through to a plain string.
+      module RichTextField
+        private
+
+        def rich_text_field?
+          object.is_a?(ActiveRecord::Base) && object.class.reflect_on_association(:"rich_text_#{key}").present?
+        end
+      end
+    end
+  end
+end

data/lib/plutonium/ui/options/secret_field.rb

@@ -0,0 +1,32 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Options
+      # Shared detector for secret-bearing field names, so every surface masks
+      # the same fields: the form (Password input), the show page / table /
+      # wizard summary (masked display) and grid / kanban card slots.
+      #
+      # Covers Phlexi's password names (`password`, `encrypted_*`, `*_password`,
+      # `*_digest`, `*_hash`, `*_token`) plus ones it misses (`token`, `salt`,
+      # `*_salt`, `*_key`, anything containing `secret`). Still a name
+      # heuristic, not a guarantee: opt a field in or out with `as: :password`
+      # / `as: :string`.
+      module SecretField
+        MASK = "••••••••"
+
+        def self.secret_name?(name)
+          name = name.to_s.downcase
+          %w[password token salt].include?(name) ||
+            name.start_with?("encrypted_") ||
+            name.end_with?("_password", "_digest", "_hash", "_token", "_salt", "_key") ||
+            name.include?("secret")
+        end
+
+        private
+
+        def secret_field_name? = SecretField.secret_name?(key)
+      end
+    end
+  end
+end

data/lib/plutonium/ui/options/tags_field.rb

@@ -0,0 +1,23 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Options
+      # Detects no_fly_list `has_tags` contexts. A context named `labels`
+      # defines a `labels` has_many (the tag records) next to the
+      # `labels_list` proxy, so without this it infers as an association.
+      # no_fly_list is optional: without the gem nothing is a tag field.
+      module TagsField
+        def self.context(object, key)
+          return unless defined?(NoFlyList::TaggableRecord) && object.is_a?(NoFlyList::TaggableRecord)
+
+          object.class._no_fly_list.tag_contexts[key.to_sym]
+        end
+
+        private
+
+        def tags_field? = TagsField.context(object, key).present?
+      end
+    end
+  end
+end

data/lib/plutonium/ui/page/dashboard.rb

@@ -36,6 +36,7 @@ module Plutonium
         attr_reader :dashboard
 
         def render_content
+          render Plutonium::UI::Dashboard::Toolbar.new(dashboard:)
           render Plutonium::UI::Dashboard::Board.new(dashboard:)
         end
 

data/lib/plutonium/ui/table/components/scopes_bar.rb

@@ -42,7 +42,7 @@ module Plutonium
           end
 
           def scope_label(name)
-            Plutonium::Translation.label_for(:scope, current_query_object.resource_class, name) || name.to_s.humanize
+            current_query_object.scope_label(name)
           end
 
           def current_scope

data/lib/plutonium/ui/table/components/scopes_pills.rb

@@ -32,7 +32,7 @@ module Plutonium
 
           def render_pill(key)
             active = current_query_object.selected_scope.to_s == key.to_s
-            label = Plutonium::Translation.label_for(:scope, current_query_object.resource_class, key) || key.to_s.humanize
+            label = current_query_object.scope_label(key)
 
             a(
               id: "#{key}-scope",

data/lib/plutonium/ui/table/components/toolbar.rb

@@ -80,7 +80,7 @@ module Plutonium
           end
 
           def render_search
-            form(method: :get, action: @search_url) do
+            form(method: :get, action: @search_url, class: "min-w-0") do
               div(class: "relative") do
                 div(class: "absolute inset-y-0 left-0 flex items-center pl-2 pointer-events-none") do
                   render Phlex::TablerIcons::Search.new(class: "w-4 h-4 text-[var(--pu-text-muted)]")
@@ -91,7 +91,7 @@ module Plutonium
                   name: "#{@search_param}[search]",
                   value: @search_value,
                   placeholder: t("plutonium.ui.table.search_placeholder"),
-                  class: "pu-input pu-input-toolbar pu-input-icon-left w-[220px]",
+                  class: "pu-input pu-input-toolbar pu-input-icon-left w-[220px] max-w-full",
                   # turbo-permanent + a stable id keep the DOM node
                   # across Turbo morphs so focus / caret / IME state
                   # survive the search-as-you-type submit cycle.

data/lib/plutonium/ui/table/components/view_switcher.rb

@@ -35,7 +35,7 @@ module Plutonium
             div(
               role: "tablist",
               aria: {label: t("plutonium.ui.table.view")},
-              class: "inline-flex h-8 rounded-md border border-[var(--pu-border)] bg-[var(--pu-surface)] overflow-hidden",
+              class: "inline-flex shrink-0 h-8 rounded-md border border-[var(--pu-border)] bg-[var(--pu-surface)] overflow-hidden",
               data: {
                 controller: "view-switcher",
                 view_switcher_cookie_name_value: @cookie_name,
@@ -76,7 +76,9 @@ module Plutonium
               }
             ) do
               render icon.new(class: "w-4 h-4 shrink-0")
-              span { label }
+              # Icon-only below sm so the switcher fits narrow toolbars; the
+              # label stays in the accessibility tree via sr-only.
+              span(class: "sr-only sm:not-sr-only") { label }
             end
           end
         end

data/lib/plutonium/ui/table/display_theme.rb

@@ -9,10 +9,38 @@ module Plutonium
             value_wrapper: "max-h-[150px] overflow-y-auto",
             prefixed_icon: "w-4 h-4 mr-1 text-[var(--pu-text-muted)]",
             link: "text-primary-600 dark:text-primary-400 hover:text-primary-500 dark:hover:text-primary-300 transition-colors",
-            color: "flex items-center",
-            color_indicator: "w-8 h-8 rounded-md mr-2 shadow-sm border border-[var(--pu-border)]",
+            color: "flex items-center gap-2",
+            color_indicator: "w-6 h-6 rounded border border-[var(--pu-border)]",
+            color_label: "text-sm text-[var(--pu-text-muted)]",
             email: "flex items-center gap-1 text-primary-600 dark:text-primary-400 hover:text-primary-500 whitespace-nowrap transition-colors",
             phone: "flex items-center gap-1 text-primary-600 dark:text-primary-400 hover:text-primary-500 whitespace-nowrap transition-colors",
+            markdown: "format format-sm dark:format-invert format-primary max-w-none",
+            rich_text: "format format-sm dark:format-invert format-primary max-w-none",
+            currency: "tabular-nums",
+            # Boolean / badge pills: the component applies the variant class.
+            boolean: "",
+            badge: "",
+            key_value: "grid grid-cols-[auto_1fr] w-max gap-x-3 gap-y-0.5 text-sm",
+            key_value_key: "font-medium text-[var(--pu-text-muted)] break-words",
+            key_value_value: "break-words",
+            key_value_nested: "font-mono text-xs",
+            list: "flex flex-wrap gap-1",
+            list_item: "pu-badge pu-badge-neutral",
+            relative_time: "text-sm text-[var(--pu-text)]",
+            code: "flex items-center gap-2",
+            code_value: "font-mono text-sm text-[var(--pu-text)] bg-[var(--pu-surface-alt)] border border-[var(--pu-border-muted)] rounded-[var(--pu-radius-sm)] px-2 py-0.5 break-all",
+            code_copy: "pu-btn pu-btn-xs pu-btn-ghost",
+            duration: "text-sm text-[var(--pu-text)] tabular-nums",
+            file_size: "text-sm text-[var(--pu-text)] tabular-nums",
+            progress: "flex items-center gap-2",
+            progress_track: "h-2 w-full max-w-xs rounded-full bg-[var(--pu-surface-alt)] overflow-hidden",
+            progress_bar: "h-full rounded-full bg-primary-500",
+            progress_label: "text-sm text-[var(--pu-text-muted)] tabular-nums",
+            rating: "flex items-center gap-0.5",
+            rating_filled: "w-4 h-4 text-warning-500 fill-current",
+            rating_empty: "w-4 h-4 text-[var(--pu-border)]",
+            binary: "text-sm text-[var(--pu-text-muted)]",
+            phlexi_render: :string,
             json: "whitespace-pre font-mono text-xs bg-[var(--pu-surface-alt)] border border-[var(--pu-border-muted)] rounded-[var(--pu-radius-sm)] p-2 overflow-x-auto",
             attachment_value_wrapper: "flex flex-wrap gap-1"
           })

data/lib/plutonium/version.rb

@@ -1,5 +1,5 @@
 module Plutonium
-  VERSION = "0.66.0"
+  VERSION = "0.68.0"
   NEXT_MAJOR_VERSION = VERSION.split(".").tap { |v|
     v[1] = v[1].to_i + 1
     v[2] = 0

data/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@radioactive-labs/plutonium",
-  "version": "0.66.0",
+  "version": "0.68.0",
   "description": "Build production-ready Rails apps in minutes, not days. Convention-driven, fully customizable, AI-ready.",
   "type": "module",
   "main": "src/js/core.js",

data/plutonium.gemspec

@@ -60,7 +60,7 @@ Gem::Specification.new do |spec|
   spec.add_dependency "phlex-rails"
   spec.add_dependency "phlex-tabler_icons"
   spec.add_dependency "phlexi-field", ">= 0.2.0"
-  spec.add_dependency "phlexi-form", ">= 0.14.3"
+  spec.add_dependency "phlexi-form", ">= 0.14.4"
   spec.add_dependency "phlexi-table", ">= 0.2.0"
   spec.add_dependency "phlexi-display", ">= 0.2.0"
   spec.add_dependency "phlexi-menu", ">= 0.4.1"

data/src/css/components.css

@@ -1247,3 +1247,46 @@ html.pu-rail-pinned .icon-rail-pin-expand {
     opacity: 0.6;
   }
 }
+
+/* Star rating input (Form::Components::Rating). Radios run max..1 in a
+   row-reversed box, so `~ label` reaches the stars below the checked or
+   hovered one. */
+.pu-rating {
+  @apply inline-flex flex-row-reverse justify-end gap-0.5 border-0 p-0 m-0;
+}
+.pu-rating label {
+  @apply cursor-pointer text-[var(--pu-border)] transition-colors;
+}
+.pu-rating label svg {
+  @apply w-6 h-6;
+}
+.pu-rating input:checked ~ label,
+.pu-rating label:hover,
+.pu-rating label:hover ~ label {
+  @apply text-warning-500;
+}
+.pu-rating input:checked ~ label svg,
+.pu-rating label:hover svg,
+.pu-rating label:hover ~ label svg {
+  fill: currentColor;
+}
+/* "Clear" comes last in the DOM; order: -1 puts it after the stars
+   (row-reverse lays out from the right). `input ~` matches the star-fill
+   rules' specificity, and coming later lets this win. */
+.pu-rating input ~ label.pu-rating-clear {
+  @apply order-[-1] ml-2 self-center text-sm text-[var(--pu-text-muted)] hover:text-[var(--pu-text)] hover:underline;
+}
+.pu-rating input:focus-visible + label {
+  @apply rounded-sm outline-2 outline-offset-2 outline-primary-500;
+}
+
+/* Tailwind's preflight strips list markers. Restore them inside the rich
+   text editors (Trix, Lexxy) so lists look like lists while editing. */
+trix-editor ul,
+.lexxy-content ul {
+  @apply list-disc ps-6;
+}
+trix-editor ol,
+.lexxy-content ol {
+  @apply list-decimal ps-6;
+}