@zentauri-ui/zentauri-components 2.0.0 → 2.1.1

package/dist/{chunk-7JBQ3ZJN.mjs.map → chunk-BYXFSXNG.mjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/ui/table/variants.ts","../src/ui/table/table-base.tsx"],"names":[],"mappings":"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","file":"chunk-7JBQ3ZJN.mjs","sourcesContent":["import { cva } from \"class-variance-authority\";\n\nimport {\n  zuiTableAppearances,\n  zuiTableBase,\n  zuiTableCellAppearances,\n  zuiTableCellBase,\n  zuiTableCellSizes,\n  zuiTableRowAppearances,\n  zuiTableRowBase,\n  zuiTableSizes,\n  zuiTableStickyHeader,\n  zuiTableTextAlignments,\n} from \"../../design-system/table\";\n\nexport const tableVariants = cva(zuiTableBase, {\n  variants: {\n    appearance: zuiTableAppearances,\n    size: zuiTableSizes,\n    stickyHeader: zuiTableStickyHeader,\n  },\n  defaultVariants: {\n    appearance: \"default\",\n    size: \"md\",\n    stickyHeader: false,\n  },\n});\n\nexport const tableRowVariants = cva(zuiTableRowBase, {\n  variants: {\n    appearance: zuiTableRowAppearances,\n  },\n  defaultVariants: { appearance: \"default\" },\n});\n\nexport const tableCellVariants = cva(zuiTableCellBase, {\n  variants: {\n    appearance: zuiTableCellAppearances,\n    size: zuiTableCellSizes,\n    textAlign: zuiTableTextAlignments,\n  },\n  defaultVariants: { appearance: \"default\", size: \"md\" },\n});\n","\"use client\";\n\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useMemo,\n  type KeyboardEvent,\n} from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nimport type {\n  TableCtx,\n  TableCellProps,\n  TableHeadCellProps,\n  TableProps,\n  TableSectionProps,\n  TableSortDirection,\n} from \"./types\";\nimport { tableCellVariants, tableRowVariants, tableVariants } from \"./variants\";\n\nexport const TableContext = createContext<TableCtx | null>(null);\n\nexport function useTableContext(component: string): TableCtx {\n  const ctx = useContext(TableContext);\n  if (!ctx) {\n    throw new Error(`${component} must be used within <Table>`);\n  }\n  return ctx;\n}\n\nexport function TableBase(props: TableProps) {\n  const {\n    className,\n    appearance = \"default\",\n    size = \"md\",\n    textAlign = \"left\",\n    stickyHeader = false,\n    scrollAreaAriaLabel,\n    children,\n    ref,\n    ...rest\n  } = props;\n  const ctx = useMemo(\n    () => ({\n      appearance: appearance ?? \"default\",\n      size: size ?? \"md\",\n      stickyHeader: Boolean(stickyHeader),\n      rowAnimation: \"none\" as const,\n      textAlign,\n    }),\n    [appearance, size, stickyHeader, textAlign],\n  );\n\n  return (\n    <TableContext.Provider value={ctx}>\n      <div\n        data-slot=\"table-scroll\"\n        tabIndex={0}\n        role=\"region\"\n        aria-label={scrollAreaAriaLabel ?? \"Scrollable table\"}\n        className={cn(\n          \"relative w-full overflow-auto\",\n          \"outline-none focus-visible:ring-2 focus-visible:ring-slate-300 focus-visible:ring-offset-2 focus-visible:ring-offset-slate-950\",\n        )}\n      >\n        <table\n          ref={ref}\n          data-slot=\"table\"\n          className={cn(\n            tableVariants({ appearance, size, stickyHeader }),\n            \"w-full min-w-0 table\",\n            className,\n          )}\n          {...rest}\n        >\n          {children}\n        </table>\n      </div>\n    </TableContext.Provider>\n  );\n}\n\nTableBase.displayName = \"Table\";\n\nexport function TableHeader({ className, children }: TableSectionProps) {\n  const { stickyHeader } = useTableContext(\"TableHeader\");\n  const stickyClass = stickyHeader\n    ? \"sticky top-0 z-10 dark:bg-slate-950/95 bg-slate-50/95 backdrop-blur\"\n    : \"\";\n  return (\n    <thead data-slot=\"table-header\" className={cn(stickyClass, className)}>\n      {children}\n    </thead>\n  );\n}\n\nTableHeader.displayName = \"TableHeader\";\n\nexport function TableBody({ className, children }: TableSectionProps) {\n  return (\n    <tbody data-slot=\"table-body\" className={cn(className)}>\n      {children}\n    </tbody>\n  );\n}\n\nTableBody.displayName = \"TableBody\";\n\nexport function TableFooter({ className, children }: TableSectionProps) {\n  return (\n    <tfoot\n      data-slot=\"table-footer\"\n      className={cn(\n        \"border-t border-white/10 bg-white/3 font-medium\",\n        className,\n      )}\n    >\n      {children}\n    </tfoot>\n  );\n}\n\nTableFooter.displayName = \"TableFooter\";\n\nexport function TableRow({\n  className,\n  children,\n  ref,\n  as: Wrapper = \"tr\",\n  rowAnimation: _rowAnimation,\n  ...rest\n}: TableSectionProps & { ref?: React.Ref<HTMLTableRowElement> }) {\n  const { appearance } = useTableContext(\"TableRow\");\n\n  return (\n    <Wrapper\n      ref={ref}\n      data-slot=\"table-row\"\n      className={cn(tableRowVariants({ appearance }), className)}\n      {...rest}\n    >\n      {children}\n    </Wrapper>\n  );\n}\n\nTableRow.displayName = \"TableRow\";\n\nexport function TableHead({\n  className,\n  children,\n  scope = \"col\",\n  sortKey,\n  sortDirection,\n  onSortChange,\n  onClick,\n  onKeyDown,\n  tabIndex,\n  ref,\n  ...rest\n}: TableHeadCellProps) {\n  const { appearance, size, textAlign } = useTableContext(\"TableHead\");\n  const isSortable = Boolean(sortKey && onSortChange);\n  const sortableDirection: TableSortDirection = sortDirection ?? \"none\";\n\n  const handleSort = useCallback(() => {\n    if (!sortKey || !onSortChange) {\n      return;\n    }\n\n    const nextDirection: TableSortDirection =\n      sortableDirection === \"ascending\"\n        ? \"descending\"\n        : sortableDirection === \"descending\"\n          ? \"none\"\n          : \"ascending\";\n\n    onSortChange({\n      sortKey,\n      sortDirection: nextDirection,\n    });\n  }, [onSortChange, sortKey, sortableDirection]);\n\n  const handleClick = useCallback<NonNullable<TableHeadCellProps[\"onClick\"]>>(\n    (event) => {\n      onClick?.(event);\n      if (!event.defaultPrevented) {\n        handleSort();\n      }\n    },\n    [handleSort, onClick],\n  );\n\n  const handleKeyDown = useCallback(\n    (event: KeyboardEvent<HTMLTableCellElement>) => {\n      onKeyDown?.(event);\n      if (event.defaultPrevented || !isSortable) {\n        return;\n      }\n      if (event.key === \"Enter\" || event.key === \" \") {\n        event.preventDefault();\n        handleSort();\n      }\n    },\n    [handleSort, isSortable, onKeyDown],\n  );\n\n  return (\n    <th\n      ref={ref}\n      data-slot=\"table-head\"\n      scope={scope}\n      aria-sort={isSortable ? sortableDirection : sortDirection}\n      data-sort-key={sortKey}\n      data-sort-direction={sortDirection}\n      tabIndex={isSortable ? (tabIndex ?? 0) : tabIndex}\n      className={cn(\n        tableCellVariants({ appearance, size, textAlign }),\n        isSortable &&\n          \"cursor-pointer select-none outline-none focus-visible:ring-2 focus-visible:ring-slate-300 focus-visible:ring-offset-2 focus-visible:ring-offset-slate-950\",\n        className,\n      )}\n      onClick={isSortable ? handleClick : onClick}\n      onKeyDown={isSortable ? handleKeyDown : onKeyDown}\n      {...rest}\n    >\n      {children}\n    </th>\n  );\n}\n\nTableHead.displayName = \"TableHead\";\n\nexport function TableCell({\n  className,\n  children,\n  ref,\n  scope,\n  ...rest\n}: TableCellProps) {\n  const { appearance, size, textAlign } = useTableContext(\"TableCell\");\n  const cellClassName = cn(\n    tableCellVariants({ appearance, size, textAlign }),\n    className,\n  );\n\n  if (scope !== undefined) {\n    return (\n      <th\n        ref={ref}\n        data-slot=\"table-cell\"\n        scope={scope}\n        className={cellClassName}\n        {...rest}\n      >\n        {children}\n      </th>\n    );\n  }\n\n  return (\n    <td ref={ref} data-slot=\"table-cell\" className={cellClassName} {...rest}>\n      {children}\n    </td>\n  );\n}\n\nTableCell.displayName = \"TableCell\";\n\nexport function TableCaption({ className, children }: TableSectionProps) {\n  return (\n    <caption\n      data-slot=\"table-caption\"\n      className={cn(\"mt-3 text-left text-xs text-slate-500\", className)}\n    >\n      {children}\n    </caption>\n  );\n}\n\nTableCaption.displayName = \"TableCaption\";\n"]}
+{"version":3,"sources":["../src/ui/table/variants.ts","../src/ui/table/table-base.tsx"],"names":[],"mappings":"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","file":"chunk-BYXFSXNG.mjs","sourcesContent":["import { cva } from \"class-variance-authority\";\n\nimport {\n  zuiTableAppearances,\n  zuiTableBase,\n  zuiTableCellAppearances,\n  zuiTableCellBase,\n  zuiTableCellSizes,\n  zuiTableRowAppearances,\n  zuiTableRowBase,\n  zuiTableSizes,\n  zuiTableStickyHeader,\n  zuiTableTextAlignments,\n} from \"../../design-system/table\";\n\nexport const tableVariants = cva(zuiTableBase, {\n  variants: {\n    appearance: zuiTableAppearances,\n    size: zuiTableSizes,\n    stickyHeader: zuiTableStickyHeader,\n  },\n  defaultVariants: {\n    appearance: \"default\",\n    size: \"md\",\n    stickyHeader: false,\n  },\n});\n\nexport const tableRowVariants = cva(zuiTableRowBase, {\n  variants: {\n    appearance: zuiTableRowAppearances,\n  },\n  defaultVariants: { appearance: \"default\" },\n});\n\nexport const tableCellVariants = cva(zuiTableCellBase, {\n  variants: {\n    appearance: zuiTableCellAppearances,\n    size: zuiTableCellSizes,\n    textAlign: zuiTableTextAlignments,\n  },\n  defaultVariants: { appearance: \"default\", size: \"md\" },\n});\n","\"use client\";\n\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useMemo,\n  type KeyboardEvent,\n} from \"react\";\n\nimport { cn } from \"../../lib/utils\";\n\nimport type {\n  TableCtx,\n  TableCellProps,\n  TableHeadCellProps,\n  TableProps,\n  TableSectionProps,\n  TableSortDirection,\n} from \"./types\";\nimport { tableCellVariants, tableRowVariants, tableVariants } from \"./variants\";\n\nexport const TableContext = createContext<TableCtx | null>(null);\n\nexport function useTableContext(component: string): TableCtx {\n  const ctx = useContext(TableContext);\n  if (!ctx) {\n    throw new Error(`${component} must be used within <Table>`);\n  }\n  return ctx;\n}\n\nexport function TableBase(props: TableProps) {\n  const {\n    className,\n    appearance = \"default\",\n    size = \"md\",\n    textAlign = \"left\",\n    stickyHeader = false,\n    scrollAreaAriaLabel,\n    children,\n    ref,\n    ...rest\n  } = props;\n  const ctx = useMemo(\n    () => ({\n      appearance: appearance ?? \"default\",\n      size: size ?? \"md\",\n      stickyHeader: Boolean(stickyHeader),\n      rowAnimation: \"none\" as const,\n      textAlign,\n    }),\n    [appearance, size, stickyHeader, textAlign],\n  );\n\n  return (\n    <TableContext.Provider value={ctx}>\n      <div\n        data-slot=\"table-scroll\"\n        tabIndex={0}\n        role=\"region\"\n        aria-label={scrollAreaAriaLabel ?? \"Scrollable table\"}\n        className={cn(\n          \"relative w-full overflow-auto\",\n          \"outline-none focus-visible:ring-2 focus-visible:ring-slate-300 focus-visible:ring-offset-2 focus-visible:ring-offset-slate-950\",\n        )}\n      >\n        <table\n          ref={ref}\n          data-slot=\"table\"\n          className={cn(\n            tableVariants({ appearance, size, stickyHeader }),\n            \"w-full min-w-0 table\",\n            className,\n          )}\n          {...rest}\n        >\n          {children}\n        </table>\n      </div>\n    </TableContext.Provider>\n  );\n}\n\nTableBase.displayName = \"Table\";\n\nexport function TableHeader({ className, children }: TableSectionProps) {\n  const { stickyHeader } = useTableContext(\"TableHeader\");\n  const stickyClass = stickyHeader\n    ? \"sticky top-0 z-10 dark:bg-slate-950/95 bg-slate-50/95 backdrop-blur\"\n    : \"\";\n  return (\n    <thead data-slot=\"table-header\" className={cn(stickyClass, className)}>\n      {children}\n    </thead>\n  );\n}\n\nTableHeader.displayName = \"TableHeader\";\n\nexport function TableBody({ className, children }: TableSectionProps) {\n  return (\n    <tbody data-slot=\"table-body\" className={cn(className)}>\n      {children}\n    </tbody>\n  );\n}\n\nTableBody.displayName = \"TableBody\";\n\nexport function TableFooter({ className, children }: TableSectionProps) {\n  return (\n    <tfoot\n      data-slot=\"table-footer\"\n      className={cn(\n        \"border-t border-white/10 bg-white/3 font-medium\",\n        className,\n      )}\n    >\n      {children}\n    </tfoot>\n  );\n}\n\nTableFooter.displayName = \"TableFooter\";\n\nexport function TableRow({\n  className,\n  children,\n  ref,\n  as: Wrapper = \"tr\",\n  rowAnimation: _rowAnimation,\n  ...rest\n}: TableSectionProps & { ref?: React.Ref<HTMLTableRowElement> }) {\n  const { appearance } = useTableContext(\"TableRow\");\n\n  return (\n    <Wrapper\n      ref={ref}\n      data-slot=\"table-row\"\n      className={cn(tableRowVariants({ appearance }), className)}\n      {...rest}\n    >\n      {children}\n    </Wrapper>\n  );\n}\n\nTableRow.displayName = \"TableRow\";\n\nexport function TableHead({\n  className,\n  children,\n  scope = \"col\",\n  sortKey,\n  sortDirection,\n  onSortChange,\n  onClick,\n  onKeyDown,\n  tabIndex,\n  ref,\n  ...rest\n}: TableHeadCellProps) {\n  const { appearance, size, textAlign } = useTableContext(\"TableHead\");\n  const isSortable = Boolean(sortKey && onSortChange);\n  const sortableDirection: TableSortDirection = sortDirection ?? \"none\";\n\n  const handleSort = useCallback(() => {\n    if (!sortKey || !onSortChange) {\n      return;\n    }\n\n    const nextDirection: TableSortDirection =\n      sortableDirection === \"ascending\"\n        ? \"descending\"\n        : sortableDirection === \"descending\"\n          ? \"none\"\n          : \"ascending\";\n\n    onSortChange({\n      sortKey,\n      sortDirection: nextDirection,\n    });\n  }, [onSortChange, sortKey, sortableDirection]);\n\n  const handleClick = useCallback<NonNullable<TableHeadCellProps[\"onClick\"]>>(\n    (event) => {\n      onClick?.(event);\n      if (!event.defaultPrevented) {\n        handleSort();\n      }\n    },\n    [handleSort, onClick],\n  );\n\n  const handleKeyDown = useCallback(\n    (event: KeyboardEvent<HTMLTableCellElement>) => {\n      onKeyDown?.(event);\n      if (event.defaultPrevented || !isSortable) {\n        return;\n      }\n      if (event.key === \"Enter\" || event.key === \" \") {\n        event.preventDefault();\n        handleSort();\n      }\n    },\n    [handleSort, isSortable, onKeyDown],\n  );\n\n  return (\n    <th\n      ref={ref}\n      data-slot=\"table-head\"\n      scope={scope}\n      aria-sort={isSortable ? sortableDirection : sortDirection}\n      data-sort-key={sortKey}\n      data-sort-direction={sortDirection}\n      tabIndex={isSortable ? (tabIndex ?? 0) : tabIndex}\n      className={cn(\n        tableCellVariants({ appearance, size, textAlign }),\n        isSortable &&\n          \"cursor-pointer select-none outline-none focus-visible:ring-2 focus-visible:ring-slate-300 focus-visible:ring-offset-2 focus-visible:ring-offset-slate-950\",\n        className,\n      )}\n      onClick={isSortable ? handleClick : onClick}\n      onKeyDown={isSortable ? handleKeyDown : onKeyDown}\n      {...rest}\n    >\n      {children}\n    </th>\n  );\n}\n\nTableHead.displayName = \"TableHead\";\n\nexport function TableCell({\n  className,\n  children,\n  ref,\n  scope,\n  ...rest\n}: TableCellProps) {\n  const { appearance, size, textAlign } = useTableContext(\"TableCell\");\n  const cellClassName = cn(\n    tableCellVariants({ appearance, size, textAlign }),\n    className,\n  );\n\n  if (scope !== undefined) {\n    return (\n      <th\n        ref={ref}\n        data-slot=\"table-cell\"\n        scope={scope}\n        className={cellClassName}\n        {...rest}\n      >\n        {children}\n      </th>\n    );\n  }\n\n  return (\n    <td ref={ref} data-slot=\"table-cell\" className={cellClassName} {...rest}>\n      {children}\n    </td>\n  );\n}\n\nTableCell.displayName = \"TableCell\";\n\nexport function TableCaption({ className, children }: TableSectionProps) {\n  return (\n    <caption\n      data-slot=\"table-caption\"\n      className={cn(\"mt-3 text-left text-xs text-slate-500\", className)}\n    >\n      {children}\n    </caption>\n  );\n}\n\nTableCaption.displayName = \"TableCaption\";\n"]}

package/dist/chunk-BZTAA3MK.js

