@humain/ui 2.2.6 → 2.2.9

package/dist/wc-react/hf-code-snippet.js.map

@@ -1 +1 @@
-{"version":3,"file":"hf-code-snippet.js","names":[],"sources":["../../src/components/molecules/data/CodeSnippet/CodeSnippet.tsx","../../src/wc/hf-code-snippet.ts"],"sourcesContent":["'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { Check, Copy } from 'lucide-react';\nimport * as React from 'react';\nimport { Button } from '@/components/atoms/buttons/Button';\nimport { SUGAR_HIGH_STYLE } from '@/lib/syntax-highlight';\nimport { renderHighlightedCode } from '@/lib/syntax-highlight-react';\nimport { cn } from '@/lib/utils';\n\nconst codeSnippetVariants = cva('overflow-hidden rounded-xl bg-background', {\n  variants: {\n    size: {\n      sm: 'text-xs',\n      md: 'text-base',\n      lg: 'text-lg',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n});\n\nconst lineNumberVariants = cva(\n  'select-none font-mono font-bold leading-normal text-text-quaternary',\n  {\n    variants: {\n      size: {\n        sm: 'text-xs',\n        md: 'text-base',\n        lg: 'text-lg',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n    },\n  },\n);\n\nexport interface CodeSnippetProps\n  extends VariantProps<typeof codeSnippetVariants> {\n  /** Code content to display */\n  code: string;\n  /** Programming language label shown in the top-right corner */\n  language?: string;\n  /** Whether to show line numbers */\n  showLineNumbers?: boolean;\n  /** Starting line number */\n  startLineNumber?: number;\n  /** Whether to show a copy-to-clipboard button */\n  showCopyButton?: boolean;\n  /** Additional class name */\n  className?: string;\n  /** Responsive breakpoint for compact mode */\n  breakpoint?: 'desktop' | 'mobile';\n}\n\ninterface LineNumbersProps {\n  count: number;\n  startLine: number;\n  size?: 'sm' | 'md' | 'lg' | null;\n}\n\ninterface CopyFeedbackState {\n  copied: boolean;\n  resetKey: number;\n}\n\nfunction copyFeedbackReducer(\n  state: CopyFeedbackState,\n  copied: boolean,\n): CopyFeedbackState {\n  return copied\n    ? { copied: true, resetKey: state.resetKey + 1 }\n    : { ...state, copied: false };\n}\n\nfunction getStartLineNumber(startLineNumber: number): number {\n  return Number.isFinite(startLineNumber) ? Math.floor(startLineNumber) : 1;\n}\n\nfunction LineNumbers({ count, startLine, size }: LineNumbersProps) {\n  return (\n    <div aria-hidden=\"true\" className={cn(lineNumberVariants({ size }))}>\n      {Array.from({ length: count }, (_, i) => (\n        <span key={i} className=\"block mb-px last:mb-0\">\n          {startLine + i}\n        </span>\n      ))}\n    </div>\n  );\n}\n\nconst CodeSnippet = React.forwardRef<HTMLElement, CodeSnippetProps>(\n  (\n    {\n      code,\n      language,\n      showLineNumbers = true,\n      startLineNumber = 1,\n      showCopyButton = false,\n      size,\n      className,\n      breakpoint = 'desktop',\n    },\n    ref,\n  ) => {\n    const highlightedContent = React.useMemo(\n      () => renderHighlightedCode(code),\n      [code],\n    );\n    const lineCount = React.useMemo(() => code.split('\\n').length, [code]);\n    const safeStartLineNumber = getStartLineNumber(startLineNumber);\n\n    const [copyFeedback, setCopyFeedback] = React.useReducer(\n      copyFeedbackReducer,\n      { copied: false, resetKey: 0 },\n    );\n    const { copied } = copyFeedback;\n    const rootRef = React.useRef<HTMLElement>(null);\n\n    // Merge forwarded ref with local ref\n    React.useImperativeHandle(ref, () => rootRef.current as HTMLElement);\n\n    React.useEffect(() => {\n      if (!copyFeedback.copied) return;\n\n      const copyResetTimer = setTimeout(() => {\n        setCopyFeedback(false);\n      }, 2000);\n\n      return () => {\n        clearTimeout(copyResetTimer);\n      };\n    }, [copyFeedback]);\n\n    const handleCopy = React.useCallback(async () => {\n      try {\n        const win = rootRef.current?.ownerDocument.defaultView;\n        if (!win) return;\n        await win.navigator.clipboard.writeText(code);\n        setCopyFeedback(true);\n      } catch (err) {\n        console.error('Failed to copy code:', err);\n      }\n    }, [code]);\n\n    const containerPadding = breakpoint === 'mobile' ? 'p-4' : 'p-6';\n    const contentPadding =\n      breakpoint === 'mobile' ? 'py-4 px-4 pb-6' : 'py-6 px-6 pb-8';\n\n    return (\n      <section\n        ref={rootRef}\n        data-slot=\"code-snippet\"\n        aria-label=\"Code snippet\"\n        className={cn(\n          codeSnippetVariants({ size }),\n          'relative flex items-start justify-center',\n          className,\n        )}\n        style={SUGAR_HIGH_STYLE}\n      >\n        {/* Language badge & copy button */}\n        {(language || showCopyButton) && (\n          <div className=\"absolute top-2 end-2 flex items-center gap-2 z-10\">\n            {language && (\n              <span className=\"text-xs font-medium text-text-quaternary uppercase select-none\">\n                {language}\n              </span>\n            )}\n            {showCopyButton && (\n              <Button\n                appearance=\"ghost\"\n                variant=\"secondary\"\n                size=\"sm\"\n                onClick={handleCopy}\n                aria-label={\n                  copied ? 'Copied to clipboard' : 'Copy code to clipboard'\n                }\n                className=\"h-7 px-2 text-text-quaternary hover:text-secondary-foreground transition-colors duration-150 ease-out\"\n              >\n                {copied ? (\n                  <Check className=\"size-3.5 text-success\" />\n                ) : (\n                  <Copy className=\"size-3.5\" />\n                )}\n              </Button>\n            )}\n          </div>\n        )}\n\n        {/* Line Numbers Sidebar */}\n        {showLineNumbers && (\n          <div\n            className={cn(\n              'shrink-0 self-stretch bg-muted border-e border-border',\n              containerPadding,\n            )}\n          >\n            <LineNumbers\n              count={lineCount}\n              startLine={safeStartLineNumber}\n              size={size}\n            />\n          </div>\n        )}\n\n        {/* Code Content */}\n        <section\n          className={cn(\n            'grow min-w-0 overflow-x-auto focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring',\n            contentPadding,\n          )}\n          // biome-ignore lint/a11y/noNoninteractiveTabindex: Focusable scroll region satisfies axe scrollable-region-focusable.\n          tabIndex={0}\n          aria-label=\"Code content\"\n        >\n          <pre\n            className={cn(\n              'font-mono font-medium leading-normal !bg-transparent !p-0 !m-0 !border-0 !rounded-none',\n              '[&_.sh__line]:block [&_.sh__line]:leading-normal [&_.sh__line]:mb-px [&_.sh__line:last-child]:mb-0',\n            )}\n          >\n            {highlightedContent}\n          </pre>\n        </section>\n      </section>\n    );\n  },\n);\n\nCodeSnippet.displayName = 'CodeSnippet';\n\nexport { CodeSnippet, codeSnippetVariants, lineNumberVariants };\n","/**\n * Web Component wrapper for CodeSnippet\n * Custom element: <hf-code-snippet>\n *\n * @generated by scripts/generate-wc-components.ts\n * DO NOT EDIT MANUALLY\n */\n\nimport React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport { CodeSnippet } from '../components/molecules/data/CodeSnippet';\nimport { parseAttr, parseValue, type PropDefs } from './_shared';\n\n/**\n * Prop type definitions for attribute parsing\n */\nconst propTypes: PropDefs = {\n    size: 'string',\n    code: 'string',\n    language: 'string',\n    showLineNumbers: 'boolean',\n    startLineNumber: 'number',\n    showCopyButton: 'boolean',\n    className: 'string',\n    breakpoint: 'string'\n};\n\nclass CodeSnippetWC extends HTMLElement {\n  private _root: ReturnType<typeof createRoot> | null = null;\n  private _childrenContainer: HTMLDivElement | null = null;\n  private _props: Record<string, unknown> = {};\n  private _initialized = false;\n\n  connectedCallback() {\n    setTimeout(() => this._initialize(), 0);\n  }\n\n  private _initialize() {\n    if (this._initialized) return;\n    this._initialized = true;\n\n    const originalChildren: Node[] = [];\n    for (const child of Array.from(this.childNodes)) {\n      if (child.nodeType === Node.TEXT_NODE && !child.textContent?.trim()) {\n        continue;\n      }\n      originalChildren.push(child);\n    }\n\n    const reactContainer = this.ownerDocument.createElement('div');\n    reactContainer.style.display = 'contents';\n\n    this._childrenContainer = this.ownerDocument.createElement('div');\n    this._childrenContainer.style.display = 'contents';\n\n    originalChildren.forEach((child) => this._childrenContainer!.appendChild(child));\n\n    while (this.firstChild) this.removeChild(this.firstChild);\n    this.appendChild(reactContainer);\n\n    this._root = createRoot(reactContainer);\n    this._render();\n  }\n\n  disconnectedCallback() {\n    this._root?.unmount();\n    this._root = null;\n  }\n\n  attributeChangedCallback(_name: string, _oldValue: string | null, _newValue: string | null) {\n    this._render();\n  }\n\n  static get observedAttributes() {\n    return Object.keys(propTypes).map((prop) =>\n      prop.replace(/([A-Z])/g, '-$1').toLowerCase(),\n    );\n  }\n\n  _setProp(name: string, value: unknown) {\n    const propType = propTypes[name] || 'string';\n    this._props[name] = parseValue(value, propType);\n    this._render();\n  }\n\n  _getProp(name: string): unknown {\n    if (name in this._props) {\n      return this._props[name];\n    }\n    const attrName = name.replace(/([A-Z])/g, '-$1').toLowerCase();\n    const propType = propTypes[name] || 'string';\n    return parseAttr(this.getAttribute(attrName), propType);\n  }\n\n  private _render() {\n    if (!this._root) return;\n\n    const props: Record<string, unknown> = {};\n    for (const [propName, propType] of Object.entries(propTypes)) {\n      if (propName in this._props) {\n        props[propName] = this._props[propName];\n      } else {\n        const attrName = propName.replace(/([A-Z])/g, '-$1').toLowerCase();\n        props[propName] = parseAttr(this.getAttribute(attrName), propType);\n      }\n    }\n\n    const element = React.createElement(\n      CodeSnippet,\n      props,\n    );\n\n    this._root.render(element);\n  }\n}\n\nfor (const propName of Object.keys(propTypes)) {\n  Object.defineProperty(CodeSnippetWC.prototype, propName, {\n    get() {\n      return this._getProp(propName);\n    },\n    set(value: unknown) {\n      this._setProp(propName, value);\n    },\n    enumerable: true,\n    configurable: true,\n  });\n}\n\nif (typeof customElements !== 'undefined' && !customElements.get('hf-code-snippet')) {\n  customElements.define('hf-code-snippet', CodeSnippetWC);\n}\n\nexport { CodeSnippetWC };\nexport default CodeSnippetWC;\n"],"mappings":"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"}
+{"version":3,"file":"hf-code-snippet.js","names":[],"sources":["../../src/components/molecules/data/CodeSnippet/CodeSnippet.tsx","../../src/wc/hf-code-snippet.ts"],"sourcesContent":["'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { Check, Copy } from 'lucide-react';\nimport * as React from 'react';\nimport { Button } from '@/components/atoms/buttons/Button';\nimport { SUGAR_HIGH_STYLE } from '@/lib/syntax-highlight';\nimport { renderHighlightedCode } from '@/lib/syntax-highlight-react';\nimport { cn } from '@/lib/utils';\n\nconst codeSnippetVariants = cva('overflow-hidden rounded-xl bg-background', {\n  variants: {\n    size: {\n      sm: 'text-xs',\n      md: 'text-base',\n      lg: 'text-lg',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n});\n\nconst lineNumberVariants = cva(\n  'select-none font-mono font-bold leading-normal text-secondary-foreground',\n  {\n    variants: {\n      size: {\n        sm: 'text-xs',\n        md: 'text-base',\n        lg: 'text-lg',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n    },\n  },\n);\n\nexport interface CodeSnippetProps\n  extends VariantProps<typeof codeSnippetVariants> {\n  /** Code content to display */\n  code: string;\n  /** Programming language label shown in the top-right corner */\n  language?: string;\n  /** Whether to show line numbers */\n  showLineNumbers?: boolean;\n  /** Starting line number */\n  startLineNumber?: number;\n  /** Whether to show a copy-to-clipboard button */\n  showCopyButton?: boolean;\n  /** Additional class name */\n  className?: string;\n  /** Responsive breakpoint for compact mode */\n  breakpoint?: 'desktop' | 'mobile';\n}\n\ninterface LineNumbersProps {\n  count: number;\n  startLine: number;\n  size?: 'sm' | 'md' | 'lg' | null;\n}\n\ninterface CopyFeedbackState {\n  copied: boolean;\n  resetKey: number;\n}\n\nfunction copyFeedbackReducer(\n  state: CopyFeedbackState,\n  copied: boolean,\n): CopyFeedbackState {\n  return copied\n    ? { copied: true, resetKey: state.resetKey + 1 }\n    : { ...state, copied: false };\n}\n\nfunction getStartLineNumber(startLineNumber: number): number {\n  return Number.isFinite(startLineNumber) ? Math.floor(startLineNumber) : 1;\n}\n\nfunction LineNumbers({ count, startLine, size }: LineNumbersProps) {\n  return (\n    <div aria-hidden=\"true\" className={cn(lineNumberVariants({ size }))}>\n      {Array.from({ length: count }, (_, i) => (\n        <span key={i} className=\"block mb-px last:mb-0\">\n          {startLine + i}\n        </span>\n      ))}\n    </div>\n  );\n}\n\nconst CodeSnippet = React.forwardRef<HTMLElement, CodeSnippetProps>(\n  (\n    {\n      code,\n      language,\n      showLineNumbers = true,\n      startLineNumber = 1,\n      showCopyButton = false,\n      size,\n      className,\n      breakpoint = 'desktop',\n    },\n    ref,\n  ) => {\n    const highlightedContent = React.useMemo(\n      () => renderHighlightedCode(code),\n      [code],\n    );\n    const lineCount = React.useMemo(() => code.split('\\n').length, [code]);\n    const safeStartLineNumber = getStartLineNumber(startLineNumber);\n\n    const [copyFeedback, setCopyFeedback] = React.useReducer(\n      copyFeedbackReducer,\n      { copied: false, resetKey: 0 },\n    );\n    const { copied } = copyFeedback;\n    const rootRef = React.useRef<HTMLElement>(null);\n\n    // Merge forwarded ref with local ref\n    React.useImperativeHandle(ref, () => rootRef.current as HTMLElement);\n\n    React.useEffect(() => {\n      if (!copyFeedback.copied) return;\n\n      const copyResetTimer = setTimeout(() => {\n        setCopyFeedback(false);\n      }, 2000);\n\n      return () => {\n        clearTimeout(copyResetTimer);\n      };\n    }, [copyFeedback]);\n\n    const handleCopy = React.useCallback(async () => {\n      try {\n        const win = rootRef.current?.ownerDocument.defaultView;\n        if (!win) return;\n        await win.navigator.clipboard.writeText(code);\n        setCopyFeedback(true);\n      } catch (err) {\n        console.error('Failed to copy code:', err);\n      }\n    }, [code]);\n\n    const containerPadding = breakpoint === 'mobile' ? 'p-4' : 'p-6';\n    const contentPadding =\n      breakpoint === 'mobile' ? 'py-4 px-4 pb-6' : 'py-6 px-6 pb-8';\n\n    return (\n      <section\n        ref={rootRef}\n        data-slot=\"code-snippet\"\n        aria-label=\"Code snippet\"\n        className={cn(\n          codeSnippetVariants({ size }),\n          'relative flex items-start justify-center',\n          className,\n        )}\n        style={SUGAR_HIGH_STYLE}\n      >\n        {/* Language badge & copy button */}\n        {(language || showCopyButton) && (\n          <div className=\"absolute top-2 end-2 flex items-center gap-2 z-10\">\n            {language && (\n              <span className=\"text-xs font-medium text-secondary-foreground uppercase select-none\">\n                {language}\n              </span>\n            )}\n            {showCopyButton && (\n              <Button\n                appearance=\"ghost\"\n                variant=\"secondary\"\n                size=\"sm\"\n                onClick={handleCopy}\n                aria-label={\n                  copied ? 'Copied to clipboard' : 'Copy code to clipboard'\n                }\n                className=\"h-7 px-2 text-secondary-foreground hover:text-foreground transition-colors duration-150 ease-out\"\n              >\n                {copied ? (\n                  <Check className=\"size-3.5 text-success\" />\n                ) : (\n                  <Copy className=\"size-3.5\" />\n                )}\n              </Button>\n            )}\n          </div>\n        )}\n\n        {/* Line Numbers Sidebar */}\n        {showLineNumbers && (\n          <div\n            className={cn(\n              'shrink-0 self-stretch bg-muted border-e border-border',\n              containerPadding,\n            )}\n          >\n            <LineNumbers\n              count={lineCount}\n              startLine={safeStartLineNumber}\n              size={size}\n            />\n          </div>\n        )}\n\n        {/* Code Content */}\n        <section\n          className={cn(\n            'grow min-w-0 overflow-x-auto focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring',\n            contentPadding,\n          )}\n          // biome-ignore lint/a11y/noNoninteractiveTabindex: Focusable scroll region satisfies axe scrollable-region-focusable.\n          tabIndex={0}\n          aria-label=\"Code content\"\n        >\n          <pre\n            className={cn(\n              'font-mono font-medium leading-normal !bg-transparent !p-0 !m-0 !border-0 !rounded-none',\n              '[&_.sh__line]:block [&_.sh__line]:leading-normal [&_.sh__line]:mb-px [&_.sh__line:last-child]:mb-0',\n            )}\n          >\n            {highlightedContent}\n          </pre>\n        </section>\n      </section>\n    );\n  },\n);\n\nCodeSnippet.displayName = 'CodeSnippet';\n\nexport { CodeSnippet, codeSnippetVariants, lineNumberVariants };\n","/**\n * Web Component wrapper for CodeSnippet\n * Custom element: <hf-code-snippet>\n *\n * @generated by scripts/generate-wc-components.ts\n * DO NOT EDIT MANUALLY\n */\n\nimport React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport { CodeSnippet } from '../components/molecules/data/CodeSnippet';\nimport { parseAttr, parseValue, type PropDefs } from './_shared';\n\n/**\n * Prop type definitions for attribute parsing\n */\nconst propTypes: PropDefs = {\n    size: 'string',\n    code: 'string',\n    language: 'string',\n    showLineNumbers: 'boolean',\n    startLineNumber: 'number',\n    showCopyButton: 'boolean',\n    className: 'string',\n    breakpoint: 'string'\n};\n\nclass CodeSnippetWC extends HTMLElement {\n  private _root: ReturnType<typeof createRoot> | null = null;\n  private _childrenContainer: HTMLDivElement | null = null;\n  private _props: Record<string, unknown> = {};\n  private _initialized = false;\n\n  connectedCallback() {\n    setTimeout(() => this._initialize(), 0);\n  }\n\n  private _initialize() {\n    if (this._initialized) return;\n    this._initialized = true;\n\n    const originalChildren: Node[] = [];\n    for (const child of Array.from(this.childNodes)) {\n      if (child.nodeType === Node.TEXT_NODE && !child.textContent?.trim()) {\n        continue;\n      }\n      originalChildren.push(child);\n    }\n\n    const reactContainer = this.ownerDocument.createElement('div');\n    reactContainer.style.display = 'contents';\n\n    this._childrenContainer = this.ownerDocument.createElement('div');\n    this._childrenContainer.style.display = 'contents';\n\n    originalChildren.forEach((child) => this._childrenContainer!.appendChild(child));\n\n    while (this.firstChild) this.removeChild(this.firstChild);\n    this.appendChild(reactContainer);\n\n    this._root = createRoot(reactContainer);\n    this._render();\n  }\n\n  disconnectedCallback() {\n    this._root?.unmount();\n    this._root = null;\n  }\n\n  attributeChangedCallback(_name: string, _oldValue: string | null, _newValue: string | null) {\n    this._render();\n  }\n\n  static get observedAttributes() {\n    return Object.keys(propTypes).map((prop) =>\n      prop.replace(/([A-Z])/g, '-$1').toLowerCase(),\n    );\n  }\n\n  _setProp(name: string, value: unknown) {\n    const propType = propTypes[name] || 'string';\n    this._props[name] = parseValue(value, propType);\n    this._render();\n  }\n\n  _getProp(name: string): unknown {\n    if (name in this._props) {\n      return this._props[name];\n    }\n    const attrName = name.replace(/([A-Z])/g, '-$1').toLowerCase();\n    const propType = propTypes[name] || 'string';\n    return parseAttr(this.getAttribute(attrName), propType);\n  }\n\n  private _render() {\n    if (!this._root) return;\n\n    const props: Record<string, unknown> = {};\n    for (const [propName, propType] of Object.entries(propTypes)) {\n      if (propName in this._props) {\n        props[propName] = this._props[propName];\n      } else {\n        const attrName = propName.replace(/([A-Z])/g, '-$1').toLowerCase();\n        props[propName] = parseAttr(this.getAttribute(attrName), propType);\n      }\n    }\n\n    const element = React.createElement(\n      CodeSnippet,\n      props,\n    );\n\n    this._root.render(element);\n  }\n}\n\nfor (const propName of Object.keys(propTypes)) {\n  Object.defineProperty(CodeSnippetWC.prototype, propName, {\n    get() {\n      return this._getProp(propName);\n    },\n    set(value: unknown) {\n      this._setProp(propName, value);\n    },\n    enumerable: true,\n    configurable: true,\n  });\n}\n\nif (typeof customElements !== 'undefined' && !customElements.get('hf-code-snippet')) {\n  customElements.define('hf-code-snippet', CodeSnippetWC);\n}\n\nexport { CodeSnippetWC };\nexport default CodeSnippetWC;\n"],"mappings":"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"}

