@forgedevstack/bear 1.3.3 → 1.3.5
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/README.md +100 -290
- package/dist/components/Alert/Alert.cjs +1 -1
- package/dist/components/Alert/Alert.const.cjs +1 -1
- package/dist/components/Alert/Alert.const.d.ts +1 -6
- package/dist/components/Alert/Alert.const.js +10 -30
- package/dist/components/Alert/Alert.js +49 -54
- package/dist/components/AlertDialog/AlertDialog.cjs +1 -1
- package/dist/components/AlertDialog/AlertDialog.js +67 -84
- package/dist/components/BottomSheet/BottomSheet.cjs +1 -1
- package/dist/components/BottomSheet/BottomSheet.js +72 -64
- package/dist/components/Calendar/Calendar.cjs +1 -1
- package/dist/components/Calendar/Calendar.js +122 -112
- package/dist/components/Chart/BarChart.cjs +1 -1
- package/dist/components/Chart/BarChart.js +37 -36
- package/dist/components/Chart/Chart.types.d.ts +2 -0
- package/dist/components/Chart/Chart.utils.cjs +1 -1
- package/dist/components/Chart/Chart.utils.d.ts +2 -0
- package/dist/components/Chart/Chart.utils.js +32 -31
- package/dist/components/Chart/FunnelChart.cjs +1 -1
- package/dist/components/Chart/FunnelChart.js +29 -28
- package/dist/components/Chart/LineChart.cjs +1 -1
- package/dist/components/Chart/LineChart.js +45 -44
- package/dist/components/Chart/PieChart.cjs +1 -1
- package/dist/components/Chart/PieChart.js +52 -51
- package/dist/components/Chart/RadarChart.cjs +1 -1
- package/dist/components/Chart/RadarChart.js +63 -62
- package/dist/components/Chart/index.d.ts +1 -1
- package/dist/components/ChipGroup/ChipGroup.cjs +1 -1
- package/dist/components/ChipGroup/ChipGroup.const.cjs +1 -1
- package/dist/components/ChipGroup/ChipGroup.const.d.ts +2 -0
- package/dist/components/ChipGroup/ChipGroup.const.js +6 -4
- package/dist/components/ChipGroup/ChipGroup.js +52 -48
- package/dist/components/CommandPalette/CommandItem.cjs +1 -0
- package/dist/components/CommandPalette/CommandItem.d.ts +6 -0
- package/dist/components/CommandPalette/CommandItem.js +39 -0
- package/dist/components/CommandPalette/CommandPalette.cjs +1 -1
- package/dist/components/CommandPalette/CommandPalette.js +129 -144
- package/dist/components/Drawer/Drawer.cjs +1 -1
- package/dist/components/Drawer/Drawer.js +72 -66
- package/dist/components/EmptyState/EmptyState.cjs +1 -1
- package/dist/components/EmptyState/EmptyState.const.cjs +1 -1
- package/dist/components/EmptyState/EmptyState.const.d.ts +5 -0
- package/dist/components/EmptyState/EmptyState.const.js +30 -15
- package/dist/components/EmptyState/EmptyState.js +35 -35
- package/dist/components/EmptyState/EmptyState.types.d.ts +2 -2
- package/dist/components/HoverCard/HoverCard.cjs +4 -3
- package/dist/components/HoverCard/HoverCard.const.cjs +1 -0
- package/dist/components/HoverCard/HoverCard.const.d.ts +1 -0
- package/dist/components/HoverCard/HoverCard.const.js +5 -0
- package/dist/components/HoverCard/HoverCard.js +62 -56
- package/dist/components/HoverCard/HoverCard.types.d.ts +7 -0
- package/dist/components/Menu/Menu.cjs +1 -1
- package/dist/components/Menu/Menu.const.cjs +1 -0
- package/dist/components/Menu/Menu.const.d.ts +2 -0
- package/dist/components/Menu/Menu.const.js +7 -0
- package/dist/components/Menu/Menu.d.ts +3 -9
- package/dist/components/Menu/Menu.js +57 -89
- package/dist/components/Menu/Menu.types.d.ts +8 -1
- package/dist/components/Menu/MenuDivider.cjs +1 -0
- package/dist/components/Menu/MenuDivider.d.ts +6 -0
- package/dist/components/Menu/MenuDivider.js +7 -0
- package/dist/components/Menu/MenuItem.cjs +1 -0
- package/dist/components/Menu/MenuItem.d.ts +6 -0
- package/dist/components/Menu/MenuItem.js +46 -0
- 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 +1 -0
- package/dist/components/Modal/Modal.const.js +15 -12
- package/dist/components/Modal/Modal.js +62 -59
- package/dist/components/Modal/Modal.types.d.ts +7 -0
- package/dist/components/ModalsProvider/components/StackedModal/StackedModal.cjs +1 -1
- package/dist/components/ModalsProvider/components/StackedModal/StackedModal.js +10 -9
- package/dist/components/OverlayPortal/OverlayPortal.cjs +1 -1
- package/dist/components/OverlayPortal/OverlayPortal.const.cjs +1 -1
- package/dist/components/OverlayPortal/OverlayPortal.const.d.ts +4 -0
- package/dist/components/OverlayPortal/OverlayPortal.const.js +21 -5
- package/dist/components/OverlayPortal/OverlayPortal.js +44 -38
- package/dist/components/Popover/Popover.cjs +1 -1
- package/dist/components/Popover/Popover.const.cjs +1 -0
- package/dist/components/Popover/Popover.const.d.ts +15 -1
- package/dist/components/Popover/Popover.const.js +24 -0
- package/dist/components/Popover/Popover.js +77 -73
- package/dist/components/Popover/Popover.types.d.ts +7 -0
- package/dist/components/Select/Select.cjs +1 -1
- package/dist/components/Select/Select.const.cjs +1 -1
- package/dist/components/Select/Select.const.d.ts +1 -0
- package/dist/components/Select/Select.const.js +7 -6
- package/dist/components/Select/Select.js +101 -96
- package/dist/components/Tabs/TabList.cjs +1 -1
- package/dist/components/Tabs/TabList.js +1 -1
- 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 +2 -0
- package/dist/components/Toast/Toast.const.js +11 -8
- package/dist/components/Toast/Toast.context.cjs +1 -0
- package/dist/components/Toast/Toast.context.d.ts +3 -0
- package/dist/components/Toast/Toast.context.js +11 -0
- package/dist/components/Toast/Toast.d.ts +4 -3
- package/dist/components/Toast/Toast.icons.cjs +1 -0
- package/dist/components/Toast/Toast.icons.d.ts +4 -0
- package/dist/components/Toast/Toast.icons.js +29 -0
- package/dist/components/Toast/Toast.js +32 -160
- package/dist/components/Toast/ToastContainer.cjs +1 -0
- package/dist/components/Toast/ToastContainer.d.ts +3 -0
- package/dist/components/Toast/ToastContainer.js +39 -0
- package/dist/components/Toast/ToastItem.cjs +1 -0
- package/dist/components/Toast/ToastItem.d.ts +5 -0
- package/dist/components/Toast/ToastItem.js +86 -0
- package/dist/components/ToggleGroup/ToggleGroup.cjs +1 -0
- package/dist/components/ToggleGroup/ToggleGroup.const.cjs +1 -0
- package/dist/components/ToggleGroup/ToggleGroup.const.d.ts +15 -0
- package/dist/components/ToggleGroup/ToggleGroup.const.js +33 -0
- package/dist/components/ToggleGroup/ToggleGroup.context.cjs +1 -0
- package/dist/components/ToggleGroup/ToggleGroup.context.d.ts +2 -0
- package/dist/components/ToggleGroup/ToggleGroup.context.js +5 -0
- package/dist/components/ToggleGroup/ToggleGroup.d.ts +2 -0
- package/dist/components/ToggleGroup/ToggleGroup.js +89 -0
- package/dist/components/ToggleGroup/ToggleGroup.types.d.ts +48 -0
- package/dist/components/ToggleGroup/ToggleGroupItem.cjs +1 -0
- package/dist/components/ToggleGroup/ToggleGroupItem.d.ts +2 -0
- package/dist/components/ToggleGroup/ToggleGroupItem.js +50 -0
- package/dist/components/ToggleGroup/hooks/useToggleGroupContext.cjs +1 -0
- package/dist/components/ToggleGroup/hooks/useToggleGroupContext.d.ts +1 -0
- package/dist/components/ToggleGroup/hooks/useToggleGroupContext.js +6 -0
- package/dist/components/ToggleGroup/index.d.ts +4 -0
- package/dist/components/Tooltip/Tooltip.cjs +1 -1
- package/dist/components/Tooltip/Tooltip.const.cjs +1 -0
- package/dist/components/Tooltip/Tooltip.const.d.ts +8 -0
- package/dist/components/Tooltip/Tooltip.const.js +13 -0
- package/dist/components/Tooltip/Tooltip.js +59 -61
- package/dist/components/Tooltip/Tooltip.types.d.ts +7 -0
- package/dist/components/Transition/Transition.cjs +1 -1
- package/dist/components/Transition/Transition.const.cjs +1 -1
- package/dist/components/Transition/Transition.const.js +26 -8
- package/dist/components/Transition/Transition.js +77 -74
- package/dist/components/Transition/Transition.types.d.ts +8 -2
- package/dist/components/Typography/Typography.const.cjs +1 -1
- package/dist/components/Typography/Typography.const.js +2 -1
- package/dist/components/index.cjs +1 -1
- package/dist/components/index.d.ts +3 -1
- package/dist/components/index.js +429 -419
- package/dist/constants/generals.const.cjs +1 -1
- package/dist/constants/generals.const.js +85 -86
- package/dist/constants/numbers.const.cjs +1 -1
- package/dist/constants/numbers.const.d.ts +3 -0
- package/dist/constants/numbers.const.js +37 -34
- package/dist/hooks/index.cjs +1 -1
- package/dist/hooks/index.d.ts +2 -0
- package/dist/hooks/index.js +6 -4
- package/dist/hooks/useFixedAnchorPosition/index.d.ts +1 -1
- package/dist/hooks/useFixedAnchorPosition/useFixedAnchorPosition.const.cjs +1 -1
- package/dist/hooks/useFixedAnchorPosition/useFixedAnchorPosition.const.d.ts +3 -0
- package/dist/hooks/useFixedAnchorPosition/useFixedAnchorPosition.const.js +17 -14
- package/dist/hooks/useFixedAnchorPosition/useFixedAnchorPosition.types.d.ts +1 -1
- package/dist/hooks/useFocusTrap/index.d.ts +2 -0
- package/dist/hooks/useFocusTrap/useFocusTrap.cjs +1 -0
- package/dist/hooks/useFocusTrap/useFocusTrap.d.ts +3 -0
- package/dist/hooks/useFocusTrap/useFocusTrap.js +41 -0
- package/dist/hooks/useFocusTrap/useFocusTrap.types.d.ts +8 -0
- package/dist/hooks/useFocusTrap/useFocusTrap.utils.cjs +1 -0
- package/dist/hooks/useFocusTrap/useFocusTrap.utils.d.ts +1 -0
- package/dist/hooks/useFocusTrap/useFocusTrap.utils.js +23 -0
- package/dist/index.cjs +1 -1
- package/dist/index.js +580 -568
- package/dist/styles/_alerts.css +85 -4
- package/dist/styles/_drawer.css +60 -0
- package/dist/styles/_effects.css +33 -0
- package/dist/styles.css +231 -4
- package/package.json +3 -5
|
@@ -26,7 +26,7 @@ const X = ({ children: a, maxVisibleTabs: l, wrap: n = !1, className: M }) => {
|
|
|
26
26
|
`Bear-Tabs__list--${t}`,
|
|
27
27
|
o != null && !n && "bear-flex bear-w-full bear-min-w-0 bear-items-stretch",
|
|
28
28
|
(!o || n) && "bear-flex bear-gap-1",
|
|
29
|
-
n
|
|
29
|
+
n ? "bear-flex-wrap" : "bear-max-w-full bear-overflow-x-auto",
|
|
30
30
|
!n && !o && "bear-gap-1",
|
|
31
31
|
t === "line" && "bear-border-b",
|
|
32
32
|
t === "pills" && "bear-p-1 bear-rounded-lg",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),o=require("react"),y=require("./Toast.const.cjs"),i=require("./Toast.context.cjs"),u=require("./ToastContainer.cjs"),P=require("../../utils/generateBearId.utils.cjs"),f=({children:l,position:T="top-right",maxToasts:d})=>{const[C,a]=o.useState([]),r=o.useCallback(s=>{a(e=>e.filter(n=>n.id!==s))},[]),t=o.useCallback(s=>{const e=s.id||P.generateBearId(y.COMPONENT_NAME_TOAST);return a(n=>[...n,{...s,id:e}]),e},[]),b=o.useCallback(s=>t(s),[t]),v=o.useCallback((s,e)=>t({message:s,severity:"success",...e}),[t]),k=o.useCallback((s,e)=>t({message:s,severity:"info",...e}),[t]),g=o.useCallback((s,e)=>t({message:s,severity:"warning",...e}),[t]),_=o.useCallback((s,e)=>t({message:s,severity:"error",...e}),[t]),m=o.useCallback(s=>r(s),[r]),q=o.useCallback(()=>a([]),[]),x={toast:b,success:v,info:k,warning:g,error:_,dismiss:m,dismissAll:q,_toasts:C,_removeToast:r};return c.jsxs(i.ToastContext.Provider,{value:x,children:[l,c.jsx(u.ToastContainer,{position:T,maxToasts:d})]})};exports.useToast=i.useToast;exports.ToastContainer=u.ToastContainer;exports.ToastProvider=f;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../../utils/liveRegion.const.cjs"),e="Bear-Toast";r.BEAR_ARIA_LIVE_BY_SEVERITY.success,r.BEAR_ARIA_LIVE_BY_SEVERITY.info,r.BEAR_ARIA_LIVE_BY_SEVERITY.warning,r.BEAR_ARIA_LIVE_BY_SEVERITY.error;r.BEAR_ARIA_ROLE_BY_SEVERITY.success,r.BEAR_ARIA_ROLE_BY_SEVERITY.info,r.BEAR_ARIA_ROLE_BY_SEVERITY.warning,r.BEAR_ARIA_ROLE_BY_SEVERITY.error;const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../../utils/liveRegion.const.cjs"),e=require("../../constants/numbers.const.cjs"),_="Bear-Toast",t="Toast";r.BEAR_ARIA_LIVE_BY_SEVERITY.success,r.BEAR_ARIA_LIVE_BY_SEVERITY.info,r.BEAR_ARIA_LIVE_BY_SEVERITY.warning,r.BEAR_ARIA_LIVE_BY_SEVERITY.error;r.BEAR_ARIA_ROLE_BY_SEVERITY.success,r.BEAR_ARIA_ROLE_BY_SEVERITY.info,r.BEAR_ARIA_ROLE_BY_SEVERITY.warning,r.BEAR_ARIA_ROLE_BY_SEVERITY.error;const T=e.TWO_HUNDRED,o=e.FIVE_THOUSAND,E={success:`${_}--success`,info:`${_}--info`,warning:`${_}--warning`,error:`${_}--error`},A={"top-left":"bear-top-4 bear-left-4","top-center":"bear-top-4 bear-left-1/2 bear-transform bear--translate-x-1/2","top-right":"bear-top-4 bear-right-4","bottom-left":"bear-bottom-4 bear-left-4","bottom-center":"bear-bottom-4 bear-left-1/2 bear-transform bear--translate-x-1/2","bottom-right":"bear-bottom-4 bear-right-4"},a="bear-flex bear-items-start bear-gap-3 bear-p-4 bear-rounded-lg bear-shadow-lg bear-min-w-[300px] bear-max-w-[400px] bear-transition-all bear-duration-200";exports.COMPONENT_NAME_TOAST=t;exports.TOAST_DEFAULT_DURATION=o;exports.TOAST_EXIT_MS=T;exports.TOAST_ITEM_CLASSES=a;exports.TOAST_POSITION_CLASSES=A;exports.TOAST_SEVERITY_MODIFIER=E;exports.T_O_A_S_T_ROOT_CLASS=_;
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import { ToastSeverity, ToastPosition } from './Toast.types';
|
|
2
2
|
export declare const T_O_A_S_T_ROOT_CLASS = "Bear-Toast";
|
|
3
|
+
export declare const COMPONENT_NAME_TOAST = "Toast";
|
|
3
4
|
export declare const TOAST_ARIA_LIVE: Record<ToastSeverity, 'polite' | 'assertive'>;
|
|
4
5
|
export declare const TOAST_ARIA_ROLE: Record<ToastSeverity, 'status' | 'alert'>;
|
|
5
6
|
export declare const TOAST_EXIT_MS = 200;
|
|
7
|
+
export declare const TOAST_DEFAULT_DURATION = 5000;
|
|
6
8
|
export declare const TOAST_SEVERITY_MODIFIER: Record<ToastSeverity, string>;
|
|
7
9
|
export declare const TOAST_POSITION_CLASSES: Record<ToastPosition, string>;
|
|
8
10
|
export declare const TOAST_ITEM_CLASSES = "bear-flex bear-items-start bear-gap-3 bear-p-4 bear-rounded-lg bear-shadow-lg bear-min-w-[300px] bear-max-w-[400px] bear-transition-all bear-duration-200";
|
|
@@ -1,24 +1,27 @@
|
|
|
1
1
|
import { BEAR_ARIA_LIVE_BY_SEVERITY as r, BEAR_ARIA_ROLE_BY_SEVERITY as e } from "../../utils/liveRegion.const.js";
|
|
2
|
-
|
|
2
|
+
import { FIVE_THOUSAND as o, TWO_HUNDRED as a } from "../../constants/numbers.const.js";
|
|
3
|
+
const t = "Bear-Toast", b = "Toast";
|
|
3
4
|
r.success, r.info, r.warning, r.error;
|
|
4
5
|
e.success, e.info, e.warning, e.error;
|
|
5
|
-
const
|
|
6
|
+
const T = a, _ = o, i = {
|
|
6
7
|
success: `${t}--success`,
|
|
7
8
|
info: `${t}--info`,
|
|
8
9
|
warning: `${t}--warning`,
|
|
9
10
|
error: `${t}--error`
|
|
10
|
-
},
|
|
11
|
+
}, c = {
|
|
11
12
|
"top-left": "bear-top-4 bear-left-4",
|
|
12
13
|
"top-center": "bear-top-4 bear-left-1/2 bear-transform bear--translate-x-1/2",
|
|
13
14
|
"top-right": "bear-top-4 bear-right-4",
|
|
14
15
|
"bottom-left": "bear-bottom-4 bear-left-4",
|
|
15
16
|
"bottom-center": "bear-bottom-4 bear-left-1/2 bear-transform bear--translate-x-1/2",
|
|
16
17
|
"bottom-right": "bear-bottom-4 bear-right-4"
|
|
17
|
-
},
|
|
18
|
+
}, S = "bear-flex bear-items-start bear-gap-3 bear-p-4 bear-rounded-lg bear-shadow-lg bear-min-w-[300px] bear-max-w-[400px] bear-transition-all bear-duration-200";
|
|
18
19
|
export {
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
20
|
+
b as COMPONENT_NAME_TOAST,
|
|
21
|
+
_ as TOAST_DEFAULT_DURATION,
|
|
22
|
+
T as TOAST_EXIT_MS,
|
|
23
|
+
S as TOAST_ITEM_CLASSES,
|
|
24
|
+
c as TOAST_POSITION_CLASSES,
|
|
25
|
+
i as TOAST_SEVERITY_MODIFIER,
|
|
23
26
|
t as T_O_A_S_T_ROOT_CLASS
|
|
24
27
|
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),o=e.createContext(null),s=()=>{const t=e.useContext(o);if(!t)throw new Error("useToast must be used within a ToastProvider");return t};exports.ToastContext=o;exports.useToast=s;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { createContext as o, useContext as e } from "react";
|
|
2
|
+
const r = o(null), n = () => {
|
|
3
|
+
const t = e(r);
|
|
4
|
+
if (!t)
|
|
5
|
+
throw new Error("useToast must be used within a ToastProvider");
|
|
6
|
+
return t;
|
|
7
|
+
};
|
|
8
|
+
export {
|
|
9
|
+
r as ToastContext,
|
|
10
|
+
n as useToast
|
|
11
|
+
};
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { FC } from 'react';
|
|
2
|
-
import {
|
|
3
|
-
export
|
|
4
|
-
export
|
|
2
|
+
import { ToastProviderProps } from './Toast.types';
|
|
3
|
+
export { useToast } from './Toast.context';
|
|
4
|
+
export { ToastContainer } from './ToastContainer';
|
|
5
|
+
export { ToastItem } from './ToastItem';
|
|
5
6
|
export declare const ToastProvider: FC<ToastProviderProps>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s={success:e.jsxs("svg",{width:20,height:20,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,children:[e.jsx("path",{d:"M22 11.08V12a10 10 0 1 1-5.93-9.14"}),e.jsx("polyline",{points:"22 4 12 14.01 9 11.01"})]}),info:e.jsxs("svg",{width:20,height:20,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,children:[e.jsx("circle",{cx:"12",cy:"12",r:"10"}),e.jsx("line",{x1:"12",y1:"16",x2:"12",y2:"12"}),e.jsx("line",{x1:"12",y1:"8",x2:"12.01",y2:"8"})]}),warning:e.jsxs("svg",{width:20,height:20,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,children:[e.jsx("path",{d:"M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"}),e.jsx("line",{x1:"12",y1:"9",x2:"12",y2:"13"}),e.jsx("line",{x1:"12",y1:"17",x2:"12.01",y2:"17"})]}),error:e.jsxs("svg",{width:20,height:20,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,children:[e.jsx("circle",{cx:"12",cy:"12",r:"10"}),e.jsx("line",{x1:"15",y1:"9",x2:"9",y2:"15"}),e.jsx("line",{x1:"9",y1:"9",x2:"15",y2:"15"})]})},i=()=>e.jsxs("svg",{width:16,height:16,viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,children:[e.jsx("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),e.jsx("line",{x1:"6",y1:"6",x2:"18",y2:"18"})]});exports.CloseIcon=i;exports.ToastIcons=s;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import { jsxs as i, jsx as e } from "react/jsx-runtime";
|
|
2
|
+
const r = {
|
|
3
|
+
success: /* @__PURE__ */ i("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
|
|
4
|
+
/* @__PURE__ */ e("path", { d: "M22 11.08V12a10 10 0 1 1-5.93-9.14" }),
|
|
5
|
+
/* @__PURE__ */ e("polyline", { points: "22 4 12 14.01 9 11.01" })
|
|
6
|
+
] }),
|
|
7
|
+
info: /* @__PURE__ */ i("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
|
|
8
|
+
/* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "10" }),
|
|
9
|
+
/* @__PURE__ */ e("line", { x1: "12", y1: "16", x2: "12", y2: "12" }),
|
|
10
|
+
/* @__PURE__ */ e("line", { x1: "12", y1: "8", x2: "12.01", y2: "8" })
|
|
11
|
+
] }),
|
|
12
|
+
warning: /* @__PURE__ */ i("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
|
|
13
|
+
/* @__PURE__ */ e("path", { d: "M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z" }),
|
|
14
|
+
/* @__PURE__ */ e("line", { x1: "12", y1: "9", x2: "12", y2: "13" }),
|
|
15
|
+
/* @__PURE__ */ e("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })
|
|
16
|
+
] }),
|
|
17
|
+
error: /* @__PURE__ */ i("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
|
|
18
|
+
/* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "10" }),
|
|
19
|
+
/* @__PURE__ */ e("line", { x1: "15", y1: "9", x2: "9", y2: "15" }),
|
|
20
|
+
/* @__PURE__ */ e("line", { x1: "9", y1: "9", x2: "15", y2: "15" })
|
|
21
|
+
] })
|
|
22
|
+
}, t = () => /* @__PURE__ */ i("svg", { width: 16, height: 16, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
|
|
23
|
+
/* @__PURE__ */ e("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
|
|
24
|
+
/* @__PURE__ */ e("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
|
|
25
|
+
] });
|
|
26
|
+
export {
|
|
27
|
+
t as CloseIcon,
|
|
28
|
+
r as ToastIcons
|
|
29
|
+
};
|
|
@@ -1,166 +1,38 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
info: /* @__PURE__ */ d("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
|
|
13
|
-
/* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "10" }),
|
|
14
|
-
/* @__PURE__ */ e("line", { x1: "12", y1: "16", x2: "12", y2: "12" }),
|
|
15
|
-
/* @__PURE__ */ e("line", { x1: "12", y1: "8", x2: "12.01", y2: "8" })
|
|
16
|
-
] }),
|
|
17
|
-
warning: /* @__PURE__ */ d("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
|
|
18
|
-
/* @__PURE__ */ e("path", { d: "M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z" }),
|
|
19
|
-
/* @__PURE__ */ e("line", { x1: "12", y1: "9", x2: "12", y2: "13" }),
|
|
20
|
-
/* @__PURE__ */ e("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })
|
|
21
|
-
] }),
|
|
22
|
-
error: /* @__PURE__ */ d("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
|
|
23
|
-
/* @__PURE__ */ e("circle", { cx: "12", cy: "12", r: "10" }),
|
|
24
|
-
/* @__PURE__ */ e("line", { x1: "15", y1: "9", x2: "9", y2: "15" }),
|
|
25
|
-
/* @__PURE__ */ e("line", { x1: "9", y1: "9", x2: "15", y2: "15" })
|
|
26
|
-
] })
|
|
27
|
-
}, F = () => /* @__PURE__ */ d("svg", { width: 16, height: 16, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, children: [
|
|
28
|
-
/* @__PURE__ */ e("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
|
|
29
|
-
/* @__PURE__ */ e("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
|
|
30
|
-
] }), X = W, $ = V, k = C(null), ee = () => {
|
|
31
|
-
const l = N(k);
|
|
32
|
-
if (!l)
|
|
33
|
-
throw new Error("useToast must be used within a ToastProvider");
|
|
34
|
-
return l;
|
|
35
|
-
}, q = ({
|
|
36
|
-
id: l,
|
|
37
|
-
testId: x,
|
|
38
|
-
message: f,
|
|
39
|
-
title: u,
|
|
40
|
-
severity: n = "info",
|
|
41
|
-
duration: o = 5e3,
|
|
42
|
-
closable: s = !0,
|
|
43
|
-
icon: i,
|
|
44
|
-
action: m,
|
|
45
|
-
onClose: a,
|
|
46
|
-
onRemove: b,
|
|
47
|
-
className: g,
|
|
48
|
-
autoScroll: T = !1,
|
|
49
|
-
pauseOnHover: v = !1
|
|
1
|
+
import { jsxs as y, jsx as C } from "react/jsx-runtime";
|
|
2
|
+
import { useState as _, useCallback as r } from "react";
|
|
3
|
+
import { COMPONENT_NAME_TOAST as A } from "./Toast.const.js";
|
|
4
|
+
import { ToastContext as N } from "./Toast.context.js";
|
|
5
|
+
import { useToast as I } from "./Toast.context.js";
|
|
6
|
+
import { ToastContainer as O } from "./ToastContainer.js";
|
|
7
|
+
import { generateBearId as P } from "../../utils/generateBearId.utils.js";
|
|
8
|
+
const b = ({
|
|
9
|
+
children: a,
|
|
10
|
+
position: c = "top-right",
|
|
11
|
+
maxToasts: m
|
|
50
12
|
}) => {
|
|
51
|
-
const [
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
const R = () => {
|
|
67
|
-
t(!0), setTimeout(() => {
|
|
68
|
-
b(), a == null || a();
|
|
69
|
-
}, A);
|
|
70
|
-
}, E = () => i === !1 ? null : i || z[n], M = j(n);
|
|
71
|
-
return /* @__PURE__ */ d(
|
|
72
|
-
"div",
|
|
73
|
-
{
|
|
74
|
-
ref: p,
|
|
75
|
-
id: l,
|
|
76
|
-
"data-testid": x,
|
|
77
|
-
...M,
|
|
78
|
-
"aria-atomic": "true",
|
|
79
|
-
onMouseEnter: v ? () => h(!0) : void 0,
|
|
80
|
-
onMouseLeave: v ? () => h(!1) : void 0,
|
|
81
|
-
className: P(
|
|
82
|
-
L,
|
|
83
|
-
Y,
|
|
84
|
-
y ? "bear-opacity-0 bear-translate-x-2" : "bear-opacity-100 bear-translate-x-0",
|
|
85
|
-
X[n],
|
|
86
|
-
g
|
|
87
|
-
),
|
|
88
|
-
children: [
|
|
89
|
-
E() && /* @__PURE__ */ e("span", { className: "bear-flex-shrink-0 bear-mt-0.5", children: E() }),
|
|
90
|
-
/* @__PURE__ */ d("div", { className: "bear-flex-1 bear-min-w-0", children: [
|
|
91
|
-
u && /* @__PURE__ */ e("div", { className: "bear-font-semibold bear-mb-0.5", children: u }),
|
|
92
|
-
/* @__PURE__ */ e("div", { className: "bear-text-sm bear-opacity-90", children: f })
|
|
93
|
-
] }),
|
|
94
|
-
m && /* @__PURE__ */ e("div", { className: "bear-flex-shrink-0", children: m }),
|
|
95
|
-
s && /* @__PURE__ */ e(
|
|
96
|
-
"button",
|
|
97
|
-
{
|
|
98
|
-
type: "button",
|
|
99
|
-
onClick: R,
|
|
100
|
-
className: "bear-flex-shrink-0 bear-p-1 bear-rounded hover:bear-bg-black/10 dark:hover:bear-bg-white/20 bear-transition-colors bear-bg-transparent bear-border-none bear-cursor-pointer",
|
|
101
|
-
"aria-label": "Close",
|
|
102
|
-
children: /* @__PURE__ */ e(F, {})
|
|
103
|
-
}
|
|
104
|
-
)
|
|
105
|
-
]
|
|
106
|
-
}
|
|
107
|
-
);
|
|
108
|
-
}, G = ({
|
|
109
|
-
position: l = "top-right",
|
|
110
|
-
maxToasts: x = 5,
|
|
111
|
-
className: f
|
|
112
|
-
}) => {
|
|
113
|
-
const u = N(k);
|
|
114
|
-
if (!u) return null;
|
|
115
|
-
const { _toasts: n, _removeToast: o } = u, s = n.slice(0, x);
|
|
116
|
-
return /* @__PURE__ */ e(
|
|
117
|
-
"div",
|
|
118
|
-
{
|
|
119
|
-
className: P(
|
|
120
|
-
`${L}__container`,
|
|
121
|
-
"bear-fixed bear-z-[11000] bear-flex bear-flex-col bear-gap-2",
|
|
122
|
-
$[l],
|
|
123
|
-
f
|
|
124
|
-
),
|
|
125
|
-
"aria-relevant": "additions",
|
|
126
|
-
children: s.map((i) => /* @__PURE__ */ e(
|
|
127
|
-
q,
|
|
128
|
-
{
|
|
129
|
-
...i,
|
|
130
|
-
onRemove: () => o(i.id)
|
|
131
|
-
},
|
|
132
|
-
i.id
|
|
133
|
-
))
|
|
134
|
-
}
|
|
135
|
-
);
|
|
136
|
-
}, te = ({
|
|
137
|
-
children: l,
|
|
138
|
-
position: x = "top-right",
|
|
139
|
-
maxToasts: f
|
|
140
|
-
}) => {
|
|
141
|
-
const [u, n] = w([]), o = c((t) => {
|
|
142
|
-
n((r) => r.filter((h) => h.id !== t));
|
|
143
|
-
}, []), s = c((t) => {
|
|
144
|
-
const r = t.id || D("Toast");
|
|
145
|
-
return n((h) => [...h, { ...t, id: r }]), r;
|
|
146
|
-
}, []), i = c((t) => s(t), [s]), m = c((t, r) => s({ message: t, severity: "success", ...r }), [s]), a = c((t, r) => s({ message: t, severity: "info", ...r }), [s]), b = c((t, r) => s({ message: t, severity: "warning", ...r }), [s]), g = c((t, r) => s({ message: t, severity: "error", ...r }), [s]), T = c((t) => o(t), [o]), v = c(() => n([]), []), y = {
|
|
147
|
-
toast: i,
|
|
148
|
-
success: m,
|
|
149
|
-
info: a,
|
|
150
|
-
warning: b,
|
|
151
|
-
error: g,
|
|
152
|
-
dismiss: T,
|
|
153
|
-
dismissAll: v,
|
|
154
|
-
_toasts: u,
|
|
155
|
-
_removeToast: o
|
|
13
|
+
const [d, e] = _([]), i = r((t) => {
|
|
14
|
+
e((o) => o.filter((n) => n.id !== t));
|
|
15
|
+
}, []), s = r((t) => {
|
|
16
|
+
const o = t.id || P(A);
|
|
17
|
+
return e((n) => [...n, { ...t, id: o }]), o;
|
|
18
|
+
}, []), T = r((t) => s(t), [s]), f = r((t, o) => s({ message: t, severity: "success", ...o }), [s]), u = r((t, o) => s({ message: t, severity: "info", ...o }), [s]), v = r((t, o) => s({ message: t, severity: "warning", ...o }), [s]), l = r((t, o) => s({ message: t, severity: "error", ...o }), [s]), p = r((t) => i(t), [i]), x = r(() => e([]), []), g = {
|
|
19
|
+
toast: T,
|
|
20
|
+
success: f,
|
|
21
|
+
info: u,
|
|
22
|
+
warning: v,
|
|
23
|
+
error: l,
|
|
24
|
+
dismiss: p,
|
|
25
|
+
dismissAll: x,
|
|
26
|
+
_toasts: d,
|
|
27
|
+
_removeToast: i
|
|
156
28
|
};
|
|
157
|
-
return /* @__PURE__ */
|
|
158
|
-
|
|
159
|
-
/* @__PURE__ */
|
|
29
|
+
return /* @__PURE__ */ y(N.Provider, { value: g, children: [
|
|
30
|
+
a,
|
|
31
|
+
/* @__PURE__ */ C(O, { position: c, maxToasts: m })
|
|
160
32
|
] });
|
|
161
33
|
};
|
|
162
34
|
export {
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
35
|
+
O as ToastContainer,
|
|
36
|
+
b as ToastProvider,
|
|
37
|
+
I as useToast
|
|
166
38
|
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),T=require("react"),n=require("./Toast.const.cjs"),_=require("./Toast.context.cjs"),l=require("./ToastItem.cjs"),x=require("../../utils/cn.cjs"),S=require("../../constants/numbers.const.cjs"),b=({position:r="top-right",maxToasts:s=S.FIVE,className:a})=>{const t=T.useContext(_.ToastContext);if(!t)return null;const{_toasts:i,_removeToast:c}=t,u=i.slice(0,s);return o.jsx("div",{className:x.cn(`${n.T_O_A_S_T_ROOT_CLASS}__container`,"bear-fixed bear-z-[11000] bear-flex bear-flex-col bear-gap-2",n.TOAST_POSITION_CLASSES[r],a),"aria-relevant":"additions",children:u.map(e=>o.jsx(l.ToastItem,{...e,onRemove:()=>c(e.id)},e.id))})};exports.ToastContainer=b;
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { jsx as t } from "react/jsx-runtime";
|
|
2
|
+
import { useContext as _ } from "react";
|
|
3
|
+
import { TOAST_POSITION_CLASSES as c, T_O_A_S_T_ROOT_CLASS as f } from "./Toast.const.js";
|
|
4
|
+
import { ToastContext as p } from "./Toast.context.js";
|
|
5
|
+
import { ToastItem as T } from "./ToastItem.js";
|
|
6
|
+
import { cn as l } from "../../utils/cn.js";
|
|
7
|
+
import { FIVE as x } from "../../constants/numbers.const.js";
|
|
8
|
+
const A = ({
|
|
9
|
+
position: e = "top-right",
|
|
10
|
+
maxToasts: i = x,
|
|
11
|
+
className: a
|
|
12
|
+
}) => {
|
|
13
|
+
const r = _(p);
|
|
14
|
+
if (!r) return null;
|
|
15
|
+
const { _toasts: m, _removeToast: n } = r, s = m.slice(0, i);
|
|
16
|
+
return /* @__PURE__ */ t(
|
|
17
|
+
"div",
|
|
18
|
+
{
|
|
19
|
+
className: l(
|
|
20
|
+
`${f}__container`,
|
|
21
|
+
"bear-fixed bear-z-[11000] bear-flex bear-flex-col bear-gap-2",
|
|
22
|
+
c[e],
|
|
23
|
+
a
|
|
24
|
+
),
|
|
25
|
+
"aria-relevant": "additions",
|
|
26
|
+
children: s.map((o) => /* @__PURE__ */ t(
|
|
27
|
+
T,
|
|
28
|
+
{
|
|
29
|
+
...o,
|
|
30
|
+
onRemove: () => n(o.id)
|
|
31
|
+
},
|
|
32
|
+
o.id
|
|
33
|
+
))
|
|
34
|
+
}
|
|
35
|
+
);
|
|
36
|
+
};
|
|
37
|
+
export {
|
|
38
|
+
A as ToastContainer
|
|
39
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),s=require("./Toast.const.cjs"),S=require("./Toast.icons.cjs"),k=require("../../utils/cn.cjs"),P=require("../../utils/generateBearId.utils.cjs"),w=require("../../utils/useBearId.cjs"),B=require("../../utils/liveRegion.utils.cjs"),l=require("../../constants/numbers.const.cjs"),D=({id:h,testId:O,message:R,title:b,severity:a="info",duration:n=s.TOAST_DEFAULT_DURATION,closable:g=!0,icon:i,action:d,onClose:r,onRemove:c,className:A,autoScroll:T=!1,pauseOnHover:f=!1})=>{const[v,m]=t.useState(!1),[_,I]=t.useState(!1),o=t.useRef(null),u=t.useRef(n),x=t.useRef(l.ZERO),N=w.useBearId(s.COMPONENT_NAME_TOAST),j=P.resolveBearId(h,N);t.useEffect(()=>{T&&o.current&&o.current.scrollIntoView({behavior:"smooth",block:"nearest",inline:"nearest"})},[T]),t.useEffect(()=>{if(n<=l.ZERO||_)return;x.current=Date.now();const q=setTimeout(()=>{m(!0),setTimeout(()=>{c(),r==null||r()},s.TOAST_EXIT_MS)},u.current);return()=>{clearTimeout(q),u.current=Math.max(l.ZERO,u.current-(Date.now()-x.current))}},[n,_,c,r]);const p=()=>{m(!0),setTimeout(()=>{c(),r==null||r()},s.TOAST_EXIT_MS)},E=()=>i===!1?null:i||S.ToastIcons[a],M=B.getBearLiveRegionProps(a);return e.jsxs("div",{ref:o,id:j,"data-testid":O,...M,"aria-atomic":"true",onMouseEnter:f?()=>I(!0):void 0,onMouseLeave:f?()=>I(!1):void 0,className:k.cn(s.T_O_A_S_T_ROOT_CLASS,s.TOAST_ITEM_CLASSES,v?"bear-opacity-0 bear-translate-x-2":"bear-opacity-100 bear-translate-x-0",s.TOAST_SEVERITY_MODIFIER[a],A),children:[E()&&e.jsx("span",{className:"bear-flex-shrink-0 bear-mt-0.5",children:E()}),e.jsxs("div",{className:"bear-flex-1 bear-min-w-0",children:[b&&e.jsx("div",{className:"bear-font-semibold bear-mb-0.5",children:b}),e.jsx("div",{className:"bear-text-sm bear-opacity-90",children:R})]}),d&&e.jsx("div",{className:"bear-flex-shrink-0",children:d}),g&&e.jsx("button",{type:"button",onClick:p,className:"bear-flex-shrink-0 bear-p-1 bear-rounded hover:bear-bg-black/10 dark:hover:bear-bg-white/20 bear-transition-colors bear-bg-transparent bear-border-none bear-cursor-pointer","aria-label":"Close",children:e.jsx(S.CloseIcon,{})})]})};exports.ToastItem=D;
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
import { jsxs as _, jsx as r } from "react/jsx-runtime";
|
|
2
|
+
import { useState as E, useRef as c, useEffect as x } from "react";
|
|
3
|
+
import { TOAST_DEFAULT_DURATION as P, COMPONENT_NAME_TOAST as B, TOAST_EXIT_MS as S, TOAST_SEVERITY_MODIFIER as j, TOAST_ITEM_CLASSES as y, T_O_A_S_T_ROOT_CLASS as F } from "./Toast.const.js";
|
|
4
|
+
import { CloseIcon as U, ToastIcons as V } from "./Toast.icons.js";
|
|
5
|
+
import { cn as X } from "../../utils/cn.js";
|
|
6
|
+
import { resolveBearId as Y } from "../../utils/generateBearId.utils.js";
|
|
7
|
+
import { useBearId as Z } from "../../utils/useBearId.js";
|
|
8
|
+
import { getBearLiveRegionProps as q } from "../../utils/liveRegion.utils.js";
|
|
9
|
+
import { ZERO as m } from "../../constants/numbers.const.js";
|
|
10
|
+
const ee = ({
|
|
11
|
+
id: A,
|
|
12
|
+
testId: O,
|
|
13
|
+
message: N,
|
|
14
|
+
title: b,
|
|
15
|
+
severity: t = "info",
|
|
16
|
+
duration: a = P,
|
|
17
|
+
closable: g = !0,
|
|
18
|
+
icon: s,
|
|
19
|
+
action: l,
|
|
20
|
+
onClose: e,
|
|
21
|
+
onRemove: i,
|
|
22
|
+
className: v,
|
|
23
|
+
autoScroll: f = !1,
|
|
24
|
+
pauseOnHover: u = !1
|
|
25
|
+
}) => {
|
|
26
|
+
const [R, d] = E(!1), [T, p] = E(!1), n = c(null), o = c(a), h = c(m), M = Z(B), k = Y(A, M);
|
|
27
|
+
x(() => {
|
|
28
|
+
f && n.current && n.current.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "nearest" });
|
|
29
|
+
}, [f]), x(() => {
|
|
30
|
+
if (a <= m || T) return;
|
|
31
|
+
h.current = Date.now();
|
|
32
|
+
const L = setTimeout(() => {
|
|
33
|
+
d(!0), setTimeout(() => {
|
|
34
|
+
i(), e == null || e();
|
|
35
|
+
}, S);
|
|
36
|
+
}, o.current);
|
|
37
|
+
return () => {
|
|
38
|
+
clearTimeout(L), o.current = Math.max(m, o.current - (Date.now() - h.current));
|
|
39
|
+
};
|
|
40
|
+
}, [a, T, i, e]);
|
|
41
|
+
const w = () => {
|
|
42
|
+
d(!0), setTimeout(() => {
|
|
43
|
+
i(), e == null || e();
|
|
44
|
+
}, S);
|
|
45
|
+
}, I = () => s === !1 ? null : s || V[t], D = q(t);
|
|
46
|
+
return /* @__PURE__ */ _(
|
|
47
|
+
"div",
|
|
48
|
+
{
|
|
49
|
+
ref: n,
|
|
50
|
+
id: k,
|
|
51
|
+
"data-testid": O,
|
|
52
|
+
...D,
|
|
53
|
+
"aria-atomic": "true",
|
|
54
|
+
onMouseEnter: u ? () => p(!0) : void 0,
|
|
55
|
+
onMouseLeave: u ? () => p(!1) : void 0,
|
|
56
|
+
className: X(
|
|
57
|
+
F,
|
|
58
|
+
y,
|
|
59
|
+
R ? "bear-opacity-0 bear-translate-x-2" : "bear-opacity-100 bear-translate-x-0",
|
|
60
|
+
j[t],
|
|
61
|
+
v
|
|
62
|
+
),
|
|
63
|
+
children: [
|
|
64
|
+
I() && /* @__PURE__ */ r("span", { className: "bear-flex-shrink-0 bear-mt-0.5", children: I() }),
|
|
65
|
+
/* @__PURE__ */ _("div", { className: "bear-flex-1 bear-min-w-0", children: [
|
|
66
|
+
b && /* @__PURE__ */ r("div", { className: "bear-font-semibold bear-mb-0.5", children: b }),
|
|
67
|
+
/* @__PURE__ */ r("div", { className: "bear-text-sm bear-opacity-90", children: N })
|
|
68
|
+
] }),
|
|
69
|
+
l && /* @__PURE__ */ r("div", { className: "bear-flex-shrink-0", children: l }),
|
|
70
|
+
g && /* @__PURE__ */ r(
|
|
71
|
+
"button",
|
|
72
|
+
{
|
|
73
|
+
type: "button",
|
|
74
|
+
onClick: w,
|
|
75
|
+
className: "bear-flex-shrink-0 bear-p-1 bear-rounded hover:bear-bg-black/10 dark:hover:bear-bg-white/20 bear-transition-colors bear-bg-transparent bear-border-none bear-cursor-pointer",
|
|
76
|
+
"aria-label": "Close",
|
|
77
|
+
children: /* @__PURE__ */ r(U, {})
|
|
78
|
+
}
|
|
79
|
+
)
|
|
80
|
+
]
|
|
81
|
+
}
|
|
82
|
+
);
|
|
83
|
+
};
|
|
84
|
+
export {
|
|
85
|
+
ee as ToastItem
|
|
86
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const R=require("react/jsx-runtime"),G=require("react"),v=require("../../utils/cn.cjs"),H=require("../../utils/generateBearId.utils.cjs"),Z=require("../../utils/useBearId.cjs"),F=require("./ToggleGroup.context.cjs"),t=require("./ToggleGroup.const.cjs"),_=require("../../constants/numbers.const.cjs"),E=require("../../constants/generals.const.cjs"),z=A=>{const{type:n=t.TOGGLE_GROUP_TYPE_SINGLE,value:g,defaultValue:f,onChange:s,onValueChange:l,orientation:O=t.TOGGLE_GROUP_ORIENTATION_HORIZONTAL,size:I=t.TOGGLE_GROUP_DEFAULT_SIZE,variant:L=t.TOGGLE_GROUP_DEFAULT_VARIANT,disabled:u=!1,fullWidth:y=!1,className:S,children:b,id:p,testId:U,...x}=A,w=Z.useBearId(t.COMPONENT_NAME_TOGGLE_GROUP),M=H.resolveBearId(p,w),[q,m]=G.useState(()=>n===t.TOGGLE_GROUP_TYPE_SINGLE?f??E.EMPTY_STRING:E.EMPTY_STRING),[k,Y]=G.useState(()=>n===t.TOGGLE_GROUP_TYPE_MULTIPLE?f??[]:[]),d=g!==void 0,i=d?g:n===t.TOGGLE_GROUP_TYPE_SINGLE?q:k,N=G.useCallback(e=>{if(!u)if(n===t.TOGGLE_GROUP_TYPE_SINGLE){const r=i===e?E.EMPTY_STRING:e;d||m(r),s==null||s(r),l==null||l(r)}else{const r=Array.isArray(i)?i:[],o=r.includes(e)?r.filter(c=>c!==e):[...r,e];d||Y(o),s==null||s(o),l==null||l(o)}},[u,n,i,d,s,l]),B=G.useMemo(()=>({type:n,value:i,onItemToggle:N,size:I,variant:L,disabled:u}),[n,i,N,I,L,u]),D=e=>{var P;const r=e.target;if(!r||r.getAttribute("role")!=="radio")return;const o=Array.from(e.currentTarget.querySelectorAll('button[role="radio"]:not([disabled])')),c=o.indexOf(r);if(c===-1)return;const T=O===t.TOGGLE_GROUP_ORIENTATION_HORIZONTAL,h=T&&e.key==="ArrowRight"||!T&&e.key==="ArrowDown",j=T&&e.key==="ArrowLeft"||!T&&e.key==="ArrowUp";let a=c;if(h)a=(c+_.ONE)%o.length;else if(j)a=(c-_.ONE+o.length)%o.length;else if(e.key==="Home")a=_.ZERO;else if(e.key==="End")a=o.length-_.ONE;else return;e.preventDefault(),(P=o[a])==null||P.focus()};return R.jsx(F.ToggleGroupContext.Provider,{value:B,children:R.jsx("div",{id:M,"data-testid":U,role:"group","aria-orientation":O,onKeyDown:D,className:v.cn("Bear-ToggleGroup","inline-flex max-w-full items-center gap-1 rounded-lg border border-[var(--bear-border-subtle)] bg-[var(--bear-surface-base)] p-1",t.ORIENTATION_CLASS_MAP[O],y&&"w-full justify-stretch",u&&"opacity-60 cursor-not-allowed",S),...x,children:b})})};exports.ToggleGroup=z;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r="single",e="multiple",t="horizontal",a="md",_="subtle",O="ToggleGroup",T="ToggleGroupItem",G={sm:"h-8 px-2.5 text-xs",md:"h-9 px-3 text-sm",lg:"h-10 px-4 text-base"},b={subtle:{base:"text-[var(--bear-text-secondary)] hover:bg-[var(--bear-bg-subtle)] hover:text-[var(--bear-text-primary)]",active:"bg-[var(--bear-bg-subtle)] text-[var(--bear-text-primary)] font-medium"},outline:{base:"text-[var(--bear-text-secondary)] hover:bg-[var(--bear-bg-subtle)] hover:text-[var(--bear-text-primary)] border border-transparent",active:"border-[var(--bear-primary-500)] text-[var(--bear-primary-600)] dark:text-[var(--bear-primary-400)] bg-[var(--bear-primary-50)] dark:bg-[var(--bear-primary-950)] font-medium"},filled:{base:"text-[var(--bear-text-secondary)] hover:bg-[var(--bear-bg-subtle)]",active:"bg-[var(--bear-primary-500)] text-white hover:bg-[var(--bear-primary-600)] font-medium"}},E={horizontal:"flex-row",vertical:"flex-col"};exports.COMPONENT_NAME_TOGGLE_GROUP=O;exports.COMPONENT_NAME_TOGGLE_GROUP_ITEM=T;exports.ORIENTATION_CLASS_MAP=E;exports.SIZE_CLASS_MAP=G;exports.TOGGLE_GROUP_DEFAULT_SIZE=a;exports.TOGGLE_GROUP_DEFAULT_VARIANT=_;exports.TOGGLE_GROUP_ORIENTATION_HORIZONTAL=t;exports.TOGGLE_GROUP_TYPE_MULTIPLE=e;exports.TOGGLE_GROUP_TYPE_SINGLE=r;exports.VARIANT_CLASS_MAP=b;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { ToggleGroupOrientation, ToggleGroupSize, ToggleGroupVariant } from './ToggleGroup.types';
|
|
2
|
+
export declare const TOGGLE_GROUP_TYPE_SINGLE = "single";
|
|
3
|
+
export declare const TOGGLE_GROUP_TYPE_MULTIPLE = "multiple";
|
|
4
|
+
export declare const TOGGLE_GROUP_ORIENTATION_HORIZONTAL = "horizontal";
|
|
5
|
+
export declare const TOGGLE_GROUP_ORIENTATION_VERTICAL = "vertical";
|
|
6
|
+
export declare const TOGGLE_GROUP_DEFAULT_SIZE: ToggleGroupSize;
|
|
7
|
+
export declare const TOGGLE_GROUP_DEFAULT_VARIANT: ToggleGroupVariant;
|
|
8
|
+
export declare const COMPONENT_NAME_TOGGLE_GROUP = "ToggleGroup";
|
|
9
|
+
export declare const COMPONENT_NAME_TOGGLE_GROUP_ITEM = "ToggleGroupItem";
|
|
10
|
+
export declare const SIZE_CLASS_MAP: Record<ToggleGroupSize, string>;
|
|
11
|
+
export declare const VARIANT_CLASS_MAP: Record<ToggleGroupVariant, {
|
|
12
|
+
base: string;
|
|
13
|
+
active: string;
|
|
14
|
+
}>;
|
|
15
|
+
export declare const ORIENTATION_CLASS_MAP: Record<ToggleGroupOrientation, string>;
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
const r = "single", e = "multiple", t = "horizontal", a = "md", b = "subtle", o = "ToggleGroup", s = "ToggleGroupItem", _ = {
|
|
2
|
+
sm: "h-8 px-2.5 text-xs",
|
|
3
|
+
md: "h-9 px-3 text-sm",
|
|
4
|
+
lg: "h-10 px-4 text-base"
|
|
5
|
+
}, v = {
|
|
6
|
+
subtle: {
|
|
7
|
+
base: "text-[var(--bear-text-secondary)] hover:bg-[var(--bear-bg-subtle)] hover:text-[var(--bear-text-primary)]",
|
|
8
|
+
active: "bg-[var(--bear-bg-subtle)] text-[var(--bear-text-primary)] font-medium"
|
|
9
|
+
},
|
|
10
|
+
outline: {
|
|
11
|
+
base: "text-[var(--bear-text-secondary)] hover:bg-[var(--bear-bg-subtle)] hover:text-[var(--bear-text-primary)] border border-transparent",
|
|
12
|
+
active: "border-[var(--bear-primary-500)] text-[var(--bear-primary-600)] dark:text-[var(--bear-primary-400)] bg-[var(--bear-primary-50)] dark:bg-[var(--bear-primary-950)] font-medium"
|
|
13
|
+
},
|
|
14
|
+
filled: {
|
|
15
|
+
base: "text-[var(--bear-text-secondary)] hover:bg-[var(--bear-bg-subtle)]",
|
|
16
|
+
active: "bg-[var(--bear-primary-500)] text-white hover:bg-[var(--bear-primary-600)] font-medium"
|
|
17
|
+
}
|
|
18
|
+
}, x = {
|
|
19
|
+
horizontal: "flex-row",
|
|
20
|
+
vertical: "flex-col"
|
|
21
|
+
};
|
|
22
|
+
export {
|
|
23
|
+
o as COMPONENT_NAME_TOGGLE_GROUP,
|
|
24
|
+
s as COMPONENT_NAME_TOGGLE_GROUP_ITEM,
|
|
25
|
+
x as ORIENTATION_CLASS_MAP,
|
|
26
|
+
_ as SIZE_CLASS_MAP,
|
|
27
|
+
a as TOGGLE_GROUP_DEFAULT_SIZE,
|
|
28
|
+
b as TOGGLE_GROUP_DEFAULT_VARIANT,
|
|
29
|
+
t as TOGGLE_GROUP_ORIENTATION_HORIZONTAL,
|
|
30
|
+
e as TOGGLE_GROUP_TYPE_MULTIPLE,
|
|
31
|
+
r as TOGGLE_GROUP_TYPE_SINGLE,
|
|
32
|
+
v as VARIANT_CLASS_MAP
|
|
33
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),t=e.createContext(null);exports.ToggleGroupContext=t;
|