@@ -0,0 +1,62 @@
+'use strict';
+
+// src/design-system/otp-input.ts
+var zuiOtpRootBase = "grid w-fit gap-2 text-[color:var(--zui-otp-label-fg,var(--zui-fg-muted,oklch(20.8%_0.042_265.755)))] dark:text-[color:var(--zui-otp-label-fg-dark,var(--zui-fg-muted-dark,oklch(98.4%_0.003_247.858)))] data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-50";
+var zuiOtpLabelBase = "text-sm font-medium leading-6 text-[color:var(--zui-otp-label-fg,var(--zui-fg-muted,oklch(20.8%_0.042_265.755)))] dark:text-[color:var(--zui-otp-label-fg-dark,var(--zui-fg-muted-dark,oklch(98.4%_0.003_247.858)))]";
+var zuiOtpHintBase = "max-w-sm text-xs leading-5 text-[color:var(--zui-otp-hint-fg,var(--zui-fg-muted,oklch(55.4%_0.046_257.417)))] dark:text-[color:var(--zui-otp-hint-fg-dark,var(--zui-fg-muted-dark,oklch(70.4%_0.04_256.788)))]";
+var zuiOtpCellsBase = "flex flex-wrap items-center gap-2";
+var zuiOtpCellBase = "grid place-items-center rounded-xl border bg-[var(--zui-otp-bg,var(--zui-surface-soft,#ffffff))] text-center font-semibold tabular-nums text-[color:var(--zui-otp-fg,var(--zui-fg,oklch(20.8%_0.042_265.755)))] shadow-sm shadow-black/5 outline-none transition-[background-color,border-color,box-shadow,color,transform] placeholder:text-transparent focus-visible:-translate-y-0.5 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--zui-otp-ring-offset-focus,var(--zui-ring-offset,#ffffff))] disabled:cursor-not-allowed dark:bg-[var(--zui-otp-bg-dark,var(--zui-surface-soft-dark,oklch(12.9%_0.042_264.695)))] dark:text-[color:var(--zui-otp-fg-dark,var(--zui-fg-dark,oklch(98.4%_0.003_247.858)))] dark:shadow-black/20 dark:focus-visible:ring-offset-[var(--zui-otp-ring-offset-focus-dark,var(--zui-ring-offset-dark,oklch(12.9%_0.042_264.695)))]";
+var zuiOtpSeparatorBase = "h-px w-3 shrink-0 bg-[color:var(--zui-otp-separator,#94a3b8)] opacity-70 dark:bg-[color:var(--zui-otp-separator-dark,#64748b)]";
+var zuiOtpErrorBase = "text-sm leading-6 text-[color:var(--zui-otp-error-fg,var(--zui-status-error,oklch(58.6%_0.253_17.585)))] dark:text-[color:var(--zui-otp-error-fg-dark,var(--zui-status-error-dark,oklch(71.2%_0.194_13.428)))]";
+var zuiOtpSizes = {
+  sm: "size-7 md:size-9 rounded-lg text-sm",
+  md: "size-9 md:size-11 text-base",
+  lg: "size-11 md:size-13 rounded-2xl text-lg"
+};
+var zuiOtpAppearances = {
+  default: "border-[color:var(--zui-otp-default-border,var(--zui-border,#cbd5e1))] focus-visible:border-[color:var(--zui-otp-default-border-focus,var(--zui-border,oklch(44.6%_0.043_257.281)))] focus-visible:ring-[var(--zui-otp-default-ring-focus,var(--zui-focus-ring,oklch(44.6%_0.043_257.281_/_0.25)))] dark:border-[color:var(--zui-otp-default-border-dark,var(--zui-border-dark,#475569))] dark:focus-visible:border-[color:var(--zui-otp-default-border-focus-dark,var(--zui-border-dark,oklch(86.9%_0.022_252.894)))] dark:focus-visible:ring-[var(--zui-otp-default-ring-focus-dark,var(--zui-focus-ring-dark,oklch(86.9%_0.022_252.894_/_0.25)))]",
+  outline: "border-[color:var(--zui-otp-outline-border,var(--zui-border,#64748b))] bg-transparent focus-visible:border-[color:var(--zui-otp-outline-border-focus,var(--zui-border,oklch(54.6%_0.245_262.881)))] focus-visible:ring-[var(--zui-otp-outline-ring-focus,var(--zui-focus-ring,oklch(54.6%_0.245_262.881_/_0.28)))] dark:border-[color:var(--zui-otp-outline-border-dark,var(--zui-border-dark,#94a3b8))] dark:bg-transparent dark:focus-visible:border-[color:var(--zui-otp-outline-border-focus-dark,var(--zui-border-dark,oklch(70.7%_0.165_254.624)))] dark:focus-visible:ring-[var(--zui-otp-outline-ring-focus-dark,var(--zui-focus-ring-dark,oklch(70.7%_0.165_254.624_/_0.28)))]",
+  glass: "border-[color:var(--zui-otp-glass-border,var(--zui-border,#ffffff66))] bg-[var(--zui-otp-glass-bg,var(--zui-surface-soft,#ffffffcc))] backdrop-blur-md focus-visible:border-[color:var(--zui-otp-glass-border-focus,var(--zui-border,oklch(70.7%_0.165_254.624)))] focus-visible:ring-[var(--zui-otp-glass-ring-focus,var(--zui-focus-ring,oklch(70.7%_0.165_254.624_/_0.32)))] dark:border-[color:var(--zui-otp-glass-border-dark,var(--zui-border-dark,#ffffff26))] dark:bg-[var(--zui-otp-glass-bg-dark,var(--zui-surface-soft-dark,#0f172acc))] dark:focus-visible:border-[color:var(--zui-otp-glass-border-focus-dark,var(--zui-border-dark,oklch(78.9%_0.154_211.53)))] dark:focus-visible:ring-[var(--zui-otp-glass-ring-focus-dark,var(--zui-focus-ring-dark,oklch(78.9%_0.154_211.53_/_0.32)))]",
+  success: "border-[color:var(--zui-otp-success-border,var(--zui-status-success,oklch(69.6%_0.17_162.48_/_0.6)))] focus-visible:border-[color:var(--zui-otp-success-border-focus,var(--zui-status-success,oklch(59.6%_0.145_163.225)))] focus-visible:ring-[var(--zui-otp-success-ring-focus,var(--zui-focus-ring,oklch(59.6%_0.145_163.225_/_0.28)))] dark:border-[color:var(--zui-otp-success-border-dark,var(--zui-status-success-dark,oklch(69.6%_0.17_162.48_/_0.5)))] dark:focus-visible:border-[color:var(--zui-otp-success-border-focus-dark,var(--zui-status-success-dark,oklch(77.7%_0.152_181.912)))] dark:focus-visible:ring-[var(--zui-otp-success-ring-focus-dark,var(--zui-focus-ring-dark,oklch(77.7%_0.152_181.912_/_0.28)))]",
+  error: "border-[color:var(--zui-otp-error-border,var(--zui-status-error,oklch(58.6%_0.253_17.585_/_0.7)))] focus-visible:border-[color:var(--zui-otp-error-border-focus,var(--zui-status-error,oklch(58.6%_0.253_17.585)))] focus-visible:ring-[var(--zui-otp-error-ring-focus,var(--zui-focus-ring,oklch(58.6%_0.253_17.585_/_0.28)))] dark:border-[color:var(--zui-otp-error-border-dark,var(--zui-status-error-dark,oklch(71.2%_0.194_13.428_/_0.65)))] dark:focus-visible:border-[color:var(--zui-otp-error-border-focus-dark,var(--zui-status-error-dark,oklch(71.2%_0.194_13.428)))] dark:focus-visible:ring-[var(--zui-otp-error-ring-focus-dark,var(--zui-focus-ring-dark,oklch(71.2%_0.194_13.428_/_0.28)))]",
+  warning: "border-[color:var(--zui-otp-warning-border,var(--zui-status-warning,oklch(79.5%_0.184_86.047_/_0.7)))] focus-visible:border-[color:var(--zui-otp-warning-border-focus,var(--zui-status-warning,oklch(68.1%_0.162_75.834)))] focus-visible:ring-[var(--zui-otp-warning-ring-focus,var(--zui-focus-ring,oklch(68.1%_0.162_75.834_/_0.28)))] dark:border-[color:var(--zui-otp-warning-border-dark,var(--zui-status-warning-dark,oklch(79.5%_0.184_86.047_/_0.5)))] dark:focus-visible:border-[color:var(--zui-otp-warning-border-focus-dark,var(--zui-status-warning-dark,oklch(85.2%_0.199_91.936)))] dark:focus-visible:ring-[var(--zui-otp-warning-ring-focus-dark,var(--zui-focus-ring-dark,oklch(85.2%_0.199_91.936_/_0.28)))]",
+  info: "border-[color:var(--zui-otp-info-border,var(--zui-status-info,oklch(62.3%_0.214_259.815_/_0.7)))] focus-visible:border-[color:var(--zui-otp-info-border-focus,var(--zui-status-info,oklch(54.6%_0.245_262.881)))] focus-visible:ring-[var(--zui-otp-info-ring-focus,var(--zui-focus-ring,oklch(54.6%_0.245_262.881_/_0.28)))] dark:border-[color:var(--zui-otp-info-border-dark,var(--zui-status-info-dark,oklch(62.3%_0.214_259.815_/_0.5)))] dark:focus-visible:border-[color:var(--zui-otp-info-border-focus-dark,var(--zui-status-info-dark,oklch(70.7%_0.165_254.624)))] dark:focus-visible:ring-[var(--zui-otp-info-ring-focus-dark,var(--zui-focus-ring-dark,oklch(70.7%_0.165_254.624_/_0.28)))]",
+  violet: "border-[color:var(--zui-otp-violet-border,var(--zui-color-violet,oklch(60.6%_0.25_292.717_/_0.7)))] focus-visible:border-[color:var(--zui-otp-violet-border-focus,var(--zui-color-violet,oklch(54.1%_0.281_293.009)))] focus-visible:ring-[var(--zui-otp-violet-ring-focus,var(--zui-focus-ring,oklch(54.1%_0.281_293.009_/_0.28)))] dark:border-[color:var(--zui-otp-violet-border-dark,var(--zui-color-violet-dark,oklch(60.6%_0.25_292.717_/_0.5)))] dark:focus-visible:border-[color:var(--zui-otp-violet-border-focus-dark,var(--zui-color-violet-dark,oklch(70.2%_0.183_293.541)))] dark:focus-visible:ring-[var(--zui-otp-violet-ring-focus-dark,var(--zui-focus-ring-dark,oklch(70.2%_0.183_293.541_/_0.28)))]",
+  amber: "border-[color:var(--zui-otp-amber-border,var(--zui-color-amber,oklch(76.9%_0.188_70.08_/_0.7)))] focus-visible:border-[color:var(--zui-otp-amber-border-focus,var(--zui-color-amber,oklch(66.6%_0.179_58.318)))] focus-visible:ring-[var(--zui-otp-amber-ring-focus,var(--zui-focus-ring,oklch(66.6%_0.179_58.318_/_0.28)))] dark:border-[color:var(--zui-otp-amber-border-dark,var(--zui-color-amber-dark,oklch(76.9%_0.188_70.08_/_0.5)))] dark:focus-visible:border-[color:var(--zui-otp-amber-border-focus-dark,var(--zui-color-amber-dark,oklch(82.8%_0.189_84.429)))] dark:focus-visible:ring-[var(--zui-otp-amber-ring-focus-dark,var(--zui-focus-ring-dark,oklch(82.8%_0.189_84.429_/_0.28)))]",
+  pink: "border-[color:var(--zui-otp-pink-border,var(--zui-color-pink,oklch(65.6%_0.241_354.308_/_0.7)))] focus-visible:border-[color:var(--zui-otp-pink-border-focus,var(--zui-color-pink,oklch(59.2%_0.249_0.584)))] focus-visible:ring-[var(--zui-otp-pink-ring-focus,var(--zui-focus-ring,oklch(59.2%_0.249_0.584_/_0.28)))] dark:border-[color:var(--zui-otp-pink-border-dark,var(--zui-color-pink-dark,oklch(65.6%_0.241_354.308_/_0.5)))] dark:focus-visible:border-[color:var(--zui-otp-pink-border-focus-dark,var(--zui-color-pink-dark,oklch(71.8%_0.202_349.761)))] dark:focus-visible:ring-[var(--zui-otp-pink-ring-focus-dark,var(--zui-focus-ring-dark,oklch(71.8%_0.202_349.761_/_0.28)))]",
+  indigo: "border-[color:var(--zui-otp-indigo-border,var(--zui-color-indigo,oklch(58.5%_0.233_277.117_/_0.7)))] focus-visible:border-[color:var(--zui-otp-indigo-border-focus,var(--zui-color-indigo,oklch(51.1%_0.262_276.966)))] focus-visible:ring-[var(--zui-otp-indigo-ring-focus,var(--zui-focus-ring,oklch(51.1%_0.262_276.966_/_0.28)))] dark:border-[color:var(--zui-otp-indigo-border-dark,var(--zui-color-indigo-dark,oklch(58.5%_0.233_277.117_/_0.5)))] dark:focus-visible:border-[color:var(--zui-otp-indigo-border-focus-dark,var(--zui-color-indigo-dark,oklch(67.3%_0.182_276.935)))] dark:focus-visible:ring-[var(--zui-otp-indigo-ring-focus-dark,var(--zui-focus-ring-dark,oklch(67.3%_0.182_276.935_/_0.28)))]",
+  orange: "border-[color:var(--zui-otp-orange-border,var(--zui-color-orange,oklch(70.5%_0.213_47.604_/_0.7)))] focus-visible:border-[color:var(--zui-otp-orange-border-focus,var(--zui-color-orange,oklch(64.6%_0.222_41.116)))] focus-visible:ring-[var(--zui-otp-orange-ring-focus,var(--zui-focus-ring,oklch(64.6%_0.222_41.116_/_0.28)))] dark:border-[color:var(--zui-otp-orange-border-dark,var(--zui-color-orange-dark,oklch(70.5%_0.213_47.604_/_0.5)))] dark:focus-visible:border-[color:var(--zui-otp-orange-border-focus-dark,var(--zui-color-orange-dark,oklch(75%_0.183_55.934)))] dark:focus-visible:ring-[var(--zui-otp-orange-ring-focus-dark,var(--zui-focus-ring-dark,oklch(75%_0.183_55.934_/_0.28)))]",
+  blue: "border border-[color:var(--zui-otp-blue-border,var(--zui-color-blue,#2563eb))] dark:border-[color:var(--zui-otp-blue-border-dark,var(--zui-color-blue-dark,#3b82f6))] bg-[var(--zui-otp-blue-bg,color-mix(in oklch, var(--zui-color-blue,#2563eb) 10%, transparent))] dark:bg-[var(--zui-otp-blue-bg-dark,color-mix(in oklch, var(--zui-color-blue-dark,#3b82f6) 18%, transparent))] text-[color:var(--zui-otp-blue-fg,var(--zui-color-blue,#0f172a))] dark:text-[color:var(--zui-otp-blue-fg-dark,var(--zui-color-blue-dark,#f8fafc))]",
+  cyan: "border border-[color:var(--zui-otp-cyan-border,var(--zui-color-cyan,#0891b2))] dark:border-[color:var(--zui-otp-cyan-border-dark,var(--zui-color-cyan-dark,#22d3ee))] bg-[var(--zui-otp-cyan-bg,color-mix(in oklch, var(--zui-color-cyan,#0891b2) 10%, transparent))] dark:bg-[var(--zui-otp-cyan-bg-dark,color-mix(in oklch, var(--zui-color-cyan-dark,#22d3ee) 18%, transparent))] text-[color:var(--zui-otp-cyan-fg,var(--zui-color-cyan,#0f172a))] dark:text-[color:var(--zui-otp-cyan-fg-dark,var(--zui-color-cyan-dark,#f8fafc))]",
+  green: "border border-[color:var(--zui-otp-green-border,var(--zui-color-green,#16a34a))] dark:border-[color:var(--zui-otp-green-border-dark,var(--zui-color-green-dark,#22c55e))] bg-[var(--zui-otp-green-bg,color-mix(in oklch, var(--zui-color-green,#16a34a) 10%, transparent))] dark:bg-[var(--zui-otp-green-bg-dark,color-mix(in oklch, var(--zui-color-green-dark,#22c55e) 18%, transparent))] text-[color:var(--zui-otp-green-fg,var(--zui-color-green,#0f172a))] dark:text-[color:var(--zui-otp-green-fg-dark,var(--zui-color-green-dark,#f8fafc))]",
+  lime: "border border-[color:var(--zui-otp-lime-border,var(--zui-color-lime,#65a30d))] dark:border-[color:var(--zui-otp-lime-border-dark,var(--zui-color-lime-dark,#a3e635))] bg-[var(--zui-otp-lime-bg,color-mix(in oklch, var(--zui-color-lime,#65a30d) 10%, transparent))] dark:bg-[var(--zui-otp-lime-bg-dark,color-mix(in oklch, var(--zui-color-lime-dark,#a3e635) 18%, transparent))] text-[color:var(--zui-otp-lime-fg,var(--zui-color-lime,#0f172a))] dark:text-[color:var(--zui-otp-lime-fg-dark,var(--zui-color-lime-dark,#f8fafc))]",
+  mint: "border border-[color:var(--zui-otp-mint-border,var(--zui-color-mint,#10b981))] dark:border-[color:var(--zui-otp-mint-border-dark,var(--zui-color-mint-dark,#6ee7b7))] bg-[var(--zui-otp-mint-bg,color-mix(in oklch, var(--zui-color-mint,#10b981) 10%, transparent))] dark:bg-[var(--zui-otp-mint-bg-dark,color-mix(in oklch, var(--zui-color-mint-dark,#6ee7b7) 18%, transparent))] text-[color:var(--zui-otp-mint-fg,var(--zui-color-mint,#0f172a))] dark:text-[color:var(--zui-otp-mint-fg-dark,var(--zui-color-mint-dark,#f8fafc))]",
+  ocean: "border border-[color:var(--zui-otp-ocean-border,var(--zui-color-ocean,#0284c7))] dark:border-[color:var(--zui-otp-ocean-border-dark,var(--zui-color-ocean-dark,#38bdf8))] bg-[var(--zui-otp-ocean-bg,color-mix(in oklch, var(--zui-color-ocean,#0284c7) 10%, transparent))] dark:bg-[var(--zui-otp-ocean-bg-dark,color-mix(in oklch, var(--zui-color-ocean-dark,#38bdf8) 18%, transparent))] text-[color:var(--zui-otp-ocean-fg,var(--zui-color-ocean,#0f172a))] dark:text-[color:var(--zui-otp-ocean-fg-dark,var(--zui-color-ocean-dark,#f8fafc))]",
+  sapphire: "border border-[color:var(--zui-otp-sapphire-border,var(--zui-color-sapphire,#1d4ed8))] dark:border-[color:var(--zui-otp-sapphire-border-dark,var(--zui-color-sapphire-dark,#60a5fa))] bg-[var(--zui-otp-sapphire-bg,color-mix(in oklch, var(--zui-color-sapphire,#1d4ed8) 10%, transparent))] dark:bg-[var(--zui-otp-sapphire-bg-dark,color-mix(in oklch, var(--zui-color-sapphire-dark,#60a5fa) 18%, transparent))] text-[color:var(--zui-otp-sapphire-fg,var(--zui-color-sapphire,#0f172a))] dark:text-[color:var(--zui-otp-sapphire-fg-dark,var(--zui-color-sapphire-dark,#f8fafc))]",
+  lavender: "border border-[color:var(--zui-otp-lavender-border,var(--zui-color-lavender,#8b5cf6))] dark:border-[color:var(--zui-otp-lavender-border-dark,var(--zui-color-lavender-dark,#a78bfa))] bg-[var(--zui-otp-lavender-bg,color-mix(in oklch, var(--zui-color-lavender,#8b5cf6) 10%, transparent))] dark:bg-[var(--zui-otp-lavender-bg-dark,color-mix(in oklch, var(--zui-color-lavender-dark,#a78bfa) 18%, transparent))] text-[color:var(--zui-otp-lavender-fg,var(--zui-color-lavender,#0f172a))] dark:text-[color:var(--zui-otp-lavender-fg-dark,var(--zui-color-lavender-dark,#f8fafc))]",
+  ruby: "border border-[color:var(--zui-otp-ruby-border,var(--zui-color-ruby,#be123c))] dark:border-[color:var(--zui-otp-ruby-border-dark,var(--zui-color-ruby-dark,#fb7185))] bg-[var(--zui-otp-ruby-bg,color-mix(in oklch, var(--zui-color-ruby,#be123c) 10%, transparent))] dark:bg-[var(--zui-otp-ruby-bg-dark,color-mix(in oklch, var(--zui-color-ruby-dark,#fb7185) 18%, transparent))] text-[color:var(--zui-otp-ruby-fg,var(--zui-color-ruby,#0f172a))] dark:text-[color:var(--zui-otp-ruby-fg-dark,var(--zui-color-ruby-dark,#f8fafc))]",
+  red: "border border-[color:var(--zui-otp-red-border,var(--zui-color-red,#dc2626))] dark:border-[color:var(--zui-otp-red-border-dark,var(--zui-color-red-dark,#ef4444))] bg-[var(--zui-otp-red-bg,color-mix(in oklch, var(--zui-color-red,#dc2626) 10%, transparent))] dark:bg-[var(--zui-otp-red-bg-dark,color-mix(in oklch, var(--zui-color-red-dark,#ef4444) 18%, transparent))] text-[color:var(--zui-otp-red-fg,var(--zui-color-red,#0f172a))] dark:text-[color:var(--zui-otp-red-fg-dark,var(--zui-color-red-dark,#f8fafc))]",
+  slate: "border border-[color:var(--zui-otp-slate-border,var(--zui-color-slate,#475569))] dark:border-[color:var(--zui-otp-slate-border-dark,var(--zui-color-slate-dark,#64748b))] bg-[var(--zui-otp-slate-bg,color-mix(in oklch, var(--zui-color-slate,#475569) 10%, transparent))] dark:bg-[var(--zui-otp-slate-bg-dark,color-mix(in oklch, var(--zui-color-slate-dark,#64748b) 18%, transparent))] text-[color:var(--zui-otp-slate-fg,var(--zui-color-slate,#0f172a))] dark:text-[color:var(--zui-otp-slate-fg-dark,var(--zui-color-slate-dark,#f8fafc))]",
+  zinc: "border border-[color:var(--zui-otp-zinc-border,var(--zui-color-zinc,#52525b))] dark:border-[color:var(--zui-otp-zinc-border-dark,var(--zui-color-zinc-dark,#71717a))] bg-[var(--zui-otp-zinc-bg,color-mix(in oklch, var(--zui-color-zinc,#52525b) 10%, transparent))] dark:bg-[var(--zui-otp-zinc-bg-dark,color-mix(in oklch, var(--zui-color-zinc-dark,#71717a) 18%, transparent))] text-[color:var(--zui-otp-zinc-fg,var(--zui-color-zinc,#0f172a))] dark:text-[color:var(--zui-otp-zinc-fg-dark,var(--zui-color-zinc-dark,#f8fafc))]",
+  stone: "border border-[color:var(--zui-otp-stone-border,var(--zui-color-stone,#57534e))] dark:border-[color:var(--zui-otp-stone-border-dark,var(--zui-color-stone-dark,#78716c))] bg-[var(--zui-otp-stone-bg,color-mix(in oklch, var(--zui-color-stone,#57534e) 10%, transparent))] dark:bg-[var(--zui-otp-stone-bg-dark,color-mix(in oklch, var(--zui-color-stone-dark,#78716c) 18%, transparent))] text-[color:var(--zui-otp-stone-fg,var(--zui-color-stone,#0f172a))] dark:text-[color:var(--zui-otp-stone-fg-dark,var(--zui-color-stone-dark,#f8fafc))]",
+  royal: "border border-[color:var(--zui-otp-royal-border,var(--zui-color-royal,#4338ca))] dark:border-[color:var(--zui-otp-royal-border-dark,var(--zui-color-royal-dark,#818cf8))] bg-[var(--zui-otp-royal-bg,color-mix(in oklch, var(--zui-color-royal,#4338ca) 10%, transparent))] dark:bg-[var(--zui-otp-royal-bg-dark,color-mix(in oklch, var(--zui-color-royal-dark,#818cf8) 18%, transparent))] text-[color:var(--zui-otp-royal-fg,var(--zui-color-royal,#0f172a))] dark:text-[color:var(--zui-otp-royal-fg-dark,var(--zui-color-royal-dark,#f8fafc))]",
+  electric: "border border-[color:var(--zui-otp-electric-border,var(--zui-color-electric,#0ea5e9))] dark:border-[color:var(--zui-otp-electric-border-dark,var(--zui-color-electric-dark,#38bdf8))] bg-[var(--zui-otp-electric-bg,color-mix(in oklch, var(--zui-color-electric,#0ea5e9) 10%, transparent))] dark:bg-[var(--zui-otp-electric-bg-dark,color-mix(in oklch, var(--zui-color-electric-dark,#38bdf8) 18%, transparent))] text-[color:var(--zui-otp-electric-fg,var(--zui-color-electric,#0f172a))] dark:text-[color:var(--zui-otp-electric-fg-dark,var(--zui-color-electric-dark,#f8fafc))]",
+  forest: "border border-[color:var(--zui-otp-forest-border,var(--zui-color-forest,#166534))] dark:border-[color:var(--zui-otp-forest-border-dark,var(--zui-color-forest-dark,#4ade80))] bg-[var(--zui-otp-forest-bg,color-mix(in oklch, var(--zui-color-forest,#166534) 10%, transparent))] dark:bg-[var(--zui-otp-forest-bg-dark,color-mix(in oklch, var(--zui-color-forest-dark,#4ade80) 18%, transparent))] text-[color:var(--zui-otp-forest-fg,var(--zui-color-forest,#0f172a))] dark:text-[color:var(--zui-otp-forest-fg-dark,var(--zui-color-forest-dark,#f8fafc))]",
+  sunset: "border border-[color:var(--zui-otp-sunset-border,var(--zui-color-sunset,#ea580c))] dark:border-[color:var(--zui-otp-sunset-border-dark,var(--zui-color-sunset-dark,#fb923c))] bg-[var(--zui-otp-sunset-bg,color-mix(in oklch, var(--zui-color-sunset,#ea580c) 10%, transparent))] dark:bg-[var(--zui-otp-sunset-bg-dark,color-mix(in oklch, var(--zui-color-sunset-dark,#fb923c) 18%, transparent))] text-[color:var(--zui-otp-sunset-fg,var(--zui-color-sunset,#0f172a))] dark:text-[color:var(--zui-otp-sunset-fg-dark,var(--zui-color-sunset-dark,#f8fafc))]",
+  magenta: "border border-[color:var(--zui-otp-magenta-border,var(--zui-color-magenta,#c026d3))] dark:border-[color:var(--zui-otp-magenta-border-dark,var(--zui-color-magenta-dark,#e879f9))] bg-[var(--zui-otp-magenta-bg,color-mix(in oklch, var(--zui-color-magenta,#c026d3) 10%, transparent))] dark:bg-[var(--zui-otp-magenta-bg-dark,color-mix(in oklch, var(--zui-color-magenta-dark,#e879f9) 18%, transparent))] text-[color:var(--zui-otp-magenta-fg,var(--zui-color-magenta,#0f172a))] dark:text-[color:var(--zui-otp-magenta-fg-dark,var(--zui-color-magenta-dark,#f8fafc))]",
+  crimson: "border border-[color:var(--zui-otp-crimson-border,var(--zui-color-crimson,#b91c1c))] dark:border-[color:var(--zui-otp-crimson-border-dark,var(--zui-color-crimson-dark,#f87171))] bg-[var(--zui-otp-crimson-bg,color-mix(in oklch, var(--zui-color-crimson,#b91c1c) 10%, transparent))] dark:bg-[var(--zui-otp-crimson-bg-dark,color-mix(in oklch, var(--zui-color-crimson-dark,#f87171) 18%, transparent))] text-[color:var(--zui-otp-crimson-fg,var(--zui-color-crimson,#0f172a))] dark:text-[color:var(--zui-otp-crimson-fg-dark,var(--zui-color-crimson-dark,#f8fafc))]",
+  aqua: "border border-[color:var(--zui-otp-aqua-border,var(--zui-color-aqua,#0f766e))] dark:border-[color:var(--zui-otp-aqua-border-dark,var(--zui-color-aqua-dark,#2dd4bf))] bg-[var(--zui-otp-aqua-bg,color-mix(in oklch, var(--zui-color-aqua,#0f766e) 10%, transparent))] dark:bg-[var(--zui-otp-aqua-bg-dark,color-mix(in oklch, var(--zui-color-aqua-dark,#2dd4bf) 18%, transparent))] text-[color:var(--zui-otp-aqua-fg,var(--zui-color-aqua,#0f172a))] dark:text-[color:var(--zui-otp-aqua-fg-dark,var(--zui-color-aqua-dark,#f8fafc))]",
+  plum: "border border-[color:var(--zui-otp-plum-border,var(--zui-color-plum,#7e22ce))] dark:border-[color:var(--zui-otp-plum-border-dark,var(--zui-color-plum-dark,#c084fc))] bg-[var(--zui-otp-plum-bg,color-mix(in oklch, var(--zui-color-plum,#7e22ce) 10%, transparent))] dark:bg-[var(--zui-otp-plum-bg-dark,color-mix(in oklch, var(--zui-color-plum-dark,#c084fc) 18%, transparent))] text-[color:var(--zui-otp-plum-fg,var(--zui-color-plum,#0f172a))] dark:text-[color:var(--zui-otp-plum-fg-dark,var(--zui-color-plum-dark,#f8fafc))]"
+};
+
+exports.zuiOtpAppearances = zuiOtpAppearances;
+exports.zuiOtpCellBase = zuiOtpCellBase;
+exports.zuiOtpCellsBase = zuiOtpCellsBase;
+exports.zuiOtpErrorBase = zuiOtpErrorBase;
+exports.zuiOtpHintBase = zuiOtpHintBase;
+exports.zuiOtpLabelBase = zuiOtpLabelBase;
+exports.zuiOtpRootBase = zuiOtpRootBase;
+exports.zuiOtpSeparatorBase = zuiOtpSeparatorBase;
+exports.zuiOtpSizes = zuiOtpSizes;
+//# sourceMappingURL=chunk-BZTAA3MK.js.map
+//# sourceMappingURL=chunk-BZTAA3MK.js.map

