@forgedevstack/bear 1.2.3 → 1.2.4

package/dist/components/Timeline/Timeline.const.js

@@ -1,4 +1,4 @@
-const t = "Bear-Timeline relative", e = "Bear-Timeline__item relative pb-8 last:pb-0", r = {
+const e = "Bear-Timeline relative", t = "Bear-Timeline__item relative pb-8 last:pb-0", E = {
   left: {
     wrapper: "pl-8",
     content: "text-left",
@@ -17,42 +17,63 @@ const t = "Bear-Timeline relative", e = "Bear-Timeline__item relative pb-8 last:
     dot: "",
     line: "left-1/2 -translate-x-1/2"
   }
-}, E = "Bear-Timeline__dot absolute rounded-full border-2 border-white dark:border-zinc-900 z-10 transition-all", n = {
+}, r = "Bear-Timeline__dot absolute rounded-full border-2 border-white dark:border-zinc-900 z-10 transition-all", _ = {
   sm: "w-3 h-3",
   md: "w-4 h-4",
   lg: "w-5 h-5"
-}, I = {
+}, T = {
   sm: "w-6 h-6",
   md: "w-8 h-8",
   lg: "w-10 h-10"
-}, l = {
+}, I = {
   pink: "bg-primary-500",
   green: "bg-green-500",
   blue: "bg-blue-500",
   amber: "bg-amber-500",
   red: "bg-red-500",
   gray: "bg-gray-400 dark:bg-zinc-600"
-}, _ = "Bear-Timeline__line absolute top-0 w-0.5 h-full", a = "bg-gray-200 dark:bg-zinc-700", i = "Bear-Timeline__content", o = {
+}, a = "Bear-Timeline__line absolute top-0 w-0.5 h-full", n = "bg-gray-200 dark:bg-zinc-700", o = "Bear-Timeline__content", s = {
   sm: "text-sm",
   md: "text-base",
   lg: "text-lg"
-}, T = {
+}, N = {
   sm: "text-xs",
   md: "text-sm",
   lg: "text-base"
-}, s = "text-xs text-gray-500 dark:text-gray-400";
+}, b = "text-xs text-gray-500 dark:text-gray-400", i = 2, L = 6, c = -4, l = 0, M = "bear-flex bear-items-center bear-justify-center bear-text-white", O = "bear-ring-4 bear-ring-primary-500/30", g = "bear-cursor-pointer", m = "hover:bear-scale-125 bear-transition-transform", A = "bear-scale-125", S = "bear-text-sm bear-space-y-1", x = "bear-font-semibold bear-text-gray-900 dark:bear-text-white", d = "bear-pr-8 bear-text-right bear-w-1/2", D = "bear-pl-8 bear-text-left bear-w-1/2 bear-ml-auto", C = "bear-text-right", p = "bear-text-left", R = "Bear-Timeline__title bear-font-medium bear-text-gray-900 dark:bear-text-white", h = "bear-text-primary-600 dark:bear-text-primary-400", w = "Bear-Timeline__description bear-text-gray-600 dark:bear-text-gray-400 bear-mt-1", y = "Bear-Timeline__extra bear-mt-3", B = "bear-mb-1", f = "Loading...";
 export {
-  t as TIMELINE_BASE_CLASSES,
-  i as TIMELINE_CONTENT_BASE,
-  T as TIMELINE_DESC_SIZES,
-  E as TIMELINE_DOT_BASE,
-  l as TIMELINE_DOT_COLORS,
-  I as TIMELINE_DOT_ICON_SIZES,
-  n as TIMELINE_DOT_SIZES,
-  e as TIMELINE_ITEM_BASE,
-  _ as TIMELINE_LINE_BASE,
-  a as TIMELINE_LINE_COLOR,
-  r as TIMELINE_POSITIONS,
-  s as TIMELINE_TIME_CLASSES,
-  o as TIMELINE_TITLE_SIZES
+  C as TIMELINE_ALTERNATE_EVEN_CONTENT,
+  d as TIMELINE_ALTERNATE_EVEN_WRAPPER,
+  p as TIMELINE_ALTERNATE_ODD_CONTENT,
+  D as TIMELINE_ALTERNATE_ODD_WRAPPER,
+  e as TIMELINE_BASE_CLASSES,
+  o as TIMELINE_CONTENT_BASE,
+  w as TIMELINE_DESC_BASE,
+  N as TIMELINE_DESC_SIZES,
+  O as TIMELINE_DOT_ACTIVE_RING,
+  A as TIMELINE_DOT_ACTIVE_SCALE,
+  r as TIMELINE_DOT_BASE,
+  I as TIMELINE_DOT_COLORS,
+  m as TIMELINE_DOT_HOVER_SCALE,
+  M as TIMELINE_DOT_ICON_EXTRA,
+  T as TIMELINE_DOT_ICON_SIZES,
+  g as TIMELINE_DOT_INTERACTIVE,
+  l as TIMELINE_DOT_OFFSET_DEFAULT_PX,
+  c as TIMELINE_DOT_OFFSET_WITH_ICON_PX,
+  _ as TIMELINE_DOT_SIZES,
+  L as TIMELINE_DOT_TOP_DEFAULT_PX,
+  i as TIMELINE_DOT_TOP_WITH_ICON_PX,
+  y as TIMELINE_EXTRA_CLASSES,
+  S as TIMELINE_HOVER_CARD_CONTENT,
+  x as TIMELINE_HOVER_CARD_DATE,
+  t as TIMELINE_ITEM_BASE,
+  a as TIMELINE_LINE_BASE,
+  n as TIMELINE_LINE_COLOR,
+  f as TIMELINE_PENDING_TITLE,
+  E as TIMELINE_POSITIONS,
+  b as TIMELINE_TIME_CLASSES,
+  B as TIMELINE_TIME_MARGIN,
+  h as TIMELINE_TITLE_ACTIVE,
+  R as TIMELINE_TITLE_BASE,
+  s as TIMELINE_TITLE_SIZES
 };

