@keboola/design 10.1.0 → 11.0.0

package/dist/chunk-RUTPQNLR.js

@@ -0,0 +1,266 @@
+import { Label } from './chunk-S6TAF63G.js';
+import { Check, Copy, Eye, EyeOff } from './chunk-RQVK4IYC.js';
+import { Tooltip, copyToClipboard } from './chunk-SWQFYNYG.js';
+import { cn } from './chunk-LXLIQ2D6.js';
+import { createContext, useEffect, useState, useRef, useId, useCallback, useMemo, use } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var CopyContext = createContext(null);
+var useCopyContext = () => {
+  const ctx = use(CopyContext);
+  if (!ctx) throw new Error("CopyField.* components must be used within a CopyField.Root");
+  return ctx;
+};
+var LINE_HEIGHT_REM = 1.25;
+var VERTICAL_PADDING_REM = 1.25;
+var COPY_HINT_DELAY_MS = 2e3;
+var CopyBox = ({ className, children }) => {
+  const { copied, handleCopy, mono, minLines, maxLines, boxId, labelId, hasLabel, hoverHint } = useCopyContext();
+  const multiline = maxLines > 1;
+  const multilineStyle = multiline ? {
+    minHeight: `${minLines * LINE_HEIGHT_REM + VERTICAL_PADDING_REM}rem`,
+    maxHeight: `${maxLines * LINE_HEIGHT_REM + VERTICAL_PADDING_REM}rem`
+  } : void 0;
+  const handleKeyDown = (event) => {
+    if (event.target !== event.currentTarget) return;
+    if (event.key !== "Enter" && event.key !== " ") return;
+    event.preventDefault();
+    handleCopy();
+  };
+  return /* @__PURE__ */ jsx(
+    Tooltip,
+    {
+      triggerAsChild: true,
+      placement: "top",
+      tooltip: copied ? "Copied" : hoverHint ? "Copy" : null,
+      forceShow: copied,
+      delayDuration: COPY_HINT_DELAY_MS,
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          role: "button",
+          tabIndex: 0,
+          id: boxId,
+          "aria-labelledby": hasLabel ? labelId : void 0,
+          onClick: handleCopy,
+          onKeyDown: handleKeyDown,
+          style: multilineStyle,
+          className: cn(
+            "tw:group tw:relative tw:flex tw:w-fit tw:max-w-full tw:cursor-pointer tw:gap-2 tw:rounded-2xl tw:[corner-shape:superellipse(2)] tw:border tw:border-border tw:bg-card tw:px-3 tw:py-2.5 tw:text-left tw:shadow-sm tw:transition-colors tw:hover:bg-muted",
+            multiline ? "tw:items-start tw:overflow-auto" : "tw:items-center tw:overflow-hidden",
+            mono && "tw:font-mono tw:text-[13px]",
+            className
+          ),
+          children
+        }
+      )
+    }
+  );
+};
+var CopyButton = ({ className }) => {
+  const { copied, maxLines } = useCopyContext();
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      "aria-hidden": true,
+      className: cn(
+        "tw:pointer-events-none tw:flex tw:shrink-0 tw:items-center tw:text-muted-foreground tw:group-hover:text-foreground",
+        maxLines > 1 && "tw:self-start tw:pt-0.5",
+        className
+      ),
+      children: copied ? /* @__PURE__ */ jsx(Check, { className: "tw:size-4" }) : /* @__PURE__ */ jsx(Copy, { className: "tw:size-4" })
+    }
+  );
+};
+var CopyChildren = ({ children, className }) => {
+  const { maxLines } = useCopyContext();
+  const multiline = maxLines > 1;
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cn(
+        "tw:min-w-0 tw:flex-1 tw:select-text tw:text-card-foreground",
+        multiline ? "tw:whitespace-pre-wrap tw:break-words" : "tw:truncate",
+        className
+      ),
+      children
+    }
+  );
+};
+var CopyFooter = ({ children, className }) => {
+  if (!children) return null;
+  return /* @__PURE__ */ jsx("p", { className: cn("tw:m-0 tw:text-xs tw:text-muted-foreground", className), children });
+};
+var MASK = "*".repeat(12);
+var CopyHidden = ({ children, revealable = true, className }) => {
+  const { hidden, registerRevealable } = useCopyContext();
+  useEffect(() => {
+    if (!revealable) return void 0;
+    return registerRevealable();
+  }, [revealable, registerRevealable]);
+  const masked = revealable ? hidden : true;
+  return /* @__PURE__ */ jsx("span", { className: cn("tw:select-none", className), children: masked ? MASK : children });
+};
+var CopyLabel = ({ children, leading, trailing, className }) => {
+  const { labelId, registerLabel } = useCopyContext();
+  useEffect(() => registerLabel(), [registerLabel]);
+  return /* @__PURE__ */ jsxs("div", { className: cn("tw:flex tw:items-center tw:gap-1", className), children: [
+    /* @__PURE__ */ jsx(Label, { id: labelId, children }),
+    leading,
+    trailing != null && /* @__PURE__ */ jsx("span", { className: "tw:ml-auto tw:flex tw:items-center", children: trailing })
+  ] });
+};
+var CopyPrefix = ({ children, className }) => /* @__PURE__ */ jsx(
+  "span",
+  {
+    "aria-hidden": true,
+    className: cn(
+      "tw:shrink-0 tw:select-none tw:self-stretch tw:border-r tw:border-border tw:pr-2 tw:text-muted-foreground",
+      className
+    ),
+    children
+  }
+);
+var CopyReveal = ({ className }) => {
+  const { hidden, toggleHidden, hasRevealable, maxLines } = useCopyContext();
+  if (!hasRevealable) return null;
+  const handleClick = (event) => {
+    event.stopPropagation();
+    toggleHidden();
+  };
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      onClick: handleClick,
+      "aria-label": hidden ? "Show value" : "Hide value",
+      className: cn(
+        "tw:flex tw:shrink-0 tw:items-center tw:text-muted-foreground tw:hover:text-foreground",
+        maxLines > 1 && "tw:self-start tw:pt-0.5",
+        className
+      ),
+      children: hidden ? /* @__PURE__ */ jsx(Eye, { className: "tw:size-4" }) : /* @__PURE__ */ jsx(EyeOff, { className: "tw:size-4" })
+    }
+  );
+};
+var CopyRoot = ({
+  value,
+  mono = false,
+  onCopy,
+  hiddenByDefault = false,
+  minLines = 1,
+  maxLines,
+  hoverHint = true,
+  className,
+  children
+}) => {
+  const [copied, setCopied] = useState(false);
+  const [hidden, setHidden] = useState(hiddenByDefault);
+  const [revealableCount, setRevealableCount] = useState(0);
+  const [labelCount, setLabelCount] = useState(0);
+  const resetTimerRef = useRef(void 0);
+  const generatedId = useId();
+  const labelId = `${generatedId}-label`;
+  const boxId = `${generatedId}-box`;
+  useEffect(() => () => clearTimeout(resetTimerRef.current), []);
+  const handleCopy = useCallback(() => {
+    const selection = window.getSelection();
+    const boxEl = document.getElementById(boxId);
+    if (selection && !selection.isCollapsed && selection.anchorNode && boxEl?.contains(selection.anchorNode)) {
+      return;
+    }
+    copyToClipboard(value).then(() => {
+      onCopy?.();
+      setCopied(true);
+      clearTimeout(resetTimerRef.current);
+      resetTimerRef.current = setTimeout(() => setCopied(false), 1500);
+    }).catch((error) => {
+      console.error("Copy to clipboard failed", error);
+    });
+  }, [value, onCopy, boxId]);
+  const toggleHidden = useCallback(() => setHidden((prev) => !prev), []);
+  const registerRevealable = useCallback(() => {
+    setRevealableCount((count) => count + 1);
+    return () => setRevealableCount((count) => count - 1);
+  }, []);
+  const registerLabel = useCallback(() => {
+    setLabelCount((count) => count + 1);
+    return () => setLabelCount((count) => count - 1);
+  }, []);
+  const contextValue = useMemo(
+    () => ({
+      copied,
+      handleCopy,
+      value,
+      mono,
+      hidden,
+      toggleHidden,
+      registerRevealable,
+      hasRevealable: revealableCount > 0,
+      registerLabel,
+      hasLabel: labelCount > 0,
+      minLines,
+      maxLines: maxLines ?? minLines,
+      hoverHint,
+      labelId,
+      boxId
+    }),
+    [
+      copied,
+      handleCopy,
+      value,
+      mono,
+      hidden,
+      toggleHidden,
+      registerRevealable,
+      revealableCount,
+      registerLabel,
+      labelCount,
+      minLines,
+      maxLines,
+      hoverHint,
+      labelId,
+      boxId
+    ]
+  );
+  return /* @__PURE__ */ jsx(CopyContext, { value: contextValue, children: /* @__PURE__ */ jsx("div", { className: cn("tw:flex tw:w-fit tw:max-w-full tw:flex-col tw:gap-1", className), children }) });
+};
+var CopySuffix = ({ children, className }) => /* @__PURE__ */ jsx(
+  "span",
+  {
+    "aria-hidden": true,
+    className: cn(
+      "tw:shrink-0 tw:select-none tw:self-stretch tw:border-l tw:border-border tw:pl-2 tw:text-muted-foreground",
+      className
+    ),
+    children
+  }
+);
+
+// src/blocks/CopyField/CopyField.tsx
+var CopyField = {
+  /** Container. Owns the copied `value`, mask state, and copy context. */
+  Root: CopyRoot,
+  /** Visible label above the box, with optional `leading`/`trailing` slots. */
+  Label: CopyLabel,
+  /** The clickable copy target row. */
+  Box: CopyBox,
+  /** Muted, non-selectable prefix addon (not copied). */
+  Prefix: CopyPrefix,
+  /** Displayed value (truncates single-line, wraps multi-line). */
+  Children: CopyChildren,
+  /** Muted, non-selectable suffix addon (not copied). */
+  Suffix: CopySuffix,
+  /** Masks its children with dots; copy still copies the real value. */
+  Hidden: CopyHidden,
+  /** Eye toggle that reveals/masks revealable `CopyField.Hidden` content. */
+  Reveal: CopyReveal,
+  /** Copy affordance icon — shows Copy/Check with feedback. */
+  Button: CopyButton,
+  /** Small helper text below the box. */
+  Footer: CopyFooter
+};
+
+export { CopyField };
+//# sourceMappingURL=chunk-RUTPQNLR.js.map
+//# sourceMappingURL=chunk-RUTPQNLR.js.map

