@clasing/ui 2.9.1 → 2.9.3

package/dist/dropdown-menu-VOZwAyVb.js

@@ -0,0 +1,313 @@
+import { j as t, c as r } from "./index-C_XDkVGm.js";
+import * as o from "@radix-ui/react-dropdown-menu";
+import { CheckIcon as d, CircleIcon as i, CaretRightIcon as u } from "@phosphor-icons/react";
+function p({
+  ...e
+}) {
+  return /* @__PURE__ */ t.jsx(o.Root, { "data-slot": "dropdown-menu", ...e });
+}
+function m({
+  ...e
+}) {
+  return /* @__PURE__ */ t.jsx(o.Portal, { "data-slot": "dropdown-menu-portal", ...e });
+}
+function f({
+  ...e
+}) {
+  return /* @__PURE__ */ t.jsx(
+    o.Trigger,
+    {
+      "data-slot": "dropdown-menu-trigger",
+      ...e
+    }
+  );
+}
+function g({
+  className: e,
+  sideOffset: n = 4,
+  collisionPadding: a = 24,
+  ...s
+}) {
+  return /* @__PURE__ */ t.jsx(o.Portal, { children: /* @__PURE__ */ t.jsx(
+    o.Content,
+    {
+      "data-slot": "dropdown-menu-content",
+      sideOffset: n,
+      className: r(
+        `
+            z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-32
+            origin-(--radix-dropdown-menu-content-transform-origin)
+            overflow-x-hidden overflow-y-auto rounded-md border bg-popover p-1
+            text-popover-foreground shadow-md
+            data-[side=bottom]:slide-in-from-top-2
+            data-[side=left]:slide-in-from-right-2
+            data-[side=right]:slide-in-from-left-2
+            data-[side=top]:slide-in-from-bottom-2
+            data-[state=closed]:animate-out data-[state=closed]:fade-out-0
+            data-[state=closed]:zoom-out-95
+            data-[state=open]:animate-in data-[state=open]:fade-in-0
+            data-[state=open]:zoom-in-95
+          `,
+        e
+      ),
+      collisionPadding: a,
+      ...s
+    }
+  ) });
+}
+function x({
+  ...e
+}) {
+  return /* @__PURE__ */ t.jsx(o.Group, { "data-slot": "dropdown-menu-group", ...e });
+}
+function v({
+  className: e,
+  inset: n,
+  variant: a = "default",
+  ...s
+}) {
+  return /* @__PURE__ */ t.jsx(
+    o.Item,
+    {
+      "data-slot": "dropdown-menu-item",
+      "data-inset": n,
+      "data-variant": a,
+      className: r(
+        `
+          relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5
+          paragraph-sm outline-hidden select-none
+          focus:bg-accent focus:text-accent-foreground
+          data-disabled:pointer-events-none data-disabled:opacity-50
+          data-inset:pl-8
+          data-[variant=destructive]:text-destructive-foreground
+          data-[variant=destructive]:focus:bg-destructive
+          data-[variant=destructive]:focus:text-destructive-foreground
+          dark:data-[variant=destructive]:focus:bg-destructive/80
+          [&_svg]:pointer-events-none [&_svg]:shrink-0
+          [&_svg:not([class*='size-'])]:size-4
+          data-[variant=destructive]:*:[svg]:text-destructive-foreground!
+        `,
+        e
+      ),
+      ...s
+    }
+  );
+}
+function b({
+  className: e,
+  children: n,
+  checked: a,
+  ...s
+}) {
+  return /* @__PURE__ */ t.jsxs(
+    o.CheckboxItem,
+    {
+      "data-slot": "dropdown-menu-checkbox-item",
+      className: r(
+        `
+          relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2
+          pl-8 paragraph-sm outline-hidden select-none
+          focus:bg-accent focus:text-accent-foreground
+          data-disabled:pointer-events-none data-disabled:opacity-50
+          [&_svg]:pointer-events-none [&_svg]:shrink-0
+          [&_svg:not([class*='size-'])]:size-4
+        `,
+        e
+      ),
+      checked: a,
+      ...s,
+      children: [
+        /* @__PURE__ */ t.jsx(
+          "span",
+          {
+            className: `\r
+          pointer-events-none absolute left-2 flex size-3.5 items-center\r
+          justify-center\r
+        `,
+            children: /* @__PURE__ */ t.jsx(o.ItemIndicator, { children: /* @__PURE__ */ t.jsx(d, { className: "size-4" }) })
+          }
+        ),
+        n
+      ]
+    }
+  );
+}
+function h({
+  ...e
+}) {
+  return /* @__PURE__ */ t.jsx(
+    o.RadioGroup,
+    {
+      "data-slot": "dropdown-menu-radio-group",
+      ...e
+    }
+  );
+}
+function w({
+  className: e,
+  children: n,
+  ...a
+}) {
+  return /* @__PURE__ */ t.jsxs(
+    o.RadioItem,
+    {
+      "data-slot": "dropdown-menu-radio-item",
+      className: r(
+        `
+          relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2
+          pl-8 paragraph-sm outline-hidden select-none
+          focus:bg-accent focus:text-accent-foreground
+          data-disabled:pointer-events-none data-disabled:opacity-50
+          [&_svg]:pointer-events-none [&_svg]:shrink-0
+          [&_svg:not([class*='size-'])]:size-4
+        `,
+        e
+      ),
+      ...a,
+      children: [
+        /* @__PURE__ */ t.jsx(
+          "span",
+          {
+            className: `\r
+          pointer-events-none absolute left-2 flex size-3.5 items-center\r
+          justify-center\r
+        `,
+            children: /* @__PURE__ */ t.jsx(o.ItemIndicator, { children: /* @__PURE__ */ t.jsx(i, { weight: "fill", className: "size-2 fill-current" }) })
+          }
+        ),
+        n
+      ]
+    }
+  );
+}
+function j({
+  className: e,
+  inset: n,
+  ...a
+}) {
+  return /* @__PURE__ */ t.jsx(
+    o.Label,
+    {
+      "data-slot": "dropdown-menu-label",
+      "data-inset": n,
+      className: r(
+        `
+          px-2 py-1.5 paragraph-sm font-semibold
+          data-inset:pl-8
+        `,
+        e
+      ),
+      ...a
+    }
+  );
+}
+function z({
+  className: e,
+  ...n
+}) {
+  return /* @__PURE__ */ t.jsx(
+    o.Separator,
+    {
+      "data-slot": "dropdown-menu-separator",
+      className: r("-mx-1 my-1 h-px bg-border", e),
+      ...n
+    }
+  );
+}
+function D({
+  className: e,
+  ...n
+}) {
+  return /* @__PURE__ */ t.jsx(
+    "span",
+    {
+      "data-slot": "dropdown-menu-shortcut",
+      className: r(
+        "ml-auto paragraph-xs tracking-widest text-muted-foreground",
+        e
+      ),
+      ...n
+    }
+  );
+}
+function M({
+  ...e
+}) {
+  return /* @__PURE__ */ t.jsx(o.Sub, { "data-slot": "dropdown-menu-sub", ...e });
+}
+function N({
+  className: e,
+  inset: n,
+  children: a,
+  ...s
+}) {
+  return /* @__PURE__ */ t.jsxs(
+    o.SubTrigger,
+    {
+      "data-slot": "dropdown-menu-sub-trigger",
+      "data-inset": n,
+      className: r(
+        `
+          relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5
+          paragraph-sm outline-hidden select-none
+          focus:bg-accent focus:text-accent-foreground
+          data-disabled:pointer-events-none data-disabled:opacity-50
+          data-inset:pl-8
+          [&_svg]:pointer-events-none [&_svg]:shrink-0
+          [&_svg:not([class*='size-'])]:size-4
+        `,
+        e
+      ),
+      ...s,
+      children: [
+        a,
+        /* @__PURE__ */ t.jsx(u, { className: "ml-auto size-4" })
+      ]
+    }
+  );
+}
+function y({
+  className: e,
+  ...n
+}) {
+  return /* @__PURE__ */ t.jsx(
+    o.SubContent,
+    {
+      "data-slot": "dropdown-menu-sub-content",
+      className: r(
+        `
+          z-50 min-w-32 origin-(--radix-dropdown-menu-content-transform-origin)
+          overflow-hidden rounded-md border bg-popover p-1
+          text-popover-foreground shadow-lg
+          data-[side=bottom]:slide-in-from-top-2
+          data-[side=left]:slide-in-from-right-2
+          data-[side=right]:slide-in-from-left-2
+          data-[side=top]:slide-in-from-bottom-2
+          data-[state=closed]:animate-out data-[state=closed]:fade-out-0
+          data-[state=closed]:zoom-out-95
+          data-[state=open]:animate-in data-[state=open]:fade-in-0
+          data-[state=open]:zoom-in-95
+        `,
+        e
+      ),
+      ...n
+    }
+  );
+}
+export {
+  p as D,
+  b as a,
+  g as b,
+  x as c,
+  v as d,
+  j as e,
+  m as f,
+  h as g,
+  w as h,
+  z as i,
+  D as j,
+  M as k,
+  y as l,
+  N as m,
+  f as n
+};

