@forgedevstack/bear 1.0.5 → 1.0.7

package/dist/components/RichEditor/components/ToolbarMore/ToolbarMore.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("react"),d=require("../../../../utils/cn.cjs"),o=require("../../RichEditor.const.cjs"),u=()=>e.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[e.jsx("line",{x1:"12",y1:"5",x2:"12",y2:"19"}),e.jsx("line",{x1:"5",y1:"12",x2:"19",y2:"12"})]}),_=({children:l,disabled:i})=>{const[r,s]=n.useState(!1),t=n.useRef(null);return n.useEffect(()=>{const c=a=>{t.current&&!t.current.contains(a.target)&&s(!1)};return document.addEventListener("mousedown",c),()=>document.removeEventListener("mousedown",c)},[]),e.jsxs("div",{ref:t,className:"Bear-RichEditor__more relative",children:[e.jsx("button",{type:"button",title:"More options",disabled:i,onClick:()=>s(!r),className:d.cn("Bear-RichEditor__more-trigger",o.RICH_EDITOR_BUTTON_BASE_CLASSES,o.RICH_EDITOR_BUTTON_INACTIVE_CLASSES,"flex items-center justify-center",r&&"bg-pink-500 text-white",i&&`Bear-RichEditor__more-trigger--disabled ${o.RICH_EDITOR_BUTTON_DISABLED_CLASSES}`),children:e.jsx(u,{})}),r&&e.jsx("div",{className:"Bear-RichEditor__more-menu absolute top-full right-0 mt-1 p-2 bg-white dark:bg-zinc-800 border border-gray-200 dark:border-zinc-700 rounded-lg shadow-xl z-50 min-w-[200px]",children:e.jsx("div",{className:"flex flex-wrap items-center gap-0.5",children:l})})]})};exports.ToolbarMore=_;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),E=require("react-dom"),h=require("../../../../utils/cn.cjs"),l=require("../../RichEditor.const.cjs"),p=()=>e.jsxs("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",children:[e.jsx("circle",{cx:"12",cy:"12",r:"1.5",fill:"currentColor"}),e.jsx("circle",{cx:"6",cy:"12",r:"1.5",fill:"currentColor"}),e.jsx("circle",{cx:"18",cy:"12",r:"1.5",fill:"currentColor"})]}),R=({children:_,disabled:u,isMobile:r})=>{const[o,d]=t.useState(!1),c=t.useRef(null),i=t.useRef(null),[a,g]=t.useState({top:0,left:0});t.useEffect(()=>{const n=m=>{var x;if(c.current&&!c.current.contains(m.target)){const s=m.target;(x=s.closest)!=null&&x.call(s,".Bear-RichEditor__more-menu")||d(!1)}};return document.addEventListener("mousedown",n),()=>document.removeEventListener("mousedown",n)},[]),t.useEffect(()=>{if(o&&r&&i.current&&typeof document<"u"){const n=i.current.getBoundingClientRect();g({top:n.bottom+4,left:Math.max(8,n.right-220)})}},[o,r]);const f=e.jsx("div",{className:h.cn("Bear-RichEditor__more-menu p-2 bg-white dark:bg-zinc-800 border border-gray-200 dark:border-zinc-700 rounded-lg shadow-xl min-w-[200px] max-w-[min(90vw,280px)] max-h-[70vh] overflow-y-auto",r?"fixed z-[9999]":"absolute top-full right-0 mt-1 z-50"),style:r?{top:a.top,left:a.left}:void 0,children:e.jsx("div",{className:"flex flex-wrap items-center gap-0.5",children:_})});return e.jsxs("div",{ref:c,className:"Bear-RichEditor__more relative",children:[e.jsx("button",{ref:i,type:"button",title:"More options",disabled:u,onClick:()=>d(!o),className:h.cn("Bear-RichEditor__more-trigger",l.RICH_EDITOR_BUTTON_BASE_CLASSES,l.RICH_EDITOR_BUTTON_INACTIVE_CLASSES,"flex items-center justify-center",o&&"bg-pink-500 text-white",u&&`Bear-RichEditor__more-trigger--disabled ${l.RICH_EDITOR_BUTTON_DISABLED_CLASSES}`),children:e.jsx(p,{})}),o&&(r&&typeof document<"u"?E.createPortal(f,document.body):f)]})};exports.ToolbarMore=R;

