@elabs-ai/components-ui 4.1.0 → 5.0.0

package/dist/chunk-J2P4YZLC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/nav-notifications/nav-notifications.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ComponentProps } from \"react\";\nimport { BellIcon } from \"lucide-react\";\nimport { Avatar, AvatarFallback } from \"../avatar\";\nimport { Button } from \"../button\";\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuLabel,\n  DropdownMenuSeparator,\n  DropdownMenuTrigger,\n} from \"../dropdown-menu\";\nimport { useLocale } from \"../locale-provider\";\nimport { cn } from \"../../lib/cn\";\n\nexport interface NavNotification {\n  id: string;\n  /** Two-letter fallback initials for the avatar. */\n  fallback: string;\n  text: string;\n  time: string;\n}\n\nexport interface NavNotificationsProps {\n  notifications: NavNotification[];\n  /** Label for the \"view all\" footer item. @default \"View all notifications\" */\n  viewAllLabel?: string;\n  /**\n   * Which side of the trigger the menu opens on.\n   *\n   * The default is `\"right\"`, which is right for the surface this component was\n   * extracted from — a bell sitting in a left-hand nav rail. It is WRONG for a\n   * trigger at the end of a top bar: Radix collision-handling then flips the\n   * menu back across the trigger and it covers the controls beside it. Set\n   * `side=\"bottom\"` (usually with `align=\"end\"`) for a top-bar bell.\n   *\n   * @default \"right\"\n   */\n  side?: ComponentProps<typeof DropdownMenuContent>[\"side\"];\n  /**\n   * How the menu aligns along that side. Radix's own default is `\"center\"`;\n   * pass `\"end\"` so a top-bar menu hangs from the trigger's outer edge instead\n   * of straddling it.\n   */\n  align?: ComponentProps<typeof DropdownMenuContent>[\"align\"];\n  /**\n   * Extra classes for the component ROOT — the bell trigger — merged last, so a\n   * caller can override the shipped `rounded-full` (`component-api.md`).\n   *\n   * There is deliberately NO seam for the portalled menu surface: nothing needs\n   * one today, and an unused prop is a worse API than a missing one. The one\n   * thing a caller used to reach for it (dropping the rail's vertical inset for\n   * a top-bar menu) is now derived from `side` instead — see below.\n   */\n  className?: string;\n}\n\n/**\n * Notifications dropdown button. Shared primitive from sidebar-02 (issue #99).\n * Renders a bell-icon ghost button that opens a dropdown listing recent\n * notifications.\n *\n * Placement is caller-owned via `side`/`align`; the defaults are the original\n * rail placement, so every existing call site renders unchanged. `className`\n * styles the trigger, not the menu.\n */\nexport function NavNotifications({\n  notifications,\n  viewAllLabel = \"View all notifications\",\n  side = \"right\",\n  align,\n  className,\n}: NavNotificationsProps) {\n  const { t } = useLocale();\n  return (\n    <DropdownMenu>\n      <DropdownMenuTrigger asChild>\n        <Button\n          variant=\"ghost\"\n          size=\"icon\"\n          className={cn(\"rounded-full\", className)}\n          aria-label={t(\"ui.navNotifications.trigger\")}\n        >\n          <BellIcon className=\"size-5\" />\n        </Button>\n      </DropdownMenuTrigger>\n      <DropdownMenuContent\n        side={side}\n        align={align}\n        // Keeps the menu clear of the viewport edge instead of sitting flush\n        // against it on a narrow phone screen.\n        collisionPadding={16}\n        className={cn(\n          // The vertical inset belongs to the SIDE-opening rail placement, where\n          // the menu runs alongside its trigger and needs clearance from it. A\n          // menu that opens above or below the trigger is already clear of it,\n          // and the inset would just hang it 24px off the bar. Derived from\n          // `side` rather than exposed as a second className seam.\n          (side === \"left\" || side === \"right\") && \"my-6\",\n          // `w-80` (320px) is wider than some phone viewports once the 16px\n          // collision padding on both sides is subtracted — cap it so the menu\n          // shrinks instead of forcing horizontal overflow.\n          \"w-80 max-w-[calc(100vw-2rem)]\",\n        )}\n      >\n        <DropdownMenuLabel>{t(\"ui.navNotifications.label\")}</DropdownMenuLabel>\n        <DropdownMenuSeparator />\n        {notifications.map(({ id, fallback, text, time }) => (\n          <DropdownMenuItem key={id} className=\"flex items-start gap-3\">\n            <Avatar className=\"size-8\">\n              <AvatarFallback>{fallback}</AvatarFallback>\n            </Avatar>\n            <div className=\"flex flex-col\">\n              <span className=\"text-body font-medium\">{text}</span>\n              <span className=\"text-meta text-muted-foreground\">{time}</span>\n            </div>\n          </DropdownMenuItem>\n        ))}\n        <DropdownMenuSeparator />\n        <DropdownMenuItem className=\"justify-center text-body text-muted-foreground\">\n          {viewAllLabel}\n        </DropdownMenuItem>\n      </DropdownMenuContent>\n    </DropdownMenu>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAGA,SAAS,gBAAgB;AAkFf,cA6BE,YA7BF;AAjBH,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA,eAAe;AAAA,EACf,OAAO;AAAA,EACP;AAAA,EACA;AACF,GAA0B;AACxB,QAAM,EAAE,EAAE,IAAI,UAAU;AACxB,SACE,qBAAC,gBACC;AAAA,wBAAC,uBAAoB,SAAO,MAC1B;AAAA,MAAC;AAAA;AAAA,QACC,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,WAAW,GAAG,gBAAgB,SAAS;AAAA,QACvC,cAAY,EAAE,6BAA6B;AAAA,QAE3C,8BAAC,YAAS,WAAU,UAAS;AAAA;AAAA,IAC/B,GACF;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QAGA,kBAAkB;AAAA,QAClB,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAMR,SAAS,UAAU,SAAS,YAAY;AAAA;AAAA;AAAA;AAAA,UAIzC;AAAA,QACF;AAAA,QAEA;AAAA,8BAAC,qBAAmB,YAAE,2BAA2B,GAAE;AAAA,UACnD,oBAAC,yBAAsB;AAAA,UACtB,cAAc,IAAI,CAAC,EAAE,IAAI,UAAU,MAAM,KAAK,MAC7C,qBAAC,oBAA0B,WAAU,0BACnC;AAAA,gCAAC,UAAO,WAAU,UAChB,8BAAC,kBAAgB,oBAAS,GAC5B;AAAA,YACA,qBAAC,SAAI,WAAU,iBACb;AAAA,kCAAC,UAAK,WAAU,yBAAyB,gBAAK;AAAA,cAC9C,oBAAC,UAAK,WAAU,mCAAmC,gBAAK;AAAA,eAC1D;AAAA,eAPqB,EAQvB,CACD;AAAA,UACD,oBAAC,yBAAsB;AAAA,UACvB,oBAAC,oBAAiB,WAAU,kDACzB,wBACH;AAAA;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;","names":[]}

