@humain/ui 2.2.7 → 2.2.9

package/dist/wc-react/hf-ai-reasoning-block.js.map

@@ -1 +1 @@
-{"version":3,"file":"hf-ai-reasoning-block.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/lightbulb.mjs","../../src/components/organisms/ai/AIReasoningBlock/AIReasoningBlock.tsx","../../src/wc/hf-ai-reasoning-block.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  [\n    \"path\",\n    {\n      d: \"M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5\",\n      key: \"1gvzjb\"\n    }\n  ],\n  [\"path\", { d: \"M9 18h6\", key: \"x1upvd\" }],\n  [\"path\", { d: \"M10 22h4\", key: \"ceow96\" }]\n];\nconst Lightbulb = createLucideIcon(\"lightbulb\", __iconNode);\n\nexport { __iconNode, Lightbulb as default };\n//# sourceMappingURL=lightbulb.mjs.map\n","import { cva, type VariantProps } from 'class-variance-authority';\nimport { ChevronDown, ChevronRight, Lightbulb } from 'lucide-react';\nimport { AnimatePresence, motion } from 'motion/react';\nimport * as React from 'react';\nimport { MarkdownRenderer } from '@/components/organisms/ai/_shared/markdown-renderer';\nimport { useControllableState } from '@/hooks/use-controllable-state';\nimport { cn } from '@/lib/utils';\n\n// =============================================================================\n// Variants\n// =============================================================================\n\nconst reasoningBlockVariants = cva(\n  'overflow-hidden rounded-xl border transition-colors',\n  {\n    variants: {\n      variant: {\n        default: 'border-border bg-muted',\n        thinking: 'border-primary bg-primary/10',\n        subtle: 'border-border bg-background',\n      },\n      state: {\n        idle: '',\n        streaming: 'border-primary',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      state: 'idle',\n    },\n  },\n);\n\n// =============================================================================\n// Thinking Indicator\n// =============================================================================\n\ninterface ThinkingIndicatorProps {\n  className?: string;\n}\n\nfunction ThinkingIndicator({ className }: ThinkingIndicatorProps) {\n  return (\n    <div\n      className={cn('flex items-center gap-1', className)}\n      role=\"status\"\n      aria-label=\"Thinking\"\n    >\n      <motion.span\n        className=\"size-1.5 rounded-full bg-primary motion-reduce:animate-none\"\n        animate={{ opacity: [0.3, 1, 0.3] }}\n        transition={{\n          duration: 1.5,\n          repeat: Number.POSITIVE_INFINITY,\n          delay: 0,\n        }}\n      />\n      <motion.span\n        className=\"size-1.5 rounded-full bg-primary motion-reduce:animate-none\"\n        animate={{ opacity: [0.3, 1, 0.3] }}\n        transition={{\n          duration: 1.5,\n          repeat: Number.POSITIVE_INFINITY,\n          delay: 0.2,\n        }}\n      />\n      <motion.span\n        className=\"size-1.5 rounded-full bg-primary motion-reduce:animate-none\"\n        animate={{ opacity: [0.3, 1, 0.3] }}\n        transition={{\n          duration: 1.5,\n          repeat: Number.POSITIVE_INFINITY,\n          delay: 0.4,\n        }}\n      />\n    </div>\n  );\n}\n\n// =============================================================================\n// Reasoning Trigger (Header)\n// =============================================================================\n\nexport interface AIReasoningTriggerProps {\n  /** Title text */\n  title?: string;\n  /** Whether the block is expanded */\n  isOpen: boolean;\n  /** Callback to toggle open state */\n  onToggle: () => void;\n  /** Whether AI is currently streaming/thinking */\n  isStreaming?: boolean;\n  /** Duration text to display */\n  duration?: string;\n  /** ID of the controlled content panel */\n  contentId?: string;\n  /** Additional class name */\n  className?: string;\n}\n\nfunction AIReasoningTrigger({\n  title = 'Reasoning',\n  isOpen,\n  onToggle,\n  isStreaming = false,\n  duration,\n  contentId,\n  className,\n}: AIReasoningTriggerProps) {\n  return (\n    <button\n      type=\"button\"\n      onClick={onToggle}\n      aria-expanded={isOpen}\n      aria-controls={contentId}\n      className={cn(\n        'flex items-center justify-between w-full px-4 py-3 transition-colors hover:bg-foreground/5 focus-visible:outline-2 focus-visible:outline-offset-[-2px] focus-visible:outline-ring rounded-xl',\n        className,\n      )}\n    >\n      <div className=\"flex items-center gap-2\">\n        <Lightbulb\n          className={cn(\n            'size-4',\n            isStreaming ? 'text-primary' : 'text-text-quaternary',\n          )}\n          aria-hidden=\"true\"\n        />\n        <span className=\"text-sm font-medium text-foreground\">{title}</span>\n        {isStreaming && <ThinkingIndicator />}\n        {duration && !isStreaming && (\n          <span className=\"text-xs text-muted-foreground\">{duration}</span>\n        )}\n      </div>\n      {isOpen ? (\n        <ChevronDown\n          className=\"size-4 text-muted-foreground transition-transform\"\n          aria-hidden=\"true\"\n        />\n      ) : (\n        <ChevronRight\n          className=\"size-4 text-muted-foreground rtl:rotate-180 transition-transform\"\n          aria-hidden=\"true\"\n        />\n      )}\n    </button>\n  );\n}\n\nAIReasoningTrigger.displayName = 'AIReasoningTrigger';\n\n// =============================================================================\n// Reasoning Content\n// =============================================================================\n\nexport interface AIReasoningContentProps {\n  /** Content to display (can be markdown string or ReactNode) */\n  children: React.ReactNode;\n  /** Whether to render as markdown */\n  markdown?: boolean;\n  /** Additional class name */\n  className?: string;\n}\n\nfunction AIReasoningContent({\n  children,\n  markdown = true,\n  className,\n}: AIReasoningContentProps) {\n  return (\n    <div className={cn('px-4 pb-4', className)}>\n      {markdown && typeof children === 'string' ? (\n        <MarkdownRenderer className=\"text-sm text-secondary-foreground\">\n          {children}\n        </MarkdownRenderer>\n      ) : (\n        <div className=\"text-sm text-secondary-foreground\">{children}</div>\n      )}\n    </div>\n  );\n}\n\nAIReasoningContent.displayName = 'AIReasoningContent';\n\n// =============================================================================\n// Main AIReasoningBlock Component\n// =============================================================================\n\nexport interface AIReasoningBlockProps\n  extends VariantProps<typeof reasoningBlockVariants> {\n  /** Reasoning content (markdown string or ReactNode) */\n  children: React.ReactNode;\n  /** Title for the reasoning block */\n  title?: string;\n  /** Controlled open state */\n  open?: boolean;\n  /** Default open state (uncontrolled) */\n  defaultOpen?: boolean;\n  /** Callback when open state changes */\n  onOpenChange?: (open: boolean) => void;\n  /** Whether AI is currently streaming/thinking */\n  isStreaming?: boolean;\n  /** Whether to render content as markdown */\n  markdown?: boolean;\n  /** Duration text to display */\n  duration?: string;\n  /** Additional class name */\n  className?: string;\n}\n\nfunction AIReasoningBlock({\n  children,\n  title = 'Reasoning',\n  open: controlledOpen,\n  defaultOpen = false,\n  onOpenChange,\n  isStreaming = false,\n  markdown = true,\n  duration,\n  variant,\n  className,\n}: AIReasoningBlockProps) {\n  const contentId = React.useId();\n\n  const [isOpen, setIsOpen] = useControllableState({\n    value: controlledOpen,\n    defaultValue: defaultOpen,\n    onChange: onOpenChange,\n  });\n\n  const handleToggle = () => {\n    setIsOpen(!isOpen);\n  };\n\n  return (\n    <div\n      data-slot=\"ai-reasoning-block\"\n      className={cn(\n        reasoningBlockVariants({\n          variant: isStreaming ? 'thinking' : variant,\n          state: isStreaming ? 'streaming' : 'idle',\n        }),\n        className,\n      )}\n    >\n      <AIReasoningTrigger\n        title={title}\n        isOpen={isOpen}\n        onToggle={handleToggle}\n        isStreaming={isStreaming}\n        duration={duration}\n        contentId={contentId}\n      />\n\n      <AnimatePresence>\n        {isOpen && (\n          <motion.section\n            id={contentId}\n            aria-label={title}\n            initial={{ height: 0, opacity: 0 }}\n            animate={{ height: 'auto', opacity: 1 }}\n            exit={{ height: 0, opacity: 0 }}\n            transition={{ duration: 0.2 }}\n            className=\"overflow-hidden\"\n          >\n            <AIReasoningContent markdown={markdown}>\n              {children}\n            </AIReasoningContent>\n          </motion.section>\n        )}\n      </AnimatePresence>\n    </div>\n  );\n}\n\nAIReasoningBlock.displayName = 'AIReasoningBlock';\n\n// =============================================================================\n// Thinking Bar (Minimal variant)\n// =============================================================================\n\nexport interface AIThinkingBarProps {\n  /** Text to display */\n  text?: string;\n  /** Whether thinking is active */\n  isThinking?: boolean;\n  /** Action button content */\n  action?: React.ReactNode;\n  /** Additional class name */\n  className?: string;\n}\n\nfunction AIThinkingBar({\n  text = 'Thinking...',\n  isThinking = true,\n  action,\n  className,\n}: AIThinkingBarProps) {\n  if (!isThinking) return null;\n\n  return (\n    <motion.div\n      data-slot=\"ai-thinking-bar\"\n      initial={{ opacity: 0, y: -10 }}\n      animate={{ opacity: 1, y: 0 }}\n      exit={{ opacity: 0, y: -10 }}\n      className={cn(\n        'flex items-center justify-between px-4 py-2 rounded-lg bg-primary/10 border border-primary motion-reduce:animate-none',\n        className,\n      )}\n    >\n      <div className=\"flex items-center gap-2\">\n        <Lightbulb className=\"size-4 text-primary\" aria-hidden=\"true\" />\n        <span className=\"text-sm text-primary\">{text}</span>\n        <ThinkingIndicator />\n      </div>\n      {action}\n    </motion.div>\n  );\n}\n\nAIThinkingBar.displayName = 'AIThinkingBar';\n\nexport {\n  AIReasoningBlock,\n  AIReasoningContent,\n  AIReasoningTrigger,\n  AIThinkingBar,\n  reasoningBlockVariants,\n  ThinkingIndicator,\n};\n","/**\n * Web Component wrapper for AIReasoningBlock\n * Custom element: <hf-ai-reasoning-block>\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 { AIReasoningBlock } from '../components/organisms/ai/AIReasoningBlock';\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  };\n}\n\n/**\n * Wrapper component that connects React events to DOM custom events\n */\nfunction AIReasoningBlockWrapper(props: React.ComponentProps<typeof AIReasoningBlock> & { _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(AIReasoningBlock, { ...restProps, ...eventHandlers });\n}\n\n/**\n * Prop type definitions for attribute parsing\n */\nconst propTypes: PropDefs = {\n    variant: 'string',\n    state: 'string',\n    title: 'string',\n    open: 'boolean',\n    defaultOpen: 'boolean',\n    isStreaming: 'boolean',\n    markdown: 'boolean',\n    duration: 'string',\n    className: 'string'\n};\n\nclass AIReasoningBlockWC 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      AIReasoningBlockWrapper,\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(AIReasoningBlockWC.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-ai-reasoning-block')) {\n  customElements.define('hf-ai-reasoning-block', AIReasoningBlockWC);\n}\n\nexport { AIReasoningBlockWC };\nexport default AIReasoningBlockWC;\n"],"x_google_ignoreList":[0],"mappings":"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"}
+{"version":3,"file":"hf-ai-reasoning-block.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/lightbulb.mjs","../../src/components/organisms/ai/AIReasoningBlock/AIReasoningBlock.tsx","../../src/wc/hf-ai-reasoning-block.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  [\n    \"path\",\n    {\n      d: \"M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5\",\n      key: \"1gvzjb\"\n    }\n  ],\n  [\"path\", { d: \"M9 18h6\", key: \"x1upvd\" }],\n  [\"path\", { d: \"M10 22h4\", key: \"ceow96\" }]\n];\nconst Lightbulb = createLucideIcon(\"lightbulb\", __iconNode);\n\nexport { __iconNode, Lightbulb as default };\n//# sourceMappingURL=lightbulb.mjs.map\n","import { cva, type VariantProps } from 'class-variance-authority';\nimport { ChevronDown, ChevronRight, Lightbulb } from 'lucide-react';\nimport { AnimatePresence, motion } from 'motion/react';\nimport * as React from 'react';\nimport { MarkdownRenderer } from '@/components/organisms/ai/_shared/markdown-renderer';\nimport { useControllableState } from '@/hooks/use-controllable-state';\nimport { cn } from '@/lib/utils';\n\n// =============================================================================\n// Variants\n// =============================================================================\n\nconst reasoningBlockVariants = cva(\n  'overflow-hidden rounded-xl border transition-colors',\n  {\n    variants: {\n      variant: {\n        default: 'border-border bg-muted',\n        thinking: 'border-primary bg-primary/10',\n        subtle: 'border-border bg-background',\n      },\n      state: {\n        idle: '',\n        streaming: 'border-primary',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      state: 'idle',\n    },\n  },\n);\n\n// =============================================================================\n// Thinking Indicator\n// =============================================================================\n\ninterface ThinkingIndicatorProps {\n  className?: string;\n}\n\nfunction ThinkingIndicator({ className }: ThinkingIndicatorProps) {\n  return (\n    <div\n      className={cn('flex items-center gap-1', className)}\n      role=\"status\"\n      aria-label=\"Thinking\"\n    >\n      <motion.span\n        className=\"size-1.5 rounded-full bg-primary motion-reduce:animate-none\"\n        animate={{ opacity: [0.3, 1, 0.3] }}\n        transition={{\n          duration: 1.5,\n          repeat: Number.POSITIVE_INFINITY,\n          delay: 0,\n        }}\n      />\n      <motion.span\n        className=\"size-1.5 rounded-full bg-primary motion-reduce:animate-none\"\n        animate={{ opacity: [0.3, 1, 0.3] }}\n        transition={{\n          duration: 1.5,\n          repeat: Number.POSITIVE_INFINITY,\n          delay: 0.2,\n        }}\n      />\n      <motion.span\n        className=\"size-1.5 rounded-full bg-primary motion-reduce:animate-none\"\n        animate={{ opacity: [0.3, 1, 0.3] }}\n        transition={{\n          duration: 1.5,\n          repeat: Number.POSITIVE_INFINITY,\n          delay: 0.4,\n        }}\n      />\n    </div>\n  );\n}\n\n// =============================================================================\n// Reasoning Trigger (Header)\n// =============================================================================\n\nexport interface AIReasoningTriggerProps {\n  /** Title text */\n  title?: string;\n  /** Whether the block is expanded */\n  isOpen: boolean;\n  /** Callback to toggle open state */\n  onToggle: () => void;\n  /** Whether AI is currently streaming/thinking */\n  isStreaming?: boolean;\n  /** Duration text to display */\n  duration?: string;\n  /** ID of the controlled content panel */\n  contentId?: string;\n  /** Additional class name */\n  className?: string;\n}\n\nfunction AIReasoningTrigger({\n  title = 'Reasoning',\n  isOpen,\n  onToggle,\n  isStreaming = false,\n  duration,\n  contentId,\n  className,\n}: AIReasoningTriggerProps) {\n  return (\n    <button\n      type=\"button\"\n      onClick={onToggle}\n      aria-expanded={isOpen}\n      aria-controls={contentId}\n      className={cn(\n        'flex items-center justify-between w-full px-4 py-3 transition-colors hover:bg-foreground/5 focus-visible:outline-2 focus-visible:outline-offset-[-2px] focus-visible:outline-ring rounded-xl',\n        className,\n      )}\n    >\n      <div className=\"flex items-center gap-2\">\n        <Lightbulb\n          className={cn(\n            'size-4',\n            isStreaming ? 'text-primary' : 'text-muted-foreground',\n          )}\n          aria-hidden=\"true\"\n        />\n        <span className=\"text-sm font-medium text-foreground\">{title}</span>\n        {isStreaming && <ThinkingIndicator />}\n        {duration && !isStreaming && (\n          <span className=\"text-xs text-muted-foreground\">{duration}</span>\n        )}\n      </div>\n      {isOpen ? (\n        <ChevronDown\n          className=\"size-4 text-muted-foreground transition-transform\"\n          aria-hidden=\"true\"\n        />\n      ) : (\n        <ChevronRight\n          className=\"size-4 text-muted-foreground rtl:rotate-180 transition-transform\"\n          aria-hidden=\"true\"\n        />\n      )}\n    </button>\n  );\n}\n\nAIReasoningTrigger.displayName = 'AIReasoningTrigger';\n\n// =============================================================================\n// Reasoning Content\n// =============================================================================\n\nexport interface AIReasoningContentProps {\n  /** Content to display (can be markdown string or ReactNode) */\n  children: React.ReactNode;\n  /** Whether to render as markdown */\n  markdown?: boolean;\n  /** Additional class name */\n  className?: string;\n}\n\nfunction AIReasoningContent({\n  children,\n  markdown = true,\n  className,\n}: AIReasoningContentProps) {\n  return (\n    <div className={cn('px-4 pb-4', className)}>\n      {markdown && typeof children === 'string' ? (\n        <MarkdownRenderer className=\"text-sm text-secondary-foreground\">\n          {children}\n        </MarkdownRenderer>\n      ) : (\n        <div className=\"text-sm text-secondary-foreground\">{children}</div>\n      )}\n    </div>\n  );\n}\n\nAIReasoningContent.displayName = 'AIReasoningContent';\n\n// =============================================================================\n// Main AIReasoningBlock Component\n// =============================================================================\n\nexport interface AIReasoningBlockProps\n  extends VariantProps<typeof reasoningBlockVariants> {\n  /** Reasoning content (markdown string or ReactNode) */\n  children: React.ReactNode;\n  /** Title for the reasoning block */\n  title?: string;\n  /** Controlled open state */\n  open?: boolean;\n  /** Default open state (uncontrolled) */\n  defaultOpen?: boolean;\n  /** Callback when open state changes */\n  onOpenChange?: (open: boolean) => void;\n  /** Whether AI is currently streaming/thinking */\n  isStreaming?: boolean;\n  /** Whether to render content as markdown */\n  markdown?: boolean;\n  /** Duration text to display */\n  duration?: string;\n  /** Additional class name */\n  className?: string;\n}\n\nfunction AIReasoningBlock({\n  children,\n  title = 'Reasoning',\n  open: controlledOpen,\n  defaultOpen = false,\n  onOpenChange,\n  isStreaming = false,\n  markdown = true,\n  duration,\n  variant,\n  className,\n}: AIReasoningBlockProps) {\n  const contentId = React.useId();\n\n  const [isOpen, setIsOpen] = useControllableState({\n    value: controlledOpen,\n    defaultValue: defaultOpen,\n    onChange: onOpenChange,\n  });\n\n  const handleToggle = () => {\n    setIsOpen(!isOpen);\n  };\n\n  return (\n    <div\n      data-slot=\"ai-reasoning-block\"\n      className={cn(\n        reasoningBlockVariants({\n          variant: isStreaming ? 'thinking' : variant,\n          state: isStreaming ? 'streaming' : 'idle',\n        }),\n        className,\n      )}\n    >\n      <AIReasoningTrigger\n        title={title}\n        isOpen={isOpen}\n        onToggle={handleToggle}\n        isStreaming={isStreaming}\n        duration={duration}\n        contentId={contentId}\n      />\n\n      <AnimatePresence>\n        {isOpen && (\n          <motion.section\n            id={contentId}\n            aria-label={title}\n            initial={{ height: 0, opacity: 0 }}\n            animate={{ height: 'auto', opacity: 1 }}\n            exit={{ height: 0, opacity: 0 }}\n            transition={{ duration: 0.2 }}\n            className=\"overflow-hidden\"\n          >\n            <AIReasoningContent markdown={markdown}>\n              {children}\n            </AIReasoningContent>\n          </motion.section>\n        )}\n      </AnimatePresence>\n    </div>\n  );\n}\n\nAIReasoningBlock.displayName = 'AIReasoningBlock';\n\n// =============================================================================\n// Thinking Bar (Minimal variant)\n// =============================================================================\n\nexport interface AIThinkingBarProps {\n  /** Text to display */\n  text?: string;\n  /** Whether thinking is active */\n  isThinking?: boolean;\n  /** Action button content */\n  action?: React.ReactNode;\n  /** Additional class name */\n  className?: string;\n}\n\nfunction AIThinkingBar({\n  text = 'Thinking...',\n  isThinking = true,\n  action,\n  className,\n}: AIThinkingBarProps) {\n  if (!isThinking) return null;\n\n  return (\n    <motion.div\n      data-slot=\"ai-thinking-bar\"\n      initial={{ opacity: 0, y: -10 }}\n      animate={{ opacity: 1, y: 0 }}\n      exit={{ opacity: 0, y: -10 }}\n      className={cn(\n        'flex items-center justify-between px-4 py-2 rounded-lg bg-primary/10 border border-primary motion-reduce:animate-none',\n        className,\n      )}\n    >\n      <div className=\"flex items-center gap-2\">\n        <Lightbulb className=\"size-4 text-primary\" aria-hidden=\"true\" />\n        <span className=\"text-sm text-primary\">{text}</span>\n        <ThinkingIndicator />\n      </div>\n      {action}\n    </motion.div>\n  );\n}\n\nAIThinkingBar.displayName = 'AIThinkingBar';\n\nexport {\n  AIReasoningBlock,\n  AIReasoningContent,\n  AIReasoningTrigger,\n  AIThinkingBar,\n  reasoningBlockVariants,\n  ThinkingIndicator,\n};\n","/**\n * Web Component wrapper for AIReasoningBlock\n * Custom element: <hf-ai-reasoning-block>\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 { AIReasoningBlock } from '../components/organisms/ai/AIReasoningBlock';\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  };\n}\n\n/**\n * Wrapper component that connects React events to DOM custom events\n */\nfunction AIReasoningBlockWrapper(props: React.ComponentProps<typeof AIReasoningBlock> & { _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(AIReasoningBlock, { ...restProps, ...eventHandlers });\n}\n\n/**\n * Prop type definitions for attribute parsing\n */\nconst propTypes: PropDefs = {\n    variant: 'string',\n    state: 'string',\n    title: 'string',\n    open: 'boolean',\n    defaultOpen: 'boolean',\n    isStreaming: 'boolean',\n    markdown: 'boolean',\n    duration: 'string',\n    className: 'string'\n};\n\nclass AIReasoningBlockWC 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      AIReasoningBlockWrapper,\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(AIReasoningBlockWC.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-ai-reasoning-block')) {\n  customElements.define('hf-ai-reasoning-block', AIReasoningBlockWC);\n}\n\nexport { AIReasoningBlockWC };\nexport default AIReasoningBlockWC;\n"],"x_google_ignoreList":[0],"mappings":"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"}

