@7onic-ui/react 0.3.9 → 0.3.11

package/dist/chunk-S4DGVKBK.mjs

@@ -0,0 +1,151 @@
+"use client";
+import {
+  cn
+} from "./chunk-53MIUPSY.mjs";
+
+// src/components/ui/toggle-group.tsx
+import * as React from "react";
+import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
+import { cva } from "class-variance-authority";
+var toggleGroupVariants = cva(
+  "inline-flex items-center justify-center",
+  {
+    variants: {
+      orientation: {
+        horizontal: "flex-row",
+        vertical: "flex-col"
+      }
+    },
+    defaultVariants: {
+      orientation: "horizontal"
+    }
+  }
+);
+var toggleGroupItemVariants = cva(
+  "inline-flex items-center justify-center text-sm text-text-muted transition-all duration-micro focus-visible:focus-ring disabled:pointer-events-none disabled:opacity-50",
+  {
+    variants: {
+      variant: {
+        default: "bg-transparent hover:bg-background-muted hover:text-foreground data-[state=on]:bg-background-muted data-[state=on]:text-foreground",
+        outline: "border border-border bg-transparent hover:bg-background-muted hover:text-foreground data-[state=on]:bg-background-muted data-[state=on]:text-foreground"
+      },
+      fontWeight: {
+        normal: "font-normal",
+        semibold: "font-semibold"
+      },
+      size: {
+        xs: "h-7 px-2.5 text-xs gap-1",
+        // 28px height, 10px paddingX, 12px font
+        sm: "h-8 px-3 text-sm gap-2",
+        // 32px height, 12px paddingX, 13px font
+        md: "h-9 px-3.5 text-md gap-2",
+        // 36px height, 14px paddingX, 14px font
+        default: "h-10 px-4 text-md gap-2",
+        // 40px height, 16px paddingX, 14px font
+        lg: "h-12 px-6 text-base gap-2"
+        // 48px height, 24px paddingX, 16px font
+      },
+      radius: {
+        none: "rounded-none",
+        sm: "rounded-sm",
+        base: "rounded",
+        default: "rounded-md",
+        lg: "rounded-lg",
+        xl: "rounded-xl",
+        "2xl": "rounded-2xl",
+        "3xl": "rounded-3xl",
+        full: "rounded-full"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+      radius: "default",
+      fontWeight: "normal"
+    }
+  }
+);
+var ToggleGroupContext = React.createContext({
+  variant: "default",
+  size: "default",
+  radius: "default",
+  fontWeight: "normal"
+});
+var ToggleGroup = React.forwardRef(({ className, orientation, variant, size, radius, fontWeight, children, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  ToggleGroupPrimitive.Root,
+  {
+    ref,
+    className: cn(
+      toggleGroupVariants({ orientation }),
+      // Attached style for horizontal
+      orientation !== "vertical" && [
+        "[&>*:not(:first-child)]:rounded-l-none",
+        "[&>*:not(:last-child)]:rounded-r-none",
+        "[&>*:not(:first-child)]:-ml-px",
+        "[&>*]:relative",
+        "[&>*:hover]:z-10",
+        "[&>*:focus-visible]:z-10",
+        "[&>*:active]:scale-none"
+      ],
+      // Attached style for vertical
+      orientation === "vertical" && [
+        "[&>*:not(:first-child)]:rounded-t-none",
+        "[&>*:not(:last-child)]:rounded-b-none",
+        "[&>*:not(:first-child)]:-mt-px",
+        "[&>*]:relative",
+        "[&>*]:w-full",
+        "[&>*:hover]:z-10",
+        "[&>*:focus-visible]:z-10",
+        "[&>*:active]:scale-none"
+      ],
+      className
+    ),
+    orientation,
+    ...props
+  },
+  /* @__PURE__ */ React.createElement(ToggleGroupContext.Provider, { value: { variant, size, radius, fontWeight } }, children)
+));
+ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;
+var iconSizeClasses = {
+  xs: "[&>svg]:icon-xs",
+  // 14px
+  sm: "[&>svg]:icon-xs",
+  // 14px
+  md: "[&>svg]:icon-sm",
+  // 16px
+  default: "[&>svg]:icon-sm",
+  // 16px
+  lg: "[&>svg]:icon-sm"
+  // 16px
+};
+var ToggleGroupItem = React.forwardRef(({ className, variant, size, radius, fontWeight, children, ...props }, ref) => {
+  const context = React.useContext(ToggleGroupContext);
+  const resolvedSize = size || context.size || "default";
+  return /* @__PURE__ */ React.createElement(
+    ToggleGroupPrimitive.Item,
+    {
+      ref,
+      className: cn(
+        toggleGroupItemVariants({
+          variant: variant || context.variant,
+          size: resolvedSize,
+          radius: radius || context.radius,
+          fontWeight: fontWeight || context.fontWeight
+        }),
+        iconSizeClasses[resolvedSize],
+        className
+      ),
+      ...props
+    },
+    children
+  );
+});
+ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;
+
+export {
+  toggleGroupVariants,
+  toggleGroupItemVariants,
+  ToggleGroup,
+  ToggleGroupItem
+};
+//# sourceMappingURL=chunk-S4DGVKBK.mjs.map

package/dist/chunk-S4DGVKBK.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ui/toggle-group.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\n\nconst toggleGroupVariants = cva(\n  'inline-flex items-center justify-center',\n  {\n    variants: {\n      orientation: {\n        horizontal: 'flex-row',\n        vertical: 'flex-col',\n      },\n    },\n    defaultVariants: {\n      orientation: 'horizontal',\n    },\n  }\n)\n\nconst toggleGroupItemVariants = cva(\n  'inline-flex items-center justify-center text-sm text-text-muted transition-all duration-micro focus-visible:focus-ring disabled:pointer-events-none disabled:opacity-50',\n  {\n    variants: {\n      variant: {\n        default: 'bg-transparent hover:bg-background-muted hover:text-foreground data-[state=on]:bg-background-muted data-[state=on]:text-foreground',\n        outline: 'border border-border bg-transparent hover:bg-background-muted hover:text-foreground data-[state=on]:bg-background-muted data-[state=on]:text-foreground',\n      },\n      fontWeight: {\n        normal: 'font-normal',\n        semibold: 'font-semibold',\n      },\n      size: {\n        xs: 'h-7 px-2.5 text-xs gap-1',      // 28px height, 10px paddingX, 12px font\n        sm: 'h-8 px-3 text-sm gap-2',        // 32px height, 12px paddingX, 13px font\n        md: 'h-9 px-3.5 text-md gap-2',      // 36px height, 14px paddingX, 14px font\n        default: 'h-10 px-4 text-md gap-2',  // 40px height, 16px paddingX, 14px font\n        lg: 'h-12 px-6 text-base gap-2',     // 48px height, 24px paddingX, 16px font\n      },\n      radius: {\n        none: 'rounded-none',\n        sm: 'rounded-sm',\n        base: 'rounded',\n        default: 'rounded-md',\n        lg: 'rounded-lg',\n        xl: 'rounded-xl',\n        '2xl': 'rounded-2xl',\n        '3xl': 'rounded-3xl',\n        full: 'rounded-full',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n      radius: 'default',\n      fontWeight: 'normal',\n    },\n  }\n)\n\nconst ToggleGroupContext = React.createContext<\n  VariantProps<typeof toggleGroupItemVariants>\n>({\n  variant: 'default',\n  size: 'default',\n  radius: 'default',\n  fontWeight: 'normal',\n})\n\ntype ToggleGroupSingleProps = {\n  type: 'single'\n  value?: string\n  defaultValue?: string\n  onValueChange?: (value: string) => void\n}\n\ntype ToggleGroupMultipleProps = {\n  type: 'multiple'\n  value?: string[]\n  defaultValue?: string[]\n  onValueChange?: (value: string[]) => void\n}\n\ntype ToggleGroupBaseProps = Omit<\n  React.ComponentPropsWithoutRef<'div'>,\n  'defaultValue' | 'dir'\n> & {\n  disabled?: boolean\n  rovingFocus?: boolean\n  orientation?: 'horizontal' | 'vertical'\n  dir?: 'ltr' | 'rtl'\n  loop?: boolean\n  children?: React.ReactNode\n}\n\nexport type ToggleGroupProps = ToggleGroupBaseProps &\n  VariantProps<typeof toggleGroupVariants> &\n  VariantProps<typeof toggleGroupItemVariants> &\n  (ToggleGroupSingleProps | ToggleGroupMultipleProps)\n\nconst ToggleGroup = React.forwardRef<\n  React.ElementRef<typeof ToggleGroupPrimitive.Root>,\n  ToggleGroupProps\n>(({ className, orientation, variant, size, radius, fontWeight, children, ...props }, ref) => (\n  <ToggleGroupPrimitive.Root\n    ref={ref}\n    className={cn(\n      toggleGroupVariants({ orientation }),\n      // Attached style for horizontal\n      orientation !== 'vertical' && [\n        '[&>*:not(:first-child)]:rounded-l-none',\n        '[&>*:not(:last-child)]:rounded-r-none',\n        '[&>*:not(:first-child)]:-ml-px',\n        '[&>*]:relative',\n        '[&>*:hover]:z-10',\n        '[&>*:focus-visible]:z-10',\n        '[&>*:active]:scale-none',\n      ],\n      // Attached style for vertical\n      orientation === 'vertical' && [\n        '[&>*:not(:first-child)]:rounded-t-none',\n        '[&>*:not(:last-child)]:rounded-b-none',\n        '[&>*:not(:first-child)]:-mt-px',\n        '[&>*]:relative',\n        '[&>*]:w-full',\n        '[&>*:hover]:z-10',\n        '[&>*:focus-visible]:z-10',\n        '[&>*:active]:scale-none',\n      ],\n      className\n    )}\n    orientation={orientation}\n    {...(props as React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Root>)}\n  >\n    <ToggleGroupContext.Provider value={{ variant, size, radius, fontWeight }}>\n      {children}\n    </ToggleGroupContext.Provider>\n  </ToggleGroupPrimitive.Root>\n))\nToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName\n\nexport interface ToggleGroupItemProps\n  extends React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Item>,\n    Omit<VariantProps<typeof toggleGroupItemVariants>, 'fontWeight'> {\n  fontWeight?: 'normal' | 'semibold'\n}\n\n// Icon size for toggle group (5-step scale, Icon+Text mode)\n// xs~sm: 14px, md~default~lg: 16px\nconst iconSizeClasses = {\n  xs: '[&>svg]:icon-xs',      // 14px\n  sm: '[&>svg]:icon-xs',      // 14px\n  md: '[&>svg]:icon-sm',      // 16px\n  default: '[&>svg]:icon-sm', // 16px\n  lg: '[&>svg]:icon-sm',      // 16px\n}\n\nconst ToggleGroupItem = React.forwardRef<\n  React.ElementRef<typeof ToggleGroupPrimitive.Item>,\n  ToggleGroupItemProps\n>(({ className, variant, size, radius, fontWeight, children, ...props }, ref) => {\n  const context = React.useContext(ToggleGroupContext)\n  const resolvedSize = size || context.size || 'default'\n\n  return (\n    <ToggleGroupPrimitive.Item\n      ref={ref}\n      className={cn(\n        toggleGroupItemVariants({\n          variant: variant || context.variant,\n          size: resolvedSize,\n          radius: radius || context.radius,\n          fontWeight: fontWeight || context.fontWeight,\n        }),\n        iconSizeClasses[resolvedSize],\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </ToggleGroupPrimitive.Item>\n  )\n})\nToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName\n\nexport { ToggleGroup, ToggleGroupItem, toggleGroupVariants, toggleGroupItemVariants }\n"],"mappings":"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","names":[]}

package/dist/chunk-S4T4PU7F.mjs

@@ -0,0 +1,114 @@
+"use client";
+import {
+  cn
+} from "./chunk-53MIUPSY.mjs";
+
+// src/components/ui/typing-indicator.tsx
+import * as React from "react";
+import { cva } from "class-variance-authority";
+var DOT_SIZES = { sm: 4, default: 6, lg: 8 };
+var DOT_GAP = { sm: 3, default: 4, lg: 5 };
+var SPEED_MS = { slow: 1600, default: 1100, fast: 700 };
+var DOT_COUNT = 3;
+var bgColorMap = {
+  default: "bg-foreground",
+  primary: "bg-primary",
+  muted: "bg-text-subtle"
+};
+var typingIndicatorVariants = cva(
+  "inline-flex items-center",
+  {
+    variants: {
+      size: {
+        sm: "gap-1.5 text-xs",
+        default: "gap-2 text-sm",
+        lg: "gap-2.5 text-base"
+      }
+    },
+    defaultVariants: {
+      size: "default"
+    }
+  }
+);
+var TypingIndicator = React.forwardRef(
+  ({
+    className,
+    variant = "dots",
+    size,
+    color = "muted",
+    speed = "default",
+    label = "Typing",
+    showLabel = false,
+    ...props
+  }, ref) => {
+    const resolvedSize = size ?? "default";
+    return /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        ref,
+        role: "status",
+        "aria-live": "polite",
+        "aria-label": label,
+        className: cn(typingIndicatorVariants({ size }), className),
+        ...props
+      },
+      variant === "dots" && /* @__PURE__ */ React.createElement(DotsIndicator, { size: resolvedSize, color, speed }),
+      variant === "cursor" && /* @__PURE__ */ React.createElement(CursorIndicator, { size: resolvedSize, color }),
+      showLabel && /* @__PURE__ */ React.createElement("span", { className: "text-text-muted select-none" }, label)
+    );
+  }
+);
+TypingIndicator.displayName = "TypingIndicator";
+function DotsIndicator({
+  size,
+  color,
+  speed
+}) {
+  const dotSize = DOT_SIZES[size];
+  const gap = DOT_GAP[size];
+  const duration = SPEED_MS[speed];
+  return /* @__PURE__ */ React.createElement("div", { className: "inline-flex items-center", style: { gap } }, Array.from({ length: DOT_COUNT }, (_, i) => /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      key: i,
+      className: cn(
+        "rounded-full animate-spinner-dot motion-reduce:animate-none motion-reduce:opacity-60",
+        bgColorMap[color]
+      ),
+      style: {
+        width: dotSize,
+        height: dotSize,
+        animationDuration: `${duration}ms`,
+        animationDelay: `${i * (duration / DOT_COUNT / 1.5)}ms`
+      }
+    }
+  )));
+}
+var CURSOR_SIZE = {
+  sm: { width: 2, height: 14 },
+  default: { width: 2.5, height: 20 },
+  lg: { width: 3, height: 26 }
+};
+function CursorIndicator({
+  size,
+  color
+}) {
+  const { width, height } = CURSOR_SIZE[size];
+  return /* @__PURE__ */ React.createElement(
+    "div",
+    {
+      "aria-hidden": "true",
+      className: cn(
+        "rounded-full animate-typing-cursor motion-reduce:animate-none motion-reduce:opacity-60",
+        bgColorMap[color]
+      ),
+      style: { width, height, animationDuration: "1200ms" }
+    }
+  );
+}
+
+export {
+  typingIndicatorVariants,
+  TypingIndicator
+};
+//# sourceMappingURL=chunk-S4T4PU7F.mjs.map

package/dist/chunk-S4T4PU7F.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ui/typing-indicator.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\n\n// ============================================================================\n// Constants\n// ============================================================================\n\n/** Dot diameter per size (px) */\nconst DOT_SIZES = { sm: 4, default: 6, lg: 8 } as const\n\n/** Gap between dots per size (px) */\nconst DOT_GAP = { sm: 3, default: 4, lg: 5 } as const\n\n/** Animation speed in ms */\nconst SPEED_MS = { slow: 1600, default: 1100, fast: 700 } as const\n\n/** Number of dots */\nconst DOT_COUNT = 3\n\n// ============================================================================\n// Color mapping\n// ============================================================================\n\nconst bgColorMap = {\n  default: 'bg-foreground',\n  primary: 'bg-primary',\n  muted:   'bg-text-subtle',\n} as const\n\n// ============================================================================\n// Variants (CVA)\n// ============================================================================\n\nconst typingIndicatorVariants = cva(\n  'inline-flex items-center',\n  {\n    variants: {\n      size: {\n        sm:      'gap-1.5 text-xs',\n        default: 'gap-2 text-sm',\n        lg:      'gap-2.5 text-base',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n)\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface TypingIndicatorProps\n  extends React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof typingIndicatorVariants> {\n  /** Animation style */\n  variant?: 'dots' | 'cursor'\n  /** Indicator color */\n  color?: 'default' | 'primary' | 'muted'\n  /** Animation speed */\n  speed?: 'slow' | 'default' | 'fast'\n  /** Accessible label (also shown as visual text when showLabel is true) */\n  label?: string\n  /** Render label text alongside the indicator */\n  showLabel?: boolean\n}\n\n// ============================================================================\n// Component\n// ============================================================================\n\nconst TypingIndicator = React.forwardRef<HTMLDivElement, TypingIndicatorProps>(\n  (\n    {\n      className,\n      variant = 'dots',\n      size,\n      color = 'muted',\n      speed = 'default',\n      label = 'Typing',\n      showLabel = false,\n      ...props\n    },\n    ref\n  ) => {\n    const resolvedSize = size ?? 'default'\n\n    return (\n      <div\n        ref={ref}\n        role=\"status\"\n        aria-live=\"polite\"\n        aria-label={label}\n        className={cn(typingIndicatorVariants({ size }), className)}\n        {...props}\n      >\n        {variant === 'dots' && (\n          <DotsIndicator size={resolvedSize} color={color} speed={speed} />\n        )}\n        {variant === 'cursor' && (\n          <CursorIndicator size={resolvedSize} color={color} />\n        )}\n        {showLabel && (\n          <span className=\"text-text-muted select-none\">{label}</span>\n        )}\n      </div>\n    )\n  }\n)\nTypingIndicator.displayName = 'TypingIndicator'\n\n// ============================================================================\n// Dots Indicator — 3 staggered bouncing dots (reuses animate-spinner-dot)\n// ============================================================================\n\nfunction DotsIndicator({\n  size,\n  color,\n  speed,\n}: {\n  size: 'sm' | 'default' | 'lg'\n  color: 'default' | 'primary' | 'muted'\n  speed: 'slow' | 'default' | 'fast'\n}) {\n  const dotSize = DOT_SIZES[size]\n  const gap = DOT_GAP[size]\n  const duration = SPEED_MS[speed]\n\n  return (\n    <div className=\"inline-flex items-center\" style={{ gap }}>\n      {Array.from({ length: DOT_COUNT }, (_, i) => (\n        <div\n          key={i}\n          className={cn(\n            'rounded-full animate-spinner-dot motion-reduce:animate-none motion-reduce:opacity-60',\n            bgColorMap[color]\n          )}\n          style={{\n            width: dotSize,\n            height: dotSize,\n            animationDuration: `${duration}ms`,\n            animationDelay: `${i * (duration / DOT_COUNT / 1.5)}ms`,\n          }}\n        />\n      ))}\n    </div>\n  )\n}\n\n// ============================================================================\n// Cursor sizes per component size\n// ============================================================================\n\nconst CURSOR_SIZE = {\n  sm:      { width: 2, height: 14 },\n  default: { width: 2.5, height: 20 },\n  lg:      { width: 3, height: 26 },\n} as const\n\n// ============================================================================\n// Cursor Indicator — blinking cursor (text-cursor style)\n// ============================================================================\n\nfunction CursorIndicator({\n  size,\n  color,\n}: {\n  size: 'sm' | 'default' | 'lg'\n  color: 'default' | 'primary' | 'muted'\n}) {\n  const { width, height } = CURSOR_SIZE[size]\n\n  return (\n    <div\n      aria-hidden=\"true\"\n      className={cn(\n        'rounded-full animate-typing-cursor motion-reduce:animate-none motion-reduce:opacity-60',\n        bgColorMap[color]\n      )}\n      style={{ width, height, animationDuration: '1200ms' }}\n    />\n  )\n}\n\nexport { TypingIndicator, typingIndicatorVariants }\n"],"mappings":";;;;;;AAEA,YAAY,WAAW;AACvB,SAAS,WAA8B;AAQvC,IAAM,YAAY,EAAE,IAAI,GAAG,SAAS,GAAG,IAAI,EAAE;AAG7C,IAAM,UAAU,EAAE,IAAI,GAAG,SAAS,GAAG,IAAI,EAAE;AAG3C,IAAM,WAAW,EAAE,MAAM,MAAM,SAAS,MAAM,MAAM,IAAI;AAGxD,IAAM,YAAY;AAMlB,IAAM,aAAa;AAAA,EACjB,SAAS;AAAA,EACT,SAAS;AAAA,EACT,OAAS;AACX;AAMA,IAAM,0BAA0B;AAAA,EAC9B;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,IAAS;AAAA,QACT,SAAS;AAAA,QACT,IAAS;AAAA,MACX;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,MAAM;AAAA,IACR;AAAA,EACF;AACF;AAyBA,IAAM,kBAAwB;AAAA,EAC5B,CACE;AAAA,IACE;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,GAAG;AAAA,EACL,GACA,QACG;AACH,UAAM,eAAe,QAAQ;AAE7B,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,MAAK;AAAA,QACL,aAAU;AAAA,QACV,cAAY;AAAA,QACZ,WAAW,GAAG,wBAAwB,EAAE,KAAK,CAAC,GAAG,SAAS;AAAA,QACzD,GAAG;AAAA;AAAA,MAEH,YAAY,UACX,oCAAC,iBAAc,MAAM,cAAc,OAAc,OAAc;AAAA,MAEhE,YAAY,YACX,oCAAC,mBAAgB,MAAM,cAAc,OAAc;AAAA,MAEpD,aACC,oCAAC,UAAK,WAAU,iCAA+B,KAAM;AAAA,IAEzD;AAAA,EAEJ;AACF;AACA,gBAAgB,cAAc;AAM9B,SAAS,cAAc;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AACF,GAIG;AACD,QAAM,UAAU,UAAU,IAAI;AAC9B,QAAM,MAAM,QAAQ,IAAI;AACxB,QAAM,WAAW,SAAS,KAAK;AAE/B,SACE,oCAAC,SAAI,WAAU,4BAA2B,OAAO,EAAE,IAAI,KACpD,MAAM,KAAK,EAAE,QAAQ,UAAU,GAAG,CAAC,GAAG,MACrC;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,WAAW;AAAA,QACT;AAAA,QACA,WAAW,KAAK;AAAA,MAClB;AAAA,MACA,OAAO;AAAA,QACL,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,mBAAmB,GAAG,QAAQ;AAAA,QAC9B,gBAAgB,GAAG,KAAK,WAAW,YAAY,IAAI;AAAA,MACrD;AAAA;AAAA,EACF,CACD,CACH;AAEJ;AAMA,IAAM,cAAc;AAAA,EAClB,IAAS,EAAE,OAAO,GAAG,QAAQ,GAAG;AAAA,EAChC,SAAS,EAAE,OAAO,KAAK,QAAQ,GAAG;AAAA,EAClC,IAAS,EAAE,OAAO,GAAG,QAAQ,GAAG;AAClC;AAMA,SAAS,gBAAgB;AAAA,EACvB;AAAA,EACA;AACF,GAGG;AACD,QAAM,EAAE,OAAO,OAAO,IAAI,YAAY,IAAI;AAE1C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAY;AAAA,MACZ,WAAW;AAAA,QACT;AAAA,QACA,WAAW,KAAK;AAAA,MAClB;AAAA,MACA,OAAO,EAAE,OAAO,QAAQ,mBAAmB,SAAS;AAAA;AAAA,EACtD;AAEJ;","names":[]}

package/dist/chunk-SDDAGZWA.mjs

@@ -0,0 +1,224 @@
+"use client";
+import {
+  useFieldContext,
+  useFieldControl
+} from "./chunk-T5A4APEL.mjs";
+import {
+  cn
+} from "./chunk-53MIUPSY.mjs";
+
+// src/components/ui/input.tsx
+import * as React from "react";
+import { cva } from "class-variance-authority";
+var inputVariants = cva(
+  [
+    "flex w-full bg-background text-foreground placeholder:text-foreground/30",
+    "border transition-colors duration-micro outline-transparent",
+    "focus:[outline:2px_solid_transparent]",
+    "disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-background-muted",
+    "file:border-0 file:bg-transparent file:text-sm file:font-semibold"
+  ].join(" "),
+  {
+    variants: {
+      variant: {
+        default: "border-border hover:border-border-strong",
+        filled: "border-transparent bg-background-muted"
+      },
+      focusRing: {
+        true: "",
+        false: ""
+      },
+      size: {
+        xs: "h-9 px-3 text-sm",
+        // 36px / 12px padding / 13px font (3.0:1)
+        sm: "h-10 px-3 text-md",
+        // 40px / 12px padding / 14px font (3.3:1)
+        default: "h-11 px-4 text-base",
+        // 44px / 16px padding / 16px font (2.75:1)
+        lg: "h-12 px-4 text-base",
+        // 48px / 16px padding / 16px font (3.0:1)
+        xl: "h-14 px-4 text-base"
+        // 56px / 16px padding / 16px font (3.5:1)
+      },
+      radius: {
+        none: "rounded-none",
+        sm: "rounded-sm",
+        base: "rounded",
+        default: "rounded-md",
+        lg: "rounded-lg",
+        xl: "rounded-xl",
+        "2xl": "rounded-2xl",
+        "3xl": "rounded-3xl",
+        full: "rounded-full"
+      },
+      state: {
+        default: "",
+        error: "border-error hover:border-error focus:border-error shadow-[0_0_0_2px_var(--color-focus-ring-error)]"
+      }
+    },
+    compoundVariants: [
+      // focusRing: true → show custom focus ring
+      { focusRing: true, className: "focus-visible:shadow-[0_0_0_2px_var(--color-focus-ring)]" },
+      // focusRing: false → keep same state as hover
+      { variant: "default", focusRing: false, className: "focus:border-border-strong" },
+      // filled + error
+      {
+        variant: "filled",
+        state: "error",
+        className: "border-transparent hover:border-transparent focus:border-transparent bg-[var(--color-error-bg)] hover:bg-[var(--color-error-bg)] focus:bg-[var(--color-error-bg)] shadow-none"
+      }
+    ],
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+      radius: "default",
+      state: "default",
+      focusRing: false
+    }
+  }
+);
+var iconSizeClasses = {
+  xs: "icon-xs",
+  // 14px
+  sm: "icon-xs",
+  // 14px
+  default: "icon-sm",
+  // 16px
+  lg: "icon-sm",
+  // 16px
+  xl: "icon-sm"
+  // 16px
+};
+var iconPaddingClasses = {
+  xs: { left: "pl-8", right: "pr-8" },
+  // 12px + 14px icon + 6px gap = 32px
+  sm: { left: "pl-9", right: "pr-9" },
+  // 12px + 14px icon + 8px gap = 34px → 36px
+  default: { left: "pl-10", right: "pr-10" },
+  // 16px + 16px icon + 8px gap = 40px
+  lg: { left: "pl-10", right: "pr-10" },
+  // 16px + 16px icon + 8px gap = 40px
+  xl: { left: "pl-10", right: "pr-10" }
+  // 16px + 16px icon + 8px gap = 40px
+};
+var iconPositionClasses = {
+  xs: { left: "left-3", right: "right-3" },
+  // 12px
+  sm: { left: "left-3", right: "right-3" },
+  // 12px
+  default: { left: "left-4", right: "right-4" },
+  // 16px
+  lg: { left: "left-4", right: "right-4" },
+  // 16px
+  xl: { left: "left-4", right: "right-4" }
+  // 16px
+};
+var Input = React.forwardRef(
+  ({ className, variant, size, radius, state, type, leftIcon, rightIcon, error, focusRing, id, onPointerDown, onFocus, onBlur, ...props }, ref) => {
+    const fieldContext = useFieldContext();
+    const resolvedSize = size || "default";
+    const resolvedError = error ?? fieldContext?.error;
+    const resolvedState = resolvedError ? "error" : state;
+    const inputId = id ?? fieldContext?.id;
+    useFieldControl("single", Boolean(fieldContext) && !id);
+    const isDisabled = props.disabled ?? fieldContext?.disabled;
+    const pointerRef = React.useRef(false);
+    const windowBlurredRef = React.useRef(false);
+    const [keyboardFocus, setKeyboardFocus] = React.useState(false);
+    React.useEffect(() => {
+      const onBlur2 = () => {
+        windowBlurredRef.current = true;
+      };
+      const onFocus2 = () => {
+        requestAnimationFrame(() => {
+          windowBlurredRef.current = false;
+        });
+      };
+      window.addEventListener("blur", onBlur2);
+      window.addEventListener("focus", onFocus2);
+      return () => {
+        window.removeEventListener("blur", onBlur2);
+        window.removeEventListener("focus", onFocus2);
+      };
+    }, []);
+    const handlePointerDown = React.useCallback((e) => {
+      pointerRef.current = true;
+      onPointerDown?.(e);
+    }, [onPointerDown]);
+    const handleFocus = React.useCallback((e) => {
+      if (!pointerRef.current && !focusRing && !windowBlurredRef.current) {
+        setKeyboardFocus(true);
+      }
+      pointerRef.current = false;
+      onFocus?.(e);
+    }, [focusRing, onFocus]);
+    const handleBlur = React.useCallback((e) => {
+      setKeyboardFocus(false);
+      pointerRef.current = false;
+      onBlur?.(e);
+    }, [onBlur]);
+    const ariaDescribedBy = fieldContext ? [
+      resolvedError ? `${fieldContext.id}-error` : null
+    ].filter(Boolean).join(" ") || void 0 : void 0;
+    const focusHandlers = {
+      onPointerDown: handlePointerDown,
+      onFocus: handleFocus,
+      onBlur: handleBlur
+    };
+    if (leftIcon || rightIcon) {
+      return /* @__PURE__ */ React.createElement("div", { className: "relative w-full" }, leftIcon && /* @__PURE__ */ React.createElement("div", { className: cn(
+        "absolute top-1/2 -translate-y-1/2 pointer-events-none text-text-muted z-10",
+        iconPositionClasses[resolvedSize].left,
+        `[&>svg]:${iconSizeClasses[resolvedSize]}`
+      ) }, leftIcon), /* @__PURE__ */ React.createElement(
+        "input",
+        {
+          type,
+          id: inputId,
+          className: cn(
+            inputVariants({ variant, size, radius, state: resolvedState, focusRing }),
+            keyboardFocus && "shadow-[0_0_0_2px_var(--color-focus-ring)]",
+            leftIcon && iconPaddingClasses[resolvedSize].left,
+            rightIcon && iconPaddingClasses[resolvedSize].right,
+            className
+          ),
+          "aria-invalid": resolvedError || void 0,
+          "aria-describedby": ariaDescribedBy,
+          disabled: isDisabled,
+          ref,
+          ...focusHandlers,
+          ...props
+        }
+      ), rightIcon && /* @__PURE__ */ React.createElement("div", { className: cn(
+        "absolute top-1/2 -translate-y-1/2 pointer-events-none text-text-muted z-10",
+        iconPositionClasses[resolvedSize].right,
+        `[&>svg]:${iconSizeClasses[resolvedSize]}`
+      ) }, rightIcon));
+    }
+    return /* @__PURE__ */ React.createElement(
+      "input",
+      {
+        type,
+        id: inputId,
+        className: cn(
+          inputVariants({ variant, size, radius, state: resolvedState, focusRing }),
+          keyboardFocus && "shadow-[0_0_0_2px_var(--color-focus-ring)]",
+          className
+        ),
+        "aria-invalid": resolvedError || void 0,
+        "aria-describedby": ariaDescribedBy,
+        disabled: isDisabled,
+        ref,
+        ...focusHandlers,
+        ...props
+      }
+    );
+  }
+);
+Input.displayName = "Input";
+
+export {
+  inputVariants,
+  Input
+};
+//# sourceMappingURL=chunk-SDDAGZWA.mjs.map

package/dist/chunk-SDDAGZWA.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ui/input.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\nimport { useFieldContext, useFieldControl } from './field'\n\nconst inputVariants = cva(\n  [\n    'flex w-full bg-background text-foreground placeholder:text-foreground/30',\n    'border transition-colors duration-micro outline-transparent',\n    'focus:[outline:2px_solid_transparent]',\n    'disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-background-muted',\n    'file:border-0 file:bg-transparent file:text-sm file:font-semibold',\n  ].join(' '),\n  {\n    variants: {\n      variant: {\n        default: 'border-border hover:border-border-strong',\n        filled: 'border-transparent bg-background-muted',\n      },\n      focusRing: {\n        true: '',\n        false: '',\n      },\n      size: {\n        xs: 'h-9 px-3 text-sm',          // 36px / 12px padding / 13px font (3.0:1)\n        sm: 'h-10 px-3 text-md',         // 40px / 12px padding / 14px font (3.3:1)\n        default: 'h-11 px-4 text-base',  // 44px / 16px padding / 16px font (2.75:1)\n        lg: 'h-12 px-4 text-base',       // 48px / 16px padding / 16px font (3.0:1)\n        xl: 'h-14 px-4 text-base',        // 56px / 16px padding / 16px font (3.5:1)\n      },\n      radius: {\n        none: 'rounded-none',\n        sm: 'rounded-sm',\n        base: 'rounded',\n        default: 'rounded-md',\n        lg: 'rounded-lg',\n        xl: 'rounded-xl',\n        '2xl': 'rounded-2xl',\n        '3xl': 'rounded-3xl',\n        full: 'rounded-full',\n      },\n      state: {\n        default: '',\n        error: 'border-error hover:border-error focus:border-error shadow-[0_0_0_2px_var(--color-focus-ring-error)]',\n      },\n    },\n    compoundVariants: [\n      // focusRing: true → show custom focus ring\n      { focusRing: true, className: 'focus-visible:shadow-[0_0_0_2px_var(--color-focus-ring)]' },\n      // focusRing: false → keep same state as hover\n      { variant: 'default', focusRing: false, className: 'focus:border-border-strong' },\n      // filled + error\n      {\n        variant: 'filled',\n        state: 'error',\n        className: 'border-transparent hover:border-transparent focus:border-transparent bg-[var(--color-error-bg)] hover:bg-[var(--color-error-bg)] focus:bg-[var(--color-error-bg)] shadow-none',\n      },\n    ],\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n      radius: 'default',\n      state: 'default',\n      focusRing: false,\n    },\n  }\n)\n\nexport interface InputProps\n  extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>,\n    VariantProps<typeof inputVariants> {\n  leftIcon?: React.ReactNode\n  rightIcon?: React.ReactNode\n  error?: boolean\n  focusRing?: boolean\n}\n\n// Icon size for input (2-step scale)\n// xs~sm: 14px, default~xl: 16px\nconst iconSizeClasses = {\n  xs: 'icon-xs',      // 14px\n  sm: 'icon-xs',      // 14px\n  default: 'icon-sm', // 16px\n  lg: 'icon-sm',      // 16px\n  xl: 'icon-sm',      // 16px\n}\n\n// Icon padding (padding + icon + gap)\nconst iconPaddingClasses = {\n  xs: { left: 'pl-8', right: 'pr-8' },       // 12px + 14px icon + 6px gap = 32px\n  sm: { left: 'pl-9', right: 'pr-9' },       // 12px + 14px icon + 8px gap = 34px → 36px\n  default: { left: 'pl-10', right: 'pr-10' }, // 16px + 16px icon + 8px gap = 40px\n  lg: { left: 'pl-10', right: 'pr-10' },     // 16px + 16px icon + 8px gap = 40px\n  xl: { left: 'pl-10', right: 'pr-10' },     // 16px + 16px icon + 8px gap = 40px\n}\n\n// Icon position (matches horizontal padding)\nconst iconPositionClasses = {\n  xs: { left: 'left-3', right: 'right-3' },      // 12px\n  sm: { left: 'left-3', right: 'right-3' },      // 12px\n  default: { left: 'left-4', right: 'right-4' }, // 16px\n  lg: { left: 'left-4', right: 'right-4' },      // 16px\n  xl: { left: 'left-4', right: 'right-4' },      // 16px\n}\n\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n  ({ className, variant, size, radius, state, type, leftIcon, rightIcon, error, focusRing, id, onPointerDown, onFocus, onBlur, ...props }, ref) => {\n    const fieldContext = useFieldContext()\n    const resolvedSize = size || 'default'\n    const resolvedError = error ?? fieldContext?.error\n    const resolvedState = resolvedError ? 'error' : state\n    const inputId = id ?? fieldContext?.id\n    useFieldControl('single', Boolean(fieldContext) && !id)\n    const isDisabled = props.disabled ?? fieldContext?.disabled\n\n    // Keyboard focus detection (when focusRing: false, auto-show ring on Tab navigation)\n    const pointerRef = React.useRef(false)\n    const windowBlurredRef = React.useRef(false)\n    const [keyboardFocus, setKeyboardFocus] = React.useState(false)\n\n    // Track window blur/focus to distinguish Tab navigation from window re-activation\n    React.useEffect(() => {\n      const onBlur = () => { windowBlurredRef.current = true }\n      const onFocus = () => { requestAnimationFrame(() => { windowBlurredRef.current = false }) }\n      window.addEventListener('blur', onBlur)\n      window.addEventListener('focus', onFocus)\n      return () => { window.removeEventListener('blur', onBlur); window.removeEventListener('focus', onFocus) }\n    }, [])\n\n    const handlePointerDown = React.useCallback((e: React.PointerEvent<HTMLInputElement>) => {\n      pointerRef.current = true\n      onPointerDown?.(e)\n    }, [onPointerDown])\n\n    const handleFocus = React.useCallback((e: React.FocusEvent<HTMLInputElement>) => {\n      if (!pointerRef.current && !focusRing && !windowBlurredRef.current) {\n        setKeyboardFocus(true)\n      }\n      pointerRef.current = false\n      onFocus?.(e)\n    }, [focusRing, onFocus])\n\n    const handleBlur = React.useCallback((e: React.FocusEvent<HTMLInputElement>) => {\n      setKeyboardFocus(false)\n      pointerRef.current = false\n      onBlur?.(e)\n    }, [onBlur])\n\n    // Build aria-describedby from context\n    const ariaDescribedBy = fieldContext\n      ? [\n          resolvedError ? `${fieldContext.id}-error` : null,\n        ]\n          .filter(Boolean)\n          .join(' ') || undefined\n      : undefined\n\n    const focusHandlers = {\n      onPointerDown: handlePointerDown,\n      onFocus: handleFocus,\n      onBlur: handleBlur,\n    }\n\n    // If icons are present, wrap input in a container\n    if (leftIcon || rightIcon) {\n      return (\n        <div className=\"relative w-full\">\n          {leftIcon && (\n            <div className={cn(\n              'absolute top-1/2 -translate-y-1/2 pointer-events-none text-text-muted z-10',\n              iconPositionClasses[resolvedSize].left,\n              `[&>svg]:${iconSizeClasses[resolvedSize]}`\n            )}>\n              {leftIcon}\n            </div>\n          )}\n          <input\n            type={type}\n            id={inputId}\n            className={cn(\n              inputVariants({ variant, size, radius, state: resolvedState, focusRing }),\n              keyboardFocus && 'shadow-[0_0_0_2px_var(--color-focus-ring)]',\n              leftIcon && iconPaddingClasses[resolvedSize].left,\n              rightIcon && iconPaddingClasses[resolvedSize].right,\n              className\n            )}\n            aria-invalid={resolvedError || undefined}\n            aria-describedby={ariaDescribedBy}\n            disabled={isDisabled}\n            ref={ref}\n            {...focusHandlers}\n            {...props}\n          />\n          {rightIcon && (\n            <div className={cn(\n              'absolute top-1/2 -translate-y-1/2 pointer-events-none text-text-muted z-10',\n              iconPositionClasses[resolvedSize].right,\n              `[&>svg]:${iconSizeClasses[resolvedSize]}`\n            )}>\n              {rightIcon}\n            </div>\n          )}\n        </div>\n      )\n    }\n\n    return (\n      <input\n        type={type}\n        id={inputId}\n        className={cn(\n          inputVariants({ variant, size, radius, state: resolvedState, focusRing }),\n          keyboardFocus && 'shadow-[0_0_0_2px_var(--color-focus-ring)]',\n          className\n        )}\n        aria-invalid={resolvedError || undefined}\n        aria-describedby={ariaDescribedBy}\n        disabled={isDisabled}\n        ref={ref}\n        {...focusHandlers}\n        {...props}\n      />\n    )\n  }\n)\nInput.displayName = 'Input'\n\nexport { Input, inputVariants }\n"],"mappings":"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","names":["onBlur","onFocus"]}