@forgedevstack/bear 1.1.1 → 1.1.4

package/dist/components/RingProgress/RingProgress.js

@@ -0,0 +1,67 @@
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import { cn as T } from "../../utils/cn.js";
+import "react";
+import { Typography as k } from "../Typography/Typography.js";
+import { DEFAULT_SIZE as x, TRACK_COLOR as N, DEFAULT_THICKNESS as O, ROOT_CLASS as S } from "./RingProgress.const.js";
+const j = ({
+  sections: d,
+  size: t = x,
+  thickness: a = O,
+  roundCaps: g = !1,
+  label: o,
+  rootColor: s,
+  className: v,
+  testId: y,
+  ...b
+}) => {
+  const l = d.reduce((r, i) => r + i.value, 0), c = (t - a) / 2, m = 2 * Math.PI * c, f = t / 2, h = t / 2;
+  let p = 0;
+  return /* @__PURE__ */ n(
+    "div",
+    {
+      className: T(S, v),
+      "data-testid": y,
+      ...b,
+      children: [
+        /* @__PURE__ */ n("svg", { width: t, height: t, className: "bear-rotate-[-90deg]", children: [
+          /* @__PURE__ */ e(
+            "circle",
+            {
+              cx: f,
+              cy: h,
+              r: c,
+              fill: "none",
+              strokeWidth: a,
+              className: s ? void 0 : N,
+              style: s ? { stroke: s } : void 0
+            }
+          ),
+          l > 0 && d.map((r, i) => {
+            const u = r.value / l * m, L = -p;
+            return p += u, /* @__PURE__ */ n("g", { children: [
+              /* @__PURE__ */ e(
+                "circle",
+                {
+                  cx: f,
+                  cy: h,
+                  r: c,
+                  fill: "none",
+                  strokeWidth: a,
+                  stroke: r.color,
+                  strokeDasharray: `${u} ${m}`,
+                  strokeDashoffset: L,
+                  strokeLinecap: g ? "round" : "butt"
+                }
+              ),
+              r.tooltip && /* @__PURE__ */ e("title", { children: r.tooltip })
+            ] }, i);
+          })
+        ] }),
+        o !== void 0 && /* @__PURE__ */ e("div", { className: "bear-absolute bear-inset-0 bear-flex bear-items-center bear-justify-center", children: typeof o == "string" ? /* @__PURE__ */ e(k, { variant: "body2", color: "secondary", children: o }) : o })
+      ]
+    }
+  );
+};
+export {
+  j as RingProgress
+};

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

@@ -0,0 +1,15 @@
+import { ReactNode, HTMLAttributes } from 'react';
+export interface RingProgressSection {
+    value: number;
+    color: string;
+    tooltip?: string;
+}
+export interface RingProgressProps extends HTMLAttributes<HTMLDivElement> {
+    sections: RingProgressSection[];
+    size?: number;
+    thickness?: number;
+    roundCaps?: boolean;
+    label?: ReactNode;
+    rootColor?: string;
+    testId?: string;
+}

package/dist/components/RingProgress/index.d.ts

@@ -0,0 +1,2 @@
+export { RingProgress, default } from './RingProgress';
+export type { RingProgressProps, RingProgressSection } from './RingProgress.types';