package/dist/chunk-JCRBDA66.js

@@ -0,0 +1,2 @@
+"use client";
+//# sourceMappingURL=chunk-JCRBDA66.js.map

package/dist/chunk-JCRBDA66.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-JGS2IHER.js

@@ -0,0 +1,140 @@
+"use client";
+import {
+  ToggleGroup,
+  ToggleGroupItem
+} from "./chunk-35DUHYPC.js";
+import {
+  Label
+} from "./chunk-TEKBTTP2.js";
+import {
+  cn
+} from "./chunk-KBNWM27Q.js";
+
+// src/components/segmented-field/segmented-field.tsx
+import {
+  forwardRef,
+  useCallback,
+  useId,
+  useRef,
+  useState
+} from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var NAV_KEYS = /* @__PURE__ */ new Set(["ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown", "Home", "End"]);
+var SegmentedField = forwardRef(
+  function SegmentedField2({
+    label,
+    options,
+    value: valueProp,
+    defaultValue,
+    onValueChange,
+    size = "sm",
+    disabled,
+    id,
+    className,
+    children,
+    ...props
+  }, ref) {
+    const generatedId = useId();
+    const labelId = `${id ?? generatedId}-label`;
+    const groupRef = useRef(null);
+    const isControlled = valueProp !== void 0;
+    const [internalValue, setInternalValue] = useState(defaultValue);
+    const currentValue = isControlled ? valueProp : internalValue;
+    const lastCommittedRef = useRef(currentValue);
+    lastCommittedRef.current = currentValue;
+    const commit = useCallback(
+      (next) => {
+        if (next === "" || next === lastCommittedRef.current) return;
+        lastCommittedRef.current = next;
+        if (!isControlled) setInternalValue(next);
+        onValueChange?.(next);
+      },
+      [isControlled, onValueChange]
+    );
+    const keyboardNavRef = useRef(false);
+    const handleKeyDownCapture = useCallback(
+      (event) => {
+        keyboardNavRef.current = NAV_KEYS.has(event.key);
+        props.onKeyDownCapture?.(event);
+      },
+      [props]
+    );
+    const handlePointerDownCapture = useCallback(
+      (event) => {
+        keyboardNavRef.current = false;
+        props.onPointerDownCapture?.(event);
+      },
+      [props]
+    );
+    const handleBlurCapture = useCallback(
+      (event) => {
+        if (!event.currentTarget.contains(event.relatedTarget)) {
+          keyboardNavRef.current = false;
+        }
+        props.onBlurCapture?.(event);
+      },
+      [props]
+    );
+    const handleItemFocus = useCallback(
+      (next) => {
+        if (!keyboardNavRef.current) return;
+        keyboardNavRef.current = false;
+        commit(next);
+      },
+      [commit]
+    );
+    const handleLabelClick = useCallback(() => {
+      const group = groupRef.current;
+      if (!group) return;
+      const selected = group.querySelector(
+        '[aria-checked="true"]:not(:disabled),[data-state="on"]:not(:disabled)'
+      );
+      (selected ?? group.querySelector("button:not(:disabled)"))?.focus();
+    }, []);
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        "data-slot": "segmented-field",
+        className: cn("flex flex-col items-start gap-1.5", className),
+        ...props,
+        onKeyDownCapture: handleKeyDownCapture,
+        onPointerDownCapture: handlePointerDownCapture,
+        onBlurCapture: handleBlurCapture,
+        children: [
+          /* @__PURE__ */ jsx(Label, { id: labelId, "data-slot": "segmented-field-label", onClick: handleLabelClick, children: label }),
+          /* @__PURE__ */ jsx(
+            ToggleGroup,
+            {
+              ref: groupRef,
+              type: "single",
+              variant: "segmented",
+              size,
+              value: currentValue ?? "",
+              onValueChange: commit,
+              disabled,
+              "aria-labelledby": labelId,
+              "data-slot": "segmented-field-options",
+              children: options ? options.map((option) => /* @__PURE__ */ jsx(
+                ToggleGroupItem,
+                {
+                  "data-slot": "segmented-field-segment",
+                  value: option.value,
+                  disabled: option.disabled,
+                  onFocus: () => handleItemFocus(option.value),
+                  children: option.label
+                },
+                option.value
+              )) : children
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+
+export {
+  SegmentedField
+};
+//# sourceMappingURL=chunk-JGS2IHER.js.map

package/dist/chunk-JGS2IHER.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/segmented-field/segmented-field.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  forwardRef,\n  useCallback,\n  useId,\n  useRef,\n  useState,\n  type FocusEvent as ReactFocusEvent,\n  type HTMLAttributes,\n  type KeyboardEvent as ReactKeyboardEvent,\n  type PointerEvent as ReactPointerEvent,\n  type ReactNode,\n} from \"react\";\nimport { cn } from \"../../lib/cn\";\nimport { Label } from \"../label\";\nimport { ToggleGroup, ToggleGroupItem } from \"../toggle-group\";\n\n/** Keys whose focus move must also move the selection (WAI-ARIA radiogroup). */\nconst NAV_KEYS = new Set([\"ArrowLeft\", \"ArrowRight\", \"ArrowUp\", \"ArrowDown\", \"Home\", \"End\"]);\n\nexport interface SegmentedFieldOption {\n  /** The option's value, reported to `onValueChange`. */\n  value: string;\n  /** Visible content for the segment. */\n  label: ReactNode;\n  /** Disables just this segment. */\n  disabled?: boolean;\n}\n\nexport interface SegmentedFieldProps extends Omit<\n  HTMLAttributes<HTMLDivElement>,\n  \"onChange\" | \"defaultValue\"\n> {\n  /** Visible label describing the field. */\n  label: ReactNode;\n  /**\n   * Segment options. Omit and render `ToggleGroupItem` children directly for\n   * the compound-component escape hatch (component-api.md) when a plain\n   * `{ value, label }` shape isn't expressive enough.\n   */\n  options?: SegmentedFieldOption[];\n  /** Controlled selected value. */\n  value?: string;\n  /** Uncontrolled initial selected value. */\n  defaultValue?: string;\n  /**\n   * Called when the selected value changes. Never called with `\"\"` —\n   * re-clicking the active segment (Radix `ToggleGroup`'s `type=\"single\"`\n   * empty-emission on re-click) is swallowed as a no-op instead of clearing\n   * the field.\n   */\n  onValueChange?: (value: string) => void;\n  /** Size applied to every segment. Defaults to \"sm\", matching the compact segmented look. */\n  size?: \"default\" | \"sm\" | \"lg\";\n  /** Disables every segment. */\n  disabled?: boolean;\n  /** `ToggleGroupItem` children — the compound escape hatch (used instead of `options`). */\n  children?: ReactNode;\n}\n\n/**\n * SegmentedField — a labelled segmented control with STICKY selection.\n *\n * Composes the existing `Label` + `ToggleGroup`/`ToggleGroupItem`\n * (`variant=\"segmented\"`) — no new visual style. The whole reason this\n * component exists: Radix's `ToggleGroup` in `type=\"single\"` mode emits `\"\"`\n * when the already-active segment is re-clicked, silently clearing a field\n * that must always hold exactly one value. `SegmentedField` swallows that\n * emission so re-clicking the active segment is a true no-op.\n *\n * Per the WAI-ARIA radiogroup pattern (each segment renders `role=\"radio\"`\n * for `type=\"single\"`), ARROW-KEY navigation also SELECTS the newly focused\n * segment (selection follows focus), matching native radio-button behavior —\n * Radix's roving-tabindex only moves focus, so this component adds that\n * activation on top of it.\n *\n * Selection follows focus ONLY for arrow/Home/End keys, never for arbitrary\n * focus. A bare `onFocus` commit would make three non-navigation paths mutate\n * the field: clicking the `<Label>` (which moves focus into the group),\n * tabbing into a group with nothing selected yet, and any programmatic\n * `.focus()` a consumer performs. The keyboard intent is recorded on the\n * wrapper in the CAPTURE phase (it must land before Radix's own roving-focus\n * keydown handler runs) and is cleared by the focus it explains, by a pointer\n * press, by any non-navigation key, or by focus leaving the field — so it can\n * never leak into a later, unrelated focus.\n */\nexport const SegmentedField = forwardRef<HTMLDivElement, SegmentedFieldProps>(\n  function SegmentedField(\n    {\n      label,\n      options,\n      value: valueProp,\n      defaultValue,\n      onValueChange,\n      size = \"sm\",\n      disabled,\n      id,\n      className,\n      children,\n      ...props\n    },\n    ref,\n  ) {\n    const generatedId = useId();\n    const labelId = `${id ?? generatedId}-label`;\n    const groupRef = useRef<HTMLDivElement>(null);\n\n    const isControlled = valueProp !== undefined;\n    const [internalValue, setInternalValue] = useState(defaultValue);\n    const currentValue = isControlled ? valueProp : internalValue;\n\n    // Synced every render (mirrors the ref-during-render idiom in\n    // NumberInput) so a same-event double-dispatch (focus-follows-selection\n    // AND the click's own onPressedChange) commits at most once.\n    const lastCommittedRef = useRef(currentValue);\n    lastCommittedRef.current = currentValue;\n\n    const commit = useCallback(\n      (next: string) => {\n        // Radix emits \"\" when the active segment is re-clicked — swallow it.\n        if (next === \"\" || next === lastCommittedRef.current) return;\n        lastCommittedRef.current = next;\n        if (!isControlled) setInternalValue(next);\n        onValueChange?.(next);\n      },\n      [isControlled, onValueChange],\n    );\n\n    // Armed by an arrow/Home/End key, DISARMED by anything else — a pointer\n    // press, any other key, or focus leaving the field. It is deliberately not\n    // a timer: `@radix-ui/react-roving-focus` moves focus in a\n    // `setTimeout(() => focusFirst(...))`, so a microtask/`setTimeout` reset\n    // queued from the capture phase would always fire first and the arm would\n    // be gone before the focus it exists to classify.\n    const keyboardNavRef = useRef(false);\n\n    const handleKeyDownCapture = useCallback(\n      (event: ReactKeyboardEvent<HTMLDivElement>) => {\n        keyboardNavRef.current = NAV_KEYS.has(event.key);\n        props.onKeyDownCapture?.(event);\n      },\n      [props],\n    );\n\n    const handlePointerDownCapture = useCallback(\n      (event: ReactPointerEvent<HTMLDivElement>) => {\n        keyboardNavRef.current = false;\n        props.onPointerDownCapture?.(event);\n      },\n      [props],\n    );\n\n    const handleBlurCapture = useCallback(\n      (event: ReactFocusEvent<HTMLDivElement>) => {\n        // Focus moving between segments keeps the arm; leaving the field drops\n        // it, so a stale arm can never fire on a later tab-in.\n        if (!event.currentTarget.contains(event.relatedTarget as Node | null)) {\n          keyboardNavRef.current = false;\n        }\n        props.onBlurCapture?.(event);\n      },\n      [props],\n    );\n\n    const handleItemFocus = useCallback(\n      (next: string) => {\n        if (!keyboardNavRef.current) return;\n        keyboardNavRef.current = false;\n        commit(next);\n      },\n      [commit],\n    );\n\n    // Match a native `<label>`: move focus into the field without changing it.\n    // Focusing the SELECTED segment (not blindly the first) keeps the visible\n    // selection and the focus ring in agreement.\n    const handleLabelClick = useCallback(() => {\n      const group = groupRef.current;\n      if (!group) return;\n      const selected = group.querySelector<HTMLButtonElement>(\n        '[aria-checked=\"true\"]:not(:disabled),[data-state=\"on\"]:not(:disabled)',\n      );\n      (selected ?? group.querySelector<HTMLButtonElement>(\"button:not(:disabled)\"))?.focus();\n    }, []);\n\n    return (\n      <div\n        ref={ref}\n        data-slot=\"segmented-field\"\n        className={cn(\"flex flex-col items-start gap-1.5\", className)}\n        {...props}\n        // After the spread: these three are load-bearing (they classify a\n        // focus as arrow-navigation or not) and each re-invokes the consumer's\n        // handler, so composing beats being silently replaced.\n        onKeyDownCapture={handleKeyDownCapture}\n        onPointerDownCapture={handlePointerDownCapture}\n        onBlurCapture={handleBlurCapture}\n      >\n        <Label id={labelId} data-slot=\"segmented-field-label\" onClick={handleLabelClick}>\n          {label}\n        </Label>\n        <ToggleGroup\n          ref={groupRef}\n          type=\"single\"\n          variant=\"segmented\"\n          size={size}\n          // Always a string, never `undefined` — an unselected field would\n          // otherwise start UNcontrolled and flip to controlled on the first\n          // selection (React/Radix warn, and the mode flip is exactly what\n          // component-api.md forbids). `\"\"` is Radix's \"nothing selected\".\n          value={currentValue ?? \"\"}\n          onValueChange={commit}\n          disabled={disabled}\n          aria-labelledby={labelId}\n          data-slot=\"segmented-field-options\"\n        >\n          {options\n            ? options.map((option) => (\n                <ToggleGroupItem\n                  key={option.value}\n                  data-slot=\"segmented-field-segment\"\n                  value={option.value}\n                  disabled={option.disabled}\n                  onFocus={() => handleItemFocus(option.value)}\n                >\n                  {option.label}\n                </ToggleGroupItem>\n              ))\n            : children}\n        </ToggleGroup>\n      </div>\n    );\n  },\n);\n"],"mappings":"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","names":["SegmentedField"]}

package/dist/chunk-JNWXHPZG.js

@@ -0,0 +1,24 @@
+"use client";
+import {
+  cn
+} from "./chunk-KBNWM27Q.js";
+
+// src/components/skeleton/skeleton.tsx
+import "react";
+import { jsx } from "react/jsx-runtime";
+function Skeleton({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "skeleton",
+      className: cn("animate-pulse rounded-md bg-muted", className),
+      "aria-hidden": "true",
+      ...props
+    }
+  );
+}
+
+export {
+  Skeleton
+};
+//# sourceMappingURL=chunk-JNWXHPZG.js.map

package/dist/chunk-JNWXHPZG.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/skeleton/skeleton.tsx"],"sourcesContent":["import { type HTMLAttributes } from \"react\";\nimport { cn } from \"../../lib/cn\";\n\nexport type SkeletonProps = HTMLAttributes<HTMLDivElement>;\n\n/** Loading placeholder. Compose with width/height utilities, e.g. `h-4 w-32`. */\nexport function Skeleton({ className, ...props }: SkeletonProps) {\n  return (\n    <div\n      data-slot=\"skeleton\"\n      className={cn(\"animate-pulse rounded-md bg-muted\", className)}\n      aria-hidden=\"true\"\n      {...props}\n    />\n  );\n}\n"],"mappings":";;;;;;AAAA,OAAoC;AAQhC;AAFG,SAAS,SAAS,EAAE,WAAW,GAAG,MAAM,GAAkB;AAC/D,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,qCAAqC,SAAS;AAAA,MAC5D,eAAY;AAAA,MACX,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}