package/dist/chunk-RUTPQNLR.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/blocks/CopyField/CopyContext.tsx","../src/blocks/CopyField/CopyBox.tsx","../src/blocks/CopyField/CopyButton.tsx","../src/blocks/CopyField/CopyChildren.tsx","../src/blocks/CopyField/CopyFooter.tsx","../src/blocks/CopyField/CopyHidden.tsx","../src/blocks/CopyField/CopyLabel.tsx","../src/blocks/CopyField/CopyPrefix.tsx","../src/blocks/CopyField/CopyReveal.tsx","../src/blocks/CopyField/CopyRoot.tsx","../src/blocks/CopyField/CopySuffix.tsx","../src/blocks/CopyField/CopyField.tsx"],"names":["jsx","useEffect"],"mappings":"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","file":"chunk-RUTPQNLR.js","sourcesContent":["import { createContext, use } from 'react';\n\ntype CopyContextValue = {\n  /** Whether a copy just happened (drives the Copy → Check feedback for ~1.5s). */\n  copied: boolean;\n  /** Copies the real `value` to the clipboard, guarded against drag-select. */\n  handleCopy: () => void;\n  /** The real value copied to the clipboard, regardless of masking. */\n  value: string;\n  /** Render displayed content in monospace/code style. */\n  mono: boolean;\n  /** Whether to show the \"Copy\" hint tooltip on hover (else only \"Copied\" on copy). */\n  hoverHint: boolean;\n  /** Whether revealable `CopyField.Hidden` content is currently masked. */\n  hidden: boolean;\n  /** Toggles the masked ↔ revealed state. */\n  toggleHidden: () => void;\n  /**\n   * Registers a revealable `CopyField.Hidden` so `CopyField.Reveal` knows to render.\n   * Returns a cleanup that unregisters on unmount.\n   */\n  registerRevealable: () => () => void;\n  /** True once at least one revealable `CopyField.Hidden` is mounted. */\n  hasRevealable: boolean;\n  /**\n   * Registers the visible `CopyField.Label` so `CopyField.Box` only points `aria-labelledby`\n   * at it when a label actually exists. Returns a cleanup that unregisters on unmount.\n   */\n  registerLabel: () => () => void;\n  /** True once a `CopyField.Label` is mounted. */\n  hasLabel: boolean;\n  /** Minimum number of visible text lines for a multi-line box. */\n  minLines: number;\n  /** Maximum number of visible text lines before the box scrolls. */\n  maxLines: number;\n  /** Stable id of the visible label element (for `aria-labelledby`). */\n  labelId: string;\n  /** Stable id of the clickable box element. */\n  boxId: string;\n};\n\nexport const CopyContext = createContext<CopyContextValue | null>(null);\n\nexport const useCopyContext = () => {\n  const ctx = use(CopyContext);\n  if (!ctx) throw new Error('CopyField.* components must be used within a CopyField.Root');\n  return ctx;\n};\n","import type { CSSProperties, KeyboardEvent, ReactNode } from 'react';\n\nimport { Tooltip } from '../../components/Tooltip';\nimport { cn } from '../../utils';\n\nimport { useCopyContext } from './CopyContext';\n\ntype CopyBoxProps = {\n  /** Additional CSS classes on the box. */\n  className?: string;\n  children: ReactNode;\n};\n\nconst LINE_HEIGHT_REM = 1.25;\nconst VERTICAL_PADDING_REM = 1.25;\n\n// Long delay — the hover \"Copy\" hint doesn't really help UX, it just pulls focus.\nconst COPY_HINT_DELAY_MS = 2000;\n\n/**\n * The clickable copy target. Click anywhere to copy; text stays drag-selectable.\n *\n * Rendered as a `role=\"button\"` div (not a native `<button>`) so it can host\n * genuinely interactive children like `CopyField.Reveal` — nesting a `<button>`\n * inside a `<button>` is invalid HTML.\n */\nexport const CopyBox = ({ className, children }: CopyBoxProps) => {\n  const { copied, handleCopy, mono, minLines, maxLines, boxId, labelId, hasLabel, hoverHint } =\n    useCopyContext();\n\n  const multiline = maxLines > 1;\n  const multilineStyle: CSSProperties | undefined = multiline\n    ? {\n        minHeight: `${minLines * LINE_HEIGHT_REM + VERTICAL_PADDING_REM}rem`,\n        maxHeight: `${maxLines * LINE_HEIGHT_REM + VERTICAL_PADDING_REM}rem`,\n      }\n    : undefined;\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (event.target !== event.currentTarget) return;\n    if (event.key !== 'Enter' && event.key !== ' ') return;\n    event.preventDefault();\n    handleCopy();\n  };\n\n  return (\n    <Tooltip\n      triggerAsChild\n      placement=\"top\"\n      tooltip={copied ? 'Copied' : hoverHint ? 'Copy' : null}\n      forceShow={copied}\n      delayDuration={COPY_HINT_DELAY_MS}\n    >\n      <div\n        role=\"button\"\n        tabIndex={0}\n        id={boxId}\n        aria-labelledby={hasLabel ? labelId : undefined}\n        onClick={handleCopy}\n        onKeyDown={handleKeyDown}\n        style={multilineStyle}\n        className={cn(\n          'tw:group tw:relative tw:flex tw:w-fit tw:max-w-full tw:cursor-pointer tw:gap-2 tw:rounded-2xl tw:[corner-shape:superellipse(2)] tw:border tw:border-border tw:bg-card tw:px-3 tw:py-2.5 tw:text-left tw:shadow-sm tw:transition-colors tw:hover:bg-muted',\n          multiline ? 'tw:items-start tw:overflow-auto' : 'tw:items-center tw:overflow-hidden',\n          mono && 'tw:font-mono tw:text-[13px]',\n          className,\n        )}\n      >\n        {children}\n      </div>\n    </Tooltip>\n  );\n};\n","import { Check, Copy as CopyIcon } from '../../icons';\nimport { cn } from '../../utils';\n\nimport { useCopyContext } from './CopyContext';\n\ntype CopyButtonProps = {\n  className?: string;\n};\n\n/** Copy affordance icon — shows Copy/Check with feedback. */\nexport const CopyButton = ({ className }: CopyButtonProps) => {\n  const { copied, maxLines } = useCopyContext();\n\n  return (\n    <span\n      aria-hidden\n      className={cn(\n        'tw:pointer-events-none tw:flex tw:shrink-0 tw:items-center tw:text-muted-foreground tw:group-hover:text-foreground',\n        maxLines > 1 && 'tw:self-start tw:pt-0.5',\n        className,\n      )}\n    >\n      {copied ? <Check className=\"tw:size-4\" /> : <CopyIcon className=\"tw:size-4\" />}\n    </span>\n  );\n};\n","import type { ReactNode } from 'react';\n\nimport { cn } from '../../utils';\n\nimport { useCopyContext } from './CopyContext';\n\ntype CopyChildrenProps = {\n  children: ReactNode;\n  className?: string;\n};\n\n/** The displayed value. Truncates on a single line, wraps when multi-line. */\nexport const CopyChildren = ({ children, className }: CopyChildrenProps) => {\n  const { maxLines } = useCopyContext();\n  const multiline = maxLines > 1;\n\n  return (\n    <span\n      className={cn(\n        'tw:min-w-0 tw:flex-1 tw:select-text tw:text-card-foreground',\n        multiline ? 'tw:whitespace-pre-wrap tw:break-words' : 'tw:truncate',\n        className,\n      )}\n    >\n      {children}\n    </span>\n  );\n};\n","import type { ReactNode } from 'react';\n\nimport { cn } from '../../utils';\n\ntype CopyFooterProps = {\n  children: ReactNode;\n  className?: string;\n};\n\n/** Small helper text below the box (mirrors `FormGroup.Help` / `HelpBlock` styling). */\nexport const CopyFooter = ({ children, className }: CopyFooterProps) => {\n  if (!children) return null;\n\n  return <p className={cn('tw:m-0 tw:text-xs tw:text-muted-foreground', className)}>{children}</p>;\n};\n","import { useEffect } from 'react';\nimport type { ReactNode } from 'react';\n\nimport { cn } from '../../utils';\n\nimport { useCopyContext } from './CopyContext';\n\ntype CopyHiddenProps = {\n  children: ReactNode;\n  /**\n   * When true (default), `CopyField.Reveal` can unmask this content. When false the\n   * content is always masked (e.g. an implicit token inside a longer string).\n   */\n  revealable?: boolean;\n  className?: string;\n};\n\nconst MASK = '*'.repeat(12);\n\n/**\n * Masks its children with asterisks. The real value still lives on `CopyField.Root`,\n * so copy always copies the real value regardless of mask state.\n */\nexport const CopyHidden = ({ children, revealable = true, className }: CopyHiddenProps) => {\n  const { hidden, registerRevealable } = useCopyContext();\n\n  useEffect(() => {\n    if (!revealable) return undefined;\n    return registerRevealable();\n  }, [revealable, registerRevealable]);\n\n  const masked = revealable ? hidden : true;\n\n  return <span className={cn('tw:select-none', className)}>{masked ? MASK : children}</span>;\n};\n","import { useEffect } from 'react';\nimport type { ReactNode } from 'react';\n\nimport { Label } from '../../components/Label';\nimport { cn } from '../../utils';\n\nimport { useCopyContext } from './CopyContext';\n\ntype CopyLabelProps = {\n  children: ReactNode;\n  /** Content rendered right after the label text (e.g. an Info tooltip button). */\n  leading?: ReactNode;\n  /** Content pushed to the trailing edge of the row (e.g. a Switch). */\n  trailing?: ReactNode;\n  className?: string;\n};\n\n/**\n * Visible label above the box. The label carries an id and the box is wired via\n * `aria-labelledby` (not `htmlFor`, which would turn label clicks into a copy).\n *\n * Row layout: label text, then `leading` (gap), then `trailing` pushed to the far\n * edge with the space between them growing.\n */\nexport const CopyLabel = ({ children, leading, trailing, className }: CopyLabelProps) => {\n  const { labelId, registerLabel } = useCopyContext();\n\n  useEffect(() => registerLabel(), [registerLabel]);\n\n  return (\n    <div className={cn('tw:flex tw:items-center tw:gap-1', className)}>\n      <Label id={labelId}>{children}</Label>\n      {leading}\n      {trailing != null && <span className=\"tw:ml-auto tw:flex tw:items-center\">{trailing}</span>}\n    </div>\n  );\n};\n","import type { ReactNode } from 'react';\n\nimport { cn } from '../../utils';\n\ntype CopyAddonProps = {\n  children: ReactNode;\n  className?: string;\n};\n\n/** Muted, non-selectable prefix addon with a trailing divider (not part of the copied value). */\nexport const CopyPrefix = ({ children, className }: CopyAddonProps) => (\n  <span\n    aria-hidden\n    className={cn(\n      'tw:shrink-0 tw:select-none tw:self-stretch tw:border-r tw:border-border tw:pr-2 tw:text-muted-foreground',\n      className,\n    )}\n  >\n    {children}\n  </span>\n);\n","import type { MouseEvent } from 'react';\n\nimport { Eye, EyeOff } from '../../icons';\nimport { cn } from '../../utils';\n\nimport { useCopyContext } from './CopyContext';\n\ntype CopyRevealProps = {\n  className?: string;\n};\n\n/** Eye toggle that reveals/masks `CopyField.Hidden` content. Renders nothing without revealable content. */\nexport const CopyReveal = ({ className }: CopyRevealProps) => {\n  const { hidden, toggleHidden, hasRevealable, maxLines } = useCopyContext();\n\n  if (!hasRevealable) return null;\n\n  const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n    event.stopPropagation();\n    toggleHidden();\n  };\n\n  return (\n    <button\n      type=\"button\"\n      onClick={handleClick}\n      aria-label={hidden ? 'Show value' : 'Hide value'}\n      className={cn(\n        'tw:flex tw:shrink-0 tw:items-center tw:text-muted-foreground tw:hover:text-foreground',\n        maxLines > 1 && 'tw:self-start tw:pt-0.5',\n        className,\n      )}\n    >\n      {hidden ? <Eye className=\"tw:size-4\" /> : <EyeOff className=\"tw:size-4\" />}\n    </button>\n  );\n};\n","import { useCallback, useEffect, useId, useMemo, useRef, useState } from 'react';\nimport type { ReactNode } from 'react';\n\nimport { cn, copyToClipboard } from '../../utils';\n\nimport { CopyContext } from './CopyContext';\n\ntype CopyRootProps = {\n  /** The value copied to the clipboard on click. */\n  value: string;\n  /** Render displayed content in monospace/code style. */\n  mono?: boolean;\n  /** Callback fired after a successful copy. */\n  onCopy?: () => void;\n  /** Start with revealable `CopyField.Hidden` content masked. */\n  hiddenByDefault?: boolean;\n  /** Minimum number of visible text lines for a multi-line box. */\n  minLines?: number;\n  /** Maximum number of visible text lines before the box scrolls. */\n  maxLines?: number;\n  /** Show the \"Copy\" hover hint (set `false` to only show \"Copied\" on copy). Defaults to `true`. */\n  hoverHint?: boolean;\n  /** Additional CSS classes on the outer container. */\n  className?: string;\n  children: ReactNode;\n};\n\n/**\n * Container for the Copy block. Owns the copied `value`, copy/mask state, and the\n * shared context consumed by `CopyField.Box`, `CopyField.Reveal`, `CopyField.Button`, etc.\n */\nexport const CopyRoot = ({\n  value,\n  mono = false,\n  onCopy,\n  hiddenByDefault = false,\n  minLines = 1,\n  maxLines,\n  hoverHint = true,\n  className,\n  children,\n}: CopyRootProps) => {\n  const [copied, setCopied] = useState(false);\n  const [hidden, setHidden] = useState(hiddenByDefault);\n  const [revealableCount, setRevealableCount] = useState(0);\n  const [labelCount, setLabelCount] = useState(0);\n  const resetTimerRef = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n\n  const generatedId = useId();\n  const labelId = `${generatedId}-label`;\n  const boxId = `${generatedId}-box`;\n\n  useEffect(() => () => clearTimeout(resetTimerRef.current), []);\n\n  const handleCopy = useCallback(() => {\n    const selection = window.getSelection();\n    const boxEl = document.getElementById(boxId);\n    if (\n      selection &&\n      !selection.isCollapsed &&\n      selection.anchorNode &&\n      boxEl?.contains(selection.anchorNode)\n    ) {\n      return;\n    }\n\n    copyToClipboard(value)\n      .then(() => {\n        onCopy?.();\n        setCopied(true);\n        clearTimeout(resetTimerRef.current);\n        resetTimerRef.current = setTimeout(() => setCopied(false), 1500);\n      })\n      .catch((error: unknown) => {\n        // eslint-disable-next-line no-console\n        console.error('Copy to clipboard failed', error);\n      });\n  }, [value, onCopy, boxId]);\n\n  const toggleHidden = useCallback(() => setHidden((prev) => !prev), []);\n\n  const registerRevealable = useCallback(() => {\n    setRevealableCount((count) => count + 1);\n    return () => setRevealableCount((count) => count - 1);\n  }, []);\n\n  const registerLabel = useCallback(() => {\n    setLabelCount((count) => count + 1);\n    return () => setLabelCount((count) => count - 1);\n  }, []);\n\n  const contextValue = useMemo(\n    () => ({\n      copied,\n      handleCopy,\n      value,\n      mono,\n      hidden,\n      toggleHidden,\n      registerRevealable,\n      hasRevealable: revealableCount > 0,\n      registerLabel,\n      hasLabel: labelCount > 0,\n      minLines,\n      maxLines: maxLines ?? minLines,\n      hoverHint,\n      labelId,\n      boxId,\n    }),\n    [\n      copied,\n      handleCopy,\n      value,\n      mono,\n      hidden,\n      toggleHidden,\n      registerRevealable,\n      revealableCount,\n      registerLabel,\n      labelCount,\n      minLines,\n      maxLines,\n      hoverHint,\n      labelId,\n      boxId,\n    ],\n  );\n\n  return (\n    <CopyContext value={contextValue}>\n      <div className={cn('tw:flex tw:w-fit tw:max-w-full tw:flex-col tw:gap-1', className)}>\n        {children}\n      </div>\n    </CopyContext>\n  );\n};\n","import type { ReactNode } from 'react';\n\nimport { cn } from '../../utils';\n\ntype CopyAddonProps = {\n  children: ReactNode;\n  className?: string;\n};\n\n/** Muted, non-selectable suffix addon with a leading divider (not part of the copied value). */\nexport const CopySuffix = ({ children, className }: CopyAddonProps) => (\n  <span\n    aria-hidden\n    className={cn(\n      'tw:shrink-0 tw:select-none tw:self-stretch tw:border-l tw:border-border tw:pl-2 tw:text-muted-foreground',\n      className,\n    )}\n  >\n    {children}\n  </span>\n);\n","import { CopyBox } from './CopyBox';\nimport { CopyButton } from './CopyButton';\nimport { CopyChildren } from './CopyChildren';\nimport { CopyFooter } from './CopyFooter';\nimport { CopyHidden } from './CopyHidden';\nimport { CopyLabel } from './CopyLabel';\nimport { CopyPrefix } from './CopyPrefix';\nimport { CopyReveal } from './CopyReveal';\nimport { CopyRoot } from './CopyRoot';\nimport { CopySuffix } from './CopySuffix';\n\n/**\n * Compound component for readonly value/command boxes with inline copy.\n *\n * `CopyField.Root` owns the `value` and copy/mask state; `CopyField.Box` is the clickable\n * copy target. Clicking anywhere in the box copies the real `value` to the\n * clipboard (guarded by text-selection so drag-select does NOT trigger a copy),\n * with a Copy → Check feedback for ~1.5s.\n *\n * Shapes:\n * - **Single-line value row** — default proportional font, value truncates.\n * - **Monospace command box** — `mono` on `CopyField.Root`.\n * - **Multi-line** — `maxLines > 1`; content wraps and scrolls between\n *   `minLines` and `maxLines` tall.\n *\n * Masking: wrap sensitive content in `CopyField.Hidden`. Revealable hidden content is\n * toggled by `CopyField.Reveal` (an eye button); copy still copies the real value.\n *\n * @example Monospace command\n * ```tsx\n * <CopyField.Root value={installCommand} mono>\n *   <CopyField.Label>Install the Keboola CLI</CopyField.Label>\n *   <CopyField.Box>\n *     <CopyField.Children>{installCommand}</CopyField.Children>\n *     <CopyField.Button />\n *   </CopyField.Box>\n * </CopyField.Root>\n * ```\n *\n * @example Masked token with reveal + prefix/suffix\n * ```tsx\n * <CopyField.Root value={dataAppUrl} hiddenByDefault>\n *   <CopyField.Label leading={<InfoButton />} trailing={<Switch />}>Data app URL</CopyField.Label>\n *   <CopyField.Box>\n *     <CopyField.Prefix>https://</CopyField.Prefix>\n *     <CopyField.Children><CopyField.Hidden>{slug}</CopyField.Hidden></CopyField.Children>\n *     <CopyField.Suffix>.keboola.com</CopyField.Suffix>\n *     <CopyField.Reveal />\n *     <CopyField.Button />\n *   </CopyField.Box>\n *   <CopyField.Footer>Click to copy</CopyField.Footer>\n * </CopyField.Root>\n * ```\n */\nexport const CopyField = {\n  /** Container. Owns the copied `value`, mask state, and copy context. */\n  Root: CopyRoot,\n  /** Visible label above the box, with optional `leading`/`trailing` slots. */\n  Label: CopyLabel,\n  /** The clickable copy target row. */\n  Box: CopyBox,\n  /** Muted, non-selectable prefix addon (not copied). */\n  Prefix: CopyPrefix,\n  /** Displayed value (truncates single-line, wraps multi-line). */\n  Children: CopyChildren,\n  /** Muted, non-selectable suffix addon (not copied). */\n  Suffix: CopySuffix,\n  /** Masks its children with dots; copy still copies the real value. */\n  Hidden: CopyHidden,\n  /** Eye toggle that reveals/masks revealable `CopyField.Hidden` content. */\n  Reveal: CopyReveal,\n  /** Copy affordance icon — shows Copy/Check with feedback. */\n  Button: CopyButton,\n  /** Small helper text below the box. */\n  Footer: CopyFooter,\n};\n"]}