package/dist/components/SignPad/SignPad.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),a=require("react"),_=require("../../utils/cn.cjs"),G=require("../Button/Button.cjs"),s=require("./SignPad.const.cjs"),V=y=>{const{onChange:o,width:h=s.SIGN_PAD_DEFAULT_WIDTH,height:f=s.SIGN_PAD_DEFAULT_HEIGHT,strokeColor:B,strokeWidth:m=s.SIGN_PAD_DEFAULT_STROKE_WIDTH,backgroundColor:O,placeholder:U=s.SIGN_PAD_DEFAULT_PLACEHOLDER,disabled:r=!1,readOnly:c=!1,showClear:C=!0,showSave:L=!1,clearText:M="Clear",saveText:j="Save",outputFormat:A=s.SIGN_PAD_DEFAULT_OUTPUT_FORMAT,outputQuality:P=s.SIGN_PAD_DEFAULT_OUTPUT_QUALITY,className:F,testId:H,id:K,...W}=y,l=a.useRef(null),[D,N]=a.useState(!1),[u,I]=a.useState(!1),[v,E]=a.useState(null),[b,q]=a.useState(!1);a.useEffect(()=>{const e=()=>{const n=document.documentElement.classList.contains("dark");q(n)};e();const t=new MutationObserver(e);return t.observe(document.documentElement,{attributes:!0,attributeFilter:["class"]}),()=>t.disconnect()},[]);const x=B||(b?s.SIGN_PAD_STROKE_DARK:s.SIGN_PAD_STROKE_LIGHT),S=O||(b?s.SIGN_PAD_BG_DARK:s.SIGN_PAD_BG_LIGHT);a.useEffect(()=>{const e=l.current;if(!e)return;const t=e.getContext("2d");t&&(e.width=h,e.height=f,t.fillStyle=S,t.fillRect(0,0,h,f))},[h,f,S,b]),a.useEffect(()=>{const e=l.current;if(!e||r||c)return;const t=n=>n.preventDefault();return e.addEventListener("touchstart",t,{passive:!1}),e.addEventListener("touchmove",t,{passive:!1}),()=>{e.removeEventListener("touchstart",t),e.removeEventListener("touchmove",t)}},[r,c]);const g=a.useCallback(e=>{const t=l.current;if(!t)return{x:0,y:0};const n=t.getBoundingClientRect(),d=t.width/n.width,p=t.height/n.height;if("touches"in e){const w=e.touches[0];return{x:(w.clientX-n.left)*d,y:(w.clientY-n.top)*p}}return{x:(e.clientX-n.left)*d,y:(e.clientY-n.top)*p}},[]),k=a.useCallback(e=>{if(r||c)return;const t=g(e);N(!0),E(t)},[r,c,g]),R=a.useCallback(e=>{if(!D||r||c)return;const t=l.current,n=t==null?void 0:t.getContext("2d");if(!t||!n||!v)return;const d=g(e);n.beginPath(),n.moveTo(v.x,v.y),n.lineTo(d.x,d.y),n.strokeStyle=x,n.lineWidth=m,n.lineCap="round",n.lineJoin="round",n.stroke(),E(d),I(!0)},[D,r,c,v,x,m,g]),T=a.useCallback(()=>{if(D&&u){const e=l.current;if(e&&o){const t=e.toDataURL(A,P);o(t)}}N(!1),E(null)},[D,u,o,A,P]),X=a.useCallback(()=>{const e=l.current,t=e==null?void 0:e.getContext("2d");!e||!t||(t.fillStyle=S==="transparent"?"rgba(0,0,0,0)":S,t.clearRect(0,0,e.width,e.height),t.fillRect(0,0,e.width,e.height),I(!1),o==null||o(null))},[S,o]),Y=a.useCallback(()=>{const e=l.current;if(!e||!u)return;const t=e.toDataURL(A,P);o==null||o(t)},[u,o,A,P]);return i.jsxs("div",{id:K,"data-testid":H,className:_.cn("Bear-SignPad bear-max-w-full bear-w-full",s.SIGN_PAD_ROOT_CLASSES,r&&"Bear-SignPad--disabled bear-opacity-50",c&&"Bear-SignPad--readonly",F),...W,children:[i.jsxs("div",{className:_.cn("Bear-SignPad__canvas-wrapper bear-max-w-full bear-overflow-hidden","touch-none",s.SIGN_PAD_CANVAS_WRAPPER_CLASSES,!r&&!c&&s.SIGN_PAD_CANVAS_WRAPPER_HOVER,r&&"bear-cursor-not-allowed",!r&&!c&&"bear-cursor-crosshair"),children:[i.jsx("canvas",{ref:l,className:"Bear-SignPad__canvas bear-block bear-rounded-lg bear-max-w-full touch-none",style:{width:h,height:f,touchAction:"none"},onMouseDown:k,onMouseMove:R,onMouseUp:T,onMouseLeave:T,onTouchStart:k,onTouchMove:R,onTouchEnd:T}),!u&&i.jsx("div",{className:_.cn("Bear-SignPad__placeholder",s.SIGN_PAD_PLACEHOLDER_CLASSES),children:U}),i.jsx("div",{className:_.cn("Bear-SignPad__line",s.SIGN_PAD_LINE_CLASSES)}),i.jsx("span",{className:_.cn("Bear-SignPad__x-mark",s.SIGN_PAD_X_MARK_CLASSES),children:"×"})]}),(C||L)&&i.jsxs("div",{className:_.cn("Bear-SignPad__actions",s.SIGN_PAD_ACTIONS_CLASSES),children:[C&&i.jsx(G.Button,{size:"sm",variant:"ghost",onClick:X,disabled:r||!u,children:M}),L&&i.jsx(G.Button,{size:"sm",variant:"primary",onClick:Y,disabled:r||!u,children:j})]})]})};exports.SignPad=V;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),r=require("react"),S=require("../../utils/cn.cjs"),y=require("../Button/Button.cjs"),s=require("./SignPad.const.cjs"),V=B=>{const{onChange:a,width:p,height:b=s.SIGN_PAD_DEFAULT_HEIGHT,strokeColor:O,strokeWidth:T=s.SIGN_PAD_DEFAULT_STROKE_WIDTH,backgroundColor:M,placeholder:U=s.SIGN_PAD_DEFAULT_PLACEHOLDER,disabled:o=!1,readOnly:c=!1,showClear:N=!0,showSave:m=!1,clearText:j="Clear",saveText:F="Save",outputFormat:P=s.SIGN_PAD_DEFAULT_OUTPUT_FORMAT,outputQuality:v=s.SIGN_PAD_DEFAULT_OUTPUT_QUALITY,className:H,testId:K,id:q,...W}=B,i=r.useRef(null),w=r.useRef(null),A=r.useRef(null),g=r.useRef(!1),[h,L]=r.useState(!1),[E,z]=r.useState(!1);r.useEffect(()=>{const e=()=>{z(document.documentElement.classList.contains("dark"))};e();const t=new MutationObserver(e);return t.observe(document.documentElement,{attributes:!0,attributeFilter:["class"]}),()=>t.disconnect()},[]);const k=O||(E?s.SIGN_PAD_STROKE_DARK:s.SIGN_PAD_STROKE_LIGHT),C=M||(E?s.SIGN_PAD_BG_DARK:s.SIGN_PAD_BG_LIGHT),_=r.useCallback(()=>{const e=i.current,t=e==null?void 0:e.getContext("2d");!e||!t||(t.fillStyle=C==="transparent"?"rgba(0,0,0,0)":C,t.fillRect(0,0,e.width,e.height))},[C]);r.useEffect(()=>{const e=i.current,t=w.current;if(!e||!t)return;const n=()=>{const d=t.getBoundingClientRect(),f=p??Math.round(d.width),G=b;(e.width!==f||e.height!==G)&&(e.width=f,e.height=G,_())};n();const l=new ResizeObserver(n);return l.observe(t),()=>l.disconnect()},[p,b,_]),r.useEffect(()=>{_()},[_,E]),r.useEffect(()=>{const e=i.current;if(!e||o||c)return;const t=n=>n.preventDefault();return e.addEventListener("touchstart",t,{passive:!1}),e.addEventListener("touchmove",t,{passive:!1}),()=>{e.removeEventListener("touchstart",t),e.removeEventListener("touchmove",t)}},[o,c]);const D=r.useCallback(e=>{const t=i.current;if(!t)return{x:0,y:0};const n=t.getBoundingClientRect(),l=t.width/n.width,d=t.height/n.height;if("touches"in e){const f=e.touches[0];return{x:(f.clientX-n.left)*l,y:(f.clientY-n.top)*d}}return{x:(e.clientX-n.left)*l,y:(e.clientY-n.top)*d}},[]),I=r.useCallback(e=>{if(o||c)return;const t=D(e);g.current=!0,A.current=t},[o,c,D]),x=r.useCallback(e=>{if(!g.current||o||c)return;const t=i.current,n=t==null?void 0:t.getContext("2d"),l=A.current;if(!t||!n||!l)return;const d=D(e);n.beginPath(),n.moveTo(l.x,l.y),n.lineTo(d.x,d.y),n.strokeStyle=k,n.lineWidth=T,n.lineCap="round",n.lineJoin="round",n.stroke(),A.current=d,L(!0)},[o,c,k,T,D]),R=r.useCallback(()=>{if(g.current){const e=i.current;if(e&&a){const t=e.toDataURL(P,v);a(t)}}g.current=!1,A.current=null},[a,P,v]),X=r.useCallback(()=>{const e=i.current,t=e==null?void 0:e.getContext("2d");!e||!t||(t.clearRect(0,0,e.width,e.height),_(),L(!1),a==null||a(null))},[_,a]),Y=r.useCallback(()=>{const e=i.current;if(!e||!h)return;const t=e.toDataURL(P,v);a==null||a(t)},[h,a,P,v]);return u.jsxs("div",{id:q,"data-testid":K,className:S.cn("Bear-SignPad bear-w-full",s.SIGN_PAD_ROOT_CLASSES,o&&"Bear-SignPad--disabled bear-opacity-50",c&&"Bear-SignPad--readonly",H),...W,children:[u.jsxs("div",{ref:w,className:S.cn("Bear-SignPad__canvas-wrapper bear-w-full bear-overflow-hidden","touch-none",s.SIGN_PAD_CANVAS_WRAPPER_CLASSES,!o&&!c&&s.SIGN_PAD_CANVAS_WRAPPER_HOVER,o&&"bear-cursor-not-allowed",!o&&!c&&"bear-cursor-crosshair"),children:[u.jsx("canvas",{ref:i,className:"Bear-SignPad__canvas bear-block bear-rounded-lg bear-w-full touch-none",style:{height:b,touchAction:"none"},onMouseDown:I,onMouseMove:x,onMouseUp:R,onMouseLeave:R,onTouchStart:I,onTouchMove:x,onTouchEnd:R}),!h&&u.jsx("div",{className:S.cn("Bear-SignPad__placeholder",s.SIGN_PAD_PLACEHOLDER_CLASSES),children:U}),u.jsx("div",{className:S.cn("Bear-SignPad__line",s.SIGN_PAD_LINE_CLASSES)}),u.jsx("span",{className:S.cn("Bear-SignPad__x-mark",s.SIGN_PAD_X_MARK_CLASSES),children:"×"})]}),(N||m)&&u.jsxs("div",{className:S.cn("Bear-SignPad__actions",s.SIGN_PAD_ACTIONS_CLASSES),children:[N&&u.jsx(y.Button,{size:"sm",variant:"ghost",onClick:X,disabled:o||!h,children:j}),m&&u.jsx(y.Button,{size:"sm",variant:"primary",onClick:Y,disabled:o||!h,children:F})]})]})};exports.SignPad=V;

