@forgedevstack/bear 1.1.9 → 1.2.1

package/dist/hooks/bearStyled.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),u=require("../utils/cn.cjs");function i(s){return function(a){const n=l=>{const c={...a,...l},e=a,t=l;return((e==null?void 0:e.className)!=null||(t==null?void 0:t.className)!=null)&&(c.className=u.cn(e==null?void 0:e.className,t==null?void 0:t.className)),r.jsx(s,{...c})};return n.displayName=`BearStyled(${s.displayName??s.name??"Component"})`,n}}exports.bearStyled=i;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("react/jsx-runtime"),S=require("../utils/cn.cjs");function b(c,e){return function(f){const r=(e==null?void 0:e.defaultProps)??f??{},t=e==null?void 0:e.style,N=e==null?void 0:e.className,y=u=>{const s={...r,...u},a=r,l=u,m=S.cn(N,a==null?void 0:a.className,l==null?void 0:l.className);return m&&(s.className=m),(t||a!=null&&a.style||l!=null&&l.style)&&(s.style={...t??{},...(a==null?void 0:a.style)??{},...(l==null?void 0:l.style)??{}}),d.jsx(c,{...s})};return y.displayName=(e==null?void 0:e.displayName)??`BearStyled(${c.displayName??c.name??"Component"})`,y}}exports.bearStyled=b;

package/dist/hooks/bearStyled.d.ts

@@ -1,17 +1,39 @@
-import { ComponentType } from 'react';
+import { ComponentType, CSSProperties } from 'react';
+type StyleOverrides = CSSProperties;
+interface BearStyledOptions<P> {
+    /** Default props merged with every instance */
+    defaultProps?: Partial<P>;
+    /** Inline style object applied to every instance (merges with consumer `style` prop) */
+    style?: StyleOverrides;
+    /** Additional className applied to every instance */
+    className?: string;
+    /** Display name for React DevTools */
+    displayName?: string;
+}
 /**
- * Create a pre-styled Bear component with default props. Use to change all instances
- * of a component (e.g. Button) with minimal code.
+ * bearStyled — create a pre-configured variant of any Bear component.
+ *
+ * Use it like styled-components but for Bear: take any component, lock in
+ * default props and custom CSS, then re-export and reuse everywhere.
+ * The component retains all original props and behaviour; consumers can
+ * still override anything on a per-instance basis.
  *
  * @example
  * ```tsx
+ * // Simple — default props only (original API still works)
  * const PrimaryButton = bearStyled(Button)({ variant: 'primary' });
- * <PrimaryButton>Click</PrimaryButton>
  *
- * const BoldButton = bearStyled(Button)({ bis: { fontWeight: 700 }, className: 'uppercase' });
+ * // With inline style overrides
+ * const RoundedButton = bearStyled(Button, {
+ *   defaultProps: { variant: 'primary', size: 'lg' },
+ *   style: { borderRadius: 10, borderLeft: '3px solid red' },
+ *   className: 'uppercase',
+ * });
+ *
+ * // Override at use-site
+ * <RoundedButton onClick={save}>Save</RoundedButton>
+ * <RoundedButton style={{ borderRadius: 20 }}>More round</RoundedButton>
  * ```
  */