package/dist/chunk-JWWJ2Z5C.js

@@ -0,0 +1,2 @@
+"use client";
+//# sourceMappingURL=chunk-JWWJ2Z5C.js.map

package/dist/chunk-JWWJ2Z5C.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-K2GLXCTG.js

@@ -0,0 +1,2 @@
+"use client";
+//# sourceMappingURL=chunk-K2GLXCTG.js.map

package/dist/chunk-K2GLXCTG.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-K6YRTASS.js

@@ -0,0 +1,55 @@
+"use client";
+import {
+  cn
+} from "./chunk-KBNWM27Q.js";
+
+// src/components/avatar/avatar.tsx
+import { forwardRef } from "react";
+import * as AvatarPrimitive from "@radix-ui/react-avatar";
+import { jsx } from "react/jsx-runtime";
+var Avatar = forwardRef(function Avatar2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    AvatarPrimitive.Root,
+    {
+      ref,
+      "data-slot": "avatar",
+      className: cn("relative flex size-9 shrink-0 overflow-hidden rounded-full", className),
+      ...props
+    }
+  );
+});
+var AvatarImage = forwardRef(function AvatarImage2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    AvatarPrimitive.Image,
+    {
+      ref,
+      "data-slot": "avatar-image",
+      className: cn(
+        "aspect-square size-full animate-in fade-in duration-base ease-entrance",
+        className
+      ),
+      ...props
+    }
+  );
+});
+var AvatarFallback = forwardRef(function AvatarFallback2({ className, ...props }, ref) {
+  return /* @__PURE__ */ jsx(
+    AvatarPrimitive.Fallback,
+    {
+      ref,
+      "data-slot": "avatar-fallback",
+      className: cn(
+        "flex size-full items-center justify-center rounded-full bg-muted text-meta font-medium text-muted-foreground",
+        className
+      ),
+      ...props
+    }
+  );
+});
+
+export {
+  Avatar,
+  AvatarImage,
+  AvatarFallback
+};
+//# sourceMappingURL=chunk-K6YRTASS.js.map