package/dist/wc-react/hf-command-menu.js

@@ -1,9 +1,9 @@
-import { c as V, f as l, s as T } from "./_shared.js";
-import { t as R } from "./createLucideIcon.js";
-import { t as $ } from "./arrow-down.js";
-import { t as W } from "./arrow-up.js";
-import { t as Z } from "./search.js";
-import { t as X } from "./settings.js";
+import { c as R, f as c, s as T } from "./_shared.js";
+import { t as $ } from "./createLucideIcon.js";
+import { t as W } from "./arrow-down.js";
+import { t as Z } from "./arrow-up.js";
+import { t as X } from "./search.js";
+import { t as q } from "./settings.js";
 import { t as K } from "./Avatar.js";
 import { n as J, t as Q } from "./button.js";
 import { t as D } from "./Kbd.js";
@@ -12,14 +12,14 @@ import * as E from "react";
 import M from "react";
 import { createRoot as ie } from "react-dom/client";
 import { jsx as n, jsxs as s } from "react/jsx-runtime";
-var le = [["path", {
+var ce = [["path", {
   d: "M20 4v7a4 4 0 0 1-4 4H4",
   key: "6o5b7l"
 }], ["path", {
   d: "m9 10-5 5 5 5",
   key: "1kshq7"
-}]], ce = R("corner-down-left", le), k = 336, L = "Type a command or search...", me = "w-full max-w-[508px] overflow-hidden rounded-xl border border-input bg-background shadow-lg";
-function de(e) {
+}]], le = $("corner-down-left", ce), k = 336, L = "Type a command or search...", de = "w-full max-w-[508px] overflow-hidden rounded-xl border border-input bg-background shadow-lg";
+function me(e) {
   return Number.isFinite(e) && e >= 0 ? e : k;
 }
 function H() {
@@ -32,7 +32,7 @@ function S({ children: e, className: t }) {
   return /* @__PURE__ */ n(D, {
     variant: "solid",
     size: "sm",
-    className: l("shadow-xs", t),
+    className: c("shadow-xs", t),
     children: e
   });
 }
@@ -41,14 +41,14 @@ function v({ children: e, className: t }) {
   return /* @__PURE__ */ n(D, {
     variant: "footer",
     size: "sm",
-    className: l("p-1.5", t),
+    className: c("p-1.5", t),
     children: e
   });
 }
 v.displayName = "CommandMenu.FooterNavIcon";
 function j({ children: e, className: t }) {
   return /* @__PURE__ */ n("span", {
-    className: l("text-sm font-semibold text-text-quaternary", t),
+    className: c("text-sm font-semibold text-secondary-foreground", t),
     children: e
   });
 }
@@ -57,19 +57,19 @@ var ue = [
   {
     keys: /* @__PURE__ */ s("div", {
       className: "flex items-center gap-1",
-      children: [/* @__PURE__ */ n(v, { children: /* @__PURE__ */ n(W, { className: "size-2.5 text-text-quaternary" }) }), /* @__PURE__ */ n(v, { children: /* @__PURE__ */ n($, { className: "size-2.5 text-text-quaternary" }) })]
+      children: [/* @__PURE__ */ n(v, { children: /* @__PURE__ */ n(Z, { className: "size-2.5 text-secondary-foreground" }) }), /* @__PURE__ */ n(v, { children: /* @__PURE__ */ n(W, { className: "size-2.5 text-secondary-foreground" }) })]
     }),
     label: "to navigate"
   },
   {
-    keys: /* @__PURE__ */ n(v, { children: /* @__PURE__ */ n(ce, { className: "size-2.5 text-text-quaternary" }) }),
+    keys: /* @__PURE__ */ n(v, { children: /* @__PURE__ */ n(le, { className: "size-2.5 text-secondary-foreground" }) }),
     label: "to select"
   },
   {
     keys: /* @__PURE__ */ n(v, {
       className: "px-1.5 py-1",
       children: /* @__PURE__ */ n("span", {
-        className: "text-xs font-semibold text-text-quaternary",
+        className: "text-xs font-semibold text-secondary-foreground",
         children: "esc"
       })
     }),
@@ -79,7 +79,7 @@ var ue = [
 function F({ hints: e = ue, showSettingsButton: t = !1, onSettingsClick: r, className: a }) {
   return /* @__PURE__ */ s("div", {
     "data-slot": "command-menu-footer",
-    className: l("flex items-center gap-3 border-t border-border bg-card/80 py-2 pe-2 ps-[18px] supports-backdrop-filter:backdrop-blur", a),
+    className: c("flex items-center gap-3 border-t border-border bg-card/80 py-2 pe-2 ps-[18px] supports-backdrop-filter:backdrop-blur", a),
     children: [/* @__PURE__ */ n("div", {
       className: "hidden flex-1 items-start gap-4 [@media(hover:hover)]:flex",
       children: e.map((o) => /* @__PURE__ */ s("div", {
@@ -93,7 +93,7 @@ function F({ hints: e = ue, showSettingsButton: t = !1, onSettingsClick: r, clas
       className: "group ms-auto rounded-full bg-muted",
       onClick: r,
       "aria-label": "Settings",
-      children: /* @__PURE__ */ n(X, { className: "size-5 text-muted-foreground transition-transform duration-300 ease-out group-hover:rotate-90 motion-reduce:transition-none" })
+      children: /* @__PURE__ */ n(q, { className: "size-5 text-muted-foreground transition-transform duration-300 ease-out group-hover:rotate-90 motion-reduce:transition-none" })
     })]
   });
 }
@@ -104,7 +104,7 @@ function O({ option: e, onSelect: t, className: r, ...a }) {
     disabled: e.disabled,
     showCheckIndicator: !1,
     onSelect: () => t?.(e.id, e),
-    className: l("flex cursor-pointer items-center gap-2 transition-colors duration-150 motion-reduce:transition-none", r),
+    className: c("flex cursor-pointer items-center gap-2 transition-colors duration-150 motion-reduce:transition-none", r),
     ...a,
     children: [
       e.avatar && /* @__PURE__ */ n(K, {
@@ -138,7 +138,7 @@ O.displayName = "CommandMenu.Item";
 function P({ children: e, className: t, ...r }) {
   return /* @__PURE__ */ n("h3", {
     "data-slot": "command-menu-group-header",
-    className: l("px-2 py-1.5 text-xs font-medium text-muted-foreground", t),
+    className: c("px-2 py-1.5 text-xs font-medium text-muted-foreground", t),
     ...r,
     children: e
   });
@@ -168,20 +168,20 @@ function pe({ children: e, groups: t, options: r, optionRenderer: a }) {
     children: r.map(a)
   }));
 }
-function A({ children: e, groups: t, options: r, onSelect: a, onClose: o, placeholder: i, emptyText: d, emptyState: u, showShortcut: p, shortcutText: h, showFooter: f, footerHints: C, showSettingsButton: b, onSettingsClick: x, maxHeight: g, filter: N }) {
-  const y = de(g);
+function A({ children: e, groups: t, options: r, onSelect: a, onClose: o, placeholder: i, emptyText: m, emptyState: u, showShortcut: p, shortcutText: h, showFooter: f, footerHints: C, showSettingsButton: b, onSettingsClick: g, maxHeight: N, filter: x }) {
+  const y = me(N);
   return /* @__PURE__ */ s(oe, {
-    filter: N,
+    filter: x,
     className: "rounded-none border-0 shadow-none",
     "data-slot": "command-menu",
     children: [
       /* @__PURE__ */ n("search", {
         "aria-label": "Command menu search",
         className: "block border-b border-input bg-background",
-        children: /* @__PURE__ */ n(te, { render: ({ clearSearch: c, value: m, ...G }) => {
-          const z = typeof o == "function", U = () => {
-            if (m) {
-              c();
+        children: /* @__PURE__ */ n(te, { render: ({ clearSearch: l, value: d, ...U }) => {
+          const z = typeof o == "function", V = () => {
+            if (d) {
+              l();
               return;
             }
             o?.();
@@ -191,13 +191,13 @@ function A({ children: e, groups: t, options: r, onSelect: a, onClose: o, placeh
             "cmdk-input-wrapper": "",
             className: "flex h-11 items-center gap-2 px-3",
             children: [
-              /* @__PURE__ */ n(Z, {
+              /* @__PURE__ */ n(X, {
                 className: "size-4 shrink-0 text-muted-foreground opacity-50",
                 "aria-hidden": "true"
               }),
               /* @__PURE__ */ n("input", {
-                ...G,
-                value: m,
+                ...U,
+                value: d,
                 placeholder: i,
                 "aria-label": i,
                 className: "min-w-0 flex-1 bg-transparent text-sm leading-5 text-foreground outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50"
@@ -206,9 +206,9 @@ function A({ children: e, groups: t, options: r, onSelect: a, onClose: o, placeh
               /* @__PURE__ */ n(J, {
                 size: "icon-xs",
                 className: "-me-1 rounded-sm p-0 opacity-50 hover:opacity-80 focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:size-4",
-                disabled: !m && !z,
-                "aria-label": m ? "Clear search" : z ? "Close command menu" : "Clear search",
-                onClick: U
+                disabled: !d && !z,
+                "aria-label": d ? "Clear search" : z ? "Close command menu" : "Clear search",
+                onClick: V
               })
             ]
           });
@@ -219,58 +219,58 @@ function A({ children: e, groups: t, options: r, onSelect: a, onClose: o, placeh
         className: "overflow-y-auto p-0",
         children: [/* @__PURE__ */ n(re, {
           className: "py-6 text-center text-sm text-muted-foreground animate-in fade-in-0 duration-200 motion-reduce:animate-none",
-          children: u || d
+          children: u || m
         }), /* @__PURE__ */ n(pe, {
           groups: t,
           options: r,
-          optionRenderer: (c) => /* @__PURE__ */ n(O, {
-            option: c,
+          optionRenderer: (l) => /* @__PURE__ */ n(O, {
+            option: l,
             onSelect: a
-          }, c.id),
+          }, l.id),
           children: e
         })]
       }),
       f && /* @__PURE__ */ n(F, {
         hints: C,
         showSettingsButton: b,
-        onSettingsClick: x
+        onSettingsClick: g
       })
     ]
   });
 }
 A.displayName = "CommandMenu.Body";
-function B({ open: e, onOpenChange: t, placeholder: r = L, emptyText: a = "No results found.", emptyState: o, options: i = [], groups: d = [], onSelect: u, showShortcut: p = !1, shortcutText: h, showFooter: f = !1, footerHints: C, showSettingsButton: b = !1, onSettingsClick: x, className: g, maxHeight: N = k, filter: y, children: w }) {
-  const c = H(), m = h ?? c;
+function B({ open: e, onOpenChange: t, placeholder: r = L, emptyText: a = "No results found.", emptyState: o, options: i = [], groups: m = [], onSelect: u, showShortcut: p = !1, shortcutText: h, showFooter: f = !1, footerHints: C, showSettingsButton: b = !1, onSettingsClick: g, className: N, maxHeight: x = k, filter: y, children: w }) {
+  const l = H(), d = h ?? l;
   return /* @__PURE__ */ n(se, {
     open: e,
     onOpenChange: t,
-    className: l("max-w-[508px] sm:max-w-[508px]", g),
+    className: c("max-w-[508px] sm:max-w-[508px]", N),
     children: /* @__PURE__ */ n(A, {
       placeholder: r,
       emptyText: a,
       emptyState: o,
       options: i,
-      groups: d,
+      groups: m,
       onSelect: u,
       onClose: () => t?.(!1),
       showShortcut: p,
-      shortcutText: m,
+      shortcutText: d,
       showFooter: f,
       footerHints: C,
       showSettingsButton: b,
-      onSettingsClick: x,
-      maxHeight: N,
+      onSettingsClick: g,
+      maxHeight: x,
       filter: y,
       children: w
     })
   });
 }
 B.displayName = "CommandMenu";
-function he({ placeholder: e = L, emptyText: t = "No results found.", emptyState: r, options: a = [], groups: o = [], onSelect: i, showShortcut: d = !1, shortcutText: u, showFooter: p = !1, footerHints: h, showSettingsButton: f = !1, onSettingsClick: C, className: b, maxHeight: x = k, filter: g, children: N }) {
+function he({ placeholder: e = L, emptyText: t = "No results found.", emptyState: r, options: a = [], groups: o = [], onSelect: i, showShortcut: m = !1, shortcutText: u, showFooter: p = !1, footerHints: h, showSettingsButton: f = !1, onSettingsClick: C, className: b, maxHeight: g = k, filter: N, children: x }) {
   const y = H(), w = u ?? y;
   return /* @__PURE__ */ n("div", {
     "data-slot": "command-menu-panel",
-    className: l(me, b),
+    className: c(de, b),
     children: /* @__PURE__ */ n(A, {
       placeholder: e,
       emptyText: t,
@@ -278,15 +278,15 @@ function he({ placeholder: e = L, emptyText: t = "No results found.", emptyState
       options: a,
       groups: o,
       onSelect: i,
-      showShortcut: d,
+      showShortcut: m,
       shortcutText: w,
       showFooter: p,
       footerHints: h,
       showSettingsButton: f,
       onSettingsClick: C,
-      maxHeight: x,
-      filter: g,
-      children: N
+      maxHeight: g,
+      filter: N,
+      children: x
     })
   });
 }
@@ -341,7 +341,7 @@ var _ = {
   className: "string",
   maxHeight: "number",
   filter: "json"
-}, q = class extends HTMLElement {
+}, G = class extends HTMLElement {
   _root = null;
   _childrenContainer = null;
   _props = {};
@@ -370,7 +370,7 @@ var _ = {
   }
   _setProp(e, t) {
     const r = _[e] || "string";
-    this._props[e] = V(t, r), this._render();
+    this._props[e] = R(t, r), this._render();
   }
   _getProp(e) {
     if (e in this._props) return this._props[e];
@@ -397,7 +397,7 @@ var _ = {
     this._root.render(t);
   }
 };
-for (const e of Object.keys(_)) Object.defineProperty(q.prototype, e, {
+for (const e of Object.keys(_)) Object.defineProperty(G.prototype, e, {
   get() {
     return this._getProp(e);
   },
@@ -407,10 +407,10 @@ for (const e of Object.keys(_)) Object.defineProperty(q.prototype, e, {
   enumerable: !0,
   configurable: !0
 });
-typeof customElements < "u" && !customElements.get("hf-command-menu") && customElements.define("hf-command-menu", q);
+typeof customElements < "u" && !customElements.get("hf-command-menu") && customElements.define("hf-command-menu", G);
 export {
-  q as CommandMenuWC,
-  q as default
+  G as CommandMenuWC,
+  G as default
 };
 
 //# sourceMappingURL=hf-command-menu.js.map

package/dist/wc-react/hf-command-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"hf-command-menu.js","names":[],"sources":["../../../../../../../../../../../Users/akarim/Documents/test/humain_foundation_ui/node_modules/.bun/lucide-react@1.27.0+0f58469d5b3bd39f/node_modules/lucide-react/dist/esm/icons/corner-down-left.mjs","../../src/components/organisms/menus/CommandMenu/CommandMenu.tsx","../../src/wc/hf-command-menu.ts"],"sourcesContent":["/**\n * @license lucide-react v1.27.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.mjs';\n\nconst __iconNode = [\n  [\"path\", { d: \"M20 4v7a4 4 0 0 1-4 4H4\", key: \"6o5b7l\" }],\n  [\"path\", { d: \"m9 10-5 5 5 5\", key: \"1kshq7\" }]\n];\nconst CornerDownLeft = createLucideIcon(\"corner-down-left\", __iconNode);\n\nexport { __iconNode, CornerDownLeft as default };\n//# sourceMappingURL=corner-down-left.mjs.map\n","'use client';\n\nimport {\n  ArrowDown,\n  ArrowUp,\n  CornerDownLeft,\n  Search,\n  Settings,\n} from 'lucide-react';\nimport * as React from 'react';\nimport { Button, ClearButton } from '@/components/atoms/buttons/Button';\nimport { Avatar } from '@/components/molecules/data/Avatar';\nimport { Kbd } from '@/components/molecules/data/Kbd';\nimport {\n  Command,\n  CommandDialog,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n  CommandSeparator,\n} from '@/components/ui/command';\nimport { cn } from '@/lib/utils';\n\nconst DEFAULT_COMMAND_MENU_MAX_HEIGHT = 336;\nconst DEFAULT_COMMAND_MENU_PLACEHOLDER = 'Type a command or search...';\nconst COMMAND_MENU_SHELL_CLASS_NAME =\n  'w-full max-w-[508px] overflow-hidden rounded-xl border border-input bg-background shadow-lg';\n\nfunction getCommandMenuMaxHeight(maxHeight: number): number {\n  return Number.isFinite(maxHeight) && maxHeight >= 0\n    ? maxHeight\n    : DEFAULT_COMMAND_MENU_MAX_HEIGHT;\n}\n\n// ============================================\n// Types\n// ============================================\n\nexport interface CommandMenuOption {\n  /** Unique identifier for the option */\n  id: string;\n  /** Display label for the option */\n  label: string;\n  /** Optional subtitle (e.g., @username, email) */\n  subtitle?: string;\n  /** Optional icon to display (mutually exclusive with avatar) */\n  icon?: React.ReactNode;\n  /** Optional avatar configuration */\n  avatar?: {\n    src?: string;\n    fallback?: string;\n  };\n  /** Whether the option is disabled */\n  disabled?: boolean;\n  /** Keyboard shortcut to display */\n  shortcut?: string;\n}\n\nexport interface CommandMenuGroup {\n  /** Unique identifier for the group */\n  id: string;\n  /** Group label/heading */\n  label: string;\n  /** Options in this group */\n  options: CommandMenuOption[];\n}\n\nexport interface CommandMenuFooterHint {\n  /** Icon or keyboard key indicator */\n  keys: React.ReactNode;\n  /** Text describing the action */\n  label: string;\n}\n\nexport interface CommandMenuProps {\n  /** Whether the command menu is open */\n  open?: boolean;\n  /** Callback when open state changes */\n  onOpenChange?: (open: boolean) => void;\n  /** Placeholder text for the search input */\n  placeholder?: string;\n  /** Text to show when no results found */\n  emptyText?: string;\n  /** Empty state content (replaces emptyText when provided) */\n  emptyState?: React.ReactNode;\n  /** Flat list of options */\n  options?: CommandMenuOption[];\n  /** Grouped options */\n  groups?: CommandMenuGroup[];\n  /** Callback when an option is selected */\n  onSelect?: (id: string, option: CommandMenuOption) => void;\n  /** Whether to show keyboard shortcut badge in input */\n  showShortcut?: boolean;\n  /** Keyboard shortcut text to display (auto-detects platform when omitted) */\n  shortcutText?: string;\n  /** Whether to show the footer with navigation hints */\n  showFooter?: boolean;\n  /** Custom footer hints */\n  footerHints?: CommandMenuFooterHint[];\n  /** Whether to show settings button in footer */\n  showSettingsButton?: boolean;\n  /** Callback when settings button is clicked */\n  onSettingsClick?: () => void;\n  /** Additional class name for the dialog */\n  className?: string;\n  /** Maximum height of the list */\n  maxHeight?: number;\n  /** Custom filter function */\n  filter?: (value: string, search: string) => number;\n  /** Children for custom content */\n  children?: React.ReactNode;\n}\n\n// ============================================\n// Platform detection\n// ============================================\n\nfunction usePlatformShortcut() {\n  const [shortcut, setShortcut] = React.useState('\\u2318/');\n  React.useEffect(() => {\n    if (!/Mac|iPhone|iPad/i.test(navigator.userAgent)) {\n      setShortcut('Ctrl /');\n    }\n  }, []);\n  return shortcut;\n}\n\n// ============================================\n// Keyboard Shortcut Badge (uses Kbd wrapper)\n// ============================================\n\nfunction CommandShortcutBadge({\n  children,\n  className,\n}: {\n  children: React.ReactNode;\n  className?: string;\n}) {\n  return (\n    <Kbd variant=\"solid\" size=\"sm\" className={cn('shadow-xs', className)}>\n      {children}\n    </Kbd>\n  );\n}\nCommandShortcutBadge.displayName = 'CommandMenu.ShortcutBadge';\n\n// ============================================\n// Footer Navigation Icon (uses Kbd wrapper)\n// ============================================\n\nfunction FooterNavIcon({\n  children,\n  className,\n}: {\n  children: React.ReactNode;\n  className?: string;\n}) {\n  return (\n    <Kbd variant=\"footer\" size=\"sm\" className={cn('p-1.5', className)}>\n      {children}\n    </Kbd>\n  );\n}\nFooterNavIcon.displayName = 'CommandMenu.FooterNavIcon';\n\nfunction FooterNavText({\n  children,\n  className,\n}: {\n  children: React.ReactNode;\n  className?: string;\n}) {\n  return (\n    <span\n      className={cn('text-sm font-semibold text-text-quaternary', className)}\n    >\n      {children}\n    </span>\n  );\n}\nFooterNavText.displayName = 'CommandMenu.FooterNavText';\n\n// ============================================\n// Default Footer Hints\n// ============================================\n\nconst defaultFooterHints: CommandMenuFooterHint[] = [\n  {\n    keys: (\n      <div className=\"flex items-center gap-1\">\n        <FooterNavIcon>\n          <ArrowUp className=\"size-2.5 text-text-quaternary\" />\n        </FooterNavIcon>\n        <FooterNavIcon>\n          <ArrowDown className=\"size-2.5 text-text-quaternary\" />\n        </FooterNavIcon>\n      </div>\n    ),\n    label: 'to navigate',\n  },\n  {\n    keys: (\n      <FooterNavIcon>\n        <CornerDownLeft className=\"size-2.5 text-text-quaternary\" />\n      </FooterNavIcon>\n    ),\n    label: 'to select',\n  },\n  {\n    keys: (\n      <FooterNavIcon className=\"px-1.5 py-1\">\n        <span className=\"text-xs font-semibold text-text-quaternary\">esc</span>\n      </FooterNavIcon>\n    ),\n    label: 'to close',\n  },\n];\n\n// ============================================\n// Command Menu Footer\n// ============================================\n\nexport interface CommandMenuFooterProps {\n  hints?: CommandMenuFooterHint[];\n  showSettingsButton?: boolean;\n  onSettingsClick?: () => void;\n  className?: string;\n}\n\nfunction CommandMenuFooter({\n  hints = defaultFooterHints,\n  showSettingsButton = false,\n  onSettingsClick,\n  className,\n}: CommandMenuFooterProps) {\n  return (\n    <div\n      data-slot=\"command-menu-footer\"\n      className={cn(\n        'flex items-center gap-3 border-t border-border bg-card/80 py-2 pe-2 ps-[18px] supports-backdrop-filter:backdrop-blur',\n        className,\n      )}\n    >\n      <div className=\"hidden flex-1 items-start gap-4 [@media(hover:hover)]:flex\">\n        {hints.map((hint) => (\n          <div key={hint.label} className=\"flex items-center gap-2\">\n            {hint.keys}\n            <FooterNavText>{hint.label}</FooterNavText>\n          </div>\n        ))}\n      </div>\n      {showSettingsButton && (\n        <Button\n          appearance=\"ghost\"\n          variant=\"secondary\"\n          size=\"icon\"\n          className=\"group ms-auto rounded-full bg-muted\"\n          onClick={onSettingsClick}\n          aria-label=\"Settings\"\n        >\n          <Settings className=\"size-5 text-muted-foreground transition-transform duration-300 ease-out group-hover:rotate-90 motion-reduce:transition-none\" />\n        </Button>\n      )}\n    </div>\n  );\n}\nCommandMenuFooter.displayName = 'CommandMenu.Footer';\n\n// ============================================\n// Command Menu Item\n// ============================================\n\nexport interface CommandMenuItemProps\n  extends Omit<\n    React.ComponentProps<typeof CommandItem>,\n    'onSelect' | 'showCheckIndicator' | 'value'\n  > {\n  option: CommandMenuOption;\n  onSelect?: (id: string, option: CommandMenuOption) => void;\n}\n\nfunction CommandMenuItem({\n  option,\n  onSelect,\n  className,\n  ...props\n}: CommandMenuItemProps) {\n  return (\n    <CommandItem\n      value={option.id}\n      disabled={option.disabled}\n      showCheckIndicator={false}\n      onSelect={() => onSelect?.(option.id, option)}\n      className={cn(\n        'flex cursor-pointer items-center gap-2 transition-colors duration-150 motion-reduce:transition-none',\n        className,\n      )}\n      {...props}\n    >\n      {option.avatar && (\n        <Avatar\n          src={option.avatar.src}\n          fallback={option.avatar.fallback || option.label.charAt(0)}\n          size=\"sm\"\n          className=\"size-6 shrink-0\"\n        />\n      )}\n      {option.icon && !option.avatar && (\n        <span className=\"flex size-4 shrink-0 items-center justify-center text-muted-foreground [&_svg]:size-4\">\n          {option.icon}\n        </span>\n      )}\n      <div className=\"flex min-w-0 flex-1 items-center gap-2 text-sm leading-5\">\n        <span className=\"min-w-0 truncate font-normal text-foreground\">\n          {option.label}\n        </span>\n        {option.subtitle && (\n          <span className=\"min-w-0 truncate font-normal text-muted-foreground\">\n            {option.subtitle}\n          </span>\n        )}\n      </div>\n      {option.shortcut && (\n        <CommandShortcutBadge className=\"transition-colors duration-150 group-data-[selected=true]/command-item:bg-primary/10 group-data-[selected=true]/command-item:text-primary\">\n          {option.shortcut}\n        </CommandShortcutBadge>\n      )}\n    </CommandItem>\n  );\n}\nCommandMenuItem.displayName = 'CommandMenu.Item';\n\n// ============================================\n// Command Menu Group Header\n// ============================================\n\nfunction CommandMenuGroupHeader({\n  children,\n  className,\n  ...props\n}: React.ComponentProps<'h3'>) {\n  return (\n    <h3\n      data-slot=\"command-menu-group-header\"\n      className={cn(\n        'px-2 py-1.5 text-xs font-medium text-muted-foreground',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </h3>\n  );\n}\nCommandMenuGroupHeader.displayName = 'CommandMenu.GroupHeader';\n\n// ============================================\n// Shared Command Menu Body (internal)\n// ============================================\n\ninterface CommandMenuBodyProps {\n  children?: React.ReactNode;\n  groups: CommandMenuGroup[];\n  options: CommandMenuOption[];\n  onSelect?: (id: string, option: CommandMenuOption) => void;\n  onClose?: () => void;\n  placeholder: string;\n  emptyText: string;\n  emptyState?: React.ReactNode;\n  showShortcut: boolean;\n  shortcutText: string;\n  showFooter: boolean;\n  footerHints?: CommandMenuFooterHint[];\n  showSettingsButton: boolean;\n  onSettingsClick?: () => void;\n  maxHeight: number;\n  filter?: (value: string, search: string) => number;\n}\n\ninterface CommandMenuBodyContentProps {\n  children?: React.ReactNode;\n  groups: CommandMenuGroup[];\n  options: CommandMenuOption[];\n  optionRenderer: (option: CommandMenuOption) => React.ReactNode;\n}\n\ninterface CommandMenuGroupSectionProps {\n  group: CommandMenuGroup;\n  optionRenderer: (option: CommandMenuOption) => React.ReactNode;\n}\n\nfunction CommandMenuGroupSection({\n  group,\n  optionRenderer,\n}: CommandMenuGroupSectionProps) {\n  const headingId = React.useId();\n\n  return (\n    <CommandGroup aria-labelledby={headingId} className=\"px-2 py-1\">\n      <CommandMenuGroupHeader id={headingId}>\n        {group.label}\n      </CommandMenuGroupHeader>\n      <div className=\"flex flex-col\">{group.options.map(optionRenderer)}</div>\n    </CommandGroup>\n  );\n}\nCommandMenuGroupSection.displayName = 'CommandMenu.GroupSection';\n\nfunction CommandMenuBodyContent({\n  children,\n  groups,\n  options,\n  optionRenderer,\n}: CommandMenuBodyContentProps) {\n  if (children) return children;\n\n  if (groups.length > 0) {\n    return groups.map((group, index) => (\n      <React.Fragment key={group.id}>\n        {index > 0 && <CommandSeparator className=\"mx-0\" />}\n        <CommandMenuGroupSection\n          group={group}\n          optionRenderer={optionRenderer}\n        />\n      </React.Fragment>\n    ));\n  }\n\n  return <div className=\"flex flex-col p-2\">{options.map(optionRenderer)}</div>;\n}\n\nfunction CommandMenuBody({\n  children,\n  groups,\n  options,\n  onSelect,\n  onClose,\n  placeholder,\n  emptyText,\n  emptyState,\n  showShortcut,\n  shortcutText,\n  showFooter,\n  footerHints,\n  showSettingsButton,\n  onSettingsClick,\n  maxHeight,\n  filter,\n}: CommandMenuBodyProps) {\n  const safeMaxHeight = getCommandMenuMaxHeight(maxHeight);\n  const renderOption = (option: CommandMenuOption) => (\n    <CommandMenuItem key={option.id} option={option} onSelect={onSelect} />\n  );\n\n  return (\n    <Command\n      filter={filter}\n      className=\"rounded-none border-0 shadow-none\"\n      data-slot=\"command-menu\"\n    >\n      <search\n        aria-label=\"Command menu search\"\n        className=\"block border-b border-input bg-background\"\n      >\n        <CommandInput\n          render={({ clearSearch, value, ...inputProps }) => {\n            const canClose = typeof onClose === 'function';\n            const clearOrClose = () => {\n              if (value) {\n                clearSearch();\n                return;\n              }\n              onClose?.();\n            };\n\n            return (\n              <div\n                data-slot=\"command-menu-input\"\n                cmdk-input-wrapper=\"\"\n                className=\"flex h-11 items-center gap-2 px-3\"\n              >\n                <Search\n                  className=\"size-4 shrink-0 text-muted-foreground opacity-50\"\n                  aria-hidden=\"true\"\n                />\n                <input\n                  {...inputProps}\n                  value={value}\n                  placeholder={placeholder}\n                  aria-label={placeholder}\n                  className=\"min-w-0 flex-1 bg-transparent text-sm leading-5 text-foreground outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50\"\n                />\n                {showShortcut && (\n                  <CommandShortcutBadge>{shortcutText}</CommandShortcutBadge>\n                )}\n                <ClearButton\n                  size=\"icon-xs\"\n                  className=\"-me-1 rounded-sm p-0 opacity-50 hover:opacity-80 focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:size-4\"\n                  disabled={!value && !canClose}\n                  aria-label={\n                    value\n                      ? 'Clear search'\n                      : canClose\n                        ? 'Close command menu'\n                        : 'Clear search'\n                  }\n                  onClick={clearOrClose}\n                />\n              </div>\n            );\n          }}\n        />\n      </search>\n\n      <CommandList\n        style={{ maxHeight: safeMaxHeight }}\n        className=\"overflow-y-auto p-0\"\n      >\n        <CommandEmpty className=\"py-6 text-center text-sm text-muted-foreground animate-in fade-in-0 duration-200 motion-reduce:animate-none\">\n          {emptyState || emptyText}\n        </CommandEmpty>\n        <CommandMenuBodyContent\n          groups={groups}\n          options={options}\n          optionRenderer={renderOption}\n        >\n          {children}\n        </CommandMenuBodyContent>\n      </CommandList>\n\n      {showFooter && (\n        <CommandMenuFooter\n          hints={footerHints}\n          showSettingsButton={showSettingsButton}\n          onSettingsClick={onSettingsClick}\n        />\n      )}\n    </Command>\n  );\n}\nCommandMenuBody.displayName = 'CommandMenu.Body';\n\n// ============================================\n// Main Command Menu Component\n// ============================================\n\nfunction CommandMenu({\n  open,\n  onOpenChange,\n  placeholder = DEFAULT_COMMAND_MENU_PLACEHOLDER,\n  emptyText = 'No results found.',\n  emptyState,\n  options = [],\n  groups = [],\n  onSelect,\n  showShortcut = false,\n  shortcutText,\n  showFooter = false,\n  footerHints,\n  showSettingsButton = false,\n  onSettingsClick,\n  className,\n  maxHeight = DEFAULT_COMMAND_MENU_MAX_HEIGHT,\n  filter,\n  children,\n}: CommandMenuProps) {\n  const platformShortcut = usePlatformShortcut();\n  const resolvedShortcut = shortcutText ?? platformShortcut;\n\n  return (\n    <CommandDialog\n      open={open}\n      onOpenChange={onOpenChange}\n      className={cn('max-w-[508px] sm:max-w-[508px]', className)}\n    >\n      <CommandMenuBody\n        placeholder={placeholder}\n        emptyText={emptyText}\n        emptyState={emptyState}\n        options={options}\n        groups={groups}\n        onSelect={onSelect}\n        onClose={() => onOpenChange?.(false)}\n        showShortcut={showShortcut}\n        shortcutText={resolvedShortcut}\n        showFooter={showFooter}\n        footerHints={footerHints}\n        showSettingsButton={showSettingsButton}\n        onSettingsClick={onSettingsClick}\n        maxHeight={maxHeight}\n        filter={filter}\n      >\n        {children}\n      </CommandMenuBody>\n    </CommandDialog>\n  );\n}\nCommandMenu.displayName = 'CommandMenu';\n\n// ============================================\n// Standalone Command Menu (non-dialog version)\n// ============================================\n\nexport interface CommandMenuPanelProps\n  extends Omit<CommandMenuProps, 'open' | 'onOpenChange'> {\n  /** Additional class name */\n  className?: string;\n}\n\nfunction CommandMenuPanel({\n  placeholder = DEFAULT_COMMAND_MENU_PLACEHOLDER,\n  emptyText = 'No results found.',\n  emptyState,\n  options = [],\n  groups = [],\n  onSelect,\n  showShortcut = false,\n  shortcutText,\n  showFooter = false,\n  footerHints,\n  showSettingsButton = false,\n  onSettingsClick,\n  className,\n  maxHeight = DEFAULT_COMMAND_MENU_MAX_HEIGHT,\n  filter,\n  children,\n}: CommandMenuPanelProps) {\n  const platformShortcut = usePlatformShortcut();\n  const resolvedShortcut = shortcutText ?? platformShortcut;\n\n  return (\n    <div\n      data-slot=\"command-menu-panel\"\n      className={cn(COMMAND_MENU_SHELL_CLASS_NAME, className)}\n    >\n      <CommandMenuBody\n        placeholder={placeholder}\n        emptyText={emptyText}\n        emptyState={emptyState}\n        options={options}\n        groups={groups}\n        onSelect={onSelect}\n        showShortcut={showShortcut}\n        shortcutText={resolvedShortcut}\n        showFooter={showFooter}\n        footerHints={footerHints}\n        showSettingsButton={showSettingsButton}\n        onSettingsClick={onSettingsClick}\n        maxHeight={maxHeight}\n        filter={filter}\n      >\n        {children}\n      </CommandMenuBody>\n    </div>\n  );\n}\nCommandMenuPanel.displayName = 'CommandMenu.Panel';\n\n// ============================================\n// Exports\n// ============================================\n\nexport {\n  CommandMenu,\n  CommandMenuFooter,\n  CommandMenuGroupHeader,\n  CommandMenuItem,\n  CommandMenuPanel,\n  CommandShortcutBadge,\n  defaultFooterHints,\n  FooterNavIcon,\n  FooterNavText,\n};\n","/**\n * Web Component wrapper for CommandMenu\n * Custom element: <hf-command-menu>\n *\n * @generated by scripts/generate-wc-components.ts\n * DO NOT EDIT MANUALLY\n */\n\nimport React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport { CommandMenu } from '../components/organisms/menus/CommandMenu';\nimport { parseAttr, parseValue, type PropDefs } from './_shared';\n\n/**\n * Event wrapper that dispatches custom DOM events\n */\nfunction createEventDispatcher(element: HTMLElement) {\n  return {\n    onOpenChange: (open: boolean) => {\n      const CustomEventConstructor =\n        element.ownerDocument.defaultView?.CustomEvent ?? CustomEvent;\n      element.dispatchEvent(new CustomEventConstructor('open-change', {\n        detail: open,\n        bubbles: true,\n        composed: true\n      }));\n    },\n    onSelect: (value: unknown) => {\n      const CustomEventConstructor =\n        element.ownerDocument.defaultView?.CustomEvent ?? CustomEvent;\n      element.dispatchEvent(new CustomEventConstructor('select', {\n        detail: value,\n        bubbles: true,\n        composed: true\n      }));\n    },\n    onSettingsClick: (value: unknown) => {\n      const CustomEventConstructor =\n        element.ownerDocument.defaultView?.CustomEvent ?? CustomEvent;\n      element.dispatchEvent(new CustomEventConstructor('settings-click', {\n        detail: value,\n        bubbles: true,\n        composed: true\n      }));\n    }\n  };\n}\n\n/**\n * Wrapper component that connects React events to DOM custom events\n */\nfunction CommandMenuWrapper(props: React.ComponentProps<typeof CommandMenu> & { _hostElement?: HTMLElement }) {\n  const { _hostElement, ...restProps } = props;\n\n  const eventHandlers = React.useMemo(() => {\n    if (!_hostElement) return {};\n    return createEventDispatcher(_hostElement);\n  }, [_hostElement]);\n\n  return React.createElement(CommandMenu, { ...restProps, ...eventHandlers });\n}\n\n/**\n * Prop type definitions for attribute parsing\n */\nconst propTypes: PropDefs = {\n    open: 'boolean',\n    placeholder: 'string',\n    emptyText: 'string',\n    emptyState: 'json',\n    options: 'json',\n    groups: 'json',\n    showShortcut: 'boolean',\n    shortcutText: 'string',\n    showFooter: 'boolean',\n    footerHints: 'json',\n    showSettingsButton: 'boolean',\n    className: 'string',\n    maxHeight: 'number',\n    filter: 'json'\n};\n\nclass CommandMenuWC extends HTMLElement {\n  private _root: ReturnType<typeof createRoot> | null = null;\n  private _childrenContainer: HTMLDivElement | null = null;\n  private _props: Record<string, unknown> = {};\n  private _initialized = false;\n\n  connectedCallback() {\n    setTimeout(() => this._initialize(), 0);\n  }\n\n  private _initialize() {\n    if (this._initialized) return;\n    this._initialized = true;\n\n    const originalChildren: Node[] = [];\n    for (const child of Array.from(this.childNodes)) {\n      if (child.nodeType === Node.TEXT_NODE && !child.textContent?.trim()) {\n        continue;\n      }\n      originalChildren.push(child);\n    }\n\n    const reactContainer = this.ownerDocument.createElement('div');\n    reactContainer.style.display = 'contents';\n\n    this._childrenContainer = this.ownerDocument.createElement('div');\n    this._childrenContainer.style.display = 'contents';\n\n    originalChildren.forEach((child) => this._childrenContainer!.appendChild(child));\n\n    while (this.firstChild) this.removeChild(this.firstChild);\n    this.appendChild(reactContainer);\n\n    this._root = createRoot(reactContainer);\n    this._render();\n  }\n\n  disconnectedCallback() {\n    this._root?.unmount();\n    this._root = null;\n  }\n\n  attributeChangedCallback(_name: string, _oldValue: string | null, _newValue: string | null) {\n    this._render();\n  }\n\n  static get observedAttributes() {\n    return Object.keys(propTypes).map((prop) =>\n      prop.replace(/([A-Z])/g, '-$1').toLowerCase(),\n    );\n  }\n\n  _setProp(name: string, value: unknown) {\n    const propType = propTypes[name] || 'string';\n    this._props[name] = parseValue(value, propType);\n    this._render();\n  }\n\n  _getProp(name: string): unknown {\n    if (name in this._props) {\n      return this._props[name];\n    }\n    const attrName = name.replace(/([A-Z])/g, '-$1').toLowerCase();\n    const propType = propTypes[name] || 'string';\n    return parseAttr(this.getAttribute(attrName), propType);\n  }\n\n  private _render() {\n    if (!this._root || !this._childrenContainer) return;\n\n    const props: Record<string, unknown> = {};\n    for (const [propName, propType] of Object.entries(propTypes)) {\n      if (propName in this._props) {\n        props[propName] = this._props[propName];\n      } else {\n        const attrName = propName.replace(/([A-Z])/g, '-$1').toLowerCase();\n        props[propName] = parseAttr(this.getAttribute(attrName), propType);\n      }\n    }\n\n    const element = React.createElement(\n      CommandMenuWrapper,\n      { ...props, _hostElement: this },\n      React.createElement('span', {\n        ref: (el: HTMLSpanElement | null) => {\n          if (el && this._childrenContainer) {\n            el.replaceWith(this._childrenContainer);\n          }\n        },\n        style: { display: 'contents' },\n      }),\n    );\n\n    this._root.render(element);\n  }\n}\n\nfor (const propName of Object.keys(propTypes)) {\n  Object.defineProperty(CommandMenuWC.prototype, propName, {\n    get() {\n      return this._getProp(propName);\n    },\n    set(value: unknown) {\n      this._setProp(propName, value);\n    },\n    enumerable: true,\n    configurable: true,\n  });\n}\n\nif (typeof customElements !== 'undefined' && !customElements.get('hf-command-menu')) {\n  customElements.define('hf-command-menu', CommandMenuWC);\n}\n\nexport { CommandMenuWC };\nexport default CommandMenuWC;\n"],"x_google_ignoreList":[0],"mappings":"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"}
+{"version":3,"file":"hf-command-menu.js","names":[],"sources":["../../../../../../../../../../../Users/akarim/Documents/test/humain_foundation_ui/node_modules/.bun/lucide-react@1.27.0+0f58469d5b3bd39f/node_modules/lucide-react/dist/esm/icons/corner-down-left.mjs","../../src/components/organisms/menus/CommandMenu/CommandMenu.tsx","../../src/wc/hf-command-menu.ts"],"sourcesContent":["/**\n * @license lucide-react v1.27.0 - ISC\n *\n * This source code is licensed under the ISC license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createLucideIcon from '../createLucideIcon.mjs';\n\nconst __iconNode = [\n  [\"path\", { d: \"M20 4v7a4 4 0 0 1-4 4H4\", key: \"6o5b7l\" }],\n  [\"path\", { d: \"m9 10-5 5 5 5\", key: \"1kshq7\" }]\n];\nconst CornerDownLeft = createLucideIcon(\"corner-down-left\", __iconNode);\n\nexport { __iconNode, CornerDownLeft as default };\n//# sourceMappingURL=corner-down-left.mjs.map\n","'use client';\n\nimport {\n  ArrowDown,\n  ArrowUp,\n  CornerDownLeft,\n  Search,\n  Settings,\n} from 'lucide-react';\nimport * as React from 'react';\nimport { Button, ClearButton } from '@/components/atoms/buttons/Button';\nimport { Avatar } from '@/components/molecules/data/Avatar';\nimport { Kbd } from '@/components/molecules/data/Kbd';\nimport {\n  Command,\n  CommandDialog,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n  CommandSeparator,\n} from '@/components/ui/command';\nimport { cn } from '@/lib/utils';\n\nconst DEFAULT_COMMAND_MENU_MAX_HEIGHT = 336;\nconst DEFAULT_COMMAND_MENU_PLACEHOLDER = 'Type a command or search...';\nconst COMMAND_MENU_SHELL_CLASS_NAME =\n  'w-full max-w-[508px] overflow-hidden rounded-xl border border-input bg-background shadow-lg';\n\nfunction getCommandMenuMaxHeight(maxHeight: number): number {\n  return Number.isFinite(maxHeight) && maxHeight >= 0\n    ? maxHeight\n    : DEFAULT_COMMAND_MENU_MAX_HEIGHT;\n}\n\n// ============================================\n// Types\n// ============================================\n\nexport interface CommandMenuOption {\n  /** Unique identifier for the option */\n  id: string;\n  /** Display label for the option */\n  label: string;\n  /** Optional subtitle (e.g., @username, email) */\n  subtitle?: string;\n  /** Optional icon to display (mutually exclusive with avatar) */\n  icon?: React.ReactNode;\n  /** Optional avatar configuration */\n  avatar?: {\n    src?: string;\n    fallback?: string;\n  };\n  /** Whether the option is disabled */\n  disabled?: boolean;\n  /** Keyboard shortcut to display */\n  shortcut?: string;\n}\n\nexport interface CommandMenuGroup {\n  /** Unique identifier for the group */\n  id: string;\n  /** Group label/heading */\n  label: string;\n  /** Options in this group */\n  options: CommandMenuOption[];\n}\n\nexport interface CommandMenuFooterHint {\n  /** Icon or keyboard key indicator */\n  keys: React.ReactNode;\n  /** Text describing the action */\n  label: string;\n}\n\nexport interface CommandMenuProps {\n  /** Whether the command menu is open */\n  open?: boolean;\n  /** Callback when open state changes */\n  onOpenChange?: (open: boolean) => void;\n  /** Placeholder text for the search input */\n  placeholder?: string;\n  /** Text to show when no results found */\n  emptyText?: string;\n  /** Empty state content (replaces emptyText when provided) */\n  emptyState?: React.ReactNode;\n  /** Flat list of options */\n  options?: CommandMenuOption[];\n  /** Grouped options */\n  groups?: CommandMenuGroup[];\n  /** Callback when an option is selected */\n  onSelect?: (id: string, option: CommandMenuOption) => void;\n  /** Whether to show keyboard shortcut badge in input */\n  showShortcut?: boolean;\n  /** Keyboard shortcut text to display (auto-detects platform when omitted) */\n  shortcutText?: string;\n  /** Whether to show the footer with navigation hints */\n  showFooter?: boolean;\n  /** Custom footer hints */\n  footerHints?: CommandMenuFooterHint[];\n  /** Whether to show settings button in footer */\n  showSettingsButton?: boolean;\n  /** Callback when settings button is clicked */\n  onSettingsClick?: () => void;\n  /** Additional class name for the dialog */\n  className?: string;\n  /** Maximum height of the list */\n  maxHeight?: number;\n  /** Custom filter function */\n  filter?: (value: string, search: string) => number;\n  /** Children for custom content */\n  children?: React.ReactNode;\n}\n\n// ============================================\n// Platform detection\n// ============================================\n\nfunction usePlatformShortcut() {\n  const [shortcut, setShortcut] = React.useState('\\u2318/');\n  React.useEffect(() => {\n    if (!/Mac|iPhone|iPad/i.test(navigator.userAgent)) {\n      setShortcut('Ctrl /');\n    }\n  }, []);\n  return shortcut;\n}\n\n// ============================================\n// Keyboard Shortcut Badge (uses Kbd wrapper)\n// ============================================\n\nfunction CommandShortcutBadge({\n  children,\n  className,\n}: {\n  children: React.ReactNode;\n  className?: string;\n}) {\n  return (\n    <Kbd variant=\"solid\" size=\"sm\" className={cn('shadow-xs', className)}>\n      {children}\n    </Kbd>\n  );\n}\nCommandShortcutBadge.displayName = 'CommandMenu.ShortcutBadge';\n\n// ============================================\n// Footer Navigation Icon (uses Kbd wrapper)\n// ============================================\n\nfunction FooterNavIcon({\n  children,\n  className,\n}: {\n  children: React.ReactNode;\n  className?: string;\n}) {\n  return (\n    <Kbd variant=\"footer\" size=\"sm\" className={cn('p-1.5', className)}>\n      {children}\n    </Kbd>\n  );\n}\nFooterNavIcon.displayName = 'CommandMenu.FooterNavIcon';\n\nfunction FooterNavText({\n  children,\n  className,\n}: {\n  children: React.ReactNode;\n  className?: string;\n}) {\n  return (\n    <span\n      className={cn(\n        'text-sm font-semibold text-secondary-foreground',\n        className,\n      )}\n    >\n      {children}\n    </span>\n  );\n}\nFooterNavText.displayName = 'CommandMenu.FooterNavText';\n\n// ============================================\n// Default Footer Hints\n// ============================================\n\nconst defaultFooterHints: CommandMenuFooterHint[] = [\n  {\n    keys: (\n      <div className=\"flex items-center gap-1\">\n        <FooterNavIcon>\n          <ArrowUp className=\"size-2.5 text-secondary-foreground\" />\n        </FooterNavIcon>\n        <FooterNavIcon>\n          <ArrowDown className=\"size-2.5 text-secondary-foreground\" />\n        </FooterNavIcon>\n      </div>\n    ),\n    label: 'to navigate',\n  },\n  {\n    keys: (\n      <FooterNavIcon>\n        <CornerDownLeft className=\"size-2.5 text-secondary-foreground\" />\n      </FooterNavIcon>\n    ),\n    label: 'to select',\n  },\n  {\n    keys: (\n      <FooterNavIcon className=\"px-1.5 py-1\">\n        <span className=\"text-xs font-semibold text-secondary-foreground\">\n          esc\n        </span>\n      </FooterNavIcon>\n    ),\n    label: 'to close',\n  },\n];\n\n// ============================================\n// Command Menu Footer\n// ============================================\n\nexport interface CommandMenuFooterProps {\n  hints?: CommandMenuFooterHint[];\n  showSettingsButton?: boolean;\n  onSettingsClick?: () => void;\n  className?: string;\n}\n\nfunction CommandMenuFooter({\n  hints = defaultFooterHints,\n  showSettingsButton = false,\n  onSettingsClick,\n  className,\n}: CommandMenuFooterProps) {\n  return (\n    <div\n      data-slot=\"command-menu-footer\"\n      className={cn(\n        'flex items-center gap-3 border-t border-border bg-card/80 py-2 pe-2 ps-[18px] supports-backdrop-filter:backdrop-blur',\n        className,\n      )}\n    >\n      <div className=\"hidden flex-1 items-start gap-4 [@media(hover:hover)]:flex\">\n        {hints.map((hint) => (\n          <div key={hint.label} className=\"flex items-center gap-2\">\n            {hint.keys}\n            <FooterNavText>{hint.label}</FooterNavText>\n          </div>\n        ))}\n      </div>\n      {showSettingsButton && (\n        <Button\n          appearance=\"ghost\"\n          variant=\"secondary\"\n          size=\"icon\"\n          className=\"group ms-auto rounded-full bg-muted\"\n          onClick={onSettingsClick}\n          aria-label=\"Settings\"\n        >\n          <Settings className=\"size-5 text-muted-foreground transition-transform duration-300 ease-out group-hover:rotate-90 motion-reduce:transition-none\" />\n        </Button>\n      )}\n    </div>\n  );\n}\nCommandMenuFooter.displayName = 'CommandMenu.Footer';\n\n// ============================================\n// Command Menu Item\n// ============================================\n\nexport interface CommandMenuItemProps\n  extends Omit<\n    React.ComponentProps<typeof CommandItem>,\n    'onSelect' | 'showCheckIndicator' | 'value'\n  > {\n  option: CommandMenuOption;\n  onSelect?: (id: string, option: CommandMenuOption) => void;\n}\n\nfunction CommandMenuItem({\n  option,\n  onSelect,\n  className,\n  ...props\n}: CommandMenuItemProps) {\n  return (\n    <CommandItem\n      value={option.id}\n      disabled={option.disabled}\n      showCheckIndicator={false}\n      onSelect={() => onSelect?.(option.id, option)}\n      className={cn(\n        'flex cursor-pointer items-center gap-2 transition-colors duration-150 motion-reduce:transition-none',\n        className,\n      )}\n      {...props}\n    >\n      {option.avatar && (\n        <Avatar\n          src={option.avatar.src}\n          fallback={option.avatar.fallback || option.label.charAt(0)}\n          size=\"sm\"\n          className=\"size-6 shrink-0\"\n        />\n      )}\n      {option.icon && !option.avatar && (\n        <span className=\"flex size-4 shrink-0 items-center justify-center text-muted-foreground [&_svg]:size-4\">\n          {option.icon}\n        </span>\n      )}\n      <div className=\"flex min-w-0 flex-1 items-center gap-2 text-sm leading-5\">\n        <span className=\"min-w-0 truncate font-normal text-foreground\">\n          {option.label}\n        </span>\n        {option.subtitle && (\n          <span className=\"min-w-0 truncate font-normal text-muted-foreground\">\n            {option.subtitle}\n          </span>\n        )}\n      </div>\n      {option.shortcut && (\n        <CommandShortcutBadge className=\"transition-colors duration-150 group-data-[selected=true]/command-item:bg-primary/10 group-data-[selected=true]/command-item:text-primary\">\n          {option.shortcut}\n        </CommandShortcutBadge>\n      )}\n    </CommandItem>\n  );\n}\nCommandMenuItem.displayName = 'CommandMenu.Item';\n\n// ============================================\n// Command Menu Group Header\n// ============================================\n\nfunction CommandMenuGroupHeader({\n  children,\n  className,\n  ...props\n}: React.ComponentProps<'h3'>) {\n  return (\n    <h3\n      data-slot=\"command-menu-group-header\"\n      className={cn(\n        'px-2 py-1.5 text-xs font-medium text-muted-foreground',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n    </h3>\n  );\n}\nCommandMenuGroupHeader.displayName = 'CommandMenu.GroupHeader';\n\n// ============================================\n// Shared Command Menu Body (internal)\n// ============================================\n\ninterface CommandMenuBodyProps {\n  children?: React.ReactNode;\n  groups: CommandMenuGroup[];\n  options: CommandMenuOption[];\n  onSelect?: (id: string, option: CommandMenuOption) => void;\n  onClose?: () => void;\n  placeholder: string;\n  emptyText: string;\n  emptyState?: React.ReactNode;\n  showShortcut: boolean;\n  shortcutText: string;\n  showFooter: boolean;\n  footerHints?: CommandMenuFooterHint[];\n  showSettingsButton: boolean;\n  onSettingsClick?: () => void;\n  maxHeight: number;\n  filter?: (value: string, search: string) => number;\n}\n\ninterface CommandMenuBodyContentProps {\n  children?: React.ReactNode;\n  groups: CommandMenuGroup[];\n  options: CommandMenuOption[];\n  optionRenderer: (option: CommandMenuOption) => React.ReactNode;\n}\n\ninterface CommandMenuGroupSectionProps {\n  group: CommandMenuGroup;\n  optionRenderer: (option: CommandMenuOption) => React.ReactNode;\n}\n\nfunction CommandMenuGroupSection({\n  group,\n  optionRenderer,\n}: CommandMenuGroupSectionProps) {\n  const headingId = React.useId();\n\n  return (\n    <CommandGroup aria-labelledby={headingId} className=\"px-2 py-1\">\n      <CommandMenuGroupHeader id={headingId}>\n        {group.label}\n      </CommandMenuGroupHeader>\n      <div className=\"flex flex-col\">{group.options.map(optionRenderer)}</div>\n    </CommandGroup>\n  );\n}\nCommandMenuGroupSection.displayName = 'CommandMenu.GroupSection';\n\nfunction CommandMenuBodyContent({\n  children,\n  groups,\n  options,\n  optionRenderer,\n}: CommandMenuBodyContentProps) {\n  if (children) return children;\n\n  if (groups.length > 0) {\n    return groups.map((group, index) => (\n      <React.Fragment key={group.id}>\n        {index > 0 && <CommandSeparator className=\"mx-0\" />}\n        <CommandMenuGroupSection\n          group={group}\n          optionRenderer={optionRenderer}\n        />\n      </React.Fragment>\n    ));\n  }\n\n  return <div className=\"flex flex-col p-2\">{options.map(optionRenderer)}</div>;\n}\n\nfunction CommandMenuBody({\n  children,\n  groups,\n  options,\n  onSelect,\n  onClose,\n  placeholder,\n  emptyText,\n  emptyState,\n  showShortcut,\n  shortcutText,\n  showFooter,\n  footerHints,\n  showSettingsButton,\n  onSettingsClick,\n  maxHeight,\n  filter,\n}: CommandMenuBodyProps) {\n  const safeMaxHeight = getCommandMenuMaxHeight(maxHeight);\n  const renderOption = (option: CommandMenuOption) => (\n    <CommandMenuItem key={option.id} option={option} onSelect={onSelect} />\n  );\n\n  return (\n    <Command\n      filter={filter}\n      className=\"rounded-none border-0 shadow-none\"\n      data-slot=\"command-menu\"\n    >\n      <search\n        aria-label=\"Command menu search\"\n        className=\"block border-b border-input bg-background\"\n      >\n        <CommandInput\n          render={({ clearSearch, value, ...inputProps }) => {\n            const canClose = typeof onClose === 'function';\n            const clearOrClose = () => {\n              if (value) {\n                clearSearch();\n                return;\n              }\n              onClose?.();\n            };\n\n            return (\n              <div\n                data-slot=\"command-menu-input\"\n                cmdk-input-wrapper=\"\"\n                className=\"flex h-11 items-center gap-2 px-3\"\n              >\n                <Search\n                  className=\"size-4 shrink-0 text-muted-foreground opacity-50\"\n                  aria-hidden=\"true\"\n                />\n                <input\n                  {...inputProps}\n                  value={value}\n                  placeholder={placeholder}\n                  aria-label={placeholder}\n                  className=\"min-w-0 flex-1 bg-transparent text-sm leading-5 text-foreground outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50\"\n                />\n                {showShortcut && (\n                  <CommandShortcutBadge>{shortcutText}</CommandShortcutBadge>\n                )}\n                <ClearButton\n                  size=\"icon-xs\"\n                  className=\"-me-1 rounded-sm p-0 opacity-50 hover:opacity-80 focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:size-4\"\n                  disabled={!value && !canClose}\n                  aria-label={\n                    value\n                      ? 'Clear search'\n                      : canClose\n                        ? 'Close command menu'\n                        : 'Clear search'\n                  }\n                  onClick={clearOrClose}\n                />\n              </div>\n            );\n          }}\n        />\n      </search>\n\n      <CommandList\n        style={{ maxHeight: safeMaxHeight }}\n        className=\"overflow-y-auto p-0\"\n      >\n        <CommandEmpty className=\"py-6 text-center text-sm text-muted-foreground animate-in fade-in-0 duration-200 motion-reduce:animate-none\">\n          {emptyState || emptyText}\n        </CommandEmpty>\n        <CommandMenuBodyContent\n          groups={groups}\n          options={options}\n          optionRenderer={renderOption}\n        >\n          {children}\n        </CommandMenuBodyContent>\n      </CommandList>\n\n      {showFooter && (\n        <CommandMenuFooter\n          hints={footerHints}\n          showSettingsButton={showSettingsButton}\n          onSettingsClick={onSettingsClick}\n        />\n      )}\n    </Command>\n  );\n}\nCommandMenuBody.displayName = 'CommandMenu.Body';\n\n// ============================================\n// Main Command Menu Component\n// ============================================\n\nfunction CommandMenu({\n  open,\n  onOpenChange,\n  placeholder = DEFAULT_COMMAND_MENU_PLACEHOLDER,\n  emptyText = 'No results found.',\n  emptyState,\n  options = [],\n  groups = [],\n  onSelect,\n  showShortcut = false,\n  shortcutText,\n  showFooter = false,\n  footerHints,\n  showSettingsButton = false,\n  onSettingsClick,\n  className,\n  maxHeight = DEFAULT_COMMAND_MENU_MAX_HEIGHT,\n  filter,\n  children,\n}: CommandMenuProps) {\n  const platformShortcut = usePlatformShortcut();\n  const resolvedShortcut = shortcutText ?? platformShortcut;\n\n  return (\n    <CommandDialog\n      open={open}\n      onOpenChange={onOpenChange}\n      className={cn('max-w-[508px] sm:max-w-[508px]', className)}\n    >\n      <CommandMenuBody\n        placeholder={placeholder}\n        emptyText={emptyText}\n        emptyState={emptyState}\n        options={options}\n        groups={groups}\n        onSelect={onSelect}\n        onClose={() => onOpenChange?.(false)}\n        showShortcut={showShortcut}\n        shortcutText={resolvedShortcut}\n        showFooter={showFooter}\n        footerHints={footerHints}\n        showSettingsButton={showSettingsButton}\n        onSettingsClick={onSettingsClick}\n        maxHeight={maxHeight}\n        filter={filter}\n      >\n        {children}\n      </CommandMenuBody>\n    </CommandDialog>\n  );\n}\nCommandMenu.displayName = 'CommandMenu';\n\n// ============================================\n// Standalone Command Menu (non-dialog version)\n// ============================================\n\nexport interface CommandMenuPanelProps\n  extends Omit<CommandMenuProps, 'open' | 'onOpenChange'> {\n  /** Additional class name */\n  className?: string;\n}\n\nfunction CommandMenuPanel({\n  placeholder = DEFAULT_COMMAND_MENU_PLACEHOLDER,\n  emptyText = 'No results found.',\n  emptyState,\n  options = [],\n  groups = [],\n  onSelect,\n  showShortcut = false,\n  shortcutText,\n  showFooter = false,\n  footerHints,\n  showSettingsButton = false,\n  onSettingsClick,\n  className,\n  maxHeight = DEFAULT_COMMAND_MENU_MAX_HEIGHT,\n  filter,\n  children,\n}: CommandMenuPanelProps) {\n  const platformShortcut = usePlatformShortcut();\n  const resolvedShortcut = shortcutText ?? platformShortcut;\n\n  return (\n    <div\n      data-slot=\"command-menu-panel\"\n      className={cn(COMMAND_MENU_SHELL_CLASS_NAME, className)}\n    >\n      <CommandMenuBody\n        placeholder={placeholder}\n        emptyText={emptyText}\n        emptyState={emptyState}\n        options={options}\n        groups={groups}\n        onSelect={onSelect}\n        showShortcut={showShortcut}\n        shortcutText={resolvedShortcut}\n        showFooter={showFooter}\n        footerHints={footerHints}\n        showSettingsButton={showSettingsButton}\n        onSettingsClick={onSettingsClick}\n        maxHeight={maxHeight}\n        filter={filter}\n      >\n        {children}\n      </CommandMenuBody>\n    </div>\n  );\n}\nCommandMenuPanel.displayName = 'CommandMenu.Panel';\n\n// ============================================\n// Exports\n// ============================================\n\nexport {\n  CommandMenu,\n  CommandMenuFooter,\n  CommandMenuGroupHeader,\n  CommandMenuItem,\n  CommandMenuPanel,\n  CommandShortcutBadge,\n  defaultFooterHints,\n  FooterNavIcon,\n  FooterNavText,\n};\n","/**\n * Web Component wrapper for CommandMenu\n * Custom element: <hf-command-menu>\n *\n * @generated by scripts/generate-wc-components.ts\n * DO NOT EDIT MANUALLY\n */\n\nimport React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport { CommandMenu } from '../components/organisms/menus/CommandMenu';\nimport { parseAttr, parseValue, type PropDefs } from './_shared';\n\n/**\n * Event wrapper that dispatches custom DOM events\n */\nfunction createEventDispatcher(element: HTMLElement) {\n  return {\n    onOpenChange: (open: boolean) => {\n      const CustomEventConstructor =\n        element.ownerDocument.defaultView?.CustomEvent ?? CustomEvent;\n      element.dispatchEvent(new CustomEventConstructor('open-change', {\n        detail: open,\n        bubbles: true,\n        composed: true\n      }));\n    },\n    onSelect: (value: unknown) => {\n      const CustomEventConstructor =\n        element.ownerDocument.defaultView?.CustomEvent ?? CustomEvent;\n      element.dispatchEvent(new CustomEventConstructor('select', {\n        detail: value,\n        bubbles: true,\n        composed: true\n      }));\n    },\n    onSettingsClick: (value: unknown) => {\n      const CustomEventConstructor =\n        element.ownerDocument.defaultView?.CustomEvent ?? CustomEvent;\n      element.dispatchEvent(new CustomEventConstructor('settings-click', {\n        detail: value,\n        bubbles: true,\n        composed: true\n      }));\n    }\n  };\n}\n\n/**\n * Wrapper component that connects React events to DOM custom events\n */\nfunction CommandMenuWrapper(props: React.ComponentProps<typeof CommandMenu> & { _hostElement?: HTMLElement }) {\n  const { _hostElement, ...restProps } = props;\n\n  const eventHandlers = React.useMemo(() => {\n    if (!_hostElement) return {};\n    return createEventDispatcher(_hostElement);\n  }, [_hostElement]);\n\n  return React.createElement(CommandMenu, { ...restProps, ...eventHandlers });\n}\n\n/**\n * Prop type definitions for attribute parsing\n */\nconst propTypes: PropDefs = {\n    open: 'boolean',\n    placeholder: 'string',\n    emptyText: 'string',\n    emptyState: 'json',\n    options: 'json',\n    groups: 'json',\n    showShortcut: 'boolean',\n    shortcutText: 'string',\n    showFooter: 'boolean',\n    footerHints: 'json',\n    showSettingsButton: 'boolean',\n    className: 'string',\n    maxHeight: 'number',\n    filter: 'json'\n};\n\nclass CommandMenuWC extends HTMLElement {\n  private _root: ReturnType<typeof createRoot> | null = null;\n  private _childrenContainer: HTMLDivElement | null = null;\n  private _props: Record<string, unknown> = {};\n  private _initialized = false;\n\n  connectedCallback() {\n    setTimeout(() => this._initialize(), 0);\n  }\n\n  private _initialize() {\n    if (this._initialized) return;\n    this._initialized = true;\n\n    const originalChildren: Node[] = [];\n    for (const child of Array.from(this.childNodes)) {\n      if (child.nodeType === Node.TEXT_NODE && !child.textContent?.trim()) {\n        continue;\n      }\n      originalChildren.push(child);\n    }\n\n    const reactContainer = this.ownerDocument.createElement('div');\n    reactContainer.style.display = 'contents';\n\n    this._childrenContainer = this.ownerDocument.createElement('div');\n    this._childrenContainer.style.display = 'contents';\n\n    originalChildren.forEach((child) => this._childrenContainer!.appendChild(child));\n\n    while (this.firstChild) this.removeChild(this.firstChild);\n    this.appendChild(reactContainer);\n\n    this._root = createRoot(reactContainer);\n    this._render();\n  }\n\n  disconnectedCallback() {\n    this._root?.unmount();\n    this._root = null;\n  }\n\n  attributeChangedCallback(_name: string, _oldValue: string | null, _newValue: string | null) {\n    this._render();\n  }\n\n  static get observedAttributes() {\n    return Object.keys(propTypes).map((prop) =>\n      prop.replace(/([A-Z])/g, '-$1').toLowerCase(),\n    );\n  }\n\n  _setProp(name: string, value: unknown) {\n    const propType = propTypes[name] || 'string';\n    this._props[name] = parseValue(value, propType);\n    this._render();\n  }\n\n  _getProp(name: string): unknown {\n    if (name in this._props) {\n      return this._props[name];\n    }\n    const attrName = name.replace(/([A-Z])/g, '-$1').toLowerCase();\n    const propType = propTypes[name] || 'string';\n    return parseAttr(this.getAttribute(attrName), propType);\n  }\n\n  private _render() {\n    if (!this._root || !this._childrenContainer) return;\n\n    const props: Record<string, unknown> = {};\n    for (const [propName, propType] of Object.entries(propTypes)) {\n      if (propName in this._props) {\n        props[propName] = this._props[propName];\n      } else {\n        const attrName = propName.replace(/([A-Z])/g, '-$1').toLowerCase();\n        props[propName] = parseAttr(this.getAttribute(attrName), propType);\n      }\n    }\n\n    const element = React.createElement(\n      CommandMenuWrapper,\n      { ...props, _hostElement: this },\n      React.createElement('span', {\n        ref: (el: HTMLSpanElement | null) => {\n          if (el && this._childrenContainer) {\n            el.replaceWith(this._childrenContainer);\n          }\n        },\n        style: { display: 'contents' },\n      }),\n    );\n\n    this._root.render(element);\n  }\n}\n\nfor (const propName of Object.keys(propTypes)) {\n  Object.defineProperty(CommandMenuWC.prototype, propName, {\n    get() {\n      return this._getProp(propName);\n    },\n    set(value: unknown) {\n      this._setProp(propName, value);\n    },\n    enumerable: true,\n    configurable: true,\n  });\n}\n\nif (typeof customElements !== 'undefined' && !customElements.get('hf-command-menu')) {\n  customElements.define('hf-command-menu', CommandMenuWC);\n}\n\nexport { CommandMenuWC };\nexport default CommandMenuWC;\n"],"x_google_ignoreList":[0],"mappings":";;;;;;;;;;;;;;AASA,IAAM,KAAa,CACjB,CAAC,QAAQ;AAAA,EAAE,GAAG;AAAA,EAA2B,KAAK;AAAS,CAAC,GACxD,CAAC,QAAQ;AAAA,EAAE,GAAG;AAAA,EAAiB,KAAK;AAAS,CAAC,CAChD,GACM,KAAiB,EAAiB,oBAAoB,EAAU,GCYhE,IAAkC,KAClC,IAAmC,+BACnC,KACJ;AAEF,SAAS,GAAwB,GAA2B;AAC1D,SAAO,OAAO,SAAS,CAAS,KAAK,KAAa,IAC9C,IACA;AACN;AAqFA,SAAS,IAAsB;AAC7B,QAAM,CAAC,GAAU,CAAA,IAAe,EAAM,SAAS,IAAS;AACxD,SAAA,EAAM,UAAA,MAAgB;AACpB,IAAK,mBAAmB,KAAK,UAAU,SAAS,KAC9C,EAAY,QAAQ;AAAA,EAExB,GAAG,CAAC,CAAC,GACE;AACT;AAMA,SAAS,EAAqB,EAC5B,UAAA,GACA,WAAA,EAAA,GAIC;AACD,SACE,gBAAA,EAAC,GAAD;AAAA,IAAK,SAAQ;AAAA,IAAQ,MAAK;AAAA,IAAK,WAAW,EAAG,aAAa,CAAS;AAAA,IAChE,UAAA;AAAA,EACE,CAAA;AAET;AACA,EAAqB,cAAc;AAMnC,SAAS,EAAc,EACrB,UAAA,GACA,WAAA,EAAA,GAIC;AACD,SACE,gBAAA,EAAC,GAAD;AAAA,IAAK,SAAQ;AAAA,IAAS,MAAK;AAAA,IAAK,WAAW,EAAG,SAAS,CAAS;AAAA,IAC7D,UAAA;AAAA,EACE,CAAA;AAET;AACA,EAAc,cAAc;AAE5B,SAAS,EAAc,EACrB,UAAA,GACA,WAAA,EAAA,GAIC;AACD,SACE,gBAAA,EAAC,QAAD;AAAA,IACE,WAAW,EACT,mDACA,CACF;AAAA,IAEC,UAAA;AAAA,EACG,CAAA;AAEV;AACA,EAAc,cAAc;AAM5B,IAAM,KAA8C;AAAA,EAClD;AAAA,IACE,MACE,gBAAA,EAAC,OAAD;AAAA,MAAK,WAAU;AAAA,gBAAf,CACE,gBAAA,EAAC,GAAD,EAAA,UACE,gBAAA,EAAC,GAAD,EAAS,WAAU,qCAAsC,CAAA,EAC5C,CAAA,GACf,gBAAA,EAAC,GAAD,EAAA,UACE,gBAAA,EAAC,GAAD,EAAW,WAAU,qCAAsC,CAAA,EAC9C,CAAA,CACZ;AAAA;IAEP,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,MACE,gBAAA,EAAC,GAAD,EAAA,UACE,gBAAA,EAAC,IAAD,EAAgB,WAAU,qCAAsC,CAAA,EACnD,CAAA;AAAA,IAEjB,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,MACE,gBAAA,EAAC,GAAD;AAAA,MAAe,WAAU;AAAA,gBACvB,gBAAA,EAAC,QAAD;AAAA,QAAM,WAAU;AAAA,kBAAkD;AAAA,MAE5D,CAAA;AAAA,IACO,CAAA;AAAA,IAEjB,OAAO;AAAA,EACT;AACF;AAaA,SAAS,EAAkB,EACzB,OAAA,IAAQ,IACR,oBAAA,IAAqB,IACrB,iBAAA,GACA,WAAA,EAAA,GACyB;AACzB,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,aAAU;AAAA,IACV,WAAW,EACT,wHACA,CACF;AAAA,cALF,CAOE,gBAAA,EAAC,OAAD;AAAA,MAAK,WAAU;AAAA,gBACZ,EAAM,IAAA,CAAK,MACV,gBAAA,EAAC,OAAD;AAAA,QAAsB,WAAU;AAAA,kBAAhC,CACG,EAAK,MACN,gBAAA,EAAC,GAAD,EAAA,UAAgB,EAAK,MAAqB,CAAA,CACvC;AAAA,SAHK,EAAK,KAGV,CACN;AAAA,IACE,CAAA,GACJ,KACC,gBAAA,EAAC,GAAD;AAAA,MACE,YAAW;AAAA,MACX,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,WAAU;AAAA,MACV,SAAS;AAAA,MACT,cAAW;AAAA,gBAEX,gBAAA,EAAC,GAAD,EAAU,WAAU,8HAA+H,CAAA;AAAA,IAC7I,CAAA,CAEP;AAAA;AAET;AACA,EAAkB,cAAc;AAehC,SAAS,EAAgB,EACvB,QAAA,GACA,UAAA,GACA,WAAA,GACA,GAAG,EAAA,GACoB;AACvB,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,OAAO,EAAO;AAAA,IACd,UAAU,EAAO;AAAA,IACjB,oBAAoB;AAAA,IACpB,UAAA,MAAgB,IAAW,EAAO,IAAI,CAAM;AAAA,IAC5C,WAAW,EACT,uGACA,CACF;AAAA,IACA,GAAI;AAAA,cATN;AAAA,MAWG,EAAO,UACN,gBAAA,EAAC,GAAD;AAAA,QACE,KAAK,EAAO,OAAO;AAAA,QACnB,UAAU,EAAO,OAAO,YAAY,EAAO,MAAM,OAAO,CAAC;AAAA,QACzD,MAAK;AAAA,QACL,WAAU;AAAA,MACX,CAAA;AAAA,MAEF,EAAO,QAAQ,CAAC,EAAO,UACtB,gBAAA,EAAC,QAAD;AAAA,QAAM,WAAU;AAAA,kBACb,EAAO;AAAA,MACJ,CAAA;AAAA,MAER,gBAAA,EAAC,OAAD;AAAA,QAAK,WAAU;AAAA,kBAAf,CACE,gBAAA,EAAC,QAAD;AAAA,UAAM,WAAU;AAAA,oBACb,EAAO;AAAA,QACJ,CAAA,GACL,EAAO,YACN,gBAAA,EAAC,QAAD;AAAA,UAAM,WAAU;AAAA,oBACb,EAAO;AAAA,QACJ,CAAA,CAEL;AAAA;MACJ,EAAO,YACN,gBAAA,EAAC,GAAD;AAAA,QAAsB,WAAU;AAAA,kBAC7B,EAAO;AAAA,MACY,CAAA;AAAA,IAEb;AAAA;AAEjB;AACA,EAAgB,cAAc;AAM9B,SAAS,EAAuB,EAC9B,UAAA,GACA,WAAA,GACA,GAAG,EAAA,GAC0B;AAC7B,SACE,gBAAA,EAAC,MAAD;AAAA,IACE,aAAU;AAAA,IACV,WAAW,EACT,yDACA,CACF;AAAA,IACA,GAAI;AAAA,IAEH,UAAA;AAAA,EACC,CAAA;AAER;AACA,EAAuB,cAAc;AAqCrC,SAAS,EAAwB,EAC/B,OAAA,GACA,gBAAA,EAAA,GAC+B;AAC/B,QAAM,IAAY,EAAM,MAAM;AAE9B,SACE,gBAAA,EAAC,IAAD;AAAA,IAAc,mBAAiB;AAAA,IAAW,WAAU;AAAA,cAApD,CACE,gBAAA,EAAC,GAAD;AAAA,MAAwB,IAAI;AAAA,gBACzB,EAAM;AAAA,IACe,CAAA,GACxB,gBAAA,EAAC,OAAD;AAAA,MAAK,WAAU;AAAA,gBAAiB,EAAM,QAAQ,IAAI,CAAc;AAAA,IAAO,CAAA,CAC3D;AAAA;AAElB;AACA,EAAwB,cAAc;AAEtC,SAAS,GAAuB,EAC9B,UAAA,GACA,QAAA,GACA,SAAA,GACA,gBAAA,EAAA,GAC8B;AAC9B,SAAI,MAEA,EAAO,SAAS,IACX,EAAO,IAAA,CAAK,GAAO,MACxB,gBAAA,EAAC,EAAM,UAAP,EAAA,UAAA,CACG,IAAQ,KAAK,gBAAA,EAAC,IAAD,EAAkB,WAAU,OAAQ,CAAA,GAClD,gBAAA,EAAC,GAAD;AAAA,IACS,OAAA;AAAA,IACS,gBAAA;AAAA,EACjB,CAAA,CACa,EAAA,GANK,EAAM,EAMX,CACjB,IAGI,gBAAA,EAAC,OAAD;AAAA,IAAK,WAAU;AAAA,cAAqB,EAAQ,IAAI,CAAc;AAAA,EAAO,CAAA;AAC9E;AAEA,SAAS,EAAgB,EACvB,UAAA,GACA,QAAA,GACA,SAAA,GACA,UAAA,GACA,SAAA,GACA,aAAA,GACA,WAAA,GACA,YAAA,GACA,cAAA,GACA,cAAA,GACA,YAAA,GACA,aAAA,GACA,oBAAA,GACA,iBAAA,GACA,WAAA,GACA,QAAA,EAAA,GACuB;AACvB,QAAM,IAAgB,GAAwB,CAAS;AAKvD,SACE,gBAAA,EAAC,IAAD;AAAA,IACU,QAAA;AAAA,IACR,WAAU;AAAA,IACV,aAAU;AAAA,cAHZ;AAAA,MAKE,gBAAA,EAAC,UAAD;AAAA,QACE,cAAW;AAAA,QACX,WAAU;AAAA,kBAEV,gBAAA,EAAC,IAAD,EACE,QAAA,CAAS,EAAE,aAAA,GAAa,OAAA,GAAO,GAAG,EAAA,MAAiB;AACjD,gBAAM,IAAW,OAAO,KAAY,YAC9B,IAAA,MAAqB;AACzB,gBAAI,GAAO;AACT,cAAA,EAAY;AACZ;AAAA,YACF;AACA,YAAA,IAAU;AAAA,UACZ;AAEA,iBACE,gBAAA,EAAC,OAAD;AAAA,YACE,aAAU;AAAA,YACV,sBAAmB;AAAA,YACnB,WAAU;AAAA,sBAHZ;AAAA,cAKE,gBAAA,EAAC,GAAD;AAAA,gBACE,WAAU;AAAA,gBACV,eAAY;AAAA,cACb,CAAA;AAAA,cACD,gBAAA,EAAC,SAAD;AAAA,gBACE,GAAI;AAAA,gBACG,OAAA;AAAA,gBACM,aAAA;AAAA,gBACb,cAAY;AAAA,gBACZ,WAAU;AAAA,cACX,CAAA;AAAA,cACA,KACC,gBAAA,EAAC,GAAD,EAAA,UAAuB,EAAmC,CAAA;AAAA,cAE5D,gBAAA,EAAC,GAAD;AAAA,gBACE,MAAK;AAAA,gBACL,WAAU;AAAA,gBACV,UAAU,CAAC,KAAS,CAAC;AAAA,gBACrB,cACE,IACI,iBACA,IACE,uBACA;AAAA,gBAER,SAAS;AAAA,cACV,CAAA;AAAA,YACE;AAAA;QAET,EACD,CAAA;AAAA,MACK,CAAA;AAAA,MAER,gBAAA,EAAC,IAAD;AAAA,QACE,OAAO,EAAE,WAAW,EAAc;AAAA,QAClC,WAAU;AAAA,kBAFZ,CAIE,gBAAA,EAAC,IAAD;AAAA,UAAc,WAAU;AAAA,oBACrB,KAAc;AAAA,QACH,CAAA,GACd,gBAAA,EAAC,IAAD;AAAA,UACU,QAAA;AAAA,UACC,SAAA;AAAA,UACT,gBA1EF,CAAgB,MACpB,gBAAA,EAAC,GAAD;AAAA,YAAyC,QAAA;AAAA,YAAkB,UAAA;AAAA,UAAW,GAAhD,EAAO,EAAyC;AAAA,UA2E/D,UAAA;AAAA,QACqB,CAAA,CACb;AAAA;MAEZ,KACC,gBAAA,EAAC,GAAD;AAAA,QACE,OAAO;AAAA,QACa,oBAAA;AAAA,QACH,iBAAA;AAAA,MAClB,CAAA;AAAA,IAEI;AAAA;AAEb;AACA,EAAgB,cAAc;AAM9B,SAAS,EAAY,EACnB,MAAA,GACA,cAAA,GACA,aAAA,IAAc,GACd,WAAA,IAAY,qBACZ,YAAA,GACA,SAAA,IAAU,CAAC,GACX,QAAA,IAAS,CAAC,GACV,UAAA,GACA,cAAA,IAAe,IACf,cAAA,GACA,YAAA,IAAa,IACb,aAAA,GACA,oBAAA,IAAqB,IACrB,iBAAA,GACA,WAAA,GACA,WAAA,IAAY,GACZ,QAAA,GACA,UAAA,EAAA,GACmB;AACnB,QAAM,IAAmB,EAAoB,GACvC,IAAmB,KAAgB;AAEzC,SACE,gBAAA,EAAC,IAAD;AAAA,IACQ,MAAA;AAAA,IACQ,cAAA;AAAA,IACd,WAAW,EAAG,kCAAkC,CAAS;AAAA,cAEzD,gBAAA,EAAC,GAAD;AAAA,MACe,aAAA;AAAA,MACF,WAAA;AAAA,MACC,YAAA;AAAA,MACH,SAAA;AAAA,MACD,QAAA;AAAA,MACE,UAAA;AAAA,MACV,SAAA,MAAe,IAAe,EAAK;AAAA,MACrB,cAAA;AAAA,MACd,cAAc;AAAA,MACF,YAAA;AAAA,MACC,aAAA;AAAA,MACO,oBAAA;AAAA,MACH,iBAAA;AAAA,MACN,WAAA;AAAA,MACH,QAAA;AAAA,MAEP,UAAA;AAAA,IACc,CAAA;AAAA,EACJ,CAAA;AAEnB;AACA,EAAY,cAAc;AAY1B,SAAS,GAAiB,EACxB,aAAA,IAAc,GACd,WAAA,IAAY,qBACZ,YAAA,GACA,SAAA,IAAU,CAAC,GACX,QAAA,IAAS,CAAC,GACV,UAAA,GACA,cAAA,IAAe,IACf,cAAA,GACA,YAAA,IAAa,IACb,aAAA,GACA,oBAAA,IAAqB,IACrB,iBAAA,GACA,WAAA,GACA,WAAA,IAAY,GACZ,QAAA,GACA,UAAA,EAAA,GACwB;AACxB,QAAM,IAAmB,EAAoB,GACvC,IAAmB,KAAgB;AAEzC,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,aAAU;AAAA,IACV,WAAW,EAAG,IAA+B,CAAS;AAAA,cAEtD,gBAAA,EAAC,GAAD;AAAA,MACe,aAAA;AAAA,MACF,WAAA;AAAA,MACC,YAAA;AAAA,MACH,SAAA;AAAA,MACD,QAAA;AAAA,MACE,UAAA;AAAA,MACI,cAAA;AAAA,MACd,cAAc;AAAA,MACF,YAAA;AAAA,MACC,aAAA;AAAA,MACO,oBAAA;AAAA,MACH,iBAAA;AAAA,MACN,WAAA;AAAA,MACH,QAAA;AAAA,MAEP,UAAA;AAAA,IACc,CAAA;AAAA,EACd,CAAA;AAET;AACA,GAAiB,cAAc;ACvoB/B,SAAS,GAAsB,GAAsB;AACnD,SAAO;AAAA,IACL,cAAA,CAAe,MAAkB;AAC/B,YAAM,IACJ,EAAQ,cAAc,aAAa,eAAe;AACpD,MAAA,EAAQ,cAAc,IAAI,EAAuB,eAAe;AAAA,QAC9D,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,UAAU;AAAA,MACZ,CAAC,CAAC;AAAA,IACJ;AAAA,IACA,UAAA,CAAW,MAAmB;AAC5B,YAAM,IACJ,EAAQ,cAAc,aAAa,eAAe;AACpD,MAAA,EAAQ,cAAc,IAAI,EAAuB,UAAU;AAAA,QACzD,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,UAAU;AAAA,MACZ,CAAC,CAAC;AAAA,IACJ;AAAA,IACA,iBAAA,CAAkB,MAAmB;AACnC,YAAM,IACJ,EAAQ,cAAc,aAAa,eAAe;AACpD,MAAA,EAAQ,cAAc,IAAI,EAAuB,kBAAkB;AAAA,QACjE,QAAQ;AAAA,QACR,SAAS;AAAA,QACT,UAAU;AAAA,MACZ,CAAC,CAAC;AAAA,IACJ;AAAA,EACF;AACF;AAKA,SAAS,GAAmB,GAAkF;AAC5G,QAAM,EAAE,cAAA,GAAc,GAAG,EAAA,IAAc,GAEjC,IAAgB,EAAM,QAAA,MACrB,IACE,GAAsB,CAAY,IADf,CAAC,GAE1B,CAAC,CAAY,CAAC;AAEjB,SAAO,EAAM,cAAc,GAAa;AAAA,IAAE,GAAG;AAAA,IAAW,GAAG;AAAA,EAAc,CAAC;AAC5E;AAKA,IAAM,IAAsB;AAAA,EACxB,MAAM;AAAA,EACN,aAAa;AAAA,EACb,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,oBAAoB;AAAA,EACpB,WAAW;AAAA,EACX,WAAW;AAAA,EACX,QAAQ;AACZ,GAEM,IAAN,cAA4B,YAAY;AAAA,EACtC,QAAsD;AAAA,EACtD,qBAAoD;AAAA,EACpD,SAA0C,CAAC;AAAA,EAC3C,eAAuB;AAAA,EAEvB,oBAAoB;AAClB,eAAA,MAAiB,KAAK,YAAY,GAAG,CAAC;AAAA,EACxC;AAAA,EAEA,cAAsB;AACpB,QAAI,KAAK,aAAc;AACvB,SAAK,eAAe;AAEpB,UAAM,IAA2B,CAAC;AAClC,eAAW,KAAS,MAAM,KAAK,KAAK,UAAU;AAC5C,MAAI,EAAM,aAAa,KAAK,aAAa,CAAC,EAAM,aAAa,KAAK,KAGlE,EAAiB,KAAK,CAAK;AAG7B,UAAM,IAAiB,KAAK,cAAc,cAAc,KAAK;AAQ7D,SAPA,EAAe,MAAM,UAAU,YAE/B,KAAK,qBAAqB,KAAK,cAAc,cAAc,KAAK,GAChE,KAAK,mBAAmB,MAAM,UAAU,YAExC,EAAiB,QAAA,CAAS,MAAU,KAAK,mBAAoB,YAAY,CAAK,CAAC,GAExE,KAAK,aAAY,MAAK,YAAY,KAAK,UAAU;AACxD,SAAK,YAAY,CAAc,GAE/B,KAAK,QAAQ,GAAW,CAAc,GACtC,KAAK,QAAQ;AAAA,EACf;AAAA,EAEA,uBAAuB;AACrB,SAAK,OAAO,QAAQ,GACpB,KAAK,QAAQ;AAAA,EACf;AAAA,EAEA,yBAAyB,GAAe,GAA0B,GAA0B;AAC1F,SAAK,QAAQ;AAAA,EACf;AAAA,EAEA,WAAW,qBAAqB;AAC9B,WAAO,OAAO,KAAK,CAAS,EAAE,IAAA,CAAK,MACjC,EAAK,QAAQ,YAAY,KAAK,EAAE,YAAY,CAC9C;AAAA,EACF;AAAA,EAEA,SAAS,GAAc,GAAgB;AACrC,UAAM,IAAW,EAAU,CAAA,KAAS;AACpC,SAAK,OAAO,CAAA,IAAQ,EAAW,GAAO,CAAQ,GAC9C,KAAK,QAAQ;AAAA,EACf;AAAA,EAEA,SAAS,GAAuB;AAC9B,QAAI,KAAQ,KAAK,OACf,QAAO,KAAK,OAAO,CAAA;AAErB,UAAM,IAAW,EAAK,QAAQ,YAAY,KAAK,EAAE,YAAY,GACvD,IAAW,EAAU,CAAA,KAAS;AACpC,WAAO,EAAU,KAAK,aAAa,CAAQ,GAAG,CAAQ;AAAA,EACxD;AAAA,EAEA,UAAkB;AAChB,QAAI,CAAC,KAAK,SAAS,CAAC,KAAK,mBAAoB;AAE7C,UAAM,IAAiC,CAAC;AACxC,eAAW,CAAC,GAAU,CAAA,KAAa,OAAO,QAAQ,CAAS,EACzD,KAAI,KAAY,KAAK,OACnB,CAAA,EAAM,CAAA,IAAY,KAAK,OAAO,CAAA;AAAA,SACzB;AACL,YAAM,IAAW,EAAS,QAAQ,YAAY,KAAK,EAAE,YAAY;AACjE,MAAA,EAAM,CAAA,IAAY,EAAU,KAAK,aAAa,CAAQ,GAAG,CAAQ;AAAA,IACnE;AAGF,UAAM,IAAU,EAAM,cACpB,IACA;AAAA,MAAE,GAAG;AAAA,MAAO,cAAc;AAAA,IAAK,GAC/B,EAAM,cAAc,QAAQ;AAAA,MAC1B,KAAA,CAAM,MAA+B;AACnC,QAAI,KAAM,KAAK,sBACb,EAAG,YAAY,KAAK,kBAAkB;AAAA,MAE1C;AAAA,MACA,OAAO,EAAE,SAAS,WAAW;AAAA,IAC/B,CAAC,CACH;AAEA,SAAK,MAAM,OAAO,CAAO;AAAA,EAC3B;AACF;AAEA,WAAW,KAAY,OAAO,KAAK,CAAS,EAC1C,QAAO,eAAe,EAAc,WAAW,GAAU;AAAA,EACvD,MAAM;AACJ,WAAO,KAAK,SAAS,CAAQ;AAAA,EAC/B;AAAA,EACA,IAAI,GAAgB;AAClB,SAAK,SAAS,GAAU,CAAK;AAAA,EAC/B;AAAA,EACA,YAAY;AAAA,EACZ,cAAc;AAChB,CAAC;AAGC,OAAO,iBAAmB,OAAe,CAAC,eAAe,IAAI,iBAAiB,KAChF,eAAe,OAAO,mBAAmB,CAAa"}

package/dist/wc-react/hf-data-table.js

@@ -2907,8 +2907,8 @@ function Ai({ children: e, column: n, className: t }) {
       children: [e, /* @__PURE__ */ ee("span", {
         className: "relative size-4",
         children: [
-          /* @__PURE__ */ F(Qn, { className: M("absolute inset-0 size-4 text-text-quaternary transition-[opacity,transform] duration-200 ease-out motion-reduce:transition-none", o === "asc" ? "opacity-100 translate-y-0" : "opacity-0 -translate-y-1") }),
-          /* @__PURE__ */ F(Yn, { className: M("absolute inset-0 size-4 text-text-quaternary transition-[opacity,transform] duration-200 ease-out motion-reduce:transition-none", o === "desc" ? "opacity-100 translate-y-0" : "opacity-0 translate-y-1") }),
+          /* @__PURE__ */ F(Qn, { className: M("absolute inset-0 size-4 text-muted-foreground transition-[opacity,transform] duration-200 ease-out motion-reduce:transition-none", o === "asc" ? "opacity-100 translate-y-0" : "opacity-0 -translate-y-1") }),
+          /* @__PURE__ */ F(Yn, { className: M("absolute inset-0 size-4 text-muted-foreground transition-[opacity,transform] duration-200 ease-out motion-reduce:transition-none", o === "desc" ? "opacity-100 translate-y-0" : "opacity-0 translate-y-1") }),
           /* @__PURE__ */ F(go, { className: M("absolute inset-0 size-4 transition-opacity duration-200 ease-out motion-reduce:transition-none", o ? "opacity-0" : "opacity-100 text-muted-foreground") })
         ]
       })]
@@ -3072,7 +3072,7 @@ function Tn({ columns: e, data: n, children: t, enableRowSelection: o = !1, enab
           /* @__PURE__ */ F(Zn, { className: M("h-4 w-4 flex-shrink-0 transition-transform duration-200 ease-out motion-reduce:transition-none", R.getIsExpanded() && "rotate-90") }),
           /* @__PURE__ */ F("span", { children: ve(I.column.columnDef.cell, I.getContext()) }),
           /* @__PURE__ */ ee("span", {
-            className: "text-text-quaternary tabular-nums",
+            className: "text-secondary-foreground tabular-nums",
             children: [
               "(",
               R.subRows.length,