package/dist/chunk-BZTAA3MK.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/design-system/otp-input.ts"],"names":[],"mappings":";;;AAAO,IAAM,cAAA,GACX;AAEK,IAAM,eAAA,GACX;AAEK,IAAM,cAAA,GACX;AAEK,IAAM,eAAA,GAAkB;AAExB,IAAM,cAAA,GACX;AAEK,IAAM,mBAAA,GACX;AAEK,IAAM,eAAA,GACX;AAEK,IAAM,WAAA,GAAc;AAAA,EACzB,EAAA,EAAI,qCAAA;AAAA,EACJ,EAAA,EAAI,6BAAA;AAAA,EACJ,EAAA,EAAI;AACN;AAEO,IAAM,iBAAA,GAAoB;AAAA,EAC/B,OAAA,EACE,snBAAA;AAAA,EACF,OAAA,EACE,ypBAAA;AAAA,EACF,KAAA,EACE,0wBAAA;AAAA,EACF,OAAA,EACE,osBAAA;AAAA,EACF,KAAA,EACE,+qBAAA;AAAA,EACF,OAAA,EACE,ksBAAA;AAAA,EACF,IAAA,EAAM,0qBAAA;AAAA,EACN,MAAA,EACE,wrBAAA;AAAA,EACF,KAAA,EACE,wqBAAA;AAAA,EACF,IAAA,EAAM,kqBAAA;AAAA,EACN,MAAA,EACE,0rBAAA;AAAA,EACF,MAAA,EACE,grBAAA;AAAA,EACF,IAAA,EAAM,ygBAAA;AAAA,EACN,IAAA,EAAM,ygBAAA;AAAA,EACN,KAAA,EACE,qhBAAA;AAAA,EACF,IAAA,EAAM,ygBAAA;AAAA,EACN,IAAA,EAAM,ygBAAA;AAAA,EACN,KAAA,EACE,qhBAAA;AAAA,EACF,QAAA,EACE,yjBAAA;AAAA,EACF,QAAA,EACE,yjBAAA;AAAA,EACF,IAAA,EAAM,ygBAAA;AAAA,EACN,GAAA,EAAK,6fAAA;AAAA,EACL,KAAA,EACE,qhBAAA;AAAA,EACF,IAAA,EAAM,ygBAAA;AAAA,EACN,KAAA,EACE,qhBAAA;AAAA,EACF,KAAA,EACE,qhBAAA;AAAA,EACF,QAAA,EACE,yjBAAA;AAAA,EACF,MAAA,EACE,iiBAAA;AAAA,EACF,MAAA,EACE,iiBAAA;AAAA,EACF,OAAA,EACE,6iBAAA;AAAA,EACF,OAAA,EACE,6iBAAA;AAAA,EACF,IAAA,EAAM,ygBAAA;AAAA,EACN,IAAA,EAAM;AACR","file":"chunk-BZTAA3MK.js","sourcesContent":["export const zuiOtpRootBase =\n  \"grid w-fit gap-2 text-[color:var(--zui-otp-label-fg,var(--zui-fg-muted,oklch(20.8%_0.042_265.755)))] dark:text-[color:var(--zui-otp-label-fg-dark,var(--zui-fg-muted-dark,oklch(98.4%_0.003_247.858)))] data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-50\";\n\nexport const zuiOtpLabelBase =\n  \"text-sm font-medium leading-6 text-[color:var(--zui-otp-label-fg,var(--zui-fg-muted,oklch(20.8%_0.042_265.755)))] dark:text-[color:var(--zui-otp-label-fg-dark,var(--zui-fg-muted-dark,oklch(98.4%_0.003_247.858)))]\";\n\nexport const zuiOtpHintBase =\n  \"max-w-sm text-xs leading-5 text-[color:var(--zui-otp-hint-fg,var(--zui-fg-muted,oklch(55.4%_0.046_257.417)))] dark:text-[color:var(--zui-otp-hint-fg-dark,var(--zui-fg-muted-dark,oklch(70.4%_0.04_256.788)))]\";\n\nexport const zuiOtpCellsBase = \"flex flex-wrap items-center gap-2\";\n\nexport const zuiOtpCellBase =\n  \"grid place-items-center rounded-xl border bg-[var(--zui-otp-bg,var(--zui-surface-soft,#ffffff))] text-center font-semibold tabular-nums text-[color:var(--zui-otp-fg,var(--zui-fg,oklch(20.8%_0.042_265.755)))] shadow-sm shadow-black/5 outline-none transition-[background-color,border-color,box-shadow,color,transform] placeholder:text-transparent focus-visible:-translate-y-0.5 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--zui-otp-ring-offset-focus,var(--zui-ring-offset,#ffffff))] disabled:cursor-not-allowed dark:bg-[var(--zui-otp-bg-dark,var(--zui-surface-soft-dark,oklch(12.9%_0.042_264.695)))] dark:text-[color:var(--zui-otp-fg-dark,var(--zui-fg-dark,oklch(98.4%_0.003_247.858)))] dark:shadow-black/20 dark:focus-visible:ring-offset-[var(--zui-otp-ring-offset-focus-dark,var(--zui-ring-offset-dark,oklch(12.9%_0.042_264.695)))]\";\n\nexport const zuiOtpSeparatorBase =\n  \"h-px w-3 shrink-0 bg-[color:var(--zui-otp-separator,#94a3b8)] opacity-70 dark:bg-[color:var(--zui-otp-separator-dark,#64748b)]\";\n\nexport const zuiOtpErrorBase =\n  \"text-sm leading-6 text-[color:var(--zui-otp-error-fg,var(--zui-status-error,oklch(58.6%_0.253_17.585)))] dark:text-[color:var(--zui-otp-error-fg-dark,var(--zui-status-error-dark,oklch(71.2%_0.194_13.428)))]\";\n\nexport const zuiOtpSizes = {\n  sm: \"size-7 md:size-9 rounded-lg text-sm\",\n  md: \"size-9 md:size-11 text-base\",\n  lg: \"size-11 md:size-13 rounded-2xl text-lg\",\n} as const;\n\nexport const zuiOtpAppearances = {\n  default:\n    \"border-[color:var(--zui-otp-default-border,var(--zui-border,#cbd5e1))] focus-visible:border-[color:var(--zui-otp-default-border-focus,var(--zui-border,oklch(44.6%_0.043_257.281)))] focus-visible:ring-[var(--zui-otp-default-ring-focus,var(--zui-focus-ring,oklch(44.6%_0.043_257.281_/_0.25)))] dark:border-[color:var(--zui-otp-default-border-dark,var(--zui-border-dark,#475569))] dark:focus-visible:border-[color:var(--zui-otp-default-border-focus-dark,var(--zui-border-dark,oklch(86.9%_0.022_252.894)))] dark:focus-visible:ring-[var(--zui-otp-default-ring-focus-dark,var(--zui-focus-ring-dark,oklch(86.9%_0.022_252.894_/_0.25)))]\",\n  outline:\n    \"border-[color:var(--zui-otp-outline-border,var(--zui-border,#64748b))] bg-transparent focus-visible:border-[color:var(--zui-otp-outline-border-focus,var(--zui-border,oklch(54.6%_0.245_262.881)))] focus-visible:ring-[var(--zui-otp-outline-ring-focus,var(--zui-focus-ring,oklch(54.6%_0.245_262.881_/_0.28)))] dark:border-[color:var(--zui-otp-outline-border-dark,var(--zui-border-dark,#94a3b8))] dark:bg-transparent dark:focus-visible:border-[color:var(--zui-otp-outline-border-focus-dark,var(--zui-border-dark,oklch(70.7%_0.165_254.624)))] dark:focus-visible:ring-[var(--zui-otp-outline-ring-focus-dark,var(--zui-focus-ring-dark,oklch(70.7%_0.165_254.624_/_0.28)))]\",\n  glass:\n    \"border-[color:var(--zui-otp-glass-border,var(--zui-border,#ffffff66))] bg-[var(--zui-otp-glass-bg,var(--zui-surface-soft,#ffffffcc))] backdrop-blur-md focus-visible:border-[color:var(--zui-otp-glass-border-focus,var(--zui-border,oklch(70.7%_0.165_254.624)))] focus-visible:ring-[var(--zui-otp-glass-ring-focus,var(--zui-focus-ring,oklch(70.7%_0.165_254.624_/_0.32)))] dark:border-[color:var(--zui-otp-glass-border-dark,var(--zui-border-dark,#ffffff26))] dark:bg-[var(--zui-otp-glass-bg-dark,var(--zui-surface-soft-dark,#0f172acc))] dark:focus-visible:border-[color:var(--zui-otp-glass-border-focus-dark,var(--zui-border-dark,oklch(78.9%_0.154_211.53)))] dark:focus-visible:ring-[var(--zui-otp-glass-ring-focus-dark,var(--zui-focus-ring-dark,oklch(78.9%_0.154_211.53_/_0.32)))]\",\n  success:\n    \"border-[color:var(--zui-otp-success-border,var(--zui-status-success,oklch(69.6%_0.17_162.48_/_0.6)))] focus-visible:border-[color:var(--zui-otp-success-border-focus,var(--zui-status-success,oklch(59.6%_0.145_163.225)))] focus-visible:ring-[var(--zui-otp-success-ring-focus,var(--zui-focus-ring,oklch(59.6%_0.145_163.225_/_0.28)))] dark:border-[color:var(--zui-otp-success-border-dark,var(--zui-status-success-dark,oklch(69.6%_0.17_162.48_/_0.5)))] dark:focus-visible:border-[color:var(--zui-otp-success-border-focus-dark,var(--zui-status-success-dark,oklch(77.7%_0.152_181.912)))] dark:focus-visible:ring-[var(--zui-otp-success-ring-focus-dark,var(--zui-focus-ring-dark,oklch(77.7%_0.152_181.912_/_0.28)))]\",\n  error:\n    \"border-[color:var(--zui-otp-error-border,var(--zui-status-error,oklch(58.6%_0.253_17.585_/_0.7)))] focus-visible:border-[color:var(--zui-otp-error-border-focus,var(--zui-status-error,oklch(58.6%_0.253_17.585)))] focus-visible:ring-[var(--zui-otp-error-ring-focus,var(--zui-focus-ring,oklch(58.6%_0.253_17.585_/_0.28)))] dark:border-[color:var(--zui-otp-error-border-dark,var(--zui-status-error-dark,oklch(71.2%_0.194_13.428_/_0.65)))] dark:focus-visible:border-[color:var(--zui-otp-error-border-focus-dark,var(--zui-status-error-dark,oklch(71.2%_0.194_13.428)))] dark:focus-visible:ring-[var(--zui-otp-error-ring-focus-dark,var(--zui-focus-ring-dark,oklch(71.2%_0.194_13.428_/_0.28)))]\",\n  warning:\n    \"border-[color:var(--zui-otp-warning-border,var(--zui-status-warning,oklch(79.5%_0.184_86.047_/_0.7)))] focus-visible:border-[color:var(--zui-otp-warning-border-focus,var(--zui-status-warning,oklch(68.1%_0.162_75.834)))] focus-visible:ring-[var(--zui-otp-warning-ring-focus,var(--zui-focus-ring,oklch(68.1%_0.162_75.834_/_0.28)))] dark:border-[color:var(--zui-otp-warning-border-dark,var(--zui-status-warning-dark,oklch(79.5%_0.184_86.047_/_0.5)))] dark:focus-visible:border-[color:var(--zui-otp-warning-border-focus-dark,var(--zui-status-warning-dark,oklch(85.2%_0.199_91.936)))] dark:focus-visible:ring-[var(--zui-otp-warning-ring-focus-dark,var(--zui-focus-ring-dark,oklch(85.2%_0.199_91.936_/_0.28)))]\",\n  info: \"border-[color:var(--zui-otp-info-border,var(--zui-status-info,oklch(62.3%_0.214_259.815_/_0.7)))] focus-visible:border-[color:var(--zui-otp-info-border-focus,var(--zui-status-info,oklch(54.6%_0.245_262.881)))] focus-visible:ring-[var(--zui-otp-info-ring-focus,var(--zui-focus-ring,oklch(54.6%_0.245_262.881_/_0.28)))] dark:border-[color:var(--zui-otp-info-border-dark,var(--zui-status-info-dark,oklch(62.3%_0.214_259.815_/_0.5)))] dark:focus-visible:border-[color:var(--zui-otp-info-border-focus-dark,var(--zui-status-info-dark,oklch(70.7%_0.165_254.624)))] dark:focus-visible:ring-[var(--zui-otp-info-ring-focus-dark,var(--zui-focus-ring-dark,oklch(70.7%_0.165_254.624_/_0.28)))]\",\n  violet:\n    \"border-[color:var(--zui-otp-violet-border,var(--zui-color-violet,oklch(60.6%_0.25_292.717_/_0.7)))] focus-visible:border-[color:var(--zui-otp-violet-border-focus,var(--zui-color-violet,oklch(54.1%_0.281_293.009)))] focus-visible:ring-[var(--zui-otp-violet-ring-focus,var(--zui-focus-ring,oklch(54.1%_0.281_293.009_/_0.28)))] dark:border-[color:var(--zui-otp-violet-border-dark,var(--zui-color-violet-dark,oklch(60.6%_0.25_292.717_/_0.5)))] dark:focus-visible:border-[color:var(--zui-otp-violet-border-focus-dark,var(--zui-color-violet-dark,oklch(70.2%_0.183_293.541)))] dark:focus-visible:ring-[var(--zui-otp-violet-ring-focus-dark,var(--zui-focus-ring-dark,oklch(70.2%_0.183_293.541_/_0.28)))]\",\n  amber:\n    \"border-[color:var(--zui-otp-amber-border,var(--zui-color-amber,oklch(76.9%_0.188_70.08_/_0.7)))] focus-visible:border-[color:var(--zui-otp-amber-border-focus,var(--zui-color-amber,oklch(66.6%_0.179_58.318)))] focus-visible:ring-[var(--zui-otp-amber-ring-focus,var(--zui-focus-ring,oklch(66.6%_0.179_58.318_/_0.28)))] dark:border-[color:var(--zui-otp-amber-border-dark,var(--zui-color-amber-dark,oklch(76.9%_0.188_70.08_/_0.5)))] dark:focus-visible:border-[color:var(--zui-otp-amber-border-focus-dark,var(--zui-color-amber-dark,oklch(82.8%_0.189_84.429)))] dark:focus-visible:ring-[var(--zui-otp-amber-ring-focus-dark,var(--zui-focus-ring-dark,oklch(82.8%_0.189_84.429_/_0.28)))]\",\n  pink: \"border-[color:var(--zui-otp-pink-border,var(--zui-color-pink,oklch(65.6%_0.241_354.308_/_0.7)))] focus-visible:border-[color:var(--zui-otp-pink-border-focus,var(--zui-color-pink,oklch(59.2%_0.249_0.584)))] focus-visible:ring-[var(--zui-otp-pink-ring-focus,var(--zui-focus-ring,oklch(59.2%_0.249_0.584_/_0.28)))] dark:border-[color:var(--zui-otp-pink-border-dark,var(--zui-color-pink-dark,oklch(65.6%_0.241_354.308_/_0.5)))] dark:focus-visible:border-[color:var(--zui-otp-pink-border-focus-dark,var(--zui-color-pink-dark,oklch(71.8%_0.202_349.761)))] dark:focus-visible:ring-[var(--zui-otp-pink-ring-focus-dark,var(--zui-focus-ring-dark,oklch(71.8%_0.202_349.761_/_0.28)))]\",\n  indigo:\n    \"border-[color:var(--zui-otp-indigo-border,var(--zui-color-indigo,oklch(58.5%_0.233_277.117_/_0.7)))] focus-visible:border-[color:var(--zui-otp-indigo-border-focus,var(--zui-color-indigo,oklch(51.1%_0.262_276.966)))] focus-visible:ring-[var(--zui-otp-indigo-ring-focus,var(--zui-focus-ring,oklch(51.1%_0.262_276.966_/_0.28)))] dark:border-[color:var(--zui-otp-indigo-border-dark,var(--zui-color-indigo-dark,oklch(58.5%_0.233_277.117_/_0.5)))] dark:focus-visible:border-[color:var(--zui-otp-indigo-border-focus-dark,var(--zui-color-indigo-dark,oklch(67.3%_0.182_276.935)))] dark:focus-visible:ring-[var(--zui-otp-indigo-ring-focus-dark,var(--zui-focus-ring-dark,oklch(67.3%_0.182_276.935_/_0.28)))]\",\n  orange:\n    \"border-[color:var(--zui-otp-orange-border,var(--zui-color-orange,oklch(70.5%_0.213_47.604_/_0.7)))] focus-visible:border-[color:var(--zui-otp-orange-border-focus,var(--zui-color-orange,oklch(64.6%_0.222_41.116)))] focus-visible:ring-[var(--zui-otp-orange-ring-focus,var(--zui-focus-ring,oklch(64.6%_0.222_41.116_/_0.28)))] dark:border-[color:var(--zui-otp-orange-border-dark,var(--zui-color-orange-dark,oklch(70.5%_0.213_47.604_/_0.5)))] dark:focus-visible:border-[color:var(--zui-otp-orange-border-focus-dark,var(--zui-color-orange-dark,oklch(75%_0.183_55.934)))] dark:focus-visible:ring-[var(--zui-otp-orange-ring-focus-dark,var(--zui-focus-ring-dark,oklch(75%_0.183_55.934_/_0.28)))]\",\n  blue: \"border border-[color:var(--zui-otp-blue-border,var(--zui-color-blue,#2563eb))] dark:border-[color:var(--zui-otp-blue-border-dark,var(--zui-color-blue-dark,#3b82f6))] bg-[var(--zui-otp-blue-bg,color-mix(in oklch, var(--zui-color-blue,#2563eb) 10%, transparent))] dark:bg-[var(--zui-otp-blue-bg-dark,color-mix(in oklch, var(--zui-color-blue-dark,#3b82f6) 18%, transparent))] text-[color:var(--zui-otp-blue-fg,var(--zui-color-blue,#0f172a))] dark:text-[color:var(--zui-otp-blue-fg-dark,var(--zui-color-blue-dark,#f8fafc))]\",\n  cyan: \"border border-[color:var(--zui-otp-cyan-border,var(--zui-color-cyan,#0891b2))] dark:border-[color:var(--zui-otp-cyan-border-dark,var(--zui-color-cyan-dark,#22d3ee))] bg-[var(--zui-otp-cyan-bg,color-mix(in oklch, var(--zui-color-cyan,#0891b2) 10%, transparent))] dark:bg-[var(--zui-otp-cyan-bg-dark,color-mix(in oklch, var(--zui-color-cyan-dark,#22d3ee) 18%, transparent))] text-[color:var(--zui-otp-cyan-fg,var(--zui-color-cyan,#0f172a))] dark:text-[color:var(--zui-otp-cyan-fg-dark,var(--zui-color-cyan-dark,#f8fafc))]\",\n  green:\n    \"border border-[color:var(--zui-otp-green-border,var(--zui-color-green,#16a34a))] dark:border-[color:var(--zui-otp-green-border-dark,var(--zui-color-green-dark,#22c55e))] bg-[var(--zui-otp-green-bg,color-mix(in oklch, var(--zui-color-green,#16a34a) 10%, transparent))] dark:bg-[var(--zui-otp-green-bg-dark,color-mix(in oklch, var(--zui-color-green-dark,#22c55e) 18%, transparent))] text-[color:var(--zui-otp-green-fg,var(--zui-color-green,#0f172a))] dark:text-[color:var(--zui-otp-green-fg-dark,var(--zui-color-green-dark,#f8fafc))]\",\n  lime: \"border border-[color:var(--zui-otp-lime-border,var(--zui-color-lime,#65a30d))] dark:border-[color:var(--zui-otp-lime-border-dark,var(--zui-color-lime-dark,#a3e635))] bg-[var(--zui-otp-lime-bg,color-mix(in oklch, var(--zui-color-lime,#65a30d) 10%, transparent))] dark:bg-[var(--zui-otp-lime-bg-dark,color-mix(in oklch, var(--zui-color-lime-dark,#a3e635) 18%, transparent))] text-[color:var(--zui-otp-lime-fg,var(--zui-color-lime,#0f172a))] dark:text-[color:var(--zui-otp-lime-fg-dark,var(--zui-color-lime-dark,#f8fafc))]\",\n  mint: \"border border-[color:var(--zui-otp-mint-border,var(--zui-color-mint,#10b981))] dark:border-[color:var(--zui-otp-mint-border-dark,var(--zui-color-mint-dark,#6ee7b7))] bg-[var(--zui-otp-mint-bg,color-mix(in oklch, var(--zui-color-mint,#10b981) 10%, transparent))] dark:bg-[var(--zui-otp-mint-bg-dark,color-mix(in oklch, var(--zui-color-mint-dark,#6ee7b7) 18%, transparent))] text-[color:var(--zui-otp-mint-fg,var(--zui-color-mint,#0f172a))] dark:text-[color:var(--zui-otp-mint-fg-dark,var(--zui-color-mint-dark,#f8fafc))]\",\n  ocean:\n    \"border border-[color:var(--zui-otp-ocean-border,var(--zui-color-ocean,#0284c7))] dark:border-[color:var(--zui-otp-ocean-border-dark,var(--zui-color-ocean-dark,#38bdf8))] bg-[var(--zui-otp-ocean-bg,color-mix(in oklch, var(--zui-color-ocean,#0284c7) 10%, transparent))] dark:bg-[var(--zui-otp-ocean-bg-dark,color-mix(in oklch, var(--zui-color-ocean-dark,#38bdf8) 18%, transparent))] text-[color:var(--zui-otp-ocean-fg,var(--zui-color-ocean,#0f172a))] dark:text-[color:var(--zui-otp-ocean-fg-dark,var(--zui-color-ocean-dark,#f8fafc))]\",\n  sapphire:\n    \"border border-[color:var(--zui-otp-sapphire-border,var(--zui-color-sapphire,#1d4ed8))] dark:border-[color:var(--zui-otp-sapphire-border-dark,var(--zui-color-sapphire-dark,#60a5fa))] bg-[var(--zui-otp-sapphire-bg,color-mix(in oklch, var(--zui-color-sapphire,#1d4ed8) 10%, transparent))] dark:bg-[var(--zui-otp-sapphire-bg-dark,color-mix(in oklch, var(--zui-color-sapphire-dark,#60a5fa) 18%, transparent))] text-[color:var(--zui-otp-sapphire-fg,var(--zui-color-sapphire,#0f172a))] dark:text-[color:var(--zui-otp-sapphire-fg-dark,var(--zui-color-sapphire-dark,#f8fafc))]\",\n  lavender:\n    \"border border-[color:var(--zui-otp-lavender-border,var(--zui-color-lavender,#8b5cf6))] dark:border-[color:var(--zui-otp-lavender-border-dark,var(--zui-color-lavender-dark,#a78bfa))] bg-[var(--zui-otp-lavender-bg,color-mix(in oklch, var(--zui-color-lavender,#8b5cf6) 10%, transparent))] dark:bg-[var(--zui-otp-lavender-bg-dark,color-mix(in oklch, var(--zui-color-lavender-dark,#a78bfa) 18%, transparent))] text-[color:var(--zui-otp-lavender-fg,var(--zui-color-lavender,#0f172a))] dark:text-[color:var(--zui-otp-lavender-fg-dark,var(--zui-color-lavender-dark,#f8fafc))]\",\n  ruby: \"border border-[color:var(--zui-otp-ruby-border,var(--zui-color-ruby,#be123c))] dark:border-[color:var(--zui-otp-ruby-border-dark,var(--zui-color-ruby-dark,#fb7185))] bg-[var(--zui-otp-ruby-bg,color-mix(in oklch, var(--zui-color-ruby,#be123c) 10%, transparent))] dark:bg-[var(--zui-otp-ruby-bg-dark,color-mix(in oklch, var(--zui-color-ruby-dark,#fb7185) 18%, transparent))] text-[color:var(--zui-otp-ruby-fg,var(--zui-color-ruby,#0f172a))] dark:text-[color:var(--zui-otp-ruby-fg-dark,var(--zui-color-ruby-dark,#f8fafc))]\",\n  red: \"border border-[color:var(--zui-otp-red-border,var(--zui-color-red,#dc2626))] dark:border-[color:var(--zui-otp-red-border-dark,var(--zui-color-red-dark,#ef4444))] bg-[var(--zui-otp-red-bg,color-mix(in oklch, var(--zui-color-red,#dc2626) 10%, transparent))] dark:bg-[var(--zui-otp-red-bg-dark,color-mix(in oklch, var(--zui-color-red-dark,#ef4444) 18%, transparent))] text-[color:var(--zui-otp-red-fg,var(--zui-color-red,#0f172a))] dark:text-[color:var(--zui-otp-red-fg-dark,var(--zui-color-red-dark,#f8fafc))]\",\n  slate:\n    \"border border-[color:var(--zui-otp-slate-border,var(--zui-color-slate,#475569))] dark:border-[color:var(--zui-otp-slate-border-dark,var(--zui-color-slate-dark,#64748b))] bg-[var(--zui-otp-slate-bg,color-mix(in oklch, var(--zui-color-slate,#475569) 10%, transparent))] dark:bg-[var(--zui-otp-slate-bg-dark,color-mix(in oklch, var(--zui-color-slate-dark,#64748b) 18%, transparent))] text-[color:var(--zui-otp-slate-fg,var(--zui-color-slate,#0f172a))] dark:text-[color:var(--zui-otp-slate-fg-dark,var(--zui-color-slate-dark,#f8fafc))]\",\n  zinc: \"border border-[color:var(--zui-otp-zinc-border,var(--zui-color-zinc,#52525b))] dark:border-[color:var(--zui-otp-zinc-border-dark,var(--zui-color-zinc-dark,#71717a))] bg-[var(--zui-otp-zinc-bg,color-mix(in oklch, var(--zui-color-zinc,#52525b) 10%, transparent))] dark:bg-[var(--zui-otp-zinc-bg-dark,color-mix(in oklch, var(--zui-color-zinc-dark,#71717a) 18%, transparent))] text-[color:var(--zui-otp-zinc-fg,var(--zui-color-zinc,#0f172a))] dark:text-[color:var(--zui-otp-zinc-fg-dark,var(--zui-color-zinc-dark,#f8fafc))]\",\n  stone:\n    \"border border-[color:var(--zui-otp-stone-border,var(--zui-color-stone,#57534e))] dark:border-[color:var(--zui-otp-stone-border-dark,var(--zui-color-stone-dark,#78716c))] bg-[var(--zui-otp-stone-bg,color-mix(in oklch, var(--zui-color-stone,#57534e) 10%, transparent))] dark:bg-[var(--zui-otp-stone-bg-dark,color-mix(in oklch, var(--zui-color-stone-dark,#78716c) 18%, transparent))] text-[color:var(--zui-otp-stone-fg,var(--zui-color-stone,#0f172a))] dark:text-[color:var(--zui-otp-stone-fg-dark,var(--zui-color-stone-dark,#f8fafc))]\",\n  royal:\n    \"border border-[color:var(--zui-otp-royal-border,var(--zui-color-royal,#4338ca))] dark:border-[color:var(--zui-otp-royal-border-dark,var(--zui-color-royal-dark,#818cf8))] bg-[var(--zui-otp-royal-bg,color-mix(in oklch, var(--zui-color-royal,#4338ca) 10%, transparent))] dark:bg-[var(--zui-otp-royal-bg-dark,color-mix(in oklch, var(--zui-color-royal-dark,#818cf8) 18%, transparent))] text-[color:var(--zui-otp-royal-fg,var(--zui-color-royal,#0f172a))] dark:text-[color:var(--zui-otp-royal-fg-dark,var(--zui-color-royal-dark,#f8fafc))]\",\n  electric:\n    \"border border-[color:var(--zui-otp-electric-border,var(--zui-color-electric,#0ea5e9))] dark:border-[color:var(--zui-otp-electric-border-dark,var(--zui-color-electric-dark,#38bdf8))] bg-[var(--zui-otp-electric-bg,color-mix(in oklch, var(--zui-color-electric,#0ea5e9) 10%, transparent))] dark:bg-[var(--zui-otp-electric-bg-dark,color-mix(in oklch, var(--zui-color-electric-dark,#38bdf8) 18%, transparent))] text-[color:var(--zui-otp-electric-fg,var(--zui-color-electric,#0f172a))] dark:text-[color:var(--zui-otp-electric-fg-dark,var(--zui-color-electric-dark,#f8fafc))]\",\n  forest:\n    \"border border-[color:var(--zui-otp-forest-border,var(--zui-color-forest,#166534))] dark:border-[color:var(--zui-otp-forest-border-dark,var(--zui-color-forest-dark,#4ade80))] bg-[var(--zui-otp-forest-bg,color-mix(in oklch, var(--zui-color-forest,#166534) 10%, transparent))] dark:bg-[var(--zui-otp-forest-bg-dark,color-mix(in oklch, var(--zui-color-forest-dark,#4ade80) 18%, transparent))] text-[color:var(--zui-otp-forest-fg,var(--zui-color-forest,#0f172a))] dark:text-[color:var(--zui-otp-forest-fg-dark,var(--zui-color-forest-dark,#f8fafc))]\",\n  sunset:\n    \"border border-[color:var(--zui-otp-sunset-border,var(--zui-color-sunset,#ea580c))] dark:border-[color:var(--zui-otp-sunset-border-dark,var(--zui-color-sunset-dark,#fb923c))] bg-[var(--zui-otp-sunset-bg,color-mix(in oklch, var(--zui-color-sunset,#ea580c) 10%, transparent))] dark:bg-[var(--zui-otp-sunset-bg-dark,color-mix(in oklch, var(--zui-color-sunset-dark,#fb923c) 18%, transparent))] text-[color:var(--zui-otp-sunset-fg,var(--zui-color-sunset,#0f172a))] dark:text-[color:var(--zui-otp-sunset-fg-dark,var(--zui-color-sunset-dark,#f8fafc))]\",\n  magenta:\n    \"border border-[color:var(--zui-otp-magenta-border,var(--zui-color-magenta,#c026d3))] dark:border-[color:var(--zui-otp-magenta-border-dark,var(--zui-color-magenta-dark,#e879f9))] bg-[var(--zui-otp-magenta-bg,color-mix(in oklch, var(--zui-color-magenta,#c026d3) 10%, transparent))] dark:bg-[var(--zui-otp-magenta-bg-dark,color-mix(in oklch, var(--zui-color-magenta-dark,#e879f9) 18%, transparent))] text-[color:var(--zui-otp-magenta-fg,var(--zui-color-magenta,#0f172a))] dark:text-[color:var(--zui-otp-magenta-fg-dark,var(--zui-color-magenta-dark,#f8fafc))]\",\n  crimson:\n    \"border border-[color:var(--zui-otp-crimson-border,var(--zui-color-crimson,#b91c1c))] dark:border-[color:var(--zui-otp-crimson-border-dark,var(--zui-color-crimson-dark,#f87171))] bg-[var(--zui-otp-crimson-bg,color-mix(in oklch, var(--zui-color-crimson,#b91c1c) 10%, transparent))] dark:bg-[var(--zui-otp-crimson-bg-dark,color-mix(in oklch, var(--zui-color-crimson-dark,#f87171) 18%, transparent))] text-[color:var(--zui-otp-crimson-fg,var(--zui-color-crimson,#0f172a))] dark:text-[color:var(--zui-otp-crimson-fg-dark,var(--zui-color-crimson-dark,#f8fafc))]\",\n  aqua: \"border border-[color:var(--zui-otp-aqua-border,var(--zui-color-aqua,#0f766e))] dark:border-[color:var(--zui-otp-aqua-border-dark,var(--zui-color-aqua-dark,#2dd4bf))] bg-[var(--zui-otp-aqua-bg,color-mix(in oklch, var(--zui-color-aqua,#0f766e) 10%, transparent))] dark:bg-[var(--zui-otp-aqua-bg-dark,color-mix(in oklch, var(--zui-color-aqua-dark,#2dd4bf) 18%, transparent))] text-[color:var(--zui-otp-aqua-fg,var(--zui-color-aqua,#0f172a))] dark:text-[color:var(--zui-otp-aqua-fg-dark,var(--zui-color-aqua-dark,#f8fafc))]\",\n  plum: \"border border-[color:var(--zui-otp-plum-border,var(--zui-color-plum,#7e22ce))] dark:border-[color:var(--zui-otp-plum-border-dark,var(--zui-color-plum-dark,#c084fc))] bg-[var(--zui-otp-plum-bg,color-mix(in oklch, var(--zui-color-plum,#7e22ce) 10%, transparent))] dark:bg-[var(--zui-otp-plum-bg-dark,color-mix(in oklch, var(--zui-color-plum-dark,#c084fc) 18%, transparent))] text-[color:var(--zui-otp-plum-fg,var(--zui-color-plum,#0f172a))] dark:text-[color:var(--zui-otp-plum-fg-dark,var(--zui-color-plum-dark,#f8fafc))]\",\n} as const;\n"]}

