@mastra/playground-ui 36.1.0-alpha.2 → 37.0.0-alpha.4

package/dist/input-group-iZZD8Z65.js

@@ -0,0 +1,219 @@
+import { jsx } from 'react/jsx-runtime';
+import { c as cva } from './index-CSm06eOE.js';
+import * as React from 'react';
+import { B as Button } from './Button-DUxP65eY.js';
+import { c as controlHeight } from './control-size-BdDLgGX4.js';
+import { b as inputFocusBorderWithin, d as inputHoverBorderWithin } from './form-element-DUtZESwq.js';
+import { t as transitions } from './transitions-tFfqxz40.js';
+import { c as cn } from './cn-BakJzhuv.js';
+
+const inputGroupBaseClassName = cn(
+  // `flex-1` (not `min-w-0`) lets the root fill a flex row while keeping its content-floor
+  // so it never collapses to 0. `items-center` centres the control: it carries its own
+  // h-form-* (2px taller than the root's content box), so stretch would push its text low
+  // / overflow the bottom border, while centring overlaps the (transparent) borders cleanly.
+  "group/input-group relative flex w-full flex-1 items-center",
+  "border border-border1 text-neutral6",
+  transitions.all,
+  "has-[:disabled]:opacity-50 has-[:disabled]:cursor-not-allowed",
+  "has-[[aria-invalid=true]]:border-error",
+  // Height is on the root (border-box) so the group matches a same-size sibling control.
+  // Auto height when vertical (block-* addon) or wrapping a textarea.
+  "has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-start]]:h-auto",
+  "has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-end]]:h-auto",
+  "has-[textarea]:h-auto",
+  "has-[>[data-align=inline-start]]:[&>[data-slot=input-group-control]]:pl-0",
+  "has-[>[data-align=inline-end]]:[&>[data-slot=input-group-control]]:pr-0",
+  // In flex-col, flex-1 zeroes the control's height; force flex-none + w-full instead.
+  "has-[>[data-align=block-start]]:[&>[data-slot=input-group-control]]:flex-none has-[>[data-align=block-start]]:[&>[data-slot=input-group-control]]:w-full",
+  "has-[>[data-align=block-end]]:[&>[data-slot=input-group-control]]:flex-none has-[>[data-align=block-end]]:[&>[data-slot=input-group-control]]:w-full"
+);
+const inputGroupRoundedTextareaClassName = cn(
+  // Pill (rounded-full) only fits single-line inline shapes. Fall back to rounded-xl
+  // whenever the group goes vertical (block-* addon) or wraps a textarea.
+  "has-[>[data-align=block-start]]:rounded-xl",
+  "has-[>[data-align=block-end]]:rounded-xl",
+  "has-[textarea]:rounded-xl"
+);
+const inputGroupFilledVariant = cn(
+  "bg-surface-overlay-soft rounded-full",
+  "hover:bg-surface-overlay-strong",
+  inputHoverBorderWithin,
+  "outline-hidden focus-within:outline-hidden focus-within:bg-surface-overlay-strong",
+  inputFocusBorderWithin,
+  inputGroupRoundedTextareaClassName
+);
+const inputGroupVariants = cva(inputGroupBaseClassName, {
+  variants: {
+    variant: {
+      default: inputGroupFilledVariant,
+      filled: inputGroupFilledVariant,
+      outline: cn(
+        "bg-transparent rounded-full",
+        inputHoverBorderWithin,
+        "outline-hidden focus-within:outline-hidden",
+        inputFocusBorderWithin,
+        inputGroupRoundedTextareaClassName
+      )
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+});
+const InputGroup = React.forwardRef(
+  ({ className, size = "md", variant, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        role: "group",
+        "data-slot": "input-group",
+        "data-size": size,
+        className: cn(inputGroupVariants({ variant }), controlHeight[size], className),
+        ...props
+      }
+    );
+  }
+);
+InputGroup.displayName = "InputGroup";
+const inputGroupAddonVariants = cva(
+  cn(
+    "flex items-center justify-center gap-2 text-neutral3 select-none",
+    "group-has-[:disabled]/input-group:opacity-50",
+    "[&>svg:not([class*='size-'])]:size-4"
+  ),
+  {
+    variants: {
+      align: {
+        "inline-start": "order-first pl-3 pr-1 has-[>button]:pl-1",
+        "inline-end": "order-last pr-3 pl-1 has-[>button]:pr-1",
+        "block-start": "order-first w-full justify-start px-3 pt-2 pb-1 border-b border-border1",
+        "block-end": "order-last w-full justify-start px-3 pb-2 pt-1 border-t border-border1"
+      }
+    },
+    defaultVariants: {
+      align: "inline-start"
+    }
+  }
+);
+const InputGroupAddon = React.forwardRef(
+  ({ className, align = "inline-start", onClick, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        role: "group",
+        "data-slot": "input-group-addon",
+        "data-align": align,
+        className: cn(inputGroupAddonVariants({ align }), className),
+        onClick: (event) => {
+          const target = event.target;
+          if (!target.closest('button, input, textarea, [role="button"]')) {
+            event.currentTarget.parentElement?.querySelector("[data-slot=input-group-control]")?.focus();
+          }
+          onClick?.(event);
+        },
+        ...props
+      }
+    );
+  }
+);
+InputGroupAddon.displayName = "InputGroupAddon";
+const inputGroupControlHeightBySize = cn(
+  "group-data-[size=xs]/input-group:h-form-xs",
+  "group-data-[size=sm]/input-group:h-form-sm",
+  "group-data-[size=md]/input-group:h-form-md",
+  "group-data-[size=default]/input-group:h-form-default",
+  "group-data-[size=lg]/input-group:h-form-lg"
+);
+const inputGroupControlTextBySize = cn(
+  "group-data-[size=xs]/input-group:text-ui-xs",
+  "group-data-[size=sm]/input-group:text-ui-sm",
+  "group-data-[size=md]/input-group:text-ui-md",
+  "group-data-[size=default]/input-group:text-ui-md",
+  "group-data-[size=lg]/input-group:text-ui-lg"
+);
+const InputGroupInput = React.forwardRef(
+  ({ className, testId, error, type = "text", ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "input",
+      {
+        ref,
+        type,
+        "data-slot": "input-group-control",
+        "data-testid": testId,
+        "aria-invalid": error,
+        className: cn(
+          // Height matches the root box (which is fixed/border-box, so it doesn't grow);
+          // this also keeps the control from collapsing in block mode (flex-col).
+          "flex-1 min-w-0 bg-transparent text-neutral6 px-3 outline-hidden",
+          inputGroupControlHeightBySize,
+          inputGroupControlTextBySize,
+          "placeholder:text-neutral2 placeholder:transition-opacity placeholder:duration-normal",
+          "focus:placeholder:opacity-70",
+          "disabled:cursor-not-allowed",
+          // Hide native number-spinner arrows so consumers can compose their own
+          // stepper (see the NumberWithStepper story). WebKit uses the spin-button
+          // pseudo-elements; Firefox needs `appearance: textfield` on the input.
+          "[&::-webkit-outer-spin-button]:appearance-none [&::-webkit-outer-spin-button]:m-0",
+          "[&::-webkit-inner-spin-button]:appearance-none [&::-webkit-inner-spin-button]:m-0",
+          "[&[type=number]]:[appearance:textfield]",
+          // type="search": drop WebKit's native clear button so it doesn't double up with a
+          // custom clear control (e.g. the scorers toolbar's InputGroupButton).
+          "[&::-webkit-search-cancel-button]:appearance-none",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+InputGroupInput.displayName = "InputGroupInput";
+const InputGroupTextarea = React.forwardRef(
+  ({ className, testId, error, ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "textarea",
+      {
+        ref,
+        "data-slot": "input-group-control",
+        "data-testid": testId,
+        "aria-invalid": error,
+        className: cn(
+          "flex-1 min-w-0 min-h-[60px] resize-y bg-transparent text-neutral6 px-3 py-2 outline-hidden",
+          inputGroupControlTextBySize,
+          "placeholder:text-neutral2 placeholder:transition-opacity placeholder:duration-normal",
+          "focus:placeholder:opacity-70",
+          "disabled:cursor-not-allowed",
+          className
+        ),
+        ...props
+      }
+    );
+  }
+);
+InputGroupTextarea.displayName = "InputGroupTextarea";
+const InputGroupText = React.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      ref,
+      className: cn(
+        "flex items-center gap-2 text-ui-sm text-neutral3 [&_svg]:pointer-events-none",
+        "[&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props
+    }
+  );
+});
+InputGroupText.displayName = "InputGroupText";
+const InputGroupButton = React.forwardRef(
+  ({ size = "icon-sm", variant = "ghost", type = "button", ...props }, ref) => {
+    return /* @__PURE__ */ jsx(Button, { ref, type, size, variant, ...props });
+  }
+);
+InputGroupButton.displayName = "InputGroupButton";
+
+export { InputGroup as I, InputGroupAddon as a, InputGroupButton as b, InputGroupInput as c, InputGroupText as d, InputGroupTextarea as e };
+//# sourceMappingURL=input-group-iZZD8Z65.js.map

package/dist/input-group-iZZD8Z65.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-group-iZZD8Z65.js","sources":["../src/ds/components/InputGroup/input-group.tsx"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport type { VariantProps } from 'class-variance-authority';\nimport * as React from 'react';\n\nimport { Button } from '@/ds/components/Button';\nimport type { ButtonProps } from '@/ds/components/Button/Button';\nimport { controlHeight } from '@/ds/primitives/control-size';\nimport type { ControlSize } from '@/ds/primitives/control-size';\nimport { inputFocusBorderWithin, inputHoverBorderWithin } from '@/ds/primitives/form-element';\nimport { transitions } from '@/ds/primitives/transitions';\nimport { cn } from '@/lib/utils';\n\n// No React context: size flows via `data-size` on the named group root\n// (`group/input-group`) and is read by the control through `group-data-[size=…]`\n// variants — mirrors shadcn's data-slot/data-* convention and removes prop drilling.\n\nconst inputGroupBaseClassName = cn(\n  // `flex-1` (not `min-w-0`) lets the root fill a flex row while keeping its content-floor\n  // so it never collapses to 0. `items-center` centres the control: it carries its own\n  // h-form-* (2px taller than the root's content box), so stretch would push its text low\n  // / overflow the bottom border, while centring overlaps the (transparent) borders cleanly.\n  'group/input-group relative flex w-full flex-1 items-center',\n  'border border-border1 text-neutral6',\n  transitions.all,\n  'has-[:disabled]:opacity-50 has-[:disabled]:cursor-not-allowed',\n  'has-[[aria-invalid=true]]:border-error',\n  // Height is on the root (border-box) so the group matches a same-size sibling control.\n  // Auto height when vertical (block-* addon) or wrapping a textarea.\n  'has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-start]]:h-auto',\n  'has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-end]]:h-auto',\n  'has-[textarea]:h-auto',\n  'has-[>[data-align=inline-start]]:[&>[data-slot=input-group-control]]:pl-0',\n  'has-[>[data-align=inline-end]]:[&>[data-slot=input-group-control]]:pr-0',\n  // In flex-col, flex-1 zeroes the control's height; force flex-none + w-full instead.\n  'has-[>[data-align=block-start]]:[&>[data-slot=input-group-control]]:flex-none has-[>[data-align=block-start]]:[&>[data-slot=input-group-control]]:w-full',\n  'has-[>[data-align=block-end]]:[&>[data-slot=input-group-control]]:flex-none has-[>[data-align=block-end]]:[&>[data-slot=input-group-control]]:w-full',\n);\n\nconst inputGroupRoundedTextareaClassName = cn(\n  // Pill (rounded-full) only fits single-line inline shapes. Fall back to rounded-xl\n  // whenever the group goes vertical (block-* addon) or wraps a textarea.\n  'has-[>[data-align=block-start]]:rounded-xl',\n  'has-[>[data-align=block-end]]:rounded-xl',\n  'has-[textarea]:rounded-xl',\n);\n\n// `default` and `filled` are the same filled surface on purpose (the default look IS\n// the filled treatment; `filled` is an explicit alias). Share the string so they can't\n// drift. Focus brightens the border (inputFocusBorderWithin) for WCAG-visible focus.\nconst inputGroupFilledVariant = cn(\n  'bg-surface-overlay-soft rounded-full',\n  'hover:bg-surface-overlay-strong',\n  inputHoverBorderWithin,\n  'outline-hidden focus-within:outline-hidden focus-within:bg-surface-overlay-strong',\n  inputFocusBorderWithin,\n  inputGroupRoundedTextareaClassName,\n);\n\nconst inputGroupVariants = cva(inputGroupBaseClassName, {\n  variants: {\n    variant: {\n      default: inputGroupFilledVariant,\n      filled: inputGroupFilledVariant,\n      outline: cn(\n        'bg-transparent rounded-full',\n        inputHoverBorderWithin,\n        'outline-hidden focus-within:outline-hidden',\n        inputFocusBorderWithin,\n        inputGroupRoundedTextareaClassName,\n      ),\n    },\n  },\n  defaultVariants: {\n    variant: 'default',\n  },\n});\n\nexport type InputGroupProps = React.ComponentPropsWithoutRef<'div'> & {\n  size?: ControlSize;\n} & VariantProps<typeof inputGroupVariants>;\n\nconst InputGroup = React.forwardRef<HTMLDivElement, InputGroupProps>(\n  ({ className, size = 'md', variant, ...props }, ref) => {\n    return (\n      <div\n        ref={ref}\n        role=\"group\"\n        data-slot=\"input-group\"\n        data-size={size}\n        className={cn(inputGroupVariants({ variant }), controlHeight[size], className)}\n        {...props}\n      />\n    );\n  },\n);\nInputGroup.displayName = 'InputGroup';\n\nconst inputGroupAddonVariants = cva(\n  cn(\n    'flex items-center justify-center gap-2 text-neutral3 select-none',\n    'group-has-[:disabled]/input-group:opacity-50',\n    \"[&>svg:not([class*='size-'])]:size-4\",\n  ),\n  {\n    variants: {\n      align: {\n        'inline-start': 'order-first pl-3 pr-1 has-[>button]:pl-1',\n        'inline-end': 'order-last pr-3 pl-1 has-[>button]:pr-1',\n        'block-start': 'order-first w-full justify-start px-3 pt-2 pb-1 border-b border-border1',\n        'block-end': 'order-last w-full justify-start px-3 pb-2 pt-1 border-t border-border1',\n      },\n    },\n    defaultVariants: {\n      align: 'inline-start',\n    },\n  },\n);\n\nexport type InputGroupAddonProps = React.ComponentPropsWithoutRef<'div'> & VariantProps<typeof inputGroupAddonVariants>;\n\nconst InputGroupAddon = React.forwardRef<HTMLDivElement, InputGroupAddonProps>(\n  ({ className, align = 'inline-start', onClick, ...props }, ref) => {\n    return (\n      <div\n        ref={ref}\n        role=\"group\"\n        data-slot=\"input-group-addon\"\n        data-align={align}\n        className={cn(inputGroupAddonVariants({ align }), className)}\n        onClick={event => {\n          // Click on non-interactive addon area focuses the control inside the group.\n          // Skip when a button/input handled the click itself.\n          const target = event.target as HTMLElement;\n          if (!target.closest('button, input, textarea, [role=\"button\"]')) {\n            event.currentTarget.parentElement\n              ?.querySelector<HTMLInputElement | HTMLTextAreaElement>('[data-slot=input-group-control]')\n              ?.focus();\n          }\n          onClick?.(event);\n        }}\n        {...props}\n      />\n    );\n  },\n);\nInputGroupAddon.displayName = 'InputGroupAddon';\n\n// Size flows from the parent group's `data-size` (no React context). All four sizes are\n// written out so Tailwind's scanner emits them. The control mirrors the root height so it\n// doesn't collapse to the line-height in block mode (flex-col + flex-none); the root's\n// explicit border-box height means this never makes the group grow.\nconst inputGroupControlHeightBySize = cn(\n  'group-data-[size=xs]/input-group:h-form-xs',\n  'group-data-[size=sm]/input-group:h-form-sm',\n  'group-data-[size=md]/input-group:h-form-md',\n  'group-data-[size=default]/input-group:h-form-default',\n  'group-data-[size=lg]/input-group:h-form-lg',\n);\nconst inputGroupControlTextBySize = cn(\n  'group-data-[size=xs]/input-group:text-ui-xs',\n  'group-data-[size=sm]/input-group:text-ui-sm',\n  'group-data-[size=md]/input-group:text-ui-md',\n  'group-data-[size=default]/input-group:text-ui-md',\n  'group-data-[size=lg]/input-group:text-ui-lg',\n);\n\nexport type InputGroupInputProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'> & {\n  testId?: string;\n  error?: boolean;\n};\n\nconst InputGroupInput = React.forwardRef<HTMLInputElement, InputGroupInputProps>(\n  ({ className, testId, error, type = 'text', ...props }, ref) => {\n    return (\n      <input\n        ref={ref}\n        type={type}\n        data-slot=\"input-group-control\"\n        data-testid={testId}\n        aria-invalid={error}\n        className={cn(\n          // Height matches the root box (which is fixed/border-box, so it doesn't grow);\n          // this also keeps the control from collapsing in block mode (flex-col).\n          'flex-1 min-w-0 bg-transparent text-neutral6 px-3 outline-hidden',\n          inputGroupControlHeightBySize,\n          inputGroupControlTextBySize,\n          'placeholder:text-neutral2 placeholder:transition-opacity placeholder:duration-normal',\n          'focus:placeholder:opacity-70',\n          'disabled:cursor-not-allowed',\n          // Hide native number-spinner arrows so consumers can compose their own\n          // stepper (see the NumberWithStepper story). WebKit uses the spin-button\n          // pseudo-elements; Firefox needs `appearance: textfield` on the input.\n          '[&::-webkit-outer-spin-button]:appearance-none [&::-webkit-outer-spin-button]:m-0',\n          '[&::-webkit-inner-spin-button]:appearance-none [&::-webkit-inner-spin-button]:m-0',\n          '[&[type=number]]:[appearance:textfield]',\n          // type=\"search\": drop WebKit's native clear button so it doesn't double up with a\n          // custom clear control (e.g. the scorers toolbar's InputGroupButton).\n          '[&::-webkit-search-cancel-button]:appearance-none',\n          className,\n        )}\n        {...props}\n      />\n    );\n  },\n);\nInputGroupInput.displayName = 'InputGroupInput';\n\nexport type InputGroupTextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {\n  testId?: string;\n  error?: boolean;\n};\n\nconst InputGroupTextarea = React.forwardRef<HTMLTextAreaElement, InputGroupTextareaProps>(\n  ({ className, testId, error, ...props }, ref) => {\n    return (\n      <textarea\n        ref={ref}\n        data-slot=\"input-group-control\"\n        data-testid={testId}\n        aria-invalid={error}\n        className={cn(\n          'flex-1 min-w-0 min-h-[60px] resize-y bg-transparent text-neutral6 px-3 py-2 outline-hidden',\n          inputGroupControlTextBySize,\n          'placeholder:text-neutral2 placeholder:transition-opacity placeholder:duration-normal',\n          'focus:placeholder:opacity-70',\n          'disabled:cursor-not-allowed',\n          className,\n        )}\n        {...props}\n      />\n    );\n  },\n);\nInputGroupTextarea.displayName = 'InputGroupTextarea';\n\nexport type InputGroupTextProps = React.ComponentPropsWithoutRef<'span'>;\n\nconst InputGroupText = React.forwardRef<HTMLSpanElement, InputGroupTextProps>(({ className, ...props }, ref) => {\n  return (\n    <span\n      ref={ref}\n      className={cn(\n        'flex items-center gap-2 text-ui-sm text-neutral3 [&_svg]:pointer-events-none',\n        \"[&_svg:not([class*='size-'])]:size-4\",\n        className,\n      )}\n      {...props}\n    />\n  );\n});\nInputGroupText.displayName = 'InputGroupText';\n\nexport type InputGroupButtonProps = Omit<ButtonProps, 'size' | 'variant'> & {\n  size?: ButtonProps['size'];\n  variant?: ButtonProps['variant'];\n};\n\nconst InputGroupButton = React.forwardRef<HTMLButtonElement, InputGroupButtonProps>(\n  ({ size = 'icon-sm', variant = 'ghost', type = 'button', ...props }, ref) => {\n    return <Button ref={ref} type={type} size={size} variant={variant} {...props} />;\n  },\n);\nInputGroupButton.displayName = 'InputGroupButton';\n\nexport { InputGroup, InputGroupAddon, InputGroupInput, InputGroupTextarea, InputGroupText, InputGroupButton };\n"],"names":[],"mappings":"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"}

