@forgedevstack/bear 1.2.0 → 1.2.1

package/dist/components/Tooltip/Tooltip.js

@@ -1,81 +1,89 @@
-import { jsxs as C, Fragment as _, jsx as u } from "react/jsx-runtime";
-import { useState as m, useRef as h, useCallback as E, useEffect as w } from "react";
-import { createPortal as N } from "react-dom";
-import { cn as j } from "../../utils/cn.js";
-const z = ({
+import { jsxs as k, Fragment as L, jsx as d } from "react/jsx-runtime";
+import { useState as w, useRef as h, useCallback as C, useEffect as b } from "react";
+import { createPortal as _ } from "react-dom";
+import { cn as z } from "../../utils/cn.js";
+const V = ({
   content: x,
-  children: y,
-  position: M,
-  placement: R,
-  delay: T = 200,
-  className: B,
-  disabled: k = !1
+  children: v,
+  position: y,
+  placement: M,
+  delay: R = 200,
+  className: T,
+  disabled: B = !1
 }) => {
-  const a = R || M || "top", [s, d] = m(!1), [b, v] = m({ x: 0, y: 0 }), c = h(null), l = h(null), i = h(), f = E(() => {
-    if (!c.current || !l.current) return;
-    const e = c.current.getBoundingClientRect(), t = l.current.getBoundingClientRect(), n = 8;
+  const c = M || y || "top", [i, m] = w(!1), [f, E] = w({ x: 0, y: 0 }), l = h(null), u = h(null), n = h(), a = C(() => {
+    if (!l.current || !u.current) return;
+    const e = l.current.getBoundingClientRect(), t = u.current.getBoundingClientRect(), s = 8;
     let r = 0, o = 0;
-    switch (a) {
+    switch (c) {
       case "top":
-        r = e.left + (e.width - t.width) / 2, o = e.top - t.height - n;
+        r = e.left + (e.width - t.width) / 2, o = e.top - t.height - s;
         break;
       case "bottom":
-        r = e.left + (e.width - t.width) / 2, o = e.bottom + n;
+        r = e.left + (e.width - t.width) / 2, o = e.bottom + s;
         break;
       case "left":
-        r = e.left - t.width - n, o = e.top + (e.height - t.height) / 2;
+        r = e.left - t.width - s, o = e.top + (e.height - t.height) / 2;
         break;
       case "right":
-        r = e.right + n, o = e.top + (e.height - t.height) / 2;
+        r = e.right + s, o = e.top + (e.height - t.height) / 2;
         break;
     }
-    r = Math.max(8, Math.min(r, window.innerWidth - t.width - 8)), o = Math.max(8, Math.min(o, window.innerHeight - t.height - 8)), v({ x: r, y: o });
-  }, [a]), g = () => {
-    k || (i.current = setTimeout(() => {
-      d(!0);
-    }, T));
+    r = Math.max(8, Math.min(r, window.innerWidth - t.width - 8)), o = Math.max(8, Math.min(o, window.innerHeight - t.height - 8)), E({ x: r, y: o });
+  }, [c]), g = () => {
+    B || (n.current = setTimeout(() => {
+      m(!0);
+    }, R));
   }, p = () => {
-    i.current && clearTimeout(i.current), d(!1);
+    n.current && clearTimeout(n.current), m(!1);
   };
-  return w(() => {
-    s && f();
-  }, [s, f]), w(() => () => {
-    i.current && clearTimeout(i.current);
-  }, []), /* @__PURE__ */ C(_, { children: [
-    /* @__PURE__ */ u(
+  return b(() => {
+    i && a();
+  }, [i, a]), b(() => {
+    if (!i) return;
+    const e = () => {
+      requestAnimationFrame(() => a());
+    };
+    return e(), window.addEventListener("resize", e), window.addEventListener("scroll", e, !0), () => {
+      window.removeEventListener("resize", e), window.removeEventListener("scroll", e, !0);
+    };
+  }, [i, a]), b(() => () => {
+    n.current && clearTimeout(n.current);
+  }, []), /* @__PURE__ */ k(L, { children: [
+    /* @__PURE__ */ d(
       "div",
       {
-        ref: c,
+        ref: l,
         onMouseEnter: g,
         onMouseLeave: p,
         onFocus: g,
         onBlur: p,
         className: "Bear-Tooltip__trigger bear-inline-block",
-        children: y
+        children: v
       }
     ),
-    s && N(
-      /* @__PURE__ */ u(
+    i && _(
+      /* @__PURE__ */ d(
         "div",
         {
-          ref: l,
+          ref: u,
           role: "tooltip",
           style: {
-            left: b.x,
-            top: b.y
+            left: f.x,
+            top: f.y
           },
-          className: j(
-            "bear-fixed bear-z-[9999]",
+          className: z(
+            "bear-fixed bear-z-[11000]",
             "Bear-Tooltip",
-            `Bear-Tooltip--${a}`,
+            `Bear-Tooltip--${c}`,
             "bear-px-3 bear-py-2 bear-rounded-lg",
             "bear-bg-gray-800 bear-text-white bear-text-sm",
             "bear-border bear-border-gray-700",
             "bear-shadow-lg",
             "bear-animate-in bear-fade-in bear-duration-150",
-            B
+            T
           ),
-          children: /* @__PURE__ */ u("span", { className: "Bear-Tooltip__content", children: x })
+          children: /* @__PURE__ */ d("span", { className: "Bear-Tooltip__content", children: x })
         }
       ),
       document.body
@@ -83,5 +91,5 @@ const z = ({
   ] });
 };
 export {
-  z as Tooltip
+  V as Tooltip
 };

package/dist/components/TreeSelect/TreeSelect.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("react"),m=require("../../utils/cn.cjs"),a=require("./TreeSelect.const.cjs"),E=require("./TreeSelect.utils.cjs"),_=({node:s,depth:c,selected:o,expanded:t,multiple:i,onToggleExpand:h,onSelect:p})=>{const d=s.children&&s.children.length>0,f=t.has(s.id),S=o.has(s.id);return e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:m.cn(a.NODE_CLASSES,S&&a.NODE_SELECTED_CLASSES,s.disabled&&a.NODE_DISABLED_CLASSES),style:{paddingLeft:c*a.INDENT_PX+12},onClick:()=>!s.disabled&&p(s.id),role:"treeitem","aria-selected":S,"aria-expanded":d?f:void 0,children:[d?e.jsx("svg",{className:m.cn(a.CHEVRON_CLASSES,f&&"bear-rotate-90"),onClick:x=>{x.stopPropagation(),h(s.id)},fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9 5l7 7-7 7"})}):e.jsx("span",{className:"bear-w-4 bear-mr-1"}),i&&e.jsx("span",{className:m.cn("bear-w-4 bear-h-4 bear-mr-2 bear-border bear-rounded bear-flex bear-items-center bear-justify-center bear-text-xs",S?"bear-bg-pink-500 bear-border-pink-500 bear-text-white":"bear-border-gray-300 dark:bear-border-zinc-600"),children:S&&"✓"}),s.icon&&e.jsx("span",{className:"bear-mr-1.5",children:s.icon}),e.jsx("span",{className:"bear-truncate",children:s.label})]}),d&&f&&s.children.map(x=>e.jsx(_,{node:x,depth:c+1,selected:o,expanded:t,multiple:i,onToggleExpand:h,onSelect:p},x.id))]})},z=s=>{const{nodes:c,value:o,onChange:t,multiple:i=!1,label:h,placeholder:p="Select…",disabled:d=!1,clearable:f=!0,searchable:S=!0,expandAll:x=!1,size:g="md",error:N,helperText:v,maxHeight:w=a.DEFAULT_MAX_HEIGHT,className:R,testId:T,...O}=s,[j,A]=n.useState(!1),[L,C]=n.useState(""),y=n.useRef(null),I=n.useMemo(()=>E.collectAllIds(c),[c]),[D,B]=n.useState(()=>x?I:new Set),b=n.useMemo(()=>o?new Set(Array.isArray(o)?o:[o]):new Set,[o]);n.useEffect(()=>{const r=l=>{y.current&&!y.current.contains(l.target)&&(A(!1),C(""))};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[]);const H=n.useCallback(r=>{B(l=>{const u=new Set(l);return u.has(r)?u.delete(r):u.add(r),u})},[]),M=n.useCallback(r=>{if(i){const l=new Set(b);l.has(r)?l.delete(r):l.add(r),t==null||t(Array.from(l))}else t==null||t(r),A(!1),C("")},[i,b,t]),P=n.useCallback(()=>{t==null||t(i?[]:"")},[i,t]),k=L?E.filterNodes(c,L):c,q=()=>{if(b.size===0)return e.jsx("span",{className:"bear-text-gray-400 dark:bear-text-zinc-500",children:p});if(i)return e.jsx("div",{className:"bear-flex bear-flex-wrap bear-gap-1",children:Array.from(b).map(l=>{const u=E.findNodeById(c,l);return u?e.jsx("span",{className:a.TAG_CLASSES,children:u.label},l):null})});const r=E.findNodeById(c,Array.from(b)[0]);return(r==null?void 0:r.label)??p};return e.jsxs("div",{ref:y,className:m.cn(a.ROOT_CLASSES,R),"data-testid":T,...O,children:[h&&e.jsx("label",{className:a.LABEL_CLASSES,children:h}),e.jsxs("button",{type:"button",disabled:d,onClick:()=>!d&&A(!j),className:m.cn(a.TRIGGER_CLASSES,a.SIZE_CLASSES[g],d&&"bear-opacity-50 bear-cursor-not-allowed"),children:[e.jsx("span",{className:"bear-flex-1 bear-text-left bear-truncate",children:q()}),e.jsxs("div",{className:"bear-flex bear-items-center bear-gap-1",children:[f&&b.size>0&&e.jsx("span",{className:"bear-text-gray-400 hover:bear-text-gray-600 bear-cursor-pointer",onClick:r=>{r.stopPropagation(),P()},children:"✕"}),e.jsx("svg",{className:m.cn("bear-w-4 bear-h-4 bear-text-gray-400 bear-transition-transform",j&&"bear-rotate-180"),fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})})]})]}),j&&e.jsxs("div",{className:a.DROPDOWN_CLASSES,children:[S&&e.jsx("input",{className:a.SEARCH_CLASSES,placeholder:"Search…",value:L,onChange:r=>C(r.target.value),autoFocus:!0}),e.jsx("div",{style:{maxHeight:w},className:"bear-overflow-y-auto",role:"tree",children:k.length>0?k.map(r=>e.jsx(_,{node:r,depth:0,selected:b,expanded:D,multiple:i,onToggleExpand:H,onSelect:M},r.id)):e.jsx("div",{className:"bear-py-6 bear-text-center bear-text-sm bear-text-gray-400",children:"No results"})})]}),N&&e.jsx("p",{className:a.ERROR_CLASSES,children:N}),!N&&v&&e.jsx("p",{className:a.HELPER_CLASSES,children:v})]})};exports.TreeSelect=z;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("react"),x=require("../../utils/cn.cjs"),Z=require("../Portal/Portal.cjs"),s=require("./TreeSelect.const.cjs"),N=require("./TreeSelect.utils.cjs"),U=1e4,I=({node:a,depth:i,selected:d,expanded:n,multiple:o,onToggleExpand:f,onSelect:p})=>{const u=a.children&&a.children.length>0,E=n.has(a.id),h=d.has(a.id);return e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:x.cn(s.NODE_CLASSES,h&&s.NODE_SELECTED_CLASSES,a.disabled&&s.NODE_DISABLED_CLASSES),style:{paddingLeft:i*s.INDENT_PX+12},onClick:()=>!a.disabled&&p(a.id),role:"treeitem","aria-selected":h,"aria-expanded":u?E:void 0,children:[u?e.jsx("svg",{className:x.cn(s.CHEVRON_CLASSES,E&&"bear-rotate-90"),onClick:m=>{m.stopPropagation(),f(a.id)},fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M9 5l7 7-7 7"})}):e.jsx("span",{className:"bear-w-4 bear-mr-1"}),o&&e.jsx("span",{className:x.cn("bear-w-4 bear-h-4 bear-mr-2 bear-border bear-rounded bear-flex bear-items-center bear-justify-center bear-text-xs",h?"bear-bg-pink-500 bear-border-pink-500 bear-text-white":"bear-border-gray-300 dark:bear-border-zinc-600"),children:h&&"✓"}),a.icon&&e.jsx("span",{className:"bear-mr-1.5",children:a.icon}),e.jsx("span",{className:"bear-truncate",children:a.label})]}),u&&E&&a.children.map(m=>e.jsx(I,{node:m,depth:i+1,selected:d,expanded:n,multiple:o,onToggleExpand:f,onSelect:p},m.id))]})},J=a=>{const{nodes:i,value:d,onChange:n,multiple:o=!1,label:f,placeholder:p="Select…",disabled:u=!1,clearable:E=!0,searchable:h=!0,expandAll:m=!1,size:O="md",error:w,helperText:C,maxHeight:P=s.DEFAULT_MAX_HEIGHT,className:D,testId:M,...z}=a,[b,j]=l.useState(!1),[L,v]=l.useState(""),y=l.useRef(null),_=l.useRef(null),g=l.useRef(null),[A,B]=l.useState({top:0,left:0,width:0}),q=l.useMemo(()=>N.collectAllIds(i),[i]),[H,G]=l.useState(()=>m?q:new Set),S=l.useMemo(()=>d?new Set(Array.isArray(d)?d:[d]):new Set,[d]);l.useEffect(()=>{if(!b)return;const r=()=>{var c;const t=(c=_.current)==null?void 0:c.getBoundingClientRect();t&&B({top:t.bottom+4,left:Math.max(8,Math.min(t.left,window.innerWidth-t.width-8)),width:t.width})};return r(),window.addEventListener("resize",r),window.addEventListener("scroll",r,!0),()=>{window.removeEventListener("resize",r),window.removeEventListener("scroll",r,!0)}},[b]),l.useEffect(()=>{if(!b)return;const r=t=>{var k,T;const c=t.target;(k=y.current)!=null&&k.contains(c)||(T=g.current)!=null&&T.contains(c)||(j(!1),v(""))};return document.addEventListener("mousedown",r),()=>document.removeEventListener("mousedown",r)},[b]);const W=l.useCallback(r=>{G(t=>{const c=new Set(t);return c.has(r)?c.delete(r):c.add(r),c})},[]),F=l.useCallback(r=>{if(o){const t=new Set(S);t.has(r)?t.delete(r):t.add(r),n==null||n(Array.from(t))}else n==null||n(r),j(!1),v("")},[o,S,n]),V=l.useCallback(()=>{n==null||n(o?[]:"")},[o,n]),R=L?N.filterNodes(i,L):i,X=()=>{if(S.size===0)return e.jsx("span",{className:"bear-text-gray-400 dark:bear-text-zinc-500",children:p});if(o)return e.jsx("div",{className:"bear-flex bear-flex-wrap bear-gap-1",children:Array.from(S).map(t=>{const c=N.findNodeById(i,t);return c?e.jsx("span",{className:s.TAG_CLASSES,children:c.label},t):null})});const r=N.findNodeById(i,Array.from(S)[0]);return(r==null?void 0:r.label)??p};return e.jsxs("div",{ref:y,className:x.cn(s.ROOT_CLASSES,D),"data-testid":M,...z,children:[f&&e.jsx("label",{className:s.LABEL_CLASSES,children:f}),e.jsxs("button",{ref:_,type:"button",disabled:u,onClick:()=>!u&&j(!b),className:x.cn(s.TRIGGER_CLASSES,s.SIZE_CLASSES[O],u&&"bear-opacity-50 bear-cursor-not-allowed"),children:[e.jsx("span",{className:"bear-flex-1 bear-text-left bear-truncate",children:X()}),e.jsxs("div",{className:"bear-flex bear-items-center bear-gap-1",children:[E&&S.size>0&&e.jsx("span",{className:"bear-text-gray-400 hover:bear-text-gray-600 bear-cursor-pointer",onClick:r=>{r.stopPropagation(),V()},children:"✕"}),e.jsx("svg",{className:x.cn("bear-w-4 bear-h-4 bear-text-gray-400 bear-transition-transform",b&&"bear-rotate-180"),fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})})]})]}),b&&e.jsx(Z.Portal,{children:e.jsxs("div",{ref:g,className:x.cn(s.DROPDOWN_CLASSES,"bear-fixed"),style:{top:A.top,left:A.left,width:A.width,zIndex:U},children:[h&&e.jsx("input",{className:s.SEARCH_CLASSES,placeholder:"Search…",value:L,onChange:r=>v(r.target.value),autoFocus:!0}),e.jsx("div",{style:{maxHeight:P},className:"bear-overflow-y-auto",role:"tree",children:R.length>0?R.map(r=>e.jsx(I,{node:r,depth:0,selected:S,expanded:H,multiple:o,onToggleExpand:W,onSelect:F},r.id)):e.jsx("div",{className:"bear-py-6 bear-text-center bear-text-sm bear-text-gray-400",children:"No results"})})]})}),w&&e.jsx("p",{className:s.ERROR_CLASSES,children:w}),!w&&C&&e.jsx("p",{className:s.HELPER_CLASSES,children:C})]})};exports.TreeSelect=J;

package/dist/components/TreeSelect/TreeSelect.const.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=280,r=20,a={sm:"bear-py-1.5 bear-px-3 bear-text-sm",md:"bear-py-2 bear-px-4 bear-text-base",lg:"bear-py-2.5 bear-px-5 bear-text-lg"},b="Bear-TreeSelect bear-relative bear-inline-block bear-w-full",t="bear-w-full bear-flex bear-items-center bear-justify-between bear-rounded-lg bear-border bear-border-gray-300 dark:bear-border-zinc-600 bear-bg-white dark:bear-bg-zinc-800 bear-text-gray-900 dark:bear-text-white bear-transition-colors focus:bear-ring-2 focus:bear-ring-pink-500 bear-outline-none",S="bear-absolute bear-z-[9999] bear-w-full bear-mt-1 bear-bg-white dark:bear-bg-zinc-800 bear-border bear-border-gray-200 dark:bear-border-zinc-700 bear-rounded-xl bear-shadow-xl bear-overflow-hidden",n="bear-w-full bear-px-3 bear-py-2 bear-text-sm bear-bg-transparent bear-border-b bear-border-gray-200 dark:bear-border-zinc-700 bear-outline-none bear-text-gray-900 dark:bear-text-white",o="bear-flex bear-items-center bear-py-1.5 bear-px-3 bear-cursor-pointer bear-transition-colors hover:bear-bg-gray-50 dark:hover:bear-bg-zinc-700 bear-text-sm bear-text-gray-700 dark:bear-text-zinc-300",E="bear-bg-pink-50 dark:bear-bg-pink-900/20 bear-text-pink-700 dark:bear-text-pink-300",i="bear-opacity-40 bear-cursor-not-allowed",s="bear-w-4 bear-h-4 bear-mr-1 bear-text-gray-400 dark:bear-text-zinc-500 bear-transition-transform bear-cursor-pointer",c="bear-inline-flex bear-items-center bear-gap-1 bear-bg-pink-100 dark:bear-bg-pink-900/30 bear-text-pink-700 dark:bear-text-pink-300 bear-rounded bear-px-1.5 bear-py-0.5 bear-text-xs",d="Bear-TreeSelect__label bear-block bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-zinc-300 bear-mb-1.5",x="bear-mt-1 bear-text-xs bear-text-red-500",A="bear-mt-1 bear-text-xs bear-text-gray-500 dark:bear-text-zinc-500";exports.CHEVRON_CLASSES=s;exports.DEFAULT_MAX_HEIGHT=e;exports.DROPDOWN_CLASSES=S;exports.ERROR_CLASSES=x;exports.HELPER_CLASSES=A;exports.INDENT_PX=r;exports.LABEL_CLASSES=d;exports.NODE_CLASSES=o;exports.NODE_DISABLED_CLASSES=i;exports.NODE_SELECTED_CLASSES=E;exports.ROOT_CLASSES=b;exports.SEARCH_CLASSES=n;exports.SIZE_CLASSES=a;exports.TAG_CLASSES=c;exports.TRIGGER_CLASSES=t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=280,r=20,a={sm:"bear-py-1.5 bear-px-3 bear-text-sm",md:"bear-py-2 bear-px-4 bear-text-base",lg:"bear-py-2.5 bear-px-5 bear-text-lg"},b="Bear-TreeSelect bear-relative bear-inline-block bear-w-full",t="bear-w-full bear-flex bear-items-center bear-justify-between bear-rounded-lg bear-border bear-border-gray-300 dark:bear-border-zinc-600 bear-bg-white dark:bear-bg-zinc-800 bear-text-gray-900 dark:bear-text-white bear-transition-colors focus:bear-ring-2 focus:bear-ring-pink-500 bear-outline-none",S="bear-bg-white dark:bear-bg-zinc-800 bear-border bear-border-gray-200 dark:bear-border-zinc-700 bear-rounded-xl bear-shadow-xl bear-overflow-hidden",n="bear-w-full bear-px-3 bear-py-2 bear-text-sm bear-bg-transparent bear-border-b bear-border-gray-200 dark:bear-border-zinc-700 bear-outline-none bear-text-gray-900 dark:bear-text-white",E="bear-flex bear-items-center bear-py-1.5 bear-px-3 bear-cursor-pointer bear-transition-colors hover:bear-bg-gray-50 dark:hover:bear-bg-zinc-700 bear-text-sm bear-text-gray-700 dark:bear-text-zinc-300",o="bear-bg-pink-50 dark:bear-bg-pink-900/20 bear-text-pink-700 dark:bear-text-pink-300",i="bear-opacity-40 bear-cursor-not-allowed",s="bear-w-4 bear-h-4 bear-mr-1 bear-text-gray-400 dark:bear-text-zinc-500 bear-transition-transform bear-cursor-pointer",c="bear-inline-flex bear-items-center bear-gap-1 bear-bg-pink-100 dark:bear-bg-pink-900/30 bear-text-pink-700 dark:bear-text-pink-300 bear-rounded bear-px-1.5 bear-py-0.5 bear-text-xs",d="Bear-TreeSelect__label bear-block bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-zinc-300 bear-mb-1.5",x="bear-mt-1 bear-text-xs bear-text-red-500",A="bear-mt-1 bear-text-xs bear-text-gray-500 dark:bear-text-zinc-500";exports.CHEVRON_CLASSES=s;exports.DEFAULT_MAX_HEIGHT=e;exports.DROPDOWN_CLASSES=S;exports.ERROR_CLASSES=x;exports.HELPER_CLASSES=A;exports.INDENT_PX=r;exports.LABEL_CLASSES=d;exports.NODE_CLASSES=E;exports.NODE_DISABLED_CLASSES=i;exports.NODE_SELECTED_CLASSES=o;exports.ROOT_CLASSES=b;exports.SEARCH_CLASSES=n;exports.SIZE_CLASSES=a;exports.TAG_CLASSES=c;exports.TRIGGER_CLASSES=t;

package/dist/components/TreeSelect/TreeSelect.const.d.ts

@@ -7,7 +7,7 @@ export declare const SIZE_CLASSES: {
 };
 export declare const ROOT_CLASSES = "Bear-TreeSelect bear-relative bear-inline-block bear-w-full";
 export declare const TRIGGER_CLASSES = "bear-w-full bear-flex bear-items-center bear-justify-between bear-rounded-lg bear-border bear-border-gray-300 dark:bear-border-zinc-600 bear-bg-white dark:bear-bg-zinc-800 bear-text-gray-900 dark:bear-text-white bear-transition-colors focus:bear-ring-2 focus:bear-ring-pink-500 bear-outline-none";
-export declare const DROPDOWN_CLASSES = "bear-absolute bear-z-[9999] bear-w-full bear-mt-1 bear-bg-white dark:bear-bg-zinc-800 bear-border bear-border-gray-200 dark:bear-border-zinc-700 bear-rounded-xl bear-shadow-xl bear-overflow-hidden";
+export declare const DROPDOWN_CLASSES = "bear-bg-white dark:bear-bg-zinc-800 bear-border bear-border-gray-200 dark:bear-border-zinc-700 bear-rounded-xl bear-shadow-xl bear-overflow-hidden";
 export declare const SEARCH_CLASSES = "bear-w-full bear-px-3 bear-py-2 bear-text-sm bear-bg-transparent bear-border-b bear-border-gray-200 dark:bear-border-zinc-700 bear-outline-none bear-text-gray-900 dark:bear-text-white";
 export declare const NODE_CLASSES = "bear-flex bear-items-center bear-py-1.5 bear-px-3 bear-cursor-pointer bear-transition-colors hover:bear-bg-gray-50 dark:hover:bear-bg-zinc-700 bear-text-sm bear-text-gray-700 dark:bear-text-zinc-300";
 export declare const NODE_SELECTED_CLASSES = "bear-bg-pink-50 dark:bear-bg-pink-900/20 bear-text-pink-700 dark:bear-text-pink-300";

package/dist/components/TreeSelect/TreeSelect.const.js

@@ -2,13 +2,13 @@ const e = 280, r = 20, a = {
   sm: "bear-py-1.5 bear-px-3 bear-text-sm",
   md: "bear-py-2 bear-px-4 bear-text-base",
   lg: "bear-py-2.5 bear-px-5 bear-text-lg"
-}, b = "Bear-TreeSelect bear-relative bear-inline-block bear-w-full", t = "bear-w-full bear-flex bear-items-center bear-justify-between bear-rounded-lg bear-border bear-border-gray-300 dark:bear-border-zinc-600 bear-bg-white dark:bear-bg-zinc-800 bear-text-gray-900 dark:bear-text-white bear-transition-colors focus:bear-ring-2 focus:bear-ring-pink-500 bear-outline-none", n = "bear-absolute bear-z-[9999] bear-w-full bear-mt-1 bear-bg-white dark:bear-bg-zinc-800 bear-border bear-border-gray-200 dark:bear-border-zinc-700 bear-rounded-xl bear-shadow-xl bear-overflow-hidden", o = "bear-w-full bear-px-3 bear-py-2 bear-text-sm bear-bg-transparent bear-border-b bear-border-gray-200 dark:bear-border-zinc-700 bear-outline-none bear-text-gray-900 dark:bear-text-white", i = "bear-flex bear-items-center bear-py-1.5 bear-px-3 bear-cursor-pointer bear-transition-colors hover:bear-bg-gray-50 dark:hover:bear-bg-zinc-700 bear-text-sm bear-text-gray-700 dark:bear-text-zinc-300", S = "bear-bg-pink-50 dark:bear-bg-pink-900/20 bear-text-pink-700 dark:bear-text-pink-300", s = "bear-opacity-40 bear-cursor-not-allowed", x = "bear-w-4 bear-h-4 bear-mr-1 bear-text-gray-400 dark:bear-text-zinc-500 bear-transition-transform bear-cursor-pointer", c = "bear-inline-flex bear-items-center bear-gap-1 bear-bg-pink-100 dark:bear-bg-pink-900/30 bear-text-pink-700 dark:bear-text-pink-300 bear-rounded bear-px-1.5 bear-py-0.5 bear-text-xs", d = "Bear-TreeSelect__label bear-block bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-zinc-300 bear-mb-1.5", l = "bear-mt-1 bear-text-xs bear-text-red-500", E = "bear-mt-1 bear-text-xs bear-text-gray-500 dark:bear-text-zinc-500";
+}, b = "Bear-TreeSelect bear-relative bear-inline-block bear-w-full", t = "bear-w-full bear-flex bear-items-center bear-justify-between bear-rounded-lg bear-border bear-border-gray-300 dark:bear-border-zinc-600 bear-bg-white dark:bear-bg-zinc-800 bear-text-gray-900 dark:bear-text-white bear-transition-colors focus:bear-ring-2 focus:bear-ring-pink-500 bear-outline-none", n = "bear-bg-white dark:bear-bg-zinc-800 bear-border bear-border-gray-200 dark:bear-border-zinc-700 bear-rounded-xl bear-shadow-xl bear-overflow-hidden", o = "bear-w-full bear-px-3 bear-py-2 bear-text-sm bear-bg-transparent bear-border-b bear-border-gray-200 dark:bear-border-zinc-700 bear-outline-none bear-text-gray-900 dark:bear-text-white", i = "bear-flex bear-items-center bear-py-1.5 bear-px-3 bear-cursor-pointer bear-transition-colors hover:bear-bg-gray-50 dark:hover:bear-bg-zinc-700 bear-text-sm bear-text-gray-700 dark:bear-text-zinc-300", S = "bear-bg-pink-50 dark:bear-bg-pink-900/20 bear-text-pink-700 dark:bear-text-pink-300", s = "bear-opacity-40 bear-cursor-not-allowed", x = "bear-w-4 bear-h-4 bear-mr-1 bear-text-gray-400 dark:bear-text-zinc-500 bear-transition-transform bear-cursor-pointer", c = "bear-inline-flex bear-items-center bear-gap-1 bear-bg-pink-100 dark:bear-bg-pink-900/30 bear-text-pink-700 dark:bear-text-pink-300 bear-rounded bear-px-1.5 bear-py-0.5 bear-text-xs", d = "Bear-TreeSelect__label bear-block bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-zinc-300 bear-mb-1.5", E = "bear-mt-1 bear-text-xs bear-text-red-500", l = "bear-mt-1 bear-text-xs bear-text-gray-500 dark:bear-text-zinc-500";
 export {
   x as CHEVRON_CLASSES,
   e as DEFAULT_MAX_HEIGHT,
   n as DROPDOWN_CLASSES,
-  l as ERROR_CLASSES,
-  E as HELPER_CLASSES,
+  E as ERROR_CLASSES,
+  l as HELPER_CLASSES,
   r as INDENT_PX,
   d as LABEL_CLASSES,
   i as NODE_CLASSES,

package/dist/components/TreeSelect/TreeSelect.js

@@ -1,27 +1,28 @@
-import { jsxs as S, jsx as r, Fragment as W } from "react/jsx-runtime";
-import { useState as v, useRef as V, useMemo as w, useEffect as X, useCallback as y } from "react";
-import { cn as p } from "../../utils/cn.js";
-import { DEFAULT_MAX_HEIGHT as U, LABEL_CLASSES as Z, SIZE_CLASSES as q, TRIGGER_CLASSES as J, DROPDOWN_CLASSES as K, SEARCH_CLASSES as Q, ERROR_CLASSES as Y, HELPER_CLASSES as $, ROOT_CLASSES as ee, TAG_CLASSES as re, CHEVRON_CLASSES as ae, INDENT_PX as te, NODE_DISABLED_CLASSES as se, NODE_SELECTED_CLASSES as le, NODE_CLASSES as ne } from "./TreeSelect.const.js";
-import { collectAllIds as ce, filterNodes as oe, findNodeById as g } from "./TreeSelect.utils.js";
-const R = ({ node: a, depth: l, selected: c, expanded: t, multiple: n, onToggleExpand: u, onSelect: h }) => {
-  const o = a.children && a.children.length > 0, f = t.has(a.id), b = c.has(a.id);
-  return /* @__PURE__ */ S(W, { children: [
-    /* @__PURE__ */ S(
+import { jsxs as p, jsx as r, Fragment as Q } from "react/jsx-runtime";
+import { useState as N, useRef as C, useMemo as D, useEffect as P, useCallback as y } from "react";
+import { cn as m } from "../../utils/cn.js";
+import { Portal as Y } from "../Portal/Portal.js";
+import { DEFAULT_MAX_HEIGHT as $, LABEL_CLASSES as ee, SIZE_CLASSES as re, TRIGGER_CLASSES as te, SEARCH_CLASSES as ae, DROPDOWN_CLASSES as se, ERROR_CLASSES as ne, HELPER_CLASSES as le, ROOT_CLASSES as ie, TAG_CLASSES as oe, CHEVRON_CLASSES as ce, INDENT_PX as de, NODE_DISABLED_CLASSES as be, NODE_SELECTED_CLASSES as me, NODE_CLASSES as ue } from "./TreeSelect.const.js";
+import { collectAllIds as he, filterNodes as pe, findNodeById as z } from "./TreeSelect.utils.js";
+const Se = 1e4, M = ({ node: a, depth: l, selected: o, expanded: s, multiple: i, onToggleExpand: S, onSelect: f }) => {
+  const c = a.children && a.children.length > 0, E = s.has(a.id), u = o.has(a.id);
+  return /* @__PURE__ */ p(Q, { children: [
+    /* @__PURE__ */ p(
       "div",
       {
-        className: p(ne, b && le, a.disabled && se),
-        style: { paddingLeft: l * te + 12 },
-        onClick: () => !a.disabled && h(a.id),
+        className: m(ue, u && me, a.disabled && be),
+        style: { paddingLeft: l * de + 12 },
+        onClick: () => !a.disabled && f(a.id),
         role: "treeitem",
-        "aria-selected": b,
-        "aria-expanded": o ? f : void 0,
+        "aria-selected": u,
+        "aria-expanded": c ? E : void 0,
         children: [
-          o ? /* @__PURE__ */ r(
+          c ? /* @__PURE__ */ r(
             "svg",
             {
-              className: p(ae, f && "bear-rotate-90"),
-              onClick: (m) => {
-                m.stopPropagation(), u(a.id);
+              className: m(ce, E && "bear-rotate-90"),
+              onClick: (h) => {
+                h.stopPropagation(), S(a.id);
               },
               fill: "none",
               viewBox: "0 0 24 24",
@@ -29,100 +30,131 @@ const R = ({ node: a, depth: l, selected: c, expanded: t, multiple: n, onToggleE
               children: /* @__PURE__ */ r("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M9 5l7 7-7 7" })
             }
           ) : /* @__PURE__ */ r("span", { className: "bear-w-4 bear-mr-1" }),
-          n && /* @__PURE__ */ r("span", { className: p("bear-w-4 bear-h-4 bear-mr-2 bear-border bear-rounded bear-flex bear-items-center bear-justify-center bear-text-xs", b ? "bear-bg-pink-500 bear-border-pink-500 bear-text-white" : "bear-border-gray-300 dark:bear-border-zinc-600"), children: b && "✓" }),
+          i && /* @__PURE__ */ r("span", { className: m("bear-w-4 bear-h-4 bear-mr-2 bear-border bear-rounded bear-flex bear-items-center bear-justify-center bear-text-xs", u ? "bear-bg-pink-500 bear-border-pink-500 bear-text-white" : "bear-border-gray-300 dark:bear-border-zinc-600"), children: u && "✓" }),
           a.icon && /* @__PURE__ */ r("span", { className: "bear-mr-1.5", children: a.icon }),
           /* @__PURE__ */ r("span", { className: "bear-truncate", children: a.label })
         ]
       }
     ),
-    o && f && a.children.map((m) => /* @__PURE__ */ r(R, { node: m, depth: l + 1, selected: c, expanded: t, multiple: n, onToggleExpand: u, onSelect: h }, m.id))
+    c && E && a.children.map((h) => /* @__PURE__ */ r(M, { node: h, depth: l + 1, selected: o, expanded: s, multiple: i, onToggleExpand: S, onSelect: f }, h.id))
   ] });
-}, pe = (a) => {
+}, Ae = (a) => {
   const {
     nodes: l,
-    value: c,
-    onChange: t,
-    multiple: n = !1,
-    label: u,
-    placeholder: h = "Select…",
-    disabled: o = !1,
-    clearable: f = !0,
-    searchable: b = !0,
-    expandAll: m = !1,
-    size: O = "md",
-    error: E,
-    helperText: k,
-    maxHeight: D = U,
-    className: I,
-    testId: T,
-    ...H
-  } = a, [N, x] = v(!1), [A, L] = v(""), C = V(null), j = w(() => ce(l), [l]), [z, B] = v(() => m ? j : /* @__PURE__ */ new Set()), i = w(() => c ? new Set(Array.isArray(c) ? c : [c]) : /* @__PURE__ */ new Set(), [c]);
-  X(() => {
-    const e = (s) => {
-      C.current && !C.current.contains(s.target) && (x(!1), L(""));
+    value: o,
+    onChange: s,
+    multiple: i = !1,
+    label: S,
+    placeholder: f = "Select…",
+    disabled: c = !1,
+    clearable: E = !0,
+    searchable: u = !0,
+    expandAll: h = !1,
+    size: B = "md",
+    error: w,
+    helperText: _,
+    maxHeight: H = $,
+    className: j,
+    testId: G,
+    ...W
+  } = a, [d, x] = N(!1), [L, A] = N(""), g = C(null), k = C(null), R = C(null), [v, F] = N({ top: 0, left: 0, width: 0 }), V = D(() => he(l), [l]), [X, Z] = N(() => h ? V : /* @__PURE__ */ new Set()), b = D(() => o ? new Set(Array.isArray(o) ? o : [o]) : /* @__PURE__ */ new Set(), [o]);
+  P(() => {
+    if (!d) return;
+    const e = () => {
+      var n;
+      const t = (n = k.current) == null ? void 0 : n.getBoundingClientRect();
+      t && F({
+        top: t.bottom + 4,
+        left: Math.max(8, Math.min(t.left, window.innerWidth - t.width - 8)),
+        width: t.width
+      });
+    };
+    return e(), window.addEventListener("resize", e), window.addEventListener("scroll", e, !0), () => {
+      window.removeEventListener("resize", e), window.removeEventListener("scroll", e, !0);
+    };
+  }, [d]), P(() => {
+    if (!d) return;
+    const e = (t) => {
+      var I, O;
+      const n = t.target;
+      (I = g.current) != null && I.contains(n) || (O = R.current) != null && O.contains(n) || (x(!1), A(""));
     };
     return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
-  }, []);
-  const P = y((e) => {
-    B((s) => {
-      const d = new Set(s);
-      return d.has(e) ? d.delete(e) : d.add(e), d;
+  }, [d]);
+  const U = y((e) => {
+    Z((t) => {
+      const n = new Set(t);
+      return n.has(e) ? n.delete(e) : n.add(e), n;
     });
-  }, []), G = y((e) => {
-    if (n) {
-      const s = new Set(i);
-      s.has(e) ? s.delete(e) : s.add(e), t == null || t(Array.from(s));
+  }, []), q = y((e) => {
+    if (i) {
+      const t = new Set(b);
+      t.has(e) ? t.delete(e) : t.add(e), s == null || s(Array.from(t));
     } else
-      t == null || t(e), x(!1), L("");
-  }, [n, i, t]), M = y(() => {
-    t == null || t(n ? [] : "");
-  }, [n, t]), _ = A ? oe(l, A) : l, F = () => {
-    if (i.size === 0) return /* @__PURE__ */ r("span", { className: "bear-text-gray-400 dark:bear-text-zinc-500", children: h });
-    if (n)
-      return /* @__PURE__ */ r("div", { className: "bear-flex bear-flex-wrap bear-gap-1", children: Array.from(i).map((s) => {
-        const d = g(l, s);
-        return d ? /* @__PURE__ */ r("span", { className: re, children: d.label }, s) : null;
+      s == null || s(e), x(!1), A("");
+  }, [i, b, s]), J = y(() => {
+    s == null || s(i ? [] : "");
+  }, [i, s]), T = L ? pe(l, L) : l, K = () => {
+    if (b.size === 0) return /* @__PURE__ */ r("span", { className: "bear-text-gray-400 dark:bear-text-zinc-500", children: f });
+    if (i)
+      return /* @__PURE__ */ r("div", { className: "bear-flex bear-flex-wrap bear-gap-1", children: Array.from(b).map((t) => {
+        const n = z(l, t);
+        return n ? /* @__PURE__ */ r("span", { className: oe, children: n.label }, t) : null;
       }) });
-    const e = g(l, Array.from(i)[0]);
-    return (e == null ? void 0 : e.label) ?? h;
+    const e = z(l, Array.from(b)[0]);
+    return (e == null ? void 0 : e.label) ?? f;
   };
-  return /* @__PURE__ */ S("div", { ref: C, className: p(ee, I), "data-testid": T, ...H, children: [
-    u && /* @__PURE__ */ r("label", { className: Z, children: u }),
-    /* @__PURE__ */ S(
+  return /* @__PURE__ */ p("div", { ref: g, className: m(ie, j), "data-testid": G, ...W, children: [
+    S && /* @__PURE__ */ r("label", { className: ee, children: S }),
+    /* @__PURE__ */ p(
       "button",
       {
+        ref: k,
         type: "button",
-        disabled: o,
-        onClick: () => !o && x(!N),
-        className: p(J, q[O], o && "bear-opacity-50 bear-cursor-not-allowed"),
+        disabled: c,
+        onClick: () => !c && x(!d),
+        className: m(te, re[B], c && "bear-opacity-50 bear-cursor-not-allowed"),
         children: [
-          /* @__PURE__ */ r("span", { className: "bear-flex-1 bear-text-left bear-truncate", children: F() }),
-          /* @__PURE__ */ S("div", { className: "bear-flex bear-items-center bear-gap-1", children: [
-            f && i.size > 0 && /* @__PURE__ */ r("span", { className: "bear-text-gray-400 hover:bear-text-gray-600 bear-cursor-pointer", onClick: (e) => {
-              e.stopPropagation(), M();
+          /* @__PURE__ */ r("span", { className: "bear-flex-1 bear-text-left bear-truncate", children: K() }),
+          /* @__PURE__ */ p("div", { className: "bear-flex bear-items-center bear-gap-1", children: [
+            E && b.size > 0 && /* @__PURE__ */ r("span", { className: "bear-text-gray-400 hover:bear-text-gray-600 bear-cursor-pointer", onClick: (e) => {
+              e.stopPropagation(), J();
             }, children: "✕" }),
-            /* @__PURE__ */ r("svg", { className: p("bear-w-4 bear-h-4 bear-text-gray-400 bear-transition-transform", N && "bear-rotate-180"), fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ r("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }) })
+            /* @__PURE__ */ r("svg", { className: m("bear-w-4 bear-h-4 bear-text-gray-400 bear-transition-transform", d && "bear-rotate-180"), fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ r("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }) })
           ] })
         ]
       }
     ),
-    N && /* @__PURE__ */ S("div", { className: K, children: [
-      b && /* @__PURE__ */ r(
-        "input",
-        {
-          className: Q,
-          placeholder: "Search…",
-          value: A,
-          onChange: (e) => L(e.target.value),
-          autoFocus: !0
-        }
-      ),
-      /* @__PURE__ */ r("div", { style: { maxHeight: D }, className: "bear-overflow-y-auto", role: "tree", children: _.length > 0 ? _.map((e) => /* @__PURE__ */ r(R, { node: e, depth: 0, selected: i, expanded: z, multiple: n, onToggleExpand: P, onSelect: G }, e.id)) : /* @__PURE__ */ r("div", { className: "bear-py-6 bear-text-center bear-text-sm bear-text-gray-400", children: "No results" }) })
-    ] }),
-    E && /* @__PURE__ */ r("p", { className: Y, children: E }),
-    !E && k && /* @__PURE__ */ r("p", { className: $, children: k })
+    d && /* @__PURE__ */ r(Y, { children: /* @__PURE__ */ p(
+      "div",
+      {
+        ref: R,
+        className: m(se, "bear-fixed"),
+        style: {
+          top: v.top,
+          left: v.left,
+          width: v.width,
+          zIndex: Se
+        },
+        children: [
+          u && /* @__PURE__ */ r(
+            "input",
+            {
+              className: ae,
+              placeholder: "Search…",
+              value: L,
+              onChange: (e) => A(e.target.value),
+              autoFocus: !0
+            }
+          ),
+          /* @__PURE__ */ r("div", { style: { maxHeight: H }, className: "bear-overflow-y-auto", role: "tree", children: T.length > 0 ? T.map((e) => /* @__PURE__ */ r(M, { node: e, depth: 0, selected: b, expanded: X, multiple: i, onToggleExpand: U, onSelect: q }, e.id)) : /* @__PURE__ */ r("div", { className: "bear-py-6 bear-text-center bear-text-sm bear-text-gray-400", children: "No results" }) })
+        ]
+      }
+    ) }),
+    w && /* @__PURE__ */ r("p", { className: ne, children: w }),
+    !w && _ && /* @__PURE__ */ r("p", { className: le, children: _ })
   ] });
 };
 export {
-  pe as TreeSelect
+  Ae as TreeSelect
 };

package/dist/components/Watermark/Watermark.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("react/jsx-runtime"),a=require("react"),y=require("../../utils/cn.cjs"),t=require("./Watermark.const.cjs"),M=O=>{const{children:x,text:c,image:l,fontSize:u=t.DEFAULT_FONT_SIZE,color:d,rotate:E=t.DEFAULT_ROTATE,opacity:m=t.DEFAULT_OPACITY,gap:f=t.DEFAULT_GAP,offset:h=t.DEFAULT_OFFSET,zIndex:R=t.DEFAULT_Z_INDEX,fontFamily:A,fontWeight:L=t.DEFAULT_FONT_WEIGHT,visible:g=!0,className:H,style:U,testId:w}=O,i=a.useRef(null),T=a.useRef(null),[_,C]=a.useState(!1);a.useEffect(()=>{const r=window.matchMedia("(prefers-color-scheme: dark)"),e=()=>{const s=document.documentElement.classList.contains("dark");C(s||r.matches)};e();const n=new MutationObserver(e);return n.observe(document.documentElement,{attributes:!0,attributeFilter:["class"]}),r.addEventListener("change",e),()=>{n.disconnect(),r.removeEventListener("change",e)}},[]);const F=a.useMemo(()=>{if(A)return A;if(typeof window<"u"){const r=getComputedStyle(document.documentElement).getPropertyValue("--bear-font-family");if(r.trim())return r.trim()}return t.DEFAULT_FONT_FAMILY},[A]),b=a.useMemo(()=>d||(_?t.DEFAULT_COLOR_DARK:t.DEFAULT_COLOR_LIGHT),[d,_]),v=a.useCallback(()=>{if(!g||!c&&!l)return"";const r=document.createElement("canvas"),e=r.getContext("2d");if(!e)return"";const n=Array.isArray(c)?c:c?[c]:[],s=u*t.LINE_HEIGHT_MULTIPLIER,N=n.length*s,I=f[0]+t.CANVAS_WIDTH_OFFSET,k=f[1]+N+t.CANVAS_EXTRA_PADDING;if(r.width=I,r.height=k,e.translate(I/t.HALF,k/t.HALF),e.rotate(E*t.DEG_TO_RAD),l){const o=new Image;o.crossOrigin="anonymous",o.src=l,e.globalAlpha=m,e.drawImage(o,-o.width/t.HALF,-o.height/t.HALF)}else e.font=`${L} ${u}px ${F}`,e.fillStyle=b,e.globalAlpha=m,e.textAlign="center",e.textBaseline="middle",n.forEach((o,S)=>{const W=(S-(n.length-1)/t.HALF)*s;e.fillText(o,0,W)});return r.toDataURL()},[c,l,u,b,E,m,f,F,L,g]),D=a.useMemo(()=>v(),[v]);return a.useEffect(()=>{const r=T.current;if(!r)return;const e=new MutationObserver(()=>{var n,s;(n=i.current)!=null&&n.contains(r)||(s=i.current)==null||s.appendChild(r)});return i.current&&e.observe(i.current,{childList:!0}),()=>e.disconnect()},[]),p.jsxs("div",{ref:i,className:y.cn("Bear-Watermark","bear-relative",H),style:U,"data-testid":w,children:[x,g&&D&&p.jsx("div",{ref:T,className:y.cn("Bear-Watermark__overlay","bear-absolute bear-inset-0 bear-pointer-events-none bear-bg-repeat"),style:{backgroundImage:`url(${D})`,backgroundPosition:`${h[0]}px ${h[1]}px`,zIndex:R},"aria-hidden":"true"})]})};exports.Watermark=M;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const P=require("react/jsx-runtime"),s=require("react"),z=require("../../context/BearProvider.cjs"),C=require("../../utils/cn.cjs"),t=require("./Watermark.const.cjs"),Y=w=>{const{children:S,text:c,image:d,fontSize:E=t.DEFAULT_FONT_SIZE,color:T,rotate:g=t.DEFAULT_ROTATE,opacity:_=t.DEFAULT_OPACITY,patternRepeat:v=t.PATTERN_REPEAT_MIN,gap:F=t.DEFAULT_GAP,offset:D=t.DEFAULT_OFFSET,zIndex:U=t.DEFAULT_Z_INDEX,fontFamily:L,fontWeight:k=t.DEFAULT_FONT_WEIGHT,visible:b=!0,className:W,style:G,testId:q}=w,i=s.useRef(null),R=s.useRef(null),m=s.useContext(z.BearContext),[$,B]=s.useState(!1);s.useEffect(()=>{if(m)return;const r=window.matchMedia("(prefers-color-scheme: dark)"),e=()=>{const o=document.documentElement,h=o.classList.contains("dark")||o.classList.contains("bear-dark")||r.matches;B(h)};e();const n=new MutationObserver(e);return n.observe(document.documentElement,{attributes:!0,attributeFilter:["class"]}),r.addEventListener("change",e),()=>{n.disconnect(),r.removeEventListener("change",e)}},[m]);const I=m?m.mode==="dark":$,p=s.useMemo(()=>{if(L)return L;if(typeof window<"u"){const r=document.documentElement,e=getComputedStyle(r).getPropertyValue("--bear-font-sans");if(e.trim())return e.trim();const n=getComputedStyle(r).getPropertyValue("--bear-font-family");if(n.trim())return n.trim()}return t.DEFAULT_FONT_FAMILY},[L]),y=s.useMemo(()=>T||(I?t.DEFAULT_COLOR_DARK:t.DEFAULT_COLOR_LIGHT),[T,I]),x=s.useCallback(()=>{if(!b||!c&&!d)return"";const r=document.createElement("canvas"),e=r.getContext("2d");if(!e)return"";const n=Array.isArray(c)?c:c?[c]:[],o=E*t.LINE_HEIGHT_MULTIPLIER,h=n.length*o,A=F[0]+t.CANVAS_WIDTH_OFFSET,f=F[1]+h+t.CANVAS_EXTRA_PADDING;r.width=A,r.height=f;const l=Math.min(t.PATTERN_REPEAT_MAX,Math.max(t.PATTERN_REPEAT_MIN,Math.floor(v))),O=A/l,N=f/l,M=(a,u)=>{e.save(),e.translate(a,u),e.rotate(g*t.DEG_TO_RAD),e.font=`${k} ${E}px ${p}`,e.fillStyle=y,e.globalAlpha=_,e.textAlign="center",e.textBaseline="middle",n.forEach((j,V)=>{const X=(V-(n.length-1)/t.HALF)*o;e.fillText(j,0,X)}),e.restore()};if(d){e.save(),e.translate(A/t.HALF,f/t.HALF),e.rotate(g*t.DEG_TO_RAD);const a=new Image;a.crossOrigin="anonymous",a.src=d,e.globalAlpha=_,e.drawImage(a,-a.width/t.HALF,-a.height/t.HALF),e.restore()}else if(l<=1)M(A/t.HALF,f/t.HALF);else for(let a=0;a<l;a++)for(let u=0;u<l;u++)M(u*O+O/t.HALF,a*N+N/t.HALF);return r.toDataURL()},[c,d,E,y,g,_,F,p,k,b,v]),H=s.useMemo(()=>x(),[x]);return s.useEffect(()=>{const r=R.current;if(!r)return;const e=new MutationObserver(()=>{var n,o;(n=i.current)!=null&&n.contains(r)||(o=i.current)==null||o.appendChild(r)});return i.current&&e.observe(i.current,{childList:!0}),()=>e.disconnect()},[]),P.jsxs("div",{ref:i,className:C.cn("Bear-Watermark","bear-relative",W),style:G,"data-testid":q,children:[S,b&&H&&P.jsx("div",{ref:R,className:C.cn("Bear-Watermark__overlay","bear-absolute bear-inset-0 bear-pointer-events-none bear-bg-repeat"),style:{backgroundImage:`url(${H})`,backgroundPosition:`${D[0]}px ${D[1]}px`,zIndex:U},"aria-hidden":"true"})]})};exports.Watermark=Y;

package/dist/components/Watermark/Watermark.const.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=16,_=-22,A=.15,E=[100,100],F=[0,0],L=9,D=400,I="rgba(0, 0, 0, 0.15)",O="rgba(255, 255, 255, 0.12)",s="system-ui, -apple-system, sans-serif",t=1.5,U=40,o=200,n=2,c=Math.PI/180;exports.CANVAS_EXTRA_PADDING=U;exports.CANVAS_WIDTH_OFFSET=o;exports.DEFAULT_COLOR_DARK=O;exports.DEFAULT_COLOR_LIGHT=I;exports.DEFAULT_FONT_FAMILY=s;exports.DEFAULT_FONT_SIZE=T;exports.DEFAULT_FONT_WEIGHT=D;exports.DEFAULT_GAP=E;exports.DEFAULT_OFFSET=F;exports.DEFAULT_OPACITY=A;exports.DEFAULT_ROTATE=_;exports.DEFAULT_Z_INDEX=L;exports.DEG_TO_RAD=c;exports.HALF=n;exports.LINE_HEIGHT_MULTIPLIER=t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const T=16,A=-22,_=.22,E=[100,100],F=[0,0],L=9,D=400,I="rgba(0, 0, 0, 0.28)",s="rgba(255, 255, 255, 0.22)",t="system-ui, -apple-system, sans-serif",O=1.5,N=40,R=200,U=2,o=Math.PI/180,n=1,c=4;exports.CANVAS_EXTRA_PADDING=N;exports.CANVAS_WIDTH_OFFSET=R;exports.DEFAULT_COLOR_DARK=s;exports.DEFAULT_COLOR_LIGHT=I;exports.DEFAULT_FONT_FAMILY=t;exports.DEFAULT_FONT_SIZE=T;exports.DEFAULT_FONT_WEIGHT=D;exports.DEFAULT_GAP=E;exports.DEFAULT_OFFSET=F;exports.DEFAULT_OPACITY=_;exports.DEFAULT_ROTATE=A;exports.DEFAULT_Z_INDEX=L;exports.DEG_TO_RAD=o;exports.HALF=U;exports.LINE_HEIGHT_MULTIPLIER=O;exports.PATTERN_REPEAT_MAX=c;exports.PATTERN_REPEAT_MIN=n;

package/dist/components/Watermark/Watermark.const.d.ts

@@ -3,7 +3,7 @@ export declare const DEFAULT_FONT_SIZE = 16;
 /** Default rotation in degrees */
 export declare const DEFAULT_ROTATE = -22;
 /** Default opacity */
-export declare const DEFAULT_OPACITY = 0.15;
+export declare const DEFAULT_OPACITY = 0.22;
 /** Default gap [horizontal, vertical] in pixels */
 export declare const DEFAULT_GAP: [number, number];
 /** Default offset [x, y] in pixels */
@@ -13,9 +13,9 @@ export declare const DEFAULT_Z_INDEX = 9;
 /** Default font weight */
 export declare const DEFAULT_FONT_WEIGHT = 400;
 /** Default light mode color */
-export declare const DEFAULT_COLOR_LIGHT = "rgba(0, 0, 0, 0.15)";
+export declare const DEFAULT_COLOR_LIGHT = "rgba(0, 0, 0, 0.28)";
 /** Default dark mode color */
-export declare const DEFAULT_COLOR_DARK = "rgba(255, 255, 255, 0.12)";
+export declare const DEFAULT_COLOR_DARK = "rgba(255, 255, 255, 0.22)";
 /** Default font family */
 export declare const DEFAULT_FONT_FAMILY = "system-ui, -apple-system, sans-serif";
 /** Line height multiplier */
@@ -28,3 +28,6 @@ export declare const CANVAS_WIDTH_OFFSET = 200;
 export declare const HALF = 2;
 /** Degrees to radians conversion */
 export declare const DEG_TO_RAD: number;
+/** Min / max pattern repeat per axis */
+export declare const PATTERN_REPEAT_MIN = 1;
+export declare const PATTERN_REPEAT_MAX = 4;

package/dist/components/Watermark/Watermark.const.js

@@ -1,18 +1,20 @@
-const T = 16, _ = -22, A = 0.15, s = [100, 100], E = [0, 0], t = 9, F = 400, L = "rgba(0, 0, 0, 0.15)", D = "rgba(255, 255, 255, 0.12)", n = "system-ui, -apple-system, sans-serif", o = 1.5, c = 40, I = 200, O = 2, U = Math.PI / 180;
+const T = 16, A = -22, _ = 0.22, E = [100, 100], s = [0, 0], t = 9, F = 400, n = "rgba(0, 0, 0, 0.28)", o = "rgba(255, 255, 255, 0.22)", L = "system-ui, -apple-system, sans-serif", c = 1.5, D = 40, I = 200, O = 2, N = Math.PI / 180, R = 1, U = 4;
 export {
-  c as CANVAS_EXTRA_PADDING,
+  D as CANVAS_EXTRA_PADDING,
   I as CANVAS_WIDTH_OFFSET,
-  D as DEFAULT_COLOR_DARK,
-  L as DEFAULT_COLOR_LIGHT,
-  n as DEFAULT_FONT_FAMILY,
+  o as DEFAULT_COLOR_DARK,
+  n as DEFAULT_COLOR_LIGHT,
+  L as DEFAULT_FONT_FAMILY,
   T as DEFAULT_FONT_SIZE,
   F as DEFAULT_FONT_WEIGHT,
-  s as DEFAULT_GAP,
-  E as DEFAULT_OFFSET,
-  A as DEFAULT_OPACITY,
-  _ as DEFAULT_ROTATE,
+  E as DEFAULT_GAP,
+  s as DEFAULT_OFFSET,
+  _ as DEFAULT_OPACITY,
+  A as DEFAULT_ROTATE,
   t as DEFAULT_Z_INDEX,
-  U as DEG_TO_RAD,
+  N as DEG_TO_RAD,
   O as HALF,
-  o as LINE_HEIGHT_MULTIPLIER
+  c as LINE_HEIGHT_MULTIPLIER,
+  U as PATTERN_REPEAT_MAX,
+  R as PATTERN_REPEAT_MIN
 };