@caseparts-org/caseblocks 0.0.101 → 0.0.102

package/dist/atoms/Tooltip/Tooltip.d.ts

@@ -11,6 +11,7 @@ export type TooltipProps = {
     closeDelay?: number;
     disabled?: boolean;
     leaveGraceMs?: number;
+    tooltipOffset?: number;
 };
 export declare const Tooltip: React.FC<TooltipProps>;
 export {};

package/dist/atoms/Tooltip/Tooltip.js

@@ -1,78 +1,79 @@
-import { jsxs as N, Fragment as O, jsx as M } from "react/jsx-runtime";
+import { jsxs as W, Fragment as A, jsx as S } from "react/jsx-runtime";
 import * as i from "react";
-import { c as S } from "../../clsx-OuTLNxxd.js";
-import { r as W } from "../../index-B4KbmMH3.js";
-import '../../assets/Tooltip.css';const A = "_tooltip_17o7a_1", D = "_content_17o7a_11", j = {
-  tooltip: A,
-  content: D
+import { c as j } from "../../clsx-OuTLNxxd.js";
+import { r as D } from "../../index-B4KbmMH3.js";
+import '../../assets/Tooltip.css';const I = "_tooltip_17o7a_1", O = "_content_17o7a_11", H = {
+  tooltip: I,
+  content: O
 };
-function I(l) {
-  return l ? l.includes(" ") ? l : `${l} center` : "top center";
+function $(u) {
+  return u ? u.includes(" ") ? u : `${u} center` : "top center";
 }
-function $(l) {
-  const v = I(l).toLowerCase(), [s, t] = v.split(" ");
+function q(u) {
+  const w = $(u).toLowerCase(), [s, t] = w.split(" ");
   return { side: ["top", "right", "bottom", "left"].includes(s) ? s : "top", align: t === "left" || t === "top" ? "start" : t === "right" || t === "bottom" ? "end" : "center" };
 }
-function q(l, v, s, t, d = 8) {
-  const n = l.getBoundingClientRect(), u = v.getBoundingClientRect();
-  let f = 0, c = 0;
-  s === "top" ? f = n.top - u.height - d : s === "bottom" ? f = n.bottom + d : s === "left" ? c = n.left - u.width - d : s === "right" && (c = n.right + d), s === "top" || s === "bottom" ? t === "start" ? c = n.left : t === "end" ? c = n.right - u.width : c = n.left + n.width / 2 - u.width / 2 : t === "start" ? f = n.top : t === "end" ? f = n.bottom - u.height : f = n.top + n.height / 2 - u.height / 2;
-  const E = window.innerWidth, R = window.innerHeight;
-  return f = Math.max(4, Math.min(R - u.height - 4, f)), c = Math.max(4, Math.min(E - u.width - 4, c)), { top: f, left: c };
+function G(u, w, s, t, d = 0) {
+  const n = u.getBoundingClientRect(), f = w.getBoundingClientRect();
+  let a = 0, c = 0;
+  s === "top" ? a = n.top - f.height - d : s === "bottom" ? a = n.bottom + d : s === "left" ? c = n.left - f.width - d : s === "right" && (c = n.right + d), s === "top" || s === "bottom" ? t === "start" ? c = n.left : t === "end" ? c = n.right - f.width : c = n.left + n.width / 2 - f.width / 2 : t === "start" ? a = n.top : t === "end" ? a = n.bottom - f.height : a = n.top + n.height / 2 - f.height / 2;
+  const E = window.innerWidth, v = window.innerHeight;
+  return a = Math.max(4, Math.min(v - f.height - 4, a)), c = Math.max(4, Math.min(E - f.width - 4, c)), { top: a, left: c };
 }
-const Q = ({
-  tooltipClassName: l,
-  contentClassName: v,
+const U = ({
+  tooltipClassName: u,
+  contentClassName: w,
   children: s,
   trigger: t,
   position: d,
   disabled: n,
-  openDelay: u = 150,
-  closeDelay: f = 100,
-  leaveGraceMs: c = 0
+  openDelay: f = 150,
+  closeDelay: a = 100,
+  leaveGraceMs: c = 0,
+  tooltipOffset: E = 4
 }) => {
-  const { side: E, align: R } = $(d), [o, y] = i.useState(!1), [m, C] = i.useState(null), T = i.useRef(null), g = i.useRef(null), x = i.useRef(null), L = i.useRef(null), P = i.useRef(null), w = i.useRef(!1), a = (e) => {
+  const { side: v, align: b } = q(d), [o, R] = i.useState(!1), [m, C] = i.useState(null), T = i.useRef(null), g = i.useRef(null), x = i.useRef(null), y = i.useRef(null), L = i.useRef(null), h = i.useRef(!1), p = (e) => {
     e.current && (window.clearTimeout(e.current), e.current = null);
   }, B = () => {
-    a(x), a(L), a(P);
+    p(x), p(y), p(L);
   };
   i.useEffect(() => () => B(), []);
   const k = () => {
-    n || o || (a(x), x.current = window.setTimeout(() => y(!0), u));
+    n || o || (p(x), x.current = window.setTimeout(() => R(!0), f));
   }, _ = () => {
-    o && (a(L), L.current = window.setTimeout(() => {
-      w.current || y(!1);
-    }, f));
+    o && (p(y), y.current = window.setTimeout(() => {
+      h.current || R(!1);
+    }, a));
   }, z = () => {
     if (o) {
-      if (a(P), c <= 0) {
+      if (p(L), c <= 0) {
         _();
         return;
       }
-      P.current = window.setTimeout(() => {
-        w.current || _();
+      L.current = window.setTimeout(() => {
+        h.current || _();
       }, c);
     }
-  }, b = (e, r) => (h) => {
-    e == null || e(h), r == null || r(h);
-  }, H = i.cloneElement(t, {
+  }, P = (e, r) => (l) => {
+    e == null || e(l), r == null || r(l);
+  }, N = i.cloneElement(t, {
     ref: (e) => {
       const { ref: r } = t;
       typeof r == "function" ? r(e) : r && (r.current = e), T.current = e;
     },
-    onPointerEnter: b(t.props.onPointerEnter, k),
-    onPointerLeave: b(t.props.onPointerLeave, z),
-    onFocus: b(t.props.onFocus, k),
-    onBlur: b(t.props.onBlur, _),
+    onPointerEnter: P(t.props.onPointerEnter, k),
+    onPointerLeave: P(t.props.onPointerLeave, z),
+    onFocus: P(t.props.onFocus, k),
+    onBlur: P(t.props.onBlur, _),
     "aria-describedby": o ? "tooltip-popup" : void 0,
     style: { ...t.props.style || {}, outline: "none" }
   });
   return i.useEffect(() => {
-    n && o && (B(), y(!1));
+    n && o && (B(), R(!1));
   }, [n]), i.useEffect(() => {
     if (!o) return;
     const e = (r) => {
-      r.key === "Escape" && y(!1);
+      r.key === "Escape" && R(!1);
     };
     return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
   }, [o]), i.useLayoutEffect(() => {
@@ -82,36 +83,36 @@ const Q = ({
     }
     const e = T.current, r = g.current;
     if (!e || !r) return;
-    const h = 8, p = () => {
-      C(q(e, r, E, R, h));
+    const l = () => {
+      C(G(e, r, v, b, E));
     };
-    return p(), window.addEventListener("resize", p), window.addEventListener("scroll", p, !0), () => {
-      window.removeEventListener("resize", p), window.removeEventListener("scroll", p, !0);
+    return l(), window.addEventListener("resize", l), window.addEventListener("scroll", l, !0), () => {
+      window.removeEventListener("resize", l), window.removeEventListener("scroll", l, !0);
     };
-  }, [o, E, R, s]), i.useEffect(() => {
+  }, [o, v, b, s, E]), i.useEffect(() => {
     if (!o) return;
     const e = (r) => {
-      const h = T.current, p = g.current;
-      if (!h || !p) return;
-      const F = r.target;
-      !h.contains(F) && !p.contains(F) && (w.current = !1, z());
+      const l = T.current, F = g.current;
+      if (!l || !F) return;
+      const M = r.target;
+      !l.contains(M) && !F.contains(M) && (h.current = !1, z());
     };
     return document.addEventListener("pointermove", e), () => document.removeEventListener("pointermove", e);
   }, [o]), i.useEffect(() => {
-    o || (w.current = !1);
-  }, [o]), /* @__PURE__ */ N(O, { children: [
-    H,
-    o && typeof document < "u" && W.createPortal(
-      /* @__PURE__ */ M(
+    o || (h.current = !1);
+  }, [o]), /* @__PURE__ */ W(A, { children: [
+    N,
+    o && typeof document < "u" && D.createPortal(
+      /* @__PURE__ */ S(
         "div",
         {
           id: "tooltip-popup",
           ref: g,
           role: "tooltip",
           "aria-hidden": !o,
-          "data-side": E,
-          "data-align": R,
-          className: S(j.tooltip, l),
+          "data-side": v,
+          "data-align": b,
+          className: j(H.tooltip, u),
           style: {
             position: "absolute",
             top: (m == null ? void 0 : m.top) ?? 0,
@@ -120,12 +121,12 @@ const Q = ({
             zIndex: 10
           },
           onPointerEnter: () => {
-            w.current = !0, a(L), a(P);
+            h.current = !0, p(y), p(L);
           },
           onPointerLeave: () => {
-            w.current = !1, z();
+            h.current = !1, z();
           },
-          children: /* @__PURE__ */ M("div", { className: S(j.content, v), children: s })
+          children: /* @__PURE__ */ S("div", { className: j(H.content, w), children: s })
         }
       ),
       document.body
@@ -133,5 +134,5 @@ const Q = ({
   ] });
 };
 export {
-  Q as Tooltip
+  U as Tooltip
 };

package/dist/molecules/CategoryNav/CategoryNav.js

@@ -19,6 +19,7 @@ function z({
       {
         openDelay: 180,
         closeDelay: 0,
+        tooltipOffset: 0,
         trigger: /* @__PURE__ */ e("li", { className: o.category, tabIndex: 0, children: /* @__PURE__ */ t(s, { href: i.route, children: [
           /* @__PURE__ */ e(n, { size: "sm", weight: "semibold", children: i.label }),
           i.showChevron && /* @__PURE__ */ e(

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@caseparts-org/caseblocks",
   "private": false,
-  "version": "0.0.101",
+  "version": "0.0.102",
   "type": "module",
   "module": "dist/main.js",
   "types": "dist/main.d.ts",