@forgedevstack/bear 1.3.2 → 1.3.4

package/dist/components/Drawer/Drawer.js

@@ -1,91 +1,107 @@
-import { jsxs as _, jsx as t } from "react/jsx-runtime";
-import { createPortal as T } from "react-dom";
-import { useBearDirectionOptional as M } from "../../context/BearProvider.js";
-import { cn as F } from "../../utils/cn.js";
-import "react";
-import { resolveBearId as L } from "../../utils/generateBearId.utils.js";
-import { useBearId as x } from "../../utils/useBearId.js";
-import { BOOLEAN_TRUE as e, COMPONENT_NAME_DRAWER as P } from "../../constants/generals.const.js";
-import { OVERLAY_OPEN_EFFECT_DEFAULT as S } from "../../hooks/useFixedAnchorPosition/useFixedAnchorPosition.const.js";
-import { resolveOverlayEffects as U } from "../../hooks/useFixedAnchorPosition/useFixedAnchorPosition.utils.js";
-import { Backdrop as W } from "../Backdrop/Backdrop.js";
-import { Box as n } from "../Box/Box.js";
-import { DRAWER_DEFAULT_SIDE as $, DRAWER_DEFAULT_SIZE as g, DRAWER_ANIMATION_MS as j } from "./Drawer.const.js";
-import { DrawerOptionalHeader as H } from "./helpers/DrawerOptionalHeader.js";
-import { useDrawer as z } from "./hooks/useDrawer.js";
-const ce = (i) => {
+import { jsxs as B, jsx as l } from "react/jsx-runtime";
+import { useRef as $ } from "react";
+import { createPortal as V } from "react-dom";
+import { useBearDirectionOptional as g } from "../../context/BearProvider.js";
+import { cn as O } from "../../utils/cn.js";
+import { resolveBearId as j } from "../../utils/generateBearId.utils.js";
+import { useBearId as H } from "../../utils/useBearId.js";
+import { useFocusTrap as Y } from "../../hooks/useFocusTrap/useFocusTrap.js";
+import { BOOLEAN_TRUE as o, COMPONENT_NAME_DRAWER as z, BOOLEAN_FALSE as i, DRAWER_VARIANT_TEMPORARY as Z, DRAWER_VARIANT_PERMANENT as q } from "../../constants/generals.const.js";
+import { OVERLAY_OPEN_EFFECT_DEFAULT as G } from "../../hooks/useFixedAnchorPosition/useFixedAnchorPosition.const.js";
+import { resolveOverlayEffects as J } from "../../hooks/useFixedAnchorPosition/useFixedAnchorPosition.utils.js";
+import { Backdrop as K } from "../Backdrop/Backdrop.js";
+import { Box as c } from "../Box/Box.js";
+import { DRAWER_DEFAULT_SIDE as Q, DRAWER_DEFAULT_VARIANT as X, DRAWER_DEFAULT_SIZE as ee, DRAWER_ANIMATION_MS as re } from "./Drawer.const.js";
+import { DrawerOptionalHeader as oe } from "./helpers/DrawerOptionalHeader.js";
+import { useDrawer as ae } from "./hooks/useDrawer.js";
+const Be = (d) => {
   const {
-    isOpen: f,
-    onClose: r,
-    title: o,
-    children: E,
-    side: B = $,
-    anchor: D,
-    variant: V = "temporary",
-    size: u = g,
-    showCloseButton: l = e,
-    closeOnBackdrop: w = e,
-    closeOnEscape: O = e,
-    className: A,
-    container: N,
-    id: I,
-    testId: R
-  } = i, { openEffect: s, closeEffect: c } = U(i, S), k = x(P), d = L(I, k), { direction: v } = M(), m = D ?? B, { isMounted: b, isPanelOpen: a } = z({
-    isOpen: f,
-    onClose: r,
-    closeOnEscape: O,
-    openEffect: s,
-    closeEffect: c
-  }), h = a ? s : c;
-  if (!b)
+    isOpen: N,
+    onClose: a,
+    title: n,
+    children: w,
+    side: T = Q,
+    anchor: I,
+    variant: s = X,
+    size: b = ee,
+    showCloseButton: m = o,
+    closeOnBackdrop: v = o,
+    closeOnEscape: p = o,
+    className: M,
+    container: h,
+    id: k,
+    testId: y
+  } = d, e = s === q, r = s === Z, { openEffect: E, closeEffect: _ } = J(d, G), C = H(z), f = j(k, C), { direction: F } = g(), A = I ?? T, { isMounted: L, isPanelOpen: t } = ae({
+    isOpen: e ? o : N,
+    onClose: a,
+    closeOnEscape: e ? i : p,
+    openEffect: E,
+    closeEffect: _,
+    lockScroll: r,
+    alwaysMounted: e
+  }), P = t ? E : _, D = $(null);
+  if (Y(D, {
+    enabled: r && t,
+    onEscape: p ? a : void 0
+  }), !L)
     return null;
-  const C = !!o || l, p = `${d}-title`, y = /* @__PURE__ */ _(n, { id: d, testId: R, className: "Bear-Drawer", children: [
-    /* @__PURE__ */ t(
-      W,
-      {
-        open: a,
-        keepMounted: !0,
-        blur: !0,
-        nested: !0,
-        transitionDuration: j,
-        className: "Bear-Drawer__backdrop",
-        onClick: w ? () => r() : void 0
-      }
-    ),
-    /* @__PURE__ */ _(
-      n,
-      {
-        role: "dialog",
-        "aria-modal": e,
-        "aria-labelledby": o ? p : void 0,
-        className: F(
-          "Bear-Drawer__panel",
-          `Bear-Drawer__panel--${m}`,
-          `Bear-Drawer__panel--${u}`,
-          `Bear-Drawer__panel--effect-${h}`,
-          a && "Bear-Drawer__panel--open",
-          A
+  const W = !!n || m, R = `${f}-title`, S = v && r ? () => a() : void 0, x = n ? R : void 0, U = e ? "complementary" : "dialog", u = /* @__PURE__ */ B(
+    c,
+    {
+      id: f,
+      "data-testid": y,
+      className: O("Bear-Drawer", `Bear-Drawer--${s}`),
+      children: [
+        r && /* @__PURE__ */ l(
+          K,
+          {
+            open: t,
+            keepMounted: !0,
+            blur: !0,
+            nested: !0,
+            transitionDuration: re,
+            className: "Bear-Drawer__backdrop",
+            onClick: S
+          }
         ),
-        children: [
-          /* @__PURE__ */ t(
-            H,
-            {
-              showHeader: C,
-              side: m,
-              title: o,
-              titleId: p,
-              showCloseButton: l,
-              onClose: r,
-              direction: v
-            }
-          ),
-          /* @__PURE__ */ t(n, { className: "Bear-Drawer__body", children: E })
-        ]
-      }
-    )
-  ] });
-  return T(y, N ?? document.body);
+        /* @__PURE__ */ B(
+          c,
+          {
+            ref: D,
+            role: U,
+            tabIndex: -1,
+            "aria-modal": r ? o : i,
+            "aria-labelledby": x,
+            className: O(
+              "Bear-Drawer__panel",
+              `Bear-Drawer__panel--${A}`,
+              `Bear-Drawer__panel--${b}`,
+              `Bear-Drawer__panel--effect-${P}`,
+              t && "Bear-Drawer__panel--open",
+              M
+            ),
+            children: [
+              /* @__PURE__ */ l(
+                oe,
+                {
+                  showHeader: W,
+                  side: A,
+                  title: n,
+                  titleId: R,
+                  showCloseButton: e ? i : m,
+                  onClose: a,
+                  direction: F
+                }
+              ),
+              /* @__PURE__ */ l(c, { className: "Bear-Drawer__body", children: w })
+            ]
+          }
+        )
+      ]
+    }
+  );
+  return e ? u : V(u, h ?? document.body);
 };
 export {
-  ce as Drawer
+  Be as Drawer
 };

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

@@ -1,12 +1,15 @@
 import { ReactNode } from 'react';
 import { OverlayEffectProps, OverlayMotionEffect } from '../../hooks/useFixedAnchorPosition';
 export type DrawerSide = 'left' | 'right' | 'top' | 'bottom';
+export type DrawerVariant = 'temporary' | 'persistent' | 'permanent';
 export interface UseDrawerParams {
     isOpen: boolean;
     onClose: () => void;
     closeOnEscape: boolean;
     openEffect: OverlayMotionEffect;
     closeEffect: OverlayMotionEffect;
+    lockScroll: boolean;
+    alwaysMounted: boolean;
 }
 export interface UseDrawerResult {
     isMounted: boolean;
@@ -19,7 +22,7 @@ export interface DrawerProps extends OverlayEffectProps {
     children: ReactNode;
     side?: DrawerSide;
     anchor?: DrawerSide;
-    variant?: 'temporary' | 'persistent' | 'permanent';
+    variant?: DrawerVariant;
     size?: 'sm' | 'md' | 'lg' | 'xl';
     showCloseButton?: boolean;
     closeOnBackdrop?: boolean;

package/dist/components/Drawer/hooks/useDrawer.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),f=require("../../../constants/numbers.const.cjs"),e=require("../../../constants/generals.const.cjs"),m=require("../../../constants/keys.const.cjs"),_=require("../../../hooks/useFixedAnchorPosition/useFixedAnchorPosition.const.cjs"),S=require("../Drawer.const.cjs"),F=require("../Drawer.utils.cjs"),B=l=>{const{isOpen:r,onClose:u,closeOnEscape:i,openEffect:O,closeEffect:a}=l,[s,A]=n.useState(r),[L,c]=n.useState(e.BOOLEAN_FALSE),[N,E]=n.useState(e.BOOLEAN_FALSE);n.useEffect(()=>{if(r){if(A(e.BOOLEAN_TRUE),c(e.BOOLEAN_FALSE),O===_.OVERLAY_OPEN_EFFECT_NONE){E(e.BOOLEAN_TRUE);return}const t=requestAnimationFrame(()=>E(e.BOOLEAN_TRUE));return()=>cancelAnimationFrame(t)}if(s){E(e.BOOLEAN_FALSE),c(e.BOOLEAN_TRUE);const t=a===_.OVERLAY_OPEN_EFFECT_NONE?f.ZERO:S.DRAWER_ANIMATION_MS,d=setTimeout(()=>{A(e.BOOLEAN_FALSE),c(e.BOOLEAN_FALSE)},t);return()=>clearTimeout(d)}},[r,s,O,a]);const o=n.useCallback(t=>{i&&t.key===m.KEY_ESCAPE&&u()},[i,u]);return n.useEffect(()=>{if(s){document.addEventListener("keydown",o);const t=F.lockBodyScroll();return()=>{document.removeEventListener("keydown",o),t()}}return()=>{document.removeEventListener("keydown",o)}},[s,o]),{isMounted:s,isPanelOpen:N&&!L}};exports.useDrawer=B;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),B=require("../../../constants/numbers.const.cjs"),e=require("../../../constants/generals.const.cjs"),F=require("../../../constants/keys.const.cjs"),l=require("../../../hooks/useFixedAnchorPosition/useFixedAnchorPosition.const.cjs"),m=require("../Drawer.const.cjs"),R=require("../Drawer.utils.cjs"),T=N=>{const{isOpen:o,onClose:a,closeOnEscape:E,openEffect:A,closeEffect:_,lockScroll:L,alwaysMounted:r}=N,[s,i]=n.useState(o||r),[d,c]=n.useState(e.BOOLEAN_FALSE),[f,O]=n.useState(r?e.BOOLEAN_TRUE:e.BOOLEAN_FALSE);n.useEffect(()=>{if(r){i(e.BOOLEAN_TRUE),O(o),c(e.BOOLEAN_FALSE);return}if(o){if(i(e.BOOLEAN_TRUE),c(e.BOOLEAN_FALSE),A===l.OVERLAY_OPEN_EFFECT_NONE){O(e.BOOLEAN_TRUE);return}const t=requestAnimationFrame(()=>O(e.BOOLEAN_TRUE));return()=>cancelAnimationFrame(t)}if(s){O(e.BOOLEAN_FALSE),c(e.BOOLEAN_TRUE);const t=_===l.OVERLAY_OPEN_EFFECT_NONE?B.ZERO:m.DRAWER_ANIMATION_MS,S=setTimeout(()=>{i(e.BOOLEAN_FALSE),c(e.BOOLEAN_FALSE)},t);return()=>clearTimeout(S)}},[r,o,s,A,_]);const u=n.useCallback(t=>{E&&t.key===F.KEY_ESCAPE&&a()},[E,a]);return n.useEffect(()=>{s&&E&&document.addEventListener("keydown",u);const t=L&&s?R.lockBodyScroll():void 0;return()=>{document.removeEventListener("keydown",u),t==null||t()}},[s,u,E,L]),{isMounted:s,isPanelOpen:r?o:f&&!d}};exports.useDrawer=T;

package/dist/components/Drawer/hooks/useDrawer.js

@@ -1,51 +1,50 @@
-import { useState as m, useEffect as p, useCallback as L } from "react";
-import { ZERO as N } from "../../../constants/numbers.const.js";
-import { BOOLEAN_FALSE as o, BOOLEAN_TRUE as r } from "../../../constants/generals.const.js";
-import { KEY_ESCAPE as C } from "../../../constants/keys.const.js";
-import { OVERLAY_OPEN_EFFECT_NONE as d } from "../../../hooks/useFixedAnchorPosition/useFixedAnchorPosition.const.js";
-import { DRAWER_ANIMATION_MS as M } from "../Drawer.const.js";
-import { lockBodyScroll as v } from "../Drawer.utils.js";
-const B = (O) => {
-  const { isOpen: s, onClose: E, closeOnEscape: f, openEffect: u, closeEffect: a } = O, [t, l] = m(s), [A, c] = m(o), [_, i] = m(o);
-  p(() => {
+import { useState as f, useEffect as O, useCallback as L } from "react";
+import { ZERO as S } from "../../../constants/numbers.const.js";
+import { BOOLEAN_FALSE as o, BOOLEAN_TRUE as n } from "../../../constants/generals.const.js";
+import { KEY_ESCAPE as k } from "../../../constants/keys.const.js";
+import { OVERLAY_OPEN_EFFECT_NONE as A } from "../../../hooks/useFixedAnchorPosition/useFixedAnchorPosition.const.js";
+import { DRAWER_ANIMATION_MS as y } from "../Drawer.const.js";
+import { lockBodyScroll as F } from "../Drawer.utils.js";
+const g = (_) => {
+  const { isOpen: s, onClose: l, closeOnEscape: i, openEffect: u, closeEffect: p, lockScroll: d, alwaysMounted: r } = _, [t, E] = f(s || r), [M, c] = f(o), [N, m] = f(r ? n : o);
+  O(() => {
+    if (r) {
+      E(n), m(s), c(o);
+      return;
+    }
     if (s) {
-      if (l(r), c(o), u === d) {
-        i(r);
+      if (E(n), c(o), u === A) {
+        m(n);
         return;
       }
-      const e = requestAnimationFrame(() => i(r));
+      const e = requestAnimationFrame(() => m(n));
       return () => cancelAnimationFrame(e);
     }
     if (t) {
-      i(o), c(r);
-      const k = setTimeout(() => {
-        l(o), c(o);
-      }, a === d ? N : M);
-      return () => clearTimeout(k);
+      m(o), c(n);
+      const C = setTimeout(() => {
+        E(o), c(o);
+      }, p === A ? S : y);
+      return () => clearTimeout(C);
     }
-  }, [s, t, u, a]);
-  const n = L(
+  }, [r, s, t, u, p]);
+  const a = L(
     (e) => {
-      f && e.key === C && E();
+      i && e.key === k && l();
     },
-    [f, E]
+    [i, l]
   );
-  return p(() => {
-    if (t) {
-      document.addEventListener("keydown", n);
-      const e = v();
-      return () => {
-        document.removeEventListener("keydown", n), e();
-      };
-    }
+  return O(() => {
+    t && i && document.addEventListener("keydown", a);
+    const e = d && t ? F() : void 0;
     return () => {
-      document.removeEventListener("keydown", n);
+      document.removeEventListener("keydown", a), e == null || e();
     };
-  }, [t, n]), {
+  }, [t, a, i, d]), {
     isMounted: t,
-    isPanelOpen: _ && !A
+    isPanelOpen: r ? s : N && !M
   };
 };
 export {
-  B as useDrawer
+  g as useDrawer
 };

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

@@ -1,2 +1,2 @@
 export { Drawer } from './Drawer';
-export type { DrawerProps } from './Drawer.types';
+export type { DrawerProps, DrawerVariant } from './Drawer.types';

package/dist/components/EmptyState/EmptyState.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),e=require("./EmptyState.const.cjs"),a=require("../../utils/cn.cjs");require("react");const A=require("../../utils/generateBearId.utils.cjs"),m=require("../../utils/useBearId.cjs"),C=({className:r})=>s.jsx("svg",{className:r,fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:s.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5,d:"M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2-2v-5m16 0h-2.586a1 1 0 00-.707.293l-2.414 2.414a1 1 0 01-.707.293h-3.172a1 1 0 01-.707-.293l-2.414-2.414A1 1 0 006.586 13H4"})}),h=({icon:r,title:l,description:S,action:n,secondaryAction:c,className:d,size:i="md",variant:E="default",id:T,testId:_})=>{const o=m.useBearId("EmptyState"),u=A.resolveBearId(T,o),t=e.EMPTY_STATE_SIZE_CLASSES[i];return s.jsxs("div",{id:u,"data-testid":_,className:a.cn(e.EMPTY_STATE_ROOT_CLASS,e.EMPTY_STATE_BASE_CLASSES,t.padding,E==="card"&&e.EMPTY_STATE_CARD_CLASSES,d),children:[s.jsx("div",{className:a.cn(e.EMPTY_STATE_ICON_CLASSES,t.icon),children:r||s.jsx(C,{className:"bear-w-full bear-h-full"})}),s.jsx("h3",{className:a.cn(e.EMPTY_STATE_TITLE_CLASSES,t.title),children:l}),S&&s.jsx("p",{className:a.cn(e.EMPTY_STATE_DESCRIPTION_CLASSES,t.desc),children:S}),(n||c)&&s.jsxs("div",{className:`${e.EMPTY_STATE_ROOT_CLASS}__actions bear-flex bear-items-center bear-gap-3`,children:[n,c]})]})};exports.EmptyState=h;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),T=require("../Box/Box.cjs"),I=require("../Flex/Flex.cjs"),_=require("../Typography/Typography.cjs"),r=require("../../utils/cn.cjs");require("react");const M=require("../../utils/generateBearId.utils.cjs"),g=require("../../utils/useBearId.cjs"),e=require("./EmptyState.const.cjs"),h=d=>{const{icon:l,title:S,description:c,action:n,secondaryAction:i,className:p,size:m=e.EMPTY_STATE_DEFAULT_SIZE,variant:u=e.EMPTY_STATE_DEFAULT_VARIANT,preset:a=e.EMPTY_STATE_DEFAULT_PRESET,id:y,testId:A}=d,P=g.useBearId(e.COMPONENT_NAME_EMPTY_STATE),B=M.resolveBearId(y,P),s=e.EMPTY_STATE_SIZE_CLASSES[m],N=e.EMPTY_STATE_PRESET_ICON[a],x=l??t.jsx(N,{className:"bear-w-full bear-h-full"}),o=e.EMPTY_STATE_PRESET_DEFAULTS[a]??e.EMPTY_STATE_PRESET_DEFAULTS.empty,E=c!==void 0?c:o.description;return t.jsxs(T.Box,{id:B,"data-testid":A,className:r.cn("Bear-EmptyState",u==="card"&&"Bear-EmptyState--card",`Bear-EmptyState--${a}`,s.padding,p),children:[t.jsx(T.Box,{className:r.cn("Bear-EmptyState__icon",s.icon),children:x}),t.jsx(_.Typography,{className:r.cn("Bear-EmptyState__title",s.title),children:S??o.title}),E&&t.jsx(_.Typography,{className:r.cn("Bear-EmptyState__description",s.desc),children:E}),(n||i)&&t.jsxs(I.Flex,{className:"Bear-EmptyState__actions",align:"center",gap:3,children:[n,i]})]})};exports.EmptyState=h;

package/dist/components/EmptyState/EmptyState.const.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e="Bear-EmptyState",S="bear-flex bear-flex-col bear-items-center bear-text-center",r="bear-bg-[var(--bear-bg-secondary)] bear-rounded-xl bear-border bear-border-[var(--bear-border-default)]",a="bear-text-[var(--bear-text-muted)] bear-mb-4",t="bear-font-semibold bear-text-[var(--bear-text-primary)] bear-mb-2",b="bear-text-[var(--bear-text-secondary)] bear-max-w-md bear-mb-6",T={sm:{icon:"bear-w-12 bear-h-12",title:"bear-text-lg",desc:"bear-text-sm",padding:"bear-py-6 bear-px-4"},md:{icon:"bear-w-16 bear-h-16",title:"bear-text-xl",desc:"bear-text-base",padding:"bear-py-10 bear-px-6"},lg:{icon:"bear-w-20 bear-h-20",title:"bear-text-2xl",desc:"bear-text-lg",padding:"bear-py-14 bear-px-8"}};exports.EMPTY_STATE_BASE_CLASSES=S;exports.EMPTY_STATE_CARD_CLASSES=r;exports.EMPTY_STATE_DESCRIPTION_CLASSES=b;exports.EMPTY_STATE_ICON_CLASSES=a;exports.EMPTY_STATE_ROOT_CLASS=e;exports.EMPTY_STATE_SIZE_CLASSES=T;exports.EMPTY_STATE_TITLE_CLASSES=t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../constants/generals.const.cjs"),r=require("./helpers/EmptyStateErrorSvg.cjs"),e=require("./helpers/EmptyStateInboxSvg.cjs"),E=require("./helpers/EmptyStateSearchSvg.cjs"),T=t.SIZE_MD,o=t.VARIANT_DEFAULT,a=t.EMPTY_STATE_PRESET_EMPTY,S="EmptyState",i={[t.EMPTY_STATE_PRESET_EMPTY]:e.EmptyStateInboxSvg,[t.EMPTY_STATE_PRESET_INBOX]:e.EmptyStateInboxSvg,[t.EMPTY_STATE_PRESET_SEARCH]:E.EmptyStateSearchSvg,[t.EMPTY_STATE_PRESET_ERROR]:r.EmptyStateErrorSvg,"no-data":e.EmptyStateInboxSvg,404:E.EmptyStateSearchSvg,offline:r.EmptyStateErrorSvg,"filter-empty":E.EmptyStateSearchSvg},n={empty:{title:"No items yet",description:"Get started by creating your first item."},inbox:{title:"Your inbox is empty",description:"All caught up! Check back later for new messages."},search:{title:"No results found",description:"Try adjusting your search or filter keywords."},error:{title:"Something went wrong",description:"We encountered an error loading this content."},"no-data":{title:"No data available",description:"There is no data to display right now."},404:{title:"Page not found",description:"The requested page or resource could not be located."},offline:{title:"Connection lost",description:"Please check your internet connection and try again."},"filter-empty":{title:"No matching filters",description:"No records match the selected filter criteria."}},_={sm:{icon:"bear-w-12 bear-h-12",title:"bear-text-lg",desc:"bear-text-sm",padding:"bear-py-6 bear-px-4"},md:{icon:"bear-w-16 bear-h-16",title:"bear-text-xl",desc:"bear-text-base",padding:"bear-py-10 bear-px-6"},lg:{icon:"bear-w-20 bear-h-20",title:"bear-text-2xl",desc:"bear-text-lg",padding:"bear-py-14 bear-px-8"}};exports.COMPONENT_NAME_EMPTY_STATE=S;exports.EMPTY_STATE_DEFAULT_PRESET=a;exports.EMPTY_STATE_DEFAULT_SIZE=T;exports.EMPTY_STATE_DEFAULT_VARIANT=o;exports.EMPTY_STATE_PRESET_DEFAULTS=n;exports.EMPTY_STATE_PRESET_ICON=i;exports.EMPTY_STATE_SIZE_CLASSES=_;

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

@@ -1,9 +1,16 @@
-export declare const EMPTY_STATE_ROOT_CLASS = "Bear-EmptyState";
-export declare const EMPTY_STATE_BASE_CLASSES = "bear-flex bear-flex-col bear-items-center bear-text-center";
-export declare const EMPTY_STATE_CARD_CLASSES = "bear-bg-[var(--bear-bg-secondary)] bear-rounded-xl bear-border bear-border-[var(--bear-border-default)]";
-export declare const EMPTY_STATE_ICON_CLASSES = "bear-text-[var(--bear-text-muted)] bear-mb-4";
-export declare const EMPTY_STATE_TITLE_CLASSES = "bear-font-semibold bear-text-[var(--bear-text-primary)] bear-mb-2";
-export declare const EMPTY_STATE_DESCRIPTION_CLASSES = "bear-text-[var(--bear-text-secondary)] bear-max-w-md bear-mb-6";
+import { ComponentType } from 'react';
+import { EmptyStatePreset } from './EmptyState.types';
+export declare const EMPTY_STATE_DEFAULT_SIZE: "md";
+export declare const EMPTY_STATE_DEFAULT_VARIANT: "default";
+export declare const EMPTY_STATE_DEFAULT_PRESET: EmptyStatePreset;
+export declare const COMPONENT_NAME_EMPTY_STATE = "EmptyState";
+export declare const EMPTY_STATE_PRESET_ICON: Record<EmptyStatePreset, ComponentType<{
+    className?: string;
+}>>;
+export declare const EMPTY_STATE_PRESET_DEFAULTS: Record<EmptyStatePreset, {
+    title: string;
+    description: string;
+}>;
 export declare const EMPTY_STATE_SIZE_CLASSES: {
     readonly sm: {
         readonly icon: "bear-w-12 bear-h-12";

package/dist/components/EmptyState/EmptyState.const.js

@@ -1,4 +1,26 @@
-const e = "Bear-EmptyState", r = "bear-flex bear-flex-col bear-items-center bear-text-center", a = "bear-bg-[var(--bear-bg-secondary)] bear-rounded-xl bear-border bear-border-[var(--bear-border-default)]", b = "bear-text-[var(--bear-text-muted)] bear-mb-4", t = "bear-font-semibold bear-text-[var(--bear-text-primary)] bear-mb-2", S = "bear-text-[var(--bear-text-secondary)] bear-max-w-md bear-mb-6", E = {
+import { SIZE_MD as i, VARIANT_DEFAULT as a, EMPTY_STATE_PRESET_EMPTY as o, EMPTY_STATE_PRESET_ERROR as n, EMPTY_STATE_PRESET_SEARCH as E, EMPTY_STATE_PRESET_INBOX as T } from "../../constants/generals.const.js";
+import { EmptyStateErrorSvg as r } from "./helpers/EmptyStateErrorSvg.js";
+import { EmptyStateInboxSvg as e } from "./helpers/EmptyStateInboxSvg.js";
+import { EmptyStateSearchSvg as t } from "./helpers/EmptyStateSearchSvg.js";
+const S = i, _ = a, p = o, b = "EmptyState", m = {
+  [o]: e,
+  [T]: e,
+  [E]: t,
+  [n]: r,
+  "no-data": e,
+  404: t,
+  offline: r,
+  "filter-empty": t
+}, A = {
+  empty: { title: "No items yet", description: "Get started by creating your first item." },
+  inbox: { title: "Your inbox is empty", description: "All caught up! Check back later for new messages." },
+  search: { title: "No results found", description: "Try adjusting your search or filter keywords." },
+  error: { title: "Something went wrong", description: "We encountered an error loading this content." },
+  "no-data": { title: "No data available", description: "There is no data to display right now." },
+  404: { title: "Page not found", description: "The requested page or resource could not be located." },
+  offline: { title: "Connection lost", description: "Please check your internet connection and try again." },
+  "filter-empty": { title: "No matching filters", description: "No records match the selected filter criteria." }
+}, P = {
   sm: {
     icon: "bear-w-12 bear-h-12",
     title: "bear-text-lg",
@@ -19,11 +41,11 @@ const e = "Bear-EmptyState", r = "bear-flex bear-flex-col bear-items-center bear
   }
 };
 export {
-  r as EMPTY_STATE_BASE_CLASSES,
-  a as EMPTY_STATE_CARD_CLASSES,
-  S as EMPTY_STATE_DESCRIPTION_CLASSES,
-  b as EMPTY_STATE_ICON_CLASSES,
-  e as EMPTY_STATE_ROOT_CLASS,
-  E as EMPTY_STATE_SIZE_CLASSES,
-  t as EMPTY_STATE_TITLE_CLASSES
+  b as COMPONENT_NAME_EMPTY_STATE,
+  p as EMPTY_STATE_DEFAULT_PRESET,
+  S as EMPTY_STATE_DEFAULT_SIZE,
+  _ as EMPTY_STATE_DEFAULT_VARIANT,
+  A as EMPTY_STATE_PRESET_DEFAULTS,
+  m as EMPTY_STATE_PRESET_ICON,
+  P as EMPTY_STATE_SIZE_CLASSES
 };

package/dist/components/EmptyState/EmptyState.d.ts

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

package/dist/components/EmptyState/EmptyState.js

@@ -1,54 +1,50 @@
-import { jsxs as l, jsx as e } from "react/jsx-runtime";
-import { EMPTY_STATE_SIZE_CLASSES as p, EMPTY_STATE_ICON_CLASSES as h, EMPTY_STATE_TITLE_CLASSES as C, EMPTY_STATE_DESCRIPTION_CLASSES as f, EMPTY_STATE_ROOT_CLASS as d, EMPTY_STATE_CARD_CLASSES as I, EMPTY_STATE_BASE_CLASSES as L } from "./EmptyState.const.js";
+import { jsxs as m, jsx as e } from "react/jsx-runtime";
+import { Box as n } from "../Box/Box.js";
+import { Flex as h } from "../Flex/Flex.js";
+import { Typography as T } from "../Typography/Typography.js";
 import { cn as r } from "../../utils/cn.js";
 import "react";
-import { resolveBearId as u } from "../../utils/generateBearId.utils.js";
-import { useBearId as v } from "../../utils/useBearId.js";
-const M = ({ className: t }) => /* @__PURE__ */ e("svg", { className: t, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ e(
-  "path",
-  {
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    strokeWidth: 1.5,
-    d: "M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2-2v-5m16 0h-2.586a1 1 0 00-.707.293l-2.414 2.414a1 1 0 01-.707.293h-3.172a1 1 0 01-.707-.293l-2.414-2.414A1 1 0 006.586 13H4"
-  }
-) }), k = ({
-  icon: t,
-  title: E,
-  description: s,
-  action: S,
-  secondaryAction: o,
-  className: i,
-  size: T = "md",
-  variant: m = "default",
-  id: n,
-  testId: _
-}) => {
-  const c = v("EmptyState"), A = u(n, c), a = p[T];
-  return /* @__PURE__ */ l(
-    "div",
+import { resolveBearId as Y } from "../../utils/generateBearId.utils.js";
+import { useBearId as g } from "../../utils/useBearId.js";
+import { EMPTY_STATE_DEFAULT_SIZE as u, EMPTY_STATE_DEFAULT_VARIANT as x, EMPTY_STATE_DEFAULT_PRESET as D, COMPONENT_NAME_EMPTY_STATE as F, EMPTY_STATE_PRESET_DEFAULTS as d, EMPTY_STATE_SIZE_CLASSES as L, EMPTY_STATE_PRESET_ICON as v } from "./EmptyState.const.js";
+const V = (_) => {
+  const {
+    icon: p,
+    title: l,
+    description: o,
+    action: s,
+    secondaryAction: i,
+    className: S,
+    size: A = u,
+    variant: N = x,
+    preset: a = D,
+    id: y,
+    testId: P
+  } = _, f = g(F), B = Y(y, f), t = L[A], I = v[a], M = p ?? /* @__PURE__ */ e(I, { className: "bear-w-full bear-h-full" }), c = d[a] ?? d.empty, E = o !== void 0 ? o : c.description;
+  return /* @__PURE__ */ m(
+    n,
     {
-      id: A,
-      "data-testid": _,
+      id: B,
+      "data-testid": P,
       className: r(
-        d,
-        L,
-        a.padding,
-        m === "card" && I,
-        i
+        "Bear-EmptyState",
+        N === "card" && "Bear-EmptyState--card",
+        `Bear-EmptyState--${a}`,
+        t.padding,
+        S
       ),
       children: [
-        /* @__PURE__ */ e("div", { className: r(h, a.icon), children: t || /* @__PURE__ */ e(M, { className: "bear-w-full bear-h-full" }) }),
-        /* @__PURE__ */ e("h3", { className: r(C, a.title), children: E }),
-        s && /* @__PURE__ */ e("p", { className: r(f, a.desc), children: s }),
-        (S || o) && /* @__PURE__ */ l("div", { className: `${d}__actions bear-flex bear-items-center bear-gap-3`, children: [
-          S,
-          o
+        /* @__PURE__ */ e(n, { className: r("Bear-EmptyState__icon", t.icon), children: M }),
+        /* @__PURE__ */ e(T, { className: r("Bear-EmptyState__title", t.title), children: l ?? c.title }),
+        E && /* @__PURE__ */ e(T, { className: r("Bear-EmptyState__description", t.desc), children: E }),
+        (s || i) && /* @__PURE__ */ m(h, { className: "Bear-EmptyState__actions", align: "center", gap: 3, children: [
+          s,
+          i
         ] })
       ]
     }
   );
 };
 export {
-  k as EmptyState
+  V as EmptyState
 };

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

@@ -1,13 +1,15 @@
 import { ReactNode } from 'react';
+export type EmptyStatePreset = 'empty' | 'search' | 'inbox' | 'error' | 'no-data' | '404' | 'offline' | 'filter-empty';
 export interface EmptyStateProps {
     testId?: string;
     id?: string;
     icon?: ReactNode;
-    title: string;
+    title?: string;
     description?: string;
     action?: ReactNode;
     secondaryAction?: ReactNode;
     className?: string;
     size?: 'sm' | 'md' | 'lg';
     variant?: 'default' | 'card';
+    preset?: EmptyStatePreset;
 }

package/dist/components/EmptyState/helpers/EmptyStateErrorSvg.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=r=>{const{className:t}=r;return e.jsx("svg",{className:t,fill:"none",viewBox:"0 0 24 24",stroke:"currentColor","aria-hidden":"true",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5,d:"M12 9v4m0 4h.01M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z"})})};exports.EmptyStateErrorSvg=o;

package/dist/components/EmptyState/helpers/EmptyStateErrorSvg.d.ts

@@ -0,0 +1,3 @@
+export declare const EmptyStateErrorSvg: (props: {
+    className?: string;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/components/EmptyState/helpers/EmptyStateErrorSvg.js

@@ -0,0 +1,8 @@
+import { jsx as r } from "react/jsx-runtime";
+const n = (o) => {
+  const { className: e } = o;
+  return /* @__PURE__ */ r("svg", { className: e, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", "aria-hidden": "true", children: /* @__PURE__ */ r("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M12 9v4m0 4h.01M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z" }) });
+};
+export {
+  n as EmptyStateErrorSvg
+};

package/dist/components/EmptyState/helpers/EmptyStateInboxSvg.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=t=>{const{className:o}=t;return e.jsx("svg",{className:o,fill:"none",viewBox:"0 0 24 24",stroke:"currentColor","aria-hidden":"true",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5,d:"M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2-2v-5m16 0h-2.586a1 1 0 00-.707.293l-2.414 2.414a1 1 0 01-.707.293h-3.172a1 1 0 01-.707-.293l-2.414-2.414A1 1 0 006.586 13H4"})})};exports.EmptyStateInboxSvg=r;

package/dist/components/EmptyState/helpers/EmptyStateInboxSvg.d.ts

@@ -0,0 +1,3 @@
+export declare const EmptyStateInboxSvg: (props: {
+    className?: string;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/components/EmptyState/helpers/EmptyStateInboxSvg.js

@@ -0,0 +1,8 @@
+import { jsx as o } from "react/jsx-runtime";
+const a = (r) => {
+  const { className: e } = r;
+  return /* @__PURE__ */ o("svg", { className: e, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", "aria-hidden": "true", children: /* @__PURE__ */ o("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M20 13V6a2 2 0 00-2-2H6a2 2 0 00-2 2v7m16 0v5a2 2 0 01-2 2H6a2 2 0 01-2-2v-5m16 0h-2.586a1 1 0 00-.707.293l-2.414 2.414a1 1 0 01-.707.293h-3.172a1 1 0 01-.707-.293l-2.414-2.414A1 1 0 006.586 13H4" }) });
+};
+export {
+  a as EmptyStateInboxSvg
+};

package/dist/components/EmptyState/helpers/EmptyStateSearchSvg.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=t=>{const{className:r}=t;return e.jsx("svg",{className:r,fill:"none",viewBox:"0 0 24 24",stroke:"currentColor","aria-hidden":"true",children:e.jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:1.5,d:"M21 21l-4.35-4.35M10.5 18a7.5 7.5 0 100-15 7.5 7.5 0 000 15z"})})};exports.EmptyStateSearchSvg=o;

package/dist/components/EmptyState/helpers/EmptyStateSearchSvg.d.ts

@@ -0,0 +1,3 @@
+export declare const EmptyStateSearchSvg: (props: {
+    className?: string;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/components/EmptyState/helpers/EmptyStateSearchSvg.js

@@ -0,0 +1,8 @@
+import { jsx as r } from "react/jsx-runtime";
+const n = (e) => {
+  const { className: o } = e;
+  return /* @__PURE__ */ r("svg", { className: o, fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", "aria-hidden": "true", children: /* @__PURE__ */ r("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 1.5, d: "M21 21l-4.35-4.35M10.5 18a7.5 7.5 0 100-15 7.5 7.5 0 000 15z" }) });
+};
+export {
+  n as EmptyStateSearchSvg
+};

package/dist/components/EmptyState/helpers/index.d.ts

@@ -0,0 +1,3 @@
+export { EmptyStateErrorSvg } from './EmptyStateErrorSvg';
+export { EmptyStateInboxSvg } from './EmptyStateInboxSvg';
+export { EmptyStateSearchSvg } from './EmptyStateSearchSvg';

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

@@ -1,2 +1,2 @@
 export { EmptyState } from './EmptyState';
-export type { EmptyStateProps } from './EmptyState.types';
+export type { EmptyStatePreset, EmptyStateProps } from './EmptyState.types';