@data-slot/dropdown-menu 0.2.163 → 0.2.165

package/README.md

@@ -1,6 +1,6 @@
 # @data-slot/dropdown-menu
 
-Headless dropdown menu component with full keyboard navigation and ARIA support.
+Headless dropdown menu for vanilla JavaScript. Supports action items, single-select radio items, and multi-select checkbox items with full keyboard navigation and ARIA support.
 
 ## Installation
 
@@ -10,22 +10,47 @@ npm install @data-slot/dropdown-menu
 
 ## Usage
 
-### HTML Structure
+### Action Menu
 
 ```html
 <div data-slot="dropdown-menu">
-  <button data-slot="dropdown-menu-trigger">Options</button>
+  <button data-slot="dropdown-menu-trigger">Actions</button>
   <div data-slot="dropdown-menu-content">
-    <div data-slot="dropdown-menu-group">
-      <div data-slot="dropdown-menu-label">Actions</div>
-      <button data-slot="dropdown-menu-item">
-        Edit
-        <span data-slot="dropdown-menu-shortcut">Ctrl+E</span>
-      </button>
-      <button data-slot="dropdown-menu-item" data-variant="destructive">Delete</button>
-    </div>
-    <div data-slot="dropdown-menu-separator"></div>
-    <button data-slot="dropdown-menu-item" data-disabled>Disabled</button>
+    <button data-slot="dropdown-menu-item" data-value="edit">Edit</button>
+    <button data-slot="dropdown-menu-item" data-value="copy">Copy</button>
+    <button data-slot="dropdown-menu-item" data-variant="destructive" data-value="delete">
+      Delete
+    </button>
+  </div>
+</div>
+```
+
+### Single-Select Menu
+
+```html
+<div data-slot="dropdown-menu" data-default-value="pro">
+  <button data-slot="dropdown-menu-trigger">Plan</button>
+  <div data-slot="dropdown-menu-content">
+    <button data-slot="dropdown-menu-radio-item" data-value="starter">Starter</button>
+    <button data-slot="dropdown-menu-radio-item" data-value="pro">Pro</button>
+    <button data-slot="dropdown-menu-radio-item" data-value="team">Team</button>
+  </div>
+</div>
+```
+
+### Multi-Select Menu
+
+```html
+<div
+  data-slot="dropdown-menu"
+  data-close-on-select="false"
+  data-default-values='["email","push"]'
+>
+  <button data-slot="dropdown-menu-trigger">Channels</button>
+  <div data-slot="dropdown-menu-content">
+    <button data-slot="dropdown-menu-checkbox-item" data-value="email">Email</button>
+    <button data-slot="dropdown-menu-checkbox-item" data-value="sms">SMS</button>
+    <button data-slot="dropdown-menu-checkbox-item" data-value="push">Push</button>
   </div>
 </div>
 ```
@@ -35,24 +60,49 @@ npm install @data-slot/dropdown-menu
 ```js
 import { create, createDropdownMenu } from "@data-slot/dropdown-menu";
 
-// Auto-bind all dropdown menus in the document
 const controllers = create();
 
-// Or bind a specific element
 const root = document.querySelector('[data-slot="dropdown-menu"]');
 const controller = createDropdownMenu(root, {
-  onOpenChange: (open) => console.log("Menu open:", open),
-  onSelect: (value) => console.log("Selected:", value),
+  onOpenChange: (open) => console.log("open:", open),
+  onSelect: (value) => console.log("activation:", value),
+  onValueChange: (value) => console.log("radio value:", value),
+  onValuesChange: (values) => console.log("checkbox values:", values),
 });
 
-// Programmatic control
-controller.open();
-controller.close();
-controller.toggle();
+controller.set({ value: "pro" });
+controller.set({ values: ["email", "push"] });
+controller.set({ open: true, highlightedValue: "push" });
 controller.destroy();
 ```
 
-`createDropdownMenu(root)` is idempotent per root. Calling it again for the same element returns the existing controller; destroy it first if you need to rebind with different options.
+`createDropdownMenu(root)` is idempotent per root. Calling it again for the same element returns the existing controller.
+
+## Controller
+
+```ts
+interface DropdownMenuController {
+  open(): void;
+  close(): void;
+  toggle(): void;
+  set(detail: DropdownMenuSetDetail): void;
+  readonly isOpen: boolean;
+  readonly value: string | null;
+  readonly values: string[];
+  readonly highlightedValue: string | null;
+  destroy(): void;
+}
+```
+
+`set()` applies fields in this order: `value`, `values`, `open`, `highlightedValue`.
+
+- `set({ value })` commits radio selection.
+- `set({ values })` commits checkbox selection.
+- `set({ open })` opens or closes the menu.
+- `set({ highlightedValue })` updates highlight only while the menu is open.
+- Programmatic `set()` never emits `dropdown-menu:select`.
+- No-op updates are silent.
+- Unknown `value` / `values` targets are ignored, not thrown.
 
 ## Slots
 
@@ -60,16 +110,18 @@ controller.destroy();
 |------|-------------|
 | `dropdown-menu` | Root container |
 | `dropdown-menu-trigger` | Button that opens the menu |
-| `dropdown-menu-content` | The menu panel |
+| `dropdown-menu-content` | Menu panel |
+| `dropdown-menu-item` | Action item with no owned selection state |
+| `dropdown-menu-radio-item` | Single-select menu item |
+| `dropdown-menu-checkbox-item` | Multi-select menu item |
 | `dropdown-menu-group` | Groups related items |
-| `dropdown-menu-label` | Non-interactive label for groups |
-| `dropdown-menu-item` | Clickable menu item |
+| `dropdown-menu-label` | Non-interactive label |
 | `dropdown-menu-separator` | Visual divider |
 | `dropdown-menu-shortcut` | Keyboard shortcut hint |
-| `dropdown-menu-positioner` | Optional authored positioning wrapper (reused instead of generated wrapper) |
-| `dropdown-menu-portal` | Optional authored portal wrapper that can contain `dropdown-menu-positioner` |
+| `dropdown-menu-positioner` | Optional authored positioning wrapper |
+| `dropdown-menu-portal` | Optional authored portal wrapper that contains `dropdown-menu-positioner` |
 
-### Composed Portal Markup (Optional)
+### Composed Portal Markup
 
 ```html
 <div data-slot="dropdown-menu">
@@ -82,166 +134,223 @@ controller.destroy();
 </div>
 ```
 
-## Data Attributes
+## State and Data Attributes
+
+### Root and Content
 
-| Attribute | Values | Description |
+| Attribute | Target | Description |
 |-----------|--------|-------------|
-| `data-state` | `open`, `closed` | Current menu state (on root and content) |
-| `data-side` | `top`, `right`, `bottom`, `left` | Computed side after collision avoidance (may flip) |
-| `data-align` | `start`, `center`, `end` | Requested alignment (position may shift to fit viewport) |
-| `data-variant` | `default`, `destructive` | Item variant for styling |
-| `data-inset` | - | Adds left padding for alignment |
-| `data-disabled` | - | Disables the item |
-| `data-highlighted` | - | Focused/highlighted item |
-| `data-value` | string | Optional value for item selection |
+| `data-state="open|closed"` | root, content | Current open state |
+| `data-open` / `data-closed` | root, content | Presence aliases for state styling |
+| `data-value="..."` | root | Current committed radio value only |
+| `data-side` | content, positioner | Computed side after collision handling |
+| `data-align` | content, positioner | Computed alignment after collision handling |
+
+### Items
+
+| Attribute | Target | Description |
+|-----------|--------|-------------|
+| `data-highlighted` | item | Current highlighted item |
+| `data-checked` | radio, checkbox items | Current committed checked state |
+| `data-disabled` | item | Disabled item |
+| `data-variant` | item | Styling hook such as `destructive` |
+| `data-inset` | item | Styling hook for left padding |
+
+### Defaults and Options
+
+| Attribute | Target | Description |
+|-----------|--------|-------------|
+| `data-default-open` | root | Initial open state |
+| `data-default-value` | root | Initial radio value |
+| `data-default-values='["a","b"]'` | root | Initial checkbox values as a JSON array string |
+| `data-default-checked` | radio, checkbox item | Item-level default checked state |
+| `data-close-on-click-outside` | root | Close on outside interaction |
+| `data-close-on-escape` | root | Close on Escape |
+| `data-close-on-select` | root | Close after accepted activation |
+| `data-highlight-item-on-hover` | root | Highlight and focus items on hover |
+
+Default precedence is:
+
+1. JavaScript options
+2. Root data attributes
+3. Item `data-default-checked`
+4. Empty state
+
+For radio items, root defaults win over item defaults. For checkbox items, root `data-default-values` wins over item `data-default-checked`.
 
 ## Keyboard Navigation
 
 | Key | Action |
 |-----|--------|
-| `Enter` / `Space` | Open menu (on trigger) or activate item |
-| `ArrowDown` | Open menu (on trigger) or move to next item |
-| `ArrowUp` | Move to previous item |
-| `Home` | Move to first item |
-| `End` | Move to last item |
+| `Enter` / `Space` | Open menu from trigger, or activate highlighted item |
+| `ArrowDown` | Open menu from trigger, or move to next enabled item |
+| `ArrowUp` | Move to previous enabled item |
+| `Home` | Move to first enabled item |
+| `End` | Move to last enabled item |
 | `Escape` | Close menu |
-| `A-Z` | Jump to item starting with letter (typeahead) |
+| `Tab` | Close menu and continue tab order |
+| `A-Z` | Typeahead by item text |
 
 ## Events
 
 ### Outbound Events
 
-| Event | Detail | Description |
-|-------|--------|-------------|
-| `dropdown-menu:change` | `{ open: boolean }` | Fired when menu opens or closes |
-| `dropdown-menu:select` | `{ value: string }` | Fired when an item is selected |
+| Event | Detail | Notes |
+|-------|--------|-------|
+| `dropdown-menu:open-change` | `{ open, previousOpen, source, reason }` | Fires on real open-state changes |
+| `dropdown-menu:change` | same detail | Deprecated alias for `open-change`; only `detail.open` is compatibility-guaranteed |
+| `dropdown-menu:highlight-change` | `{ value, previousValue, item, previousItem, source }` | `value` and `item` become `null` when highlight clears |
+| `dropdown-menu:select` | `{ value, item, itemType, source, checked? }` | Cancelable, user-only, fires before commit |
+| `dropdown-menu:value-change` | `{ value, previousValue, item, previousItem, source }` | Radio commits only |
+| `dropdown-menu:values-change` | `{ values, previousValues, changedValue, checked, item, source }` | Checkbox commits only |
+
+`dropdown-menu:select` behavior:
+
+- Fires only for user activation attempts. Disabled items and programmatic updates do not emit it.
+- If `event.preventDefault()` is called, no selection state changes and no auto-close from selection occur.
+- Programmatic updates never emit it.
+
+`dropdown-menu:value-change`, `dropdown-menu:values-change`, `onValueChange`, and `onValuesChange` are silent on:
 
-### Inbound Events
+- initialization
+- no-op commits
+- ignored unknown targets
+
+For `dropdown-menu:values-change`, `changedValue`, `checked`, and `item` are `null` when one programmatic update changes more than one checkbox at once.
+
+### Inbound Event
 
 | Event | Detail | Description |
 |-------|--------|-------------|
-| `dropdown-menu:set` | `{ open: boolean }` | Set open state programmatically |
+| `dropdown-menu:set` | `DropdownMenuSetDetail` | Partial programmatic state update |
 
