@keboola/design 9.1.0 → 11.0.0

package/dist/chunk-M6LTUPVP.js

@@ -0,0 +1,301 @@
+import { overlayTriggerVariants } from './chunk-NFHKYBRD.js';
+import { Button } from './chunk-IXAYNBOY.js';
+import { ChevronDown, ChevronUp, Check } from './chunk-RQVK4IYC.js';
+import { useArgoDesign } from './chunk-WETKNYZX.js';
+import { cn } from './chunk-LXLIQ2D6.js';
+import { useId } from 'react';
+import * as SelectPrimitive6 from '@radix-ui/react-select';
+import { Root } from '@radix-ui/react-select';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var scrollButtonStyles = cn(
+  "tw:flex",
+  "tw:items-center",
+  "tw:justify-center",
+  "tw:rounded-sm",
+  "tw:p-1",
+  'tw:[&_svg:not([class*="tw:size-"])]:size-5'
+);
+var SelectContent = ({
+  ref,
+  className,
+  children,
+  container,
+  position = "popper",
+  sideOffset = 4,
+  ...props
+}) => {
+  const effectiveVariant = useArgoDesign() ? "argo" : "default";
+  return /* @__PURE__ */ jsx(SelectPrimitive6.Portal, { container, children: /* @__PURE__ */ jsxs(
+    SelectPrimitive6.Content,
+    {
+      ...props,
+      ref,
+      position,
+      sideOffset,
+      "data-variant": effectiveVariant,
+      className: cn(
+        "tailwindcss-preflight",
+        "tw:group/select-content",
+        // Floating tier above Modal (1051): Tooltip 1060 / Combobox·Popover·Select 1055 / Modal 1051 / DropdownMenu.SubContent 1041 / FullScreenModal 1039
+        "tw:z-[1055]",
+        // layout
+        "tw:flex tw:flex-col",
+        "tw:p-1",
+        "tw:data-[variant=default]:p-0",
+        "tw:overflow-hidden",
+        "tw:origin-(--radix-select-content-transform-origin)",
+        // sizing
+        "tw:max-h-[var(--radix-select-content-available-height)]",
+        "tw:min-w-[var(--radix-select-trigger-width)]",
+        // appearance
+        "tw:bg-popover",
+        "tw:text-popover-foreground",
+        "tw:shadow-md",
+        "tw:ring-1",
+        "tw:ring-foreground/10",
+        "tw:rounded-lg",
+        "tw:data-[variant=default]:rounded",
+        // open animation
+        "tw:data-[state=open]:animate-in",
+        "tw:data-[state=open]:fade-in-0",
+        "tw:data-[state=open]:zoom-in-95",
+        // closed animation
+        "tw:data-[state=closed]:animate-out",
+        "tw:data-[state=closed]:fade-out-0",
+        "tw:data-[state=closed]:zoom-out-95",
+        // position animations
+        "tw:data-[side=bottom]:slide-in-from-top-2",
+        "tw:data-[side=left]:slide-in-from-right-2",
+        "tw:data-[side=right]:slide-in-from-left-2",
+        "tw:data-[side=top]:slide-in-from-bottom-2",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx(SelectPrimitive6.ScrollUpButton, { className: scrollButtonStyles, children: /* @__PURE__ */ jsx(ChevronUp, {}) }),
+        /* @__PURE__ */ jsx(
+          SelectPrimitive6.Viewport,
+          {
+            className: cn({
+              "tw:h-[var(--radix-select-trigger-height)] tw:w-full tw:min-w-[var(--radix-select-trigger-width)]": position === "popper"
+            }),
+            children
+          }
+        ),
+        /* @__PURE__ */ jsx(SelectPrimitive6.ScrollDownButton, { className: scrollButtonStyles, children: /* @__PURE__ */ jsx(ChevronDown, {}) })
+      ]
+    }
+  ) });
+};
+var SelectGroup = ({ className, ...props }) => /* @__PURE__ */ jsx(SelectPrimitive6.Group, { ...props, className: cn("tw:flex tw:flex-col tw:gap-0.5", className) });
+var SelectItem = ({ ref, className, children, icon, ...props }) => /* @__PURE__ */ jsxs(
+  SelectPrimitive6.Item,
+  {
+    ...props,
+    ref,
+    className: cn(
+      "tw:group/select-item",
+      // layout
+      "tw:relative",
+      "tw:flex",
+      "tw:flex-1",
+      "tw:items-center",
+      "tw:gap-2",
+      // spacing — default variant uses tighter radius and wider horizontal padding
+      "tw:py-2",
+      "tw:px-2",
+      "tw:group-data-[variant=default]/select-content:px-4",
+      "tw:rounded-lg",
+      "tw:group-data-[variant=default]/select-content:rounded-none",
+      // typography
+      "tw:text-sm",
+      "tw:select-none",
+      "tw:cursor-default",
+      "tw:outline-hidden",
+      // highlighted (keyboard / hover)
+      "tw:focus:outline-hidden",
+      "tw:data-[highlighted]:bg-accent",
+      "tw:group-data-[variant=default]/select-content:data-[highlighted]:bg-neutral-100",
+      "tw:data-[highlighted]:text-accent-foreground",
+      "tw:group-data-[variant=default]/select-content:data-[highlighted]:text-foreground",
+      // disabled
+      "tw:data-[disabled]:pointer-events-none",
+      "tw:data-[disabled]:opacity-50",
+      // child svg defaults
+      "tw:[&_svg]:pointer-events-none",
+      "tw:[&_svg]:shrink-0",
+      "tw:[&_svg]:text-muted-foreground",
+      "tw:[&_svg:not([class*='tw:size-'])]:size-4",
+      className
+    ),
+    children: [
+      icon,
+      /* @__PURE__ */ jsx("span", { className: "tw:flex-1 tw:truncate", children: /* @__PURE__ */ jsx(SelectPrimitive6.ItemText, { children }) }),
+      /* @__PURE__ */ jsx(SelectPrimitive6.ItemIndicator, { className: "tw:pointer-events-none", children: /* @__PURE__ */ jsx(Check, { className: "tw:size-4" }) })
+    ]
+  }
+);
+var SelectLabel = ({ className, ...props }) => /* @__PURE__ */ jsx(
+  SelectPrimitive6.Label,
+  {
+    ...props,
+    className: cn(
+      // Base (argo variant) — soft gray section label
+      "tw:px-2",
+      "tw:py-1.5",
+      "tw:text-xs",
+      "tw:font-medium",
+      "tw:leading-none",
+      "tw:text-muted-foreground",
+      // Default variant — uppercase tracked label, matches Combobox default
+      "tw:group-data-[variant=default]/select-content:uppercase",
+      "tw:group-data-[variant=default]/select-content:font-semibold",
+      "tw:group-data-[variant=default]/select-content:tracking-wider",
+      "tw:group-data-[variant=default]/select-content:text-[11px]",
+      "tw:group-data-[variant=default]/select-content:text-black",
+      "tw:group-data-[variant=default]/select-content:pt-2",
+      "tw:group-data-[variant=default]/select-content:px-4",
+      className
+    )
+  }
+);
+var SelectRoot = (props) => /* @__PURE__ */ jsx(Root, { ...props });
+var SelectSeparator = ({ className, ...props }) => /* @__PURE__ */ jsx(
+  SelectPrimitive6.Separator,
+  {
+    ...props,
+    className: cn("tw:mx-2 tw:my-1 tw:h-px tw:bg-border", className)
+  }
+);
+var SelectTrigger = ({
+  ref,
+  className,
+  variant,
+  state,
+  sizing,
+  placeholder,
+  ...props
+}) => {
+  const isArgoDesign = useArgoDesign();
+  const effectiveVariant = (() => {
+    if (variant === "inline") return "inline";
+    if (isArgoDesign) return "argo";
+    return variant;
+  })();
+  const isInlineVariant = effectiveVariant === "inline";
+  if (isInlineVariant)
+    return /* @__PURE__ */ jsx(SelectPrimitive6.Trigger, { ...props, ref, className: cn(className), asChild: true, children: /* @__PURE__ */ jsxs(Button, { variant: "inline", children: [
+      /* @__PURE__ */ jsx(SelectPrimitive6.Value, { placeholder }),
+      /* @__PURE__ */ jsx(SelectPrimitive6.Icon, { asChild: true, children: /* @__PURE__ */ jsx(ChevronDown, {}) })
+    ] }) });
+  return /* @__PURE__ */ jsxs(
+    SelectPrimitive6.Trigger,
+    {
+      ...props,
+      ref,
+      className: cn(
+        overlayTriggerVariants({ variant: effectiveVariant, state, sizing }),
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx(SelectPrimitive6.Value, { placeholder }),
+        /* @__PURE__ */ jsx(SelectPrimitive6.Icon, { asChild: true, children: /* @__PURE__ */ jsx(ChevronDown, { className: "tw:size-4 tw:text-muted-foreground" }) })
+      ]
+    }
+  );
+};
+var isGroup = (itemOrGroup) => "items" in itemOrGroup;
+var Select = ({
+  // root
+  value,
+  defaultValue,
+  onValueChange,
+  disabled,
+  name,
+  required,
+  open,
+  defaultOpen,
+  onOpenChange,
+  dir,
+  autoComplete,
+  form,
+  // trigger
+  variant,
+  state,
+  sizing,
+  placeholder,
+  id,
+  className,
+  onBlur,
+  "aria-describedby": ariaDescribedBy,
+  "aria-invalid": ariaInvalid,
+  "aria-required": ariaRequired,
+  // items
+  items = []
+}) => {
+  const groupKeyId = useId();
+  const renderItem = (item) => /* @__PURE__ */ jsx(
+    SelectItem,
+    {
+      value: item.value,
+      icon: item.icon,
+      disabled: item.disabled,
+      children: item.label
+    },
+    item.value
+  );
+  return /* @__PURE__ */ jsxs(
+    SelectRoot,
+    {
+      value,
+      defaultValue,
+      onValueChange,
+      disabled,
+      name,
+      required,
+      open,
+      defaultOpen,
+      onOpenChange,
+      dir,
+      autoComplete,
+      form,
+      children: [
+        /* @__PURE__ */ jsx(
+          SelectTrigger,
+          {
+            variant,
+            state,
+            sizing,
+            placeholder,
+            id,
+            className,
+            onBlur,
+            "aria-describedby": ariaDescribedBy,
+            "aria-invalid": ariaInvalid,
+            "aria-required": ariaRequired
+          }
+        ),
+        /* @__PURE__ */ jsx(SelectContent, { children: items.map((itemOrGroup, index) => {
+          if (isGroup(itemOrGroup)) {
+            return /* @__PURE__ */ jsxs(SelectGroup, { children: [
+              itemOrGroup.label && /* @__PURE__ */ jsx(SelectLabel, { children: itemOrGroup.label }),
+              itemOrGroup.items.map(renderItem)
+            ] }, `${groupKeyId}-group-${index}`);
+          }
+          return renderItem(itemOrGroup);
+        }) })
+      ]
+    }
+  );
+};
+Select.Root = SelectRoot;
+Select.Trigger = SelectTrigger;
+Select.Content = SelectContent;
+Select.Item = SelectItem;
+Select.Group = SelectGroup;
+Select.Label = SelectLabel;
+Select.Separator = SelectSeparator;
+
+export { Select };
+//# sourceMappingURL=chunk-M6LTUPVP.js.map
+//# sourceMappingURL=chunk-M6LTUPVP.js.map

