phlex-cmdk 0.1.0 → 0.1.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 64fd7358d8d5c71ef5038a191b08dd08f735ac5cd64319ba65617591b9fd5944
-  data.tar.gz: 796d52044bd196d61bdab9da53752a3fd1b12eac2612656531449506d67cd348
+  metadata.gz: 9c7f8212512b7ffc57adcf7d2428fb10994947b10cc82e920ff8b08d034255eb
+  data.tar.gz: 2ec4b781453015d628ff1976b0047a85195980b3584c7eaddc9e2672051e3586
 SHA512:
-  metadata.gz: 980b9a9b18c6965cf967a5f0fc1580294879f46f8a657dd3178bc7fd86f8f6dde2fefadb5b12604fefaa27cb188b9096fb44690419b1690b584e4c9feb666172
-  data.tar.gz: 7cb81bd470337f4278bf1388b47c39dcf127b76fbe6cb44f84737335d43c9fa20ffad6e55fa7b2de2a1c8275915861beaa074e40a4f035ec677e876bf545b73f
+  metadata.gz: f2bba3534f26915215bb0fea83fc2e5c5126d4ad34510997d932125693921c2374749d921043a6a65de8f0a9d3ef6082d8053224ca2fc6fc090d71010bb92db6
+  data.tar.gz: 6e1623684909b42f34634bd5bc037aa14266544b88b2ede7733d4899e878e843b415a1dd1a1d31ffb407f43bd925787f77e5839cf12551ac71952823fbfe840f

data/CHANGELOG.md

@@ -1,5 +1,13 @@
 # Changelog
 
+## 0.1.1 — 2026-06-15
+
+- docs: correct the Stimulus base controller import (the bare `cmdk`
+  specifier, not `./cmdk.js`); document `dialog_attributes:` and the
+  `cmdk-dialog-frame` theme class
+- internal: idiomatic Phlex content-block forwarding; deterministic group
+  heading ids (monotonic, replacing a random suffix). No markup or API changes.
+
 ## 0.1.0 — 2026-06-15
 
 Initial release: a feature-parity Phlex port of the cmdk React command menu.

data/README.md

