@brycks/core-front 0.3.4 → 0.3.6

package/dist/components/form/TagInput/TagInput.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TagInput.cjs","sources":["../../../../src/components/form/TagInput/TagInput.tsx"],"sourcesContent":["/**\n * TagInput Component\n *\n * An input field for managing tags/chips with keyboard support.\n * Supports suggestions, validation, and custom tag rendering.\n *\n * @module components/form/TagInput\n */\n\nimport {\n  forwardRef,\n  useState,\n  useCallback,\n  useRef,\n  useEffect,\n  type CSSProperties,\n  type ReactNode,\n  type KeyboardEvent,\n  type ChangeEvent,\n} from 'react'\nimport { cx } from '../../../utils/styles'\nimport { spacing, fontSizes, durations, easings } from '../../../design-system'\nimport { componentHeights, componentPaddingX, componentGap } from '../../../design-system/primitives'\n\nexport type TagInputSize = 'sm' | 'md' | 'lg'\n\nexport interface TagItem {\n  /** Unique identifier */\n  id: string\n  /** Display label */\n  label: string\n  /** Optional color */\n  color?: string\n}\n\nexport interface TagInputProps {\n  /** Current tags */\n  value?: TagItem[]\n  /** Default tags (uncontrolled) */\n  defaultValue?: TagItem[]\n  /** Callback when tags change */\n  onChange?: (tags: TagItem[]) => void\n  /** Placeholder text */\n  placeholder?: string\n  /** Component size */\n  size?: TagInputSize\n  /** Maximum number of tags */\n  maxTags?: number\n  /** Whether to allow duplicates */\n  allowDuplicates?: boolean\n  /** Delimiter keys to create tag (default: Enter, comma) */\n  delimiters?: string[]\n  /** Whether the input is disabled */\n  disabled?: boolean\n  /** Whether the input is invalid */\n  isInvalid?: boolean\n  /** Whether the input is read-only */\n  readOnly?: boolean\n  /** Validation function for new tags */\n  validateTag?: (value: string) => boolean | string\n  /** Transform function for new tag value */\n  transformTag?: (value: string) => string\n  /** Suggested tags for autocomplete */\n  suggestions?: TagItem[]\n  /** Custom tag renderer */\n  renderTag?: (tag: TagItem, onRemove: () => void) => ReactNode\n  /** Label for accessibility */\n  'aria-label'?: string\n  /** Custom class name */\n  className?: string\n  /** Test ID */\n  testId?: string\n}\n\nconst sizeConfig: Record<TagInputSize, { height: number; fontSize: number; tagHeight: number; padding: number; gap: number }> = {\n  sm: { height: componentHeights.sm, fontSize: fontSizes.base - 1, tagHeight: spacing[5], padding: componentPaddingX.xs, gap: spacing[1] },\n  md: { height: componentHeights.md, fontSize: fontSizes.base, tagHeight: spacing[6], padding: componentPaddingX.sm, gap: spacing[1.5] },\n  lg: { height: componentHeights.lg, fontSize: fontSizes.md, tagHeight: spacing[7], padding: componentPaddingX.sm, gap: spacing[2] },\n}\n\nfunction CloseIcon() {\n  return (\n    <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" aria-hidden=\"true\">\n      <path d=\"M3 3l6 6M9 3l-6 6\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n    </svg>\n  )\n}\n\nexport const TagInput = forwardRef<HTMLInputElement, TagInputProps>(function TagInput(\n  {\n    value: controlledValue,\n    defaultValue = [],\n    onChange,\n    placeholder = 'Add tags...',\n    size = 'md',\n    maxTags,\n    allowDuplicates = false,\n    delimiters = ['Enter', ','],\n    disabled = false,\n    isInvalid = false,\n    readOnly = false,\n    validateTag,\n    transformTag = (v) => v.trim(),\n    suggestions,\n    renderTag,\n    'aria-label': ariaLabel = 'Tag input',\n    className,\n    testId,\n  },\n  ref\n) {\n  const [internalValue, setInternalValue] = useState<TagItem[]>(defaultValue)\n  const [inputValue, setInputValue] = useState('')\n  const [isFocused, setIsFocused] = useState(false)\n  const [error, setError] = useState<string | null>(null)\n  const [showSuggestions, setShowSuggestions] = useState(false)\n  const [activeSuggestion, setActiveSuggestion] = useState(-1)\n\n  const inputRef = useRef<HTMLInputElement>(null)\n  const containerRef = useRef<HTMLDivElement>(null)\n\n  const tags = controlledValue !== undefined ? controlledValue : internalValue\n  const config = sizeConfig[size]\n\n  const isInteractive = !disabled && !readOnly\n\n  // Filter suggestions\n  const filteredSuggestions = suggestions?.filter(\n    (s) =>\n      s.label.toLowerCase().includes(inputValue.toLowerCase()) &&\n      !tags.some((t) => t.id === s.id)\n  ) || []\n\n  const updateTags = useCallback(\n    (newTags: TagItem[]) => {\n      if (controlledValue === undefined) {\n        setInternalValue(newTags)\n      }\n      onChange?.(newTags)\n    },\n    [controlledValue, onChange]\n  )\n\n  const addTag = useCallback(\n    (value: string) => {\n      const trimmed = transformTag(value)\n      if (!trimmed) return false\n\n      // Check max tags\n      if (maxTags && tags.length >= maxTags) {\n        setError(`Maximum ${maxTags} tags allowed`)\n        return false\n      }\n\n      // Check duplicates\n      if (!allowDuplicates && tags.some((t) => t.label.toLowerCase() === trimmed.toLowerCase())) {\n        setError('Tag already exists')\n        return false\n      }\n\n      // Validate\n      if (validateTag) {\n        const result = validateTag(trimmed)\n        if (result !== true) {\n          setError(typeof result === 'string' ? result : 'Invalid tag')\n          return false\n        }\n      }\n\n      const newTag: TagItem = {\n        id: `tag-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,\n        label: trimmed,\n      }\n\n      updateTags([...tags, newTag])\n      setInputValue('')\n      setError(null)\n      return true\n    },\n    [tags, maxTags, allowDuplicates, validateTag, transformTag, updateTags]\n  )\n\n  const removeTag = useCallback(\n    (tagId: string) => {\n      if (!isInteractive) return\n      updateTags(tags.filter((t) => t.id !== tagId))\n    },\n    [isInteractive, tags, updateTags]\n  )\n\n  const handleInputChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n    const value = e.target.value\n\n    // Check for delimiter in the value\n    if (value.includes(',')) {\n      const parts = value.split(',')\n      parts.forEach((part, index) => {\n        if (index < parts.length - 1 && part.trim()) {\n          addTag(part)\n        }\n      })\n      setInputValue(parts[parts.length - 1])\n    } else {\n      setInputValue(value)\n    }\n\n    setError(null)\n    setShowSuggestions(true)\n    setActiveSuggestion(-1)\n  }, [addTag])\n\n  const handleKeyDown = useCallback(\n    (e: KeyboardEvent<HTMLInputElement>) => {\n      if (!isInteractive) return\n\n      // Handle suggestions navigation\n      if (showSuggestions && filteredSuggestions.length > 0) {\n        if (e.key === 'ArrowDown') {\n          e.preventDefault()\n          setActiveSuggestion((prev) => Math.min(prev + 1, filteredSuggestions.length - 1))\n          return\n        }\n        if (e.key === 'ArrowUp') {\n          e.preventDefault()\n          setActiveSuggestion((prev) => Math.max(prev - 1, 0))\n          return\n        }\n        if ((e.key === 'Enter' || e.key === 'Tab') && activeSuggestion >= 0) {\n          e.preventDefault()\n          const selected = filteredSuggestions[activeSuggestion]\n          if (selected) {\n            updateTags([...tags, selected])\n            setInputValue('')\n            setShowSuggestions(false)\n            setActiveSuggestion(-1)\n          }\n          return\n        }\n      }\n\n      // Create tag on delimiter\n      if (delimiters.includes(e.key) && inputValue) {\n        e.preventDefault()\n        addTag(inputValue)\n        setShowSuggestions(false)\n        return\n      }\n\n      // Remove last tag on backspace\n      if (e.key === 'Backspace' && !inputValue && tags.length > 0) {\n        removeTag(tags[tags.length - 1].id)\n        return\n      }\n\n      // Close suggestions on escape\n      if (e.key === 'Escape') {\n        setShowSuggestions(false)\n        setActiveSuggestion(-1)\n      }\n    },\n    [isInteractive, showSuggestions, filteredSuggestions, activeSuggestion, delimiters, inputValue, tags, addTag, removeTag, updateTags]\n  )\n\n  // Close suggestions on outside click\n  useEffect(() => {\n    if (!showSuggestions) return\n\n    const handleClick = (e: MouseEvent) => {\n      if (!containerRef.current?.contains(e.target as Node)) {\n        setShowSuggestions(false)\n      }\n    }\n\n    document.addEventListener('mousedown', handleClick)\n    return () => document.removeEventListener('mousedown', handleClick)\n  }, [showSuggestions])\n\n  const containerStyle: CSSProperties = {\n    position: 'relative',\n    width: '100%',\n  }\n\n  const wrapperStyle: CSSProperties = {\n    display: 'flex',\n    flexWrap: 'wrap',\n    alignItems: 'center',\n    gap: config.gap,\n    minHeight: config.height,\n    padding: `${spacing[1]}px ${config.padding}px`,\n    backgroundColor: disabled ? 'var(--brycks-background-muted)' : 'var(--brycks-background-default)',\n    border: `1px solid ${\n      isInvalid || error\n        ? 'var(--brycks-error-default)'\n        : isFocused\n        ? 'var(--brycks-primary-default)'\n        : 'var(--brycks-border-default)'\n    }`,\n    borderRadius: 'var(--brycks-radius-md)',\n    transition: `all ${durations.fast}ms ${easings.easeOut}`,\n    cursor: disabled ? 'not-allowed' : 'text',\n    boxShadow: isFocused ? 'var(--brycks-focus-ring)' : undefined,\n  }\n\n  const tagStyle = (tag: TagItem): CSSProperties => ({\n    display: 'inline-flex',\n    alignItems: 'center',\n    gap: spacing[1],\n    height: config.tagHeight,\n    padding: `0 ${spacing[2]}px`,\n    fontSize: config.fontSize - 1,\n    fontWeight: 500,\n    color: tag.color ? 'white' : 'var(--brycks-foreground-default)',\n    backgroundColor: tag.color || 'var(--brycks-background-muted)',\n    borderRadius: 'var(--brycks-radius-full)',\n    whiteSpace: 'nowrap',\n  })\n\n  const removeButtonStyle: CSSProperties = {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: spacing[4],\n    height: spacing[4],\n    marginLeft: spacing[0.5],\n    marginRight: -spacing[1],\n    color: 'inherit',\n    opacity: 0.7,\n    cursor: 'pointer',\n    borderRadius: 'var(--brycks-radius-full)',\n    transition: `all ${durations.fast}ms ${easings.easeOut}`,\n  }\n\n  const inputStyle: CSSProperties = {\n    flex: 1,\n    minWidth: 100,\n    height: config.tagHeight,\n    padding: 0,\n    fontSize: config.fontSize,\n    color: 'var(--brycks-foreground-default)',\n    backgroundColor: 'transparent',\n    border: 'none',\n    outline: 'none',\n  }\n\n  const suggestionsStyle: CSSProperties = {\n    position: 'absolute',\n    top: '100%',\n    left: 0,\n    right: 0,\n    marginTop: spacing[1],\n    maxHeight: 200,\n    overflowY: 'auto',\n    backgroundColor: 'var(--brycks-background-elevated)',\n    border: '1px solid var(--brycks-border-default)',\n    borderRadius: 'var(--brycks-radius-lg)',\n    boxShadow: 'var(--brycks-shadow-lg)',\n    zIndex: 'var(--brycks-z-dropdown)' as unknown as number,\n    padding: spacing[1],\n  }\n\n  const suggestionStyle = (isActive: boolean): CSSProperties => ({\n    display: 'flex',\n    alignItems: 'center',\n    gap: componentGap.md,\n    padding: `${spacing[2]}px ${spacing[3]}px`,\n    fontSize: config.fontSize,\n    color: 'var(--brycks-foreground-default)',\n    backgroundColor: isActive ? 'var(--brycks-background-muted)' : 'transparent',\n    borderRadius: 'var(--brycks-radius-md)',\n    cursor: 'pointer',\n    transition: `background-color ${durations.fast}ms ${easings.easeOut}`,\n  })\n\n  const errorStyle: CSSProperties = {\n    marginTop: spacing[1],\n    fontSize: fontSizes.sm,\n    color: 'var(--brycks-error-default)',\n  }\n\n  const defaultRenderTag = (tag: TagItem, onRemove: () => void) => (\n    <span key={tag.id} style={tagStyle(tag)}>\n      {tag.label}\n      {isInteractive && (\n        <button\n          type=\"button\"\n          aria-label={`Remove ${tag.label}`}\n          style={removeButtonStyle}\n          onClick={(e) => {\n            e.stopPropagation()\n            onRemove()\n          }}\n          onMouseEnter={(e) => {\n            e.currentTarget.style.opacity = '1'\n            e.currentTarget.style.backgroundColor = 'rgba(0,0,0,0.1)'\n          }}\n          onMouseLeave={(e) => {\n            e.currentTarget.style.opacity = '0.7'\n            e.currentTarget.style.backgroundColor = 'transparent'\n          }}\n        >\n          <CloseIcon />\n        </button>\n      )}\n    </span>\n  )\n\n  return (\n    <div\n      ref={containerRef}\n      className={cx('brycks-tag-input', `brycks-tag-input--${size}`, className)}\n      style={containerStyle}\n      data-testid={testId}\n    >\n      <div\n        style={wrapperStyle}\n        onClick={() => !disabled && inputRef.current?.focus()}\n      >\n        {tags.map((tag) =>\n          renderTag ? renderTag(tag, () => removeTag(tag.id)) : defaultRenderTag(tag, () => removeTag(tag.id))\n        )}\n        <input\n          ref={(node) => {\n            (inputRef as React.MutableRefObject<HTMLInputElement | null>).current = node\n            if (typeof ref === 'function') ref(node)\n            else if (ref) ref.current = node\n          }}\n          type=\"text\"\n          role=\"combobox\"\n          aria-label={ariaLabel}\n          aria-expanded={showSuggestions && filteredSuggestions.length > 0}\n          aria-autocomplete=\"list\"\n          aria-invalid={isInvalid || !!error}\n          value={inputValue}\n          placeholder={tags.length === 0 ? placeholder : ''}\n          disabled={disabled}\n          readOnly={readOnly}\n          style={inputStyle}\n          onChange={handleInputChange}\n          onKeyDown={handleKeyDown}\n          onFocus={() => {\n            setIsFocused(true)\n            setShowSuggestions(true)\n          }}\n          onBlur={() => setIsFocused(false)}\n        />\n      </div>\n\n      {showSuggestions && filteredSuggestions.length > 0 && (\n        <ul role=\"listbox\" style={suggestionsStyle}>\n          {filteredSuggestions.map((suggestion, index) => (\n            <li\n              key={suggestion.id}\n              role=\"option\"\n              aria-selected={index === activeSuggestion}\n              style={suggestionStyle(index === activeSuggestion)}\n              onClick={() => {\n                updateTags([...tags, suggestion])\n                setInputValue('')\n                setShowSuggestions(false)\n                inputRef.current?.focus()\n              }}\n              onMouseEnter={() => setActiveSuggestion(index)}\n            >\n              {suggestion.label}\n            </li>\n          ))}\n        </ul>\n      )}\n\n      {error && <div style={errorStyle}>{error}</div>}\n    </div>\n  )\n})\n\nTagInput.displayName = 'TagInput'\n"],"names":["sizeConfig","componentHeights","fontSizes","spacing","componentPaddingX","CloseIcon","jsx","TagInput","forwardRef","controlledValue","defaultValue","onChange","placeholder","size","maxTags","allowDuplicates","delimiters","disabled","isInvalid","readOnly","validateTag","transformTag","v","suggestions","renderTag","ariaLabel","className","testId","ref","internalValue","setInternalValue","useState","inputValue","setInputValue","isFocused","setIsFocused","error","setError","showSuggestions","setShowSuggestions","activeSuggestion","setActiveSuggestion","inputRef","useRef","containerRef","tags","config","isInteractive","filteredSuggestions","s","updateTags","useCallback","newTags","addTag","value","trimmed","t","result","newTag","removeTag","tagId","handleInputChange","parts","part","index","handleKeyDown","prev","selected","useEffect","handleClick","e","containerStyle","wrapperStyle","durations","easings","tagStyle","tag","removeButtonStyle","inputStyle","suggestionsStyle","suggestionStyle","isActive","componentGap","errorStyle","defaultRenderTag","onRemove","jsxs","cx","node","suggestion"],"mappings":"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"}
+{"version":3,"file":"TagInput.cjs","sources":["../../../../src/components/form/TagInput/TagInput.tsx"],"sourcesContent":["/**\n * TagInput Component\n *\n * An input field for managing tags/chips with keyboard support.\n * Supports suggestions, validation, and custom tag rendering.\n *\n * @module components/form/TagInput\n */\n\nimport {\n  forwardRef,\n  useState,\n  useCallback,\n  useRef,\n  useEffect,\n  type CSSProperties,\n  type ReactNode,\n  type KeyboardEvent,\n  type ChangeEvent,\n} from 'react'\nimport { cx } from '../../../utils/styles'\nimport { spacing, fontSizes, durations, easings } from '../../../design-system'\nimport { componentHeights, componentPaddingX, componentGap } from '../../../design-system/primitives'\n\nexport type TagInputSize = 'sm' | 'md' | 'lg'\n\nexport interface TagItem {\n  /** Unique identifier */\n  id: string\n  /** Display label */\n  label: string\n  /** Optional color */\n  color?: string\n}\n\nexport interface TagInputProps {\n  /** Current tags */\n  value?: TagItem[]\n  /** Default tags (uncontrolled) */\n  defaultValue?: TagItem[]\n  /** Callback when tags change */\n  onChange?: (tags: TagItem[]) => void\n  /** Placeholder text */\n  placeholder?: string\n  /** Component size */\n  size?: TagInputSize\n  /** Maximum number of tags */\n  maxTags?: number\n  /** Whether to allow duplicates */\n  allowDuplicates?: boolean\n  /** Delimiter keys to create tag (default: Enter, comma) */\n  delimiters?: string[]\n  /** Whether the input is disabled */\n  disabled?: boolean\n  /** Whether the input is invalid */\n  isInvalid?: boolean\n  /** Whether the input is read-only */\n  readOnly?: boolean\n  /** Validation function for new tags */\n  validateTag?: (value: string) => boolean | string\n  /** Transform function for new tag value */\n  transformTag?: (value: string) => string\n  /** Suggested tags for autocomplete */\n  suggestions?: TagItem[]\n  /** Custom tag renderer */\n  renderTag?: (tag: TagItem, onRemove: () => void) => ReactNode\n  /** Message shown when the tag limit is reached */\n  maxTagsMessage?: (maxTags: number) => string\n  /** Message shown when a duplicate tag is rejected */\n  duplicateMessage?: string\n  /** Label for accessibility */\n  'aria-label'?: string\n  /** Custom class name */\n  className?: string\n  /** Test ID */\n  testId?: string\n}\n\nconst sizeConfig: Record<TagInputSize, { height: number; fontSize: number; tagHeight: number; padding: number; gap: number }> = {\n  sm: { height: componentHeights.sm, fontSize: fontSizes.base - 1, tagHeight: spacing[5], padding: componentPaddingX.xs, gap: spacing[1] },\n  md: { height: componentHeights.md, fontSize: fontSizes.base, tagHeight: spacing[6], padding: componentPaddingX.sm, gap: spacing[1.5] },\n  lg: { height: componentHeights.lg, fontSize: fontSizes.md, tagHeight: spacing[7], padding: componentPaddingX.sm, gap: spacing[2] },\n}\n\nfunction CloseIcon() {\n  return (\n    <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" aria-hidden=\"true\">\n      <path d=\"M3 3l6 6M9 3l-6 6\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n    </svg>\n  )\n}\n\nexport const TagInput = forwardRef<HTMLInputElement, TagInputProps>(function TagInput(\n  {\n    value: controlledValue,\n    defaultValue = [],\n    onChange,\n    placeholder = 'Add tags...',\n    size = 'md',\n    maxTags,\n    allowDuplicates = false,\n    delimiters = ['Enter', ','],\n    disabled = false,\n    isInvalid = false,\n    readOnly = false,\n    validateTag,\n    transformTag = (v) => v.trim(),\n    suggestions,\n    renderTag,\n    maxTagsMessage = (max) => `Maximum ${max} tags allowed`,\n    duplicateMessage = 'Tag already exists',\n    'aria-label': ariaLabel = 'Tag input',\n    className,\n    testId,\n  },\n  ref\n) {\n  const [internalValue, setInternalValue] = useState<TagItem[]>(defaultValue)\n  const [inputValue, setInputValue] = useState('')\n  const [isFocused, setIsFocused] = useState(false)\n  const [error, setError] = useState<string | null>(null)\n  const [showSuggestions, setShowSuggestions] = useState(false)\n  const [activeSuggestion, setActiveSuggestion] = useState(-1)\n\n  const inputRef = useRef<HTMLInputElement>(null)\n  const containerRef = useRef<HTMLDivElement>(null)\n\n  const tags = controlledValue !== undefined ? controlledValue : internalValue\n  const config = sizeConfig[size]\n\n  const isInteractive = !disabled && !readOnly\n\n  // Filter suggestions\n  const filteredSuggestions = suggestions?.filter(\n    (s) =>\n      s.label.toLowerCase().includes(inputValue.toLowerCase()) &&\n      !tags.some((t) => t.id === s.id)\n  ) || []\n\n  const updateTags = useCallback(\n    (newTags: TagItem[]) => {\n      if (controlledValue === undefined) {\n        setInternalValue(newTags)\n      }\n      onChange?.(newTags)\n    },\n    [controlledValue, onChange]\n  )\n\n  const addTag = useCallback(\n    (value: string) => {\n      const trimmed = transformTag(value)\n      if (!trimmed) return false\n\n      // Check max tags\n      if (maxTags && tags.length >= maxTags) {\n        setError(maxTagsMessage(maxTags))\n        return false\n      }\n\n      // Check duplicates\n      if (!allowDuplicates && tags.some((t) => t.label.toLowerCase() === trimmed.toLowerCase())) {\n        setError(duplicateMessage)\n        return false\n      }\n\n      // Validate\n      if (validateTag) {\n        const result = validateTag(trimmed)\n        if (result !== true) {\n          setError(typeof result === 'string' ? result : 'Invalid tag')\n          return false\n        }\n      }\n\n      const newTag: TagItem = {\n        id: `tag-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,\n        label: trimmed,\n      }\n\n      updateTags([...tags, newTag])\n      setInputValue('')\n      setError(null)\n      return true\n    },\n    [tags, maxTags, allowDuplicates, validateTag, transformTag, updateTags, maxTagsMessage, duplicateMessage]\n  )\n\n  const removeTag = useCallback(\n    (tagId: string) => {\n      if (!isInteractive) return\n      updateTags(tags.filter((t) => t.id !== tagId))\n    },\n    [isInteractive, tags, updateTags]\n  )\n\n  const handleInputChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n    const value = e.target.value\n\n    // Check for delimiter in the value\n    if (value.includes(',')) {\n      const parts = value.split(',')\n      parts.forEach((part, index) => {\n        if (index < parts.length - 1 && part.trim()) {\n          addTag(part)\n        }\n      })\n      setInputValue(parts[parts.length - 1])\n    } else {\n      setInputValue(value)\n    }\n\n    setError(null)\n    setShowSuggestions(true)\n    setActiveSuggestion(-1)\n  }, [addTag])\n\n  const handleKeyDown = useCallback(\n    (e: KeyboardEvent<HTMLInputElement>) => {\n      if (!isInteractive) return\n\n      // Handle suggestions navigation\n      if (showSuggestions && filteredSuggestions.length > 0) {\n        if (e.key === 'ArrowDown') {\n          e.preventDefault()\n          setActiveSuggestion((prev) => Math.min(prev + 1, filteredSuggestions.length - 1))\n          return\n        }\n        if (e.key === 'ArrowUp') {\n          e.preventDefault()\n          setActiveSuggestion((prev) => Math.max(prev - 1, 0))\n          return\n        }\n        if ((e.key === 'Enter' || e.key === 'Tab') && activeSuggestion >= 0) {\n          e.preventDefault()\n          const selected = filteredSuggestions[activeSuggestion]\n          if (selected) {\n            updateTags([...tags, selected])\n            setInputValue('')\n            setShowSuggestions(false)\n            setActiveSuggestion(-1)\n          }\n          return\n        }\n      }\n\n      // Create tag on delimiter\n      if (delimiters.includes(e.key) && inputValue) {\n        e.preventDefault()\n        addTag(inputValue)\n        setShowSuggestions(false)\n        return\n      }\n\n      // Remove last tag on backspace\n      if (e.key === 'Backspace' && !inputValue && tags.length > 0) {\n        removeTag(tags[tags.length - 1].id)\n        return\n      }\n\n      // Close suggestions on escape\n      if (e.key === 'Escape') {\n        setShowSuggestions(false)\n        setActiveSuggestion(-1)\n      }\n    },\n    [isInteractive, showSuggestions, filteredSuggestions, activeSuggestion, delimiters, inputValue, tags, addTag, removeTag, updateTags]\n  )\n\n  // Close suggestions on outside click\n  useEffect(() => {\n    if (!showSuggestions) return\n\n    const handleClick = (e: MouseEvent) => {\n      if (!containerRef.current?.contains(e.target as Node)) {\n        setShowSuggestions(false)\n      }\n    }\n\n    document.addEventListener('mousedown', handleClick)\n    return () => document.removeEventListener('mousedown', handleClick)\n  }, [showSuggestions])\n\n  const containerStyle: CSSProperties = {\n    position: 'relative',\n    width: '100%',\n  }\n\n  const wrapperStyle: CSSProperties = {\n    display: 'flex',\n    flexWrap: 'wrap',\n    alignItems: 'center',\n    gap: config.gap,\n    minHeight: config.height,\n    padding: `${spacing[1]}px ${config.padding}px`,\n    backgroundColor: disabled ? 'var(--brycks-background-muted)' : 'var(--brycks-background-default)',\n    border: `1px solid ${\n      isInvalid || error\n        ? 'var(--brycks-error-default)'\n        : isFocused\n        ? 'var(--brycks-primary-default)'\n        : 'var(--brycks-border-default)'\n    }`,\n    borderRadius: 'var(--brycks-radius-md)',\n    transition: `all ${durations.fast}ms ${easings.easeOut}`,\n    cursor: disabled ? 'not-allowed' : 'text',\n    boxShadow: isFocused ? 'var(--brycks-focus-ring)' : undefined,\n  }\n\n  const tagStyle = (tag: TagItem): CSSProperties => ({\n    display: 'inline-flex',\n    alignItems: 'center',\n    gap: spacing[1],\n    height: config.tagHeight,\n    padding: `0 ${spacing[2]}px`,\n    fontSize: config.fontSize - 1,\n    fontWeight: 500,\n    color: tag.color ? 'white' : 'var(--brycks-foreground-default)',\n    backgroundColor: tag.color || 'var(--brycks-background-muted)',\n    borderRadius: 'var(--brycks-radius-full)',\n    whiteSpace: 'nowrap',\n  })\n\n  const removeButtonStyle: CSSProperties = {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: spacing[4],\n    height: spacing[4],\n    marginLeft: spacing[0.5],\n    marginRight: -spacing[1],\n    color: 'inherit',\n    opacity: 0.7,\n    cursor: 'pointer',\n    borderRadius: 'var(--brycks-radius-full)',\n    transition: `all ${durations.fast}ms ${easings.easeOut}`,\n  }\n\n  const inputStyle: CSSProperties = {\n    flex: 1,\n    minWidth: 100,\n    height: config.tagHeight,\n    padding: 0,\n    fontSize: config.fontSize,\n    color: 'var(--brycks-foreground-default)',\n    backgroundColor: 'transparent',\n    border: 'none',\n    outline: 'none',\n  }\n\n  const suggestionsStyle: CSSProperties = {\n    position: 'absolute',\n    top: '100%',\n    left: 0,\n    right: 0,\n    marginTop: spacing[1],\n    maxHeight: 200,\n    overflowY: 'auto',\n    backgroundColor: 'var(--brycks-background-elevated)',\n    border: '1px solid var(--brycks-border-default)',\n    borderRadius: 'var(--brycks-radius-lg)',\n    boxShadow: 'var(--brycks-shadow-lg)',\n    zIndex: 'var(--brycks-z-dropdown)' as unknown as number,\n    padding: spacing[1],\n  }\n\n  const suggestionStyle = (isActive: boolean): CSSProperties => ({\n    display: 'flex',\n    alignItems: 'center',\n    gap: componentGap.md,\n    padding: `${spacing[2]}px ${spacing[3]}px`,\n    fontSize: config.fontSize,\n    color: 'var(--brycks-foreground-default)',\n    backgroundColor: isActive ? 'var(--brycks-background-muted)' : 'transparent',\n    borderRadius: 'var(--brycks-radius-md)',\n    cursor: 'pointer',\n    transition: `background-color ${durations.fast}ms ${easings.easeOut}`,\n  })\n\n  const errorStyle: CSSProperties = {\n    marginTop: spacing[1],\n    fontSize: fontSizes.sm,\n    color: 'var(--brycks-error-default)',\n  }\n\n  const defaultRenderTag = (tag: TagItem, onRemove: () => void) => (\n    <span key={tag.id} style={tagStyle(tag)}>\n      {tag.label}\n      {isInteractive && (\n        <button\n          type=\"button\"\n          aria-label={`Remove ${tag.label}`}\n          style={removeButtonStyle}\n          onClick={(e) => {\n            e.stopPropagation()\n            onRemove()\n          }}\n          onMouseEnter={(e) => {\n            e.currentTarget.style.opacity = '1'\n            e.currentTarget.style.backgroundColor = 'rgba(0,0,0,0.1)'\n          }}\n          onMouseLeave={(e) => {\n            e.currentTarget.style.opacity = '0.7'\n            e.currentTarget.style.backgroundColor = 'transparent'\n          }}\n        >\n          <CloseIcon />\n        </button>\n      )}\n    </span>\n  )\n\n  return (\n    <div\n      ref={containerRef}\n      className={cx('brycks-tag-input', `brycks-tag-input--${size}`, className)}\n      style={containerStyle}\n      data-testid={testId}\n    >\n      <div\n        style={wrapperStyle}\n        onClick={() => !disabled && inputRef.current?.focus()}\n      >\n        {tags.map((tag) =>\n          renderTag ? renderTag(tag, () => removeTag(tag.id)) : defaultRenderTag(tag, () => removeTag(tag.id))\n        )}\n        <input\n          ref={(node) => {\n            (inputRef as React.MutableRefObject<HTMLInputElement | null>).current = node\n            if (typeof ref === 'function') ref(node)\n            else if (ref) ref.current = node\n          }}\n          type=\"text\"\n          role=\"combobox\"\n          aria-label={ariaLabel}\n          aria-expanded={showSuggestions && filteredSuggestions.length > 0}\n          aria-autocomplete=\"list\"\n          aria-invalid={isInvalid || !!error}\n          value={inputValue}\n          placeholder={tags.length === 0 ? placeholder : ''}\n          disabled={disabled}\n          readOnly={readOnly}\n          style={inputStyle}\n          onChange={handleInputChange}\n          onKeyDown={handleKeyDown}\n          onFocus={() => {\n            setIsFocused(true)\n            setShowSuggestions(true)\n          }}\n          onBlur={() => setIsFocused(false)}\n        />\n      </div>\n\n      {showSuggestions && filteredSuggestions.length > 0 && (\n        <ul role=\"listbox\" style={suggestionsStyle}>\n          {filteredSuggestions.map((suggestion, index) => (\n            <li\n              key={suggestion.id}\n              role=\"option\"\n              aria-selected={index === activeSuggestion}\n              style={suggestionStyle(index === activeSuggestion)}\n              onClick={() => {\n                updateTags([...tags, suggestion])\n                setInputValue('')\n                setShowSuggestions(false)\n                inputRef.current?.focus()\n              }}\n              onMouseEnter={() => setActiveSuggestion(index)}\n            >\n              {suggestion.label}\n            </li>\n          ))}\n        </ul>\n      )}\n\n      {error && <div style={errorStyle}>{error}</div>}\n    </div>\n  )\n})\n\nTagInput.displayName = 'TagInput'\n"],"names":["sizeConfig","componentHeights","fontSizes","spacing","componentPaddingX","CloseIcon","jsx","TagInput","forwardRef","controlledValue","defaultValue","onChange","placeholder","size","maxTags","allowDuplicates","delimiters","disabled","isInvalid","readOnly","validateTag","transformTag","v","suggestions","renderTag","maxTagsMessage","max","duplicateMessage","ariaLabel","className","testId","ref","internalValue","setInternalValue","useState","inputValue","setInputValue","isFocused","setIsFocused","error","setError","showSuggestions","setShowSuggestions","activeSuggestion","setActiveSuggestion","inputRef","useRef","containerRef","tags","config","isInteractive","filteredSuggestions","s","updateTags","useCallback","newTags","addTag","value","trimmed","t","result","newTag","removeTag","tagId","handleInputChange","parts","part","index","handleKeyDown","prev","selected","useEffect","handleClick","e","containerStyle","wrapperStyle","durations","easings","tagStyle","tag","removeButtonStyle","inputStyle","suggestionsStyle","suggestionStyle","isActive","componentGap","errorStyle","defaultRenderTag","onRemove","jsxs","cx","node","suggestion"],"mappings":"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"}

