@omnifyjp/ui 0.1.7 → 0.2.0

package/dist/{chunk-QX56UQ2I.js.map → chunk-MZ2P566X.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/workflow-diagram.tsx"],"names":[],"mappings":"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","file":"chunk-QX56UQ2I.js","sourcesContent":["import { ArrowRight, CheckCircle, Eye, Bell, GitBranch, Users } from 'lucide-react';\nimport { cn } from '../lib/utils';\nimport { Card, CardContent } from './card';\n\n/**\n * Supported stage types for the workflow diagram. Each type has a dedicated\n * icon (CheckCircle, Eye, Bell, GitBranch) and color.\n */\nexport type WorkflowDiagramStageType = 'approval' | 'review' | 'notification' | 'conditional';\n\n/** A single stage in the workflow diagram. */\nexport interface WorkflowDiagramStage {\n  /** Unique identifier for this stage. */\n  id: string;\n  /** Display name shown on the stage card. */\n  name: string;\n  /** Stage type that determines the icon and color. */\n  type: WorkflowDiagramStageType;\n  /** List of user IDs assigned as approvers. Count is displayed on the card. */\n  approverIds: string[];\n  /** Numeric order used to sort stages left-to-right. */\n  order: number;\n}\n\n/** User-visible labels for the workflow diagram. All have English defaults. */\nexport interface WorkflowDiagramLabels {\n  /** Label shown above stage name for each stage type */\n  approval?: string;\n  review?: string;\n  notification?: string;\n  conditional?: string;\n  /** Text for the approver count (e.g. \"approvers\") */\n  approvers?: string;\n}\n\nexport interface WorkflowDiagramProps {\n  /** Ordered list of stages to display. Will be sorted by `order`. */\n  stages: WorkflowDiagramStage[];\n  /** The id of the currently active stage. Highlighted with a blue border. */\n  currentStageId?: string;\n  /** User-visible labels with English defaults. */\n  labels?: WorkflowDiagramLabels;\n  /** Optional additional className for the root container. */\n  className?: string;\n}\n\nconst stageIcons: Record<WorkflowDiagramStageType, typeof CheckCircle> = {\n  approval: CheckCircle,\n  review: Eye,\n  notification: Bell,\n  conditional: GitBranch,\n};\n\nconst stageColors: Record<WorkflowDiagramStageType, string> = {\n  approval: 'text-green-600 dark:text-green-400',\n  review: 'text-blue-600 dark:text-blue-400',\n  notification: 'text-amber-600 dark:text-amber-400',\n  conditional: 'text-purple-600 dark:text-purple-400',\n};\n\nconst defaultLabels: Required<WorkflowDiagramLabels> = {\n  approval: 'Approval',\n  review: 'Review',\n  notification: 'Notification',\n  conditional: 'Conditional',\n  approvers: 'approvers',\n};\n\n/**\n * WorkflowDiagram renders a horizontal flow of workflow stages as cards\n * connected by arrows.\n *\n * Each stage card displays an icon based on stage type, the stage name,\n * and an optional approver count. The current stage is highlighted with\n * a blue border.\n *\n * @example\n * ```tsx\n * <WorkflowDiagram\n *   stages={[\n *     { id: \"s1\", name: \"Manager Review\", type: \"review\", approverIds: [\"u1\"], order: 1 },\n *     { id: \"s2\", name: \"Final Approval\", type: \"approval\", approverIds: [\"u2\", \"u3\"], order: 2 },\n *   ]}\n *   currentStageId=\"s1\"\n *   labels={{ approvers: \"approvers\" }}\n * />\n * ```\n */\nexport function WorkflowDiagram({\n  stages,\n  currentStageId,\n  labels,\n  className,\n}: WorkflowDiagramProps) {\n  const sortedStages = [...stages].sort((a, b) => a.order - b.order);\n\n  const resolvedLabels = { ...defaultLabels, ...labels };\n\n  const typeLabels: Record<WorkflowDiagramStageType, string> = {\n    approval: resolvedLabels.approval,\n    review: resolvedLabels.review,\n    notification: resolvedLabels.notification,\n    conditional: resolvedLabels.conditional,\n  };\n\n  return (\n    <div className={cn('flex items-start gap-2 overflow-x-auto pb-2', className)}>\n      {sortedStages.map((stage, index) => {\n        const Icon = stageIcons[stage.type];\n        const isCurrent = stage.id === currentStageId;\n\n        return (\n          <div key={stage.id} className=\"flex items-center gap-2 flex-shrink-0\">\n            <Card className={cn('w-48', isCurrent && 'border-blue-500 dark:border-blue-400 border-2')}>\n              <CardContent className=\"px-3 py-3\">\n                <div className=\"flex items-center gap-2 mb-1\">\n                  <Icon className={cn('w-4 h-4', stageColors[stage.type])} />\n                  <span className=\"text-xs font-medium text-muted-foreground\">\n                    {typeLabels[stage.type]}\n                  </span>\n                </div>\n                <p className=\"text-sm font-medium truncate\">{stage.name}</p>\n                {stage.approverIds.length > 0 && (\n                  <div className=\"flex items-center gap-1 mt-1.5 text-xs text-muted-foreground\">\n                    <Users className=\"w-3 h-3\" />\n                    <span>\n                      {stage.approverIds.length} {resolvedLabels.approvers.toLowerCase()}\n                    </span>\n                  </div>\n                )}\n              </CardContent>\n            </Card>\n            {index < sortedStages.length - 1 && (\n              <ArrowRight className=\"w-4 h-4 text-muted-foreground flex-shrink-0\" />\n            )}\n          </div>\n        );\n      })}\n    </div>\n  );\n}\n"]}
+{"version":3,"sources":["../src/components/workflow-diagram.tsx"],"names":[],"mappings":"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","file":"chunk-MZ2P566X.js","sourcesContent":["import { ArrowRight, CheckCircle, Eye, Bell, GitBranch, Users } from 'lucide-react';\nimport { cn } from '../lib/utils';\nimport { Card, CardContent } from './card';\n\n/**\n * Supported stage types for the workflow diagram. Each type has a dedicated\n * icon (CheckCircle, Eye, Bell, GitBranch) and color.\n */\nexport type WorkflowDiagramStageType = 'approval' | 'review' | 'notification' | 'conditional';\n\n/** A single stage in the workflow diagram. */\nexport interface WorkflowDiagramStage {\n  /** Unique identifier for this stage. */\n  id: string;\n  /** Display name shown on the stage card. */\n  name: string;\n  /** Stage type that determines the icon and color. */\n  type: WorkflowDiagramStageType;\n  /** List of user IDs assigned as approvers. Count is displayed on the card. */\n  approverIds: string[];\n  /** Numeric order used to sort stages left-to-right. */\n  order: number;\n}\n\n/** User-visible labels for the workflow diagram. All have English defaults. */\nexport interface WorkflowDiagramLabels {\n  /** Label shown above stage name for each stage type */\n  approval?: string;\n  review?: string;\n  notification?: string;\n  conditional?: string;\n  /** Text for the approver count (e.g. \"approvers\") */\n  approvers?: string;\n}\n\nexport interface WorkflowDiagramProps {\n  /** Ordered list of stages to display. Will be sorted by `order`. */\n  stages: WorkflowDiagramStage[];\n  /** The id of the currently active stage. Highlighted with a blue border. */\n  currentStageId?: string;\n  /** User-visible labels with English defaults. */\n  labels?: WorkflowDiagramLabels;\n  /** Optional additional className for the root container. */\n  className?: string;\n}\n\nconst stageIcons: Record<WorkflowDiagramStageType, typeof CheckCircle> = {\n  approval: CheckCircle,\n  review: Eye,\n  notification: Bell,\n  conditional: GitBranch,\n};\n\nconst stageColors: Record<WorkflowDiagramStageType, string> = {\n  approval: 'text-green-600 dark:text-green-400',\n  review: 'text-blue-600 dark:text-blue-400',\n  notification: 'text-amber-600 dark:text-amber-400',\n  conditional: 'text-purple-600 dark:text-purple-400',\n};\n\nconst defaultLabels: Required<WorkflowDiagramLabels> = {\n  approval: 'Approval',\n  review: 'Review',\n  notification: 'Notification',\n  conditional: 'Conditional',\n  approvers: 'approvers',\n};\n\n/**\n * WorkflowDiagram renders a horizontal flow of workflow stages as cards\n * connected by arrows.\n *\n * Each stage card displays an icon based on stage type, the stage name,\n * and an optional approver count. The current stage is highlighted with\n * a blue border.\n *\n * @example\n * ```tsx\n * <WorkflowDiagram\n *   stages={[\n *     { id: \"s1\", name: \"Manager Review\", type: \"review\", approverIds: [\"u1\"], order: 1 },\n *     { id: \"s2\", name: \"Final Approval\", type: \"approval\", approverIds: [\"u2\", \"u3\"], order: 2 },\n *   ]}\n *   currentStageId=\"s1\"\n *   labels={{ approvers: \"approvers\" }}\n * />\n * ```\n */\nexport function WorkflowDiagram({\n  stages,\n  currentStageId,\n  labels,\n  className,\n}: WorkflowDiagramProps) {\n  const sortedStages = [...stages].sort((a, b) => a.order - b.order);\n\n  const resolvedLabels = { ...defaultLabels, ...labels };\n\n  const typeLabels: Record<WorkflowDiagramStageType, string> = {\n    approval: resolvedLabels.approval,\n    review: resolvedLabels.review,\n    notification: resolvedLabels.notification,\n    conditional: resolvedLabels.conditional,\n  };\n\n  return (\n    <div className={cn('flex items-start gap-2 overflow-x-auto pb-2', className)}>\n      {sortedStages.map((stage, index) => {\n        const Icon = stageIcons[stage.type];\n        const isCurrent = stage.id === currentStageId;\n\n        return (\n          <div key={stage.id} className=\"flex items-center gap-2 flex-shrink-0\">\n            <Card className={cn('w-48', isCurrent && 'border-primary border-2')}>\n              <CardContent className=\"px-3 py-3\">\n                <div className=\"flex items-center gap-2 mb-1\">\n                  <Icon className={cn('w-4 h-4', stageColors[stage.type])} />\n                  <span className=\"text-xs font-medium text-muted-foreground\">\n                    {typeLabels[stage.type]}\n                  </span>\n                </div>\n                <p className=\"text-sm font-medium truncate\">{stage.name}</p>\n                {stage.approverIds.length > 0 && (\n                  <div className=\"flex items-center gap-1 mt-1.5 text-xs text-muted-foreground\">\n                    <Users className=\"w-3 h-3\" />\n                    <span>\n                      {stage.approverIds.length} {resolvedLabels.approvers.toLowerCase()}\n                    </span>\n                  </div>\n                )}\n              </CardContent>\n            </Card>\n            {index < sortedStages.length - 1 && (\n              <ArrowRight className=\"w-4 h-4 text-muted-foreground flex-shrink-0\" />\n            )}\n          </div>\n        );\n      })}\n    </div>\n  );\n}\n"]}

package/dist/{chunk-C7LPAIU6.js → chunk-N47H4MHX.js}

@@ -1,4 +1,4 @@
-import { Badge } from './chunk-OBZQTY3H.js';
+import { Badge } from './chunk-A3BB5ZOC.js';
 import { cn } from './chunk-DGPY4WP3.js';
 import { MapPin, GitBranch, Building2, Globe } from 'lucide-react';
 import { jsxs, jsx } from 'react/jsx-runtime';
@@ -37,5 +37,5 @@ function ScopeTypeBadge({
 }
 
 export { ScopeTypeBadge };
-//# sourceMappingURL=chunk-C7LPAIU6.js.map
-//# sourceMappingURL=chunk-C7LPAIU6.js.map
+//# sourceMappingURL=chunk-N47H4MHX.js.map
+//# sourceMappingURL=chunk-N47H4MHX.js.map

package/dist/{chunk-C7LPAIU6.js.map → chunk-N47H4MHX.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/scope-type-badge.tsx"],"names":[],"mappings":";;;;;AAYA,IAAM,cAAA,GAAuD;AAAA,EAC3D,MAAA,EAAQ;AAAA,IACN,SAAA,EACE,yGAAA;AAAA,IACF,IAAA,EAAM;AAAA,GACR;AAAA,EACA,YAAA,EAAc;AAAA,IACZ,SAAA,EACE,qHAAA;AAAA,IACF,IAAA,EAAM;AAAA,GACR;AAAA,EACA,MAAA,EAAQ;AAAA,IACN,SAAA,EACE,+GAAA;AAAA,IACF,IAAA,EAAM;AAAA,GACR;AAAA,EACA,QAAA,EAAU;AAAA,IACR,SAAA,EACE,+GAAA;AAAA,IACF,IAAA,EAAM;AAAA;AAEV,CAAA;AAyBO,SAAS,cAAA,CAAe;AAAA,EAC7B,IAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,MAAA,EAAQ;AACV,CAAA,EAAwB;AACtB,EAAA,MAAM,QAAA,GAAW,cAAA,CAAe,IAAI,CAAA,IAAK,cAAA,CAAe,MAAA;AACxD,EAAA,MAAM,IAAA,GAAO,cAAA,EAAgB,IAAA,IAAQ,QAAA,CAAS,IAAA;AAC9C,EAAA,MAAM,cAAA,GAAiB,cAAA,EAAgB,SAAA,IAAa,QAAA,CAAS,SAAA;AAE7D,EAAA,uBACE,IAAA,CAAC,SAAM,OAAA,EAAQ,SAAA,EAAU,WAAW,EAAA,CAAG,cAAA,EAAgB,SAAS,CAAA,EAC9D,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,WAAU,cAAA,EAAe,CAAA;AAAA,IAC9B;AAAA,GAAA,EACH,CAAA;AAEJ","file":"chunk-C7LPAIU6.js","sourcesContent":["import { Globe, Building2, GitBranch, MapPin, type LucideIcon } from 'lucide-react';\nimport { Badge } from './badge';\nimport { cn } from '../lib/utils';\n\n/** Custom style and icon overrides for a scope type badge. */\nexport interface ScopeTypeBadgeStyles {\n  /** Tailwind className string for the badge background, text, and border colors. */\n  className: string;\n  /** Lucide icon component to display in the badge. */\n  icon: LucideIcon;\n}\n\nconst DEFAULT_STYLES: Record<string, ScopeTypeBadgeStyles> = {\n  global: {\n    className:\n      'bg-blue-50 dark:bg-blue-500/15 text-blue-600 dark:text-blue-400 border-blue-200 dark:border-blue-500/30',\n    icon: Globe,\n  },\n  organization: {\n    className:\n      'bg-purple-50 dark:bg-purple-500/15 text-purple-600 dark:text-purple-400 border-purple-200 dark:border-purple-500/30',\n    icon: Building2,\n  },\n  branch: {\n    className:\n      'bg-amber-50 dark:bg-amber-500/15 text-amber-600 dark:text-amber-400 border-amber-200 dark:border-amber-500/30',\n    icon: GitBranch,\n  },\n  location: {\n    className:\n      'bg-green-50 dark:bg-green-500/15 text-green-600 dark:text-green-400 border-green-200 dark:border-green-500/30',\n    icon: MapPin,\n  },\n};\n\nexport interface ScopeTypeBadgeProps {\n  /** The scope type key (e.g. \"global\", \"organization\", \"branch\", \"location\"). */\n  type: string;\n  /** The display label for the badge. */\n  label: string;\n  /** Optional className to append to the badge. */\n  className?: string;\n  /** Override default styles and icon for the given type. */\n  styles?: Partial<ScopeTypeBadgeStyles>;\n}\n\n/**\n * Color-coded badge with an icon indicating a scope type. Ships with built-in\n * styles for global (blue/Globe), organization (purple/Building2), branch\n * (amber/GitBranch), and location (green/MapPin). Custom types fall back to\n * global styling unless overridden via `styles`.\n *\n * @example\n * ```tsx\n * <ScopeTypeBadge type=\"organization\" label=\"Organization\" />\n * <ScopeTypeBadge type=\"branch\" label=\"Branch\" />\n * ```\n */\nexport function ScopeTypeBadge({\n  type,\n  label,\n  className,\n  styles: styleOverrides,\n}: ScopeTypeBadgeProps) {\n  const defaults = DEFAULT_STYLES[type] ?? DEFAULT_STYLES.global;\n  const Icon = styleOverrides?.icon ?? defaults.icon;\n  const badgeClassName = styleOverrides?.className ?? defaults.className;\n\n  return (\n    <Badge variant=\"outline\" className={cn(badgeClassName, className)}>\n      <Icon className=\"w-3 h-3 mr-1\" />\n      {label}\n    </Badge>\n  );\n}\n"]}
+{"version":3,"sources":["../src/components/scope-type-badge.tsx"],"names":[],"mappings":";;;;;AAYA,IAAM,cAAA,GAAuD;AAAA,EAC3D,MAAA,EAAQ;AAAA,IACN,SAAA,EACE,yGAAA;AAAA,IACF,IAAA,EAAM;AAAA,GACR;AAAA,EACA,YAAA,EAAc;AAAA,IACZ,SAAA,EACE,qHAAA;AAAA,IACF,IAAA,EAAM;AAAA,GACR;AAAA,EACA,MAAA,EAAQ;AAAA,IACN,SAAA,EACE,+GAAA;AAAA,IACF,IAAA,EAAM;AAAA,GACR;AAAA,EACA,QAAA,EAAU;AAAA,IACR,SAAA,EACE,+GAAA;AAAA,IACF,IAAA,EAAM;AAAA;AAEV,CAAA;AAyBO,SAAS,cAAA,CAAe;AAAA,EAC7B,IAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,MAAA,EAAQ;AACV,CAAA,EAAwB;AACtB,EAAA,MAAM,QAAA,GAAW,cAAA,CAAe,IAAI,CAAA,IAAK,cAAA,CAAe,MAAA;AACxD,EAAA,MAAM,IAAA,GAAO,cAAA,EAAgB,IAAA,IAAQ,QAAA,CAAS,IAAA;AAC9C,EAAA,MAAM,cAAA,GAAiB,cAAA,EAAgB,SAAA,IAAa,QAAA,CAAS,SAAA;AAE7D,EAAA,uBACE,IAAA,CAAC,SAAM,OAAA,EAAQ,SAAA,EAAU,WAAW,EAAA,CAAG,cAAA,EAAgB,SAAS,CAAA,EAC9D,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,IAAA,EAAA,EAAK,WAAU,cAAA,EAAe,CAAA;AAAA,IAC9B;AAAA,GAAA,EACH,CAAA;AAEJ","file":"chunk-N47H4MHX.js","sourcesContent":["import { Globe, Building2, GitBranch, MapPin, type LucideIcon } from 'lucide-react';\nimport { Badge } from './badge';\nimport { cn } from '../lib/utils';\n\n/** Custom style and icon overrides for a scope type badge. */\nexport interface ScopeTypeBadgeStyles {\n  /** Tailwind className string for the badge background, text, and border colors. */\n  className: string;\n  /** Lucide icon component to display in the badge. */\n  icon: LucideIcon;\n}\n\nconst DEFAULT_STYLES: Record<string, ScopeTypeBadgeStyles> = {\n  global: {\n    className:\n      'bg-blue-50 dark:bg-blue-500/15 text-blue-600 dark:text-blue-400 border-blue-200 dark:border-blue-500/30',\n    icon: Globe,\n  },\n  organization: {\n    className:\n      'bg-purple-50 dark:bg-purple-500/15 text-purple-600 dark:text-purple-400 border-purple-200 dark:border-purple-500/30',\n    icon: Building2,\n  },\n  branch: {\n    className:\n      'bg-amber-50 dark:bg-amber-500/15 text-amber-600 dark:text-amber-400 border-amber-200 dark:border-amber-500/30',\n    icon: GitBranch,\n  },\n  location: {\n    className:\n      'bg-green-50 dark:bg-green-500/15 text-green-600 dark:text-green-400 border-green-200 dark:border-green-500/30',\n    icon: MapPin,\n  },\n};\n\nexport interface ScopeTypeBadgeProps {\n  /** The scope type key (e.g. \"global\", \"organization\", \"branch\", \"location\"). */\n  type: string;\n  /** The display label for the badge. */\n  label: string;\n  /** Optional className to append to the badge. */\n  className?: string;\n  /** Override default styles and icon for the given type. */\n  styles?: Partial<ScopeTypeBadgeStyles>;\n}\n\n/**\n * Color-coded badge with an icon indicating a scope type. Ships with built-in\n * styles for global (blue/Globe), organization (purple/Building2), branch\n * (amber/GitBranch), and location (green/MapPin). Custom types fall back to\n * global styling unless overridden via `styles`.\n *\n * @example\n * ```tsx\n * <ScopeTypeBadge type=\"organization\" label=\"Organization\" />\n * <ScopeTypeBadge type=\"branch\" label=\"Branch\" />\n * ```\n */\nexport function ScopeTypeBadge({\n  type,\n  label,\n  className,\n  styles: styleOverrides,\n}: ScopeTypeBadgeProps) {\n  const defaults = DEFAULT_STYLES[type] ?? DEFAULT_STYLES.global;\n  const Icon = styleOverrides?.icon ?? defaults.icon;\n  const badgeClassName = styleOverrides?.className ?? defaults.className;\n\n  return (\n    <Badge variant=\"outline\" className={cn(badgeClassName, className)}>\n      <Icon className=\"w-3 h-3 mr-1\" />\n      {label}\n    </Badge>\n  );\n}\n"]}

package/dist/{chunk-UVOH3VSV.js → chunk-NPL2R5LD.js}

@@ -1,6 +1,6 @@
 import { Popover, PopoverTrigger, PopoverContent } from './chunk-C34KSTWA.js';
 import { Command, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem } from './chunk-6GWVQB3Q.js';
-import { Button } from './chunk-Y65FNGEE.js';
+import { Button } from './chunk-55E7D2HR.js';
 import { cn } from './chunk-DGPY4WP3.js';
 import * as React from 'react';
 import { X, ChevronsUpDown, Check } from 'lucide-react';
@@ -167,5 +167,5 @@ function MultiCombobox({
 }
 
 export { Combobox, MultiCombobox };
-//# sourceMappingURL=chunk-UVOH3VSV.js.map
-//# sourceMappingURL=chunk-UVOH3VSV.js.map
+//# sourceMappingURL=chunk-NPL2R5LD.js.map
+//# sourceMappingURL=chunk-NPL2R5LD.js.map

package/dist/{chunk-UVOH3VSV.js.map → chunk-NPL2R5LD.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/combobox.tsx"],"names":[],"mappings":"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","file":"chunk-UVOH3VSV.js","sourcesContent":["import * as React from \"react\";\nimport { Check, ChevronsUpDown, X } from \"lucide-react\";\n\nimport { cn } from \"../lib/utils\";\nimport { Button } from \"./button\";\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n} from \"./command\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"./popover\";\n\n/** A single option in the Combobox dropdown. */\nexport interface ComboboxOption {\n  /** Unique value for this option. */\n  value: string;\n  /** Display label shown in the dropdown list. */\n  label: string;\n  /** Whether this option is non-selectable. */\n  disabled?: boolean;\n}\n\ninterface ComboboxProps {\n  /** Available options to display in the dropdown. */\n  options: ComboboxOption[];\n  /** Currently selected value. */\n  value?: string;\n  /** Callback fired when the selected value changes. */\n  onChange?: (value: string) => void;\n  /** Placeholder text shown when no value is selected. */\n  placeholder?: string;\n  /** Placeholder text for the search input inside the dropdown. */\n  searchPlaceholder?: string;\n  /** Text shown when no options match the search query. */\n  emptyText?: string;\n  /** Additional CSS class for the trigger button. */\n  className?: string;\n  /** Whether the combobox is disabled. */\n  disabled?: boolean;\n  /** Whether to show a clear button when a value is selected. */\n  clearable?: boolean;\n}\n\n/**\n * Searchable single-select combobox built on cmdk and Radix Popover.\n * Combines a text search input with a selectable option list.\n *\n * @example\n * ```tsx\n * const [value, setValue] = useState(\"\");\n *\n * <Combobox\n *   options={[\n *     { value: \"react\", label: \"React\" },\n *     { value: \"vue\", label: \"Vue\" },\n *     { value: \"svelte\", label: \"Svelte\" },\n *   ]}\n *   value={value}\n *   onChange={setValue}\n *   placeholder=\"Select framework...\"\n *   searchPlaceholder=\"Search...\"\n *   clearable\n * />\n * ```\n */\nexport function Combobox({\n  options,\n  value,\n  onChange,\n  placeholder = \"Chọn...\",\n  searchPlaceholder = \"Tìm kiếm...\",\n  emptyText = \"Không tìm thấy kết quả.\",\n  className,\n  disabled,\n  clearable = false,\n}: ComboboxProps) {\n  const [open, setOpen] = React.useState(false);\n\n  const selectedOption = options.find((option) => option.value === value);\n\n  const handleClear = (e: React.MouseEvent) => {\n    e.stopPropagation();\n    onChange?.(\"\");\n  };\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <Button\n          variant=\"outline\"\n          role=\"combobox\"\n          aria-expanded={open}\n          disabled={disabled}\n          className={cn(\n            \"w-full justify-between\",\n            !value && \"text-muted-foreground\",\n            className\n          )}\n        >\n          <span className=\"truncate\">\n            {selectedOption ? selectedOption.label : placeholder}\n          </span>\n          <div className=\"flex items-center gap-1 ml-2\">\n            {clearable && value && (\n              <X\n                className=\"h-4 w-4 opacity-50 hover:opacity-100\"\n                onClick={handleClear}\n              />\n            )}\n            <ChevronsUpDown className=\"h-4 w-4 shrink-0 opacity-50\" />\n          </div>\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-[--radix-popover-trigger-width] p-0\" align=\"start\">\n        <Command>\n          <CommandInput placeholder={searchPlaceholder} />\n          <CommandList>\n            <CommandEmpty>{emptyText}</CommandEmpty>\n            <CommandGroup>\n              {options.map((option) => (\n                <CommandItem\n                  key={option.value}\n                  value={option.value}\n                  disabled={option.disabled}\n                  onSelect={(currentValue) => {\n                    onChange?.(currentValue === value ? \"\" : currentValue);\n                    setOpen(false);\n                  }}\n                >\n                  <Check\n                    className={cn(\n                      \"mr-2 h-4 w-4\",\n                      value === option.value ? \"opacity-100\" : \"opacity-0\"\n                    )}\n                  />\n                  {option.label}\n                </CommandItem>\n              ))}\n            </CommandGroup>\n          </CommandList>\n        </Command>\n      </PopoverContent>\n    </Popover>\n  );\n}\n\ninterface MultiComboboxProps {\n  /** Available options to display in the dropdown. */\n  options: ComboboxOption[];\n  /** Array of currently selected values. */\n  value?: string[];\n  /** Callback fired when the selection changes. */\n  onChange?: (value: string[]) => void;\n  /** Placeholder text shown when no values are selected. */\n  placeholder?: string;\n  /** Placeholder text for the search input inside the dropdown. */\n  searchPlaceholder?: string;\n  /** Text shown when no options match the search query. */\n  emptyText?: string;\n  /** Additional CSS class for the trigger button. */\n  className?: string;\n  /** Whether the combobox is disabled. */\n  disabled?: boolean;\n  /** Maximum number of items that can be selected. */\n  maxSelected?: number;\n}\n\n/**\n * Searchable multi-select combobox that allows selecting multiple values.\n * Selected items are shown as a count in the trigger button.\n *\n * @example\n * ```tsx\n * const [selected, setSelected] = useState<string[]>([]);\n *\n * <MultiCombobox\n *   options={[\n *     { value: \"react\", label: \"React\" },\n *     { value: \"vue\", label: \"Vue\" },\n *     { value: \"svelte\", label: \"Svelte\" },\n *   ]}\n *   value={selected}\n *   onChange={setSelected}\n *   placeholder=\"Select frameworks...\"\n *   maxSelected={3}\n * />\n * ```\n */\nexport function MultiCombobox({\n  options,\n  value = [],\n  onChange,\n  placeholder = \"Chọn...\",\n  searchPlaceholder = \"Tìm kiếm...\",\n  emptyText = \"Không tìm thấy kết quả.\",\n  className,\n  disabled,\n  maxSelected,\n}: MultiComboboxProps) {\n  const [open, setOpen] = React.useState(false);\n\n  const selectedLabels = value\n    .map((v) => options.find((opt) => opt.value === v)?.label)\n    .filter(Boolean);\n\n  const handleSelect = (selectedValue: string) => {\n    const newValue = value.includes(selectedValue)\n      ? value.filter((v) => v !== selectedValue)\n      : maxSelected && value.length >= maxSelected\n      ? value\n      : [...value, selectedValue];\n\n    onChange?.(newValue);\n  };\n\n  const handleClearAll = (e: React.MouseEvent) => {\n    e.stopPropagation();\n    onChange?.([]);\n  };\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <Button\n          variant=\"outline\"\n          role=\"combobox\"\n          aria-expanded={open}\n          disabled={disabled}\n          className={cn(\n            \"w-full justify-between\",\n            !value.length && \"text-muted-foreground\",\n            className\n          )}\n        >\n          <span className=\"truncate\">\n            {selectedLabels.length > 0\n              ? selectedLabels.length === 1\n                ? selectedLabels[0]\n                : `${selectedLabels.length} mục đã chọn`\n              : placeholder}\n          </span>\n          <div className=\"flex items-center gap-1 ml-2\">\n            {value.length > 0 && (\n              <X\n                className=\"h-4 w-4 opacity-50 hover:opacity-100\"\n                onClick={handleClearAll}\n              />\n            )}\n            <ChevronsUpDown className=\"h-4 w-4 shrink-0 opacity-50\" />\n          </div>\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-[--radix-popover-trigger-width] p-0\" align=\"start\">\n        <Command>\n          <CommandInput placeholder={searchPlaceholder} />\n          <CommandList>\n            <CommandEmpty>{emptyText}</CommandEmpty>\n            <CommandGroup>\n              {options.map((option) => {\n                const isSelected = value.includes(option.value);\n                const isDisabled =\n                  option.disabled ||\n                  (!isSelected && maxSelected && value.length >= maxSelected);\n\n                return (\n                  <CommandItem\n                    key={option.value}\n                    value={option.value}\n                    disabled={!!isDisabled}\n                    onSelect={() => handleSelect(option.value)}\n                  >\n                    <Check\n                      className={cn(\n                        \"mr-2 h-4 w-4\",\n                        isSelected ? \"opacity-100\" : \"opacity-0\"\n                      )}\n                    />\n                    {option.label}\n                  </CommandItem>\n                );\n              })}\n            </CommandGroup>\n          </CommandList>\n        </Command>\n      </PopoverContent>\n    </Popover>\n  );\n}\n"]}
+{"version":3,"sources":["../src/components/combobox.tsx"],"names":[],"mappings":"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","file":"chunk-NPL2R5LD.js","sourcesContent":["import * as React from \"react\";\nimport { Check, ChevronsUpDown, X } from \"lucide-react\";\n\nimport { cn } from \"../lib/utils\";\nimport { Button } from \"./button\";\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n} from \"./command\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"./popover\";\n\n/** A single option in the Combobox dropdown. */\nexport interface ComboboxOption {\n  /** Unique value for this option. */\n  value: string;\n  /** Display label shown in the dropdown list. */\n  label: string;\n  /** Whether this option is non-selectable. */\n  disabled?: boolean;\n}\n\ninterface ComboboxProps {\n  /** Available options to display in the dropdown. */\n  options: ComboboxOption[];\n  /** Currently selected value. */\n  value?: string;\n  /** Callback fired when the selected value changes. */\n  onChange?: (value: string) => void;\n  /** Placeholder text shown when no value is selected. */\n  placeholder?: string;\n  /** Placeholder text for the search input inside the dropdown. */\n  searchPlaceholder?: string;\n  /** Text shown when no options match the search query. */\n  emptyText?: string;\n  /** Additional CSS class for the trigger button. */\n  className?: string;\n  /** Whether the combobox is disabled. */\n  disabled?: boolean;\n  /** Whether to show a clear button when a value is selected. */\n  clearable?: boolean;\n}\n\n/**\n * Searchable single-select combobox built on cmdk and Radix Popover.\n * Combines a text search input with a selectable option list.\n *\n * @example\n * ```tsx\n * const [value, setValue] = useState(\"\");\n *\n * <Combobox\n *   options={[\n *     { value: \"react\", label: \"React\" },\n *     { value: \"vue\", label: \"Vue\" },\n *     { value: \"svelte\", label: \"Svelte\" },\n *   ]}\n *   value={value}\n *   onChange={setValue}\n *   placeholder=\"Select framework...\"\n *   searchPlaceholder=\"Search...\"\n *   clearable\n * />\n * ```\n */\nexport function Combobox({\n  options,\n  value,\n  onChange,\n  placeholder = \"Chọn...\",\n  searchPlaceholder = \"Tìm kiếm...\",\n  emptyText = \"Không tìm thấy kết quả.\",\n  className,\n  disabled,\n  clearable = false,\n}: ComboboxProps) {\n  const [open, setOpen] = React.useState(false);\n\n  const selectedOption = options.find((option) => option.value === value);\n\n  const handleClear = (e: React.MouseEvent) => {\n    e.stopPropagation();\n    onChange?.(\"\");\n  };\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <Button\n          variant=\"outline\"\n          role=\"combobox\"\n          aria-expanded={open}\n          disabled={disabled}\n          className={cn(\n            \"w-full justify-between\",\n            !value && \"text-muted-foreground\",\n            className\n          )}\n        >\n          <span className=\"truncate\">\n            {selectedOption ? selectedOption.label : placeholder}\n          </span>\n          <div className=\"flex items-center gap-1 ml-2\">\n            {clearable && value && (\n              <X\n                className=\"h-4 w-4 opacity-50 hover:opacity-100\"\n                onClick={handleClear}\n              />\n            )}\n            <ChevronsUpDown className=\"h-4 w-4 shrink-0 opacity-50\" />\n          </div>\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-[--radix-popover-trigger-width] p-0\" align=\"start\">\n        <Command>\n          <CommandInput placeholder={searchPlaceholder} />\n          <CommandList>\n            <CommandEmpty>{emptyText}</CommandEmpty>\n            <CommandGroup>\n              {options.map((option) => (\n                <CommandItem\n                  key={option.value}\n                  value={option.value}\n                  disabled={option.disabled}\n                  onSelect={(currentValue) => {\n                    onChange?.(currentValue === value ? \"\" : currentValue);\n                    setOpen(false);\n                  }}\n                >\n                  <Check\n                    className={cn(\n                      \"mr-2 h-4 w-4\",\n                      value === option.value ? \"opacity-100\" : \"opacity-0\"\n                    )}\n                  />\n                  {option.label}\n                </CommandItem>\n              ))}\n            </CommandGroup>\n          </CommandList>\n        </Command>\n      </PopoverContent>\n    </Popover>\n  );\n}\n\ninterface MultiComboboxProps {\n  /** Available options to display in the dropdown. */\n  options: ComboboxOption[];\n  /** Array of currently selected values. */\n  value?: string[];\n  /** Callback fired when the selection changes. */\n  onChange?: (value: string[]) => void;\n  /** Placeholder text shown when no values are selected. */\n  placeholder?: string;\n  /** Placeholder text for the search input inside the dropdown. */\n  searchPlaceholder?: string;\n  /** Text shown when no options match the search query. */\n  emptyText?: string;\n  /** Additional CSS class for the trigger button. */\n  className?: string;\n  /** Whether the combobox is disabled. */\n  disabled?: boolean;\n  /** Maximum number of items that can be selected. */\n  maxSelected?: number;\n}\n\n/**\n * Searchable multi-select combobox that allows selecting multiple values.\n * Selected items are shown as a count in the trigger button.\n *\n * @example\n * ```tsx\n * const [selected, setSelected] = useState<string[]>([]);\n *\n * <MultiCombobox\n *   options={[\n *     { value: \"react\", label: \"React\" },\n *     { value: \"vue\", label: \"Vue\" },\n *     { value: \"svelte\", label: \"Svelte\" },\n *   ]}\n *   value={selected}\n *   onChange={setSelected}\n *   placeholder=\"Select frameworks...\"\n *   maxSelected={3}\n * />\n * ```\n */\nexport function MultiCombobox({\n  options,\n  value = [],\n  onChange,\n  placeholder = \"Chọn...\",\n  searchPlaceholder = \"Tìm kiếm...\",\n  emptyText = \"Không tìm thấy kết quả.\",\n  className,\n  disabled,\n  maxSelected,\n}: MultiComboboxProps) {\n  const [open, setOpen] = React.useState(false);\n\n  const selectedLabels = value\n    .map((v) => options.find((opt) => opt.value === v)?.label)\n    .filter(Boolean);\n\n  const handleSelect = (selectedValue: string) => {\n    const newValue = value.includes(selectedValue)\n      ? value.filter((v) => v !== selectedValue)\n      : maxSelected && value.length >= maxSelected\n      ? value\n      : [...value, selectedValue];\n\n    onChange?.(newValue);\n  };\n\n  const handleClearAll = (e: React.MouseEvent) => {\n    e.stopPropagation();\n    onChange?.([]);\n  };\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <Button\n          variant=\"outline\"\n          role=\"combobox\"\n          aria-expanded={open}\n          disabled={disabled}\n          className={cn(\n            \"w-full justify-between\",\n            !value.length && \"text-muted-foreground\",\n            className\n          )}\n        >\n          <span className=\"truncate\">\n            {selectedLabels.length > 0\n              ? selectedLabels.length === 1\n                ? selectedLabels[0]\n                : `${selectedLabels.length} mục đã chọn`\n              : placeholder}\n          </span>\n          <div className=\"flex items-center gap-1 ml-2\">\n            {value.length > 0 && (\n              <X\n                className=\"h-4 w-4 opacity-50 hover:opacity-100\"\n                onClick={handleClearAll}\n              />\n            )}\n            <ChevronsUpDown className=\"h-4 w-4 shrink-0 opacity-50\" />\n          </div>\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-[--radix-popover-trigger-width] p-0\" align=\"start\">\n        <Command>\n          <CommandInput placeholder={searchPlaceholder} />\n          <CommandList>\n            <CommandEmpty>{emptyText}</CommandEmpty>\n            <CommandGroup>\n              {options.map((option) => {\n                const isSelected = value.includes(option.value);\n                const isDisabled =\n                  option.disabled ||\n                  (!isSelected && maxSelected && value.length >= maxSelected);\n\n                return (\n                  <CommandItem\n                    key={option.value}\n                    value={option.value}\n                    disabled={!!isDisabled}\n                    onSelect={() => handleSelect(option.value)}\n                  >\n                    <Check\n                      className={cn(\n                        \"mr-2 h-4 w-4\",\n                        isSelected ? \"opacity-100\" : \"opacity-0\"\n                      )}\n                    />\n                    {option.label}\n                  </CommandItem>\n                );\n              })}\n            </CommandGroup>\n          </CommandList>\n        </Command>\n      </PopoverContent>\n    </Popover>\n  );\n}\n"]}

package/dist/chunk-TGYQ3AKH.js

@@ -0,0 +1,95 @@
+import { cn } from './chunk-DGPY4WP3.js';
+import { cva } from 'class-variance-authority';
+import { jsx } from 'react/jsx-runtime';
+
+var alertVariants = cva(
+  "relative w-full rounded-lg border px-4 py-3 text-sm grid has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] grid-cols-[0_1fr] has-[>svg]:gap-x-3 gap-y-0.5 items-start [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current",
+  {
+    variants: {
+      variant: {
+        // Bordered card style — color applied via compoundVariants
+        default: "",
+        // Legacy — maps to default + destructive color (backward compatible)
+        destructive: "",
+        // Filled background style — color applied via compoundVariants
+        soft: ""
+      },
+      color: {
+        primary: "",
+        destructive: "",
+        success: "",
+        warning: "",
+        info: ""
+      }
+    },
+    compoundVariants: [
+      // ── Default (bordered) × color ──
+      { variant: "default", color: "primary", className: "bg-card text-card-foreground" },
+      { variant: "default", color: "destructive", className: "text-destructive bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90" },
+      { variant: "default", color: "success", className: "text-success bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-success/90" },
+      { variant: "default", color: "warning", className: "text-warning bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-warning/90" },
+      { variant: "default", color: "info", className: "text-info bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-info/90" },
+      // ── Legacy destructive variant (backward compat) ──
+      { variant: "destructive", className: "text-destructive bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90" },
+      // ── Soft (filled bg) × color ──
+      { variant: "soft", color: "primary", className: "bg-primary/10 text-primary border-primary/20 [&>svg]:text-current *:data-[slot=alert-description]:text-primary/90" },
+      { variant: "soft", color: "destructive", className: "bg-destructive/10 text-destructive border-destructive/20 [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90" },
+      { variant: "soft", color: "success", className: "bg-success/10 text-success border-success/20 [&>svg]:text-current *:data-[slot=alert-description]:text-success/90" },
+      { variant: "soft", color: "warning", className: "bg-warning/10 text-warning border-warning/20 [&>svg]:text-current *:data-[slot=alert-description]:text-warning/90" },
+      { variant: "soft", color: "info", className: "bg-info/10 text-info border-info/20 [&>svg]:text-current *:data-[slot=alert-description]:text-info/90" }
+    ],
+    defaultVariants: {
+      variant: "default",
+      color: "primary"
+    }
+  }
+);
+function Alert({
+  className,
+  variant,
+  color,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "alert",
+      role: "alert",
+      className: cn(alertVariants({ variant, color }), className),
+      ...props
+    }
+  );
+}
+function AlertTitle({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "alert-title",
+      className: cn(
+        "col-start-2 line-clamp-1 min-h-4 font-medium tracking-tight",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AlertDescription({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "alert-description",
+      className: cn(
+        "text-muted-foreground col-start-2 grid justify-items-start gap-1 text-sm [&_p]:leading-relaxed",
+        className
+      ),
+      ...props
+    }
+  );
+}
+
+export { Alert, AlertDescription, AlertTitle };
+//# sourceMappingURL=chunk-TGYQ3AKH.js.map
+//# sourceMappingURL=chunk-TGYQ3AKH.js.map

package/dist/chunk-TGYQ3AKH.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/alert.tsx"],"names":[],"mappings":"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","file":"chunk-TGYQ3AKH.js","sourcesContent":["import * as React from \"react\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../lib/utils\";\nimport type { UIColor } from \"../lib/types\";\n\nconst alertVariants = cva(\n  \"relative w-full rounded-lg border px-4 py-3 text-sm grid has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] grid-cols-[0_1fr] has-[>svg]:gap-x-3 gap-y-0.5 items-start [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current\",\n  {\n    variants: {\n      variant: {\n        // Bordered card style — color applied via compoundVariants\n        default: \"\",\n        // Legacy — maps to default + destructive color (backward compatible)\n        destructive: \"\",\n        // Filled background style — color applied via compoundVariants\n        soft: \"\",\n      },\n      color: {\n        primary: \"\",\n        destructive: \"\",\n        success: \"\",\n        warning: \"\",\n        info: \"\",\n      },\n    },\n    compoundVariants: [\n      // ── Default (bordered) × color ──\n      { variant: \"default\", color: \"primary\", className: \"bg-card text-card-foreground\" },\n      { variant: \"default\", color: \"destructive\", className: \"text-destructive bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90\" },\n      { variant: \"default\", color: \"success\", className: \"text-success bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-success/90\" },\n      { variant: \"default\", color: \"warning\", className: \"text-warning bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-warning/90\" },\n      { variant: \"default\", color: \"info\", className: \"text-info bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-info/90\" },\n\n      // ── Legacy destructive variant (backward compat) ──\n      { variant: \"destructive\", className: \"text-destructive bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90\" },\n\n      // ── Soft (filled bg) × color ──\n      { variant: \"soft\", color: \"primary\", className: \"bg-primary/10 text-primary border-primary/20 [&>svg]:text-current *:data-[slot=alert-description]:text-primary/90\" },\n      { variant: \"soft\", color: \"destructive\", className: \"bg-destructive/10 text-destructive border-destructive/20 [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90\" },\n      { variant: \"soft\", color: \"success\", className: \"bg-success/10 text-success border-success/20 [&>svg]:text-current *:data-[slot=alert-description]:text-success/90\" },\n      { variant: \"soft\", color: \"warning\", className: \"bg-warning/10 text-warning border-warning/20 [&>svg]:text-current *:data-[slot=alert-description]:text-warning/90\" },\n      { variant: \"soft\", color: \"info\", className: \"bg-info/10 text-info border-info/20 [&>svg]:text-current *:data-[slot=alert-description]:text-info/90\" },\n    ],\n    defaultVariants: {\n      variant: \"default\",\n      color: \"primary\",\n    },\n  },\n);\n\ninterface AlertProps\n  extends React.ComponentProps<\"div\">,\n    Omit<VariantProps<typeof alertVariants>, \"color\"> {\n  /**\n   * Semantic color intent.\n   *\n   * @default \"primary\"\n   * @example\n   * ```tsx\n   * <Alert color=\"success\">Operation completed</Alert>\n   * <Alert color=\"warning\">Check your input</Alert>\n   * <Alert variant=\"soft\" color=\"info\">Tip</Alert>\n   * ```\n   */\n  color?: UIColor;\n}\n\n/**\n * Static alert banner for displaying important messages.\n *\n * Supports semantic colors via `color` prop and two visual styles: `default` (bordered)\n * and `soft` (filled background). All existing `variant=\"destructive\"` usage continues to work.\n *\n * @example\n * ```tsx\n * // Default (bordered)\n * <Alert>\n *   <InfoIcon className=\"size-4\" />\n *   <AlertTitle>Heads up!</AlertTitle>\n *   <AlertDescription>You can add components using the CLI.</AlertDescription>\n * </Alert>\n *\n * // Semantic colors\n * <Alert color=\"success\">\n *   <CheckIcon className=\"size-4\" />\n *   <AlertTitle>Success</AlertTitle>\n *   <AlertDescription>Changes saved successfully.</AlertDescription>\n * </Alert>\n *\n * // Soft variant (filled background)\n * <Alert variant=\"soft\" color=\"warning\">\n *   <AlertTriangleIcon className=\"size-4\" />\n *   <AlertTitle>Warning</AlertTitle>\n *   <AlertDescription>This action cannot be undone.</AlertDescription>\n * </Alert>\n *\n * // Legacy (still works)\n * <Alert variant=\"destructive\">\n *   <AlertCircleIcon className=\"size-4\" />\n *   <AlertTitle>Error</AlertTitle>\n *   <AlertDescription>Session expired.</AlertDescription>\n * </Alert>\n * ```\n */\nfunction Alert({\n  className,\n  variant,\n  color,\n  ...props\n}: AlertProps) {\n  return (\n    <div\n      data-slot=\"alert\"\n      role=\"alert\"\n      className={cn(alertVariants({ variant, color }), className)}\n      {...props}\n    />\n  );\n}\n\n/** Bold title text within an Alert. Rendered in the second grid column when an icon is present. */\nfunction AlertTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-title\"\n      className={cn(\n        \"col-start-2 line-clamp-1 min-h-4 font-medium tracking-tight\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Descriptive body text within an Alert, rendered below the title. */\nfunction AlertDescription({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"alert-description\"\n      className={cn(\n        \"text-muted-foreground col-start-2 grid justify-items-start gap-1 text-sm [&_p]:leading-relaxed\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Alert, AlertTitle, AlertDescription };\n"]}

package/dist/{chunk-WNKEQCXM.js → chunk-THQUH6WX.js}

@@ -1,7 +1,7 @@
 import { Sheet, SheetContent, SheetHeader, SheetTitle } from './chunk-JLTBUACL.js';
-import { CalendarCategoryBadge } from './chunk-V4ZOPVXV.js';
+import { CalendarCategoryBadge } from './chunk-JAJMM32I.js';
 import { Separator } from './chunk-PGWNOZDX.js';
-import { Button } from './chunk-Y65FNGEE.js';
+import { Button } from './chunk-55E7D2HR.js';
 import { format } from 'date-fns';
 import { Clock, MapPin, Users, Trash2 } from 'lucide-react';
 import { jsx, jsxs } from 'react/jsx-runtime';
@@ -77,5 +77,5 @@ function CalendarEventSheet({
 }
 
 export { CalendarEventSheet };
-//# sourceMappingURL=chunk-WNKEQCXM.js.map
-//# sourceMappingURL=chunk-WNKEQCXM.js.map
+//# sourceMappingURL=chunk-THQUH6WX.js.map
+//# sourceMappingURL=chunk-THQUH6WX.js.map

package/dist/{chunk-WNKEQCXM.js.map → chunk-THQUH6WX.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/calendar-event-sheet.tsx"],"names":[],"mappings":"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","file":"chunk-WNKEQCXM.js","sourcesContent":["import { format } from 'date-fns';\nimport { Clock, MapPin, Users, Trash2 } from 'lucide-react';\nimport { Sheet, SheetContent, SheetHeader, SheetTitle } from './sheet';\nimport { Button } from './button';\nimport { Separator } from './separator';\nimport { CalendarCategoryBadge } from './calendar-category-badge';\n\n/** Extended event data shape for the detail sheet, including description, location, and attendees. */\nexport interface CalendarEventSheetEvent {\n  /** Unique event identifier. */\n  id: string;\n  /** Display title of the event. */\n  title: string;\n  /** Optional long description or notes for the event. */\n  description?: string;\n  /** Event start date/time. */\n  start: Date;\n  /** Event end date/time. */\n  end: Date;\n  /** Whether this is an all-day event. */\n  allDay?: boolean;\n  /** CSS color string for the event. */\n  color: string;\n  /** Category key (e.g. \"meeting\", \"deadline\") used by CalendarCategoryBadge. */\n  category: string;\n  /** Optional location string. */\n  location?: string;\n  /** Optional list of attendee email addresses. */\n  attendees?: string[];\n}\n\n/** Localizable labels for the event detail sheet. All have English defaults. */\nexport interface CalendarEventSheetLabels {\n  /** Text displayed for all-day events instead of a time range. */\n  allDay?: string;\n  /** Heading text for the attendees section. */\n  attendees?: string;\n  /** Label for the delete button. */\n  delete?: string;\n}\n\nconst defaultLabels: Required<CalendarEventSheetLabels> = {\n  allDay: 'All Day',\n  attendees: 'Attendees',\n  delete: 'Delete',\n};\n\nexport interface CalendarEventSheetProps {\n  /** The event to display, or `null` to render nothing. */\n  event: CalendarEventSheetEvent | null;\n  /** Whether the sheet is open. */\n  open: boolean;\n  /** Callback to toggle the sheet open state. */\n  onOpenChange: (open: boolean) => void;\n  /** Optional callback when the delete button is clicked. Receives the event id. */\n  onDelete?: (id: string) => void;\n  /** Override display label for the category badge. */\n  categoryLabel?: string;\n  /** Custom className styles per category key for the CalendarCategoryBadge. */\n  categoryStyles?: Record<string, string>;\n  /** Localizable UI labels with English defaults. */\n  labels?: CalendarEventSheetLabels;\n}\n\n/**\n * Side sheet that displays full event details including title, category badge,\n * description, date/time, location, attendees, and a delete action.\n * Built on top of the Sheet component.\n *\n * @example\n * ```tsx\n * <CalendarEventSheet\n *   event={selectedEvent}\n *   open={sheetOpen}\n *   onOpenChange={setSheetOpen}\n *   onDelete={(id) => removeEvent(id)}\n * />\n * ```\n */\nexport function CalendarEventSheet({\n  event,\n  open,\n  onOpenChange,\n  onDelete,\n  categoryLabel,\n  categoryStyles,\n  labels: labelsProp,\n}: CalendarEventSheetProps) {\n  const labels = { ...defaultLabels, ...labelsProp };\n\n  if (!event) return null;\n\n  const timeDisplay = event.allDay\n    ? labels.allDay\n    : `${format(event.start, 'HH:mm')} - ${format(event.end, 'HH:mm')}`;\n\n  return (\n    <Sheet open={open} onOpenChange={onOpenChange}>\n      <SheetContent className=\"sm:max-w-md\">\n        <SheetHeader>\n          <SheetTitle>{event.title}</SheetTitle>\n        </SheetHeader>\n        <div className=\"mt-4 space-y-4\">\n          <CalendarCategoryBadge\n            category={event.category}\n            label={categoryLabel}\n            styles={categoryStyles}\n          />\n\n          {event.description && (\n            <p className=\"text-sm text-muted-foreground\">{event.description}</p>\n          )}\n\n          <Separator />\n\n          <div className=\"space-y-3\">\n            <div className=\"flex items-center gap-3 text-sm\">\n              <Clock className=\"w-4 h-4 text-muted-foreground flex-shrink-0\" />\n              <div>\n                <p className=\"font-medium\">{format(event.start, 'EEEE, MMMM d, yyyy')}</p>\n                <p className=\"text-muted-foreground\">{timeDisplay}</p>\n              </div>\n            </div>\n\n            {event.location && (\n              <div className=\"flex items-center gap-3 text-sm\">\n                <MapPin className=\"w-4 h-4 text-muted-foreground flex-shrink-0\" />\n                <span>{event.location}</span>\n              </div>\n            )}\n\n            {event.attendees && event.attendees.length > 0 && (\n              <div className=\"flex items-start gap-3 text-sm\">\n                <Users className=\"w-4 h-4 text-muted-foreground flex-shrink-0 mt-0.5\" />\n                <div>\n                  <p className=\"font-medium mb-1\">{labels.attendees}</p>\n                  <div className=\"space-y-1\">\n                    {event.attendees.map(email => (\n                      <p key={email} className=\"text-muted-foreground\">{email}</p>\n                    ))}\n                  </div>\n                </div>\n              </div>\n            )}\n          </div>\n\n          <Separator />\n\n          <div className=\"flex justify-end\">\n            <Button\n              variant=\"destructive\"\n              size=\"sm\"\n              onClick={() => {\n                onDelete?.(event.id);\n                onOpenChange(false);\n              }}\n            >\n              <Trash2 className=\"w-4 h-4\" />\n              {labels.delete}\n            </Button>\n          </div>\n        </div>\n      </SheetContent>\n    </Sheet>\n  );\n}\n"]}
+{"version":3,"sources":["../src/components/calendar-event-sheet.tsx"],"names":[],"mappings":"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","file":"chunk-THQUH6WX.js","sourcesContent":["import { format } from 'date-fns';\nimport { Clock, MapPin, Users, Trash2 } from 'lucide-react';\nimport { Sheet, SheetContent, SheetHeader, SheetTitle } from './sheet';\nimport { Button } from './button';\nimport { Separator } from './separator';\nimport { CalendarCategoryBadge } from './calendar-category-badge';\n\n/** Extended event data shape for the detail sheet, including description, location, and attendees. */\nexport interface CalendarEventSheetEvent {\n  /** Unique event identifier. */\n  id: string;\n  /** Display title of the event. */\n  title: string;\n  /** Optional long description or notes for the event. */\n  description?: string;\n  /** Event start date/time. */\n  start: Date;\n  /** Event end date/time. */\n  end: Date;\n  /** Whether this is an all-day event. */\n  allDay?: boolean;\n  /** CSS color string for the event. */\n  color: string;\n  /** Category key (e.g. \"meeting\", \"deadline\") used by CalendarCategoryBadge. */\n  category: string;\n  /** Optional location string. */\n  location?: string;\n  /** Optional list of attendee email addresses. */\n  attendees?: string[];\n}\n\n/** Localizable labels for the event detail sheet. All have English defaults. */\nexport interface CalendarEventSheetLabels {\n  /** Text displayed for all-day events instead of a time range. */\n  allDay?: string;\n  /** Heading text for the attendees section. */\n  attendees?: string;\n  /** Label for the delete button. */\n  delete?: string;\n}\n\nconst defaultLabels: Required<CalendarEventSheetLabels> = {\n  allDay: 'All Day',\n  attendees: 'Attendees',\n  delete: 'Delete',\n};\n\nexport interface CalendarEventSheetProps {\n  /** The event to display, or `null` to render nothing. */\n  event: CalendarEventSheetEvent | null;\n  /** Whether the sheet is open. */\n  open: boolean;\n  /** Callback to toggle the sheet open state. */\n  onOpenChange: (open: boolean) => void;\n  /** Optional callback when the delete button is clicked. Receives the event id. */\n  onDelete?: (id: string) => void;\n  /** Override display label for the category badge. */\n  categoryLabel?: string;\n  /** Custom className styles per category key for the CalendarCategoryBadge. */\n  categoryStyles?: Record<string, string>;\n  /** Localizable UI labels with English defaults. */\n  labels?: CalendarEventSheetLabels;\n}\n\n/**\n * Side sheet that displays full event details including title, category badge,\n * description, date/time, location, attendees, and a delete action.\n * Built on top of the Sheet component.\n *\n * @example\n * ```tsx\n * <CalendarEventSheet\n *   event={selectedEvent}\n *   open={sheetOpen}\n *   onOpenChange={setSheetOpen}\n *   onDelete={(id) => removeEvent(id)}\n * />\n * ```\n */\nexport function CalendarEventSheet({\n  event,\n  open,\n  onOpenChange,\n  onDelete,\n  categoryLabel,\n  categoryStyles,\n  labels: labelsProp,\n}: CalendarEventSheetProps) {\n  const labels = { ...defaultLabels, ...labelsProp };\n\n  if (!event) return null;\n\n  const timeDisplay = event.allDay\n    ? labels.allDay\n    : `${format(event.start, 'HH:mm')} - ${format(event.end, 'HH:mm')}`;\n\n  return (\n    <Sheet open={open} onOpenChange={onOpenChange}>\n      <SheetContent className=\"sm:max-w-md\">\n        <SheetHeader>\n          <SheetTitle>{event.title}</SheetTitle>\n        </SheetHeader>\n        <div className=\"mt-4 space-y-4\">\n          <CalendarCategoryBadge\n            category={event.category}\n            label={categoryLabel}\n            styles={categoryStyles}\n          />\n\n          {event.description && (\n            <p className=\"text-sm text-muted-foreground\">{event.description}</p>\n          )}\n\n          <Separator />\n\n          <div className=\"space-y-3\">\n            <div className=\"flex items-center gap-3 text-sm\">\n              <Clock className=\"w-4 h-4 text-muted-foreground flex-shrink-0\" />\n              <div>\n                <p className=\"font-medium\">{format(event.start, 'EEEE, MMMM d, yyyy')}</p>\n                <p className=\"text-muted-foreground\">{timeDisplay}</p>\n              </div>\n            </div>\n\n            {event.location && (\n              <div className=\"flex items-center gap-3 text-sm\">\n                <MapPin className=\"w-4 h-4 text-muted-foreground flex-shrink-0\" />\n                <span>{event.location}</span>\n              </div>\n            )}\n\n            {event.attendees && event.attendees.length > 0 && (\n              <div className=\"flex items-start gap-3 text-sm\">\n                <Users className=\"w-4 h-4 text-muted-foreground flex-shrink-0 mt-0.5\" />\n                <div>\n                  <p className=\"font-medium mb-1\">{labels.attendees}</p>\n                  <div className=\"space-y-1\">\n                    {event.attendees.map(email => (\n                      <p key={email} className=\"text-muted-foreground\">{email}</p>\n                    ))}\n                  </div>\n                </div>\n              </div>\n            )}\n          </div>\n\n          <Separator />\n\n          <div className=\"flex justify-end\">\n            <Button\n              variant=\"destructive\"\n              size=\"sm\"\n              onClick={() => {\n                onDelete?.(event.id);\n                onOpenChange(false);\n              }}\n            >\n              <Trash2 className=\"w-4 h-4\" />\n              {labels.delete}\n            </Button>\n          </div>\n        </div>\n      </SheetContent>\n    </Sheet>\n  );\n}\n"]}

package/dist/{chunk-ZB2FWKHF.js → chunk-VVYSAGB3.js}

@@ -1,4 +1,4 @@
-import { Badge } from './chunk-OBZQTY3H.js';
+import { Badge } from './chunk-A3BB5ZOC.js';
 import { cn } from './chunk-DGPY4WP3.js';
 import * as React from 'react';
 import { X } from 'lucide-react';
@@ -51,8 +51,8 @@ function TagInput({
     "div",
     {
       className: cn(
-        "flex flex-wrap gap-2 p-2 border rounded-lg bg-white min-h-[42px] cursor-text",
-        disabled && "opacity-50 cursor-not-allowed bg-gray-50",
+        "flex flex-wrap gap-2 p-2 border rounded-lg bg-background min-h-[42px] cursor-text",
+        disabled && "opacity-50 cursor-not-allowed bg-muted",
         className
       ),
       onClick: () => !disabled && inputRef.current?.focus(),
@@ -72,7 +72,7 @@ function TagInput({
                     e.stopPropagation();
                     removeTag(index);
                   },
-                  className: "rounded-full hover:bg-gray-300 p-0.5 transition-colors",
+                  className: "rounded-full hover:bg-muted-foreground/30 p-0.5 transition-colors",
                   children: /* @__PURE__ */ jsx(X, { className: "h-3 w-3" })
                 }
               )
@@ -100,5 +100,5 @@ function TagInput({
 }
 
 export { TagInput };
-//# sourceMappingURL=chunk-ZB2FWKHF.js.map
-//# sourceMappingURL=chunk-ZB2FWKHF.js.map
+//# sourceMappingURL=chunk-VVYSAGB3.js.map
+//# sourceMappingURL=chunk-VVYSAGB3.js.map

package/dist/{chunk-ZB2FWKHF.js.map → chunk-VVYSAGB3.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/tag-input.tsx"],"names":[],"mappings":"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","file":"chunk-ZB2FWKHF.js","sourcesContent":["import * as React from \"react\";\nimport { X } from \"lucide-react\";\nimport { cn } from \"../lib/utils\";\nimport { Badge } from \"./badge\";\n\ninterface TagInputProps {\n  /** Array of current tag strings. */\n  value?: string[];\n  /** Callback fired when the tags array changes. */\n  onChange?: (tags: string[]) => void;\n  /** Placeholder text shown when there are no tags. */\n  placeholder?: string;\n  /** Additional CSS class for the outer container. */\n  className?: string;\n  /** Whether the tag input is disabled. */\n  disabled?: boolean;\n  /** Maximum number of tags allowed. */\n  maxTags?: number;\n  /** Whether duplicate tag values are allowed. Defaults to `false`. */\n  allowDuplicates?: boolean;\n  /** Character or pattern used to split pasted text into tags. Defaults to `\",\"`. */\n  delimiter?: string | RegExp;\n}\n\n/**\n * Tag input that lets users add and remove string tags.\n * Tags are added by pressing Enter or the delimiter key, and by pasting comma-separated text.\n * Backspace removes the last tag when the input is empty.\n *\n * @example\n * ```tsx\n * const [tags, setTags] = useState<string[]>([\"react\", \"typescript\"]);\n *\n * <TagInput\n *   value={tags}\n *   onChange={setTags}\n *   placeholder=\"Add a tag...\"\n *   maxTags={10}\n * />\n * ```\n */\nexport function TagInput({\n  value = [],\n  onChange,\n  placeholder = \"Nhập và nhấn Enter...\",\n  className,\n  disabled,\n  maxTags,\n  allowDuplicates = false,\n  delimiter = \",\",\n}: TagInputProps) {\n  const [inputValue, setInputValue] = React.useState(\"\");\n  const inputRef = React.useRef<HTMLInputElement>(null);\n\n  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    setInputValue(e.target.value);\n  };\n\n  const addTag = (tag: string) => {\n    const trimmedTag = tag.trim();\n\n    if (!trimmedTag) return;\n\n    if (maxTags && value.length >= maxTags) return;\n\n    if (!allowDuplicates && value.includes(trimmedTag)) return;\n\n    onChange?.([ ...value, trimmedTag]);\n    setInputValue(\"\");\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (e.key === \"Enter\" || e.key === delimiter) {\n      e.preventDefault();\n      addTag(inputValue);\n    } else if (e.key === \"Backspace\" && !inputValue && value.length > 0) {\n      // Remove last tag on backspace if input is empty\n      onChange?.(value.slice(0, -1));\n    }\n  };\n\n  const handlePaste = (e: React.ClipboardEvent<HTMLInputElement>) => {\n    e.preventDefault();\n    const pastedText = e.clipboardData.getData(\"text\");\n    const tags = pastedText.split(delimiter).map((tag) => tag.trim()).filter(Boolean);\n\n    const newTags = allowDuplicates\n      ? tags\n      : tags.filter((tag) => !value.includes(tag));\n\n    const tagsToAdd = maxTags\n      ? newTags.slice(0, maxTags - value.length)\n      : newTags;\n\n    onChange?.([...value, ...tagsToAdd]);\n    setInputValue(\"\");\n  };\n\n  const removeTag = (index: number) => {\n    onChange?.(value.filter((_, i) => i !== index));\n  };\n\n  return (\n    <div\n      className={cn(\n        \"flex flex-wrap gap-2 p-2 border rounded-lg bg-white min-h-[42px] cursor-text\",\n        disabled && \"opacity-50 cursor-not-allowed bg-gray-50\",\n        className\n      )}\n      onClick={() => !disabled && inputRef.current?.focus()}\n    >\n      {value.map((tag, index) => (\n        <Badge\n          key={index}\n          variant=\"secondary\"\n          className=\"gap-1 pl-2 pr-1 py-1 h-auto\"\n        >\n          <span>{tag}</span>\n          {!disabled && (\n            <button\n              type=\"button\"\n              onClick={(e) => {\n                e.stopPropagation();\n                removeTag(index);\n              }}\n              className=\"rounded-full hover:bg-gray-300 p-0.5 transition-colors\"\n            >\n              <X className=\"h-3 w-3\" />\n            </button>\n          )}\n        </Badge>\n      ))}\n\n      <input\n        ref={inputRef}\n        type=\"text\"\n        value={inputValue}\n        onChange={handleInputChange}\n        onKeyDown={handleKeyDown}\n        onPaste={handlePaste}\n        disabled={disabled || (maxTags ? value.length >= maxTags : false)}\n        placeholder={value.length === 0 ? placeholder : \"\"}\n        className=\"flex-1 outline-none bg-transparent min-w-[120px] text-sm disabled:cursor-not-allowed\"\n      />\n    </div>\n  );\n}\n"]}
+{"version":3,"sources":["../src/components/tag-input.tsx"],"names":[],"mappings":"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","file":"chunk-VVYSAGB3.js","sourcesContent":["import * as React from \"react\";\nimport { X } from \"lucide-react\";\nimport { cn } from \"../lib/utils\";\nimport { Badge } from \"./badge\";\n\ninterface TagInputProps {\n  /** Array of current tag strings. */\n  value?: string[];\n  /** Callback fired when the tags array changes. */\n  onChange?: (tags: string[]) => void;\n  /** Placeholder text shown when there are no tags. */\n  placeholder?: string;\n  /** Additional CSS class for the outer container. */\n  className?: string;\n  /** Whether the tag input is disabled. */\n  disabled?: boolean;\n  /** Maximum number of tags allowed. */\n  maxTags?: number;\n  /** Whether duplicate tag values are allowed. Defaults to `false`. */\n  allowDuplicates?: boolean;\n  /** Character or pattern used to split pasted text into tags. Defaults to `\",\"`. */\n  delimiter?: string | RegExp;\n}\n\n/**\n * Tag input that lets users add and remove string tags.\n * Tags are added by pressing Enter or the delimiter key, and by pasting comma-separated text.\n * Backspace removes the last tag when the input is empty.\n *\n * @example\n * ```tsx\n * const [tags, setTags] = useState<string[]>([\"react\", \"typescript\"]);\n *\n * <TagInput\n *   value={tags}\n *   onChange={setTags}\n *   placeholder=\"Add a tag...\"\n *   maxTags={10}\n * />\n * ```\n */\nexport function TagInput({\n  value = [],\n  onChange,\n  placeholder = \"Nhập và nhấn Enter...\",\n  className,\n  disabled,\n  maxTags,\n  allowDuplicates = false,\n  delimiter = \",\",\n}: TagInputProps) {\n  const [inputValue, setInputValue] = React.useState(\"\");\n  const inputRef = React.useRef<HTMLInputElement>(null);\n\n  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    setInputValue(e.target.value);\n  };\n\n  const addTag = (tag: string) => {\n    const trimmedTag = tag.trim();\n\n    if (!trimmedTag) return;\n\n    if (maxTags && value.length >= maxTags) return;\n\n    if (!allowDuplicates && value.includes(trimmedTag)) return;\n\n    onChange?.([ ...value, trimmedTag]);\n    setInputValue(\"\");\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (e.key === \"Enter\" || e.key === delimiter) {\n      e.preventDefault();\n      addTag(inputValue);\n    } else if (e.key === \"Backspace\" && !inputValue && value.length > 0) {\n      // Remove last tag on backspace if input is empty\n      onChange?.(value.slice(0, -1));\n    }\n  };\n\n  const handlePaste = (e: React.ClipboardEvent<HTMLInputElement>) => {\n    e.preventDefault();\n    const pastedText = e.clipboardData.getData(\"text\");\n    const tags = pastedText.split(delimiter).map((tag) => tag.trim()).filter(Boolean);\n\n    const newTags = allowDuplicates\n      ? tags\n      : tags.filter((tag) => !value.includes(tag));\n\n    const tagsToAdd = maxTags\n      ? newTags.slice(0, maxTags - value.length)\n      : newTags;\n\n    onChange?.([...value, ...tagsToAdd]);\n    setInputValue(\"\");\n  };\n\n  const removeTag = (index: number) => {\n    onChange?.(value.filter((_, i) => i !== index));\n  };\n\n  return (\n    <div\n      className={cn(\n        \"flex flex-wrap gap-2 p-2 border rounded-lg bg-background min-h-[42px] cursor-text\",\n        disabled && \"opacity-50 cursor-not-allowed bg-muted\",\n        className\n      )}\n      onClick={() => !disabled && inputRef.current?.focus()}\n    >\n      {value.map((tag, index) => (\n        <Badge\n          key={index}\n          variant=\"secondary\"\n          className=\"gap-1 pl-2 pr-1 py-1 h-auto\"\n        >\n          <span>{tag}</span>\n          {!disabled && (\n            <button\n              type=\"button\"\n              onClick={(e) => {\n                e.stopPropagation();\n                removeTag(index);\n              }}\n              className=\"rounded-full hover:bg-muted-foreground/30 p-0.5 transition-colors\"\n            >\n              <X className=\"h-3 w-3\" />\n            </button>\n          )}\n        </Badge>\n      ))}\n\n      <input\n        ref={inputRef}\n        type=\"text\"\n        value={inputValue}\n        onChange={handleInputChange}\n        onKeyDown={handleKeyDown}\n        onPaste={handlePaste}\n        disabled={disabled || (maxTags ? value.length >= maxTags : false)}\n        placeholder={value.length === 0 ? placeholder : \"\"}\n        className=\"flex-1 outline-none bg-transparent min-w-[120px] text-sm disabled:cursor-not-allowed\"\n      />\n    </div>\n  );\n}\n"]}

package/dist/{chunk-JBQT2H4K.js → chunk-XUVLD65E.js}

@@ -4,7 +4,7 @@ import { Skeleton } from './chunk-JXGRW2MR.js';
 import { Input } from './chunk-3VU56V66.js';
 import { Sheet, SheetContent, SheetHeader, SheetTitle, SheetDescription } from './chunk-JLTBUACL.js';
 import { Separator } from './chunk-PGWNOZDX.js';
-import { Button } from './chunk-Y65FNGEE.js';
+import { Button } from './chunk-55E7D2HR.js';
 import { cn } from './chunk-DGPY4WP3.js';
 import * as React from 'react';
 import { PanelLeftIcon } from 'lucide-react';
@@ -613,5 +613,5 @@ function SidebarMenuSubButton({
 }
 
 export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, useSidebar };
-//# sourceMappingURL=chunk-JBQT2H4K.js.map
-//# sourceMappingURL=chunk-JBQT2H4K.js.map
+//# sourceMappingURL=chunk-XUVLD65E.js.map
+//# sourceMappingURL=chunk-XUVLD65E.js.map