@forgedevstack/bear 1.1.1 → 1.1.4

package/dist/components/InfiniteScroll/InfiniteScroll.js

@@ -0,0 +1,51 @@
+import { jsx as r, jsxs as C, Fragment as I } from "react/jsx-runtime";
+import { useRef as L, useCallback as R, useEffect as T } from "react";
+import { cn as O } from "../../utils/cn.js";
+import { DEFAULT_THRESHOLD as x, ROOT_CLASSES as D, SENTINEL_HEIGHT as E, MANUAL_BTN_CLASSES as H, END_CLASSES as y, LOADER_CLASSES as j, SPINNER_CLASSES as k } from "./InfiniteScroll.const.js";
+const G = (N) => {
+  const {
+    onLoadMore: i,
+    hasMore: e,
+    loading: t = !1,
+    threshold: l = x,
+    manual: n = !1,
+    loader: c,
+    endMessage: d,
+    loadMoreLabel: v = "Load more",
+    inverse: s = !1,
+    children: A,
+    className: g,
+    testId: M,
+    ..._
+  } = N, o = L(null), f = L(t);
+  f.current = t;
+  const a = R(() => {
+    f.current || !e || i();
+  }, [i, e]);
+  T(() => {
+    if (n || !e) return;
+    const h = o.current;
+    if (!h) return;
+    const m = new IntersectionObserver(
+      (p) => {
+        var u;
+        (u = p[0]) != null && u.isIntersecting && a();
+      },
+      { threshold: 0, rootMargin: `${Math.round(l * 100)}px` }
+    );
+    return m.observe(h), () => m.disconnect();
+  }, [n, e, a, l]);
+  const S = /* @__PURE__ */ r("div", { className: j, children: /* @__PURE__ */ r("div", { className: k }) }), b = /* @__PURE__ */ C(I, { children: [
+    s && e && !n && /* @__PURE__ */ r("div", { ref: o, style: { height: E } }),
+    s && t && (c ?? S),
+    A,
+    !s && t && (c ?? S),
+    !s && e && !n && /* @__PURE__ */ r("div", { ref: o, style: { height: E } }),
+    e && n && !t && /* @__PURE__ */ r("button", { type: "button", onClick: a, className: H, children: v }),
+    !e && d && /* @__PURE__ */ r("div", { className: y, children: d })
+  ] });
+  return /* @__PURE__ */ r("div", { className: O(D, g), "data-testid": M, ..._, children: b });
+};
+export {
+  G as InfiniteScroll
+};

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

@@ -0,0 +1,13 @@
+import { HTMLAttributes, ReactNode } from 'react';
+export interface InfiniteScrollProps extends HTMLAttributes<HTMLDivElement> {
+    onLoadMore: () => void | Promise<void>;
+    hasMore: boolean;
+    loading?: boolean;
+    threshold?: number;
+    manual?: boolean;
+    loader?: ReactNode;
+    endMessage?: ReactNode;
+    loadMoreLabel?: string;
+    inverse?: boolean;
+    testId?: string;
+}

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

@@ -0,0 +1,2 @@
+export { InfiniteScroll } from './InfiniteScroll';
+export type { InfiniteScrollProps } from './InfiniteScroll.types';