package/dist/components/SignPad/SignPad.const.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _=400,e=200,A=2,S="Sign here",r="image/png",D=.92,a="#1f2937",b="#f3f4f6",t="#ffffff",P="#18181b",I="bear-inline-flex bear-flex-col bear-gap-2",E="bear-relative bear-rounded-lg bear-border-2 bear-border-dashed bear-border-gray-300 dark:bear-border-zinc-600",o="hover:bear-border-pink-400 dark:hover:bear-border-pink-500",T="bear-absolute bear-inset-0 bear-flex bear-items-center bear-justify-center bear-text-gray-400 dark:bear-text-zinc-500 bear-text-sm bear-pointer-events-none",G="bear-absolute bear-bottom-8 bear-left-4 bear-right-4 bear-border-b bear-border-gray-300 dark:bear-border-zinc-600",N="bear-absolute bear-bottom-6 bear-left-4 bear-text-gray-400 dark:bear-text-zinc-500 bear-text-lg bear-font-bold",L="bear-flex bear-gap-2 bear-justify-end";exports.SIGN_PAD_ACTIONS_CLASSES=L;exports.SIGN_PAD_BG_DARK=P;exports.SIGN_PAD_BG_LIGHT=t;exports.SIGN_PAD_CANVAS_WRAPPER_CLASSES=E;exports.SIGN_PAD_CANVAS_WRAPPER_HOVER=o;exports.SIGN_PAD_DEFAULT_HEIGHT=e;exports.SIGN_PAD_DEFAULT_OUTPUT_FORMAT=r;exports.SIGN_PAD_DEFAULT_OUTPUT_QUALITY=D;exports.SIGN_PAD_DEFAULT_PLACEHOLDER=S;exports.SIGN_PAD_DEFAULT_STROKE_WIDTH=A;exports.SIGN_PAD_DEFAULT_WIDTH=_;exports.SIGN_PAD_LINE_CLASSES=G;exports.SIGN_PAD_PLACEHOLDER_CLASSES=T;exports.SIGN_PAD_ROOT_CLASSES=I;exports.SIGN_PAD_STROKE_DARK=b;exports.SIGN_PAD_STROKE_LIGHT=a;exports.SIGN_PAD_X_MARK_CLASSES=N;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _=200,e=2,S="Sign here",A="image/png",r=.92,a="#1f2937",b="#f3f4f6",t="#ffffff",D="#18181b",P="bear-inline-flex bear-flex-col bear-gap-2",E="bear-relative bear-rounded-lg bear-border-2 bear-border-dashed bear-border-gray-300 dark:bear-border-zinc-600",I="hover:bear-border-pink-400 dark:hover:bear-border-pink-500",o="bear-absolute bear-inset-0 bear-flex bear-items-center bear-justify-center bear-text-gray-400 dark:bear-text-zinc-500 bear-text-sm bear-pointer-events-none",G="bear-absolute bear-bottom-8 bear-left-4 bear-right-4 bear-border-b bear-border-gray-300 dark:bear-border-zinc-600",T="bear-absolute bear-bottom-6 bear-left-4 bear-text-gray-400 dark:bear-text-zinc-500 bear-text-lg bear-font-bold",N="bear-flex bear-gap-2 bear-justify-end";exports.SIGN_PAD_ACTIONS_CLASSES=N;exports.SIGN_PAD_BG_DARK=D;exports.SIGN_PAD_BG_LIGHT=t;exports.SIGN_PAD_CANVAS_WRAPPER_CLASSES=E;exports.SIGN_PAD_CANVAS_WRAPPER_HOVER=I;exports.SIGN_PAD_DEFAULT_HEIGHT=_;exports.SIGN_PAD_DEFAULT_OUTPUT_FORMAT=A;exports.SIGN_PAD_DEFAULT_OUTPUT_QUALITY=r;exports.SIGN_PAD_DEFAULT_PLACEHOLDER=S;exports.SIGN_PAD_DEFAULT_STROKE_WIDTH=e;exports.SIGN_PAD_LINE_CLASSES=G;exports.SIGN_PAD_PLACEHOLDER_CLASSES=o;exports.SIGN_PAD_ROOT_CLASSES=P;exports.SIGN_PAD_STROKE_DARK=b;exports.SIGN_PAD_STROKE_LIGHT=a;exports.SIGN_PAD_X_MARK_CLASSES=T;

