@keboola/design 9.1.0 → 11.0.0

package/dist/chunk-SBGAUGXY.js

@@ -0,0 +1,224 @@
+import { cn } from './chunk-LXLIQ2D6.js';
+import { cva } from 'class-variance-authority';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Slot } from '@radix-ui/react-slot';
+
+var addonVariants = cva(
+  [
+    "tw:flex",
+    "tw:items-center",
+    "tw:shrink-0",
+    "tw:bg-inherit",
+    "tw:self-stretch",
+    "tw:px-1",
+    "tw:has-[button]:px-0",
+    'tw:[&_svg:not([class*="tw:size-"])]:size-3'
+  ],
+  {
+    defaultVariants: {
+      align: "inline-end",
+      variant: "inline"
+    },
+    variants: {
+      align: {
+        "inline-start": ["tw:order-first"],
+        "inline-end": ["tw:order-last"]
+      },
+      variant: {
+        inline: [],
+        floating: [
+          "tw:hidden",
+          "tw:group-hover/badge:flex",
+          "tw:absolute",
+          "tw:top-0",
+          "tw:bottom-0",
+          "tw:focus-within:flex"
+        ]
+      }
+    },
+    compoundVariants: [
+      { variant: "floating", align: "inline-end", className: ["tw:right-0"] },
+      { variant: "floating", align: "inline-start", className: ["tw:left-0"] }
+    ]
+  }
+);
+var BadgeAddon = ({
+  ref,
+  align = "inline-end",
+  variant = "inline",
+  className,
+  ...rest
+}) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    ...rest,
+    ref,
+    "data-align": align,
+    "data-variant": variant,
+    className: cn(addonVariants({ align, variant, className }))
+  }
+);
+var BadgeButton = ({ ref, className, type = "button", children, ...rest }) => /* @__PURE__ */ jsx(
+  "button",
+  {
+    ...rest,
+    ref,
+    type,
+    className: cn(
+      "tailwindcss-preflight",
+      "tw:inline-flex",
+      "tw:items-center",
+      "tw:justify-center",
+      "tw:cursor-pointer",
+      "tw:bg-inherit",
+      "tw:text-inherit",
+      "tw:hover:brightness-95",
+      "tw:px-1",
+      // Default sizing for Lucide-icon children (which ship at 24×24); keeps
+      // the visual baseline aligned with the previous FA-icon API and other
+      // icon-wrapper components (ItemIcon, SidebarMenuIcon).
+      'tw:[&_svg:not([class*="tw:size-"])]:size-3',
+      className
+    ),
+    children
+  }
+);
+var BadgeLabel = ({ ref, className, asChild = false, ...rest }) => {
+  const Comp = asChild ? Slot : "span";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      ...rest,
+      ref,
+      "data-slot": "badge-label",
+      className: cn(
+        "tw:max-w-56",
+        "tw:truncate",
+        "tw:px-2",
+        "tw:py-0.5",
+        // Drop side padding only when an *inline* addon is present —
+        // floating addons overlay the label without taking layout space,
+        // so the label still needs full padding behind them.
+        "tw:group-has-[[data-align=inline-start][data-variant=inline]:not(:empty)]/badge:pl-0",
+        "tw:group-has-[[data-align=inline-end][data-variant=inline]:not(:empty)]/badge:pr-0",
+        className
+      )
+    }
+  );
+};
+var badgeColors = {
+  gray: "tw:bg-neutral-400 tw:text-white tw:decoration-neutral-400",
+  "gray-darker": "tw:bg-neutral-500 tw:text-white tw:decoration-neutral-500",
+  "gray-inverse": "tw:bg-neutral-100 tw:text-neutral-500 tw:decoration-neutral-100 tw:[[data-theme=dark]_&]:bg-neutral-700 tw:[[data-theme=dark]_&]:text-neutral-300 tw:[[data-theme=dark]_&]:decoration-neutral-700",
+  green: "tw:bg-green-500 tw:text-white tw:decoration-green-500",
+  "green-darker": "tw:bg-green-600 tw:text-white tw:decoration-green-600",
+  "green-inverse": "tw:bg-green-100 tw:text-green-900 tw:decoration-green-100 tw:[[data-theme=dark]_&]:bg-green-900 tw:[[data-theme=dark]_&]:text-green-200 tw:[[data-theme=dark]_&]:decoration-green-900",
+  blue: "tw:bg-blue-500 tw:text-white tw:decoration-blue-500",
+  "blue-inverse": "tw:bg-blue-100 tw:text-blue-800 tw:decoration-blue-100 tw:[[data-theme=dark]_&]:bg-blue-900 tw:[[data-theme=dark]_&]:text-blue-200 tw:[[data-theme=dark]_&]:decoration-blue-900",
+  red: "tw:bg-error-500 tw:text-white tw:decoration-error-500",
+  orange: "tw:bg-warning-500 tw:text-white tw:decoration-warning-500",
+  "orange-inverse": "tw:bg-warning-100 tw:text-warning-800 tw:decoration-warning-100 tw:[[data-theme=dark]_&]:bg-warning-900 tw:[[data-theme=dark]_&]:text-warning-200 tw:[[data-theme=dark]_&]:decoration-warning-900",
+  amber: "tw:bg-warning-300 tw:text-warning-800 tw:decoration-warning-300",
+  // One rung deeper than `orange-inverse` on both ends of the ramp, which is what
+  // keeps caution and warning telling apart — the two share the `warning` hue.
+  "amber-inverse": "tw:bg-warning-200 tw:text-warning-800 tw:decoration-warning-200 tw:[[data-theme=dark]_&]:bg-warning-800 tw:[[data-theme=dark]_&]:text-warning-200 tw:[[data-theme=dark]_&]:decoration-warning-800",
+  teal: "tw:bg-teal-500 tw:text-white tw:decoration-teal-500",
+  "teal-inverse": "tw:bg-teal-100 tw:text-teal-800 tw:decoration-teal-100 tw:[[data-theme=dark]_&]:bg-teal-900 tw:[[data-theme=dark]_&]:text-teal-200 tw:[[data-theme=dark]_&]:decoration-teal-900",
+  purple: "tw:bg-purple-500 tw:text-white tw:decoration-purple-500",
+  "purple-inverse": "tw:bg-purple-100 tw:text-purple-800 tw:decoration-purple-100 tw:[[data-theme=dark]_&]:bg-purple-900 tw:[[data-theme=dark]_&]:text-purple-200 tw:[[data-theme=dark]_&]:decoration-purple-900",
+  cyan: "tw:bg-cyan-500 tw:text-white tw:decoration-cyan-500",
+  "cyan-inverse": "tw:bg-cyan-100 tw:text-cyan-800 tw:decoration-cyan-100 tw:[[data-theme=dark]_&]:bg-cyan-900 tw:[[data-theme=dark]_&]:text-cyan-200 tw:[[data-theme=dark]_&]:decoration-cyan-900",
+  "sidebar-primary": "tw:bg-sidebar-primary tw:text-white tw:decoration-sidebar-primary",
+  white: "tw:bg-white/90 tw:text-neutral-600 tw:decoration-white/90"
+};
+var badgeRootVariants = cva(
+  [
+    "tailwindcss-preflight",
+    "tw:group/badge",
+    // display
+    "tw:relative",
+    "tw:inline-flex",
+    "tw:justify-center",
+    "tw:items-center",
+    "tw:min-h-5",
+    "tw:h-fit",
+    "tw:shrink-0",
+    "tw:overflow-hidden",
+    // text — chrome weight/tracking are brand-overridable tokens
+    // (`--font-weight-medium` / `--letter-spacing-chrome`); casing lives on the
+    // `default` variant below via `tw:uppercase`.
+    "tw:whitespace-pre-wrap",
+    "tw:break-normal",
+    "tw:text-xs",
+    "tw:font-medium",
+    "tw:tracking-chrome",
+    "tw:text-center",
+    "tw:underline",
+    // content
+    "tw:border-none",
+    "tw:[&>svg]:self-center",
+    "tw:[button&]:cursor-pointer",
+    // focus
+    "tw:focus-visible:outline-hidden",
+    "tw:focus-visible:ring-2",
+    "tw:focus-visible:ring-inset",
+    "tw:focus-visible:ring-ring"
+  ],
+  {
+    defaultVariants: {
+      color: "gray",
+      variant: "default"
+    },
+    variants: {
+      variant: {
+        // Legacy chrome uppercases the default badge; the Keboola V2 brand
+        // (`data-brand="keboola"`) renders it in standard case instead.
+        default: [
+          "tw:rounded tw:uppercase",
+          "tw:[[data-brand=keboola]_&]:normal-case tw:[[data-brand=keboola]_&]:tracking-normal"
+        ],
+        tag: ["tw:rounded tw:normal-case"],
+        pill: ["tw:min-w-5 tw:rounded-full tw:normal-case tw:tracking-normal"]
+      },
+      color: badgeColors
+    }
+  }
+);
+var BadgeRoot = ({ ref, variant, color, className, children, ...rest }) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    ...rest,
+    ref,
+    "data-slot": "badge",
+    className: cn(badgeRootVariants({ variant, color, className })),
+    children
+  }
+);
+var BadgeInner = ({
+  ref,
+  // root props
+  variant,
+  color,
+  // custom props
+  prefix,
+  prefixVariant = "inline",
+  suffix,
+  suffixVariant = "inline",
+  className,
+  labelClassName,
+  ...labelProps
+}) => /* @__PURE__ */ jsxs(BadgeRoot, { className, variant, color, children: [
+  prefix && /* @__PURE__ */ jsx(BadgeAddon, { align: "inline-start", variant: prefixVariant, children: prefix }),
+  /* @__PURE__ */ jsx(BadgeLabel, { ...labelProps, ref, className: labelClassName }),
+  suffix && /* @__PURE__ */ jsx(BadgeAddon, { align: "inline-end", variant: suffixVariant, children: suffix })
+] });
+var Badge = Object.assign(BadgeInner, {
+  Root: BadgeRoot,
+  Button: BadgeButton,
+  Label: BadgeLabel,
+  Addon: BadgeAddon
+});
+
+export { Badge };
+//# sourceMappingURL=chunk-SBGAUGXY.js.map
+//# sourceMappingURL=chunk-SBGAUGXY.js.map