package/dist/chunk-K6YRTASS.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/avatar/avatar.tsx"],"sourcesContent":["import { forwardRef, type ComponentPropsWithoutRef, type ElementRef } from \"react\";\nimport * as AvatarPrimitive from \"@radix-ui/react-avatar\";\nimport { cn } from \"../../lib/cn\";\n\nexport const Avatar = forwardRef<\n  ElementRef<typeof AvatarPrimitive.Root>,\n  ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>\n>(function Avatar({ className, ...props }, ref) {\n  return (\n    <AvatarPrimitive.Root\n      ref={ref}\n      data-slot=\"avatar\"\n      className={cn(\"relative flex size-9 shrink-0 overflow-hidden rounded-full\", className)}\n      {...props}\n    />\n  );\n});\nexport const AvatarImage = forwardRef<\n  ElementRef<typeof AvatarPrimitive.Image>,\n  ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>\n>(function AvatarImage({ className, ...props }, ref) {\n  return (\n    <AvatarPrimitive.Image\n      ref={ref}\n      data-slot=\"avatar-image\"\n      className={cn(\n        \"aspect-square size-full animate-in fade-in duration-base ease-entrance\",\n        className,\n      )}\n      {...props}\n    />\n  );\n});\nexport const AvatarFallback = forwardRef<\n  ElementRef<typeof AvatarPrimitive.Fallback>,\n  ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback>\n>(function AvatarFallback({ className, ...props }, ref) {\n  return (\n    <AvatarPrimitive.Fallback\n      ref={ref}\n      data-slot=\"avatar-fallback\"\n      className={cn(\n        \"flex size-full items-center justify-center rounded-full bg-muted text-meta font-medium text-muted-foreground\",\n        className,\n      )}\n      {...props}\n    />\n  );\n});\n"],"mappings":";;;;;;AAAA,SAAS,kBAAkE;AAC3E,YAAY,qBAAqB;AAQ7B;AALG,IAAM,SAAS,WAGpB,SAASA,QAAO,EAAE,WAAW,GAAG,MAAM,GAAG,KAAK;AAC9C,SACE;AAAA,IAAiB;AAAA,IAAhB;AAAA,MACC;AAAA,MACA,aAAU;AAAA,MACV,WAAW,GAAG,8DAA8D,SAAS;AAAA,MACpF,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;AACM,IAAM,cAAc,WAGzB,SAASC,aAAY,EAAE,WAAW,GAAG,MAAM,GAAG,KAAK;AACnD,SACE;AAAA,IAAiB;AAAA,IAAhB;AAAA,MACC;AAAA,MACA,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;AACM,IAAM,iBAAiB,WAG5B,SAASC,gBAAe,EAAE,WAAW,GAAG,MAAM,GAAG,KAAK;AACtD,SACE;AAAA,IAAiB;AAAA,IAAhB;AAAA,MACC;AAAA,MACA,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ,CAAC;","names":["Avatar","AvatarImage","AvatarFallback"]}