package/dist/components/form/TagInput/TagInput.js

@@ -1,83 +1,85 @@
-import { jsxs as M, jsx as i } from "react/jsx-runtime";
-import { forwardRef as ge, useState as p, useRef as X, useCallback as v, useEffect as pe } from "react";
-import { cx as he } from "../../../utils/styles.js";
-import { durations as T, easings as H } from "../../../design-system/tokens/motion.js";
+import { jsxs as H, jsx as s } from "react/jsx-runtime";
+import { forwardRef as he, useState as p, useRef as q, useCallback as w, useEffect as me } from "react";
+import { cx as ye } from "../../../utils/styles.js";
+import { durations as T, easings as D } from "../../../design-system/tokens/motion.js";
 import { spacing as r } from "../../../design-system/tokens/spacing.js";
-import { componentPaddingX as D, componentHeights as A, componentGap as me } from "../../../design-system/primitives/sizing.js";
-import { fontSizes as z } from "../../../design-system/tokens/typography.js";
-const ye = {
-  sm: { height: A.sm, fontSize: z.base - 1, tagHeight: r[5], padding: D.xs, gap: r[1] },
-  md: { height: A.md, fontSize: z.base, tagHeight: r[6], padding: D.sm, gap: r[1.5] },
-  lg: { height: A.lg, fontSize: z.md, tagHeight: r[7], padding: D.sm, gap: r[2] }
+import { componentPaddingX as M, componentHeights as A, componentGap as be } from "../../../design-system/primitives/sizing.js";
+import { fontSizes as R } from "../../../design-system/tokens/typography.js";
+const ke = {
+  sm: { height: A.sm, fontSize: R.base - 1, tagHeight: r[5], padding: M.xs, gap: r[1] },
+  md: { height: A.md, fontSize: R.base, tagHeight: r[6], padding: M.sm, gap: r[1.5] },
+  lg: { height: A.lg, fontSize: R.md, tagHeight: r[7], padding: M.sm, gap: r[2] }
 };
-function be() {
-  return /* @__PURE__ */ i("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ i("path", { d: "M3 3l6 6M9 3l-6 6", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) });
+function ve() {
+  return /* @__PURE__ */ s("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ s("path", { d: "M3 3l6 6M9 3l-6 6", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) });
 }
-const ke = ge(function({
-  value: w,
-  defaultValue: Y = [],
+const we = he(function({
+  value: S,
+  defaultValue: J = [],
   onChange: B,
-  placeholder: q = "Add tags...",
+  placeholder: Q = "Add tags...",
   size: W = "md",
-  maxTags: S,
+  maxTags: x,
   allowDuplicates: j = !1,
   delimiters: F = ["Enter", ","],
   disabled: h = !1,
   isInvalid: K = !1,
   readOnly: N = !1,
-  validateTag: R,
-  transformTag: O = (E) => E.trim(),
-  suggestions: J,
+  validateTag: E,
+  transformTag: O = (m) => m.trim(),
+  suggestions: Z,
   renderTag: P,
-  "aria-label": Q = "Tag input",
-  className: Z,
-  testId: _
-}, x) {
-  const [E, ee] = p(Y), [d, m] = p(""), [G, U] = p(!1), [C, y] = p(null), [f, l] = p(!1), [b, g] = p(-1), L = X(null), V = X(null), n = w !== void 0 ? w : E, a = ye[W], k = !h && !N, c = J?.filter(
+  maxTagsMessage: G = (m) => `Maximum ${m} tags allowed`,
+  duplicateMessage: U = "Tag already exists",
+  "aria-label": _ = "Tag input",
+  className: ee,
+  testId: te
+}, C) {
+  const [m, re] = p(J), [d, y] = p(""), [V, X] = p(!1), [$, b] = p(null), [f, l] = p(!1), [k, g] = p(-1), L = q(null), Y = q(null), n = S !== void 0 ? S : m, a = ke[W], v = !h && !N, c = Z?.filter(
     (e) => e.label.toLowerCase().includes(d.toLowerCase()) && !n.some((t) => t.id === e.id)
-  ) || [], u = v(
+  ) || [], u = w(
     (e) => {
-      w === void 0 && ee(e), B?.(e);
+      S === void 0 && re(e), B?.(e);
     },
-    [w, B]
-  ), $ = v(
+    [S, B]
+  ), I = w(
     (e) => {
       const t = O(e);
       if (!t) return !1;
-      if (S && n.length >= S)
-        return y(`Maximum ${S} tags allowed`), !1;
-      if (!j && n.some((s) => s.label.toLowerCase() === t.toLowerCase()))
-        return y("Tag already exists"), !1;
-      if (R) {
-        const s = R(t);
-        if (s !== !0)
-          return y(typeof s == "string" ? s : "Invalid tag"), !1;
+      if (x && n.length >= x)
+        return b(G(x)), !1;
+      if (!j && n.some((i) => i.label.toLowerCase() === t.toLowerCase()))
+        return b(U), !1;
+      if (E) {
+        const i = E(t);
+        if (i !== !0)
+          return b(typeof i == "string" ? i : "Invalid tag"), !1;
       }
       const o = {
         id: `tag-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
         label: t
       };
-      return u([...n, o]), m(""), y(null), !0;
+      return u([...n, o]), y(""), b(null), !0;
     },
-    [n, S, j, R, O, u]
-  ), I = v(
+    [n, x, j, E, O, u, G, U]
+  ), z = w(
     (e) => {
-      k && u(n.filter((t) => t.id !== e));
+      v && u(n.filter((t) => t.id !== e));
     },
-    [k, n, u]
-  ), te = v((e) => {
+    [v, n, u]
+  ), ne = w((e) => {
     const t = e.target.value;
     if (t.includes(",")) {
       const o = t.split(",");
-      o.forEach((s, fe) => {
-        fe < o.length - 1 && s.trim() && $(s);
-      }), m(o[o.length - 1]);
+      o.forEach((i, pe) => {
+        pe < o.length - 1 && i.trim() && I(i);
+      }), y(o[o.length - 1]);
     } else
-      m(t);
-    y(null), l(!0), g(-1);
-  }, [$]), re = v(
+      y(t);
+    b(null), l(!0), g(-1);
+  }, [I]), oe = w(
     (e) => {
-      if (k) {
+      if (v) {
         if (f && c.length > 0) {
           if (e.key === "ArrowDown") {
             e.preventDefault(), g((t) => Math.min(t + 1, c.length - 1));
@@ -87,37 +89,37 @@ const ke = ge(function({
             e.preventDefault(), g((t) => Math.max(t - 1, 0));
             return;
           }
-          if ((e.key === "Enter" || e.key === "Tab") && b >= 0) {
+          if ((e.key === "Enter" || e.key === "Tab") && k >= 0) {
             e.preventDefault();
-            const t = c[b];
-            t && (u([...n, t]), m(""), l(!1), g(-1));
+            const t = c[k];
+            t && (u([...n, t]), y(""), l(!1), g(-1));
             return;
           }
         }
         if (F.includes(e.key) && d) {
-          e.preventDefault(), $(d), l(!1);
+          e.preventDefault(), I(d), l(!1);
           return;
         }
         if (e.key === "Backspace" && !d && n.length > 0) {
-          I(n[n.length - 1].id);
+          z(n[n.length - 1].id);
           return;
         }
         e.key === "Escape" && (l(!1), g(-1));
       }
     },
-    [k, f, c, b, F, d, n, $, I, u]
+    [v, f, c, k, F, d, n, I, z, u]
   );
-  pe(() => {
+  me(() => {
     if (!f) return;
     const e = (t) => {
-      V.current?.contains(t.target) || l(!1);
+      Y.current?.contains(t.target) || l(!1);
     };
     return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
   }, [f]);
-  const ne = {
+  const ae = {
     position: "relative",
     width: "100%"
-  }, oe = {
+  }, ie = {
     display: "flex",
     flexWrap: "wrap",
     alignItems: "center",
@@ -125,12 +127,12 @@ const ke = ge(function({
     minHeight: a.height,
     padding: `${r[1]}px ${a.padding}px`,
     backgroundColor: h ? "var(--brycks-background-muted)" : "var(--brycks-background-default)",
-    border: `1px solid ${K || C ? "var(--brycks-error-default)" : G ? "var(--brycks-primary-default)" : "var(--brycks-border-default)"}`,
+    border: `1px solid ${K || $ ? "var(--brycks-error-default)" : V ? "var(--brycks-primary-default)" : "var(--brycks-border-default)"}`,
     borderRadius: "var(--brycks-radius-md)",
-    transition: `all ${T.fast}ms ${H.easeOut}`,
+    transition: `all ${T.fast}ms ${D.easeOut}`,
     cursor: h ? "not-allowed" : "text",
-    boxShadow: G ? "var(--brycks-focus-ring)" : void 0
-  }, ae = (e) => ({
+    boxShadow: V ? "var(--brycks-focus-ring)" : void 0
+  }, se = (e) => ({
     display: "inline-flex",
     alignItems: "center",
     gap: r[1],
@@ -142,7 +144,7 @@ const ke = ge(function({
     backgroundColor: e.color || "var(--brycks-background-muted)",
     borderRadius: "var(--brycks-radius-full)",
     whiteSpace: "nowrap"
-  }), se = {
+  }), le = {
     display: "flex",
     alignItems: "center",
     justifyContent: "center",
@@ -154,8 +156,8 @@ const ke = ge(function({
     opacity: 0.7,
     cursor: "pointer",
     borderRadius: "var(--brycks-radius-full)",
-    transition: `all ${T.fast}ms ${H.easeOut}`
-  }, ie = {
+    transition: `all ${T.fast}ms ${D.easeOut}`
+  }, ce = {
     flex: 1,
     minWidth: 100,
     height: a.tagHeight,
@@ -165,7 +167,7 @@ const ke = ge(function({
     backgroundColor: "transparent",
     border: "none",
     outline: "none"
-  }, le = {
+  }, ue = {
     position: "absolute",
     top: "100%",
     left: 0,
@@ -179,29 +181,29 @@ const ke = ge(function({
     boxShadow: "var(--brycks-shadow-lg)",
     zIndex: "var(--brycks-z-dropdown)",
     padding: r[1]
-  }, ce = (e) => ({
+  }, de = (e) => ({
     display: "flex",
     alignItems: "center",
-    gap: me.md,
+    gap: be.md,
     padding: `${r[2]}px ${r[3]}px`,
     fontSize: a.fontSize,
     color: "var(--brycks-foreground-default)",
     backgroundColor: e ? "var(--brycks-background-muted)" : "transparent",
     borderRadius: "var(--brycks-radius-md)",
     cursor: "pointer",
-    transition: `background-color ${T.fast}ms ${H.easeOut}`
-  }), ue = {
+    transition: `background-color ${T.fast}ms ${D.easeOut}`
+  }), fe = {
     marginTop: r[1],
-    fontSize: z.sm,
+    fontSize: R.sm,
     color: "var(--brycks-error-default)"
-  }, de = (e, t) => /* @__PURE__ */ M("span", { style: ae(e), children: [
+  }, ge = (e, t) => /* @__PURE__ */ H("span", { style: se(e), children: [
     e.label,
-    k && /* @__PURE__ */ i(
+    v && /* @__PURE__ */ s(
       "button",
       {
         type: "button",
         "aria-label": `Remove ${e.label}`,
-        style: se,
+        style: le,
         onClick: (o) => {
           o.stopPropagation(), t();
         },
@@ -211,76 +213,76 @@ const ke = ge(function({
         onMouseLeave: (o) => {
           o.currentTarget.style.opacity = "0.7", o.currentTarget.style.backgroundColor = "transparent";
         },
-        children: /* @__PURE__ */ i(be, {})
+        children: /* @__PURE__ */ s(ve, {})
       }
     )
   ] }, e.id);
-  return /* @__PURE__ */ M(
+  return /* @__PURE__ */ H(
     "div",
     {
-      ref: V,
-      className: he("brycks-tag-input", `brycks-tag-input--${W}`, Z),
-      style: ne,
-      "data-testid": _,
+      ref: Y,
+      className: ye("brycks-tag-input", `brycks-tag-input--${W}`, ee),
+      style: ae,
+      "data-testid": te,
       children: [
-        /* @__PURE__ */ M(
+        /* @__PURE__ */ H(
           "div",
           {
-            style: oe,
+            style: ie,
             onClick: () => !h && L.current?.focus(),
             children: [
               n.map(
-                (e) => P ? P(e, () => I(e.id)) : de(e, () => I(e.id))
+                (e) => P ? P(e, () => z(e.id)) : ge(e, () => z(e.id))
               ),
-              /* @__PURE__ */ i(
+              /* @__PURE__ */ s(
                 "input",
                 {
                   ref: (e) => {
-                    L.current = e, typeof x == "function" ? x(e) : x && (x.current = e);
+                    L.current = e, typeof C == "function" ? C(e) : C && (C.current = e);
                   },
                   type: "text",
                   role: "combobox",
-                  "aria-label": Q,
+                  "aria-label": _,
                   "aria-expanded": f && c.length > 0,
                   "aria-autocomplete": "list",
-                  "aria-invalid": K || !!C,
+                  "aria-invalid": K || !!$,
                   value: d,
-                  placeholder: n.length === 0 ? q : "",
+                  placeholder: n.length === 0 ? Q : "",
                   disabled: h,
                   readOnly: N,
-                  style: ie,
-                  onChange: te,
-                  onKeyDown: re,
+                  style: ce,
+                  onChange: ne,
+                  onKeyDown: oe,
                   onFocus: () => {
-                    U(!0), l(!0);
+                    X(!0), l(!0);
                   },
-                  onBlur: () => U(!1)
+                  onBlur: () => X(!1)
                 }
               )
             ]
           }
         ),
-        f && c.length > 0 && /* @__PURE__ */ i("ul", { role: "listbox", style: le, children: c.map((e, t) => /* @__PURE__ */ i(
+        f && c.length > 0 && /* @__PURE__ */ s("ul", { role: "listbox", style: ue, children: c.map((e, t) => /* @__PURE__ */ s(
           "li",
           {
             role: "option",
-            "aria-selected": t === b,
-            style: ce(t === b),
+            "aria-selected": t === k,
+            style: de(t === k),
             onClick: () => {
-              u([...n, e]), m(""), l(!1), L.current?.focus();
+              u([...n, e]), y(""), l(!1), L.current?.focus();
             },
             onMouseEnter: () => g(t),
             children: e.label
           },
           e.id
         )) }),
-        C && /* @__PURE__ */ i("div", { style: ue, children: C })
+        $ && /* @__PURE__ */ s("div", { style: fe, children: $ })
       ]
     }
   );
 });
-ke.displayName = "TagInput";
+we.displayName = "TagInput";
 export {
-  ke as TagInput
+  we as TagInput
 };
 //# sourceMappingURL=TagInput.js.map

package/dist/components/form/TagInput/TagInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"TagInput.js","sources":["../../../../src/components/form/TagInput/TagInput.tsx"],"sourcesContent":["/**\n * TagInput Component\n *\n * An input field for managing tags/chips with keyboard support.\n * Supports suggestions, validation, and custom tag rendering.\n *\n * @module components/form/TagInput\n */\n\nimport {\n  forwardRef,\n  useState,\n  useCallback,\n  useRef,\n  useEffect,\n  type CSSProperties,\n  type ReactNode,\n  type KeyboardEvent,\n  type ChangeEvent,\n} from 'react'\nimport { cx } from '../../../utils/styles'\nimport { spacing, fontSizes, durations, easings } from '../../../design-system'\nimport { componentHeights, componentPaddingX, componentGap } from '../../../design-system/primitives'\n\nexport type TagInputSize = 'sm' | 'md' | 'lg'\n\nexport interface TagItem {\n  /** Unique identifier */\n  id: string\n  /** Display label */\n  label: string\n  /** Optional color */\n  color?: string\n}\n\nexport interface TagInputProps {\n  /** Current tags */\n  value?: TagItem[]\n  /** Default tags (uncontrolled) */\n  defaultValue?: TagItem[]\n  /** Callback when tags change */\n  onChange?: (tags: TagItem[]) => void\n  /** Placeholder text */\n  placeholder?: string\n  /** Component size */\n  size?: TagInputSize\n  /** Maximum number of tags */\n  maxTags?: number\n  /** Whether to allow duplicates */\n  allowDuplicates?: boolean\n  /** Delimiter keys to create tag (default: Enter, comma) */\n  delimiters?: string[]\n  /** Whether the input is disabled */\n  disabled?: boolean\n  /** Whether the input is invalid */\n  isInvalid?: boolean\n  /** Whether the input is read-only */\n  readOnly?: boolean\n  /** Validation function for new tags */\n  validateTag?: (value: string) => boolean | string\n  /** Transform function for new tag value */\n  transformTag?: (value: string) => string\n  /** Suggested tags for autocomplete */\n  suggestions?: TagItem[]\n  /** Custom tag renderer */\n  renderTag?: (tag: TagItem, onRemove: () => void) => ReactNode\n  /** Label for accessibility */\n  'aria-label'?: string\n  /** Custom class name */\n  className?: string\n  /** Test ID */\n  testId?: string\n}\n\nconst sizeConfig: Record<TagInputSize, { height: number; fontSize: number; tagHeight: number; padding: number; gap: number }> = {\n  sm: { height: componentHeights.sm, fontSize: fontSizes.base - 1, tagHeight: spacing[5], padding: componentPaddingX.xs, gap: spacing[1] },\n  md: { height: componentHeights.md, fontSize: fontSizes.base, tagHeight: spacing[6], padding: componentPaddingX.sm, gap: spacing[1.5] },\n  lg: { height: componentHeights.lg, fontSize: fontSizes.md, tagHeight: spacing[7], padding: componentPaddingX.sm, gap: spacing[2] },\n}\n\nfunction CloseIcon() {\n  return (\n    <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" aria-hidden=\"true\">\n      <path d=\"M3 3l6 6M9 3l-6 6\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n    </svg>\n  )\n}\n\nexport const TagInput = forwardRef<HTMLInputElement, TagInputProps>(function TagInput(\n  {\n    value: controlledValue,\n    defaultValue = [],\n    onChange,\n    placeholder = 'Add tags...',\n    size = 'md',\n    maxTags,\n    allowDuplicates = false,\n    delimiters = ['Enter', ','],\n    disabled = false,\n    isInvalid = false,\n    readOnly = false,\n    validateTag,\n    transformTag = (v) => v.trim(),\n    suggestions,\n    renderTag,\n    'aria-label': ariaLabel = 'Tag input',\n    className,\n    testId,\n  },\n  ref\n) {\n  const [internalValue, setInternalValue] = useState<TagItem[]>(defaultValue)\n  const [inputValue, setInputValue] = useState('')\n  const [isFocused, setIsFocused] = useState(false)\n  const [error, setError] = useState<string | null>(null)\n  const [showSuggestions, setShowSuggestions] = useState(false)\n  const [activeSuggestion, setActiveSuggestion] = useState(-1)\n\n  const inputRef = useRef<HTMLInputElement>(null)\n  const containerRef = useRef<HTMLDivElement>(null)\n\n  const tags = controlledValue !== undefined ? controlledValue : internalValue\n  const config = sizeConfig[size]\n\n  const isInteractive = !disabled && !readOnly\n\n  // Filter suggestions\n  const filteredSuggestions = suggestions?.filter(\n    (s) =>\n      s.label.toLowerCase().includes(inputValue.toLowerCase()) &&\n      !tags.some((t) => t.id === s.id)\n  ) || []\n\n  const updateTags = useCallback(\n    (newTags: TagItem[]) => {\n      if (controlledValue === undefined) {\n        setInternalValue(newTags)\n      }\n      onChange?.(newTags)\n    },\n    [controlledValue, onChange]\n  )\n\n  const addTag = useCallback(\n    (value: string) => {\n      const trimmed = transformTag(value)\n      if (!trimmed) return false\n\n      // Check max tags\n      if (maxTags && tags.length >= maxTags) {\n        setError(`Maximum ${maxTags} tags allowed`)\n        return false\n      }\n\n      // Check duplicates\n      if (!allowDuplicates && tags.some((t) => t.label.toLowerCase() === trimmed.toLowerCase())) {\n        setError('Tag already exists')\n        return false\n      }\n\n      // Validate\n      if (validateTag) {\n        const result = validateTag(trimmed)\n        if (result !== true) {\n          setError(typeof result === 'string' ? result : 'Invalid tag')\n          return false\n        }\n      }\n\n      const newTag: TagItem = {\n        id: `tag-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,\n        label: trimmed,\n      }\n\n      updateTags([...tags, newTag])\n      setInputValue('')\n      setError(null)\n      return true\n    },\n    [tags, maxTags, allowDuplicates, validateTag, transformTag, updateTags]\n  )\n\n  const removeTag = useCallback(\n    (tagId: string) => {\n      if (!isInteractive) return\n      updateTags(tags.filter((t) => t.id !== tagId))\n    },\n    [isInteractive, tags, updateTags]\n  )\n\n  const handleInputChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n    const value = e.target.value\n\n    // Check for delimiter in the value\n    if (value.includes(',')) {\n      const parts = value.split(',')\n      parts.forEach((part, index) => {\n        if (index < parts.length - 1 && part.trim()) {\n          addTag(part)\n        }\n      })\n      setInputValue(parts[parts.length - 1])\n    } else {\n      setInputValue(value)\n    }\n\n    setError(null)\n    setShowSuggestions(true)\n    setActiveSuggestion(-1)\n  }, [addTag])\n\n  const handleKeyDown = useCallback(\n    (e: KeyboardEvent<HTMLInputElement>) => {\n      if (!isInteractive) return\n\n      // Handle suggestions navigation\n      if (showSuggestions && filteredSuggestions.length > 0) {\n        if (e.key === 'ArrowDown') {\n          e.preventDefault()\n          setActiveSuggestion((prev) => Math.min(prev + 1, filteredSuggestions.length - 1))\n          return\n        }\n        if (e.key === 'ArrowUp') {\n          e.preventDefault()\n          setActiveSuggestion((prev) => Math.max(prev - 1, 0))\n          return\n        }\n        if ((e.key === 'Enter' || e.key === 'Tab') && activeSuggestion >= 0) {\n          e.preventDefault()\n          const selected = filteredSuggestions[activeSuggestion]\n          if (selected) {\n            updateTags([...tags, selected])\n            setInputValue('')\n            setShowSuggestions(false)\n            setActiveSuggestion(-1)\n          }\n          return\n        }\n      }\n\n      // Create tag on delimiter\n      if (delimiters.includes(e.key) && inputValue) {\n        e.preventDefault()\n        addTag(inputValue)\n        setShowSuggestions(false)\n        return\n      }\n\n      // Remove last tag on backspace\n      if (e.key === 'Backspace' && !inputValue && tags.length > 0) {\n        removeTag(tags[tags.length - 1].id)\n        return\n      }\n\n      // Close suggestions on escape\n      if (e.key === 'Escape') {\n        setShowSuggestions(false)\n        setActiveSuggestion(-1)\n      }\n    },\n    [isInteractive, showSuggestions, filteredSuggestions, activeSuggestion, delimiters, inputValue, tags, addTag, removeTag, updateTags]\n  )\n\n  // Close suggestions on outside click\n  useEffect(() => {\n    if (!showSuggestions) return\n\n    const handleClick = (e: MouseEvent) => {\n      if (!containerRef.current?.contains(e.target as Node)) {\n        setShowSuggestions(false)\n      }\n    }\n\n    document.addEventListener('mousedown', handleClick)\n    return () => document.removeEventListener('mousedown', handleClick)\n  }, [showSuggestions])\n\n  const containerStyle: CSSProperties = {\n    position: 'relative',\n    width: '100%',\n  }\n\n  const wrapperStyle: CSSProperties = {\n    display: 'flex',\n    flexWrap: 'wrap',\n    alignItems: 'center',\n    gap: config.gap,\n    minHeight: config.height,\n    padding: `${spacing[1]}px ${config.padding}px`,\n    backgroundColor: disabled ? 'var(--brycks-background-muted)' : 'var(--brycks-background-default)',\n    border: `1px solid ${\n      isInvalid || error\n        ? 'var(--brycks-error-default)'\n        : isFocused\n        ? 'var(--brycks-primary-default)'\n        : 'var(--brycks-border-default)'\n    }`,\n    borderRadius: 'var(--brycks-radius-md)',\n    transition: `all ${durations.fast}ms ${easings.easeOut}`,\n    cursor: disabled ? 'not-allowed' : 'text',\n    boxShadow: isFocused ? 'var(--brycks-focus-ring)' : undefined,\n  }\n\n  const tagStyle = (tag: TagItem): CSSProperties => ({\n    display: 'inline-flex',\n    alignItems: 'center',\n    gap: spacing[1],\n    height: config.tagHeight,\n    padding: `0 ${spacing[2]}px`,\n    fontSize: config.fontSize - 1,\n    fontWeight: 500,\n    color: tag.color ? 'white' : 'var(--brycks-foreground-default)',\n    backgroundColor: tag.color || 'var(--brycks-background-muted)',\n    borderRadius: 'var(--brycks-radius-full)',\n    whiteSpace: 'nowrap',\n  })\n\n  const removeButtonStyle: CSSProperties = {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: spacing[4],\n    height: spacing[4],\n    marginLeft: spacing[0.5],\n    marginRight: -spacing[1],\n    color: 'inherit',\n    opacity: 0.7,\n    cursor: 'pointer',\n    borderRadius: 'var(--brycks-radius-full)',\n    transition: `all ${durations.fast}ms ${easings.easeOut}`,\n  }\n\n  const inputStyle: CSSProperties = {\n    flex: 1,\n    minWidth: 100,\n    height: config.tagHeight,\n    padding: 0,\n    fontSize: config.fontSize,\n    color: 'var(--brycks-foreground-default)',\n    backgroundColor: 'transparent',\n    border: 'none',\n    outline: 'none',\n  }\n\n  const suggestionsStyle: CSSProperties = {\n    position: 'absolute',\n    top: '100%',\n    left: 0,\n    right: 0,\n    marginTop: spacing[1],\n    maxHeight: 200,\n    overflowY: 'auto',\n    backgroundColor: 'var(--brycks-background-elevated)',\n    border: '1px solid var(--brycks-border-default)',\n    borderRadius: 'var(--brycks-radius-lg)',\n    boxShadow: 'var(--brycks-shadow-lg)',\n    zIndex: 'var(--brycks-z-dropdown)' as unknown as number,\n    padding: spacing[1],\n  }\n\n  const suggestionStyle = (isActive: boolean): CSSProperties => ({\n    display: 'flex',\n    alignItems: 'center',\n    gap: componentGap.md,\n    padding: `${spacing[2]}px ${spacing[3]}px`,\n    fontSize: config.fontSize,\n    color: 'var(--brycks-foreground-default)',\n    backgroundColor: isActive ? 'var(--brycks-background-muted)' : 'transparent',\n    borderRadius: 'var(--brycks-radius-md)',\n    cursor: 'pointer',\n    transition: `background-color ${durations.fast}ms ${easings.easeOut}`,\n  })\n\n  const errorStyle: CSSProperties = {\n    marginTop: spacing[1],\n    fontSize: fontSizes.sm,\n    color: 'var(--brycks-error-default)',\n  }\n\n  const defaultRenderTag = (tag: TagItem, onRemove: () => void) => (\n    <span key={tag.id} style={tagStyle(tag)}>\n      {tag.label}\n      {isInteractive && (\n        <button\n          type=\"button\"\n          aria-label={`Remove ${tag.label}`}\n          style={removeButtonStyle}\n          onClick={(e) => {\n            e.stopPropagation()\n            onRemove()\n          }}\n          onMouseEnter={(e) => {\n            e.currentTarget.style.opacity = '1'\n            e.currentTarget.style.backgroundColor = 'rgba(0,0,0,0.1)'\n          }}\n          onMouseLeave={(e) => {\n            e.currentTarget.style.opacity = '0.7'\n            e.currentTarget.style.backgroundColor = 'transparent'\n          }}\n        >\n          <CloseIcon />\n        </button>\n      )}\n    </span>\n  )\n\n  return (\n    <div\n      ref={containerRef}\n      className={cx('brycks-tag-input', `brycks-tag-input--${size}`, className)}\n      style={containerStyle}\n      data-testid={testId}\n    >\n      <div\n        style={wrapperStyle}\n        onClick={() => !disabled && inputRef.current?.focus()}\n      >\n        {tags.map((tag) =>\n          renderTag ? renderTag(tag, () => removeTag(tag.id)) : defaultRenderTag(tag, () => removeTag(tag.id))\n        )}\n        <input\n          ref={(node) => {\n            (inputRef as React.MutableRefObject<HTMLInputElement | null>).current = node\n            if (typeof ref === 'function') ref(node)\n            else if (ref) ref.current = node\n          }}\n          type=\"text\"\n          role=\"combobox\"\n          aria-label={ariaLabel}\n          aria-expanded={showSuggestions && filteredSuggestions.length > 0}\n          aria-autocomplete=\"list\"\n          aria-invalid={isInvalid || !!error}\n          value={inputValue}\n          placeholder={tags.length === 0 ? placeholder : ''}\n          disabled={disabled}\n          readOnly={readOnly}\n          style={inputStyle}\n          onChange={handleInputChange}\n          onKeyDown={handleKeyDown}\n          onFocus={() => {\n            setIsFocused(true)\n            setShowSuggestions(true)\n          }}\n          onBlur={() => setIsFocused(false)}\n        />\n      </div>\n\n      {showSuggestions && filteredSuggestions.length > 0 && (\n        <ul role=\"listbox\" style={suggestionsStyle}>\n          {filteredSuggestions.map((suggestion, index) => (\n            <li\n              key={suggestion.id}\n              role=\"option\"\n              aria-selected={index === activeSuggestion}\n              style={suggestionStyle(index === activeSuggestion)}\n              onClick={() => {\n                updateTags([...tags, suggestion])\n                setInputValue('')\n                setShowSuggestions(false)\n                inputRef.current?.focus()\n              }}\n              onMouseEnter={() => setActiveSuggestion(index)}\n            >\n              {suggestion.label}\n            </li>\n          ))}\n        </ul>\n      )}\n\n      {error && <div style={errorStyle}>{error}</div>}\n    </div>\n  )\n})\n\nTagInput.displayName = 'TagInput'\n"],"names":["sizeConfig","componentHeights","fontSizes","spacing","componentPaddingX","CloseIcon","jsx","TagInput","forwardRef","controlledValue","defaultValue","onChange","placeholder","size","maxTags","allowDuplicates","delimiters","disabled","isInvalid","readOnly","validateTag","transformTag","v","suggestions","renderTag","ariaLabel","className","testId","ref","internalValue","setInternalValue","useState","inputValue","setInputValue","isFocused","setIsFocused","error","setError","showSuggestions","setShowSuggestions","activeSuggestion","setActiveSuggestion","inputRef","useRef","containerRef","tags","config","isInteractive","filteredSuggestions","s","updateTags","useCallback","newTags","addTag","value","trimmed","t","result","newTag","removeTag","tagId","handleInputChange","parts","part","index","handleKeyDown","prev","selected","useEffect","handleClick","e","containerStyle","wrapperStyle","durations","easings","tagStyle","tag","removeButtonStyle","inputStyle","suggestionsStyle","suggestionStyle","isActive","componentGap","errorStyle","defaultRenderTag","onRemove","jsxs","cx","node","suggestion"],"mappings":"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"}
+{"version":3,"file":"TagInput.js","sources":["../../../../src/components/form/TagInput/TagInput.tsx"],"sourcesContent":["/**\n * TagInput Component\n *\n * An input field for managing tags/chips with keyboard support.\n * Supports suggestions, validation, and custom tag rendering.\n *\n * @module components/form/TagInput\n */\n\nimport {\n  forwardRef,\n  useState,\n  useCallback,\n  useRef,\n  useEffect,\n  type CSSProperties,\n  type ReactNode,\n  type KeyboardEvent,\n  type ChangeEvent,\n} from 'react'\nimport { cx } from '../../../utils/styles'\nimport { spacing, fontSizes, durations, easings } from '../../../design-system'\nimport { componentHeights, componentPaddingX, componentGap } from '../../../design-system/primitives'\n\nexport type TagInputSize = 'sm' | 'md' | 'lg'\n\nexport interface TagItem {\n  /** Unique identifier */\n  id: string\n  /** Display label */\n  label: string\n  /** Optional color */\n  color?: string\n}\n\nexport interface TagInputProps {\n  /** Current tags */\n  value?: TagItem[]\n  /** Default tags (uncontrolled) */\n  defaultValue?: TagItem[]\n  /** Callback when tags change */\n  onChange?: (tags: TagItem[]) => void\n  /** Placeholder text */\n  placeholder?: string\n  /** Component size */\n  size?: TagInputSize\n  /** Maximum number of tags */\n  maxTags?: number\n  /** Whether to allow duplicates */\n  allowDuplicates?: boolean\n  /** Delimiter keys to create tag (default: Enter, comma) */\n  delimiters?: string[]\n  /** Whether the input is disabled */\n  disabled?: boolean\n  /** Whether the input is invalid */\n  isInvalid?: boolean\n  /** Whether the input is read-only */\n  readOnly?: boolean\n  /** Validation function for new tags */\n  validateTag?: (value: string) => boolean | string\n  /** Transform function for new tag value */\n  transformTag?: (value: string) => string\n  /** Suggested tags for autocomplete */\n  suggestions?: TagItem[]\n  /** Custom tag renderer */\n  renderTag?: (tag: TagItem, onRemove: () => void) => ReactNode\n  /** Message shown when the tag limit is reached */\n  maxTagsMessage?: (maxTags: number) => string\n  /** Message shown when a duplicate tag is rejected */\n  duplicateMessage?: string\n  /** Label for accessibility */\n  'aria-label'?: string\n  /** Custom class name */\n  className?: string\n  /** Test ID */\n  testId?: string\n}\n\nconst sizeConfig: Record<TagInputSize, { height: number; fontSize: number; tagHeight: number; padding: number; gap: number }> = {\n  sm: { height: componentHeights.sm, fontSize: fontSizes.base - 1, tagHeight: spacing[5], padding: componentPaddingX.xs, gap: spacing[1] },\n  md: { height: componentHeights.md, fontSize: fontSizes.base, tagHeight: spacing[6], padding: componentPaddingX.sm, gap: spacing[1.5] },\n  lg: { height: componentHeights.lg, fontSize: fontSizes.md, tagHeight: spacing[7], padding: componentPaddingX.sm, gap: spacing[2] },\n}\n\nfunction CloseIcon() {\n  return (\n    <svg width=\"12\" height=\"12\" viewBox=\"0 0 12 12\" fill=\"none\" aria-hidden=\"true\">\n      <path d=\"M3 3l6 6M9 3l-6 6\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\n    </svg>\n  )\n}\n\nexport const TagInput = forwardRef<HTMLInputElement, TagInputProps>(function TagInput(\n  {\n    value: controlledValue,\n    defaultValue = [],\n    onChange,\n    placeholder = 'Add tags...',\n    size = 'md',\n    maxTags,\n    allowDuplicates = false,\n    delimiters = ['Enter', ','],\n    disabled = false,\n    isInvalid = false,\n    readOnly = false,\n    validateTag,\n    transformTag = (v) => v.trim(),\n    suggestions,\n    renderTag,\n    maxTagsMessage = (max) => `Maximum ${max} tags allowed`,\n    duplicateMessage = 'Tag already exists',\n    'aria-label': ariaLabel = 'Tag input',\n    className,\n    testId,\n  },\n  ref\n) {\n  const [internalValue, setInternalValue] = useState<TagItem[]>(defaultValue)\n  const [inputValue, setInputValue] = useState('')\n  const [isFocused, setIsFocused] = useState(false)\n  const [error, setError] = useState<string | null>(null)\n  const [showSuggestions, setShowSuggestions] = useState(false)\n  const [activeSuggestion, setActiveSuggestion] = useState(-1)\n\n  const inputRef = useRef<HTMLInputElement>(null)\n  const containerRef = useRef<HTMLDivElement>(null)\n\n  const tags = controlledValue !== undefined ? controlledValue : internalValue\n  const config = sizeConfig[size]\n\n  const isInteractive = !disabled && !readOnly\n\n  // Filter suggestions\n  const filteredSuggestions = suggestions?.filter(\n    (s) =>\n      s.label.toLowerCase().includes(inputValue.toLowerCase()) &&\n      !tags.some((t) => t.id === s.id)\n  ) || []\n\n  const updateTags = useCallback(\n    (newTags: TagItem[]) => {\n      if (controlledValue === undefined) {\n        setInternalValue(newTags)\n      }\n      onChange?.(newTags)\n    },\n    [controlledValue, onChange]\n  )\n\n  const addTag = useCallback(\n    (value: string) => {\n      const trimmed = transformTag(value)\n      if (!trimmed) return false\n\n      // Check max tags\n      if (maxTags && tags.length >= maxTags) {\n        setError(maxTagsMessage(maxTags))\n        return false\n      }\n\n      // Check duplicates\n      if (!allowDuplicates && tags.some((t) => t.label.toLowerCase() === trimmed.toLowerCase())) {\n        setError(duplicateMessage)\n        return false\n      }\n\n      // Validate\n      if (validateTag) {\n        const result = validateTag(trimmed)\n        if (result !== true) {\n          setError(typeof result === 'string' ? result : 'Invalid tag')\n          return false\n        }\n      }\n\n      const newTag: TagItem = {\n        id: `tag-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,\n        label: trimmed,\n      }\n\n      updateTags([...tags, newTag])\n      setInputValue('')\n      setError(null)\n      return true\n    },\n    [tags, maxTags, allowDuplicates, validateTag, transformTag, updateTags, maxTagsMessage, duplicateMessage]\n  )\n\n  const removeTag = useCallback(\n    (tagId: string) => {\n      if (!isInteractive) return\n      updateTags(tags.filter((t) => t.id !== tagId))\n    },\n    [isInteractive, tags, updateTags]\n  )\n\n  const handleInputChange = useCallback((e: ChangeEvent<HTMLInputElement>) => {\n    const value = e.target.value\n\n    // Check for delimiter in the value\n    if (value.includes(',')) {\n      const parts = value.split(',')\n      parts.forEach((part, index) => {\n        if (index < parts.length - 1 && part.trim()) {\n          addTag(part)\n        }\n      })\n      setInputValue(parts[parts.length - 1])\n    } else {\n      setInputValue(value)\n    }\n\n    setError(null)\n    setShowSuggestions(true)\n    setActiveSuggestion(-1)\n  }, [addTag])\n\n  const handleKeyDown = useCallback(\n    (e: KeyboardEvent<HTMLInputElement>) => {\n      if (!isInteractive) return\n\n      // Handle suggestions navigation\n      if (showSuggestions && filteredSuggestions.length > 0) {\n        if (e.key === 'ArrowDown') {\n          e.preventDefault()\n          setActiveSuggestion((prev) => Math.min(prev + 1, filteredSuggestions.length - 1))\n          return\n        }\n        if (e.key === 'ArrowUp') {\n          e.preventDefault()\n          setActiveSuggestion((prev) => Math.max(prev - 1, 0))\n          return\n        }\n        if ((e.key === 'Enter' || e.key === 'Tab') && activeSuggestion >= 0) {\n          e.preventDefault()\n          const selected = filteredSuggestions[activeSuggestion]\n          if (selected) {\n            updateTags([...tags, selected])\n            setInputValue('')\n            setShowSuggestions(false)\n            setActiveSuggestion(-1)\n          }\n          return\n        }\n      }\n\n      // Create tag on delimiter\n      if (delimiters.includes(e.key) && inputValue) {\n        e.preventDefault()\n        addTag(inputValue)\n        setShowSuggestions(false)\n        return\n      }\n\n      // Remove last tag on backspace\n      if (e.key === 'Backspace' && !inputValue && tags.length > 0) {\n        removeTag(tags[tags.length - 1].id)\n        return\n      }\n\n      // Close suggestions on escape\n      if (e.key === 'Escape') {\n        setShowSuggestions(false)\n        setActiveSuggestion(-1)\n      }\n    },\n    [isInteractive, showSuggestions, filteredSuggestions, activeSuggestion, delimiters, inputValue, tags, addTag, removeTag, updateTags]\n  )\n\n  // Close suggestions on outside click\n  useEffect(() => {\n    if (!showSuggestions) return\n\n    const handleClick = (e: MouseEvent) => {\n      if (!containerRef.current?.contains(e.target as Node)) {\n        setShowSuggestions(false)\n      }\n    }\n\n    document.addEventListener('mousedown', handleClick)\n    return () => document.removeEventListener('mousedown', handleClick)\n  }, [showSuggestions])\n\n  const containerStyle: CSSProperties = {\n    position: 'relative',\n    width: '100%',\n  }\n\n  const wrapperStyle: CSSProperties = {\n    display: 'flex',\n    flexWrap: 'wrap',\n    alignItems: 'center',\n    gap: config.gap,\n    minHeight: config.height,\n    padding: `${spacing[1]}px ${config.padding}px`,\n    backgroundColor: disabled ? 'var(--brycks-background-muted)' : 'var(--brycks-background-default)',\n    border: `1px solid ${\n      isInvalid || error\n        ? 'var(--brycks-error-default)'\n        : isFocused\n        ? 'var(--brycks-primary-default)'\n        : 'var(--brycks-border-default)'\n    }`,\n    borderRadius: 'var(--brycks-radius-md)',\n    transition: `all ${durations.fast}ms ${easings.easeOut}`,\n    cursor: disabled ? 'not-allowed' : 'text',\n    boxShadow: isFocused ? 'var(--brycks-focus-ring)' : undefined,\n  }\n\n  const tagStyle = (tag: TagItem): CSSProperties => ({\n    display: 'inline-flex',\n    alignItems: 'center',\n    gap: spacing[1],\n    height: config.tagHeight,\n    padding: `0 ${spacing[2]}px`,\n    fontSize: config.fontSize - 1,\n    fontWeight: 500,\n    color: tag.color ? 'white' : 'var(--brycks-foreground-default)',\n    backgroundColor: tag.color || 'var(--brycks-background-muted)',\n    borderRadius: 'var(--brycks-radius-full)',\n    whiteSpace: 'nowrap',\n  })\n\n  const removeButtonStyle: CSSProperties = {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    width: spacing[4],\n    height: spacing[4],\n    marginLeft: spacing[0.5],\n    marginRight: -spacing[1],\n    color: 'inherit',\n    opacity: 0.7,\n    cursor: 'pointer',\n    borderRadius: 'var(--brycks-radius-full)',\n    transition: `all ${durations.fast}ms ${easings.easeOut}`,\n  }\n\n  const inputStyle: CSSProperties = {\n    flex: 1,\n    minWidth: 100,\n    height: config.tagHeight,\n    padding: 0,\n    fontSize: config.fontSize,\n    color: 'var(--brycks-foreground-default)',\n    backgroundColor: 'transparent',\n    border: 'none',\n    outline: 'none',\n  }\n\n  const suggestionsStyle: CSSProperties = {\n    position: 'absolute',\n    top: '100%',\n    left: 0,\n    right: 0,\n    marginTop: spacing[1],\n    maxHeight: 200,\n    overflowY: 'auto',\n    backgroundColor: 'var(--brycks-background-elevated)',\n    border: '1px solid var(--brycks-border-default)',\n    borderRadius: 'var(--brycks-radius-lg)',\n    boxShadow: 'var(--brycks-shadow-lg)',\n    zIndex: 'var(--brycks-z-dropdown)' as unknown as number,\n    padding: spacing[1],\n  }\n\n  const suggestionStyle = (isActive: boolean): CSSProperties => ({\n    display: 'flex',\n    alignItems: 'center',\n    gap: componentGap.md,\n    padding: `${spacing[2]}px ${spacing[3]}px`,\n    fontSize: config.fontSize,\n    color: 'var(--brycks-foreground-default)',\n    backgroundColor: isActive ? 'var(--brycks-background-muted)' : 'transparent',\n    borderRadius: 'var(--brycks-radius-md)',\n    cursor: 'pointer',\n    transition: `background-color ${durations.fast}ms ${easings.easeOut}`,\n  })\n\n  const errorStyle: CSSProperties = {\n    marginTop: spacing[1],\n    fontSize: fontSizes.sm,\n    color: 'var(--brycks-error-default)',\n  }\n\n  const defaultRenderTag = (tag: TagItem, onRemove: () => void) => (\n    <span key={tag.id} style={tagStyle(tag)}>\n      {tag.label}\n      {isInteractive && (\n        <button\n          type=\"button\"\n          aria-label={`Remove ${tag.label}`}\n          style={removeButtonStyle}\n          onClick={(e) => {\n            e.stopPropagation()\n            onRemove()\n          }}\n          onMouseEnter={(e) => {\n            e.currentTarget.style.opacity = '1'\n            e.currentTarget.style.backgroundColor = 'rgba(0,0,0,0.1)'\n          }}\n          onMouseLeave={(e) => {\n            e.currentTarget.style.opacity = '0.7'\n            e.currentTarget.style.backgroundColor = 'transparent'\n          }}\n        >\n          <CloseIcon />\n        </button>\n      )}\n    </span>\n  )\n\n  return (\n    <div\n      ref={containerRef}\n      className={cx('brycks-tag-input', `brycks-tag-input--${size}`, className)}\n      style={containerStyle}\n      data-testid={testId}\n    >\n      <div\n        style={wrapperStyle}\n        onClick={() => !disabled && inputRef.current?.focus()}\n      >\n        {tags.map((tag) =>\n          renderTag ? renderTag(tag, () => removeTag(tag.id)) : defaultRenderTag(tag, () => removeTag(tag.id))\n        )}\n        <input\n          ref={(node) => {\n            (inputRef as React.MutableRefObject<HTMLInputElement | null>).current = node\n            if (typeof ref === 'function') ref(node)\n            else if (ref) ref.current = node\n          }}\n          type=\"text\"\n          role=\"combobox\"\n          aria-label={ariaLabel}\n          aria-expanded={showSuggestions && filteredSuggestions.length > 0}\n          aria-autocomplete=\"list\"\n          aria-invalid={isInvalid || !!error}\n          value={inputValue}\n          placeholder={tags.length === 0 ? placeholder : ''}\n          disabled={disabled}\n          readOnly={readOnly}\n          style={inputStyle}\n          onChange={handleInputChange}\n          onKeyDown={handleKeyDown}\n          onFocus={() => {\n            setIsFocused(true)\n            setShowSuggestions(true)\n          }}\n          onBlur={() => setIsFocused(false)}\n        />\n      </div>\n\n      {showSuggestions && filteredSuggestions.length > 0 && (\n        <ul role=\"listbox\" style={suggestionsStyle}>\n          {filteredSuggestions.map((suggestion, index) => (\n            <li\n              key={suggestion.id}\n              role=\"option\"\n              aria-selected={index === activeSuggestion}\n              style={suggestionStyle(index === activeSuggestion)}\n              onClick={() => {\n                updateTags([...tags, suggestion])\n                setInputValue('')\n                setShowSuggestions(false)\n                inputRef.current?.focus()\n              }}\n              onMouseEnter={() => setActiveSuggestion(index)}\n            >\n              {suggestion.label}\n            </li>\n          ))}\n        </ul>\n      )}\n\n      {error && <div style={errorStyle}>{error}</div>}\n    </div>\n  )\n})\n\nTagInput.displayName = 'TagInput'\n"],"names":["sizeConfig","componentHeights","fontSizes","spacing","componentPaddingX","CloseIcon","jsx","TagInput","forwardRef","controlledValue","defaultValue","onChange","placeholder","size","maxTags","allowDuplicates","delimiters","disabled","isInvalid","readOnly","validateTag","transformTag","v","suggestions","renderTag","maxTagsMessage","max","duplicateMessage","ariaLabel","className","testId","ref","internalValue","setInternalValue","useState","inputValue","setInputValue","isFocused","setIsFocused","error","setError","showSuggestions","setShowSuggestions","activeSuggestion","setActiveSuggestion","inputRef","useRef","containerRef","tags","config","isInteractive","filteredSuggestions","s","updateTags","useCallback","newTags","addTag","value","trimmed","t","result","newTag","removeTag","tagId","handleInputChange","parts","part","index","handleKeyDown","prev","selected","useEffect","handleClick","e","containerStyle","wrapperStyle","durations","easings","tagStyle","tag","removeButtonStyle","inputStyle","suggestionsStyle","suggestionStyle","isActive","componentGap","errorStyle","defaultRenderTag","onRemove","jsxs","cx","node","suggestion"],"mappings":";;;;;;;AA8EA,MAAMA,KAA0H;AAAA,EAC9H,IAAI,EAAE,QAAQC,EAAiB,IAAI,UAAUC,EAAU,OAAO,GAAG,WAAWC,EAAQ,CAAC,GAAG,SAASC,EAAkB,IAAI,KAAKD,EAAQ,CAAC,EAAA;AAAA,EACrI,IAAI,EAAE,QAAQF,EAAiB,IAAI,UAAUC,EAAU,MAAM,WAAWC,EAAQ,CAAC,GAAG,SAASC,EAAkB,IAAI,KAAKD,EAAQ,GAAG,EAAA;AAAA,EACnI,IAAI,EAAE,QAAQF,EAAiB,IAAI,UAAUC,EAAU,IAAI,WAAWC,EAAQ,CAAC,GAAG,SAASC,EAAkB,IAAI,KAAKD,EAAQ,CAAC,EAAA;AACjI;AAEA,SAASE,KAAY;AACnB,SACE,gBAAAC,EAAC,SAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QAAO,eAAY,QACtE,UAAA,gBAAAA,EAAC,QAAA,EAAK,GAAE,qBAAoB,QAAO,gBAAe,aAAY,OAAM,eAAc,QAAA,CAAQ,EAAA,CAC5F;AAEJ;AAEO,MAAMC,KAAWC,GAA4C,SAClE;AAAA,EACE,OAAOC;AAAA,EACP,cAAAC,IAAe,CAAA;AAAA,EACf,UAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,MAAAC,IAAO;AAAA,EACP,SAAAC;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,YAAAC,IAAa,CAAC,SAAS,GAAG;AAAA,EAC1B,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,UAAAC,IAAW;AAAA,EACX,aAAAC;AAAA,EACA,cAAAC,IAAe,CAACC,MAAMA,EAAE,KAAA;AAAA,EACxB,aAAAC;AAAA,EACA,WAAAC;AAAA,EACA,gBAAAC,IAAiB,CAACC,MAAQ,WAAWA,CAAG;AAAA,EACxC,kBAAAC,IAAmB;AAAA,EACnB,cAAcC,IAAY;AAAA,EAC1B,WAAAC;AAAA,EACA,QAAAC;AACF,GACAC,GACA;AACA,QAAM,CAACC,GAAeC,EAAgB,IAAIC,EAAoBxB,CAAY,GACpE,CAACyB,GAAYC,CAAa,IAAIF,EAAS,EAAE,GACzC,CAACG,GAAWC,CAAY,IAAIJ,EAAS,EAAK,GAC1C,CAACK,GAAOC,CAAQ,IAAIN,EAAwB,IAAI,GAChD,CAACO,GAAiBC,CAAkB,IAAIR,EAAS,EAAK,GACtD,CAACS,GAAkBC,CAAmB,IAAIV,EAAS,EAAE,GAErDW,IAAWC,EAAyB,IAAI,GACxCC,IAAeD,EAAuB,IAAI,GAE1CE,IAAOvC,MAAoB,SAAYA,IAAkBuB,GACzDiB,IAASjD,GAAWa,CAAI,GAExBqC,IAAgB,CAACjC,KAAY,CAACE,GAG9BgC,IAAsB5B,GAAa;AAAA,IACvC,CAAC6B,MACCA,EAAE,MAAM,YAAA,EAAc,SAASjB,EAAW,YAAA,CAAa,KACvD,CAACa,EAAK,KAAK,CAAC,MAAM,EAAE,OAAOI,EAAE,EAAE;AAAA,EAAA,KAC9B,CAAA,GAECC,IAAaC;AAAA,IACjB,CAACC,MAAuB;AACtB,MAAI9C,MAAoB,UACtBwB,GAAiBsB,CAAO,GAE1B5C,IAAW4C,CAAO;AAAA,IACpB;AAAA,IACA,CAAC9C,GAAiBE,CAAQ;AAAA,EAAA,GAGtB6C,IAASF;AAAA,IACb,CAACG,MAAkB;AACjB,YAAMC,IAAUrC,EAAaoC,CAAK;AAClC,UAAI,CAACC,EAAS,QAAO;AAGrB,UAAI5C,KAAWkC,EAAK,UAAUlC;AAC5B,eAAA0B,EAASf,EAAeX,CAAO,CAAC,GACzB;AAIT,UAAI,CAACC,KAAmBiC,EAAK,KAAK,CAACW,MAAMA,EAAE,MAAM,YAAA,MAAkBD,EAAQ,YAAA,CAAa;AACtF,eAAAlB,EAASb,CAAgB,GAClB;AAIT,UAAIP,GAAa;AACf,cAAMwC,IAASxC,EAAYsC,CAAO;AAClC,YAAIE,MAAW;AACb,iBAAApB,EAAS,OAAOoB,KAAW,WAAWA,IAAS,aAAa,GACrD;AAAA,MAEX;AAEA,YAAMC,IAAkB;AAAA,QACtB,IAAI,OAAO,KAAK,IAAA,CAAK,IAAI,KAAK,OAAA,EAAS,SAAS,EAAE,EAAE,OAAO,GAAG,CAAC,CAAC;AAAA,QAChE,OAAOH;AAAA,MAAA;AAGT,aAAAL,EAAW,CAAC,GAAGL,GAAMa,CAAM,CAAC,GAC5BzB,EAAc,EAAE,GAChBI,EAAS,IAAI,GACN;AAAA,IACT;AAAA,IACA,CAACQ,GAAMlC,GAASC,GAAiBK,GAAaC,GAAcgC,GAAY5B,GAAgBE,CAAgB;AAAA,EAAA,GAGpGmC,IAAYR;AAAA,IAChB,CAACS,MAAkB;AACjB,MAAKb,KACLG,EAAWL,EAAK,OAAO,CAAC,MAAM,EAAE,OAAOe,CAAK,CAAC;AAAA,IAC/C;AAAA,IACA,CAACb,GAAeF,GAAMK,CAAU;AAAA,EAAA,GAG5BW,KAAoBV,EAAY,CAAC,MAAqC;AAC1E,UAAMG,IAAQ,EAAE,OAAO;AAGvB,QAAIA,EAAM,SAAS,GAAG,GAAG;AACvB,YAAMQ,IAAQR,EAAM,MAAM,GAAG;AAC7B,MAAAQ,EAAM,QAAQ,CAACC,GAAMC,OAAU;AAC7B,QAAIA,KAAQF,EAAM,SAAS,KAAKC,EAAK,UACnCV,EAAOU,CAAI;AAAA,MAEf,CAAC,GACD9B,EAAc6B,EAAMA,EAAM,SAAS,CAAC,CAAC;AAAA,IACvC;AACE,MAAA7B,EAAcqB,CAAK;AAGrB,IAAAjB,EAAS,IAAI,GACbE,EAAmB,EAAI,GACvBE,EAAoB,EAAE;AAAA,EACxB,GAAG,CAACY,CAAM,CAAC,GAELY,KAAgBd;AAAA,IACpB,CAAC,MAAuC;AACtC,UAAKJ,GAGL;AAAA,YAAIT,KAAmBU,EAAoB,SAAS,GAAG;AACrD,cAAI,EAAE,QAAQ,aAAa;AACzB,cAAE,eAAA,GACFP,EAAoB,CAACyB,MAAS,KAAK,IAAIA,IAAO,GAAGlB,EAAoB,SAAS,CAAC,CAAC;AAChF;AAAA,UACF;AACA,cAAI,EAAE,QAAQ,WAAW;AACvB,cAAE,eAAA,GACFP,EAAoB,CAACyB,MAAS,KAAK,IAAIA,IAAO,GAAG,CAAC,CAAC;AACnD;AAAA,UACF;AACA,eAAK,EAAE,QAAQ,WAAW,EAAE,QAAQ,UAAU1B,KAAoB,GAAG;AACnE,cAAE,eAAA;AACF,kBAAM2B,IAAWnB,EAAoBR,CAAgB;AACrD,YAAI2B,MACFjB,EAAW,CAAC,GAAGL,GAAMsB,CAAQ,CAAC,GAC9BlC,EAAc,EAAE,GAChBM,EAAmB,EAAK,GACxBE,EAAoB,EAAE;AAExB;AAAA,UACF;AAAA,QACF;AAGA,YAAI5B,EAAW,SAAS,EAAE,GAAG,KAAKmB,GAAY;AAC5C,YAAE,eAAA,GACFqB,EAAOrB,CAAU,GACjBO,EAAmB,EAAK;AACxB;AAAA,QACF;AAGA,YAAI,EAAE,QAAQ,eAAe,CAACP,KAAca,EAAK,SAAS,GAAG;AAC3D,UAAAc,EAAUd,EAAKA,EAAK,SAAS,CAAC,EAAE,EAAE;AAClC;AAAA,QACF;AAGA,QAAI,EAAE,QAAQ,aACZN,EAAmB,EAAK,GACxBE,EAAoB,EAAE;AAAA;AAAA,IAE1B;AAAA,IACA,CAACM,GAAeT,GAAiBU,GAAqBR,GAAkB3B,GAAYmB,GAAYa,GAAMQ,GAAQM,GAAWT,CAAU;AAAA,EAAA;AAIrI,EAAAkB,GAAU,MAAM;AACd,QAAI,CAAC9B,EAAiB;AAEtB,UAAM+B,IAAc,CAACC,MAAkB;AACrC,MAAK1B,EAAa,SAAS,SAAS0B,EAAE,MAAc,KAClD/B,EAAmB,EAAK;AAAA,IAE5B;AAEA,oBAAS,iBAAiB,aAAa8B,CAAW,GAC3C,MAAM,SAAS,oBAAoB,aAAaA,CAAW;AAAA,EACpE,GAAG,CAAC/B,CAAe,CAAC;AAEpB,QAAMiC,KAAgC;AAAA,IACpC,UAAU;AAAA,IACV,OAAO;AAAA,EAAA,GAGHC,KAA8B;AAAA,IAClC,SAAS;AAAA,IACT,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,KAAK1B,EAAO;AAAA,IACZ,WAAWA,EAAO;AAAA,IAClB,SAAS,GAAG9C,EAAQ,CAAC,CAAC,MAAM8C,EAAO,OAAO;AAAA,IAC1C,iBAAiBhC,IAAW,mCAAmC;AAAA,IAC/D,QAAQ,aACNC,KAAaqB,IACT,gCACAF,IACA,kCACA,8BACN;AAAA,IACA,cAAc;AAAA,IACd,YAAY,OAAOuC,EAAU,IAAI,MAAMC,EAAQ,OAAO;AAAA,IACtD,QAAQ5D,IAAW,gBAAgB;AAAA,IACnC,WAAWoB,IAAY,6BAA6B;AAAA,EAAA,GAGhDyC,KAAW,CAACC,OAAiC;AAAA,IACjD,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,KAAK5E,EAAQ,CAAC;AAAA,IACd,QAAQ8C,EAAO;AAAA,IACf,SAAS,KAAK9C,EAAQ,CAAC,CAAC;AAAA,IACxB,UAAU8C,EAAO,WAAW;AAAA,IAC5B,YAAY;AAAA,IACZ,OAAO8B,EAAI,QAAQ,UAAU;AAAA,IAC7B,iBAAiBA,EAAI,SAAS;AAAA,IAC9B,cAAc;AAAA,IACd,YAAY;AAAA,EAAA,IAGRC,KAAmC;AAAA,IACvC,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,OAAO7E,EAAQ,CAAC;AAAA,IAChB,QAAQA,EAAQ,CAAC;AAAA,IACjB,YAAYA,EAAQ,GAAG;AAAA,IACvB,aAAa,CAACA,EAAQ,CAAC;AAAA,IACvB,OAAO;AAAA,IACP,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,cAAc;AAAA,IACd,YAAY,OAAOyE,EAAU,IAAI,MAAMC,EAAQ,OAAO;AAAA,EAAA,GAGlDI,KAA4B;AAAA,IAChC,MAAM;AAAA,IACN,UAAU;AAAA,IACV,QAAQhC,EAAO;AAAA,IACf,SAAS;AAAA,IACT,UAAUA,EAAO;AAAA,IACjB,OAAO;AAAA,IACP,iBAAiB;AAAA,IACjB,QAAQ;AAAA,IACR,SAAS;AAAA,EAAA,GAGLiC,KAAkC;AAAA,IACtC,UAAU;AAAA,IACV,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,IACP,WAAW/E,EAAQ,CAAC;AAAA,IACpB,WAAW;AAAA,IACX,WAAW;AAAA,IACX,iBAAiB;AAAA,IACjB,QAAQ;AAAA,IACR,cAAc;AAAA,IACd,WAAW;AAAA,IACX,QAAQ;AAAA,IACR,SAASA,EAAQ,CAAC;AAAA,EAAA,GAGdgF,KAAkB,CAACC,OAAsC;AAAA,IAC7D,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,KAAKC,GAAa;AAAA,IAClB,SAAS,GAAGlF,EAAQ,CAAC,CAAC,MAAMA,EAAQ,CAAC,CAAC;AAAA,IACtC,UAAU8C,EAAO;AAAA,IACjB,OAAO;AAAA,IACP,iBAAiBmC,IAAW,mCAAmC;AAAA,IAC/D,cAAc;AAAA,IACd,QAAQ;AAAA,IACR,YAAY,oBAAoBR,EAAU,IAAI,MAAMC,EAAQ,OAAO;AAAA,EAAA,IAG/DS,KAA4B;AAAA,IAChC,WAAWnF,EAAQ,CAAC;AAAA,IACpB,UAAUD,EAAU;AAAA,IACpB,OAAO;AAAA,EAAA,GAGHqF,KAAmB,CAACR,GAAcS,wBACrC,QAAA,EAAkB,OAAOV,GAASC,CAAG,GACnC,UAAA;AAAA,IAAAA,EAAI;AAAA,IACJ7B,KACC,gBAAA5C;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,cAAY,UAAUyE,EAAI,KAAK;AAAA,QAC/B,OAAOC;AAAA,QACP,SAAS,CAACP,MAAM;AACd,UAAAA,EAAE,gBAAA,GACFe,EAAA;AAAA,QACF;AAAA,QACA,cAAc,CAACf,MAAM;AACnB,UAAAA,EAAE,cAAc,MAAM,UAAU,KAChCA,EAAE,cAAc,MAAM,kBAAkB;AAAA,QAC1C;AAAA,QACA,cAAc,CAACA,MAAM;AACnB,UAAAA,EAAE,cAAc,MAAM,UAAU,OAChCA,EAAE,cAAc,MAAM,kBAAkB;AAAA,QAC1C;AAAA,QAEA,4BAACpE,IAAA,CAAA,CAAU;AAAA,MAAA;AAAA,IAAA;AAAA,EACb,EAAA,GArBO0E,EAAI,EAuBf;AAGF,SACE,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAK1C;AAAA,MACL,WAAW2C,GAAG,oBAAoB,qBAAqB7E,CAAI,IAAIgB,EAAS;AAAA,MACxE,OAAO6C;AAAA,MACP,eAAa5C;AAAA,MAEb,UAAA;AAAA,QAAA,gBAAA2D;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,OAAOd;AAAA,YACP,SAAS,MAAM,CAAC1D,KAAY4B,EAAS,SAAS,MAAA;AAAA,YAE7C,UAAA;AAAA,cAAAG,EAAK;AAAA,gBAAI,CAAC+B,MACTvD,IAAYA,EAAUuD,GAAK,MAAMjB,EAAUiB,EAAI,EAAE,CAAC,IAAIQ,GAAiBR,GAAK,MAAMjB,EAAUiB,EAAI,EAAE,CAAC;AAAA,cAAA;AAAA,cAErG,gBAAAzE;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,KAAK,CAACqF,MAAS;AACZ,oBAAA9C,EAA6D,UAAU8C,GACpE,OAAO5D,KAAQ,aAAYA,EAAI4D,CAAI,IAC9B5D,QAAS,UAAU4D;AAAA,kBAC9B;AAAA,kBACA,MAAK;AAAA,kBACL,MAAK;AAAA,kBACL,cAAY/D;AAAA,kBACZ,iBAAea,KAAmBU,EAAoB,SAAS;AAAA,kBAC/D,qBAAkB;AAAA,kBAClB,gBAAcjC,KAAa,CAAC,CAACqB;AAAA,kBAC7B,OAAOJ;AAAA,kBACP,aAAaa,EAAK,WAAW,IAAIpC,IAAc;AAAA,kBAC/C,UAAAK;AAAA,kBACA,UAAAE;AAAA,kBACA,OAAO8D;AAAA,kBACP,UAAUjB;AAAA,kBACV,WAAWI;AAAA,kBACX,SAAS,MAAM;AACb,oBAAA9B,EAAa,EAAI,GACjBI,EAAmB,EAAI;AAAA,kBACzB;AAAA,kBACA,QAAQ,MAAMJ,EAAa,EAAK;AAAA,gBAAA;AAAA,cAAA;AAAA,YAClC;AAAA,UAAA;AAAA,QAAA;AAAA,QAGDG,KAAmBU,EAAoB,SAAS,uBAC9C,MAAA,EAAG,MAAK,WAAU,OAAO+B,IACvB,UAAA/B,EAAoB,IAAI,CAACyC,GAAYzB,MACpC,gBAAA7D;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,MAAK;AAAA,YACL,iBAAe6D,MAAUxB;AAAA,YACzB,OAAOwC,GAAgBhB,MAAUxB,CAAgB;AAAA,YACjD,SAAS,MAAM;AACb,cAAAU,EAAW,CAAC,GAAGL,GAAM4C,CAAU,CAAC,GAChCxD,EAAc,EAAE,GAChBM,EAAmB,EAAK,GACxBG,EAAS,SAAS,MAAA;AAAA,YACpB;AAAA,YACA,cAAc,MAAMD,EAAoBuB,CAAK;AAAA,YAE5C,UAAAyB,EAAW;AAAA,UAAA;AAAA,UAZPA,EAAW;AAAA,QAAA,CAcnB,GACH;AAAA,QAGDrD,KAAS,gBAAAjC,EAAC,OAAA,EAAI,OAAOgF,IAAa,UAAA/C,EAAA,CAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG/C,CAAC;AAEDhC,GAAS,cAAc;"}