@doist/reactist 22.0.1-beta → 22.0.3-beta
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/reactist.cjs.development.js +6 -217
- package/dist/reactist.cjs.development.js.map +1 -1
- package/dist/reactist.cjs.production.min.js +1 -1
- package/dist/reactist.cjs.production.min.js.map +1 -1
- package/es/index.js +0 -1
- package/es/index.js.map +1 -1
- package/es/text-area/text-area.module.css.js +1 -1
- package/es/toast/use-toasts.js +5 -3
- package/es/toast/use-toasts.js.map +1 -1
- package/lib/index.d.ts +0 -1
- package/lib/index.js +1 -1
- package/lib/text-area/text-area.module.css.js +1 -1
- package/lib/toast/use-toasts.d.ts +5 -1
- package/lib/toast/use-toasts.js +1 -1
- package/lib/toast/use-toasts.js.map +1 -1
- package/package.json +4 -5
- package/styles/reactist.css +2 -3
- package/styles/text-area.css +1 -1
- package/styles/text-area.module.css.css +1 -1
- package/es/deprecated-modal/modal.js +0 -219
- package/es/deprecated-modal/modal.js.map +0 -1
- package/es/deprecated-modal/modal.module.css.js +0 -4
- package/es/deprecated-modal/modal.module.css.js.map +0 -1
- package/lib/deprecated-modal/index.d.ts +0 -1
- package/lib/deprecated-modal/modal.d.ts +0 -157
- package/lib/deprecated-modal/modal.js +0 -2
- package/lib/deprecated-modal/modal.js.map +0 -1
- package/lib/deprecated-modal/modal.module.css.js +0 -2
- package/lib/deprecated-modal/modal.module.css.js.map +0 -1
- package/lib/deprecated-modal/modal.test.d.ts +0 -1
|
@@ -15,7 +15,6 @@ var ariaHidden = require('aria-hidden');
|
|
|
15
15
|
var ReactDOM = _interopDefault(require('react-dom'));
|
|
16
16
|
var dayjs = _interopDefault(require('dayjs'));
|
|
17
17
|
var LocalizedFormat = _interopDefault(require('dayjs/plugin/localizedFormat'));
|
|
18
|
-
var dialog = require('@reach/dialog');
|
|
19
18
|
|
|
20
19
|
function ownKeys(object, enumerableOnly) {
|
|
21
20
|
var keys = Object.keys(object);
|
|
@@ -1274,7 +1273,8 @@ function ToastsProvider({
|
|
|
1274
1273
|
defaultAutoDismissDelay = 10
|
|
1275
1274
|
/* seconds */
|
|
1276
1275
|
,
|
|
1277
|
-
defaultDismissLabel = 'Close'
|
|
1276
|
+
defaultDismissLabel = 'Close',
|
|
1277
|
+
containerClassName
|
|
1278
1278
|
}) {
|
|
1279
1279
|
const [toasts, setToasts] = React__default.useState([]);
|
|
1280
1280
|
const {
|
|
@@ -1308,11 +1308,12 @@ function ToastsProvider({
|
|
|
1308
1308
|
return /*#__PURE__*/React__default.createElement(ToastsContext.Provider, {
|
|
1309
1309
|
value: showToast
|
|
1310
1310
|
}, children, /*#__PURE__*/React__default.createElement(react.Portal, null, toasts.length === 0 ? null : /*#__PURE__*/React__default.createElement(Box, {
|
|
1311
|
-
className: modules_d11e18f0.stackedToastsView,
|
|
1311
|
+
className: [modules_d11e18f0.stackedToastsView, containerClassName],
|
|
1312
1312
|
position: "fixed",
|
|
1313
1313
|
width: "full",
|
|
1314
1314
|
paddingX: padding,
|
|
1315
|
-
paddingBottom: padding
|
|
1315
|
+
paddingBottom: padding,
|
|
1316
|
+
"data-testid": "toasts-container"
|
|
1316
1317
|
}, /*#__PURE__*/React__default.createElement(Stack, {
|
|
1317
1318
|
space: "medium"
|
|
1318
1319
|
}, toasts.map(_ref => {
|
|
@@ -2028,7 +2029,7 @@ const SwitchField = /*#__PURE__*/React.forwardRef(function SwitchField(_ref, ref
|
|
|
2028
2029
|
}, hint) : null);
|
|
2029
2030
|
});
|
|
2030
2031
|
|
|
2031
|
-
var modules_2728c236 = {"textAreaContainer":"
|
|
2032
|
+
var modules_2728c236 = {"textAreaContainer":"_29503131","innerContainer":"_6ea894ce","bordered":"e1e8b6a7","error":"_1b94ff46","autoExpand":"e82223c4"};
|
|
2032
2033
|
|
|
2033
2034
|
const _excluded$o = ["variant", "id", "label", "secondaryLabel", "auxiliaryLabel", "hint", "message", "tone", "maxWidth", "hidden", "aria-describedby", "rows", "autoExpand"];
|
|
2034
2035
|
const TextArea = /*#__PURE__*/React.forwardRef(function TextArea(_ref, ref) {
|
|
@@ -3691,212 +3692,6 @@ Select.defaultProps = {
|
|
|
3691
3692
|
disabled: false
|
|
3692
3693
|
};
|
|
3693
3694
|
|
|
3694
|
-
var modules_8f59d13b$1 = {"reach-portal":"ad18b0a0","fadein":"f7a1b219","fitContent":"_8ed9bb5c","container":"f67e892e","full":"_4139421e","large":"_649eb5fe","medium":"_5323e676","small":"_56ca7ae6","xlarge":"a7be0fce","overlay":"_88a7a680","expand":"b29456b8","buttonContainer":"_09ef1f4f","headerContent":"_0e5b530a"};
|
|
3695
|
-
|
|
3696
|
-
const _excluded$y = ["isOpen", "onDismiss", "height", "width", "exceptionallySetClassName", "autoFocus", "children"],
|
|
3697
|
-
_excluded2$4 = ["children", "button", "withDivider", "exceptionallySetClassName"],
|
|
3698
|
-
_excluded3$3 = ["exceptionallySetClassName", "children"],
|
|
3699
|
-
_excluded4$2 = ["exceptionallySetClassName", "withDivider"],
|
|
3700
|
-
_excluded5$2 = ["children"];
|
|
3701
|
-
const ModalContext$1 = /*#__PURE__*/React.createContext({
|
|
3702
|
-
onDismiss: undefined,
|
|
3703
|
-
height: 'fitContent'
|
|
3704
|
-
});
|
|
3705
|
-
|
|
3706
|
-
function isNotInternalFrame$1(element) {
|
|
3707
|
-
return !(element.ownerDocument === document && element.tagName.toLowerCase() === 'iframe');
|
|
3708
|
-
}
|
|
3709
|
-
/**
|
|
3710
|
-
* Renders a modal that sits on top of the rest of the content in the entire page.
|
|
3711
|
-
*
|
|
3712
|
-
* Follows the WAI-ARIA Dialog (Modal) Pattern.
|
|
3713
|
-
*
|
|
3714
|
-
* @see DeprecatedModalHeader
|
|
3715
|
-
* @see DeprecatedModalFooter
|
|
3716
|
-
* @see DeprecatedModalBody
|
|
3717
|
-
* @deprecated
|
|
3718
|
-
*/
|
|
3719
|
-
|
|
3720
|
-
|
|
3721
|
-
function DeprecatedModal(_ref) {
|
|
3722
|
-
let {
|
|
3723
|
-
isOpen,
|
|
3724
|
-
onDismiss,
|
|
3725
|
-
height = 'fitContent',
|
|
3726
|
-
width = 'medium',
|
|
3727
|
-
exceptionallySetClassName,
|
|
3728
|
-
autoFocus = true,
|
|
3729
|
-
children
|
|
3730
|
-
} = _ref,
|
|
3731
|
-
props = _objectWithoutProperties(_ref, _excluded$y);
|
|
3732
|
-
|
|
3733
|
-
const contextValue = React.useMemo(() => ({
|
|
3734
|
-
onDismiss,
|
|
3735
|
-
height
|
|
3736
|
-
}), [onDismiss, height]);
|
|
3737
|
-
return /*#__PURE__*/React.createElement(dialog.DialogOverlay, {
|
|
3738
|
-
isOpen: isOpen,
|
|
3739
|
-
onDismiss: onDismiss,
|
|
3740
|
-
dangerouslyBypassFocusLock // We're setting up our own focus lock below
|
|
3741
|
-
: true,
|
|
3742
|
-
className: classNames(modules_8f59d13b$1.overlay, modules_8f59d13b$1[height], modules_8f59d13b$1[width]),
|
|
3743
|
-
"data-testid": "modal-overlay"
|
|
3744
|
-
}, /*#__PURE__*/React.createElement(FocusLock, {
|
|
3745
|
-
autoFocus: autoFocus,
|
|
3746
|
-
whiteList: isNotInternalFrame$1,
|
|
3747
|
-
returnFocus: true
|
|
3748
|
-
}, /*#__PURE__*/React.createElement(dialog.DialogContent, _objectSpread2(_objectSpread2({}, props), {}, {
|
|
3749
|
-
as: Box,
|
|
3750
|
-
borderRadius: "full",
|
|
3751
|
-
background: "default",
|
|
3752
|
-
display: "flex",
|
|
3753
|
-
flexDirection: "column",
|
|
3754
|
-
overflow: "hidden",
|
|
3755
|
-
height: height === 'expand' ? 'full' : undefined,
|
|
3756
|
-
flexGrow: height === 'expand' ? 1 : 0,
|
|
3757
|
-
className: [exceptionallySetClassName, modules_8f59d13b$1.container]
|
|
3758
|
-
}), /*#__PURE__*/React.createElement(ModalContext$1.Provider, {
|
|
3759
|
-
value: contextValue
|
|
3760
|
-
}, children))));
|
|
3761
|
-
}
|
|
3762
|
-
/**
|
|
3763
|
-
* The close button rendered by ModalHeader. Provided independently so that consumers can customize
|
|
3764
|
-
* the button's label.
|
|
3765
|
-
*
|
|
3766
|
-
* @see DeprecatedModalHeader
|
|
3767
|
-
*/
|
|
3768
|
-
|
|
3769
|
-
function DeprecatedModalCloseButton(props) {
|
|
3770
|
-
const {
|
|
3771
|
-
onDismiss
|
|
3772
|
-
} = React.useContext(ModalContext$1);
|
|
3773
|
-
const [includeInTabOrder, setIncludeInTabOrder] = React.useState(false);
|
|
3774
|
-
const [isMounted, setIsMounted] = React.useState(false);
|
|
3775
|
-
React.useEffect(function skipAutoFocus() {
|
|
3776
|
-
if (isMounted) {
|
|
3777
|
-
setIncludeInTabOrder(true);
|
|
3778
|
-
} else {
|
|
3779
|
-
setIsMounted(true);
|
|
3780
|
-
}
|
|
3781
|
-
}, [isMounted]);
|
|
3782
|
-
return /*#__PURE__*/React.createElement(Button, _objectSpread2(_objectSpread2({}, props), {}, {
|
|
3783
|
-
variant: "quaternary",
|
|
3784
|
-
onClick: onDismiss,
|
|
3785
|
-
icon: /*#__PURE__*/React.createElement(CloseIcon, null),
|
|
3786
|
-
tabIndex: includeInTabOrder ? 0 : -1
|
|
3787
|
-
}));
|
|
3788
|
-
}
|
|
3789
|
-
/**
|
|
3790
|
-
* Renders a standard modal header area with an optional close button.
|
|
3791
|
-
*
|
|
3792
|
-
* @see DeprecatedModal
|
|
3793
|
-
* @see DeprecatedModalFooter
|
|
3794
|
-
* @see DeprecatedModalBody
|
|
3795
|
-
*/
|
|
3796
|
-
|
|
3797
|
-
function DeprecatedModalHeader(_ref2) {
|
|
3798
|
-
let {
|
|
3799
|
-
children,
|
|
3800
|
-
button = true,
|
|
3801
|
-
withDivider = false,
|
|
3802
|
-
exceptionallySetClassName
|
|
3803
|
-
} = _ref2,
|
|
3804
|
-
props = _objectWithoutProperties(_ref2, _excluded2$4);
|
|
3805
|
-
|
|
3806
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Box, _objectSpread2(_objectSpread2({}, props), {}, {
|
|
3807
|
-
as: "header",
|
|
3808
|
-
paddingLeft: "large",
|
|
3809
|
-
paddingRight: button === false || button === null ? 'large' : 'small',
|
|
3810
|
-
paddingY: "small",
|
|
3811
|
-
className: exceptionallySetClassName
|
|
3812
|
-
}), /*#__PURE__*/React.createElement(Columns, {
|
|
3813
|
-
space: "large",
|
|
3814
|
-
alignY: "center"
|
|
3815
|
-
}, /*#__PURE__*/React.createElement(Column, {
|
|
3816
|
-
width: "auto"
|
|
3817
|
-
}, children), button === false || button === null ? /*#__PURE__*/React.createElement("div", {
|
|
3818
|
-
className: modules_8f59d13b$1.headerContent
|
|
3819
|
-
}) : /*#__PURE__*/React.createElement(Column, {
|
|
3820
|
-
width: "content",
|
|
3821
|
-
exceptionallySetClassName: modules_8f59d13b$1.buttonContainer,
|
|
3822
|
-
"data-testid": "button-container"
|
|
3823
|
-
}, typeof button === 'boolean' ? /*#__PURE__*/React.createElement(DeprecatedModalCloseButton, {
|
|
3824
|
-
"aria-label": "Close modal",
|
|
3825
|
-
autoFocus: false
|
|
3826
|
-
}) : button))), withDivider ? /*#__PURE__*/React.createElement(Divider, null) : null);
|
|
3827
|
-
}
|
|
3828
|
-
/**
|
|
3829
|
-
* Renders the body of a modal.
|
|
3830
|
-
*
|
|
3831
|
-
* Convenient to use alongside ModalHeader and/or ModalFooter as needed. It ensures, among other
|
|
3832
|
-
* things, that the contet of the modal body expands or contracts depending on the modal height
|
|
3833
|
-
* setting or the size of the content. The body content also automatically scrolls when it's too
|
|
3834
|
-
* large to fit the available space.
|
|
3835
|
-
*
|
|
3836
|
-
* @see DeprecatedModal
|
|
3837
|
-
* @see DeprecatedModalHeader
|
|
3838
|
-
* @see DeprecatedModalFooter
|
|
3839
|
-
*/
|
|
3840
|
-
|
|
3841
|
-
function DeprecatedModalBody(_ref3) {
|
|
3842
|
-
let {
|
|
3843
|
-
exceptionallySetClassName,
|
|
3844
|
-
children
|
|
3845
|
-
} = _ref3,
|
|
3846
|
-
props = _objectWithoutProperties(_ref3, _excluded3$3);
|
|
3847
|
-
|
|
3848
|
-
const {
|
|
3849
|
-
height
|
|
3850
|
-
} = React.useContext(ModalContext$1);
|
|
3851
|
-
return /*#__PURE__*/React.createElement(Box, _objectSpread2(_objectSpread2({}, props), {}, {
|
|
3852
|
-
className: exceptionallySetClassName,
|
|
3853
|
-
flexGrow: height === 'expand' ? 1 : 0,
|
|
3854
|
-
height: height === 'expand' ? 'full' : undefined,
|
|
3855
|
-
overflow: "auto"
|
|
3856
|
-
}), /*#__PURE__*/React.createElement(Box, {
|
|
3857
|
-
padding: "large",
|
|
3858
|
-
paddingBottom: "xxlarge"
|
|
3859
|
-
}, children));
|
|
3860
|
-
}
|
|
3861
|
-
/**
|
|
3862
|
-
* Renders a standard modal footer area.
|
|
3863
|
-
*
|
|
3864
|
-
* @see DeprecatedModal
|
|
3865
|
-
* @see DeprecatedModalHeader
|
|
3866
|
-
* @see DeprecatedModalBody
|
|
3867
|
-
*/
|
|
3868
|
-
|
|
3869
|
-
function DeprecatedModalFooter(_ref4) {
|
|
3870
|
-
let {
|
|
3871
|
-
exceptionallySetClassName,
|
|
3872
|
-
withDivider = false
|
|
3873
|
-
} = _ref4,
|
|
3874
|
-
props = _objectWithoutProperties(_ref4, _excluded4$2);
|
|
3875
|
-
|
|
3876
|
-
return /*#__PURE__*/React.createElement(React.Fragment, null, withDivider ? /*#__PURE__*/React.createElement(Divider, null) : null, /*#__PURE__*/React.createElement(Box, _objectSpread2(_objectSpread2({
|
|
3877
|
-
as: "footer"
|
|
3878
|
-
}, props), {}, {
|
|
3879
|
-
className: exceptionallySetClassName,
|
|
3880
|
-
padding: "large"
|
|
3881
|
-
})));
|
|
3882
|
-
}
|
|
3883
|
-
/**
|
|
3884
|
-
* A specific version of the ModalFooter, tailored to showing an inline list of actions (buttons).
|
|
3885
|
-
* @see DeprecatedModalFooter
|
|
3886
|
-
*/
|
|
3887
|
-
|
|
3888
|
-
function DeprecatedModalActions(_ref5) {
|
|
3889
|
-
let {
|
|
3890
|
-
children
|
|
3891
|
-
} = _ref5,
|
|
3892
|
-
props = _objectWithoutProperties(_ref5, _excluded5$2);
|
|
3893
|
-
|
|
3894
|
-
return /*#__PURE__*/React.createElement(DeprecatedModalFooter, _objectSpread2({}, props), /*#__PURE__*/React.createElement(Inline, {
|
|
3895
|
-
align: "right",
|
|
3896
|
-
space: "large"
|
|
3897
|
-
}, children));
|
|
3898
|
-
}
|
|
3899
|
-
|
|
3900
3695
|
exports.Alert = Alert;
|
|
3901
3696
|
exports.Avatar = Avatar;
|
|
3902
3697
|
exports.Badge = Badge;
|
|
@@ -3913,12 +3708,6 @@ exports.ContextMenuTrigger = ContextMenuTrigger;
|
|
|
3913
3708
|
exports.DeprecatedButton = Button$1;
|
|
3914
3709
|
exports.DeprecatedDropdown = Dropdown;
|
|
3915
3710
|
exports.DeprecatedInput = Input;
|
|
3916
|
-
exports.DeprecatedModal = DeprecatedModal;
|
|
3917
|
-
exports.DeprecatedModalActions = DeprecatedModalActions;
|
|
3918
|
-
exports.DeprecatedModalBody = DeprecatedModalBody;
|
|
3919
|
-
exports.DeprecatedModalCloseButton = DeprecatedModalCloseButton;
|
|
3920
|
-
exports.DeprecatedModalFooter = DeprecatedModalFooter;
|
|
3921
|
-
exports.DeprecatedModalHeader = DeprecatedModalHeader;
|
|
3922
3711
|
exports.DeprecatedSelect = Select;
|
|
3923
3712
|
exports.Divider = Divider;
|
|
3924
3713
|
exports.Heading = Heading;
|