package/dist/chunk-S6TAF63G.js

@@ -0,0 +1,25 @@
+import { cn } from './chunk-LXLIQ2D6.js';
+import * as RLabel from '@radix-ui/react-label';
+import { jsx } from 'react/jsx-runtime';
+
+var Optional = ({ className, ...props }) => /* @__PURE__ */ jsx("span", { ...props, "aria-hidden": true, className: cn("tw:ml-0.5", "tw:text-muted-foreground", className), children: "(optional)" });
+var Required = ({ className, ...props }) => /* @__PURE__ */ jsx("span", { ...props, "aria-hidden": true, className: cn("tw:ml-0.5", "tw:text-primary", className), children: "*" });
+var Label = ({ className, children, id, htmlFor, ...rest }) => /* @__PURE__ */ jsx(
+  RLabel.Root,
+  {
+    ...rest,
+    id: id?.toString(),
+    htmlFor: htmlFor?.toString(),
+    className: cn(
+      "tw:m-0 tw:text-foreground tw:font-normal tw:peer-disabled:opacity-50",
+      className
+    ),
+    children
+  }
+);
+Label.Optional = Optional;
+Label.Required = Required;
+
+export { Label };
+//# sourceMappingURL=chunk-S6TAF63G.js.map
+//# sourceMappingURL=chunk-S6TAF63G.js.map