package/dist/kbd-BAS3Kd2E.cjs

@@ -0,0 +1,29 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const transitions = require('./transitions-DpczSjmD.cjs');
+const utils_cn = require('./cn-vA5sWo9W.cjs');
+
+const themeClasses = {
+  light: "bg-gray-100 border-gray-300 text-gray-700 shadow-[0_1px_0_rgba(0,0,0,0.1)]",
+  dark: "bg-surface4 border-border1 text-neutral5 shadow-[0_1px_0_rgba(0,0,0,0.3)]"
+};
+const Kbd = ({ children, theme = "dark", className }) => {
+  const themeClass = themeClasses[theme];
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "kbd",
+    {
+      className: utils_cn.cn(
+        "border rounded-md px-1.5 py-0.5 font-mono text-ui-sm inline-flex items-center justify-center min-w-6",
+        transitions.transitions.transform,
+        "active:scale-95 active:shadow-none",
+        themeClass,
+        className
+      ),
+      children
+    }
+  );
+};
+
+exports.Kbd = Kbd;
+//# sourceMappingURL=kbd-BAS3Kd2E.cjs.map

package/dist/kbd-BAS3Kd2E.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"kbd-BAS3Kd2E.cjs","sources":["../src/ds/components/Kbd/kbd.tsx"],"sourcesContent":["import { transitions } from '@/ds/primitives/transitions';\nimport { cn } from '@/lib/utils';\n\nexport type KbdProps = {\n  children: React.ReactNode;\n  theme?: 'light' | 'dark';\n  className?: string;\n};\n\nconst themeClasses: Record<NonNullable<KbdProps['theme']>, string> = {\n  light: 'bg-gray-100 border-gray-300 text-gray-700 shadow-[0_1px_0_rgba(0,0,0,0.1)]',\n  dark: 'bg-surface4 border-border1 text-neutral5 shadow-[0_1px_0_rgba(0,0,0,0.3)]',\n};\n\nexport const Kbd = ({ children, theme = 'dark', className }: KbdProps) => {\n  const themeClass = themeClasses[theme];\n  return (\n    <kbd\n      className={cn(\n        'border rounded-md px-1.5 py-0.5 font-mono text-ui-sm inline-flex items-center justify-center min-w-6',\n        transitions.transform,\n        'active:scale-95 active:shadow-none',\n        themeClass,\n        className,\n      )}\n    >\n      {children}\n    </kbd>\n  );\n};\n"],"names":["jsx","cn","transitions"],"mappings":";;;;;;AASA,MAAM,YAAA,GAA+D;AAAA,EACnE,KAAA,EAAO,4EAAA;AAAA,EACP,IAAA,EAAM;AACR,CAAA;AAEO,MAAM,MAAM,CAAC,EAAE,UAAU,KAAA,GAAQ,MAAA,EAAQ,WAAU,KAAgB;AACxE,EAAA,MAAM,UAAA,GAAa,aAAa,KAAK,CAAA;AACrC,EAAA,uBACEA,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAWC,WAAA;AAAA,QACT,sGAAA;AAAA,QACAC,uBAAA,CAAY,SAAA;AAAA,QACZ,oCAAA;AAAA,QACA,UAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ;;;;"}