@@ -147,6 +147,20 @@ Renders a native `<dialog cmdk-dialog>`: Escape and backdrop clicks close it, an
 `Cmdk.openDialog(el)` / `Cmdk.closeDialog(el)` toggle it programmatically. Style the
 backdrop with `dialog[cmdk-dialog]::backdrop` (replaces Radix's `[cmdk-overlay]`).
 
+Extra attributes on `Cmdk::Dialog(...)` go to the inner `Cmdk::Root`; to set
+attributes on the `<dialog>` element itself, pass `dialog_attributes:`. The
+shipped themes style the dialog frame (transparent border, entry animation)
+behind a `cmdk-dialog-frame` class, opt in the same way you opt into the menu
+theme - by asking for the class:
+
+```ruby
+Cmdk::Dialog(label: 'Command Menu', hotkey: 'k', class: 'cmdk',
+             dialog_attributes: { class: 'cmdk-dialog-frame' }) do
+  Cmdk::Input()
+  Cmdk::List() { ... }
+end
+```
+
 By default the dialog renders as a top-third, horizontally centered palette; on
 viewports ≤640px it becomes a top-anchored, full-width sheet (the GitHub/Jira
 pattern - the software keyboard owns the bottom of the screen, so the input
@@ -280,7 +294,8 @@ The bubbling events work with plain action descriptors - no controller required:
 
 For more structure, the gem ships an optional base controller
 (`Cmdk.stimulus_controller_path`; serve it next to the runtime, it imports
-`./cmdk.js` and `@hotwired/stimulus`). Extend it and override the hooks:
+the runtime as the bare specifier `cmdk` and `@hotwired/stimulus`). Extend it
+and override the hooks:
 
 ```js
 import CmdkController from 'cmdk_controller' // pin to Cmdk.stimulus_controller_path

data/assets/js/cmdk_controller.js

@@ -8,7 +8,7 @@
  *
  * Extend it and override the hooks you care about:
  *
- *   import CmdkController from 'phlex-cmdk/controller' // or the copied file
+ *   import CmdkController from 'cmdk_controller' // pin to Cmdk.stimulus_controller_path
  *
  *   export default class extends CmdkController {
  *     itemSelected({ detail: { value } }) { this.runCommand(value) }

data/lib/cmdk/base.rb

@@ -10,6 +10,12 @@ module Cmdk
     # Merge user-supplied attributes into the component's defaults.
     # User values win, except `class` and `style` which are concatenated
     # and `data` hashes which are merged.
+    #
+    # Deliberately not Phlex's `mix`: `mix` treats *every* attribute as a
+    # token list (e.g. `mix({role: 'option'}, {role: 'button'})` yields
+    # `role: 'option button'`), which is wrong for scalar attributes like
+    # `role`/`type`/`tabindex`/`aria-selected` that should be replaced, not
+    # appended. Here only `class`/`style`/`data` combine; other scalars override.
     def merged(defaults, overrides)
       defaults.merge(overrides) do |key, default, override|
         case key

data/lib/cmdk/empty.rb

@@ -9,7 +9,7 @@ module Cmdk
 
     def view_template(&block)
       defaults = { 'cmdk-empty' => '', role: 'presentation', style: 'display:none' }
-      div(**merged(defaults, @attributes)) { block ? block.call : nil }
+      div(**merged(defaults, @attributes), &block)
     end
   end
 end

data/lib/cmdk/footer.rb

@@ -19,11 +19,7 @@ module Cmdk
 
     def view_template(&block)
       div(**merged({ 'cmdk-footer' => '' }, @attributes)) do
-        if block
-          block.call
-        else
-          div('cmdk-footer-hint' => '')
-        end
+        block ? block.call : div('cmdk-footer-hint' => '')
       end
     end
   end

data/lib/cmdk/group.rb

@@ -1,10 +1,18 @@
-require 'securerandom'
-
 module Cmdk
   # Groups items together with an optional heading. Port of `<Command.Group>`.
   # Provide `value:` when there is no heading (it is used for sorting groups);
   # with a string heading the value is inferred from it, matching React cmdk.
   class Group < Base
+    # Monotonic id source for `aria-labelledby` (the analog of React's useId,
+    # which this port mirrors). Deterministic and collision-free, unlike a
+    # random suffix; the mutex keeps it correct under threaded servers.
+    @heading_seq = 0
+    @heading_mutex = Mutex.new
+
+    def self.next_heading_id
+      @heading_mutex.synchronize { "cmdk-heading-#{@heading_seq += 1}" }
+    end
+
     def initialize(heading: nil, value: nil, force_mount: false, scope: nil, scope_only: false,
                    server_filtered: false, **attributes)
       @heading = heading
@@ -17,15 +25,13 @@ module Cmdk
     end
 
     def view_template(&block)
-      heading_id = @heading ? "cmdk-heading-#{SecureRandom.hex(4)}" : nil
+      heading_id = @heading ? Group.next_heading_id : nil
 
       div(**merged(group_attributes, @attributes)) do
         if @heading
           div('cmdk-group-heading' => '', aria_hidden: 'true', id: heading_id) { @heading }
         end
-        div('cmdk-group-items' => '', role: 'group', aria_labelledby: heading_id) do
-          block ? block.call : nil
-        end
+        div('cmdk-group-items' => '', role: 'group', aria_labelledby: heading_id, &block)
       end
     end
 

data/lib/cmdk/item.rb

@@ -24,7 +24,7 @@ module Cmdk
     end
 
     def view_template(&block)
-      div(**merged(item_attributes, @attributes)) { block ? block.call : nil }
+      div(**merged(item_attributes, @attributes), &block)
     end
 
     private

data/lib/cmdk/list.rb

@@ -10,7 +10,7 @@ module Cmdk
 
     def view_template(&block)
       div(**merged({ 'cmdk-list' => '', role: 'listbox', tabindex: '-1', aria_label: @label }, @attributes)) do
-        div('cmdk-list-sizer' => '') { block ? block.call : nil }
+        div('cmdk-list-sizer' => '', &block)
       end
     end
   end

data/lib/cmdk/loading.rb

@@ -18,7 +18,7 @@ module Cmdk
         aria_label: @label
       }
       div(**merged(defaults, @attributes)) do
-        div(aria_hidden: 'true') { block ? block.call : nil }
+        div(aria_hidden: 'true', &block)
       end
     end
   end

data/lib/cmdk/root.rb

@@ -33,16 +33,12 @@ module Cmdk
     def view_template(&block)
       div(**merged(root_attributes, @attributes)) do
         label('cmdk-label' => '', style: SR_ONLY_STYLE) { @label }
-        yield_content(&block)
+        block&.call
       end
     end
 
     private
 
-    def yield_content(&block)
-      block ? block.call : nil
-    end
-
     def root_attributes
       data = {}
       data[:cmdk_should_filter] = 'false' unless @should_filter

data/lib/cmdk/version.rb

@@ -1,3 +1,3 @@
 module Cmdk
-  VERSION = '0.1.0'
+  VERSION = '0.1.1'
 end

metadata

@@ -1,13 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: phlex-cmdk
 version: !ruby/object:Gem::Version
-  version: 0.1.0
+  version: 0.1.1
 platform: ruby
 authors:
 - Leon Gieser
+autorequire: 
 bindir: bin
 cert_chain: []
-date: 1980-01-02 00:00:00.000000000 Z
+date: 2026-06-15 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: phlex
@@ -67,6 +68,7 @@ metadata:
   source_code_uri: https://github.com/leongieser/phlex-cmdk
   changelog_uri: https://github.com/leongieser/phlex-cmdk/blob/main/CHANGELOG.md
   rubygems_mfa_required: 'true'
+post_install_message: 
 rdoc_options: []
 require_paths:
 - lib
@@ -81,7 +83,8 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 4.0.10
+rubygems_version: 3.0.3.1
+signing_key: 
 specification_version: 4
 summary: 'Fast, composable command menu for Phlex: a port of cmdk (React).'
 test_files: []