package/dist/chunk-S6TAF63G.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Label/Label.tsx"],"names":[],"mappings":";;;;AAgBA,IAAM,WAAW,CAAC,EAAE,WAAW,GAAG,KAAA,uBAChC,GAAA,CAAC,MAAA,EAAA,EAAM,GAAG,KAAA,EAAO,aAAA,EAAW,MAAC,SAAA,EAAW,EAAA,CAAG,aAAa,0BAAA,EAA4B,SAAS,GAAG,QAAA,EAAA,YAAA,EAEhG,CAAA;AAQF,IAAM,WAAW,CAAC,EAAE,WAAW,GAAG,KAAA,uBAChC,GAAA,CAAC,MAAA,EAAA,EAAM,GAAG,KAAA,EAAO,aAAA,EAAW,MAAC,SAAA,EAAW,EAAA,CAAG,aAAa,iBAAA,EAAmB,SAAS,GAAG,QAAA,EAAA,GAAA,EAEvF,CAAA;AAGK,IAAM,KAAA,GAAQ,CAAC,EAAE,SAAA,EAAW,UAAU,EAAA,EAAI,OAAA,EAAS,GAAG,IAAA,EAAK,qBAChE,GAAA;AAAA,EAAQ,MAAA,CAAA,IAAA;AAAA,EAAP;AAAA,IACE,GAAG,IAAA;AAAA,IACJ,EAAA,EAAI,IAAI,QAAA,EAAS;AAAA,IACjB,OAAA,EAAS,SAAS,QAAA,EAAS;AAAA,IAC3B,SAAA,EAAW,EAAA;AAAA,MACT,sEAAA;AAAA,MACA;AAAA,KACF;AAAA,IAEC;AAAA;AACH;AAGF,KAAA,CAAM,QAAA,GAAW,QAAA;AACjB,KAAA,CAAM,QAAA,GAAW,QAAA","file":"chunk-S6TAF63G.js","sourcesContent":["import type { ComponentPropsWithRef } from 'react';\nimport type { LabelProps } from '@radix-ui/react-label';\nimport * as RLabel from '@radix-ui/react-label';\n\nimport { cn } from '../../utils';\n\ntype Props = { id?: string | number; htmlFor?: string | number } & Omit<\n  LabelProps,\n  'id' | 'htmlFor'\n>;\n\n/**\n * Decorative optional marker (`(optional)`). Like `Label.Required` it is `aria-hidden`, so it is\n * purely visual — optionality is conveyed by the *absence* of `aria-required`/`required` on the\n * associated control, not by this text.\n */\nconst Optional = ({ className, ...props }: ComponentPropsWithRef<'span'>) => (\n  <span {...props} aria-hidden className={cn('tw:ml-0.5', 'tw:text-muted-foreground', className)}>\n    (optional)\n  </span>\n);\n\n/**\n * Decorative required marker (the `*`). It is `aria-hidden`, so it is purely visual and is **not**\n * announced by assistive tech — conveying the requirement is the caller's responsibility: set\n * `aria-required` (or `required`) on the associated control.\n */\nconst Required = ({ className, ...props }: ComponentPropsWithRef<'span'>) => (\n  <span {...props} aria-hidden className={cn('tw:ml-0.5', 'tw:text-primary', className)}>\n    *\n  </span>\n);\n\nexport const Label = ({ className, children, id, htmlFor, ...rest }: Props) => (\n  <RLabel.Root\n    {...rest}\n    id={id?.toString()}\n    htmlFor={htmlFor?.toString()}\n    className={cn(\n      'tw:m-0 tw:text-foreground tw:font-normal tw:peer-disabled:opacity-50',\n      className,\n    )}\n  >\n    {children}\n  </RLabel.Root>\n);\n\nLabel.Optional = Optional;\nLabel.Required = Required;\n"]}

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"]}