package/dist/chunk-CJCOURVM.js

@@ -0,0 +1,79 @@
+'use strict';
+
+// src/design-system/rating.ts
+var zuiRatingRootBase = "grid w-fit gap-2 text-[color:var(--zui-rating-label-fg,var(--zui-fg,oklch(20.8%_0.042_265.755)))] dark:text-[color:var(--zui-rating-label-fg-dark,var(--zui-fg-dark,oklch(98.4%_0.003_247.858)))] data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-50";
+var zuiRatingLabelBase = "text-sm font-medium leading-6 text-[color:var(--zui-rating-label-fg,var(--zui-fg,oklch(20.8%_0.042_265.755)))] dark:text-[color:var(--zui-rating-label-fg-dark,var(--zui-fg-dark,oklch(98.4%_0.003_247.858)))]";
+var zuiRatingHintBase = "max-w-sm text-xs leading-5 text-[color:var(--zui-rating-hint-fg,var(--zui-fg-muted,oklch(55.4%_0.046_257.417)))] dark:text-[color:var(--zui-rating-hint-fg-dark,var(--zui-fg-muted-dark,oklch(70.4%_0.04_256.788)))]";
+var zuiRatingGroupBase = "flex w-fit flex-wrap items-center gap-[var(--zui-rating-gap,0.25rem)]";
+var zuiRatingItemBase = "relative inline-grid shrink-0 place-items-center text-[color:var(--zui-rating-empty,var(--zui-fg-muted,oklch(86.9%_0.022_252.894)))] transition-transform duration-200 data-[interactive=true]:hover:-translate-y-0.5 dark:text-[color:var(--zui-rating-empty-dark,var(--zui-fg-muted-dark,oklch(37.2%_0.044_257.287)))]";
+var zuiRatingIconBase = "pointer-events-none col-start-1 row-start-1 transition-[clip-path,color,transform] duration-200 ease-out";
+var zuiRatingControlBase = "absolute inset-y-0 z-[1] cursor-pointer rounded-md bg-transparent outline-none transition-shadow focus-visible:ring-2 focus-visible:ring-[var(--zui-rating-ring-focus,var(--zui-focus-ring,oklch(54.6%_0.245_262.881_/_0.32)))] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--zui-rating-ring-offset-focus,var(--zui-ring-offset,#ffffff))] disabled:cursor-not-allowed dark:focus-visible:ring-offset-[var(--zui-rating-ring-offset-focus-dark,var(--zui-ring-offset-dark,oklch(12.9%_0.042_264.695)))]";
+var zuiRatingErrorBase = "text-sm leading-6 text-[color:var(--zui-rating-error-fg,var(--zui-status-error,oklch(58.6%_0.253_17.585)))] dark:text-[color:var(--zui-rating-error-fg-dark,var(--zui-status-error-dark,oklch(71.2%_0.194_13.428)))]";
+var zuiRatingSizes = {
+  sm: "size-5 text-lg",
+  md: "size-7 text-2xl",
+  lg: "size-9 text-3xl"
+};
+var zuiRatingAppearances = {
+  default: "text-[color:var(--zui-rating-default-active,var(--zui-brand,oklch(20.8%_0.042_265.755)))] dark:text-[color:var(--zui-rating-default-active-dark,var(--zui-brand-dark,oklch(98.4%_0.003_247.858)))]",
+  secondary: "text-[color:var(--zui-rating-secondary-active,var(--zui-fg,oklch(44.6%_0.043_257.281)))] dark:text-[color:var(--zui-rating-secondary-active-dark,var(--zui-fg-dark,oklch(86.9%_0.022_252.894)))]",
+  destructive: "text-[color:var(--zui-rating-destructive-active,var(--zui-status-error,oklch(58.6%_0.253_17.585)))] dark:text-[color:var(--zui-rating-destructive-active-dark,var(--zui-status-error-dark,oklch(71.2%_0.194_13.428)))]",
+  outline: "text-[color:var(--zui-rating-outline-active,var(--zui-fg,oklch(44.6%_0.043_257.281)))] dark:text-[color:var(--zui-rating-outline-active-dark,var(--zui-fg-dark,oklch(86.9%_0.022_252.894)))]",
+  ghost: "text-[color:var(--zui-rating-ghost-active,var(--zui-fg,oklch(37.2%_0.044_257.287)))] dark:text-[color:var(--zui-rating-ghost-active-dark,var(--zui-fg-dark,oklch(92.9%_0.013_255.508)))]",
+  glass: "text-[color:var(--zui-rating-glass-active,var(--zui-fg,oklch(54.6%_0.245_262.881)))] drop-shadow-[0_2px_12px_rgba(59,130,246,0.25)] dark:text-[color:var(--zui-rating-glass-active-dark,var(--zui-fg-dark,oklch(78.9%_0.154_211.53)))]",
+  emerald: "text-[color:var(--zui-rating-emerald-active,var(--zui-color-emerald,oklch(59.6%_0.145_163.225)))] dark:text-[color:var(--zui-rating-emerald-active-dark,var(--zui-color-emerald-dark,oklch(77.7%_0.152_181.912)))]",
+  indigo: "text-[color:var(--zui-rating-indigo-active,var(--zui-color-indigo,oklch(51.1%_0.262_276.966)))] dark:text-[color:var(--zui-rating-indigo-active-dark,var(--zui-color-indigo-dark,oklch(67.3%_0.182_276.935)))]",
+  purple: "text-[color:var(--zui-rating-purple-active,var(--zui-color-purple,oklch(55.8%_0.288_302.321)))] dark:text-[color:var(--zui-rating-purple-active-dark,var(--zui-color-purple-dark,oklch(71.4%_0.203_305.504)))]",
+  pink: "text-[color:var(--zui-rating-pink-active,var(--zui-color-pink,oklch(59.2%_0.249_0.584)))] dark:text-[color:var(--zui-rating-pink-active-dark,var(--zui-color-pink-dark,oklch(71.8%_0.202_349.761)))]",
+  rose: "text-[color:var(--zui-rating-rose-active,var(--zui-color-rose,oklch(58.6%_0.253_17.585)))] dark:text-[color:var(--zui-rating-rose-active-dark,var(--zui-color-rose-dark,oklch(71.2%_0.194_13.428)))]",
+  sky: "text-[color:var(--zui-rating-sky-active,var(--zui-color-sky,oklch(62.3%_0.214_259.815)))] dark:text-[color:var(--zui-rating-sky-active-dark,var(--zui-color-sky-dark,oklch(74.6%_0.16_232.661)))]",
+  teal: "text-[color:var(--zui-rating-teal-active,var(--zui-color-teal,oklch(60%_0.118_184.704)))] dark:text-[color:var(--zui-rating-teal-active-dark,var(--zui-color-teal-dark,oklch(77.7%_0.152_181.912)))]",
+  yellow: "text-[color:var(--zui-rating-yellow-active,var(--zui-color-yellow,oklch(79.5%_0.184_86.047)))] dark:text-[color:var(--zui-rating-yellow-active-dark,var(--zui-color-yellow-dark,oklch(85.2%_0.199_91.936)))]",
+  orange: "text-[color:var(--zui-rating-orange-active,var(--zui-color-orange,oklch(64.6%_0.222_41.116)))] dark:text-[color:var(--zui-rating-orange-active-dark,var(--zui-color-orange-dark,oklch(75%_0.183_55.934)))]",
+  gray: "text-[color:var(--zui-rating-gray-active,var(--zui-color-gray,oklch(55.1%_0.027_264.364)))] dark:text-[color:var(--zui-rating-gray-active-dark,var(--zui-color-gray-dark,oklch(70.7%_0.022_261.325)))]",
+  amber: "text-[color:var(--zui-rating-amber-active,var(--zui-color-amber,oklch(76.9%_0.188_70.08)))] dark:text-[color:var(--zui-rating-amber-active-dark,var(--zui-color-amber-dark,oklch(82.8%_0.189_84.429)))]",
+  violet: "text-[color:var(--zui-rating-violet-active,var(--zui-color-violet,oklch(54.1%_0.281_293.009)))] dark:text-[color:var(--zui-rating-violet-active-dark,var(--zui-color-violet-dark,oklch(70.2%_0.183_293.541)))]",
+  "gradient-blue": "text-[color:var(--zui-rating-gradient-blue-active,var(--zui-color-blue,oklch(54.6%_0.245_262.881)))] drop-shadow-[0_2px_12px_rgba(37,99,235,0.28)] dark:text-[color:var(--zui-rating-gradient-blue-active-dark,var(--zui-color-blue-dark,oklch(70.7%_0.165_254.624)))]",
+  "gradient-green": "text-[color:var(--zui-rating-gradient-green-active,var(--zui-color-green,oklch(62.7%_0.194_149.214)))] drop-shadow-[0_2px_12px_rgba(22,163,74,0.24)] dark:text-[color:var(--zui-rating-gradient-green-active-dark,var(--zui-color-green-dark,oklch(79.2%_0.209_151.711)))]",
+  "gradient-red": "text-[color:var(--zui-rating-gradient-red-active,var(--zui-color-red,oklch(57.7%_0.245_27.325)))] drop-shadow-[0_2px_12px_rgba(220,38,38,0.24)] dark:text-[color:var(--zui-rating-gradient-red-active-dark,var(--zui-color-red-dark,oklch(70.4%_0.191_22.216)))]",
+  "gradient-yellow": "text-[color:var(--zui-rating-gradient-yellow-active,var(--zui-color-yellow,oklch(79.5%_0.184_86.047)))] drop-shadow-[0_2px_12px_rgba(234,179,8,0.24)] dark:text-[color:var(--zui-rating-gradient-yellow-active-dark,var(--zui-color-yellow-dark,oklch(85.2%_0.199_91.936)))]",
+  "gradient-purple": "text-[color:var(--zui-rating-gradient-purple-active,var(--zui-color-purple,oklch(62.7%_0.265_303.9)))] drop-shadow-[0_2px_12px_rgba(147,51,234,0.24)] dark:text-[color:var(--zui-rating-gradient-purple-active-dark,var(--zui-color-purple-dark,oklch(71.4%_0.203_305.504)))]",
+  "gradient-teal": "text-[color:var(--zui-rating-gradient-teal-active,var(--zui-color-teal,oklch(60%_0.118_184.704)))] drop-shadow-[0_2px_12px_rgba(13,148,136,0.24)] dark:text-[color:var(--zui-rating-gradient-teal-active-dark,var(--zui-color-teal-dark,oklch(77.7%_0.152_181.912)))]",
+  "gradient-indigo": "text-[color:var(--zui-rating-gradient-indigo-active,var(--zui-color-indigo,oklch(51.1%_0.262_276.966)))] drop-shadow-[0_2px_12px_rgba(79,70,229,0.24)] dark:text-[color:var(--zui-rating-gradient-indigo-active-dark,var(--zui-color-indigo-dark,oklch(67.3%_0.182_276.935)))]",
+  "gradient-pink": "text-[color:var(--zui-rating-gradient-pink-active,var(--zui-color-pink,oklch(59.2%_0.249_0.584)))] drop-shadow-[0_2px_12px_rgba(219,39,119,0.24)] dark:text-[color:var(--zui-rating-gradient-pink-active-dark,var(--zui-color-pink-dark,oklch(71.8%_0.202_349.761)))]",
+  "gradient-orange": "text-[color:var(--zui-rating-gradient-orange-active,var(--zui-color-orange,oklch(64.6%_0.222_41.116)))] drop-shadow-[0_2px_12px_rgba(234,88,12,0.24)] dark:text-[color:var(--zui-rating-gradient-orange-active-dark,var(--zui-color-orange-dark,oklch(75%_0.183_55.934)))]",
+  blue: "text-[color:var(--zui-rating-blue-fg,var(--zui-color-blue,#2563eb))] dark:text-[color:var(--zui-rating-blue-fg-dark,var(--zui-color-blue-dark,#3b82f6))]",
+  cyan: "text-[color:var(--zui-rating-cyan-fg,var(--zui-color-cyan,#0891b2))] dark:text-[color:var(--zui-rating-cyan-fg-dark,var(--zui-color-cyan-dark,#22d3ee))]",
+  green: "text-[color:var(--zui-rating-green-fg,var(--zui-color-green,#16a34a))] dark:text-[color:var(--zui-rating-green-fg-dark,var(--zui-color-green-dark,#22c55e))]",
+  lime: "text-[color:var(--zui-rating-lime-fg,var(--zui-color-lime,#65a30d))] dark:text-[color:var(--zui-rating-lime-fg-dark,var(--zui-color-lime-dark,#a3e635))]",
+  mint: "text-[color:var(--zui-rating-mint-fg,var(--zui-color-mint,#10b981))] dark:text-[color:var(--zui-rating-mint-fg-dark,var(--zui-color-mint-dark,#6ee7b7))]",
+  ocean: "text-[color:var(--zui-rating-ocean-fg,var(--zui-color-ocean,#0284c7))] dark:text-[color:var(--zui-rating-ocean-fg-dark,var(--zui-color-ocean-dark,#38bdf8))]",
+  sapphire: "text-[color:var(--zui-rating-sapphire-fg,var(--zui-color-sapphire,#1d4ed8))] dark:text-[color:var(--zui-rating-sapphire-fg-dark,var(--zui-color-sapphire-dark,#60a5fa))]",
+  lavender: "text-[color:var(--zui-rating-lavender-fg,var(--zui-color-lavender,#8b5cf6))] dark:text-[color:var(--zui-rating-lavender-fg-dark,var(--zui-color-lavender-dark,#a78bfa))]",
+  ruby: "text-[color:var(--zui-rating-ruby-fg,var(--zui-color-ruby,#be123c))] dark:text-[color:var(--zui-rating-ruby-fg-dark,var(--zui-color-ruby-dark,#fb7185))]",
+  red: "text-[color:var(--zui-rating-red-fg,var(--zui-color-red,#dc2626))] dark:text-[color:var(--zui-rating-red-fg-dark,var(--zui-color-red-dark,#ef4444))]",
+  slate: "text-[color:var(--zui-rating-slate-fg,var(--zui-color-slate,#475569))] dark:text-[color:var(--zui-rating-slate-fg-dark,var(--zui-color-slate-dark,#64748b))]",
+  zinc: "text-[color:var(--zui-rating-zinc-fg,var(--zui-color-zinc,#52525b))] dark:text-[color:var(--zui-rating-zinc-fg-dark,var(--zui-color-zinc-dark,#71717a))]",
+  stone: "text-[color:var(--zui-rating-stone-fg,var(--zui-color-stone,#57534e))] dark:text-[color:var(--zui-rating-stone-fg-dark,var(--zui-color-stone-dark,#78716c))]",
+  royal: "text-[color:var(--zui-rating-royal-fg,var(--zui-color-royal,#4338ca))] dark:text-[color:var(--zui-rating-royal-fg-dark,var(--zui-color-royal-dark,#818cf8))]",
+  electric: "text-[color:var(--zui-rating-electric-fg,var(--zui-color-electric,#0ea5e9))] dark:text-[color:var(--zui-rating-electric-fg-dark,var(--zui-color-electric-dark,#38bdf8))]",
+  forest: "text-[color:var(--zui-rating-forest-fg,var(--zui-color-forest,#166534))] dark:text-[color:var(--zui-rating-forest-fg-dark,var(--zui-color-forest-dark,#4ade80))]",
+  sunset: "text-[color:var(--zui-rating-sunset-fg,var(--zui-color-sunset,#ea580c))] dark:text-[color:var(--zui-rating-sunset-fg-dark,var(--zui-color-sunset-dark,#fb923c))]",
+  magenta: "text-[color:var(--zui-rating-magenta-fg,var(--zui-color-magenta,#c026d3))] dark:text-[color:var(--zui-rating-magenta-fg-dark,var(--zui-color-magenta-dark,#e879f9))]",
+  crimson: "text-[color:var(--zui-rating-crimson-fg,var(--zui-color-crimson,#b91c1c))] dark:text-[color:var(--zui-rating-crimson-fg-dark,var(--zui-color-crimson-dark,#f87171))]",
+  aqua: "text-[color:var(--zui-rating-aqua-fg,var(--zui-color-aqua,#0f766e))] dark:text-[color:var(--zui-rating-aqua-fg-dark,var(--zui-color-aqua-dark,#2dd4bf))]",
+  plum: "text-[color:var(--zui-rating-plum-fg,var(--zui-color-plum,#7e22ce))] dark:text-[color:var(--zui-rating-plum-fg-dark,var(--zui-color-plum-dark,#c084fc))]"
+};
+
+exports.zuiRatingAppearances = zuiRatingAppearances;
+exports.zuiRatingControlBase = zuiRatingControlBase;
+exports.zuiRatingErrorBase = zuiRatingErrorBase;
+exports.zuiRatingGroupBase = zuiRatingGroupBase;
+exports.zuiRatingHintBase = zuiRatingHintBase;
+exports.zuiRatingIconBase = zuiRatingIconBase;
+exports.zuiRatingItemBase = zuiRatingItemBase;
+exports.zuiRatingLabelBase = zuiRatingLabelBase;
+exports.zuiRatingRootBase = zuiRatingRootBase;
+exports.zuiRatingSizes = zuiRatingSizes;
+//# sourceMappingURL=chunk-CJCOURVM.js.map
+//# sourceMappingURL=chunk-CJCOURVM.js.map