-```javascript
-// Open the menu
+```js
 root.dispatchEvent(
-  new CustomEvent("dropdown-menu:set", { detail: { open: true } })
+  new CustomEvent("dropdown-menu:set", {
+    detail: { value: "pro", source: "restore" },
+  })
 );
 
-// Close the menu
 root.dispatchEvent(
-  new CustomEvent("dropdown-menu:set", { detail: { open: false } })
+  new CustomEvent("dropdown-menu:set", {
+    detail: { values: ["email", "push"], open: true },
+  })
 );
 ```
 
-#### Deprecated Shapes
+### Event Order
 
-The following shape is deprecated and will be removed in v1.0:
+User radio selection:
 
-```javascript
-// Deprecated: { value: boolean }
-root.dispatchEvent(
-  new CustomEvent("dropdown-menu:set", { detail: { value: true } })
-);
-```
+1. `dropdown-menu:select`
+2. `dropdown-menu:value-change`
+3. `dropdown-menu:open-change` if the menu closes
+
+User checkbox selection:
+
+1. `dropdown-menu:select`
+2. `dropdown-menu:values-change`
+3. `dropdown-menu:open-change` if the menu closes
+
+Programmatic selection:
 
-Use `{ open: boolean }` instead.
+1. `dropdown-menu:set` or `controller.set(...)`
+2. `dropdown-menu:value-change` or `dropdown-menu:values-change`
+3. No `dropdown-menu:select`
+
+If closing the menu also clears an existing highlight, `dropdown-menu:highlight-change` is emitted before the close-side `dropdown-menu:open-change`.
 
 ## Options
 
 ```ts
 interface DropdownMenuOptions {
-  /** Initial open state */
   defaultOpen?: boolean;
-  /** Callback when open state changes */
+  defaultValue?: string | null;
+  defaultValues?: string[];
   onOpenChange?: (open: boolean) => void;
-  /** Callback when an item is selected */
   onSelect?: (value: string) => void;
-  /** Close when clicking outside (default: true) */
+  onValueChange?: (value: string | null) => void;
+  onValuesChange?: (values: string[]) => void;
   closeOnClickOutside?: boolean;
-  /** Close when pressing Escape (default: true) */
   closeOnEscape?: boolean;
-  /** Close when an item is selected (default: true) */
   closeOnSelect?: boolean;
-  /** Highlight and focus items on pointer hover (default: true) */
   highlightItemOnHover?: boolean;
-
-  // Positioning options (Radix-compatible)
-  /** Preferred side of trigger: "top" | "right" | "bottom" | "left" (default: "bottom") */
   side?: "top" | "right" | "bottom" | "left";
-  /** Alignment against trigger: "start" | "center" | "end" (default: "start") */
   align?: "start" | "center" | "end";
-  /** Distance from trigger in px (default: 4) */
   sideOffset?: number;
-  /** Offset from alignment edge in px (default: 0) */
   alignOffset?: number;
-  /** Flip/shift to stay in viewport (default: true) */
   avoidCollisions?: boolean;
-  /** Viewport edge padding in px (default: 8) */
   collisionPadding?: number;
+  lockScroll?: boolean;
 }
 ```
 
-### Data Attribute Options
+Notes:
 
-Options can also be set via data attributes. JS options take precedence.
+- `closeOnSelect` defaults to `true`. Multi-select menus usually want `false`.
+- `onSelect` tracks accepted user activation. It does not fire for programmatic state changes.
+- `onValueChange` and `onValuesChange` follow the same silence rules as their DOM events.
 
-Placement attributes (`data-side`, `data-align`, `data-side-offset`, `data-align-offset`, `data-avoid-collisions`, `data-collision-padding`) resolve in this order:
+## Downstream Wrapper Contract
 
-1. JavaScript option
-2. `dropdown-menu-content`
-3. `dropdown-menu-positioner`
-4. `dropdown-menu` root (fallback)
-
-| Attribute | Type | Default | Description |
-|-----------|------|---------|-------------|
-| `data-default-open` | boolean | `false` | Initial open state |
-| `data-close-on-click-outside` | boolean | `true` | Close when clicking outside |
-| `data-close-on-escape` | boolean | `true` | Close when pressing Escape |
-| `data-close-on-select` | boolean | `true` | Close when an item is selected |
-| `data-highlight-item-on-hover` | boolean | `true` | Highlight and focus items on pointer hover |
-| `data-side` | string | `"bottom"` | Preferred side: top, right, bottom, left |
-| `data-align` | string | `"start"` | Alignment: start, center, end |
-| `data-side-offset` | number | `4` | Distance from trigger in px |
-| `data-align-offset` | number | `0` | Offset from alignment edge in px |
-| `data-avoid-collisions` | boolean | `true` | Flip/shift to stay in viewport |
-| `data-collision-padding` | number | `8` | Viewport edge padding in px |
-
-Boolean attributes: present or `"true"` = true, `"false"` = false, absent = default.
+This package does not ship Astro components, but downstream wrappers should mirror this authoring model:
 
-```html
-<!-- Menu positioned at top with larger offset -->
-<div data-slot="dropdown-menu" data-side="top" data-side-offset="8">
-  ...
-</div>
+- `DropdownMenuItem` renders `data-slot="dropdown-menu-item"`.
+- `DropdownMenuRadioItem` renders `data-slot="dropdown-menu-radio-item"` and requires `value`.
+- `DropdownMenuCheckboxItem` renders `data-slot="dropdown-menu-checkbox-item"` and requires `value`.
+- Radio and checkbox wrappers may expose `defaultChecked`, but root defaults still take precedence over item defaults.
 
-<!-- Menu that stays open after selection -->
-<div data-slot="dropdown-menu" data-close-on-select="false">
-  ...
-</div>
+## Deprecated APIs
+
+The following compatibility APIs are deprecated and will be removed in the next major release:
+
+```js
+// Deprecated open-state alias
+root.addEventListener("dropdown-menu:change", (event) => {
+  console.log(event.detail.open);
+});
+
+// Deprecated programmatic shape
+root.dispatchEvent(
+  new CustomEvent("dropdown-menu:set", { detail: { value: true } })
+);
 ```
 
+Use `dropdown-menu:open-change` and `dropdown-menu:set { open: boolean }` instead.
+
+## Migration Notes
+
+If you currently use dropdown-menu as a picker:
+
+- Replace picker-style `dropdown-menu-item` usage with `dropdown-menu-radio-item` or `dropdown-menu-checkbox-item`.
+- Stop manually writing `data-selected` or `data-checked`.
+- Listen to `dropdown-menu:value-change` or `dropdown-menu:values-change` for committed state.
+- Push external restore/randomize/popstate/storage changes back in through `controller.set(...)` or `dropdown-menu:set`.
+- Switch open-state listeners from `dropdown-menu:change` to `dropdown-menu:open-change`.
+
 ## Positioning
 
-The dropdown menu uses `position: fixed` and automatically positions itself relative to the trigger. It supports all standard placement options:
+Placement attributes (`data-side`, `data-align`, `data-side-offset`, `data-align-offset`, `data-avoid-collisions`, `data-collision-padding`) resolve in this order:
+
+1. JavaScript option
+2. `dropdown-menu-content`
+3. `dropdown-menu-positioner`
+4. `dropdown-menu` root
+
+The dropdown menu uses `position: fixed` by default and automatically positions itself relative to the trigger:
 
 ```js
 createDropdownMenu(root, {
-  side: "bottom",     // top, right, bottom, left
-  align: "start",     // start, center, end
-  sideOffset: 4,      // gap from trigger
-  alignOffset: 0,     // shift along alignment axis
+  side: "bottom",
+  align: "start",
+  sideOffset: 4,
+  alignOffset: 0,
   avoidCollisions: true,
   collisionPadding: 8,
 });
 ```
 
-When `avoidCollisions` is enabled (default), the menu will:
-- Flip to the opposite side if it would overflow the viewport
-- Shift/clamp to stay within the viewport with the specified padding
-
-The content element receives `data-side` (computed, may flip) and `data-align` (requested, position may shift) attributes, useful for animations.
-The positioned element (`dropdown-menu-positioner`, or `dropdown-menu-content` when no positioner is used) also receives `--transform-origin` for scale/zoom animation origins.
+When `avoidCollisions` is enabled, the menu may flip sides or shift within the viewport. The positioned element also receives `--transform-origin` for animation origins.
 
 ## License
 

