@forgedevstack/bear 1.1.3 → 1.1.8

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

@@ -0,0 +1,22 @@
+import { ReactNode, HTMLAttributes } from 'react';
+export interface RadioCardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    value: string;
+    checked?: boolean;
+    onChange?: (value: string) => void;
+    label: string;
+    description?: string;
+    icon?: ReactNode;
+    disabled?: boolean;
+    variant?: 'default' | 'outline' | 'filled';
+    size?: 'sm' | 'md' | 'lg';
+    testId?: string;
+}
+export interface RadioCardGroupProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    value?: string;
+    onChange?: (value: string) => void;
+    children: ReactNode;
+    columns?: number;
+    gap?: number;
+    name?: string;
+    testId?: string;
+}

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

@@ -0,0 +1,2 @@
+export { RadioCard, RadioCardGroup, default } from './RadioCard';
+export type { RadioCardProps, RadioCardGroupProps } from './RadioCard.types';

package/dist/components/Result/Result.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../../utils/cn.cjs");require("react");const S=require("../Typography/Typography.cjs"),s=require("./Result.const.cjs"),E=require("./Result.icons.cjs"),A=n=>{const{status:t,title:o,subtitle:c,icon:i,extra:a,className:l,testId:u,...T}=n,d=i??E.getStatusIcon(t,s.STATUS_TEXT_CLASSES),_=s.STATUS_ICON_COLORS[t],C=t==="404"||t==="403"||t==="500";return e.jsxs("div",{className:r.cn(s.ROOT_CLASS,s.CONTAINER_CLASSES,l),"data-testid":u,...T,children:[e.jsx("div",{className:r.cn(s.ICON_WRAPPER_CLASSES,!C&&s.ICON_SIZE_CLASSES,_),children:d}),e.jsx(S.Typography,{variant:"h4",className:r.cn(s.TITLE_CLASSES,"bear-text-gray-900 dark:bear-text-zinc-100"),children:o}),c&&e.jsx(S.Typography,{variant:"body1",color:"secondary",className:s.SUBTITLE_CLASSES,children:c}),a&&e.jsx("div",{className:s.EXTRA_CLASSES,children:a})]})};exports.Result=A;

package/dist/components/Result/Result.const.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="Bear-Result",r="bear-flex bear-flex-col bear-items-center bear-justify-center bear-text-center bear-py-16 bear-px-6",S="bear-mb-4 bear-flex bear-items-center bear-justify-center",t="bear-w-16 bear-h-16",a={success:"bear-text-green-500 dark:bear-text-green-400",error:"bear-text-red-500 dark:bear-text-red-400",info:"bear-text-blue-500 dark:bear-text-blue-400",warning:"bear-text-amber-500 dark:bear-text-amber-400",404:"bear-text-gray-500 dark:bear-text-zinc-400",403:"bear-text-orange-500 dark:bear-text-orange-400",500:"bear-text-red-600 dark:bear-text-red-500"},b="bear-mb-2",n="bear-mb-6 bear-max-w-md",E="bear-flex bear-flex-wrap bear-gap-2 bear-justify-center",T="bear-text-5xl bear-font-bold bear-leading-none";exports.CONTAINER_CLASSES=r;exports.EXTRA_CLASSES=E;exports.ICON_SIZE_CLASSES=t;exports.ICON_WRAPPER_CLASSES=S;exports.ROOT_CLASS=e;exports.STATUS_ICON_COLORS=a;exports.STATUS_TEXT_CLASSES=T;exports.SUBTITLE_CLASSES=n;exports.TITLE_CLASSES=b;

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