package/dist/chunk-CJCOURVM.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/design-system/rating.ts"],"names":[],"mappings":";;;AAAO,IAAM,iBAAA,GACX;AAEK,IAAM,kBAAA,GACX;AAEK,IAAM,iBAAA,GACX;AAEK,IAAM,kBAAA,GACX;AAEK,IAAM,iBAAA,GACX;AAEK,IAAM,iBAAA,GACX;AAEK,IAAM,oBAAA,GACX;AAEK,IAAM,kBAAA,GACX;AAEK,IAAM,cAAA,GAAiB;AAAA,EAC5B,EAAA,EAAI,gBAAA;AAAA,EACJ,EAAA,EAAI,iBAAA;AAAA,EACJ,EAAA,EAAI;AACN;AAEO,IAAM,oBAAA,GAAuB;AAAA,EAClC,OAAA,EACE,oMAAA;AAAA,EACF,SAAA,EACE,kMAAA;AAAA,EACF,WAAA,EACE,wNAAA;AAAA,EACF,OAAA,EACE,8LAAA;AAAA,EACF,KAAA,EACE,0LAAA;AAAA,EACF,KAAA,EACE,wOAAA;AAAA,EACF,OAAA,EACE,oNAAA;AAAA,EACF,MAAA,EACE,gNAAA;AAAA,EACF,MAAA,EACE,gNAAA;AAAA,EACF,IAAA,EAAM,sMAAA;AAAA,EACN,IAAA,EAAM,sMAAA;AAAA,EACN,GAAA,EAAK,mMAAA;AAAA,EACL,IAAA,EAAM,sMAAA;AAAA,EACN,MAAA,EACE,8MAAA;AAAA,EACF,MAAA,EACE,4MAAA;AAAA,EACF,IAAA,EAAM,wMAAA;AAAA,EACN,KAAA,EACE,yMAAA;AAAA,EACF,MAAA,EACE,gNAAA;AAAA,EACF,eAAA,EACE,wQAAA;AAAA,EACF,gBAAA,EACE,4QAAA;AAAA,EACF,cAAA,EACE,kQAAA;AAAA,EACF,iBAAA,EACE,8QAAA;AAAA,EACF,iBAAA,EACE,+QAAA;AAAA,EACF,eAAA,EACE,uQAAA;AAAA,EACF,iBAAA,EACE,gRAAA;AAAA,EACF,eAAA,EACE,uQAAA;AAAA,EACF,iBAAA,EACE,4QAAA;AAAA,EACF,IAAA,EAAM,0JAAA;AAAA,EACN,IAAA,EAAM,0JAAA;AAAA,EACN,KAAA,EACE,8JAAA;AAAA,EACF,IAAA,EAAM,0JAAA;AAAA,EACN,IAAA,EAAM,0JAAA;AAAA,EACN,KAAA,EACE,8JAAA;AAAA,EACF,QAAA,EACE,0KAAA;AAAA,EACF,QAAA,EACE,0KAAA;AAAA,EACF,IAAA,EAAM,0JAAA;AAAA,EACN,GAAA,EAAK,sJAAA;AAAA,EACL,KAAA,EACE,8JAAA;AAAA,EACF,IAAA,EAAM,0JAAA;AAAA,EACN,KAAA,EACE,8JAAA;AAAA,EACF,KAAA,EACE,8JAAA;AAAA,EACF,QAAA,EACE,0KAAA;AAAA,EACF,MAAA,EACE,kKAAA;AAAA,EACF,MAAA,EACE,kKAAA;AAAA,EACF,OAAA,EACE,sKAAA;AAAA,EACF,OAAA,EACE,sKAAA;AAAA,EACF,IAAA,EAAM,0JAAA;AAAA,EACN,IAAA,EAAM;AACR","file":"chunk-CJCOURVM.js","sourcesContent":["export const zuiRatingRootBase =\n  \"grid w-fit gap-2 text-[color:var(--zui-rating-label-fg,var(--zui-fg,oklch(20.8%_0.042_265.755)))] dark:text-[color:var(--zui-rating-label-fg-dark,var(--zui-fg-dark,oklch(98.4%_0.003_247.858)))] data-[disabled=true]:cursor-not-allowed data-[disabled=true]:opacity-50\";\n\nexport const zuiRatingLabelBase =\n  \"text-sm font-medium leading-6 text-[color:var(--zui-rating-label-fg,var(--zui-fg,oklch(20.8%_0.042_265.755)))] dark:text-[color:var(--zui-rating-label-fg-dark,var(--zui-fg-dark,oklch(98.4%_0.003_247.858)))]\";\n\nexport const zuiRatingHintBase =\n  \"max-w-sm text-xs leading-5 text-[color:var(--zui-rating-hint-fg,var(--zui-fg-muted,oklch(55.4%_0.046_257.417)))] dark:text-[color:var(--zui-rating-hint-fg-dark,var(--zui-fg-muted-dark,oklch(70.4%_0.04_256.788)))]\";\n\nexport const zuiRatingGroupBase =\n  \"flex w-fit flex-wrap items-center gap-[var(--zui-rating-gap,0.25rem)]\";\n\nexport const zuiRatingItemBase =\n  \"relative inline-grid shrink-0 place-items-center text-[color:var(--zui-rating-empty,var(--zui-fg-muted,oklch(86.9%_0.022_252.894)))] transition-transform duration-200 data-[interactive=true]:hover:-translate-y-0.5 dark:text-[color:var(--zui-rating-empty-dark,var(--zui-fg-muted-dark,oklch(37.2%_0.044_257.287)))]\";\n\nexport const zuiRatingIconBase =\n  \"pointer-events-none col-start-1 row-start-1 transition-[clip-path,color,transform] duration-200 ease-out\";\n\nexport const zuiRatingControlBase =\n  \"absolute inset-y-0 z-[1] cursor-pointer rounded-md bg-transparent outline-none transition-shadow focus-visible:ring-2 focus-visible:ring-[var(--zui-rating-ring-focus,var(--zui-focus-ring,oklch(54.6%_0.245_262.881_/_0.32)))] focus-visible:ring-offset-2 focus-visible:ring-offset-[var(--zui-rating-ring-offset-focus,var(--zui-ring-offset,#ffffff))] disabled:cursor-not-allowed dark:focus-visible:ring-offset-[var(--zui-rating-ring-offset-focus-dark,var(--zui-ring-offset-dark,oklch(12.9%_0.042_264.695)))]\";\n\nexport const zuiRatingErrorBase =\n  \"text-sm leading-6 text-[color:var(--zui-rating-error-fg,var(--zui-status-error,oklch(58.6%_0.253_17.585)))] dark:text-[color:var(--zui-rating-error-fg-dark,var(--zui-status-error-dark,oklch(71.2%_0.194_13.428)))]\";\n\nexport const zuiRatingSizes = {\n  sm: \"size-5 text-lg\",\n  md: \"size-7 text-2xl\",\n  lg: \"size-9 text-3xl\",\n} as const;\n\nexport const zuiRatingAppearances = {\n  default:\n    \"text-[color:var(--zui-rating-default-active,var(--zui-brand,oklch(20.8%_0.042_265.755)))] dark:text-[color:var(--zui-rating-default-active-dark,var(--zui-brand-dark,oklch(98.4%_0.003_247.858)))]\",\n  secondary:\n    \"text-[color:var(--zui-rating-secondary-active,var(--zui-fg,oklch(44.6%_0.043_257.281)))] dark:text-[color:var(--zui-rating-secondary-active-dark,var(--zui-fg-dark,oklch(86.9%_0.022_252.894)))]\",\n  destructive:\n    \"text-[color:var(--zui-rating-destructive-active,var(--zui-status-error,oklch(58.6%_0.253_17.585)))] dark:text-[color:var(--zui-rating-destructive-active-dark,var(--zui-status-error-dark,oklch(71.2%_0.194_13.428)))]\",\n  outline:\n    \"text-[color:var(--zui-rating-outline-active,var(--zui-fg,oklch(44.6%_0.043_257.281)))] dark:text-[color:var(--zui-rating-outline-active-dark,var(--zui-fg-dark,oklch(86.9%_0.022_252.894)))]\",\n  ghost:\n    \"text-[color:var(--zui-rating-ghost-active,var(--zui-fg,oklch(37.2%_0.044_257.287)))] dark:text-[color:var(--zui-rating-ghost-active-dark,var(--zui-fg-dark,oklch(92.9%_0.013_255.508)))]\",\n  glass:\n    \"text-[color:var(--zui-rating-glass-active,var(--zui-fg,oklch(54.6%_0.245_262.881)))] drop-shadow-[0_2px_12px_rgba(59,130,246,0.25)] dark:text-[color:var(--zui-rating-glass-active-dark,var(--zui-fg-dark,oklch(78.9%_0.154_211.53)))]\",\n  emerald:\n    \"text-[color:var(--zui-rating-emerald-active,var(--zui-color-emerald,oklch(59.6%_0.145_163.225)))] dark:text-[color:var(--zui-rating-emerald-active-dark,var(--zui-color-emerald-dark,oklch(77.7%_0.152_181.912)))]\",\n  indigo:\n    \"text-[color:var(--zui-rating-indigo-active,var(--zui-color-indigo,oklch(51.1%_0.262_276.966)))] dark:text-[color:var(--zui-rating-indigo-active-dark,var(--zui-color-indigo-dark,oklch(67.3%_0.182_276.935)))]\",\n  purple:\n    \"text-[color:var(--zui-rating-purple-active,var(--zui-color-purple,oklch(55.8%_0.288_302.321)))] dark:text-[color:var(--zui-rating-purple-active-dark,var(--zui-color-purple-dark,oklch(71.4%_0.203_305.504)))]\",\n  pink: \"text-[color:var(--zui-rating-pink-active,var(--zui-color-pink,oklch(59.2%_0.249_0.584)))] dark:text-[color:var(--zui-rating-pink-active-dark,var(--zui-color-pink-dark,oklch(71.8%_0.202_349.761)))]\",\n  rose: \"text-[color:var(--zui-rating-rose-active,var(--zui-color-rose,oklch(58.6%_0.253_17.585)))] dark:text-[color:var(--zui-rating-rose-active-dark,var(--zui-color-rose-dark,oklch(71.2%_0.194_13.428)))]\",\n  sky: \"text-[color:var(--zui-rating-sky-active,var(--zui-color-sky,oklch(62.3%_0.214_259.815)))] dark:text-[color:var(--zui-rating-sky-active-dark,var(--zui-color-sky-dark,oklch(74.6%_0.16_232.661)))]\",\n  teal: \"text-[color:var(--zui-rating-teal-active,var(--zui-color-teal,oklch(60%_0.118_184.704)))] dark:text-[color:var(--zui-rating-teal-active-dark,var(--zui-color-teal-dark,oklch(77.7%_0.152_181.912)))]\",\n  yellow:\n    \"text-[color:var(--zui-rating-yellow-active,var(--zui-color-yellow,oklch(79.5%_0.184_86.047)))] dark:text-[color:var(--zui-rating-yellow-active-dark,var(--zui-color-yellow-dark,oklch(85.2%_0.199_91.936)))]\",\n  orange:\n    \"text-[color:var(--zui-rating-orange-active,var(--zui-color-orange,oklch(64.6%_0.222_41.116)))] dark:text-[color:var(--zui-rating-orange-active-dark,var(--zui-color-orange-dark,oklch(75%_0.183_55.934)))]\",\n  gray: \"text-[color:var(--zui-rating-gray-active,var(--zui-color-gray,oklch(55.1%_0.027_264.364)))] dark:text-[color:var(--zui-rating-gray-active-dark,var(--zui-color-gray-dark,oklch(70.7%_0.022_261.325)))]\",\n  amber:\n    \"text-[color:var(--zui-rating-amber-active,var(--zui-color-amber,oklch(76.9%_0.188_70.08)))] dark:text-[color:var(--zui-rating-amber-active-dark,var(--zui-color-amber-dark,oklch(82.8%_0.189_84.429)))]\",\n  violet:\n    \"text-[color:var(--zui-rating-violet-active,var(--zui-color-violet,oklch(54.1%_0.281_293.009)))] dark:text-[color:var(--zui-rating-violet-active-dark,var(--zui-color-violet-dark,oklch(70.2%_0.183_293.541)))]\",\n  \"gradient-blue\":\n    \"text-[color:var(--zui-rating-gradient-blue-active,var(--zui-color-blue,oklch(54.6%_0.245_262.881)))] drop-shadow-[0_2px_12px_rgba(37,99,235,0.28)] dark:text-[color:var(--zui-rating-gradient-blue-active-dark,var(--zui-color-blue-dark,oklch(70.7%_0.165_254.624)))]\",\n  \"gradient-green\":\n    \"text-[color:var(--zui-rating-gradient-green-active,var(--zui-color-green,oklch(62.7%_0.194_149.214)))] drop-shadow-[0_2px_12px_rgba(22,163,74,0.24)] dark:text-[color:var(--zui-rating-gradient-green-active-dark,var(--zui-color-green-dark,oklch(79.2%_0.209_151.711)))]\",\n  \"gradient-red\":\n    \"text-[color:var(--zui-rating-gradient-red-active,var(--zui-color-red,oklch(57.7%_0.245_27.325)))] drop-shadow-[0_2px_12px_rgba(220,38,38,0.24)] dark:text-[color:var(--zui-rating-gradient-red-active-dark,var(--zui-color-red-dark,oklch(70.4%_0.191_22.216)))]\",\n  \"gradient-yellow\":\n    \"text-[color:var(--zui-rating-gradient-yellow-active,var(--zui-color-yellow,oklch(79.5%_0.184_86.047)))] drop-shadow-[0_2px_12px_rgba(234,179,8,0.24)] dark:text-[color:var(--zui-rating-gradient-yellow-active-dark,var(--zui-color-yellow-dark,oklch(85.2%_0.199_91.936)))]\",\n  \"gradient-purple\":\n    \"text-[color:var(--zui-rating-gradient-purple-active,var(--zui-color-purple,oklch(62.7%_0.265_303.9)))] drop-shadow-[0_2px_12px_rgba(147,51,234,0.24)] dark:text-[color:var(--zui-rating-gradient-purple-active-dark,var(--zui-color-purple-dark,oklch(71.4%_0.203_305.504)))]\",\n  \"gradient-teal\":\n    \"text-[color:var(--zui-rating-gradient-teal-active,var(--zui-color-teal,oklch(60%_0.118_184.704)))] drop-shadow-[0_2px_12px_rgba(13,148,136,0.24)] dark:text-[color:var(--zui-rating-gradient-teal-active-dark,var(--zui-color-teal-dark,oklch(77.7%_0.152_181.912)))]\",\n  \"gradient-indigo\":\n    \"text-[color:var(--zui-rating-gradient-indigo-active,var(--zui-color-indigo,oklch(51.1%_0.262_276.966)))] drop-shadow-[0_2px_12px_rgba(79,70,229,0.24)] dark:text-[color:var(--zui-rating-gradient-indigo-active-dark,var(--zui-color-indigo-dark,oklch(67.3%_0.182_276.935)))]\",\n  \"gradient-pink\":\n    \"text-[color:var(--zui-rating-gradient-pink-active,var(--zui-color-pink,oklch(59.2%_0.249_0.584)))] drop-shadow-[0_2px_12px_rgba(219,39,119,0.24)] dark:text-[color:var(--zui-rating-gradient-pink-active-dark,var(--zui-color-pink-dark,oklch(71.8%_0.202_349.761)))]\",\n  \"gradient-orange\":\n    \"text-[color:var(--zui-rating-gradient-orange-active,var(--zui-color-orange,oklch(64.6%_0.222_41.116)))] drop-shadow-[0_2px_12px_rgba(234,88,12,0.24)] dark:text-[color:var(--zui-rating-gradient-orange-active-dark,var(--zui-color-orange-dark,oklch(75%_0.183_55.934)))]\",\n  blue: \"text-[color:var(--zui-rating-blue-fg,var(--zui-color-blue,#2563eb))] dark:text-[color:var(--zui-rating-blue-fg-dark,var(--zui-color-blue-dark,#3b82f6))]\",\n  cyan: \"text-[color:var(--zui-rating-cyan-fg,var(--zui-color-cyan,#0891b2))] dark:text-[color:var(--zui-rating-cyan-fg-dark,var(--zui-color-cyan-dark,#22d3ee))]\",\n  green:\n    \"text-[color:var(--zui-rating-green-fg,var(--zui-color-green,#16a34a))] dark:text-[color:var(--zui-rating-green-fg-dark,var(--zui-color-green-dark,#22c55e))]\",\n  lime: \"text-[color:var(--zui-rating-lime-fg,var(--zui-color-lime,#65a30d))] dark:text-[color:var(--zui-rating-lime-fg-dark,var(--zui-color-lime-dark,#a3e635))]\",\n  mint: \"text-[color:var(--zui-rating-mint-fg,var(--zui-color-mint,#10b981))] dark:text-[color:var(--zui-rating-mint-fg-dark,var(--zui-color-mint-dark,#6ee7b7))]\",\n  ocean:\n    \"text-[color:var(--zui-rating-ocean-fg,var(--zui-color-ocean,#0284c7))] dark:text-[color:var(--zui-rating-ocean-fg-dark,var(--zui-color-ocean-dark,#38bdf8))]\",\n  sapphire:\n    \"text-[color:var(--zui-rating-sapphire-fg,var(--zui-color-sapphire,#1d4ed8))] dark:text-[color:var(--zui-rating-sapphire-fg-dark,var(--zui-color-sapphire-dark,#60a5fa))]\",\n  lavender:\n    \"text-[color:var(--zui-rating-lavender-fg,var(--zui-color-lavender,#8b5cf6))] dark:text-[color:var(--zui-rating-lavender-fg-dark,var(--zui-color-lavender-dark,#a78bfa))]\",\n  ruby: \"text-[color:var(--zui-rating-ruby-fg,var(--zui-color-ruby,#be123c))] dark:text-[color:var(--zui-rating-ruby-fg-dark,var(--zui-color-ruby-dark,#fb7185))]\",\n  red: \"text-[color:var(--zui-rating-red-fg,var(--zui-color-red,#dc2626))] dark:text-[color:var(--zui-rating-red-fg-dark,var(--zui-color-red-dark,#ef4444))]\",\n  slate:\n    \"text-[color:var(--zui-rating-slate-fg,var(--zui-color-slate,#475569))] dark:text-[color:var(--zui-rating-slate-fg-dark,var(--zui-color-slate-dark,#64748b))]\",\n  zinc: \"text-[color:var(--zui-rating-zinc-fg,var(--zui-color-zinc,#52525b))] dark:text-[color:var(--zui-rating-zinc-fg-dark,var(--zui-color-zinc-dark,#71717a))]\",\n  stone:\n    \"text-[color:var(--zui-rating-stone-fg,var(--zui-color-stone,#57534e))] dark:text-[color:var(--zui-rating-stone-fg-dark,var(--zui-color-stone-dark,#78716c))]\",\n  royal:\n    \"text-[color:var(--zui-rating-royal-fg,var(--zui-color-royal,#4338ca))] dark:text-[color:var(--zui-rating-royal-fg-dark,var(--zui-color-royal-dark,#818cf8))]\",\n  electric:\n    \"text-[color:var(--zui-rating-electric-fg,var(--zui-color-electric,#0ea5e9))] dark:text-[color:var(--zui-rating-electric-fg-dark,var(--zui-color-electric-dark,#38bdf8))]\",\n  forest:\n    \"text-[color:var(--zui-rating-forest-fg,var(--zui-color-forest,#166534))] dark:text-[color:var(--zui-rating-forest-fg-dark,var(--zui-color-forest-dark,#4ade80))]\",\n  sunset:\n    \"text-[color:var(--zui-rating-sunset-fg,var(--zui-color-sunset,#ea580c))] dark:text-[color:var(--zui-rating-sunset-fg-dark,var(--zui-color-sunset-dark,#fb923c))]\",\n  magenta:\n    \"text-[color:var(--zui-rating-magenta-fg,var(--zui-color-magenta,#c026d3))] dark:text-[color:var(--zui-rating-magenta-fg-dark,var(--zui-color-magenta-dark,#e879f9))]\",\n  crimson:\n    \"text-[color:var(--zui-rating-crimson-fg,var(--zui-color-crimson,#b91c1c))] dark:text-[color:var(--zui-rating-crimson-fg-dark,var(--zui-color-crimson-dark,#f87171))]\",\n  aqua: \"text-[color:var(--zui-rating-aqua-fg,var(--zui-color-aqua,#0f766e))] dark:text-[color:var(--zui-rating-aqua-fg-dark,var(--zui-color-aqua-dark,#2dd4bf))]\",\n  plum: \"text-[color:var(--zui-rating-plum-fg,var(--zui-color-plum,#7e22ce))] dark:text-[color:var(--zui-rating-plum-fg-dark,var(--zui-color-plum-dark,#c084fc))]\",\n} as const;\n"]}