package/dist/entries/field.d.ts

@@ -0,0 +1 @@
+export { Field, FieldDescription, FieldGroup, FieldLabel, FieldMessage, } from '@/components/field';

package/dist/entries/pagination.d.ts

@@ -0,0 +1 @@
+export { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, } from '@/components/pagination';

package/dist/entries/radio-group.d.ts

@@ -0,0 +1 @@
+export { RadioGroup, RadioGroupItem } from '@/components/radio-group';

package/dist/entries/sidebar.d.ts

@@ -0,0 +1,2 @@
+import { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarSubMenu, SidebarSubMenuContent, SidebarSubMenuItem, SidebarSubMenuTrigger, SidebarTrigger, useSidebar } from '../components/sidebar';
+export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarSubMenu, SidebarSubMenuContent, SidebarSubMenuItem, SidebarSubMenuTrigger, SidebarTrigger, useSidebar, };

package/dist/entries/tabs.d.ts

@@ -0,0 +1 @@
+export { Tabs, TabsList, TabsTrigger, TabsContent, tabsListVariants, } from '@/components/tabs';

package/dist/entries/tree.d.ts

@@ -0,0 +1 @@
+export { Tree, TreeItem, TreeItemTrigger, TreeItemContent, useTree } from '@/components/tree';

package/dist/hooks/useIsMobile.d.ts