@@ -0,0 +1,10 @@
+import { ResultStatus } from './Result.types';
+export declare const ROOT_CLASS = "Bear-Result";
+export declare const CONTAINER_CLASSES = "bear-flex bear-flex-col bear-items-center bear-justify-center bear-text-center bear-py-16 bear-px-6";
+export declare const ICON_WRAPPER_CLASSES = "bear-mb-4 bear-flex bear-items-center bear-justify-center";
+export declare const ICON_SIZE_CLASSES = "bear-w-16 bear-h-16";
+export declare const STATUS_ICON_COLORS: Record<ResultStatus, string>;
+export declare const TITLE_CLASSES = "bear-mb-2";
+export declare const SUBTITLE_CLASSES = "bear-mb-6 bear-max-w-md";
+export declare const EXTRA_CLASSES = "bear-flex bear-flex-wrap bear-gap-2 bear-justify-center";
+export declare const STATUS_TEXT_CLASSES = "bear-text-5xl bear-font-bold bear-leading-none";

package/dist/components/Result/Result.const.js

@@ -0,0 +1,20 @@
+const e = "Bear-Result", r = "bear-flex bear-flex-col bear-items-center bear-justify-center bear-text-center bear-py-16 bear-px-6", a = "bear-mb-4 bear-flex bear-items-center bear-justify-center", t = "bear-w-16 bear-h-16", b = {
+  success: "bear-text-green-500 dark:bear-text-green-400",
+  error: "bear-text-red-500 dark:bear-text-red-400",
+  info: "bear-text-blue-500 dark:bear-text-blue-400",
+  warning: "bear-text-amber-500 dark:bear-text-amber-400",
+  404: "bear-text-gray-500 dark:bear-text-zinc-400",
+  403: "bear-text-orange-500 dark:bear-text-orange-400",
+  500: "bear-text-red-600 dark:bear-text-red-500"
+}, S = "bear-mb-2", n = "bear-mb-6 bear-max-w-md", x = "bear-flex bear-flex-wrap bear-gap-2 bear-justify-center", c = "bear-text-5xl bear-font-bold bear-leading-none";
+export {
+  r as CONTAINER_CLASSES,
+  x as EXTRA_CLASSES,
+  t as ICON_SIZE_CLASSES,
+  a as ICON_WRAPPER_CLASSES,
+  e as ROOT_CLASS,
+  b as STATUS_ICON_COLORS,
+  c as STATUS_TEXT_CLASSES,
+  n as SUBTITLE_CLASSES,
+  S as TITLE_CLASSES
+};

package/dist/components/Result/Result.d.ts

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