package/dist/components/Timeline/Timeline.d.ts

@@ -1,17 +1,2 @@
 import { TimelineProps } from './Timeline.types';
-/**
- * Timeline - Vertical timeline for events
- *
- * @example
- * ```tsx
- * <Timeline
- *   items={[
- *     { title: 'Step 1', description: 'Description', time: '2024-01-01' },
- *     { title: 'Step 2', description: 'Description', time: '2024-01-02', active: true },
- *     { title: 'Step 3', description: 'Description', time: '2024-01-03' },
- *   ]}
- * />
- * ```
- */
 export declare const Timeline: import('react').ForwardRefExoticComponent<TimelineProps & import('react').RefAttributes<HTMLDivElement>>;
-export default Timeline;

package/dist/components/Timeline/Timeline.js

@@ -1,139 +1,140 @@
-import { jsxs as o, jsx as l } from "react/jsx-runtime";
-import { forwardRef as g, useMemo as O } from "react";
-import { cn as r } from "../../utils/cn.js";
-import { TIMELINE_LINE_COLOR as A, TIMELINE_POSITIONS as w, TIMELINE_LINE_BASE as B, TIMELINE_TIME_CLASSES as C, TIMELINE_TITLE_SIZES as D, TIMELINE_DESC_SIZES as k, TIMELINE_CONTENT_BASE as Z, TIMELINE_ITEM_BASE as b, TIMELINE_BASE_CLASSES as j, TIMELINE_DOT_COLORS as _, TIMELINE_DOT_ICON_SIZES as R, TIMELINE_DOT_BASE as m, TIMELINE_DOT_SIZES as X } from "./Timeline.const.js";
-const z = g(
-  ({
-    items: E,
-    position: e = "left",
-    size: n = "md",
-    showLine: N = !0,
-    pending: s,
-    reverse: I = !1,
-    lineColor: i,
-    testId: S,
-    className: T,
-    ...f
-  }, p) => {
-    const d = w[e], x = X[n], L = R[n], h = D[n], y = k[n], M = O(() => {
-      let t = [...E];
-      return I && (t = t.reverse()), s && t.push({
-        title: typeof s == "string" ? s : "Loading...",
-        description: typeof s == "boolean" ? void 0 : s,
-        color: "gray"
-      }), t;
-    }, [E, I, s]), u = (t) => {
-      const a = t.color || "pink", c = t.active;
-      return t.icon ? /* @__PURE__ */ l(
-        "div",
-        {
-          className: r(
-            m,
-            L,
-            _[a],
-            "flex items-center justify-center text-white",
-            c && "ring-4 ring-primary-500/30"
-          ),
-          style: {
-            top: "2px",
-            ...e === "left" ? { left: "-4px" } : {},
-            ...e === "right" ? { right: "-4px" } : {},
-            ...e === "alternate" ? { left: "50%", transform: "translateX(-50%)" } : {}
-          },
-          children: t.icon
-        }
-      ) : /* @__PURE__ */ l(
-        "div",
-        {
-          className: r(
-            m,
-            x,
-            _[a],
-            c && "ring-4 ring-primary-500/30 scale-125"
-          ),
-          style: {
-            top: "6px",
-            ...e === "left" ? { left: "0" } : {},
-            ...e === "right" ? { right: "0" } : {},
-            ...e === "alternate" ? { left: "50%", transform: "translateX(-50%)" } : {}
-          }
-        }
-      );
-    }, v = (t) => {
-      if (e !== "alternate") return {};
-      const a = t % 2 === 0;
-      return {
-        wrapper: a ? "pr-8 text-right w-1/2" : "pl-8 text-left w-1/2 ml-auto",
-        content: a ? "text-right" : "text-left"
-      };
-    };
-    return /* @__PURE__ */ o(
+import { jsxs as a, jsx as t } from "react/jsx-runtime";
+import { forwardRef as X, useMemo as b } from "react";
+import { cn as e } from "../../utils/cn.js";
+import { HoverCard as k } from "../HoverCard/HoverCard.js";
+import { TIMELINE_PENDING_TITLE as w, TIMELINE_LINE_COLOR as x, TIMELINE_POSITIONS as F, TIMELINE_LINE_BASE as H, TIMELINE_TIME_MARGIN as z, TIMELINE_TIME_CLASSES as W, TIMELINE_TITLE_ACTIVE as Z, TIMELINE_TITLE_SIZES as G, TIMELINE_TITLE_BASE as $, TIMELINE_DESC_SIZES as j, TIMELINE_DESC_BASE as U, TIMELINE_EXTRA_CLASSES as K, TIMELINE_CONTENT_BASE as q, TIMELINE_ITEM_BASE as J, TIMELINE_BASE_CLASSES as Q, TIMELINE_DOT_INTERACTIVE as A, TIMELINE_DOT_ACTIVE_RING as C, TIMELINE_DOT_ICON_EXTRA as Y, TIMELINE_DOT_COLORS as D, TIMELINE_DOT_ICON_SIZES as EE, TIMELINE_DOT_BASE as p, TIMELINE_DOT_HOVER_SCALE as eE, TIMELINE_DOT_ACTIVE_SCALE as tE, TIMELINE_DOT_SIZES as IE, TIMELINE_HOVER_CARD_CONTENT as oE, TIMELINE_HOVER_CARD_DATE as TE, TIMELINE_ALTERNATE_EVEN_CONTENT as rE, TIMELINE_ALTERNATE_ODD_CONTENT as nE, TIMELINE_ALTERNATE_EVEN_WRAPPER as _E, TIMELINE_ALTERNATE_ODD_WRAPPER as sE, TIMELINE_DOT_TOP_WITH_ICON_PX as NE, TIMELINE_DOT_TOP_DEFAULT_PX as iE, TIMELINE_DOT_OFFSET_WITH_ICON_PX as cE, TIMELINE_DOT_OFFSET_DEFAULT_PX as aE } from "./Timeline.const.js";
+const lE = (N, i) => {
+  const r = i ? NE : iE, I = i ? cE : aE;
+  return N === "alternate" ? { top: r, left: "50%", transform: "translateX(-50%)" } : N === "right" ? { top: r, right: I } : { top: r, left: I };
+}, dE = X((N, i) => {
+  const {
+    items: r,
+    position: I = "left",
+    size: c = "md",
+    showLine: v = !0,
+    pending: n,
+    reverse: d = !1,
+    lineColor: l,
+    testId: f,
+    className: R,
+    ...h
+  } = N, L = F[I], u = IE[c], m = EE[c], P = G[c], y = j[c], g = b(() => {
+    let E = [...r];
+    return d && (E = E.reverse()), n && E.push({
+      title: typeof n == "string" ? n : w,
+      description: typeof n == "boolean" ? void 0 : n,
+      color: "gray"
+    }), E;
+  }, [r, d, n]), V = (E, o) => {
+    const _ = E.color || "pink", s = E.active, S = !!E.icon, T = !!(E.detail || E.date), M = lE(I, S), O = S ? /* @__PURE__ */ t(
+      "div",
+      {
+        className: e(
+          p,
+          m,
+          D[_],
+          Y,
+          s && C,
+          T && A
+        ),
+        style: M,
+        onClick: E.onDotClick,
+        role: T ? "button" : void 0,
+        tabIndex: T ? 0 : void 0,
+        children: E.icon
+      }
+    ) : /* @__PURE__ */ t(
       "div",
       {
-        ref: p,
-        className: r(j, T),
-        "data-testid": S,
-        ...f,
-        children: [
-          N && /* @__PURE__ */ l(
+        className: e(
+          p,
+          u,
+          D[_],
+          s && e(C, tE),
+          T && e(A, eE)
+        ),
+        style: M,
+        onClick: E.onDotClick,
+        role: T ? "button" : void 0,
+        tabIndex: T ? 0 : void 0
+      }
+    );
+    return T ? /* @__PURE__ */ t(
+      k,
+      {
+        cardContent: /* @__PURE__ */ a("div", { className: oE, children: [
+          E.date && /* @__PURE__ */ t("div", { className: TE, children: E.date }),
+          E.detail ?? E.description
+        ] }),
+        children: O
+      },
+      o
+    ) : O;
+  }, B = (E) => {
+    if (I !== "alternate") return { wrapper: "", content: "" };
+    const o = E % 2 === 0;
+    return {
+      wrapper: o ? _E : sE,
+      content: o ? rE : nE
+    };
+  };
+  return /* @__PURE__ */ a(
+    "div",
+    {
+      ref: i,
+      className: e(Q, R),
+      "data-testid": f,
+      ...h,
+      children: [
+        v && /* @__PURE__ */ t(
+          "div",
+          {
+            className: e(
+              H,
+              L.line,
+              l ? "" : x
+            ),
+            style: l ? { backgroundColor: l } : void 0
+          }
+        ),
+        g.map((E, o) => {
+          const _ = B(o), s = `${E.title}-${E.time ?? o}`;
+          return /* @__PURE__ */ a(
             "div",
             {
-              className: r(
-                B,
-                d.line,
-                i ? "" : A
+              className: e(
+                J,
+                I !== "alternate" && L.wrapper,
+                _.wrapper
               ),
-              style: i ? { backgroundColor: i } : void 0
-            }
-          ),
-          M.map((t, a) => {
-            const c = v(a);
-            return /* @__PURE__ */ o(
-              "div",
-              {
-                className: r(
-                  b,
-                  e !== "alternate" && d.wrapper,
-                  c.wrapper
-                ),
-                children: [
-                  u(t),
-                  /* @__PURE__ */ o("div", { className: r(Z, c.content), children: [
-                    t.time && /* @__PURE__ */ l("div", { className: r(C, "mb-1"), children: t.time }),
-                    /* @__PURE__ */ l(
-                      "h4",
-                      {
-                        className: r(
-                          "Bear-Timeline__title font-medium text-gray-900 dark:text-white",
-                          h,
-                          t.active && "text-primary-600 dark:text-primary-400"
-                        ),
-                        children: t.title
-                      }
-                    ),
-                    t.description && /* @__PURE__ */ l(
-                      "div",
-                      {
-                        className: r(
-                          "Bear-Timeline__description text-gray-600 dark:text-gray-400 mt-1",
-                          y
-                        ),
-                        children: t.description
-                      }
-                    ),
-                    t.extra && /* @__PURE__ */ l("div", { className: "Bear-Timeline__extra mt-3", children: t.extra })
-                  ] })
-                ]
-              },
-              a
-            );
-          })
-        ]
-      }
-    );
-  }
-);
-z.displayName = "Timeline";
+              children: [
+                V(E, `dot-${s}`),
+                /* @__PURE__ */ a("div", { className: e(q, _.content), children: [
+                  E.time && /* @__PURE__ */ t("div", { className: e(W, z), children: E.time }),
+                  /* @__PURE__ */ t(
+                    "h4",
+                    {
+                      className: e(
+                        $,
+                        P,
+                        E.active && Z
+                      ),
+                      children: E.title
+                    }
+                  ),
+                  E.description && /* @__PURE__ */ t("div", { className: e(U, y), children: E.description }),
+                  E.extra && /* @__PURE__ */ t("div", { className: K, children: E.extra })
+                ] })
+              ]
+            },
+            s
+          );
+        })
+      ]
+    }
+  );
+});
+dE.displayName = "Timeline";
 export {
-  z as Timeline
+  dE as Timeline
 };

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

