@keboola/design 10.1.0 → 11.0.0

package/dist/chunk-7GTI3PPI.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Kbd/KbdSeparator.tsx","../src/components/Kbd/KbdGroup.tsx","../src/components/Kbd/styles.ts","../src/components/Kbd/Kbd.tsx","../src/components/Kbd/keyboardKeys.ts"],"names":["jsx"],"mappings":"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","file":"chunk-7GTI3PPI.js","sourcesContent":["import type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<'span'>;\n\nexport const KbdSeparator = ({ className, ...props }: Props) => (\n  <span {...props} className={cn('tw:text-xs tw:text-muted-foreground', className)} />\n);\n","import { Children, Fragment } from 'react';\nimport type { ComponentProps } from 'react';\n\nimport { cn } from '../../utils';\n\nimport { KbdSeparator } from './KbdSeparator';\n\ntype Props = { separator?: string } & ComponentProps<'kbd'>;\n\nexport const KbdGroup = ({ ref, className, children, separator, ...props }: Props) => {\n  return (\n    <kbd\n      {...props}\n      ref={ref}\n      className={cn('tw:inline-flex', 'tw:items-center', 'tw:gap-1', className)}\n    >\n      {separator\n        ? // oxlint-disable-next-line react-x/no-children-to-array\n          Children.toArray(children).map((child, index) => (\n            // oxlint-disable-next-line\n            <Fragment key={index}>\n              {index > 0 && <KbdSeparator>{separator}</KbdSeparator>}\n              {child}\n            </Fragment>\n          ))\n        : children}\n    </kbd>\n  );\n};\n","import { cva } from 'class-variance-authority';\n\nexport const kbdVariants = cva(\n  [\n    'tailwindcss-preflight',\n    // style\n    'tw:pointer-events-none',\n    'tw:w-fit',\n    'tw:h-5',\n    'tw:min-w-5',\n\n    // layout\n    'tw:inline-flex',\n    'tw:items-center',\n    'tw:justify-center',\n    'tw:gap-1',\n    'tw:shrink-0',\n\n    // spacing\n    'tw:px-1',\n    'tw:[&_svg:not([class*=\"size-\"])]:size-2.5',\n\n    'tw:text-xs',\n    'tw:font-medium',\n\n    'tw:rounded',\n  ],\n  {\n    defaultVariants: {\n      variant: 'default',\n    },\n    variants: {\n      variant: {\n        default: 'tw:bg-muted tw:text-muted-foreground',\n        primary: 'tw:bg-white/20 tw:text-white',\n      },\n    },\n  },\n);\n","import type { ComponentProps } from 'react';\nimport type { VariantProps } from 'class-variance-authority';\n\nimport { KbdGroup } from './KbdGroup';\nimport { KbdSeparator } from './KbdSeparator';\nimport { kbdVariants } from './styles';\n\ntype Props = ComponentProps<'kbd'> & VariantProps<typeof kbdVariants>;\n\nexport const Kbd = ({ children, className, variant, ...rest }: Props) => (\n  <kbd {...rest} className={kbdVariants({ className, variant })}>\n    {children}\n  </kbd>\n);\n\nKbd.Group = KbdGroup;\nKbd.Separator = KbdSeparator;\n","import { isMac } from '../../utils';\n\ntype KeyName = 'mod' | 'option' | 'shift' | 'enter';\ntype KeyRepresentation = { symbol: string; text: string };\n\ntype KeyDefinition = {\n  mac: KeyRepresentation;\n  windows: KeyRepresentation;\n};\n\nconst KEY_DEFINITIONS: Record<KeyName, KeyDefinition> = {\n  mod: {\n    mac: { symbol: '⌘', text: 'Command' },\n    windows: { symbol: 'Ctrl', text: 'Ctrl' },\n  },\n  option: {\n    mac: { symbol: '⌥', text: 'Option' },\n    windows: { symbol: 'Alt', text: 'Alt' },\n  },\n  shift: {\n    mac: { symbol: '⇧', text: 'Shift' },\n    windows: { symbol: '⇧', text: 'Shift' },\n  },\n  enter: {\n    mac: { symbol: '⏎', text: 'Enter' },\n    windows: { symbol: '⏎', text: 'Enter' },\n  },\n};\n\nconst createKeyboardKeys = () => {\n  const keysObj: Record<KeyName, KeyRepresentation> = {} as Record<KeyName, KeyRepresentation>;\n\n  for (const keyName of Object.keys(KEY_DEFINITIONS) as KeyName[]) {\n    keysObj[keyName] = KEY_DEFINITIONS[keyName][isMac ? 'mac' : 'windows'];\n  }\n\n  return keysObj;\n};\n\nexport const keys = createKeyboardKeys();\n"]}

package/dist/chunk-7P6PLZ4B.js

@@ -0,0 +1,74 @@
+import { Tooltip, copyToClipboard } from './chunk-SWQFYNYG.js';
+import { cn } from './chunk-LXLIQ2D6.js';
+import { useState } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var Clipboard = ({
+  ref,
+  text: textProp,
+  children,
+  tooltip = "Copy to Clipboard",
+  tooltipPlacement = "top",
+  tooltipVariant: tooltipVariantProp = "action",
+  asChild = false,
+  onClick,
+  className,
+  ...restButtonProps
+}) => {
+  const [isTooltipOpen, setIsTooltipOpen] = useState(false);
+  const [state, setState] = useState("ready");
+  const text = typeof textProp === "function" ? textProp() : textProp;
+  const copy = async (text2) => {
+    try {
+      if (!document.hasFocus()) window.focus();
+      await copyToClipboard(text2);
+      setState("copied");
+    } catch {
+      setState("error");
+    }
+  };
+  const handleOnClick = (event) => {
+    setIsTooltipOpen(true);
+    if (text && state === "ready") void copy(text);
+    onClick?.(event);
+  };
+  const handleOnOpenChange = (open) => {
+    if (!open && state !== "ready") setState("ready");
+    setIsTooltipOpen(open);
+  };
+  const tooltipContent = (() => {
+    if (!text) return "Nothing to copy";
+    if (state === "error") return "Failed to copy";
+    if (state === "copied") return "Copied to Clipboard";
+    return tooltip;
+  })();
+  const tooltipVariant = state === "ready" && !!text ? tooltipVariantProp : "action";
+  const hasTooltipContent = tooltipContent !== null && tooltipContent !== void 0;
+  return /* @__PURE__ */ jsxs(Tooltip.Root, { open: isTooltipOpen, onOpenChange: handleOnOpenChange, children: [
+    /* @__PURE__ */ jsx(
+      Tooltip.Trigger,
+      {
+        ...restButtonProps,
+        asChild,
+        keepOpenOnClick: true,
+        onClick: handleOnClick,
+        className: cn("tw:cursor-pointer", className),
+        ref,
+        children: children ?? text
+      }
+    ),
+    hasTooltipContent && /* @__PURE__ */ jsx(
+      Tooltip.Content,
+      {
+        keepOpenOnPointerDownOutside: true,
+        placement: tooltipPlacement,
+        variant: tooltipVariant,
+        children: tooltipContent
+      }
+    )
+  ] });
+};
+
+export { Clipboard };
+//# sourceMappingURL=chunk-7P6PLZ4B.js.map
+//# sourceMappingURL=chunk-7P6PLZ4B.js.map

package/dist/chunk-7P6PLZ4B.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Clipboard/Clipboard.tsx"],"names":["text"],"mappings":";;;;;AAcO,IAAM,YAAY,CAAC;AAAA,EACxB,GAAA;AAAA,EACA,IAAA,EAAM,QAAA;AAAA,EACN,QAAA;AAAA,EACA,OAAA,GAAU,mBAAA;AAAA,EACV,gBAAA,GAAmB,KAAA;AAAA,EACnB,gBAAgB,kBAAA,GAAqB,QAAA;AAAA,EACrC,OAAA,GAAU,KAAA;AAAA,EACV,OAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAG;AACL,CAAA,KAAa;AACX,EAAA,MAAM,CAAC,aAAA,EAAe,gBAAgB,CAAA,GAAI,SAAS,KAAK,CAAA;AACxD,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,SAAuC,OAAO,CAAA;AACxE,EAAA,MAAM,IAAA,GAAO,OAAO,QAAA,KAAa,UAAA,GAAa,UAAS,GAAI,QAAA;AAE3D,EAAA,MAAM,IAAA,GAAO,OAAOA,KAAAA,KAAiB;AACnC,IAAA,IAAI;AAGF,MAAA,IAAI,CAAC,QAAA,CAAS,QAAA,EAAS,SAAU,KAAA,EAAM;AAEvC,MAAA,MAAM,gBAAgBA,KAAI,CAAA;AAC1B,MAAA,QAAA,CAAS,QAAQ,CAAA;AAAA,IACnB,CAAA,CAAA,MAAQ;AACN,MAAA,QAAA,CAAS,OAAO,CAAA;AAAA,IAClB;AAAA,EACF,CAAA;AAEA,EAAA,MAAM,aAAA,GAAsD,CAAC,KAAA,KAAU;AAIrE,IAAA,gBAAA,CAAiB,IAAI,CAAA;AACrB,IAAA,IAAI,IAAA,IAAQ,KAAA,KAAU,OAAA,EAAS,KAAK,KAAK,IAAI,CAAA;AAC7C,IAAA,OAAA,GAAU,KAAK,CAAA;AAAA,EACjB,CAAA;AAEA,EAAA,MAAM,kBAAA,GAA0E,CAAC,IAAA,KAAS;AAExF,IAAA,IAAI,CAAC,IAAA,IAAQ,KAAA,KAAU,OAAA,WAAkB,OAAO,CAAA;AAChD,IAAA,gBAAA,CAAiB,IAAI,CAAA;AAAA,EACvB,CAAA;AAEA,EAAA,MAAM,kBAAkB,MAAM;AAC5B,IAAA,IAAI,CAAC,MAAM,OAAO,iBAAA;AAClB,IAAA,IAAI,KAAA,KAAU,SAAS,OAAO,gBAAA;AAC9B,IAAA,IAAI,KAAA,KAAU,UAAU,OAAO,qBAAA;AAC/B,IAAA,OAAO,OAAA;AAAA,EACT,CAAA,GAAG;AAEH,EAAA,MAAM,iBACJ,KAAA,KAAU,OAAA,IAAW,CAAC,CAAC,OAAO,kBAAA,GAAqB,QAAA;AAMrD,EAAA,MAAM,iBAAA,GAAoB,cAAA,KAAmB,IAAA,IAAQ,cAAA,KAAmB,MAAA;AAExE,EAAA,4BACG,OAAA,CAAQ,IAAA,EAAR,EAAa,IAAA,EAAM,aAAA,EAAe,cAAc,kBAAA,EAC/C,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,OAAA,CAAQ,OAAA;AAAA,MAAR;AAAA,QACE,GAAG,eAAA;AAAA,QACJ,OAAA;AAAA,QACA,eAAA,EAAe,IAAA;AAAA,QACf,OAAA,EAAS,aAAA;AAAA,QACT,SAAA,EAAW,EAAA,CAAG,mBAAA,EAAqB,SAAS,CAAA;AAAA,QAC5C,GAAA;AAAA,QAEC,QAAA,EAAA,QAAA,IAAY;AAAA;AAAA,KACf;AAAA,IAEC,iBAAA,oBACC,GAAA;AAAA,MAAC,OAAA,CAAQ,OAAA;AAAA,MAAR;AAAA,QACC,4BAAA,EAA4B,IAAA;AAAA,QAC5B,SAAA,EAAW,gBAAA;AAAA,QACX,OAAA,EAAS,cAAA;AAAA,QAER,QAAA,EAAA;AAAA;AAAA;AACH,GAAA,EAEJ,CAAA;AAEJ","file":"chunk-7P6PLZ4B.js","sourcesContent":["import { useState } from 'react';\nimport type { ComponentProps, MouseEventHandler } from 'react';\n\nimport { cn, copyToClipboard } from '../../utils';\nimport { type Props as TooltipProps, Tooltip } from '../Tooltip';\n\ntype Props = {\n  tooltip?: TooltipProps['tooltip'];\n  tooltipPlacement?: TooltipProps['placement'];\n  tooltipVariant?: TooltipProps['variant'];\n  asChild?: TooltipProps['triggerAsChild'];\n  text?: string | (() => string);\n} & ComponentProps<'button'>;\n\nexport const Clipboard = ({\n  ref,\n  text: textProp,\n  children,\n  tooltip = 'Copy to Clipboard',\n  tooltipPlacement = 'top',\n  tooltipVariant: tooltipVariantProp = 'action',\n  asChild = false,\n  onClick,\n  className,\n  ...restButtonProps\n}: Props) => {\n  const [isTooltipOpen, setIsTooltipOpen] = useState(false);\n  const [state, setState] = useState<'ready' | 'copied' | 'error'>('ready');\n  const text = typeof textProp === 'function' ? textProp() : textProp;\n\n  const copy = async (text: string) => {\n    try {\n      // For the clipboard feature to work reliably, the window must be in focus for security reasons.\n      // However, the button can be clicked without the window being focused.\n      if (!document.hasFocus()) window.focus();\n\n      await copyToClipboard(text);\n      setState('copied');\n    } catch {\n      setState('error');\n    }\n  };\n\n  const handleOnClick: MouseEventHandler<HTMLButtonElement> = (event) => {\n    // Open on click rather than waiting for hover. Radix opens on pointer-enter via a\n    // `delayDuration` timer (300ms here), so clicking faster than that left the outcome invisible\n    // until the timer caught up — the message was already rendered, just inside a closed tooltip.\n    setIsTooltipOpen(true);\n    if (text && state === 'ready') void copy(text);\n    onClick?.(event);\n  };\n\n  const handleOnOpenChange: ComponentProps<typeof Tooltip.Root>['onOpenChange'] = (open) => {\n    // Reset when the tooltip closes, allowing the user to leave the copy button.\n    if (!open && state !== 'ready') setState('ready');\n    setIsTooltipOpen(open);\n  };\n\n  const tooltipContent = (() => {\n    if (!text) return 'Nothing to copy';\n    if (state === 'error') return 'Failed to copy';\n    if (state === 'copied') return 'Copied to Clipboard';\n    return tooltip;\n  })();\n\n  const tooltipVariant: TooltipProps['variant'] =\n    state === 'ready' && !!text ? tooltipVariantProp : 'action';\n\n  // `tooltip={null}` leaves nothing to say until there is an outcome. Not rendering `Content` at all\n  // is what makes that work: hovering still opens the tooltip, there is simply nothing in it, and\n  // the copied / failed message appears in place the moment `state` changes. It also keeps Radix\n  // from pointing the trigger's `aria-describedby` at content that has no text.\n  const hasTooltipContent = tooltipContent !== null && tooltipContent !== undefined;\n\n  return (\n    <Tooltip.Root open={isTooltipOpen} onOpenChange={handleOnOpenChange}>\n      <Tooltip.Trigger\n        {...restButtonProps}\n        asChild={asChild}\n        keepOpenOnClick\n        onClick={handleOnClick}\n        className={cn('tw:cursor-pointer', className)}\n        ref={ref}\n      >\n        {children ?? text}\n      </Tooltip.Trigger>\n\n      {hasTooltipContent && (\n        <Tooltip.Content\n          keepOpenOnPointerDownOutside\n          placement={tooltipPlacement}\n          variant={tooltipVariant}\n        >\n          {tooltipContent}\n        </Tooltip.Content>\n      )}\n    </Tooltip.Root>\n  );\n};\n"]}

package/dist/chunk-7WZWY5IA.js

@@ -0,0 +1,46 @@
+import { DropdownMenu } from './chunk-ERAHK5YQ.js';
+import { Button } from './chunk-IXAYNBOY.js';
+import { Sun, Moon, Monitor } from './chunk-RQVK4IYC.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var OPTIONS = [
+  { value: "light", label: "Light", icon: Sun },
+  { value: "dark", label: "Dark", icon: Moon },
+  { value: "system", label: "System", icon: Monitor }
+];
+var triggerSizeMap = { small: "icon-sm", medium: "icon" };
+var ColorModeSwitch = ({ value, onValueChange, size = "small", className }) => {
+  const active = OPTIONS.find((option) => option.value === value);
+  const ActiveIcon = active?.icon ?? Monitor;
+  const activeLabel = active?.label ?? "System";
+  return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx(DropdownMenu.Trigger, { asChild: true, children: /* @__PURE__ */ jsx(
+      Button,
+      {
+        type: "button",
+        variant: "outline",
+        size: triggerSizeMap[size],
+        "aria-label": `Color mode: ${activeLabel}`,
+        title: `Color mode: ${activeLabel}`,
+        className,
+        children: /* @__PURE__ */ jsx(ActiveIcon, { className: "tw:size-4" })
+      }
+    ) }),
+    /* @__PURE__ */ jsx(DropdownMenu.Content, { align: "end", children: /* @__PURE__ */ jsx(DropdownMenu.RadioGroup, { value, onValueChange, children: OPTIONS.map(({ value: option, label, icon: Icon }) => /* @__PURE__ */ jsx(
+      DropdownMenu.RadioItem,
+      {
+        value: option,
+        icon: /* @__PURE__ */ jsx(Icon, {}),
+        indicator: "check",
+        indicatorAlign: "end",
+        closeOnSelect: true,
+        children: label
+      },
+      option
+    )) }) })
+  ] });
+};
+
+export { ColorModeSwitch };
+//# sourceMappingURL=chunk-7WZWY5IA.js.map
+//# sourceMappingURL=chunk-7WZWY5IA.js.map

package/dist/chunk-7WZWY5IA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/blocks/ColorModeSwitch/ColorModeSwitch.tsx"],"names":[],"mappings":";;;;;AAgBA,IAAM,OAAA,GAAqE;AAAA,EACzE,EAAE,KAAA,EAAO,OAAA,EAAS,KAAA,EAAO,OAAA,EAAS,MAAM,GAAA,EAAI;AAAA,EAC5C,EAAE,KAAA,EAAO,MAAA,EAAQ,KAAA,EAAO,MAAA,EAAQ,MAAM,IAAA,EAAK;AAAA,EAC3C,EAAE,KAAA,EAAO,QAAA,EAAU,KAAA,EAAO,QAAA,EAAU,MAAM,OAAA;AAC5C,CAAA;AAEA,IAAM,cAAA,GAAiB,EAAE,KAAA,EAAO,SAAA,EAAW,QAAQ,MAAA,EAAO;AAkBnD,IAAM,eAAA,GAAkB,CAAC,EAAE,KAAA,EAAO,eAAe,IAAA,GAAO,OAAA,EAAS,WAAU,KAAa;AAC7F,EAAA,MAAM,SAAS,OAAA,CAAQ,IAAA,CAAK,CAAC,MAAA,KAAW,MAAA,CAAO,UAAU,KAAK,CAAA;AAC9D,EAAA,MAAM,UAAA,GAAa,QAAQ,IAAA,IAAQ,OAAA;AACnC,EAAA,MAAM,WAAA,GAAc,QAAQ,KAAA,IAAS,QAAA;AAErC,EAAA,4BACG,YAAA,EAAA,EACC,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,YAAA,CAAa,OAAA,EAAb,EAAqB,OAAA,EAAO,IAAA,EAC3B,QAAA,kBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,QAAA;AAAA,QACL,OAAA,EAAQ,SAAA;AAAA,QACR,IAAA,EAAM,eAAe,IAAI,CAAA;AAAA,QACzB,YAAA,EAAY,eAAe,WAAW,CAAA,CAAA;AAAA,QACtC,KAAA,EAAO,eAAe,WAAW,CAAA,CAAA;AAAA,QACjC,SAAA;AAAA,QAEA,QAAA,kBAAA,GAAA,CAAC,UAAA,EAAA,EAAW,SAAA,EAAU,WAAA,EAAY;AAAA;AAAA,KACpC,EACF,CAAA;AAAA,oBACA,GAAA,CAAC,aAAa,OAAA,EAAb,EAAqB,OAAM,KAAA,EAC1B,QAAA,kBAAA,GAAA,CAAC,aAAa,UAAA,EAAb,EAAwB,OAAc,aAAA,EACpC,QAAA,EAAA,OAAA,CAAQ,IAAI,CAAC,EAAE,OAAO,MAAA,EAAQ,KAAA,EAAO,IAAA,EAAM,IAAA,EAAK,qBAC/C,GAAA;AAAA,MAAC,YAAA,CAAa,SAAA;AAAA,MAAb;AAAA,QAEC,KAAA,EAAO,MAAA;AAAA,QACP,IAAA,sBAAO,IAAA,EAAA,EAAK,CAAA;AAAA,QACZ,SAAA,EAAU,OAAA;AAAA,QACV,cAAA,EAAe,KAAA;AAAA,QACf,aAAA,EAAa,IAAA;AAAA,QAEZ,QAAA,EAAA;AAAA,OAAA;AAAA,MAPI;AAAA,KASR,GACH,CAAA,EACF;AAAA,GAAA,EACF,CAAA;AAEJ","file":"chunk-7WZWY5IA.js","sourcesContent":["import { Button } from '../../components/Button';\nimport { DropdownMenu } from '../../components/DropdownMenu';\nimport type { ColorScheme } from '../../components/ThemeProvider';\nimport type { LucideIcon } from '../../icons';\nimport { Monitor, Moon, Sun } from '../../icons';\n\ntype Props = {\n  /** The active color scheme. Controlled — pair with `onValueChange`. */\n  value: ColorScheme;\n  /** Called with the chosen scheme when the user picks a menu item. */\n  onValueChange: (value: ColorScheme) => void;\n  /** Trigger button size. Defaults to `small`. */\n  size?: 'small' | 'medium';\n  className?: string;\n};\n\nconst OPTIONS: { value: ColorScheme; label: string; icon: LucideIcon }[] = [\n  { value: 'light', label: 'Light', icon: Sun },\n  { value: 'dark', label: 'Dark', icon: Moon },\n  { value: 'system', label: 'System', icon: Monitor },\n];\n\nconst triggerSizeMap = { small: 'icon-sm', medium: 'icon' } as const;\n\n/**\n * Light / dark / system control — a single icon-only `Button` (showing the active\n * scheme) that opens a `DropdownMenu` of the three options. Composed, not a new\n * primitive. **Controlled:** it renders `value` and reports changes; it does not\n * own the state. `ThemeProvider.colorScheme` is a controlled prop, so wire this to\n * wherever that state lives:\n *\n * ```tsx\n * const [scheme, setScheme] = useState<ColorScheme>('system');\n * <ThemeProvider colorScheme={scheme}>…</ThemeProvider>\n * <ColorModeSwitch value={scheme} onValueChange={setScheme} />\n * ```\n *\n * The menu uses `DropdownMenu.RadioGroup` for single-select semantics; the active\n * item is marked as checked. The trigger's `aria-label` names the current scheme.\n */\nexport const ColorModeSwitch = ({ value, onValueChange, size = 'small', className }: Props) => {\n  const active = OPTIONS.find((option) => option.value === value);\n  const ActiveIcon = active?.icon ?? Monitor;\n  const activeLabel = active?.label ?? 'System';\n\n  return (\n    <DropdownMenu>\n      <DropdownMenu.Trigger asChild>\n        <Button\n          type=\"button\"\n          variant=\"outline\"\n          size={triggerSizeMap[size]}\n          aria-label={`Color mode: ${activeLabel}`}\n          title={`Color mode: ${activeLabel}`}\n          className={className}\n        >\n          <ActiveIcon className=\"tw:size-4\" />\n        </Button>\n      </DropdownMenu.Trigger>\n      <DropdownMenu.Content align=\"end\">\n        <DropdownMenu.RadioGroup value={value} onValueChange={onValueChange}>\n          {OPTIONS.map(({ value: option, label, icon: Icon }) => (\n            <DropdownMenu.RadioItem\n              key={option}\n              value={option}\n              icon={<Icon />}\n              indicator=\"check\"\n              indicatorAlign=\"end\"\n              closeOnSelect\n            >\n              {label}\n            </DropdownMenu.RadioItem>\n          ))}\n        </DropdownMenu.RadioGroup>\n      </DropdownMenu.Content>\n    </DropdownMenu>\n  );\n};\n"]}

package/dist/chunk-AIYO2632.js

@@ -0,0 +1,489 @@
+import { SearchInput } from './chunk-RMRQKPL7.js';
+import { Popover } from './chunk-ON4BJTHI.js';
+import { ChevronDown, ChevronRight, Ellipsis } from './chunk-RQVK4IYC.js';
+import { cn } from './chunk-LXLIQ2D6.js';
+import { createContext, use, useId, useEffect, useRef, useState, useCallback, useMemo, Children, isValidElement } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Slot } from '@radix-ui/react-slot';
+
+var BreadcrumbDropdownContext = createContext(null);
+var matchesQuery = (text, query) => text.toLowerCase().includes(query);
+var getNodeText = (node) => {
+  if (typeof node === "string" || typeof node === "number") return String(node);
+  if (Array.isArray(node)) return node.map(getNodeText).join("");
+  if (isValidElement(node)) return getNodeText(node.props.children);
+  return "";
+};
+var normalizeQuery = (query) => query.trim().toLowerCase();
+var useMatchRegistry = () => {
+  const [matches, setMatches] = useState(/* @__PURE__ */ new Map());
+  const register = useCallback((id, visible) => {
+    setMatches((prev) => prev.get(id) === visible ? prev : new Map(prev).set(id, visible));
+    return () => {
+      setMatches((prev) => {
+        if (!prev.has(id)) return prev;
+        const next = new Map(prev);
+        next.delete(id);
+        return next;
+      });
+    };
+  }, []);
+  const anyVisible = useMemo(() => [...matches.values()].some(Boolean), [matches]);
+  return { register, anyVisible };
+};
+var headerClass = cn(
+  // layout
+  "tw:flex",
+  "tw:w-full",
+  "tw:items-center",
+  "tw:gap-2",
+  "tw:box-border",
+  "tw:rounded-md",
+  "tw:border-none",
+  "tw:bg-transparent",
+  "tw:px-2",
+  "tw:py-1.5",
+  "tw:text-left",
+  // font — single line; wrap the label in `Truncated` (design system) for ellipsis + tooltip
+  "tw:text-sm",
+  "tw:font-medium",
+  "tw:text-foreground",
+  "tw:min-w-0",
+  "tw:overflow-hidden",
+  // icons
+  "tw:[&_svg:not([class*='tw:size-'])]:size-4",
+  "tw:[&_svg]:shrink-0"
+);
+var collapsibleHeaderClass = cn(
+  "tw:cursor-pointer",
+  "tw:hover:bg-accent",
+  "tw:focus-visible:outline-hidden",
+  "tw:focus-visible:ring-2",
+  "tw:focus-visible:ring-ring/50"
+);
+var BreadcrumbDropdownGroup = ({
+  label,
+  textValue,
+  collapsible = false,
+  defaultExpanded = true,
+  className,
+  children
+}) => {
+  const parent = use(BreadcrumbDropdownContext);
+  if (!parent) {
+    throw new Error("Breadcrumb.Dropdown.Group must be rendered inside Breadcrumb.Dropdown");
+  }
+  const id = useId();
+  const { register: registerChild, anyVisible } = useMatchRegistry();
+  const [expanded, setExpanded] = useState(defaultExpanded);
+  const text = textValue ?? getNodeText(label);
+  const filtering = !parent.filterDisabled && !!parent.query;
+  const labelMatched = filtering && matchesQuery(text, parent.query);
+  const visible = !filtering || parent.forceVisible || labelMatched || anyVisible;
+  useEffect(() => parent.register(id, visible), [parent, id, visible]);
+  const childContext = useMemo(
+    () => ({
+      query: parent.query,
+      forceVisible: parent.forceVisible || labelMatched,
+      filterDisabled: parent.filterDisabled,
+      register: registerChild,
+      close: parent.close
+    }),
+    [parent, labelMatched, registerChild]
+  );
+  const isExpanded = !collapsible || expanded || filtering;
+  const isEmpty = Children.count(children) === 0;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn("tw:flex tw:flex-col", className),
+      style: visible ? void 0 : { display: "none" },
+      children: [
+        collapsible && isEmpty ? /* @__PURE__ */ jsxs(
+          "span",
+          {
+            "aria-disabled": true,
+            className: cn(
+              headerClass,
+              "tw:text-muted-foreground",
+              // Fade just the leading chevron lighter than the label text.
+              "tw:[&>svg:first-child]:opacity-50"
+            ),
+            children: [
+              /* @__PURE__ */ jsx(ChevronRight, {}),
+              label
+            ]
+          }
+        ) : collapsible && !isEmpty ? /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            "aria-expanded": isExpanded,
+            className: cn(headerClass, collapsibleHeaderClass),
+            onClick: () => setExpanded((prev) => !prev),
+            children: [
+              isExpanded ? /* @__PURE__ */ jsx(ChevronDown, {}) : /* @__PURE__ */ jsx(ChevronRight, {}),
+              label
+            ]
+          }
+        ) : /* @__PURE__ */ jsx("span", { className: headerClass, children: label }),
+        /* @__PURE__ */ jsx(BreadcrumbDropdownContext, { value: childContext, children: collapsible && !isEmpty ? (
+          // Animated expand / collapse via a CSS grid-rows transition (0fr ↔ 1fr). The children stay
+          // mounted while collapsed so the filter registry keeps receiving their visibility; `inert`
+          // + `aria-hidden` take the collapsed content out of the a11y tree and tab order. An active
+          // filter query force-expands (`isExpanded` includes `filtering`).
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn(
+                "tw:grid tw:transition-[grid-template-rows] tw:duration-200 tw:ease-out",
+                "tw:motion-reduce:transition-none",
+                isExpanded ? "tw:grid-rows-[1fr]" : "tw:grid-rows-[0fr]"
+              ),
+              children: /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: "tw:overflow-hidden",
+                  inert: !isExpanded,
+                  "aria-hidden": isExpanded ? void 0 : true,
+                  children: /* @__PURE__ */ jsx("div", { className: "tw:flex tw:flex-col tw:pl-6", children })
+                }
+              )
+            }
+          )
+        ) : /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: "tw:flex tw:flex-col tw:pl-6",
+            style: isExpanded ? void 0 : { display: "none" },
+            children
+          }
+        ) })
+      ]
+    }
+  );
+};
+var itemClass = cn(
+  // layout
+  "tw:flex",
+  "tw:w-full",
+  "tw:items-center",
+  "tw:gap-2",
+  "tw:box-border",
+  "tw:rounded-md",
+  "tw:border-none",
+  "tw:bg-transparent",
+  "tw:px-2",
+  "tw:py-1.5",
+  "tw:cursor-pointer",
+  "tw:text-left",
+  // font — single line; wrap the label in `Truncated` (design system) for ellipsis + tooltip
+  "tw:text-sm",
+  "tw:font-normal",
+  "tw:text-foreground",
+  "tw:no-underline",
+  "tw:min-w-0",
+  "tw:overflow-hidden",
+  // hover / active entity
+  "tw:hover:bg-accent",
+  "tw:data-[active]:bg-accent",
+  "tw:data-[active]:font-medium",
+  // focus
+  "tw:focus-visible:outline-hidden",
+  "tw:focus-visible:ring-2",
+  "tw:focus-visible:ring-ring/50",
+  // icons
+  "tw:[&_svg:not([class*='tw:size-'])]:size-4",
+  "tw:[&_svg]:shrink-0"
+);
+var BreadcrumbDropdownItem = ({
+  ref,
+  asChild = false,
+  textValue,
+  active = false,
+  closeOnSelect = true,
+  className,
+  children,
+  onClick,
+  ...props
+}) => {
+  const context = use(BreadcrumbDropdownContext);
+  if (!context) {
+    throw new Error("Breadcrumb.Dropdown.Item must be rendered inside Breadcrumb.Dropdown");
+  }
+  const id = useId();
+  const text = textValue ?? getNodeText(children);
+  const visible = context.filterDisabled || !context.query || context.forceVisible || matchesQuery(text, context.query);
+  useEffect(() => context.register(id, visible), [context, id, visible]);
+  if (!visible) return null;
+  const Comp = asChild ? Slot : "button";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      ref,
+      ...asChild ? {} : { type: "button" },
+      "data-active": active || void 0,
+      "aria-current": active || void 0,
+      className: cn(itemClass, className),
+      onClick: (event) => {
+        onClick?.(event);
+        if (closeOnSelect && !event.defaultPrevented) {
+          context.close();
+        }
+      },
+      ...props,
+      children
+    }
+  );
+};
+var BreadcrumbLink = ({ ref, asChild = false, className, ...props }) => {
+  const Comp = asChild ? Slot : "a";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      ref,
+      className: cn(
+        "tw:flex",
+        "tw:items-center",
+        "tw:gap-1.5",
+        // font
+        "tw:text-muted-foreground",
+        "tw:font-normal",
+        "tw:no-underline",
+        // hover
+        "tw:hover:text-foreground",
+        // focus
+        "tw:focus-visible:outline-hidden",
+        "tw:focus-visible:ring-2",
+        "tw:focus-visible:ring-ring/50",
+        "tw:focus-visible:rounded-sm",
+        // Icon
+        'tw:[&_svg:not([class*="tw:size-"])]:size-3.5',
+        // transition
+        "tw:transition-colors",
+        className
+      ),
+      ...props
+    }
+  );
+};
+var chevronButtonClass = cn(
+  // layout
+  "tw:flex",
+  "tw:items-center",
+  "tw:justify-center",
+  "tw:rounded-md",
+  "tw:border-none",
+  "tw:bg-transparent",
+  "tw:cursor-pointer",
+  // compact square hit target that stays snug against the label
+  "tw:size-5",
+  "tw:text-muted-foreground",
+  "tw:transition-colors",
+  "tw:hover:bg-accent",
+  "tw:hover:text-foreground",
+  "tw:data-[state=open]:bg-accent",
+  "tw:data-[state=open]:text-foreground",
+  // focus
+  "tw:focus-visible:outline-hidden",
+  "tw:focus-visible:ring-2",
+  "tw:focus-visible:ring-ring/50",
+  // chevron rotation while open
+  "tw:[&_svg]:transition-transform",
+  "tw:[&[data-state=open]_svg]:rotate-180"
+);
+var plainLabelClass = cn(
+  "tw:flex",
+  "tw:items-center",
+  "tw:gap-1.5",
+  "tw:text-muted-foreground",
+  "tw:font-normal",
+  'tw:[&_svg:not([class*="tw:size-"])]:size-3.5'
+);
+var PANEL_BASE = "tw:max-h-[min(640px,var(--radix-popover-content-available-height))]";
+var PANEL_WIDTH = {
+  small: "tw:w-[min(360px,var(--radix-popover-content-available-width))]",
+  medium: "tw:w-[min(440px,var(--radix-popover-content-available-width))]",
+  large: "tw:w-[min(560px,var(--radix-popover-content-available-width))]"
+};
+var BreadcrumbDropdown = ({
+  label,
+  splitTrigger = false,
+  triggerLabel,
+  open,
+  defaultOpen = false,
+  onOpenChange,
+  size = "medium",
+  filter = true,
+  shouldFilter = true,
+  searchValue,
+  onSearchChange,
+  searchPlaceholder = "Search\u2026",
+  emptyMessage = "No results.",
+  children
+}) => {
+  const searchRef = useRef(null);
+  const [internalOpen, setInternalOpen] = useState(defaultOpen);
+  const [internalQuery, setInternalQuery] = useState("");
+  const { register, anyVisible } = useMatchRegistry();
+  const isOpen = open ?? internalOpen;
+  const handleOpenChange = useCallback(
+    (nextOpen) => {
+      setInternalOpen(nextOpen);
+      if (!nextOpen) setInternalQuery("");
+      onOpenChange?.(nextOpen);
+    },
+    [onOpenChange]
+  );
+  const close = useCallback(() => handleOpenChange(false), [handleOpenChange]);
+  const effectiveTriggerLabel = triggerLabel ?? (typeof label === "string" ? `${label} menu` : "Open menu");
+  const rawQuery = searchValue ?? internalQuery;
+  const filterDisabled = !filter || !shouldFilter;
+  const query = filterDisabled ? "" : normalizeQuery(rawQuery);
+  const contextValue = useMemo(
+    () => ({ query, forceVisible: false, filterDisabled, register, close }),
+    [query, filterDisabled, register, close]
+  );
+  return /* @__PURE__ */ jsxs(Popover, { open: isOpen, onOpenChange: handleOpenChange, children: [
+    /* @__PURE__ */ jsxs("span", { className: "tw:flex tw:items-center tw:gap-0.5", children: [
+      splitTrigger ? /* @__PURE__ */ jsx(BreadcrumbLink, { asChild: true, children: label }) : /* @__PURE__ */ jsx("span", { className: plainLabelClass, children: label }),
+      /* @__PURE__ */ jsx(Popover.Trigger, { asChild: true, children: /* @__PURE__ */ jsx("button", { type: "button", "aria-label": effectiveTriggerLabel, className: chevronButtonClass, children: /* @__PURE__ */ jsx(ChevronDown, { className: "tw:size-3.5" }) }) })
+    ] }),
+    /* @__PURE__ */ jsxs(
+      Popover.Content,
+      {
+        align: "start",
+        sideOffset: 8,
+        collisionPadding: 16,
+        "data-size": size,
+        className: cn("tw:overflow-hidden tw:p-0", PANEL_BASE, PANEL_WIDTH[size]),
+        onOpenAutoFocus: filter ? (event) => {
+          event.preventDefault();
+          searchRef.current?.focus();
+        } : void 0,
+        children: [
+          filter && /* @__PURE__ */ jsx("div", { className: "tw:shrink-0 tw:border-0 tw:border-b tw:border-solid tw:border-border tw:p-2", children: /* @__PURE__ */ jsx(
+            SearchInput,
+            {
+              ref: searchRef,
+              value: rawQuery,
+              onValueChange: (value) => {
+                setInternalQuery(value);
+                onSearchChange?.(value);
+              },
+              placeholder: searchPlaceholder,
+              allowClear: true,
+              disableDebounce: shouldFilter
+            }
+          ) }),
+          /* @__PURE__ */ jsxs("div", { className: "tw:flex tw:flex-1 tw:flex-col tw:overflow-y-auto tw:p-2", children: [
+            /* @__PURE__ */ jsx(BreadcrumbDropdownContext, { value: contextValue, children }),
+            !filterDisabled && !!query && !anyVisible && /* @__PURE__ */ jsx("span", { className: "tw:px-2 tw:py-1.5 tw:text-sm tw:text-muted-foreground", children: emptyMessage })
+          ] })
+        ]
+      }
+    )
+  ] });
+};
+BreadcrumbDropdown.Item = BreadcrumbDropdownItem;
+BreadcrumbDropdown.Group = BreadcrumbDropdownGroup;
+var BreadcrumbEllipsis = ({ ref, className, ...props }) => /* @__PURE__ */ jsxs(
+  "button",
+  {
+    ref,
+    type: "button",
+    className: cn(
+      // layout
+      "tw:flex",
+      "tw:items-center",
+      "tw:justify-center",
+      "tw:rounded-md",
+      "tw:border-none",
+      "tw:bg-transparent",
+      "tw:cursor-pointer",
+      "tw:text-muted-foreground",
+      "tw:transition-colors",
+      // Match the Breadcrumb.Dropdown chevron trigger: background + colour lift on hover / while the
+      // menu is open, so the two interactive breadcrumb affordances read consistently.
+      "tw:hover:bg-accent",
+      "tw:hover:text-foreground",
+      "tw:data-[state=open]:bg-accent",
+      "tw:data-[state=open]:text-foreground",
+      // focus
+      "tw:focus-visible:outline-hidden",
+      "tw:focus-visible:ring-2",
+      "tw:focus-visible:ring-ring/50",
+      "tw:p-1",
+      className
+    ),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx(Ellipsis, { className: "tw:size-4" }),
+      /* @__PURE__ */ jsx("span", { className: "tw:sr-only", children: "More" })
+    ]
+  }
+);
+var BreadcrumbItem = ({ className, ...props }) => /* @__PURE__ */ jsx("li", { className: cn("tw:inline-flex", "tw:items-center", className), ...props });
+var BreadcrumbList = ({ className, ...props }) => /* @__PURE__ */ jsx(
+  "ol",
+  {
+    className: cn(
+      // layout
+      "tw:flex",
+      "tw:flex-wrap",
+      "tw:items-center",
+      "tw:gap-2",
+      "tw:m-0",
+      "tw:p-0",
+      // font
+      "tw:break-words",
+      "tw:text-sm",
+      "tw:text-muted-foreground",
+      className
+    ),
+    ...props
+  }
+);
+var BreadcrumbPage = ({ ref, className, ...props }) => /* @__PURE__ */ jsx(
+  "span",
+  {
+    ref,
+    role: "link",
+    "aria-disabled": "true",
+    "aria-current": "page",
+    className: cn("tw:font-medium", "tw:text-foreground", className),
+    ...props
+  }
+);
+var BreadcrumbSeparator = ({ children, className, ...props }) => /* @__PURE__ */ jsx(
+  "li",
+  {
+    role: "presentation",
+    "aria-hidden": "true",
+    className: cn(
+      // layout
+      "tw:flex",
+      "tw:items-center",
+      "tw:justify-center",
+      "tw:aspect-square",
+      "tw:size-[15px]",
+      'tw:[&_svg:not([class*="tw:size-"])]:size-2.5',
+      "tw:text-muted-foreground",
+      className
+    ),
+    ...props,
+    children: children ?? /* @__PURE__ */ jsx("span", { className: "tw:select-none tw:text-sm tw:text-muted-foreground/50", children: "/" })
+  }
+);
+var Breadcrumb = ({ className, ...props }) => /* @__PURE__ */ jsx("nav", { "aria-label": "breadcrumb", className: cn("tailwindcss-preflight", className), ...props });
+Breadcrumb.List = BreadcrumbList;
+Breadcrumb.Item = BreadcrumbItem;
+Breadcrumb.Link = BreadcrumbLink;
+Breadcrumb.Page = BreadcrumbPage;
+Breadcrumb.Separator = BreadcrumbSeparator;
+Breadcrumb.Ellipsis = BreadcrumbEllipsis;
+Breadcrumb.Dropdown = BreadcrumbDropdown;
+
+export { Breadcrumb };
+//# sourceMappingURL=chunk-AIYO2632.js.map
+//# sourceMappingURL=chunk-AIYO2632.js.map