package/dist/components/Result/Result.icons.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),t="0 0 24 24",r=64,n={width:r,height:r,viewBox:t,fill:"none",stroke:"currentColor",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"},i=()=>s.jsxs("svg",{...n,children:[s.jsx("path",{d:"M9 12l2 2 4-4"}),s.jsx("circle",{cx:"12",cy:"12",r:"10"})]}),l=()=>s.jsxs("svg",{...n,children:[s.jsx("circle",{cx:"12",cy:"12",r:"10"}),s.jsx("path",{d:"M15 9l-6 6M9 9l6 6"})]}),x=()=>s.jsxs("svg",{...n,children:[s.jsx("circle",{cx:"12",cy:"12",r:"10"}),s.jsx("path",{d:"M12 16v-4M12 8h.01"})]}),a=()=>s.jsx("svg",{...n,children:s.jsx("path",{d:"M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0zM12 9v4M12 17h.01"})}),h={success:i,error:l,info:x,warning:a},j=(c,e)=>{const o=h[c];return o?s.jsx(o,{}):s.jsx("span",{className:e,children:c.toUpperCase()})};exports.getStatusIcon=j;

package/dist/components/Result/Result.icons.d.ts

@@ -0,0 +1,3 @@
+import { ReactNode } from 'react';
+import { ResultStatus } from './Result.types';
+export declare const getStatusIcon: (status: ResultStatus, textClasses: string) => ReactNode;

package/dist/components/Result/Result.icons.js

@@ -0,0 +1,31 @@
+import { jsx as c, jsxs as o } from "react/jsx-runtime";
+const i = "0 0 24 24", e = 64, n = {
+  width: e,
+  height: e,
+  viewBox: i,
+  fill: "none",
+  stroke: "currentColor",
+  strokeWidth: 1.5,
+  strokeLinecap: "round",
+  strokeLinejoin: "round"
+}, h = () => /* @__PURE__ */ o("svg", { ...n, children: [
+  /* @__PURE__ */ c("path", { d: "M9 12l2 2 4-4" }),
+  /* @__PURE__ */ c("circle", { cx: "12", cy: "12", r: "10" })
+] }), l = () => /* @__PURE__ */ o("svg", { ...n, children: [
+  /* @__PURE__ */ c("circle", { cx: "12", cy: "12", r: "10" }),
+  /* @__PURE__ */ c("path", { d: "M15 9l-6 6M9 9l6 6" })
+] }), a = () => /* @__PURE__ */ o("svg", { ...n, children: [
+  /* @__PURE__ */ c("circle", { cx: "12", cy: "12", r: "10" }),
+  /* @__PURE__ */ c("path", { d: "M12 16v-4M12 8h.01" })
+] }), d = () => /* @__PURE__ */ c("svg", { ...n, children: /* @__PURE__ */ c("path", { d: "M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0zM12 9v4M12 17h.01" }) }), p = {
+  success: h,
+  error: l,
+  info: a,
+  warning: d
+}, v = (r, t) => {
+  const s = p[r];
+  return s ? /* @__PURE__ */ c(s, {}) : /* @__PURE__ */ c("span", { className: t, children: r.toUpperCase() });
+};
+export {
+  v as getStatusIcon
+};

package/dist/components/Result/Result.js

@@ -0,0 +1,35 @@
+import { jsxs as E, jsx as s } from "react/jsx-runtime";
+import { cn as S } from "../../utils/cn.js";
+import "react";
+import { Typography as e } from "../Typography/Typography.js";
+import { STATUS_ICON_COLORS as A, ICON_SIZE_CLASSES as _, ICON_WRAPPER_CLASSES as L, TITLE_CLASSES as N, SUBTITLE_CLASSES as I, EXTRA_CLASSES as p, CONTAINER_CLASSES as O, ROOT_CLASS as h, STATUS_TEXT_CLASSES as u } from "./Result.const.js";
+import { getStatusIcon as x } from "./Result.icons.js";
+const U = (o) => {
+  const {
+    status: t,
+    title: c,
+    subtitle: r,
+    icon: i,
+    extra: a,
+    className: n,
+    testId: l,
+    ...m
+  } = o, T = i ?? x(t, u), d = A[t], C = t === "404" || t === "403" || t === "500";
+  return /* @__PURE__ */ E(
+    "div",
+    {
+      className: S(h, O, n),
+      "data-testid": l,
+      ...m,
+      children: [
+        /* @__PURE__ */ s("div", { className: S(L, !C && _, d), children: T }),
+        /* @__PURE__ */ s(e, { variant: "h4", className: S(N, "bear-text-gray-900 dark:bear-text-zinc-100"), children: c }),
+        r && /* @__PURE__ */ s(e, { variant: "body1", color: "secondary", className: I, children: r }),
+        a && /* @__PURE__ */ s("div", { className: p, children: a })
+      ]
+    }
+  );
+};
+export {
+  U as Result
+};

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

@@ -0,0 +1,10 @@
+import { ReactNode, HTMLAttributes } from 'react';
+export type ResultStatus = 'success' | 'error' | 'info' | 'warning' | '404' | '403' | '500';
+export interface ResultProps extends HTMLAttributes<HTMLDivElement> {
+    status: ResultStatus;
+    title: string;
+    subtitle?: string;
+    icon?: ReactNode;
+    extra?: ReactNode;
+    testId?: string;
+}

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

@@ -0,0 +1,2 @@
+export { Result, default } from './Result';
+export type { ResultProps, ResultStatus } from './Result.types';

package/dist/components/RingProgress/RingProgress.cjs

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

package/dist/components/RingProgress/RingProgress.const.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=120,r=12,t="Bear-RingProgress bear-relative bear-inline-flex",S="bear-stroke-gray-200 dark:bear-stroke-zinc-700";exports.DEFAULT_SIZE=e;exports.DEFAULT_THICKNESS=r;exports.ROOT_CLASS=t;exports.TRACK_COLOR=S;

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

@@ -0,0 +1,4 @@
+export declare const DEFAULT_SIZE = 120;
+export declare const DEFAULT_THICKNESS = 12;
+export declare const ROOT_CLASS = "Bear-RingProgress bear-relative bear-inline-flex";
+export declare const TRACK_COLOR = "bear-stroke-gray-200 dark:bear-stroke-zinc-700";

package/dist/components/RingProgress/RingProgress.const.js

@@ -0,0 +1,7 @@
+const e = 120, r = 12, a = "Bear-RingProgress bear-relative bear-inline-flex", n = "bear-stroke-gray-200 dark:bear-stroke-zinc-700";
+export {
+  e as DEFAULT_SIZE,
+  r as DEFAULT_THICKNESS,
+  a as ROOT_CLASS,
+  n as TRACK_COLOR
+};

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

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

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/Select/Select.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),i=require("react"),a=require("../../utils/cn.cjs"),f=require("../Icon/index.cjs"),j={sm:"bear-h-8 bear-text-sm bear-px-3",md:"bear-h-10 bear-text-base bear-px-4",lg:"bear-h-12 bear-text-lg bear-px-5"},N=({options:u,value:t,onChange:s,placeholder:g="Select an option",label:x,error:l,disabled:n=!1,size:m="md",fullWidth:y=!1,className:h})=>{const[c,d]=i.useState(!1),o=i.useRef(null),k=!!l,b=u.find(e=>e.value===t);i.useEffect(()=>{const e=v=>{o.current&&!o.current.contains(v.target)&&d(!1)};return document.addEventListener("mousedown",e),()=>document.removeEventListener("mousedown",e)},[]);const w=e=>{s==null||s(e),d(!1)};return r.jsxs("div",{ref:o,className:a.cn("bear-relative bear-flex bear-flex-col bear-gap-1.5",y&&"bear-w-full"),children:[x&&r.jsx("label",{className:"bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-gray-300",children:x}),r.jsxs("button",{type:"button",disabled:n,onClick:()=>!n&&d(!c),className:a.cn("bear-flex bear-items-center bear-justify-between bear-w-full","bear-rounded-lg bear-border bear-text-left bear-outline-none bear-transition-all bear-duration-200","bear-bg-white bear-text-gray-900 bear-border-gray-300","focus:bear-ring-2 focus:bear-ring-offset-2 focus:bear-ring-offset-white","dark:bear-bg-gray-800 dark:bear-text-white dark:bear-border-gray-600 dark:focus:bear-ring-offset-gray-900",k?"bear-border-red-500 focus:bear-ring-red-500":"focus:bear-border-bear-500 focus:bear-ring-bear-500 dark:focus:bear-border-bear-500 dark:focus:bear-ring-bear-500",n&&"bear-opacity-50 bear-cursor-not-allowed",j[m],h),children:[r.jsx("span",{className:b?"bear-text-gray-900 dark:bear-text-white":"bear-text-gray-500 dark:bear-text-gray-500",children:(b==null?void 0:b.label)||g}),r.jsx(f.ChevronDownIcon,{className:a.cn("bear-w-4 bear-h-4 bear-text-gray-500 dark:bear-text-gray-400 bear-transition-transform",c&&"bear-rotate-180")})]}),c&&r.jsx("div",{className:a.cn("bear-absolute bear-z-50 bear-w-full bear-mt-1","bear-rounded-lg bear-border bear-shadow-lg bear-overflow-hidden bear-top-full","bear-bg-white bear-border-gray-200 dark:bear-bg-gray-800 dark:bear-border-gray-600"),children:r.jsx("div",{className:"bear-max-h-60 bear-overflow-y-auto",children:u.map(e=>r.jsxs("button",{type:"button",disabled:e.disabled,onClick:()=>!e.disabled&&w(e.value),className:a.cn("bear-flex bear-items-center bear-justify-between bear-w-full bear-px-4 bear-py-2","bear-text-left bear-transition-colors",e.disabled?"bear-text-gray-500 bear-cursor-not-allowed":"bear-text-gray-700 dark:bear-text-gray-300 hover:bear-bg-gray-100 hover:bear-text-gray-900 dark:hover:bear-bg-gray-700 dark:hover:bear-text-white",e.value===t&&"bear-bg-bear-100 bear-text-bear-700 dark:bear-bg-bear-600/20 dark:bear-text-bear-300"),children:[e.label,e.value===t&&r.jsx(f.CheckIcon,{className:"bear-w-4 bear-h-4 bear-text-bear-600 dark:bear-text-bear-400"})]},e.value))})}),l&&r.jsx("p",{className:"bear-text-sm bear-text-red-500",children:l})]})};exports.Select=N;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),n=require("react"),a=require("../../utils/cn.cjs"),j=require("../../hooks/useClickOutside.cjs");require("../../context/BearProvider.cjs");require("../../hooks/useBearComponent/useBearComponent.cjs");const f=require("../Icon/index.cjs"),N={sm:"bear-h-8 bear-text-sm bear-px-3",md:"bear-h-10 bear-text-base bear-px-4",lg:"bear-h-12 bear-text-lg bear-px-5"},p=({options:i,value:t,onChange:s,placeholder:g="Select an option",label:u,error:l,disabled:c=!1,size:y="md",fullWidth:h=!1,className:m})=>{const[o,d]=n.useState(!1),x=n.useRef(null),k=!!l,b=i.find(e=>e.value===t),w=n.useCallback(()=>d(!1),[]);j.useClickOutside(x,w);const v=e=>{s==null||s(e),d(!1)};return r.jsxs("div",{ref:x,className:a.cn("bear-relative bear-flex bear-flex-col bear-gap-1.5",h&&"bear-w-full"),children:[u&&r.jsx("label",{className:"bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-gray-300",children:u}),r.jsxs("button",{type:"button",disabled:c,onClick:()=>!c&&d(!o),className:a.cn("bear-flex bear-items-center bear-justify-between bear-w-full","bear-rounded-lg bear-border bear-text-left bear-outline-none bear-transition-all bear-duration-200","bear-bg-white bear-text-gray-900 bear-border-gray-300","focus:bear-ring-2 focus:bear-ring-offset-2 focus:bear-ring-offset-white","dark:bear-bg-gray-800 dark:bear-text-white dark:bear-border-gray-600 dark:focus:bear-ring-offset-gray-900",k?"bear-border-red-500 focus:bear-ring-red-500":"focus:bear-border-bear-500 focus:bear-ring-bear-500 dark:focus:bear-border-bear-500 dark:focus:bear-ring-bear-500",c&&"bear-opacity-50 bear-cursor-not-allowed",N[y],m),children:[r.jsx("span",{className:b?"bear-text-gray-900 dark:bear-text-white":"bear-text-gray-500 dark:bear-text-gray-500",children:(b==null?void 0:b.label)||g}),r.jsx(f.ChevronDownIcon,{className:a.cn("bear-w-4 bear-h-4 bear-text-gray-500 dark:bear-text-gray-400 bear-transition-transform",o&&"bear-rotate-180")})]}),o&&r.jsx("div",{className:a.cn("bear-absolute bear-z-50 bear-w-full bear-mt-1","bear-rounded-lg bear-border bear-shadow-lg bear-overflow-hidden bear-top-full","bear-bg-white bear-border-gray-200 dark:bear-bg-gray-800 dark:bear-border-gray-600"),children:r.jsx("div",{className:"bear-max-h-60 bear-overflow-y-auto",children:i.map(e=>r.jsxs("button",{type:"button",disabled:e.disabled,onClick:()=>!e.disabled&&v(e.value),className:a.cn("bear-flex bear-items-center bear-justify-between bear-w-full bear-px-4 bear-py-2","bear-text-left bear-transition-colors",e.disabled?"bear-text-gray-500 bear-cursor-not-allowed":"bear-text-gray-700 dark:bear-text-gray-300 hover:bear-bg-gray-100 hover:bear-text-gray-900 dark:hover:bear-bg-gray-700 dark:hover:bear-text-white",e.value===t&&"bear-bg-bear-100 bear-text-bear-700 dark:bear-bg-bear-600/20 dark:bear-text-bear-300"),children:[e.label,e.value===t&&r.jsx(f.CheckIcon,{className:"bear-w-4 bear-h-4 bear-text-bear-600 dark:bear-text-bear-400"})]},e.value))})}),l&&r.jsx("p",{className:"bear-text-sm bear-text-red-500",children:l})]})};exports.Select=p;