package/dist/chunk-M6LTUPVP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Select/SelectContent.tsx","../src/components/Select/SelectGroup.tsx","../src/components/Select/SelectItem.tsx","../src/components/Select/SelectLabel.tsx","../src/components/Select/SelectRoot.tsx","../src/components/Select/SelectSeparator.tsx","../src/components/Select/SelectTrigger.tsx","../src/components/Select/Select.tsx"],"names":["SelectPrimitive","jsx","SelectPrimitive2","jsxs","SelectPrimitive3","SelectPrimitive4","SelectPrimitive5"],"mappings":"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","file":"chunk-M6LTUPVP.js","sourcesContent":["import type { ComponentProps } from 'react';\nimport * as SelectPrimitive from '@radix-ui/react-select';\n\nimport { ChevronDown, ChevronUp } from '../../icons';\nimport { cn } from '../../utils';\nimport { useArgoDesign } from '../ThemeProvider/context';\n\nconst scrollButtonStyles = cn(\n  'tw:flex',\n  'tw:items-center',\n  'tw:justify-center',\n  'tw:rounded-sm',\n  'tw:p-1',\n  'tw:[&_svg:not([class*=\"tw:size-\"])]:size-5',\n);\n\ntype Variant = 'default' | 'argo';\n\n/**\n * Props for `Select.Content`. `container` portals the listbox into a custom element (useful inside modals).\n */\ntype Props = ComponentProps<typeof SelectPrimitive.Content> & {\n  container?: HTMLElement | null;\n};\n\n/**\n * Listbox container for `Select`. Portals items into a popover sized to the trigger.\n * Normally rendered implicitly by `Select`; use directly only when composing custom item layouts via\n * the `Select.Root` / `Select.Trigger` / `Select.Content` compound parts.\n */\nexport const SelectContent = ({\n  ref,\n  className,\n  children,\n  container,\n  position = 'popper',\n  sideOffset = 4,\n  ...props\n}: Props) => {\n  const effectiveVariant: Variant = useArgoDesign() ? 'argo' : 'default';\n  return (\n    <SelectPrimitive.Portal container={container}>\n      <SelectPrimitive.Content\n        {...props}\n        ref={ref}\n        position={position}\n        sideOffset={sideOffset}\n        data-variant={effectiveVariant}\n        className={cn(\n          'tailwindcss-preflight',\n          'tw:group/select-content',\n          // Floating tier above Modal (1051): Tooltip 1060 / Combobox·Popover·Select 1055 / Modal 1051 / DropdownMenu.SubContent 1041 / FullScreenModal 1039\n          'tw:z-[1055]',\n\n          // layout\n          'tw:flex tw:flex-col',\n          'tw:p-1',\n          'tw:data-[variant=default]:p-0',\n          'tw:overflow-hidden',\n          'tw:origin-(--radix-select-content-transform-origin)',\n\n          // sizing\n          'tw:max-h-[var(--radix-select-content-available-height)]',\n          'tw:min-w-[var(--radix-select-trigger-width)]',\n\n          // appearance\n          'tw:bg-popover',\n          'tw:text-popover-foreground',\n          'tw:shadow-md',\n          'tw:ring-1',\n          'tw:ring-foreground/10',\n          'tw:rounded-lg',\n          'tw:data-[variant=default]:rounded',\n\n          // open animation\n          'tw:data-[state=open]:animate-in',\n          'tw:data-[state=open]:fade-in-0',\n          'tw:data-[state=open]:zoom-in-95',\n\n          // closed animation\n          'tw:data-[state=closed]:animate-out',\n          'tw:data-[state=closed]:fade-out-0',\n          'tw:data-[state=closed]:zoom-out-95',\n\n          // position animations\n          'tw:data-[side=bottom]:slide-in-from-top-2',\n          'tw:data-[side=left]:slide-in-from-right-2',\n          'tw:data-[side=right]:slide-in-from-left-2',\n          'tw:data-[side=top]:slide-in-from-bottom-2',\n          className,\n        )}\n      >\n        <SelectPrimitive.ScrollUpButton className={scrollButtonStyles}>\n          <ChevronUp />\n        </SelectPrimitive.ScrollUpButton>\n\n        <SelectPrimitive.Viewport\n          className={cn({\n            'tw:h-[var(--radix-select-trigger-height)] tw:w-full tw:min-w-[var(--radix-select-trigger-width)]':\n              position === 'popper',\n          })}\n        >\n          {children}\n        </SelectPrimitive.Viewport>\n\n        <SelectPrimitive.ScrollDownButton className={scrollButtonStyles}>\n          <ChevronDown />\n        </SelectPrimitive.ScrollDownButton>\n      </SelectPrimitive.Content>\n    </SelectPrimitive.Portal>\n  );\n};\n","import type { ComponentProps } from 'react';\nimport * as SelectPrimitive from '@radix-ui/react-select';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<typeof SelectPrimitive.Group>;\n\nexport const SelectGroup = ({ className, ...props }: Props) => (\n  <SelectPrimitive.Group {...props} className={cn('tw:flex tw:flex-col tw:gap-0.5', className)} />\n);\n","import type { ComponentProps, ReactNode } from 'react';\nimport * as SelectPrimitive from '@radix-ui/react-select';\n\nimport { Check } from '../../icons';\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<typeof SelectPrimitive.Item> & {\n  icon?: ReactNode;\n};\n\nexport const SelectItem = ({ ref, className, children, icon, ...props }: Props) => (\n  <SelectPrimitive.Item\n    {...props}\n    ref={ref}\n    className={cn(\n      'tw:group/select-item',\n\n      // layout\n      'tw:relative',\n      'tw:flex',\n      'tw:flex-1',\n      'tw:items-center',\n      'tw:gap-2',\n\n      // spacing — default variant uses tighter radius and wider horizontal padding\n      'tw:py-2',\n      'tw:px-2',\n      'tw:group-data-[variant=default]/select-content:px-4',\n      'tw:rounded-lg',\n      'tw:group-data-[variant=default]/select-content:rounded-none',\n\n      // typography\n      'tw:text-sm',\n      'tw:select-none',\n      'tw:cursor-default',\n      'tw:outline-hidden',\n\n      // highlighted (keyboard / hover)\n      'tw:focus:outline-hidden',\n      'tw:data-[highlighted]:bg-accent',\n      'tw:group-data-[variant=default]/select-content:data-[highlighted]:bg-neutral-100',\n      'tw:data-[highlighted]:text-accent-foreground',\n      'tw:group-data-[variant=default]/select-content:data-[highlighted]:text-foreground',\n\n      // disabled\n      'tw:data-[disabled]:pointer-events-none',\n      'tw:data-[disabled]:opacity-50',\n\n      // child svg defaults\n      'tw:[&_svg]:pointer-events-none',\n      'tw:[&_svg]:shrink-0',\n      'tw:[&_svg]:text-muted-foreground',\n      \"tw:[&_svg:not([class*='tw:size-'])]:size-4\",\n      className,\n    )}\n  >\n    {icon}\n    <span className=\"tw:flex-1 tw:truncate\">\n      <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n    </span>\n    <SelectPrimitive.ItemIndicator className=\"tw:pointer-events-none\">\n      <Check className=\"tw:size-4\" />\n    </SelectPrimitive.ItemIndicator>\n  </SelectPrimitive.Item>\n);\n","import type { ComponentProps } from 'react';\nimport * as SelectPrimitive from '@radix-ui/react-select';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<typeof SelectPrimitive.Label>;\n\nexport const SelectLabel = ({ className, ...props }: Props) => (\n  <SelectPrimitive.Label\n    {...props}\n    className={cn(\n      // Base (argo variant) — soft gray section label\n      'tw:px-2',\n      'tw:py-1.5',\n      'tw:text-xs',\n      'tw:font-medium',\n      'tw:leading-none',\n      'tw:text-muted-foreground',\n\n      // Default variant — uppercase tracked label, matches Combobox default\n      'tw:group-data-[variant=default]/select-content:uppercase',\n      'tw:group-data-[variant=default]/select-content:font-semibold',\n      'tw:group-data-[variant=default]/select-content:tracking-wider',\n      'tw:group-data-[variant=default]/select-content:text-[11px]',\n      'tw:group-data-[variant=default]/select-content:text-black',\n      'tw:group-data-[variant=default]/select-content:pt-2',\n      'tw:group-data-[variant=default]/select-content:px-4',\n\n      className,\n    )}\n  />\n);\n","import type { ReactNode } from 'react';\nimport { Root } from '@radix-ui/react-select';\n\n// Mirror Radix's `SelectProps` as an explicit list. We can't infer via\n// `ComponentProps<typeof Root>` or reuse Radix's `SelectProps` directly: both\n// transitively reference the un-exported `SelectSharedProps` interface, and\n// TS4023 fires when DTS emits anything that consumes it (e.g. `useAppForm`).\n// Keep this in sync with `@radix-ui/react-select`'s `SelectProps` shape.\nexport type SelectRootProps = {\n  // SelectSharedProps\n  children?: ReactNode;\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?(open: boolean): void;\n  dir?: 'ltr' | 'rtl';\n  name?: string;\n  autoComplete?: string;\n  disabled?: boolean;\n  required?: boolean;\n  form?: string;\n  // SelectProps\n  value?: string;\n  defaultValue?: string;\n  onValueChange?(value: string): void;\n};\n\nexport const SelectRoot = (props: SelectRootProps) => <Root {...props} />;\n","import type { ComponentProps } from 'react';\nimport * as SelectPrimitive from '@radix-ui/react-select';\n\nimport { cn } from '../../utils';\n\ntype Props = ComponentProps<typeof SelectPrimitive.Separator>;\n\nexport const SelectSeparator = ({ className, ...props }: Props) => (\n  <SelectPrimitive.Separator\n    {...props}\n    className={cn('tw:mx-2 tw:my-1 tw:h-px tw:bg-border', className)}\n  />\n);\n","import type { ComponentProps } from 'react';\nimport * as SelectPrimitive from '@radix-ui/react-select';\nimport { type VariantProps } from 'class-variance-authority';\n\nimport { ChevronDown } from '../../icons';\nimport { cn } from '../../utils';\nimport { Button } from '../Button';\nimport { overlayTriggerVariants } from '../OverlayTrigger/styles';\nimport { useArgoDesign } from '../ThemeProvider/context';\n\ntype Props = ComponentProps<typeof SelectPrimitive.Trigger> &\n  Omit<VariantProps<typeof overlayTriggerVariants>, 'variant'> & {\n    variant?: Exclude<VariantProps<typeof overlayTriggerVariants>['variant'], 'argo'> | 'inline';\n  } & Pick<ComponentProps<typeof SelectPrimitive.Value>, 'placeholder'>;\n\nexport const SelectTrigger = ({\n  ref,\n  className,\n  variant,\n  state,\n  sizing,\n  placeholder,\n  ...props\n}: Props) => {\n  const isArgoDesign = useArgoDesign();\n  const effectiveVariant = (() => {\n    if (variant === 'inline') return 'inline';\n    if (isArgoDesign) return 'argo';\n    return variant;\n  })();\n  const isInlineVariant = effectiveVariant === 'inline';\n\n  if (isInlineVariant)\n    return (\n      <SelectPrimitive.Trigger {...props} ref={ref} className={cn(className)} asChild>\n        <Button variant=\"inline\">\n          <SelectPrimitive.Value placeholder={placeholder} />\n          <SelectPrimitive.Icon asChild>\n            <ChevronDown />\n          </SelectPrimitive.Icon>\n        </Button>\n      </SelectPrimitive.Trigger>\n    );\n\n  return (\n    <SelectPrimitive.Trigger\n      {...props}\n      ref={ref}\n      className={cn(\n        overlayTriggerVariants({ variant: effectiveVariant, state, sizing }),\n        className,\n      )}\n    >\n      <SelectPrimitive.Value placeholder={placeholder} />\n      <SelectPrimitive.Icon asChild>\n        <ChevronDown className=\"tw:size-4 tw:text-muted-foreground\" />\n      </SelectPrimitive.Icon>\n    </SelectPrimitive.Trigger>\n  );\n};\n","import { useId } from 'react';\nimport type { ComponentProps, ReactNode } from 'react';\n\nimport { SelectContent } from './SelectContent';\nimport { SelectGroup } from './SelectGroup';\nimport { SelectItem as SelectItemComponent } from './SelectItem';\nimport { SelectLabel } from './SelectLabel';\nimport { SelectRoot, type SelectRootProps } from './SelectRoot';\nimport { SelectSeparator } from './SelectSeparator';\nimport { SelectTrigger } from './SelectTrigger';\n\nexport type SelectItem = {\n  value: string;\n  label: ReactNode;\n  icon?: ReactNode;\n  disabled?: boolean;\n};\n\nexport type SelectItemGroup = {\n  label?: ReactNode;\n  items: readonly SelectItem[];\n};\n\nconst isGroup = (itemOrGroup: SelectItem | SelectItemGroup): itemOrGroup is SelectItemGroup =>\n  'items' in itemOrGroup;\n\ntype TriggerProps = ComponentProps<typeof SelectTrigger>;\n\ntype Props = Pick<\n  SelectRootProps,\n  | 'value'\n  | 'defaultValue'\n  | 'onValueChange'\n  | 'disabled'\n  | 'name'\n  | 'required'\n  | 'open'\n  | 'defaultOpen'\n  | 'onOpenChange'\n  | 'dir'\n  | 'autoComplete'\n  | 'form'\n> &\n  Pick<\n    TriggerProps,\n    | 'variant'\n    | 'state'\n    | 'sizing'\n    | 'placeholder'\n    | 'id'\n    | 'className'\n    | 'onBlur'\n    | 'aria-describedby'\n    | 'aria-invalid'\n    | 'aria-required'\n  > & {\n    items?: readonly (SelectItem | SelectItemGroup)[];\n  };\n\n/**\n * Single selection from a short enumerated list. Built on Radix Select.\n *\n * **When to use:** picking one value from ~10 or fewer options where search adds no value (status,\n * region, role). Pass a flat `items` array or grouped arrays with optional labels for headings.\n * **When NOT to use:** for longer lists with search use `Combobox`; for multi-select use `MultiCombobox`.\n * **Composition:** wrap in `FormGroup` for label + help text, or use `useAppForm` + `field.SelectField`\n * for forms with validation. Use the compound parts (`Select.Root`, `Select.Trigger`, `Select.Content`,\n * `Select.Item`) for custom item layouts; the top-level `Select` covers the common cases.\n */\nexport const Select = ({\n  // root\n  value,\n  defaultValue,\n  onValueChange,\n  disabled,\n  name,\n  required,\n  open,\n  defaultOpen,\n  onOpenChange,\n  dir,\n  autoComplete,\n  form,\n  // trigger\n  variant,\n  state,\n  sizing,\n  placeholder,\n  id,\n  className,\n  onBlur,\n  'aria-describedby': ariaDescribedBy,\n  'aria-invalid': ariaInvalid,\n  'aria-required': ariaRequired,\n  // items\n  items = [],\n}: Props) => {\n  const groupKeyId = useId();\n\n  const renderItem = (item: SelectItem) => (\n    <SelectItemComponent\n      key={item.value}\n      value={item.value}\n      icon={item.icon}\n      disabled={item.disabled}\n    >\n      {item.label}\n    </SelectItemComponent>\n  );\n\n  return (\n    <SelectRoot\n      value={value}\n      defaultValue={defaultValue}\n      onValueChange={onValueChange}\n      disabled={disabled}\n      name={name}\n      required={required}\n      open={open}\n      defaultOpen={defaultOpen}\n      onOpenChange={onOpenChange}\n      dir={dir}\n      autoComplete={autoComplete}\n      form={form}\n    >\n      <SelectTrigger\n        variant={variant}\n        state={state}\n        sizing={sizing}\n        placeholder={placeholder}\n        id={id}\n        className={className}\n        onBlur={onBlur}\n        aria-describedby={ariaDescribedBy}\n        aria-invalid={ariaInvalid}\n        aria-required={ariaRequired}\n      />\n      <SelectContent>\n        {items.map((itemOrGroup, index) => {\n          if (isGroup(itemOrGroup)) {\n            return (\n              <SelectGroup key={`${groupKeyId}-group-${index}`}>\n                {itemOrGroup.label && <SelectLabel>{itemOrGroup.label}</SelectLabel>}\n                {itemOrGroup.items.map(renderItem)}\n              </SelectGroup>\n            );\n          }\n\n          return renderItem(itemOrGroup);\n        })}\n      </SelectContent>\n    </SelectRoot>\n  );\n};\n\nSelect.Root = SelectRoot;\nSelect.Trigger = SelectTrigger;\nSelect.Content = SelectContent;\nSelect.Item = SelectItemComponent;\nSelect.Group = SelectGroup;\nSelect.Label = SelectLabel;\nSelect.Separator = SelectSeparator;\n"]}

package/dist/chunk-MA6RRHDT.js

@@ -0,0 +1,291 @@
+import { ZoomableSvg } from './chunk-SVBSNSD4.js';
+import { DiagramSkeleton } from './chunk-SFFF2WQP.js';
+import { useThemeAttributes, createTokenResolver } from './chunk-IIS7INHF.js';
+import { cn } from './chunk-LXLIQ2D6.js';
+import { useId, useState, useRef, useEffect } from 'react';
+import { renderMermaidSVG } from 'beautiful-mermaid';
+import { jsx } from 'react/jsx-runtime';
+
+// src/blocks/MermaidDiagram/mermaidTheme.ts
+var DIAGRAM_FONT = "Inter, system-ui, sans-serif";
+var FALLBACK_CHANNELS = {
+  card: { light: "255 255 255", dark: "34 34 40" },
+  "card-foreground": { light: "30 41 59", dark: "229 230 236" },
+  foreground: { light: "30 41 59", dark: "229 230 236" },
+  muted: { light: "241 245 249", dark: "38 38 45" },
+  "muted-foreground": { light: "100 116 139", dark: "141 144 153" },
+  border: { light: "229 231 235", dark: "52 53 62" },
+  primary: { light: "37 99 235", dark: "31 143 255" },
+  accent: { light: "224 242 254", dark: "30 58 95" },
+  "accent-foreground": { light: "13 65 127", dark: "147 197 253" },
+  warning: { light: "138 82 16", dark: "255 190 92" },
+  success: { light: "24 122 76", dark: "62 207 127" },
+  destructive: { light: "220 38 38", dark: "229 72 77" }
+};
+var tokenReader = (scheme) => {
+  const resolve = createTokenResolver();
+  return (name, alpha) => resolve(name, FALLBACK_CHANNELS[name][scheme], alpha);
+};
+var fastRenderOptions = (scheme) => {
+  const token = tokenReader(scheme);
+  return {
+    bg: token("card"),
+    fg: token("foreground"),
+    line: token("border"),
+    accent: token("primary"),
+    muted: token("muted-foreground"),
+    surface: token("muted"),
+    border: token("border"),
+    transparent: true,
+    font: DIAGRAM_FONT
+  };
+};
+var mermaidConfig = (scheme) => {
+  const token = tokenReader(scheme);
+  const surface = token("accent");
+  const onSurface = token("accent-foreground");
+  const container = token("card");
+  const onContainer = token("card-foreground");
+  const line = token("border");
+  const stroke = token("primary");
+  const text = token("foreground");
+  return {
+    startOnLoad: false,
+    securityLevel: "strict",
+    theme: "base",
+    themeVariables: {
+      darkMode: scheme === "dark",
+      background: container,
+      primaryColor: surface,
+      primaryTextColor: onSurface,
+      primaryBorderColor: stroke,
+      secondaryColor: container,
+      secondaryTextColor: onContainer,
+      secondaryBorderColor: line,
+      tertiaryColor: token("warning", 0.15),
+      tertiaryTextColor: token("warning"),
+      tertiaryBorderColor: token("warning"),
+      lineColor: line,
+      textColor: text,
+      mainBkg: surface,
+      nodeBorder: stroke,
+      clusterBkg: container,
+      clusterBorder: line,
+      titleColor: text,
+      edgeLabelBackground: container,
+      nodeTextColor: onSurface,
+      actorBorder: stroke,
+      actorBkg: surface,
+      actorTextColor: onSurface,
+      actorLineColor: line,
+      signalColor: text,
+      signalTextColor: text,
+      labelBoxBkgColor: surface,
+      labelBoxBorderColor: stroke,
+      labelTextColor: onSurface,
+      loopTextColor: text,
+      noteBorderColor: token("warning"),
+      noteBkgColor: token("warning", 0.15),
+      noteTextColor: text,
+      sectionBkgColor: surface,
+      altSectionBkgColor: container,
+      sectionBkgColor2: token("muted"),
+      taskBorderColor: stroke,
+      taskBkgColor: surface,
+      taskTextColor: onSurface,
+      taskTextDarkColor: text,
+      taskTextLightColor: text,
+      activeTaskBorderColor: stroke,
+      activeTaskBkgColor: token("primary", 0.25),
+      doneTaskBorderColor: token("success"),
+      doneTaskBkgColor: token("success", 0.15),
+      critBorderColor: token("destructive"),
+      critBkgColor: token("destructive", 0.15),
+      fontFamily: DIAGRAM_FONT,
+      fontSize: "14px"
+    }
+  };
+};
+
+// src/blocks/MermaidDiagram/svgTransforms.ts
+var HTML_TAG = /<[^>]+>/g;
+var FOREIGN_OBJECT = /(<foreignObject\b[^>]*>)([\s\S]*?)(<\/foreignObject>)/g;
+var ROOT_SVG_TAG = /^(\s*<svg\b)([^>]*)(>)/i;
+var flattenForeignObjectLabels = (svg) => svg.replace(FOREIGN_OBJECT, (_match, open, inner, close) => {
+  const text = inner.replace(HTML_TAG, " ").replace(/\s+/g, " ").trim();
+  return `${open}${text}${close}`;
+});
+var STYLE_ATTR = /\s+style="([^"]*)"/i;
+var makeResponsive = (svgString) => {
+  const viewBoxMatch = svgString.match(/viewBox="[^"]*\s([\d.]+)\s[\d.]+"/);
+  const vbWidth = viewBoxMatch ? Math.round(Number(viewBoxMatch[1])) : void 0;
+  return svgString.replace(ROOT_SVG_TAG, (_match, open, attrs, close) => {
+    const existingStyle = attrs.match(STYLE_ATTR)?.[1] ?? "";
+    const styleDecls = existingStyle.replace(/max-width:\s*[^;"]*;?\s*/gi, "").replace(/\s+/g, " ").trim().replace(/;$/, "");
+    let nextAttrs = attrs.replace(/\s+width="[^"]*"/i, "").replace(/\s+height="[^"]*"/i, "").replace(STYLE_ATTR, "");
+    nextAttrs += ' width="100%"';
+    const styleParts = [styleDecls, vbWidth ? `max-width: ${vbWidth}px` : ""].filter(Boolean).join("; ");
+    if (styleParts) nextAttrs += ` style="${styleParts}"`;
+    return `${open}${nextAttrs}${close}`;
+  });
+};
+var ROOT_VIEWBOX = /^\s*<svg\b[^>]*\sviewBox\s*=\s*(["'])\s*[\d.eE+-]+\s+[\d.eE+-]+\s+([\d.eE+-]+)\s+([\d.eE+-]+)\s*\1/i;
+var hasDrawnContent = (svg) => {
+  const viewBox = svg.match(ROOT_VIEWBOX);
+  if (!viewBox) return true;
+  return Number(viewBox[2]) > 0 && Number(viewBox[3]) > 0;
+};
+var mermaidPromise = null;
+var registerLucideIconPack = (m) => {
+  m.registerIconPacks([
+    {
+      name: "lucide",
+      loader: () => import('@iconify-json/lucide/icons.json').then((mod) => mod.default)
+    }
+  ]);
+};
+var getMermaid = () => {
+  if (!mermaidPromise) {
+    mermaidPromise = import('mermaid').then((m) => {
+      registerLucideIconPack(m.default);
+      return m;
+    }).catch((err) => {
+      mermaidPromise = null;
+      throw err;
+    });
+  }
+  return mermaidPromise;
+};
+var stripFontImports = (svg) => svg.replace(/@import\s+url\([^)]*fonts\.googleapis\.com[^)]*\);?\s*/g, "");
+var hasIconSyntax = (code) => /@\{[^}]*\bicon\s*:/.test(code) || /\b(?:icon|service|group)\b[^\n(]*\(\s*[\w-]+:/.test(code) || /\bfa[bslr]?:fa-/.test(code);
+var tryFastRender = (code, scheme) => {
+  if (hasIconSyntax(code)) return null;
+  try {
+    const svg = stripFontImports(renderMermaidSVG(code, fastRenderOptions(scheme)));
+    return hasDrawnContent(svg) ? svg : null;
+  } catch (err) {
+    console.debug("[MermaidDiagram] fast render unavailable, using async fallback:", err);
+    return null;
+  }
+};
+var isTruncatedDiagram = (err) => typeof err === "object" && err !== null && "hash" in err ? err.hash?.token === 1 : false;
+var RENDER_DEBOUNCE_MS = 300;
+var TRUNCATION_GRACE_MS = 2e3;
+var svgCache = /* @__PURE__ */ new Map();
+var diagramCacheKey = (code, themeKey) => `${themeKey}
+${code}`;
+var resolveSyncSvg = (code, cacheKey, scheme) => {
+  const cached = svgCache.get(cacheKey);
+  if (cached) return cached;
+  const fast = tryFastRender(code, scheme);
+  if (fast) svgCache.set(cacheKey, fast);
+  return fast;
+};
+var MermaidDiagram = ({ code, renderActions }) => {
+  const id = useId();
+  const { scheme, cacheKey: themeKey } = useThemeAttributes();
+  const cacheKey = diagramCacheKey(code, themeKey);
+  const [svg, setSvg] = useState(() => resolveSyncSvg(code, cacheKey, scheme));
+  const [renderFailed, setRenderFailed] = useState(false);
+  const [truncated, setTruncated] = useState(false);
+  const debounceRef = useRef(null);
+  const renderIdRef = useRef(0);
+  const [prevKey, setPrevKey] = useState(cacheKey);
+  if (cacheKey !== prevKey) {
+    setPrevKey(cacheKey);
+    setSvg(resolveSyncSvg(code, cacheKey, scheme));
+    setRenderFailed(false);
+    setTruncated(false);
+  }
+  useEffect(() => {
+    if (svgCache.has(cacheKey)) return;
+    const currentRenderId = ++renderIdRef.current;
+    if (debounceRef.current) {
+      clearTimeout(debounceRef.current);
+    }
+    debounceRef.current = setTimeout(() => {
+      getMermaid().then(async (mermaidModule) => {
+        if (renderIdRef.current !== currentRenderId) return;
+        const rendererId = `mermaid-${id.replaceAll(":", "")}`;
+        const container = document.createElement("div");
+        container.style.visibility = "hidden";
+        container.style.position = "absolute";
+        container.style.top = "-9999px";
+        container.style.width = "900px";
+        document.body.appendChild(container);
+        mermaidModule.default.initialize(mermaidConfig(scheme));
+        try {
+          const result = await mermaidModule.default.render(rendererId, code, container);
+          if (renderIdRef.current === currentRenderId && result) {
+            const svgOutput = flattenForeignObjectLabels(result.svg);
+            svgCache.set(cacheKey, svgOutput);
+            setSvg(svgOutput);
+            setRenderFailed(false);
+            setTruncated(false);
+          }
+        } finally {
+          container.remove();
+        }
+      }).catch((err) => {
+        if (renderIdRef.current !== currentRenderId) return;
+        setSvg(null);
+        if (isTruncatedDiagram(err)) {
+          console.debug("[MermaidDiagram] incomplete diagram, awaiting more input:", err);
+          setTruncated(true);
+          return;
+        }
+        console.error("[MermaidDiagram] fallback failed:", err);
+        setRenderFailed(true);
+      });
+    }, RENDER_DEBOUNCE_MS);
+    const timer = debounceRef.current;
+    const renderId = renderIdRef;
+    return () => {
+      renderId.current++;
+      if (timer) {
+        clearTimeout(timer);
+      }
+    };
+  }, [cacheKey, code, id, scheme]);
+  useEffect(() => {
+    if (!truncated) return;
+    const timer = setTimeout(() => setRenderFailed(true), TRUNCATION_GRACE_MS);
+    return () => clearTimeout(timer);
+  }, [truncated, cacheKey]);
+  const processedSvg = svg ? makeResponsive(svg) : null;
+  if (renderFailed) {
+    return /* @__PURE__ */ jsx(
+      "pre",
+      {
+        className: cn(
+          "tw:my-3 tw:overflow-auto tw:whitespace-pre-wrap tw:break-all",
+          "tw:py-3 tw:px-4",
+          "tw:bg-muted",
+          "tw:rounded-md tw:text-muted-foreground",
+          "tw:text-sm tw:font-mono"
+        ),
+        children: /* @__PURE__ */ jsx("code", { children: code })
+      }
+    );
+  }
+  if (processedSvg) {
+    return /* @__PURE__ */ jsx(
+      ZoomableSvg,
+      {
+        html: processedSvg,
+        copyText: `\`\`\`mermaid
+${code}
+\`\`\``,
+        className: "tw:my-3",
+        allowForeignObject: true,
+        renderActions
+      },
+      code
+    );
+  }
+  return /* @__PURE__ */ jsx(DiagramSkeleton, {});
+};
+
+export { MermaidDiagram };
+//# sourceMappingURL=chunk-MA6RRHDT.js.map
+//# sourceMappingURL=chunk-MA6RRHDT.js.map