@data-slot/ui 0.2.129 → 0.2.132

package/dist/index4.d.cts

@@ -1,62 +1,42 @@
-//#region ../dialog/src/index.d.ts
-interface DialogOptions {
-  /** Initial open state */
-  defaultOpen?: boolean;
-  /** Callback when open state changes */
-  onOpenChange?: (open: boolean) => void;
-  /** Close when clicking overlay */
-  closeOnClickOutside?: boolean;
-  /** Close when pressing Escape */
-  closeOnEscape?: boolean;
-  /** Lock body scroll when open */
-  lockScroll?: boolean;
-  /** Use alertdialog role for blocking confirmations */
-  alertDialog?: boolean;
+//#region ../command/src/index.d.ts
+type CommandFilter = (value: string, search: string, keywords?: string[]) => number;
+interface CommandOptions {
+  /** Accessible label announced for the command input */
+  label?: string;
+  /** Initial active item value */
+  defaultValue?: string;
+  /** Initial search input value */
+  defaultSearch?: string;
+  /** Called whenever the active item value changes */
+  onValueChange?: (value: string | null) => void;
+  /** Called whenever the search query changes */
+  onSearchChange?: (search: string) => void;
+  /** Called when an item is selected via click or Enter */
+  onSelect?: (value: string) => void;
+  /** Disable built-in filtering and sorting */
+  shouldFilter?: boolean;
+  /** Custom ranking function. Return 0 to hide the item. */
+  filter?: CommandFilter;
+  /** Wrap arrow-key navigation */
+  loop?: boolean;
+  /** Disable pointer-move selection */
+  disablePointerSelection?: boolean;
+  /** Enable ctrl+j/k/n/p shortcuts @default true */
+  vimBindings?: boolean;
 }
-interface DialogController {
-  /** Open the dialog */
-  open(): void;
-  /** Close the dialog */
-  close(): void;
-  /** Toggle the dialog */
-  toggle(): void;
-  /** Current open state */
-  readonly isOpen: boolean;
-  /** Cleanup all event listeners */
+interface CommandController {
+  /** Current active item value */
+  readonly value: string | null;
+  /** Current search query */
+  readonly search: string;
+  /** Set the active item value programmatically */
+  select(value: string | null): void;
+  /** Set the search query programmatically */
+  setSearch(search: string): void;
+  /** Cleanup all event listeners and observers */
   destroy(): void;
-  /** Internal: handle keydown for focus trap (used by global handler) */
-  _handleKeydown?(e: KeyboardEvent): void;
-  /** Internal: content element for focus trap */
-  _content?: HTMLElement;
-  /** Internal: overlay element for stack metadata */
-  _overlay?: HTMLElement;
 }
-/**
- * Create a dialog controller for a root element
- *
- * Expected markup:
- * ```html
- * <div data-slot="dialog">
- *   <button data-slot="dialog-trigger">Open</button>
- *   <div data-slot="dialog-portal">
- *     <div data-slot="dialog-overlay"></div>
- *     <div data-slot="dialog-content">
- *       <h2 data-slot="dialog-title">Title</h2>
- *       <p data-slot="dialog-description">Description</p>
- *       <button data-slot="dialog-close">Close</button>
- *     </div>
- *   </div>
- * </div>
- * ```
- *
- * Note: Overlay is required. The optional dialog-portal slot will be
- * automatically moved to document.body to escape stacking context issues.
- */
-declare function createDialog(root: Element, options?: DialogOptions): DialogController;
-/**
- * Find and bind all dialog components in a scope
- * Returns array of controllers for programmatic access
- */
-declare function create(scope?: ParentNode): DialogController[];
+declare function createCommand(root: Element, options?: CommandOptions): CommandController;
+declare function create(scope?: ParentNode): CommandController[];
 //#endregion
-export { createDialog as i, DialogOptions as n, create as r, DialogController as t };
+export { createCommand as a, create as i, CommandFilter as n, CommandOptions as r, CommandController as t };

package/dist/index4.d.ts

@@ -1,62 +1,42 @@
-//#region ../dialog/src/index.d.ts
-interface DialogOptions {
-  /** Initial open state */
-  defaultOpen?: boolean;
-  /** Callback when open state changes */
-  onOpenChange?: (open: boolean) => void;
-  /** Close when clicking overlay */
-  closeOnClickOutside?: boolean;
-  /** Close when pressing Escape */
-  closeOnEscape?: boolean;
-  /** Lock body scroll when open */
-  lockScroll?: boolean;
-  /** Use alertdialog role for blocking confirmations */
-  alertDialog?: boolean;
+//#region ../command/src/index.d.ts
+type CommandFilter = (value: string, search: string, keywords?: string[]) => number;
+interface CommandOptions {
+  /** Accessible label announced for the command input */
+  label?: string;
+  /** Initial active item value */
+  defaultValue?: string;
+  /** Initial search input value */
+  defaultSearch?: string;
+  /** Called whenever the active item value changes */
+  onValueChange?: (value: string | null) => void;
+  /** Called whenever the search query changes */
+  onSearchChange?: (search: string) => void;
+  /** Called when an item is selected via click or Enter */
+  onSelect?: (value: string) => void;
+  /** Disable built-in filtering and sorting */
+  shouldFilter?: boolean;
+  /** Custom ranking function. Return 0 to hide the item. */
+  filter?: CommandFilter;
+  /** Wrap arrow-key navigation */
+  loop?: boolean;
+  /** Disable pointer-move selection */
+  disablePointerSelection?: boolean;
+  /** Enable ctrl+j/k/n/p shortcuts @default true */
+  vimBindings?: boolean;
 }
-interface DialogController {
-  /** Open the dialog */
-  open(): void;
-  /** Close the dialog */
-  close(): void;
-  /** Toggle the dialog */
-  toggle(): void;
-  /** Current open state */
-  readonly isOpen: boolean;
-  /** Cleanup all event listeners */
+interface CommandController {
+  /** Current active item value */
+  readonly value: string | null;
+  /** Current search query */
+  readonly search: string;
+  /** Set the active item value programmatically */
+  select(value: string | null): void;
+  /** Set the search query programmatically */
+  setSearch(search: string): void;
+  /** Cleanup all event listeners and observers */
   destroy(): void;
-  /** Internal: handle keydown for focus trap (used by global handler) */
-  _handleKeydown?(e: KeyboardEvent): void;
-  /** Internal: content element for focus trap */
-  _content?: HTMLElement;
-  /** Internal: overlay element for stack metadata */
-  _overlay?: HTMLElement;
 }
-/**
- * Create a dialog controller for a root element
- *
- * Expected markup:
- * ```html
- * <div data-slot="dialog">
- *   <button data-slot="dialog-trigger">Open</button>
- *   <div data-slot="dialog-portal">
- *     <div data-slot="dialog-overlay"></div>
- *     <div data-slot="dialog-content">
- *       <h2 data-slot="dialog-title">Title</h2>
- *       <p data-slot="dialog-description">Description</p>
- *       <button data-slot="dialog-close">Close</button>
- *     </div>
- *   </div>
- * </div>
- * ```
- *
- * Note: Overlay is required. The optional dialog-portal slot will be
- * automatically moved to document.body to escape stacking context issues.
- */
-declare function createDialog(root: Element, options?: DialogOptions): DialogController;
-/**
- * Find and bind all dialog components in a scope
- * Returns array of controllers for programmatic access
- */
-declare function create(scope?: ParentNode): DialogController[];
+declare function createCommand(root: Element, options?: CommandOptions): CommandController;
+declare function create(scope?: ParentNode): CommandController[];
 //#endregion
-export { createDialog as i, DialogOptions as n, create as r, DialogController as t };
+export { createCommand as a, create as i, CommandFilter as n, CommandOptions as r, CommandController as t };

package/dist/index5.d.cts

@@ -1,69 +1,62 @@
-//#region ../hover-card/src/index.d.ts
-type HoverCardSide = "top" | "right" | "bottom" | "left";
-type HoverCardAlign = "start" | "center" | "end";
-type HoverCardReason = "pointer" | "focus" | "blur" | "dismiss" | "api";
-interface HoverCardOptions {
-  /** Initial open state (uncontrolled mode only) */
+//#region ../dialog/src/index.d.ts
+interface DialogOptions {
+  /** Initial open state */
   defaultOpen?: boolean;
-  /** Controlled open state. Internal interactions do not mutate when set. */
-  open?: boolean;
-  /** Delay before opening on hover/keyboard focus (ms). @default 700 */
-  delay?: number;
-  /** Duration to skip delay after closing (ms). Set to 0 to disable warm-up. @default 300 */
-  skipDelayDuration?: number;
-  /** Delay before closing after leave/blur (ms). @default 300 */
-  closeDelay?: number;
-  /** The preferred side of the trigger to render against. @default "bottom" */
-  side?: HoverCardSide;
-  /** The preferred alignment against the trigger. @default "center" */
-  align?: HoverCardAlign;
-  /** The distance in pixels from the trigger. @default 4 */
-  sideOffset?: number;
-  /** Offset in pixels from the alignment edge. @default 0 */
-  alignOffset?: number;
-  /** When true, flips/shifts content to avoid viewport collisions. @default true */
-  avoidCollisions?: boolean;
-  /** Viewport padding used when avoiding collisions. @default 8 */
-  collisionPadding?: number;
-  /** Portal content to body while open. @default true */
-  portal?: boolean;
-  /** Close when clicking outside. @default true */
-  closeOnClickOutside?: boolean;
-  /** Close when pressing Escape. @default true */
-  closeOnEscape?: boolean;
   /** Callback when open state changes */
   onOpenChange?: (open: boolean) => void;
+  /** Close when clicking overlay */
+  closeOnClickOutside?: boolean;
+  /** Close when pressing Escape */
+  closeOnEscape?: boolean;
+  /** Lock body scroll when open */
+  lockScroll?: boolean;
+  /** Use alertdialog role for blocking confirmations */
+  alertDialog?: boolean;
 }
-interface HoverCardController {
-  /** Open the hover-card (request in controlled mode) */
+interface DialogController {
+  /** Open the dialog */
   open(): void;
-  /** Close the hover-card (request in controlled mode) */
+  /** Close the dialog */
   close(): void;
-  /** Toggle the hover-card (request in controlled mode) */
+  /** Toggle the dialog */
   toggle(): void;
-  /** Force open state update (works in both controlled/uncontrolled modes) */
-  setOpen(open: boolean): void;
   /** Current open state */
   readonly isOpen: boolean;
   /** Cleanup all event listeners */
   destroy(): void;
+  /** Internal: handle keydown for focus trap (used by global handler) */
+  _handleKeydown?(e: KeyboardEvent): void;
+  /** Internal: content element for focus trap */
+  _content?: HTMLElement;
+  /** Internal: overlay element for stack metadata */
+  _overlay?: HTMLElement;
 }
 /**
- * Create a hover-card controller for a root element
+ * Create a dialog controller for a root element
  *
  * Expected markup:
  * ```html
- * <div data-slot="hover-card">
- *   <button data-slot="hover-card-trigger">Hover me</button>
- *   <div data-slot="hover-card-content">Preview content</div>
+ * <div data-slot="dialog">
+ *   <button data-slot="dialog-trigger">Open</button>
+ *   <div data-slot="dialog-portal">
+ *     <div data-slot="dialog-overlay"></div>
+ *     <div data-slot="dialog-content">
+ *       <h2 data-slot="dialog-title">Title</h2>
+ *       <p data-slot="dialog-description">Description</p>
+ *       <button data-slot="dialog-close">Close</button>
+ *     </div>
+ *   </div>
  * </div>
  * ```
+ *
+ * Note: Overlay is required. The optional dialog-portal slot will be
+ * automatically moved to document.body to escape stacking context issues.
  */
-declare function createHoverCard(root: Element, options?: HoverCardOptions): HoverCardController;
+declare function createDialog(root: Element, options?: DialogOptions): DialogController;
 /**
- * Find and bind all hover-card components in a scope
+ * Find and bind all dialog components in a scope
  * Returns array of controllers for programmatic access
  */
-declare function create(scope?: ParentNode): HoverCardController[];
+declare function create(scope?: ParentNode): DialogController[];
 //#endregion
-export { HoverCardSide as a, HoverCardReason as i, HoverCardController as n, create as o, HoverCardOptions as r, createHoverCard as s, HoverCardAlign as t };
+export { createDialog as i, DialogOptions as n, create as r, DialogController as t };

package/dist/index5.d.ts

@@ -1,69 +1,62 @@
-//#region ../hover-card/src/index.d.ts
-type HoverCardSide = "top" | "right" | "bottom" | "left";
-type HoverCardAlign = "start" | "center" | "end";
-type HoverCardReason = "pointer" | "focus" | "blur" | "dismiss" | "api";
-interface HoverCardOptions {
-  /** Initial open state (uncontrolled mode only) */
+//#region ../dialog/src/index.d.ts
+interface DialogOptions {
+  /** Initial open state */
   defaultOpen?: boolean;
-  /** Controlled open state. Internal interactions do not mutate when set. */
-  open?: boolean;
-  /** Delay before opening on hover/keyboard focus (ms). @default 700 */
-  delay?: number;
-  /** Duration to skip delay after closing (ms). Set to 0 to disable warm-up. @default 300 */
-  skipDelayDuration?: number;
-  /** Delay before closing after leave/blur (ms). @default 300 */
-  closeDelay?: number;
-  /** The preferred side of the trigger to render against. @default "bottom" */
-  side?: HoverCardSide;
-  /** The preferred alignment against the trigger. @default "center" */
-  align?: HoverCardAlign;
-  /** The distance in pixels from the trigger. @default 4 */
-  sideOffset?: number;
-  /** Offset in pixels from the alignment edge. @default 0 */
-  alignOffset?: number;
-  /** When true, flips/shifts content to avoid viewport collisions. @default true */
-  avoidCollisions?: boolean;
-  /** Viewport padding used when avoiding collisions. @default 8 */
-  collisionPadding?: number;
-  /** Portal content to body while open. @default true */
-  portal?: boolean;
-  /** Close when clicking outside. @default true */
-  closeOnClickOutside?: boolean;
-  /** Close when pressing Escape. @default true */
-  closeOnEscape?: boolean;
   /** Callback when open state changes */
   onOpenChange?: (open: boolean) => void;
+  /** Close when clicking overlay */
+  closeOnClickOutside?: boolean;
+  /** Close when pressing Escape */
+  closeOnEscape?: boolean;
+  /** Lock body scroll when open */
+  lockScroll?: boolean;
+  /** Use alertdialog role for blocking confirmations */
+  alertDialog?: boolean;
 }
-interface HoverCardController {
-  /** Open the hover-card (request in controlled mode) */
+interface DialogController {
+  /** Open the dialog */
   open(): void;
-  /** Close the hover-card (request in controlled mode) */
+  /** Close the dialog */
   close(): void;
-  /** Toggle the hover-card (request in controlled mode) */
+  /** Toggle the dialog */
   toggle(): void;
-  /** Force open state update (works in both controlled/uncontrolled modes) */
-  setOpen(open: boolean): void;
   /** Current open state */
   readonly isOpen: boolean;
   /** Cleanup all event listeners */
   destroy(): void;
+  /** Internal: handle keydown for focus trap (used by global handler) */
+  _handleKeydown?(e: KeyboardEvent): void;
+  /** Internal: content element for focus trap */
+  _content?: HTMLElement;
+  /** Internal: overlay element for stack metadata */
+  _overlay?: HTMLElement;
 }
 /**
- * Create a hover-card controller for a root element
+ * Create a dialog controller for a root element
  *
  * Expected markup:
  * ```html
- * <div data-slot="hover-card">
- *   <button data-slot="hover-card-trigger">Hover me</button>
- *   <div data-slot="hover-card-content">Preview content</div>
+ * <div data-slot="dialog">
+ *   <button data-slot="dialog-trigger">Open</button>
+ *   <div data-slot="dialog-portal">
+ *     <div data-slot="dialog-overlay"></div>
+ *     <div data-slot="dialog-content">
+ *       <h2 data-slot="dialog-title">Title</h2>
+ *       <p data-slot="dialog-description">Description</p>
+ *       <button data-slot="dialog-close">Close</button>
+ *     </div>
+ *   </div>
  * </div>
  * ```
+ *
+ * Note: Overlay is required. The optional dialog-portal slot will be
+ * automatically moved to document.body to escape stacking context issues.
  */
-declare function createHoverCard(root: Element, options?: HoverCardOptions): HoverCardController;
+declare function createDialog(root: Element, options?: DialogOptions): DialogController;
 /**
- * Find and bind all hover-card components in a scope
+ * Find and bind all dialog components in a scope
  * Returns array of controllers for programmatic access
  */
-declare function create(scope?: ParentNode): HoverCardController[];
+declare function create(scope?: ParentNode): DialogController[];
 //#endregion
-export { HoverCardSide as a, HoverCardReason as i, HoverCardController as n, create as o, HoverCardOptions as r, createHoverCard as s, HoverCardAlign as t };
+export { createDialog as i, DialogOptions as n, create as r, DialogController as t };

package/dist/index6.d.cts

@@ -1,63 +1,69 @@
-//#region ../tabs/src/index.d.ts
-interface TabsOptions {
-  /** Initial selected tab value */
-  defaultValue?: string;
-  /** Callback when selected tab changes */
-  onValueChange?: (value: string) => void;
-  /** Tab orientation for keyboard navigation */
-  orientation?: "horizontal" | "vertical";
-  /**
-   * Activation mode for keyboard navigation
-   * - "auto": Arrow keys select tabs immediately (default)
-   * - "manual": Arrow keys move focus, Enter/Space activates
-   */
-  activationMode?: "auto" | "manual";
+//#region ../hover-card/src/index.d.ts
+type HoverCardSide = "top" | "right" | "bottom" | "left";
+type HoverCardAlign = "start" | "center" | "end";
+type HoverCardReason = "pointer" | "focus" | "blur" | "dismiss" | "api";
+interface HoverCardOptions {
+  /** Initial open state (uncontrolled mode only) */
+  defaultOpen?: boolean;
+  /** Controlled open state. Internal interactions do not mutate when set. */
+  open?: boolean;
+  /** Delay before opening on hover/keyboard focus (ms). @default 700 */
+  delay?: number;
+  /** Duration to skip delay after closing (ms). Set to 0 to disable warm-up. @default 300 */
+  skipDelayDuration?: number;
+  /** Delay before closing after leave/blur (ms). @default 300 */
+  closeDelay?: number;
+  /** The preferred side of the trigger to render against. @default "bottom" */
+  side?: HoverCardSide;
+  /** The preferred alignment against the trigger. @default "center" */
+  align?: HoverCardAlign;
+  /** The distance in pixels from the trigger. @default 4 */
+  sideOffset?: number;
+  /** Offset in pixels from the alignment edge. @default 0 */
+  alignOffset?: number;
+  /** When true, flips/shifts content to avoid viewport collisions. @default true */
+  avoidCollisions?: boolean;
+  /** Viewport padding used when avoiding collisions. @default 8 */
+  collisionPadding?: number;
+  /** Portal content to body while open. @default true */
+  portal?: boolean;
+  /** Close when clicking outside. @default true */
+  closeOnClickOutside?: boolean;
+  /** Close when pressing Escape. @default true */
+  closeOnEscape?: boolean;
+  /** Callback when open state changes */
+  onOpenChange?: (open: boolean) => void;
 }
-interface TabsController {
-  /** Select a tab by value */
-  select(value: string): void;
-  /** Currently selected value */
-  readonly value: string;
-  /** Update indicator position (call after layout changes) */
-  updateIndicator(): void;
+interface HoverCardController {
+  /** Open the hover-card (request in controlled mode) */
+  open(): void;
+  /** Close the hover-card (request in controlled mode) */
+  close(): void;
+  /** Toggle the hover-card (request in controlled mode) */
+  toggle(): void;
+  /** Force open state update (works in both controlled/uncontrolled modes) */
+  setOpen(open: boolean): void;
+  /** Current open state */
+  readonly isOpen: boolean;
   /** Cleanup all event listeners */
   destroy(): void;
 }
 /**
- * Create a tabs controller for a root element
- *
- * ## Events
- * - **Outbound** `tabs:change` (on root): Fires when selected tab changes.
- *   `event.detail: { value: string }`
- * - **Inbound** `tabs:select` (on root): Select a tab programmatically.
- *   `event.detail: { value: string } | string` (fallback: `event.currentTarget.dataset.value`)
- *
- * @example
- * ```js
- * // Listen for tab changes
- * root.addEventListener("tabs:change", (e) => console.log(e.detail.value));
- * // Select a tab from outside (object or string detail)
- * root.dispatchEvent(new CustomEvent("tabs:select", { detail: { value: "two" } }));
- * root.dispatchEvent(new CustomEvent("tabs:select", { detail: "two" }));
- * ```
+ * Create a hover-card controller for a root element
  *
  * Expected markup:
  * ```html
- * <div data-slot="tabs" data-default-value="two">
- *   <div data-slot="tabs-list">
- *     <button data-slot="tabs-trigger" data-value="one">Tab One</button>
- *     <button data-slot="tabs-trigger" data-value="two">Tab Two</button>
- *   </div>
- *   <div data-slot="tabs-content" data-value="one">Content One</div>
- *   <div data-slot="tabs-content" data-value="two">Content Two</div>
+ * <div data-slot="hover-card">
+ *   <button data-slot="hover-card-trigger">Hover me</button>
+ *   <div data-slot="hover-card-content">Preview content</div>
  * </div>
  * ```
  */
-declare function createTabs(root: Element, options?: TabsOptions): TabsController;
+declare function createHoverCard(root: Element, options?: HoverCardOptions): HoverCardController;
 /**
- * Find and bind all tabs components in a scope
+ * Find and bind all hover-card components in a scope
  * Returns array of controllers for programmatic access
  */
-declare function create(scope?: ParentNode): TabsController[];
+declare function create(scope?: ParentNode): HoverCardController[];
 //#endregion
-export { createTabs as i, TabsOptions as n, create as r, TabsController as t };
+export { HoverCardSide as a, HoverCardReason as i, HoverCardController as n, create as o, HoverCardOptions as r, createHoverCard as s, HoverCardAlign as t };