package/dist/chunk-COVTMJIQ.mjs

@@ -0,0 +1,171 @@
+// src/design-system/skeleton.ts
+var shimmerLayer = "[background-size:220%_100%] [background-repeat:no-repeat] [background-position:100%_0%]";
+var zuiSkeletonShimmerGradientClasses = {
+  default: `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(255,255,255,0.04),rgba(255,255,255,0.22),rgba(255,255,255,0.04))]`,
+  subtle: `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(255,255,255,0.03),rgba(255,255,255,0.14),rgba(255,255,255,0.03))]`,
+  muted: `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(255,255,255,0.02),rgba(255,255,255,0.1),rgba(255,255,255,0.02))]`,
+  sky: `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(56,189,248,0.1),rgba(56,189,248,0.42),rgba(56,189,248,0.1))]`,
+  rose: `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(251,113,133,0.1),rgba(251,113,133,0.42),rgba(251,113,133,0.1))]`,
+  purple: `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(192,132,252,0.1),rgba(192,132,252,0.42),rgba(192,132,252,0.1))]`,
+  pink: `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(244,114,182,0.1),rgba(244,114,182,0.42),rgba(244,114,182,0.1))]`,
+  orange: `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(251,146,60,0.1),rgba(251,146,60,0.42),rgba(251,146,60,0.1))]`,
+  yellow: `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(250,204,21,0.12),rgba(250,204,21,0.4),rgba(250,204,21,0.12))]`,
+  teal: `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(45,212,191,0.1),rgba(45,212,191,0.42),rgba(45,212,191,0.1))]`,
+  indigo: `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(129,140,248,0.1),rgba(129,140,248,0.42),rgba(129,140,248,0.1))]`,
+  emerald: `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(52,211,153,0.1),rgba(52,211,153,0.42),rgba(52,211,153,0.1))]`,
+  gray: `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(161,161,170,0.1),rgba(161,161,170,0.38),rgba(161,161,170,0.1))]`,
+  amber: `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(251,191,36,0.12),rgba(251,191,36,0.42),rgba(251,191,36,0.12))]`,
+  violet: `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(167,139,250,0.1),rgba(167,139,250,0.42),rgba(167,139,250,0.1))]`,
+  "gradient-blue": `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(100,149,237,0.1),rgba(100,149,237,0.42),rgba(100,149,237,0.1))]`,
+  "gradient-green": `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(52,211,153,0.1),rgba(52,211,153,0.42),rgba(52,211,153,0.1))]`,
+  "gradient-red": `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(239,68,68,0.1),rgba(239,68,68,0.42),rgba(239,68,68,0.1))]`,
+  "gradient-yellow": `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(250,204,21,0.12),rgba(250,204,21,0.42),rgba(250,204,21,0.12))]`,
+  "gradient-purple": `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(167,139,250,0.1),rgba(167,139,250,0.42),rgba(167,139,250,0.1))]`,
+  "gradient-teal": `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(45,212,191,0.1),rgba(45,212,191,0.42),rgba(45,212,191,0.1))]`,
+  "gradient-indigo": `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(129,140,248,0.1),rgba(129,140,248,0.42),rgba(129,140,248,0.1))]`,
+  "gradient-pink": `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(244,114,182,0.1),rgba(244,114,182,0.42),rgba(244,114,182,0.1))]`,
+  "gradient-orange": `${shimmerLayer} [background-image:linear-gradient(90deg,rgba(251,146,60,0.1),rgba(251,146,60,0.42),rgba(251,146,60,0.1))]`,
+  blue: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-blue-shimmer-start,var(--zui-color-blue,#2563eb1a)),var(--zui-skeleton-blue-shimmer-mid,var(--zui-color-blue,#2563eb6b)),var(--zui-skeleton-blue-shimmer-end,var(--zui-color-blue,#2563eb1a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-blue-shimmer-start-dark,var(--zui-color-blue-dark,#3b82f61f)),var(--zui-skeleton-blue-shimmer-mid-dark,var(--zui-color-blue-dark,#3b82f67a)),var(--zui-skeleton-blue-shimmer-end-dark,var(--zui-color-blue-dark,#3b82f61f)))]`,
+  cyan: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-cyan-shimmer-start,var(--zui-color-cyan,#0891b21a)),var(--zui-skeleton-cyan-shimmer-mid,var(--zui-color-cyan,#0891b26b)),var(--zui-skeleton-cyan-shimmer-end,var(--zui-color-cyan,#0891b21a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-cyan-shimmer-start-dark,var(--zui-color-cyan-dark,#22d3ee1f)),var(--zui-skeleton-cyan-shimmer-mid-dark,var(--zui-color-cyan-dark,#22d3ee7a)),var(--zui-skeleton-cyan-shimmer-end-dark,var(--zui-color-cyan-dark,#22d3ee1f)))]`,
+  green: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-green-shimmer-start,var(--zui-color-green,#16a34a1a)),var(--zui-skeleton-green-shimmer-mid,var(--zui-color-green,#16a34a6b)),var(--zui-skeleton-green-shimmer-end,var(--zui-color-green,#16a34a1a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-green-shimmer-start-dark,var(--zui-color-green-dark,#22c55e1f)),var(--zui-skeleton-green-shimmer-mid-dark,var(--zui-color-green-dark,#22c55e7a)),var(--zui-skeleton-green-shimmer-end-dark,var(--zui-color-green-dark,#22c55e1f)))]`,
+  lime: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-lime-shimmer-start,var(--zui-color-lime,#65a30d1a)),var(--zui-skeleton-lime-shimmer-mid,var(--zui-color-lime,#65a30d6b)),var(--zui-skeleton-lime-shimmer-end,var(--zui-color-lime,#65a30d1a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-lime-shimmer-start-dark,var(--zui-color-lime-dark,#a3e6351f)),var(--zui-skeleton-lime-shimmer-mid-dark,var(--zui-color-lime-dark,#a3e6357a)),var(--zui-skeleton-lime-shimmer-end-dark,var(--zui-color-lime-dark,#a3e6351f)))]`,
+  mint: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-mint-shimmer-start,var(--zui-color-mint,#10b9811a)),var(--zui-skeleton-mint-shimmer-mid,var(--zui-color-mint,#10b9816b)),var(--zui-skeleton-mint-shimmer-end,var(--zui-color-mint,#10b9811a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-mint-shimmer-start-dark,var(--zui-color-mint-dark,#6ee7b71f)),var(--zui-skeleton-mint-shimmer-mid-dark,var(--zui-color-mint-dark,#6ee7b77a)),var(--zui-skeleton-mint-shimmer-end-dark,var(--zui-color-mint-dark,#6ee7b71f)))]`,
+  ocean: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-ocean-shimmer-start,var(--zui-color-ocean,#0284c71a)),var(--zui-skeleton-ocean-shimmer-mid,var(--zui-color-ocean,#0284c76b)),var(--zui-skeleton-ocean-shimmer-end,var(--zui-color-ocean,#0284c71a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-ocean-shimmer-start-dark,var(--zui-color-ocean-dark,#38bdf81f)),var(--zui-skeleton-ocean-shimmer-mid-dark,var(--zui-color-ocean-dark,#38bdf87a)),var(--zui-skeleton-ocean-shimmer-end-dark,var(--zui-color-ocean-dark,#38bdf81f)))]`,
+  sapphire: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-sapphire-shimmer-start,var(--zui-color-sapphire,#1d4ed81a)),var(--zui-skeleton-sapphire-shimmer-mid,var(--zui-color-sapphire,#1d4ed86b)),var(--zui-skeleton-sapphire-shimmer-end,var(--zui-color-sapphire,#1d4ed81a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-sapphire-shimmer-start-dark,var(--zui-color-sapphire-dark,#60a5fa1f)),var(--zui-skeleton-sapphire-shimmer-mid-dark,var(--zui-color-sapphire-dark,#60a5fa7a)),var(--zui-skeleton-sapphire-shimmer-end-dark,var(--zui-color-sapphire-dark,#60a5fa1f)))]`,
+  lavender: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-lavender-shimmer-start,var(--zui-color-lavender,#8b5cf61a)),var(--zui-skeleton-lavender-shimmer-mid,var(--zui-color-lavender,#8b5cf66b)),var(--zui-skeleton-lavender-shimmer-end,var(--zui-color-lavender,#8b5cf61a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-lavender-shimmer-start-dark,var(--zui-color-lavender-dark,#a78bfa1f)),var(--zui-skeleton-lavender-shimmer-mid-dark,var(--zui-color-lavender-dark,#a78bfa7a)),var(--zui-skeleton-lavender-shimmer-end-dark,var(--zui-color-lavender-dark,#a78bfa1f)))]`,
+  ruby: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-ruby-shimmer-start,var(--zui-color-ruby,#be123c1a)),var(--zui-skeleton-ruby-shimmer-mid,var(--zui-color-ruby,#be123c6b)),var(--zui-skeleton-ruby-shimmer-end,var(--zui-color-ruby,#be123c1a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-ruby-shimmer-start-dark,var(--zui-color-ruby-dark,#fb71851f)),var(--zui-skeleton-ruby-shimmer-mid-dark,var(--zui-color-ruby-dark,#fb71857a)),var(--zui-skeleton-ruby-shimmer-end-dark,var(--zui-color-ruby-dark,#fb71851f)))]`,
+  red: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-red-shimmer-start,var(--zui-color-red,#dc26261a)),var(--zui-skeleton-red-shimmer-mid,var(--zui-color-red,#dc26266b)),var(--zui-skeleton-red-shimmer-end,var(--zui-color-red,#dc26261a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-red-shimmer-start-dark,var(--zui-color-red-dark,#ef44441f)),var(--zui-skeleton-red-shimmer-mid-dark,var(--zui-color-red-dark,#ef44447a)),var(--zui-skeleton-red-shimmer-end-dark,var(--zui-color-red-dark,#ef44441f)))]`,
+  slate: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-slate-shimmer-start,var(--zui-color-slate,#4755691a)),var(--zui-skeleton-slate-shimmer-mid,var(--zui-color-slate,#4755696b)),var(--zui-skeleton-slate-shimmer-end,var(--zui-color-slate,#4755691a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-slate-shimmer-start-dark,var(--zui-color-slate-dark,#64748b1f)),var(--zui-skeleton-slate-shimmer-mid-dark,var(--zui-color-slate-dark,#64748b7a)),var(--zui-skeleton-slate-shimmer-end-dark,var(--zui-color-slate-dark,#64748b1f)))]`,
+  zinc: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-zinc-shimmer-start,var(--zui-color-zinc,#52525b1a)),var(--zui-skeleton-zinc-shimmer-mid,var(--zui-color-zinc,#52525b6b)),var(--zui-skeleton-zinc-shimmer-end,var(--zui-color-zinc,#52525b1a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-zinc-shimmer-start-dark,var(--zui-color-zinc-dark,#71717a1f)),var(--zui-skeleton-zinc-shimmer-mid-dark,var(--zui-color-zinc-dark,#71717a7a)),var(--zui-skeleton-zinc-shimmer-end-dark,var(--zui-color-zinc-dark,#71717a1f)))]`,
+  stone: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-stone-shimmer-start,var(--zui-color-stone,#57534e1a)),var(--zui-skeleton-stone-shimmer-mid,var(--zui-color-stone,#57534e6b)),var(--zui-skeleton-stone-shimmer-end,var(--zui-color-stone,#57534e1a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-stone-shimmer-start-dark,var(--zui-color-stone-dark,#78716c1f)),var(--zui-skeleton-stone-shimmer-mid-dark,var(--zui-color-stone-dark,#78716c7a)),var(--zui-skeleton-stone-shimmer-end-dark,var(--zui-color-stone-dark,#78716c1f)))]`,
+  royal: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-royal-shimmer-start,var(--zui-color-royal,#4338ca1a)),var(--zui-skeleton-royal-shimmer-mid,var(--zui-color-royal,#4338ca6b)),var(--zui-skeleton-royal-shimmer-end,var(--zui-color-royal,#4338ca1a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-royal-shimmer-start-dark,var(--zui-color-royal-dark,#818cf81f)),var(--zui-skeleton-royal-shimmer-mid-dark,var(--zui-color-royal-dark,#818cf87a)),var(--zui-skeleton-royal-shimmer-end-dark,var(--zui-color-royal-dark,#818cf81f)))]`,
+  electric: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-electric-shimmer-start,var(--zui-color-electric,#0ea5e91a)),var(--zui-skeleton-electric-shimmer-mid,var(--zui-color-electric,#0ea5e96b)),var(--zui-skeleton-electric-shimmer-end,var(--zui-color-electric,#0ea5e91a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-electric-shimmer-start-dark,var(--zui-color-electric-dark,#38bdf81f)),var(--zui-skeleton-electric-shimmer-mid-dark,var(--zui-color-electric-dark,#38bdf87a)),var(--zui-skeleton-electric-shimmer-end-dark,var(--zui-color-electric-dark,#38bdf81f)))]`,
+  forest: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-forest-shimmer-start,var(--zui-color-forest,#1665341a)),var(--zui-skeleton-forest-shimmer-mid,var(--zui-color-forest,#1665346b)),var(--zui-skeleton-forest-shimmer-end,var(--zui-color-forest,#1665341a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-forest-shimmer-start-dark,var(--zui-color-forest-dark,#4ade801f)),var(--zui-skeleton-forest-shimmer-mid-dark,var(--zui-color-forest-dark,#4ade807a)),var(--zui-skeleton-forest-shimmer-end-dark,var(--zui-color-forest-dark,#4ade801f)))]`,
+  sunset: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-sunset-shimmer-start,var(--zui-color-sunset,#ea580c1a)),var(--zui-skeleton-sunset-shimmer-mid,var(--zui-color-sunset,#ea580c6b)),var(--zui-skeleton-sunset-shimmer-end,var(--zui-color-sunset,#ea580c1a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-sunset-shimmer-start-dark,var(--zui-color-sunset-dark,#fb923c1f)),var(--zui-skeleton-sunset-shimmer-mid-dark,var(--zui-color-sunset-dark,#fb923c7a)),var(--zui-skeleton-sunset-shimmer-end-dark,var(--zui-color-sunset-dark,#fb923c1f)))]`,
+  magenta: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-magenta-shimmer-start,var(--zui-color-magenta,#c026d31a)),var(--zui-skeleton-magenta-shimmer-mid,var(--zui-color-magenta,#c026d36b)),var(--zui-skeleton-magenta-shimmer-end,var(--zui-color-magenta,#c026d31a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-magenta-shimmer-start-dark,var(--zui-color-magenta-dark,#e879f91f)),var(--zui-skeleton-magenta-shimmer-mid-dark,var(--zui-color-magenta-dark,#e879f97a)),var(--zui-skeleton-magenta-shimmer-end-dark,var(--zui-color-magenta-dark,#e879f91f)))]`,
+  crimson: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-crimson-shimmer-start,var(--zui-color-crimson,#b91c1c1a)),var(--zui-skeleton-crimson-shimmer-mid,var(--zui-color-crimson,#b91c1c6b)),var(--zui-skeleton-crimson-shimmer-end,var(--zui-color-crimson,#b91c1c1a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-crimson-shimmer-start-dark,var(--zui-color-crimson-dark,#f871711f)),var(--zui-skeleton-crimson-shimmer-mid-dark,var(--zui-color-crimson-dark,#f871717a)),var(--zui-skeleton-crimson-shimmer-end-dark,var(--zui-color-crimson-dark,#f871711f)))]`,
+  aqua: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-aqua-shimmer-start,var(--zui-color-aqua,#0f766e1a)),var(--zui-skeleton-aqua-shimmer-mid,var(--zui-color-aqua,#0f766e6b)),var(--zui-skeleton-aqua-shimmer-end,var(--zui-color-aqua,#0f766e1a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-aqua-shimmer-start-dark,var(--zui-color-aqua-dark,#2dd4bf1f)),var(--zui-skeleton-aqua-shimmer-mid-dark,var(--zui-color-aqua-dark,#2dd4bf7a)),var(--zui-skeleton-aqua-shimmer-end-dark,var(--zui-color-aqua-dark,#2dd4bf1f)))]`,
+  plum: `${shimmerLayer} [background-image:linear-gradient(90deg,var(--zui-skeleton-plum-shimmer-start,var(--zui-color-plum,#7e22ce1a)),var(--zui-skeleton-plum-shimmer-mid,var(--zui-color-plum,#7e22ce6b)),var(--zui-skeleton-plum-shimmer-end,var(--zui-color-plum,#7e22ce1a)))] dark:[background-image:linear-gradient(90deg,var(--zui-skeleton-plum-shimmer-start-dark,var(--zui-color-plum-dark,#c084fc1f)),var(--zui-skeleton-plum-shimmer-mid-dark,var(--zui-color-plum-dark,#c084fc7a)),var(--zui-skeleton-plum-shimmer-end-dark,var(--zui-color-plum-dark,#c084fc1f)))]`
+};
+var zuiSkeletonBase = "relative overflow-hidden bg-[var(--zui-skeleton-bg,var(--zui-surface-muted,#0000001a))] dark:bg-[var(--zui-skeleton-bg-dark,var(--zui-surface-muted-dark,#ffffff1a))] text-[color:var(--zui-skeleton-fg,var(--zui-fg,transparent))] dark:text-[color:var(--zui-skeleton-fg-dark,var(--zui-fg-dark,transparent))]";
+var zuiSkeletonAppearances = {
+  default: "bg-[var(--zui-skeleton-default-bg,var(--zui-surface-muted,#0000001a))] dark:bg-[var(--zui-skeleton-default-bg-dark,var(--zui-surface-muted-dark,#ffffff1a))]",
+  subtle: "bg-[var(--zui-skeleton-subtle-bg,var(--zui-surface-muted,#00000012))] dark:bg-[var(--zui-skeleton-subtle-bg-dark,var(--zui-surface-muted-dark,#ffffff12))]",
+  muted: "bg-[var(--zui-skeleton-muted-bg,var(--zui-fg-muted,oklch(92.9%_0.013_255.508_/_0.8)))] dark:bg-[var(--zui-skeleton-muted-bg-dark,var(--zui-fg-muted-dark,oklch(27.9%_0.041_260.031_/_0.8)))]",
+  sky: "bg-[var(--zui-skeleton-sky-bg,color-mix(in oklch, var(--zui-color-sky,oklch(68.5%_0.169_237.323_/_0.1)) 10%, transparent))] dark:bg-[var(--zui-skeleton-sky-bg-dark,color-mix(in oklch, var(--zui-color-sky-dark,oklch(68.5%_0.169_237.323_/_0.1)) 18%, transparent))]",
+  rose: "bg-[var(--zui-skeleton-rose-bg,color-mix(in oklch, var(--zui-color-rose,oklch(64.5%_0.246_16.439_/_0.1)) 10%, transparent))] dark:bg-[var(--zui-skeleton-rose-bg-dark,color-mix(in oklch, var(--zui-color-rose-dark,oklch(64.5%_0.246_16.439_/_0.1)) 18%, transparent))]",
+  purple: "bg-[var(--zui-skeleton-purple-bg,color-mix(in oklch, var(--zui-color-purple,oklch(62.7%_0.265_303.9_/_0.1)) 10%, transparent))] dark:bg-[var(--zui-skeleton-purple-bg-dark,color-mix(in oklch, var(--zui-color-purple-dark,oklch(62.7%_0.265_303.9_/_0.1)) 18%, transparent))]",
+  pink: "bg-[var(--zui-skeleton-pink-bg,color-mix(in oklch, var(--zui-color-pink,oklch(65.6%_0.241_354.308_/_0.1)) 10%, transparent))] dark:bg-[var(--zui-skeleton-pink-bg-dark,color-mix(in oklch, var(--zui-color-pink-dark,oklch(65.6%_0.241_354.308_/_0.1)) 18%, transparent))]",
+  orange: "bg-[var(--zui-skeleton-orange-bg,color-mix(in oklch, var(--zui-color-orange,oklch(70.5%_0.213_47.604_/_0.1)) 10%, transparent))] dark:bg-[var(--zui-skeleton-orange-bg-dark,color-mix(in oklch, var(--zui-color-orange-dark,oklch(70.5%_0.213_47.604_/_0.1)) 18%, transparent))]",
+  yellow: "bg-[var(--zui-skeleton-yellow-bg,color-mix(in oklch, var(--zui-color-yellow,oklch(79.5%_0.184_86.047_/_0.1)) 10%, transparent))] dark:bg-[var(--zui-skeleton-yellow-bg-dark,color-mix(in oklch, var(--zui-color-yellow-dark,oklch(79.5%_0.184_86.047_/_0.1)) 18%, transparent))]",
+  teal: "bg-[var(--zui-skeleton-teal-bg,color-mix(in oklch, var(--zui-color-teal,oklch(70.4%_0.14_182.503_/_0.1)) 10%, transparent))] dark:bg-[var(--zui-skeleton-teal-bg-dark,color-mix(in oklch, var(--zui-color-teal-dark,oklch(70.4%_0.14_182.503_/_0.1)) 18%, transparent))]",
+  indigo: "bg-[var(--zui-skeleton-indigo-bg,color-mix(in oklch, var(--zui-color-indigo,oklch(58.5%_0.233_277.117_/_0.1)) 10%, transparent))] dark:bg-[var(--zui-skeleton-indigo-bg-dark,color-mix(in oklch, var(--zui-color-indigo-dark,oklch(58.5%_0.233_277.117_/_0.1)) 18%, transparent))]",
+  emerald: "bg-[var(--zui-skeleton-emerald-bg,color-mix(in oklch, var(--zui-color-emerald,oklch(69.6%_0.17_162.48_/_0.1)) 10%, transparent))] dark:bg-[var(--zui-skeleton-emerald-bg-dark,color-mix(in oklch, var(--zui-color-emerald-dark,oklch(69.6%_0.17_162.48_/_0.1)) 18%, transparent))]",
+  gray: "bg-[var(--zui-skeleton-gray-bg,color-mix(in oklch, var(--zui-color-gray,oklch(55.1%_0.027_264.364_/_0.1)) 10%, transparent))] dark:bg-[var(--zui-skeleton-gray-bg-dark,color-mix(in oklch, var(--zui-color-gray-dark,oklch(55.1%_0.027_264.364_/_0.1)) 18%, transparent))]",
+  amber: "bg-[var(--zui-skeleton-amber-bg,color-mix(in oklch, var(--zui-color-amber,oklch(76.9%_0.188_70.08_/_0.1)) 10%, transparent))] dark:bg-[var(--zui-skeleton-amber-bg-dark,color-mix(in oklch, var(--zui-color-amber-dark,oklch(76.9%_0.188_70.08_/_0.1)) 18%, transparent))]",
+  violet: "bg-[var(--zui-skeleton-violet-bg,color-mix(in oklch, var(--zui-color-violet,oklch(60.6%_0.25_292.717_/_0.1)) 10%, transparent))] dark:bg-[var(--zui-skeleton-violet-bg-dark,color-mix(in oklch, var(--zui-color-violet-dark,oklch(60.6%_0.25_292.717_/_0.1)) 18%, transparent))]",
+  "gradient-blue": "bg-linear-to-r from-[var(--zui-skeleton-gradient-blue-from,var(--zui-color-blue,oklch(42.4%_0.199_265.638)))] dark:from-[var(--zui-skeleton-gradient-blue-from-dark,var(--zui-color-blue-dark,oklch(54.6%_0.245_262.881)))] to-[var(--zui-skeleton-gradient-blue-to,var(--zui-color-purple,oklch(43.8%_0.218_303.724)))] dark:to-[var(--zui-skeleton-gradient-blue-to-dark,var(--zui-color-purple-dark,oklch(55.8%_0.288_302.321)))]",
+  "gradient-green": "bg-linear-to-r from-[var(--zui-skeleton-gradient-green-from,var(--zui-color-green,oklch(44.8%_0.119_151.328)))] dark:from-[var(--zui-skeleton-gradient-green-from-dark,var(--zui-color-green-dark,oklch(62.7%_0.194_149.214)))] to-[var(--zui-skeleton-gradient-green-to,var(--zui-color-lime,oklch(45.3%_0.124_130.933)))] dark:to-[var(--zui-skeleton-gradient-green-to-dark,var(--zui-color-lime-dark,oklch(64.8%_0.2_131.684)))]",
+  "gradient-red": "bg-linear-to-r from-[var(--zui-skeleton-gradient-red-from,var(--zui-color-red,oklch(44.4%_0.177_26.899)))] dark:from-[var(--zui-skeleton-gradient-red-from-dark,var(--zui-color-red-dark,oklch(57.7%_0.245_27.325)))] to-[var(--zui-skeleton-gradient-red-to,var(--zui-color-pink,oklch(45.9%_0.187_3.815)))] dark:to-[var(--zui-skeleton-gradient-red-to-dark,var(--zui-color-pink-dark,oklch(59.2%_0.249_0.584)))]",
+  "gradient-yellow": "bg-linear-to-r from-[var(--zui-skeleton-gradient-yellow-from,var(--zui-color-yellow,oklch(47.6%_0.114_61.907)))] dark:from-[var(--zui-skeleton-gradient-yellow-from-dark,var(--zui-color-yellow-dark,oklch(68.1%_0.162_75.834)))] to-[var(--zui-skeleton-gradient-yellow-to,var(--zui-color-orange,oklch(47%_0.157_37.304)))] dark:to-[var(--zui-skeleton-gradient-yellow-to-dark,var(--zui-color-orange-dark,oklch(64.6%_0.222_41.116)))]",
+  "gradient-purple": "bg-linear-to-r from-[var(--zui-skeleton-gradient-purple-from,var(--zui-color-purple,oklch(43.8%_0.218_303.724)))] dark:from-[var(--zui-skeleton-gradient-purple-from-dark,var(--zui-color-purple-dark,oklch(55.8%_0.288_302.321)))] to-[var(--zui-skeleton-gradient-purple-to,var(--zui-color-pink,oklch(45.9%_0.187_3.815)))] dark:to-[var(--zui-skeleton-gradient-purple-to-dark,var(--zui-color-pink-dark,oklch(59.2%_0.249_0.584)))]",
+  "gradient-teal": "bg-linear-to-r from-[var(--zui-skeleton-gradient-teal-from,var(--zui-color-teal,oklch(43.7%_0.078_188.216)))] dark:from-[var(--zui-skeleton-gradient-teal-from-dark,var(--zui-color-teal-dark,oklch(60%_0.118_184.704)))] to-[var(--zui-skeleton-gradient-teal-to,var(--zui-color-cyan,oklch(45%_0.085_224.283)))] dark:to-[var(--zui-skeleton-gradient-teal-to-dark,var(--zui-color-cyan-dark,oklch(60.9%_0.126_221.723)))]",
+  "gradient-indigo": "bg-linear-to-r from-[var(--zui-skeleton-gradient-indigo-from,var(--zui-color-indigo,oklch(39.8%_0.195_277.366)))] dark:from-[var(--zui-skeleton-gradient-indigo-from-dark,var(--zui-color-indigo-dark,oklch(51.1%_0.262_276.966)))] to-[var(--zui-skeleton-gradient-indigo-to,var(--zui-color-purple,oklch(43.8%_0.218_303.724)))] dark:to-[var(--zui-skeleton-gradient-indigo-to-dark,var(--zui-color-purple-dark,oklch(55.8%_0.288_302.321)))]",
+  "gradient-pink": "bg-linear-to-r from-[var(--zui-skeleton-gradient-pink-from,var(--zui-color-pink,oklch(45.9%_0.187_3.815)))] dark:from-[var(--zui-skeleton-gradient-pink-from-dark,var(--zui-color-pink-dark,oklch(59.2%_0.249_0.584)))] to-[var(--zui-skeleton-gradient-pink-to,var(--zui-color-rose,oklch(45.5%_0.188_13.697)))] dark:to-[var(--zui-skeleton-gradient-pink-to-dark,var(--zui-color-rose-dark,oklch(58.6%_0.253_17.585)))]",
+  "gradient-orange": "bg-linear-to-r from-[var(--zui-skeleton-gradient-orange-from,var(--zui-color-orange,oklch(47%_0.157_37.304)))] dark:from-[var(--zui-skeleton-gradient-orange-from-dark,var(--zui-color-orange-dark,oklch(64.6%_0.222_41.116)))] to-[var(--zui-skeleton-gradient-orange-to,var(--zui-color-red,oklch(44.4%_0.177_26.899)))] dark:to-[var(--zui-skeleton-gradient-orange-to-dark,var(--zui-color-red-dark,oklch(57.7%_0.245_27.325)))]",
+  blue: "bg-[var(--zui-skeleton-blue-bg,color-mix(in oklch, var(--zui-color-blue,#2563eb) 10%, transparent))] dark:bg-[var(--zui-skeleton-blue-bg-dark,color-mix(in oklch, var(--zui-color-blue-dark,#3b82f6) 18%, transparent))]",
+  cyan: "bg-[var(--zui-skeleton-cyan-bg,color-mix(in oklch, var(--zui-color-cyan,#0891b2) 10%, transparent))] dark:bg-[var(--zui-skeleton-cyan-bg-dark,color-mix(in oklch, var(--zui-color-cyan-dark,#22d3ee) 18%, transparent))]",
+  green: "bg-[var(--zui-skeleton-green-bg,color-mix(in oklch, var(--zui-color-green,#16a34a) 10%, transparent))] dark:bg-[var(--zui-skeleton-green-bg-dark,color-mix(in oklch, var(--zui-color-green-dark,#22c55e) 18%, transparent))]",
+  lime: "bg-[var(--zui-skeleton-lime-bg,color-mix(in oklch, var(--zui-color-lime,#65a30d) 10%, transparent))] dark:bg-[var(--zui-skeleton-lime-bg-dark,color-mix(in oklch, var(--zui-color-lime-dark,#a3e635) 18%, transparent))]",
+  mint: "bg-[var(--zui-skeleton-mint-bg,color-mix(in oklch, var(--zui-color-mint,#10b981) 10%, transparent))] dark:bg-[var(--zui-skeleton-mint-bg-dark,color-mix(in oklch, var(--zui-color-mint-dark,#6ee7b7) 18%, transparent))]",
+  ocean: "bg-[var(--zui-skeleton-ocean-bg,color-mix(in oklch, var(--zui-color-ocean,#0284c7) 10%, transparent))] dark:bg-[var(--zui-skeleton-ocean-bg-dark,color-mix(in oklch, var(--zui-color-ocean-dark,#38bdf8) 18%, transparent))]",
+  sapphire: "bg-[var(--zui-skeleton-sapphire-bg,color-mix(in oklch, var(--zui-color-sapphire,#1d4ed8) 10%, transparent))] dark:bg-[var(--zui-skeleton-sapphire-bg-dark,color-mix(in oklch, var(--zui-color-sapphire-dark,#60a5fa) 18%, transparent))]",
+  lavender: "bg-[var(--zui-skeleton-lavender-bg,color-mix(in oklch, var(--zui-color-lavender,#8b5cf6) 10%, transparent))] dark:bg-[var(--zui-skeleton-lavender-bg-dark,color-mix(in oklch, var(--zui-color-lavender-dark,#a78bfa) 18%, transparent))]",
+  ruby: "bg-[var(--zui-skeleton-ruby-bg,color-mix(in oklch, var(--zui-color-ruby,#be123c) 10%, transparent))] dark:bg-[var(--zui-skeleton-ruby-bg-dark,color-mix(in oklch, var(--zui-color-ruby-dark,#fb7185) 18%, transparent))]",
+  red: "bg-[var(--zui-skeleton-red-bg,color-mix(in oklch, var(--zui-color-red,#dc2626) 10%, transparent))] dark:bg-[var(--zui-skeleton-red-bg-dark,color-mix(in oklch, var(--zui-color-red-dark,#ef4444) 18%, transparent))]",
+  slate: "bg-[var(--zui-skeleton-slate-bg,color-mix(in oklch, var(--zui-color-slate,#475569) 10%, transparent))] dark:bg-[var(--zui-skeleton-slate-bg-dark,color-mix(in oklch, var(--zui-color-slate-dark,#64748b) 18%, transparent))]",
+  zinc: "bg-[var(--zui-skeleton-zinc-bg,color-mix(in oklch, var(--zui-color-zinc,#52525b) 10%, transparent))] dark:bg-[var(--zui-skeleton-zinc-bg-dark,color-mix(in oklch, var(--zui-color-zinc-dark,#71717a) 18%, transparent))]",
+  stone: "bg-[var(--zui-skeleton-stone-bg,color-mix(in oklch, var(--zui-color-stone,#57534e) 10%, transparent))] dark:bg-[var(--zui-skeleton-stone-bg-dark,color-mix(in oklch, var(--zui-color-stone-dark,#78716c) 18%, transparent))]",
+  royal: "bg-[var(--zui-skeleton-royal-bg,color-mix(in oklch, var(--zui-color-royal,#4338ca) 10%, transparent))] dark:bg-[var(--zui-skeleton-royal-bg-dark,color-mix(in oklch, var(--zui-color-royal-dark,#818cf8) 18%, transparent))]",
+  electric: "bg-[var(--zui-skeleton-electric-bg,color-mix(in oklch, var(--zui-color-electric,#0ea5e9) 10%, transparent))] dark:bg-[var(--zui-skeleton-electric-bg-dark,color-mix(in oklch, var(--zui-color-electric-dark,#38bdf8) 18%, transparent))]",
+  forest: "bg-[var(--zui-skeleton-forest-bg,color-mix(in oklch, var(--zui-color-forest,#166534) 10%, transparent))] dark:bg-[var(--zui-skeleton-forest-bg-dark,color-mix(in oklch, var(--zui-color-forest-dark,#4ade80) 18%, transparent))]",
+  sunset: "bg-[var(--zui-skeleton-sunset-bg,color-mix(in oklch, var(--zui-color-sunset,#ea580c) 10%, transparent))] dark:bg-[var(--zui-skeleton-sunset-bg-dark,color-mix(in oklch, var(--zui-color-sunset-dark,#fb923c) 18%, transparent))]",
+  magenta: "bg-[var(--zui-skeleton-magenta-bg,color-mix(in oklch, var(--zui-color-magenta,#c026d3) 10%, transparent))] dark:bg-[var(--zui-skeleton-magenta-bg-dark,color-mix(in oklch, var(--zui-color-magenta-dark,#e879f9) 18%, transparent))]",
+  crimson: "bg-[var(--zui-skeleton-crimson-bg,color-mix(in oklch, var(--zui-color-crimson,#b91c1c) 10%, transparent))] dark:bg-[var(--zui-skeleton-crimson-bg-dark,color-mix(in oklch, var(--zui-color-crimson-dark,#f87171) 18%, transparent))]",
+  aqua: "bg-[var(--zui-skeleton-aqua-bg,color-mix(in oklch, var(--zui-color-aqua,#0f766e) 10%, transparent))] dark:bg-[var(--zui-skeleton-aqua-bg-dark,color-mix(in oklch, var(--zui-color-aqua-dark,#2dd4bf) 18%, transparent))]",
+  plum: "bg-[var(--zui-skeleton-plum-bg,color-mix(in oklch, var(--zui-color-plum,#7e22ce) 10%, transparent))] dark:bg-[var(--zui-skeleton-plum-bg-dark,color-mix(in oklch, var(--zui-color-plum-dark,#c084fc) 18%, transparent))]"
+};
+var zuiSkeletonSizes = {
+  sm: "min-h-3",
+  md: "min-h-4",
+  lg: "min-h-6"
+};
+var zuiSkeletonRounded = {
+  none: "rounded-none",
+  sm: "rounded-md",
+  md: "rounded-lg",
+  lg: "rounded-xl",
+  full: "rounded-full"
+};
+var zuiSkeletonAnimations = {
+  none: "",
+  shimmer: "",
+  pulse: ""
+};
+var zuiSkeletonShimmerTones = {
+  default: "",
+  subtle: "",
+  muted: "",
+  sky: "",
+  rose: "",
+  purple: "",
+  pink: "",
+  orange: "",
+  yellow: "",
+  teal: "",
+  indigo: "",
+  emerald: "",
+  gray: "",
+  amber: "",
+  violet: "",
+  "gradient-blue": "",
+  "gradient-green": "",
+  "gradient-red": "",
+  "gradient-yellow": "",
+  "gradient-purple": "",
+  "gradient-teal": "",
+  "gradient-indigo": "",
+  "gradient-pink": "",
+  "gradient-orange": "",
+  blue: "",
+  cyan: "",
+  green: "",
+  lime: "",
+  mint: "",
+  ocean: "",
+  sapphire: "",
+  lavender: "",
+  ruby: "",
+  red: "",
+  slate: "",
+  zinc: "",
+  stone: "",
+  royal: "",
+  electric: "",
+  forest: "",
+  sunset: "",
+  magenta: "",
+  crimson: "",
+  aqua: "",
+  plum: ""
+};
+var zuiSkeletonTextLineBase = "block w-full";
+var zuiSkeletonTextLineSizes = {
+  sm: "h-2.5",
+  md: "h-3",
+  lg: "h-4"
+};
+
+export { zuiSkeletonAnimations, zuiSkeletonAppearances, zuiSkeletonBase, zuiSkeletonRounded, zuiSkeletonShimmerGradientClasses, zuiSkeletonShimmerTones, zuiSkeletonSizes, zuiSkeletonTextLineBase, zuiSkeletonTextLineSizes };
+//# sourceMappingURL=chunk-COVTMJIQ.mjs.map
+//# sourceMappingURL=chunk-COVTMJIQ.mjs.map