@forgedevstack/bear 1.2.9 → 1.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Backdrop/Backdrop.cjs +1 -1
- package/dist/components/Backdrop/Backdrop.const.cjs +1 -1
- package/dist/components/Backdrop/Backdrop.const.d.ts +4 -1
- package/dist/components/Backdrop/Backdrop.const.js +11 -8
- package/dist/components/Backdrop/Backdrop.js +39 -36
- package/dist/components/Backdrop/Backdrop.types.d.ts +1 -0
- package/dist/components/Backdrop/index.d.ts +1 -0
- package/dist/components/Drawer/Drawer.cjs +1 -1
- package/dist/components/Drawer/Drawer.const.cjs +1 -1
- package/dist/components/Drawer/Drawer.const.d.ts +3 -0
- package/dist/components/Drawer/Drawer.const.js +14 -11
- package/dist/components/Drawer/Drawer.js +95 -82
- package/dist/components/Modal/Modal.cjs +1 -1
- package/dist/components/Modal/Modal.const.cjs +1 -1
- package/dist/components/Modal/Modal.const.d.ts +3 -1
- package/dist/components/Modal/Modal.const.js +12 -9
- package/dist/components/Modal/Modal.js +45 -41
- package/dist/components/Modal/Modal.types.d.ts +1 -0
- package/dist/components/ModalsProvider/ModalsContext.cjs +1 -0
- package/dist/components/ModalsProvider/ModalsContext.d.ts +2 -0
- package/dist/components/ModalsProvider/ModalsContext.js +5 -0
- package/dist/components/ModalsProvider/ModalsProvider.cjs +1 -0
- package/dist/components/ModalsProvider/ModalsProvider.const.cjs +1 -0
- package/dist/components/ModalsProvider/ModalsProvider.const.d.ts +39 -0
- package/dist/components/ModalsProvider/ModalsProvider.const.js +40 -0
- package/dist/components/ModalsProvider/ModalsProvider.d.ts +3 -0
- package/dist/components/ModalsProvider/ModalsProvider.js +97 -0
- package/dist/components/ModalsProvider/ModalsProvider.types.d.ts +75 -0
- package/dist/components/ModalsProvider/ModalsProvider.utils.cjs +1 -0
- package/dist/components/ModalsProvider/ModalsProvider.utils.d.ts +8 -0
- package/dist/components/ModalsProvider/ModalsProvider.utils.js +24 -0
- package/dist/components/ModalsProvider/components/ModalsHost/ModalsHost.cjs +1 -0
- package/dist/components/ModalsProvider/components/ModalsHost/ModalsHost.d.ts +2 -0
- package/dist/components/ModalsProvider/components/ModalsHost/ModalsHost.js +24 -0
- package/dist/components/ModalsProvider/components/ModalsHost/index.d.ts +1 -0
- package/dist/components/ModalsProvider/components/StackedModal/StackedModal.cjs +1 -0
- package/dist/components/ModalsProvider/components/StackedModal/StackedModal.d.ts +2 -0
- package/dist/components/ModalsProvider/components/StackedModal/StackedModal.js +66 -0
- package/dist/components/ModalsProvider/components/StackedModal/index.d.ts +1 -0
- package/dist/components/ModalsProvider/components/index.d.ts +2 -0
- package/dist/components/ModalsProvider/hooks/index.d.ts +1 -0
- package/dist/components/ModalsProvider/hooks/useModals.cjs +1 -0
- package/dist/components/ModalsProvider/hooks/useModals.d.ts +2 -0
- package/dist/components/ModalsProvider/hooks/useModals.js +12 -0
- package/dist/components/ModalsProvider/index.d.ts +3 -0
- package/dist/components/SignPad/SignPad.cjs +1 -1
- package/dist/components/SignPad/SignPad.const.cjs +1 -1
- package/dist/components/SignPad/SignPad.const.d.ts +13 -2
- package/dist/components/SignPad/SignPad.const.js +22 -13
- package/dist/components/SignPad/SignPad.js +127 -121
- package/dist/components/SignPad/SignPad.types.d.ts +2 -1
- package/dist/components/SignPad/SignPad.utils.cjs +1 -0
- package/dist/components/SignPad/SignPad.utils.d.ts +34 -0
- package/dist/components/SignPad/SignPad.utils.js +42 -0
- package/dist/components/Snackbar/Snackbar.cjs +1 -1
- package/dist/components/Snackbar/Snackbar.const.cjs +1 -1
- package/dist/components/Snackbar/Snackbar.const.d.ts +7 -1
- package/dist/components/Snackbar/Snackbar.const.js +21 -11
- package/dist/components/Snackbar/Snackbar.js +60 -59
- package/dist/components/Toast/Toast.cjs +1 -1
- package/dist/components/Toast/Toast.const.cjs +1 -1
- package/dist/components/Toast/Toast.const.d.ts +4 -1
- package/dist/components/Toast/Toast.const.js +20 -5
- package/dist/components/Toast/Toast.js +97 -110
- package/dist/components/index.cjs +1 -1
- package/dist/components/index.d.ts +2 -0
- package/dist/components/index.js +389 -385
- package/dist/index.cjs +1 -1
- package/dist/index.js +504 -500
- package/dist/styles/_feedback.css +130 -0
- package/dist/styles/_overlays.css +24 -0
- package/dist/styles/main.css +2 -0
- package/dist/styles.css +165 -5
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),e=require("./Backdrop.const.cjs"),R=require("../../utils/cn.cjs");require("react");const E=require("../../utils/generateBearId.utils.cjs"),P=require("../../utils/useBearId.cjs"),L=s=>{const{id:S,testId:_,open:r=!0,invisible:d=!1,blur:i=!1,nested:t=!1,zIndex:o,transitionDuration:a=e.BACKDROP_DEFAULT_TRANSITION_MS,keepMounted:A=!1,onClick:B,children:n,className:c,style:I,...O}=s,C=P.useBearId("Backdrop"),D=E.resolveBearId(S,C),u=o??(t?e.BACKDROP_NESTED_Z_INDEX:e.BACKDROP_DEFAULT_Z_INDEX);return!r&&!A&&!n?null:l.jsx("div",{...O,id:D,"data-testid":_,"aria-hidden":!r,onClick:B,className:R.cn(e.BACKDROP_ROOT_CLASS,t?e.BACKDROP_POSITION_ABSOLUTE_CLASS:e.BACKDROP_POSITION_FIXED_CLASS,e.BACKDROP_BASE_CLASSES,r?e.BACKDROP_VISIBLE_CLASSES:e.BACKDROP_HIDDEN_CLASSES,!d&&e.BACKDROP_TINT_CLASSES,i&&e.BACKDROP_BLUR_CLASSES,t&&`${e.BACKDROP_ROOT_CLASS}--nested`,c),style:{zIndex:u,transitionDuration:`${a}ms`,...I},children:n})};exports.Backdrop=L;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S="Bear-Backdrop",
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S="Bear-Backdrop",_=11e3,A=0,e=200,O="bear-inset-0 bear-flex bear-items-center bear-justify-center bear-transition-opacity",C="bear-fixed",D="bear-absolute",t="bear-opacity-100 bear-pointer-events-auto",B="bear-opacity-0 bear-pointer-events-none",E="bear-bg-black/50 dark:bear-bg-black/60",a="bear-backdrop-blur-sm";exports.BACKDROP_BASE_CLASSES=O;exports.BACKDROP_BLUR_CLASSES=a;exports.BACKDROP_DEFAULT_TRANSITION_MS=e;exports.BACKDROP_DEFAULT_Z_INDEX=_;exports.BACKDROP_HIDDEN_CLASSES=B;exports.BACKDROP_NESTED_Z_INDEX=A;exports.BACKDROP_POSITION_ABSOLUTE_CLASS=D;exports.BACKDROP_POSITION_FIXED_CLASS=C;exports.BACKDROP_ROOT_CLASS=S;exports.BACKDROP_TINT_CLASSES=E;exports.BACKDROP_VISIBLE_CLASSES=t;
|
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
export declare const BACKDROP_ROOT_CLASS = "Bear-Backdrop";
|
|
2
2
|
export declare const BACKDROP_DEFAULT_Z_INDEX = 11000;
|
|
3
|
+
export declare const BACKDROP_NESTED_Z_INDEX = 0;
|
|
3
4
|
export declare const BACKDROP_DEFAULT_TRANSITION_MS = 200;
|
|
4
|
-
export declare const BACKDROP_BASE_CLASSES = "bear-
|
|
5
|
+
export declare const BACKDROP_BASE_CLASSES = "bear-inset-0 bear-flex bear-items-center bear-justify-center bear-transition-opacity";
|
|
6
|
+
export declare const BACKDROP_POSITION_FIXED_CLASS = "bear-fixed";
|
|
7
|
+
export declare const BACKDROP_POSITION_ABSOLUTE_CLASS = "bear-absolute";
|
|
5
8
|
export declare const BACKDROP_VISIBLE_CLASSES = "bear-opacity-100 bear-pointer-events-auto";
|
|
6
9
|
export declare const BACKDROP_HIDDEN_CLASSES = "bear-opacity-0 bear-pointer-events-none";
|
|
7
10
|
export declare const BACKDROP_TINT_CLASSES = "bear-bg-black/50 dark:bear-bg-black/60";
|
|
@@ -1,11 +1,14 @@
|
|
|
1
|
-
const e = "Bear-Backdrop",
|
|
1
|
+
const e = "Bear-Backdrop", S = 11e3, t = 0, _ = 200, a = "bear-inset-0 bear-flex bear-items-center bear-justify-center bear-transition-opacity", r = "bear-fixed", A = "bear-absolute", o = "bear-opacity-100 bear-pointer-events-auto", n = "bear-opacity-0 bear-pointer-events-none", b = "bear-bg-black/50 dark:bear-bg-black/60", c = "bear-backdrop-blur-sm";
|
|
2
2
|
export {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
3
|
+
a as BACKDROP_BASE_CLASSES,
|
|
4
|
+
c as BACKDROP_BLUR_CLASSES,
|
|
5
|
+
_ as BACKDROP_DEFAULT_TRANSITION_MS,
|
|
6
|
+
S as BACKDROP_DEFAULT_Z_INDEX,
|
|
7
|
+
n as BACKDROP_HIDDEN_CLASSES,
|
|
8
|
+
t as BACKDROP_NESTED_Z_INDEX,
|
|
9
|
+
A as BACKDROP_POSITION_ABSOLUTE_CLASS,
|
|
10
|
+
r as BACKDROP_POSITION_FIXED_CLASS,
|
|
8
11
|
e as BACKDROP_ROOT_CLASS,
|
|
9
|
-
|
|
10
|
-
|
|
12
|
+
b as BACKDROP_TINT_CLASSES,
|
|
13
|
+
o as BACKDROP_VISIBLE_CLASSES
|
|
11
14
|
};
|
|
@@ -1,50 +1,53 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { BACKDROP_DEFAULT_Z_INDEX as
|
|
3
|
-
import { cn as
|
|
1
|
+
import { jsx as m } from "react/jsx-runtime";
|
|
2
|
+
import { BACKDROP_DEFAULT_TRANSITION_MS as P, BACKDROP_NESTED_Z_INDEX as R, BACKDROP_DEFAULT_Z_INDEX as L, BACKDROP_ROOT_CLASS as o, BACKDROP_BLUR_CLASSES as c, BACKDROP_TINT_CLASSES as p, BACKDROP_VISIBLE_CLASSES as K, BACKDROP_HIDDEN_CLASSES as N, BACKDROP_BASE_CLASSES as T, BACKDROP_POSITION_ABSOLUTE_CLASS as f, BACKDROP_POSITION_FIXED_CLASS as u } from "./Backdrop.const.js";
|
|
3
|
+
import { cn as x } from "../../utils/cn.js";
|
|
4
4
|
import "react";
|
|
5
|
-
import { resolveBearId as
|
|
6
|
-
import { useBearId as
|
|
7
|
-
const
|
|
5
|
+
import { resolveBearId as k } from "../../utils/generateBearId.utils.js";
|
|
6
|
+
import { useBearId as U } from "../../utils/useBearId.js";
|
|
7
|
+
const y = (S) => {
|
|
8
8
|
const {
|
|
9
|
-
id:
|
|
10
|
-
testId:
|
|
11
|
-
open:
|
|
12
|
-
invisible:
|
|
13
|
-
blur:
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
9
|
+
id: n,
|
|
10
|
+
testId: s,
|
|
11
|
+
open: e = !0,
|
|
12
|
+
invisible: _ = !1,
|
|
13
|
+
blur: i = !1,
|
|
14
|
+
nested: t = !1,
|
|
15
|
+
zIndex: A,
|
|
16
|
+
transitionDuration: d = P,
|
|
17
|
+
keepMounted: a = !1,
|
|
18
|
+
onClick: D,
|
|
19
|
+
children: r,
|
|
20
|
+
className: I,
|
|
21
|
+
style: C,
|
|
21
22
|
...B
|
|
22
|
-
} =
|
|
23
|
-
return !
|
|
23
|
+
} = S, O = U("Backdrop"), E = k(n, O), l = A ?? (t ? R : L);
|
|
24
|
+
return !e && !a && !r ? null : /* @__PURE__ */ m(
|
|
24
25
|
"div",
|
|
25
26
|
{
|
|
26
27
|
...B,
|
|
27
|
-
id:
|
|
28
|
-
"data-testid":
|
|
29
|
-
"aria-hidden": !
|
|
30
|
-
onClick:
|
|
31
|
-
className:
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
28
|
+
id: E,
|
|
29
|
+
"data-testid": s,
|
|
30
|
+
"aria-hidden": !e,
|
|
31
|
+
onClick: D,
|
|
32
|
+
className: x(
|
|
33
|
+
o,
|
|
34
|
+
t ? f : u,
|
|
35
|
+
T,
|
|
36
|
+
e ? K : N,
|
|
37
|
+
!_ && p,
|
|
38
|
+
i && c,
|
|
39
|
+
t && `${o}--nested`,
|
|
40
|
+
I
|
|
38
41
|
),
|
|
39
42
|
style: {
|
|
40
|
-
zIndex:
|
|
41
|
-
transitionDuration: `${
|
|
42
|
-
...
|
|
43
|
+
zIndex: l,
|
|
44
|
+
transitionDuration: `${d}ms`,
|
|
45
|
+
...C
|
|
43
46
|
},
|
|
44
|
-
children:
|
|
47
|
+
children: r
|
|
45
48
|
}
|
|
46
49
|
);
|
|
47
50
|
};
|
|
48
51
|
export {
|
|
49
|
-
|
|
52
|
+
y as Backdrop
|
|
50
53
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),a=require("react"),M=require("react-dom"),O=require("../../context/BearProvider.cjs"),q=require("../../utils/cn.cjs"),j=require("../../utils/generateBearId.utils.cjs"),B=require("../../utils/useBearId.cjs"),T=require("../Icon/index.cjs"),L=require("../Backdrop/Backdrop.cjs"),e=require("./Drawer.const.cjs"),C=require("./Drawer.utils.cjs"),P=({isOpen:u,onClose:o,title:i,children:I,side:h="right",anchor:k,variant:W="temporary",size:D="md",showCloseButton:m=!0,closeOnBackdrop:A=!0,closeOnEscape:f=!0,className:N,container:R,id:w,testId:g})=>{const y=B.useBearId("Drawer"),c=j.resolveBearId(w,y),{direction:x}=O.useBearDirectionOptional(),l=k??h,n=x==="rtl"&&(l==="left"||l==="right")?l==="left"?"right":"left":l,[s,_]=a.useState(u),[S,b]=a.useState(!1),[v,E]=a.useState(!1);a.useEffect(()=>{if(u){_(!0),b(!1);const t=requestAnimationFrame(()=>E(!0));return()=>cancelAnimationFrame(t)}if(s){E(!1),b(!0);const t=setTimeout(()=>{_(!1),b(!1)},e.DRAWER_ANIMATION_MS);return()=>clearTimeout(t)}},[u,s]);const d=a.useCallback(t=>{f&&t.key==="Escape"&&o()},[f,o]);if(a.useEffect(()=>{if(s){document.addEventListener("keydown",d);const t=C.lockBodyScroll();return()=>{document.removeEventListener("keydown",d),t()}}return()=>{document.removeEventListener("keydown",d)}},[s,d]),!s)return null;const p=r.jsxs("div",{id:c,"data-testid":g,className:e.DRAWER_ROOT_CLASSES,style:{zIndex:e.DRAWER_Z_INDEX},children:[r.jsx(L.Backdrop,{open:v&&!S,keepMounted:!0,blur:!0,nested:!0,transitionDuration:e.DRAWER_ANIMATION_MS,className:"Bear-Drawer__backdrop",onClick:A?()=>o():void 0}),r.jsxs("div",{role:"dialog","aria-modal":"true","aria-labelledby":i?`${c}-title`:void 0,className:q.cn("Bear-Drawer__panel","bear-absolute bear-bg-white dark:bear-bg-neutral-900 bear-shadow-2xl","bear-border-neutral-200 dark:bear-border-neutral-700","bear-flex bear-flex-col bear-overflow-hidden","bear-transform bear-transition-transform",e.BORDER_SIDE_MAP[n],e.POSITION_CLASSES[n],e.SIZE_CLASSES[n][D],v&&!S?e.TRANSFORM_OPEN[n]:e.TRANSFORM_CLOSED[n],N),style:{transitionDuration:`${e.DRAWER_ANIMATION_MS}ms`,zIndex:e.DRAWER_PANEL_Z_INDEX},children:[(i||m)&&r.jsxs("div",{className:"bear-flex bear-items-center bear-justify-between bear-px-4 bear-py-3 bear-border-b bear-border-neutral-200 dark:bear-border-neutral-700 bear-shrink-0",dir:x,children:[i&&r.jsx("h2",{id:`${c}-title`,className:"bear-text-lg bear-font-semibold bear-text-neutral-900 dark:bear-text-white",children:i}),m&&r.jsx("button",{onClick:o,className:"bear-p-1 bear-rounded-lg bear-text-neutral-500 dark:bear-text-neutral-400 hover:bear-text-neutral-900 dark:hover:bear-text-white hover:bear-bg-neutral-100 dark:hover:bear-bg-neutral-700 bear-transition-colors","aria-label":"Close drawer",children:r.jsx(T.XIcon,{className:"bear-w-5 bear-h-5"})})]}),r.jsx("div",{className:"bear-flex-1 bear-min-h-0 bear-overflow-y-auto bear-overscroll-contain bear-p-4 bear-text-neutral-700 dark:bear-text-neutral-300",children:I})]})]});return M.createPortal(p,R??document.body)};exports.Drawer=P;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=300,a={left:{sm:"bear-w-full sm:bear-w-64 bear-max-w-full sm:bear-max-w-none",md:"bear-w-full sm:bear-w-80 bear-max-w-full sm:bear-max-w-none",lg:"bear-w-full sm:bear-w-96 bear-max-w-full sm:bear-max-w-none",xl:"bear-w-full sm:bear-w-[32rem] bear-max-w-full sm:bear-max-w-none"},right:{sm:"bear-w-full sm:bear-w-64 bear-max-w-full sm:bear-max-w-none",md:"bear-w-full sm:bear-w-80 bear-max-w-full sm:bear-max-w-none",lg:"bear-w-full sm:bear-w-96 bear-max-w-full sm:bear-max-w-none",xl:"bear-w-full sm:bear-w-[32rem] bear-max-w-full sm:bear-max-w-none"},top:{sm:"bear-h-32",md:"bear-h-48",lg:"bear-h-64",xl:"bear-h-96"},bottom:{sm:"bear-h-32",md:"bear-h-48",lg:"bear-h-64",xl:"bear-h-96"}},
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=300,a=11e3,r=1,b="Bear-Drawer bear-fixed bear-inset-0",l={left:{sm:"bear-w-full sm:bear-w-64 bear-max-w-full sm:bear-max-w-none",md:"bear-w-full sm:bear-w-80 bear-max-w-full sm:bear-max-w-none",lg:"bear-w-full sm:bear-w-96 bear-max-w-full sm:bear-max-w-none",xl:"bear-w-full sm:bear-w-[32rem] bear-max-w-full sm:bear-max-w-none"},right:{sm:"bear-w-full sm:bear-w-64 bear-max-w-full sm:bear-max-w-none",md:"bear-w-full sm:bear-w-80 bear-max-w-full sm:bear-max-w-none",lg:"bear-w-full sm:bear-w-96 bear-max-w-full sm:bear-max-w-none",xl:"bear-w-full sm:bear-w-[32rem] bear-max-w-full sm:bear-max-w-none"},top:{sm:"bear-h-32",md:"bear-h-48",lg:"bear-h-64",xl:"bear-h-96"},bottom:{sm:"bear-h-32",md:"bear-h-48",lg:"bear-h-64",xl:"bear-h-96"}},t={left:"bear-left-0 bear-top-0 bear-h-full",right:"bear-right-0 bear-top-0 bear-h-full",top:"bear-top-0 bear-left-0 bear-w-full",bottom:"bear-bottom-0 bear-left-0 bear-w-full"},m={left:"bear-translate-x-0",right:"bear-translate-x-0",top:"bear-translate-y-0",bottom:"bear-translate-y-0"},o={left:"-bear-translate-x-full",right:"bear-translate-x-full",top:"-bear-translate-y-full",bottom:"bear-translate-y-full"},s={left:"bear-border-r",right:"bear-border-l",top:"bear-border-b",bottom:"bear-border-t"};exports.BORDER_SIDE_MAP=s;exports.DRAWER_ANIMATION_MS=e;exports.DRAWER_PANEL_Z_INDEX=r;exports.DRAWER_ROOT_CLASSES=b;exports.DRAWER_Z_INDEX=a;exports.POSITION_CLASSES=t;exports.SIZE_CLASSES=l;exports.TRANSFORM_CLOSED=o;exports.TRANSFORM_OPEN=m;
|
|
@@ -2,6 +2,9 @@ import { DrawerProps } from './Drawer.types';
|
|
|
2
2
|
type DrawerSide = NonNullable<DrawerProps['side']>;
|
|
3
3
|
type DrawerSize = NonNullable<DrawerProps['size']>;
|
|
4
4
|
export declare const DRAWER_ANIMATION_MS = 300;
|
|
5
|
+
export declare const DRAWER_Z_INDEX = 11000;
|
|
6
|
+
export declare const DRAWER_PANEL_Z_INDEX = 1;
|
|
7
|
+
export declare const DRAWER_ROOT_CLASSES = "Bear-Drawer bear-fixed bear-inset-0";
|
|
5
8
|
export declare const SIZE_CLASSES: Record<DrawerSide, Record<DrawerSize, string>>;
|
|
6
9
|
export declare const POSITION_CLASSES: Record<DrawerSide, string>;
|
|
7
10
|
export declare const TRANSFORM_OPEN: Record<DrawerSide, string>;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const
|
|
1
|
+
const e = 300, a = 11e3, r = 1, b = "Bear-Drawer bear-fixed bear-inset-0", l = {
|
|
2
2
|
left: {
|
|
3
3
|
sm: "bear-w-full sm:bear-w-64 bear-max-w-full sm:bear-max-w-none",
|
|
4
4
|
md: "bear-w-full sm:bear-w-80 bear-max-w-full sm:bear-max-w-none",
|
|
@@ -23,32 +23,35 @@ const a = 300, e = {
|
|
|
23
23
|
lg: "bear-h-64",
|
|
24
24
|
xl: "bear-h-96"
|
|
25
25
|
}
|
|
26
|
-
},
|
|
26
|
+
}, t = {
|
|
27
27
|
left: "bear-left-0 bear-top-0 bear-h-full",
|
|
28
28
|
right: "bear-right-0 bear-top-0 bear-h-full",
|
|
29
29
|
top: "bear-top-0 bear-left-0 bear-w-full",
|
|
30
30
|
bottom: "bear-bottom-0 bear-left-0 bear-w-full"
|
|
31
|
-
},
|
|
31
|
+
}, m = {
|
|
32
32
|
left: "bear-translate-x-0",
|
|
33
33
|
right: "bear-translate-x-0",
|
|
34
34
|
top: "bear-translate-y-0",
|
|
35
35
|
bottom: "bear-translate-y-0"
|
|
36
|
-
},
|
|
36
|
+
}, o = {
|
|
37
37
|
left: "-bear-translate-x-full",
|
|
38
38
|
right: "bear-translate-x-full",
|
|
39
39
|
top: "-bear-translate-y-full",
|
|
40
40
|
bottom: "bear-translate-y-full"
|
|
41
|
-
},
|
|
41
|
+
}, s = {
|
|
42
42
|
left: "bear-border-r",
|
|
43
43
|
right: "bear-border-l",
|
|
44
44
|
top: "bear-border-b",
|
|
45
45
|
bottom: "bear-border-t"
|
|
46
46
|
};
|
|
47
47
|
export {
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
r as
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
48
|
+
s as BORDER_SIDE_MAP,
|
|
49
|
+
e as DRAWER_ANIMATION_MS,
|
|
50
|
+
r as DRAWER_PANEL_Z_INDEX,
|
|
51
|
+
b as DRAWER_ROOT_CLASSES,
|
|
52
|
+
a as DRAWER_Z_INDEX,
|
|
53
|
+
t as POSITION_CLASSES,
|
|
54
|
+
l as SIZE_CLASSES,
|
|
55
|
+
o as TRANSFORM_CLOSED,
|
|
56
|
+
m as TRANSFORM_OPEN
|
|
54
57
|
};
|
|
@@ -1,47 +1,47 @@
|
|
|
1
1
|
import { jsxs as c, jsx as t } from "react/jsx-runtime";
|
|
2
|
-
import { useState as
|
|
3
|
-
import { createPortal as
|
|
4
|
-
import { useBearDirectionOptional as
|
|
2
|
+
import { useState as u, useEffect as S, useCallback as M } from "react";
|
|
3
|
+
import { createPortal as B } from "react-dom";
|
|
4
|
+
import { useBearDirectionOptional as C } from "../../context/BearProvider.js";
|
|
5
5
|
import { cn as T } from "../../utils/cn.js";
|
|
6
|
-
import { resolveBearId as
|
|
7
|
-
import { useBearId as
|
|
8
|
-
import { XIcon as
|
|
9
|
-
import { Backdrop as
|
|
10
|
-
import { DRAWER_ANIMATION_MS as
|
|
11
|
-
import { lockBodyScroll as
|
|
12
|
-
const
|
|
6
|
+
import { resolveBearId as P } from "../../utils/generateBearId.utils.js";
|
|
7
|
+
import { useBearId as F } from "../../utils/useBearId.js";
|
|
8
|
+
import { XIcon as W } from "../Icon/index.js";
|
|
9
|
+
import { Backdrop as j } from "../Backdrop/Backdrop.js";
|
|
10
|
+
import { DRAWER_ANIMATION_MS as m, DRAWER_Z_INDEX as X, DRAWER_ROOT_CLASSES as Z, DRAWER_PANEL_Z_INDEX as $, TRANSFORM_OPEN as z, TRANSFORM_CLOSED as q, SIZE_CLASSES as H, POSITION_CLASSES as G, BORDER_SIDE_MAP as J } from "./Drawer.const.js";
|
|
11
|
+
import { lockBodyScroll as K } from "./Drawer.utils.js";
|
|
12
|
+
const se = ({
|
|
13
13
|
isOpen: s,
|
|
14
14
|
onClose: o,
|
|
15
15
|
title: n,
|
|
16
|
-
children:
|
|
17
|
-
side:
|
|
18
|
-
anchor:
|
|
19
|
-
variant:
|
|
20
|
-
size:
|
|
16
|
+
children: _,
|
|
17
|
+
side: w = "right",
|
|
18
|
+
anchor: I,
|
|
19
|
+
variant: Q = "temporary",
|
|
20
|
+
size: N = "md",
|
|
21
21
|
showCloseButton: f = !0,
|
|
22
|
-
closeOnBackdrop:
|
|
22
|
+
closeOnBackdrop: D = !0,
|
|
23
23
|
closeOnEscape: p = !0,
|
|
24
|
-
className:
|
|
25
|
-
container:
|
|
26
|
-
id:
|
|
27
|
-
testId:
|
|
24
|
+
className: A,
|
|
25
|
+
container: R,
|
|
26
|
+
id: g,
|
|
27
|
+
testId: y
|
|
28
28
|
}) => {
|
|
29
|
-
const
|
|
29
|
+
const O = F("Drawer"), d = P(g, O), { direction: h } = C(), i = I ?? w, r = h === "rtl" && (i === "left" || i === "right") ? i === "left" ? "right" : "left" : i, [a, v] = u(s), [k, b] = u(!1), [x, E] = u(!1);
|
|
30
30
|
S(() => {
|
|
31
31
|
if (s) {
|
|
32
32
|
v(!0), b(!1);
|
|
33
|
-
const e = requestAnimationFrame(() =>
|
|
33
|
+
const e = requestAnimationFrame(() => E(!0));
|
|
34
34
|
return () => cancelAnimationFrame(e);
|
|
35
35
|
}
|
|
36
36
|
if (a) {
|
|
37
|
-
|
|
37
|
+
E(!1), b(!0);
|
|
38
38
|
const e = setTimeout(() => {
|
|
39
39
|
v(!1), b(!1);
|
|
40
|
-
},
|
|
40
|
+
}, m);
|
|
41
41
|
return () => clearTimeout(e);
|
|
42
42
|
}
|
|
43
43
|
}, [s, a]);
|
|
44
|
-
const l =
|
|
44
|
+
const l = M(
|
|
45
45
|
(e) => {
|
|
46
46
|
p && e.key === "Escape" && o();
|
|
47
47
|
},
|
|
@@ -50,7 +50,7 @@ const ne = ({
|
|
|
50
50
|
if (S(() => {
|
|
51
51
|
if (a) {
|
|
52
52
|
document.addEventListener("keydown", l);
|
|
53
|
-
const e =
|
|
53
|
+
const e = K();
|
|
54
54
|
return () => {
|
|
55
55
|
document.removeEventListener("keydown", l), e();
|
|
56
56
|
};
|
|
@@ -59,64 +59,77 @@ const ne = ({
|
|
|
59
59
|
document.removeEventListener("keydown", l);
|
|
60
60
|
};
|
|
61
61
|
}, [a, l]), !a) return null;
|
|
62
|
-
const
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
"Bear-Drawer__panel",
|
|
82
|
-
"bear-absolute bear-bg-white dark:bear-bg-neutral-900 bear-shadow-2xl",
|
|
83
|
-
"bear-border-neutral-200 dark:bear-border-neutral-700",
|
|
84
|
-
"bear-flex bear-flex-col bear-overflow-hidden",
|
|
85
|
-
"bear-transform bear-transition-transform",
|
|
86
|
-
X[r],
|
|
87
|
-
W[r],
|
|
88
|
-
H[r][I],
|
|
89
|
-
x && !k ? q[r] : z[r],
|
|
90
|
-
y
|
|
62
|
+
const L = /* @__PURE__ */ c(
|
|
63
|
+
"div",
|
|
64
|
+
{
|
|
65
|
+
id: d,
|
|
66
|
+
"data-testid": y,
|
|
67
|
+
className: Z,
|
|
68
|
+
style: { zIndex: X },
|
|
69
|
+
children: [
|
|
70
|
+
/* @__PURE__ */ t(
|
|
71
|
+
j,
|
|
72
|
+
{
|
|
73
|
+
open: x && !k,
|
|
74
|
+
keepMounted: !0,
|
|
75
|
+
blur: !0,
|
|
76
|
+
nested: !0,
|
|
77
|
+
transitionDuration: m,
|
|
78
|
+
className: "Bear-Drawer__backdrop",
|
|
79
|
+
onClick: D ? () => o() : void 0
|
|
80
|
+
}
|
|
91
81
|
),
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
82
|
+
/* @__PURE__ */ c(
|
|
83
|
+
"div",
|
|
84
|
+
{
|
|
85
|
+
role: "dialog",
|
|
86
|
+
"aria-modal": "true",
|
|
87
|
+
"aria-labelledby": n ? `${d}-title` : void 0,
|
|
88
|
+
className: T(
|
|
89
|
+
"Bear-Drawer__panel",
|
|
90
|
+
"bear-absolute bear-bg-white dark:bear-bg-neutral-900 bear-shadow-2xl",
|
|
91
|
+
"bear-border-neutral-200 dark:bear-border-neutral-700",
|
|
92
|
+
"bear-flex bear-flex-col bear-overflow-hidden",
|
|
93
|
+
"bear-transform bear-transition-transform",
|
|
94
|
+
J[r],
|
|
95
|
+
G[r],
|
|
96
|
+
H[r][N],
|
|
97
|
+
x && !k ? z[r] : q[r],
|
|
98
|
+
A
|
|
102
99
|
),
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
100
|
+
style: {
|
|
101
|
+
transitionDuration: `${m}ms`,
|
|
102
|
+
zIndex: $
|
|
103
|
+
},
|
|
104
|
+
children: [
|
|
105
|
+
(n || f) && /* @__PURE__ */ c("div", { className: "bear-flex bear-items-center bear-justify-between bear-px-4 bear-py-3 bear-border-b bear-border-neutral-200 dark:bear-border-neutral-700 bear-shrink-0", dir: h, children: [
|
|
106
|
+
n && /* @__PURE__ */ t(
|
|
107
|
+
"h2",
|
|
108
|
+
{
|
|
109
|
+
id: `${d}-title`,
|
|
110
|
+
className: "bear-text-lg bear-font-semibold bear-text-neutral-900 dark:bear-text-white",
|
|
111
|
+
children: n
|
|
112
|
+
}
|
|
113
|
+
),
|
|
114
|
+
f && /* @__PURE__ */ t(
|
|
115
|
+
"button",
|
|
116
|
+
{
|
|
117
|
+
onClick: o,
|
|
118
|
+
className: "bear-p-1 bear-rounded-lg bear-text-neutral-500 dark:bear-text-neutral-400 hover:bear-text-neutral-900 dark:hover:bear-text-white hover:bear-bg-neutral-100 dark:hover:bear-bg-neutral-700 bear-transition-colors",
|
|
119
|
+
"aria-label": "Close drawer",
|
|
120
|
+
children: /* @__PURE__ */ t(W, { className: "bear-w-5 bear-h-5" })
|
|
121
|
+
}
|
|
122
|
+
)
|
|
123
|
+
] }),
|
|
124
|
+
/* @__PURE__ */ t("div", { className: "bear-flex-1 bear-min-h-0 bear-overflow-y-auto bear-overscroll-contain bear-p-4 bear-text-neutral-700 dark:bear-text-neutral-300", children: _ })
|
|
125
|
+
]
|
|
126
|
+
}
|
|
127
|
+
)
|
|
128
|
+
]
|
|
129
|
+
}
|
|
130
|
+
);
|
|
131
|
+
return B(L, R ?? document.body);
|
|
119
132
|
};
|
|
120
133
|
export {
|
|
121
|
-
|
|
134
|
+
se as Drawer
|
|
122
135
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),E=require("react"),x=require("react-dom"),a=require("../../utils/cn.cjs"),j=require("../../utils/generateBearId.utils.cjs"),q=require("../../utils/useBearId.cjs"),g=require("../Icon/icons/navigation.cjs"),w=require("../Backdrop/Backdrop.cjs"),e=require("./Modal.const.cjs"),R=m=>{const{isOpen:s,onClose:l,title:r,children:L,size:M="md",showCloseButton:d=!0,closeOnEscape:A=!0,disableEscapeKeyDown:B=!1,lockBodyScroll:C=!0,cancelPreventScroll:O=!1,closeOnBackdrop:k=!0,hideBackdrop:b=!1,keepMounted:n=!1,isCancelBackgroundClick:i,zIndex:v=e.MODAL_Z_INDEX,className:y,footer:u,testId:D,id:f}=m,h=q.useBearId("Modal"),c=j.resolveBearId(f,h),_=C&&!O,p=i!==void 0?i:k,S=A&&!B,t=E.useCallback(N=>{S&&N.key==="Escape"&&l()},[S,l]);if(E.useEffect(()=>{if(s)return document.addEventListener("keydown",t),_&&(document.body.style.overflow="hidden"),()=>{document.removeEventListener("keydown",t),document.body.style.overflow=""}},[s,t,_]),!s&&!n)return null;const I=o.jsxs("div",{className:e.MODAL_ROOT_CLASSES,"data-testid":D,id:c,style:{zIndex:v},children:[!b&&o.jsx(w.Backdrop,{open:s,keepMounted:n,blur:!0,nested:!0,className:"Bear-Modal__backdrop",onClick:p?()=>l():void 0}),o.jsxs("div",{role:"dialog","aria-modal":"true","aria-labelledby":r?`${c}-title`:void 0,className:a.cn("Bear-Modal__container",e.MODAL_CONTAINER_CLASSES,e.MODAL_SIZE_CLASSES[M],y),style:{zIndex:e.MODAL_PANEL_Z_INDEX},children:[(r||d)&&o.jsxs("div",{className:a.cn("Bear-Modal__header",e.MODAL_HEADER_CLASSES),children:[r&&o.jsx("h2",{id:`${c}-title`,className:a.cn("Bear-Modal__title",e.MODAL_TITLE_CLASSES),children:r}),d&&o.jsx("button",{onClick:l,className:a.cn("Bear-Modal__close",e.MODAL_CLOSE_CLASSES),"aria-label":"Close modal",children:o.jsx(g.CloseIcon,{className:"bear-w-5 bear-h-5"})})]}),o.jsx("div",{className:a.cn("Bear-Modal__body",e.MODAL_BODY_CLASSES),children:L}),u&&o.jsx("div",{className:a.cn("Bear-Modal__footer",e.MODAL_FOOTER_CLASSES),children:u})]})]});return x.createPortal(I,document.body)};exports.Modal=R;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r={sm:"bear-max-w-sm",md:"bear-max-w-md",lg:"bear-max-w-lg",xl:"bear-max-w-xl",full:"bear-max-w-full bear-mx-4"},
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=11e3,r=1,a="Bear-Modal bear-fixed bear-inset-0 bear-flex bear-items-center bear-justify-center bear-p-4",b={sm:"bear-max-w-sm",md:"bear-max-w-md",lg:"bear-max-w-lg",xl:"bear-max-w-xl",full:"bear-max-w-full bear-mx-4"},t="bear-relative bear-w-full bear-max-h-[calc(100vh-2rem)] bear-overflow-y-auto bear-bg-white dark:bear-bg-zinc-900 bear-rounded-xl bear-shadow-2xl bear-border bear-border-gray-200 dark:bear-border-zinc-700 bear-transform bear-transition-all bear-animate-in bear-fade-in bear-zoom-in-95",S="bear-flex bear-items-center bear-justify-between bear-px-6 bear-py-4 bear-border-b bear-border-gray-200 dark:bear-border-zinc-700",o="bear-text-lg bear-font-semibold bear-text-gray-900 dark:bear-text-white",A="bear-p-1 bear-rounded-lg bear-text-gray-400 dark:bear-text-zinc-500 hover:bear-text-gray-600 dark:hover:bear-text-white hover:bear-bg-gray-100 dark:hover:bear-bg-zinc-700 bear-transition-colors",L="bear-px-6 bear-py-4 bear-text-gray-600 dark:bear-text-gray-300",_="bear-flex bear-items-center bear-justify-end bear-gap-3 bear-px-6 bear-py-4 bear-border-t bear-border-gray-200 dark:bear-border-zinc-700";exports.MODAL_BODY_CLASSES=L;exports.MODAL_CLOSE_CLASSES=A;exports.MODAL_CONTAINER_CLASSES=t;exports.MODAL_FOOTER_CLASSES=_;exports.MODAL_HEADER_CLASSES=S;exports.MODAL_PANEL_Z_INDEX=r;exports.MODAL_ROOT_CLASSES=a;exports.MODAL_SIZE_CLASSES=b;exports.MODAL_TITLE_CLASSES=o;exports.MODAL_Z_INDEX=e;
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import { ModalSize } from './Modal.types';
|
|
2
|
-
export declare const MODAL_Z_INDEX =
|
|
2
|
+
export declare const MODAL_Z_INDEX = 11000;
|
|
3
|
+
export declare const MODAL_PANEL_Z_INDEX = 1;
|
|
4
|
+
export declare const MODAL_ROOT_CLASSES = "Bear-Modal bear-fixed bear-inset-0 bear-flex bear-items-center bear-justify-center bear-p-4";
|
|
3
5
|
export declare const MODAL_SIZE_CLASSES: Record<ModalSize, string>;
|
|
4
6
|
export declare const MODAL_BACKDROP_CLASSES = "bear-absolute bear-inset-0 bear-bg-black/60 bear-backdrop-blur-sm bear-transition-opacity";
|
|
5
7
|
export declare const MODAL_CONTAINER_CLASSES = "bear-relative bear-w-full bear-max-h-[calc(100vh-2rem)] bear-overflow-y-auto bear-bg-white dark:bear-bg-zinc-900 bear-rounded-xl bear-shadow-2xl bear-border bear-border-gray-200 dark:bear-border-zinc-700 bear-transform bear-transition-all bear-animate-in bear-fade-in bear-zoom-in-95";
|
|
@@ -1,16 +1,19 @@
|
|
|
1
|
-
const r = {
|
|
1
|
+
const e = 11e3, r = 1, a = "Bear-Modal bear-fixed bear-inset-0 bear-flex bear-items-center bear-justify-center bear-p-4", b = {
|
|
2
2
|
sm: "bear-max-w-sm",
|
|
3
3
|
md: "bear-max-w-md",
|
|
4
4
|
lg: "bear-max-w-lg",
|
|
5
5
|
xl: "bear-max-w-xl",
|
|
6
6
|
full: "bear-max-w-full bear-mx-4"
|
|
7
|
-
},
|
|
7
|
+
}, t = "bear-relative bear-w-full bear-max-h-[calc(100vh-2rem)] bear-overflow-y-auto bear-bg-white dark:bear-bg-zinc-900 bear-rounded-xl bear-shadow-2xl bear-border bear-border-gray-200 dark:bear-border-zinc-700 bear-transform bear-transition-all bear-animate-in bear-fade-in bear-zoom-in-95", o = "bear-flex bear-items-center bear-justify-between bear-px-6 bear-py-4 bear-border-b bear-border-gray-200 dark:bear-border-zinc-700", n = "bear-text-lg bear-font-semibold bear-text-gray-900 dark:bear-text-white", d = "bear-p-1 bear-rounded-lg bear-text-gray-400 dark:bear-text-zinc-500 hover:bear-text-gray-600 dark:hover:bear-text-white hover:bear-bg-gray-100 dark:hover:bear-bg-zinc-700 bear-transition-colors", x = "bear-px-6 bear-py-4 bear-text-gray-600 dark:bear-text-gray-300", i = "bear-flex bear-items-center bear-justify-end bear-gap-3 bear-px-6 bear-py-4 bear-border-t bear-border-gray-200 dark:bear-border-zinc-700";
|
|
8
8
|
export {
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
r as
|
|
15
|
-
|
|
9
|
+
x as MODAL_BODY_CLASSES,
|
|
10
|
+
d as MODAL_CLOSE_CLASSES,
|
|
11
|
+
t as MODAL_CONTAINER_CLASSES,
|
|
12
|
+
i as MODAL_FOOTER_CLASSES,
|
|
13
|
+
o as MODAL_HEADER_CLASSES,
|
|
14
|
+
r as MODAL_PANEL_Z_INDEX,
|
|
15
|
+
a as MODAL_ROOT_CLASSES,
|
|
16
|
+
b as MODAL_SIZE_CLASSES,
|
|
17
|
+
n as MODAL_TITLE_CLASSES,
|
|
18
|
+
e as MODAL_Z_INDEX
|
|
16
19
|
};
|