package/dist/components/RichEditor/components/ToolbarMore/ToolbarMore.d.ts

@@ -2,6 +2,8 @@ import { FC, ReactNode } from 'react';
 export interface ToolbarMoreProps {
     children: ReactNode;
     disabled?: boolean;
+    /** When true, render menu via portal for mobile (avoids clipping) */
+    isMobile?: boolean;
 }
 export declare const ToolbarMore: FC<ToolbarMoreProps>;
 export default ToolbarMore;

package/dist/components/RichEditor/components/ToolbarMore/ToolbarMore.js

@@ -1,45 +1,63 @@
-import { jsxs as s, jsx as e } from "react/jsx-runtime";
-import { useState as a, useRef as d, useEffect as m } from "react";
-import { cn as u } from "../../../../utils/cn.js";
-import { RICH_EDITOR_BUTTON_DISABLED_CLASSES as _, RICH_EDITOR_BUTTON_INACTIVE_CLASSES as f, RICH_EDITOR_BUTTON_BASE_CLASSES as h } from "../../RichEditor.const.js";
-const E = () => /* @__PURE__ */ s("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
-  /* @__PURE__ */ e("line", { x1: "12", y1: "5", x2: "12", y2: "19" }),
-  /* @__PURE__ */ e("line", { x1: "5", y1: "12", x2: "19", y2: "12" })
-] }), S = ({ children: c, disabled: o }) => {
-  const [r, i] = a(!1), t = d(null);
-  return m(() => {
-    const n = (l) => {
-      t.current && !t.current.contains(l.target) && i(!1);
+import { jsx as e, jsxs as g } from "react/jsx-runtime";
+import { useState as f, useRef as p, useEffect as h } from "react";
+import { createPortal as C } from "react-dom";
+import { cn as _ } from "../../../../utils/cn.js";
+import { RICH_EDITOR_BUTTON_DISABLED_CLASSES as R, RICH_EDITOR_BUTTON_INACTIVE_CLASSES as v, RICH_EDITOR_BUTTON_BASE_CLASSES as w } from "../../RichEditor.const.js";
+const B = () => /* @__PURE__ */ g("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+  /* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "1.5", fill: "currentColor" }),
+  /* @__PURE__ */ e("circle", { cx: "6", cy: "12", r: "1.5", fill: "currentColor" }),
+  /* @__PURE__ */ e("circle", { cx: "18", cy: "12", r: "1.5", fill: "currentColor" })
+] }), b = ({ children: x, disabled: l, isMobile: t }) => {
+  const [r, s] = f(!1), n = p(null), i = p(null), [d, E] = f({ top: 0, left: 0 });
+  h(() => {
+    const o = (u) => {
+      var a;
+      if (n.current && !n.current.contains(u.target)) {
+        const c = u.target;
+        (a = c.closest) != null && a.call(c, ".Bear-RichEditor__more-menu") || s(!1);
+      }
     };
-    return document.addEventListener("mousedown", n), () => document.removeEventListener("mousedown", n);
-  }, []), /* @__PURE__ */ s("div", { ref: t, className: "Bear-RichEditor__more relative", children: [
+    return document.addEventListener("mousedown", o), () => document.removeEventListener("mousedown", o);
+  }, []), h(() => {
+    if (r && t && i.current && typeof document < "u") {
+      const o = i.current.getBoundingClientRect();
+      E({ top: o.bottom + 4, left: Math.max(8, o.right - 220) });
+    }
+  }, [r, t]);
+  const m = /* @__PURE__ */ e(
+    "div",
+    {
+      className: _(
+        "Bear-RichEditor__more-menu p-2 bg-white dark:bg-zinc-800 border border-gray-200 dark:border-zinc-700 rounded-lg shadow-xl min-w-[200px] max-w-[min(90vw,280px)] max-h-[70vh] overflow-y-auto",
+        t ? "fixed z-[9999]" : "absolute top-full right-0 mt-1 z-50"
+      ),
+      style: t ? { top: d.top, left: d.left } : void 0,
+      children: /* @__PURE__ */ e("div", { className: "flex flex-wrap items-center gap-0.5", children: x })
+    }
+  );
+  return /* @__PURE__ */ g("div", { ref: n, className: "Bear-RichEditor__more relative", children: [
     /* @__PURE__ */ e(
       "button",
       {
+        ref: i,
         type: "button",
         title: "More options",
-        disabled: o,
-        onClick: () => i(!r),
-        className: u(
+        disabled: l,
+        onClick: () => s(!r),
+        className: _(
           "Bear-RichEditor__more-trigger",
-          h,
-          f,
+          w,
+          v,
           "flex items-center justify-center",
           r && "bg-pink-500 text-white",
-          o && `Bear-RichEditor__more-trigger--disabled ${_}`
+          l && `Bear-RichEditor__more-trigger--disabled ${R}`
         ),
-        children: /* @__PURE__ */ e(E, {})
+        children: /* @__PURE__ */ e(B, {})
       }
     ),
-    r && /* @__PURE__ */ e(
-      "div",
-      {
-        className: "Bear-RichEditor__more-menu absolute top-full right-0 mt-1 p-2 bg-white dark:bg-zinc-800 border border-gray-200 dark:border-zinc-700 rounded-lg shadow-xl z-50 min-w-[200px]",
-        children: /* @__PURE__ */ e("div", { className: "flex flex-wrap items-center gap-0.5", children: c })
-      }
-    )
+    r && (t && typeof document < "u" ? C(m, document.body) : m)
   ] });
 };
 export {
-  S as ToolbarMore
+  b as ToolbarMore
 };

package/dist/components/SegmentedControl/SegmentedControl.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),f=require("react"),i=require("../../utils/cn.cjs"),y={sm:"bear-h-8 bear-text-sm",md:"bear-h-10 bear-text-base",lg:"bear-h-12 bear-text-lg"},p=({items:t,value:b,defaultValue:d,onChange:a,size:c="md",fullWidth:l=!1,disabled:r=!1,className:u})=>{var o;const[x,g]=f.useState(d??((o=t[0])==null?void 0:o.value)??""),n=b??x,v=(e,m)=>{m||r||(b===void 0&&g(e),a==null||a(e))};return s.jsx("div",{role:"group","aria-label":"Segmented control",className:i.cn("Bear-SegmentedControl bear-relative bear-inline-flex bear-rounded-lg bear-bg-gray-200 dark:bear-bg-zinc-800 bear-p-1",l&&"bear-w-full",r&&"bear-opacity-50 bear-pointer-events-none",u),children:t.map(e=>s.jsx("button",{type:"button",role:"tab","aria-selected":e.value===n,"aria-disabled":e.disabled||r,disabled:e.disabled||r,onClick:()=>v(e.value,e.disabled),className:i.cn("Bear-SegmentedControl__item bear-relative bear-flex-1 bear-flex bear-items-center bear-justify-center bear-rounded-md bear-font-medium bear-transition-all bear-duration-200 bear-text-gray-600 dark:bear-text-zinc-400 hover:bear-text-gray-900 dark:hover:bear-text-zinc-200",e.value===n&&"bear-bg-white dark:bear-bg-zinc-700 bear-text-gray-900 dark:bear-text-white bear-shadow-sm",(e.disabled||r)&&"bear-cursor-not-allowed bear-opacity-50",y[c],l?"bear-min-w-0":"bear-px-4"),children:e.label},e.value))})};exports.SegmentedControl=p;

package/dist/components/SegmentedControl/SegmentedControl.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { SegmentedControlProps } from './SegmentedControl.types';
+export declare const SegmentedControl: FC<SegmentedControlProps>;

package/dist/components/SegmentedControl/SegmentedControl.js

@@ -0,0 +1,58 @@
+import { jsx as s } from "react/jsx-runtime";
+import { useState as g } from "react";
+import { cn as d } from "../../utils/cn.js";
+const p = {
+  sm: "bear-h-8 bear-text-sm",
+  md: "bear-h-10 bear-text-base",
+  lg: "bear-h-12 bear-text-lg"
+}, w = ({
+  items: t,
+  value: b,
+  defaultValue: i,
+  onChange: r,
+  size: c = "md",
+  fullWidth: l = !1,
+  disabled: a = !1,
+  className: u
+}) => {
+  var o;
+  const [m, x] = g(i ?? ((o = t[0]) == null ? void 0 : o.value) ?? ""), n = b ?? m, v = (e, f) => {
+    f || a || (b === void 0 && x(e), r == null || r(e));
+  };
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      role: "group",
+      "aria-label": "Segmented control",
+      className: d(
+        "Bear-SegmentedControl bear-relative bear-inline-flex bear-rounded-lg bear-bg-gray-200 dark:bear-bg-zinc-800 bear-p-1",
+        l && "bear-w-full",
+        a && "bear-opacity-50 bear-pointer-events-none",
+        u
+      ),
+      children: t.map((e) => /* @__PURE__ */ s(
+        "button",
+        {
+          type: "button",
+          role: "tab",
+          "aria-selected": e.value === n,
+          "aria-disabled": e.disabled || a,
+          disabled: e.disabled || a,
+          onClick: () => v(e.value, e.disabled),
+          className: d(
+            "Bear-SegmentedControl__item bear-relative bear-flex-1 bear-flex bear-items-center bear-justify-center bear-rounded-md bear-font-medium bear-transition-all bear-duration-200 bear-text-gray-600 dark:bear-text-zinc-400 hover:bear-text-gray-900 dark:hover:bear-text-zinc-200",
+            e.value === n && "bear-bg-white dark:bear-bg-zinc-700 bear-text-gray-900 dark:bear-text-white bear-shadow-sm",
+            (e.disabled || a) && "bear-cursor-not-allowed bear-opacity-50",
+            p[c],
+            l ? "bear-min-w-0" : "bear-px-4"
+          ),
+          children: e.label
+        },
+        e.value
+      ))
+    }
+  );
+};
+export {
+  w as SegmentedControl
+};

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

@@ -0,0 +1,16 @@
+import { ReactNode } from 'react';
+export interface SegmentedControlItem {
+    value: string;
+    label: ReactNode;
+    disabled?: boolean;
+}
+export interface SegmentedControlProps {
+    items: SegmentedControlItem[];
+    value?: string;
+    defaultValue?: string;
+    onChange?: (value: string) => void;
+    size?: 'sm' | 'md' | 'lg';
+    fullWidth?: boolean;
+    disabled?: boolean;
+    className?: string;
+}

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

@@ -0,0 +1,2 @@
+export { SegmentedControl } from './SegmentedControl';
+export type { SegmentedControlProps, SegmentedControlItem } from './SegmentedControl.types';

package/dist/components/SignPad/SignPad.cjs

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

package/dist/components/SignPad/SignPad.js

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

package/dist/components/SliderRange/SliderRange.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("react/jsx-runtime"),u=require("react"),d=require("../../utils/cn.cjs"),X={xs:{track:"bear-h-1",thumb:"bear-w-3 bear-h-3",height:"bear-h-6"},sm:{track:"bear-h-1.5",thumb:"bear-w-4 bear-h-4",height:"bear-h-8"},md:{track:"bear-h-2",thumb:"bear-w-5 bear-h-5",height:"bear-h-10"},lg:{track:"bear-h-2.5",thumb:"bear-w-6 bear-h-6",height:"bear-h-12"},xl:{track:"bear-h-3",thumb:"bear-w-7 bear-h-7",height:"bear-h-14"}},Y={primary:{track:"bear-bg-bear-500",thumb:"bear-bg-bear-500 bear-border-bear-600"},secondary:{track:"bear-bg-gray-500",thumb:"bear-bg-gray-500 bear-border-gray-600"},success:{track:"bear-bg-green-500",thumb:"bear-bg-green-500 bear-border-green-600"},warning:{track:"bear-bg-amber-500",thumb:"bear-bg-amber-500 bear-border-amber-600"},error:{track:"bear-bg-red-500",thumb:"bear-bg-red-500 bear-border-red-600"},danger:{track:"bear-bg-red-500",thumb:"bear-bg-red-500 bear-border-red-600"},info:{track:"bear-bg-blue-500",thumb:"bear-bg-blue-500 bear-border-blue-600"},ghost:{track:"bear-bg-gray-400",thumb:"bear-bg-gray-400 bear-border-gray-500"},outline:{track:"bear-bg-gray-600",thumb:"bear-bg-white dark:bear-bg-gray-200 bear-border-gray-600 dark:bear-border-gray-400"}},_=(c,f,e,r)=>{const l=Math.round(c/r)*r;return Math.max(f,Math.min(e,l))},A=({value:c,defaultValue:f=[20,80],min:e=0,max:r=100,step:l=1,size:$="md",color:q="primary",disabled:b=!1,onChange:s,onChangeCommitted:g,valueFormatter:B=w=>String(w),className:z,...O})=>{const[w,L]=u.useState(f),[t,E]=u.useState(null),y=u.useRef(null),k=c??w,[n,o]=k,x=(n-e)/(r-e)*100,j=(o-e)/(r-e)*100,m=X[$],M=Y[q],S=u.useCallback((a,v)=>{if(!y.current||b)return;const T=y.current.getBoundingClientRect(),P=Math.max(0,Math.min(1,(a-T.left)/T.width)),V=e+P*(r-e),D=_(V,e,r,l);if(v==="min"){const i=[Math.min(D,o-l),o];c===void 0&&L(i),s==null||s(i)}else{const I=Math.max(D,n+l),i=[n,I];c===void 0&&L(i),s==null||s(i)}},[e,r,l,n,o,b,c,s]),N=(a,v)=>{b||(a.preventDefault(),E(v),S(a.clientX,v))},p=u.useCallback(a=>{t&&S(a.clientX,t)},[t,S]),R=u.useCallback(()=>{t&&(E(null),g==null||g(k))},[t,k,g]);return u.useEffect(()=>{if(t)return document.addEventListener("mousemove",p),document.addEventListener("mouseup",R),()=>{document.removeEventListener("mousemove",p),document.removeEventListener("mouseup",R)}},[t,p,R]),h.jsx("div",{className:d.cn("bear-relative bear-w-full bear-flex bear-items-center",m.height,b&&"bear-opacity-50 bear-cursor-not-allowed",z),"data-testid":"slider-range",...O,children:h.jsxs("div",{ref:y,className:d.cn("bear-relative bear-w-full bear-rounded-full bear-bg-gray-200 dark:bear-bg-gray-700",m.track,!b&&"bear-cursor-pointer"),children:[h.jsx("div",{className:d.cn("bear-absolute bear-inset-y-0 bear-left-0 bear-rounded-full",M.track),style:{left:`${x}%`,width:`${j-x}%`}}),h.jsx("div",{role:"slider",tabIndex:b?-1:0,"aria-valuemin":e,"aria-valuemax":r,"aria-valuenow":n,"aria-label":"Range minimum",className:d.cn("bear-absolute bear-top-1/2 bear--translate-y-1/2 bear--translate-x-1/2 bear-rounded-full bear-border-2 bear-shadow-md",m.thumb,M.thumb,!b&&"bear-cursor-grab active:bear-cursor-grabbing hover:bear-scale-110",t==="min"&&"bear-scale-125 bear-z-10"),style:{left:`${x}%`},onMouseDown:a=>N(a,"min")}),h.jsx("div",{role:"slider",tabIndex:b?-1:0,"aria-valuemin":e,"aria-valuemax":r,"aria-valuenow":o,"aria-label":"Range maximum",className:d.cn("bear-absolute bear-top-1/2 bear--translate-y-1/2 bear--translate-x-1/2 bear-rounded-full bear-border-2 bear-shadow-md",m.thumb,M.thumb,!b&&"bear-cursor-grab active:bear-cursor-grabbing hover:bear-scale-110",t==="max"&&"bear-scale-125 bear-z-10"),style:{left:`${j}%`},onMouseDown:a=>N(a,"max")})]})})};exports.SliderRange=A;

package/dist/components/SliderRange/SliderRange.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { SliderRangeProps } from './SliderRange.types';
+export declare const SliderRange: FC<SliderRangeProps>;