package/dist/components/SignPad/SignPad.const.js

@@ -1,20 +1,19 @@
-const e = 400, r = 200, _ = 2, a = "Sign here", b = "image/png", t = 0.92, A = "#1f2937", o = "#f3f4f6", S = "#ffffff", n = "#18181b", D = "bear-inline-flex bear-flex-col bear-gap-2", s = "bear-relative bear-rounded-lg bear-border-2 bear-border-dashed bear-border-gray-300 dark:bear-border-zinc-600", I = "hover:bear-border-pink-400 dark:hover:bear-border-pink-500", P = "bear-absolute bear-inset-0 bear-flex bear-items-center bear-justify-center bear-text-gray-400 dark:bear-text-zinc-500 bear-text-sm bear-pointer-events-none", c = "bear-absolute bear-bottom-8 bear-left-4 bear-right-4 bear-border-b bear-border-gray-300 dark:bear-border-zinc-600", E = "bear-absolute bear-bottom-6 bear-left-4 bear-text-gray-400 dark:bear-text-zinc-500 bear-text-lg bear-font-bold", G = "bear-flex bear-gap-2 bear-justify-end";
+const e = 200, r = 2, a = "Sign here", b = "image/png", _ = 0.92, t = "#1f2937", o = "#f3f4f6", A = "#ffffff", S = "#18181b", n = "bear-inline-flex bear-flex-col bear-gap-2", s = "bear-relative bear-rounded-lg bear-border-2 bear-border-dashed bear-border-gray-300 dark:bear-border-zinc-600", D = "hover:bear-border-pink-400 dark:hover:bear-border-pink-500", P = "bear-absolute bear-inset-0 bear-flex bear-items-center bear-justify-center bear-text-gray-400 dark:bear-text-zinc-500 bear-text-sm bear-pointer-events-none", c = "bear-absolute bear-bottom-8 bear-left-4 bear-right-4 bear-border-b bear-border-gray-300 dark:bear-border-zinc-600", E = "bear-absolute bear-bottom-6 bear-left-4 bear-text-gray-400 dark:bear-text-zinc-500 bear-text-lg bear-font-bold", I = "bear-flex bear-gap-2 bear-justify-end";
 export {
-  G as SIGN_PAD_ACTIONS_CLASSES,
-  n as SIGN_PAD_BG_DARK,
-  S as SIGN_PAD_BG_LIGHT,
+  I as SIGN_PAD_ACTIONS_CLASSES,
+  S as SIGN_PAD_BG_DARK,
+  A as SIGN_PAD_BG_LIGHT,
   s as SIGN_PAD_CANVAS_WRAPPER_CLASSES,
-  I as SIGN_PAD_CANVAS_WRAPPER_HOVER,
-  r as SIGN_PAD_DEFAULT_HEIGHT,
+  D as SIGN_PAD_CANVAS_WRAPPER_HOVER,
+  e as SIGN_PAD_DEFAULT_HEIGHT,
   b as SIGN_PAD_DEFAULT_OUTPUT_FORMAT,
-  t as SIGN_PAD_DEFAULT_OUTPUT_QUALITY,
+  _ as SIGN_PAD_DEFAULT_OUTPUT_QUALITY,
   a as SIGN_PAD_DEFAULT_PLACEHOLDER,
-  _ as SIGN_PAD_DEFAULT_STROKE_WIDTH,
-  e as SIGN_PAD_DEFAULT_WIDTH,
+  r as SIGN_PAD_DEFAULT_STROKE_WIDTH,
   c as SIGN_PAD_LINE_CLASSES,
   P as SIGN_PAD_PLACEHOLDER_CLASSES,
-  D as SIGN_PAD_ROOT_CLASSES,
+  n as SIGN_PAD_ROOT_CLASSES,
   o as SIGN_PAD_STROKE_DARK,
-  A as SIGN_PAD_STROKE_LIGHT,
+  t as SIGN_PAD_STROKE_LIGHT,
   E as SIGN_PAD_X_MARK_CLASSES
 };

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