@@ -16,8 +16,15 @@ export interface TimelineItem {
     active?: boolean;
     /** Extra content below description */
     extra?: ReactNode;
+    /** Full date string shown on dot hover/click */
+    date?: string;
+    /** Detail panel content for dot interaction */
+    detail?: ReactNode;
+    /** Dot click handler */
+    onDotClick?: () => void;
 }
 export interface TimelineProps extends HTMLAttributes<HTMLDivElement> {
+    id?: string;
     /** Array of timeline items */
     items: TimelineItem[];
     /** Position of content relative to line */

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

@@ -8,6 +8,7 @@ export interface TimelineChartItem {
     icon?: ReactNode;
 }
 export interface TimelineChartProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
+    id?: string;
     /** Items to display on the timeline */
     items: TimelineChartItem[];
     /** Minimum value of the axis */

package/dist/components/Toast/Toast.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react"),y=require("../../utils/cn.cjs"),T=require("./Toast.utils.cjs"),p={success:e.jsxs("svg",{width:20,height:20,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,children:[e.jsx("path",{d:"M22 11.08V12a10 10 0 1 1-5.93-9.14"}),e.jsx("polyline",{points:"22 4 12 14.01 9 11.01"})]}),info:e.jsxs("svg",{width:20,height:20,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,children:[e.jsx("circle",{cx:"12",cy:"12",r:"10"}),e.jsx("line",{x1:"12",y1:"16",x2:"12",y2:"12"}),e.jsx("line",{x1:"12",y1:"8",x2:"12.01",y2:"8"})]}),warning:e.jsxs("svg",{width:20,height:20,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,children:[e.jsx("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"}),e.jsx("line",{x1:"12",y1:"9",x2:"12",y2:"13"}),e.jsx("line",{x1:"12",y1:"17",x2:"12.01",y2:"17"})]}),error:e.jsxs("svg",{width:20,height:20,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,children:[e.jsx("circle",{cx:"12",cy:"12",r:"10"}),e.jsx("line",{x1:"15",y1:"9",x2:"9",y2:"15"}),e.jsx("line",{x1:"9",y1:"9",x2:"15",y2:"15"})]})},k=()=>e.jsxs("svg",{width:16,height:16,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,children:[e.jsx("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),e.jsx("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]}),C={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"},I={"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"},v=r.createContext(null),E=()=>{const i=r.useContext(v);if(!i)throw new Error("useToast must be used within a ToastProvider");return i},N=({message:i,title:c,severity:b="info",duration:n=5e3,closable:l=!0,icon:s,action:x,onClose:o,onRemove:u,className:g,autoScroll:f=!1})=>{const[j,m]=r.useState(!1),d=r.useRef(null);r.useEffect(()=>{f&&d.current&&d.current.scrollIntoView({behavior:"smooth",block:"nearest",inline:"nearest"})},[f]),r.useEffect(()=>{if(n>0){const h=setTimeout(()=>{m(!0),setTimeout(()=>{u(),o==null||o()},200)},n);return()=>clearTimeout(h)}},[n,u,o]);const t=()=>{m(!0),setTimeout(()=>{u(),o==null||o()},200)},a=()=>s===!1?null:s||p[b];return e.jsxs("div",{ref:d,role:"alert",className:y.cn("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",j?"bear-opacity-0 bear-translate-x-2":"bear-opacity-100 bear-translate-x-0",C[b],g),children:[a()&&e.jsx("span",{className:"bear-flex-shrink-0 bear-mt-0.5",children:a()}),e.jsxs("div",{className:"bear-flex-1 bear-min-w-0",children:[c&&e.jsx("div",{className:"bear-font-semibold bear-mb-0.5",children:c}),e.jsx("div",{className:"bear-text-sm bear-opacity-90",children:i})]}),x&&e.jsx("div",{className:"bear-flex-shrink-0",children:x}),l&&e.jsx("button",{type:"button",onClick:t,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:e.jsx(k,{})})]})},w=({position:i="top-right",maxToasts:c=5,className:b})=>{const n=r.useContext(v);if(!n)return null;const{_toasts:l,_removeToast:s}=n,x=l.slice(0,c);return e.jsx("div",{className:y.cn("bear-fixed bear-z-[11000] bear-flex bear-flex-col bear-gap-2",I[i],b),children:x.map(o=>e.jsx(N,{...o,onRemove:()=>s(o.id)},o.id))})},S=({children:i,position:c="top-right"})=>{const[b,n]=r.useState([]),l=r.useCallback(t=>{n(a=>a.filter(h=>h.id!==t))},[]),s=r.useCallback(t=>{const a=t.id||T.generateId();return n(h=>[...h,{...t,id:a}]),a},[]),x=r.useCallback(t=>s(t),[s]),o=r.useCallback((t,a)=>s({message:t,severity:"success",...a}),[s]),u=r.useCallback((t,a)=>s({message:t,severity:"info",...a}),[s]),g=r.useCallback((t,a)=>s({message:t,severity:"warning",...a}),[s]),f=r.useCallback((t,a)=>s({message:t,severity:"error",...a}),[s]),j=r.useCallback(t=>l(t),[l]),m=r.useCallback(()=>n([]),[]),d={toast:x,success:o,info:u,warning:g,error:f,dismiss:j,dismissAll:m,_toasts:b,_removeToast:l};return e.jsxs(v.Provider,{value:d,children:[i,e.jsx(w,{position:c})]})};exports.ToastContainer=w;exports.ToastProvider=S;exports.useToast=E;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react"),y=require("../../utils/cn.cjs"),T=require("../../utils/generateBearId.utils.cjs"),p={success:e.jsxs("svg",{width:20,height:20,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,children:[e.jsx("path",{d:"M22 11.08V12a10 10 0 1 1-5.93-9.14"}),e.jsx("polyline",{points:"22 4 12 14.01 9 11.01"})]}),info:e.jsxs("svg",{width:20,height:20,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,children:[e.jsx("circle",{cx:"12",cy:"12",r:"10"}),e.jsx("line",{x1:"12",y1:"16",x2:"12",y2:"12"}),e.jsx("line",{x1:"12",y1:"8",x2:"12.01",y2:"8"})]}),warning:e.jsxs("svg",{width:20,height:20,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,children:[e.jsx("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"}),e.jsx("line",{x1:"12",y1:"9",x2:"12",y2:"13"}),e.jsx("line",{x1:"12",y1:"17",x2:"12.01",y2:"17"})]}),error:e.jsxs("svg",{width:20,height:20,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,children:[e.jsx("circle",{cx:"12",cy:"12",r:"10"}),e.jsx("line",{x1:"15",y1:"9",x2:"9",y2:"15"}),e.jsx("line",{x1:"9",y1:"9",x2:"15",y2:"15"})]})},k=()=>e.jsxs("svg",{width:16,height:16,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,children:[e.jsx("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),e.jsx("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]}),C={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"},I={"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"},v=r.createContext(null),E=()=>{const i=r.useContext(v);if(!i)throw new Error("useToast must be used within a ToastProvider");return i},N=({message:i,title:c,severity:b="info",duration:o=5e3,closable:l=!0,icon:s,action:x,onClose:n,onRemove:u,className:g,autoScroll:f=!1})=>{const[j,m]=r.useState(!1),d=r.useRef(null);r.useEffect(()=>{f&&d.current&&d.current.scrollIntoView({behavior:"smooth",block:"nearest",inline:"nearest"})},[f]),r.useEffect(()=>{if(o>0){const h=setTimeout(()=>{m(!0),setTimeout(()=>{u(),n==null||n()},200)},o);return()=>clearTimeout(h)}},[o,u,n]);const t=()=>{m(!0),setTimeout(()=>{u(),n==null||n()},200)},a=()=>s===!1?null:s||p[b];return e.jsxs("div",{ref:d,role:"alert",className:y.cn("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",j?"bear-opacity-0 bear-translate-x-2":"bear-opacity-100 bear-translate-x-0",C[b],g),children:[a()&&e.jsx("span",{className:"bear-flex-shrink-0 bear-mt-0.5",children:a()}),e.jsxs("div",{className:"bear-flex-1 bear-min-w-0",children:[c&&e.jsx("div",{className:"bear-font-semibold bear-mb-0.5",children:c}),e.jsx("div",{className:"bear-text-sm bear-opacity-90",children:i})]}),x&&e.jsx("div",{className:"bear-flex-shrink-0",children:x}),l&&e.jsx("button",{type:"button",onClick:t,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:e.jsx(k,{})})]})},w=({position:i="top-right",maxToasts:c=5,className:b})=>{const o=r.useContext(v);if(!o)return null;const{_toasts:l,_removeToast:s}=o,x=l.slice(0,c);return e.jsx("div",{className:y.cn("bear-fixed bear-z-[11000] bear-flex bear-flex-col bear-gap-2",I[i],b),children:x.map(n=>e.jsx(N,{...n,onRemove:()=>s(n.id)},n.id))})},S=({children:i,position:c="top-right"})=>{const[b,o]=r.useState([]),l=r.useCallback(t=>{o(a=>a.filter(h=>h.id!==t))},[]),s=r.useCallback(t=>{const a=t.id||T.generateBearId("Toast");return o(h=>[...h,{...t,id:a}]),a},[]),x=r.useCallback(t=>s(t),[s]),n=r.useCallback((t,a)=>s({message:t,severity:"success",...a}),[s]),u=r.useCallback((t,a)=>s({message:t,severity:"info",...a}),[s]),g=r.useCallback((t,a)=>s({message:t,severity:"warning",...a}),[s]),f=r.useCallback((t,a)=>s({message:t,severity:"error",...a}),[s]),j=r.useCallback(t=>l(t),[l]),m=r.useCallback(()=>o([]),[]),d={toast:x,success:n,info:u,warning:g,error:f,dismiss:j,dismissAll:m,_toasts:b,_removeToast:l};return e.jsxs(v.Provider,{value:d,children:[i,e.jsx(w,{position:c})]})};exports.ToastContainer=w;exports.ToastProvider=S;exports.useToast=E;

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