package/dist/chunk-KAAJL2HA.js

@@ -0,0 +1,327 @@
+"use client";
+
+// src/lib/color-scale.ts
+var SEQUENTIAL_RAMP = [
+  "var(--chart-seq-1)",
+  "var(--chart-seq-2)",
+  "var(--chart-seq-3)",
+  "var(--chart-seq-4)",
+  "var(--chart-seq-5)",
+  "var(--chart-seq-6)",
+  "var(--chart-seq-7)"
+];
+var DIVERGING_RAMP = [
+  "var(--chart-div-neg-2)",
+  "var(--chart-div-neg-1)",
+  "var(--chart-div-mid)",
+  "var(--chart-div-pos-1)",
+  "var(--chart-div-pos-2)"
+];
+var CATEGORICAL_SET = Array.from({ length: 12 }, (_, i) => `var(--chart-${i + 1})`);
+var DEFAULT_STEPS = 5;
+var CONTINUOUS_METHODS = /* @__PURE__ */ new Set([
+  "linear",
+  "median",
+  "quartiles",
+  "quintiles",
+  "deciles",
+  "natural"
+]);
+var STEPPED_METHODS = /* @__PURE__ */ new Set([
+  "equidistant",
+  "rounded",
+  "quantile",
+  "jenks",
+  "custom"
+]);
+var QUANTILE_STOPS = {
+  median: 2,
+  quartiles: 4,
+  quintiles: 5,
+  deciles: 10
+};
+function isFiniteNumber(value) {
+  return typeof value === "number" && Number.isFinite(value);
+}
+function clamp(value, lo, hi) {
+  return Math.min(hi, Math.max(lo, value));
+}
+function stepCount(steps, fallback) {
+  return isFiniteNumber(steps) && steps >= 1 ? Math.floor(steps) : fallback;
+}
+function spread(ramp, n) {
+  if (n <= 0) return [];
+  const last = ramp.length - 1;
+  if (n === 1) return [ramp[last]];
+  return Array.from({ length: n }, (_, i) => ramp[Math.round(i * last / (n - 1))]);
+}
+function quantileSorted(sorted, p) {
+  const h = (sorted.length - 1) * p;
+  const below = Math.floor(h);
+  const lower = sorted[below];
+  const upper = sorted[Math.min(sorted.length - 1, below + 1)];
+  return lower + (upper - lower) * (h - below);
+}
+function jenksBreaks(values, classes) {
+  const sorted = values.filter(isFiniteNumber).sort((a, b) => a - b);
+  if (sorted.length === 0) return [];
+  const xs = [];
+  const counts = [];
+  for (const value of sorted) {
+    if (xs.length > 0 && xs[xs.length - 1] === value) counts[counts.length - 1] += 1;
+    else {
+      xs.push(value);
+      counts.push(1);
+    }
+  }
+  const d = xs.length;
+  const first = xs[0];
+  const last = xs[d - 1];
+  const k = Math.min(stepCount(classes, 1), d);
+  if (k === 1) return [first, last];
+  const shift = xs[Math.floor(d / 2)];
+  const w = new Float64Array(d + 1);
+  const s1 = new Float64Array(d + 1);
+  const s2 = new Float64Array(d + 1);
+  for (let i = 0; i < d; i++) {
+    const x = xs[i] - shift;
+    const c = counts[i];
+    w[i + 1] = w[i] + c;
+    s1[i + 1] = s1[i] + c * x;
+    s2[i + 1] = s2[i] + c * x * x;
+  }
+  const ssd = (a, b) => {
+    const weight = w[b + 1] - w[a];
+    const sum = s1[b + 1] - s1[a];
+    return Math.max(0, s2[b + 1] - s2[a] - sum * sum / weight);
+  };
+  let previous = Float64Array.from({ length: d }, (_, i) => ssd(0, i));
+  const splits = [];
+  for (let j = 1; j < k; j++) {
+    const prior = previous;
+    const current = new Float64Array(d).fill(Number.POSITIVE_INFINITY);
+    const split = new Int32Array(d);
+    const solve = (lo, hi, optLo, optHi) => {
+      if (lo > hi) return;
+      const mid = lo + hi >> 1;
+      let best = Number.POSITIVE_INFINITY;
+      let bestM = Math.max(optLo, j);
+      for (let m = Math.max(optLo, j); m <= Math.min(mid, optHi); m++) {
+        const cost = prior[m - 1] + ssd(m, mid);
+        if (cost < best) {
+          best = cost;
+          bestM = m;
+        }
+      }
+      current[mid] = best;
+      split[mid] = bestM;
+      solve(lo, mid - 1, optLo, bestM);
+      solve(mid + 1, hi, bestM, optHi);
+    };
+    solve(j, d - 1, j, d - 1);
+    splits.push(split);
+    previous = current;
+  }
+  const uppers = [];
+  let end = d - 1;
+  for (let j = k - 1; j >= 1; j--) {
+    const start = splits[j - 1][end];
+    uppers.push(xs[start - 1]);
+    end = start - 1;
+  }
+  return [first, ...uppers.reverse(), last];
+}
+function interpolate(knots, x) {
+  const head = knots[0];
+  if (x <= head[0]) return head[1];
+  for (let i = 1; i < knots.length; i++) {
+    const [x1, y1] = knots[i];
+    if (x <= x1) {
+      const [x0, y0] = knots[i - 1];
+      return x1 === x0 ? y0 : y0 + (y1 - y0) * (x - x0) / (x1 - x0);
+    }
+  }
+  return knots[knots.length - 1][1];
+}
+function uniqueBreaks(breaks) {
+  const out = [];
+  for (const b of breaks) if (out.length === 0 || b > out[out.length - 1]) out.push(b);
+  return out.length === 1 ? [out[0], out[0]] : out;
+}
+function roundedBreaks(lo, hi, n) {
+  const width = (hi - lo) / n;
+  const exponent = Math.floor(Math.log10(width));
+  const round = (x) => exponent >= 0 ? Math.round(x / 10 ** exponent) * 10 ** exponent : Math.round(x * 10 ** -exponent) / 10 ** -exponent;
+  return [lo, ...Array.from({ length: n - 1 }, (_, i) => round(lo + width * (i + 1))), hi];
+}
+function stepColors(bounds, ramp, center) {
+  if (center === null) return spread(ramp, bounds.length);
+  const middle = (ramp.length - 1) / 2;
+  const side = bounds.map(
+    ([from, to]) => from === to && from === center ? 0 : to <= center ? -1 : from >= center ? 1 : 0
+  );
+  const lower = spread(ramp.slice(0, middle).reverse(), side.filter((s) => s < 0).length).reverse();
+  const upper = spread(ramp.slice(middle + 1), side.filter((s) => s > 0).length);
+  let l = 0;
+  let u = 0;
+  return side.map(
+    (s) => s < 0 ? lower[l++] : s > 0 ? upper[u++] : ramp[middle]
+  );
+}
+function stepIndex(steps, value) {
+  for (let i = 0; i < steps.length; i++) if (value <= steps[i].to) return i;
+  return steps.length - 1;
+}
+function categoricalScale(values, spec, method) {
+  const order = /* @__PURE__ */ new Map();
+  for (const value of values) {
+    const usable = typeof value === "string" && value !== "" || isFiniteNumber(value);
+    if (usable && !order.has(value)) order.set(value, order.size);
+  }
+  const categories = [...order.keys()].map((value, i) => ({
+    value,
+    color: CATEGORICAL_SET[i % CATEGORICAL_SET.length]
+  }));
+  const indexOf = (value) => value === null || value === void 0 ? -1 : order.get(value) ?? -1;
+  return {
+    type: spec.type,
+    method,
+    palette: "categorical",
+    domain: null,
+    center: null,
+    steps: [],
+    stops: [],
+    categories,
+    colorOf: (value) => categories[indexOf(value)]?.color ?? null,
+    indexOf,
+    positionOf: () => null
+  };
+}
+function colorScaleFor(values, spec) {
+  const continuous = spec.type === "continuous";
+  let method = spec.method !== void 0 && (continuous ? CONTINUOUS_METHODS : STEPPED_METHODS).has(spec.method) ? spec.method : continuous ? "linear" : "equidistant";
+  const domain = spec.domain?.every(isFiniteNumber) ? spec.domain : void 0;
+  const palette = spec.palette ?? (domain?.length === 3 ? "diverging" : "sequential");
+  if (palette === "categorical") return categoricalScale(values, spec, method);
+  const data = values.filter(isFiniteNumber);
+  let lo = Number.POSITIVE_INFINITY;
+  let hi = Number.NEGATIVE_INFINITY;
+  for (const v of domain ? [domain[0], domain[domain.length - 1]] : data) {
+    if (v < lo) lo = v;
+    if (v > hi) hi = v;
+  }
+  const thresholds = !continuous && method === "custom" ? [...new Set((spec.breaks ?? []).filter(isFiniteNumber))].sort((a, b) => a - b) : [];
+  if (method === "custom" && thresholds.length === 0) method = "equidistant";
+  if (thresholds.length > 0) {
+    lo = Math.min(lo, thresholds[0]);
+    hi = Math.max(hi, thresholds.at(-1));
+  }
+  const noData = () => ({
+    type: spec.type,
+    method,
+    palette,
+    domain: null,
+    center: null,
+    steps: [],
+    stops: [],
+    categories: [],
+    colorOf: () => null,
+    indexOf: () => -1,
+    positionOf: () => null
+  });
+  if (!Number.isFinite(lo) || !Number.isFinite(hi)) return noData();
+  const center = domain?.length === 3 ? domain[1] : palette === "diverging" ? lo < 0 && hi > 0 ? 0 : (lo + hi) / 2 : null;
+  const ramp = palette === "diverging" ? DIVERGING_RAMP : SEQUENTIAL_RAMP;
+  const sorted = data.map((v) => clamp(v, lo, hi)).sort((a, b) => a - b);
+  const needsData = method === "quantile" || method === "jenks" || continuous && method !== "linear";
+  if (needsData && sorted.length === 0) method = continuous ? "linear" : "equidistant";
+  let steps;
+  let stops = [];
+  let positionOf;
+  if (lo === hi) {
+    const color = stepColors([[lo, hi]], ramp, center)[0];
+    steps = [{ from: lo, to: hi, color }];
+    if (continuous) stops = [{ value: lo, color }];
+    const position = ramp.indexOf(color) / (ramp.length - 1);
+    positionOf = () => position;
+  } else if (continuous) {
+    let cuts;
+    const quantiles = QUANTILE_STOPS[method];
+    if (quantiles !== void 0) {
+      cuts = Array.from(
+        { length: quantiles + 1 },
+        (_, i) => i === 0 ? lo : i === quantiles ? hi : quantileSorted(sorted, i / quantiles)
+      );
+    } else if (method === "natural") {
+      const breaks = jenksBreaks(sorted, stepCount(spec.steps, DEFAULT_STEPS));
+      cuts = breaks.length > 2 ? [lo, ...breaks.slice(1, -1), hi] : [lo, hi];
+    } else {
+      cuts = [lo, hi];
+    }
+    let knots = cuts.map((v, i) => [v, i / (cuts.length - 1)]);
+    if (center !== null) {
+      const pc = interpolate(knots, clamp(center, lo, hi));
+      const bend = (p) => pc <= 0 ? 0.5 + p / 2 : pc >= 1 ? p / 2 : p <= pc ? 0.5 * p / pc : 0.5 + 0.5 * (p - pc) / (1 - pc);
+      knots = knots.map(([v, p]) => [v, bend(p)]);
+      if (center > lo && center < hi) {
+        knots.push([center, 0.5]);
+        knots.sort((a, b) => a[0] - b[0] || a[1] - b[1]);
+      }
+    }
+    const inverse = knots.map(([v, p]) => [p, v]);
+    const last = ramp.length - 1;
+    const valueAt = (position) => interpolate(inverse, position);
+    steps = ramp.map((color, j) => ({
+      from: j === 0 ? lo : valueAt((j - 0.5) / last),
+      to: j === last ? hi : valueAt((j + 0.5) / last),
+      color
+    }));
+    stops = ramp.map((color, j) => ({ value: valueAt(j / last), color }));
+    positionOf = (value) => interpolate(knots, value);
+  } else {
+    const n = Math.min(stepCount(spec.steps, DEFAULT_STEPS), ramp.length);
+    let breaks;
+    if (method === "custom") breaks = [lo, ...thresholds, hi];
+    else if (method === "quantile")
+      breaks = Array.from(
+        { length: n + 1 },
+        (_, i) => i === 0 ? lo : i === n ? hi : quantileSorted(sorted, i / n)
+      );
+    else if (method === "jenks") {
+      const natural = jenksBreaks(sorted, n);
+      breaks = [lo, ...natural.slice(1, -1), hi];
+    } else if (method === "rounded") breaks = roundedBreaks(lo, hi, n);
+    else
+      breaks = Array.from({ length: n + 1 }, (_, i) => i === n ? hi : lo + (hi - lo) * i / n);
+    const unique = uniqueBreaks(breaks);
+    const bounds = unique.slice(1).map((to, i) => [unique[i], to]);
+    const colors = stepColors(bounds, ramp, center);
+    steps = bounds.map(([from, to], i) => ({ from, to, color: colors[i] }));
+    positionOf = (value) => {
+      const i = stepIndex(steps, value);
+      const { from, to } = steps[i];
+      const within = to === from ? 0.5 : (value - from) / (to - from);
+      return (i + clamp(within, 0, 1)) / steps.length;
+    };
+  }
+  const indexOf = (value) => isFiniteNumber(value) ? stepIndex(steps, clamp(value, lo, hi)) : -1;
+  return {
+    type: spec.type,
+    method,
+    palette,
+    domain: [lo, hi],
+    center,
+    steps,
+    stops,
+    categories: [],
+    colorOf: (value) => steps[indexOf(value)]?.color ?? null,
+    indexOf,
+    positionOf: (value) => isFiniteNumber(value) ? positionOf(clamp(value, lo, hi)) : null
+  };
+}
+
+export {
+  jenksBreaks,
+  colorScaleFor
+};
+//# sourceMappingURL=chunk-KAAJL2HA.js.map