@hyphen/hyphen-components 7.10.0 → 8.0.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/css/fonts.css +1 -1
- package/dist/css/index.css +292 -150
- package/dist/css/reset.css +1 -1
- package/dist/css/utilities.css +480 -38
- package/dist/css/variables.css +170 -25
- package/dist/hyphen-components.cjs.development.js +244 -311
- package/dist/hyphen-components.cjs.development.js.map +1 -1
- package/dist/hyphen-components.cjs.production.min.js +2 -2
- package/dist/hyphen-components.cjs.production.min.js.map +1 -1
- package/dist/hyphen-components.esm.js +198 -265
- package/dist/hyphen-components.esm.js.map +1 -1
- package/dist/index.d.ts +25 -60
- package/package.json +3 -3
- package/src/components/Alert/Alert.mdx +1 -1
- package/src/components/Alert/Alert.module.scss +29 -34
- package/src/components/Alert/Alert.stories.tsx +11 -3
- package/src/components/Alert/Alert.test.tsx +17 -11
- package/src/components/Alert/Alert.tsx +9 -16
- package/src/components/Badge/Badge.mdx +46 -4
- package/src/components/Badge/Badge.module.scss +235 -185
- package/src/components/Badge/Badge.stories.tsx +126 -36
- package/src/components/Badge/Badge.test.tsx +180 -21
- package/src/components/Badge/Badge.tsx +56 -21
- package/src/components/Drawer/Drawer.mdx +14 -16
- package/src/components/Formik/Formik.stories.tsx +3 -5
- package/src/components/Formik/FormikTimePicker/FormikTimePicker.test.tsx +34 -67
- package/src/components/Formik/FormikTimePicker/FormikTimePicker.tsx +0 -2
- package/src/components/Table/Table.stories.tsx +4 -4
- package/src/components/TimePicker/TimePicker.mdx +3 -11
- package/src/components/TimePicker/TimePicker.stories.tsx +61 -60
- package/src/components/TimePicker/TimePicker.test.tsx +76 -7
- package/src/components/TimePicker/TimePicker.tsx +37 -7
- package/src/components/Tooltip/Tooltip.stories.tsx +1 -1
- package/src/docs/Colors.mdx +13 -0
- package/src/index.ts +0 -2
- package/src/components/Formik/FormikTimePickerNative/FormikTimePickerNative.test.tsx +0 -175
- package/src/components/Formik/FormikTimePickerNative/FormikTimePickerNative.tsx +0 -38
- package/src/components/TimePickerNative/TimePickerNative.mdx +0 -67
- package/src/components/TimePickerNative/TimePickerNative.stories.tsx +0 -150
- package/src/components/TimePickerNative/TimePickerNative.test.tsx +0 -117
- package/src/components/TimePickerNative/TimePickerNative.tsx +0 -93
|
@@ -93,7 +93,6 @@ __export(src_exports, {
|
|
|
93
93
|
FormikTextareaInput: () => FormikTextareaInput,
|
|
94
94
|
FormikTextareaInputInset: () => FormikTextareaInputInset,
|
|
95
95
|
FormikTimePicker: () => FormikTimePicker,
|
|
96
|
-
FormikTimePickerNative: () => FormikTimePickerNative,
|
|
97
96
|
FormikToggleGroup: () => FormikToggleGroup,
|
|
98
97
|
FormikToggleGroupMulti: () => FormikToggleGroupMulti,
|
|
99
98
|
HEADING_SIZE_OPTIONS: () => HEADING_SIZE_OPTIONS,
|
|
@@ -146,7 +145,6 @@ __export(src_exports, {
|
|
|
146
145
|
ThemeProvider: () => ThemeProvider,
|
|
147
146
|
ThemeProviderContext: () => ThemeProviderContext,
|
|
148
147
|
TimePicker: () => TimePicker,
|
|
149
|
-
TimePickerNative: () => TimePickerNative,
|
|
150
148
|
ToastContainer: () => ToastContainer,
|
|
151
149
|
Toggle: () => Toggle,
|
|
152
150
|
ToggleGroup: () => ToggleGroup,
|
|
@@ -731,7 +729,7 @@ var Icon = (0, import_react2.forwardRef)(
|
|
|
731
729
|
Icon.displayName = "Icon";
|
|
732
730
|
|
|
733
731
|
// src/components/Alert/Alert.module.scss
|
|
734
|
-
var Alert_module_default = { "alert": "alert__9XZ4A", "close-icon": "close-icon__NDL4K", "alert-heading": "alert-heading__XCRu3", "alert__default": "alert__default__3qStp", "alert__info": "alert__info__BOSxI", "alert__success": "alert__success__NPujz", "alert__warning": "alert__warning__sS3f7", "alert__danger": "alert__danger__6ZwUi"
|
|
732
|
+
var Alert_module_default = { "alert": "alert__9XZ4A", "close-icon": "close-icon__NDL4K", "alert-heading": "alert-heading__XCRu3", "alert__default": "alert__default__3qStp", "alert__info": "alert__info__BOSxI", "alert__success": "alert__success__NPujz", "alert__warning": "alert__warning__sS3f7", "alert__danger": "alert__danger__6ZwUi" };
|
|
735
733
|
|
|
736
734
|
// src/components/Alert/Alert.constants.ts
|
|
737
735
|
var ALERT_ICONS_MAP = {
|
|
@@ -748,7 +746,6 @@ var AlertComponent = ({
|
|
|
748
746
|
className = "",
|
|
749
747
|
hasIcon = false,
|
|
750
748
|
isCompact = false,
|
|
751
|
-
message = "",
|
|
752
749
|
onClose = void 0,
|
|
753
750
|
render = void 0,
|
|
754
751
|
title = "",
|
|
@@ -774,7 +771,7 @@ var AlertComponent = ({
|
|
|
774
771
|
);
|
|
775
772
|
const alertIcon = (0, import_react4.useMemo)(() => {
|
|
776
773
|
if (!hasIcon) return null;
|
|
777
|
-
return /* @__PURE__ */ import_react4.default.createElement(Box, { fontSize: "md"
|
|
774
|
+
return /* @__PURE__ */ import_react4.default.createElement(Box, { fontSize: "md" }, /* @__PURE__ */ import_react4.default.createElement(
|
|
778
775
|
Icon,
|
|
779
776
|
{
|
|
780
777
|
name: ALERT_ICONS_MAP[variant].icon,
|
|
@@ -784,30 +781,22 @@ var AlertComponent = ({
|
|
|
784
781
|
}, [hasIcon, variant]);
|
|
785
782
|
const closeIcon = (0, import_react4.useMemo)(() => {
|
|
786
783
|
if (!onClose) return null;
|
|
787
|
-
return /* @__PURE__ */ import_react4.default.createElement(
|
|
788
|
-
|
|
784
|
+
return /* @__PURE__ */ import_react4.default.createElement(Box, { margin: "0 0 0 auto", className: Alert_module_default["close-icon"] }, /* @__PURE__ */ import_react4.default.createElement(
|
|
785
|
+
"button",
|
|
789
786
|
{
|
|
790
|
-
|
|
791
|
-
|
|
792
|
-
|
|
787
|
+
type: "button",
|
|
788
|
+
onClick: handleClose,
|
|
789
|
+
onKeyUp: handleCloseKeyPress,
|
|
790
|
+
"aria-label": "dismiss"
|
|
793
791
|
},
|
|
794
|
-
/* @__PURE__ */ import_react4.default.createElement(
|
|
795
|
-
|
|
796
|
-
{
|
|
797
|
-
type: "button",
|
|
798
|
-
onClick: handleClose,
|
|
799
|
-
onKeyUp: handleCloseKeyPress,
|
|
800
|
-
"aria-label": "dismiss"
|
|
801
|
-
},
|
|
802
|
-
/* @__PURE__ */ import_react4.default.createElement(Icon, { name: "remove", "data-testid": "alert-close-icon-test-id" })
|
|
803
|
-
)
|
|
804
|
-
);
|
|
792
|
+
/* @__PURE__ */ import_react4.default.createElement(Icon, { name: "remove", "data-testid": "alert-close-icon-test-id" })
|
|
793
|
+
));
|
|
805
794
|
}, [onClose, handleClose, handleCloseKeyPress]);
|
|
806
795
|
const content = (0, import_react4.useMemo)(() => {
|
|
807
796
|
if (render) {
|
|
808
797
|
return render();
|
|
809
798
|
}
|
|
810
|
-
return /* @__PURE__ */ import_react4.default.createElement(Box, { display: "block", childGap:
|
|
799
|
+
return /* @__PURE__ */ import_react4.default.createElement(Box, { display: "block", childGap: children && title ? "2xs" : void 0 }, title && /* @__PURE__ */ import_react4.default.createElement(
|
|
811
800
|
Box,
|
|
812
801
|
{
|
|
813
802
|
as: "h4",
|
|
@@ -816,8 +805,8 @@ var AlertComponent = ({
|
|
|
816
805
|
className: Alert_module_default["alert-heading"]
|
|
817
806
|
},
|
|
818
807
|
title
|
|
819
|
-
), children
|
|
820
|
-
}, [render,
|
|
808
|
+
), children);
|
|
809
|
+
}, [render, title, children]);
|
|
821
810
|
return /* @__PURE__ */ import_react4.default.createElement(
|
|
822
811
|
Box,
|
|
823
812
|
{
|
|
@@ -847,14 +836,25 @@ var import_react5 = __toESM(require("react"));
|
|
|
847
836
|
var import_classnames4 = __toESM(require("classnames"));
|
|
848
837
|
|
|
849
838
|
// src/components/Badge/Badge.module.scss
|
|
850
|
-
var Badge_module_default = { "badge": "badge__wbyII", "size-sm": "size-sm__v5iQ5", "size-md": "size-md__t0Qz1", "size-lg": "size-lg__HQPfE", "
|
|
839
|
+
var Badge_module_default = { "badge": "badge__wbyII", "size-sm": "size-sm__v5iQ5", "label": "label__pDVHA", "size-md": "size-md__t0Qz1", "size-lg": "size-lg__HQPfE", "color-grey": "color-grey__expYg", "color-blue": "color-blue__W6WO3", "color-green": "color-green__Tb6Do", "color-yellow": "color-yellow__rs3OW", "color-red": "color-red__yD5FI", "color-purple": "color-purple__JH5Qe", "color-orange": "color-orange__Q7DOt", "color-brand": "color-brand__Ri3JN", "solid": "solid__A3Y54", "soft": "soft__Bj0sP", "surface": "surface__IcVyX", "outline": "outline__jrc2I", "radius-none": "radius-none__h6tIW", "radius-sm": "radius-sm__Ioju2", "radius-md": "radius-md__gmDDk", "radius-lg": "radius-lg__08R9C", "radius-full": "radius-full__arYCj", "size-sm-tablet": "size-sm-tablet__IkjZY", "size-md-tablet": "size-md-tablet__kMUva", "size-lg-tablet": "size-lg-tablet__ldE4r", "size-sm-desktop": "size-sm-desktop__alYyy", "size-md-desktop": "size-md-desktop__AvaSK", "size-lg-desktop": "size-lg-desktop__5graA", "size-sm-hd": "size-sm-hd__74Pms", "size-md-hd": "size-md-hd__cEiUq", "size-lg-hd": "size-lg-hd__Qi3ic" };
|
|
851
840
|
|
|
852
841
|
// src/components/Badge/Badge.tsx
|
|
842
|
+
var BADGE_COLOR_ALIASES = {
|
|
843
|
+
danger: "red",
|
|
844
|
+
success: "green",
|
|
845
|
+
warning: "yellow",
|
|
846
|
+
info: "blue"
|
|
847
|
+
};
|
|
848
|
+
var renderBadgeChildren = (children) => import_react5.Children.map(
|
|
849
|
+
children,
|
|
850
|
+
(child) => typeof child === "string" || typeof child === "number" ? /* @__PURE__ */ import_react5.default.createElement("span", { className: Badge_module_default.label }, child) : child
|
|
851
|
+
);
|
|
853
852
|
var Badge = (0, import_react5.forwardRef)(
|
|
854
853
|
({
|
|
855
854
|
className = "",
|
|
856
|
-
|
|
857
|
-
|
|
855
|
+
color = "grey",
|
|
856
|
+
radius = "full",
|
|
857
|
+
variant = "soft",
|
|
858
858
|
size = "md",
|
|
859
859
|
children,
|
|
860
860
|
...restProps
|
|
@@ -862,13 +862,14 @@ var Badge = (0, import_react5.forwardRef)(
|
|
|
862
862
|
const responsiveClasses = generateResponsiveClasses("size", size).map(
|
|
863
863
|
(c) => Badge_module_default[c]
|
|
864
864
|
);
|
|
865
|
+
const hue = BADGE_COLOR_ALIASES[color] ?? color;
|
|
865
866
|
const badgeClasses = (0, import_classnames4.default)(
|
|
866
867
|
Badge_module_default.badge,
|
|
867
868
|
className,
|
|
868
869
|
responsiveClasses,
|
|
869
|
-
|
|
870
|
-
|
|
871
|
-
}
|
|
870
|
+
Badge_module_default[variant],
|
|
871
|
+
Badge_module_default[`color-${hue}`],
|
|
872
|
+
Badge_module_default[`radius-${radius}`]
|
|
872
873
|
);
|
|
873
874
|
return /* @__PURE__ */ import_react5.default.createElement(
|
|
874
875
|
Box,
|
|
@@ -880,7 +881,7 @@ var Badge = (0, import_react5.forwardRef)(
|
|
|
880
881
|
direction: "row",
|
|
881
882
|
...restProps
|
|
882
883
|
},
|
|
883
|
-
children
|
|
884
|
+
renderBadgeChildren(children)
|
|
884
885
|
);
|
|
885
886
|
}
|
|
886
887
|
);
|
|
@@ -3594,21 +3595,32 @@ var TimePicker = ({
|
|
|
3594
3595
|
value: currentTime.toISOString(),
|
|
3595
3596
|
label: currentTime.toLocaleTimeString(locales, dateDisplayOptions)
|
|
3596
3597
|
});
|
|
3597
|
-
currentTime.setSeconds(
|
|
3598
|
+
currentTime.setSeconds(currentTime.getSeconds() + interval);
|
|
3598
3599
|
}
|
|
3599
3600
|
return timeOptions;
|
|
3600
3601
|
};
|
|
3602
|
+
const options = generateTimes();
|
|
3603
|
+
let valueDate;
|
|
3604
|
+
if (typeof value === "string") {
|
|
3605
|
+
valueDate = new Date(value);
|
|
3606
|
+
} else if (typeof value === "number") {
|
|
3607
|
+
valueDate = new Date(value);
|
|
3608
|
+
}
|
|
3609
|
+
const matchingOption = valueDate && !Number.isNaN(valueDate.getTime()) ? options.find(({ value: optionValue }) => {
|
|
3610
|
+
const optionDate = new Date(optionValue);
|
|
3611
|
+
return optionDate.getHours() === valueDate.getHours() && optionDate.getMinutes() === valueDate.getMinutes() && optionDate.getSeconds() === valueDate.getSeconds();
|
|
3612
|
+
}) : void 0;
|
|
3601
3613
|
return /* @__PURE__ */ import_react46.default.createElement(
|
|
3602
|
-
|
|
3614
|
+
SelectInputNative,
|
|
3603
3615
|
{
|
|
3604
3616
|
...restProps,
|
|
3605
3617
|
id,
|
|
3606
3618
|
name,
|
|
3607
3619
|
label,
|
|
3608
3620
|
onChange,
|
|
3609
|
-
options
|
|
3621
|
+
options,
|
|
3610
3622
|
placeholder,
|
|
3611
|
-
value
|
|
3623
|
+
value: matchingOption?.value ?? value
|
|
3612
3624
|
}
|
|
3613
3625
|
);
|
|
3614
3626
|
};
|
|
@@ -3617,7 +3629,6 @@ var TimePicker = ({
|
|
|
3617
3629
|
var FormikTimePicker = ({
|
|
3618
3630
|
field: { name, onBlur, onChange: formikOnChange, value },
|
|
3619
3631
|
form: { touched, errors },
|
|
3620
|
-
options,
|
|
3621
3632
|
onChange,
|
|
3622
3633
|
...props
|
|
3623
3634
|
}) => /* @__PURE__ */ import_react47.default.createElement(
|
|
@@ -3628,92 +3639,16 @@ var FormikTimePicker = ({
|
|
|
3628
3639
|
onBlur,
|
|
3629
3640
|
onChange: onChange ?? formikOnChange,
|
|
3630
3641
|
value,
|
|
3631
|
-
error: (0, import_formik10.getIn)(touched, name) && (0, import_formik10.getIn)(errors, name)
|
|
3632
|
-
options
|
|
3642
|
+
error: (0, import_formik10.getIn)(touched, name) && (0, import_formik10.getIn)(errors, name)
|
|
3633
3643
|
}
|
|
3634
3644
|
);
|
|
3635
3645
|
|
|
3636
|
-
// src/components/Formik/
|
|
3646
|
+
// src/components/Formik/FormikSwitch/FormikSwitch.tsx
|
|
3637
3647
|
var import_react49 = __toESM(require("react"));
|
|
3638
3648
|
var import_formik11 = require("formik");
|
|
3639
3649
|
|
|
3640
|
-
// src/components/TimePickerNative/TimePickerNative.tsx
|
|
3641
|
-
var import_react48 = __toESM(require("react"));
|
|
3642
|
-
var TimePickerNative = ({
|
|
3643
|
-
id,
|
|
3644
|
-
name,
|
|
3645
|
-
label,
|
|
3646
|
-
onChange,
|
|
3647
|
-
value,
|
|
3648
|
-
dateDisplayOptions = { hour: "2-digit", minute: "2-digit" },
|
|
3649
|
-
endTime = void 0,
|
|
3650
|
-
interval = 900,
|
|
3651
|
-
locales = "en-US",
|
|
3652
|
-
placeholder = "HH:MM",
|
|
3653
|
-
startTime = void 0,
|
|
3654
|
-
...restProps
|
|
3655
|
-
}) => {
|
|
3656
|
-
const generateTimes = () => {
|
|
3657
|
-
const first = /* @__PURE__ */ new Date();
|
|
3658
|
-
first.setHours(startTime?.hour || 0, startTime?.minute || 0, 0, 0);
|
|
3659
|
-
const last = /* @__PURE__ */ new Date();
|
|
3660
|
-
last.setHours(
|
|
3661
|
-
endTime?.hour || first.getHours() + 24,
|
|
3662
|
-
endTime?.minute || 0,
|
|
3663
|
-
0,
|
|
3664
|
-
0
|
|
3665
|
-
);
|
|
3666
|
-
const timeOptions = [];
|
|
3667
|
-
const currentTime = new Date(first);
|
|
3668
|
-
while (currentTime < last) {
|
|
3669
|
-
timeOptions.push({
|
|
3670
|
-
value: currentTime.toISOString(),
|
|
3671
|
-
label: currentTime.toLocaleTimeString(locales, dateDisplayOptions)
|
|
3672
|
-
});
|
|
3673
|
-
currentTime.setSeconds(first.getSeconds() + interval);
|
|
3674
|
-
}
|
|
3675
|
-
return timeOptions;
|
|
3676
|
-
};
|
|
3677
|
-
const options = generateTimes();
|
|
3678
|
-
return /* @__PURE__ */ import_react48.default.createElement(
|
|
3679
|
-
SelectInputNative,
|
|
3680
|
-
{
|
|
3681
|
-
...restProps,
|
|
3682
|
-
id,
|
|
3683
|
-
name,
|
|
3684
|
-
label,
|
|
3685
|
-
onChange,
|
|
3686
|
-
options,
|
|
3687
|
-
placeholder,
|
|
3688
|
-
value
|
|
3689
|
-
}
|
|
3690
|
-
);
|
|
3691
|
-
};
|
|
3692
|
-
|
|
3693
|
-
// src/components/Formik/FormikTimePickerNative/FormikTimePickerNative.tsx
|
|
3694
|
-
var FormikTimePickerNative = ({
|
|
3695
|
-
field: { name, onBlur, onChange: formikOnChange, value },
|
|
3696
|
-
form: { touched, errors },
|
|
3697
|
-
onChange,
|
|
3698
|
-
...props
|
|
3699
|
-
}) => /* @__PURE__ */ import_react49.default.createElement(
|
|
3700
|
-
TimePickerNative,
|
|
3701
|
-
{
|
|
3702
|
-
...props,
|
|
3703
|
-
name,
|
|
3704
|
-
onBlur,
|
|
3705
|
-
onChange: onChange ?? formikOnChange,
|
|
3706
|
-
value,
|
|
3707
|
-
error: (0, import_formik11.getIn)(touched, name) && (0, import_formik11.getIn)(errors, name)
|
|
3708
|
-
}
|
|
3709
|
-
);
|
|
3710
|
-
|
|
3711
|
-
// src/components/Formik/FormikSwitch/FormikSwitch.tsx
|
|
3712
|
-
var import_react51 = __toESM(require("react"));
|
|
3713
|
-
var import_formik12 = require("formik");
|
|
3714
|
-
|
|
3715
3650
|
// src/components/Switch/Switch.tsx
|
|
3716
|
-
var
|
|
3651
|
+
var import_react48 = __toESM(require("react"));
|
|
3717
3652
|
var import_classnames27 = __toESM(require("classnames"));
|
|
3718
3653
|
|
|
3719
3654
|
// src/components/Switch/Switch.module.scss
|
|
@@ -3786,22 +3721,22 @@ var Switch = ({
|
|
|
3786
3721
|
requiredIndicator,
|
|
3787
3722
|
size
|
|
3788
3723
|
};
|
|
3789
|
-
return /* @__PURE__ */
|
|
3724
|
+
return /* @__PURE__ */ import_react48.default.createElement(Box, { className }, /* @__PURE__ */ import_react48.default.createElement(Box, { className: wrapperClasses }, /* @__PURE__ */ import_react48.default.createElement(FormLabel, { ...labelProps }, /* @__PURE__ */ import_react48.default.createElement("input", { ...inputProps }), /* @__PURE__ */ import_react48.default.createElement(
|
|
3790
3725
|
"span",
|
|
3791
3726
|
{
|
|
3792
3727
|
"aria-hidden": "true",
|
|
3793
3728
|
className: trackClasses,
|
|
3794
3729
|
"data-testid": "switchTrack"
|
|
3795
3730
|
},
|
|
3796
|
-
/* @__PURE__ */
|
|
3797
|
-
), !hideLabel && /* @__PURE__ */
|
|
3731
|
+
/* @__PURE__ */ import_react48.default.createElement("span", { className: thumbClasses, "data-testid": "switchThumb" })
|
|
3732
|
+
), !hideLabel && /* @__PURE__ */ import_react48.default.createElement(
|
|
3798
3733
|
Box,
|
|
3799
3734
|
{
|
|
3800
3735
|
gap: "2xs",
|
|
3801
3736
|
className: helpText && (size === "md" || size === "lg") ? "m-top-2xs" : ""
|
|
3802
3737
|
},
|
|
3803
|
-
label && /* @__PURE__ */
|
|
3804
|
-
helpText && /* @__PURE__ */
|
|
3738
|
+
label && /* @__PURE__ */ import_react48.default.createElement("div", null, label),
|
|
3739
|
+
helpText && /* @__PURE__ */ import_react48.default.createElement(
|
|
3805
3740
|
Box,
|
|
3806
3741
|
{
|
|
3807
3742
|
as: "p",
|
|
@@ -3812,7 +3747,7 @@ var Switch = ({
|
|
|
3812
3747
|
},
|
|
3813
3748
|
helpText
|
|
3814
3749
|
)
|
|
3815
|
-
))), error && error !== true && /* @__PURE__ */
|
|
3750
|
+
))), error && error !== true && /* @__PURE__ */ import_react48.default.createElement(InputValidationMessage, null, error));
|
|
3816
3751
|
};
|
|
3817
3752
|
|
|
3818
3753
|
// src/components/Formik/FormikSwitch/FormikSwitch.tsx
|
|
@@ -3827,10 +3762,10 @@ var FormikSwitch = ({
|
|
|
3827
3762
|
},
|
|
3828
3763
|
form: { touched, errors },
|
|
3829
3764
|
...props
|
|
3830
|
-
}) => /* @__PURE__ */
|
|
3765
|
+
}) => /* @__PURE__ */ import_react49.default.createElement(
|
|
3831
3766
|
Switch,
|
|
3832
3767
|
{
|
|
3833
|
-
error: (0,
|
|
3768
|
+
error: (0, import_formik11.getIn)(touched, name) && (0, import_formik11.getIn)(errors, name),
|
|
3834
3769
|
isChecked: value,
|
|
3835
3770
|
onBlur,
|
|
3836
3771
|
onChange,
|
|
@@ -3839,11 +3774,11 @@ var FormikSwitch = ({
|
|
|
3839
3774
|
);
|
|
3840
3775
|
|
|
3841
3776
|
// src/components/Formik/FormikToggleGroup/FormikToggleGroup.tsx
|
|
3842
|
-
var
|
|
3843
|
-
var
|
|
3777
|
+
var import_react51 = __toESM(require("react"));
|
|
3778
|
+
var import_formik12 = require("formik");
|
|
3844
3779
|
|
|
3845
3780
|
// src/components/ToggleGroup/ToggleGroup.tsx
|
|
3846
|
-
var
|
|
3781
|
+
var import_react50 = __toESM(require("react"));
|
|
3847
3782
|
var ToggleGroupPrimitive = __toESM(require("@radix-ui/react-toggle-group"));
|
|
3848
3783
|
|
|
3849
3784
|
// src/components/ToggleGroup/ToggleGroup.module.scss
|
|
@@ -3851,11 +3786,11 @@ var ToggleGroup_module_default = { "item": "item__R2aaI", "outline": "outline__F
|
|
|
3851
3786
|
|
|
3852
3787
|
// src/components/ToggleGroup/ToggleGroup.tsx
|
|
3853
3788
|
var import_classnames28 = __toESM(require("classnames"));
|
|
3854
|
-
var ToggleGroupContext = (0,
|
|
3789
|
+
var ToggleGroupContext = (0, import_react50.createContext)({
|
|
3855
3790
|
variant: "default"
|
|
3856
3791
|
});
|
|
3857
|
-
var ToggleGroup = (0,
|
|
3858
|
-
({ className, variant = "default", children, gap = "xs", error, ...props }, ref) => /* @__PURE__ */
|
|
3792
|
+
var ToggleGroup = (0, import_react50.forwardRef)(
|
|
3793
|
+
({ className, variant = "default", children, gap = "xs", error, ...props }, ref) => /* @__PURE__ */ import_react50.default.createElement("div", null, /* @__PURE__ */ import_react50.default.createElement(
|
|
3859
3794
|
ToggleGroupPrimitive.Root,
|
|
3860
3795
|
{
|
|
3861
3796
|
ref,
|
|
@@ -3866,14 +3801,14 @@ var ToggleGroup = (0, import_react52.forwardRef)(
|
|
|
3866
3801
|
),
|
|
3867
3802
|
...props
|
|
3868
3803
|
},
|
|
3869
|
-
/* @__PURE__ */
|
|
3870
|
-
), error && /* @__PURE__ */
|
|
3804
|
+
/* @__PURE__ */ import_react50.default.createElement(ToggleGroupContext.Provider, { value: { variant } }, children)
|
|
3805
|
+
), error && /* @__PURE__ */ import_react50.default.createElement(InputValidationMessage, null, error))
|
|
3871
3806
|
);
|
|
3872
3807
|
ToggleGroup.displayName = "ToggleGroup";
|
|
3873
|
-
var ToggleGroupItem = (0,
|
|
3874
|
-
const { variant: contextVariant } = (0,
|
|
3808
|
+
var ToggleGroupItem = (0, import_react50.forwardRef)(({ className, children, value, variant, ...props }, ref) => {
|
|
3809
|
+
const { variant: contextVariant } = (0, import_react50.useContext)(ToggleGroupContext);
|
|
3875
3810
|
const appliedVariant = variant || contextVariant;
|
|
3876
|
-
return /* @__PURE__ */
|
|
3811
|
+
return /* @__PURE__ */ import_react50.default.createElement(
|
|
3877
3812
|
ToggleGroupPrimitive.Item,
|
|
3878
3813
|
{
|
|
3879
3814
|
ref,
|
|
@@ -3901,7 +3836,7 @@ var FormikToggleGroup = ({
|
|
|
3901
3836
|
children,
|
|
3902
3837
|
...props
|
|
3903
3838
|
}) => {
|
|
3904
|
-
return /* @__PURE__ */
|
|
3839
|
+
return /* @__PURE__ */ import_react51.default.createElement(Box, { gap: "sm" }, (label || helpText) && /* @__PURE__ */ import_react51.default.createElement("div", null, label && /* @__PURE__ */ import_react51.default.createElement(Box, { fontSize: "sm" }, label), helpText && /* @__PURE__ */ import_react51.default.createElement(HelpText, null, helpText)), /* @__PURE__ */ import_react51.default.createElement(
|
|
3905
3840
|
ToggleGroup,
|
|
3906
3841
|
{
|
|
3907
3842
|
...props,
|
|
@@ -3909,10 +3844,10 @@ var FormikToggleGroup = ({
|
|
|
3909
3844
|
onBlur,
|
|
3910
3845
|
onValueChange: (value2) => setFieldValue(name, value2),
|
|
3911
3846
|
value,
|
|
3912
|
-
error: (0,
|
|
3847
|
+
error: (0, import_formik12.getIn)(touched, name) && (0, import_formik12.getIn)(errors, name),
|
|
3913
3848
|
type: "single"
|
|
3914
3849
|
},
|
|
3915
|
-
children ? children : options.map((option) => /* @__PURE__ */
|
|
3850
|
+
children ? children : options.map((option) => /* @__PURE__ */ import_react51.default.createElement(
|
|
3916
3851
|
ToggleGroupItem,
|
|
3917
3852
|
{
|
|
3918
3853
|
id: option.id,
|
|
@@ -3926,8 +3861,8 @@ var FormikToggleGroup = ({
|
|
|
3926
3861
|
};
|
|
3927
3862
|
|
|
3928
3863
|
// src/components/Formik/FormikToggleGroupMulti/FormikToggleGroupMulti.tsx
|
|
3929
|
-
var
|
|
3930
|
-
var
|
|
3864
|
+
var import_react52 = __toESM(require("react"));
|
|
3865
|
+
var import_formik13 = require("formik");
|
|
3931
3866
|
var FormikToggleGroupMulti = ({
|
|
3932
3867
|
name,
|
|
3933
3868
|
options,
|
|
@@ -3938,8 +3873,8 @@ var FormikToggleGroupMulti = ({
|
|
|
3938
3873
|
gap,
|
|
3939
3874
|
...props
|
|
3940
3875
|
}) => {
|
|
3941
|
-
const [field, meta, helpers] = (0,
|
|
3942
|
-
return /* @__PURE__ */
|
|
3876
|
+
const [field, meta, helpers] = (0, import_formik13.useField)(name);
|
|
3877
|
+
return /* @__PURE__ */ import_react52.default.createElement(Box, { gap: "sm" }, (label || helpText) && /* @__PURE__ */ import_react52.default.createElement("div", null, label && /* @__PURE__ */ import_react52.default.createElement(Box, { fontSize: "sm" }, label), helpText && /* @__PURE__ */ import_react52.default.createElement(HelpText, null, helpText)), /* @__PURE__ */ import_react52.default.createElement(import_formik13.FieldArray, { name }, () => /* @__PURE__ */ import_react52.default.createElement(
|
|
3943
3878
|
ToggleGroup,
|
|
3944
3879
|
{
|
|
3945
3880
|
...props,
|
|
@@ -3954,7 +3889,7 @@ var FormikToggleGroupMulti = ({
|
|
|
3954
3889
|
type: "multiple",
|
|
3955
3890
|
variant
|
|
3956
3891
|
},
|
|
3957
|
-
children ? children : options.map((option) => /* @__PURE__ */
|
|
3892
|
+
children ? children : options.map((option) => /* @__PURE__ */ import_react52.default.createElement(
|
|
3958
3893
|
ToggleGroupItem,
|
|
3959
3894
|
{
|
|
3960
3895
|
key: option.id,
|
|
@@ -3968,14 +3903,14 @@ var FormikToggleGroupMulti = ({
|
|
|
3968
3903
|
};
|
|
3969
3904
|
|
|
3970
3905
|
// src/components/Modal/Modal.tsx
|
|
3971
|
-
var
|
|
3906
|
+
var import_react56 = __toESM(require("react"));
|
|
3972
3907
|
var import_react_modal2 = __toESM(require("react-modal"));
|
|
3973
3908
|
var import_react_focus_lock2 = __toESM(require("react-focus-lock"));
|
|
3974
3909
|
var import_react_remove_scroll2 = require("react-remove-scroll");
|
|
3975
3910
|
var import_classnames29 = __toESM(require("classnames"));
|
|
3976
3911
|
|
|
3977
3912
|
// src/components/Modal/components/ModalFooter/ModalFooter.tsx
|
|
3978
|
-
var
|
|
3913
|
+
var import_react53 = __toESM(require("react"));
|
|
3979
3914
|
var ModalFooter = ({
|
|
3980
3915
|
children,
|
|
3981
3916
|
padding,
|
|
@@ -3985,7 +3920,7 @@ var ModalFooter = ({
|
|
|
3985
3920
|
gap = "md",
|
|
3986
3921
|
style,
|
|
3987
3922
|
...restProps
|
|
3988
|
-
}) => /* @__PURE__ */
|
|
3923
|
+
}) => /* @__PURE__ */ import_react53.default.createElement(
|
|
3989
3924
|
Box,
|
|
3990
3925
|
{
|
|
3991
3926
|
padding,
|
|
@@ -4003,7 +3938,7 @@ var ModalFooter = ({
|
|
|
4003
3938
|
);
|
|
4004
3939
|
|
|
4005
3940
|
// src/components/Modal/components/ModalHeader/ModalHeader.tsx
|
|
4006
|
-
var
|
|
3941
|
+
var import_react54 = __toESM(require("react"));
|
|
4007
3942
|
var ModalHeader = ({
|
|
4008
3943
|
id,
|
|
4009
3944
|
onDismiss,
|
|
@@ -4015,7 +3950,7 @@ var ModalHeader = ({
|
|
|
4015
3950
|
...restProps
|
|
4016
3951
|
}) => {
|
|
4017
3952
|
const justifyContentValue = title || children ? "space-between" : "flex-end";
|
|
4018
|
-
return /* @__PURE__ */
|
|
3953
|
+
return /* @__PURE__ */ import_react54.default.createElement(
|
|
4019
3954
|
Box,
|
|
4020
3955
|
{
|
|
4021
3956
|
direction,
|
|
@@ -4028,8 +3963,8 @@ var ModalHeader = ({
|
|
|
4028
3963
|
},
|
|
4029
3964
|
...restProps
|
|
4030
3965
|
},
|
|
4031
|
-
(title || children) && /* @__PURE__ */
|
|
4032
|
-
onDismiss && /* @__PURE__ */
|
|
3966
|
+
(title || children) && /* @__PURE__ */ import_react54.default.createElement(Box, { gap: "2xs" }, title && /* @__PURE__ */ import_react54.default.createElement(Box, { as: "h4", fontSize: { base: "md", tablet: "lg" }, id }, title), children),
|
|
3967
|
+
onDismiss && /* @__PURE__ */ import_react54.default.createElement(
|
|
4033
3968
|
Button,
|
|
4034
3969
|
{
|
|
4035
3970
|
"aria-label": "close",
|
|
@@ -4044,14 +3979,14 @@ var ModalHeader = ({
|
|
|
4044
3979
|
};
|
|
4045
3980
|
|
|
4046
3981
|
// src/components/Modal/components/ModalBody/ModalBody.tsx
|
|
4047
|
-
var
|
|
3982
|
+
var import_react55 = __toESM(require("react"));
|
|
4048
3983
|
var ModalBody = ({
|
|
4049
3984
|
children,
|
|
4050
3985
|
flex = "auto",
|
|
4051
3986
|
overflow = "auto",
|
|
4052
3987
|
height = "100",
|
|
4053
3988
|
...restProps
|
|
4054
|
-
}) => /* @__PURE__ */
|
|
3989
|
+
}) => /* @__PURE__ */ import_react55.default.createElement(
|
|
4055
3990
|
Box,
|
|
4056
3991
|
{
|
|
4057
3992
|
flex,
|
|
@@ -4067,7 +4002,7 @@ var ModalBody = ({
|
|
|
4067
4002
|
var Modal_module_default = { "modal-close": "modal-close__ZbvmC", "modal": "modal__hmSZ2", "modal-content": "modal-content__c1lVi" };
|
|
4068
4003
|
|
|
4069
4004
|
// src/components/Modal/Modal.tsx
|
|
4070
|
-
var ModalBaseComponent = (0,
|
|
4005
|
+
var ModalBaseComponent = (0, import_react56.forwardRef)(
|
|
4071
4006
|
({
|
|
4072
4007
|
ariaLabel,
|
|
4073
4008
|
ariaLabelledBy,
|
|
@@ -4085,7 +4020,7 @@ var ModalBaseComponent = (0, import_react58.forwardRef)(
|
|
|
4085
4020
|
style,
|
|
4086
4021
|
...restProps
|
|
4087
4022
|
}, ref) => {
|
|
4088
|
-
const activateFocusLock = (0,
|
|
4023
|
+
const activateFocusLock = (0, import_react56.useCallback)(() => {
|
|
4089
4024
|
setTimeout(() => {
|
|
4090
4025
|
if (initialFocusRef && initialFocusRef.current) {
|
|
4091
4026
|
initialFocusRef.current.focus();
|
|
@@ -4106,7 +4041,7 @@ var ModalBaseComponent = (0, import_react58.forwardRef)(
|
|
|
4106
4041
|
);
|
|
4107
4042
|
if (!isOpen) return null;
|
|
4108
4043
|
const parentElement = containerRef?.current ? containerRef.current : void 0;
|
|
4109
|
-
return /* @__PURE__ */
|
|
4044
|
+
return /* @__PURE__ */ import_react56.default.createElement(
|
|
4110
4045
|
import_react_focus_lock2.default,
|
|
4111
4046
|
{
|
|
4112
4047
|
autoFocus: true,
|
|
@@ -4115,7 +4050,7 @@ var ModalBaseComponent = (0, import_react58.forwardRef)(
|
|
|
4115
4050
|
onActivation: activateFocusLock,
|
|
4116
4051
|
crossFrame: true
|
|
4117
4052
|
},
|
|
4118
|
-
/* @__PURE__ */
|
|
4053
|
+
/* @__PURE__ */ import_react56.default.createElement(import_react_remove_scroll2.RemoveScroll, { allowPinchZoom, enabled: isOpen }, /* @__PURE__ */ import_react56.default.createElement(Box, { ref }, /* @__PURE__ */ import_react56.default.createElement(
|
|
4119
4054
|
import_react_modal2.default,
|
|
4120
4055
|
{
|
|
4121
4056
|
isOpen,
|
|
@@ -4127,7 +4062,7 @@ var ModalBaseComponent = (0, import_react58.forwardRef)(
|
|
|
4127
4062
|
style: { content: { ...maxWidthCss.styles, ...style } },
|
|
4128
4063
|
...restProps
|
|
4129
4064
|
},
|
|
4130
|
-
/* @__PURE__ */
|
|
4065
|
+
/* @__PURE__ */ import_react56.default.createElement(
|
|
4131
4066
|
Box,
|
|
4132
4067
|
{
|
|
4133
4068
|
"aria-label": ariaLabel,
|
|
@@ -4153,7 +4088,7 @@ var Modal = (() => {
|
|
|
4153
4088
|
})();
|
|
4154
4089
|
|
|
4155
4090
|
// src/components/Pagination/Pagination.tsx
|
|
4156
|
-
var
|
|
4091
|
+
var import_react57 = __toESM(require("react"));
|
|
4157
4092
|
var import_classnames30 = __toESM(require("classnames"));
|
|
4158
4093
|
|
|
4159
4094
|
// src/components/Pagination/Pagination.utilities.ts
|
|
@@ -4207,30 +4142,30 @@ var Pagination = ({
|
|
|
4207
4142
|
numberOfPagesDisplayed = 5,
|
|
4208
4143
|
prevPageText = "Previous"
|
|
4209
4144
|
}) => {
|
|
4210
|
-
const pageTotal = (0,
|
|
4145
|
+
const pageTotal = (0, import_react57.useMemo)(() => {
|
|
4211
4146
|
if (itemsPerPage <= 0) return 1;
|
|
4212
4147
|
return generatePageTotal(totalItemsCount, itemsPerPage);
|
|
4213
4148
|
}, [totalItemsCount, itemsPerPage]);
|
|
4214
4149
|
const validActivePage = Math.max(1, Math.min(activePage, pageTotal));
|
|
4215
|
-
const activeListRange = (0,
|
|
4150
|
+
const activeListRange = (0, import_react57.useMemo)(
|
|
4216
4151
|
() => generateActiveListRange(validActivePage, totalItemsCount, itemsPerPage),
|
|
4217
4152
|
[validActivePage, totalItemsCount, itemsPerPage]
|
|
4218
4153
|
);
|
|
4219
|
-
const pages = (0,
|
|
4154
|
+
const pages = (0, import_react57.useMemo)(
|
|
4220
4155
|
() => generatePages(pageTotal, validActivePage, numberOfPagesDisplayed),
|
|
4221
4156
|
[pageTotal, validActivePage, numberOfPagesDisplayed]
|
|
4222
4157
|
);
|
|
4223
|
-
const paginationClassNames = (0,
|
|
4158
|
+
const paginationClassNames = (0, import_react57.useMemo)(
|
|
4224
4159
|
() => (0, import_classnames30.default)(className),
|
|
4225
4160
|
[className]
|
|
4226
4161
|
);
|
|
4227
|
-
const activeListRangeText = (0,
|
|
4162
|
+
const activeListRangeText = (0, import_react57.useMemo)(() => {
|
|
4228
4163
|
if (totalItemsCount === 0) {
|
|
4229
4164
|
return "No items to display";
|
|
4230
4165
|
}
|
|
4231
4166
|
return `Showing ${activeListRange.first}-${activeListRange.last} of ${totalItemsCount}`;
|
|
4232
4167
|
}, [activeListRange, totalItemsCount]);
|
|
4233
|
-
return /* @__PURE__ */
|
|
4168
|
+
return /* @__PURE__ */ import_react57.default.createElement(
|
|
4234
4169
|
Box,
|
|
4235
4170
|
{
|
|
4236
4171
|
as: "nav",
|
|
@@ -4239,7 +4174,7 @@ var Pagination = ({
|
|
|
4239
4174
|
justifyContent: "space-between",
|
|
4240
4175
|
className: paginationClassNames
|
|
4241
4176
|
},
|
|
4242
|
-
/* @__PURE__ */
|
|
4177
|
+
/* @__PURE__ */ import_react57.default.createElement(
|
|
4243
4178
|
Box,
|
|
4244
4179
|
{
|
|
4245
4180
|
direction: "row",
|
|
@@ -4247,7 +4182,7 @@ var Pagination = ({
|
|
|
4247
4182
|
flex: { base: "auto", tablet: "none" },
|
|
4248
4183
|
gap: isCompact ? "xs" : "sm"
|
|
4249
4184
|
},
|
|
4250
|
-
/* @__PURE__ */
|
|
4185
|
+
/* @__PURE__ */ import_react57.default.createElement(
|
|
4251
4186
|
Button,
|
|
4252
4187
|
{
|
|
4253
4188
|
variant: "secondary",
|
|
@@ -4257,8 +4192,8 @@ var Pagination = ({
|
|
|
4257
4192
|
},
|
|
4258
4193
|
prevPageText
|
|
4259
4194
|
),
|
|
4260
|
-
arePagesVisible && /* @__PURE__ */
|
|
4261
|
-
return isPage ? /* @__PURE__ */
|
|
4195
|
+
arePagesVisible && /* @__PURE__ */ import_react57.default.createElement(Box, { direction: "row", gap: "2xs" }, pages.map(({ pageNumber, isPage }, index) => {
|
|
4196
|
+
return isPage ? /* @__PURE__ */ import_react57.default.createElement(
|
|
4262
4197
|
Button,
|
|
4263
4198
|
{
|
|
4264
4199
|
key: pageNumber,
|
|
@@ -4271,7 +4206,7 @@ var Pagination = ({
|
|
|
4271
4206
|
className
|
|
4272
4207
|
},
|
|
4273
4208
|
pageNumber
|
|
4274
|
-
) : /* @__PURE__ */
|
|
4209
|
+
) : /* @__PURE__ */ import_react57.default.createElement(
|
|
4275
4210
|
Box,
|
|
4276
4211
|
{
|
|
4277
4212
|
key: `ellipsis-${index}`,
|
|
@@ -4285,7 +4220,7 @@ var Pagination = ({
|
|
|
4285
4220
|
"..."
|
|
4286
4221
|
);
|
|
4287
4222
|
})),
|
|
4288
|
-
/* @__PURE__ */
|
|
4223
|
+
/* @__PURE__ */ import_react57.default.createElement(
|
|
4289
4224
|
Button,
|
|
4290
4225
|
{
|
|
4291
4226
|
variant: "secondary",
|
|
@@ -4296,7 +4231,7 @@ var Pagination = ({
|
|
|
4296
4231
|
nextPageText
|
|
4297
4232
|
)
|
|
4298
4233
|
),
|
|
4299
|
-
/* @__PURE__ */
|
|
4234
|
+
/* @__PURE__ */ import_react57.default.createElement(
|
|
4300
4235
|
Box,
|
|
4301
4236
|
{
|
|
4302
4237
|
as: "p",
|
|
@@ -4312,7 +4247,7 @@ var Pagination = ({
|
|
|
4312
4247
|
};
|
|
4313
4248
|
|
|
4314
4249
|
// src/components/Popover/Popover.tsx
|
|
4315
|
-
var
|
|
4250
|
+
var import_react58 = __toESM(require("react"));
|
|
4316
4251
|
var PopoverPrimitive = __toESM(require("@radix-ui/react-popover"));
|
|
4317
4252
|
var import_classnames31 = __toESM(require("classnames"));
|
|
4318
4253
|
|
|
@@ -4324,8 +4259,8 @@ var Popover = PopoverPrimitive.Root;
|
|
|
4324
4259
|
var PopoverTrigger = PopoverPrimitive.Trigger;
|
|
4325
4260
|
var PopoverAnchor = PopoverPrimitive.Anchor;
|
|
4326
4261
|
var PopoverPortal = PopoverPrimitive.Portal;
|
|
4327
|
-
var PopoverContent = (0,
|
|
4328
|
-
return /* @__PURE__ */
|
|
4262
|
+
var PopoverContent = (0, import_react58.forwardRef)(({ className, align = "center", sideOffset = 4, ...props }, ref) => {
|
|
4263
|
+
return /* @__PURE__ */ import_react58.default.createElement(
|
|
4329
4264
|
PopoverPrimitive.Content,
|
|
4330
4265
|
{
|
|
4331
4266
|
ref,
|
|
@@ -4339,7 +4274,7 @@ var PopoverContent = (0, import_react60.forwardRef)(({ className, align = "cente
|
|
|
4339
4274
|
PopoverContent.displayName = "PopoverContent";
|
|
4340
4275
|
|
|
4341
4276
|
// src/components/RangeInput/RangeInput.tsx
|
|
4342
|
-
var
|
|
4277
|
+
var import_react59 = __toESM(require("react"));
|
|
4343
4278
|
var import_classnames32 = __toESM(require("classnames"));
|
|
4344
4279
|
|
|
4345
4280
|
// src/components/RangeInput/RangeInput.module.scss
|
|
@@ -4356,7 +4291,7 @@ var RangeInput = ({
|
|
|
4356
4291
|
...restProps
|
|
4357
4292
|
}) => {
|
|
4358
4293
|
const currentProgress = value > 0 ? value / max * 100 : 0;
|
|
4359
|
-
return /* @__PURE__ */
|
|
4294
|
+
return /* @__PURE__ */ import_react59.default.createElement(
|
|
4360
4295
|
"input",
|
|
4361
4296
|
{
|
|
4362
4297
|
...restProps,
|
|
@@ -4381,24 +4316,24 @@ var RangeInput = ({
|
|
|
4381
4316
|
};
|
|
4382
4317
|
|
|
4383
4318
|
// src/components/ResponsiveProvider/ResponsiveProvider.tsx
|
|
4384
|
-
var
|
|
4319
|
+
var import_react61 = __toESM(require("react"));
|
|
4385
4320
|
|
|
4386
4321
|
// src/hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.ts
|
|
4387
|
-
var
|
|
4388
|
-
var useIsomorphicLayoutEffect = typeof window !== "undefined" ?
|
|
4322
|
+
var import_react60 = require("react");
|
|
4323
|
+
var useIsomorphicLayoutEffect = typeof window !== "undefined" ? import_react60.useLayoutEffect : import_react60.useEffect;
|
|
4389
4324
|
|
|
4390
4325
|
// src/components/ResponsiveProvider/ResponsiveProvider.tsx
|
|
4391
|
-
var ResponsiveContext = (0,
|
|
4326
|
+
var ResponsiveContext = (0, import_react61.createContext)({
|
|
4392
4327
|
isCreated: false
|
|
4393
4328
|
});
|
|
4394
4329
|
var ResponsiveProvider = ({
|
|
4395
4330
|
children = null,
|
|
4396
4331
|
throttle = 50
|
|
4397
4332
|
}) => {
|
|
4398
|
-
const [innerWidth, setInnerWidth] = (0,
|
|
4399
|
-
const [innerHeight, setInnerHeight] = (0,
|
|
4400
|
-
const [outerWidth, setOuterWidth] = (0,
|
|
4401
|
-
const [outerHeight, setOuterHeight] = (0,
|
|
4333
|
+
const [innerWidth, setInnerWidth] = (0, import_react61.useState)(0);
|
|
4334
|
+
const [innerHeight, setInnerHeight] = (0, import_react61.useState)(0);
|
|
4335
|
+
const [outerWidth, setOuterWidth] = (0, import_react61.useState)(0);
|
|
4336
|
+
const [outerHeight, setOuterHeight] = (0, import_react61.useState)(0);
|
|
4402
4337
|
const handleWindowResize = () => {
|
|
4403
4338
|
setInnerWidth(window?.innerWidth ?? 0);
|
|
4404
4339
|
setInnerHeight(window?.innerHeight ?? 0);
|
|
@@ -4420,7 +4355,7 @@ var ResponsiveProvider = ({
|
|
|
4420
4355
|
};
|
|
4421
4356
|
}
|
|
4422
4357
|
}, [throttle]);
|
|
4423
|
-
return /* @__PURE__ */
|
|
4358
|
+
return /* @__PURE__ */ import_react61.default.createElement(
|
|
4424
4359
|
ResponsiveContext.Provider,
|
|
4425
4360
|
{
|
|
4426
4361
|
value: {
|
|
@@ -4436,19 +4371,19 @@ var ResponsiveProvider = ({
|
|
|
4436
4371
|
};
|
|
4437
4372
|
|
|
4438
4373
|
// src/components/Sidebar/Sidebar.tsx
|
|
4439
|
-
var
|
|
4374
|
+
var import_react62 = __toESM(require("react"));
|
|
4440
4375
|
var import_react_slot3 = require("@radix-ui/react-slot");
|
|
4441
4376
|
var import_classnames34 = __toESM(require("classnames"));
|
|
4442
4377
|
|
|
4443
4378
|
// src/hooks/useIsMobile/useIsMobile.tsx
|
|
4444
|
-
var
|
|
4379
|
+
var React56 = __toESM(require("react"));
|
|
4445
4380
|
var desktopBreakpoint = BREAKPOINTS.find((b) => b.name === "desktop");
|
|
4446
4381
|
var MOBILE_BREAKPOINT = desktopBreakpoint ? desktopBreakpoint.minWidth : 0;
|
|
4447
4382
|
function useIsMobile() {
|
|
4448
|
-
const [isMobile, setIsMobile] =
|
|
4383
|
+
const [isMobile, setIsMobile] = React56.useState(
|
|
4449
4384
|
void 0
|
|
4450
4385
|
);
|
|
4451
|
-
|
|
4386
|
+
React56.useEffect(() => {
|
|
4452
4387
|
const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
|
|
4453
4388
|
const onChange = () => {
|
|
4454
4389
|
setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
|
|
@@ -4464,7 +4399,7 @@ function useIsMobile() {
|
|
|
4464
4399
|
var Sidebar_module_default = { "rail": "rail__OwBtB", "group-data-": "group-data-__af4bi" };
|
|
4465
4400
|
|
|
4466
4401
|
// src/components/Tooltip/Tooltip.tsx
|
|
4467
|
-
var
|
|
4402
|
+
var React57 = __toESM(require("react"));
|
|
4468
4403
|
var TooltipPrimitive = __toESM(require("@radix-ui/react-tooltip"));
|
|
4469
4404
|
|
|
4470
4405
|
// src/components/Tooltip/Tooltip.module.scss
|
|
@@ -4476,7 +4411,7 @@ var TooltipProvider = TooltipPrimitive.Provider;
|
|
|
4476
4411
|
var Tooltip = TooltipPrimitive.Root;
|
|
4477
4412
|
var TooltipTrigger = TooltipPrimitive.Trigger;
|
|
4478
4413
|
var TooltipPortal = TooltipPrimitive.Portal;
|
|
4479
|
-
var TooltipContent =
|
|
4414
|
+
var TooltipContent = React57.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ React57.createElement(
|
|
4480
4415
|
TooltipPrimitive.Content,
|
|
4481
4416
|
{
|
|
4482
4417
|
ref,
|
|
@@ -4497,14 +4432,14 @@ var SIDEBAR_RIGHT_WIDTH = "24rem";
|
|
|
4497
4432
|
var SIDEBAR_WIDTH_ICON = "44px";
|
|
4498
4433
|
var SIDEBAR_KEYBOARD_SHORTCUT_LEFT = "[";
|
|
4499
4434
|
var SIDEBAR_KEYBOARD_SHORTCUT_RIGHT = "]";
|
|
4500
|
-
var SidebarIsMobileContext =
|
|
4501
|
-
var SidebarLeftContext =
|
|
4435
|
+
var SidebarIsMobileContext = import_react62.default.createContext(null);
|
|
4436
|
+
var SidebarLeftContext = import_react62.default.createContext(
|
|
4502
4437
|
null
|
|
4503
4438
|
);
|
|
4504
|
-
var SidebarRightContext =
|
|
4439
|
+
var SidebarRightContext = import_react62.default.createContext(
|
|
4505
4440
|
null
|
|
4506
4441
|
);
|
|
4507
|
-
var SidebarSideContext =
|
|
4442
|
+
var SidebarSideContext = import_react62.default.createContext("left");
|
|
4508
4443
|
var resolveSideValue = (value, side, fallback) => {
|
|
4509
4444
|
if (typeof value === "boolean") {
|
|
4510
4445
|
return value;
|
|
@@ -4557,21 +4492,21 @@ var useSidebarSideState = ({
|
|
|
4557
4492
|
);
|
|
4558
4493
|
const controlledOpen = resolveControlledOpen(openProp, side);
|
|
4559
4494
|
const isControlled = typeof controlledOpen === "boolean";
|
|
4560
|
-
const [uncontrolledOpen, setUncontrolledOpen] = (0,
|
|
4495
|
+
const [uncontrolledOpen, setUncontrolledOpen] = (0, import_react62.useState)(
|
|
4561
4496
|
controlledOpen ?? initialDefaultOpen
|
|
4562
4497
|
);
|
|
4563
|
-
const [openMobile, setOpenMobile] = (0,
|
|
4498
|
+
const [openMobile, setOpenMobile] = (0, import_react62.useState)(
|
|
4564
4499
|
() => isMobile ? false : controlledOpen ?? initialDefaultOpen
|
|
4565
4500
|
);
|
|
4566
4501
|
const open = controlledOpen ?? uncontrolledOpen;
|
|
4567
|
-
(0,
|
|
4502
|
+
(0, import_react62.useEffect)(() => {
|
|
4568
4503
|
if (isMobile) {
|
|
4569
4504
|
setOpenMobile(false);
|
|
4570
4505
|
} else {
|
|
4571
4506
|
setUncontrolledOpen(controlledOpen ?? initialDefaultOpen);
|
|
4572
4507
|
}
|
|
4573
4508
|
}, [isMobile, controlledOpen, initialDefaultOpen]);
|
|
4574
|
-
const setOpen = (0,
|
|
4509
|
+
const setOpen = (0, import_react62.useCallback)(
|
|
4575
4510
|
(value) => {
|
|
4576
4511
|
const newOpenState = typeof value === "function" ? value(open) : value;
|
|
4577
4512
|
if (newOpenState === open) {
|
|
@@ -4586,7 +4521,7 @@ var useSidebarSideState = ({
|
|
|
4586
4521
|
},
|
|
4587
4522
|
[open, isControlled, onOpenChange, side, storageKey]
|
|
4588
4523
|
);
|
|
4589
|
-
const toggleSidebar = (0,
|
|
4524
|
+
const toggleSidebar = (0, import_react62.useCallback)(() => {
|
|
4590
4525
|
lastToggledSideRef.current = side;
|
|
4591
4526
|
if (isMobile) {
|
|
4592
4527
|
setOpenMobile((value) => !value);
|
|
@@ -4595,7 +4530,7 @@ var useSidebarSideState = ({
|
|
|
4595
4530
|
}
|
|
4596
4531
|
}, [isMobile, setOpen, side, setOpenMobile, lastToggledSideRef]);
|
|
4597
4532
|
const state = open ? "expanded" : "collapsed";
|
|
4598
|
-
return (0,
|
|
4533
|
+
return (0, import_react62.useMemo)(
|
|
4599
4534
|
() => ({
|
|
4600
4535
|
state,
|
|
4601
4536
|
open,
|
|
@@ -4608,13 +4543,13 @@ var useSidebarSideState = ({
|
|
|
4608
4543
|
);
|
|
4609
4544
|
};
|
|
4610
4545
|
function useSidebar(sideOverride) {
|
|
4611
|
-
const isMobile =
|
|
4546
|
+
const isMobile = import_react62.default.useContext(SidebarIsMobileContext);
|
|
4612
4547
|
if (typeof isMobile !== "boolean") {
|
|
4613
4548
|
throw new Error("useSidebar must be used within a SidebarProvider.");
|
|
4614
4549
|
}
|
|
4615
|
-
const contextSide =
|
|
4550
|
+
const contextSide = import_react62.default.useContext(SidebarSideContext);
|
|
4616
4551
|
const side = sideOverride ?? contextSide;
|
|
4617
|
-
const sideContext =
|
|
4552
|
+
const sideContext = import_react62.default.useContext(
|
|
4618
4553
|
side === "left" ? SidebarLeftContext : SidebarRightContext
|
|
4619
4554
|
);
|
|
4620
4555
|
if (!sideContext) {
|
|
@@ -4626,7 +4561,7 @@ function useSidebar(sideOverride) {
|
|
|
4626
4561
|
side
|
|
4627
4562
|
};
|
|
4628
4563
|
}
|
|
4629
|
-
var SidebarProvider = (0,
|
|
4564
|
+
var SidebarProvider = (0, import_react62.forwardRef)(
|
|
4630
4565
|
({
|
|
4631
4566
|
defaultOpen = true,
|
|
4632
4567
|
open: openProp,
|
|
@@ -4638,9 +4573,9 @@ var SidebarProvider = (0, import_react64.forwardRef)(
|
|
|
4638
4573
|
...props
|
|
4639
4574
|
}, ref) => {
|
|
4640
4575
|
const isMobile = useIsMobile();
|
|
4641
|
-
const lastToggledSideRef =
|
|
4642
|
-
const leftToggleRef =
|
|
4643
|
-
const rightToggleRef =
|
|
4576
|
+
const lastToggledSideRef = import_react62.default.useRef("left");
|
|
4577
|
+
const leftToggleRef = import_react62.default.useRef(null);
|
|
4578
|
+
const rightToggleRef = import_react62.default.useRef(null);
|
|
4644
4579
|
const leftState = useSidebarSideState({
|
|
4645
4580
|
side: "left",
|
|
4646
4581
|
isMobile,
|
|
@@ -4659,13 +4594,13 @@ var SidebarProvider = (0, import_react64.forwardRef)(
|
|
|
4659
4594
|
storageKey,
|
|
4660
4595
|
lastToggledSideRef
|
|
4661
4596
|
});
|
|
4662
|
-
(0,
|
|
4597
|
+
(0, import_react62.useEffect)(() => {
|
|
4663
4598
|
leftToggleRef.current = leftState.toggleSidebar;
|
|
4664
4599
|
}, [leftState.toggleSidebar]);
|
|
4665
|
-
(0,
|
|
4600
|
+
(0, import_react62.useEffect)(() => {
|
|
4666
4601
|
rightToggleRef.current = rightState.toggleSidebar;
|
|
4667
4602
|
}, [rightState.toggleSidebar]);
|
|
4668
|
-
(0,
|
|
4603
|
+
(0, import_react62.useEffect)(() => {
|
|
4669
4604
|
const handleKeyDown = (event) => {
|
|
4670
4605
|
const target = event.target;
|
|
4671
4606
|
if (target && (target.tagName === "INPUT" || target.tagName === "TEXTAREA" || target.tagName === "SELECT" || target.isContentEditable)) {
|
|
@@ -4682,7 +4617,7 @@ var SidebarProvider = (0, import_react64.forwardRef)(
|
|
|
4682
4617
|
window.addEventListener("keydown", handleKeyDown);
|
|
4683
4618
|
return () => window.removeEventListener("keydown", handleKeyDown);
|
|
4684
4619
|
}, []);
|
|
4685
|
-
return /* @__PURE__ */
|
|
4620
|
+
return /* @__PURE__ */ import_react62.default.createElement(SidebarIsMobileContext.Provider, { value: isMobile }, /* @__PURE__ */ import_react62.default.createElement(SidebarLeftContext.Provider, { value: leftState }, /* @__PURE__ */ import_react62.default.createElement(SidebarRightContext.Provider, { value: rightState }, /* @__PURE__ */ import_react62.default.createElement(TooltipProvider, { delayDuration: 0 }, /* @__PURE__ */ import_react62.default.createElement(
|
|
4686
4621
|
"div",
|
|
4687
4622
|
{
|
|
4688
4623
|
style: {
|
|
@@ -4703,23 +4638,23 @@ var SidebarProvider = (0, import_react64.forwardRef)(
|
|
|
4703
4638
|
}
|
|
4704
4639
|
);
|
|
4705
4640
|
SidebarProvider.displayName = "SidebarProvider";
|
|
4706
|
-
var Sidebar =
|
|
4641
|
+
var Sidebar = import_react62.default.forwardRef(
|
|
4707
4642
|
({ side = "left", collapsible = "offcanvas", className, children, ...props }, ref) => {
|
|
4708
4643
|
const { isMobile, state, openMobile, setOpenMobile } = useSidebar(side);
|
|
4709
4644
|
const sidebarWidth = side === "right" ? SIDEBAR_RIGHT_WIDTH : SIDEBAR_WIDTH;
|
|
4710
4645
|
if (isMobile) {
|
|
4711
|
-
return /* @__PURE__ */
|
|
4646
|
+
return /* @__PURE__ */ import_react62.default.createElement(SidebarSideContext.Provider, { value: side }, /* @__PURE__ */ import_react62.default.createElement(
|
|
4712
4647
|
Drawer,
|
|
4713
4648
|
{
|
|
4714
4649
|
isOpen: openMobile,
|
|
4715
4650
|
onDismiss: () => setOpenMobile(false),
|
|
4716
4651
|
placement: side
|
|
4717
4652
|
},
|
|
4718
|
-
/* @__PURE__ */
|
|
4653
|
+
/* @__PURE__ */ import_react62.default.createElement(Box, { "data-sidebar": "sidebar", "data-mobile": "true", height: "100" }, children)
|
|
4719
4654
|
));
|
|
4720
4655
|
}
|
|
4721
4656
|
if (collapsible === "none") {
|
|
4722
|
-
return /* @__PURE__ */
|
|
4657
|
+
return /* @__PURE__ */ import_react62.default.createElement(SidebarSideContext.Provider, { value: side }, /* @__PURE__ */ import_react62.default.createElement(
|
|
4723
4658
|
"div",
|
|
4724
4659
|
{
|
|
4725
4660
|
className: (0, import_classnames34.default)(
|
|
@@ -4736,7 +4671,7 @@ var Sidebar = import_react64.default.forwardRef(
|
|
|
4736
4671
|
children
|
|
4737
4672
|
));
|
|
4738
4673
|
}
|
|
4739
|
-
return /* @__PURE__ */
|
|
4674
|
+
return /* @__PURE__ */ import_react62.default.createElement(SidebarSideContext.Provider, { value: side }, /* @__PURE__ */ import_react62.default.createElement(
|
|
4740
4675
|
Box,
|
|
4741
4676
|
{
|
|
4742
4677
|
ref,
|
|
@@ -4753,7 +4688,7 @@ var Sidebar = import_react64.default.forwardRef(
|
|
|
4753
4688
|
"data-side": side,
|
|
4754
4689
|
className: "group"
|
|
4755
4690
|
},
|
|
4756
|
-
/* @__PURE__ */
|
|
4691
|
+
/* @__PURE__ */ import_react62.default.createElement(
|
|
4757
4692
|
"div",
|
|
4758
4693
|
{
|
|
4759
4694
|
style: {
|
|
@@ -4768,7 +4703,7 @@ var Sidebar = import_react64.default.forwardRef(
|
|
|
4768
4703
|
className: (0, import_classnames34.default)("position-relative", className)
|
|
4769
4704
|
}
|
|
4770
4705
|
),
|
|
4771
|
-
/* @__PURE__ */
|
|
4706
|
+
/* @__PURE__ */ import_react62.default.createElement(
|
|
4772
4707
|
"div",
|
|
4773
4708
|
{
|
|
4774
4709
|
className: (0, import_classnames34.default)(
|
|
@@ -4790,7 +4725,7 @@ var Sidebar = import_react64.default.forwardRef(
|
|
|
4790
4725
|
},
|
|
4791
4726
|
...props
|
|
4792
4727
|
},
|
|
4793
|
-
/* @__PURE__ */
|
|
4728
|
+
/* @__PURE__ */ import_react62.default.createElement(
|
|
4794
4729
|
"div",
|
|
4795
4730
|
{
|
|
4796
4731
|
"data-sidebar": "sidebar",
|
|
@@ -4808,9 +4743,9 @@ var Sidebar = import_react64.default.forwardRef(
|
|
|
4808
4743
|
}
|
|
4809
4744
|
);
|
|
4810
4745
|
Sidebar.displayName = "Sidebar";
|
|
4811
|
-
var SidebarTrigger =
|
|
4746
|
+
var SidebarTrigger = import_react62.default.forwardRef(({ className, onClick, side, iconName = "dock-left", ...props }, ref) => {
|
|
4812
4747
|
const { toggleSidebar, side: contextSide } = useSidebar(side);
|
|
4813
|
-
return /* @__PURE__ */
|
|
4748
|
+
return /* @__PURE__ */ import_react62.default.createElement(
|
|
4814
4749
|
Button,
|
|
4815
4750
|
{
|
|
4816
4751
|
ref,
|
|
@@ -4835,8 +4770,8 @@ var SidebarTrigger = import_react64.default.forwardRef(({ className, onClick, si
|
|
|
4835
4770
|
);
|
|
4836
4771
|
});
|
|
4837
4772
|
SidebarTrigger.displayName = "SidebarTrigger";
|
|
4838
|
-
var SidebarInset =
|
|
4839
|
-
return /* @__PURE__ */
|
|
4773
|
+
var SidebarInset = import_react62.default.forwardRef(({ className, ...props }, ref) => {
|
|
4774
|
+
return /* @__PURE__ */ import_react62.default.createElement(
|
|
4840
4775
|
"main",
|
|
4841
4776
|
{
|
|
4842
4777
|
ref,
|
|
@@ -4849,10 +4784,10 @@ var SidebarInset = import_react64.default.forwardRef(({ className, ...props }, r
|
|
|
4849
4784
|
);
|
|
4850
4785
|
});
|
|
4851
4786
|
SidebarInset.displayName = "SidebarInset";
|
|
4852
|
-
var SidebarHeader =
|
|
4787
|
+
var SidebarHeader = import_react62.default.forwardRef(({ className, ...props }, ref) => {
|
|
4853
4788
|
const { state } = useSidebar();
|
|
4854
4789
|
const isCollapsed = state === "collapsed";
|
|
4855
|
-
return /* @__PURE__ */
|
|
4790
|
+
return /* @__PURE__ */ import_react62.default.createElement(
|
|
4856
4791
|
"div",
|
|
4857
4792
|
{
|
|
4858
4793
|
ref,
|
|
@@ -4867,8 +4802,8 @@ var SidebarHeader = import_react64.default.forwardRef(({ className, ...props },
|
|
|
4867
4802
|
);
|
|
4868
4803
|
});
|
|
4869
4804
|
SidebarHeader.displayName = "SidebarHeader";
|
|
4870
|
-
var SidebarFooter =
|
|
4871
|
-
return /* @__PURE__ */
|
|
4805
|
+
var SidebarFooter = import_react62.default.forwardRef(({ className, ...props }, ref) => {
|
|
4806
|
+
return /* @__PURE__ */ import_react62.default.createElement(
|
|
4872
4807
|
"div",
|
|
4873
4808
|
{
|
|
4874
4809
|
ref,
|
|
@@ -4882,8 +4817,8 @@ var SidebarFooter = import_react64.default.forwardRef(({ className, ...props },
|
|
|
4882
4817
|
);
|
|
4883
4818
|
});
|
|
4884
4819
|
SidebarFooter.displayName = "SidebarFooter";
|
|
4885
|
-
var SidebarContent =
|
|
4886
|
-
return /* @__PURE__ */
|
|
4820
|
+
var SidebarContent = import_react62.default.forwardRef(({ className, ...props }, ref) => {
|
|
4821
|
+
return /* @__PURE__ */ import_react62.default.createElement(
|
|
4887
4822
|
"div",
|
|
4888
4823
|
{
|
|
4889
4824
|
ref,
|
|
@@ -4898,7 +4833,7 @@ var SidebarContent = import_react64.default.forwardRef(({ className, ...props },
|
|
|
4898
4833
|
);
|
|
4899
4834
|
});
|
|
4900
4835
|
SidebarContent.displayName = "SidebarContent";
|
|
4901
|
-
var SidebarMenu =
|
|
4836
|
+
var SidebarMenu = import_react62.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ import_react62.default.createElement(
|
|
4902
4837
|
"ul",
|
|
4903
4838
|
{
|
|
4904
4839
|
ref,
|
|
@@ -4914,7 +4849,7 @@ var SidebarMenu = import_react64.default.forwardRef(({ className, ...props }, re
|
|
|
4914
4849
|
}
|
|
4915
4850
|
));
|
|
4916
4851
|
SidebarMenu.displayName = "SidebarMenu";
|
|
4917
|
-
var SidebarMenuItem =
|
|
4852
|
+
var SidebarMenuItem = import_react62.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ import_react62.default.createElement(
|
|
4918
4853
|
"li",
|
|
4919
4854
|
{
|
|
4920
4855
|
ref,
|
|
@@ -4925,11 +4860,11 @@ var SidebarMenuItem = import_react64.default.forwardRef(({ className, ...props }
|
|
|
4925
4860
|
}
|
|
4926
4861
|
));
|
|
4927
4862
|
SidebarMenuItem.displayName = "SidebarMenuItem";
|
|
4928
|
-
var SidebarMenuButton =
|
|
4863
|
+
var SidebarMenuButton = import_react62.default.forwardRef(
|
|
4929
4864
|
({ asChild = false, isActive = false, tooltip, className, ...props }, ref) => {
|
|
4930
4865
|
const Comp = asChild ? import_react_slot3.Slot : "button";
|
|
4931
4866
|
const { isMobile, state, side } = useSidebar();
|
|
4932
|
-
const button = /* @__PURE__ */
|
|
4867
|
+
const button = /* @__PURE__ */ import_react62.default.createElement(
|
|
4933
4868
|
Comp,
|
|
4934
4869
|
{
|
|
4935
4870
|
ref,
|
|
@@ -4955,7 +4890,7 @@ var SidebarMenuButton = import_react64.default.forwardRef(
|
|
|
4955
4890
|
children: tooltip
|
|
4956
4891
|
};
|
|
4957
4892
|
}
|
|
4958
|
-
return /* @__PURE__ */
|
|
4893
|
+
return /* @__PURE__ */ import_react62.default.createElement(Tooltip, null, /* @__PURE__ */ import_react62.default.createElement(TooltipTrigger, { asChild: true }, button), /* @__PURE__ */ import_react62.default.createElement(
|
|
4959
4894
|
TooltipContent,
|
|
4960
4895
|
{
|
|
4961
4896
|
side: side === "right" ? "left" : "right",
|
|
@@ -4967,8 +4902,8 @@ var SidebarMenuButton = import_react64.default.forwardRef(
|
|
|
4967
4902
|
}
|
|
4968
4903
|
);
|
|
4969
4904
|
SidebarMenuButton.displayName = "SidebarMenuButton";
|
|
4970
|
-
var SidebarGroup =
|
|
4971
|
-
return /* @__PURE__ */
|
|
4905
|
+
var SidebarGroup = import_react62.default.forwardRef(({ className, ...props }, ref) => {
|
|
4906
|
+
return /* @__PURE__ */ import_react62.default.createElement(
|
|
4972
4907
|
"div",
|
|
4973
4908
|
{
|
|
4974
4909
|
ref,
|
|
@@ -4982,8 +4917,8 @@ var SidebarGroup = import_react64.default.forwardRef(({ className, ...props }, r
|
|
|
4982
4917
|
);
|
|
4983
4918
|
});
|
|
4984
4919
|
SidebarGroup.displayName = "SidebarGroup";
|
|
4985
|
-
var SidebarGroupLabel =
|
|
4986
|
-
return /* @__PURE__ */
|
|
4920
|
+
var SidebarGroupLabel = import_react62.default.forwardRef(({ className, ...props }, ref) => {
|
|
4921
|
+
return /* @__PURE__ */ import_react62.default.createElement(
|
|
4987
4922
|
"div",
|
|
4988
4923
|
{
|
|
4989
4924
|
ref,
|
|
@@ -4997,7 +4932,7 @@ var SidebarGroupLabel = import_react64.default.forwardRef(({ className, ...props
|
|
|
4997
4932
|
);
|
|
4998
4933
|
});
|
|
4999
4934
|
SidebarGroupLabel.displayName = "SidebarGroupLabel";
|
|
5000
|
-
var SidebarMenuSub =
|
|
4935
|
+
var SidebarMenuSub = import_react62.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ import_react62.default.createElement(
|
|
5001
4936
|
"ul",
|
|
5002
4937
|
{
|
|
5003
4938
|
ref,
|
|
@@ -5013,11 +4948,11 @@ var SidebarMenuSub = import_react64.default.forwardRef(({ className, ...props },
|
|
|
5013
4948
|
}
|
|
5014
4949
|
));
|
|
5015
4950
|
SidebarMenuSub.displayName = "SidebarMenuSub";
|
|
5016
|
-
var SidebarMenuSubItem =
|
|
4951
|
+
var SidebarMenuSubItem = import_react62.default.forwardRef(({ ...props }, ref) => /* @__PURE__ */ import_react62.default.createElement("li", { ref, ...props }));
|
|
5017
4952
|
SidebarMenuSubItem.displayName = "SidebarMenuSubItem";
|
|
5018
|
-
var SidebarMenuSubButton =
|
|
4953
|
+
var SidebarMenuSubButton = import_react62.default.forwardRef(({ asChild = false, isActive, className, ...props }, ref) => {
|
|
5019
4954
|
const Comp = asChild ? import_react_slot3.Slot : "a";
|
|
5020
|
-
return /* @__PURE__ */
|
|
4955
|
+
return /* @__PURE__ */ import_react62.default.createElement(
|
|
5021
4956
|
Comp,
|
|
5022
4957
|
{
|
|
5023
4958
|
ref,
|
|
@@ -5036,9 +4971,9 @@ var SidebarMenuSubButton = import_react64.default.forwardRef(({ asChild = false,
|
|
|
5036
4971
|
);
|
|
5037
4972
|
});
|
|
5038
4973
|
SidebarMenuSubButton.displayName = "SidebarMenuSubButton";
|
|
5039
|
-
var SidebarMenuAction =
|
|
4974
|
+
var SidebarMenuAction = import_react62.default.forwardRef(({ className, asChild = false, ...props }, ref) => {
|
|
5040
4975
|
const Comp = asChild ? import_react_slot3.Slot : "button";
|
|
5041
|
-
return /* @__PURE__ */
|
|
4976
|
+
return /* @__PURE__ */ import_react62.default.createElement(
|
|
5042
4977
|
Comp,
|
|
5043
4978
|
{
|
|
5044
4979
|
ref,
|
|
@@ -5056,11 +4991,11 @@ var SidebarMenuAction = import_react64.default.forwardRef(({ className, asChild
|
|
|
5056
4991
|
);
|
|
5057
4992
|
});
|
|
5058
4993
|
SidebarMenuAction.displayName = "SidebarMenuAction";
|
|
5059
|
-
var SidebarRail =
|
|
4994
|
+
var SidebarRail = import_react62.default.forwardRef(({ className, ...props }, ref) => {
|
|
5060
4995
|
const { open, toggleSidebar, side } = useSidebar();
|
|
5061
4996
|
const shortcutLabel = side === "left" ? SIDEBAR_KEYBOARD_SHORTCUT_LEFT : SIDEBAR_KEYBOARD_SHORTCUT_RIGHT;
|
|
5062
4997
|
const caretIcon = open ? side === "right" ? "caret-sm-right" : "caret-sm-left" : side === "right" ? "caret-sm-left" : "caret-sm-right";
|
|
5063
|
-
return /* @__PURE__ */
|
|
4998
|
+
return /* @__PURE__ */ import_react62.default.createElement(
|
|
5064
4999
|
"button",
|
|
5065
5000
|
{
|
|
5066
5001
|
ref,
|
|
@@ -5088,7 +5023,7 @@ var SidebarRail = import_react64.default.forwardRef(({ className, ...props }, re
|
|
|
5088
5023
|
type: "button",
|
|
5089
5024
|
...props
|
|
5090
5025
|
},
|
|
5091
|
-
/* @__PURE__ */
|
|
5026
|
+
/* @__PURE__ */ import_react62.default.createElement(
|
|
5092
5027
|
Box,
|
|
5093
5028
|
{
|
|
5094
5029
|
radius: "xl",
|
|
@@ -5111,12 +5046,12 @@ var SidebarRail = import_react64.default.forwardRef(({ className, ...props }, re
|
|
|
5111
5046
|
className
|
|
5112
5047
|
)
|
|
5113
5048
|
},
|
|
5114
|
-
/* @__PURE__ */
|
|
5049
|
+
/* @__PURE__ */ import_react62.default.createElement(Icon, { name: caretIcon })
|
|
5115
5050
|
)
|
|
5116
5051
|
);
|
|
5117
5052
|
});
|
|
5118
5053
|
SidebarRail.displayName = "SidebarRail";
|
|
5119
|
-
var SidebarMenuBadge =
|
|
5054
|
+
var SidebarMenuBadge = import_react62.default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ import_react62.default.createElement(
|
|
5120
5055
|
"div",
|
|
5121
5056
|
{
|
|
5122
5057
|
ref,
|
|
@@ -5135,28 +5070,28 @@ var SidebarMenuBadge = import_react64.default.forwardRef(({ className, ...props
|
|
|
5135
5070
|
SidebarMenuBadge.displayName = "SidebarMenuBadge";
|
|
5136
5071
|
|
|
5137
5072
|
// src/components/Table/Table.tsx
|
|
5138
|
-
var
|
|
5073
|
+
var import_react68 = __toESM(require("react"));
|
|
5139
5074
|
var import_classnames40 = __toESM(require("classnames"));
|
|
5140
5075
|
|
|
5141
5076
|
// src/components/Table/Table.module.scss
|
|
5142
5077
|
var Table_module_default = { "container": "container__zReWp", "loading-mask": "loading-mask__gwG6j", "scroll-container": "scroll-container__79zJk", "table": "table__ojslm", "auto": "auto__bXEGP", "fixed": "fixed__zPdl3", "borderless": "borderless__AlDGM", "scrollable": "scrollable__HSxT1", "scrollable-x": "scrollable-x__aKmx8", "scrollable-y": "scrollable-y__8nNit", "table-bordered": "table-bordered__oTd6P", "full-height": "full-height__YPJfE" };
|
|
5143
5078
|
|
|
5144
5079
|
// src/components/Table/TableBody/TableBody.tsx
|
|
5145
|
-
var
|
|
5080
|
+
var import_react66 = __toESM(require("react"));
|
|
5146
5081
|
var import_classnames38 = __toESM(require("classnames"));
|
|
5147
5082
|
|
|
5148
5083
|
// src/components/Table/TableBody/TableBody.module.scss
|
|
5149
5084
|
var TableBody_module_default = { "table-body": "table-body__cX0OQ", "striped": "striped__1Epqn", "hover": "hover__I3QF4" };
|
|
5150
5085
|
|
|
5151
5086
|
// src/components/Table/common/TableRow/TableRow.tsx
|
|
5152
|
-
var
|
|
5087
|
+
var import_react65 = __toESM(require("react"));
|
|
5153
5088
|
var import_classnames37 = __toESM(require("classnames"));
|
|
5154
5089
|
|
|
5155
5090
|
// src/components/Table/common/TableRow/TableRow.module.scss
|
|
5156
5091
|
var TableRow_module_default = { "table-row": "table-row__BdHbx", "hoverable": "hoverable__Bdemq" };
|
|
5157
5092
|
|
|
5158
5093
|
// src/components/Table/TableBody/TableBodyCell/TableBodyCell.tsx
|
|
5159
|
-
var
|
|
5094
|
+
var import_react63 = __toESM(require("react"));
|
|
5160
5095
|
var import_classnames35 = __toESM(require("classnames"));
|
|
5161
5096
|
|
|
5162
5097
|
// src/components/Table/TableBody/TableBodyCell/TableBodyCell.module.scss
|
|
@@ -5189,7 +5124,7 @@ var TableBodyCell = ({
|
|
|
5189
5124
|
},
|
|
5190
5125
|
className
|
|
5191
5126
|
);
|
|
5192
|
-
return /* @__PURE__ */
|
|
5127
|
+
return /* @__PURE__ */ import_react63.default.createElement(
|
|
5193
5128
|
Box,
|
|
5194
5129
|
{
|
|
5195
5130
|
as: columnIsSticky ? "th" : "td",
|
|
@@ -5207,7 +5142,7 @@ var TableBodyCell = ({
|
|
|
5207
5142
|
var TableBodyCell_default = TableBodyCell;
|
|
5208
5143
|
|
|
5209
5144
|
// src/components/Table/TableHead/TableHeaderCell/TableHeaderCell.tsx
|
|
5210
|
-
var
|
|
5145
|
+
var import_react64 = __toESM(require("react"));
|
|
5211
5146
|
var import_classnames36 = __toESM(require("classnames"));
|
|
5212
5147
|
|
|
5213
5148
|
// src/components/Table/TableHead/TableHeaderCell/TableHeaderCell.module.scss
|
|
@@ -5234,7 +5169,7 @@ var TableHeaderCell = ({
|
|
|
5234
5169
|
const renderIcon = () => {
|
|
5235
5170
|
const renderArrows = () => {
|
|
5236
5171
|
if (getSortDirection() === "ascending") {
|
|
5237
|
-
return /* @__PURE__ */
|
|
5172
|
+
return /* @__PURE__ */ import_react64.default.createElement(
|
|
5238
5173
|
Icon,
|
|
5239
5174
|
{
|
|
5240
5175
|
name: "caret-sm-up",
|
|
@@ -5243,7 +5178,7 @@ var TableHeaderCell = ({
|
|
|
5243
5178
|
);
|
|
5244
5179
|
}
|
|
5245
5180
|
if (getSortDirection() === "descending") {
|
|
5246
|
-
return /* @__PURE__ */
|
|
5181
|
+
return /* @__PURE__ */ import_react64.default.createElement(
|
|
5247
5182
|
Icon,
|
|
5248
5183
|
{
|
|
5249
5184
|
name: "caret-sm-down",
|
|
@@ -5251,7 +5186,7 @@ var TableHeaderCell = ({
|
|
|
5251
5186
|
}
|
|
5252
5187
|
);
|
|
5253
5188
|
}
|
|
5254
|
-
return /* @__PURE__ */
|
|
5189
|
+
return /* @__PURE__ */ import_react64.default.createElement(
|
|
5255
5190
|
Box,
|
|
5256
5191
|
{
|
|
5257
5192
|
display: "inline-block",
|
|
@@ -5262,7 +5197,7 @@ var TableHeaderCell = ({
|
|
|
5262
5197
|
}
|
|
5263
5198
|
);
|
|
5264
5199
|
};
|
|
5265
|
-
return /* @__PURE__ */
|
|
5200
|
+
return /* @__PURE__ */ import_react64.default.createElement("span", { className: TableHeaderCell_module_default["sort-icon"] }, renderArrows());
|
|
5266
5201
|
};
|
|
5267
5202
|
const handleKeyPress = (event) => {
|
|
5268
5203
|
if (!onSort || !isSortable) return;
|
|
@@ -5294,7 +5229,7 @@ var TableHeaderCell = ({
|
|
|
5294
5229
|
},
|
|
5295
5230
|
className
|
|
5296
5231
|
);
|
|
5297
|
-
return /* @__PURE__ */
|
|
5232
|
+
return /* @__PURE__ */ import_react64.default.createElement(
|
|
5298
5233
|
Box,
|
|
5299
5234
|
{
|
|
5300
5235
|
as: "th",
|
|
@@ -5307,7 +5242,7 @@ var TableHeaderCell = ({
|
|
|
5307
5242
|
onKeyDown: handleKeyPress,
|
|
5308
5243
|
scope: "col"
|
|
5309
5244
|
},
|
|
5310
|
-
/* @__PURE__ */
|
|
5245
|
+
/* @__PURE__ */ import_react64.default.createElement("div", { className: TableHeaderCell_module_default.heading }, column.heading, isSortable && renderIcon())
|
|
5311
5246
|
);
|
|
5312
5247
|
};
|
|
5313
5248
|
|
|
@@ -5349,8 +5284,8 @@ var TableRow = ({
|
|
|
5349
5284
|
}
|
|
5350
5285
|
return void 0;
|
|
5351
5286
|
};
|
|
5352
|
-
return /* @__PURE__ */
|
|
5353
|
-
(column, columnIndex) => isTableHead ? /* @__PURE__ */
|
|
5287
|
+
return /* @__PURE__ */ import_react65.default.createElement("tr", { className: tableRowClasses }, Object.values(columns).map(
|
|
5288
|
+
(column, columnIndex) => isTableHead ? /* @__PURE__ */ import_react65.default.createElement(
|
|
5354
5289
|
TableHeaderCell,
|
|
5355
5290
|
{
|
|
5356
5291
|
column,
|
|
@@ -5368,7 +5303,7 @@ var TableRow = ({
|
|
|
5368
5303
|
hasStickyHeader,
|
|
5369
5304
|
sticky: column.sticky
|
|
5370
5305
|
}
|
|
5371
|
-
) : /* @__PURE__ */
|
|
5306
|
+
) : /* @__PURE__ */ import_react65.default.createElement(
|
|
5372
5307
|
TableBodyCell_default,
|
|
5373
5308
|
{
|
|
5374
5309
|
align: column.align || align,
|
|
@@ -5407,7 +5342,7 @@ var TableBody = ({
|
|
|
5407
5342
|
},
|
|
5408
5343
|
className
|
|
5409
5344
|
);
|
|
5410
|
-
return /* @__PURE__ */
|
|
5345
|
+
return /* @__PURE__ */ import_react66.default.createElement("tbody", { className: tableBodyClasses }, rows.map((row, rowIndex) => /* @__PURE__ */ import_react66.default.createElement(
|
|
5411
5346
|
TableRow,
|
|
5412
5347
|
{
|
|
5413
5348
|
columns,
|
|
@@ -5424,7 +5359,7 @@ var TableBody = ({
|
|
|
5424
5359
|
};
|
|
5425
5360
|
|
|
5426
5361
|
// src/components/Table/TableHead/TableHead.tsx
|
|
5427
|
-
var
|
|
5362
|
+
var import_react67 = __toESM(require("react"));
|
|
5428
5363
|
var import_classnames39 = __toESM(require("classnames"));
|
|
5429
5364
|
var TableHead = ({
|
|
5430
5365
|
columns,
|
|
@@ -5438,7 +5373,7 @@ var TableHead = ({
|
|
|
5438
5373
|
truncateOverflow = false
|
|
5439
5374
|
}) => {
|
|
5440
5375
|
const tableHeadClasses = (0, import_classnames39.default)(className);
|
|
5441
|
-
return /* @__PURE__ */
|
|
5376
|
+
return /* @__PURE__ */ import_react67.default.createElement("thead", { className: tableHeadClasses }, /* @__PURE__ */ import_react67.default.createElement(
|
|
5442
5377
|
TableRow,
|
|
5443
5378
|
{
|
|
5444
5379
|
columns,
|
|
@@ -5492,13 +5427,13 @@ var Table = ({
|
|
|
5492
5427
|
[Table_module_default.borderless]: isBorderless,
|
|
5493
5428
|
[Table_module_default.compact]: isCompact
|
|
5494
5429
|
});
|
|
5495
|
-
return /* @__PURE__ */
|
|
5430
|
+
return /* @__PURE__ */ import_react68.default.createElement("div", { className: containerClasses }, isLoading && /* @__PURE__ */ import_react68.default.createElement("div", { className: Table_module_default["loading-mask"] }, /* @__PURE__ */ import_react68.default.createElement(Spinner, { size: "xl" })), /* @__PURE__ */ import_react68.default.createElement(
|
|
5496
5431
|
"div",
|
|
5497
5432
|
{
|
|
5498
5433
|
className: scrollContainerClasses,
|
|
5499
5434
|
"data-testid": "tableContainerDiv-testid"
|
|
5500
5435
|
},
|
|
5501
|
-
/* @__PURE__ */
|
|
5436
|
+
/* @__PURE__ */ import_react68.default.createElement("table", { className: tableClasses }, /* @__PURE__ */ import_react68.default.createElement(
|
|
5502
5437
|
TableHead,
|
|
5503
5438
|
{
|
|
5504
5439
|
columns,
|
|
@@ -5510,7 +5445,7 @@ var Table = ({
|
|
|
5510
5445
|
truncateOverflow,
|
|
5511
5446
|
hasStickyHeader
|
|
5512
5447
|
}
|
|
5513
|
-
), /* @__PURE__ */
|
|
5448
|
+
), /* @__PURE__ */ import_react68.default.createElement(
|
|
5514
5449
|
TableBody,
|
|
5515
5450
|
{
|
|
5516
5451
|
rows,
|
|
@@ -5529,22 +5464,22 @@ var Table = ({
|
|
|
5529
5464
|
};
|
|
5530
5465
|
|
|
5531
5466
|
// src/components/ThemeProvider/ThemeProvider.tsx
|
|
5532
|
-
var
|
|
5467
|
+
var import_react69 = __toESM(require("react"));
|
|
5533
5468
|
var initialState = {
|
|
5534
5469
|
theme: "system",
|
|
5535
5470
|
setTheme: () => null
|
|
5536
5471
|
};
|
|
5537
|
-
var ThemeProviderContext = (0,
|
|
5472
|
+
var ThemeProviderContext = (0, import_react69.createContext)(initialState);
|
|
5538
5473
|
function ThemeProvider({
|
|
5539
5474
|
children,
|
|
5540
5475
|
defaultTheme = "system",
|
|
5541
5476
|
storageKey = "hyphen-ui-theme",
|
|
5542
5477
|
...props
|
|
5543
5478
|
}) {
|
|
5544
|
-
const [theme, setTheme] = (0,
|
|
5479
|
+
const [theme, setTheme] = (0, import_react69.useState)(
|
|
5545
5480
|
() => localStorage.getItem(storageKey) || defaultTheme
|
|
5546
5481
|
);
|
|
5547
|
-
(0,
|
|
5482
|
+
(0, import_react69.useEffect)(() => {
|
|
5548
5483
|
const root = window.document.documentElement;
|
|
5549
5484
|
root.classList.remove("light", "dark");
|
|
5550
5485
|
if (theme === "system") {
|
|
@@ -5563,14 +5498,14 @@ function ThemeProvider({
|
|
|
5563
5498
|
},
|
|
5564
5499
|
isDarkMode
|
|
5565
5500
|
};
|
|
5566
|
-
return /* @__PURE__ */
|
|
5501
|
+
return /* @__PURE__ */ import_react69.default.createElement(ThemeProviderContext.Provider, { ...props, value }, children);
|
|
5567
5502
|
}
|
|
5568
5503
|
|
|
5569
5504
|
// src/components/Toast/ToastContainer.tsx
|
|
5570
|
-
var
|
|
5505
|
+
var import_react73 = __toESM(require("react"));
|
|
5571
5506
|
|
|
5572
5507
|
// src/components/Toast/ToastNotification.tsx
|
|
5573
|
-
var
|
|
5508
|
+
var import_react70 = __toESM(require("react"));
|
|
5574
5509
|
var import_classnames41 = __toESM(require("classnames"));
|
|
5575
5510
|
|
|
5576
5511
|
// src/components/Toast/ToastNotification.module.scss
|
|
@@ -5603,12 +5538,12 @@ var renderToastIcon = (toast2) => {
|
|
|
5603
5538
|
iconName = "c-warning";
|
|
5604
5539
|
iconColor = "white";
|
|
5605
5540
|
}
|
|
5606
|
-
const icon = type !== "loading" ? /* @__PURE__ */
|
|
5607
|
-
return /* @__PURE__ */
|
|
5541
|
+
const icon = type !== "loading" ? /* @__PURE__ */ import_react70.default.createElement(Icon, { name: iconName, color: iconColor }) : /* @__PURE__ */ import_react70.default.createElement(Spinner, null);
|
|
5542
|
+
return /* @__PURE__ */ import_react70.default.createElement(Box, { justifyContent: "center", height: "100" }, icon);
|
|
5608
5543
|
};
|
|
5609
5544
|
var renderDismissIcon = (toast2, onDismiss) => {
|
|
5610
5545
|
if (!toast2.canDismiss) return;
|
|
5611
|
-
return /* @__PURE__ */
|
|
5546
|
+
return /* @__PURE__ */ import_react70.default.createElement(
|
|
5612
5547
|
Box,
|
|
5613
5548
|
{
|
|
5614
5549
|
as: "button",
|
|
@@ -5623,12 +5558,12 @@ var renderDismissIcon = (toast2, onDismiss) => {
|
|
|
5623
5558
|
onClick: onDismiss,
|
|
5624
5559
|
"aria-label": "dismiss notification"
|
|
5625
5560
|
},
|
|
5626
|
-
/* @__PURE__ */
|
|
5561
|
+
/* @__PURE__ */ import_react70.default.createElement(Icon, { name: "remove" })
|
|
5627
5562
|
);
|
|
5628
5563
|
};
|
|
5629
|
-
var ToastNotification =
|
|
5564
|
+
var ToastNotification = import_react70.default.memo(
|
|
5630
5565
|
({ toast: toast2, position = "top-center", style, children, onDismiss }) => {
|
|
5631
|
-
const message = /* @__PURE__ */
|
|
5566
|
+
const message = /* @__PURE__ */ import_react70.default.createElement(
|
|
5632
5567
|
Box,
|
|
5633
5568
|
{
|
|
5634
5569
|
direction: "row",
|
|
@@ -5650,7 +5585,7 @@ var ToastNotification = import_react72.default.memo(
|
|
|
5650
5585
|
[ToastNotification_module_default["toast-error"]]: toast2.type === "error"
|
|
5651
5586
|
}
|
|
5652
5587
|
);
|
|
5653
|
-
return /* @__PURE__ */
|
|
5588
|
+
return /* @__PURE__ */ import_react70.default.createElement(
|
|
5654
5589
|
Box,
|
|
5655
5590
|
{
|
|
5656
5591
|
alignItems: "center",
|
|
@@ -5667,16 +5602,16 @@ var ToastNotification = import_react72.default.memo(
|
|
|
5667
5602
|
},
|
|
5668
5603
|
typeof children === "function" ? children({
|
|
5669
5604
|
message
|
|
5670
|
-
}) : /* @__PURE__ */
|
|
5605
|
+
}) : /* @__PURE__ */ import_react70.default.createElement(import_react70.default.Fragment, null, renderToastIcon(toast2), message, renderDismissIcon(toast2, onDismiss))
|
|
5671
5606
|
);
|
|
5672
5607
|
}
|
|
5673
5608
|
);
|
|
5674
5609
|
|
|
5675
5610
|
// src/components/Toast/useToasts.ts
|
|
5676
|
-
var
|
|
5611
|
+
var import_react72 = require("react");
|
|
5677
5612
|
|
|
5678
5613
|
// src/components/Toast/Toast.store.ts
|
|
5679
|
-
var
|
|
5614
|
+
var import_react71 = require("react");
|
|
5680
5615
|
var TOAST_LIMIT = 20;
|
|
5681
5616
|
var toastTimeouts = /* @__PURE__ */ new Map();
|
|
5682
5617
|
var addToDismissedQueue = (toastId) => {
|
|
@@ -5812,8 +5747,8 @@ var defaultTimeouts = {
|
|
|
5812
5747
|
custom: 4e3
|
|
5813
5748
|
};
|
|
5814
5749
|
var useToastStore = (toastOptions = {}) => {
|
|
5815
|
-
const [state, setState] = (0,
|
|
5816
|
-
(0,
|
|
5750
|
+
const [state, setState] = (0, import_react71.useState)(memoryState);
|
|
5751
|
+
(0, import_react71.useEffect)(() => {
|
|
5817
5752
|
listeners.push(setState);
|
|
5818
5753
|
return () => {
|
|
5819
5754
|
const index = listeners.indexOf(setState);
|
|
@@ -5900,7 +5835,7 @@ toast.async = function(promise, messages, opts) {
|
|
|
5900
5835
|
// src/components/Toast/useToasts.ts
|
|
5901
5836
|
var useToasts = (toastOptions) => {
|
|
5902
5837
|
const { toasts, pausedAt } = useToastStore(toastOptions);
|
|
5903
|
-
(0,
|
|
5838
|
+
(0, import_react72.useEffect)(() => {
|
|
5904
5839
|
if (pausedAt) {
|
|
5905
5840
|
return;
|
|
5906
5841
|
}
|
|
@@ -5922,7 +5857,7 @@ var useToasts = (toastOptions) => {
|
|
|
5922
5857
|
timeouts.forEach((timeout) => timeout && clearTimeout(timeout));
|
|
5923
5858
|
};
|
|
5924
5859
|
}, [toasts, pausedAt]);
|
|
5925
|
-
const handlers = (0,
|
|
5860
|
+
const handlers = (0, import_react72.useMemo)(
|
|
5926
5861
|
() => ({
|
|
5927
5862
|
startPause: () => {
|
|
5928
5863
|
dispatch({
|
|
@@ -6004,7 +5939,7 @@ var renderNotification = (currentToast, children, containerPosition) => {
|
|
|
6004
5939
|
if (children) {
|
|
6005
5940
|
return children(currentToast);
|
|
6006
5941
|
}
|
|
6007
|
-
return /* @__PURE__ */
|
|
5942
|
+
return /* @__PURE__ */ import_react73.default.createElement(
|
|
6008
5943
|
ToastNotification,
|
|
6009
5944
|
{
|
|
6010
5945
|
toast: currentToast,
|
|
@@ -6024,7 +5959,7 @@ var ToastContainer = ({
|
|
|
6024
5959
|
...restProps
|
|
6025
5960
|
}) => {
|
|
6026
5961
|
const { toasts, handlers } = useToasts(toastOptions);
|
|
6027
|
-
return /* @__PURE__ */
|
|
5962
|
+
return /* @__PURE__ */ import_react73.default.createElement(
|
|
6028
5963
|
Box,
|
|
6029
5964
|
{
|
|
6030
5965
|
style: {
|
|
@@ -6054,7 +5989,7 @@ var ToastContainer = ({
|
|
|
6054
5989
|
const ref = t.height ? void 0 : createRectRef((rect) => {
|
|
6055
5990
|
handlers.updateHeight(t.id, rect.height);
|
|
6056
5991
|
});
|
|
6057
|
-
return /* @__PURE__ */
|
|
5992
|
+
return /* @__PURE__ */ import_react73.default.createElement(
|
|
6058
5993
|
Box,
|
|
6059
5994
|
{
|
|
6060
5995
|
ref,
|
|
@@ -6072,7 +6007,7 @@ var ToastContainer = ({
|
|
|
6072
6007
|
};
|
|
6073
6008
|
|
|
6074
6009
|
// src/components/Toggle/Toggle.tsx
|
|
6075
|
-
var
|
|
6010
|
+
var import_react74 = __toESM(require("react"));
|
|
6076
6011
|
var TogglePrimitive = __toESM(require("@radix-ui/react-toggle"));
|
|
6077
6012
|
|
|
6078
6013
|
// src/components/Toggle/Toggle.module.scss
|
|
@@ -6080,7 +6015,7 @@ var Toggle_module_default = { "item": "item__PrPsJ", "outline": "outline__Lkabh"
|
|
|
6080
6015
|
|
|
6081
6016
|
// src/components/Toggle/Toggle.tsx
|
|
6082
6017
|
var import_classnames42 = __toESM(require("classnames"));
|
|
6083
|
-
var Toggle = (0,
|
|
6018
|
+
var Toggle = (0, import_react74.forwardRef)(({ className, variant = "default", children, ...props }, ref) => /* @__PURE__ */ import_react74.default.createElement(
|
|
6084
6019
|
TogglePrimitive.Root,
|
|
6085
6020
|
{
|
|
6086
6021
|
ref,
|
|
@@ -6097,12 +6032,12 @@ var Toggle = (0, import_react76.forwardRef)(({ className, variant = "default", c
|
|
|
6097
6032
|
Toggle.displayName = "Toggle";
|
|
6098
6033
|
|
|
6099
6034
|
// src/hooks/useBreakpoint/useBreakpoint.ts
|
|
6100
|
-
var
|
|
6035
|
+
var import_react76 = require("react");
|
|
6101
6036
|
|
|
6102
6037
|
// src/hooks/useWindowSize/useWindowSize.ts
|
|
6103
|
-
var
|
|
6038
|
+
var import_react75 = __toESM(require("react"));
|
|
6104
6039
|
var useWindowSize = () => {
|
|
6105
|
-
const { innerWidth, innerHeight, outerHeight, outerWidth, isCreated } =
|
|
6040
|
+
const { innerWidth, innerHeight, outerHeight, outerWidth, isCreated } = import_react75.default.useContext(ResponsiveContext);
|
|
6106
6041
|
if (isCreated) {
|
|
6107
6042
|
return {
|
|
6108
6043
|
innerHeight,
|
|
@@ -6118,7 +6053,7 @@ var useWindowSize = () => {
|
|
|
6118
6053
|
var defaultBreakpoint = { name: "base", minWidth: 0 };
|
|
6119
6054
|
var useBreakpoint = () => {
|
|
6120
6055
|
const windowSize = useWindowSize();
|
|
6121
|
-
const [breakpoint, setBreakpoint] = (0,
|
|
6056
|
+
const [breakpoint, setBreakpoint] = (0, import_react76.useState)({
|
|
6122
6057
|
...defaultBreakpoint
|
|
6123
6058
|
});
|
|
6124
6059
|
useIsomorphicLayoutEffect(() => {
|
|
@@ -6145,7 +6080,7 @@ var useBreakpoint = () => {
|
|
|
6145
6080
|
};
|
|
6146
6081
|
|
|
6147
6082
|
// src/hooks/useOpenClose/useOpenClose.tsx
|
|
6148
|
-
var
|
|
6083
|
+
var import_react77 = require("react");
|
|
6149
6084
|
var useOpenClose = (props = {}) => {
|
|
6150
6085
|
const {
|
|
6151
6086
|
defaultIsOpen,
|
|
@@ -6153,28 +6088,28 @@ var useOpenClose = (props = {}) => {
|
|
|
6153
6088
|
onClose: onCloseProp,
|
|
6154
6089
|
onOpen: onOpenProp
|
|
6155
6090
|
} = props;
|
|
6156
|
-
const openCallback = (0,
|
|
6091
|
+
const openCallback = (0, import_react77.useCallback)(() => {
|
|
6157
6092
|
onOpenProp?.();
|
|
6158
6093
|
}, [onOpenProp]);
|
|
6159
|
-
const closeCallback = (0,
|
|
6094
|
+
const closeCallback = (0, import_react77.useCallback)(() => {
|
|
6160
6095
|
onCloseProp?.();
|
|
6161
6096
|
}, [onCloseProp]);
|
|
6162
|
-
const [isOpenState, setIsOpen] = (0,
|
|
6097
|
+
const [isOpenState, setIsOpen] = (0, import_react77.useState)(defaultIsOpen || false);
|
|
6163
6098
|
const isOpen = isOpenProp !== void 0 ? isOpenProp : isOpenState;
|
|
6164
6099
|
const isControlled = isOpenProp !== void 0;
|
|
6165
|
-
const handleClose = (0,
|
|
6100
|
+
const handleClose = (0, import_react77.useCallback)(() => {
|
|
6166
6101
|
if (!isControlled) {
|
|
6167
6102
|
setIsOpen(false);
|
|
6168
6103
|
}
|
|
6169
6104
|
closeCallback?.();
|
|
6170
6105
|
}, [isControlled, closeCallback]);
|
|
6171
|
-
const handleOpen = (0,
|
|
6106
|
+
const handleOpen = (0, import_react77.useCallback)(() => {
|
|
6172
6107
|
if (!isControlled) {
|
|
6173
6108
|
setIsOpen(true);
|
|
6174
6109
|
}
|
|
6175
6110
|
openCallback?.();
|
|
6176
6111
|
}, [isControlled, openCallback]);
|
|
6177
|
-
const handleToggle = (0,
|
|
6112
|
+
const handleToggle = (0, import_react77.useCallback)(() => {
|
|
6178
6113
|
if (isOpen) {
|
|
6179
6114
|
handleClose();
|
|
6180
6115
|
} else {
|
|
@@ -6190,9 +6125,9 @@ var useOpenClose = (props = {}) => {
|
|
|
6190
6125
|
};
|
|
6191
6126
|
|
|
6192
6127
|
// src/hooks/useTheme/useTheme.ts
|
|
6193
|
-
var
|
|
6128
|
+
var import_react78 = __toESM(require("react"));
|
|
6194
6129
|
var useTheme = () => {
|
|
6195
|
-
const context =
|
|
6130
|
+
const context = import_react78.default.useContext(ThemeProviderContext);
|
|
6196
6131
|
if (context === void 0)
|
|
6197
6132
|
throw new Error(
|
|
6198
6133
|
"useTheme must be used within a ThemeProvider. Be sure your App is wrapped in ThemeProvider."
|
|
@@ -6263,7 +6198,6 @@ var useTheme = () => {
|
|
|
6263
6198
|
FormikTextareaInput,
|
|
6264
6199
|
FormikTextareaInputInset,
|
|
6265
6200
|
FormikTimePicker,
|
|
6266
|
-
FormikTimePickerNative,
|
|
6267
6201
|
FormikToggleGroup,
|
|
6268
6202
|
FormikToggleGroupMulti,
|
|
6269
6203
|
HEADING_SIZE_OPTIONS,
|
|
@@ -6316,7 +6250,6 @@ var useTheme = () => {
|
|
|
6316
6250
|
ThemeProvider,
|
|
6317
6251
|
ThemeProviderContext,
|
|
6318
6252
|
TimePicker,
|
|
6319
|
-
TimePickerNative,
|
|
6320
6253
|
ToastContainer,
|
|
6321
6254
|
Toggle,
|
|
6322
6255
|
ToggleGroup,
|