@evinvest/uikit 0.19.0 → 0.20.0

package/dist/components/sidebar.js

@@ -0,0 +1,326 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../lib/cn.js";
+import { Slot } from "../primitives/slot.js";
+import { useControllableState } from "../primitives/use-controllable-state.js";
+import {
+  SIDEBAR_MENU_BUTTON_BASE,
+  sidebarMenuButtonSizeClasses,
+  SIDEBAR_WRAPPER,
+  SIDEBAR_FLAT,
+  SIDEBAR_INNER,
+  SIDEBAR_TRIGGER,
+  SIDEBAR_RAIL,
+  SIDEBAR_INSET,
+  SIDEBAR_HEADER,
+  SIDEBAR_FOOTER,
+  SIDEBAR_SEPARATOR,
+  SIDEBAR_CONTENT,
+  SIDEBAR_GROUP,
+  SIDEBAR_GROUP_LABEL,
+  SIDEBAR_GROUP_CONTENT,
+  SIDEBAR_MENU,
+  SIDEBAR_MENU_ITEM
+} from "../generated/sidebar.js";
+import { buttonVariantClasses } from "../generated/button.js";
+const SIDEBAR_WIDTH = "16rem";
+const SIDEBAR_WIDTH_ICON = "3rem";
+const SidebarContext = React.createContext(null);
+function useSidebar() {
+  const ctx = React.useContext(SidebarContext);
+  if (!ctx) throw new Error("useSidebar must be used within a SidebarProvider.");
+  return ctx;
+}
+function SidebarProvider({
+  defaultOpen = true,
+  open: openProp,
+  onOpenChange,
+  className,
+  style,
+  children,
+  ...props
+}) {
+  const [open, setOpen] = useControllableState({
+    ...openProp !== void 0 ? { value: openProp } : {},
+    defaultValue: defaultOpen,
+    ...onOpenChange ? { onChange: onOpenChange } : {}
+  });
+  const toggleSidebar = React.useCallback(
+    () => setOpen(!open),
+    [open, setOpen]
+  );
+  const state = open ? "expanded" : "collapsed";
+  const contextValue = React.useMemo(
+    () => ({ state, open, setOpen, toggleSidebar }),
+    [state, open, setOpen, toggleSidebar]
+  );
+  return /* @__PURE__ */ jsx(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "sidebar-wrapper",
+      style: {
+        "--sidebar-width": SIDEBAR_WIDTH,
+        "--sidebar-width-icon": SIDEBAR_WIDTH_ICON,
+        ...style
+      },
+      className: cn(SIDEBAR_WRAPPER, className),
+      ...props,
+      children
+    }
+  ) });
+}
+function Sidebar({
+  side = "left",
+  variant = "sidebar",
+  collapsible = "offcanvas",
+  className,
+  children,
+  ...props
+}) {
+  const { state } = useSidebar();
+  if (collapsible === "none") {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        "data-slot": "sidebar",
+        className: cn(SIDEBAR_FLAT, className),
+        ...props,
+        children
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: "group peer text-ink hidden md:block",
+      "data-state": state,
+      "data-collapsible": state === "collapsed" ? collapsible : "",
+      "data-variant": variant,
+      "data-side": side,
+      "data-slot": "sidebar",
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          "data-slot": "sidebar-inner",
+          className: cn(SIDEBAR_INNER, className),
+          ...props,
+          children
+        }
+      )
+    }
+  );
+}
+function SidebarTrigger({
+  className,
+  onClick,
+  children,
+  ...props
+}) {
+  const { toggleSidebar } = useSidebar();
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      "data-sidebar": "trigger",
+      "data-slot": "sidebar-trigger",
+      "aria-label": "Toggle Sidebar",
+      className: cn(SIDEBAR_TRIGGER, className),
+      onClick: (event) => {
+        onClick?.(event);
+        toggleSidebar();
+      },
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Toggle Sidebar" })
+      ]
+    }
+  );
+}
+function SidebarRail({
+  className,
+  ...props
+}) {
+  const { toggleSidebar } = useSidebar();
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      "data-sidebar": "rail",
+      "data-slot": "sidebar-rail",
+      "aria-label": "Toggle Sidebar",
+      tabIndex: -1,
+      onClick: toggleSidebar,
+      title: "Toggle Sidebar",
+      className: cn(SIDEBAR_RAIL, className),
+      ...props
+    }
+  );
+}
+function SidebarInset({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "main",
+    {
+      "data-slot": "sidebar-inset",
+      className: cn(SIDEBAR_INSET, className),
+      ...props
+    }
+  );
+}
+function SidebarHeader({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "sidebar-header",
+      "data-sidebar": "header",
+      className: cn(SIDEBAR_HEADER, className),
+      ...props
+    }
+  );
+}
+function SidebarFooter({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "sidebar-footer",
+      "data-sidebar": "footer",
+      className: cn(SIDEBAR_FOOTER, className),
+      ...props
+    }
+  );
+}
+function SidebarSeparator({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "sidebar-separator",
+      "data-sidebar": "separator",
+      role: "separator",
+      className: cn(SIDEBAR_SEPARATOR, className),
+      ...props
+    }
+  );
+}
+function SidebarContent({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "sidebar-content",
+      "data-sidebar": "content",
+      className: cn(SIDEBAR_CONTENT, className),
+      ...props
+    }
+  );
+}
+function SidebarGroup({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "sidebar-group",
+      "data-sidebar": "group",
+      className: cn(SIDEBAR_GROUP, className),
+      ...props
+    }
+  );
+}
+function SidebarGroupLabel({
+  className,
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? Slot : "div";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      "data-slot": "sidebar-group-label",
+      "data-sidebar": "group-label",
+      className: cn(SIDEBAR_GROUP_LABEL, className),
+      ...props
+    }
+  );
+}
+function SidebarGroupContent({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "sidebar-group-content",
+      "data-sidebar": "group-content",
+      className: cn(SIDEBAR_GROUP_CONTENT, className),
+      ...props
+    }
+  );
+}
+function SidebarMenu({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "ul",
+    {
+      "data-slot": "sidebar-menu",
+      "data-sidebar": "menu",
+      className: cn(SIDEBAR_MENU, className),
+      ...props
+    }
+  );
+}
+function SidebarMenuItem({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "li",
+    {
+      "data-slot": "sidebar-menu-item",
+      "data-sidebar": "menu-item",
+      className: cn(SIDEBAR_MENU_ITEM, className),
+      ...props
+    }
+  );
+}
+function SidebarMenuButton({
+  asChild = false,
+  isActive = false,
+  variant = "ghost",
+  size = "sm",
+  className,
+  ...props
+}) {
+  const Comp = asChild ? Slot : "button";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      "data-slot": "sidebar-menu-button",
+      "data-sidebar": "menu-button",
+      "data-size": size,
+      "data-active": isActive,
+      className: cn(
+        SIDEBAR_MENU_BUTTON_BASE,
+        buttonVariantClasses[variant],
+        sidebarMenuButtonSizeClasses[size],
+        className
+      ),
+      ...props
+    }
+  );
+}
+export {
+  Sidebar,
+  SidebarContent,
+  SidebarFooter,
+  SidebarGroup,
+  SidebarGroupContent,
+  SidebarGroupLabel,
+  SidebarHeader,
+  SidebarInset,
+  SidebarMenu,
+  SidebarMenuButton,
+  SidebarMenuItem,
+  SidebarProvider,
+  SidebarRail,
+  SidebarSeparator,
+  SidebarTrigger,
+  useSidebar
+};
+//# sourceMappingURL=sidebar.js.map