package/dist/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require(`@data-slot/core`);const t=[`top`,`right`,`bottom`,`left`],n=[`start`,`center`,`end`],r=`@data-slot/dropdown-menu`;function i(i,a={}){let o=(0,e.reuseRootBinding)(i,r,`[@data-slot/dropdown-menu] createDropdownMenu() called more than once for the same root. Returning the existing controller. Destroy it before rebinding with new options.`);if(o)return o;let s=(0,e.getPart)(i,`dropdown-menu-trigger`),c=(0,e.getPart)(i,`dropdown-menu-content`),l=(0,e.getPart)(i,`dropdown-menu-positioner`),u=l&&c&&l.contains(c)?l:null,d=(0,e.getPart)(i,`dropdown-menu-portal`),f=d&&u&&d.contains(u)?d:null;if(!s||!c)throw Error(`DropdownMenu requires trigger and content slots`);let p=a.defaultOpen??(0,e.getDataBool)(i,`defaultOpen`)??!1,m=a.onOpenChange,h=a.onSelect,ee=a.closeOnClickOutside??(0,e.getDataBool)(i,`closeOnClickOutside`)??!0,g=a.closeOnEscape??(0,e.getDataBool)(i,`closeOnEscape`)??!0,_=a.closeOnSelect??(0,e.getDataBool)(i,`closeOnSelect`)??!0,v=(t,n)=>(0,e.getDataEnum)(c,t,n)??(u?(0,e.getDataEnum)(u,t,n):void 0)??(0,e.getDataEnum)(i,t,n),y=t=>(0,e.getDataNumber)(c,t)??(u?(0,e.getDataNumber)(u,t):void 0)??(0,e.getDataNumber)(i,t),te=t=>(0,e.getDataBool)(c,t)??(u?(0,e.getDataBool)(u,t):void 0)??(0,e.getDataBool)(i,t),b=a.side??v(`side`,t)??`bottom`,x=a.align??v(`align`,n)??`start`,S=a.sideOffset??y(`sideOffset`)??4,C=a.alignOffset??y(`alignOffset`)??0,ne=a.avoidCollisions??te(`avoidCollisions`)??!0,re=a.collisionPadding??y(`collisionPadding`)??8,w=a.lockScroll??(0,e.getDataBool)(i,`lockScroll`)??!0,T=a.highlightItemOnHover??(0,e.getDataBool)(i,`highlightItemOnHover`)??!0,E=!1,D=null,O=-1,k=``,A=null,j=!1,M=[],N=!1,P=(0,e.createPortalLifecycle)({content:c,root:i,wrapperSlot:u?void 0:`dropdown-menu-positioner`,container:u??void 0,mountTarget:u?f??u:void 0}),F=!1,I=[],L=[],R=new Map,z=e=>e.hasAttribute(`disabled`)||e.hasAttribute(`data-disabled`)||e.getAttribute(`aria-disabled`)===`true`,B=e=>e.pointerType!==`touch`,V=(0,e.ensureId)(s,`dropdown-menu-trigger`),H=(0,e.ensureId)(c,`dropdown-menu-content`);s.setAttribute(`aria-haspopup`,`menu`),s.setAttribute(`aria-controls`,H),c.setAttribute(`role`,`menu`),c.setAttribute(`aria-labelledby`,V),c.tabIndex=-1;let U=()=>{I=(0,e.getParts)(c,`dropdown-menu-item`);for(let e of I)e.setAttribute(`role`,`menuitem`),e.hasAttribute(`data-disabled`)||e.hasAttribute(`disabled`)?e.setAttribute(`aria-disabled`,`true`):e.removeAttribute(`aria-disabled`),e.tabIndex=-1;L=I.filter(e=>!z(e)),R=new Map(L.map((e,t)=>[e,t]))},W=()=>{let t=P.container,n=i.ownerDocument.defaultView??window,r=s.getBoundingClientRect(),a=(0,e.computeFloatingPosition)({anchorRect:r,contentRect:(0,e.measurePopupContentRect)(c),side:b,align:x,sideOffset:S,alignOffset:C,avoidCollisions:ne,collisionPadding:re}),o=(0,e.computeFloatingTransformOrigin)({side:a.side,align:a.align,anchorRect:r,popupX:a.x,popupY:a.y});w?(t.style.position=`fixed`,t.style.top=`0px`,t.style.left=`0px`,t.style.transform=`translate3d(${a.x}px, ${a.y}px, 0)`):(t.style.position=`absolute`,t.style.top=`0px`,t.style.left=`0px`,t.style.transform=`translate3d(${a.x+n.scrollX}px, ${a.y+n.scrollY}px, 0)`),t.style.setProperty(`--transform-origin`,o),t.style.willChange=`transform`,t.style.margin=`0`,c.setAttribute(`data-side`,a.side),c.setAttribute(`data-align`,a.align),t!==c&&(t.setAttribute(`data-side`,a.side),t.setAttribute(`data-align`,a.align))},G=(0,e.createPositionSync)({observedElements:[s,c],isActive:()=>E,ancestorScroll:w,onUpdate:W}),K=(t,n=!0)=>{for(let r=0;r<L.length;r++){let i=L[r];r===t?(i.setAttribute(`data-highlighted`,``),(0,e.ensureItemVisibleInContainer)(i,c),n&&i.focus()):i.removeAttribute(`data-highlighted`)}O=t},q=()=>{for(let e of I)e.removeAttribute(`data-highlighted`);O=-1},J=()=>{q(),(0,e.focusElement)(c)},Y=e=>{i.setAttribute(`data-state`,e),c.setAttribute(`data-state`,e),e===`open`?(i.setAttribute(`data-open`,``),c.setAttribute(`data-open`,``),i.removeAttribute(`data-closed`),c.removeAttribute(`data-closed`)):(i.setAttribute(`data-closed`,``),c.setAttribute(`data-closed`,``),i.removeAttribute(`data-open`),c.removeAttribute(`data-open`))},ie=()=>{requestAnimationFrame(()=>{D&&document.contains(D)?(0,e.focusElement)(D):s&&document.contains(s)&&(0,e.focusElement)(s),D=null})},X=(0,e.createPresenceLifecycle)({element:c,onExitComplete:()=>{F||(P.restore(),c.hidden=!0,ie())}}),Z=t=>{E!==t&&(t?(D=document.activeElement,E=!0,(0,e.setAria)(s,`expanded`,!0),P.mount(),c.hidden=!1,Y(`open`),X.enter(),w&&!N&&((0,e.lockScroll)(),N=!0),U(),j=!1,q(),G.start(),W(),G.update(),c.focus()):(E=!1,(0,e.setAria)(s,`expanded`,!1),Y(`closed`),q(),k=``,j=!1,N&&=((0,e.unlockScroll)(),!1),G.stop(),X.exit()),(0,e.emit)(i,`dropdown-menu:change`,{open:E}),m?.(E))},Q=t=>{if(z(t))return;let n=t.dataset.value||t.textContent?.trim()||``;(0,e.emit)(i,`dropdown-menu:select`,{value:n}),h?.(n),_&&Z(!1)},ae=e=>{let t=L.length;if(t!==0)switch(e.key){case`ArrowDown`:e.preventDefault(),j=!0,K(O===-1?0:(O+1)%t);break;case`ArrowUp`:e.preventDefault(),j=!0,K(O===-1?t-1:(O-1+t)%t);break;case`Home`:e.preventDefault(),j=!0,K(0);break;case`End`:e.preventDefault(),j=!0,K(t-1);break;case`Enter`:case` `:e.preventDefault(),O>=0&&Q(L[O]);break;case`Tab`:Z(!1);break;default:e.key.length===1&&!e.ctrlKey&&!e.metaKey&&!e.altKey&&(e.preventDefault(),oe(e.key.toLowerCase()))}},oe=e=>{A&&clearTimeout(A),A=setTimeout(()=>{k=``},500),k+=e;let t=L.findIndex(e=>(e.textContent?.trim().toLowerCase()||``).startsWith(k));if(t===-1&&k.length===1){let n=O+1;for(let r=0;r<L.length;r++){let i=(n+r)%L.length;if((L[i].textContent?.trim().toLowerCase()||``).startsWith(e)){t=i;break}}}t!==-1&&(j=!0,K(t))};(0,e.setAria)(s,`expanded`,!1),c.hidden=!0,Y(`closed`),M.push((0,e.on)(s,`click`,()=>Z(!E)),(0,e.on)(s,`keydown`,e=>{(e.key===`Enter`||e.key===` `||e.key===`ArrowDown`)&&!E&&(e.preventDefault(),Z(!0))})),M.push((0,e.on)(c,`keydown`,ae),(0,e.on)(c,`click`,e=>{let t=e.target.closest?.(`[data-slot="dropdown-menu-item"]`);t&&Q(t)}),(0,e.on)(c,`pointermove`,e=>{if(!T||!B(e))return;let t=e.target.closest?.(`[data-slot="dropdown-menu-item"]`);if(!(j&&(j=!1,t&&R.get(t)===O)))if(t&&!z(t)){let e=R.get(t);e!==void 0&&e!==O&&K(e,!0)}else J()}),(0,e.on)(c,`pointerleave`,e=>{!T||!B(e)||j||J()})),M.push((0,e.createDismissLayer)({root:i,isOpen:()=>E,onDismiss:()=>Z(!1),closeOnClickOutside:ee,closeOnEscape:g})),M.push((0,e.on)(i,`dropdown-menu:set`,e=>{let t=e.detail,n;t?.open===void 0?t?.value!==void 0&&(n=t.value):n=t.open,typeof n==`boolean`&&Z(n)}));let $={open:()=>Z(!0),close:()=>Z(!1),toggle:()=>Z(!E),get isOpen(){return E},destroy:()=>{F=!0,A&&clearTimeout(A),G.stop(),X.cleanup(),P.cleanup(),N&&=((0,e.unlockScroll)(),!1),M.forEach(e=>e()),M.length=0,(0,e.clearRootBinding)(i,r,$)}};return(0,e.setRootBinding)(i,r,$),p&&Z(!0),$}function a(t=document){let n=[];for(let a of(0,e.getRoots)(t,`dropdown-menu`))(0,e.hasRootBinding)(a,r)||n.push(i(a));return n}exports.create=a,exports.createDropdownMenu=i;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});let e=require(`@data-slot/core`);const t=[`top`,`right`,`bottom`,`left`],n=[`start`,`center`,`end`],r=`@data-slot/dropdown-menu`,i=`[data-slot="dropdown-menu-item"], [data-slot="dropdown-menu-radio-item"], [data-slot="dropdown-menu-checkbox-item"]`,a=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),o=(e,t,n)=>{n?e.setAttribute(t,``):e.removeAttribute(t)},s=(e,t)=>{if(e.length!==t.length)return!1;for(let n=0;n<e.length;n++)if(e[n]!==t[n])return!1;return!0},c=(e,t,n,r=!1)=>e.dispatchEvent(new CustomEvent(t,{bubbles:!0,cancelable:r,detail:n})),ee=e=>{switch(e){case`radio`:return`menuitemradio`;case`checkbox`:return`menuitemcheckbox`;default:return`menuitem`}},te=e=>{let t=e.getAttribute(`data-slot`);return t===`dropdown-menu-radio-item`?`radio`:t===`dropdown-menu-checkbox-item`?`checkbox`:`item`},ne=e=>{let t=e.dataset.value;if(t===void 0)return null;let n=t.trim();return n.length>0?n:null},re=e=>e.type===`item`?e.value?e.value:e.el.textContent?.trim()??``:e.value??``,ie=e=>{if(e===void 0)return[];let t=e.trim();if(t.length===0)return[];try{let e=JSON.parse(t);return Array.isArray(e)?e.filter(e=>typeof e==`string`).map(e=>e.trim()).filter(e=>e.length>0):[]}catch{return[]}};function l(l,u={}){let ae=(0,e.reuseRootBinding)(l,r,`[@data-slot/dropdown-menu] createDropdownMenu() called more than once for the same root. Returning the existing controller. Destroy it before rebinding with new options.`);if(ae)return ae;let d=(0,e.getPart)(l,`dropdown-menu-trigger`),f=(0,e.getPart)(l,`dropdown-menu-content`),p=(0,e.getPart)(l,`dropdown-menu-positioner`),m=p&&f&&p.contains(f)?p:null,h=(0,e.getPart)(l,`dropdown-menu-portal`),oe=h&&m&&h.contains(m)?h:null;if(!d||!f)throw Error(`DropdownMenu requires trigger and content slots`);let se=u.defaultOpen??(0,e.getDataBool)(l,`defaultOpen`)??!1,ce=u.onOpenChange,le=u.onSelect,ue=u.onValueChange,de=u.onValuesChange,g=u.closeOnClickOutside??(0,e.getDataBool)(l,`closeOnClickOutside`)??!0,fe=u.closeOnEscape??(0,e.getDataBool)(l,`closeOnEscape`)??!0,pe=u.closeOnSelect??(0,e.getDataBool)(l,`closeOnSelect`)??!0,me=(t,n)=>(0,e.getDataEnum)(f,t,n)??(m?(0,e.getDataEnum)(m,t,n):void 0)??(0,e.getDataEnum)(l,t,n),_=t=>(0,e.getDataNumber)(f,t)??(m?(0,e.getDataNumber)(m,t):void 0)??(0,e.getDataNumber)(l,t),he=t=>(0,e.getDataBool)(f,t)??(m?(0,e.getDataBool)(m,t):void 0)??(0,e.getDataBool)(l,t),ge=u.side??me(`side`,t)??`bottom`,_e=u.align??me(`align`,n)??`start`,ve=u.sideOffset??_(`sideOffset`)??4,ye=u.alignOffset??_(`alignOffset`)??0,be=u.avoidCollisions??he(`avoidCollisions`)??!0,xe=u.collisionPadding??_(`collisionPadding`)??8,v=u.lockScroll??(0,e.getDataBool)(l,`lockScroll`)??!0,Se=u.highlightItemOnHover??(0,e.getDataBool)(l,`highlightItemOnHover`)??!0,Ce=a(u,`defaultValue`),we=a(u,`defaultValues`),Te=l.hasAttribute(`data-default-value`),Ee=l.hasAttribute(`data-default-values`),De=Ce?u.defaultValue??null:Te?(0,e.getDataString)(l,`defaultValue`)??null:null,Oe=we?u.defaultValues??[]:Ee?ie((0,e.getDataString)(l,`defaultValues`)):[],y=!1,b=null,x=[],S=null,C=null,w=``,T=null,E=!1,D=!1,ke=!1,O=null,k=[],A=(0,e.createPortalLifecycle)({content:f,root:l,wrapperSlot:m?void 0:`dropdown-menu-positioner`,container:m??void 0,mountTarget:m?oe??m:void 0}),j=[],M=[],N=new Map,Ae=e=>e.hasAttribute(`disabled`)||e.hasAttribute(`data-disabled`)||e.getAttribute(`aria-disabled`)===`true`,je=e=>e.pointerType!==`touch`,Me=e=>e instanceof Element?e.closest(i):null,P=e=>e?j.find(t=>t.el===e)??null:null,F=()=>j.filter(e=>e.type===`radio`),I=()=>j.filter(e=>e.type===`checkbox`),Ne=(e,t)=>e.find(e=>e.type===`radio`&&e.value===t)??null,L=e=>e?e.type===`item`?re(e):e.value:null,Pe=e=>(e.type===`radio`||e.type===`checkbox`)&&e.value===null,R=e=>Ae(e.el)||Pe(e),z=e=>F().find(t=>t.value===e)??null,Fe=e=>M.find(t=>L(t)===e)??null,Ie=(e,t,n=I())=>{let r=new Set(e),i=new Set(t),a=null,o=null,s=null;for(let e of n){if(e.type!==`checkbox`)continue;let t=e.value;if(!t)continue;let n=r.has(t),c=i.has(t);if(n!==c){if(a!==null)return{changedValue:null,checked:null,item:null};a=t,o=c,s=e.el}}return{changedValue:a,checked:o,item:s}},B=(e,t)=>{let n=I().filter(e=>e.value!==null);if(n.length===0)return null;if(e.length===0)return[];let r=new Set(e.filter(e=>typeof e==`string`).map(e=>e.trim()).filter(e=>e.length>0));if(r.size===0)return t===`init`?[]:null;let i=[];for(let e of n)e.value&&r.has(e.value)&&i.push(e.value);return i.length===0?t===`init`?[]:null:i},V=()=>{for(let t of j){let n=R(t);if(t.el.setAttribute(`role`,ee(t.type)),t.el.tabIndex=-1,n?t.el.setAttribute(`aria-disabled`,`true`):t.el.removeAttribute(`aria-disabled`),t.type===`radio`){let n=t.value!==null&&b===t.value;o(t.el,`data-checked`,n),(0,e.setAria)(t.el,`checked`,t.value===null?null:n)}else if(t.type===`checkbox`){let n=t.value!==null&&x.includes(t.value);o(t.el,`data-checked`,n),(0,e.setAria)(t.el,`checked`,t.value===null?null:n)}else t.el.removeAttribute(`data-checked`),t.el.removeAttribute(`aria-checked`)}F().length>0&&b!==null?l.setAttribute(`data-value`,b):l.removeAttribute(`data-value`)},Le=()=>{for(let e of j)o(e.el,`data-highlighted`,e.el===S)},H=({source:e=`programmatic`,emitSelectionInvalidation:t=!1}={})=>{let n=j,r=b,a=[...x];j=Array.from(f.querySelectorAll(i)).map(e=>({el:e,type:te(e),value:ne(e)}));let o=r!==null&&z(r)?r:null,c=a.length>0?B(a,`init`)??[]:[];if(b=o,x=c,M=j.filter(e=>!R(e)),N=new Map(M.map((e,t)=>[e.el,t])),S&&!N.has(S)&&(S=null),V(),Le(),t&&(r!==b&&Be({value:b,previousValue:r,item:b===null?null:z(b)?.el??null,previousItem:r===null?null:Ne(n,r)?.el??null,source:e}),!s(a,x))){let t=Ie(a,x,n.filter(e=>e.type===`checkbox`));Ve({values:[...x],previousValues:a,changedValue:t.changedValue,checked:t.checked,item:t.item,source:e})}},Re=t=>{(0,e.emit)(l,`dropdown-menu:open-change`,t),(0,e.emit)(l,`dropdown-menu:change`,t),ce?.(t.open)},ze=t=>{(0,e.emit)(l,`dropdown-menu:highlight-change`,t)},Be=t=>{(0,e.emit)(l,`dropdown-menu:value-change`,t),ue?.(t.value)},Ve=t=>{(0,e.emit)(l,`dropdown-menu:values-change`,t),de?.([...t.values])},He=()=>{let t=A.container,n=l.ownerDocument.defaultView??window,r=d.getBoundingClientRect(),i=(0,e.computeFloatingPosition)({anchorRect:r,contentRect:(0,e.measurePopupContentRect)(f),side:ge,align:_e,sideOffset:ve,alignOffset:ye,avoidCollisions:be,collisionPadding:xe}),a=(0,e.computeFloatingTransformOrigin)({side:i.side,align:i.align,anchorRect:r,popupX:i.x,popupY:i.y});v?(t.style.position=`fixed`,t.style.top=`0px`,t.style.left=`0px`,t.style.transform=`translate3d(${i.x}px, ${i.y}px, 0)`):(t.style.position=`absolute`,t.style.top=`0px`,t.style.left=`0px`,t.style.transform=`translate3d(${i.x+n.scrollX}px, ${i.y+n.scrollY}px, 0)`),t.style.setProperty(`--transform-origin`,a),t.style.willChange=`transform`,t.style.margin=`0`,f.setAttribute(`data-side`,i.side),f.setAttribute(`data-align`,i.align),t!==f&&(t.setAttribute(`data-side`,i.side),t.setAttribute(`data-align`,i.align))},U=(0,e.createPositionSync)({observedElements:[d,f],isActive:()=>y,ancestorScroll:v,onUpdate:He}),Ue=()=>{requestAnimationFrame(()=>{C&&document.contains(C)?(0,e.focusElement)(C):document.contains(d)&&(0,e.focusElement)(d),C=null})},W=(0,e.createPresenceLifecycle)({element:f,onExitComplete:()=>{ke||(A.restore(),f.hidden=!0,Ue())}}),G=e=>{l.setAttribute(`data-state`,e),f.setAttribute(`data-state`,e),e===`open`?(l.setAttribute(`data-open`,``),f.setAttribute(`data-open`,``),l.removeAttribute(`data-closed`),f.removeAttribute(`data-closed`)):(l.setAttribute(`data-closed`,``),f.setAttribute(`data-closed`,``),l.removeAttribute(`data-open`),f.removeAttribute(`data-open`))},K=(t,{source:n,focus:r=!0,focusContentOnClear:i=!1})=>{if(t&&!N.has(t))return!1;let a=S;return a===t?(t&&r?((0,e.ensureItemVisibleInContainer)(t,f),(0,e.focusElement)(t)):!t&&i&&(0,e.focusElement)(f),!1):(S=t,Le(),t?((0,e.ensureItemVisibleInContainer)(t,f),r&&(0,e.focusElement)(t)):i&&(0,e.focusElement)(f),ze({value:L(P(t)),previousValue:L(P(a)),item:t,previousItem:a,source:n}),!0)},q=(e,t,n=!0)=>{if(H({source:t,emitSelectionInvalidation:n}),F().length===0)return!1;let r=e===null?null:z(e);if(e!==null&&!r||b===e)return!1;let i=b,a=i===null?null:z(i);return b=e,V(),n&&Be({value:b,previousValue:i,item:r?.el??null,previousItem:a?.el??null,source:t}),!0},We=(e,t,n=!0)=>{H({source:t,emitSelectionInvalidation:n});let r=B(e,n?`set`:`init`);if(r===null||s(x,r))return!1;let i=[...x],a=Ie(i,r);return x=r,V(),n&&Ve({values:[...x],previousValues:i,changedValue:a.changedValue,checked:a.checked,item:a.item,source:t}),!0},Ge=()=>{if(H(),Ce||Te)De===null?b=null:q(De,`programmatic`,!1);else for(let t of F())if(t.value!==null&&(0,e.getDataBool)(t.el,`defaultChecked`)){b=t.value;break}x=we||Ee?B(Oe,`init`)??[]:B(I().filter(t=>t.value!==null&&(0,e.getDataBool)(t.el,`defaultChecked`)).map(e=>e.value),`init`)??[],V()},J=(t,{source:n,reason:r})=>{if(y===t)return;O=null;let i=y;t?(C=document.activeElement,y=!0,(0,e.setAria)(d,`expanded`,!0),A.mount(),f.hidden=!1,G(`open`),W.enter(),v&&!D&&((0,e.lockScroll)(),D=!0),H({source:n===`restore`?`restore`:`programmatic`,emitSelectionInvalidation:n!==`init`}),E=!1,w=``,U.start(),He(),U.update(),(0,e.focusElement)(f)):(y=!1,(0,e.setAria)(d,`expanded`,!1),G(`closed`),S&&K(null,{source:n===`init`?`programmatic`:n,focus:!1,focusContentOnClear:!1}),w=``,E=!1,D&&=((0,e.unlockScroll)(),!1),U.stop(),W.exit()),Re({open:y,previousOpen:i,source:n,reason:r})},Y=(e,t)=>{let n={source:e,reason:t};O=n,queueMicrotask(()=>{O===n&&(O=null)})},X=(e,t)=>{if(R(e))return;let n=L(e);if(n===null)return;let r;if(e.type===`radio`?r=!0:e.type===`checkbox`&&e.value!==null&&(r=!x.includes(e.value)),c(l,`dropdown-menu:select`,{value:n,item:e.el,itemType:e.type,source:t,checked:r},!0)){if(le?.(n),e.type===`radio`)q(e.value,t,!0);else if(e.type===`checkbox`&&e.value!==null){let n=new Set(x);n.has(e.value)?n.delete(e.value):n.add(e.value),We([...n],t,!0)}pe&&J(!1,{source:t,reason:`select`})}},Ke=e=>{T&&clearTimeout(T),T=setTimeout(()=>{w=``},500),w+=e;let t=M.findIndex(e=>(e.el.textContent?.trim().toLowerCase()??``).startsWith(w));if(t===-1&&w.length===1){let n=S?(N.get(S)??-1)+1:0;for(let r=0;r<M.length;r++){let i=(n+r)%M.length;if((M[i]?.el.textContent?.trim().toLowerCase()??``).startsWith(e)){t=i;break}}}t!==-1&&(E=!0,K(M[t]?.el??null,{source:`keyboard`,focus:!0}))},Z=e=>{let t=e.source??`programmatic`;if(e.value!==void 0&&q(e.value,t,!0),e.values!==void 0&&We(e.values,t,!0),e.open!==void 0&&J(e.open,{source:t,reason:`programmatic`}),e.highlightedValue!==void 0){if(!y)return;if(e.highlightedValue===null)K(null,{source:t,focus:!1,focusContentOnClear:!0});else{let n=Fe(e.highlightedValue);n&&K(n.el,{source:t,focus:!0})}}},qe=(0,e.ensureId)(d,`dropdown-menu-trigger`),Je=(0,e.ensureId)(f,`dropdown-menu-content`);d.setAttribute(`aria-haspopup`,`menu`),d.setAttribute(`aria-controls`,Je),f.setAttribute(`role`,`menu`),f.setAttribute(`aria-labelledby`,qe),f.tabIndex=-1,(0,e.setAria)(d,`expanded`,!1),f.hidden=!0,G(`closed`),Ge(),k.push((0,e.on)(d,`click`,()=>{J(!y,{source:`pointer`,reason:`trigger`})}),(0,e.on)(d,`keydown`,e=>{(e.key===`Enter`||e.key===` `||e.key===`ArrowDown`)&&!y&&(e.preventDefault(),J(!0,{source:`keyboard`,reason:`trigger`}))})),k.push((0,e.on)(f,`keydown`,e=>{if(e.key===`Tab`){J(!1,{source:`keyboard`,reason:`tab`});return}let t=M.length;if(t!==0)switch(e.key){case`ArrowDown`:e.preventDefault(),E=!0,K(M[S?((N.get(S)??-1)+1)%t:0]?.el??null,{source:`keyboard`,focus:!0});break;case`ArrowUp`:e.preventDefault(),E=!0,K(M[S?(N.get(S)-1+t)%t:t-1]?.el??null,{source:`keyboard`,focus:!0});break;case`Home`:e.preventDefault(),E=!0,K(M[0]?.el??null,{source:`keyboard`,focus:!0});break;case`End`:e.preventDefault(),E=!0,K(M[t-1]?.el??null,{source:`keyboard`,focus:!0});break;case`Enter`:case` `:if(e.preventDefault(),S){let e=P(S);e&&X(e,`keyboard`)}break;default:e.key.length===1&&!e.ctrlKey&&!e.metaKey&&!e.altKey&&(e.preventDefault(),Ke(e.key.toLowerCase()))}}),(0,e.on)(f,`click`,e=>{let t=P(Me(e.target));t&&X(t,`pointer`)}),(0,e.on)(f,`pointermove`,e=>{if(!Se||!je(e))return;let t=Me(e.target);E&&(E=!1,t&&t===S)||(t&&N.has(t)?K(t,{source:`pointer`,focus:!0}):S&&K(null,{source:`pointer`,focus:!1,focusContentOnClear:!0}))}),(0,e.on)(f,`pointerleave`,e=>{!Se||!je(e)||E||!S||K(null,{source:`pointer`,focus:!1,focusContentOnClear:!0})}));let Q=l.ownerDocument??document;k.push((0,e.on)(Q,`pointerdown`,t=>{if(!y||!g||t.pointerType===`touch`)return;let n=t.target;(0,e.containsWithPortals)(l,n)||Y(`pointer`,`outside`)},{capture:!0}),(0,e.on)(Q,`click`,t=>{if(!y||!g)return;let n=t.target;(0,e.containsWithPortals)(l,n)||Y(`pointer`,`outside`)},{capture:!0}),(0,e.on)(Q,`keydown`,e=>{!y||!fe||e.key!==`Escape`||e.defaultPrevented||Y(`keyboard`,`escape`)},{capture:!0})),k.push((0,e.createDismissLayer)({root:l,isOpen:()=>y,onDismiss:()=>{let e=O;if(O=null,e?.reason===`escape`){J(!1,{source:e.source,reason:`escape`});return}J(!1,{source:e?.source??`pointer`,reason:e?.reason??`outside`})},closeOnClickOutside:g,closeOnEscape:fe})),k.push((0,e.on)(l,`dropdown-menu:set`,e=>{let t=e.detail;if(!t||typeof t!=`object`)return;let n={source:t.source===`restore`||t.source===`programmatic`?t.source:void 0};t.open!==void 0&&(n.open=t.open),t.values!==void 0&&(n.values=Array.isArray(t.values)?t.values.filter(e=>typeof e==`string`):void 0),t.highlightedValue!==void 0&&(n.highlightedValue=t.highlightedValue===null||typeof t.highlightedValue==`string`?t.highlightedValue:void 0),t.value!==void 0&&(typeof t.value==`boolean`&&t.open===void 0?n.open=t.value:(t.value===null||typeof t.value==`string`)&&(n.value=t.value)),Z(n)}));let $={open:()=>J(!0,{source:`programmatic`,reason:`programmatic`}),close:()=>J(!1,{source:`programmatic`,reason:`programmatic`}),toggle:()=>J(!y,{source:`programmatic`,reason:`programmatic`}),set:e=>{Z(e)},get isOpen(){return y},get value(){return b},get values(){return[...x]},get highlightedValue(){return L(P(S))},destroy:()=>{ke=!0,T&&clearTimeout(T),U.stop(),W.cleanup(),A.cleanup(),D&&=((0,e.unlockScroll)(),!1),k.forEach(e=>e()),k.length=0,(0,e.clearRootBinding)(l,r,$)}};return(0,e.setRootBinding)(l,r,$),se&&J(!0,{source:`init`,reason:`init`}),$}function u(t=document){let n=[];for(let i of(0,e.getRoots)(t,`dropdown-menu`))(0,e.hasRootBinding)(i,r)||n.push(l(i));return n}exports.create=u,exports.createDropdownMenu=l;

