@forgedevstack/bear 1.2.0 → 1.2.2

package/dist/components/Toast/Toast.js

@@ -1,159 +1,163 @@
-import { jsx as e, jsxs as c } from "react/jsx-runtime";
-import { createContext as I, useContext as y, useState as T, useCallback as i, useEffect as N } from "react";
-import { cn as k } from "../../utils/cn.js";
-import { generateId as E } from "./Toast.utils.js";
-const S = {
-  success: /* @__PURE__ */ c("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
+import { jsx as e, jsxs as l } from "react/jsx-runtime";
+import { createContext as N, useContext as T, useState as k, useCallback as n, useRef as E, useEffect as y } from "react";
+import { cn as I } from "../../utils/cn.js";
+import { generateId as S } from "./Toast.utils.js";
+const _ = {
+  success: /* @__PURE__ */ l("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
     /* @__PURE__ */ e("path", { d: "M22 11.08V12a10 10 0 1 1-5.93-9.14" }),
     /* @__PURE__ */ e("polyline", { points: "22 4 12 14.01 9 11.01" })
   ] }),
-  info: /* @__PURE__ */ c("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
+  info: /* @__PURE__ */ l("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
     /* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "10" }),
     /* @__PURE__ */ e("line", { x1: "12", y1: "16", x2: "12", y2: "12" }),
     /* @__PURE__ */ e("line", { x1: "12", y1: "8", x2: "12.01", y2: "8" })
   ] }),
-  warning: /* @__PURE__ */ c("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
+  warning: /* @__PURE__ */ l("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
     /* @__PURE__ */ e("path", { d: "M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z" }),
     /* @__PURE__ */ e("line", { x1: "12", y1: "9", x2: "12", y2: "13" }),
     /* @__PURE__ */ e("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })
   ] }),
-  error: /* @__PURE__ */ c("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
+  error: /* @__PURE__ */ l("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
     /* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "10" }),
     /* @__PURE__ */ e("line", { x1: "15", y1: "9", x2: "9", y2: "15" }),
     /* @__PURE__ */ e("line", { x1: "9", y1: "9", x2: "15", y2: "15" })
   ] })
