plutonium 0.65.0 → 0.67.0

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

@@ -17,7 +17,10 @@ module Plutonium
           def markdown_tag(**, &)
             create_component(Plutonium::UI::Display::Components::Markdown, :markdown, **, &)
           end
-          alias_method :rich_text_tag, :markdown_tag
+
+          def rich_text_tag(**, &)
+            create_component(Plutonium::UI::Display::Components::RichText, :rich_text, **, &)
+          end
 
           def attachment_tag(**, &)
             create_component(Plutonium::UI::Display::Components::Attachment, :attachment, **, &)
@@ -51,12 +54,57 @@ module Plutonium
             create_component(Plutonium::UI::Display::Components::Currency, :currency, **, &)
           end
 
+          def number_tag(**, &)
+            create_component(Plutonium::UI::Display::Components::Number, :number, **, &)
+          end
+
+          def key_value_tag(**, &)
+            create_component(Plutonium::UI::Display::Components::KeyValue, :key_value, **, &)
+          end
+          alias_method :hstore_tag, :key_value_tag
+
+          def list_tag(**, &)
+            create_component(Plutonium::UI::Display::Components::List, :list, **, &)
+          end
+
+          def tags_tag(**, &)
+            create_component(Plutonium::UI::Display::Components::Tags, :list, **, &)
+          end
+
+          def relative_time_tag(**, &)
+            create_component(Plutonium::UI::Display::Components::RelativeTime, :relative_time, **, &)
+          end
+
+          def code_tag(**, &)
+            create_component(Plutonium::UI::Display::Components::Code, :code, **, &)
+          end
+
+          def duration_tag(**, &)
+            create_component(Plutonium::UI::Display::Components::Duration, :duration, **, &)
+          end
+
+          def file_size_tag(**, &)
+            create_component(Plutonium::UI::Display::Components::FileSize, :file_size, **, &)
+          end
+
+          def progress_tag(**, &)
+            create_component(Plutonium::UI::Display::Components::Progress, :progress, **, &)
+          end
+
+          def rating_tag(**, &)
+            create_component(Plutonium::UI::Display::Components::Rating, :rating, **, &)
+          end
+
+          def binary_tag(**, &)
+            create_component(Plutonium::UI::Display::Components::Binary, :binary, **, &)
+          end
+
           # Type aliases for common column types
           alias_method :float_tag, :number_tag
           alias_method :decimal_tag, :number_tag
           alias_method :jsonb_tag, :json_tag
-          alias_method :key_value_tag, :hstore_tag
           alias_method :phlexi_tag, :phlexi_render_tag
+          alias_method :secret_tag, :password_tag
         end
 
         private

data/lib/plutonium/ui/display/components/badge.rb

@@ -61,7 +61,7 @@ module Plutonium
 
           def render_value(value)
             variant = self.class.variant_for(value, colors: @colors)
-            span(**attributes, class: tokens("pu-badge", "pu-badge-#{variant}")) do
+            span(**mix(attributes, {class: tokens("pu-badge", "pu-badge-#{variant}")})) do
               plain value_label(value)
             end
           end

data/lib/plutonium/ui/display/components/binary.rb

@@ -0,0 +1,20 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Display
+      module Components
+        # A `binary` column's size, never its bytes.
+        class Binary < Phlexi::Display::Components::Base
+          include Phlexi::Display::Components::Concerns::DisplaysValue
+
+          def render_value(value)
+            span(**attributes) do
+              Plutonium::Translation.t("plutonium.ui.display.binary", size: ActiveSupport::NumberHelper.number_to_human_size(value.bytesize))
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/plutonium/ui/display/components/boolean.rb

@@ -19,7 +19,7 @@ module Plutonium
           private
 
           def pill(label:, variant:, icon:)
-            span(**attributes, class: tokens("pu-badge", variant), "aria-label": label) do
+            span(**mix(attributes, {class: tokens("pu-badge", variant)}), "aria-label": label) do
               render icon.new(class: "w-3.5 h-3.5")
               plain label
             end

data/lib/plutonium/ui/display/components/code.rb