@@ -0,0 +1,2 @@
+export declare function useIsMobile(): boolean;
+export declare function useIsTablet(): boolean;

package/dist/{input-D9gqZjs0.js → input-BlcRuIEB.js}

@@ -2,7 +2,7 @@ import { j as r, c as n } from "./index-C_XDkVGm.js";
 import { EyeSlashIcon as f, EyeIcon as m } from "@phosphor-icons/react";
 import { cva as x } from "class-variance-authority";
 import * as g from "react";
-import { B as b } from "./button-DSpGxL2e.js";
+import { B as b } from "./button-CKrOlPSD.js";
 const o = x(
   `
     flex w-full min-w-0 rounded-md border border-input bg-transparent

package/dist/sheet-CwXaadwy.js

@@ -0,0 +1,166 @@
+import { j as e, c as s } from "./index-C_XDkVGm.js";
+import * as o from "@radix-ui/react-dialog";
+import { XIcon as i } from "@phosphor-icons/react";
+function f({ ...t }) {
+  return /* @__PURE__ */ e.jsx(o.Root, { "data-slot": "sheet", ...t });
+}
+function h({
+  ...t
+}) {
+  return /* @__PURE__ */ e.jsx(o.Trigger, { "data-slot": "sheet-trigger", ...t });
+}
+function m({
+  ...t
+}) {
+  return /* @__PURE__ */ e.jsx(o.Close, { "data-slot": "sheet-close", ...t });
+}
+function l({
+  ...t
+}) {
+  return /* @__PURE__ */ e.jsx(o.Portal, { "data-slot": "sheet-portal", ...t });
+}
+function d({
+  className: t,
+  ...a
+}) {
+  return /* @__PURE__ */ e.jsx(
+    o.Overlay,
+    {
+      "data-slot": "sheet-overlay",
+      className: s(
+        `
+          fixed inset-0 z-50 bg-black/50
+          data-[state=closed]:animate-out data-[state=closed]:fade-out-0
+          data-[state=open]:animate-in data-[state=open]:fade-in-0
+        `,
+        t
+      ),
+      ...a
+    }
+  );
+}
+function p({
+  className: t,
+  children: a,
+  side: n = "right",
+  ...r
+}) {
+  return /* @__PURE__ */ e.jsxs(l, { children: [
+    /* @__PURE__ */ e.jsx(d, {}),
+    /* @__PURE__ */ e.jsxs(
+      o.Content,
+      {
+        "data-slot": "sheet-content",
+        className: s(
+          `
+            fixed z-50 flex flex-col gap-4 bg-background text-foreground
+            shadow-lg transition ease-in-out
+            data-[state=closed]:animate-out data-[state=closed]:duration-300
+            data-[state=open]:animate-in data-[state=open]:duration-500
+          `,
+          n === "right" && `
+              inset-y-0 right-0 h-full w-3/4 border-l
+              data-[state=closed]:slide-out-to-right
+              data-[state=open]:slide-in-from-right
+              sm:max-w-sm
+            `,
+          n === "left" && `
+              inset-y-0 left-0 h-full w-3/4 border-r
+              data-[state=closed]:slide-out-to-left
+              data-[state=open]:slide-in-from-left
+              sm:max-w-sm
+            `,
+          n === "top" && `
+              inset-x-0 top-0 h-auto border-b
+              data-[state=closed]:slide-out-to-top
+              data-[state=open]:slide-in-from-top
+            `,
+          n === "bottom" && `
+              inset-x-0 bottom-0 h-auto border-t
+              data-[state=closed]:slide-out-to-bottom
+              data-[state=open]:slide-in-from-bottom
+            `,
+          t
+        ),
+        ...r,
+        children: [
+          a,
+          /* @__PURE__ */ e.jsxs(
+            o.Close,
+            {
+              className: `\r
+            absolute top-4 right-4 rounded-xs text-foreground opacity-70\r
+            ring-offset-background transition-opacity\r
+            hover:opacity-100\r
+            focus:ring-2 focus:ring-ring focus:ring-offset-2\r
+            focus:outline-hidden\r
+            disabled:pointer-events-none\r
+            data-[state=open]:bg-secondary\r
+          `,
+              children: [
+                /* @__PURE__ */ e.jsx(i, { className: "size-4" }),
+                /* @__PURE__ */ e.jsx("span", { className: "sr-only", children: "Close" })
+              ]
+            }
+          )
+        ]
+      }
+    )
+  ] });
+}
+function x({ className: t, ...a }) {
+  return /* @__PURE__ */ e.jsx(
+    "div",
+    {
+      "data-slot": "sheet-header",
+      className: s("flex flex-col gap-1.5 p-4", t),
+      ...a
+    }
+  );
+}
+function g({ className: t, ...a }) {
+  return /* @__PURE__ */ e.jsx(
+    "div",
+    {
+      "data-slot": "sheet-footer",
+      className: s("mt-auto flex flex-col gap-2 p-4", t),
+      ...a
+    }
+  );
+}
+function b({
+  className: t,
+  ...a
+}) {
+  return /* @__PURE__ */ e.jsx(
+    o.Title,
+    {
+      "data-slot": "sheet-title",
+      className: s("font-semibold text-foreground", t),
+      ...a
+    }
+  );
+}
+function j({
+  className: t,
+  ...a
+}) {
+  return /* @__PURE__ */ e.jsx(
+    o.Description,
+    {
+      "data-slot": "sheet-description",
+      className: s("paragraph-sm text-muted-foreground", t),
+      ...a
+    }
+  );
+}
+export {
+  f as S,
+  m as a,
+  p as b,
+  j as c,
+  g as d,
+  x as e,
+  b as f,
+  h as g
+};

package/dist/skeleton-DcjuJ5_d.js

@@ -0,0 +1,14 @@
+import { j as s, c as a } from "./index-C_XDkVGm.js";
+function o({ className: e, ...t }) {
+  return /* @__PURE__ */ s.jsx(
+    "div",
+    {
+      "data-slot": "skeleton",
+      className: a("bg-accent animate-pulse rounded-md", e),
+      ...t
+    }
+  );
+}
+export {
+  o as S
+};

package/dist/ui.css

@@ -239,55 +239,9 @@
     0px 16px 32px 0px rgba(25, 25, 25, 0.1),
     0px 0px 12px 0px rgba(25, 25, 25, 0.08);
 
-  --animate-fade-in-scale-up: fadeInScaleUp 0.15s ease-out;
-  --animate-fade-out-scale-up: fadeOutScaleUp 0.15s ease-out;
-  --animate-fade-in-scale-down: fadeInScaleDown 0.15s ease-out;
-  --animate-fade-out-scale-down: fadeOutScaleDown 0.15s ease-out;
-
   --ease-circ-in: cubic-bezier(0.6, 0.04, 0.98, 0.335);
   --ease-circ-out: cubic-bezier(0.075, 0.82, 0.165, 1);
   --ease-circ-in-out: cubic-bezier(0.785, 0.135, 0.15, 0.86);
-
-  @keyframes fadeInScaleUp {
-    0% {
-      opacity: 0;
-      transform: scale(0.9) translateY(50px);
-    }
-    100% {
-      opacity: 1;
-      transform: scale(1) translateY(0);
-    }
-  }
-  @keyframes fadeOutScaleUp {
-    0% {
-      opacity: 1;
-      transform: scale(1) translateY(0);
-    }
-    100% {
-      opacity: 0;
-      transform: scale(0.9) translateY(50px);
-    }
-  }
-  @keyframes fadeInScaleDown {
-    0% {
-      opacity: 0;
-      transform: scale(0.9) translateY(-50px);
-    }
-    100% {
-      opacity: 1;
-      transform: scale(1) translateY(0);
-    }
-  }
-  @keyframes fadeOutScaleDown {
-    0% {
-      opacity: 1;
-      transform: scale(1) translateY(0);
-    }
-    100% {
-      opacity: 0;
-      transform: scale(0.9) translateY(-50px);
-    }
-  }
 }
 
 :root {
@@ -326,13 +280,16 @@
   --sidebar-foreground: var(--foreground);
   --sidebar-primary: var(--primary);
   --sidebar-primary-foreground: var(--primary-foreground);
-  --sidebar-accent: var(--accent);
-  --sidebar-accent-foreground: var(--accent-foreground);
+  --sidebar-accent: var(--color-blue-050);
+  --sidebar-accent-foreground: var(--color-blue-500);
   --sidebar-border: var(--border);
   --surface: var(--color-neutral-100);
   --surface-foreground: var(--foreground);
   --code: var(--color-neutral-100);
   --code-foreground: var(--color-neutral-950);
+  --scrollbar: var(--color-neutral-100);
+  --scrollbar-foreground: var(--color-neutral-200);
+  --scrollbar-hover: var(--color-neutral-300);
 }
 
 .dark {
@@ -370,13 +327,16 @@
   --sidebar-foreground: var(--foreground);
   --sidebar-primary: var(--primary);
   --sidebar-primary-foreground: var(--primary-foreground);
-  --sidebar-accent: var(--accent);
-  --sidebar-accent-foreground: var(--accent-foreground);
+  --sidebar-accent: var(--color-blue-900);
+  --sidebar-accent-foreground: var(--color-blue-200);
   --sidebar-border: var(--border);
   --surface: var(--color-neutral-900);
   --surface-foreground: var(--foreground);
   --code: var(--color-neutral-900);
   --code-foreground: var(--color-neutral-100);
+  --scrollbar: var(--color-neutral-800);
+  --scrollbar-foreground: var(--color-neutral-700);
+  --scrollbar-hover: var(--color-neutral-600);
 }
 /*
   The default border color has changed to `currentcolor` in Tailwind CSS v4,
@@ -713,17 +673,17 @@ input[type='color']::-webkit-color-swatch {
 }
 
 *::-webkit-scrollbar-track {
-  background: var(--color-neutral-000);
+  background: var(--scrollbar);
   border-radius: 30px;
 }
 
 *::-webkit-scrollbar-thumb {
-  background-color: var(--color-neutral-100);
+  background-color: var(--scrollbar-foreground);
   border-radius: 14px;
 }
 
 ::-webkit-scrollbar-thumb:hover {
-  background-color: var(--color-neutral-200);
+  background-color: var(--scrollbar-hover);
 }
 
 @utility active-card {
@@ -731,5 +691,16 @@ input[type='color']::-webkit-color-swatch {
 }
 
 @utility focusable-item {
-  @apply transition-[color,background-color,box-shadow] focus-visible:ring-[2px] focus-visible:ring-ring-default focus-visible:ring-offset-1 focus-visible:outline-hidden;
+  @apply transition-[color,background-color,box-shadow] focus-visible:ring-[2px] focus-visible:ring-ring-default/80 focus-visible:ring-offset-1 focus-visible:outline-hidden;
+}
+
+/* Reduced motion support */
+@media (prefers-reduced-motion: reduce) {
+  *,
+  *::before,
+  *::after {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+  }
 }