package/dist/components/sidebar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/sidebar.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { Slot } from \"../primitives/slot\";\nimport { useControllableState } from \"../primitives/use-controllable-state\";\nimport {\n  SIDEBAR_MENU_BUTTON_BASE,\n  sidebarMenuButtonSizeClasses,\n  SIDEBAR_WRAPPER,\n  SIDEBAR_FLAT,\n  SIDEBAR_INNER,\n  SIDEBAR_TRIGGER,\n  SIDEBAR_RAIL,\n  SIDEBAR_INSET,\n  SIDEBAR_HEADER,\n  SIDEBAR_FOOTER,\n  SIDEBAR_SEPARATOR,\n  SIDEBAR_CONTENT,\n  SIDEBAR_GROUP,\n  SIDEBAR_GROUP_LABEL,\n  SIDEBAR_GROUP_CONTENT,\n  SIDEBAR_MENU,\n  SIDEBAR_MENU_ITEM,\n  type SidebarMenuButtonSize,\n} from \"../generated/sidebar\";\nimport { buttonVariantClasses, type ButtonVariant } from \"../generated/button\";\n\nexport type { SidebarMenuButtonSize };\n\n// omitted: mobile sheet, cookie, kbd shortcut — see README Limitations\n\nconst SIDEBAR_WIDTH = \"16rem\";\nconst SIDEBAR_WIDTH_ICON = \"3rem\";\n\ninterface SidebarContextValue {\n  state: \"expanded\" | \"collapsed\";\n  open: boolean;\n  setOpen: (open: boolean) => void;\n  toggleSidebar: () => void;\n}\n\nconst SidebarContext = React.createContext<SidebarContextValue | null>(null);\n\nexport function useSidebar(): SidebarContextValue {\n  const ctx = React.useContext(SidebarContext);\n  if (!ctx) throw new Error(\"useSidebar must be used within a SidebarProvider.\");\n  return ctx;\n}\n\nexport interface SidebarProviderProps extends React.ComponentProps<\"div\"> {\n  defaultOpen?: boolean;\n  open?: boolean;\n  onOpenChange?: (open: boolean) => void;\n}\n\nexport function SidebarProvider({\n  defaultOpen = true,\n  open: openProp,\n  onOpenChange,\n  className,\n  style,\n  children,\n  ...props\n}: SidebarProviderProps) {\n  const [open, setOpen] = useControllableState<boolean>({\n    ...(openProp !== undefined ? { value: openProp } : {}),\n    defaultValue: defaultOpen,\n    ...(onOpenChange ? { onChange: onOpenChange } : {}),\n  });\n  const toggleSidebar = React.useCallback(\n    () => setOpen(!open),\n    [open, setOpen],\n  );\n  const state = open ? \"expanded\" : \"collapsed\";\n\n  const contextValue = React.useMemo<SidebarContextValue>(\n    () => ({ state, open, setOpen, toggleSidebar }),\n    [state, open, setOpen, toggleSidebar],\n  );\n\n  return (\n    <SidebarContext.Provider value={contextValue}>\n      <div\n        data-slot=\"sidebar-wrapper\"\n        style={\n          {\n            \"--sidebar-width\": SIDEBAR_WIDTH,\n            \"--sidebar-width-icon\": SIDEBAR_WIDTH_ICON,\n            ...style,\n          } as React.CSSProperties\n        }\n        className={cn(SIDEBAR_WRAPPER, className)}\n        {...props}\n      >\n        {children}\n      </div>\n    </SidebarContext.Provider>\n  );\n}\n\nexport interface SidebarProps extends React.ComponentProps<\"div\"> {\n  side?: \"left\" | \"right\";\n  variant?: \"sidebar\" | \"floating\" | \"inset\";\n  collapsible?: \"offcanvas\" | \"icon\" | \"none\";\n}\n\nexport function Sidebar({\n  side = \"left\",\n  variant = \"sidebar\",\n  collapsible = \"offcanvas\",\n  className,\n  children,\n  ...props\n}: SidebarProps) {\n  const { state } = useSidebar();\n\n  if (collapsible === \"none\") {\n    return (\n      <div\n        data-slot=\"sidebar\"\n        className={cn(SIDEBAR_FLAT, className)}\n        {...props}\n      >\n        {children}\n      </div>\n    );\n  }\n\n  return (\n    <div\n      className=\"group peer text-ink hidden md:block\"\n      data-state={state}\n      data-collapsible={state === \"collapsed\" ? collapsible : \"\"}\n      data-variant={variant}\n      data-side={side}\n      data-slot=\"sidebar\"\n    >\n      <div\n        data-slot=\"sidebar-inner\"\n        className={cn(SIDEBAR_INNER, className)}\n        {...props}\n      >\n        {children}\n      </div>\n    </div>\n  );\n}\n\nexport function SidebarTrigger({\n  className,\n  onClick,\n  children,\n  ...props\n}: React.ComponentProps<\"button\">) {\n  const { toggleSidebar } = useSidebar();\n\n  return (\n    <button\n      type=\"button\"\n      data-sidebar=\"trigger\"\n      data-slot=\"sidebar-trigger\"\n      aria-label=\"Toggle Sidebar\"\n      className={cn(SIDEBAR_TRIGGER, className)}\n      onClick={(event) => {\n        onClick?.(event);\n        toggleSidebar();\n      }}\n      {...props}\n    >\n      {children}\n      <span className=\"sr-only\">Toggle Sidebar</span>\n    </button>\n  );\n}\n\nexport function SidebarRail({\n  className,\n  ...props\n}: React.ComponentProps<\"button\">) {\n  const { toggleSidebar } = useSidebar();\n\n  return (\n    <button\n      type=\"button\"\n      data-sidebar=\"rail\"\n      data-slot=\"sidebar-rail\"\n      aria-label=\"Toggle Sidebar\"\n      tabIndex={-1}\n      onClick={toggleSidebar}\n      title=\"Toggle Sidebar\"\n      className={cn(SIDEBAR_RAIL, className)}\n      {...props}\n    />\n  );\n}\n\nexport function SidebarInset({ className, ...props }: React.ComponentProps<\"main\">) {\n  return (\n    <main\n      data-slot=\"sidebar-inset\"\n      className={cn(SIDEBAR_INSET, className)}\n      {...props}\n    />\n  );\n}\n\nexport function SidebarHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"sidebar-header\"\n      data-sidebar=\"header\"\n      className={cn(SIDEBAR_HEADER, className)}\n      {...props}\n    />\n  );\n}\n\nexport function SidebarFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"sidebar-footer\"\n      data-sidebar=\"footer\"\n      className={cn(SIDEBAR_FOOTER, className)}\n      {...props}\n    />\n  );\n}\n\nexport function SidebarSeparator({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"sidebar-separator\"\n      data-sidebar=\"separator\"\n      role=\"separator\"\n      className={cn(SIDEBAR_SEPARATOR, className)}\n      {...props}\n    />\n  );\n}\n\nexport function SidebarContent({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"sidebar-content\"\n      data-sidebar=\"content\"\n      className={cn(SIDEBAR_CONTENT, className)}\n      {...props}\n    />\n  );\n}\n\nexport function SidebarGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"sidebar-group\"\n      data-sidebar=\"group\"\n      className={cn(SIDEBAR_GROUP, className)}\n      {...props}\n    />\n  );\n}\n\nexport interface SidebarGroupLabelProps extends React.ComponentProps<\"div\"> {\n  asChild?: boolean;\n}\n\nexport function SidebarGroupLabel({\n  className,\n  asChild = false,\n  ...props\n}: SidebarGroupLabelProps) {\n  const Comp = asChild ? Slot : \"div\";\n\n  return (\n    <Comp\n      data-slot=\"sidebar-group-label\"\n      data-sidebar=\"group-label\"\n      className={cn(SIDEBAR_GROUP_LABEL, className)}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n\nexport function SidebarGroupContent({\n  className,\n  ...props\n}: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"sidebar-group-content\"\n      data-sidebar=\"group-content\"\n      className={cn(SIDEBAR_GROUP_CONTENT, className)}\n      {...props}\n    />\n  );\n}\n\nexport function SidebarMenu({ className, ...props }: React.ComponentProps<\"ul\">) {\n  return (\n    <ul\n      data-slot=\"sidebar-menu\"\n      data-sidebar=\"menu\"\n      className={cn(SIDEBAR_MENU, className)}\n      {...props}\n    />\n  );\n}\n\nexport function SidebarMenuItem({ className, ...props }: React.ComponentProps<\"li\">) {\n  return (\n    <li\n      data-slot=\"sidebar-menu-item\"\n      data-sidebar=\"menu-item\"\n      className={cn(SIDEBAR_MENU_ITEM, className)}\n      {...props}\n    />\n  );\n}\n\nexport interface SidebarMenuButtonProps extends React.ComponentProps<\"button\"> {\n  asChild?: boolean;\n  isActive?: boolean;\n  variant?: ButtonVariant;\n  size?: SidebarMenuButtonSize;\n}\n\nexport function SidebarMenuButton({\n  asChild = false,\n  isActive = false,\n  variant = \"ghost\",\n  size = \"sm\",\n  className,\n  ...props\n}: SidebarMenuButtonProps) {\n  const Comp = asChild ? Slot : \"button\";\n\n  return (\n    <Comp\n      data-slot=\"sidebar-menu-button\"\n      data-sidebar=\"menu-button\"\n      data-size={size}\n      data-active={isActive}\n      className={cn(\n        SIDEBAR_MENU_BUTTON_BASE,\n        buttonVariantClasses[variant],\n        sidebarMenuButtonSizeClasses[size],\n        className,\n      )}\n      {...(props as Record<string, unknown>)}\n    />\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/skeleton.js