package/dist/kbd-gp0Sr4mW.js

@@ -0,0 +1,27 @@
+import { jsx } from 'react/jsx-runtime';
+import { t as transitions } from './transitions-tFfqxz40.js';
+import { c as cn } from './cn-BakJzhuv.js';
+
+const themeClasses = {
+  light: "bg-gray-100 border-gray-300 text-gray-700 shadow-[0_1px_0_rgba(0,0,0,0.1)]",
+  dark: "bg-surface4 border-border1 text-neutral5 shadow-[0_1px_0_rgba(0,0,0,0.3)]"
+};
+const Kbd = ({ children, theme = "dark", className }) => {
+  const themeClass = themeClasses[theme];
+  return /* @__PURE__ */ jsx(
+    "kbd",
+    {
+      className: cn(
+        "border rounded-md px-1.5 py-0.5 font-mono text-ui-sm inline-flex items-center justify-center min-w-6",
+        transitions.transform,
+        "active:scale-95 active:shadow-none",
+        themeClass,
+        className
+      ),
+      children
+    }
+  );
+};
+
+export { Kbd as K };
+//# sourceMappingURL=kbd-gp0Sr4mW.js.map

package/dist/kbd-gp0Sr4mW.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"kbd-gp0Sr4mW.js","sources":["../src/ds/components/Kbd/kbd.tsx"],"sourcesContent":["import { transitions } from '@/ds/primitives/transitions';\nimport { cn } from '@/lib/utils';\n\nexport type KbdProps = {\n  children: React.ReactNode;\n  theme?: 'light' | 'dark';\n  className?: string;\n};\n\nconst themeClasses: Record<NonNullable<KbdProps['theme']>, string> = {\n  light: 'bg-gray-100 border-gray-300 text-gray-700 shadow-[0_1px_0_rgba(0,0,0,0.1)]',\n  dark: 'bg-surface4 border-border1 text-neutral5 shadow-[0_1px_0_rgba(0,0,0,0.3)]',\n};\n\nexport const Kbd = ({ children, theme = 'dark', className }: KbdProps) => {\n  const themeClass = themeClasses[theme];\n  return (\n    <kbd\n      className={cn(\n        'border rounded-md px-1.5 py-0.5 font-mono text-ui-sm inline-flex items-center justify-center min-w-6',\n        transitions.transform,\n        'active:scale-95 active:shadow-none',\n        themeClass,\n        className,\n      )}\n    >\n      {children}\n    </kbd>\n  );\n};\n"],"names":[],"mappings":";;;;AASA,MAAM,YAAA,GAA+D;AAAA,EACnE,KAAA,EAAO,4EAAA;AAAA,EACP,IAAA,EAAM;AACR,CAAA;AAEO,MAAM,MAAM,CAAC,EAAE,UAAU,KAAA,GAAQ,MAAA,EAAQ,WAAU,KAAgB;AACxE,EAAA,MAAM,UAAA,GAAa,aAAa,KAAK,CAAA;AACrC,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAA;AAAA,QACT,sGAAA;AAAA,QACA,WAAA,CAAY,SAAA;AAAA,QACZ,oCAAA;AAAA,QACA,UAAA;AAAA,QACA;AAAA,OACF;AAAA,MAEC;AAAA;AAAA,GACH;AAEJ;;;;"}

