@forgedevstack/bear 1.3.0 → 1.3.2

package/dist/components/ResizablePanel/ResizablePanel.js

@@ -1,70 +1,63 @@
-import { jsxs as k, jsx as d } from "react/jsx-runtime";
-import { useState as C, useRef as H, useCallback as w } from "react";
-import { DEFAULT_DIRECTION as A, DEFAULT_FIRST_SIZE as M, MIN_SIZE as O, MAX_SIZE as U, EVENT_POINTER_MOVE as p, EVENT_POINTER_UP as v, HANDLE_WIDTH as E } from "./ResizablePanel.const.js";
-import { clampSize as $, getResizePercentage as B } from "./ResizablePanel.utils.js";
-import { cn as I } from "../../utils/cn.js";
-const X = (z) => {
+import { jsxs as w, jsx as a } from "react/jsx-runtime";
+import { cn as n } from "../../utils/cn.js";
+import "react";
+import { FIFTY as x, TEN as I, NINETY as E, PERCENT_ONE_HUNDRED as S, SIX as T } from "../../constants/numbers.const.js";
+import { DIRECTION_HORIZONTAL as g } from "../../constants/generals.const.js";
+import { DEFAULT_DIRECTION as P } from "./ResizablePanel.const.js";
+import { getPaneStyle as b, getHandleStyle as D } from "./ResizablePanel.utils.js";
+import { useResizablePanel as _ } from "./useResizablePanel.js";
+const L = (c) => {
   const {
-    first: g,
-    second: N,
-    direction: o = A,
-    defaultSize: S = M,
-    minSize: s = O,
-    maxSize: l = U,
-    onResize: i,
-    className: _,
-    testId: P
-  } = z, [t, x] = C(S), c = H(null), b = w((e) => $(e, s, l), [s, l]), R = w(
-    (e) => {
-      var f;
-      e.preventDefault();
-      const r = e.target;
-      (f = r.setPointerCapture) == null || f.call(r, e.pointerId);
-      const m = (n) => {
-        if (!c.current) return;
-        const D = c.current.getBoundingClientRect(), L = B(D, o, n.clientX, n.clientY), u = b(L);
-        x(u), i == null || i(u);
-      }, h = () => {
-        var n;
-        (n = r.releasePointerCapture) == null || n.call(r, e.pointerId), window.removeEventListener(p, m), window.removeEventListener(v, h);
-      };
-      window.addEventListener(p, m), window.addEventListener(v, h);
-    },
-    [o, b, i]
-  ), a = o === "horizontal", T = a ? { width: `${t}%`, minWidth: 0 } : { height: `${t}%`, minHeight: 0 }, y = a ? { width: `${100 - t}%`, minWidth: 0 } : { height: `${100 - t}%`, minHeight: 0 };
-  return /* @__PURE__ */ k(
+    first: m,
+    second: f,
+    direction: l = P,
+    defaultSize: d = x,
+    minSize: o = I,
+    maxSize: s = E,
+    onResize: u,
+    className: N,
+    testId: h
+  } = c, { size: r, containerRef: y, onPointerDown: z } = _({
+    direction: l,
+    defaultSize: d,
+    minSize: o,
+    maxSize: s,
+    onResize: u
+  }), e = l === g, p = b(e, r), v = b(e, S - r), R = D(e, T);
+  let i = "bear-flex-col", t = "bear-h-1.5 bear-w-full bear-cursor-row-resize";
+  return e && (i = "bear-flex-row", t = "bear-w-1.5 bear-cursor-col-resize"), /* @__PURE__ */ w(
     "div",
     {
-      ref: c,
-      "data-testid": P,
-      className: I(
+      ref: y,
+      "data-testid": h,
+      className: n(
         "Bear-ResizablePanel bear-flex bear-w-full bear-h-full bear-overflow-hidden",
-        a ? "bear-flex-row" : "bear-flex-col",
-        _
+        i,
+        N
       ),
       children: [
-        /* @__PURE__ */ d("div", { className: "bear-overflow-auto bear-shrink-0", style: T, children: g }),
-        /* @__PURE__ */ d(
+        /* @__PURE__ */ a("div", { className: "bear-overflow-auto bear-shrink-0", style: p, children: m }),
+        /* @__PURE__ */ a(
           "div",
           {
             role: "separator",
-            "aria-valuenow": t,
-            "aria-valuemin": s,
-            "aria-valuemax": l,
+            "aria-valuenow": r,
+            "aria-valuemin": o,
+            "aria-valuemax": s,
             tabIndex: 0,
-            onPointerDown: R,
-            className: I(
-              "Bear-ResizablePanel__handle bear-shrink-0 bear-bg-gray-200 dark:bear-bg-gray-700 hover:bear-bg-primary-500/30 bear-transition-colors bear-cursor-col-resize",
-              a ? "bear-w-1.5" : "bear-h-1.5 bear-w-full bear-cursor-row-resize"
+            onPointerDown: z,
+            className: n(
+              "Bear-ResizablePanel__handle bear-shrink-0 bear-bg-gray-200 dark:bear-bg-gray-700 hover:bear-bg-primary-500/30 bear-transition-colors",
+              t
             ),
-            style: a ? { width: E } : { height: E }
+            style: R
           }
         ),
-        /* @__PURE__ */ d("div", { className: "bear-overflow-auto bear-shrink-0 bear-flex-1", style: y, children: N })
+        /* @__PURE__ */ a("div", { className: "bear-overflow-auto bear-shrink-0 bear-flex-1", style: v, children: f })
       ]
     }
   );
 };
 export {
-  X as ResizablePanel
+  L as ResizablePanel
 };

package/dist/components/ResizablePanel/ResizablePanel.utils.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("./ResizablePanel.const.cjs");function r(e,t,i,a){return t==="horizontal"?(i-e.left)/e.width*n.PERCENTAGE_SCALE:(a-e.top)/e.height*n.PERCENTAGE_SCALE}function o(e,t,i){return Math.min(i,Math.max(t,e))}exports.clampSize=o;exports.getResizePercentage=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../../constants/numbers.const.cjs"),i=require("../../constants/generals.const.cjs"),s=(e,t,n,g)=>t===i.DIRECTION_HORIZONTAL?(n-e.left)/e.width*r.PERCENT_ONE_HUNDRED:(g-e.top)/e.height*r.PERCENT_ONE_HUNDRED,o=(e,t)=>{const n=`${t}${i.PERCENT_UNIT}`;return e?{width:n,minWidth:r.ZERO}:{height:n,minHeight:r.ZERO}},E=(e,t)=>e?{width:t}:{height:t};exports.getHandleStyle=E;exports.getPaneStyle=o;exports.getResizePercentage=s;

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

@@ -1,10 +1,5 @@
+import { CSSProperties } from 'react';
 import { ResizablePanelProps } from './ResizablePanel.types';
-/**
- * Compute first pane size as a percentage (0–100) from pointer position and container rect.
- * Used for both horizontal and vertical layouts.
- */
-export declare function getResizePercentage(rect: DOMRect, direction: NonNullable<ResizablePanelProps['direction']>, clientX: number, clientY: number): number;
-/**
- * Clamp a value between min and max (inclusive).
- */
-export declare function clampSize(value: number, min: number, max: number): number;
+export declare const getResizePercentage: (rect: DOMRect, direction: NonNullable<ResizablePanelProps["direction"]>, clientX: number, clientY: number) => number;
+export declare const getPaneStyle: (isHorizontal: boolean, size: number) => CSSProperties;
+export declare const getHandleStyle: (isHorizontal: boolean, handleSize: number) => CSSProperties;

package/dist/components/ResizablePanel/ResizablePanel.utils.js

@@ -1,11 +1,11 @@
-import { PERCENTAGE_SCALE as n } from "./ResizablePanel.const.js";
-function a(t, e, i, o) {
-  return e === "horizontal" ? (i - t.left) / t.width * n : (o - t.top) / t.height * n;
-}
-function h(t, e, i) {
-  return Math.min(i, Math.max(e, t));
-}
+import { PERCENT_ONE_HUNDRED as n, ZERO as r } from "../../constants/numbers.const.js";
+import { DIRECTION_HORIZONTAL as o, PERCENT_UNIT as g } from "../../constants/generals.const.js";
+const R = (t, e, i, h) => e === o ? (i - t.left) / t.width * n : (h - t.top) / t.height * n, f = (t, e) => {
+  const i = `${e}${g}`;
+  return t ? { width: i, minWidth: r } : { height: i, minHeight: r };
+}, m = (t, e) => t ? { width: e } : { height: e };
 export {
-  h as clampSize,
-  a as getResizePercentage
+  m as getHandleStyle,
+  f as getPaneStyle,
+  R as getResizePercentage
 };

package/dist/components/ResizablePanel/useResizablePanel.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react");require("../../context/BearProvider.cjs");require("react/jsx-runtime");require("../../hooks/useBearComponent/useBearComponent.cjs");const r=require("../../constants/numbers.const.cjs"),S=require("../../hooks/usePointerDrag/usePointerDrag.cjs");require("../FormControl/FormControl.context.cjs");const R=require("../../utils/clamp.utils.cjs"),b=require("./ResizablePanel.utils.cjs"),m=u=>{const{direction:c,defaultSize:o=r.FIFTY,minSize:l=r.TEN,maxSize:a=r.NINETY,onResize:e}=u,[q,z]=s.useState(o),t=s.useRef(null),{onPointerDown:g}=S.usePointerDrag({onMove:n=>{if(!t.current)return;const P=t.current.getBoundingClientRect(),i=R.clamp(b.getResizePercentage(P,c,n.clientX,n.clientY),l,a);z(i),e==null||e(i)}});return{size:q,containerRef:t,onPointerDown:g}};exports.useResizablePanel=m;

package/dist/components/ResizablePanel/useResizablePanel.d.ts

@@ -0,0 +1,12 @@
+import { ResizablePanelProps } from './ResizablePanel.types';
+export declare const useResizablePanel: (options: {
+    direction: NonNullable<ResizablePanelProps["direction"]>;
+    defaultSize?: number;
+    minSize?: number;
+    maxSize?: number;
+    onResize?: (size: number) => void;
+}) => {
+    size: number;
+    containerRef: import('react').RefObject<HTMLDivElement>;
+    onPointerDown: (event: import('react').PointerEvent) => void;
+};

package/dist/components/ResizablePanel/useResizablePanel.js

@@ -0,0 +1,33 @@
+import { useState as l, useRef as z } from "react";
+import "../../context/BearProvider.js";
+import "react/jsx-runtime";
+import "../../hooks/useBearComponent/useBearComponent.js";
+import { FIFTY as S, NINETY as g, TEN as P } from "../../constants/numbers.const.js";
+import { usePointerDrag as R } from "../../hooks/usePointerDrag/usePointerDrag.js";
+import "../FormControl/FormControl.context.js";
+import { clamp as d } from "../../utils/clamp.utils.js";
+import { getResizePercentage as x } from "./ResizablePanel.utils.js";
+const B = (i) => {
+  const {
+    direction: n,
+    defaultSize: c = S,
+    minSize: m = P,
+    maxSize: s = g,
+    onResize: e
+  } = i, [p, u] = l(c), t = z(null), { onPointerDown: a } = R({
+    onMove: (o) => {
+      if (!t.current)
+        return;
+      const f = t.current.getBoundingClientRect(), r = d(
+        x(f, n, o.clientX, o.clientY),
+        m,
+        s
+      );
+      u(r), e == null || e(r);
+    }
+  });
+  return { size: p, containerRef: t, onPointerDown: a };
+};
+export {
+  B as useResizablePanel
+};

package/dist/components/ResizableTextarea/ResizableTextarea.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("react"),d=require("../../utils/cn.cjs"),j=require("./ResizableTextarea.const.cjs"),I=({label:f,helperText:v,error:u,minHeight:r=j.DEFAULT_MIN_HEIGHT,maxHeight:n=j.DEFAULT_MAX_HEIGHT,resizable:s=!0,showCharCount:y=!1,charCountMax:k,className:E,style:L,testId:N,...a})=>{const x=!!u,l=k??a.maxLength,p=typeof a.value=="string"?a.value.length:typeof a.defaultValue=="string"?a.defaultValue.length:0,z=l!=null&&p>l,B=i.useRef(null),[g,M]=i.useState(r),m=i.useRef(0),h=i.useRef(r),D=i.useCallback(t=>{var w,T;if(!s)return;t.preventDefault(),m.current=t.clientY,h.current=g,(T=(w=t.target).setPointerCapture)==null||T.call(w,t.pointerId);const R=b=>{const c=b.clientY-m.current;let o=h.current+c;r>0&&(o=Math.max(r,o)),n>0&&(o=Math.min(n,o)),M(o)},_=()=>{var b,c;(c=(b=t.target).releasePointerCapture)==null||c.call(b,t.pointerId),window.removeEventListener("pointermove",R),window.removeEventListener("pointerup",_)};window.addEventListener("pointermove",R),window.addEventListener("pointerup",_)},[s,g,r,n]);return e.jsxs("div",{className:d.cn("Bear-ResizableTextarea bear-flex bear-flex-col bear-gap-1.5",E),"data-testid":N,children:[f&&e.jsx("label",{className:"Bear-ResizableTextarea__label bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-gray-300",children:f}),e.jsxs("div",{className:"bear-relative",children:[e.jsx("textarea",{ref:B,"aria-invalid":x||void 0,className:d.cn("bear-w-full bear-rounded-lg bear-border","bear-bg-white dark:bear-bg-gray-900 bear-text-gray-900 dark:bear-text-gray-100","bear-p-3 bear-resize-none focus:bear-outline-none focus:bear-ring-2",x?"bear-border-red-500 focus:bear-ring-red-500":"bear-border-gray-300 dark:bear-border-gray-600 focus:bear-ring-primary-500/50"),style:{...L,minHeight:s?r:void 0,height:s?g:void 0,maxHeight:n>0?n:void 0},...a}),s&&e.jsx("div",{role:"separator",onPointerDown:D,className:"Bear-ResizableTextarea__handle bear-absolute bear-right-0 bear-bottom-0 bear-w-4 bear-h-4 bear-cursor-s-resize bear-opacity-50 hover:bear-opacity-100",style:{background:"linear-gradient(135deg, transparent 50%, currentColor 50%)"}})]}),e.jsxs("div",{className:"Bear-ResizableTextarea__footer bear-flex bear-items-center bear-justify-between bear-gap-2",children:[v||u?e.jsx("p",{className:d.cn("Bear-ResizableTextarea__helper bear-text-sm bear-flex-1",x?"bear-text-red-500":"bear-text-gray-500 dark:bear-text-gray-400"),children:u||v}):y?e.jsx("span",{}):null,y&&l!=null&&e.jsxs("span",{className:d.cn("Bear-ResizableTextarea__char-count bear-text-xs bear-tabular-nums bear-shrink-0",z?"bear-text-red-500":"bear-text-gray-400 dark:bear-text-gray-500"),children:[p,"/",l]})]})]})};exports.ResizableTextarea=I;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),x=require("react"),i=require("../../utils/cn.cjs"),H=require("../../utils/clamp.utils.cjs");require("../../context/BearProvider.cjs");require("../../hooks/useBearComponent/useBearComponent.cjs");const a=require("../../constants/numbers.const.cjs"),P=require("../../constants/generals.const.cjs"),D=require("../../hooks/usePointerDrag/usePointerDrag.cjs");require("../FormControl/FormControl.context.cjs");const I=require("../FormControl/FormControl.cjs"),R=require("../Typography/Typography.cjs"),g=require("./ResizableTextarea.utils.cjs"),k=f=>{const{label:_,helperText:d,error:c,minHeight:r=a.EIGHTY,maxHeight:t=a.FOUR_HUNDRED,resizable:n=P.BOOLEAN_TRUE,showCharCount:h=!1,charCountMax:q,className:v,testId:z,...l}=f,s=!!c,o=q??l.maxLength,p=g.getTextareaLength(l),N=o!=null&&p>o,b=x.useRef(null),[m,j]=x.useState(r),y=x.useRef(r),{onPointerDown:B}=D.usePointerDrag({enabled:n,onMove:(u,w)=>{const T=H.clamp(y.current+(u.clientY-w.clientY),r>a.ZERO?r:a.ZERO,t>a.ZERO?t:Number.POSITIVE_INFINITY);j(T),g.applyTextareaHeight(b.current,T,r,t,n)}});g.applyTextareaHeight(b.current,m,r,t,n);const E=u=>{y.current=m,B(u)},O=()=>d||c?e.jsx(R.Typography,{component:"p",variant:"body2",className:i.cn("Bear-ResizableTextarea__helper bear-flex-1",s?"bear-text-red-500":"bear-text-gray-500 dark:bear-text-gray-400"),children:c||d}):h?e.jsx("span",{}):null;return e.jsxs(I.FormControl,{label:_,helperText:void 0,error:s,className:i.cn("Bear-ResizableTextarea",v),testId:z,children:[e.jsxs("div",{className:"bear-relative",children:[e.jsx("textarea",{ref:b,"aria-invalid":s||void 0,className:i.cn("Bear-ResizableTextarea__field bear-w-full bear-rounded-lg bear-border","bear-bg-white dark:bear-bg-gray-900 bear-text-gray-900 dark:bear-text-gray-100","bear-p-3 bear-resize-none focus:bear-outline-none focus:bear-ring-2",s?"bear-border-red-500 focus:bear-ring-red-500":"bear-border-gray-300 dark:bear-border-gray-600 focus:bear-ring-primary-500/50"),...l}),n&&e.jsx("div",{role:"separator",onPointerDown:E,className:"Bear-ResizableTextarea__handle bear-absolute bear-right-0 bear-bottom-0 bear-w-4 bear-h-4 bear-cursor-s-resize bear-opacity-50 hover:bear-opacity-100 Bear-ResizableTextarea__handle--grip"})]}),e.jsxs("div",{className:"Bear-ResizableTextarea__footer bear-flex bear-items-center bear-justify-between bear-gap-2",children:[O(),h&&o!=null&&e.jsxs(R.Typography,{component:"span",variant:"caption",className:i.cn("Bear-ResizableTextarea__char-count bear-tabular-nums bear-shrink-0",N?"bear-text-red-500":"bear-text-gray-400 dark:bear-text-gray-500"),children:[p,"/",o]})]})]})};exports.ResizableTextarea=k;

package/dist/components/ResizableTextarea/ResizableTextarea.d.ts

@@ -1,3 +1,2 @@
-import { FC } from 'react';
 import { ResizableTextareaProps } from './ResizableTextarea.types';
-export declare const ResizableTextarea: FC<ResizableTextareaProps>;
+export declare const ResizableTextarea: (props: ResizableTextareaProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/ResizableTextarea/ResizableTextarea.js

@@ -1,96 +1,111 @@
-import { jsxs as d, jsx as s } from "react/jsx-runtime";
-import { useRef as m, useState as j, useCallback as A } from "react";
-import { cn as c } from "../../utils/cn.js";
-import { DEFAULT_MIN_HEIGHT as U, DEFAULT_MAX_HEIGHT as Y } from "./ResizableTextarea.const.js";
-const O = ({
-  label: p,
-  helperText: x,
-  error: u,
-  minHeight: e = U,
-  maxHeight: t = Y,
-  resizable: n = !0,
-  showCharCount: v = !1,
-  charCountMax: L,
-  className: N,
-  style: R,
-  testId: B,
-  ...r
-}) => {
-  const f = !!u, i = L ?? r.maxLength, y = typeof r.value == "string" ? r.value.length : typeof r.defaultValue == "string" ? r.defaultValue.length : 0, M = i != null && y > i, z = m(null), [g, D] = j(e), h = m(0), _ = m(e), I = A((a) => {
-    var k, E;
-    if (!n) return;
-    a.preventDefault(), h.current = a.clientY, _.current = g, (E = (k = a.target).setPointerCapture) == null || E.call(k, a.pointerId);
-    const w = (l) => {
-      const b = l.clientY - h.current;
-      let o = _.current + b;
-      e > 0 && (o = Math.max(e, o)), t > 0 && (o = Math.min(t, o)), D(o);
-    }, T = () => {
-      var l, b;
-      (b = (l = a.target).releasePointerCapture) == null || b.call(l, a.pointerId), window.removeEventListener("pointermove", w), window.removeEventListener("pointerup", T);
-    };
-    window.addEventListener("pointermove", w), window.addEventListener("pointerup", T);
-  }, [n, g, e, t]);
-  return /* @__PURE__ */ d("div", { className: c("Bear-ResizableTextarea bear-flex bear-flex-col bear-gap-1.5", N), "data-testid": B, children: [
-    p && /* @__PURE__ */ s("label", { className: "Bear-ResizableTextarea__label bear-text-sm bear-font-medium bear-text-gray-700 dark:bear-text-gray-300", children: p }),
-    /* @__PURE__ */ d("div", { className: "bear-relative", children: [
-      /* @__PURE__ */ s(
-        "textarea",
-        {
-          ref: z,
-          "aria-invalid": f || void 0,
-          className: c(
-            "bear-w-full bear-rounded-lg bear-border",
-            "bear-bg-white dark:bear-bg-gray-900 bear-text-gray-900 dark:bear-text-gray-100",
-            "bear-p-3 bear-resize-none focus:bear-outline-none focus:bear-ring-2",
-            f ? "bear-border-red-500 focus:bear-ring-red-500" : "bear-border-gray-300 dark:bear-border-gray-600 focus:bear-ring-primary-500/50"
-          ),
-          style: {
-            ...R,
-            minHeight: n ? e : void 0,
-            height: n ? g : void 0,
-            maxHeight: t > 0 ? t : void 0
-          },
-          ...r
-        }
+import { jsxs as n, jsx as i } from "react/jsx-runtime";
+import { useRef as y, useState as O } from "react";
+import { cn as s } from "../../utils/cn.js";
+import { clamp as P } from "../../utils/clamp.utils.js";
+import "../../context/BearProvider.js";
+import "../../hooks/useBearComponent/useBearComponent.js";
+import { EIGHTY as L, FOUR_HUNDRED as C, ZERO as p } from "../../constants/numbers.const.js";
+import { BOOLEAN_TRUE as F } from "../../constants/generals.const.js";
+import { usePointerDrag as M } from "../../hooks/usePointerDrag/usePointerDrag.js";
+import "../FormControl/FormControl.context.js";
+import { FormControl as Y } from "../FormControl/FormControl.js";
+import { Typography as T } from "../Typography/Typography.js";
+import { getTextareaLength as j, applyTextareaHeight as R } from "./ResizableTextarea.utils.js";
+const ee = (_) => {
+  const {
+    label: N,
+    helperText: d,
+    error: b,
+    minHeight: e = L,
+    maxHeight: r = C,
+    resizable: a = F,
+    showCharCount: x = !1,
+    charCountMax: v,
+    className: z,
+    testId: B,
+    ...l
+  } = _, t = !!b, o = v ?? l.maxLength, h = j(l), w = o != null && h > o, c = y(null), [u, E] = O(e), g = y(e), { onPointerDown: H } = M({
+    enabled: a,
+    onMove: (m, D) => {
+      const f = P(
+        g.current + (m.clientY - D.clientY),
+        e > p ? e : p,
+        r > p ? r : Number.POSITIVE_INFINITY
+      );
+      E(f), R(c.current, f, e, r, a);
+    }
+  });
+  R(c.current, u, e, r, a);
+  const I = (m) => {
+    g.current = u, H(m);
+  }, k = () => d || b ? /* @__PURE__ */ i(
+    T,
+    {
+      component: "p",
+      variant: "body2",
+      className: s(
+        "Bear-ResizableTextarea__helper bear-flex-1",
+        t ? "bear-text-red-500" : "bear-text-gray-500 dark:bear-text-gray-400"
       ),
-      n && /* @__PURE__ */ s(
-        "div",
-        {
-          role: "separator",
-          onPointerDown: I,
-          className: "Bear-ResizableTextarea__handle bear-absolute bear-right-0 bear-bottom-0 bear-w-4 bear-h-4 bear-cursor-s-resize bear-opacity-50 hover:bear-opacity-100",
-          style: { background: "linear-gradient(135deg, transparent 50%, currentColor 50%)" }
-        }
-      )
-    ] }),
-    /* @__PURE__ */ d("div", { className: "Bear-ResizableTextarea__footer bear-flex bear-items-center bear-justify-between bear-gap-2", children: [
-      x || u ? /* @__PURE__ */ s(
-        "p",
-        {
-          className: c(
-            "Bear-ResizableTextarea__helper bear-text-sm bear-flex-1",
-            f ? "bear-text-red-500" : "bear-text-gray-500 dark:bear-text-gray-400"
-          ),
-          children: u || x
-        }
-      ) : v ? /* @__PURE__ */ s("span", {}) : null,
-      v && i != null && /* @__PURE__ */ d(
-        "span",
-        {
-          className: c(
-            "Bear-ResizableTextarea__char-count bear-text-xs bear-tabular-nums bear-shrink-0",
-            M ? "bear-text-red-500" : "bear-text-gray-400 dark:bear-text-gray-500"
+      children: b || d
+    }
+  ) : x ? /* @__PURE__ */ i("span", {}) : null;
+  return /* @__PURE__ */ n(
+    Y,
+    {
+      label: N,
+      helperText: void 0,
+      error: t,
+      className: s("Bear-ResizableTextarea", z),
+      testId: B,
+      children: [
+        /* @__PURE__ */ n("div", { className: "bear-relative", children: [
+          /* @__PURE__ */ i(
+            "textarea",
+            {
+              ref: c,
+              "aria-invalid": t || void 0,
+              className: s(
+                "Bear-ResizableTextarea__field bear-w-full bear-rounded-lg bear-border",
+                "bear-bg-white dark:bear-bg-gray-900 bear-text-gray-900 dark:bear-text-gray-100",
+                "bear-p-3 bear-resize-none focus:bear-outline-none focus:bear-ring-2",
+                t ? "bear-border-red-500 focus:bear-ring-red-500" : "bear-border-gray-300 dark:bear-border-gray-600 focus:bear-ring-primary-500/50"
+              ),
+              ...l
+            }
           ),
-          children: [
-            y,
-            "/",
-            i
-          ]
-        }
-      )
-    ] })
-  ] });
+          a && /* @__PURE__ */ i(
+            "div",
+            {
+              role: "separator",
+              onPointerDown: I,
+              className: "Bear-ResizableTextarea__handle bear-absolute bear-right-0 bear-bottom-0 bear-w-4 bear-h-4 bear-cursor-s-resize bear-opacity-50 hover:bear-opacity-100 Bear-ResizableTextarea__handle--grip"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ n("div", { className: "Bear-ResizableTextarea__footer bear-flex bear-items-center bear-justify-between bear-gap-2", children: [
+          k(),
+          x && o != null && /* @__PURE__ */ n(
+            T,
+            {
+              component: "span",
+              variant: "caption",
+              className: s(
+                "Bear-ResizableTextarea__char-count bear-tabular-nums bear-shrink-0",
+                w ? "bear-text-red-500" : "bear-text-gray-400 dark:bear-text-gray-500"
+              ),
+              children: [
+                h,
+                "/",
+                o
+              ]
+            }
+          )
+        ] })
+      ]
+    }
+  );
 };
 export {
-  O as ResizableTextarea
+  ee as ResizableTextarea
 };

package/dist/components/ResizableTextarea/ResizableTextarea.utils.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../../constants/numbers.const.cjs"),n=require("../../constants/generals.const.cjs"),i=e=>typeof e===n.TYPE_STRING,g=e=>{const{value:t,defaultValue:r}=e;return i(t)?t.length:i(r)?r.length:s.ZERO},o=(e,t,r,a,u)=>{e&&(u&&(e.style.minHeight=`${r}${n.UNIT_PX}`,e.style.height=`${t}${n.UNIT_PX}`),a>s.ZERO&&(e.style.maxHeight=`${a}${n.UNIT_PX}`))};exports.applyTextareaHeight=o;exports.getTextareaLength=g;

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

@@ -0,0 +1,3 @@
+import { ResizableTextareaProps } from './ResizableTextarea.types';
+export declare const getTextareaLength: (props: ResizableTextareaProps) => number;
+export declare const applyTextareaHeight: (element: HTMLTextAreaElement | null, height: number, minHeight: number, maxHeight: number, resizable: boolean) => void;

package/dist/components/ResizableTextarea/ResizableTextarea.utils.js

@@ -0,0 +1,12 @@
+import { ZERO as a } from "../../constants/numbers.const.js";
+import { UNIT_PX as i, TYPE_STRING as u } from "../../constants/generals.const.js";
+const o = (t) => typeof t === u, h = (t) => {
+  const { value: e, defaultValue: r } = t;
+  return o(e) ? e.length : o(r) ? r.length : a;
+}, l = (t, e, r, n, f) => {
+  t && (f && (t.style.minHeight = `${r}${i}`, t.style.height = `${e}${i}`), n > a && (t.style.maxHeight = `${n}${i}`));
+};
+export {
+  l as applyTextareaHeight,
+  h as getTextareaLength
+};

package/dist/components/Result/Result.cjs

@@ -1 +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;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../../utils/cn.cjs");require("react");const c=require("../Typography/Typography.cjs"),y=require("./Result.const.cjs"),n=require("./Result.utils.cjs"),p=i=>{const{status:r,title:l,subtitle:t,icon:b,extra:s,className:o,testId:u,...d}=i,x=b??n.getStatusIcon(r),m=y.STATUS_ICON_COLORS[r];return e.jsxs("div",{className:a.cn("Bear-Result bear-flex bear-flex-col bear-items-center bear-justify-center bear-text-center bear-py-16 bear-px-6",o),"data-testid":u,...d,children:[e.jsx("div",{className:a.cn("bear-mb-4 bear-flex bear-items-center bear-justify-center",!n.isTextStatus(r)&&"bear-w-16 bear-h-16",m),children:x}),e.jsx(c.Typography,{variant:"h4",className:"bear-mb-2",children:l}),t&&e.jsx(c.Typography,{variant:"body1",color:"secondary",className:"bear-mb-6 bear-max-w-md",children:t}),s&&e.jsx("div",{className:"bear-flex bear-flex-wrap bear-gap-2 bear-justify-center",children:s})]})};exports.Result=p;

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

@@ -1 +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;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../constants/generals.const.cjs"),r={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",[e.STATUS_NOT_FOUND]:"bear-text-gray-500 dark:bear-text-zinc-400",[e.STATUS_FORBIDDEN]:"bear-text-orange-500 dark:bear-text-orange-400",[e.STATUS_SERVER_ERROR]:"bear-text-red-600 dark:bear-text-red-500"};exports.STATUS_ICON_COLORS=r;

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

@@ -1,10 +1,2 @@
 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

@@ -1,20 +1,13 @@
-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 = {
+import { STATUS_SERVER_ERROR as e, STATUS_FORBIDDEN as r, STATUS_NOT_FOUND as t } from "../../constants/generals.const.js";
+const 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";
+  [t]: "bear-text-gray-500 dark:bear-text-zinc-400",
+  [r]: "bear-text-orange-500 dark:bear-text-orange-400",
+  [e]: "bear-text-red-600 dark:bear-text-red-500"
+};
 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
+  b as STATUS_ICON_COLORS
 };

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

@@ -1,4 +1,2 @@
-import { FC } from 'react';
 import { ResultProps } from './Result.types';
-export declare const Result: FC<ResultProps>;
-export default Result;
+export declare const Result: (props: ResultProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Result/Result.js

@@ -1,35 +1,48 @@
-import { jsxs as E, jsx as s } from "react/jsx-runtime";
-import { cn as S } from "../../utils/cn.js";
+import { jsxs as p, jsx as e } 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) => {
+import { Typography as c } from "../Typography/Typography.js";
+import { STATUS_ICON_COLORS as x } from "./Result.const.js";
+import { isTextStatus as u, getStatusIcon as h } from "./Result.utils.js";
+const T = (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(
+    status: r,
+    title: i,
+    subtitle: a,
+    icon: b,
+    extra: t,
+    className: l,
+    testId: m,
+    ...n
+  } = o, d = b ?? h(r), f = x[r];
+  return /* @__PURE__ */ p(
     "div",
     {
-      className: S(h, O, n),
-      "data-testid": l,
-      ...m,
+      className: s(
+        "Bear-Result bear-flex bear-flex-col bear-items-center bear-justify-center bear-text-center bear-py-16 bear-px-6",
+        l
+      ),
+      "data-testid": m,
+      ...n,
       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 })
+        /* @__PURE__ */ e(
+          "div",
+          {
+            className: s(
+              "bear-mb-4 bear-flex bear-items-center bear-justify-center",
+              !u(r) && "bear-w-16 bear-h-16",
+              f
+            ),
+            children: d
+          }
+        ),
+        /* @__PURE__ */ e(c, { variant: "h4", className: "bear-mb-2", children: i }),
+        a && /* @__PURE__ */ e(c, { variant: "body1", color: "secondary", className: "bear-mb-6 bear-max-w-md", children: a }),
+        t && /* @__PURE__ */ e("div", { className: "bear-flex bear-flex-wrap bear-gap-2 bear-justify-center", children: t })
       ]
     }
   );
 };
 export {
-  U as Result
+  T as Result
 };

package/dist/components/Result/Result.utils.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),s=require("../../constants/numbers.const.cjs"),r=require("../../constants/generals.const.cjs"),e=require("@forgedevstack/bear-icons"),c=require("../Typography/Typography.cjs"),i={success:e.CheckCircleIcon,error:e.ErrorIcon,info:e.InfoIcon,warning:e.WarningIcon},S=[r.STATUS_NOT_FOUND,r.STATUS_FORBIDDEN,r.STATUS_SERVER_ERROR],T=n=>S.includes(n),a=n=>{const o=i[n];return o?t.jsx(o,{size:s.SIXTY_FOUR}):t.jsx(c.Typography,{variant:"h2",className:"bear-font-bold bear-leading-none",children:n})};exports.getStatusIcon=a;exports.isTextStatus=T;