@@ -0,0 +1 @@
+export declare const T_O_A_S_T_ROOT_CLASS = "Bear-Toast";

package/dist/components/Toast/Toast.js

@@ -1,8 +1,8 @@
 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 _ = {
+import { generateBearId as B } from "../../utils/generateBearId.utils.js";
+const S = {
   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" })
@@ -22,7 +22,7 @@ const _ = {
     /* @__PURE__ */ e("line", { x1: "15", y1: "9", x2: "9", y2: "15" }),
     /* @__PURE__ */ e("line", { x1: "9", y1: "9", x2: "15", y2: "15" })
   ] })
-}, B = () => /* @__PURE__ */ l("svg", { width: 16, height: 16, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
+}, _ = () => /* @__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" })
 ] }), W = {
@@ -72,7 +72,7 @@ const _ = {
     g(!0), setTimeout(() => {
       x(), s == null || s();
     }, 200);
-  }, a = () => t === !1 ? null : t || _[h];
+  }, a = () => t === !1 ? null : t || S[h];
   return /* @__PURE__ */ l(
     "div",
     {
@@ -99,7 +99,7 @@ const _ = {
             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(B, {})
+            children: /* @__PURE__ */ e(_, {})
           }
         )
       ]
@@ -138,7 +138,7 @@ const _ = {
   const [h, o] = k([]), c = n((r) => {
     o((a) => a.filter((f) => f.id !== r));
   }, []), t = n((r) => {
-    const a = r.id || S();
+    const a = r.id || B("Toast");
     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,

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

@@ -2,6 +2,7 @@ import { ReactNode } from 'react';
 export type ToastPosition = 'top-left' | 'top-center' | 'top-right' | 'bottom-left' | 'bottom-center' | 'bottom-right';
 export type ToastSeverity = 'success' | 'info' | 'warning' | 'error';
 export interface ToastProps {
+    testId?: string;
     /** Unique identifier for the toast */
     id?: string;
     /** Toast message content */

package/dist/components/ToggleButton/ToggleButton.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const L=require("react/jsx-runtime"),o=require("react"),I=require("../../utils/cn.cjs"),A=require("../../utils/generateBearId.utils.cjs"),m=require("../../utils/useBearId.cjs"),n=require("./ToggleButton.const.cjs"),N=o.createContext(null),y=()=>o.useContext(N),q=({value:t,selected:T,size:l,fullWidth:d=!1,disabled:g=!1,className:i,children:c,id:B,testId:S,onClick:a,..._})=>{const O=m.useBearId("ToggleButton"),E=A.resolveBearId(B,O),e=y(),G=l??(e==null?void 0:e.size)??"md",r=g||(e==null?void 0:e.disabled)||!1,f=T??(e==null?void 0:e.selectedValues.includes(t))??!1,p=s=>{r||e==null||e.toggleValue(t),a==null||a(s)};return L.jsx("button",{type:"button",id:E,"data-testid":S,"aria-pressed":f,disabled:r,onClick:p,className:I.cn(n.TOGGLE_BUTTON_ROOT_CLASS,n.TOGGLE_BUTTON_BASE_CLASSES,n.TOGGLE_BUTTON_SIZE_CLASSES[G],f&&n.TOGGLE_BUTTON_SELECTED_CLASSES,d&&"bear-flex-1",r&&"bear-opacity-50 bear-cursor-not-allowed",i),..._,children:c})},b=t=>t?Array.isArray(t)?t:[t]:[],C=({value:t,defaultValue:T,onChange:l,exclusive:d=!0,size:g="md",fullWidth:i=!1,disabled:c=!1,className:B,children:S,id:a,testId:_})=>{const O=m.useBearId("ToggleButtonGroup"),E=A.resolveBearId(a,O),[e,G]=o.useState(()=>b(T)),r=t!==void 0?b(t):e,p={selectedValues:r,toggleValue:s=>{let u;d?u=[s]:u=r.includes(s)?r.filter(U=>U!==s):[...r,s],t===void 0&&G(u),l==null||l(d?u[0]??"":u)},size:g,disabled:c};return L.jsx(N.Provider,{value:p,children:L.jsx("div",{id:E,"data-testid":_,role:"group",className:I.cn(n.TOGGLE_BUTTON_GROUP_ROOT_CLASS,n.TOGGLE_BUTTON_GROUP_BASE_CLASSES,i&&"bear-w-full",c&&"bear-opacity-50 bear-pointer-events-none",B),children:o.Children.map(S,s=>o.isValidElement(s)?o.cloneElement(s,{fullWidth:s.props.fullWidth??i}):s)})})};exports.ToggleButton=q;exports.ToggleButtonGroup=C;

package/dist/components/ToggleButton/ToggleButton.const.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r="Bear-ToggleButton",e="Bear-ToggleButtonGroup",a={xs:"bear-h-7 bear-px-2 bear-text-xs",sm:"bear-h-8 bear-px-3 bear-text-sm",md:"bear-h-10 bear-px-4 bear-text-base",lg:"bear-h-12 bear-px-5 bear-text-lg",xl:"bear-h-14 bear-px-6 bear-text-lg"},b="bear-bg-[var(--bear-primary-500)] bear-text-[var(--bear-text-inverted,#fff)] bear-border-[var(--bear-primary-500)] bear-shadow-sm",t="bear-inline-flex bear-items-center bear-justify-center bear-font-medium bear-rounded-md bear-border bear-transition-all bear-duration-200 bear-border-[var(--bear-border-default)] bear-bg-[var(--bear-bg-primary)] bear-text-[var(--bear-text-primary)] hover:bear-bg-[var(--bear-bg-tertiary)]",T="bear-inline-flex bear-rounded-lg bear-border bear-border-[var(--bear-border-default)] bear-bg-[var(--bear-bg-secondary)] bear-overflow-hidden";exports.TOGGLE_BUTTON_BASE_CLASSES=t;exports.TOGGLE_BUTTON_GROUP_BASE_CLASSES=T;exports.TOGGLE_BUTTON_GROUP_ROOT_CLASS=e;exports.TOGGLE_BUTTON_ROOT_CLASS=r;exports.TOGGLE_BUTTON_SELECTED_CLASSES=b;exports.TOGGLE_BUTTON_SIZE_CLASSES=a;

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

@@ -0,0 +1,6 @@
+export declare const TOGGLE_BUTTON_ROOT_CLASS = "Bear-ToggleButton";
+export declare const TOGGLE_BUTTON_GROUP_ROOT_CLASS = "Bear-ToggleButtonGroup";
+export declare const TOGGLE_BUTTON_SIZE_CLASSES: Record<'sm' | 'md' | 'lg' | 'xs' | 'xl', string>;
+export declare const TOGGLE_BUTTON_SELECTED_CLASSES = "bear-bg-[var(--bear-primary-500)] bear-text-[var(--bear-text-inverted,#fff)] bear-border-[var(--bear-primary-500)] bear-shadow-sm";
+export declare const TOGGLE_BUTTON_BASE_CLASSES = "bear-inline-flex bear-items-center bear-justify-center bear-font-medium bear-rounded-md bear-border bear-transition-all bear-duration-200 bear-border-[var(--bear-border-default)] bear-bg-[var(--bear-bg-primary)] bear-text-[var(--bear-text-primary)] hover:bear-bg-[var(--bear-bg-tertiary)]";
+export declare const TOGGLE_BUTTON_GROUP_BASE_CLASSES = "bear-inline-flex bear-rounded-lg bear-border bear-border-[var(--bear-border-default)] bear-bg-[var(--bear-bg-secondary)] bear-overflow-hidden";

package/dist/components/ToggleButton/ToggleButton.const.js

@@ -0,0 +1,15 @@
+const r = "Bear-ToggleButton", e = "Bear-ToggleButtonGroup", a = {
+  xs: "bear-h-7 bear-px-2 bear-text-xs",
+  sm: "bear-h-8 bear-px-3 bear-text-sm",
+  md: "bear-h-10 bear-px-4 bear-text-base",
+  lg: "bear-h-12 bear-px-5 bear-text-lg",
+  xl: "bear-h-14 bear-px-6 bear-text-lg"
+}, b = "bear-bg-[var(--bear-primary-500)] bear-text-[var(--bear-text-inverted,#fff)] bear-border-[var(--bear-primary-500)] bear-shadow-sm", t = "bear-inline-flex bear-items-center bear-justify-center bear-font-medium bear-rounded-md bear-border bear-transition-all bear-duration-200 bear-border-[var(--bear-border-default)] bear-bg-[var(--bear-bg-primary)] bear-text-[var(--bear-text-primary)] hover:bear-bg-[var(--bear-bg-tertiary)]", o = "bear-inline-flex bear-rounded-lg bear-border bear-border-[var(--bear-border-default)] bear-bg-[var(--bear-bg-secondary)] bear-overflow-hidden";
+export {
+  t as TOGGLE_BUTTON_BASE_CLASSES,
+  o as TOGGLE_BUTTON_GROUP_BASE_CLASSES,
+  e as TOGGLE_BUTTON_GROUP_ROOT_CLASS,
+  r as TOGGLE_BUTTON_ROOT_CLASS,
+  b as TOGGLE_BUTTON_SELECTED_CLASSES,
+  a as TOGGLE_BUTTON_SIZE_CLASSES
+};

package/dist/components/ToggleButton/ToggleButton.d.ts

@@ -0,0 +1,3 @@
+import { ToggleButtonProps, ToggleButtonGroupProps } from './ToggleButton.types';
+export declare const ToggleButton: ({ value, selected: selectedProp, size: sizeProp, fullWidth, disabled: disabledProp, className, children, id, testId, onClick, ...props }: ToggleButtonProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ToggleButtonGroup: ({ value: controlledValue, defaultValue, onChange, exclusive, size, fullWidth, disabled, className, children, id, testId, }: ToggleButtonGroupProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/ToggleButton/ToggleButton.js

@@ -0,0 +1,89 @@
+import { jsx as O } from "react/jsx-runtime";
+import { createContext as N, useState as U, Children as C, isValidElement as y, cloneElement as V, useContext as z } from "react";
+import { cn as G } from "../../utils/cn.js";
+import { resolveBearId as L } from "../../utils/generateBearId.utils.js";
+import { useBearId as b } from "../../utils/useBearId.js";
+import { TOGGLE_BUTTON_SELECTED_CLASSES as R, TOGGLE_BUTTON_SIZE_CLASSES as v, TOGGLE_BUTTON_BASE_CLASSES as x, TOGGLE_BUTTON_ROOT_CLASS as P, TOGGLE_BUTTON_GROUP_BASE_CLASSES as w, TOGGLE_BUTTON_GROUP_ROOT_CLASS as j } from "./ToggleButton.const.js";
+const A = N(null), D = () => z(A), K = ({
+  value: t,
+  selected: u,
+  size: o,
+  fullWidth: a = !1,
+  disabled: T = !1,
+  className: d,
+  children: i,
+  id: c,
+  testId: f,
+  onClick: n,
+  ...S
+}) => {
+  const _ = b("ToggleButton"), m = L(c, _), e = D(), p = o ?? (e == null ? void 0 : e.size) ?? "md", s = T || (e == null ? void 0 : e.disabled) || !1, E = u ?? (e == null ? void 0 : e.selectedValues.includes(t)) ?? !1;
+  return /* @__PURE__ */ O(
+    "button",
+    {
+      type: "button",
+      id: m,
+      "data-testid": f,
+      "aria-pressed": E,
+      disabled: s,
+      onClick: (r) => {
+        s || e == null || e.toggleValue(t), n == null || n(r);
+      },
+      className: G(
+        P,
+        x,
+        v[p],
+        E && R,
+        a && "bear-flex-1",
+        s && "bear-opacity-50 bear-cursor-not-allowed",
+        d
+      ),
+      ...S,
+      children: i
+    }
+  );
+}, B = (t) => t ? Array.isArray(t) ? t : [t] : [], M = ({
+  value: t,
+  defaultValue: u,
+  onChange: o,
+  exclusive: a = !0,
+  size: T = "md",
+  fullWidth: d = !1,
+  disabled: i = !1,
+  className: c,
+  children: f,
+  id: n,
+  testId: S
+}) => {
+  const _ = b("ToggleButtonGroup"), m = L(n, _), [e, p] = U(() => B(u)), s = t !== void 0 ? B(t) : e, g = {
+    selectedValues: s,
+    toggleValue: (r) => {
+      let l;
+      a ? l = [r] : l = s.includes(r) ? s.filter((I) => I !== r) : [...s, r], t === void 0 && p(l), o == null || o(a ? l[0] ?? "" : l);
+    },
+    size: T,
+    disabled: i
+  };
+  return /* @__PURE__ */ O(A.Provider, { value: g, children: /* @__PURE__ */ O(
+    "div",
+    {
+      id: m,
+      "data-testid": S,
+      role: "group",
+      className: G(
+        j,
+        w,
+        d && "bear-w-full",
+        i && "bear-opacity-50 bear-pointer-events-none",
+        c
+      ),
+      children: C.map(f, (r) => y(r) ? V(r, {
+        fullWidth: r.props.fullWidth ?? d
+      }) : r)
+    }
+  ) });
+};
+export {
+  K as ToggleButton,
+  M as ToggleButtonGroup
+};