package/dist/wc-react/hf-ai-steps.js

@@ -1,4 +1,4 @@
-import { c as w, f as x, s as b } from "./_shared.js";
+import { c as w, f as b, s as x } from "./_shared.js";
 import { t as A } from "./check.js";
 import { t as k } from "./chevron-down.js";
 import { t as I } from "./chevron-right.js";
@@ -12,22 +12,22 @@ import { t as P } from "./use-reduced-motion2.js";
 import * as v from "react";
 import L from "react";
 import { createRoot as D } from "react-dom/client";
-import { jsx as i, jsxs as c } from "react/jsx-runtime";
+import { jsx as n, jsxs as c } from "react/jsx-runtime";
 var M = m("overflow-hidden rounded-xl border", {
   variants: { variant: {
     default: "border-border bg-background",
     subtle: "border-border bg-muted"
   } },
   defaultVariants: { variant: "default" }
-}), nt = m("flex items-start gap-3 px-4 py-3 transition-colors", {
+}), st = m("flex items-start gap-3 px-4 py-3 transition-colors", {
   variants: { status: {
-    pending: "text-muted-foreground",
+    pending: "text-secondary-foreground",
     running: "text-primary",
     completed: "text-success",
     error: "text-destructive"
   } },
   defaultVariants: { status: "pending" }
-}), st = m("size-5 shrink-0 flex items-center justify-center rounded-full", {
+}), ot = m("size-5 shrink-0 flex items-center justify-center rounded-full", {
   variants: { status: {
     pending: "bg-accent text-muted-foreground",
     running: "bg-primary/20 text-primary",
@@ -57,51 +57,51 @@ function y(t) {
   };
 }
 function Z({ status: t, index: e, className: r }) {
-  return /* @__PURE__ */ i(R, {
+  return /* @__PURE__ */ n(R, {
     status: _(t),
     index: e,
     className: r
   });
 }
 Z.displayName = "StepIcon";
-function U({ step: t, index: e, isLast: r, expandable: n = !0, defaultExpanded: o = !1 }) {
-  const [l, p] = v.useState(o);
-  return /* @__PURE__ */ i(V, {
+function U({ step: t, index: e, isLast: r, expandable: s = !0, defaultExpanded: i = !1 }) {
+  const [l, p] = v.useState(i);
+  return /* @__PURE__ */ n(V, {
     step: y(t),
     index: e,
     isLast: r,
     appearance: "contained",
     itemSlot: "ai-step-item",
-    expandable: n,
+    expandable: s,
     expanded: l,
-    onExpandedChange: () => p((s) => !s)
+    onExpandedChange: () => p((o) => !o)
   });
 }
 U.displayName = "AIStepItem";
-function C({ steps: t, title: e, variant: r, collapsible: n = !0, defaultExpanded: o = !0, stepsExpandable: l = !0, className: p }) {
-  const [s, N] = v.useState(o), E = P(), f = t.filter((a) => a.status === "completed").length, h = t.length, g = t.some((a) => a.status === "error"), u = t.some((a) => a.status === "running");
+function C({ steps: t, title: e, variant: r, collapsible: s = !0, defaultExpanded: i = !0, stepsExpandable: l = !0, className: p }) {
+  const [o, N] = v.useState(i), E = P(), f = t.filter((a) => a.status === "completed").length, h = t.length, g = t.some((a) => a.status === "error"), u = t.some((a) => a.status === "running");
   return /* @__PURE__ */ c("section", {
     "data-slot": "ai-steps",
     "aria-label": e || "Steps",
-    className: x(M({ variant: r }), p),
-    children: [(e || n) && /* @__PURE__ */ c("button", {
+    className: b(M({ variant: r }), p),
+    children: [(e || s) && /* @__PURE__ */ c("button", {
       type: "button",
-      onClick: () => n && N(!s),
-      disabled: !n,
-      "aria-expanded": n ? s : void 0,
-      className: x("flex items-center justify-between w-full px-4 py-3 border-b border-border", n && "hover:bg-muted cursor-pointer", "focus-visible:outline-2 focus-visible:outline-offset-[-2px] focus-visible:outline-ring"),
+      onClick: () => s && N(!o),
+      disabled: !s,
+      "aria-expanded": s ? o : void 0,
+      className: b("flex items-center justify-between w-full px-4 py-3 border-b border-border", s && "hover:bg-muted cursor-pointer", "focus-visible:outline-2 focus-visible:outline-offset-[-2px] focus-visible:outline-ring"),
       children: [/* @__PURE__ */ c("div", {
         className: "flex items-center gap-2",
         children: [
-          u && /* @__PURE__ */ i(z, { className: "size-4 text-primary animate-pulse motion-reduce:animate-none" }),
-          g && !u && /* @__PURE__ */ i(T, { className: "size-4 text-destructive" }),
-          !u && !g && f === h && /* @__PURE__ */ i(A, { className: "size-4 text-success" }),
-          /* @__PURE__ */ i("span", {
+          u && /* @__PURE__ */ n(z, { className: "size-4 text-primary animate-pulse motion-reduce:animate-none" }),
+          g && !u && /* @__PURE__ */ n(T, { className: "size-4 text-destructive" }),
+          !u && !g && f === h && /* @__PURE__ */ n(A, { className: "size-4 text-success" }),
+          /* @__PURE__ */ n("span", {
             className: "text-sm font-medium text-foreground",
             children: e || "Steps"
           }),
           /* @__PURE__ */ c("span", {
-            className: "text-xs text-text-quaternary",
+            className: "text-xs text-secondary-foreground",
             children: [
               "(",
               f,
@@ -111,13 +111,13 @@ function C({ steps: t, title: e, variant: r, collapsible: n = !0, defaultExpande
             ]
           })
         ]
-      }), n && /* @__PURE__ */ i("div", {
+      }), s && /* @__PURE__ */ n("div", {
         className: "shrink-0",
-        children: s ? /* @__PURE__ */ i(k, { className: "size-4 text-muted-foreground" }) : /* @__PURE__ */ i(I, { className: "size-4 text-muted-foreground rtl:rotate-180" })
+        children: o ? /* @__PURE__ */ n(k, { className: "size-4 text-muted-foreground" }) : /* @__PURE__ */ n(I, { className: "size-4 text-muted-foreground rtl:rotate-180" })
       })]
-    }), /* @__PURE__ */ i(O, {
+    }), /* @__PURE__ */ n(O, {
       initial: !1,
-      children: s && /* @__PURE__ */ i(W.div, {
+      children: o && /* @__PURE__ */ n(W.div, {
         initial: {
           height: 0,
           opacity: 0
@@ -132,7 +132,7 @@ function C({ steps: t, title: e, variant: r, collapsible: n = !0, defaultExpande
         },
         transition: { duration: E ? 0 : 0.2 },
         className: "overflow-hidden",
-        children: /* @__PURE__ */ i(j, {
+        children: /* @__PURE__ */ n(j, {
           appearance: "contained",
           steps: t.map(y),
           itemSlot: "ai-step-item",
@@ -185,15 +185,15 @@ var d = {
   _getProp(t) {
     if (t in this._props) return this._props[t];
     const e = t.replace(/([A-Z])/g, "-$1").toLowerCase(), r = d[t] || "string";
-    return b(this.getAttribute(e), r);
+    return x(this.getAttribute(e), r);
   }
   _render() {
     if (!this._root) return;
     const t = {};
-    for (const [r, n] of Object.entries(d)) if (r in this._props) t[r] = this._props[r];
+    for (const [r, s] of Object.entries(d)) if (r in this._props) t[r] = this._props[r];
     else {
-      const o = r.replace(/([A-Z])/g, "-$1").toLowerCase();
-      t[r] = b(this.getAttribute(o), n);
+      const i = r.replace(/([A-Z])/g, "-$1").toLowerCase();
+      t[r] = x(this.getAttribute(i), s);
     }
     const e = L.createElement(C, t);
     this._root.render(e);

package/dist/wc-react/hf-ai-steps.js.map

@@ -1 +1 @@
-{"version":3,"file":"hf-ai-steps.js","names":[],"sources":["../../src/components/organisms/ai/AISteps/AISteps.tsx","../../src/wc/hf-ai-steps.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport {\n  AlertCircle,\n  Check,\n  ChevronDown,\n  ChevronRight,\n  Clock,\n} from 'lucide-react';\nimport { AnimatePresence, motion, useReducedMotion } from 'motion/react';\nimport * as React from 'react';\nimport { cn } from '@/lib/utils';\nimport {\n  WorkflowStepItem,\n  WorkflowStepRenderer,\n  type WorkflowStepStatus,\n  WorkflowStepStatusIcon,\n  type WorkflowStepViewModel,\n} from '../_shared/workflow-step-renderer';\n\n// =============================================================================\n// Variants\n// =============================================================================\n\nconst stepsContainerVariants = cva('overflow-hidden rounded-xl border', {\n  variants: {\n    variant: {\n      default: 'border-border bg-background',\n      subtle: 'border-border bg-muted',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\nconst stepItemVariants = cva(\n  'flex items-start gap-3 px-4 py-3 transition-colors',\n  {\n    variants: {\n      status: {\n        pending: 'text-muted-foreground',\n        running: 'text-primary',\n        completed: 'text-success',\n        error: 'text-destructive',\n      },\n    },\n    defaultVariants: {\n      status: 'pending',\n    },\n  },\n);\n\nconst stepIconVariants = cva(\n  'size-5 shrink-0 flex items-center justify-center rounded-full',\n  {\n    variants: {\n      status: {\n        pending: 'bg-accent text-muted-foreground',\n        running: 'bg-primary/20 text-primary',\n        completed: 'bg-success/20 text-success',\n        error: 'bg-destructive/20 text-destructive',\n      },\n    },\n    defaultVariants: {\n      status: 'pending',\n    },\n  },\n);\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport type StepStatus = 'pending' | 'running' | 'completed' | 'error';\n\nexport interface StepData {\n  /** Unique step ID */\n  id: string;\n  /** Step title */\n  title: string;\n  /** Step description */\n  description?: string;\n  /** Step status */\n  status: StepStatus;\n  /** Optional content to show when expanded */\n  content?: React.ReactNode;\n  /** Duration in ms (for completed steps) */\n  duration?: number;\n  /** Error message if status is error */\n  error?: string;\n}\n\ntype AIStepsWorkflowStatus = Exclude<WorkflowStepStatus, 'suspended'>;\n\nconst WORKFLOW_STATUS_BY_STEP_STATUS = {\n  pending: 'pending',\n  running: 'running',\n  completed: 'completed',\n  error: 'error',\n} as const satisfies Record<StepStatus, AIStepsWorkflowStatus>;\n\nfunction toWorkflowStepStatus(status: StepStatus): AIStepsWorkflowStatus {\n  return WORKFLOW_STATUS_BY_STEP_STATUS[status];\n}\n\nfunction toWorkflowStep(step: StepData): WorkflowStepViewModel {\n  const error = step.error?.trim() ? step.error : undefined;\n\n  return {\n    id: step.id,\n    title: step.title,\n    description: step.description,\n    status: toWorkflowStepStatus(step.status),\n    content: error === undefined ? step.content : undefined,\n    durationMs: step.status === 'completed' ? step.duration : undefined,\n    error,\n  };\n}\n\n// =============================================================================\n// Step Icon Component\n// =============================================================================\n\ninterface StepIconProps {\n  status: StepStatus;\n  index: number;\n  className?: string;\n}\n\nfunction StepIcon({ status, index, className }: StepIconProps) {\n  return (\n    <WorkflowStepStatusIcon\n      status={toWorkflowStepStatus(status)}\n      index={index}\n      className={className}\n    />\n  );\n}\n\nStepIcon.displayName = 'StepIcon';\n\n// =============================================================================\n// Single Step Item\n// =============================================================================\n\ninterface AIStepItemProps {\n  step: StepData;\n  index: number;\n  isLast: boolean;\n  expandable?: boolean;\n  defaultExpanded?: boolean;\n}\n\nfunction AIStepItem({\n  step,\n  index,\n  isLast,\n  expandable = true,\n  defaultExpanded = false,\n}: AIStepItemProps) {\n  const [expanded, setExpanded] = React.useState(defaultExpanded);\n\n  return (\n    <WorkflowStepItem\n      step={toWorkflowStep(step)}\n      index={index}\n      isLast={isLast}\n      appearance=\"contained\"\n      itemSlot=\"ai-step-item\"\n      expandable={expandable}\n      expanded={expanded}\n      onExpandedChange={() => setExpanded((value) => !value)}\n    />\n  );\n}\n\nAIStepItem.displayName = 'AIStepItem';\n\n// =============================================================================\n// Main AISteps Component\n// =============================================================================\n\nexport interface AIStepsProps\n  extends VariantProps<typeof stepsContainerVariants> {\n  /** Array of steps */\n  steps: StepData[];\n  /** Title for the steps container */\n  title?: string;\n  /** Whether the container is collapsible */\n  collapsible?: boolean;\n  /** Whether the container is expanded by default */\n  defaultExpanded?: boolean;\n  /** Whether individual steps are expandable */\n  stepsExpandable?: boolean;\n  /** Additional class name */\n  className?: string;\n}\n\n/**\n * AISteps displays a multi-step progress indicator for AI workflows.\n * Shows step status (pending, running, complete, error) with expandable details and timing.\n *\n * @llms Multi-step AI progress with status icons, timing, expandable details\n * @example\n * ```tsx\n * <AISteps\n *   title=\"Processing\"\n *   steps={[\n *     { label: 'Analyzing', status: 'complete', duration: '2s' },\n *     { label: 'Generating', status: 'running' },\n *   ]}\n * />\n * ```\n */\nexport function AISteps({\n  steps,\n  title,\n  variant,\n  collapsible = true,\n  defaultExpanded = true,\n  stepsExpandable = true,\n  className,\n}: AIStepsProps) {\n  const [isExpanded, setIsExpanded] = React.useState(defaultExpanded);\n  const prefersReducedMotion = useReducedMotion();\n\n  // Calculate summary stats\n  const completedCount = steps.filter((s) => s.status === 'completed').length;\n  const totalCount = steps.length;\n  const hasError = steps.some((s) => s.status === 'error');\n  const isRunning = steps.some((s) => s.status === 'running');\n\n  return (\n    <section\n      data-slot=\"ai-steps\"\n      aria-label={title || 'Steps'}\n      className={cn(stepsContainerVariants({ variant }), className)}\n    >\n      {/* Header */}\n      {(title || collapsible) && (\n        <button\n          type=\"button\"\n          onClick={() => collapsible && setIsExpanded(!isExpanded)}\n          disabled={!collapsible}\n          aria-expanded={collapsible ? isExpanded : undefined}\n          className={cn(\n            'flex items-center justify-between w-full px-4 py-3 border-b border-border',\n            collapsible && 'hover:bg-muted cursor-pointer',\n            'focus-visible:outline-2 focus-visible:outline-offset-[-2px] focus-visible:outline-ring',\n          )}\n        >\n          <div className=\"flex items-center gap-2\">\n            {isRunning && (\n              <Clock className=\"size-4 text-primary animate-pulse motion-reduce:animate-none\" />\n            )}\n            {hasError && !isRunning && (\n              <AlertCircle className=\"size-4 text-destructive\" />\n            )}\n            {!isRunning && !hasError && completedCount === totalCount && (\n              <Check className=\"size-4 text-success\" />\n            )}\n            <span className=\"text-sm font-medium text-foreground\">\n              {title || 'Steps'}\n            </span>\n            <span className=\"text-xs text-text-quaternary\">\n              ({completedCount}/{totalCount})\n            </span>\n          </div>\n\n          {collapsible && (\n            <div className=\"shrink-0\">\n              {isExpanded ? (\n                <ChevronDown className=\"size-4 text-muted-foreground\" />\n              ) : (\n                <ChevronRight className=\"size-4 text-muted-foreground rtl:rotate-180\" />\n              )}\n            </div>\n          )}\n        </button>\n      )}\n\n      {/* Steps List */}\n      <AnimatePresence initial={false}>\n        {isExpanded && (\n          <motion.div\n            initial={{ height: 0, opacity: 0 }}\n            animate={{ height: 'auto', opacity: 1 }}\n            exit={{ height: 0, opacity: 0 }}\n            transition={{ duration: prefersReducedMotion ? 0 : 0.2 }}\n            className=\"overflow-hidden\"\n          >\n            <WorkflowStepRenderer\n              appearance=\"contained\"\n              steps={steps.map(toWorkflowStep)}\n              itemSlot=\"ai-step-item\"\n              expandable={stepsExpandable}\n            />\n          </motion.div>\n        )}\n      </AnimatePresence>\n    </section>\n  );\n}\n\nAISteps.displayName = 'AISteps';\n\nexport {\n  AIStepItem,\n  StepIcon,\n  stepIconVariants,\n  stepItemVariants,\n  stepsContainerVariants,\n};\n","/**\n * Web Component wrapper for AISteps\n * Custom element: <hf-ai-steps>\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 { AISteps } from '../components/organisms/ai/AISteps';\nimport { parseAttr, parseValue, type PropDefs } from './_shared';\n\n/**\n * Prop type definitions for attribute parsing\n */\nconst propTypes: PropDefs = {\n    variant: 'string',\n    steps: 'json',\n    title: 'string',\n    collapsible: 'boolean',\n    defaultExpanded: 'boolean',\n    stepsExpandable: 'boolean',\n    className: 'string'\n};\n\nclass AIStepsWC 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      AISteps,\n      props,\n    );\n\n    this._root.render(element);\n  }\n}\n\nfor (const propName of Object.keys(propTypes)) {\n  Object.defineProperty(AIStepsWC.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-ai-steps')) {\n  customElements.define('hf-ai-steps', AIStepsWC);\n}\n\nexport { AIStepsWC };\nexport default AIStepsWC;\n"],"mappings":"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"}
+{"version":3,"file":"hf-ai-steps.js","names":[],"sources":["../../src/components/organisms/ai/AISteps/AISteps.tsx","../../src/wc/hf-ai-steps.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport {\n  AlertCircle,\n  Check,\n  ChevronDown,\n  ChevronRight,\n  Clock,\n} from 'lucide-react';\nimport { AnimatePresence, motion, useReducedMotion } from 'motion/react';\nimport * as React from 'react';\nimport { cn } from '@/lib/utils';\nimport {\n  WorkflowStepItem,\n  WorkflowStepRenderer,\n  type WorkflowStepStatus,\n  WorkflowStepStatusIcon,\n  type WorkflowStepViewModel,\n} from '../_shared/workflow-step-renderer';\n\n// =============================================================================\n// Variants\n// =============================================================================\n\nconst stepsContainerVariants = cva('overflow-hidden rounded-xl border', {\n  variants: {\n    variant: {\n      default: 'border-border bg-background',\n      subtle: 'border-border bg-muted',\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\nconst stepItemVariants = cva(\n  'flex items-start gap-3 px-4 py-3 transition-colors',\n  {\n    variants: {\n      status: {\n        pending: 'text-secondary-foreground',\n        running: 'text-primary',\n        completed: 'text-success',\n        error: 'text-destructive',\n      },\n    },\n    defaultVariants: {\n      status: 'pending',\n    },\n  },\n);\n\nconst stepIconVariants = cva(\n  'size-5 shrink-0 flex items-center justify-center rounded-full',\n  {\n    variants: {\n      status: {\n        pending: 'bg-accent text-muted-foreground',\n        running: 'bg-primary/20 text-primary',\n        completed: 'bg-success/20 text-success',\n        error: 'bg-destructive/20 text-destructive',\n      },\n    },\n    defaultVariants: {\n      status: 'pending',\n    },\n  },\n);\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport type StepStatus = 'pending' | 'running' | 'completed' | 'error';\n\nexport interface StepData {\n  /** Unique step ID */\n  id: string;\n  /** Step title */\n  title: string;\n  /** Step description */\n  description?: string;\n  /** Step status */\n  status: StepStatus;\n  /** Optional content to show when expanded */\n  content?: React.ReactNode;\n  /** Duration in ms (for completed steps) */\n  duration?: number;\n  /** Error message if status is error */\n  error?: string;\n}\n\ntype AIStepsWorkflowStatus = Exclude<WorkflowStepStatus, 'suspended'>;\n\nconst WORKFLOW_STATUS_BY_STEP_STATUS = {\n  pending: 'pending',\n  running: 'running',\n  completed: 'completed',\n  error: 'error',\n} as const satisfies Record<StepStatus, AIStepsWorkflowStatus>;\n\nfunction toWorkflowStepStatus(status: StepStatus): AIStepsWorkflowStatus {\n  return WORKFLOW_STATUS_BY_STEP_STATUS[status];\n}\n\nfunction toWorkflowStep(step: StepData): WorkflowStepViewModel {\n  const error = step.error?.trim() ? step.error : undefined;\n\n  return {\n    id: step.id,\n    title: step.title,\n    description: step.description,\n    status: toWorkflowStepStatus(step.status),\n    content: error === undefined ? step.content : undefined,\n    durationMs: step.status === 'completed' ? step.duration : undefined,\n    error,\n  };\n}\n\n// =============================================================================\n// Step Icon Component\n// =============================================================================\n\ninterface StepIconProps {\n  status: StepStatus;\n  index: number;\n  className?: string;\n}\n\nfunction StepIcon({ status, index, className }: StepIconProps) {\n  return (\n    <WorkflowStepStatusIcon\n      status={toWorkflowStepStatus(status)}\n      index={index}\n      className={className}\n    />\n  );\n}\n\nStepIcon.displayName = 'StepIcon';\n\n// =============================================================================\n// Single Step Item\n// =============================================================================\n\ninterface AIStepItemProps {\n  step: StepData;\n  index: number;\n  isLast: boolean;\n  expandable?: boolean;\n  defaultExpanded?: boolean;\n}\n\nfunction AIStepItem({\n  step,\n  index,\n  isLast,\n  expandable = true,\n  defaultExpanded = false,\n}: AIStepItemProps) {\n  const [expanded, setExpanded] = React.useState(defaultExpanded);\n\n  return (\n    <WorkflowStepItem\n      step={toWorkflowStep(step)}\n      index={index}\n      isLast={isLast}\n      appearance=\"contained\"\n      itemSlot=\"ai-step-item\"\n      expandable={expandable}\n      expanded={expanded}\n      onExpandedChange={() => setExpanded((value) => !value)}\n    />\n  );\n}\n\nAIStepItem.displayName = 'AIStepItem';\n\n// =============================================================================\n// Main AISteps Component\n// =============================================================================\n\nexport interface AIStepsProps\n  extends VariantProps<typeof stepsContainerVariants> {\n  /** Array of steps */\n  steps: StepData[];\n  /** Title for the steps container */\n  title?: string;\n  /** Whether the container is collapsible */\n  collapsible?: boolean;\n  /** Whether the container is expanded by default */\n  defaultExpanded?: boolean;\n  /** Whether individual steps are expandable */\n  stepsExpandable?: boolean;\n  /** Additional class name */\n  className?: string;\n}\n\n/**\n * AISteps displays a multi-step progress indicator for AI workflows.\n * Shows step status (pending, running, complete, error) with expandable details and timing.\n *\n * @llms Multi-step AI progress with status icons, timing, expandable details\n * @example\n * ```tsx\n * <AISteps\n *   title=\"Processing\"\n *   steps={[\n *     { label: 'Analyzing', status: 'complete', duration: '2s' },\n *     { label: 'Generating', status: 'running' },\n *   ]}\n * />\n * ```\n */\nexport function AISteps({\n  steps,\n  title,\n  variant,\n  collapsible = true,\n  defaultExpanded = true,\n  stepsExpandable = true,\n  className,\n}: AIStepsProps) {\n  const [isExpanded, setIsExpanded] = React.useState(defaultExpanded);\n  const prefersReducedMotion = useReducedMotion();\n\n  // Calculate summary stats\n  const completedCount = steps.filter((s) => s.status === 'completed').length;\n  const totalCount = steps.length;\n  const hasError = steps.some((s) => s.status === 'error');\n  const isRunning = steps.some((s) => s.status === 'running');\n\n  return (\n    <section\n      data-slot=\"ai-steps\"\n      aria-label={title || 'Steps'}\n      className={cn(stepsContainerVariants({ variant }), className)}\n    >\n      {/* Header */}\n      {(title || collapsible) && (\n        <button\n          type=\"button\"\n          onClick={() => collapsible && setIsExpanded(!isExpanded)}\n          disabled={!collapsible}\n          aria-expanded={collapsible ? isExpanded : undefined}\n          className={cn(\n            'flex items-center justify-between w-full px-4 py-3 border-b border-border',\n            collapsible && 'hover:bg-muted cursor-pointer',\n            'focus-visible:outline-2 focus-visible:outline-offset-[-2px] focus-visible:outline-ring',\n          )}\n        >\n          <div className=\"flex items-center gap-2\">\n            {isRunning && (\n              <Clock className=\"size-4 text-primary animate-pulse motion-reduce:animate-none\" />\n            )}\n            {hasError && !isRunning && (\n              <AlertCircle className=\"size-4 text-destructive\" />\n            )}\n            {!isRunning && !hasError && completedCount === totalCount && (\n              <Check className=\"size-4 text-success\" />\n            )}\n            <span className=\"text-sm font-medium text-foreground\">\n              {title || 'Steps'}\n            </span>\n            <span className=\"text-xs text-secondary-foreground\">\n              ({completedCount}/{totalCount})\n            </span>\n          </div>\n\n          {collapsible && (\n            <div className=\"shrink-0\">\n              {isExpanded ? (\n                <ChevronDown className=\"size-4 text-muted-foreground\" />\n              ) : (\n                <ChevronRight className=\"size-4 text-muted-foreground rtl:rotate-180\" />\n              )}\n            </div>\n          )}\n        </button>\n      )}\n\n      {/* Steps List */}\n      <AnimatePresence initial={false}>\n        {isExpanded && (\n          <motion.div\n            initial={{ height: 0, opacity: 0 }}\n            animate={{ height: 'auto', opacity: 1 }}\n            exit={{ height: 0, opacity: 0 }}\n            transition={{ duration: prefersReducedMotion ? 0 : 0.2 }}\n            className=\"overflow-hidden\"\n          >\n            <WorkflowStepRenderer\n              appearance=\"contained\"\n              steps={steps.map(toWorkflowStep)}\n              itemSlot=\"ai-step-item\"\n              expandable={stepsExpandable}\n            />\n          </motion.div>\n        )}\n      </AnimatePresence>\n    </section>\n  );\n}\n\nAISteps.displayName = 'AISteps';\n\nexport {\n  AIStepItem,\n  StepIcon,\n  stepIconVariants,\n  stepItemVariants,\n  stepsContainerVariants,\n};\n","/**\n * Web Component wrapper for AISteps\n * Custom element: <hf-ai-steps>\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 { AISteps } from '../components/organisms/ai/AISteps';\nimport { parseAttr, parseValue, type PropDefs } from './_shared';\n\n/**\n * Prop type definitions for attribute parsing\n */\nconst propTypes: PropDefs = {\n    variant: 'string',\n    steps: 'json',\n    title: 'string',\n    collapsible: 'boolean',\n    defaultExpanded: 'boolean',\n    stepsExpandable: 'boolean',\n    className: 'string'\n};\n\nclass AIStepsWC 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      AISteps,\n      props,\n    );\n\n    this._root.render(element);\n  }\n}\n\nfor (const propName of Object.keys(propTypes)) {\n  Object.defineProperty(AIStepsWC.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-ai-steps')) {\n  customElements.define('hf-ai-steps', AIStepsWC);\n}\n\nexport { AIStepsWC };\nexport default AIStepsWC;\n"],"mappings":";;;;;;;;;;;;;;;AAuBA,IAAM,IAAyB,EAAI,qCAAqC;AAAA,EACtE,UAAU,EACR,SAAS;AAAA,IACP,SAAS;AAAA,IACT,QAAQ;AAAA,EACV,EACF;AAAA,EACA,iBAAiB,EACf,SAAS,UACX;AACF,CAAC,GAEK,KAAmB,EACvB,sDACA;AAAA,EACE,UAAU,EACR,QAAQ;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,IACT,WAAW;AAAA,IACX,OAAO;AAAA,EACT,EACF;AAAA,EACA,iBAAiB,EACf,QAAQ,UACV;AACF,CACF,GAEM,KAAmB,EACvB,iEACA;AAAA,EACE,UAAU,EACR,QAAQ;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,IACT,WAAW;AAAA,IACX,OAAO;AAAA,EACT,EACF;AAAA,EACA,iBAAiB,EACf,QAAQ,UACV;AACF,CACF,GA2BM,IAAiC;AAAA,EACrC,SAAS;AAAA,EACT,SAAS;AAAA,EACT,WAAW;AAAA,EACX,OAAO;AACT;AAEA,SAAS,EAAqB,GAA2C;AACvE,SAAO,EAA+B,CAAA;AACxC;AAEA,SAAS,EAAe,GAAuC;AAC7D,QAAM,IAAQ,EAAK,OAAO,KAAK,IAAI,EAAK,QAAQ;AAEhD,SAAO;AAAA,IACL,IAAI,EAAK;AAAA,IACT,OAAO,EAAK;AAAA,IACZ,aAAa,EAAK;AAAA,IAClB,QAAQ,EAAqB,EAAK,MAAM;AAAA,IACxC,SAAS,MAAU,SAAY,EAAK,UAAU;AAAA,IAC9C,YAAY,EAAK,WAAW,cAAc,EAAK,WAAW;AAAA,IAC1D,OAAA;AAAA,EACF;AACF;AAYA,SAAS,EAAS,EAAE,QAAA,GAAQ,OAAA,GAAO,WAAA,EAAA,GAA4B;AAC7D,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,QAAQ,EAAqB,CAAM;AAAA,IAC5B,OAAA;AAAA,IACI,WAAA;AAAA,EACZ,CAAA;AAEL;AAEA,EAAS,cAAc;AAcvB,SAAS,EAAW,EAClB,MAAA,GACA,OAAA,GACA,QAAA,GACA,YAAA,IAAa,IACb,iBAAA,IAAkB,GAAA,GACA;AAClB,QAAM,CAAC,GAAU,CAAA,IAAe,EAAM,SAAS,CAAe;AAE9D,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,MAAM,EAAe,CAAI;AAAA,IAClB,OAAA;AAAA,IACC,QAAA;AAAA,IACR,YAAW;AAAA,IACX,UAAS;AAAA,IACG,YAAA;AAAA,IACF,UAAA;AAAA,IACV,kBAAA,MAAwB,EAAA,CAAa,MAAU,CAAC,CAAK;AAAA,EACtD,CAAA;AAEL;AAEA,EAAW,cAAc;AAsCzB,SAAgB,EAAQ,EACtB,OAAA,GACA,OAAA,GACA,SAAA,GACA,aAAA,IAAc,IACd,iBAAA,IAAkB,IAClB,iBAAA,IAAkB,IAClB,WAAA,EAAA,GACe;AACf,QAAM,CAAC,GAAY,CAAA,IAAiB,EAAM,SAAS,CAAe,GAC5D,IAAuB,EAAiB,GAGxC,IAAiB,EAAM,OAAA,CAAQ,MAAM,EAAE,WAAW,WAAW,EAAE,QAC/D,IAAa,EAAM,QACnB,IAAW,EAAM,KAAA,CAAM,MAAM,EAAE,WAAW,OAAO,GACjD,IAAY,EAAM,KAAA,CAAM,MAAM,EAAE,WAAW,SAAS;AAE1D,SACE,gBAAA,EAAC,WAAD;AAAA,IACE,aAAU;AAAA,IACV,cAAY,KAAS;AAAA,IACrB,WAAW,EAAG,EAAuB,EAAE,SAAA,EAAQ,CAAC,GAAG,CAAS;AAAA,cAH9D,EAMI,KAAS,MACT,gBAAA,EAAC,UAAD;AAAA,MACE,MAAK;AAAA,MACL,SAAA,MAAe,KAAe,EAAc,CAAC,CAAU;AAAA,MACvD,UAAU,CAAC;AAAA,MACX,iBAAe,IAAc,IAAa;AAAA,MAC1C,WAAW,EACT,6EACA,KAAe,iCACf,wFACF;AAAA,gBATF,CAWE,gBAAA,EAAC,OAAD;AAAA,QAAK,WAAU;AAAA,kBAAf;AAAA,UACG,KACC,gBAAA,EAAC,GAAD,EAAO,WAAU,+DAAgE,CAAA;AAAA,UAElF,KAAY,CAAC,KACZ,gBAAA,EAAC,GAAD,EAAa,WAAU,0BAA2B,CAAA;AAAA,UAEnD,CAAC,KAAa,CAAC,KAAY,MAAmB,KAC7C,gBAAA,EAAC,GAAD,EAAO,WAAU,sBAAuB,CAAA;AAAA,UAE1C,gBAAA,EAAC,QAAD;AAAA,YAAM,WAAU;AAAA,sBACb,KAAS;AAAA,UACN,CAAA;AAAA,UACN,gBAAA,EAAC,QAAD;AAAA,YAAM,WAAU;AAAA,sBAAhB;AAAA,cAAoD;AAAA,cAChD;AAAA,cAAe;AAAA,cAAE;AAAA,cAAW;AAAA,YAC1B;AAAA;QACH;AAAA,UAEJ,KACC,gBAAA,EAAC,OAAD;AAAA,QAAK,WAAU;AAAA,kBACZ,IACC,gBAAA,EAAC,GAAD,EAAa,WAAU,+BAAgC,CAAA,IAEvD,gBAAA,EAAC,GAAD,EAAc,WAAU,8CAA+C,CAAA;AAAA,MAEtE,CAAA,CAED;AAAA,QAIV,gBAAA,EAAC,GAAD;AAAA,MAAiB,SAAS;AAAA,gBACvB,KACC,gBAAA,EAAC,EAAO,KAAR;AAAA,QACE,SAAS;AAAA,UAAE,QAAQ;AAAA,UAAG,SAAS;AAAA,QAAE;AAAA,QACjC,SAAS;AAAA,UAAE,QAAQ;AAAA,UAAQ,SAAS;AAAA,QAAE;AAAA,QACtC,MAAM;AAAA,UAAE,QAAQ;AAAA,UAAG,SAAS;AAAA,QAAE;AAAA,QAC9B,YAAY,EAAE,UAAU,IAAuB,IAAI,IAAI;AAAA,QACvD,WAAU;AAAA,kBAEV,gBAAA,EAAC,GAAD;AAAA,UACE,YAAW;AAAA,UACX,OAAO,EAAM,IAAI,CAAc;AAAA,UAC/B,UAAS;AAAA,UACT,YAAY;AAAA,QACb,CAAA;AAAA,MACS,CAAA;AAAA,IAEC,CAAA,CACV;AAAA;AAEb;AAEA,EAAQ,cAAc;AChStB,IAAM,IAAsB;AAAA,EACxB,SAAS;AAAA,EACT,OAAO;AAAA,EACP,OAAO;AAAA,EACP,aAAa;AAAA,EACb,iBAAiB;AAAA,EACjB,iBAAiB;AAAA,EACjB,WAAW;AACf,GAEM,IAAN,cAAwB,YAAY;AAAA,EAClC,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,EAAW,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,MAAO;AAEjB,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,GACA,CACF;AAEA,SAAK,MAAM,OAAO,CAAO;AAAA,EAC3B;AACF;AAEA,WAAW,KAAY,OAAO,KAAK,CAAS,EAC1C,QAAO,eAAe,EAAU,WAAW,GAAU;AAAA,EACnD,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,aAAa,KAC5E,eAAe,OAAO,eAAe,CAAS"}

package/dist/wc-react/hf-ai-system-message.js

@@ -38,7 +38,7 @@ var S = x("flex items-start gap-3 px-4 py-3 rounded-xl border", {
       success: "text-success",
       warning: "text-warning",
       error: "text-destructive",
-      neutral: "text-text-quaternary"
+      neutral: "text-muted-foreground"
     },
     size: {
       sm: "size-4",
@@ -57,7 +57,7 @@ var S = x("flex items-start gap-3 px-4 py-3 rounded-xl border", {
   error: k,
   neutral: y
 };
-function w({ children: t, title: e, variant: s = "info", size: r = "md", dismissible: n = !1, onDismiss: d, icon: p, hideIcon: u = !1, actions: a, className: h }) {
+function w({ children: t, title: e, variant: s = "info", size: r = "md", dismissible: n = !1, onDismiss: d, icon: u, hideIcon: p = !1, actions: a, className: h }) {
   const [f, z] = v.useState(!0), A = () => {
     z(!1), d?.();
   }, I = N[s || "info"];
@@ -93,13 +93,13 @@ function w({ children: t, title: e, variant: s = "info", size: r = "md", dismiss
       size: r
     }), "motion-reduce:transition-none", h),
     children: [
-      !u && /* @__PURE__ */ i("div", {
+      !p && /* @__PURE__ */ i("div", {
         className: P({
           variant: s,
           size: r
         }),
         "aria-hidden": "true",
-        children: p || /* @__PURE__ */ i(I, { className: "size-full" })
+        children: u || /* @__PURE__ */ i(I, { className: "size-full" })
       }),
       /* @__PURE__ */ m("div", {
         className: "flex-1 min-w-0",
@@ -131,11 +131,11 @@ function w({ children: t, title: e, variant: s = "info", size: r = "md", dismiss
   }) });
 }
 w.displayName = "AISystemMessage";
-function B({ children: t, variant: e = "info", dismissible: s = !1, onDismiss: r, icon: n, action: d, className: p }) {
-  const [u, a] = v.useState(!0), h = () => {
+function B({ children: t, variant: e = "info", dismissible: s = !1, onDismiss: r, icon: n, action: d, className: u }) {
+  const [p, a] = v.useState(!0), h = () => {
     a(!1), r?.();
   }, f = N[e || "info"];
-  return /* @__PURE__ */ i(C, { children: u && /* @__PURE__ */ m(_.div, {
+  return /* @__PURE__ */ i(C, { children: p && /* @__PURE__ */ m(_.div, {
     "data-slot": "ai-system-message-banner",
     role: "status",
     "aria-live": "polite",
@@ -160,13 +160,13 @@ function B({ children: t, variant: e = "info", dismissible: s = !1, onDismiss: r
         1
       ]
     },
-    className: c("w-full px-4 py-2 flex items-center justify-center gap-3 motion-reduce:transition-none", e === "info" && "bg-primary/10 text-primary", e === "success" && "bg-success/10 text-success", e === "warning" && "bg-warning/10 text-warning", e === "error" && "bg-destructive/10 text-destructive", e === "neutral" && "bg-muted text-secondary-foreground", p),
+    className: c("w-full px-4 py-2 flex items-center justify-center gap-3 motion-reduce:transition-none", e === "info" && "bg-primary/10 text-primary", e === "success" && "bg-success/10 text-success", e === "warning" && "bg-warning/10 text-warning", e === "error" && "bg-destructive/10 text-destructive", e === "neutral" && "bg-muted text-secondary-foreground", u),
     children: [/* @__PURE__ */ m("div", {
       className: "flex items-center gap-2 flex-1 justify-center",
       children: [
         n || /* @__PURE__ */ i(f, {
           "aria-hidden": "true",
-          className: c("size-4 shrink-0", e === "info" && "text-primary", e === "success" && "text-success", e === "warning" && "text-warning", e === "error" && "text-destructive", e === "neutral" && "text-text-quaternary")
+          className: c("size-4 shrink-0", e === "info" && "text-primary", e === "success" && "text-success", e === "warning" && "text-warning", e === "error" && "text-destructive", e === "neutral" && "text-muted-foreground")
         }),
         /* @__PURE__ */ i("span", {
           className: "text-sm",

package/dist/wc-react/hf-ai-system-message.js.map

@@ -1 +1 @@
-{"version":3,"file":"hf-ai-system-message.js","names":[],"sources":["../../src/components/organisms/ai/AISystemMessage/AISystemMessage.tsx","../../src/wc/hf-ai-system-message.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport { AlertCircle, AlertTriangle, CheckCircle, Info, X } from 'lucide-react';\nimport { AnimatePresence, motion } from 'motion/react';\nimport * as React from 'react';\nimport { Button } from '@/components/atoms/buttons/Button';\nimport { cn } from '@/lib/utils';\n\n// =============================================================================\n// Variants\n// =============================================================================\n\nconst systemMessageVariants = cva(\n  'flex items-start gap-3 px-4 py-3 rounded-xl border',\n  {\n    variants: {\n      variant: {\n        info: 'bg-primary/10 border-primary text-primary',\n        success: 'bg-success/10 border-success/50 text-success',\n        warning: 'bg-warning/10 border-warning/50 text-warning',\n        error: 'bg-destructive/10 border-destructive/50 text-destructive',\n        neutral: 'bg-muted border-border text-secondary-foreground',\n      },\n      size: {\n        sm: 'px-3 py-2 text-xs',\n        md: 'px-4 py-3 text-sm',\n        lg: 'px-5 py-4 text-base',\n      },\n    },\n    defaultVariants: {\n      variant: 'info',\n      size: 'md',\n    },\n  },\n);\n\nconst systemMessageIconVariants = cva('shrink-0 mt-0.5', {\n  variants: {\n    variant: {\n      info: 'text-primary',\n      success: 'text-success',\n      warning: 'text-warning',\n      error: 'text-destructive',\n      neutral: 'text-text-quaternary',\n    },\n    size: {\n      sm: 'size-4',\n      md: 'size-5',\n      lg: 'size-6',\n    },\n  },\n  defaultVariants: {\n    variant: 'info',\n    size: 'md',\n  },\n});\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport type SystemMessageVariant =\n  | 'info'\n  | 'success'\n  | 'warning'\n  | 'error'\n  | 'neutral';\n\n// =============================================================================\n// Icon Map\n// =============================================================================\n\nconst iconMap = {\n  info: Info,\n  success: CheckCircle,\n  warning: AlertTriangle,\n  error: AlertCircle,\n  neutral: Info,\n};\n\n// =============================================================================\n// Main AISystemMessage Component\n// =============================================================================\n\nexport interface AISystemMessageProps\n  extends VariantProps<typeof systemMessageVariants> {\n  /** Message content */\n  children: React.ReactNode;\n  /** Title for the message */\n  title?: string;\n  /** Whether the message can be dismissed */\n  dismissible?: boolean;\n  /** Callback when dismissed */\n  onDismiss?: () => void;\n  /** Custom icon */\n  icon?: React.ReactNode;\n  /** Hide the icon */\n  hideIcon?: boolean;\n  /** Actions to display */\n  actions?: React.ReactNode;\n  /** Additional class name */\n  className?: string;\n}\n\nfunction AISystemMessage({\n  children,\n  title,\n  variant = 'info',\n  size = 'md',\n  dismissible = false,\n  onDismiss,\n  icon,\n  hideIcon = false,\n  actions,\n  className,\n}: AISystemMessageProps) {\n  const [isVisible, setIsVisible] = React.useState(true);\n\n  const handleDismiss = () => {\n    setIsVisible(false);\n    onDismiss?.();\n  };\n\n  const IconComponent = iconMap[variant || 'info'];\n\n  return (\n    <AnimatePresence>\n      {isVisible && (\n        <motion.div\n          data-slot=\"ai-system-message\"\n          role=\"status\"\n          aria-live=\"polite\"\n          initial={{ opacity: 0, y: -10 }}\n          animate={{ opacity: 1, y: 0 }}\n          exit={{ opacity: 0, y: -10, height: 0, marginBottom: 0 }}\n          transition={{ duration: 0.2, ease: [0.4, 0, 0.2, 1] }}\n          className={cn(\n            systemMessageVariants({ variant, size }),\n            'motion-reduce:transition-none',\n            className,\n          )}\n        >\n          {/* Icon */}\n          {!hideIcon && (\n            <div\n              className={systemMessageIconVariants({ variant, size })}\n              aria-hidden=\"true\"\n            >\n              {icon || <IconComponent className=\"size-full\" />}\n            </div>\n          )}\n\n          {/* Content */}\n          <div className=\"flex-1 min-w-0\">\n            {title && <p className=\"font-medium mb-0.5\">{title}</p>}\n            <div className={cn(!title && 'leading-snug')}>{children}</div>\n\n            {/* Actions */}\n            {actions && (\n              <div className=\"flex items-center gap-2 mt-2\">{actions}</div>\n            )}\n          </div>\n\n          {/* Dismiss button */}\n          {dismissible && (\n            <Button\n              appearance=\"ghost\"\n              variant=\"secondary\"\n              size=\"sm\"\n              onClick={handleDismiss}\n              aria-label=\"Dismiss message\"\n              className=\"size-6 p-0 shrink-0 -mt-0.5 -me-1 hover:bg-foreground/5\"\n            >\n              <X className=\"size-4\" />\n            </Button>\n          )}\n        </motion.div>\n      )}\n    </AnimatePresence>\n  );\n}\n\nAISystemMessage.displayName = 'AISystemMessage';\n\n// =============================================================================\n// System Message Banner (Full-width variant)\n// =============================================================================\n\nexport interface AISystemMessageBannerProps\n  extends VariantProps<typeof systemMessageVariants> {\n  /** Message content */\n  children: React.ReactNode;\n  /** Whether the banner can be dismissed */\n  dismissible?: boolean;\n  /** Callback when dismissed */\n  onDismiss?: () => void;\n  /** Custom icon */\n  icon?: React.ReactNode;\n  /** Action button */\n  action?: React.ReactNode;\n  /** Additional class name */\n  className?: string;\n}\n\nfunction AISystemMessageBanner({\n  children,\n  variant = 'info',\n  dismissible = false,\n  onDismiss,\n  icon,\n  action,\n  className,\n}: AISystemMessageBannerProps) {\n  const [isVisible, setIsVisible] = React.useState(true);\n\n  const handleDismiss = () => {\n    setIsVisible(false);\n    onDismiss?.();\n  };\n\n  const IconComponent = iconMap[variant || 'info'];\n\n  return (\n    <AnimatePresence>\n      {isVisible && (\n        <motion.div\n          data-slot=\"ai-system-message-banner\"\n          role=\"status\"\n          aria-live=\"polite\"\n          initial={{ opacity: 0, height: 0 }}\n          animate={{ opacity: 1, height: 'auto' }}\n          exit={{ opacity: 0, height: 0 }}\n          transition={{ duration: 0.2, ease: [0.4, 0, 0.2, 1] }}\n          className={cn(\n            'w-full px-4 py-2 flex items-center justify-center gap-3 motion-reduce:transition-none',\n            variant === 'info' && 'bg-primary/10 text-primary',\n            variant === 'success' && 'bg-success/10 text-success',\n            variant === 'warning' && 'bg-warning/10 text-warning',\n            variant === 'error' && 'bg-destructive/10 text-destructive',\n            variant === 'neutral' && 'bg-muted text-secondary-foreground',\n            className,\n          )}\n        >\n          <div className=\"flex items-center gap-2 flex-1 justify-center\">\n            {icon || (\n              <IconComponent\n                aria-hidden=\"true\"\n                className={cn(\n                  'size-4 shrink-0',\n                  variant === 'info' && 'text-primary',\n                  variant === 'success' && 'text-success',\n                  variant === 'warning' && 'text-warning',\n                  variant === 'error' && 'text-destructive',\n                  variant === 'neutral' && 'text-text-quaternary',\n                )}\n              />\n            )}\n            <span className=\"text-sm\">{children}</span>\n            {action}\n          </div>\n\n          {dismissible && (\n            <button\n              type=\"button\"\n              onClick={handleDismiss}\n              aria-label=\"Dismiss banner\"\n              className=\"p-1 rounded hover:bg-foreground/5 transition-colors focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring\"\n            >\n              <X className=\"size-4\" />\n            </button>\n          )}\n        </motion.div>\n      )}\n    </AnimatePresence>\n  );\n}\n\nAISystemMessageBanner.displayName = 'AISystemMessageBanner';\n\nexport {\n  AISystemMessage,\n  AISystemMessageBanner,\n  systemMessageIconVariants,\n  systemMessageVariants,\n};\n","/**\n * Web Component wrapper for AISystemMessage\n * Custom element: <hf-ai-system-message>\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 { AISystemMessage } from '../components/organisms/ai/AISystemMessage';\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    onDismiss: (value: unknown) => {\n      const CustomEventConstructor =\n        element.ownerDocument.defaultView?.CustomEvent ?? CustomEvent;\n      element.dispatchEvent(new CustomEventConstructor('dismiss', {\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 AISystemMessageWrapper(props: React.ComponentProps<typeof AISystemMessage> & { _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(AISystemMessage, { ...restProps, ...eventHandlers });\n}\n\n/**\n * Prop type definitions for attribute parsing\n */\nconst propTypes: PropDefs = {\n    variant: 'string',\n    size: 'string',\n    title: 'string',\n    dismissible: 'boolean',\n    icon: 'json',\n    hideIcon: 'boolean',\n    actions: 'json',\n    className: 'string'\n};\n\nclass AISystemMessageWC 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      AISystemMessageWrapper,\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(AISystemMessageWC.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-ai-system-message')) {\n  customElements.define('hf-ai-system-message', AISystemMessageWC);\n}\n\nexport { AISystemMessageWC };\nexport default AISystemMessageWC;\n"],"mappings":"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"}
+{"version":3,"file":"hf-ai-system-message.js","names":[],"sources":["../../src/components/organisms/ai/AISystemMessage/AISystemMessage.tsx","../../src/wc/hf-ai-system-message.ts"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport { AlertCircle, AlertTriangle, CheckCircle, Info, X } from 'lucide-react';\nimport { AnimatePresence, motion } from 'motion/react';\nimport * as React from 'react';\nimport { Button } from '@/components/atoms/buttons/Button';\nimport { cn } from '@/lib/utils';\n\n// =============================================================================\n// Variants\n// =============================================================================\n\nconst systemMessageVariants = cva(\n  'flex items-start gap-3 px-4 py-3 rounded-xl border',\n  {\n    variants: {\n      variant: {\n        info: 'bg-primary/10 border-primary text-primary',\n        success: 'bg-success/10 border-success/50 text-success',\n        warning: 'bg-warning/10 border-warning/50 text-warning',\n        error: 'bg-destructive/10 border-destructive/50 text-destructive',\n        neutral: 'bg-muted border-border text-secondary-foreground',\n      },\n      size: {\n        sm: 'px-3 py-2 text-xs',\n        md: 'px-4 py-3 text-sm',\n        lg: 'px-5 py-4 text-base',\n      },\n    },\n    defaultVariants: {\n      variant: 'info',\n      size: 'md',\n    },\n  },\n);\n\nconst systemMessageIconVariants = cva('shrink-0 mt-0.5', {\n  variants: {\n    variant: {\n      info: 'text-primary',\n      success: 'text-success',\n      warning: 'text-warning',\n      error: 'text-destructive',\n      neutral: 'text-muted-foreground',\n    },\n    size: {\n      sm: 'size-4',\n      md: 'size-5',\n      lg: 'size-6',\n    },\n  },\n  defaultVariants: {\n    variant: 'info',\n    size: 'md',\n  },\n});\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport type SystemMessageVariant =\n  | 'info'\n  | 'success'\n  | 'warning'\n  | 'error'\n  | 'neutral';\n\n// =============================================================================\n// Icon Map\n// =============================================================================\n\nconst iconMap = {\n  info: Info,\n  success: CheckCircle,\n  warning: AlertTriangle,\n  error: AlertCircle,\n  neutral: Info,\n};\n\n// =============================================================================\n// Main AISystemMessage Component\n// =============================================================================\n\nexport interface AISystemMessageProps\n  extends VariantProps<typeof systemMessageVariants> {\n  /** Message content */\n  children: React.ReactNode;\n  /** Title for the message */\n  title?: string;\n  /** Whether the message can be dismissed */\n  dismissible?: boolean;\n  /** Callback when dismissed */\n  onDismiss?: () => void;\n  /** Custom icon */\n  icon?: React.ReactNode;\n  /** Hide the icon */\n  hideIcon?: boolean;\n  /** Actions to display */\n  actions?: React.ReactNode;\n  /** Additional class name */\n  className?: string;\n}\n\nfunction AISystemMessage({\n  children,\n  title,\n  variant = 'info',\n  size = 'md',\n  dismissible = false,\n  onDismiss,\n  icon,\n  hideIcon = false,\n  actions,\n  className,\n}: AISystemMessageProps) {\n  const [isVisible, setIsVisible] = React.useState(true);\n\n  const handleDismiss = () => {\n    setIsVisible(false);\n    onDismiss?.();\n  };\n\n  const IconComponent = iconMap[variant || 'info'];\n\n  return (\n    <AnimatePresence>\n      {isVisible && (\n        <motion.div\n          data-slot=\"ai-system-message\"\n          role=\"status\"\n          aria-live=\"polite\"\n          initial={{ opacity: 0, y: -10 }}\n          animate={{ opacity: 1, y: 0 }}\n          exit={{ opacity: 0, y: -10, height: 0, marginBottom: 0 }}\n          transition={{ duration: 0.2, ease: [0.4, 0, 0.2, 1] }}\n          className={cn(\n            systemMessageVariants({ variant, size }),\n            'motion-reduce:transition-none',\n            className,\n          )}\n        >\n          {/* Icon */}\n          {!hideIcon && (\n            <div\n              className={systemMessageIconVariants({ variant, size })}\n              aria-hidden=\"true\"\n            >\n              {icon || <IconComponent className=\"size-full\" />}\n            </div>\n          )}\n\n          {/* Content */}\n          <div className=\"flex-1 min-w-0\">\n            {title && <p className=\"font-medium mb-0.5\">{title}</p>}\n            <div className={cn(!title && 'leading-snug')}>{children}</div>\n\n            {/* Actions */}\n            {actions && (\n              <div className=\"flex items-center gap-2 mt-2\">{actions}</div>\n            )}\n          </div>\n\n          {/* Dismiss button */}\n          {dismissible && (\n            <Button\n              appearance=\"ghost\"\n              variant=\"secondary\"\n              size=\"sm\"\n              onClick={handleDismiss}\n              aria-label=\"Dismiss message\"\n              className=\"size-6 p-0 shrink-0 -mt-0.5 -me-1 hover:bg-foreground/5\"\n            >\n              <X className=\"size-4\" />\n            </Button>\n          )}\n        </motion.div>\n      )}\n    </AnimatePresence>\n  );\n}\n\nAISystemMessage.displayName = 'AISystemMessage';\n\n// =============================================================================\n// System Message Banner (Full-width variant)\n// =============================================================================\n\nexport interface AISystemMessageBannerProps\n  extends VariantProps<typeof systemMessageVariants> {\n  /** Message content */\n  children: React.ReactNode;\n  /** Whether the banner can be dismissed */\n  dismissible?: boolean;\n  /** Callback when dismissed */\n  onDismiss?: () => void;\n  /** Custom icon */\n  icon?: React.ReactNode;\n  /** Action button */\n  action?: React.ReactNode;\n  /** Additional class name */\n  className?: string;\n}\n\nfunction AISystemMessageBanner({\n  children,\n  variant = 'info',\n  dismissible = false,\n  onDismiss,\n  icon,\n  action,\n  className,\n}: AISystemMessageBannerProps) {\n  const [isVisible, setIsVisible] = React.useState(true);\n\n  const handleDismiss = () => {\n    setIsVisible(false);\n    onDismiss?.();\n  };\n\n  const IconComponent = iconMap[variant || 'info'];\n\n  return (\n    <AnimatePresence>\n      {isVisible && (\n        <motion.div\n          data-slot=\"ai-system-message-banner\"\n          role=\"status\"\n          aria-live=\"polite\"\n          initial={{ opacity: 0, height: 0 }}\n          animate={{ opacity: 1, height: 'auto' }}\n          exit={{ opacity: 0, height: 0 }}\n          transition={{ duration: 0.2, ease: [0.4, 0, 0.2, 1] }}\n          className={cn(\n            'w-full px-4 py-2 flex items-center justify-center gap-3 motion-reduce:transition-none',\n            variant === 'info' && 'bg-primary/10 text-primary',\n            variant === 'success' && 'bg-success/10 text-success',\n            variant === 'warning' && 'bg-warning/10 text-warning',\n            variant === 'error' && 'bg-destructive/10 text-destructive',\n            variant === 'neutral' && 'bg-muted text-secondary-foreground',\n            className,\n          )}\n        >\n          <div className=\"flex items-center gap-2 flex-1 justify-center\">\n            {icon || (\n              <IconComponent\n                aria-hidden=\"true\"\n                className={cn(\n                  'size-4 shrink-0',\n                  variant === 'info' && 'text-primary',\n                  variant === 'success' && 'text-success',\n                  variant === 'warning' && 'text-warning',\n                  variant === 'error' && 'text-destructive',\n                  variant === 'neutral' && 'text-muted-foreground',\n                )}\n              />\n            )}\n            <span className=\"text-sm\">{children}</span>\n            {action}\n          </div>\n\n          {dismissible && (\n            <button\n              type=\"button\"\n              onClick={handleDismiss}\n              aria-label=\"Dismiss banner\"\n              className=\"p-1 rounded hover:bg-foreground/5 transition-colors focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring\"\n            >\n              <X className=\"size-4\" />\n            </button>\n          )}\n        </motion.div>\n      )}\n    </AnimatePresence>\n  );\n}\n\nAISystemMessageBanner.displayName = 'AISystemMessageBanner';\n\nexport {\n  AISystemMessage,\n  AISystemMessageBanner,\n  systemMessageIconVariants,\n  systemMessageVariants,\n};\n","/**\n * Web Component wrapper for AISystemMessage\n * Custom element: <hf-ai-system-message>\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 { AISystemMessage } from '../components/organisms/ai/AISystemMessage';\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    onDismiss: (value: unknown) => {\n      const CustomEventConstructor =\n        element.ownerDocument.defaultView?.CustomEvent ?? CustomEvent;\n      element.dispatchEvent(new CustomEventConstructor('dismiss', {\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 AISystemMessageWrapper(props: React.ComponentProps<typeof AISystemMessage> & { _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(AISystemMessage, { ...restProps, ...eventHandlers });\n}\n\n/**\n * Prop type definitions for attribute parsing\n */\nconst propTypes: PropDefs = {\n    variant: 'string',\n    size: 'string',\n    title: 'string',\n    dismissible: 'boolean',\n    icon: 'json',\n    hideIcon: 'boolean',\n    actions: 'json',\n    className: 'string'\n};\n\nclass AISystemMessageWC 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      AISystemMessageWrapper,\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(AISystemMessageWC.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-ai-system-message')) {\n  customElements.define('hf-ai-system-message', AISystemMessageWC);\n}\n\nexport { AISystemMessageWC };\nexport default AISystemMessageWC;\n"],"mappings":"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"}

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

@@ -16,7 +16,7 @@ var H = g("overflow-hidden rounded-xl bg-background", {
     lg: "text-lg"
   } },
   defaultVariants: { size: "md" }
-}), O = g("select-none font-mono font-bold leading-normal text-text-quaternary", {
+}), O = g("select-none font-mono font-bold leading-normal text-secondary-foreground", {
   variants: { size: {
     sm: "text-xs",
     md: "text-base",
@@ -80,7 +80,7 @@ var y = s.forwardRef(({ code: e, language: t, showLineNumbers: r = !0, startLine
       (t || n) && /* @__PURE__ */ _("div", {
         className: "absolute top-2 end-2 flex items-center gap-2 z-10",
         children: [t && /* @__PURE__ */ o("span", {
-          className: "text-xs font-medium text-text-quaternary uppercase select-none",
+          className: "text-xs font-medium text-secondary-foreground uppercase select-none",
           children: t
         }), n && /* @__PURE__ */ o(S, {
           appearance: "ghost",
@@ -88,7 +88,7 @@ var y = s.forwardRef(({ code: e, language: t, showLineNumbers: r = !0, startLine
           size: "sm",
           onClick: T,
           "aria-label": f ? "Copied to clipboard" : "Copy code to clipboard",
-          className: "h-7 px-2 text-text-quaternary hover:text-secondary-foreground transition-colors duration-150 ease-out",
+          className: "h-7 px-2 text-secondary-foreground hover:text-foreground transition-colors duration-150 ease-out",
           children: f ? /* @__PURE__ */ o(L, { className: "size-3.5 text-success" }) : /* @__PURE__ */ o(R, { className: "size-3.5" })
         })]
       }),