From 34332cd8cc35da1eb08f51ab6e482b2ca7f781dc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jean=20Mendon=C3=A7a?= Date: Thu, 9 Jul 2026 12:39:55 -0300 Subject: [PATCH 1/3] feat(data_table): support custom label and initial column visibility in DataTableColumnToggle Adds a `label:` option (defaults to "Columns") so the trigger text can be localized/customized, and reads `:visible` per column so a column can start hidden (checkbox unchecked). Also adds `checked:` styling to the checkbox. Co-Authored-By: Claude Opus 4.8 --- .../data_table/data_table_column_toggle.rb | 12 +++++++---- .../ruby_ui/data_table_column_toggle_test.rb | 20 +++++++++++++++++++ 2 files changed, 28 insertions(+), 4 deletions(-) diff --git a/gem/lib/ruby_ui/data_table/data_table_column_toggle.rb b/gem/lib/ruby_ui/data_table/data_table_column_toggle.rb index ad20b217..b694b522 100644 --- a/gem/lib/ruby_ui/data_table/data_table_column_toggle.rb +++ b/gem/lib/ruby_ui/data_table/data_table_column_toggle.rb @@ -2,8 +2,9 @@ module RubyUI class DataTableColumnToggle < Base - def initialize(columns:, **attrs) + def initialize(columns:, label: "Columns", **attrs) @columns = columns + @label = label super(**attrs) end @@ -12,7 +13,7 @@ def view_template render RubyUI::DropdownMenu.new do render RubyUI::DropdownMenuTrigger.new do render RubyUI::Button.new(variant: :outline, size: :sm) do - plain "Columns" + plain @label # inline chevron-down SVG (lucide 24px, 1px stroke) svg( xmlns: "http://www.w3.org/2000/svg", @@ -35,8 +36,11 @@ def view_template label(class: "flex items-center gap-2 rounded-sm px-2 py-1.5 text-sm cursor-pointer hover:bg-accent") do input( type: "checkbox", - checked: true, - class: "h-4 w-4 rounded border border-input accent-primary cursor-pointer", + checked: col.fetch(:visible, true), + class: [ + "h-4 w-4 rounded border border-input accent-primary cursor-pointer", + "checked:bg-primary checked:text-primary-foreground dark:checked:bg-secondary checked:text-primary checked:border-primary" + ], data: { column_key: col[:key].to_s, action: "change->ruby-ui--data-table-column-visibility#toggle" diff --git a/gem/test/ruby_ui/data_table_column_toggle_test.rb b/gem/test/ruby_ui/data_table_column_toggle_test.rb index ef3c4527..5210d6b7 100644 --- a/gem/test/ruby_ui/data_table_column_toggle_test.rb +++ b/gem/test/ruby_ui/data_table_column_toggle_test.rb @@ -17,4 +17,24 @@ def test_renders_dropdown_with_checkbox_per_column assert_match(/Email/, output) assert_match(/Salary/, output) end + + def test_renders_a_custom_trigger_label + output = phlex do + RubyUI.DataTableColumnToggle(label: "Colunas", columns: [ + {key: :email, label: "Email"} + ]) + end + assert_match(/Colunas/, output) + end + + def test_column_can_start_hidden + output = phlex do + RubyUI.DataTableColumnToggle(columns: [ + {key: :email, label: "Email"}, + {key: :salary, label: "Salary", visible: false} + ]) + end + # only the visible column renders the `checked` attribute on its checkbox + assert_equal 1, output.scan("checked class=").length + end end From 8ae86063e33cb3e611eceacfbb627ec33c5f20c9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jean=20Mendon=C3=A7a?= Date: Thu, 9 Jul 2026 12:39:55 -0300 Subject: [PATCH 2/3] refactor(native_select): drop hardcoded chevron from NativeSelectIcon Co-Authored-By: Claude Opus 4.8 --- gem/lib/ruby_ui/native_select/native_select_icon.rb | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/gem/lib/ruby_ui/native_select/native_select_icon.rb b/gem/lib/ruby_ui/native_select/native_select_icon.rb index 1169df8a..3d4aeb81 100644 --- a/gem/lib/ruby_ui/native_select/native_select_icon.rb +++ b/gem/lib/ruby_ui/native_select/native_select_icon.rb @@ -25,9 +25,7 @@ def icon stroke_linejoin: "round", class: "size-4", aria_hidden: "true" - ) do |s| - s.path(d: "m6 9 6 6 6-6") - end + ) end def default_attrs From a06d7f12e5272e2c72b3263810e89140b558fd01 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jean=20Mendon=C3=A7a?= Date: Thu, 9 Jul 2026 12:50:31 -0300 Subject: [PATCH 3/3] chore(mcp): rebuild registry.json for DataTableColumnToggle and NativeSelectIcon Co-Authored-By: Claude Opus 4.8 --- mcp/data/registry.json | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/mcp/data/registry.json b/mcp/data/registry.json index 0c83744e..921a72b2 100644 --- a/mcp/data/registry.json +++ b/mcp/data/registry.json @@ -1182,7 +1182,7 @@ }, { "path": "data_table_column_toggle.rb", - "content": "# frozen_string_literal: true\n\nmodule RubyUI\n class DataTableColumnToggle < Base\n def initialize(columns:, **attrs)\n @columns = columns\n super(**attrs)\n end\n\n def view_template\n div(**attrs) do\n render RubyUI::DropdownMenu.new do\n render RubyUI::DropdownMenuTrigger.new do\n render RubyUI::Button.new(variant: :outline, size: :sm) do\n plain \"Columns\"\n # inline chevron-down SVG (lucide 24px, 1px stroke)\n svg(\n xmlns: \"http://www.w3.org/2000/svg\",\n width: \"16\",\n height: \"16\",\n viewBox: \"0 0 24 24\",\n fill: \"none\",\n stroke: \"currentColor\",\n stroke_width: \"2\",\n stroke_linecap: \"round\",\n stroke_linejoin: \"round\",\n class: \"w-4 h-4 ml-1\"\n ) do |s|\n s.polyline(points: \"6 9 12 15 18 9\")\n end\n end\n end\n render RubyUI::DropdownMenuContent.new do\n @columns.each do |col|\n label(class: \"flex items-center gap-2 rounded-sm px-2 py-1.5 text-sm cursor-pointer hover:bg-accent\") do\n input(\n type: \"checkbox\",\n checked: true,\n class: \"h-4 w-4 rounded border border-input accent-primary cursor-pointer\",\n data: {\n column_key: col[:key].to_s,\n action: \"change->ruby-ui--data-table-column-visibility#toggle\"\n }\n )\n span { plain col[:label] }\n end\n end\n end\n end\n end\n end\n\n private\n\n def default_attrs\n {\n class: \"relative\",\n data: {controller: \"ruby-ui--data-table-column-visibility\"}\n }\n end\n end\nend\n" + "content": "# frozen_string_literal: true\n\nmodule RubyUI\n class DataTableColumnToggle < Base\n def initialize(columns:, label: \"Columns\", **attrs)\n @columns = columns\n @label = label\n super(**attrs)\n end\n\n def view_template\n div(**attrs) do\n render RubyUI::DropdownMenu.new do\n render RubyUI::DropdownMenuTrigger.new do\n render RubyUI::Button.new(variant: :outline, size: :sm) do\n plain @label\n # inline chevron-down SVG (lucide 24px, 1px stroke)\n svg(\n xmlns: \"http://www.w3.org/2000/svg\",\n width: \"16\",\n height: \"16\",\n viewBox: \"0 0 24 24\",\n fill: \"none\",\n stroke: \"currentColor\",\n stroke_width: \"2\",\n stroke_linecap: \"round\",\n stroke_linejoin: \"round\",\n class: \"w-4 h-4 ml-1\"\n ) do |s|\n s.polyline(points: \"6 9 12 15 18 9\")\n end\n end\n end\n render RubyUI::DropdownMenuContent.new do\n @columns.each do |col|\n label(class: \"flex items-center gap-2 rounded-sm px-2 py-1.5 text-sm cursor-pointer hover:bg-accent\") do\n input(\n type: \"checkbox\",\n checked: col.fetch(:visible, true),\n class: [\n \"h-4 w-4 rounded border border-input accent-primary cursor-pointer\",\n \"checked:bg-primary checked:text-primary-foreground dark:checked:bg-secondary checked:text-primary checked:border-primary\"\n ],\n data: {\n column_key: col[:key].to_s,\n action: \"change->ruby-ui--data-table-column-visibility#toggle\"\n }\n )\n span { plain col[:label] }\n end\n end\n end\n end\n end\n end\n\n private\n\n def default_attrs\n {\n class: \"relative\",\n data: {controller: \"ruby-ui--data-table-column-visibility\"}\n }\n end\n end\nend\n" }, { "path": "data_table_column_visibility_controller.js", @@ -1898,7 +1898,7 @@ }, { "path": "native_select_icon.rb", - "content": "# frozen_string_literal: true\n\nmodule RubyUI\n class NativeSelectIcon < Base\n def view_template(&block)\n span(**attrs) do\n if block\n block.call\n else\n icon\n end\n end\n end\n\n private\n\n def icon\n svg(\n xmlns: \"http://www.w3.org/2000/svg\",\n viewbox: \"0 0 24 24\",\n fill: \"none\",\n stroke: \"currentColor\",\n stroke_width: \"2\",\n stroke_linecap: \"round\",\n stroke_linejoin: \"round\",\n class: \"size-4\",\n aria_hidden: \"true\"\n ) do |s|\n s.path(d: \"m6 9 6 6 6-6\")\n end\n end\n\n def default_attrs\n {\n class: \"text-muted-foreground pointer-events-none absolute top-1/2 right-2.5 -translate-y-1/2 select-none\"\n }\n end\n end\nend\n" + "content": "# frozen_string_literal: true\n\nmodule RubyUI\n class NativeSelectIcon < Base\n def view_template(&block)\n span(**attrs) do\n if block\n block.call\n else\n icon\n end\n end\n end\n\n private\n\n def icon\n svg(\n xmlns: \"http://www.w3.org/2000/svg\",\n viewbox: \"0 0 24 24\",\n fill: \"none\",\n stroke: \"currentColor\",\n stroke_width: \"2\",\n stroke_linecap: \"round\",\n stroke_linejoin: \"round\",\n class: \"size-4\",\n aria_hidden: \"true\"\n )\n end\n\n def default_attrs\n {\n class: \"text-muted-foreground pointer-events-none absolute top-1/2 right-2.5 -translate-y-1/2 select-none\"\n }\n end\n end\nend\n" }, { "path": "native_select_option.rb",