@@ -3,14 +3,12 @@ import { SignPadProps } from './SignPad.types';
 /**
  * SignPad - Digital signature capture component
  *
+ * Canvas fills 100% of its container width. Height is configurable.
+ * Uses ResizeObserver so drawing works correctly at any size.
+ *
  * @example
  * ```tsx
- * const [signature, setSignature] = useState<string | null>(null);
- *
- * <SignPad
- *   onChange={setSignature}
- *   placeholder="Sign here"
- * />
+ * <SignPad onChange={setSignature} placeholder="Sign here" />
  * ```
  */
 export declare const SignPad: FC<SignPadProps>;

package/dist/components/SignPad/SignPad.js

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

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

@@ -2,9 +2,9 @@ import { HTMLAttributes } from 'react';
 export interface SignPadProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
     /** Callback when signature changes - receives base64 image data */
     onChange?: (signature: string | null) => void;
-    /** Width of the canvas */
+    /** Canvas resolution width (internal pixels). CSS width is always 100% of container. */
     width?: number;
-    /** Height of the canvas */
+    /** Canvas resolution height (internal pixels). Also sets the CSS height. */
     height?: number;
     /** Stroke color */
     strokeColor?: string;

package/dist/components/SplitButton/SplitButton.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),i=require("react"),t=require("../../utils/cn.cjs"),n=require("./SplitButton.const.cjs"),j=u=>{const{label:b,icon:m,options:C,variant:N="primary",size:c="md",disabled:f=!1,loading:d=!1,onClick:A,dropdownAlign:E="left",className:_,testId:h,...L}=u,[r,l]=i.useState(!1),o=i.useRef(null);i.useEffect(()=>{const e=R=>{o.current&&!o.current.contains(R.target)&&l(!1)};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[]);const O=i.useCallback(e=>{e.disabled||(e.onClick(),l(!1))},[]),S=n.VARIANT_CLASSES[N],p=n.SIZE_CLASSES[c],x=n.ARROW_SIZE_CLASSES[c],a=f||d;return s.jsxs("div",{ref:o,className:t.cn(n.ROOT_CLASSES,_),"data-testid":h,children:[s.jsxs("button",{type:"button",className:t.cn(n.MAIN_BTN_CLASSES,S,p,a&&"bear-opacity-50 bear-cursor-not-allowed"),onClick:A,disabled:a,...L,children:[d?s.jsx("span",{className:n.SPINNER_CLASSES}):m,b]}),s.jsx("button",{type:"button",className:t.cn(n.ARROW_BTN_CLASSES,S,x,a&&"bear-opacity-50 bear-cursor-not-allowed"),onClick:()=>!a&&l(!r),disabled:a,"aria-label":"More options","aria-expanded":r,children:s.jsx("svg",{className:t.cn("bear-w-4 bear-h-4 bear-transition-transform",r&&"bear-rotate-180"),fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:s.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M19 9l-7 7-7-7"})})}),r&&s.jsx("div",{className:t.cn(n.DROPDOWN_CLASSES,E==="right"?"bear-right-0":"bear-left-0","bear-top-full"),children:C.map(e=>s.jsxs("div",{className:t.cn(n.OPTION_CLASSES,e.danger&&n.OPTION_DANGER_CLASSES,e.disabled&&n.OPTION_DISABLED_CLASSES),onClick:()=>O(e),role:"menuitem",children:[e.icon&&s.jsx("span",{className:"bear-w-4 bear-h-4 bear-flex-shrink-0",children:e.icon}),e.label]},e.id))})]})};exports.SplitButton=j;

package/dist/components/SplitButton/SplitButton.const.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r={primary:"bear-bg-pink-500 bear-text-white hover:bear-bg-pink-600",secondary:"bear-bg-gray-600 bear-text-white hover:bear-bg-gray-700",outline:"bear-bg-white dark:bear-bg-zinc-800 bear-border bear-border-gray-300 dark:bear-border-zinc-600 bear-text-gray-700 dark:bear-text-zinc-300 hover:bear-bg-gray-50 dark:hover:bear-bg-zinc-700",danger:"bear-bg-red-500 bear-text-white hover:bear-bg-red-600"},e={sm:"bear-text-sm bear-py-1.5 bear-px-3",md:"bear-text-sm bear-py-2 bear-px-4",lg:"bear-text-base bear-py-2.5 bear-px-5"},a={sm:"bear-py-1.5 bear-px-2",md:"bear-py-2 bear-px-2.5",lg:"bear-py-2.5 bear-px-3"},b="Bear-SplitButton bear-relative bear-inline-flex",t="bear-font-medium bear-transition-colors bear-rounded-l-lg bear-flex bear-items-center bear-gap-1.5",S="bear-rounded-r-lg bear-border-l bear-border-white/20 bear-transition-colors bear-flex bear-items-center bear-justify-center",o="bear-absolute bear-z-[9999] bear-mt-1 bear-bg-white dark:bear-bg-zinc-800 bear-border bear-border-gray-200 dark:bear-border-zinc-700 bear-rounded-lg bear-shadow-xl bear-py-1 bear-min-w-[160px] bear-animate-in",n="bear-flex bear-items-center bear-gap-2 bear-px-3 bear-py-1.5 bear-text-sm bear-cursor-pointer bear-transition-colors bear-text-gray-700 dark:bear-text-zinc-300 hover:bear-bg-gray-50 dark:hover:bear-bg-zinc-700",d="bear-text-red-600 dark:bear-text-red-400 hover:bear-bg-red-50 dark:hover:bear-bg-red-900/20",i="bear-opacity-40 bear-cursor-not-allowed",A="bear-w-4 bear-h-4 bear-border-2 bear-border-current/30 bear-border-t-current bear-rounded-full bear-animate-spin";exports.ARROW_BTN_CLASSES=S;exports.ARROW_SIZE_CLASSES=a;exports.DROPDOWN_CLASSES=o;exports.MAIN_BTN_CLASSES=t;exports.OPTION_CLASSES=n;exports.OPTION_DANGER_CLASSES=d;exports.OPTION_DISABLED_CLASSES=i;exports.ROOT_CLASSES=b;exports.SIZE_CLASSES=e;exports.SPINNER_CLASSES=A;exports.VARIANT_CLASSES=r;

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

@@ -0,0 +1,25 @@
+export declare const VARIANT_CLASSES: {
+    readonly primary: "bear-bg-pink-500 bear-text-white hover:bear-bg-pink-600";
+    readonly secondary: "bear-bg-gray-600 bear-text-white hover:bear-bg-gray-700";
+    readonly outline: "bear-bg-white dark:bear-bg-zinc-800 bear-border bear-border-gray-300 dark:bear-border-zinc-600 bear-text-gray-700 dark:bear-text-zinc-300 hover:bear-bg-gray-50 dark:hover:bear-bg-zinc-700";
+    readonly danger: "bear-bg-red-500 bear-text-white hover:bear-bg-red-600";
+};
+export declare const SIZE_CLASSES: {
+    readonly sm: "bear-text-sm bear-py-1.5 bear-px-3";
+    readonly md: "bear-text-sm bear-py-2 bear-px-4";
+    readonly lg: "bear-text-base bear-py-2.5 bear-px-5";
+};
+export declare const ARROW_SIZE_CLASSES: {
+    readonly sm: "bear-py-1.5 bear-px-2";
+    readonly md: "bear-py-2 bear-px-2.5";
+    readonly lg: "bear-py-2.5 bear-px-3";
+};
+export declare const ROOT_CLASSES = "Bear-SplitButton bear-relative bear-inline-flex";
+export declare const MAIN_BTN_CLASSES = "bear-font-medium bear-transition-colors bear-rounded-l-lg bear-flex bear-items-center bear-gap-1.5";
+export declare const ARROW_BTN_CLASSES = "bear-rounded-r-lg bear-border-l bear-border-white/20 bear-transition-colors bear-flex bear-items-center bear-justify-center";
+export declare const DROPDOWN_CLASSES = "bear-absolute bear-z-[9999] bear-mt-1 bear-bg-white dark:bear-bg-zinc-800 bear-border bear-border-gray-200 dark:bear-border-zinc-700 bear-rounded-lg bear-shadow-xl bear-py-1 bear-min-w-[160px] bear-animate-in";
+export declare const OPTION_CLASSES = "bear-flex bear-items-center bear-gap-2 bear-px-3 bear-py-1.5 bear-text-sm bear-cursor-pointer bear-transition-colors bear-text-gray-700 dark:bear-text-zinc-300 hover:bear-bg-gray-50 dark:hover:bear-bg-zinc-700";
+export declare const OPTION_DANGER_CLASSES = "bear-text-red-600 dark:bear-text-red-400 hover:bear-bg-red-50 dark:hover:bear-bg-red-900/20";
+export declare const OPTION_DISABLED_CLASSES = "bear-opacity-40 bear-cursor-not-allowed";
+export declare const DIVIDER_CLASSES = "bear-border-l bear-border-white/30";
+export declare const SPINNER_CLASSES = "bear-w-4 bear-h-4 bear-border-2 bear-border-current/30 bear-border-t-current bear-rounded-full bear-animate-spin";

package/dist/components/SplitButton/SplitButton.const.js

@@ -0,0 +1,27 @@
+const r = {
+  primary: "bear-bg-pink-500 bear-text-white hover:bear-bg-pink-600",
+  secondary: "bear-bg-gray-600 bear-text-white hover:bear-bg-gray-700",
+  outline: "bear-bg-white dark:bear-bg-zinc-800 bear-border bear-border-gray-300 dark:bear-border-zinc-600 bear-text-gray-700 dark:bear-text-zinc-300 hover:bear-bg-gray-50 dark:hover:bear-bg-zinc-700",
+  danger: "bear-bg-red-500 bear-text-white hover:bear-bg-red-600"
+}, e = {
+  sm: "bear-text-sm bear-py-1.5 bear-px-3",
+  md: "bear-text-sm bear-py-2 bear-px-4",
+  lg: "bear-text-base bear-py-2.5 bear-px-5"
+}, a = {
+  sm: "bear-py-1.5 bear-px-2",
+  md: "bear-py-2 bear-px-2.5",
+  lg: "bear-py-2.5 bear-px-3"
+}, b = "Bear-SplitButton bear-relative bear-inline-flex", t = "bear-font-medium bear-transition-colors bear-rounded-l-lg bear-flex bear-items-center bear-gap-1.5", o = "bear-rounded-r-lg bear-border-l bear-border-white/20 bear-transition-colors bear-flex bear-items-center bear-justify-center", n = "bear-absolute bear-z-[9999] bear-mt-1 bear-bg-white dark:bear-bg-zinc-800 bear-border bear-border-gray-200 dark:bear-border-zinc-700 bear-rounded-lg bear-shadow-xl bear-py-1 bear-min-w-[160px] bear-animate-in", d = "bear-flex bear-items-center bear-gap-2 bear-px-3 bear-py-1.5 bear-text-sm bear-cursor-pointer bear-transition-colors bear-text-gray-700 dark:bear-text-zinc-300 hover:bear-bg-gray-50 dark:hover:bear-bg-zinc-700", i = "bear-text-red-600 dark:bear-text-red-400 hover:bear-bg-red-50 dark:hover:bear-bg-red-900/20", S = "bear-opacity-40 bear-cursor-not-allowed", s = "bear-w-4 bear-h-4 bear-border-2 bear-border-current/30 bear-border-t-current bear-rounded-full bear-animate-spin";
+export {
+  o as ARROW_BTN_CLASSES,
+  a as ARROW_SIZE_CLASSES,
+  n as DROPDOWN_CLASSES,
+  t as MAIN_BTN_CLASSES,
+  d as OPTION_CLASSES,
+  i as OPTION_DANGER_CLASSES,
+  S as OPTION_DISABLED_CLASSES,
+  b as ROOT_CLASSES,
+  e as SIZE_CLASSES,
+  s as SPINNER_CLASSES,
+  r as VARIANT_CLASSES
+};

package/dist/components/SplitButton/SplitButton.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import { SplitButtonProps } from './SplitButton.types';
+export declare const SplitButton: FC<SplitButtonProps>;
+export default SplitButton;

package/dist/components/SplitButton/SplitButton.js

@@ -0,0 +1,73 @@
+import { jsxs as o, jsx as a } from "react/jsx-runtime";
+import { useState as I, useRef as R, useEffect as v, useCallback as w } from "react";
+import { cn as n } from "../../utils/cn.js";
+import { SPINNER_CLASSES as g, SIZE_CLASSES as T, VARIANT_CLASSES as x, MAIN_BTN_CLASSES as D, ARROW_SIZE_CLASSES as y, ARROW_BTN_CLASSES as B, OPTION_DISABLED_CLASSES as P, OPTION_DANGER_CLASSES as W, OPTION_CLASSES as j, DROPDOWN_CLASSES as z, ROOT_CLASSES as M } from "./SplitButton.const.js";
+const F = (S) => {
+  const {
+    label: b,
+    icon: m,
+    options: u,
+    variant: f = "primary",
+    size: l = "md",
+    disabled: C = !1,
+    loading: c = !1,
+    onClick: N,
+    dropdownAlign: A = "left",
+    className: E,
+    testId: p,
+    ...h
+  } = S, [s, t] = I(!1), i = R(null);
+  v(() => {
+    const e = (k) => {
+      i.current && !i.current.contains(k.target) && t(!1);
+    };
+    return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
+  }, []);
+  const L = w((e) => {
+    e.disabled || (e.onClick(), t(!1));
+  }, []), d = x[f], _ = T[l], O = y[l], r = C || c;
+  return /* @__PURE__ */ o("div", { ref: i, className: n(M, E), "data-testid": p, children: [
+    /* @__PURE__ */ o(
+      "button",
+      {
+        type: "button",
+        className: n(D, d, _, r && "bear-opacity-50 bear-cursor-not-allowed"),
+        onClick: N,
+        disabled: r,
+        ...h,
+        children: [
+          c ? /* @__PURE__ */ a("span", { className: g }) : m,
+          b
+        ]
+      }
+    ),
+    /* @__PURE__ */ a(
+      "button",
+      {
+        type: "button",
+        className: n(B, d, O, r && "bear-opacity-50 bear-cursor-not-allowed"),
+        onClick: () => !r && t(!s),
+        disabled: r,
+        "aria-label": "More options",
+        "aria-expanded": s,
+        children: /* @__PURE__ */ a("svg", { className: n("bear-w-4 bear-h-4 bear-transition-transform", s && "bear-rotate-180"), fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ a("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }) })
+      }
+    ),
+    s && /* @__PURE__ */ a("div", { className: n(z, A === "right" ? "bear-right-0" : "bear-left-0", "bear-top-full"), children: u.map((e) => /* @__PURE__ */ o(
+      "div",
+      {
+        className: n(j, e.danger && W, e.disabled && P),
+        onClick: () => L(e),
+        role: "menuitem",
+        children: [
+          e.icon && /* @__PURE__ */ a("span", { className: "bear-w-4 bear-h-4 bear-flex-shrink-0", children: e.icon }),
+          e.label
+        ]
+      },
+      e.id
+    )) })
+  ] });
+};
+export {
+  F as SplitButton
+};