package/dist/components/Select/Select.js

@@ -1,46 +1,44 @@
-import { jsxs as i, jsx as r } from "react/jsx-runtime";
-import { useState as v, useRef as p, useEffect as N } from "react";
+import { jsxs as n, jsx as r } from "react/jsx-runtime";
+import { useState as p, useRef as v, useCallback as N } from "react";
 import { cn as a } from "../../utils/cn.js";
-import { ChevronDownIcon as j, CheckIcon as E } from "../Icon/index.js";
-const S = {
+import { useClickOutside as j } from "../../hooks/useClickOutside.js";
+import "../../context/BearProvider.js";
+import "../../hooks/useBearComponent/useBearComponent.js";
+import { ChevronDownIcon as S, CheckIcon as C } from "../Icon/index.js";
+const I = {
   sm: "bear-h-8 bear-text-sm bear-px-3",
   md: "bear-h-10 bear-text-base bear-px-4",
   lg: "bear-h-12 bear-text-lg bear-px-5"
-}, O = ({
-  options: f,
+}, A = ({
+  options: i,
   value: t,
   onChange: s,
-  placeholder: g = "Select an option",
-  label: u,
+  placeholder: x = "Select an option",
+  label: f,
   error: l,
   disabled: o = !1,
-  size: x = "md",
+  size: g = "md",
   fullWidth: m = !1,
   className: y
 }) => {
-  const [d, n] = v(!1), c = p(null), h = !!l, b = f.find((e) => e.value === t);
-  N(() => {
-    const e = (w) => {
-      c.current && !c.current.contains(w.target) && n(!1);
-    };
-    return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
-  }, []);
-  const k = (e) => {
-    s == null || s(e), n(!1);
+  const [d, c] = p(!1), u = v(null), h = !!l, b = i.find((e) => e.value === t), k = N(() => c(!1), []);
+  j(u, k);
+  const w = (e) => {
+    s == null || s(e), c(!1);
   };
-  return /* @__PURE__ */ i(
+  return /* @__PURE__ */ n(
     "div",
     {
-      ref: c,
+      ref: u,
       className: a("bear-relative bear-flex bear-flex-col bear-gap-1.5", m && "bear-w-full"),
       children: [
-        u && /* @__PURE__ */ r("label", { className: "bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-gray-300", children: u }),
-        /* @__PURE__ */ i(
+        f && /* @__PURE__ */ r("label", { className: "bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-gray-300", children: f }),
+        /* @__PURE__ */ n(
           "button",
           {
             type: "button",
             disabled: o,
-            onClick: () => !o && n(!d),
+            onClick: () => !o && c(!d),
             className: a(
               "bear-flex bear-items-center bear-justify-between bear-w-full",
               "bear-rounded-lg bear-border bear-text-left bear-outline-none bear-transition-all bear-duration-200",
@@ -49,13 +47,13 @@ const S = {
               "dark:bear-bg-gray-800 dark:bear-text-white dark:bear-border-gray-600 dark:focus:bear-ring-offset-gray-900",
               h ? "bear-border-red-500 focus:bear-ring-red-500" : "focus:bear-border-bear-500 focus:bear-ring-bear-500 dark:focus:bear-border-bear-500 dark:focus:bear-ring-bear-500",
               o && "bear-opacity-50 bear-cursor-not-allowed",
-              S[x],
+              I[g],
               y
             ),
             children: [
-              /* @__PURE__ */ r("span", { className: b ? "bear-text-gray-900 dark:bear-text-white" : "bear-text-gray-500 dark:bear-text-gray-500", children: (b == null ? void 0 : b.label) || g }),
+              /* @__PURE__ */ r("span", { className: b ? "bear-text-gray-900 dark:bear-text-white" : "bear-text-gray-500 dark:bear-text-gray-500", children: (b == null ? void 0 : b.label) || x }),
               /* @__PURE__ */ r(
-                j,
+                S,
                 {
                   className: a(
                     "bear-w-4 bear-h-4 bear-text-gray-500 dark:bear-text-gray-400 bear-transition-transform",
@@ -74,12 +72,12 @@ const S = {
               "bear-rounded-lg bear-border bear-shadow-lg bear-overflow-hidden bear-top-full",
               "bear-bg-white bear-border-gray-200 dark:bear-bg-gray-800 dark:bear-border-gray-600"
             ),
-            children: /* @__PURE__ */ r("div", { className: "bear-max-h-60 bear-overflow-y-auto", children: f.map((e) => /* @__PURE__ */ i(
+            children: /* @__PURE__ */ r("div", { className: "bear-max-h-60 bear-overflow-y-auto", children: i.map((e) => /* @__PURE__ */ n(
               "button",
               {
                 type: "button",
                 disabled: e.disabled,
-                onClick: () => !e.disabled && k(e.value),
+                onClick: () => !e.disabled && w(e.value),
                 className: a(
                   "bear-flex bear-items-center bear-justify-between bear-w-full bear-px-4 bear-py-2",
                   "bear-text-left bear-transition-colors",
@@ -88,7 +86,7 @@ const S = {
                 ),
                 children: [
                   e.label,
-                  e.value === t && /* @__PURE__ */ r(E, { className: "bear-w-4 bear-h-4 bear-text-bear-600 dark:bear-text-bear-400" })
+                  e.value === t && /* @__PURE__ */ r(C, { className: "bear-w-4 bear-h-4 bear-text-bear-600 dark:bear-text-bear-400" })
                 ]
               },
               e.value
@@ -101,5 +99,5 @@ const S = {
   );
 };
 export {
-  O as Select
+  A as Select
 };

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:o,width:p,height:D=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:a=!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=D;(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,D,_]),r.useEffect(()=>{_()},[_,E]),r.useEffect(()=>{const e=i.current;if(!e||a||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)}},[a,c]);const b=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(a||c)return;const t=b(e);g.current=!0,A.current=t},[a,c,b]),x=r.useCallback(e=>{if(!g.current||a||c)return;const t=i.current,n=t==null?void 0:t.getContext("2d"),l=A.current;if(!t||!n||!l)return;const d=b(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)},[a,c,k,T,b]),R=r.useCallback(()=>{if(g.current){const e=i.current;if(e&&o){const t=e.toDataURL(P,v);o(t)}}g.current=!1,A.current=null},[o,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),o==null||o(null))},[_,o]),Y=r.useCallback(()=>{const e=i.current;if(!e||!h)return;const t=e.toDataURL(P,v);o==null||o(t)},[h,o,P,v]);return u.jsxs("div",{id:q,"data-testid":K,className:S.cn("Bear-SignPad bear-w-full",s.SIGN_PAD_ROOT_CLASSES,a&&"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","bear-touch-none",s.SIGN_PAD_CANVAS_WRAPPER_CLASSES,!a&&!c&&s.SIGN_PAD_CANVAS_WRAPPER_HOVER,a&&"bear-cursor-not-allowed",!a&&!c&&"bear-cursor-crosshair"),children:[u.jsx("canvas",{ref:i,className:"Bear-SignPad__canvas bear-block bear-rounded-lg bear-w-full bear-touch-none",style:{height:D},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:a||!h,children:j}),m&&u.jsx(y.Button,{size:"sm",variant:"primary",onClick:Y,disabled:a||!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>;