package/dist/index.d.cts

@@ -3,13 +3,69 @@
 type Side = "top" | "right" | "bottom" | "left";
 /** Alignment of the content relative to the trigger */
 type Align = "start" | "center" | "end";
+type DropdownMenuItemType = "item" | "radio" | "checkbox";
+type DropdownMenuUserSource = "pointer" | "keyboard";
+type DropdownMenuSetSource = "programmatic" | "restore";
+type DropdownMenuSelectionSource = DropdownMenuUserSource | DropdownMenuSetSource;
+type DropdownMenuOpenChangeSource = DropdownMenuSelectionSource | "init";
+type DropdownMenuOpenChangeReason = "trigger" | "select" | "outside" | "escape" | "tab" | "programmatic" | "init";
+interface DropdownMenuOpenChangeDetail {
+  open: boolean;
+  previousOpen: boolean;
+  source: DropdownMenuOpenChangeSource;
+  reason: DropdownMenuOpenChangeReason;
+}
+interface DropdownMenuHighlightChangeDetail {
+  value: string | null;
+  previousValue: string | null;
+  item: HTMLElement | null;
+  previousItem: HTMLElement | null;
+  source: DropdownMenuSelectionSource;
+}
+interface DropdownMenuSelectDetail {
+  value: string;
+  item: HTMLElement;
+  itemType: DropdownMenuItemType;
+  source: DropdownMenuUserSource;
+  checked?: boolean;
+}
+interface DropdownMenuValueChangeDetail {
+  value: string | null;
+  previousValue: string | null;
+  item: HTMLElement | null;
+  previousItem: HTMLElement | null;
+  source: DropdownMenuSelectionSource;
+}
+interface DropdownMenuValuesChangeDetail {
+  values: string[];
+  previousValues: string[];
+  changedValue: string | null;
+  checked: boolean | null;
+  item: HTMLElement | null;
+  source: DropdownMenuSelectionSource;
+}
+interface DropdownMenuSetDetail {
+  open?: boolean;
+  value?: string | null;
+  values?: string[];
+  highlightedValue?: string | null;
+  source?: DropdownMenuSetSource;
+}
 interface DropdownMenuOptions {
   /** Initial open state */
   defaultOpen?: boolean;
+  /** Initial radio selection state */
+  defaultValue?: string | null;
+  /** Initial checkbox selection state */
+  defaultValues?: string[];
   /** Callback when open state changes */
   onOpenChange?: (open: boolean) => void;
-  /** Callback when an item is selected */
+  /** Callback when a user activation is accepted */
   onSelect?: (value: string) => void;
+  /** Callback when the committed radio value changes */
+  onValueChange?: (value: string | null) => void;
+  /** Callback when the committed checkbox values change */
+  onValuesChange?: (values: string[]) => void;
   /** Close when clicking outside */
   closeOnClickOutside?: boolean;
   /** Close when pressing Escape */
@@ -66,8 +122,16 @@ interface DropdownMenuController {
   close(): void;
   /** Toggle the dropdown menu */
   toggle(): void;
+  /** Set one or more dropdown menu state fields programmatically */
+  set(detail: DropdownMenuSetDetail): void;
   /** Current open state */
   readonly isOpen: boolean;
+  /** Current committed radio value */
+  readonly value: string | null;
+  /** Current committed checkbox values */
+  readonly values: string[];
+  /** Current highlighted value */
+  readonly highlightedValue: string | null;
   /** Cleanup all event listeners */
   destroy(): void;
 }
@@ -83,16 +147,25 @@ interface DropdownMenuController {
  * - `collisionPadding`: viewport edge padding in px (default: 8)
  *
  * ## Events
- * - **Outbound** `dropdown-menu:change` (on root): Fires when menu opens/closes.
- *   `event.detail: { open: boolean }`
- * - **Outbound** `dropdown-menu:select` (on root): Fires when an item is selected.
- *   `event.detail: { value: string }`
+ * - **Outbound** `dropdown-menu:open-change` (on root): Fires when menu opens/closes.
+ *   `event.detail: DropdownMenuOpenChangeDetail`
+ * - **Outbound** `dropdown-menu:change` (on root): Deprecated alias for `dropdown-menu:open-change`.
+ * - **Outbound** `dropdown-menu:highlight-change` (on root): Fires when highlight changes.
+ *   `event.detail: DropdownMenuHighlightChangeDetail`
+ * - **Outbound** `dropdown-menu:select` (on root): Cancelable user activation event fired before commit.
+ *   `event.detail: DropdownMenuSelectDetail`
+ * - **Outbound** `dropdown-menu:value-change` (on root): Fires when radio selection changes.
+ *   `event.detail: DropdownMenuValueChangeDetail`
+ * - **Outbound** `dropdown-menu:values-change` (on root): Fires when checkbox selection changes.
+ *   `event.detail: DropdownMenuValuesChangeDetail`
+ * - **Inbound** `dropdown-menu:set` (on root): Set open/highlight/selection state programmatically.
+ *   `event.detail: DropdownMenuSetDetail`
  */
 declare function createDropdownMenu(root: Element, options?: DropdownMenuOptions): DropdownMenuController;
 /**
- * Find and bind all dropdown menu components in a scope
- * Returns array of controllers for programmatic access
+ * Find and bind all dropdown menu components in a scope.
+ * Returns array of controllers for programmatic access.
  */
 declare function create(scope?: ParentNode): DropdownMenuController[];
 //#endregion
-export { Align, DropdownMenuController, DropdownMenuOptions, Side, create, createDropdownMenu };
+export { Align, DropdownMenuController, DropdownMenuHighlightChangeDetail, DropdownMenuItemType, DropdownMenuOpenChangeDetail, DropdownMenuOpenChangeReason, DropdownMenuOpenChangeSource, DropdownMenuOptions, DropdownMenuSelectDetail, DropdownMenuSelectionSource, DropdownMenuSetDetail, DropdownMenuSetSource, DropdownMenuUserSource, DropdownMenuValueChangeDetail, DropdownMenuValuesChangeDetail, Side, create, createDropdownMenu };

package/dist/index.d.ts

@@ -3,13 +3,69 @@
 type Side = "top" | "right" | "bottom" | "left";
 /** Alignment of the content relative to the trigger */
 type Align = "start" | "center" | "end";
+type DropdownMenuItemType = "item" | "radio" | "checkbox";
+type DropdownMenuUserSource = "pointer" | "keyboard";
+type DropdownMenuSetSource = "programmatic" | "restore";
+type DropdownMenuSelectionSource = DropdownMenuUserSource | DropdownMenuSetSource;
+type DropdownMenuOpenChangeSource = DropdownMenuSelectionSource | "init";
+type DropdownMenuOpenChangeReason = "trigger" | "select" | "outside" | "escape" | "tab" | "programmatic" | "init";
+interface DropdownMenuOpenChangeDetail {
+  open: boolean;
+  previousOpen: boolean;
+  source: DropdownMenuOpenChangeSource;
+  reason: DropdownMenuOpenChangeReason;
+}
+interface DropdownMenuHighlightChangeDetail {
+  value: string | null;
+  previousValue: string | null;
+  item: HTMLElement | null;
+  previousItem: HTMLElement | null;
+  source: DropdownMenuSelectionSource;
+}
+interface DropdownMenuSelectDetail {
+  value: string;
+  item: HTMLElement;
+  itemType: DropdownMenuItemType;
+  source: DropdownMenuUserSource;
+  checked?: boolean;
+}
+interface DropdownMenuValueChangeDetail {
+  value: string | null;
+  previousValue: string | null;
+  item: HTMLElement | null;
+  previousItem: HTMLElement | null;
+  source: DropdownMenuSelectionSource;
+}
+interface DropdownMenuValuesChangeDetail {
+  values: string[];
+  previousValues: string[];
+  changedValue: string | null;
+  checked: boolean | null;
+  item: HTMLElement | null;
+  source: DropdownMenuSelectionSource;
+}
+interface DropdownMenuSetDetail {
+  open?: boolean;
+  value?: string | null;
+  values?: string[];
+  highlightedValue?: string | null;
+  source?: DropdownMenuSetSource;
+}
 interface DropdownMenuOptions {
   /** Initial open state */
   defaultOpen?: boolean;
+  /** Initial radio selection state */
+  defaultValue?: string | null;
+  /** Initial checkbox selection state */
+  defaultValues?: string[];
   /** Callback when open state changes */
   onOpenChange?: (open: boolean) => void;
-  /** Callback when an item is selected */
+  /** Callback when a user activation is accepted */
   onSelect?: (value: string) => void;
+  /** Callback when the committed radio value changes */
+  onValueChange?: (value: string | null) => void;
+  /** Callback when the committed checkbox values change */
+  onValuesChange?: (values: string[]) => void;
   /** Close when clicking outside */
   closeOnClickOutside?: boolean;
   /** Close when pressing Escape */
@@ -66,8 +122,16 @@ interface DropdownMenuController {
   close(): void;
   /** Toggle the dropdown menu */
   toggle(): void;
+  /** Set one or more dropdown menu state fields programmatically */
+  set(detail: DropdownMenuSetDetail): void;
   /** Current open state */
   readonly isOpen: boolean;
+  /** Current committed radio value */
+  readonly value: string | null;
+  /** Current committed checkbox values */
+  readonly values: string[];
+  /** Current highlighted value */
+  readonly highlightedValue: string | null;
   /** Cleanup all event listeners */
   destroy(): void;
 }
@@ -83,16 +147,25 @@ interface DropdownMenuController {
  * - `collisionPadding`: viewport edge padding in px (default: 8)
  *
  * ## Events
- * - **Outbound** `dropdown-menu:change` (on root): Fires when menu opens/closes.
- *   `event.detail: { open: boolean }`
- * - **Outbound** `dropdown-menu:select` (on root): Fires when an item is selected.
- *   `event.detail: { value: string }`
+ * - **Outbound** `dropdown-menu:open-change` (on root): Fires when menu opens/closes.
+ *   `event.detail: DropdownMenuOpenChangeDetail`
+ * - **Outbound** `dropdown-menu:change` (on root): Deprecated alias for `dropdown-menu:open-change`.
+ * - **Outbound** `dropdown-menu:highlight-change` (on root): Fires when highlight changes.
+ *   `event.detail: DropdownMenuHighlightChangeDetail`
+ * - **Outbound** `dropdown-menu:select` (on root): Cancelable user activation event fired before commit.
+ *   `event.detail: DropdownMenuSelectDetail`
+ * - **Outbound** `dropdown-menu:value-change` (on root): Fires when radio selection changes.
+ *   `event.detail: DropdownMenuValueChangeDetail`
+ * - **Outbound** `dropdown-menu:values-change` (on root): Fires when checkbox selection changes.
+ *   `event.detail: DropdownMenuValuesChangeDetail`
+ * - **Inbound** `dropdown-menu:set` (on root): Set open/highlight/selection state programmatically.
+ *   `event.detail: DropdownMenuSetDetail`
  */
 declare function createDropdownMenu(root: Element, options?: DropdownMenuOptions): DropdownMenuController;
 /**
- * Find and bind all dropdown menu components in a scope
- * Returns array of controllers for programmatic access
+ * Find and bind all dropdown menu components in a scope.
+ * Returns array of controllers for programmatic access.
  */
 declare function create(scope?: ParentNode): DropdownMenuController[];
 //#endregion
-export { Align, DropdownMenuController, DropdownMenuOptions, Side, create, createDropdownMenu };
+export { Align, DropdownMenuController, DropdownMenuHighlightChangeDetail, DropdownMenuItemType, DropdownMenuOpenChangeDetail, DropdownMenuOpenChangeReason, DropdownMenuOpenChangeSource, DropdownMenuOptions, DropdownMenuSelectDetail, DropdownMenuSelectionSource, DropdownMenuSetDetail, DropdownMenuSetSource, DropdownMenuUserSource, DropdownMenuValueChangeDetail, DropdownMenuValuesChangeDetail, Side, create, createDropdownMenu };

package/dist/index.js

@@ -1 +1 @@
-import{clearRootBinding as e,computeFloatingPosition as t,computeFloatingTransformOrigin as n,createDismissLayer as r,createPortalLifecycle as i,createPositionSync as a,createPresenceLifecycle as ee,emit as o,ensureId as s,ensureItemVisibleInContainer as te,focusElement as c,getDataBool as l,getDataEnum as u,getDataNumber as d,getPart as f,getParts as ne,getRoots as p,hasRootBinding as m,lockScroll as re,measurePopupContentRect as ie,on as h,reuseRootBinding as ae,setAria as g,setRootBinding as oe,unlockScroll as _}from"@data-slot/core";const se=[`top`,`right`,`bottom`,`left`],ce=[`start`,`center`,`end`],v=`@data-slot/dropdown-menu`;function y(p,m={}){let y=ae(p,v,`[@data-slot/dropdown-menu] createDropdownMenu() called more than once for the same root. Returning the existing controller. Destroy it before rebinding with new options.`);if(y)return y;let b=f(p,`dropdown-menu-trigger`),x=f(p,`dropdown-menu-content`),S=f(p,`dropdown-menu-positioner`),C=S&&x&&S.contains(x)?S:null,w=f(p,`dropdown-menu-portal`),le=w&&C&&w.contains(C)?w:null;if(!b||!x)throw Error(`DropdownMenu requires trigger and content slots`);let ue=m.defaultOpen??l(p,`defaultOpen`)??!1,de=m.onOpenChange,fe=m.onSelect,pe=m.closeOnClickOutside??l(p,`closeOnClickOutside`)??!0,me=m.closeOnEscape??l(p,`closeOnEscape`)??!0,he=m.closeOnSelect??l(p,`closeOnSelect`)??!0,T=(e,t)=>u(x,e,t)??(C?u(C,e,t):void 0)??u(p,e,t),E=e=>d(x,e)??(C?d(C,e):void 0)??d(p,e),ge=e=>l(x,e)??(C?l(C,e):void 0)??l(p,e),_e=m.side??T(`side`,se)??`bottom`,ve=m.align??T(`align`,ce)??`start`,ye=m.sideOffset??E(`sideOffset`)??4,be=m.alignOffset??E(`alignOffset`)??0,xe=m.avoidCollisions??ge(`avoidCollisions`)??!0,Se=m.collisionPadding??E(`collisionPadding`)??8,D=m.lockScroll??l(p,`lockScroll`)??!0,O=m.highlightItemOnHover??l(p,`highlightItemOnHover`)??!0,k=!1,A=null,j=-1,M=``,N=null,P=!1,F=[],I=!1,L=i({content:x,root:p,wrapperSlot:C?void 0:`dropdown-menu-positioner`,container:C??void 0,mountTarget:C?le??C:void 0}),R=!1,z=[],B=[],V=new Map,H=e=>e.hasAttribute(`disabled`)||e.hasAttribute(`data-disabled`)||e.getAttribute(`aria-disabled`)===`true`,U=e=>e.pointerType!==`touch`,Ce=s(b,`dropdown-menu-trigger`),we=s(x,`dropdown-menu-content`);b.setAttribute(`aria-haspopup`,`menu`),b.setAttribute(`aria-controls`,we),x.setAttribute(`role`,`menu`),x.setAttribute(`aria-labelledby`,Ce),x.tabIndex=-1;let Te=()=>{z=ne(x,`dropdown-menu-item`);for(let e of z)e.setAttribute(`role`,`menuitem`),e.hasAttribute(`data-disabled`)||e.hasAttribute(`disabled`)?e.setAttribute(`aria-disabled`,`true`):e.removeAttribute(`aria-disabled`),e.tabIndex=-1;B=z.filter(e=>!H(e)),V=new Map(B.map((e,t)=>[e,t]))},W=()=>{let e=L.container,r=p.ownerDocument.defaultView??window,i=b.getBoundingClientRect(),a=t({anchorRect:i,contentRect:ie(x),side:_e,align:ve,sideOffset:ye,alignOffset:be,avoidCollisions:xe,collisionPadding:Se}),ee=n({side:a.side,align:a.align,anchorRect:i,popupX:a.x,popupY:a.y});D?(e.style.position=`fixed`,e.style.top=`0px`,e.style.left=`0px`,e.style.transform=`translate3d(${a.x}px, ${a.y}px, 0)`):(e.style.position=`absolute`,e.style.top=`0px`,e.style.left=`0px`,e.style.transform=`translate3d(${a.x+r.scrollX}px, ${a.y+r.scrollY}px, 0)`),e.style.setProperty(`--transform-origin`,ee),e.style.willChange=`transform`,e.style.margin=`0`,x.setAttribute(`data-side`,a.side),x.setAttribute(`data-align`,a.align),e!==x&&(e.setAttribute(`data-side`,a.side),e.setAttribute(`data-align`,a.align))},G=a({observedElements:[b,x],isActive:()=>k,ancestorScroll:D,onUpdate:W}),K=(e,t=!0)=>{for(let n=0;n<B.length;n++){let r=B[n];n===e?(r.setAttribute(`data-highlighted`,``),te(r,x),t&&r.focus()):r.removeAttribute(`data-highlighted`)}j=e},q=()=>{for(let e of z)e.removeAttribute(`data-highlighted`);j=-1},J=()=>{q(),c(x)},Y=e=>{p.setAttribute(`data-state`,e),x.setAttribute(`data-state`,e),e===`open`?(p.setAttribute(`data-open`,``),x.setAttribute(`data-open`,``),p.removeAttribute(`data-closed`),x.removeAttribute(`data-closed`)):(p.setAttribute(`data-closed`,``),x.setAttribute(`data-closed`,``),p.removeAttribute(`data-open`),x.removeAttribute(`data-open`))},Ee=()=>{requestAnimationFrame(()=>{A&&document.contains(A)?c(A):b&&document.contains(b)&&c(b),A=null})},X=ee({element:x,onExitComplete:()=>{R||(L.restore(),x.hidden=!0,Ee())}}),Z=e=>{k!==e&&(e?(A=document.activeElement,k=!0,g(b,`expanded`,!0),L.mount(),x.hidden=!1,Y(`open`),X.enter(),D&&!I&&(re(),I=!0),Te(),P=!1,q(),G.start(),W(),G.update(),x.focus()):(k=!1,g(b,`expanded`,!1),Y(`closed`),q(),M=``,P=!1,I&&=(_(),!1),G.stop(),X.exit()),o(p,`dropdown-menu:change`,{open:k}),de?.(k))},Q=e=>{if(H(e))return;let t=e.dataset.value||e.textContent?.trim()||``;o(p,`dropdown-menu:select`,{value:t}),fe?.(t),he&&Z(!1)},De=e=>{let t=B.length;if(t!==0)switch(e.key){case`ArrowDown`:e.preventDefault(),P=!0,K(j===-1?0:(j+1)%t);break;case`ArrowUp`:e.preventDefault(),P=!0,K(j===-1?t-1:(j-1+t)%t);break;case`Home`:e.preventDefault(),P=!0,K(0);break;case`End`:e.preventDefault(),P=!0,K(t-1);break;case`Enter`:case` `:e.preventDefault(),j>=0&&Q(B[j]);break;case`Tab`:Z(!1);break;default:e.key.length===1&&!e.ctrlKey&&!e.metaKey&&!e.altKey&&(e.preventDefault(),Oe(e.key.toLowerCase()))}},Oe=e=>{N&&clearTimeout(N),N=setTimeout(()=>{M=``},500),M+=e;let t=B.findIndex(e=>(e.textContent?.trim().toLowerCase()||``).startsWith(M));if(t===-1&&M.length===1){let n=j+1;for(let r=0;r<B.length;r++){let i=(n+r)%B.length;if((B[i].textContent?.trim().toLowerCase()||``).startsWith(e)){t=i;break}}}t!==-1&&(P=!0,K(t))};g(b,`expanded`,!1),x.hidden=!0,Y(`closed`),F.push(h(b,`click`,()=>Z(!k)),h(b,`keydown`,e=>{(e.key===`Enter`||e.key===` `||e.key===`ArrowDown`)&&!k&&(e.preventDefault(),Z(!0))})),F.push(h(x,`keydown`,De),h(x,`click`,e=>{let t=e.target.closest?.(`[data-slot="dropdown-menu-item"]`);t&&Q(t)}),h(x,`pointermove`,e=>{if(!O||!U(e))return;let t=e.target.closest?.(`[data-slot="dropdown-menu-item"]`);if(!(P&&(P=!1,t&&V.get(t)===j)))if(t&&!H(t)){let e=V.get(t);e!==void 0&&e!==j&&K(e,!0)}else J()}),h(x,`pointerleave`,e=>{!O||!U(e)||P||J()})),F.push(r({root:p,isOpen:()=>k,onDismiss:()=>Z(!1),closeOnClickOutside:pe,closeOnEscape:me})),F.push(h(p,`dropdown-menu:set`,e=>{let t=e.detail,n;t?.open===void 0?t?.value!==void 0&&(n=t.value):n=t.open,typeof n==`boolean`&&Z(n)}));let $={open:()=>Z(!0),close:()=>Z(!1),toggle:()=>Z(!k),get isOpen(){return k},destroy:()=>{R=!0,N&&clearTimeout(N),G.stop(),X.cleanup(),L.cleanup(),I&&=(_(),!1),F.forEach(e=>e()),F.length=0,e(p,v,$)}};return oe(p,v,$),ue&&Z(!0),$}function b(e=document){let t=[];for(let n of p(e,`dropdown-menu`))m(n,v)||t.push(y(n));return t}export{b as create,y as createDropdownMenu};
+import{clearRootBinding as e,computeFloatingPosition as t,computeFloatingTransformOrigin as n,containsWithPortals as r,createDismissLayer as i,createPortalLifecycle as a,createPositionSync as o,createPresenceLifecycle as ee,emit as s,ensureId as te,ensureItemVisibleInContainer as ne,focusElement as c,getDataBool as l,getDataEnum as u,getDataNumber as d,getDataString as re,getPart as f,getRoots as p,hasRootBinding as m,lockScroll as ie,measurePopupContentRect as ae,on as h,reuseRootBinding as oe,setAria as g,setRootBinding as se,unlockScroll as ce}from"@data-slot/core";const le=[`top`,`right`,`bottom`,`left`],ue=[`start`,`center`,`end`],_=`@data-slot/dropdown-menu`,de=`[data-slot="dropdown-menu-item"], [data-slot="dropdown-menu-radio-item"], [data-slot="dropdown-menu-checkbox-item"]`,fe=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),v=(e,t,n)=>{n?e.setAttribute(t,``):e.removeAttribute(t)},pe=(e,t)=>{if(e.length!==t.length)return!1;for(let n=0;n<e.length;n++)if(e[n]!==t[n])return!1;return!0},me=(e,t,n,r=!1)=>e.dispatchEvent(new CustomEvent(t,{bubbles:!0,cancelable:r,detail:n})),he=e=>{switch(e){case`radio`:return`menuitemradio`;case`checkbox`:return`menuitemcheckbox`;default:return`menuitem`}},ge=e=>{let t=e.getAttribute(`data-slot`);return t===`dropdown-menu-radio-item`?`radio`:t===`dropdown-menu-checkbox-item`?`checkbox`:`item`},_e=e=>{let t=e.dataset.value;if(t===void 0)return null;let n=t.trim();return n.length>0?n:null},ve=e=>e.type===`item`?e.value?e.value:e.el.textContent?.trim()??``:e.value??``,ye=e=>{if(e===void 0)return[];let t=e.trim();if(t.length===0)return[];try{let e=JSON.parse(t);return Array.isArray(e)?e.filter(e=>typeof e==`string`).map(e=>e.trim()).filter(e=>e.length>0):[]}catch{return[]}};function y(p,m={}){let y=oe(p,_,`[@data-slot/dropdown-menu] createDropdownMenu() called more than once for the same root. Returning the existing controller. Destroy it before rebinding with new options.`);if(y)return y;let b=f(p,`dropdown-menu-trigger`),x=f(p,`dropdown-menu-content`),be=f(p,`dropdown-menu-positioner`),S=be&&x&&be.contains(x)?be:null,xe=f(p,`dropdown-menu-portal`),Se=xe&&S&&xe.contains(S)?xe:null;if(!b||!x)throw Error(`DropdownMenu requires trigger and content slots`);let Ce=m.defaultOpen??l(p,`defaultOpen`)??!1,we=m.onOpenChange,Te=m.onSelect,Ee=m.onValueChange,De=m.onValuesChange,C=m.closeOnClickOutside??l(p,`closeOnClickOutside`)??!0,Oe=m.closeOnEscape??l(p,`closeOnEscape`)??!0,ke=m.closeOnSelect??l(p,`closeOnSelect`)??!0,Ae=(e,t)=>u(x,e,t)??(S?u(S,e,t):void 0)??u(p,e,t),w=e=>d(x,e)??(S?d(S,e):void 0)??d(p,e),je=e=>l(x,e)??(S?l(S,e):void 0)??l(p,e),Me=m.side??Ae(`side`,le)??`bottom`,Ne=m.align??Ae(`align`,ue)??`start`,Pe=m.sideOffset??w(`sideOffset`)??4,Fe=m.alignOffset??w(`alignOffset`)??0,Ie=m.avoidCollisions??je(`avoidCollisions`)??!0,Le=m.collisionPadding??w(`collisionPadding`)??8,T=m.lockScroll??l(p,`lockScroll`)??!0,Re=m.highlightItemOnHover??l(p,`highlightItemOnHover`)??!0,ze=fe(m,`defaultValue`),Be=fe(m,`defaultValues`),Ve=p.hasAttribute(`data-default-value`),He=p.hasAttribute(`data-default-values`),Ue=ze?m.defaultValue??null:Ve?re(p,`defaultValue`)??null:null,We=Be?m.defaultValues??[]:He?ye(re(p,`defaultValues`)):[],E=!1,D=null,O=[],k=null,A=null,j=``,M=null,N=!1,P=!1,Ge=!1,F=null,I=[],L=a({content:x,root:p,wrapperSlot:S?void 0:`dropdown-menu-positioner`,container:S??void 0,mountTarget:S?Se??S:void 0}),R=[],z=[],B=new Map,Ke=e=>e.hasAttribute(`disabled`)||e.hasAttribute(`data-disabled`)||e.getAttribute(`aria-disabled`)===`true`,qe=e=>e.pointerType!==`touch`,Je=e=>e instanceof Element?e.closest(de):null,V=e=>e?R.find(t=>t.el===e)??null:null,H=()=>R.filter(e=>e.type===`radio`),U=()=>R.filter(e=>e.type===`checkbox`),Ye=(e,t)=>e.find(e=>e.type===`radio`&&e.value===t)??null,W=e=>e?e.type===`item`?ve(e):e.value:null,Xe=e=>(e.type===`radio`||e.type===`checkbox`)&&e.value===null,G=e=>Ke(e.el)||Xe(e),K=e=>H().find(t=>t.value===e)??null,Ze=e=>z.find(t=>W(t)===e)??null,Qe=(e,t,n=U())=>{let r=new Set(e),i=new Set(t),a=null,o=null,ee=null;for(let e of n){if(e.type!==`checkbox`)continue;let t=e.value;if(!t)continue;let n=r.has(t),s=i.has(t);if(n!==s){if(a!==null)return{changedValue:null,checked:null,item:null};a=t,o=s,ee=e.el}}return{changedValue:a,checked:o,item:ee}},q=(e,t)=>{let n=U().filter(e=>e.value!==null);if(n.length===0)return null;if(e.length===0)return[];let r=new Set(e.filter(e=>typeof e==`string`).map(e=>e.trim()).filter(e=>e.length>0));if(r.size===0)return t===`init`?[]:null;let i=[];for(let e of n)e.value&&r.has(e.value)&&i.push(e.value);return i.length===0?t===`init`?[]:null:i},J=()=>{for(let e of R){let t=G(e);if(e.el.setAttribute(`role`,he(e.type)),e.el.tabIndex=-1,t?e.el.setAttribute(`aria-disabled`,`true`):e.el.removeAttribute(`aria-disabled`),e.type===`radio`){let t=e.value!==null&&D===e.value;v(e.el,`data-checked`,t),g(e.el,`checked`,e.value===null?null:t)}else if(e.type===`checkbox`){let t=e.value!==null&&O.includes(e.value);v(e.el,`data-checked`,t),g(e.el,`checked`,e.value===null?null:t)}else e.el.removeAttribute(`data-checked`),e.el.removeAttribute(`aria-checked`)}H().length>0&&D!==null?p.setAttribute(`data-value`,D):p.removeAttribute(`data-value`)},$e=()=>{for(let e of R)v(e.el,`data-highlighted`,e.el===k)},Y=({source:e=`programmatic`,emitSelectionInvalidation:t=!1}={})=>{let n=R,r=D,i=[...O];R=Array.from(x.querySelectorAll(de)).map(e=>({el:e,type:ge(e),value:_e(e)}));let a=r!==null&&K(r)?r:null,o=i.length>0?q(i,`init`)??[]:[];if(D=a,O=o,z=R.filter(e=>!G(e)),B=new Map(z.map((e,t)=>[e.el,t])),k&&!B.has(k)&&(k=null),J(),$e(),t&&(r!==D&&nt({value:D,previousValue:r,item:D===null?null:K(D)?.el??null,previousItem:r===null?null:Ye(n,r)?.el??null,source:e}),!pe(i,O))){let t=Qe(i,O,n.filter(e=>e.type===`checkbox`));rt({values:[...O],previousValues:i,changedValue:t.changedValue,checked:t.checked,item:t.item,source:e})}},et=e=>{s(p,`dropdown-menu:open-change`,e),s(p,`dropdown-menu:change`,e),we?.(e.open)},tt=e=>{s(p,`dropdown-menu:highlight-change`,e)},nt=e=>{s(p,`dropdown-menu:value-change`,e),Ee?.(e.value)},rt=e=>{s(p,`dropdown-menu:values-change`,e),De?.([...e.values])},it=()=>{let e=L.container,r=p.ownerDocument.defaultView??window,i=b.getBoundingClientRect(),a=t({anchorRect:i,contentRect:ae(x),side:Me,align:Ne,sideOffset:Pe,alignOffset:Fe,avoidCollisions:Ie,collisionPadding:Le}),o=n({side:a.side,align:a.align,anchorRect:i,popupX:a.x,popupY:a.y});T?(e.style.position=`fixed`,e.style.top=`0px`,e.style.left=`0px`,e.style.transform=`translate3d(${a.x}px, ${a.y}px, 0)`):(e.style.position=`absolute`,e.style.top=`0px`,e.style.left=`0px`,e.style.transform=`translate3d(${a.x+r.scrollX}px, ${a.y+r.scrollY}px, 0)`),e.style.setProperty(`--transform-origin`,o),e.style.willChange=`transform`,e.style.margin=`0`,x.setAttribute(`data-side`,a.side),x.setAttribute(`data-align`,a.align),e!==x&&(e.setAttribute(`data-side`,a.side),e.setAttribute(`data-align`,a.align))},X=o({observedElements:[b,x],isActive:()=>E,ancestorScroll:T,onUpdate:it}),at=()=>{requestAnimationFrame(()=>{A&&document.contains(A)?c(A):document.contains(b)&&c(b),A=null})},ot=ee({element:x,onExitComplete:()=>{Ge||(L.restore(),x.hidden=!0,at())}}),Z=e=>{p.setAttribute(`data-state`,e),x.setAttribute(`data-state`,e),e===`open`?(p.setAttribute(`data-open`,``),x.setAttribute(`data-open`,``),p.removeAttribute(`data-closed`),x.removeAttribute(`data-closed`)):(p.setAttribute(`data-closed`,``),x.setAttribute(`data-closed`,``),p.removeAttribute(`data-open`),x.removeAttribute(`data-open`))},Q=(e,{source:t,focus:n=!0,focusContentOnClear:r=!1})=>{if(e&&!B.has(e))return!1;let i=k;return i===e?(e&&n?(ne(e,x),c(e)):!e&&r&&c(x),!1):(k=e,$e(),e?(ne(e,x),n&&c(e)):r&&c(x),tt({value:W(V(e)),previousValue:W(V(i)),item:e,previousItem:i,source:t}),!0)},st=(e,t,n=!0)=>{if(Y({source:t,emitSelectionInvalidation:n}),H().length===0)return!1;let r=e===null?null:K(e);if(e!==null&&!r||D===e)return!1;let i=D,a=i===null?null:K(i);return D=e,J(),n&&nt({value:D,previousValue:i,item:r?.el??null,previousItem:a?.el??null,source:t}),!0},ct=(e,t,n=!0)=>{Y({source:t,emitSelectionInvalidation:n});let r=q(e,n?`set`:`init`);if(r===null||pe(O,r))return!1;let i=[...O],a=Qe(i,r);return O=r,J(),n&&rt({values:[...O],previousValues:i,changedValue:a.changedValue,checked:a.checked,item:a.item,source:t}),!0},lt=()=>{if(Y(),ze||Ve)Ue===null?D=null:st(Ue,`programmatic`,!1);else for(let e of H())if(e.value!==null&&l(e.el,`defaultChecked`)){D=e.value;break}O=Be||He?q(We,`init`)??[]:q(U().filter(e=>e.value!==null&&l(e.el,`defaultChecked`)).map(e=>e.value),`init`)??[],J()},$=(e,{source:t,reason:n})=>{if(E===e)return;F=null;let r=E;e?(A=document.activeElement,E=!0,g(b,`expanded`,!0),L.mount(),x.hidden=!1,Z(`open`),ot.enter(),T&&!P&&(ie(),P=!0),Y({source:t===`restore`?`restore`:`programmatic`,emitSelectionInvalidation:t!==`init`}),N=!1,j=``,X.start(),it(),X.update(),c(x)):(E=!1,g(b,`expanded`,!1),Z(`closed`),k&&Q(null,{source:t===`init`?`programmatic`:t,focus:!1,focusContentOnClear:!1}),j=``,N=!1,P&&=(ce(),!1),X.stop(),ot.exit()),et({open:E,previousOpen:r,source:t,reason:n})},ut=(e,t)=>{let n={source:e,reason:t};F=n,queueMicrotask(()=>{F===n&&(F=null)})},dt=(e,t)=>{if(G(e))return;let n=W(e);if(n===null)return;let r;if(e.type===`radio`?r=!0:e.type===`checkbox`&&e.value!==null&&(r=!O.includes(e.value)),me(p,`dropdown-menu:select`,{value:n,item:e.el,itemType:e.type,source:t,checked:r},!0)){if(Te?.(n),e.type===`radio`)st(e.value,t,!0);else if(e.type===`checkbox`&&e.value!==null){let n=new Set(O);n.has(e.value)?n.delete(e.value):n.add(e.value),ct([...n],t,!0)}ke&&$(!1,{source:t,reason:`select`})}},ft=e=>{M&&clearTimeout(M),M=setTimeout(()=>{j=``},500),j+=e;let t=z.findIndex(e=>(e.el.textContent?.trim().toLowerCase()??``).startsWith(j));if(t===-1&&j.length===1){let n=k?(B.get(k)??-1)+1:0;for(let r=0;r<z.length;r++){let i=(n+r)%z.length;if((z[i]?.el.textContent?.trim().toLowerCase()??``).startsWith(e)){t=i;break}}}t!==-1&&(N=!0,Q(z[t]?.el??null,{source:`keyboard`,focus:!0}))},pt=e=>{let t=e.source??`programmatic`;if(e.value!==void 0&&st(e.value,t,!0),e.values!==void 0&&ct(e.values,t,!0),e.open!==void 0&&$(e.open,{source:t,reason:`programmatic`}),e.highlightedValue!==void 0){if(!E)return;if(e.highlightedValue===null)Q(null,{source:t,focus:!1,focusContentOnClear:!0});else{let n=Ze(e.highlightedValue);n&&Q(n.el,{source:t,focus:!0})}}},mt=te(b,`dropdown-menu-trigger`),ht=te(x,`dropdown-menu-content`);b.setAttribute(`aria-haspopup`,`menu`),b.setAttribute(`aria-controls`,ht),x.setAttribute(`role`,`menu`),x.setAttribute(`aria-labelledby`,mt),x.tabIndex=-1,g(b,`expanded`,!1),x.hidden=!0,Z(`closed`),lt(),I.push(h(b,`click`,()=>{$(!E,{source:`pointer`,reason:`trigger`})}),h(b,`keydown`,e=>{(e.key===`Enter`||e.key===` `||e.key===`ArrowDown`)&&!E&&(e.preventDefault(),$(!0,{source:`keyboard`,reason:`trigger`}))})),I.push(h(x,`keydown`,e=>{if(e.key===`Tab`){$(!1,{source:`keyboard`,reason:`tab`});return}let t=z.length;if(t!==0)switch(e.key){case`ArrowDown`:e.preventDefault(),N=!0,Q(z[k?((B.get(k)??-1)+1)%t:0]?.el??null,{source:`keyboard`,focus:!0});break;case`ArrowUp`:e.preventDefault(),N=!0,Q(z[k?(B.get(k)-1+t)%t:t-1]?.el??null,{source:`keyboard`,focus:!0});break;case`Home`:e.preventDefault(),N=!0,Q(z[0]?.el??null,{source:`keyboard`,focus:!0});break;case`End`:e.preventDefault(),N=!0,Q(z[t-1]?.el??null,{source:`keyboard`,focus:!0});break;case`Enter`:case` `:if(e.preventDefault(),k){let e=V(k);e&&dt(e,`keyboard`)}break;default:e.key.length===1&&!e.ctrlKey&&!e.metaKey&&!e.altKey&&(e.preventDefault(),ft(e.key.toLowerCase()))}}),h(x,`click`,e=>{let t=V(Je(e.target));t&&dt(t,`pointer`)}),h(x,`pointermove`,e=>{if(!Re||!qe(e))return;let t=Je(e.target);N&&(N=!1,t&&t===k)||(t&&B.has(t)?Q(t,{source:`pointer`,focus:!0}):k&&Q(null,{source:`pointer`,focus:!1,focusContentOnClear:!0}))}),h(x,`pointerleave`,e=>{!Re||!qe(e)||N||!k||Q(null,{source:`pointer`,focus:!1,focusContentOnClear:!0})}));let gt=p.ownerDocument??document;I.push(h(gt,`pointerdown`,e=>{if(!E||!C||e.pointerType===`touch`)return;let t=e.target;r(p,t)||ut(`pointer`,`outside`)},{capture:!0}),h(gt,`click`,e=>{if(!E||!C)return;let t=e.target;r(p,t)||ut(`pointer`,`outside`)},{capture:!0}),h(gt,`keydown`,e=>{!E||!Oe||e.key!==`Escape`||e.defaultPrevented||ut(`keyboard`,`escape`)},{capture:!0})),I.push(i({root:p,isOpen:()=>E,onDismiss:()=>{let e=F;if(F=null,e?.reason===`escape`){$(!1,{source:e.source,reason:`escape`});return}$(!1,{source:e?.source??`pointer`,reason:e?.reason??`outside`})},closeOnClickOutside:C,closeOnEscape:Oe})),I.push(h(p,`dropdown-menu:set`,e=>{let t=e.detail;if(!t||typeof t!=`object`)return;let n={source:t.source===`restore`||t.source===`programmatic`?t.source:void 0};t.open!==void 0&&(n.open=t.open),t.values!==void 0&&(n.values=Array.isArray(t.values)?t.values.filter(e=>typeof e==`string`):void 0),t.highlightedValue!==void 0&&(n.highlightedValue=t.highlightedValue===null||typeof t.highlightedValue==`string`?t.highlightedValue:void 0),t.value!==void 0&&(typeof t.value==`boolean`&&t.open===void 0?n.open=t.value:(t.value===null||typeof t.value==`string`)&&(n.value=t.value)),pt(n)}));let _t={open:()=>$(!0,{source:`programmatic`,reason:`programmatic`}),close:()=>$(!1,{source:`programmatic`,reason:`programmatic`}),toggle:()=>$(!E,{source:`programmatic`,reason:`programmatic`}),set:e=>{pt(e)},get isOpen(){return E},get value(){return D},get values(){return[...O]},get highlightedValue(){return W(V(k))},destroy:()=>{Ge=!0,M&&clearTimeout(M),X.stop(),ot.cleanup(),L.cleanup(),P&&=(ce(),!1),I.forEach(e=>e()),I.length=0,e(p,_,_t)}};return se(p,_,_t),Ce&&$(!0,{source:`init`,reason:`init`}),_t}function b(e=document){let t=[];for(let n of p(e,`dropdown-menu`))m(n,_)||t.push(y(n));return t}export{b as create,y as createDropdownMenu};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@data-slot/dropdown-menu",
-  "version": "0.2.163",
+  "version": "0.2.165",
   "type": "module",
   "sideEffects": false,
   "main": "./dist/index.cjs",
@@ -35,6 +35,6 @@
   ],
   "license": "MIT",
   "dependencies": {
-    "@data-slot/core": "0.2.163"
+    "@data-slot/core": "0.2.165"
   }
 }