package/dist/key-value-list-BNZQtUuM.js

@@ -0,0 +1,84 @@
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { ChevronRightIcon } from 'lucide-react';
+import React__default from 'react';
+import { H as HoverCard, b as HoverCardTrigger, a as HoverCardContent } from './hover-card-dAmvL_J6.js';
+import { VisuallyHidden } from '@radix-ui/react-visually-hidden';
+import { c as cn } from './cn-BakJzhuv.js';
+
+function KeyValueList({ data, className, labelsAreHidden, isLoading, LinkComponent: Link }) {
+  const LabelWrapper = ({ children }) => {
+    return labelsAreHidden ? /* @__PURE__ */ jsx(VisuallyHidden, { children }) : children;
+  };
+  if (!data || data.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx("dl", { className: cn("grid grid-cols-[auto_1fr] gap-x-4 items-start content-start", className), children: data.map(({ label, value, icon, separator }, index) => {
+    const isValueItemArray = Array.isArray(value);
+    return /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
+      /* @__PURE__ */ jsxs("dt", { className: cn("text-neutral3 text-ui-md flex items-center gap-8 justify-between min-h-9"), children: [
+        /* @__PURE__ */ jsxs(
+          "span",
+          {
+            className: cn(
+              "flex items-center gap-2",
+              "[&>svg]:w-[1.4em] [&>svg]:h-[1.4em] [&>svg]:text-neutral3 [&>svg]:opacity-50",
+              {
+                "[&>svg]:opacity-20": isLoading
+              }
+            ),
+            children: [
+              icon,
+              " ",
+              /* @__PURE__ */ jsx(LabelWrapper, { children: label })
+            ]
+          }
+        ),
+        !labelsAreHidden && /* @__PURE__ */ jsx("span", { className: cn("text-neutral3", "[&>svg]:w-[1em] [&>svg]:h-[1em] [&>svg]:text-neutral3"), children: separator })
+      ] }),
+      /* @__PURE__ */ jsx(
+        "dd",
+        {
+          className: cn(
+            "flex flex-wrap gap-2 py-1 min-h-9 text-ui-md items-center text-neutral5 text-wrap",
+            "[&>a]:text-neutral5 [&>a]:max-w-full [&>a]:w-auto truncate [&>a]:bg-surface4 [&>a]:transition-colors [&>a]:flex [&>a]:items-center [&>a]:gap-2 [&>a]:pt-0.5 [&>a]:pb-0.5 [&>a]:px-2 [&>a]:rounded-md [&>a]:text-ui-md [&>a]:min-h-7 [&>a]:leading-none",
+            "[&>a:hover]:text-neutral6 [&>a:hover]:bg-surface6",
+            "[&>a>svg]:w-[1em] [&>a>svg]:h-[1em] [&>a>svg]:text-neutral3 [&>a>svg]:ml-[-0.5em]"
+          ),
+          children: isLoading ? /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: cn("bg-surface4 rounded-e-lg w-full"),
+              style: { width: `${Math.floor(Math.random() * (90 - 30 + 1)) + 50}%` },
+              children: " "
+            }
+          ) : isValueItemArray ? value?.map((item) => {
+            if (item.path && Link) {
+              return /* @__PURE__ */ jsx(RelationWrapper, { description: item.description, children: /* @__PURE__ */ jsxs(Link, { href: item.path, children: [
+                item?.name,
+                " ",
+                /* @__PURE__ */ jsx(ChevronRightIcon, {})
+              ] }) }, item.id);
+            }
+            if (item.path) {
+              return /* @__PURE__ */ jsx(RelationWrapper, { description: item.description, children: /* @__PURE__ */ jsxs("a", { href: item.path, children: [
+                item?.name,
+                " ",
+                /* @__PURE__ */ jsx(ChevronRightIcon, {})
+              ] }) }, item.id);
+            }
+            return /* @__PURE__ */ jsx("span", { children: item?.name }, item.id);
+          }) : /* @__PURE__ */ jsx(Fragment, { children: value ? value : /* @__PURE__ */ jsx("span", { className: "text-neutral3 text-ui-sm", children: "n/a" }) })
+        }
+      )
+    ] }, label + index);
+  }) });
+}
+function RelationWrapper({ description, children }) {
+  return description ? /* @__PURE__ */ jsxs(HoverCard, { children: [
+    /* @__PURE__ */ jsx(HoverCardTrigger, { render: React__default.isValidElement(children) ? children : void 0 }),
+    /* @__PURE__ */ jsx(HoverCardContent, { className: "max-w-60 text-center", children: description })
+  ] }) : children;
+}
+
+export { KeyValueList as K };
+//# sourceMappingURL=key-value-list-BNZQtUuM.js.map