package/dist/chunk-SBGAUGXY.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Badge/BadgeAddon.tsx","../src/components/Badge/BadgeButton.tsx","../src/components/Badge/BadgeLabel.tsx","../src/components/Badge/styles.ts","../src/components/Badge/BadgeRoot.tsx","../src/components/Badge/Badge.tsx"],"names":["jsx","cva"],"mappings":"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","file":"chunk-SBGAUGXY.js","sourcesContent":["import type { ComponentProps } from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '../../utils';\n\nconst addonVariants = cva(\n  [\n    'tw:flex',\n    'tw:items-center',\n    'tw:shrink-0',\n    'tw:bg-inherit',\n    'tw:self-stretch',\n    'tw:px-1',\n    'tw:has-[button]:px-0',\n    'tw:[&_svg:not([class*=\"tw:size-\"])]:size-3',\n  ],\n  {\n    defaultVariants: {\n      align: 'inline-end',\n      variant: 'inline',\n    },\n    variants: {\n      align: {\n        'inline-start': ['tw:order-first'],\n        'inline-end': ['tw:order-last'],\n      },\n      variant: {\n        inline: [],\n        floating: [\n          'tw:hidden',\n          'tw:group-hover/badge:flex',\n\n          'tw:absolute',\n          'tw:top-0',\n          'tw:bottom-0',\n          'tw:focus-within:flex',\n        ],\n      },\n    },\n    compoundVariants: [\n      { variant: 'floating', align: 'inline-end', className: ['tw:right-0'] },\n      { variant: 'floating', align: 'inline-start', className: ['tw:left-0'] },\n    ],\n  },\n);\n\ntype Props = ComponentProps<'div'> & VariantProps<typeof addonVariants>;\n\nexport const BadgeAddon = ({\n  ref,\n  align = 'inline-end',\n  variant = 'inline',\n  className,\n  ...rest\n}: Props) => (\n  <div\n    {...rest}\n    ref={ref}\n    data-align={align}\n    data-variant={variant}\n    className={cn(addonVariants({ align, variant, className }))}\n  />\n);\n","import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'button'>;\n\nexport const BadgeButton = ({ ref, className, type = 'button', children, ...rest }: Props) => (\n  <button\n    {...rest}\n    ref={ref}\n    type={type}\n    className={cn(\n      'tailwindcss-preflight',\n\n      'tw:inline-flex',\n      'tw:items-center',\n      'tw:justify-center',\n      'tw:cursor-pointer',\n\n      'tw:bg-inherit',\n      'tw:text-inherit',\n\n      'tw:hover:brightness-95',\n      'tw:px-1',\n      // Default sizing for Lucide-icon children (which ship at 24×24); keeps\n      // the visual baseline aligned with the previous FA-icon API and other\n      // icon-wrapper components (ItemIcon, SidebarMenuIcon).\n      'tw:[&_svg:not([class*=\"tw:size-\"])]:size-3',\n      className,\n    )}\n  >\n    {children}\n  </button>\n);\n","import type { ComponentProps } from 'react';\nimport { Slot } from '@radix-ui/react-slot';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'span'> & {\n  asChild?: boolean;\n};\n\nexport const BadgeLabel = ({ ref, className, asChild = false, ...rest }: Props) => {\n  const Comp = asChild ? Slot : 'span';\n  return (\n    <Comp\n      {...rest}\n      ref={ref}\n      data-slot=\"badge-label\"\n      className={cn(\n        'tw:max-w-56',\n        'tw:truncate',\n        'tw:px-2',\n        'tw:py-0.5',\n\n        // Drop side padding only when an *inline* addon is present —\n        // floating addons overlay the label without taking layout space,\n        // so the label still needs full padding behind them.\n        'tw:group-has-[[data-align=inline-start][data-variant=inline]:not(:empty)]/badge:pl-0',\n        'tw:group-has-[[data-align=inline-end][data-variant=inline]:not(:empty)]/badge:pr-0',\n        className,\n      )}\n    />\n  );\n};\n","import { cva } from 'class-variance-authority';\n\n/**\n * Badge's `color` variants: a fill class, a foreground class, and a matching\n * `decoration-*` so an underlined badge underlines in its own fill colour.\n *\n * - Tinted (`-inverse`) variants each carry a `[data-theme=dark]` override, so the\n *   chip inverts with the page instead of staying a light slab on a dark surface.\n * - Solid fills are fixed across schemes.\n * - Exported for `scripts/contrast-audit.ts` and the contrast story tests, which\n *   measure each pairing rather than restating this map.\n */\nexport const badgeColors = {\n  gray: 'tw:bg-neutral-400 tw:text-white tw:decoration-neutral-400',\n  'gray-darker': 'tw:bg-neutral-500 tw:text-white tw:decoration-neutral-500',\n  'gray-inverse':\n    'tw:bg-neutral-100 tw:text-neutral-500 tw:decoration-neutral-100 tw:[[data-theme=dark]_&]:bg-neutral-700 tw:[[data-theme=dark]_&]:text-neutral-300 tw:[[data-theme=dark]_&]:decoration-neutral-700',\n  green: 'tw:bg-green-500 tw:text-white tw:decoration-green-500',\n  'green-darker': 'tw:bg-green-600 tw:text-white tw:decoration-green-600',\n  'green-inverse':\n    'tw:bg-green-100 tw:text-green-900 tw:decoration-green-100 tw:[[data-theme=dark]_&]:bg-green-900 tw:[[data-theme=dark]_&]:text-green-200 tw:[[data-theme=dark]_&]:decoration-green-900',\n  blue: 'tw:bg-blue-500 tw:text-white tw:decoration-blue-500',\n  'blue-inverse':\n    'tw:bg-blue-100 tw:text-blue-800 tw:decoration-blue-100 tw:[[data-theme=dark]_&]:bg-blue-900 tw:[[data-theme=dark]_&]:text-blue-200 tw:[[data-theme=dark]_&]:decoration-blue-900',\n  red: 'tw:bg-error-500 tw:text-white tw:decoration-error-500',\n  orange: 'tw:bg-warning-500 tw:text-white tw:decoration-warning-500',\n  'orange-inverse':\n    'tw:bg-warning-100 tw:text-warning-800 tw:decoration-warning-100 tw:[[data-theme=dark]_&]:bg-warning-900 tw:[[data-theme=dark]_&]:text-warning-200 tw:[[data-theme=dark]_&]:decoration-warning-900',\n  amber: 'tw:bg-warning-300 tw:text-warning-800 tw:decoration-warning-300',\n  // One rung deeper than `orange-inverse` on both ends of the ramp, which is what\n  // keeps caution and warning telling apart — the two share the `warning` hue.\n  'amber-inverse':\n    'tw:bg-warning-200 tw:text-warning-800 tw:decoration-warning-200 tw:[[data-theme=dark]_&]:bg-warning-800 tw:[[data-theme=dark]_&]:text-warning-200 tw:[[data-theme=dark]_&]:decoration-warning-800',\n  teal: 'tw:bg-teal-500 tw:text-white tw:decoration-teal-500',\n  'teal-inverse':\n    'tw:bg-teal-100 tw:text-teal-800 tw:decoration-teal-100 tw:[[data-theme=dark]_&]:bg-teal-900 tw:[[data-theme=dark]_&]:text-teal-200 tw:[[data-theme=dark]_&]:decoration-teal-900',\n  purple: 'tw:bg-purple-500 tw:text-white tw:decoration-purple-500',\n  'purple-inverse':\n    'tw:bg-purple-100 tw:text-purple-800 tw:decoration-purple-100 tw:[[data-theme=dark]_&]:bg-purple-900 tw:[[data-theme=dark]_&]:text-purple-200 tw:[[data-theme=dark]_&]:decoration-purple-900',\n  cyan: 'tw:bg-cyan-500 tw:text-white tw:decoration-cyan-500',\n  'cyan-inverse':\n    'tw:bg-cyan-100 tw:text-cyan-800 tw:decoration-cyan-100 tw:[[data-theme=dark]_&]:bg-cyan-900 tw:[[data-theme=dark]_&]:text-cyan-200 tw:[[data-theme=dark]_&]:decoration-cyan-900',\n  'sidebar-primary': 'tw:bg-sidebar-primary tw:text-white tw:decoration-sidebar-primary',\n  white: 'tw:bg-white/90 tw:text-neutral-600 tw:decoration-white/90',\n} as const;\n\n/** A `Badge` `color` value. */\nexport type BadgeColor = keyof typeof badgeColors;\n\n/**\n * Whether a variant paints text on its own tint rather than on a solid fill.\n *\n * - Tinted variants are the ones held to WCAG-AA per `AGENTS.md`; solid `-500`\n *   fills are pinned across brands, so their contrast is recorded, not asserted.\n */\nexport const isTintedBadgeColor = (color: string): boolean => color.endsWith('-inverse');\n\nexport const badgeRootVariants = cva(\n  [\n    'tailwindcss-preflight',\n    'tw:group/badge',\n\n    // display\n    'tw:relative',\n    'tw:inline-flex',\n    'tw:justify-center',\n    'tw:items-center',\n    'tw:min-h-5',\n    'tw:h-fit',\n    'tw:shrink-0',\n    'tw:overflow-hidden',\n\n    // text — chrome weight/tracking are brand-overridable tokens\n    // (`--font-weight-medium` / `--letter-spacing-chrome`); casing lives on the\n    // `default` variant below via `tw:uppercase`.\n    'tw:whitespace-pre-wrap',\n    'tw:break-normal',\n    'tw:text-xs',\n    'tw:font-medium',\n    'tw:tracking-chrome',\n    'tw:text-center',\n    'tw:underline',\n\n    // content\n    'tw:border-none',\n    'tw:[&>svg]:self-center',\n    'tw:[button&]:cursor-pointer',\n\n    // focus\n    'tw:focus-visible:outline-hidden',\n    'tw:focus-visible:ring-2',\n    'tw:focus-visible:ring-inset',\n    'tw:focus-visible:ring-ring',\n  ],\n  {\n    defaultVariants: {\n      color: 'gray',\n      variant: 'default',\n    },\n    variants: {\n      variant: {\n        // Legacy chrome uppercases the default badge; the Keboola V2 brand\n        // (`data-brand=\"keboola\"`) renders it in standard case instead.\n        default: [\n          'tw:rounded tw:uppercase',\n          'tw:[[data-brand=keboola]_&]:normal-case tw:[[data-brand=keboola]_&]:tracking-normal',\n        ],\n        tag: ['tw:rounded tw:normal-case'],\n        pill: ['tw:min-w-5 tw:rounded-full tw:normal-case tw:tracking-normal'],\n      },\n      color: badgeColors,\n    },\n  },\n);\n","import type { ComponentProps } from 'react';\nimport { type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '../../utils';\n\nimport { badgeRootVariants } from './styles';\n\ntype Props = ComponentProps<'div'> & VariantProps<typeof badgeRootVariants>;\n\nexport const BadgeRoot = ({ ref, variant, color, className, children, ...rest }: Props) => (\n  <div\n    {...rest}\n    ref={ref}\n    data-slot=\"badge\"\n    className={cn(badgeRootVariants({ variant, color, className }))}\n  >\n    {children}\n  </div>\n);\n","import type { ComponentProps, ReactNode } from 'react';\n\nimport { BadgeAddon } from './BadgeAddon';\nimport { BadgeButton } from './BadgeButton';\nimport { BadgeLabel } from './BadgeLabel';\nimport { BadgeRoot } from './BadgeRoot';\n\ntype AddonVariant = ComponentProps<typeof BadgeAddon>['variant'];\ntype BadgeRootProps = ComponentProps<typeof BadgeRoot>;\ntype BadgeLabelProps = ComponentProps<typeof BadgeLabel>;\n\n/**\n * Props for `Badge`. `color` is a categorical contract (`green` = success, `red` = error, `orange` = warning,\n * `amber` = caution, `purple/cyan/teal/blue/gray` for decorative tags) — colours stay fixed across brand themes.\n * Pass `prefix` / `suffix` for icon-style addons.\n */\ntype Props = Pick<BadgeRootProps, 'variant' | 'color'> &\n  Omit<BadgeLabelProps, 'prefix'> & {\n    prefix?: ReactNode;\n    prefixVariant?: AddonVariant;\n    suffix?: ReactNode;\n    suffixVariant?: AddonVariant;\n    labelClassName?: string;\n  };\n\n/**\n * Compact status / category label rendered as an inline pill.\n *\n * **When to use:** encoding status (active, deprecated, beta), counts, or decorative tags next to a title\n * or in a table cell. The `color` prop is a semantic contract — `green` means success, `red` means error\n * etc., and colours are intentionally stable across customer brand themes.\n * **When NOT to use:** for an inline action use `Button` / `ButtonInline`; for a persistent contextual\n * banner use `Alert`; for a counter-only chip prefer `Badge` with just a numeric label.\n * **Composition:** drop into `PageHeader.Detail` `badges` slot, `Table.Cell`, or alongside titles in cards.\n * Use `Badge.Button` for an interactive (clickable) badge variant.\n */\nconst BadgeInner = ({\n  ref,\n  // root props\n  variant,\n  color,\n  // custom props\n  prefix,\n  prefixVariant = 'inline',\n  suffix,\n  suffixVariant = 'inline',\n  className,\n  labelClassName,\n  ...labelProps\n}: Props) => (\n  <BadgeRoot className={className} variant={variant} color={color}>\n    {prefix && (\n      <BadgeAddon align=\"inline-start\" variant={prefixVariant}>\n        {prefix}\n      </BadgeAddon>\n    )}\n    <BadgeLabel {...labelProps} ref={ref} className={labelClassName} />\n    {suffix && (\n      <BadgeAddon align=\"inline-end\" variant={suffixVariant}>\n        {suffix}\n      </BadgeAddon>\n    )}\n  </BadgeRoot>\n);\n\nexport const Badge = Object.assign(BadgeInner, {\n  Root: BadgeRoot,\n  Button: BadgeButton,\n  Label: BadgeLabel,\n  Addon: BadgeAddon,\n});\n"]}

package/dist/chunk-SC275NHZ.js

@@ -0,0 +1,407 @@
+import { Button } from './chunk-IXAYNBOY.js';
+import { useArgoDesign } from './chunk-WETKNYZX.js';
+import { cn } from './chunk-LXLIQ2D6.js';
+import { cva } from 'class-variance-authority';
+import { jsx } from 'react/jsx-runtime';
+import TextareaAutosize from 'react-textarea-autosize';
+
+var addonVariants = cva(
+  [
+    "tw:flex",
+    "tw:items-center",
+    "tw:gap-1",
+    // Default size for nested Lucide icons in prefix/suffix slots; callers can override on the icon.
+    "tw:[&_svg.lucide:not([class*='tw:size-'])]:size-4",
+    "tw:[&_svg]:shrink-0"
+  ],
+  {
+    defaultVariants: {
+      align: "inline-start"
+    },
+    variants: {
+      align: {
+        "inline-start": ["tw:order-first", "tw:[&:not(:empty)]:pl-4"],
+        "inline-end": ["tw:order-last", "tw:[&:not(:empty)]:pr-4"],
+        "block-start": [
+          "tw:order-first",
+          // `tw:w-full` needs to be empty-conditional too — when the addon
+          // has no content the root stays in flex-row, and a 100%-wide
+          // empty addon would claim half of the input row beside the input.
+          "tw:[&:not(:empty)]:w-full",
+          "tw:[&:not(:empty)]:px-4",
+          "tw:[&:not(:empty)]:py-1.5"
+        ],
+        "block-end": [
+          "tw:order-last",
+          "tw:[&:not(:empty)]:w-full",
+          "tw:[&:not(:empty)]:px-4",
+          "tw:[&:not(:empty)]:py-1.5"
+        ]
+      }
+    }
+  }
+);
+var InputGroupAddon = ({
+  children,
+  align = "inline-start",
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx("div", { ...props, "data-align": align, className: cn(addonVariants({ align, className })), children });
+var InputGroupButton = ({ ref, className, tabIndex = -1, ...props }) => /* @__PURE__ */ jsx(
+  Button,
+  {
+    ...props,
+    tabIndex,
+    ref,
+    variant: "invisible",
+    size: "icon-sm",
+    className: cn("tw:size-5", "tw:[&_svg]:text-muted-foreground", className)
+  }
+);
+var InputGroupInput = ({ ref, className, ...inputProps }) => /* @__PURE__ */ jsx(
+  "input",
+  {
+    ...inputProps,
+    ref,
+    className: cn(
+      "tw:w-full",
+      "tw:bg-transparent",
+      "tw:outline-hidden",
+      // font
+      "tw:font-sans",
+      "tw:text-sm",
+      // placeholder
+      "tw:placeholder:text-neutral-400",
+      "tw:placeholder:font-normal",
+      // disabled
+      "tw:disabled:cursor-not-allowed",
+      className
+    )
+  }
+);
+var InputGroupText = ({ className, ...props }) => /* @__PURE__ */ jsx(
+  "span",
+  {
+    className: cn(
+      "tw:flex",
+      "tw:items-center",
+      "tw:gap-2",
+      "tw:text-sm",
+      "tw:text-muted-foreground",
+      "tw:[&_svg]:pointer-events-none",
+      'tw:[&_svg:not([class*="tw:size-"])]:size-4',
+      className
+    ),
+    ...props
+  }
+);
+var InputGroupTextArea = ({
+  ref,
+  className,
+  onChange,
+  onValueChange,
+  value,
+  defaultValue,
+  onBlur,
+  onValueBlur,
+  disableResize = false,
+  minRows = 1,
+  maxRows = 4,
+  ...props
+}) => {
+  const handleChange = (event) => {
+    onValueChange?.(event.target.value);
+    onChange?.(event);
+  };
+  const handleBlur = (event) => {
+    onValueBlur?.(event.target.value);
+    onBlur?.(event);
+  };
+  return /* @__PURE__ */ jsx(
+    TextareaAutosize,
+    {
+      ...props,
+      ref,
+      value: value ?? void 0,
+      defaultValue: defaultValue ?? void 0,
+      onChange: handleChange,
+      onBlur: handleBlur,
+      minRows,
+      maxRows: maxRows === "unlimited" ? void 0 : maxRows,
+      className: cn(
+        "tw:w-full",
+        "tw:bg-transparent",
+        "tw:outline-hidden",
+        "tw:px-4",
+        // font
+        "tw:font-sans",
+        "tw:text-sm",
+        // placeholder
+        "tw:placeholder:text-neutral-400",
+        "tw:placeholder:font-normal",
+        // disabled
+        "tw:disabled:cursor-not-allowed",
+        {
+          "tw:resize-none": disableResize
+        },
+        className
+      )
+    }
+  );
+};
+var inputGroupVariants = cva(
+  [
+    "tailwindcss-preflight",
+    "tw:group",
+    "tw:overflow-hidden",
+    "tw:box-border",
+    // positioning
+    "tw:flex",
+    "tw:items-center",
+    // base — legacy (non-argo) chrome uses a fixed radius; argo overrides it with
+    // the brand radius token in the `argo` variant below.
+    "tw:rounded",
+    "tw:border",
+    "tw:border-solid",
+    // `border-input` rather than the fixed `neutral-200` — same light-scheme
+    // grey, but it follows the dark scheme too. The base text stays pinned:
+    // `secondary` and the readonly state below both fill with a fixed light
+    // grey, so a scheme-following text colour would go light-on-light there.
+    // `primary` opts into the token itself (and re-pins its readonly fill).
+    "tw:border-input",
+    "tw:text-neutral-800",
+    "tw:transition",
+    // focus
+    "tw:has-[:is(input,textarea):focus]:ring-4",
+    // readonly
+    "tw:has-[:is(input,textarea)[readonly]]:bg-neutral-150",
+    "tw:has-[:is(input,textarea)[readonly]]:focus-within:ring-0",
+    "tw:has-[:is(input,textarea)[readonly]]:border-neutral-150",
+    // disabled cursor (opacity owned by variant)
+    "tw:has-[:is(input,textarea):disabled]:cursor-not-allowed",
+    // textarea: top-align addons, allow vertical expansion, own its y-padding
+    "tw:has-[textarea]:items-start",
+    "tw:has-[[data-align=block-start]:not(:empty)]:flex-wrap",
+    "tw:has-[[data-align=block-end]:not(:empty)]:flex-wrap",
+    "tw:[&>input]:has-[[data-align=block-start]:not(:empty)]:w-auto",
+    "tw:[&>input]:has-[[data-align=block-start]:not(:empty)]:flex-1",
+    "tw:[&>input]:has-[[data-align=block-end]:not(:empty)]:w-auto",
+    "tw:[&>input]:has-[[data-align=block-end]:not(:empty)]:flex-1",
+    "tw:[&>input]:px-4",
+    "tw:[&>input]:has-[[data-align=inline-start]:not(:empty)]:pl-2",
+    "tw:[&>input]:has-[[data-align=inline-end]:not(:empty)]:pr-2"
+  ],
+  {
+    defaultVariants: {
+      variant: "primary",
+      state: "default",
+      sizing: "medium",
+      focusVariant: "default"
+    },
+    compoundVariants: [
+      {
+        variant: "secondary",
+        state: "error",
+        className: ["tw:bg-error-100"]
+      },
+      {
+        variant: "secondary",
+        state: "warning",
+        className: ["tw:bg-warning-100"]
+      },
+      {
+        variant: "primary",
+        state: "default",
+        focusVariant: "off",
+        className: ["tw:has-[:is(input,textarea):focus]:border-neutral-200"]
+      },
+      {
+        variant: "secondary",
+        state: "default",
+        focusVariant: "off",
+        className: ["tw:has-[:is(input,textarea):focus]:border-neutral-100"]
+      },
+      {
+        variant: ["primary", "secondary"],
+        state: "error",
+        focusVariant: "on",
+        className: ["tw:!border-error-500", "tw:!ring-error-200"]
+      },
+      {
+        variant: ["primary", "secondary"],
+        state: "warning",
+        focusVariant: "on",
+        className: ["tw:!border-warning-500", "tw:!ring-warning-200"]
+      },
+      // --- argo ---
+      {
+        variant: "argo",
+        state: "default",
+        className: [
+          "tw:has-[:is(input,textarea):focus]:border-primary",
+          "tw:has-[:is(input,textarea):focus]:ring-ring/50"
+        ]
+      },
+      {
+        variant: "argo",
+        state: "error",
+        className: [
+          "tw:border-destructive",
+          "tw:has-[:is(input,textarea):focus]:border-destructive",
+          "tw:has-[:is(input,textarea):focus]:ring-destructive/20"
+        ]
+      },
+      {
+        variant: "argo",
+        focusVariant: "on",
+        className: ["tw:!border-primary", "tw:!ring-ring/50"]
+      },
+      {
+        variant: "argo",
+        state: "error",
+        focusVariant: "on",
+        className: ["tw:!border-destructive", "tw:!ring-destructive/20"]
+      },
+      {
+        variant: "argo",
+        state: "default",
+        focusVariant: "off",
+        className: ["tw:has-[:is(input,textarea):focus]:border-input"]
+      }
+    ],
+    variants: {
+      focusVariant: {
+        default: [],
+        on: ["tw:!border-ring", "tw:!ring-ring/30", "tw:!ring-4"],
+        off: ["tw:has-[:is(input,textarea):focus]:!ring-0"]
+      },
+      variant: {
+        primary: [
+          // The field-surface token — white in the light scheme, so this is a
+          // no-op there; the dark scheme gets a field fill, not a white slab.
+          "tw:bg-input-background",
+          "tw:text-foreground",
+          // The base readonly fill is a fixed light grey, which the scheme-following
+          // text above would sit on invisibly in dark. Re-pin to the same
+          // `muted`/`input` pair argo uses for exactly this reason.
+          "tw:has-[:is(input,textarea)[readonly]]:bg-muted",
+          "tw:has-[:is(input,textarea)[readonly]]:border-input",
+          "tw:has-[:is(input,textarea):disabled]:opacity-40",
+          // aria-invalid on the control surfaces the error chrome without a `state` prop — the
+          // accessible path (mirrors the `state="error"` legacy tokens). Higher specificity than
+          // the default focus selector, so it wins without `!important`.
+          "tw:has-[:is(input,textarea)[aria-invalid=true]]:border-error-500",
+          "tw:has-[:is(input,textarea)[aria-invalid=true]:focus]:border-error-500",
+          "tw:has-[:is(input,textarea)[aria-invalid=true]:focus]:ring-error-200"
+        ],
+        secondary: [
+          "tw:bg-neutral-100",
+          "tw:border-neutral-100",
+          "tw:has-[:is(input,textarea):disabled]:opacity-40",
+          "tw:has-[:is(input,textarea)[aria-invalid=true]]:border-error-500",
+          "tw:has-[:is(input,textarea)[aria-invalid=true]:focus]:border-error-500",
+          "tw:has-[:is(input,textarea)[aria-invalid=true]:focus]:ring-error-200"
+        ],
+        argo: [
+          // argo follows the brand radius token (overrides the static base)
+          "tw:rounded-[var(--radius-lg,0.25rem)]",
+          // muted filled input surface — gray, distinct from white containers; not the app-background token.
+          // Deliberately `muted`, not the `input-background` field token legacy uses: argo's field is a
+          // grey inset by design. Converging the two is a brand-value decision, not a component one.
+          "tw:bg-muted",
+          "tw:border-input",
+          "tw:text-foreground",
+          "tw:has-[:is(input,textarea):disabled]:opacity-50",
+          // readonly: keep the themed input surface/border. The base layer's fixed
+          // `neutral-150` (a light grey) is correct for the legacy light chrome but
+          // collides with argo's themed `foreground` text — light-on-light, invisible
+          // in dark mode. Re-pin to the same `muted`/`input` tokens the editable argo
+          // input uses (validated AA), so readonly stays legible in every scheme.
+          "tw:has-[:is(input,textarea)[readonly]]:bg-muted",
+          "tw:has-[:is(input,textarea)[readonly]]:border-input",
+          // higher specificity than has-[:is(input,textarea):focus] — prevents focus border on readonly
+          "tw:has-[:is(input,textarea)[readonly]:focus]:border-input",
+          // aria-invalid on the control surfaces the error chrome without a `state` prop — the
+          // accessible path (uses the themeable `destructive` status token).
+          "tw:has-[:is(input,textarea)[aria-invalid=true]]:border-destructive",
+          "tw:has-[:is(input,textarea)[aria-invalid=true]:focus]:border-destructive",
+          "tw:has-[:is(input,textarea)[aria-invalid=true]:focus]:ring-destructive/20"
+        ]
+      },
+      sizing: {
+        default: [
+          "tw:[&>:is(input,textarea)]:py-2.5",
+          "tw:[&>:is(input,textarea)]:leading-[18px]",
+          "tw:[&>textarea]:!min-h-[calc(2.5rem-2px)]"
+        ],
+        small: [
+          "tw:[&>:is(input,textarea)]:py-2",
+          "tw:[&>:is(input,textarea)]:leading-[16px]",
+          "tw:[&>textarea]:!min-h-[calc(2rem-2px)]"
+        ],
+        medium: [
+          "tw:[&>:is(input,textarea)]:py-2",
+          "tw:[&>:is(input,textarea)]:leading-[18px]",
+          "tw:[&>textarea]:!min-h-[calc(2.25rem-2px)]"
+        ]
+      },
+      state: {
+        default: [
+          "tw:has-[:is(input,textarea):focus]:border-ring",
+          "tw:has-[:is(input,textarea):focus]:ring-ring/30"
+        ],
+        error: [
+          "tw:border-error-500",
+          "tw:has-[:is(input,textarea):focus]:border-error-500",
+          "tw:has-[:is(input,textarea):focus]:ring-error-200"
+        ],
+        warning: [
+          "tw:border-warning-500",
+          "tw:has-[:is(input,textarea):focus]:border-warning-500",
+          "tw:has-[:is(input,textarea):focus]:ring-warning-200"
+        ]
+      }
+    }
+  }
+);
+var InputGroupRoot = ({
+  ref,
+  children,
+  state,
+  variant,
+  sizing,
+  focusVariant,
+  className,
+  ...props
+}) => {
+  const isArgo = useArgoDesign();
+  const effectiveVariant = isArgo ? "argo" : variant;
+  const effectiveSizing = effectiveVariant === "argo" ? "medium" : sizing;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...props,
+      ref,
+      className: cn(
+        inputGroupVariants({
+          state,
+          variant: effectiveVariant,
+          sizing: effectiveSizing,
+          focusVariant,
+          className
+        })
+      ),
+      children
+    }
+  );
+};
+var InputGroup = InputGroupRoot;
+InputGroup.Input = InputGroupInput;
+InputGroup.Addon = InputGroupAddon;
+InputGroup.Button = InputGroupButton;
+InputGroup.TextArea = InputGroupTextArea;
+InputGroup.Text = InputGroupText;
+
+export { InputGroup };
+//# sourceMappingURL=chunk-SC275NHZ.js.map
+//# sourceMappingURL=chunk-SC275NHZ.js.map