-}, _ = () => /* @__PURE__ */ c("svg", { width: 16, height: 16, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
+}, B = () => /* @__PURE__ */ l("svg", { width: 16, height: 16, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
   /* @__PURE__ */ e("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
   /* @__PURE__ */ e("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
-] }), B = {
+] }), W = {
   success: "bear-bg-green-500 bear-text-white",
   info: "bear-bg-blue-500 bear-text-white",
   warning: "bear-bg-amber-500 bear-text-white",
   error: "bear-bg-red-500 bear-text-white"
-}, W = {
+}, C = {
   "top-left": "bear-top-4 bear-left-4",
   "top-center": "bear-top-4 bear-left-1/2 bear-transform bear--translate-x-1/2",
   "top-right": "bear-top-4 bear-right-4",
   "bottom-left": "bear-bottom-4 bear-left-4",
   "bottom-center": "bear-bottom-4 bear-left-1/2 bear-transform bear--translate-x-1/2",
   "bottom-right": "bear-bottom-4 bear-right-4"
-}, w = I(null), z = () => {
-  const n = y(w);
-  if (!n)
+}, w = N(null), M = () => {
+  const i = T(w);
+  if (!i)
     throw new Error("useToast must be used within a ToastProvider");
-  return n;
-}, C = ({
-  message: n,
+  return i;
+}, L = ({
+  message: i,
   title: b,
-  severity: d = "info",
+  severity: h = "info",
   duration: o = 5e3,
-  closable: l = !0,
+  closable: c = !0,
   icon: t,
-  action: h,
-  onClose: a,
+  action: d,
+  onClose: s,
   onRemove: x,
-  className: f
+  className: p,
+  autoScroll: m = !1
 }) => {
-  const [g, m] = T(!1);
-  N(() => {
+  const [v, g] = k(!1), u = E(null);
+  y(() => {
+    m && u.current && u.current.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "nearest" });
+  }, [m]), y(() => {
     if (o > 0) {
-      const r = setTimeout(() => {
-        m(!0), setTimeout(() => {
-          x(), a == null || a();
+      const f = setTimeout(() => {
+        g(!0), setTimeout(() => {
+          x(), s == null || s();
         }, 200);
       }, o);
-      return () => clearTimeout(r);
+      return () => clearTimeout(f);
     }
-  }, [o, x, a]);
-  const p = () => {
-    m(!0), setTimeout(() => {
-      x(), a == null || a();
+  }, [o, x, s]);
+  const r = () => {
+    g(!0), setTimeout(() => {
+      x(), s == null || s();
     }, 200);
-  }, u = () => t === !1 ? null : t || S[d];
-  return /* @__PURE__ */ c(
+  }, a = () => t === !1 ? null : t || _[h];
+  return /* @__PURE__ */ l(
     "div",
     {
+      ref: u,
       role: "alert",
-      className: k(
+      className: I(
         "bear-flex bear-items-start bear-gap-3 bear-p-4 bear-rounded-lg bear-shadow-lg bear-min-w-[300px] bear-max-w-[400px]",
         "bear-transition-all bear-duration-200",
-        g ? "bear-opacity-0 bear-translate-x-2" : "bear-opacity-100 bear-translate-x-0",
-        B[d],
-        f
+        v ? "bear-opacity-0 bear-translate-x-2" : "bear-opacity-100 bear-translate-x-0",
+        W[h],
+        p
       ),
       children: [
-        u() && /* @__PURE__ */ e("span", { className: "bear-flex-shrink-0 bear-mt-0.5", children: u() }),
-        /* @__PURE__ */ c("div", { className: "bear-flex-1 bear-min-w-0", children: [
+        a() && /* @__PURE__ */ e("span", { className: "bear-flex-shrink-0 bear-mt-0.5", children: a() }),
+        /* @__PURE__ */ l("div", { className: "bear-flex-1 bear-min-w-0", children: [
           b && /* @__PURE__ */ e("div", { className: "bear-font-semibold bear-mb-0.5", children: b }),
-          /* @__PURE__ */ e("div", { className: "bear-text-sm bear-opacity-90", children: n })
+          /* @__PURE__ */ e("div", { className: "bear-text-sm bear-opacity-90", children: i })
         ] }),
-        h && /* @__PURE__ */ e("div", { className: "bear-flex-shrink-0", children: h }),
-        l && /* @__PURE__ */ e(
+        d && /* @__PURE__ */ e("div", { className: "bear-flex-shrink-0", children: d }),
+        c && /* @__PURE__ */ e(
           "button",
           {
             type: "button",
-            onClick: p,
+            onClick: r,
             className: "bear-flex-shrink-0 bear-p-1 bear-rounded hover:bear-bg-white/20 bear-transition-colors bear-bg-transparent bear-border-none bear-cursor-pointer",
             "aria-label": "Close",
-            children: /* @__PURE__ */ e(_, {})
+            children: /* @__PURE__ */ e(B, {})
           }
         )
       ]
     }
   );
-}, L = ({
-  position: n = "top-right",
+}, P = ({
+  position: i = "top-right",
   maxToasts: b = 5,
-  className: d
+  className: h
 }) => {
-  const o = y(w);
+  const o = T(w);
   if (!o) return null;
-  const { _toasts: l, _removeToast: t } = o, h = l.slice(0, b);
+  const { _toasts: c, _removeToast: t } = o, d = c.slice(0, b);
   return /* @__PURE__ */ e(
     "div",
     {
-      className: k(
-        "bear-fixed bear-z-50 bear-flex bear-flex-col bear-gap-2",
-        W[n],
-        d
+      className: I(
+        "bear-fixed bear-z-[11000] bear-flex bear-flex-col bear-gap-2",
+        C[i],
+        h
       ),
-      children: h.map((a) => /* @__PURE__ */ e(
-        C,
+      children: d.map((s) => /* @__PURE__ */ e(
+        L,
         {
-          ...a,
-          onRemove: () => t(a.id)
+          ...s,
+          onRemove: () => t(s.id)
         },
-        a.id
+        s.id
       ))
     }
   );
-}, M = ({
-  children: n,
+}, O = ({
+  children: i,
   position: b = "top-right"
 }) => {
-  const [d, o] = T([]), l = i((r) => {
-    o((s) => s.filter((v) => v.id !== r));
-  }, []), t = i((r) => {
-    const s = r.id || E();
-    return o((v) => [...v, { ...r, id: s }]), s;
-  }, []), h = i((r) => t(r), [t]), a = i((r, s) => t({ message: r, severity: "success", ...s }), [t]), x = i((r, s) => t({ message: r, severity: "info", ...s }), [t]), f = i((r, s) => t({ message: r, severity: "warning", ...s }), [t]), g = i((r, s) => t({ message: r, severity: "error", ...s }), [t]), m = i((r) => l(r), [l]), p = i(() => o([]), []), u = {
-    toast: h,
-    success: a,
+  const [h, o] = k([]), c = n((r) => {
+    o((a) => a.filter((f) => f.id !== r));
+  }, []), t = n((r) => {
+    const a = r.id || S();
+    return o((f) => [...f, { ...r, id: a }]), a;
+  }, []), d = n((r) => t(r), [t]), s = n((r, a) => t({ message: r, severity: "success", ...a }), [t]), x = n((r, a) => t({ message: r, severity: "info", ...a }), [t]), p = n((r, a) => t({ message: r, severity: "warning", ...a }), [t]), m = n((r, a) => t({ message: r, severity: "error", ...a }), [t]), v = n((r) => c(r), [c]), g = n(() => o([]), []), u = {
+    toast: d,
+    success: s,
     info: x,
-    warning: f,
-    error: g,
-    dismiss: m,
-    dismissAll: p,
-    _toasts: d,
-    _removeToast: l
+    warning: p,
+    error: m,
+    dismiss: v,
+    dismissAll: g,
+    _toasts: h,
+    _removeToast: c
   };
-  return /* @__PURE__ */ c(w.Provider, { value: u, children: [
-    n,
-    /* @__PURE__ */ e(L, { position: b })
+  return /* @__PURE__ */ l(w.Provider, { value: u, children: [
+    i,
+    /* @__PURE__ */ e(P, { position: b })
   ] });
 };
 export {
-  L as ToastContainer,
-  M as ToastProvider,
-  z as useToast
+  P as ToastContainer,
+  O as ToastProvider,
+  M as useToast
 };

package/dist/components/Toast/Toast.types.d.ts

@@ -22,6 +22,8 @@ export interface ToastProps {
     onClose?: () => void;
     /** Additional CSS class */
     className?: string;
+    /** Scroll the toast into view when it appears */
+    autoScroll?: boolean;
 }
 export interface ToastContainerProps {
     /** Position of toast container */

package/dist/components/Tooltip/Tooltip.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),r=require("react"),j=require("react-dom"),k=require("../../utils/cn.cjs"),v=({content:m,children:x,position:w,placement:R,delay:y=200,className:T,disabled:M=!1})=>{const c=R||w||"top",[l,d]=r.useState(!1),[b,B]=r.useState({x:0,y:0}),u=r.useRef(null),h=r.useRef(null),n=r.useRef(),f=r.useCallback(()=>{if(!u.current||!h.current)return;const e=u.current.getBoundingClientRect(),t=h.current.getBoundingClientRect(),s=8;let o=0,i=0;switch(c){case"top":o=e.left+(e.width-t.width)/2,i=e.top-t.height-s;break;case"bottom":o=e.left+(e.width-t.width)/2,i=e.bottom+s;break;case"left":o=e.left-t.width-s,i=e.top+(e.height-t.height)/2;break;case"right":o=e.right+s,i=e.top+(e.height-t.height)/2;break}o=Math.max(8,Math.min(o,window.innerWidth-t.width-8)),i=Math.max(8,Math.min(i,window.innerHeight-t.height-8)),B({x:o,y:i})},[c]),g=()=>{M||(n.current=setTimeout(()=>{d(!0)},y))},p=()=>{n.current&&clearTimeout(n.current),d(!1)};return r.useEffect(()=>{l&&f()},[l,f]),r.useEffect(()=>()=>{n.current&&clearTimeout(n.current)},[]),a.jsxs(a.Fragment,{children:[a.jsx("div",{ref:u,onMouseEnter:g,onMouseLeave:p,onFocus:g,onBlur:p,className:"Bear-Tooltip__trigger bear-inline-block",children:x}),l&&j.createPortal(a.jsx("div",{ref:h,role:"tooltip",style:{left:b.x,top:b.y},className:k.cn("bear-fixed bear-z-[9999]","Bear-Tooltip",`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",T),children:a.jsx("span",{className:"Bear-Tooltip__content",children:m})}),document.body)]})};exports.Tooltip=v;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),t=require("react"),M=require("react-dom"),B=require("../../utils/cn.cjs"),j=({content:p,children:w,position:x,placement:R,delay:v=200,className:y,disabled:T=!1})=>{const u=R||x||"top",[i,b]=t.useState(!1),[f,E]=t.useState({x:0,y:0}),d=t.useRef(null),h=t.useRef(null),s=t.useRef(),c=t.useCallback(()=>{if(!d.current||!h.current)return;const e=d.current.getBoundingClientRect(),r=h.current.getBoundingClientRect(),l=8;let o=0,n=0;switch(u){case"top":o=e.left+(e.width-r.width)/2,n=e.top-r.height-l;break;case"bottom":o=e.left+(e.width-r.width)/2,n=e.bottom+l;break;case"left":o=e.left-r.width-l,n=e.top+(e.height-r.height)/2;break;case"right":o=e.right+l,n=e.top+(e.height-r.height)/2;break}o=Math.max(8,Math.min(o,window.innerWidth-r.width-8)),n=Math.max(8,Math.min(n,window.innerHeight-r.height-8)),E({x:o,y:n})},[u]),g=()=>{T||(s.current=setTimeout(()=>{b(!0)},v))},m=()=>{s.current&&clearTimeout(s.current),b(!1)};return t.useEffect(()=>{i&&c()},[i,c]),t.useEffect(()=>{if(!i)return;const e=()=>{requestAnimationFrame(()=>c())};return e(),window.addEventListener("resize",e),window.addEventListener("scroll",e,!0),()=>{window.removeEventListener("resize",e),window.removeEventListener("scroll",e,!0)}},[i,c]),t.useEffect(()=>()=>{s.current&&clearTimeout(s.current)},[]),a.jsxs(a.Fragment,{children:[a.jsx("div",{ref:d,onMouseEnter:g,onMouseLeave:m,onFocus:g,onBlur:m,className:"Bear-Tooltip__trigger bear-inline-block",children:w}),i&&M.createPortal(a.jsx("div",{ref:h,role:"tooltip",style:{left:f.x,top:f.y},className:B.cn("bear-fixed bear-z-[11000]","Bear-Tooltip",`Bear-Tooltip--${u}`,"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",y),children:a.jsx("span",{className:"Bear-Tooltip__content",children:p})}),document.body)]})};exports.Tooltip=j;

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,