package/dist/key-value-list-BNZQtUuM.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"key-value-list-BNZQtUuM.js","sources":["../src/ds/components/KeyValueList/key-value-list.tsx"],"sourcesContent":["import { ChevronRightIcon } from 'lucide-react';\nimport React from 'react';\nimport { HoverCard, HoverCardContent, HoverCardTrigger } from '@/ds/components/HoverCard';\nimport { VisuallyHidden } from '@/ds/primitives/visually-hidden';\nimport type { LinkComponent } from '@/ds/types/link-component';\nimport { cn } from '@/lib/utils';\n\nexport type KeyValueListItemValue = {\n  id: string;\n  name: React.ReactNode;\n  path?: string;\n  description?: React.ReactNode;\n};\n\nexport type KeyValueListItemData = {\n  key: string;\n  label: string;\n  value: Value;\n  icon?: React.ReactNode;\n  separator?: React.ReactNode;\n};\n\ntype Value = React.ReactNode | KeyValueListItemValue[];\nexport type KeyValueListProps = {\n  data: KeyValueListItemData[];\n  labelsAreHidden?: boolean;\n  className?: string;\n  isLoading?: boolean;\n  LinkComponent?: LinkComponent;\n};\n\nexport function KeyValueList({ data, className, labelsAreHidden, isLoading, LinkComponent: Link }: KeyValueListProps) {\n  const LabelWrapper = ({ children }: { children: React.ReactNode }) => {\n    return labelsAreHidden ? <VisuallyHidden>{children}</VisuallyHidden> : children;\n  };\n\n  if (!data || data.length === 0) {\n    return null;\n  }\n\n  return (\n    <dl className={cn('grid grid-cols-[auto_1fr] gap-x-4 items-start content-start', className)}>\n      {data.map(({ label, value, icon, separator }, index) => {\n        const isValueItemArray = Array.isArray(value);\n\n        return (\n          <React.Fragment key={label + index}>\n            <dt className={cn('text-neutral3 text-ui-md flex items-center gap-8 justify-between min-h-9')}>\n              <span\n                className={cn(\n                  'flex items-center gap-2',\n                  '[&>svg]:w-[1.4em] [&>svg]:h-[1.4em] [&>svg]:text-neutral3 [&>svg]:opacity-50',\n                  {\n                    '[&>svg]:opacity-20': isLoading,\n                  },\n                )}\n              >\n                {icon} <LabelWrapper>{label}</LabelWrapper>\n              </span>\n              {!labelsAreHidden && (\n                <span className={cn('text-neutral3', '[&>svg]:w-[1em] [&>svg]:h-[1em] [&>svg]:text-neutral3')}>\n                  {separator}\n                </span>\n              )}\n            </dt>\n            <dd\n              className={cn(\n                'flex flex-wrap gap-2 py-1 min-h-9 text-ui-md items-center text-neutral5 text-wrap',\n                '[&>a]:text-neutral5 [&>a]:max-w-full [&>a]:w-auto truncate [&>a]:bg-surface4 [&>a]:transition-colors [&>a]:flex [&>a]:items-center [&>a]:gap-2 [&>a]:pt-0.5 [&>a]:pb-0.5 [&>a]:px-2 [&>a]:rounded-md [&>a]:text-ui-md [&>a]:min-h-7 [&>a]:leading-none',\n                '[&>a:hover]:text-neutral6 [&>a:hover]:bg-surface6',\n                '[&>a>svg]:w-[1em] [&>a>svg]:h-[1em] [&>a>svg]:text-neutral3 [&>a>svg]:ml-[-0.5em]',\n              )}\n            >\n              {isLoading ? (\n                <span\n                  className={cn('bg-surface4 rounded-e-lg w-full')}\n                  style={{ width: `${Math.floor(Math.random() * (90 - 30 + 1)) + 50}%` }}\n                >\n                  &nbsp;\n                </span>\n              ) : isValueItemArray ? (\n                value?.map(item => {\n                  if (item.path && Link) {\n                    return (\n                      <RelationWrapper description={item.description} key={item.id}>\n                        <Link href={item.path}>\n                          {item?.name} <ChevronRightIcon />\n                        </Link>\n                      </RelationWrapper>\n                    );\n                  }\n                  if (item.path) {\n                    return (\n                      <RelationWrapper description={item.description} key={item.id}>\n                        <a href={item.path}>\n                          {item?.name} <ChevronRightIcon />\n                        </a>\n                      </RelationWrapper>\n                    );\n                  }\n                  return <span key={item.id}>{item?.name}</span>;\n                })\n              ) : (\n                <>{value ? value : <span className=\"text-neutral3 text-ui-sm\">n/a</span>}</>\n              )}\n            </dd>\n          </React.Fragment>\n        );\n      })}\n    </dl>\n  );\n}\n\ntype RelationWrapperProps = {\n  description?: React.ReactNode;\n  children?: React.ReactNode;\n};\n\nfunction RelationWrapper({ description, children }: RelationWrapperProps) {\n  return description ? (\n    <HoverCard>\n      <HoverCardTrigger render={React.isValidElement(children) ? (children as React.ReactElement) : undefined} />\n      <HoverCardContent className=\"max-w-60 text-center\">{description}</HoverCardContent>\n    </HoverCard>\n  ) : (\n    children\n  );\n}\n"],"names":["React"],"mappings":"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"}

