@forgedevstack/bear 1.2.9 → 1.3.1

package/dist/components/SignPad/SignPad.js

@@ -1,159 +1,165 @@
-import { jsxs as T, jsx as d } from "react/jsx-runtime";
-import { useRef as p, useState as B, useEffect as D, useCallback as l } from "react";
-import { cn as _ } from "../../utils/cn.js";
-import { Button as M } from "../Button/Button.js";
-import { SIGN_PAD_DEFAULT_HEIGHT as q, SIGN_PAD_DEFAULT_STROKE_WIDTH as Z, SIGN_PAD_DEFAULT_PLACEHOLDER as $, SIGN_PAD_DEFAULT_OUTPUT_FORMAT as ee, SIGN_PAD_DEFAULT_OUTPUT_QUALITY as te, SIGN_PAD_BG_DARK as re, SIGN_PAD_BG_LIGHT as ne, SIGN_PAD_STROKE_DARK as oe, SIGN_PAD_STROKE_LIGHT as se, SIGN_PAD_PLACEHOLDER_CLASSES as ae, SIGN_PAD_LINE_CLASSES as ce, SIGN_PAD_X_MARK_CLASSES as ie, SIGN_PAD_CANVAS_WRAPPER_HOVER as le, SIGN_PAD_CANVAS_WRAPPER_CLASSES as ue, SIGN_PAD_ACTIONS_CLASSES as de, SIGN_PAD_ROOT_CLASSES as _e } from "./SignPad.const.js";
-const Pe = (U) => {
+import { jsxs as T, jsx as l } from "react/jsx-runtime";
+import { useRef as f, useState as F, useEffect as b, useCallback as i } from "react";
+import { cn as u } from "../../utils/cn.js";
+import { Button as H } from "../Button/Button.js";
+import { SIGN_PAD_DEFAULT_HEIGHT as re, SIGN_PAD_DEFAULT_STROKE_WIDTH as te, SIGN_PAD_DEFAULT_PLACEHOLDER as ne, SIGN_PAD_DEFAULT_OUTPUT_FORMAT as ae, SIGN_PAD_DEFAULT_OUTPUT_QUALITY as se, SIGN_PAD_BG_DARK as oe, SIGN_PAD_BG_LIGHT as ce, SIGN_PAD_EMPTY_SIZE as o, SIGN_PAD_STROKE_DARK as ie, SIGN_PAD_STROKE_LIGHT as le, SIGN_PAD_OVERLAY_STYLE as L, SIGN_PAD_OVERLAY_POINTER_CLASS as G, SIGN_PAD_PLACEHOLDER_CLASSES as ue, SIGN_PAD_LINE_CLASSES as _e, SIGN_PAD_X_MARK_CLASSES as de, SIGN_PAD_CANVAS_WRAPPER_HOVER as Se, SIGN_PAD_CANVAS_WRAPPER_CLASSES as fe, SIGN_PAD_ACTIONS_CLASSES as Ae, SIGN_PAD_ROOT_CLASSES as Pe } from "./SignPad.const.js";
+import { fillCanvasBackground as De, resolveDrawClientPoint as ve, getCanvasPoint as he, strokeCanvasDot as Ee, strokeCanvasSegment as Ne, isDocumentDarkMode as me, syncCanvasSize as pe } from "./SignPad.utils.js";
+const Le = (K) => {
   const {
-    onChange: o,
+    onChange: n,
     width: w,
-    height: m = q,
-    strokeColor: F,
-    strokeWidth: C = Z,
-    backgroundColor: H,
-    placeholder: K = $,
-    disabled: n = !1,
-    readOnly: s = !1,
-    showClear: L = !0,
-    showSave: R = !1,
+    height: C = re,
+    strokeColor: z,
+    strokeWidth: A = te,
+    backgroundColor: V,
+    placeholder: Y = ne,
+    disabled: a = !1,
+    readOnly: c = !1,
+    showClear: k = !0,
+    showSave: O = !1,
     clearText: W = "Clear",
-    saveText: z = "Save",
-    outputFormat: f = ee,
-    outputQuality: v = te,
-    className: X,
-    testId: Y,
-    ...V
-  } = U, a = p(null), I = p(null), A = p(null), P = p(!1), [h, G] = B(!1), [E, j] = B(!1);
-  D(() => {
+    saveText: j = "Save",
+    outputFormat: P = ae,
+    outputQuality: D = se,
+    className: Q,
+    testId: X,
+    ...Z
+  } = K, s = f(null), M = f(null), v = f(null), h = f(!1), _ = f(!1), [d, I] = F(!1), [g, q] = F(!1);
+  b(() => {
     const e = () => {
-      j(document.documentElement.classList.contains("dark"));
+      q(me());
     };
     e();
-    const t = new MutationObserver(e);
-    return t.observe(document.documentElement, { attributes: !0, attributeFilter: ["class"] }), () => t.disconnect();
+    const r = new MutationObserver(e);
+    return r.observe(document.documentElement, { attributes: !0, attributeFilter: ["class"] }), () => r.disconnect();
   }, []);
-  const k = F || (E ? oe : se), b = H || (E ? re : ne), u = l(() => {
-    const e = a.current, t = e == null ? void 0 : e.getContext("2d");
-    !e || !t || (t.fillStyle = b === "transparent" ? "rgba(0,0,0,0)" : b, t.fillRect(0, 0, e.width, e.height));
-  }, [b]);
-  D(() => {
-    const e = a.current, t = I.current;
-    if (!e || !t) return;
-    const r = () => {
-      const i = t.getBoundingClientRect(), S = w ?? Math.round(i.width), y = m;
-      (e.width !== S || e.height !== y) && (e.width = S, e.height = y, u());
+  const E = z || (g ? ie : le), N = V || (g ? oe : ce), m = i(() => {
+    const e = s.current;
+    e && De(e, N);
+  }, [N]);
+  b(() => {
+    const e = s.current, r = M.current;
+    if (!e || !r) return;
+    const t = () => {
+      const ee = r.getBoundingClientRect(), U = w ?? Math.round(ee.width), x = C;
+      U <= o || x <= o || pe(e, U, x, N, _.current);
     };
-    r();
-    const c = new ResizeObserver(r);
-    return c.observe(t), () => c.disconnect();
-  }, [w, m, u]), D(() => {
-    u();
-  }, [u, E]), D(() => {
-    const e = a.current;
-    if (!e || n || s) return;
-    const t = (r) => r.preventDefault();
-    return e.addEventListener("touchstart", t, { passive: !1 }), e.addEventListener("touchmove", t, { passive: !1 }), () => {
-      e.removeEventListener("touchstart", t), e.removeEventListener("touchmove", t);
-    };
-  }, [n, s]);
-  const g = l((e) => {
-    const t = a.current;
-    if (!t) return { x: 0, y: 0 };
-    const r = t.getBoundingClientRect(), c = t.width / r.width, i = t.height / r.height;
-    if ("touches" in e) {
-      const S = e.touches[0];
-      return {
-        x: (S.clientX - r.left) * c,
-        y: (S.clientY - r.top) * i
-      };
-    }
-    return {
-      x: (e.clientX - r.left) * c,
-      y: (e.clientY - r.top) * i
-    };
-  }, []), x = l((e) => {
-    if (n || s) return;
-    const t = g(e);
-    P.current = !0, A.current = t;
-  }, [n, s, g]), O = l((e) => {
-    if (!P.current || n || s) return;
-    const t = a.current, r = t == null ? void 0 : t.getContext("2d"), c = A.current;
-    if (!t || !r || !c) return;
-    const i = g(e);
-    r.beginPath(), r.moveTo(c.x, c.y), r.lineTo(i.x, i.y), r.strokeStyle = k, r.lineWidth = C, r.lineCap = "round", r.lineJoin = "round", r.stroke(), A.current = i, G(!0);
-  }, [n, s, k, C, g]), N = l(() => {
-    if (P.current) {
-      const e = a.current;
-      if (e && o) {
-        const t = e.toDataURL(f, v);
-        o(t);
+    t();
+    const S = new ResizeObserver(t);
+    return S.observe(r), () => S.disconnect();
+  }, [w, C, N]), b(() => {
+    _.current || m();
+  }, [m, g]);
+  const p = i((e) => {
+    const r = s.current;
+    if (!r) return { x: o, y: o };
+    const t = ve(e);
+    return t ? he(r, t.x, t.y) : { x: o, y: o };
+  }, []), y = i((e) => {
+    if (a || c) return;
+    e.preventDefault();
+    const r = s.current, t = p(e);
+    h.current = !0, v.current = t, r && (Ee(r, t, E, A), _.current = !0, I(!0));
+  }, [a, c, p, E, A]), B = i((e) => {
+    if (!h.current || a || c) return;
+    e.preventDefault();
+    const r = s.current, t = v.current;
+    if (!r || !t) return;
+    const S = p(e);
+    Ne(r, t, S, E, A), v.current = S, _.current = !0, I(!0);
+  }, [a, c, E, A, p]), R = i(() => {
+    if (h.current) {
+      const e = s.current;
+      if (e && n) {
+        const r = e.toDataURL(P, D);
+        n(r);
       }
     }
-    P.current = !1, A.current = null;
-  }, [o, f, v]), Q = l(() => {
-    const e = a.current, t = e == null ? void 0 : e.getContext("2d");
-    !e || !t || (t.clearRect(0, 0, e.width, e.height), u(), G(!1), o == null || o(null));
-  }, [u, o]), J = l(() => {
-    const e = a.current;
-    if (!e || !h) return;
-    const t = e.toDataURL(f, v);
-    o == null || o(t);
-  }, [h, o, f, v]);
+    h.current = !1, v.current = null;
+  }, [n, P, D]), J = i(() => {
+    const e = s.current, r = e == null ? void 0 : e.getContext("2d");
+    !e || !r || (r.clearRect(o, o, e.width, e.height), m(), _.current = !1, I(!1), n == null || n(null));
+  }, [m, n]), $ = i(() => {
+    const e = s.current;
+    if (!e || !d) return;
+    const r = e.toDataURL(P, D);
+    n == null || n(r);
+  }, [d, n, P, D]);
   return /* @__PURE__ */ T(
     "div",
     {
-      "data-testid": Y,
-      className: _(
+      "data-testid": X,
+      className: u(
         "Bear-SignPad bear-w-full",
-        _e,
-        n && "Bear-SignPad--disabled bear-opacity-50",
-        s && "Bear-SignPad--readonly",
-        X
+        Pe,
+        a && "Bear-SignPad--disabled bear-opacity-50",
+        c && "Bear-SignPad--readonly",
+        Q
       ),
-      ...V,
+      ...Z,
       children: [
         /* @__PURE__ */ T(
           "div",
           {
-            ref: I,
-            className: _(
+            ref: M,
+            className: u(
               "Bear-SignPad__canvas-wrapper bear-w-full bear-overflow-hidden",
               "bear-touch-none",
-              ue,
-              !n && !s && le,
-              n && "bear-cursor-not-allowed",
-              !n && !s && "bear-cursor-crosshair"
+              fe,
+              !a && !c && Se,
+              a && "bear-cursor-not-allowed",
+              !a && !c && "bear-cursor-crosshair"
             ),
+            onMouseDown: y,
+            onMouseMove: B,
+            onMouseUp: R,
+            onMouseLeave: R,
+            onTouchStart: y,
+            onTouchMove: B,
+            onTouchEnd: R,
             children: [
-              /* @__PURE__ */ d(
+              /* @__PURE__ */ l(
                 "canvas",
                 {
-                  ref: a,
+                  ref: s,
                   className: "Bear-SignPad__canvas bear-block bear-rounded-lg bear-w-full bear-touch-none",
-                  style: { height: m },
-                  onMouseDown: x,
-                  onMouseMove: O,
-                  onMouseUp: N,
-                  onMouseLeave: N,
-                  onTouchStart: x,
-                  onTouchMove: O,
-                  onTouchEnd: N
+                  style: { height: C }
+                }
+              ),
+              !d && /* @__PURE__ */ l(
+                "div",
+                {
+                  className: u("Bear-SignPad__placeholder", ue, G),
+                  style: L,
+                  children: Y
                 }
               ),
-              !h && /* @__PURE__ */ d("div", { className: _("Bear-SignPad__placeholder", ae), children: K }),
-              /* @__PURE__ */ d("div", { className: _("Bear-SignPad__line", ce) }),
-              /* @__PURE__ */ d("span", { className: _("Bear-SignPad__x-mark", ie), children: "×" })
+              /* @__PURE__ */ l(
+                "div",
+                {
+                  className: u("Bear-SignPad__line", _e, G),
+                  style: L
+                }
+              ),
+              /* @__PURE__ */ l(
+                "span",
+                {
+                  className: u("Bear-SignPad__x-mark", de, G),
+                  style: L,
+                  children: "×"
+                }
+              )
             ]
           }
         ),
-        (L || R) && /* @__PURE__ */ T("div", { className: _("Bear-SignPad__actions", de), children: [
-          L && /* @__PURE__ */ d(M, { size: "sm", variant: "ghost", onClick: Q, disabled: n || !h, children: W }),
-          R && /* @__PURE__ */ d(M, { size: "sm", variant: "primary", onClick: J, disabled: n || !h, children: z })
+        (k || O) && /* @__PURE__ */ T("div", { className: u("Bear-SignPad__actions", Ae), children: [
+          k && /* @__PURE__ */ l(H, { size: "sm", variant: "ghost", onClick: J, disabled: a || !d, children: W }),
+          O && /* @__PURE__ */ l(H, { size: "sm", variant: "primary", onClick: $, disabled: a || !d, children: j })
         ] })
       ]
     }
   );
 };
 export {
-  Pe as SignPad
+  Le as SignPad
 };

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

@@ -1,4 +1,5 @@
-import { HTMLAttributes } from 'react';
+import { HTMLAttributes, MouseEvent, TouchEvent } from 'react';
+export type SignPadDrawEvent = MouseEvent<HTMLDivElement> | TouchEvent<HTMLDivElement>;
 export interface SignPadProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
     /** Callback when signature changes - receives base64 image data */
     onChange?: (signature: string | null) => void;

package/dist/components/SignPad/SignPad.utils.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./SignPad.const.cjs"),c=t=>t==="transparent"?e.SIGN_PAD_TRANSPARENT_FILL:t,I=(t,i)=>{const n=t.getContext("2d");n&&(n.fillStyle=c(i),n.fillRect(e.SIGN_PAD_EMPTY_SIZE,e.SIGN_PAD_EMPTY_SIZE,t.width,t.height))},P=(t,i,n,_,s)=>{var l,r;if(t.width===i&&t.height===n)return;const o=s&&t.width>e.SIGN_PAD_EMPTY_SIZE&&t.height>e.SIGN_PAD_EMPTY_SIZE,S=document.createElement("canvas");o&&(S.width=t.width,S.height=t.height,(l=S.getContext("2d"))==null||l.drawImage(t,e.SIGN_PAD_EMPTY_SIZE,e.SIGN_PAD_EMPTY_SIZE)),t.width=i,t.height=n,I(t,_),o&&((r=t.getContext("2d"))==null||r.drawImage(S,e.SIGN_PAD_EMPTY_SIZE,e.SIGN_PAD_EMPTY_SIZE,i,n))},h=(t,i,n)=>{const _=t.getBoundingClientRect(),s=_.width===e.SIGN_PAD_EMPTY_SIZE?e.SIGN_PAD_UNIT_SCALE:t.width/_.width,o=_.height===e.SIGN_PAD_EMPTY_SIZE?e.SIGN_PAD_UNIT_SCALE:t.height/_.height;return{x:(i-_.left)*s,y:(n-_.top)*o}},u=(t,i,n,_,s)=>{const o=t.getContext("2d");o&&(o.beginPath(),o.moveTo(i.x,i.y),o.lineTo(n.x,n.y),o.strokeStyle=_,o.lineWidth=s,o.lineCap="round",o.lineJoin="round",o.stroke())},E=(t,i,n,_)=>{const s=t.getContext("2d");s&&(s.beginPath(),s.fillStyle=n,s.arc(i.x,i.y,_/e.SIGN_PAD_STROKE_RADIUS_DIVISOR,e.SIGN_PAD_EMPTY_SIZE,e.SIGN_PAD_FULL_CIRCLE_RADIANS),s.fill())},D=t=>t.touches&&t.touches.length>e.SIGN_PAD_EMPTY_SIZE?{x:t.touches[0].clientX,y:t.touches[0].clientY}:t.changedTouches&&t.changedTouches.length>e.SIGN_PAD_EMPTY_SIZE?{x:t.changedTouches[0].clientX,y:t.changedTouches[0].clientY}:typeof t.clientX=="number"&&typeof t.clientY=="number"?{x:t.clientX,y:t.clientY}:null,d=()=>{const t=document.documentElement.classList;return t.contains(e.SIGN_PAD_HTML_DARK_CLASS)||t.contains(e.SIGN_PAD_BEAR_DARK_CLASS)};exports.fillCanvasBackground=I;exports.getCanvasPoint=h;exports.isDocumentDarkMode=d;exports.resolveCanvasFill=c;exports.resolveDrawClientPoint=D;exports.strokeCanvasDot=E;exports.strokeCanvasSegment=u;exports.syncCanvasSize=P;

package/dist/components/SignPad/SignPad.utils.d.ts

@@ -0,0 +1,34 @@
+export declare const resolveCanvasFill: (backgroundColor: string) => string;
+export declare const fillCanvasBackground: (canvas: HTMLCanvasElement, backgroundColor: string) => void;
+export declare const syncCanvasSize: (canvas: HTMLCanvasElement, width: number, height: number, backgroundColor: string, preserve: boolean) => void;
+export declare const getCanvasPoint: (canvas: HTMLCanvasElement, clientX: number, clientY: number) => {
+    x: number;
+    y: number;
+};
+export declare const strokeCanvasSegment: (canvas: HTMLCanvasElement, from: {
+    x: number;
+    y: number;
+}, to: {
+    x: number;
+    y: number;
+}, strokeColor: string, strokeWidth: number) => void;
+export declare const strokeCanvasDot: (canvas: HTMLCanvasElement, point: {
+    x: number;
+    y: number;
+}, strokeColor: string, strokeWidth: number) => void;
+export declare const resolveDrawClientPoint: (event: {
+    clientX?: number;
+    clientY?: number;
+    touches?: ArrayLike<{
+        clientX: number;
+        clientY: number;
+    }>;
+    changedTouches?: ArrayLike<{
+        clientX: number;
+        clientY: number;
+    }>;
+}) => {
+    x: number;
+    y: number;
+} | null;
+export declare const isDocumentDarkMode: () => boolean;

package/dist/components/SignPad/SignPad.utils.js

@@ -0,0 +1,42 @@
+import { SIGN_PAD_EMPTY_SIZE as o, SIGN_PAD_UNIT_SCALE as u, SIGN_PAD_STROKE_RADIUS_DIVISOR as d, SIGN_PAD_FULL_CIRCLE_RADIANS as g, SIGN_PAD_HTML_DARK_CLASS as _, SIGN_PAD_BEAR_DARK_CLASS as S, SIGN_PAD_TRANSPARENT_FILL as A } from "./SignPad.const.js";
+const C = (t) => t === "transparent" ? A : t, f = (t, i) => {
+  const e = t.getContext("2d");
+  e && (e.fillStyle = C(i), e.fillRect(o, o, t.width, t.height));
+}, x = (t, i, e, c, l) => {
+  var s, h;
+  if (t.width === i && t.height === e)
+    return;
+  const n = l && t.width > o && t.height > o, r = document.createElement("canvas");
+  n && (r.width = t.width, r.height = t.height, (s = r.getContext("2d")) == null || s.drawImage(t, o, o)), t.width = i, t.height = e, f(t, c), n && ((h = t.getContext("2d")) == null || h.drawImage(r, o, o, i, e));
+}, D = (t, i, e) => {
+  const c = t.getBoundingClientRect(), l = c.width === o ? u : t.width / c.width, n = c.height === o ? u : t.height / c.height;
+  return {
+    x: (i - c.left) * l,
+    y: (e - c.top) * n
+  };
+}, P = (t, i, e, c, l) => {
+  const n = t.getContext("2d");
+  n && (n.beginPath(), n.moveTo(i.x, i.y), n.lineTo(e.x, e.y), n.strokeStyle = c, n.lineWidth = l, n.lineCap = "round", n.lineJoin = "round", n.stroke());
+}, m = (t, i, e, c) => {
+  const l = t.getContext("2d");
+  l && (l.beginPath(), l.fillStyle = e, l.arc(
+    i.x,
+    i.y,
+    c / d,
+    o,
+    g
+  ), l.fill());
+}, y = (t) => t.touches && t.touches.length > o ? { x: t.touches[0].clientX, y: t.touches[0].clientY } : t.changedTouches && t.changedTouches.length > o ? { x: t.changedTouches[0].clientX, y: t.changedTouches[0].clientY } : typeof t.clientX == "number" && typeof t.clientY == "number" ? { x: t.clientX, y: t.clientY } : null, R = () => {
+  const t = document.documentElement.classList;
+  return t.contains(_) || t.contains(S);
+};
+export {
+  f as fillCanvasBackground,
+  D as getCanvasPoint,
+  R as isDocumentDarkMode,
+  C as resolveCanvasFill,
+  y as resolveDrawClientPoint,
+  m as strokeCanvasDot,
+  P as strokeCanvasSegment,
+  x as syncCanvasSize
+};

package/dist/components/Snackbar/Snackbar.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),K=require("react-dom"),w=require("../../utils/cn.cjs");require("react");const z=require("../../utils/generateBearId.utils.cjs"),L=require("../../utils/useBearId.cjs"),U=require("../../utils/liveRegion.utils.cjs"),X=require("../Paper/Paper.cjs"),d=require("../Flex/Flex.cjs"),B=require("../Typography/Typography.cjs"),Z=require("../Progress/Progress.cjs"),H=require("../CloseButton/CloseButton.cjs"),s=require("./Snackbar.const.cjs"),M=require("./hooks/useSnackbar.cjs"),G=(i,a,o,t)=>{const e={zIndex:s.SNACKBAR_Z_INDEX};return i==="top"?e.top=t:e.bottom=t,a==="left"?(e.left=o,e.right="auto"):a==="right"?(e.right=o,e.left="auto"):(e.left="50%",e.right="auto",e.transform="translateX(-50%)"),e},V=i=>{const{open:a,message:o,description:t,severity:e="default",action:u,autoHideDuration:h=s.SNACKBAR_DEFAULT_AUTO_HIDE_MS,onClose:c,anchorOrigin:b={vertical:"bottom",horizontal:"center"},offsetX:A=s.SNACKBAR_DEFAULT_OFFSET_X,offsetY:x=s.SNACKBAR_DEFAULT_OFFSET_Y,size:C="md",progress:N=null,progressPosition:_="bottom",progressColor:k="default",countdownProgress:v=!1,showCloseButton:y,closeOnClickOutside:R,container:q,id:I,testId:O,className:D}=i,F=L.useBearId("Snackbar"),P=z.resolveBearId(I,F),g=q??(typeof document<"u"?document.body:null),n=!!c,j=y??n,S=R??n,{surfaceRef:E,progressValue:m}=M.useSnackbar({open:a,autoHideDuration:h,onClose:c,countdownProgress:v,staticProgress:N,closeOnClickOutside:S});if(!a||!g)return null;const p=U.getBearLiveRegionProps(e),l=typeof m=="number",f=l?r.jsx(Z.Progress,{value:m,size:"sm",color:k,className:"Bear-Snackbar__progress"}):null,T=r.jsxs(r.Fragment,{children:[S&&n&&r.jsx("div",{className:"Bear-Snackbar__backdrop bear-fixed bear-inset-0",style:{zIndex:s.SNACKBAR_BACKDROP_Z_INDEX},"aria-hidden":!0}),r.jsxs(X.Paper,{ref:E,id:P,"data-testid":O,role:p.role,"aria-live":p["aria-live"],elevation:4,rounded:"lg",padding:"none",background:"transparent",className:w.cn(s.SNACKBAR_ROOT_CLASS,s.SNACKBAR_SURFACE_CLASSES,"bear-fixed bear-flex bear-flex-col bear-overflow-hidden","bear-border bear-border-[var(--bear-border-default)]",s.SNACKBAR_SIZE_PADDING[C],D),style:G(b.vertical,b.horizontal,A,x),children:[l&&_==="top"&&f,r.jsxs(d.Flex,{className:"Bear-Snackbar__content bear-w-full",align:"center",gap:3,children:[r.jsxs(d.Flex,{direction:"column",className:"Bear-Snackbar__text bear-flex-1 bear-min-w-0",gap:1,children:[o&&r.jsx(B.Typography,{variant:"body2",className:"Bear-Snackbar__message",children:o}),t&&r.jsx(B.Typography,{variant:"caption",color:"muted",className:"Bear-Snackbar__description",children:t})]}),u&&r.jsx(d.Flex,{className:"Bear-Snackbar__action bear-shrink-0",align:"center",children:u}),j&&n&&r.jsx(H.CloseButton,{size:"sm",onClick:c,"aria-label":"Dismiss notification",className:"Bear-Snackbar__close bear-shrink-0"})]}),l&&_==="bottom"&&f]})]});return K.createPortal(T,g)};exports.Snackbar=V;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),j=require("react-dom"),L=require("../../utils/cn.cjs");require("react");const w=require("../../utils/generateBearId.utils.cjs"),z=require("../../utils/useBearId.cjs"),U=require("../../utils/liveRegion.utils.cjs"),X=require("../Paper/Paper.cjs"),u=require("../Flex/Flex.cjs"),C=require("../Typography/Typography.cjs"),M=require("../Progress/Progress.cjs"),Z=require("../CloseButton/CloseButton.cjs"),r=require("./Snackbar.const.cjs"),G=require("./hooks/useSnackbar.cjs"),H=(i,o,a,t)=>{const e={zIndex:r.SNACKBAR_Z_INDEX};return i==="top"?e.top=t:e.bottom=t,o==="left"?(e.left=a,e.right="auto"):o==="right"?(e.right=a,e.left="auto"):(e.left="50%",e.right="auto",e.transform="translateX(-50%)"),e},V=i=>{const{open:o,message:a,description:t,severity:e="default",action:d,autoHideDuration:p=r.SNACKBAR_DEFAULT_AUTO_HIDE_MS,onClose:c,anchorOrigin:_={vertical:"bottom",horizontal:"center"},offsetX:N=r.SNACKBAR_DEFAULT_OFFSET_X,offsetY:R=r.SNACKBAR_DEFAULT_OFFSET_Y,size:f="md",progress:h=null,progressPosition:S="bottom",progressColor:x="default",countdownProgress:k=!1,showCloseButton:O,closeOnClickOutside:I,container:E,id:y,testId:D,className:v}=i,P=z.useBearId("Snackbar"),q=w.resolveBearId(y,P),g=E??(typeof document<"u"?document.body:null),n=!!c,F=O??n,b=I??n,{surfaceRef:K,progressValue:A}=G.useSnackbar({open:o,autoHideDuration:p,onClose:c,countdownProgress:k,staticProgress:h,closeOnClickOutside:b});if(!o||!g)return null;const m=U.getBearLiveRegionProps(e),l=typeof A=="number",B=l?s.jsx(M.Progress,{value:A,size:"sm",color:x,className:"Bear-Snackbar__progress"}):null,T=s.jsxs(s.Fragment,{children:[b&&n&&s.jsx("div",{className:"Bear-Snackbar__backdrop bear-fixed bear-inset-0",style:{zIndex:r.SNACKBAR_BACKDROP_Z_INDEX},"aria-hidden":!0}),s.jsxs(X.Paper,{ref:K,id:q,"data-testid":D,role:m.role,"aria-live":m["aria-live"],elevation:4,rounded:"lg",padding:"none",background:r.SNACKBAR_PAPER_BACKGROUND,className:L.cn(r.SNACKBAR_ROOT_CLASS,r.SNACKBAR_SEVERITY_MODIFIER[e],r.SNACKBAR_SURFACE_CLASSES,r.SNACKBAR_BORDER_CLASSES,"bear-fixed bear-flex bear-flex-col bear-overflow-hidden",r.SNACKBAR_SIZE_PADDING[f],v),style:H(_.vertical,_.horizontal,N,R),children:[l&&S==="top"&&B,s.jsxs(u.Flex,{className:"Bear-Snackbar__content bear-w-full",align:"center",gap:3,children:[s.jsxs(u.Flex,{direction:"column",className:"Bear-Snackbar__text bear-flex-1 bear-min-w-0",gap:1,children:[a&&s.jsx(C.Typography,{variant:"body2",className:"Bear-Snackbar__message",children:a}),t&&s.jsx(C.Typography,{variant:"caption",color:r.SNACKBAR_DESCRIPTION_COLOR,className:"Bear-Snackbar__description",children:t})]}),d&&s.jsx(u.Flex,{className:"Bear-Snackbar__action bear-shrink-0",align:"center",children:d}),F&&n&&s.jsx(Z.CloseButton,{size:"sm",onClick:c,"aria-label":"Dismiss notification",className:"Bear-Snackbar__close bear-shrink-0"})]}),l&&S==="bottom"&&B]})]});return j.createPortal(T,g)};exports.Snackbar=V;

package/dist/components/Snackbar/Snackbar.const.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A="Bear-Snackbar",_=6e3,S=24,R=24,C=1400,N=1399,E={sm:"bear-px-3 bear-py-2",md:"bear-px-4 bear-py-3",lg:"bear-px-5 bear-py-4"},K="bear-bg-[var(--bear-bg-primary)] bear-text-[var(--bear-text-primary)]",B=50,r=100,e=0;exports.SNACKBAR_BACKDROP_Z_INDEX=N;exports.SNACKBAR_COUNTDOWN_TICK_MS=B;exports.SNACKBAR_DEFAULT_AUTO_HIDE_MS=_;exports.SNACKBAR_DEFAULT_OFFSET_X=S;exports.SNACKBAR_DEFAULT_OFFSET_Y=R;exports.SNACKBAR_PROGRESS_MAX=r;exports.SNACKBAR_PROGRESS_MIN=e;exports.SNACKBAR_ROOT_CLASS=A;exports.SNACKBAR_SIZE_PADDING=E;exports.SNACKBAR_SURFACE_CLASSES=K;exports.SNACKBAR_Z_INDEX=C;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A="Bear-Snackbar",S=6e3,_=24,R=24,C=1400,N=1399,E={sm:"bear-px-3 bear-py-2",md:"bear-px-4 bear-py-3",lg:"bear-px-5 bear-py-4"},B="default",K="bear-shadow-xl",O="bear-border",D={default:`${A}--default`,success:`${A}--success`,info:`${A}--info`,warning:`${A}--warning`,error:`${A}--error`},e="secondary",o=50,s=100,n=0;exports.SNACKBAR_BACKDROP_Z_INDEX=N;exports.SNACKBAR_BORDER_CLASSES=O;exports.SNACKBAR_COUNTDOWN_TICK_MS=o;exports.SNACKBAR_DEFAULT_AUTO_HIDE_MS=S;exports.SNACKBAR_DEFAULT_OFFSET_X=_;exports.SNACKBAR_DEFAULT_OFFSET_Y=R;exports.SNACKBAR_DESCRIPTION_COLOR=e;exports.SNACKBAR_PAPER_BACKGROUND=B;exports.SNACKBAR_PROGRESS_MAX=s;exports.SNACKBAR_PROGRESS_MIN=n;exports.SNACKBAR_ROOT_CLASS=A;exports.SNACKBAR_SEVERITY_MODIFIER=D;exports.SNACKBAR_SIZE_PADDING=E;exports.SNACKBAR_SURFACE_CLASSES=K;exports.SNACKBAR_Z_INDEX=C;

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

@@ -1,3 +1,5 @@
+import { SnackbarSeverity } from './Snackbar.types';
+import { TypographyProps } from '../Typography/Typography.types';
 export declare const SNACKBAR_ROOT_CLASS = "Bear-Snackbar";
 export declare const SNACKBAR_DEFAULT_AUTO_HIDE_MS = 6000;
 export declare const SNACKBAR_DEFAULT_OFFSET_X = 24;
@@ -7,7 +9,11 @@ export declare const SNACKBAR_BACKDROP_Z_INDEX = 1399;
 export declare const SNACKBAR_ENTER_MS = 200;
 export declare const SNACKBAR_EXIT_MS = 150;
 export declare const SNACKBAR_SIZE_PADDING: Record<'sm' | 'md' | 'lg', string>;
-export declare const SNACKBAR_SURFACE_CLASSES = "bear-bg-[var(--bear-bg-primary)] bear-text-[var(--bear-text-primary)]";
+export declare const SNACKBAR_PAPER_BACKGROUND = "default";
+export declare const SNACKBAR_SURFACE_CLASSES = "bear-shadow-xl";
+export declare const SNACKBAR_BORDER_CLASSES = "bear-border";
+export declare const SNACKBAR_SEVERITY_MODIFIER: Record<SnackbarSeverity, string>;
+export declare const SNACKBAR_DESCRIPTION_COLOR: NonNullable<TypographyProps['color']>;
 export declare const SNACKBAR_COUNTDOWN_TICK_MS = 50;
 export declare const SNACKBAR_PROGRESS_MAX = 100;
 export declare const SNACKBAR_PROGRESS_MIN = 0;

package/dist/components/Snackbar/Snackbar.const.js

@@ -1,18 +1,28 @@
-const A = "Bear-Snackbar", _ = 6e3, S = 24, r = 24, R = 1400, a = 1399, C = {
+const A = "Bear-Snackbar", S = 6e3, _ = 24, R = 24, C = 1400, s = 1399, n = {
   sm: "bear-px-3 bear-py-2",
   md: "bear-px-4 bear-py-3",
   lg: "bear-px-5 bear-py-4"
-}, N = "bear-bg-[var(--bear-bg-primary)] bear-text-[var(--bear-text-primary)]", t = 50, e = 100, b = 0;
+}, o = "default", N = "bear-shadow-xl", r = "bear-border", c = {
+  default: `${A}--default`,
+  success: `${A}--success`,
+  info: `${A}--info`,
+  warning: `${A}--warning`,
+  error: `${A}--error`
+}, e = "secondary", E = 50, t = 100, B = 0;
 export {
-  a as SNACKBAR_BACKDROP_Z_INDEX,
-  t as SNACKBAR_COUNTDOWN_TICK_MS,
-  _ as SNACKBAR_DEFAULT_AUTO_HIDE_MS,
-  S as SNACKBAR_DEFAULT_OFFSET_X,
-  r as SNACKBAR_DEFAULT_OFFSET_Y,
-  e as SNACKBAR_PROGRESS_MAX,
-  b as SNACKBAR_PROGRESS_MIN,
+  s as SNACKBAR_BACKDROP_Z_INDEX,
+  r as SNACKBAR_BORDER_CLASSES,
+  E as SNACKBAR_COUNTDOWN_TICK_MS,
+  S as SNACKBAR_DEFAULT_AUTO_HIDE_MS,
+  _ as SNACKBAR_DEFAULT_OFFSET_X,
+  R as SNACKBAR_DEFAULT_OFFSET_Y,
+  e as SNACKBAR_DESCRIPTION_COLOR,
+  o as SNACKBAR_PAPER_BACKGROUND,
+  t as SNACKBAR_PROGRESS_MAX,
+  B as SNACKBAR_PROGRESS_MIN,
   A as SNACKBAR_ROOT_CLASS,
-  C as SNACKBAR_SIZE_PADDING,
+  c as SNACKBAR_SEVERITY_MODIFIER,
+  n as SNACKBAR_SIZE_PADDING,
   N as SNACKBAR_SURFACE_CLASSES,
-  R as SNACKBAR_Z_INDEX
+  C as SNACKBAR_Z_INDEX
 };