package/dist/components/Input/Input.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),g=require("react"),b=require("../../utils/cn.cjs"),f={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"},d=g.forwardRef(({label:s,helperText:n,error:r,size:u="md",leftAddon:a,rightAddon:t,fullWidth:c=!1,className:i,disabled:l,...p},x)=>{const o=!!r;return e.jsxs("div",{className:b.cn("Bear-Input bear-flex bear-flex-col bear-gap-1.5",c&&"bear-w-full"),children:[s&&e.jsx("label",{className:"Bear-Input__label bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-gray-300",children:s}),e.jsxs("div",{className:"Bear-Input__wrapper bear-relative bear-flex bear-items-center",children:[a&&e.jsx("div",{className:"Bear-Input__addon Bear-Input__addon--left bear-absolute bear-left-3 bear-text-gray-500 dark:bear-text-gray-400",children:a}),e.jsx("input",{ref:x,disabled:l,className:b.cn("Bear-Input__field","bear-w-full bear-rounded-lg bear-border bear-outline-none bear-transition-all bear-duration-200","bear-bg-white bear-text-gray-900 placeholder:bear-text-gray-400","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:placeholder:bear-text-gray-500 dark:bear-border-gray-600 dark:focus:bear-ring-offset-gray-900",o?"Bear-Input__field--error 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",l&&"Bear-Input__field--disabled bear-opacity-50 bear-cursor-not-allowed",a&&"bear-pl-10",t&&"bear-pr-10",f[u],i),...p}),t&&e.jsx("div",{className:"Bear-Input__addon Bear-Input__addon--right bear-absolute bear-right-3 bear-text-gray-500 dark:bear-text-gray-400",children:t})]}),(n||r)&&e.jsx("p",{className:b.cn("Bear-Input__helper bear-text-sm",o?"Bear-Input__helper--error bear-text-red-500":"bear-text-gray-500 dark:bear-text-gray-400"),children:r||n})]})});d.displayName="Input";exports.Input=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),s=require("react"),d=require("../../utils/cn.cjs"),ae=require("../../context/BearProvider.cjs"),L=require("./components/ClearIcon/ClearIcon.cjs"),te=require("./Input.utils.cjs"),se=require("../Form/Form.utils.cjs"),be={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=s.forwardRef(({label:B,helperText:T,error:f,success:j,size:V="md",leftAddon:x,rightAddon:b,fullWidth:D=!1,clearable:G=!1,onClear:m,showCharCount:N=!1,charCountMax:H,autoFormat:g,validation:t,validateOnBlur:J,validateOnChange:w=!1,className:K,disabled:p,value:_,defaultValue:y,maxLength:v,onChange:l,onBlur:n,...Q},U)=>{var F;const h=s.useContext(ae.BearContext),e=(F=h==null?void 0:h.components)==null?void 0:F.Input,W=e==null?void 0:e.root,X=e==null?void 0:e.input,Y=e==null?void 0:e.label,Z=e==null?void 0:e.helper,$=e==null?void 0:e.prefix,q=e==null?void 0:e.suffix,[S,C]=s.useState(null),E=s.useRef(!1),R=t?J??!0:!1,M=f||S,c=!!M,O=!!j&&!c,u=H??v,I=typeof _=="string"?_.length:typeof y=="string"?y.length:0,A=u!=null&&I>u,k=G&&!p&&I>0,z=M||j||T,i=s.useCallback(async a=>{if(!t)return;E.current=!0;const o=await se.validateFieldValue(a,t);E.current=!1,C(o)},[t]);s.useEffect(()=>{f&&C(null)},[f]);const ee=s.useCallback(a=>{if(g){const o=te.applyAutoFormat(a.target.value,g);o!==a.target.value&&(a.target.value=o)}l==null||l(a),w&&t&&i(a.target.value)},[g,l,w,t,i]),re=s.useCallback(a=>{n==null||n(a),R&&t&&i(a.target.value)},[n,R,t,i]);return r.jsxs("div",{className:d.cn("Bear-Input bear-flex bear-flex-col bear-gap-1.5",D&&"bear-w-full"),style:W,children:[B&&r.jsx("label",{className:"Bear-Input__label bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-gray-300",style:Y,children:B}),r.jsxs("div",{className:"Bear-Input__wrapper bear-relative bear-flex bear-items-center",children:[x&&r.jsx("div",{className:"Bear-Input__addon Bear-Input__addon--left bear-absolute bear-left-3 bear-text-gray-500 dark:bear-text-gray-400",style:$,children:x}),r.jsx("input",{ref:U,disabled:p,value:_,defaultValue:y,maxLength:v,"aria-invalid":c||void 0,onChange:ee,onBlur:re,className:d.cn("Bear-Input__field","bear-w-full bear-rounded-lg bear-border bear-outline-none bear-transition-all bear-duration-200","bear-bg-white bear-text-gray-900 placeholder:bear-text-gray-400","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:placeholder:bear-text-gray-500 dark:bear-border-gray-600 dark:focus:bear-ring-offset-gray-900",c?"Bear-Input__field--error bear-border-red-500 focus:bear-ring-red-500":O?"Bear-Input__field--success bear-border-green-500 focus:bear-ring-green-500":"focus:bear-border-bear-500 focus:bear-ring-bear-500 dark:focus:bear-border-bear-500 dark:focus:bear-ring-bear-500",p&&"Bear-Input__field--disabled bear-opacity-50 bear-cursor-not-allowed",x&&"bear-pl-10",(b||k)&&"bear-pr-10",be[V],K),style:X,...Q}),k&&!b&&r.jsx("div",{className:"Bear-Input__addon Bear-Input__addon--right bear-absolute bear-right-3 bear-text-gray-500 dark:bear-text-gray-400",style:q,children:r.jsx(L.ClearIcon,{onClick:m})}),b&&r.jsxs("div",{className:"Bear-Input__addon Bear-Input__addon--right bear-absolute bear-right-3 bear-flex bear-items-center bear-gap-1.5 bear-text-gray-500 dark:bear-text-gray-400",style:q,children:[k&&r.jsx(L.ClearIcon,{onClick:m}),b]})]}),r.jsxs("div",{className:"Bear-Input__footer bear-flex bear-items-center bear-justify-between bear-gap-2",children:[z?r.jsx("p",{className:d.cn("Bear-Input__helper bear-text-sm bear-flex-1",c?"Bear-Input__helper--error bear-text-red-500":O?"Bear-Input__helper--success bear-text-green-500":"bear-text-gray-500 dark:bear-text-gray-400"),style:Z,children:z}):N?r.jsx("span",{}):null,N&&u!=null&&r.jsxs("span",{className:d.cn("Bear-Input__char-count bear-text-xs bear-tabular-nums bear-shrink-0",A?"bear-text-red-500":"bear-text-gray-400 dark:bear-text-gray-500"),children:[I,"/",u]})]})]})});P.displayName="Input";exports.Input=P;

package/dist/components/Input/Input.js

@@ -1,65 +1,135 @@
-import { jsxs as n, jsx as r } from "react/jsx-runtime";
-import { forwardRef as g } from "react";
-import { cn as t } from "../../utils/cn.js";
-const x = {
+import { jsxs as s, jsx as t } from "react/jsx-runtime";
+import { forwardRef as ae, useContext as te, useState as se, useRef as be, useCallback as B, useEffect as le } from "react";
+import { cn as f } from "../../utils/cn.js";
+import { BearContext as ne } from "../../context/BearProvider.js";
+import { ClearIcon as D } from "./components/ClearIcon/ClearIcon.js";
+import { applyAutoFormat as ce } from "./Input.utils.js";
+import { validateFieldValue as ie } from "../Form/Form.utils.js";
+const ue = {
   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"
-}, m = g(
+}, oe = ae(
   ({
-    label: s,
-    helperText: l,
-    error: e,
-    size: i = "md",
-    leftAddon: a,
+    label: k,
+    helperText: F,
+    error: d,
+    success: N,
+    size: G = "md",
+    leftAddon: p,
     rightAddon: b,
-    fullWidth: u = !1,
-    className: p,
-    disabled: o,
-    ...c
-  }, f) => {
-    const d = !!e;
-    return /* @__PURE__ */ n("div", { className: t("Bear-Input bear-flex bear-flex-col bear-gap-1.5", u && "bear-w-full"), children: [
-      s && /* @__PURE__ */ r("label", { className: "Bear-Input__label bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-gray-300", children: s }),
-      /* @__PURE__ */ n("div", { className: "Bear-Input__wrapper bear-relative bear-flex bear-items-center", children: [
-        a && /* @__PURE__ */ r("div", { className: "Bear-Input__addon Bear-Input__addon--left bear-absolute bear-left-3 bear-text-gray-500 dark:bear-text-gray-400", children: a }),
-        /* @__PURE__ */ r(
+    fullWidth: H = !1,
+    clearable: J = !1,
+    onClear: w,
+    showCharCount: v = !1,
+    charCountMax: K,
+    autoFormat: g,
+    validation: a,
+    validateOnBlur: Q,
+    validateOnChange: E = !1,
+    className: T,
+    disabled: x,
+    value: _,
+    defaultValue: y,
+    maxLength: j,
+    onChange: l,
+    onBlur: n,
+    ...U
+  }, W) => {
+    var q;
+    const h = te(ne), e = (q = h == null ? void 0 : h.components) == null ? void 0 : q.Input, X = e == null ? void 0 : e.root, Y = e == null ? void 0 : e.input, Z = e == null ? void 0 : e.label, $ = e == null ? void 0 : e.helper, P = e == null ? void 0 : e.prefix, M = e == null ? void 0 : e.suffix, [S, R] = se(null), z = be(!1), C = a ? Q ?? !0 : !1, L = d || S, c = !!L, O = !!N && !c, i = K ?? j, m = typeof _ == "string" ? _.length : typeof y == "string" ? y.length : 0, A = i != null && m > i, I = J && !x && m > 0, V = L || N || F, u = B(async (r) => {
+      if (!a) return;
+      z.current = !0;
+      const o = await ie(r, a);
+      z.current = !1, R(o);
+    }, [a]);
+    le(() => {
+      d && R(null);
+    }, [d]);
+    const ee = B(
+      (r) => {
+        if (g) {
+          const o = ce(r.target.value, g);
+          o !== r.target.value && (r.target.value = o);
+        }
+        l == null || l(r), E && a && u(r.target.value);
+      },
+      [g, l, E, a, u]
+    ), re = B(
+      (r) => {
+        n == null || n(r), C && a && u(r.target.value);
+      },
+      [n, C, a, u]
+    );
+    return /* @__PURE__ */ s("div", { className: f("Bear-Input bear-flex bear-flex-col bear-gap-1.5", H && "bear-w-full"), style: X, children: [
+      k && /* @__PURE__ */ t("label", { className: "Bear-Input__label bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-gray-300", style: Z, children: k }),
+      /* @__PURE__ */ s("div", { className: "Bear-Input__wrapper bear-relative bear-flex bear-items-center", children: [
+        p && /* @__PURE__ */ t("div", { className: "Bear-Input__addon Bear-Input__addon--left bear-absolute bear-left-3 bear-text-gray-500 dark:bear-text-gray-400", style: P, children: p }),
+        /* @__PURE__ */ t(
           "input",
           {
-            ref: f,
-            disabled: o,
-            className: t(
+            ref: W,
+            disabled: x,
+            value: _,
+            defaultValue: y,
+            maxLength: j,
+            "aria-invalid": c || void 0,
+            onChange: ee,
+            onBlur: re,
+            className: f(
               "Bear-Input__field",
               "bear-w-full bear-rounded-lg bear-border bear-outline-none bear-transition-all bear-duration-200",
               "bear-bg-white bear-text-gray-900 placeholder:bear-text-gray-400",
               "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:placeholder:bear-text-gray-500 dark:bear-border-gray-600 dark:focus:bear-ring-offset-gray-900",
-              d ? "Bear-Input__field--error 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-Input__field--disabled bear-opacity-50 bear-cursor-not-allowed",
-              a && "bear-pl-10",
-              b && "bear-pr-10",
-              x[i],
-              p
+              c ? "Bear-Input__field--error bear-border-red-500 focus:bear-ring-red-500" : O ? "Bear-Input__field--success bear-border-green-500 focus:bear-ring-green-500" : "focus:bear-border-bear-500 focus:bear-ring-bear-500 dark:focus:bear-border-bear-500 dark:focus:bear-ring-bear-500",
+              x && "Bear-Input__field--disabled bear-opacity-50 bear-cursor-not-allowed",
+              p && "bear-pl-10",
+              (b || I) && "bear-pr-10",
+              ue[G],
+              T
             ),
-            ...c
+            style: Y,
+            ...U
           }
         ),
-        b && /* @__PURE__ */ r("div", { className: "Bear-Input__addon Bear-Input__addon--right bear-absolute bear-right-3 bear-text-gray-500 dark:bear-text-gray-400", children: b })
+        I && !b && /* @__PURE__ */ t("div", { className: "Bear-Input__addon Bear-Input__addon--right bear-absolute bear-right-3 bear-text-gray-500 dark:bear-text-gray-400", style: M, children: /* @__PURE__ */ t(D, { onClick: w }) }),
+        b && /* @__PURE__ */ s("div", { className: "Bear-Input__addon Bear-Input__addon--right bear-absolute bear-right-3 bear-flex bear-items-center bear-gap-1.5 bear-text-gray-500 dark:bear-text-gray-400", style: M, children: [
+          I && /* @__PURE__ */ t(D, { onClick: w }),
+          b
+        ] })
       ] }),
-      (l || e) && /* @__PURE__ */ r(
-        "p",
-        {
-          className: t(
-            "Bear-Input__helper bear-text-sm",
-            d ? "Bear-Input__helper--error bear-text-red-500" : "bear-text-gray-500 dark:bear-text-gray-400"
-          ),
-          children: e || l
-        }
-      )
+      /* @__PURE__ */ s("div", { className: "Bear-Input__footer bear-flex bear-items-center bear-justify-between bear-gap-2", children: [
+        V ? /* @__PURE__ */ t(
+          "p",
+          {
+            className: f(
+              "Bear-Input__helper bear-text-sm bear-flex-1",
+              c ? "Bear-Input__helper--error bear-text-red-500" : O ? "Bear-Input__helper--success bear-text-green-500" : "bear-text-gray-500 dark:bear-text-gray-400"
+            ),
+            style: $,
+            children: V
+          }
+        ) : v ? /* @__PURE__ */ t("span", {}) : null,
+        v && i != null && /* @__PURE__ */ s(
+          "span",
+          {
+            className: f(
+              "Bear-Input__char-count bear-text-xs bear-tabular-nums bear-shrink-0",
+              A ? "bear-text-red-500" : "bear-text-gray-400 dark:bear-text-gray-500"
+            ),
+            children: [
+              m,
+              "/",
+              i
+            ]
+          }
+        )
+      ] })
     ] });
   }
 );
-m.displayName = "Input";
+oe.displayName = "Input";
 export {
-  m as Input
+  oe as Input
 };

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

@@ -1,4 +1,6 @@
 import { InputHTMLAttributes, ReactNode } from 'react';
+import { ValidationRule } from '../Form/Form.types';
+export type AutoFormatType = 'capitalize' | 'uppercase' | 'lowercase' | 'titleCase' | 'sentenceCase' | 'none';
 export interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
     /** Input label */
     label?: string;
@@ -6,6 +8,8 @@ export interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>,
     helperText?: string;
     /** Error message */
     error?: string;
+    /** Success message (green helper text) */
+    success?: string;
     /** Input size */
     size?: 'sm' | 'md' | 'lg';
     /** Left addon */
@@ -14,4 +18,20 @@ export interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>,
     rightAddon?: ReactNode;
     /** Whether input is full width */
     fullWidth?: boolean;
+    /** Show a clear (X) button when input has value */
+    clearable?: boolean;
+    /** Callback when clear button is clicked */
+    onClear?: () => void;
+    /** Show live character count (requires maxLength or charCountMax) */
+    showCharCount?: boolean;
+    /** Max chars for counter display (alternative to maxLength when you don't want native enforcement) */
+    charCountMax?: number;
+    /** Auto-format text on change using Anvil string utils */
+    autoFormat?: AutoFormatType;
+    /** Validation rules (reuses Form's ValidationRule) */
+    validation?: ValidationRule;
+    /** Run validation on blur (default true when validation is set) */
+    validateOnBlur?: boolean;
+    /** Run validation on change */
+    validateOnChange?: boolean;
 }

package/dist/components/Input/Input.utils.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("@forgedevstack/anvil"),n=e=>e.toUpperCase(),a=e=>e.toLowerCase(),r={capitalize:o.capitalize,uppercase:n,lowercase:a,titleCase:o.titleCase,sentenceCase:o.sentenceCase},c=(e,t)=>{if(!t||t==="none")return e;const s=r[t];return s?s(e):e};exports.applyAutoFormat=c;

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

@@ -0,0 +1,2 @@
+import { AutoFormatType } from './Input.types';
+export declare const applyAutoFormat: (value: string, format: AutoFormatType | undefined) => string;

package/dist/components/Input/Input.utils.js

@@ -0,0 +1,15 @@
+import { sentenceCase as s, titleCase as n, capitalize as r } from "@forgedevstack/anvil";
+const p = (e) => e.toUpperCase(), c = (e) => e.toLowerCase(), a = {
+  capitalize: r,
+  uppercase: p,
+  lowercase: c,
+  titleCase: n,
+  sentenceCase: s
+}, i = (e, t) => {
+  if (!t || t === "none") return e;
+  const o = a[t];
+  return o ? o(e) : e;
+};
+export {
+  i as applyAutoFormat
+};

package/dist/components/Input/components/ClearIcon/ClearIcon.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("../../../../utils/cn.cjs");require("react");const t=({className:r,onClick:a})=>e.jsx("button",{type:"button",tabIndex:-1,onClick:a,className:n.cn("Bear-Input__clear bear-inline-flex bear-items-center bear-justify-center","bear-rounded-full bear-w-4 bear-h-4 bear-bg-gray-300 dark:bear-bg-gray-600","hover:bear-bg-gray-400 dark:hover:bear-bg-gray-500 bear-transition-colors bear-cursor-pointer",r),"aria-label":"Clear input",children:e.jsxs("svg",{width:"8",height:"8",viewBox:"0 0 8 8",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",children:[e.jsx("line",{x1:"1",y1:"1",x2:"7",y2:"7"}),e.jsx("line",{x1:"7",y1:"1",x2:"1",y2:"7"})]})});exports.ClearIcon=t;

package/dist/components/Input/components/ClearIcon/ClearIcon.d.ts

@@ -0,0 +1,7 @@
+import { FC } from 'react';
+interface ClearIconProps {
+    className?: string;
+    onClick?: () => void;
+}
+export declare const ClearIcon: FC<ClearIconProps>;
+export {};

package/dist/components/Input/components/ClearIcon/ClearIcon.js

@@ -0,0 +1,25 @@
+import { jsx as r, jsxs as t } from "react/jsx-runtime";
+import { cn as o } from "../../../../utils/cn.js";
+import "react";
+const l = ({ className: e, onClick: a }) => /* @__PURE__ */ r(
+  "button",
+  {
+    type: "button",
+    tabIndex: -1,
+    onClick: a,
+    className: o(
+      "Bear-Input__clear bear-inline-flex bear-items-center bear-justify-center",
+      "bear-rounded-full bear-w-4 bear-h-4 bear-bg-gray-300 dark:bear-bg-gray-600",
+      "hover:bear-bg-gray-400 dark:hover:bear-bg-gray-500 bear-transition-colors bear-cursor-pointer",
+      e
+    ),
+    "aria-label": "Clear input",
+    children: /* @__PURE__ */ t("svg", { width: "8", height: "8", viewBox: "0 0 8 8", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", children: [
+      /* @__PURE__ */ r("line", { x1: "1", y1: "1", x2: "7", y2: "7" }),
+      /* @__PURE__ */ r("line", { x1: "7", y1: "1", x2: "1", y2: "7" })
+    ] })
+  }
+);
+export {
+  l as ClearIcon
+};

package/dist/components/Input/components/ClearIcon/index.d.ts

@@ -0,0 +1 @@
+export { ClearIcon } from './ClearIcon';

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

@@ -1,2 +1,2 @@
 export { Input } from './Input';
-export type { InputProps } from './Input.types';
+export type { InputProps, AutoFormatType } from './Input.types';

package/dist/components/InputGroup/InputGroup.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("../../utils/cn.cjs");require("react");const r=require("../Typography/Typography.cjs"),y=({label:a,description:t,error:n,helperText:u,required:p=!1,fullWidth:c=!1,children:i,className:d,htmlFor:b,testId:x})=>{const s=!!n,o=n||u;return e.jsxs("div",{className:l.cn("Bear-InputGroup bear-flex bear-flex-col bear-gap-1.5",c&&"bear-w-full",d),"data-testid":x,children:[a&&e.jsx("label",{htmlFor:b,className:"Bear-InputGroup__label",children:e.jsxs(r.Typography,{variant:"body2",className:"bear-font-medium bear-text-gray-700 dark:bear-text-gray-300",inline:!0,children:[a,p&&e.jsx("span",{className:"Bear-InputGroup__required bear-text-red-500 bear-ml-0.5","aria-hidden":"true",children:"*"})]})}),t&&e.jsx(r.Typography,{variant:"caption",className:"Bear-InputGroup__description bear-text-gray-500 dark:bear-text-gray-400",children:t}),e.jsx("div",{className:"Bear-InputGroup__content",children:i}),o&&e.jsx(r.Typography,{variant:"body2",className:l.cn("Bear-InputGroup__helper",s?"bear-text-red-500":"bear-text-gray-500 dark:bear-text-gray-400"),role:s?"alert":void 0,children:o})]})};exports.InputGroup=y;

package/dist/components/InputGroup/InputGroup.d.ts

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

package/dist/components/InputGroup/InputGroup.js

@@ -0,0 +1,63 @@
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
+import { cn as p } from "../../utils/cn.js";
+import "react";
+import { Typography as r } from "../Typography/Typography.js";
+const g = ({
+  label: a,
+  description: t,
+  error: n,
+  helperText: i,
+  required: d = !1,
+  fullWidth: c = !1,
+  children: u,
+  className: b,
+  htmlFor: m,
+  testId: x
+}) => {
+  const o = !!n, l = n || i;
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      className: p("Bear-InputGroup bear-flex bear-flex-col bear-gap-1.5", c && "bear-w-full", b),
+      "data-testid": x,
+      children: [
+        a && /* @__PURE__ */ e("label", { htmlFor: m, className: "Bear-InputGroup__label", children: /* @__PURE__ */ s(
+          r,
+          {
+            variant: "body2",
+            className: "bear-font-medium bear-text-gray-700 dark:bear-text-gray-300",
+            inline: !0,
+            children: [
+              a,
+              d && /* @__PURE__ */ e("span", { className: "Bear-InputGroup__required bear-text-red-500 bear-ml-0.5", "aria-hidden": "true", children: "*" })
+            ]
+          }
+        ) }),
+        t && /* @__PURE__ */ e(
+          r,
+          {
+            variant: "caption",
+            className: "Bear-InputGroup__description bear-text-gray-500 dark:bear-text-gray-400",
+            children: t
+          }
+        ),
+        /* @__PURE__ */ e("div", { className: "Bear-InputGroup__content", children: u }),
+        l && /* @__PURE__ */ e(
+          r,
+          {
+            variant: "body2",
+            className: p(
+              "Bear-InputGroup__helper",
+              o ? "bear-text-red-500" : "bear-text-gray-500 dark:bear-text-gray-400"
+            ),
+            role: o ? "alert" : void 0,
+            children: l
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  g as InputGroup
+};

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

@@ -0,0 +1,23 @@
+import { ReactNode } from 'react';
+export interface InputGroupProps {
+    /** Group label */
+    label?: string;
+    /** Description text (below label, above input) */
+    description?: string;
+    /** Error message (overrides helperText styling) */
+    error?: string;
+    /** Helper text (below input) */
+    helperText?: string;
+    /** Whether the field is required (shows asterisk) */
+    required?: boolean;
+    /** Whether the group takes full width */
+    fullWidth?: boolean;
+    /** The input element(s) */
+    children: ReactNode;
+    /** Additional class name */
+    className?: string;
+    /** HTML for attribute linking label to input */
+    htmlFor?: string;
+    /** Test ID */
+    testId?: string;
+}

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

@@ -0,0 +1,2 @@
+export { InputGroup, default } from './InputGroup';
+export * from './InputGroup.types';

package/dist/components/LoadingOverlay/LoadingOverlay.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),u=require("../../utils/cn.cjs");require("react");const y=require("../Typography/Typography.cjs"),A=require("../Spinner/Spinner.cjs"),e=require("./LoadingOverlay.const.cjs"),S={sm:"sm",md:"md",lg:"lg"},_=({visible:a,loader:t,overlayOpacity:n=e.DEFAULT_OVERLAY_OPACITY,overlayBlur:i=e.DEFAULT_OVERLAY_BLUR,zIndex:c=e.DEFAULT_Z_INDEX,loaderSize:o="md",label:s,children:d,className:l,testId:p,...L})=>r.jsxs("div",{className:u.cn(e.ROOT_CLASS,l),"data-testid":p,...L,children:[d,a&&r.jsxs("div",{className:e.OVERLAY_CLASS,style:{opacity:n,backdropFilter:`blur(${i}px)`,WebkitBackdropFilter:`blur(${i}px)`,zIndex:c},"aria-busy":!0,"aria-live":"polite",children:[t??r.jsx(A.Spinner,{size:S[o],className:"bear-text-pink-500 dark:bear-text-pink-400"}),s&&r.jsx(y.Typography,{variant:"body2",color:"secondary",className:e.LABEL_CLASS,children:s})]})]});exports.LoadingOverlay=_;

package/dist/components/LoadingOverlay/LoadingOverlay.const.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=.5,a=2,r=10,L="Bear-LoadingOverlay bear-relative",t="bear-absolute bear-inset-0 bear-flex bear-flex-col bear-items-center bear-justify-center bear-transition-opacity bear-duration-200 bear-bg-white/50 dark:bear-bg-zinc-900/50",A="Bear-LoadingOverlay__label bear-mt-2";exports.DEFAULT_OVERLAY_BLUR=a;exports.DEFAULT_OVERLAY_OPACITY=e;exports.DEFAULT_Z_INDEX=r;exports.LABEL_CLASS=A;exports.OVERLAY_CLASS=t;exports.ROOT_CLASS=L;

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

@@ -0,0 +1,6 @@
+export declare const DEFAULT_OVERLAY_OPACITY = 0.5;
+export declare const DEFAULT_OVERLAY_BLUR = 2;
+export declare const DEFAULT_Z_INDEX = 10;
+export declare const ROOT_CLASS = "Bear-LoadingOverlay bear-relative";
+export declare const OVERLAY_CLASS = "bear-absolute bear-inset-0 bear-flex bear-flex-col bear-items-center bear-justify-center bear-transition-opacity bear-duration-200 bear-bg-white/50 dark:bear-bg-zinc-900/50";
+export declare const LABEL_CLASS = "Bear-LoadingOverlay__label bear-mt-2";

package/dist/components/LoadingOverlay/LoadingOverlay.const.js

@@ -0,0 +1,9 @@
+const e = 0.5, a = 2, r = 10, t = "Bear-LoadingOverlay bear-relative", b = "bear-absolute bear-inset-0 bear-flex bear-flex-col bear-items-center bear-justify-center bear-transition-opacity bear-duration-200 bear-bg-white/50 dark:bear-bg-zinc-900/50", n = "Bear-LoadingOverlay__label bear-mt-2";
+export {
+  a as DEFAULT_OVERLAY_BLUR,
+  e as DEFAULT_OVERLAY_OPACITY,
+  r as DEFAULT_Z_INDEX,
+  n as LABEL_CLASS,
+  b as OVERLAY_CLASS,
+  t as ROOT_CLASS
+};

package/dist/components/LoadingOverlay/LoadingOverlay.d.ts

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

package/dist/components/LoadingOverlay/LoadingOverlay.js

@@ -0,0 +1,42 @@
+import { jsxs as t, jsx as a } from "react/jsx-runtime";
+import { cn as L } from "../../utils/cn.js";
+import "react";
+import { Typography as A } from "../Typography/Typography.js";
+import { Spinner as _ } from "../Spinner/Spinner.js";
+import { DEFAULT_Z_INDEX as E, DEFAULT_OVERLAY_BLUR as S, DEFAULT_OVERLAY_OPACITY as b, OVERLAY_CLASS as x, LABEL_CLASS as y, ROOT_CLASS as N } from "./LoadingOverlay.const.js";
+const O = { sm: "sm", md: "md", lg: "lg" }, h = ({
+  visible: e,
+  loader: o,
+  overlayOpacity: m = b,
+  overlayBlur: r = S,
+  zIndex: s = E,
+  loaderSize: p = "md",
+  label: i,
+  children: d,
+  className: c,
+  testId: l,
+  ...n
+}) => /* @__PURE__ */ t("div", { className: L(N, c), "data-testid": l, ...n, children: [
+  d,
+  e && /* @__PURE__ */ t(
+    "div",
+    {
+      className: x,
+      style: {
+        opacity: m,
+        backdropFilter: `blur(${r}px)`,
+        WebkitBackdropFilter: `blur(${r}px)`,
+        zIndex: s
+      },
+      "aria-busy": !0,
+      "aria-live": "polite",
+      children: [
+        o ?? /* @__PURE__ */ a(_, { size: O[p], className: "bear-text-pink-500 dark:bear-text-pink-400" }),
+        i && /* @__PURE__ */ a(A, { variant: "body2", color: "secondary", className: y, children: i })
+      ]
+    }
+  )
+] });
+export {
+  h as LoadingOverlay
+};

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

@@ -0,0 +1,11 @@
+import { ReactNode, HTMLAttributes } from 'react';
+export interface LoadingOverlayProps extends HTMLAttributes<HTMLDivElement> {
+    visible: boolean;
+    loader?: ReactNode;
+    overlayOpacity?: number;
+    overlayBlur?: number;
+    zIndex?: number;
+    loaderSize?: 'sm' | 'md' | 'lg';
+    label?: string;
+    testId?: string;
+}

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

@@ -0,0 +1,2 @@
+export { LoadingOverlay, default } from './LoadingOverlay';
+export type { LoadingOverlayProps } from './LoadingOverlay.types';

package/dist/components/NumberFormatter/NumberFormatter.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S=require("react/jsx-runtime"),r=require("react"),T=require("../../utils/cn.cjs"),u=require("./NumberFormatter.const.cjs"),_=require("./NumberFormatter.utils.cjs"),g=t=>{const{value:e,prefix:A="",suffix:F="",animated:c=!1,animationDuration:o=u.DEFAULT_ANIMATION_DURATION,className:N,testId:y,...D}=t,M=r.useMemo(()=>_.buildFormatter(t),[t.formatStyle,t.locale,t.currency,t.currencyDisplay,t.unit,t.unitDisplay,t.notation,t.minimumFractionDigits,t.maximumFractionDigits,t.signDisplay]),[R,n]=r.useState(e),a=r.useRef(e),i=r.useRef(0);r.useEffect(()=>{if(!c){n(e),a.current=e;return}const m=a.current,l=e-m;if(l===0)return;const f=Math.max(1,Math.round(o/u.ANIMATION_FRAME_RATE));let s=0;const d=()=>{s++;const q=s/f,I=1-Math.pow(1-q,3);n(m+l*I),s<f?i.current=requestAnimationFrame(d):(n(e),a.current=e)};return i.current=requestAnimationFrame(d),()=>cancelAnimationFrame(i.current)},[e,c,o]);const b=M.format(R);return S.jsxs("span",{className:T.cn(u.ROOT_CLASSES,N),"data-testid":y,...D,children:[A,b,F]})};exports.NumberFormatter=g;

package/dist/components/NumberFormatter/NumberFormatter.const.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A="en-US",T="USD",E=400,e=16,t="Bear-NumberFormatter bear-inline bear-tabular-nums";exports.ANIMATION_FRAME_RATE=e;exports.DEFAULT_ANIMATION_DURATION=E;exports.DEFAULT_CURRENCY=T;exports.DEFAULT_LOCALE=A;exports.ROOT_CLASSES=t;

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

@@ -0,0 +1,5 @@
+export declare const DEFAULT_LOCALE = "en-US";
+export declare const DEFAULT_CURRENCY = "USD";
+export declare const DEFAULT_ANIMATION_DURATION = 400;
+export declare const ANIMATION_FRAME_RATE = 16;
+export declare const ROOT_CLASSES = "Bear-NumberFormatter bear-inline bear-tabular-nums";

package/dist/components/NumberFormatter/NumberFormatter.const.js

@@ -0,0 +1,8 @@
+const A = "en-US", n = "USD", t = 400, e = 16, r = "Bear-NumberFormatter bear-inline bear-tabular-nums";
+export {
+  e as ANIMATION_FRAME_RATE,
+  t as DEFAULT_ANIMATION_DURATION,
+  n as DEFAULT_CURRENCY,
+  A as DEFAULT_LOCALE,
+  r as ROOT_CLASSES
+};

package/dist/components/NumberFormatter/NumberFormatter.d.ts

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