-export declare function bearStyled<P extends object>(Component: ComponentType<P>): (defaultProps: Partial<P>) => {
-    (props: P): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
+export declare function bearStyled<P extends object>(Component: ComponentType<P>, options?: BearStyledOptions<P>): (overrideProps?: Partial<P>) => ComponentType<P>;
+export {};

package/dist/hooks/bearStyled.js

@@ -1,17 +1,22 @@
-import { jsx as m } from "react/jsx-runtime";
-import { cn as r } from "../utils/cn.js";
-function N(s) {
-  return function(t) {
-    const l = (n) => {
-      const c = { ...t, ...n }, e = t, a = n;
-      return ((e == null ? void 0 : e.className) != null || (a == null ? void 0 : a.className) != null) && (c.className = r(
-        e == null ? void 0 : e.className,
-        a == null ? void 0 : a.className
-      )), /* @__PURE__ */ m(s, { ...c });
+import { jsx as d } from "react/jsx-runtime";
+import { cn as S } from "../utils/cn.js";
+function h(c, e) {
+  return function(u) {
+    const r = (e == null ? void 0 : e.defaultProps) ?? u ?? {}, m = e == null ? void 0 : e.style, N = e == null ? void 0 : e.className, y = (t) => {
+      const s = { ...r, ...t }, a = r, l = t, f = S(
+        N,
+        a == null ? void 0 : a.className,
+        l == null ? void 0 : l.className
+      );
+      return f && (s.className = f), (m || a != null && a.style || l != null && l.style) && (s.style = {
+        ...m ?? {},
+        ...(a == null ? void 0 : a.style) ?? {},
+        ...(l == null ? void 0 : l.style) ?? {}
+      }), /* @__PURE__ */ d(c, { ...s });
     };
-    return l.displayName = `BearStyled(${s.displayName ?? s.name ?? "Component"})`, l;
+    return y.displayName = (e == null ? void 0 : e.displayName) ?? `BearStyled(${c.displayName ?? c.name ?? "Component"})`, y;
   };
 }
 export {
-  N as bearStyled
+  h as bearStyled
 };

package/dist/hooks/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./useMediaQuery.cjs"),n=require("./useClickOutside.cjs"),a=require("./useResizeObserver/useResizeObserver.cjs"),l=require("./useDisclosure.cjs"),c=require("./useBearStyles.cjs"),b=require("./bearStyled.cjs"),d=require("./useSlide/useSlide.cjs"),q=require("./useParallax/useParallax.cjs"),p=require("./useBounce/useBounce.cjs"),P=require("./useFloat/useFloat.cjs"),S=require("./usePulse/usePulse.cjs"),y=require("./useShake/useShake.cjs"),C=require("./useClipboard/useClipboard.cjs"),u=require("./useDebounce/useDebounce.cjs"),r=require("./useThrottle/useThrottle.cjs"),D=require("./useLocalStorage/useLocalStorage.cjs"),o=require("./useKeyPress/useKeyPress.cjs"),t=require("./useIntersectionObserver/useIntersectionObserver.cjs"),g=require("./useDragDrop/useDragDrop.cjs"),k=require("./useLazyLoad/useLazyLoad.cjs"),s=require("./useBearComponent/useBearComponent.cjs"),B=require("./useSpotlight/useSpotlight.cjs"),v=require("./useOnline/useOnline.cjs"),I=require("./useWebSocket/useWebSocket.cjs"),O=require("./useIdle/useIdle.cjs"),L=require("./usePageVisibility/usePageVisibility.cjs"),h=require("./useLongPress/useLongPress.cjs"),m=require("./useAnimate.cjs"),i=require("./useResponsive.cjs");exports.useIsDesktop=e.useIsDesktop;exports.useIsMobile=e.useIsMobile;exports.useIsTablet=e.useIsTablet;exports.useMediaQuery=e.useMediaQuery;exports.usePrefersDark=e.usePrefersDark;exports.usePrefersReducedMotion=e.usePrefersReducedMotion;exports.useClickOutside=n.useClickOutside;exports.useResizeObserver=a.useResizeObserver;exports.useDisclosure=l.useDisclosure;exports.useBearStyles=c.useBearStyles;exports.bearStyled=b.bearStyled;exports.useSlide=d.useSlide;exports.useParallax=q.useParallax;exports.useBounce=p.useBounce;exports.useFloat=P.useFloat;exports.usePulse=S.usePulse;exports.useShake=y.useShake;exports.useClipboard=C.useClipboard;exports.useDebounce=u.useDebounce;exports.useDebouncedCallback=u.useDebouncedCallback;exports.useThrottle=r.useThrottle;exports.useThrottledCallback=r.useThrottledCallback;exports.useLocalStorage=D.useLocalStorage;exports.useKeyPress=o.useKeyPress;exports.useKeyPressState=o.useKeyPressState;exports.useInView=t.useInView;exports.useIntersectionObserver=t.useIntersectionObserver;exports.useDragDrop=g.useDragDrop;exports.useLazyLoad=k.useLazyLoad;exports.BearComponentProvider=s.BearComponentProvider;exports.useBC=s.useBC;exports.useBearComponent=s.useBearComponent;exports.useBearComponentContext=s.useBearComponentContext;exports.useSpotlight=B.useSpotlight;exports.useOnline=v.useOnline;exports.useWebSocket=I.useWebSocket;exports.useIdle=O.useIdle;exports.usePageVisibility=L.usePageVisibility;exports.useLongPress=h.useLongPress;exports.useAnimate=m.useAnimate;exports.useResponsive=i.useResponsive;exports.useResponsiveProps=i.useResponsiveProps;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./useMediaQuery.cjs"),u=require("./useClickOutside.cjs"),a=require("./useResizeObserver/useResizeObserver.cjs"),l=require("./useDisclosure.cjs"),c=require("./useBearStyles.cjs"),d=require("./bearStyled.cjs"),b=require("./useSlide/useSlide.cjs"),q=require("./useParallax/useParallax.cjs"),p=require("./useBounce/useBounce.cjs"),P=require("./useFloat/useFloat.cjs"),S=require("./usePulse/usePulse.cjs"),C=require("./useShake/useShake.cjs"),y=require("./useClipboard/useClipboard.cjs"),r=require("./useDebounce/useDebounce.cjs"),o=require("./useThrottle/useThrottle.cjs"),k=require("./useLocalStorage/useLocalStorage.cjs"),t=require("./useKeyPress/useKeyPress.cjs"),i=require("./useIntersectionObserver/useIntersectionObserver.cjs"),D=require("./useDragDrop/useDragDrop.cjs"),g=require("./useLazyLoad/useLazyLoad.cjs"),s=require("./useBearComponent/useBearComponent.cjs"),B=require("./useSpotlight/useSpotlight.cjs"),O=require("./useOnline/useOnline.cjs"),v=require("./useWebSocket/useWebSocket.cjs"),I=require("./useIdle/useIdle.cjs"),L=require("./usePageVisibility/usePageVisibility.cjs"),h=require("./useLongPress/useLongPress.cjs"),m=require("./useAnimate.cjs"),n=require("./useResponsive.cjs");exports.useIsDesktop=e.useIsDesktop;exports.useIsMobile=e.useIsMobile;exports.useIsTablet=e.useIsTablet;exports.useMediaQuery=e.useMediaQuery;exports.usePrefersDark=e.usePrefersDark;exports.usePrefersReducedMotion=e.usePrefersReducedMotion;exports.useClickOutside=u.useClickOutside;exports.useClickOutsideMultiple=u.useClickOutsideMultiple;exports.useResizeObserver=a.useResizeObserver;exports.useDisclosure=l.useDisclosure;exports.useBearStyles=c.useBearStyles;exports.bearStyled=d.bearStyled;exports.useSlide=b.useSlide;exports.useParallax=q.useParallax;exports.useBounce=p.useBounce;exports.useFloat=P.useFloat;exports.usePulse=S.usePulse;exports.useShake=C.useShake;exports.useClipboard=y.useClipboard;exports.useDebounce=r.useDebounce;exports.useDebouncedCallback=r.useDebouncedCallback;exports.useThrottle=o.useThrottle;exports.useThrottledCallback=o.useThrottledCallback;exports.useLocalStorage=k.useLocalStorage;exports.useKeyPress=t.useKeyPress;exports.useKeyPressState=t.useKeyPressState;exports.useInView=i.useInView;exports.useIntersectionObserver=i.useIntersectionObserver;exports.useDragDrop=D.useDragDrop;exports.useLazyLoad=g.useLazyLoad;exports.BearComponentProvider=s.BearComponentProvider;exports.useBC=s.useBC;exports.useBearComponent=s.useBearComponent;exports.useBearComponentContext=s.useBearComponentContext;exports.useSpotlight=B.useSpotlight;exports.useOnline=O.useOnline;exports.useWebSocket=v.useWebSocket;exports.useIdle=I.useIdle;exports.usePageVisibility=L.usePageVisibility;exports.useLongPress=h.useLongPress;exports.useAnimate=m.useAnimate;exports.useResponsive=n.useResponsive;exports.useResponsiveProps=n.useResponsiveProps;

package/dist/hooks/index.d.ts

@@ -1,5 +1,5 @@
 export { useMediaQuery, useIsMobile, useIsTablet, useIsDesktop, usePrefersReducedMotion, usePrefersDark, } from './useMediaQuery';
-export { useClickOutside } from './useClickOutside';
+export { useClickOutside, useClickOutsideMultiple } from './useClickOutside';
 export { useResizeObserver } from './useResizeObserver';
 export type { UseResizeObserverOptions, UseResizeObserverReturn } from './useResizeObserver';
 export { useDisclosure } from './useDisclosure';

package/dist/hooks/index.js

@@ -1,73 +1,74 @@
 import { useIsDesktop as r, useIsMobile as s, useIsTablet as t, useMediaQuery as u, usePrefersDark as p, usePrefersReducedMotion as m } from "./useMediaQuery.js";
-import { useClickOutside as x } from "./useClickOutside.js";
-import { useResizeObserver as l } from "./useResizeObserver/useResizeObserver.js";
-import { useDisclosure as n } from "./useDisclosure.js";
-import { useBearStyles as d } from "./useBearStyles.js";
+import { useClickOutside as x, useClickOutsideMultiple as a } from "./useClickOutside.js";
+import { useResizeObserver as i } from "./useResizeObserver/useResizeObserver.js";
+import { useDisclosure as d } from "./useDisclosure.js";
+import { useBearStyles as c } from "./useBearStyles.js";
 import { bearStyled as P } from "./bearStyled.js";
 import { useSlide as S } from "./useSlide/useSlide.js";
-import { useParallax as y } from "./useParallax/useParallax.js";
-import { useBounce as B } from "./useBounce/useBounce.js";
-import { useFloat as g } from "./useFloat/useFloat.js";
+import { useParallax as D } from "./useParallax/useParallax.js";
+import { useBounce as I } from "./useBounce/useBounce.js";
+import { useFloat as v } from "./useFloat/useFloat.js";
 import { usePulse as h } from "./usePulse/usePulse.js";
-import { useShake as O } from "./useShake/useShake.js";
-import { useClipboard as M } from "./useClipboard/useClipboard.js";
-import { useDebounce as z, useDebouncedCallback as K } from "./useDebounce/useDebounce.js";
-import { useThrottle as w, useThrottledCallback as A } from "./useThrottle/useThrottle.js";
-import { useLocalStorage as Q } from "./useLocalStorage/useLocalStorage.js";
-import { useKeyPress as j, useKeyPressState as q } from "./useKeyPress/useKeyPress.js";
-import { useInView as G, useIntersectionObserver as H } from "./useIntersectionObserver/useIntersectionObserver.js";
-import { useDragDrop as N } from "./useDragDrop/useDragDrop.js";
-import { useLazyLoad as X } from "./useLazyLoad/useLazyLoad.js";
-import { BearComponentProvider as Z, useBC as _, useBearComponent as $, useBearComponentContext as ee } from "./useBearComponent/useBearComponent.js";
-import { useSpotlight as re } from "./useSpotlight/useSpotlight.js";
-import { useOnline as te } from "./useOnline/useOnline.js";
-import { useWebSocket as pe } from "./useWebSocket/useWebSocket.js";
-import { useIdle as fe } from "./useIdle/useIdle.js";
-import { usePageVisibility as ae } from "./usePageVisibility/usePageVisibility.js";
-import { useLongPress as ie } from "./useLongPress/useLongPress.js";
+import { useShake as M } from "./useShake/useShake.js";
+import { useClipboard as T } from "./useClipboard/useClipboard.js";
+import { useDebounce as K, useDebouncedCallback as V } from "./useDebounce/useDebounce.js";
+import { useThrottle as A, useThrottledCallback as F } from "./useThrottle/useThrottle.js";
+import { useLocalStorage as W } from "./useLocalStorage/useLocalStorage.js";
+import { useKeyPress as q, useKeyPressState as E } from "./useKeyPress/useKeyPress.js";
+import { useInView as H, useIntersectionObserver as J } from "./useIntersectionObserver/useIntersectionObserver.js";
+import { useDragDrop as U } from "./useDragDrop/useDragDrop.js";
+import { useLazyLoad as Y } from "./useLazyLoad/useLazyLoad.js";
+import { BearComponentProvider as _, useBC as $, useBearComponent as ee, useBearComponentContext as oe } from "./useBearComponent/useBearComponent.js";
+import { useSpotlight as se } from "./useSpotlight/useSpotlight.js";
+import { useOnline as ue } from "./useOnline/useOnline.js";
+import { useWebSocket as me } from "./useWebSocket/useWebSocket.js";
+import { useIdle as xe } from "./useIdle/useIdle.js";
+import { usePageVisibility as le } from "./usePageVisibility/usePageVisibility.js";
+import { useLongPress as ne } from "./useLongPress/useLongPress.js";
 import { useAnimate as be } from "./useAnimate.js";
-import { useResponsive as ce, useResponsiveProps as Pe } from "./useResponsive.js";
+import { useResponsive as Ce, useResponsiveProps as Pe } from "./useResponsive.js";
 export {
-  Z as BearComponentProvider,
+  _ as BearComponentProvider,
   P as bearStyled,
   be as useAnimate,
-  _ as useBC,
-  $ as useBearComponent,
-  ee as useBearComponentContext,
-  d as useBearStyles,
-  B as useBounce,
+  $ as useBC,
+  ee as useBearComponent,
+  oe as useBearComponentContext,
+  c as useBearStyles,
+  I as useBounce,
   x as useClickOutside,
-  M as useClipboard,
-  z as useDebounce,
-  K as useDebouncedCallback,
-  n as useDisclosure,
-  N as useDragDrop,
-  g as useFloat,
-  fe as useIdle,
-  G as useInView,
-  H as useIntersectionObserver,
+  a as useClickOutsideMultiple,
+  T as useClipboard,
+  K as useDebounce,
+  V as useDebouncedCallback,
+  d as useDisclosure,
+  U as useDragDrop,
+  v as useFloat,
+  xe as useIdle,
+  H as useInView,
+  J as useIntersectionObserver,
   r as useIsDesktop,
   s as useIsMobile,
   t as useIsTablet,
-  j as useKeyPress,
-  q as useKeyPressState,
-  X as useLazyLoad,
-  Q as useLocalStorage,
-  ie as useLongPress,
+  q as useKeyPress,
+  E as useKeyPressState,
+  Y as useLazyLoad,
+  W as useLocalStorage,
+  ne as useLongPress,
   u as useMediaQuery,
-  te as useOnline,
-  ae as usePageVisibility,
-  y as useParallax,
+  ue as useOnline,
+  le as usePageVisibility,
+  D as useParallax,
   p as usePrefersDark,
   m as usePrefersReducedMotion,
   h as usePulse,
-  l as useResizeObserver,
-  ce as useResponsive,
+  i as useResizeObserver,
+  Ce as useResponsive,
   Pe as useResponsiveProps,
-  O as useShake,
+  M as useShake,
   S as useSlide,
-  re as useSpotlight,
-  w as useThrottle,
-  A as useThrottledCallback,
-  pe as useWebSocket
+  se as useSpotlight,
+  A as useThrottle,
+  F as useThrottledCallback,
+  me as useWebSocket
 };

package/dist/hooks/useClickOutside.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react"),u=(t,n)=>{r.useEffect(()=>{const e=o=>{const s=t.current;!s||s.contains(o.target)||n(o)};return document.addEventListener("mousedown",e),document.addEventListener("touchstart",e),()=>{document.removeEventListener("mousedown",e),document.removeEventListener("touchstart",e)}},[t,n])};exports.useClickOutside=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react"),a=(n,e)=>{r.useEffect(()=>{const t=u=>{const s=n.current;!s||s.contains(u.target)||e(u)};return document.addEventListener("mousedown",t),document.addEventListener("touchstart",t),()=>{document.removeEventListener("mousedown",t),document.removeEventListener("touchstart",t)}},[n,e])},l=(n,e,t={})=>{const{enabled:u=!0}=t,s=r.useRef(e);r.useEffect(()=>{s.current=e},[e]);const o=r.useCallback(c=>{const d=c.target;n.some(m=>{var i;return(i=m.current)==null?void 0:i.contains(d)})||s.current(c)},[n]);r.useEffect(()=>{if(u)return document.addEventListener("mousedown",o),document.addEventListener("touchstart",o),()=>{document.removeEventListener("mousedown",o),document.removeEventListener("touchstart",o)}},[u,o])};exports.useClickOutside=a;exports.useClickOutsideMultiple=l;

package/dist/hooks/useClickOutside.d.ts

@@ -1,13 +1,6 @@
 import { RefObject } from 'react';
-/**
- * Hook to detect clicks outside of an element
- *
- * @example
- * ```tsx
- * const ref = useRef<HTMLDivElement>(null);
- * useClickOutside(ref, () => setIsOpen(false));
- *
- * return <div ref={ref}>Dropdown content</div>;
- * ```
- */
+export type UseClickOutsideMultipleOptions = {
+    enabled?: boolean;
+};
 export declare const useClickOutside: <T extends HTMLElement>(ref: RefObject<T>, handler: (event: MouseEvent | TouchEvent) => void) => void;
+export declare const useClickOutsideMultiple: <T extends HTMLElement>(refs: RefObject<T>[], handler: (event: MouseEvent | TouchEvent) => void, options?: UseClickOutsideMultipleOptions) => void;

package/dist/hooks/useClickOutside.js

@@ -1,15 +1,34 @@
-import { useEffect as s } from "react";
-const c = (e, n) => {
-  s(() => {
+import { useRef as a, useEffect as u, useCallback as v } from "react";
+const L = (n, e) => {
+  u(() => {
     const t = (o) => {
-      const r = e.current;
-      !r || r.contains(o.target) || n(o);
+      const r = n.current;
+      !r || r.contains(o.target) || e(o);
     };
     return document.addEventListener("mousedown", t), document.addEventListener("touchstart", t), () => {
       document.removeEventListener("mousedown", t), document.removeEventListener("touchstart", t);
     };
-  }, [e, n]);
+  }, [n, e]);
+}, l = (n, e, t = {}) => {
+  const { enabled: o = !0 } = t, r = a(e);
+  u(() => {
+    r.current = e;
+  }, [e]);
+  const s = v((c) => {
+    const i = c.target;
+    n.some((m) => {
+      var d;
+      return (d = m.current) == null ? void 0 : d.contains(i);
+    }) || r.current(c);
+  }, [n]);
+  u(() => {
+    if (o)
+      return document.addEventListener("mousedown", s), document.addEventListener("touchstart", s), () => {
+        document.removeEventListener("mousedown", s), document.removeEventListener("touchstart", s);
+      };
+  }, [o, s]);
 };
 export {
-  c as useClickOutside
+  L as useClickOutside,
+  l as useClickOutsideMultiple
 };

package/dist/hooks/useMediaQuery/useMediaQuery.d.ts

@@ -2,10 +2,18 @@ import { UseMediaQueryOptions, UseMediaQueryReturn, BreakpointKey } from './useM
 /**
  * useMediaQuery - Track media query matches
  *
+ * Resolves breakpoint keys (sm, md, lg, xl, 2xl, dark, etc.) to media queries.
+ * When used inside a BearProvider, breakpoints from the theme are used,
+ * so you can override `xl` or add custom keys like `xxl`.
+ *
  * @example
  * ```tsx
  * const isMobile = useMediaQuery('(max-width: 768px)');
- * const isDark = useMediaQuery('dark'); // Uses predefined breakpoint
+ * const isLg = useMediaQuery('lg');
+ *
+ * // With BearProvider breakpoints override:
+ * // <BearProvider theme={{ breakpoints: { xl: '2500px', xxl: '3000px' } }}>
+ * const isXl = useMediaQuery('xl'); // now matches 2500px
  * ```
  */
 export declare const useMediaQuery: (query: string | BreakpointKey, options?: UseMediaQueryOptions) => UseMediaQueryReturn;

package/dist/hooks/useResponsive.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const x=require("react"),o=require("./useMediaQuery.cjs"),u={sm:640,md:768,lg:1024,xl:1280,"2xl":1536};function a(n){const d=o.useMediaQuery(`(min-width: ${u.sm}px)`),r=o.useMediaQuery(`(min-width: ${u.md}px)`),l=o.useMediaQuery(`(min-width: ${u.lg}px)`),c=o.useMediaQuery(`(min-width: ${u.xl}px)`),m=o.useMediaQuery(`(min-width: ${u["2xl"]}px)`);return x.useMemo(()=>{if(n==null||typeof n!="object")return n;const i=n;if(!("base"in i||"sm"in i||"md"in i||"lg"in i||"xl"in i||"2xl"in i))return n;if(m&&i["2xl"]!==void 0)return i["2xl"];if(c&&i.xl!==void 0)return i.xl;if(l&&i.lg!==void 0)return i.lg;if(r&&i.md!==void 0)return i.md;if(d&&i.sm!==void 0)return i.sm;if(i.base!==void 0)return i.base;for(const t of["sm","md","lg","xl","2xl"])if(i[t]!==void 0)return i[t];return n},[n,d,r,l,c,m])}function f(n){const d=o.useMediaQuery(`(min-width: ${u.sm}px)`),r=o.useMediaQuery(`(min-width: ${u.md}px)`),l=o.useMediaQuery(`(min-width: ${u.lg}px)`),c=o.useMediaQuery(`(min-width: ${u.xl}px)`),m=o.useMediaQuery(`(min-width: ${u["2xl"]}px)`);return x.useMemo(()=>{const i={};for(const[s,t]of Object.entries(n)){if(t==null||typeof t!="object"){i[s]=t;continue}const e=t;if(!("base"in e||"sm"in e||"md"in e||"lg"in e||"xl"in e||"2xl"in e)){i[s]=t;continue}if(m&&e["2xl"]!==void 0){i[s]=e["2xl"];continue}if(c&&e.xl!==void 0){i[s]=e.xl;continue}if(l&&e.lg!==void 0){i[s]=e.lg;continue}if(r&&e.md!==void 0){i[s]=e.md;continue}if(d&&e.sm!==void 0){i[s]=e.sm;continue}if(e.base!==void 0){i[s]=e.base;continue}i[s]=t}return i},[n,d,r,l,c,m])}exports.useResponsive=a;exports.useResponsiveProps=f;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("react"),r=require("./useMediaQuery.cjs"),b=require("../context/BearProvider.cjs"),u={sm:640,md:768,lg:1024,xl:1280,"2xl":1536};function d(s){return parseInt(s,10)||0}function Q(s){var v;const x=y.useContext(b.BearContext),i=(v=x==null?void 0:x.theme)==null?void 0:v.breakpoints,g=i?d(i.sm):u.sm,p=i?d(i.md):u.md,h=i?d(i.lg):u.lg,M=i?d(i.xl):u.xl,P=i?d(i["2xl"]):u["2xl"],l=r.useMediaQuery(`(min-width: ${g}px)`),c=r.useMediaQuery(`(min-width: ${p}px)`),m=r.useMediaQuery(`(min-width: ${h}px)`),a=r.useMediaQuery(`(min-width: ${M}px)`),f=r.useMediaQuery(`(min-width: ${P}px)`);return y.useMemo(()=>{if(s==null||typeof s!="object")return s;const e=s;if(!("base"in e||"sm"in e||"md"in e||"lg"in e||"xl"in e||"2xl"in e))return s;if(f&&e["2xl"]!==void 0)return e["2xl"];if(a&&e.xl!==void 0)return e.xl;if(m&&e.lg!==void 0)return e.lg;if(c&&e.md!==void 0)return e.md;if(l&&e.sm!==void 0)return e.sm;if(e.base!==void 0)return e.base;for(const o of["sm","md","lg","xl","2xl"])if(e[o]!==void 0)return e[o];return s},[s,l,c,m,a,f])}function w(s){var v;const x=y.useContext(b.BearContext),i=(v=x==null?void 0:x.theme)==null?void 0:v.breakpoints,g=i?d(i.sm):u.sm,p=i?d(i.md):u.md,h=i?d(i.lg):u.lg,M=i?d(i.xl):u.xl,P=i?d(i["2xl"]):u["2xl"],l=r.useMediaQuery(`(min-width: ${g}px)`),c=r.useMediaQuery(`(min-width: ${p}px)`),m=r.useMediaQuery(`(min-width: ${h}px)`),a=r.useMediaQuery(`(min-width: ${M}px)`),f=r.useMediaQuery(`(min-width: ${P}px)`);return y.useMemo(()=>{const e={};for(const[t,o]of Object.entries(s)){if(o==null||typeof o!="object"){e[t]=o;continue}const n=o;if(!("base"in n||"sm"in n||"md"in n||"lg"in n||"xl"in n||"2xl"in n)){e[t]=o;continue}if(f&&n["2xl"]!==void 0){e[t]=n["2xl"];continue}if(a&&n.xl!==void 0){e[t]=n.xl;continue}if(m&&n.lg!==void 0){e[t]=n.lg;continue}if(c&&n.md!==void 0){e[t]=n.md;continue}if(l&&n.sm!==void 0){e[t]=n.sm;continue}if(n.base!==void 0){e[t]=n.base;continue}e[t]=o}return e},[s,l,c,m,a,f])}exports.useResponsive=Q;exports.useResponsiveProps=w;

package/dist/hooks/useResponsive.d.ts

@@ -2,32 +2,17 @@ import { ResponsiveProp } from '../types/theme.types';
 /**
  * useResponsive - Resolves responsive prop values based on current viewport
  *
- * @description
- * Takes a ResponsiveProp value (which can be a single value or an object
- * with breakpoint keys) and resolves it to the current value based on
- * the viewport width.
+ * Reads breakpoint values from BearProvider when available, so overrides
+ * (e.g. `xl: '2500px'`) and custom keys (e.g. `xxl: '3000px'`) are respected.
  *
  * @example
  * ```tsx
  * const columns = useResponsive({ base: 1, sm: 2, md: 3, lg: 4 });
- * // Returns 1 on mobile, 2 on sm, 3 on md, 4 on lg+
- *
- * const size = useResponsive('md');
- * // Returns 'md' always (non-responsive)
  * ```
  */
 export declare function useResponsive<T>(prop: ResponsiveProp<T>): T;
 /**
  * useResponsiveProps - Resolves multiple responsive props at once
- *
- * @example
- * ```tsx
- * const { columns, gap, size } = useResponsiveProps({
- *   columns: { base: 1, md: 2, lg: 4 },
- *   gap: { base: 2, md: 4 },
- *   size: 'md', // non-responsive value
- * });
- * ```
  */
 export declare function useResponsiveProps<T extends Record<string, ResponsiveProp<unknown>>>(props: T): {
     [K in keyof T]: T[K] extends ResponsiveProp<infer V> ? V : T[K];

package/dist/hooks/useResponsive.js

@@ -1,5 +1,6 @@
-import { useMemo as u } from "react";
-import { useMediaQuery as o } from "./useMediaQuery.js";
+import { useContext as w, useMemo as $ } from "react";
+import { useMediaQuery as x } from "./useMediaQuery.js";
+import { BearContext as k } from "../context/BearProvider.js";
 const l = {
   sm: 640,
   md: 768,
@@ -7,68 +8,73 @@ const l = {
   xl: 1280,
   "2xl": 1536
 };
-function h(s) {
-  const d = o(`(min-width: ${l.sm}px)`), m = o(`(min-width: ${l.md}px)`), r = o(`(min-width: ${l.lg}px)`), x = o(`(min-width: ${l.xl}px)`), c = o(`(min-width: ${l["2xl"]}px)`);
-  return u(() => {
+function m(s) {
+  return parseInt(s, 10) || 0;
+}
+function j(s) {
+  var v;
+  const r = w(k), i = (v = r == null ? void 0 : r.theme) == null ? void 0 : v.breakpoints, p = i ? m(i.sm) : l.sm, g = i ? m(i.md) : l.md, h = i ? m(i.lg) : l.lg, b = i ? m(i.xl) : l.xl, P = i ? m(i["2xl"]) : l["2xl"], c = x(`(min-width: ${p}px)`), d = x(`(min-width: ${g}px)`), u = x(`(min-width: ${h}px)`), f = x(`(min-width: ${b}px)`), a = x(`(min-width: ${P}px)`);
+  return $(() => {
     if (s == null || typeof s != "object")
       return s;
-    const i = s;
-    if (!("base" in i || "sm" in i || "md" in i || "lg" in i || "xl" in i || "2xl" in i)) return s;
-    if (c && i["2xl"] !== void 0) return i["2xl"];
-    if (x && i.xl !== void 0) return i.xl;
-    if (r && i.lg !== void 0) return i.lg;
-    if (m && i.md !== void 0) return i.md;
-    if (d && i.sm !== void 0) return i.sm;
-    if (i.base !== void 0) return i.base;
+    const n = s;
+    if (!("base" in n || "sm" in n || "md" in n || "lg" in n || "xl" in n || "2xl" in n)) return s;
+    if (a && n["2xl"] !== void 0) return n["2xl"];
+    if (f && n.xl !== void 0) return n.xl;
+    if (u && n.lg !== void 0) return n.lg;
+    if (d && n.md !== void 0) return n.md;
+    if (c && n.sm !== void 0) return n.sm;
+    if (n.base !== void 0) return n.base;
     for (const e of ["sm", "md", "lg", "xl", "2xl"])
-      if (i[e] !== void 0) return i[e];
+      if (n[e] !== void 0) return n[e];
     return s;
-  }, [s, d, m, r, x, c]);
+  }, [s, c, d, u, f, a]);
 }
-function g(s) {
-  const d = o(`(min-width: ${l.sm}px)`), m = o(`(min-width: ${l.md}px)`), r = o(`(min-width: ${l.lg}px)`), x = o(`(min-width: ${l.xl}px)`), c = o(`(min-width: ${l["2xl"]}px)`);
-  return u(() => {
-    const i = {};
-    for (const [t, e] of Object.entries(s)) {
+function L(s) {
+  var v;
+  const r = w(k), i = (v = r == null ? void 0 : r.theme) == null ? void 0 : v.breakpoints, p = i ? m(i.sm) : l.sm, g = i ? m(i.md) : l.md, h = i ? m(i.lg) : l.lg, b = i ? m(i.xl) : l.xl, P = i ? m(i["2xl"]) : l["2xl"], c = x(`(min-width: ${p}px)`), d = x(`(min-width: ${g}px)`), u = x(`(min-width: ${h}px)`), f = x(`(min-width: ${b}px)`), a = x(`(min-width: ${P}px)`);
+  return $(() => {
+    const n = {};
+    for (const [o, e] of Object.entries(s)) {
       if (e == null || typeof e != "object") {
-        i[t] = e;
+        n[o] = e;
         continue;
       }
-      const n = e;
-      if (!("base" in n || "sm" in n || "md" in n || "lg" in n || "xl" in n || "2xl" in n)) {
-        i[t] = e;
+      const t = e;
+      if (!("base" in t || "sm" in t || "md" in t || "lg" in t || "xl" in t || "2xl" in t)) {
+        n[o] = e;
         continue;
       }
-      if (c && n["2xl"] !== void 0) {
-        i[t] = n["2xl"];
+      if (a && t["2xl"] !== void 0) {
+        n[o] = t["2xl"];
         continue;
       }
-      if (x && n.xl !== void 0) {
-        i[t] = n.xl;
+      if (f && t.xl !== void 0) {
+        n[o] = t.xl;
         continue;
       }
-      if (r && n.lg !== void 0) {
-        i[t] = n.lg;
+      if (u && t.lg !== void 0) {
+        n[o] = t.lg;
         continue;
       }
-      if (m && n.md !== void 0) {
-        i[t] = n.md;
+      if (d && t.md !== void 0) {
+        n[o] = t.md;
         continue;
       }
-      if (d && n.sm !== void 0) {
-        i[t] = n.sm;
+      if (c && t.sm !== void 0) {
+        n[o] = t.sm;
         continue;
       }
-      if (n.base !== void 0) {
-        i[t] = n.base;
+      if (t.base !== void 0) {
+        n[o] = t.base;
         continue;
       }
-      i[t] = e;
+      n[o] = e;
     }
-    return i;
-  }, [s, d, m, r, x, c]);
+    return n;
+  }, [s, c, d, u, f, a]);
 }
 export {
-  h as useResponsive,
-  g as useResponsiveProps
+  j as useResponsive,
+  L as useResponsiveProps
 };