package/dist/key-value-list-CCHSo-zE.cjs

@@ -0,0 +1,86 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const lucideReact = require('lucide-react');
+const React = require('react');
+const hoverCard = require('./hover-card-DtF9cdE-.cjs');
+const reactVisuallyHidden = require('@radix-ui/react-visually-hidden');
+const utils_cn = require('./cn-vA5sWo9W.cjs');
+
+function KeyValueList({ data, className, labelsAreHidden, isLoading, LinkComponent: Link }) {
+  const LabelWrapper = ({ children }) => {
+    return labelsAreHidden ? /* @__PURE__ */ jsxRuntime.jsx(reactVisuallyHidden.VisuallyHidden, { children }) : children;
+  };
+  if (!data || data.length === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("dl", { className: utils_cn.cn("grid grid-cols-[auto_1fr] gap-x-4 items-start content-start", className), children: data.map(({ label, value, icon, separator }, index) => {
+    const isValueItemArray = Array.isArray(value);
+    return /* @__PURE__ */ jsxRuntime.jsxs(React.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("dt", { className: utils_cn.cn("text-neutral3 text-ui-md flex items-center gap-8 justify-between min-h-9"), children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "span",
+          {
+            className: utils_cn.cn(
+              "flex items-center gap-2",
+              "[&>svg]:w-[1.4em] [&>svg]:h-[1.4em] [&>svg]:text-neutral3 [&>svg]:opacity-50",
+              {
+                "[&>svg]:opacity-20": isLoading
+              }
+            ),
+            children: [
+              icon,
+              " ",
+              /* @__PURE__ */ jsxRuntime.jsx(LabelWrapper, { children: label })
+            ]
+          }
+        ),
+        !labelsAreHidden && /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils_cn.cn("text-neutral3", "[&>svg]:w-[1em] [&>svg]:h-[1em] [&>svg]:text-neutral3"), children: separator })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "dd",
+        {
+          className: utils_cn.cn(
+            "flex flex-wrap gap-2 py-1 min-h-9 text-ui-md items-center text-neutral5 text-wrap",
+            "[&>a]:text-neutral5 [&>a]:max-w-full [&>a]:w-auto truncate [&>a]:bg-surface4 [&>a]:transition-colors [&>a]:flex [&>a]:items-center [&>a]:gap-2 [&>a]:pt-0.5 [&>a]:pb-0.5 [&>a]:px-2 [&>a]:rounded-md [&>a]:text-ui-md [&>a]:min-h-7 [&>a]:leading-none",
+            "[&>a:hover]:text-neutral6 [&>a:hover]:bg-surface6",
+            "[&>a>svg]:w-[1em] [&>a>svg]:h-[1em] [&>a>svg]:text-neutral3 [&>a>svg]:ml-[-0.5em]"
+          ),
+          children: isLoading ? /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: utils_cn.cn("bg-surface4 rounded-e-lg w-full"),
+              style: { width: `${Math.floor(Math.random() * (90 - 30 + 1)) + 50}%` },
+              children: " "
+            }
+          ) : isValueItemArray ? value?.map((item) => {
+            if (item.path && Link) {
+              return /* @__PURE__ */ jsxRuntime.jsx(RelationWrapper, { description: item.description, children: /* @__PURE__ */ jsxRuntime.jsxs(Link, { href: item.path, children: [
+                item?.name,
+                " ",
+                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRightIcon, {})
+              ] }) }, item.id);
+            }
+            if (item.path) {
+              return /* @__PURE__ */ jsxRuntime.jsx(RelationWrapper, { description: item.description, children: /* @__PURE__ */ jsxRuntime.jsxs("a", { href: item.path, children: [
+                item?.name,
+                " ",
+                /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRightIcon, {})
+              ] }) }, item.id);
+            }
+            return /* @__PURE__ */ jsxRuntime.jsx("span", { children: item?.name }, item.id);
+          }) : /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: value ? value : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-neutral3 text-ui-sm", children: "n/a" }) })
+        }
+      )
+    ] }, label + index);
+  }) });
+}
+function RelationWrapper({ description, children }) {
+  return description ? /* @__PURE__ */ jsxRuntime.jsxs(hoverCard.HoverCard, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(hoverCard.HoverCardTrigger, { render: React.isValidElement(children) ? children : void 0 }),
+    /* @__PURE__ */ jsxRuntime.jsx(hoverCard.HoverCardContent, { className: "max-w-60 text-center", children: description })
+  ] }) : children;
+}
+
+exports.KeyValueList = KeyValueList;
+//# sourceMappingURL=key-value-list-CCHSo-zE.cjs.map

