chesai-ui 0.16.8 → 0.16.9

package/dist/components/item/index.mjs

@@ -2,17 +2,17 @@ import { jsx as a, jsxs as V } from "react/jsx-runtime";
 import { Slot as Ce } from "@radix-ui/react-slot";
 import { useLongPress as Ie } from "@uidotdev/usehooks";
 import { cva as $ } from "class-variance-authority";
-import { clsx as d } from "clsx";
-import { useMotionValue as we, useTransform as k, motion as h, AnimatePresence as ke, animate as j, cubicBezier as je } from "framer-motion";
+import { clsx as c } from "clsx";
+import { useMotionValue as we, useTransform as k, motion as h, AnimatePresence as ke, animate as D, cubicBezier as De } from "framer-motion";
 import * as o from "react";
-import { twMerge as c } from "tailwind-merge";
-import De from "use-ripple-hook";
+import { twMerge as m } from "tailwind-merge";
+import Pe from "use-ripple-hook";
 const _ = o.createContext({
   variant: "primary",
   size: "md",
   direction: "horizontal",
   expanded: !1
-}), b = () => o.useContext(_), Ee = $(
+}), N = () => o.useContext(_), je = $(
   "group/item relative flex flex-wrap items-center transition-all duration-200 ease-out focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 overflow-hidden z-0",
   {
     variants: {
@@ -72,7 +72,7 @@ const _ = o.createContext({
       elevation: "none"
     }
   }
-), Se = $(
+), Ee = $(
   "flex shrink-0 items-center justify-center gap-2 [&_svg]:pointer-events-none transition-colors",
   {
     variants: {
@@ -98,13 +98,13 @@ const _ = o.createContext({
       shape: "minimal"
     }
   }
-), Me = {
+), Se = {
   none: "gap-0",
   xs: "gap-0.5",
   sm: "gap-1",
   md: "gap-2",
   lg: "gap-4"
-}, Pe = (r, e, t, n) => {
+}, Me = (r, e, t, n) => {
   const l = r === 0, u = r === e - 1, g = e === 1;
   if (t === "sharp") return "!rounded-none";
   if (g) {
@@ -132,7 +132,7 @@ const _ = o.createContext({
     gap: l = "xs",
     ...u
   }, g) => {
-    const z = o.Children.toArray(e).filter(
+    const v = o.Children.toArray(e).filter(
       o.isValidElement
     );
     return /* @__PURE__ */ a(
@@ -141,27 +141,27 @@ const _ = o.createContext({
         ref: g,
         role: "group",
         "data-slot": "item-group",
-        className: c(
-          d(
+        className: m(
+          c(
             "flex",
             n === "vertical" ? "flex-col" : "flex-row",
-            Me[l],
+            Se[l],
             r
           )
         ),
         ...u,
-        children: z.map((N, p) => {
-          const D = Pe(
-            p,
-            z.length,
+        children: v.map((y, d) => {
+          const P = Me(
+            d,
+            v.length,
             t,
             n
           );
-          return o.cloneElement(N, {
-            className: c(
-              d(
-                N.props.className,
-                D,
+          return o.cloneElement(y, {
+            className: m(
+              c(
+                y.props.className,
+                P,
                 "focus-visible:z-10"
               )
             )
@@ -177,7 +177,7 @@ const Be = o.forwardRef(({ className: r, ...e }, t) => /* @__PURE__ */ a(
   {
     ref: t,
     "data-slot": "item-separator",
-    className: c(d("h-px w-full bg-outline-variant", r)),
+    className: m(c("h-px w-full bg-outline-variant", r)),
     ...e
   }
 ));
@@ -209,87 +209,87 @@ const B = {
     direction: l = "horizontal",
     padding: u = "md",
     bordered: g = !1,
-    elevation: z = "none",
-    asChild: N = !1,
-    disabled: p,
-    disableRipple: D = !1,
+    elevation: v = "none",
+    asChild: y = !1,
+    disabled: d,
+    disableRipple: P = !1,
     onLongPress: F,
     onPointerDown: R,
     expandable: H = !1,
-    expanded: E,
+    expanded: j,
     defaultExpanded: T = !1,
     onExpandedChange: A,
-    swipeType: v = "trigger",
+    swipeType: b = "trigger",
     swipeThreshold: C = 100,
     swipeRightAction: i,
     swipeLeftAction: s,
     onSwipeRight: X,
     onSwipeLeft: G,
-    swipeRightOffset: S = 80,
-    swipeLeftOffset: M = 80,
+    swipeRightOffset: E = 80,
+    swipeLeftOffset: S = 80,
     ...U
   }, L) => {
-    const ee = N ? Ce : "div", y = o.useRef(null);
-    o.useImperativeHandle(L, () => y.current);
-    const W = e || "primary", q = t || "md", J = l || "horizontal", [te, re] = o.useState(T), I = E !== void 0 ? E : te, ne = () => {
-      if (p) return;
-      const f = !I;
-      E === void 0 && re(f), A?.(f);
-    }, ae = "var(--color-ripple-dark)", [, oe] = De({
-      ref: y,
+    const ee = y ? Ce : "div", z = o.useRef(null);
+    o.useImperativeHandle(L, () => z.current);
+    const W = e || "primary", q = t || "md", J = l || "horizontal", [te, re] = o.useState(T), I = j !== void 0 ? j : te, ne = () => {
+      if (d) return;
+      const p = !I;
+      j === void 0 && re(p), A?.(p);
+    }, ae = "var(--color-ripple-dark)", [, oe] = Pe({
+      ref: z,
       color: ae,
       duration: 400,
-      disabled: p || D
+      disabled: d || P
     }), ie = Ie(F ?? (() => {
     }), {
       threshold: 500
-    }), se = (f) => {
-      oe(f), R?.(f);
-    }, P = !!i || !!s, m = we(0), [le, K] = o.useState(!1), de = k(m, [-1e3, 0, 1e3], [0, 0, 1e3]), ce = k(m, [-1e3, 0, 1e3], [1e3, 0, 0]), me = k(m, [0, 50], [0, 1]), ue = k(m, [0, -50], [0, 1]), fe = {
-      left: v === "reveal" ? s ? -M : 0 : -1e3,
-      right: v === "reveal" ? i ? S : 0 : 1e3
-    }, pe = (f, ye) => {
-      if (p) return;
-      const w = ye?.offset?.x ?? 0, Y = m.get();
+    }), se = (p) => {
+      oe(p), R?.(p);
+    }, M = !!i || !!s, f = we(0), [le, K] = o.useState(!1), de = k(f, [-1e3, 0, 1e3], [0, 0, 1e3]), ce = k(f, [-1e3, 0, 1e3], [1e3, 0, 0]), me = k(f, [0, 50], [0, 1]), ue = k(f, [0, -50], [0, 1]), fe = {
+      left: b === "reveal" ? s ? -S : 0 : -1e3,
+      right: b === "reveal" ? i ? E : 0 : 1e3
+    }, pe = (p, ye) => {
+      if (d) return;
+      const w = ye?.offset?.x ?? 0, Y = f.get();
       let x = 0;
       const be = {
         type: "tween",
-        ease: je(0.05, 0.7, 0.1, 1),
+        ease: De(0.05, 0.7, 0.1, 1),
         duration: 0.28
       };
-      if (v === "dismiss") {
+      if (b === "dismiss") {
         if (w > C && i) {
-          x = 600, j(m, x, { type: "tween", duration: 0.2 }).then(() => {
-            y.current && (K(!0), i.onClick?.(), X?.());
+          x = 600, D(f, x, { type: "tween", duration: 0.2 }).then(() => {
+            z.current && (K(!0), i.onClick?.(), X?.());
           });
           return;
         } else if (w < -C && s) {
-          x = -600, j(m, x, { type: "tween", duration: 0.2 }).then(() => {
-            y.current && (K(!0), s.onClick?.(), G?.());
+          x = -600, D(f, x, { type: "tween", duration: 0.2 }).then(() => {
+            z.current && (K(!0), s.onClick?.(), G?.());
           });
           return;
         }
-      } else if (v === "reveal") {
-        const ze = S / 2, Ne = M / 2;
-        Y > ze && i ? x = S : Y < -Ne && s && (x = -M);
+      } else if (b === "reveal") {
+        const ze = E / 2, Ne = S / 2;
+        Y > ze && i ? x = E : Y < -Ne && s && (x = -S);
       } else
         w > C && i ? (i.onClick?.(), X?.()) : w < -C && s && (s.onClick?.(), G?.());
-      j(m, x, be);
+      D(f, x, be);
     }, ge = {
       ...U,
-      "aria-disabled": p,
+      "aria-disabled": d,
       ...F ? ie : {},
       onPointerDown: se,
-      onClick: (f) => {
-        if (P && Math.abs(m.get()) > 5) {
-          v === "reveal" && Math.abs(m.get()) > 10 && (f.stopPropagation(), f.preventDefault(), j(m, 0, {
+      onClick: (p) => {
+        if (M && Math.abs(f.get()) > 5) {
+          b === "reveal" && Math.abs(f.get()) > 10 && (p.stopPropagation(), p.preventDefault(), D(f, 0, {
             type: "tween",
             ease: [0.05, 0.7, 0.1, 1],
             duration: 0.25
           }));
           return;
         }
-        H && ne(), U.onClick?.(f);
+        H && ne(), U.onClick?.(p);
       }
     }, xe = n === "full" ? I ? "rounded-[16px]" : "rounded-[32px]" : B[n || "minimal"], O = {
       variant: W,
@@ -299,35 +299,35 @@ const B = {
     }, Q = /* @__PURE__ */ a(
       ee,
       {
-        ref: P ? void 0 : y,
+        ref: M ? void 0 : z,
         "data-slot": "item",
-        className: c(
-          d(
-            Ee({
+        className: m(
+          c(
+            je({
               variant: W,
               size: q,
               shape: n === "full" ? void 0 : n,
               direction: J,
               padding: u,
               bordered: g,
-              elevation: z
+              elevation: v
             }),
             n === "full" && (I ? "rounded-[16px]" : "rounded-[32px]"),
             H && "cursor-pointer",
             r,
-            p && "opacity-50 cursor-not-allowed pointer-events-none"
+            d && "opacity-50 cursor-not-allowed pointer-events-none"
           )
         ),
         ...ge
       }
     );
-    if (!P)
+    if (!M)
       return /* @__PURE__ */ a(_.Provider, { value: O, children: Q });
     const he = i?.shape ? B[i.shape] : "rounded-[inherit]", ve = s?.shape ? B[s.shape] : "rounded-[inherit]";
     return /* @__PURE__ */ a(_.Provider, { value: O, children: /* @__PURE__ */ V(
       h.div,
       {
-        className: d(
+        className: c(
           "relative w-full overflow-hidden z-0 bg-transparent transform-gpu will-change-[height,opacity] transition-all duration-200 ease-out",
           xe
         ),
@@ -346,8 +346,8 @@ const B = {
             h.div,
             {
               style: { width: de },
-              className: c(
-                d(
+              className: m(
+                c(
                   "absolute inset-y-0 left-0 flex items-center justify-center overflow-hidden z-0 transform-gpu will-change-[width,opacity]",
                   he,
                   Z(i.color),
@@ -371,8 +371,8 @@ const B = {
             h.div,
             {
               style: { width: ce },
-              className: c(
-                d(
+              className: m(
+                c(
                   "absolute inset-y-0 right-0 flex items-center justify-center overflow-hidden z-0 transform-gpu will-change-[width,opacity]",
                   ve,
                   Z(s.color),
@@ -395,14 +395,15 @@ const B = {
           /* @__PURE__ */ a(
             h.div,
             {
-              ref: y,
-              style: { x: m },
-              drag: p ? !1 : "x",
+              ref: z,
+              style: { x: f },
+              drag: d ? !1 : "x",
               dragDirectionLock: !0,
               dragConstraints: fe,
-              dragElastic: v === "reveal" ? 0.2 : 0.3,
+              dragElastic: b === "reveal" ? 0.2 : 0.3,
               onDragEnd: pe,
-              className: "relative z-10 w-full rounded-[inherit] cursor-pointer transform-gpu will-change-transform",
+              "data-vaul-no-drag": !0,
+              className: "relative z-10 w-full rounded-[inherit] cursor-pointer transform-gpu will-change-transform touch-pan-y",
               children: Q
             }
           )
@@ -411,15 +412,15 @@ const B = {
     ) });
   }
 ), _e = o.forwardRef(({ className: r, variant: e, shape: t = "minimal", ...n }, l) => {
-  const { size: u, direction: g } = b();
+  const { size: u, direction: g } = N();
   return /* @__PURE__ */ a(
     "div",
     {
       ref: l,
       "data-slot": "item-media",
-      className: c(
-        d(
-          Se({
+      className: m(
+        c(
+          Ee({
             variant: e,
             size: u,
             shape: t,
@@ -434,14 +435,14 @@ const B = {
 });
 _e.displayName = "ItemMedia";
 const Fe = o.forwardRef(({ className: r, ...e }, t) => {
-  const { direction: n } = b();
+  const { direction: n } = N();
   return /* @__PURE__ */ a(
     "div",
     {
       ref: t,
       "data-slot": "item-content",
-      className: c(
-        d(
+      className: m(
+        c(
           "flex flex-1 flex-col gap-0.5 min-w-0 z-10",
           n === "vertical" && "items-center",
           r
@@ -453,14 +454,14 @@ const Fe = o.forwardRef(({ className: r, ...e }, t) => {
 });
 Fe.displayName = "ItemContent";
 const He = o.forwardRef(({ className: r, ...e }, t) => {
-  const { direction: n } = b();
+  const { direction: n } = N();
   return /* @__PURE__ */ a(
     "div",
     {
       ref: t,
       "data-slot": "item-title",
-      className: c(
-        d(
+      className: m(
+        c(
           "flex w-fit items-center gap-2 text-title-medium font-semibold leading-snug text-inherit",
           n === "vertical" && "justify-center",
           r
@@ -472,14 +473,14 @@ const He = o.forwardRef(({ className: r, ...e }, t) => {
 });
 He.displayName = "ItemTitle";
 const Xe = o.forwardRef(({ className: r, collapsedLines: e = 2, ...t }, n) => {
-  const { expanded: l } = b();
+  const { expanded: l } = N();
   return /* @__PURE__ */ a(
     "p",
     {
       ref: n,
       "data-slot": "item-description",
-      className: c(
-        d(
+      className: m(
+        c(
           "opacity-80 text-sm font-normal leading-normal text-inherit transition-all duration-200",
           l ? "" : e === 1 ? "line-clamp-1" : e === 2 ? "line-clamp-2" : e === 3 ? "line-clamp-3" : e === 4 ? "line-clamp-4" : e === 5 ? "line-clamp-5" : e === 6 ? "line-clamp-6" : "",
           r
@@ -491,14 +492,14 @@ const Xe = o.forwardRef(({ className: r, collapsedLines: e = 2, ...t }, n) => {
 });
 Xe.displayName = "ItemDescription";
 const Ge = o.forwardRef(({ className: r, ...e }, t) => {
-  const { direction: n } = b();
+  const { direction: n } = N();
   return /* @__PURE__ */ a(
     "div",
     {
       ref: t,
       "data-slot": "item-actions",
-      className: c(
-        d(
+      className: m(
+        c(
           "flex items-center gap-2 z-10",
           n === "horizontal" ? "ml-auto pl-4" : "mt-2",
           r
@@ -509,18 +510,24 @@ const Ge = o.forwardRef(({ className: r, ...e }, t) => {
   );
 });
 Ge.displayName = "ItemActions";
-const Ue = o.forwardRef(({ className: r, children: e, ...t }, n) => {
-  const { expanded: l } = b();
-  return /* @__PURE__ */ a(ke, { initial: !1, children: l && /* @__PURE__ */ a(
+const Ue = o.forwardRef(({ className: r, children: e, onClick: t, onPointerDown: n, ...l }, u) => {
+  const { expanded: g } = N(), v = (d) => {
+    d.stopPropagation(), t?.(d);
+  }, y = (d) => {
+    d.stopPropagation(), n?.(d);
+  };
+  return /* @__PURE__ */ a(ke, { initial: !1, children: g && /* @__PURE__ */ a(
     h.div,
     {
-      ref: n,
+      ref: u,
       initial: { height: 0, opacity: 0 },
       animate: { height: "auto", opacity: 1 },
       exit: { height: 0, opacity: 0 },
       transition: { duration: 0.3, ease: [0.2, 0, 0, 1] },
-      className: c("overflow-hidden w-full", r),
-      ...t,
+      className: m("overflow-hidden w-full", r),
+      onClick: v,
+      onPointerDown: y,
+      ...l,
       children: /* @__PURE__ */ a("div", { className: "pt-2 pb-1", children: e })
     }
   ) });
@@ -531,8 +538,8 @@ const We = o.forwardRef(({ className: r, ...e }, t) => /* @__PURE__ */ a(
   {
     ref: t,
     "data-slot": "item-header",
-    className: c(
-      d("flex basis-full items-center justify-between gap-2", r)
+    className: m(
+      c("flex basis-full items-center justify-between gap-2", r)
     ),
     ...e
   }
@@ -543,8 +550,8 @@ const qe = o.forwardRef(({ className: r, ...e }, t) => /* @__PURE__ */ a(
   {
     ref: t,
     "data-slot": "item-footer",
-    className: c(
-      d(
+    className: m(
+      c(
         "flex basis-full items-center justify-between gap-2 mt-2",
         r
       )
@@ -565,5 +572,5 @@ export {
   _e as ItemMedia,
   Be as ItemSeparator,
   He as ItemTitle,
-  b as useItem
+  N as useItem
 };

package/package.json

@@ -1,7 +1,8 @@
 {
   "name": "chesai-ui",
   "private": false,
-  "version": "0.16.8",
+  "version": "0.16.9",
+  "packageManager": "pnpm@10.12.1",
   "repository": {
     "type": "git",
     "url": "https://github.com/ayhamdev/chesai-ui"
@@ -24,6 +25,19 @@
   "engines": {
     "node": ">=22"
   },
+  "scripts": {
+    "dev": "bunx storybook dev -p 8000",
+    "build": "storybook build",
+    "build:lib": "tsc && vite build",
+    "build:docs": "npx ts-node  ./scripts/generate-llm.ts",
+    "lint": "npx @biomejs/biome lint --write ./src",
+    "format": "npx @biomejs/biome check --write --organize-imports-enabled=true ./src",
+    "test": "vitest",
+    "test:cov": "vitest run --coverage",
+    "gen:context": "bun run ./scripts/context.ts",
+    "git:diff-merge": "git diff --unified=2000 $(git merge-base main HEAD)...HEAD",
+    "git:diff": "git diff --unified=2000 > git-changes.txt"
+  },
   "dependencies": {
     "@capacitor/app": "^8.0.0",
     "@capacitor/core": "^8.0.1",
@@ -154,18 +168,5 @@
       "biome lint --write --no-errors-on-unmatched --files-ignore-unknown=true",
       "biome format --write --no-errors-on-unmatched"
     ]
-  },
-  "scripts": {
-    "dev": "bunx storybook dev -p 8000",
-    "build": "storybook build",
-    "build:lib": "tsc && vite build",
-    "build:docs": "npx ts-node  ./scripts/generate-llm.ts",
-    "lint": "npx @biomejs/biome lint --write ./src",
-    "format": "npx @biomejs/biome check --write --organize-imports-enabled=true ./src",
-    "test": "vitest",
-    "test:cov": "vitest run --coverage",
-    "gen:context": "bun run ./scripts/context.ts",
-    "git:diff-merge": "git diff --unified=2000 $(git merge-base main HEAD)...HEAD",
-    "git:diff": "git diff --unified=2000 > git-changes.txt"
   }
-}
+}