@@ -0,0 +1,23 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Display
+      module Components
+        # A value in monospace with a copy button: IDs, keys, references.
+        class Code < Phlexi::Display::Components::Base
+          include Phlexi::Display::Components::Concerns::DisplaysValue
+
+          def render_value(value)
+            div(**attributes, data: {controller: "clipboard"}) do
+              code(class: themed(:code_value), data: {clipboard_target: "source"}) { value }
+              button(type: :button, class: themed(:code_copy), data: {action: "clipboard#copy"}) do
+                Plutonium::Translation.t("plutonium.ui.display.code.copy")
+              end
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/plutonium/ui/display/components/color.rb

@@ -7,15 +7,23 @@ module Plutonium
         class Color < Phlexi::Display::Components::Base
           include Phlexi::Display::Components::Concerns::DisplaysValue
 
+          # Hex, a named color, or a plain rgb()/hsl() call. The value is
+          # interpolated into `style:`, so anything else (a `;` or `url(`)
+          # would let a stored string inject arbitrary CSS.
+          CSS_COLOR = /\A(?:#\h{3,8}|[a-z]+|(?:rgb|hsl)a?\([\d\s.,%\/]+\))\z/i
+
           def render_value(value)
-            div(**attributes, class: "flex items-center gap-2") do
-              div(
-                class: "w-6 h-6 rounded border border-[var(--pu-border)]",
-                style: "background-color: #{value};"
-              )
-              span(class: "text-sm text-[var(--pu-text-muted)]") { value }
+            div(**attributes) do
+              div(class: themed(:color_indicator), style: swatch_style(value))
+              span(class: themed(:color_label)) { value }
             end
           end
+
+          private
+
+          def swatch_style(value)
+            "background-color: #{value};" if CSS_COLOR.match?(value)
+          end
         end
       end
     end

data/lib/plutonium/ui/display/components/duration.rb

@@ -0,0 +1,31 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Display
+      module Components
+        # A number of seconds (or an ActiveSupport::Duration) as "2h 15m".
+        class Duration < Phlexi::Display::Components::Base
+          include Phlexi::Display::Components::Concerns::DisplaysValue
+
+          UNITS = {days: 86_400, hours: 3600, minutes: 60, seconds: 1}.freeze
+
+          def render_value(value)
+            span(**attributes) { value }
+          end
+
+          private
+
+          def normalize_value(value)
+            remaining = value.to_i
+            parts = UNITS.filter_map do |unit, size|
+              count, remaining = remaining.divmod(size)
+              Plutonium::Translation.t("plutonium.ui.display.duration.#{unit}", count:) if count.positive?
+            end
+            parts.empty? ? Plutonium::Translation.t("plutonium.ui.display.duration.seconds", count: 0) : parts.join(" ")
+          end
+        end
+      end
+    end
+  end
+end

data/lib/plutonium/ui/display/components/file_size.rb

@@ -0,0 +1,22 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Display
+      module Components
+        # A byte count as "12 KB".
+        class FileSize < Phlexi::Display::Components::Base
+          include Phlexi::Display::Components::Concerns::DisplaysValue
+
+          def render_value(value)
+            span(**attributes) { value }
+          end
+
+          private
+
+          def normalize_value(value) = ActiveSupport::NumberHelper.number_to_human_size(value)
+        end
+      end
+    end
+  end
+end

data/lib/plutonium/ui/display/components/key_value.rb

@@ -0,0 +1,37 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Display
+      module Components
+        # A Hash as a two-column list of keys and values: hstore columns, or
+        # any hash-valued field declared `as: :key_value`. Nested hashes and
+        # arrays stay on one line as compact JSON.
+        class KeyValue < Phlexi::Display::Components::Base
+          include Phlexi::Display::Components::Concerns::DisplaysValue
+
+          def render_value(value)
+            dl(**attributes) do
+              value.each do |key, item|
+                dt(class: themed(:key_value_key)) { key.to_s }
+                dd(class: themed(:key_value_value)) { format_item(item) }
+              end
+            end
+          end
+
+          private
+
+          def normalize_value(value) = value.to_h
+
+          def format_item(item)
+            case item
+            when nil then "—"
+            when Hash, Array then code(class: themed(:key_value_nested)) { item.to_json }
+            else item.to_s
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/lib/plutonium/ui/display/components/list.rb

@@ -0,0 +1,33 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Display
+      module Components
+        # An array value as a row of chips.
+        class List < Phlexi::Display::Components::Base
+          include Phlexi::Display::Components::Concerns::DisplaysValue
+
+          # DisplaysValue renders a multi-valued field once per item; a list
+          # is one component for the whole array.
+          def view_template
+            items = normalize_value(field.value)
+            return render(field.placeholder_tag(**@placeholder_attributes)) if items.empty?
+
+            wrapped { render_value(items) }
+          end
+
+          def render_value(value)
+            ul(**attributes) do
+              value.each { |item| li(class: themed(:list_item)) { item.to_s } }
+            end
+          end
+
+          private
+
+          def normalize_value(value) = Array(value).compact_blank
+        end
+      end
+    end
+  end
+end

data/lib/plutonium/ui/display/components/number.rb

@@ -0,0 +1,32 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Display
+      module Components
+        # phlexi's Number coerces through Float(), which drops a decimal
+        # column's scale (10.50 → "10.5") and digits past ~15 significant
+        # figures. Decimals stay BigDecimal and render at the column's scale.
+        # Explicit `options:` still go straight to number_to_delimited.
+        class Number < Phlexi::Display::Components::Number
+          private
+
+          def format_number(value)
+            return super unless value.is_a?(BigDecimal) && @options.empty?
+
+            digits = scale ? ActiveSupport::NumberHelper.number_to_rounded(value, precision: scale) : value.to_s("F")
+            ActiveSupport::NumberHelper.number_to_delimited(digits)
+          end
+
+          def normalize_value(value)
+            value.is_a?(BigDecimal) ? value : super
+          end
+
+          def scale
+            field.object.class.try(:type_for_attribute, field.key)&.scale
+          end
+        end
+      end
+    end
+  end
+end

data/lib/plutonium/ui/display/components/progress.rb

@@ -0,0 +1,36 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Display
+      module Components
+        # A value out of `max:` (default 100) as a bar and a percentage.
+        #
+        #   display :completion, as: :progress           # 0..100
+        #   display :ratio, as: :progress, max: 1        # 0..1
+        class Progress < Phlexi::Display::Components::Base
+          include Phlexi::Display::Components::Concerns::DisplaysValue
+
+          def render_value(value)
+            percent = (value.to_f / @max * 100).clamp(0, 100).round
+            div(**attributes, role: :progressbar, aria_valuenow: value, aria_valuemin: 0, aria_valuemax: @max) do
+              div(class: themed(:progress_track)) do
+                div(class: themed(:progress_bar), style: "width: #{percent}%")
+              end
+              span(class: themed(:progress_label)) { "#{percent}%" }
+            end
+          end
+
+          private
+
+          def build_attributes
+            super
+            @max = attributes.delete(:max) || 100
+          end
+
+          def normalize_value(value) = value
+        end
+      end
+    end
+  end
+end

data/lib/plutonium/ui/display/components/rating.rb

@@ -0,0 +1,36 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Display
+      module Components
+        # A score as stars out of `max:` (default 5).
+        class Rating < Phlexi::Display::Components::Base
+          include Phlexi::Display::Components::Concerns::DisplaysValue
+
+          def render_value(value)
+            filled = value.to_f.round.clamp(0, @max)
+            label = Plutonium::Translation.t("plutonium.ui.display.rating.label", value: filled, max: @max)
+            div(**attributes, role: :img, aria_label: label) do
+              @max.times do |index|
+                state = (index < filled) ? "filled" : "empty"
+                span(data: {rating_star: state}) do
+                  render Phlex::TablerIcons::Star.new(class: themed(:"rating_#{state}"))
+                end
+              end
+            end
+          end
+
+          private
+
+          def build_attributes
+            super
+            @max = attributes.delete(:max) || 5
+          end
+
+          def normalize_value(value) = value
+        end
+      end
+    end
+  end
+end

data/lib/plutonium/ui/display/components/relative_time.rb

@@ -0,0 +1,25 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Display
+      module Components
+        # A timestamp as "3 minutes ago", kept live by the timeago controller.
+        # The absolute time is the fallback text and the tooltip.
+        class RelativeTime < Phlexi::Display::Components::Base
+          include Phlexi::Display::Components::Concerns::DisplaysValue
+
+          def render_value(value)
+            absolute = I18n.l(value, format: :long)
+            time(**attributes, datetime: value.iso8601, title: absolute,
+              data: {controller: "timeago", timeago_datetime_value: value.iso8601}) { absolute }
+          end
+
+          private
+
+          def normalize_value(value) = value
+        end
+      end
+    end
+  end
+end

data/lib/plutonium/ui/display/components/rich_text.rb

@@ -0,0 +1,23 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Display
+      module Components
+        # A `has_rich_text` field. Action Text renders and sanitizes the HTML
+        # (including attachments) through its content layout.
+        class RichText < Phlexi::Display::Components::Base
+          include Phlexi::Display::Components::Concerns::DisplaysValue
+
+          def render_value(value)
+            div(**attributes) { raw(safe(value.to_s)) }
+          end
+
+          private
+
+          def normalize_value(value) = value
+        end
+      end
+    end
+  end
+end

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

@@ -0,0 +1,18 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Display
+      module Components
+        # A no_fly_list `has_tags` context as chips. Reads the tag records
+        # through the context's association, so a table can preload it
+        # (`includes(:labels)`) to avoid a query per row.
+        class Tags < List
+          private
+
+          def normalize_value(value) = value.map(&:name)
+        end
+      end
+    end
+  end
+end

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

@@ -6,16 +6,29 @@ 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
+            return :tags if tags_field?
+            return :rich_text if rich_text_field?
+
+            # Mask the same secret-bearing names the form does, so the show
+            # page and table never print what the form refuses to echo.
+            return :password if secret_field_name?
+
             # has_cents decimal accessors infer as :float/:decimal; render money.
             return :currency if has_cents_field?
 
             case inferred_field_type
             when :attachment
               :attachment
+            when :binary
+              # phlexi-display falls back to :string, printing the raw bytes.
+              :binary
             when :boolean
               # phlexi-display falls back to :string, rendering "true"/"false".
               :boolean

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

@@ -41,8 +41,9 @@ module Plutonium
             link: "text-lg text-primary-600 dark:text-primary-400 hover:text-primary-500 dark:hover:text-primary-300 whitespace-pre-line transition-colors",
 
             # Color display
-            color: "flex items-center text-lg text-[var(--pu-text)] whitespace-pre-line",
-            color_indicator: "w-10 h-10 rounded-lg mr-3 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)]",
 
             # Boolean / badge pills — variant class is applied by the component.
             boolean: "",
@@ -57,6 +58,27 @@ module Plutonium
             json: "text-sm text-[var(--pu-text)] whitespace-pre font-mono bg-[var(--pu-surface-alt)] border border-[var(--pu-border-muted)] rounded-[var(--pu-radius-md)] p-4 overflow-x-auto",
             prefixed_icon: "w-6 h-6 mr-2 text-[var(--pu-text-muted)]",
             markdown: "format dark:format-invert format-primary max-w-none",
+            rich_text: "format dark:format-invert format-primary max-w-none",
+            key_value: "grid grid-cols-[auto_1fr] gap-x-6 gap-y-2 text-[var(--pu-text)]",
+            key_value_key: "font-medium text-[var(--pu-text-muted)] break-words",
+            key_value_value: "break-words",
+            key_value_nested: "font-mono text-sm",
+            list: "flex flex-wrap gap-1.5",
+            list_item: "pu-badge pu-badge-neutral",
+            relative_time: "text-lg 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-lg text-[var(--pu-text)] tabular-nums",
+            file_size: "text-lg text-[var(--pu-text)] tabular-nums",
+            progress: "flex items-center gap-3",
+            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-5 h-5 text-warning-500 fill-current",
+            rating_empty: "w-5 h-5 text-[var(--pu-border)]",
+            binary: "text-sm text-[var(--pu-text-muted)]",
 
             # Attachments
             attachment_value_wrapper: "grid grid-cols-[repeat(auto-fill,minmax(0,200px))] gap-4",

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

@@ -43,6 +43,11 @@ module Plutonium
           end
           alias_method :markdown_tag, :easymde_tag
 
+          # Action Text editor (Trix, or Lexxy when installed). See {Components::RichText}.
+          def rich_text_tag(**, &)
+            create_component(Components::RichText, :rich_text, **, &)
+          end
+
           def toggle_tag(**, &)
             create_component(Plutonium::UI::Form::Components::Toggle, :toggle, **, &)
           end
@@ -54,12 +59,30 @@ module Plutonium
           def password_tag(**, &)
             create_component(Components::Password, :password, **, &)
           end
+          alias_method :secret_tag, :password_tag
 
           def slim_select_tag(**attributes, &)
             attributes[:data_controller] = tokens(attributes[:data_controller], "slim-select")
             select_tag(**attributes, required: false, class!: "", &)
           end
 
+          # Chip input for array values. See {Components::List}.
+          def list_tag(**attributes, &)
+            attributes[:data_controller] = tokens(attributes[:data_controller], "slim-select")
+            create_component(Components::List, :select, required: false, class!: "", **attributes, &)
+          end
+
+          # Chip input for a no_fly_list `has_tags` context. See {Components::Tags}.
+          def tags_tag(**attributes, &)
+            attributes[:data_controller] = tokens(attributes[:data_controller], "slim-select")
+            create_component(Components::Tags, :select, required: false, class!: "", **attributes, &)
+          end
+
+          # Star picker. See {Components::Rating}.
+          def rating_tag(**, &)
+            create_component(Components::Rating, :rating, **, &)
+          end
+
           def flatpickr_tag(**, &)
             create_component(Components::Flatpickr, :flatpickr, **, &)
           end
@@ -86,6 +109,10 @@ module Plutonium
             alias_method :"#{name}_tag", :uppy_tag
           end
 
+          def binary_tag(**, &)
+            create_component(Components::Binary, :file, **, &)
+          end
+
           def key_value_store_tag(**, &)
             create_component(Components::KeyValueStore, :key_value_store, **, &)
           end
@@ -116,6 +143,9 @@ module Plutonium
           alias_method :belongs_to_tag, :secure_association_tag
           alias_method :has_many_tag, :secure_association_tag
           alias_method :has_one_tag, :secure_association_tag
+          # phlexi bound this to ITS has_many_tag at definition time, so it
+          # has to be re-pointed explicitly or habtm skips the policy scope.
+          alias_method :has_and_belongs_to_many_tag, :secure_association_tag
 
           def secure_polymorphic_association_tag(**attributes, &)
             attributes[:data_controller] = tokens(attributes[:data_controller], "slim-select") # TODO: put this behind a config
@@ -134,7 +164,6 @@ module Plutonium
           alias_method :datetime_tag, :flatpickr_tag
           alias_method :date_tag, :flatpickr_tag
           alias_method :time_tag, :flatpickr_tag
-          alias_method :rich_text_tag, :markdown_tag
           alias_method :json_tag, :json_input_tag
           alias_method :jsonb_tag, :json_input_tag
           alias_method :hstore_tag, :key_value_store_tag

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

@@ -0,0 +1,40 @@
+# frozen_string_literal: true
+
+module Plutonium
+  module UI
+    module Form
+      module Components
+        # File input for a `binary` column: the uploaded file's bytes become
+        # the value. Choosing no file extracts nil, which the resource
+        # controller compacts away, so an edit that doesn't replace the file
+        # keeps the stored bytes. There is no way to clear the column here.
+        class Binary < Phlexi::Form::Components::FileInput
+          protected
+
+          def build_input_attributes
+            super
+            apply_default_hint
+          end
+
+          def normalize_input(input_value)
+            input_value.read if input_value.is_a?(ActionDispatch::Http::UploadedFile)
+          end
+
+          private
+
+          # Says what a blank submit keeps: the bytes in the database, not a
+          # rejected upload still assigned to the record on a failed re-render.
+          def apply_default_hint
+            return if field.has_hint?
+
+            stored = field.object.attribute_in_database(field.key) if field.object.persisted?
+            return if stored.blank?
+
+            size = ActiveSupport::NumberHelper.number_to_human_size(stored.bytesize)
+            field.hint(Plutonium::Translation.t("plutonium.ui.form.binary.replace_hint", size:))
+          end
+        end
+      end
+    end
+  end
+end