package/dist/key-value-list-CCHSo-zE.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"key-value-list-CCHSo-zE.cjs","sources":["../src/ds/components/KeyValueList/key-value-list.tsx"],"sourcesContent":["import { ChevronRightIcon } from 'lucide-react';\nimport React from 'react';\nimport { HoverCard, HoverCardContent, HoverCardTrigger } from '@/ds/components/HoverCard';\nimport { VisuallyHidden } from '@/ds/primitives/visually-hidden';\nimport type { LinkComponent } from '@/ds/types/link-component';\nimport { cn } from '@/lib/utils';\n\nexport type KeyValueListItemValue = {\n  id: string;\n  name: React.ReactNode;\n  path?: string;\n  description?: React.ReactNode;\n};\n\nexport type KeyValueListItemData = {\n  key: string;\n  label: string;\n  value: Value;\n  icon?: React.ReactNode;\n  separator?: React.ReactNode;\n};\n\ntype Value = React.ReactNode | KeyValueListItemValue[];\nexport type KeyValueListProps = {\n  data: KeyValueListItemData[];\n  labelsAreHidden?: boolean;\n  className?: string;\n  isLoading?: boolean;\n  LinkComponent?: LinkComponent;\n};\n\nexport function KeyValueList({ data, className, labelsAreHidden, isLoading, LinkComponent: Link }: KeyValueListProps) {\n  const LabelWrapper = ({ children }: { children: React.ReactNode }) => {\n    return labelsAreHidden ? <VisuallyHidden>{children}</VisuallyHidden> : children;\n  };\n\n  if (!data || data.length === 0) {\n    return null;\n  }\n\n  return (\n    <dl className={cn('grid grid-cols-[auto_1fr] gap-x-4 items-start content-start', className)}>\n      {data.map(({ label, value, icon, separator }, index) => {\n        const isValueItemArray = Array.isArray(value);\n\n        return (\n          <React.Fragment key={label + index}>\n            <dt className={cn('text-neutral3 text-ui-md flex items-center gap-8 justify-between min-h-9')}>\n              <span\n                className={cn(\n                  'flex items-center gap-2',\n                  '[&>svg]:w-[1.4em] [&>svg]:h-[1.4em] [&>svg]:text-neutral3 [&>svg]:opacity-50',\n                  {\n                    '[&>svg]:opacity-20': isLoading,\n                  },\n                )}\n              >\n                {icon} <LabelWrapper>{label}</LabelWrapper>\n              </span>\n              {!labelsAreHidden && (\n                <span className={cn('text-neutral3', '[&>svg]:w-[1em] [&>svg]:h-[1em] [&>svg]:text-neutral3')}>\n                  {separator}\n                </span>\n              )}\n            </dt>\n            <dd\n              className={cn(\n                'flex flex-wrap gap-2 py-1 min-h-9 text-ui-md items-center text-neutral5 text-wrap',\n                '[&>a]:text-neutral5 [&>a]:max-w-full [&>a]:w-auto truncate [&>a]:bg-surface4 [&>a]:transition-colors [&>a]:flex [&>a]:items-center [&>a]:gap-2 [&>a]:pt-0.5 [&>a]:pb-0.5 [&>a]:px-2 [&>a]:rounded-md [&>a]:text-ui-md [&>a]:min-h-7 [&>a]:leading-none',\n                '[&>a:hover]:text-neutral6 [&>a:hover]:bg-surface6',\n                '[&>a>svg]:w-[1em] [&>a>svg]:h-[1em] [&>a>svg]:text-neutral3 [&>a>svg]:ml-[-0.5em]',\n              )}\n            >\n              {isLoading ? (\n                <span\n                  className={cn('bg-surface4 rounded-e-lg w-full')}\n                  style={{ width: `${Math.floor(Math.random() * (90 - 30 + 1)) + 50}%` }}\n                >\n                  &nbsp;\n                </span>\n              ) : isValueItemArray ? (\n                value?.map(item => {\n                  if (item.path && Link) {\n                    return (\n                      <RelationWrapper description={item.description} key={item.id}>\n                        <Link href={item.path}>\n                          {item?.name} <ChevronRightIcon />\n                        </Link>\n                      </RelationWrapper>\n                    );\n                  }\n                  if (item.path) {\n                    return (\n                      <RelationWrapper description={item.description} key={item.id}>\n                        <a href={item.path}>\n                          {item?.name} <ChevronRightIcon />\n                        </a>\n                      </RelationWrapper>\n                    );\n                  }\n                  return <span key={item.id}>{item?.name}</span>;\n                })\n              ) : (\n                <>{value ? value : <span className=\"text-neutral3 text-ui-sm\">n/a</span>}</>\n              )}\n            </dd>\n          </React.Fragment>\n        );\n      })}\n    </dl>\n  );\n}\n\ntype RelationWrapperProps = {\n  description?: React.ReactNode;\n  children?: React.ReactNode;\n};\n\nfunction RelationWrapper({ description, children }: RelationWrapperProps) {\n  return description ? (\n    <HoverCard>\n      <HoverCardTrigger render={React.isValidElement(children) ? (children as React.ReactElement) : undefined} />\n      <HoverCardContent className=\"max-w-60 text-center\">{description}</HoverCardContent>\n    </HoverCard>\n  ) : (\n    children\n  );\n}\n"],"names":["jsx","VisuallyHidden","cn","jsxs","ChevronRightIcon","Fragment","HoverCard","HoverCardTrigger","HoverCardContent"],"mappings":"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"}

