@oneplatformdev/ui 0.0.1-beta.11

package/Sidebar/Sidebar.mjs

@@ -0,0 +1,543 @@
+import { jsx as r, jsxs as S } from "react/jsx-runtime";
+import * as i from "react";
+import { Slot as h } from "@radix-ui/react-slot";
+import { cva as C } from "class-variance-authority";
+import { PanelLeft as k } from "lucide-react";
+import { cn as d } from "@oneplatformdev/utils";
+import { Button as E } from "../Button/Button.mjs";
+import "../Button/buttonVariants.mjs";
+import { Input as z } from "../Input/Input.mjs";
+import { Separator as B } from "../Separator/Separator.mjs";
+import { Sheet as T, SheetContent as A } from "../Sheet/Sheet.mjs";
+import { Skeleton as M } from "../Skeleton/Skeleton.mjs";
+import { TooltipProvider as D, TooltipTrigger as O, TooltipContent as L } from "../Tooltip/TooltipRoot.mjs";
+import { Tooltip as G } from "../Tooltip/Tooltip.mjs";
+const K = 768;
+function H(a = {}) {
+  const {
+    mobileBreakpoint: e = K
+  } = a, [t, o] = i.useState(void 0);
+  return i.useEffect(() => {
+    const n = window.matchMedia(`(max-width: ${e - 1}px)`), s = () => {
+      o(window.innerWidth < e);
+    };
+    return n.addEventListener("change", s), o(window.innerWidth < e), () => n.removeEventListener("change", s);
+  }, [e]), !!t;
+}
+const j = "sidebar:state", P = 60 * 60 * 24 * 7, W = "16rem", $ = "18rem", q = "3rem", F = "b", R = i.createContext(null);
+function N() {
+  const a = i.useContext(R);
+  if (!a)
+    throw new Error("useSidebar must be used within a SidebarProvider.");
+  return a;
+}
+const V = i.forwardRef(
+  ({
+    defaultOpen: a = !0,
+    open: e,
+    onOpenChange: t,
+    className: o,
+    style: n,
+    children: s,
+    ...f
+  }, m) => {
+    const c = H(), [p, u] = i.useState(!1), [v, _] = i.useState(a), g = e ?? v, x = i.useCallback(
+      (l) => {
+        const b = typeof l == "function" ? l(g) : l;
+        t ? t(b) : _(b), document.cookie = `${j}=${b}; path=/; max-age=${P}`;
+      },
+      [t, g]
+    ), w = i.useCallback(() => c ? u((l) => !l) : x((l) => !l), [c, x, u]);
+    i.useEffect(() => {
+      const l = (b) => {
+        b.key === F && (b.metaKey || b.ctrlKey) && (b.preventDefault(), w());
+      };
+      return window.addEventListener("keydown", l), () => window.removeEventListener("keydown", l);
+    }, [w]);
+    const y = g ? "expanded" : "collapsed", I = i.useMemo(
+      () => ({
+        state: y,
+        open: g,
+        setOpen: x,
+        isMobile: c,
+        openMobile: p,
+        setOpenMobile: u,
+        toggleSidebar: w
+      }),
+      [y, g, x, c, p, u, w]
+    );
+    return /* @__PURE__ */ r(R.Provider, { value: I, children: /* @__PURE__ */ r(D, { delayDuration: 0, children: /* @__PURE__ */ r(
+      "div",
+      {
+        style: {
+          "--sidebar-width": W,
+          "--sidebar-width-icon": q,
+          ...n
+        },
+        className: d(
+          "group/sidebar-wrapper flex min-h-svh w-full has-[[data-variant=inset]]:bg-sidebar",
+          o
+        ),
+        ref: m,
+        ...f,
+        children: s
+      }
+    ) }) });
+  }
+);
+V.displayName = "SidebarProvider";
+const U = i.forwardRef(
+  ({
+    side: a = "left",
+    variant: e = "sidebar",
+    collapsible: t = "offcanvas",
+    className: o,
+    children: n,
+    ...s
+  }, f) => {
+    const { isMobile: m, state: c, openMobile: p, setOpenMobile: u } = N();
+    return t === "none" ? /* @__PURE__ */ r(
+      "div",
+      {
+        className: d(
+          "flex h-full w-[--sidebar-width] flex-col bg-sidebar text-sidebar-foreground",
+          o
+        ),
+        ref: f,
+        ...s,
+        children: n
+      }
+    ) : m ? /* @__PURE__ */ r(T, { open: p, onOpenChange: u, ...s, children: /* @__PURE__ */ r(
+      A,
+      {
+        "data-sidebar": "sidebar",
+        "data-mobile": "true",
+        className: "w-[--sidebar-width] bg-sidebar p-0 text-sidebar-foreground [&>button]:hidden",
+        style: {
+          "--sidebar-width": $
+        },
+        side: a,
+        children: /* @__PURE__ */ r("div", { className: "flex h-full w-full flex-col", children: n })
+      }
+    ) }) : /* @__PURE__ */ S(
+      "div",
+      {
+        ref: f,
+        className: "group peer hidden md:block text-sidebar-foreground",
+        "data-state": c,
+        "data-collapsible": c === "collapsed" ? t : "",
+        "data-variant": e,
+        "data-side": a,
+        children: [
+          /* @__PURE__ */ r(
+            "div",
+            {
+              className: d(
+                "duration-200 relative h-svh w-[--sidebar-width] bg-transparent transition-[width] ease-linear",
+                "group-data-[collapsible=offcanvas]:w-0",
+                "group-data-[side=right]:rotate-180",
+                e === "floating" || e === "inset" ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4))]" : "group-data-[collapsible=icon]:w-[--sidebar-width-icon]"
+              )
+            }
+          ),
+          /* @__PURE__ */ r(
+            "div",
+            {
+              className: d(
+                "duration-200 fixed inset-y-0 z-10 hidden h-svh w-[--sidebar-width] transition-[left,right,width] ease-linear md:flex",
+                a === "left" ? "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]" : "right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]",
+                // Adjust the padding for floating and inset variants.
+                e === "floating" || e === "inset" ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4)_+2px)]" : "group-data-[collapsible=icon]:w-[--sidebar-width-icon] group-data-[side=left]:border-r group-data-[side=right]:border-l",
+                o
+              ),
+              ...s,
+              children: /* @__PURE__ */ r(
+                "div",
+                {
+                  "data-sidebar": "sidebar",
+                  className: "flex h-full w-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:border-sidebar-border group-data-[variant=floating]:shadow",
+                  children: n
+                }
+              )
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+U.displayName = "Sidebar";
+const X = i.forwardRef(({ className: a, onClick: e, ...t }, o) => {
+  const { toggleSidebar: n } = N();
+  return /* @__PURE__ */ S(
+    E,
+    {
+      ref: o,
+      "data-sidebar": "trigger",
+      variant: "ghost",
+      size: "icon",
+      className: d("h-7 w-7", a),
+      onClick: (s) => {
+        e == null || e(s), n();
+      },
+      ...t,
+      children: [
+        /* @__PURE__ */ r(k, {}),
+        /* @__PURE__ */ r("span", { className: "sr-only", children: "Toggle Sidebar" })
+      ]
+    }
+  );
+});
+X.displayName = "SidebarTrigger";
+const Y = i.forwardRef(({ className: a, ...e }, t) => {
+  const { toggleSidebar: o } = N();
+  return /* @__PURE__ */ r(
+    "button",
+    {
+      ref: t,
+      "data-sidebar": "rail",
+      "aria-label": "Toggle Sidebar",
+      tabIndex: -1,
+      onClick: o,
+      title: "Toggle Sidebar",
+      className: d(
+        "absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] hover:after:bg-sidebar-border group-data-[side=left]:-right-4 group-data-[side=right]:left-0 sm:flex",
+        "[[data-side=left]_&]:cursor-w-resize [[data-side=right]_&]:cursor-e-resize",
+        "[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize",
+        "group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full group-data-[collapsible=offcanvas]:hover:bg-sidebar",
+        "[[data-side=left][data-collapsible=offcanvas]_&]:-right-2",
+        "[[data-side=right][data-collapsible=offcanvas]_&]:-left-2",
+        a
+      ),
+      ...e
+    }
+  );
+});
+Y.displayName = "SidebarRail";
+const J = i.forwardRef(({ className: a, ...e }, t) => /* @__PURE__ */ r(
+  "main",
+  {
+    ref: t,
+    className: d(
+      "relative flex min-h-svh flex-1 flex-col bg-background",
+      "peer-data-[variant=inset]:min-h-[calc(100svh-theme(spacing.4))] md:peer-data-[variant=inset]:m-2 md:peer-data-[state=collapsed]:peer-data-[variant=inset]:ml-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow",
+      a
+    ),
+    ...e
+  }
+));
+J.displayName = "SidebarInset";
+const Q = i.forwardRef(({ className: a, ...e }, t) => /* @__PURE__ */ r(
+  z,
+  {
+    ref: t,
+    "data-sidebar": "input",
+    className: d(
+      "h-8 w-full bg-background shadow-none focus-visible:ring-2 focus-visible:ring-sidebar-ring",
+      a
+    ),
+    ...e
+  }
+));
+Q.displayName = "SidebarInput";
+const Z = i.forwardRef(({ className: a, ...e }, t) => /* @__PURE__ */ r(
+  "div",
+  {
+    ref: t,
+    "data-sidebar": "header",
+    className: d("flex flex-col gap-2 p-2", a),
+    ...e
+  }
+));
+Z.displayName = "SidebarHeader";
+const ee = i.forwardRef(({ className: a, ...e }, t) => /* @__PURE__ */ r(
+  "div",
+  {
+    ref: t,
+    "data-sidebar": "footer",
+    className: d("flex flex-col gap-2 p-2", a),
+    ...e
+  }
+));
+ee.displayName = "SidebarFooter";
+const ae = i.forwardRef(({ className: a, ...e }, t) => /* @__PURE__ */ r(
+  B,
+  {
+    ref: t,
+    "data-sidebar": "separator",
+    className: d("mx-2 w-auto bg-sidebar-border", a),
+    ...e
+  }
+));
+ae.displayName = "SidebarSeparator";
+const te = i.forwardRef(({ className: a, ...e }, t) => /* @__PURE__ */ r(
+  "div",
+  {
+    ref: t,
+    "data-sidebar": "content",
+    className: d(
+      "flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden",
+      a
+    ),
+    ...e
+  }
+));
+te.displayName = "SidebarContent";
+const re = i.forwardRef(({ className: a, ...e }, t) => /* @__PURE__ */ r(
+  "div",
+  {
+    ref: t,
+    "data-sidebar": "group",
+    className: d("relative flex w-full min-w-0 flex-col p-2", a),
+    ...e
+  }
+));
+re.displayName = "SidebarGroup";
+const ie = i.forwardRef(({ className: a, asChild: e = !1, ...t }, o) => /* @__PURE__ */ r(
+  e ? h : "div",
+  {
+    ref: o,
+    "data-sidebar": "group-label",
+    className: d(
+      "duration-200 flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium text-sidebar-foreground/70 outline-none ring-sidebar-ring transition-[margin,opa] ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
+      "group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0",
+      a
+    ),
+    ...t
+  }
+));
+ie.displayName = "SidebarGroupLabel";
+const oe = i.forwardRef(({ className: a, asChild: e = !1, ...t }, o) => /* @__PURE__ */ r(
+  e ? h : "button",
+  {
+    ref: o,
+    "data-sidebar": "group-action",
+    className: d(
+      "absolute right-3 top-3.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
+      // Increases the hit area of the button on mobile.
+      "after:absolute after:-inset-2 after:md:hidden",
+      "group-data-[collapsible=icon]:hidden",
+      a
+    ),
+    ...t
+  }
+));
+oe.displayName = "SidebarGroupAction";
+const ne = i.forwardRef(({ className: a, ...e }, t) => /* @__PURE__ */ r(
+  "div",
+  {
+    ref: t,
+    "data-sidebar": "group-content",
+    className: d("w-full text-sm", a),
+    ...e
+  }
+));
+ne.displayName = "SidebarGroupContent";
+const de = i.forwardRef(({ className: a, ...e }, t) => /* @__PURE__ */ r(
+  "ul",
+  {
+    ref: t,
+    "data-sidebar": "menu",
+    className: d("flex w-full min-w-0 flex-col gap-1", a),
+    ...e
+  }
+));
+de.displayName = "SidebarMenu";
+const se = i.forwardRef(({ className: a, ...e }, t) => /* @__PURE__ */ r(
+  "li",
+  {
+    ref: t,
+    "data-sidebar": "menu-item",
+    className: d("group/menu-item relative", a),
+    ...e
+  }
+));
+se.displayName = "SidebarMenuItem";
+const le = C(
+  "peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm outline-none ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-[[data-sidebar=menu-action]]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:!size-8 group-data-[collapsible=icon]:!p-2 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
+  {
+    variants: {
+      variant: {
+        default: "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
+        outline: "bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]"
+      },
+      size: {
+        default: "h-8 text-sm",
+        sm: "h-7 text-xs",
+        lg: "h-12 text-sm group-data-[collapsible=icon]:!p-0"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+), ce = i.forwardRef(
+  ({
+    asChild: a = !1,
+    isActive: e = !1,
+    variant: t = "default",
+    size: o = "default",
+    tooltip: n,
+    className: s,
+    ...f
+  }, m) => {
+    const c = a ? h : "button", { isMobile: p, state: u } = N(), v = /* @__PURE__ */ r(
+      c,
+      {
+        ref: m,
+        "data-sidebar": "menu-button",
+        "data-size": o,
+        "data-active": e,
+        className: d(le({ variant: t, size: o }), s),
+        ...f
+      }
+    );
+    return n ? (typeof n == "string" && (n = {
+      children: n
+    }), /* @__PURE__ */ S(G, { children: [
+      /* @__PURE__ */ r(O, { asChild: !0, children: v }),
+      /* @__PURE__ */ r(
+        L,
+        {
+          side: "right",
+          align: "center",
+          hidden: u !== "collapsed" || p,
+          ...n
+        }
+      )
+    ] })) : v;
+  }
+);
+ce.displayName = "SidebarMenuButton";
+const ue = i.forwardRef(({ className: a, asChild: e = !1, showOnHover: t = !1, ...o }, n) => /* @__PURE__ */ r(
+  e ? h : "button",
+  {
+    ref: n,
+    "data-sidebar": "menu-action",
+    className: d(
+      "absolute right-1 top-1.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 peer-hover/menu-button:text-sidebar-accent-foreground [&>svg]:size-4 [&>svg]:shrink-0",
+      // Increases the hit area of the button on mobile.
+      "after:absolute after:-inset-2 after:md:hidden",
+      "peer-data-[size=sm]/menu-button:top-1",
+      "peer-data-[size=default]/menu-button:top-1.5",
+      "peer-data-[size=lg]/menu-button:top-2.5",
+      "group-data-[collapsible=icon]:hidden",
+      t && "group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 peer-data-[active=true]/menu-button:text-sidebar-accent-foreground md:opacity-0",
+      a
+    ),
+    ...o
+  }
+));
+ue.displayName = "SidebarMenuAction";
+const be = i.forwardRef(({ className: a, ...e }, t) => /* @__PURE__ */ r(
+  "div",
+  {
+    ref: t,
+    "data-sidebar": "menu-badge",
+    className: d(
+      "absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1 text-xs font-medium tabular-nums text-sidebar-foreground select-none pointer-events-none",
+      "peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground",
+      "peer-data-[size=sm]/menu-button:top-1",
+      "peer-data-[size=default]/menu-button:top-1.5",
+      "peer-data-[size=lg]/menu-button:top-2.5",
+      "group-data-[collapsible=icon]:hidden",
+      a
+    ),
+    ...e
+  }
+));
+be.displayName = "SidebarMenuBadge";
+const fe = i.forwardRef(({ className: a, showIcon: e = !1, ...t }, o) => {
+  const n = i.useMemo(() => `${Math.floor(Math.random() * 40) + 50}%`, []);
+  return /* @__PURE__ */ S(
+    "div",
+    {
+      ref: o,
+      "data-sidebar": "menu-skeleton",
+      className: d("rounded-md h-8 flex gap-2 px-2 items-center", a),
+      ...t,
+      children: [
+        e && /* @__PURE__ */ r(
+          M,
+          {
+            className: "size-4 rounded-md",
+            "data-sidebar": "menu-skeleton-icon"
+          }
+        ),
+        /* @__PURE__ */ r(
+          M,
+          {
+            className: "h-4 flex-1 max-w-[--skeleton-width]",
+            "data-sidebar": "menu-skeleton-text",
+            style: {
+              "--skeleton-width": n
+            }
+          }
+        )
+      ]
+    }
+  );
+});
+fe.displayName = "SidebarMenuSkeleton";
+const pe = i.forwardRef(({ className: a, ...e }, t) => /* @__PURE__ */ r(
+  "ul",
+  {
+    ref: t,
+    "data-sidebar": "menu-sub",
+    className: d(
+      "mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l border-sidebar-border px-2.5 py-0.5",
+      "group-data-[collapsible=icon]:hidden",
+      a
+    ),
+    ...e
+  }
+));
+pe.displayName = "SidebarMenuSub";
+const me = i.forwardRef(({ ...a }, e) => /* @__PURE__ */ r("li", { ref: e, ...a }));
+me.displayName = "SidebarMenuSubItem";
+const ge = i.forwardRef(({ asChild: a = !1, size: e = "md", isActive: t, className: o, ...n }, s) => /* @__PURE__ */ r(
+  a ? h : "a",
+  {
+    ref: s,
+    "data-sidebar": "menu-sub-button",
+    "data-size": e,
+    "data-active": t,
+    className: d(
+      "flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 text-sidebar-foreground outline-none ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground",
+      "data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground",
+      e === "sm" && "text-xs",
+      e === "md" && "text-sm",
+      "group-data-[collapsible=icon]:hidden",
+      o
+    ),
+    ...n
+  }
+));
+ge.displayName = "SidebarMenuSubButton";
+export {
+  U as Sidebar,
+  te as SidebarContent,
+  ee as SidebarFooter,
+  re as SidebarGroup,
+  oe as SidebarGroupAction,
+  ne as SidebarGroupContent,
+  ie as SidebarGroupLabel,
+  Z as SidebarHeader,
+  Q as SidebarInput,
+  J as SidebarInset,
+  de as SidebarMenu,
+  ue as SidebarMenuAction,
+  be as SidebarMenuBadge,
+  ce as SidebarMenuButton,
+  se as SidebarMenuItem,
+  fe as SidebarMenuSkeleton,
+  pe as SidebarMenuSub,
+  ge as SidebarMenuSubButton,
+  me as SidebarMenuSubItem,
+  V as SidebarProvider,
+  Y as SidebarRail,
+  ae as SidebarSeparator,
+  X as SidebarTrigger,
+  N as useSidebar
+};

package/Sidebar/index.d.ts

@@ -0,0 +1 @@
+export * from './Sidebar';

package/Sidebar/index.mjs

@@ -0,0 +1,27 @@
+import { Sidebar as a, SidebarContent as i, SidebarFooter as S, SidebarGroup as b, SidebarGroupAction as d, SidebarGroupContent as n, SidebarGroupLabel as u, SidebarHeader as t, SidebarInput as o, SidebarInset as M, SidebarMenu as p, SidebarMenuAction as G, SidebarMenuBadge as I, SidebarMenuButton as g, SidebarMenuItem as l, SidebarMenuSkeleton as m, SidebarMenuSub as B, SidebarMenuSubButton as c, SidebarMenuSubItem as s, SidebarProvider as A, SidebarRail as C, SidebarSeparator as f, SidebarTrigger as k, useSidebar as v } from "./Sidebar.mjs";
+export {
+  a as Sidebar,
+  i as SidebarContent,
+  S as SidebarFooter,
+  b as SidebarGroup,
+  d as SidebarGroupAction,
+  n as SidebarGroupContent,
+  u as SidebarGroupLabel,
+  t as SidebarHeader,
+  o as SidebarInput,
+  M as SidebarInset,
+  p as SidebarMenu,
+  G as SidebarMenuAction,
+  I as SidebarMenuBadge,
+  g as SidebarMenuButton,
+  l as SidebarMenuItem,
+  m as SidebarMenuSkeleton,
+  B as SidebarMenuSub,
+  c as SidebarMenuSubButton,
+  s as SidebarMenuSubItem,
+  A as SidebarProvider,
+  C as SidebarRail,
+  f as SidebarSeparator,
+  k as SidebarTrigger,
+  v as useSidebar
+};

package/Sidebar/package.json

@@ -0,0 +1,7 @@
+{
+  "sideEffects": false,
+  "main": "./index.mjs",
+  "module": "./index.mjs",
+  "default": "./index.mjs",
+  "types": "./index.d.ts"
+}

package/Skeleton/Skeleton.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+
+declare function Skeleton({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+export { Skeleton };

package/Skeleton/Skeleton.mjs

@@ -0,0 +1,17 @@
+import { jsx as m } from "react/jsx-runtime";
+import { cn as o } from "@oneplatformdev/utils";
+function i({
+  className: r,
+  ...e
+}) {
+  return /* @__PURE__ */ m(
+    "div",
+    {
+      className: o("animate-pulse rounded-md bg-primary/10", r),
+      ...e
+    }
+  );
+}
+export {
+  i as Skeleton
+};

package/Skeleton/index.d.ts

@@ -0,0 +1 @@
+export * from './Skeleton';

package/Skeleton/index.mjs

@@ -0,0 +1,4 @@
+import { Skeleton as r } from "./Skeleton.mjs";
+export {
+  r as Skeleton
+};

package/Skeleton/package.json

@@ -0,0 +1,7 @@
+{
+  "sideEffects": false,
+  "main": "./index.mjs",
+  "module": "./index.mjs",
+  "default": "./index.mjs",
+  "types": "./index.d.ts"
+}

package/Slider/Slider.d.ts

@@ -0,0 +1,4 @@
+import * as React from "react";
+import * as SliderPrimitive from "@radix-ui/react-slider";
+declare const Slider: React.ForwardRefExoticComponent<Omit<SliderPrimitive.SliderProps & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export { Slider };

package/Slider/Slider.mjs

@@ -0,0 +1,23 @@
+import { jsxs as s, jsx as r } from "react/jsx-runtime";
+import * as a from "react";
+import * as e from "@radix-ui/react-slider";
+import { cn as n } from "@oneplatformdev/utils";
+const t = a.forwardRef(({ className: o, ...i }, l) => /* @__PURE__ */ s(
+  e.Root,
+  {
+    ref: l,
+    className: n(
+      "relative flex w-full touch-none select-none items-center",
+      o
+    ),
+    ...i,
+    children: [
+      /* @__PURE__ */ r(e.Track, { className: "relative h-1.5 w-full grow overflow-hidden rounded-full bg-primary/20", children: /* @__PURE__ */ r(e.Range, { className: "absolute h-full bg-primary" }) }),
+      /* @__PURE__ */ r(e.Thumb, { className: "block h-4 w-4 rounded-full border border-primary/50 bg-background shadow transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50" })
+    ]
+  }
+));
+t.displayName = e.Root.displayName;
+export {
+  t as Slider
+};

package/Slider/index.d.ts

@@ -0,0 +1 @@
+export * from './Slider';

package/Slider/index.mjs

@@ -0,0 +1,4 @@
+import { Slider as o } from "./Slider.mjs";
+export {
+  o as Slider
+};

package/Slider/package.json

@@ -0,0 +1,7 @@
+{
+  "sideEffects": false,
+  "main": "./index.mjs",
+  "module": "./index.mjs",
+  "default": "./index.mjs",
+  "types": "./index.d.ts"
+}

package/Sonner/Sonner.d.ts

@@ -0,0 +1,5 @@
+import { Toaster as SonnerToaster } from 'sonner';
+
+type SonnerProps = React.ComponentProps<typeof SonnerToaster>;
+declare const Sonner: ({ ...props }: SonnerProps) => import("react/jsx-runtime").JSX.Element;
+export { Sonner };