@@ -0,0 +1,18 @@
+import { jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../lib/cn.js";
+import { SKELETON_BASE } from "../generated/skeleton.js";
+function Skeleton({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "skeleton",
+      className: cn(SKELETON_BASE, className),
+      ...props
+    }
+  );
+}
+export {
+  Skeleton
+};
+//# sourceMappingURL=skeleton.js.map

package/dist/components/skeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/skeleton.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { SKELETON_BASE } from \"../generated/skeleton\";\n\nexport function Skeleton({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"skeleton\"\n      className={cn(SKELETON_BASE, className)}\n      {...props}\n    />\n  );\n}\n"],"mappings":"AAMI;AANJ,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,qBAAqB;AAEvB,SAAS,SAAS,EAAE,WAAW,GAAG,MAAM,GAAgC;AAC7E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,eAAe,SAAS;AAAA,MACrC,GAAG;AAAA;AAAA,EACN;AAEJ;","names":[]}

package/dist/components/slider.js

@@ -0,0 +1,138 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../lib/cn.js";
+import { useControllableState } from "../primitives/use-controllable-state.js";
+import { SLIDER_RANGE, SLIDER_ROOT, SLIDER_THUMB, SLIDER_TRACK } from "../generated/slider.js";
+function clampStep(value, min, max, step) {
+  const clamped = Math.min(max, Math.max(min, value));
+  if (step <= 0) return clamped;
+  const steps = Math.round((clamped - min) / step);
+  return Math.min(max, Math.max(min, min + steps * step));
+}
+function Slider({
+  className,
+  value,
+  defaultValue = 0,
+  onValueChange,
+  min = 0,
+  max = 100,
+  step = 1,
+  orientation = "horizontal",
+  disabled = false,
+  ...props
+}) {
+  const [raw, setRaw] = useControllableState({
+    ...value !== void 0 ? { value } : {},
+    defaultValue,
+    ...onValueChange ? { onChange: onValueChange } : {}
+  });
+  const current = clampStep(raw, min, max, step);
+  const span = Math.max(max - min, Number.EPSILON);
+  const percent = Math.min(100, Math.max(0, (current - min) / span * 100));
+  const trackRef = React.useRef(null);
+  const draggingRef = React.useRef(false);
+  const valueFromPointer = React.useCallback(
+    (clientX, clientY) => {
+      const rect = trackRef.current?.getBoundingClientRect();
+      if (!rect) return current;
+      const ratio = orientation === "vertical" ? (rect.bottom - clientY) / rect.height : (clientX - rect.left) / rect.width;
+      return clampStep(min + ratio * (max - min), min, max, step);
+    },
+    [current, orientation, min, max, step]
+  );
+  const onKeyDown = (event) => {
+    if (disabled) return;
+    let next;
+    switch (event.key) {
+      case "ArrowRight":
+      case "ArrowUp":
+        next = current + step;
+        break;
+      case "ArrowLeft":
+      case "ArrowDown":
+        next = current - step;
+        break;
+      case "Home":
+        next = min;
+        break;
+      case "End":
+        next = max;
+        break;
+      default:
+        return;
+    }
+    event.preventDefault();
+    setRaw(clampStep(next, min, max, step));
+  };
+  const onPointerDown = (event) => {
+    if (disabled) return;
+    draggingRef.current = true;
+    event.currentTarget.setPointerCapture?.(event.pointerId);
+    setRaw(valueFromPointer(event.clientX, event.clientY));
+  };
+  const onPointerMove = (event) => {
+    if (!draggingRef.current || disabled) return;
+    setRaw(valueFromPointer(event.clientX, event.clientY));
+  };
+  const onPointerUp = (event) => {
+    draggingRef.current = false;
+    event.currentTarget.releasePointerCapture?.(event.pointerId);
+  };
+  const rangeStyle = orientation === "vertical" ? { height: `${percent}%` } : { width: `${percent}%` };
+  const thumbStyle = orientation === "vertical" ? { position: "absolute", bottom: `${percent}%`, left: "50%", transform: "translate(-50%, 50%)" } : { position: "absolute", left: `${percent}%`, top: "50%", transform: "translate(-50%, -50%)" };
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      "data-slot": "slider",
+      "data-orientation": orientation,
+      "data-disabled": disabled || void 0,
+      className: cn(SLIDER_ROOT, className),
+      ...props,
+      onPointerDown,
+      onPointerMove,
+      onPointerUp,
+      children: [
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            ref: trackRef,
+            "data-slot": "slider-track",
+            "data-orientation": orientation,
+            className: SLIDER_TRACK,
+            children: /* @__PURE__ */ jsx(
+              "span",
+              {
+                "data-slot": "slider-range",
+                "data-orientation": orientation,
+                className: SLIDER_RANGE,
+                style: rangeStyle
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            "data-slot": "slider-thumb",
+            "data-orientation": orientation,
+            className: SLIDER_THUMB,
+            style: thumbStyle,
+            role: "slider",
+            tabIndex: disabled ? -1 : 0,
+            "aria-valuenow": current,
+            "aria-valuemin": min,
+            "aria-valuemax": max,
+            "aria-orientation": orientation,
+            "aria-disabled": disabled || void 0,
+            onKeyDown
+          }
+        )
+      ]
+    }
+  );
+}
+export {
+  Slider
+};
+//# sourceMappingURL=slider.js.map