package/dist/label-B-UbxfJf.cjs

@@ -0,0 +1,34 @@
+'use strict';
+
+const jsxRuntime = require('react/jsx-runtime');
+const index = require('./index-C-Lt4Bx_.cjs');
+const React = require('react');
+const utils_cn = require('./cn-vA5sWo9W.cjs');
+
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: 'Module' } });
+  if (e) {
+    for (const k in e) {
+      if (k !== 'default') {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+const React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
+
+const labelVariants = index.cva("text-sm leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70");
+const Label = React__namespace.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx("label", { ref, className: utils_cn.cn(labelVariants(), className), ...props })
+);
+Label.displayName = "Label";
+
+exports.Label = Label;
+//# sourceMappingURL=label-B-UbxfJf.cjs.map

package/dist/label-B-UbxfJf.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"label-B-UbxfJf.cjs","sources":["../src/ds/components/Label/label.tsx"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\nconst labelVariants = cva('text-sm leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70');\n\nconst Label = React.forwardRef<HTMLLabelElement, React.ComponentPropsWithoutRef<'label'>>(\n  ({ className, ...props }, ref) => <label ref={ref} className={cn(labelVariants(), className)} {...props} />,\n);\nLabel.displayName = 'Label';\n\nexport { Label };\n"],"names":["cva","React","jsx","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAKA,MAAM,aAAA,GAAgBA,UAAI,gFAAgF,CAAA;AAE1G,MAAM,QAAQC,gBAAA,CAAM,UAAA;AAAA,EAClB,CAAC,EAAE,SAAA,EAAW,GAAG,KAAA,IAAS,GAAA,qBAAQC,cAAA,CAAC,OAAA,EAAA,EAAM,GAAA,EAAU,WAAWC,WAAA,CAAG,aAAA,IAAiB,SAAS,CAAA,EAAI,GAAG,KAAA,EAAO;AAC3G;AACA,KAAA,CAAM,WAAA,GAAc,OAAA;;;;"}

package/dist/label-WtU3xT6v.js

@@ -0,0 +1,13 @@
+import { jsx } from 'react/jsx-runtime';
+import { c as cva } from './index-CSm06eOE.js';
+import * as React from 'react';
+import { c as cn } from './cn-BakJzhuv.js';
+
+const labelVariants = cva("text-sm leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70");
+const Label = React.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("label", { ref, className: cn(labelVariants(), className), ...props })
+);
+Label.displayName = "Label";
+
+export { Label as L };
+//# sourceMappingURL=label-WtU3xT6v.js.map

package/dist/label-WtU3xT6v.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"label-WtU3xT6v.js","sources":["../src/ds/components/Label/label.tsx"],"sourcesContent":["import { cva } from 'class-variance-authority';\nimport * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\nconst labelVariants = cva('text-sm leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70');\n\nconst Label = React.forwardRef<HTMLLabelElement, React.ComponentPropsWithoutRef<'label'>>(\n  ({ className, ...props }, ref) => <label ref={ref} className={cn(labelVariants(), className)} {...props} />,\n);\nLabel.displayName = 'Label';\n\nexport { Label };\n"],"names":[],"mappings":";;;;;AAKA,MAAM,aAAA,GAAgB,IAAI,gFAAgF,CAAA;AAE1G,MAAM,QAAQ,KAAA,CAAM,UAAA;AAAA,EAClB,CAAC,EAAE,SAAA,EAAW,GAAG,KAAA,IAAS,GAAA,qBAAQ,GAAA,CAAC,OAAA,EAAA,EAAM,GAAA,EAAU,WAAW,EAAA,CAAG,aAAA,IAAiB,SAAS,CAAA,EAAI,GAAG,KAAA,EAAO;AAC3G;AACA,KAAA,CAAM,WAAA,GAAc,OAAA;;;;"}