package/dist/components/slider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/slider.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { useControllableState } from \"../primitives/use-controllable-state\";\nimport { SLIDER_RANGE, SLIDER_ROOT, SLIDER_THUMB, SLIDER_TRACK } from \"../generated/slider\";\n\ntype Orientation = \"horizontal\" | \"vertical\";\n\nfunction clampStep(value: number, min: number, max: number, step: number): number {\n  const clamped = Math.min(max, Math.max(min, value));\n  if (step <= 0) return clamped;\n  const steps = Math.round((clamped - min) / step);\n  return Math.min(max, Math.max(min, min + steps * step));\n}\n\nexport interface SliderProps\n  extends Omit<React.ComponentProps<\"span\">, \"defaultValue\" | \"onChange\"> {\n  value?: number;\n  defaultValue?: number;\n  onValueChange?: (value: number) => void;\n  min?: number;\n  max?: number;\n  step?: number;\n  orientation?: Orientation;\n  disabled?: boolean;\n}\n\nexport function Slider({\n  className,\n  value,\n  defaultValue = 0,\n  onValueChange,\n  min = 0,\n  max = 100,\n  step = 1,\n  orientation = \"horizontal\",\n  disabled = false,\n  ...props\n}: SliderProps) {\n  const [raw, setRaw] = useControllableState<number>({\n    ...(value !== undefined ? { value } : {}),\n    defaultValue,\n    ...(onValueChange ? { onChange: onValueChange } : {}),\n  });\n  const current = clampStep(raw, min, max, step);\n  const span = Math.max(max - min, Number.EPSILON);\n  const percent = Math.min(100, Math.max(0, ((current - min) / span) * 100));\n\n  const trackRef = React.useRef<HTMLSpanElement>(null);\n  const draggingRef = React.useRef(false);\n\n  const valueFromPointer = React.useCallback(\n    (clientX: number, clientY: number) => {\n      const rect = trackRef.current?.getBoundingClientRect();\n      if (!rect) return current;\n      const ratio =\n        orientation === \"vertical\"\n          ? (rect.bottom - clientY) / rect.height\n          : (clientX - rect.left) / rect.width;\n      return clampStep(min + ratio * (max - min), min, max, step);\n    },\n    [current, orientation, min, max, step],\n  );\n\n  const onKeyDown = (event: React.KeyboardEvent) => {\n    if (disabled) return;\n    let next: number;\n    switch (event.key) {\n      case \"ArrowRight\":\n      case \"ArrowUp\":\n        next = current + step;\n        break;\n      case \"ArrowLeft\":\n      case \"ArrowDown\":\n        next = current - step;\n        break;\n      case \"Home\":\n        next = min;\n        break;\n      case \"End\":\n        next = max;\n        break;\n      default:\n        return;\n    }\n    event.preventDefault();\n    setRaw(clampStep(next, min, max, step));\n  };\n\n  const onPointerDown = (event: React.PointerEvent) => {\n    if (disabled) return;\n    draggingRef.current = true;\n    event.currentTarget.setPointerCapture?.(event.pointerId);\n    setRaw(valueFromPointer(event.clientX, event.clientY));\n  };\n\n  const onPointerMove = (event: React.PointerEvent) => {\n    if (!draggingRef.current || disabled) return;\n    setRaw(valueFromPointer(event.clientX, event.clientY));\n  };\n\n  const onPointerUp = (event: React.PointerEvent) => {\n    draggingRef.current = false;\n    event.currentTarget.releasePointerCapture?.(event.pointerId);\n  };\n\n  const rangeStyle: React.CSSProperties =\n    orientation === \"vertical\" ? { height: `${percent}%` } : { width: `${percent}%` };\n  // The thumb is absolutely positioned within the (relative) root and centered\n  // on the value point; without `position:absolute` the `%` offset is ignored and\n  // flow layout parks it at the end of the row.\n  const thumbStyle: React.CSSProperties =\n    orientation === \"vertical\"\n      ? { position: \"absolute\", bottom: `${percent}%`, left: \"50%\", transform: \"translate(-50%, 50%)\" }\n      : { position: \"absolute\", left: `${percent}%`, top: \"50%\", transform: \"translate(-50%, -50%)\" };\n\n  return (\n    <span\n      data-slot=\"slider\"\n      data-orientation={orientation}\n      data-disabled={disabled || undefined}\n      className={cn(SLIDER_ROOT, className)}\n      {...props}\n      // Pointer handling lives on the root, not the track: the thumb sits above\n      // the track (absolute), so grabbing it must still start a drag.\n      onPointerDown={onPointerDown}\n      onPointerMove={onPointerMove}\n      onPointerUp={onPointerUp}\n    >\n      <span\n        ref={trackRef}\n        data-slot=\"slider-track\"\n        data-orientation={orientation}\n        className={SLIDER_TRACK}\n      >\n        <span\n          data-slot=\"slider-range\"\n          data-orientation={orientation}\n          className={SLIDER_RANGE}\n          style={rangeStyle}\n        />\n      </span>\n      <span\n        data-slot=\"slider-thumb\"\n        data-orientation={orientation}\n        className={SLIDER_THUMB}\n        style={thumbStyle}\n        role=\"slider\"\n        tabIndex={disabled ? -1 : 0}\n        aria-valuenow={current}\n        aria-valuemin={min}\n        aria-valuemax={max}\n        aria-orientation={orientation}\n        aria-disabled={disabled || undefined}\n        onKeyDown={onKeyDown}\n      />\n    </span>\n  );\n}\n"],"mappings":"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","names":[]}