@doist/reactist 22.0.0-beta → 22.0.0

package/dist/reactist.cjs.development.js

@@ -20,7 +20,6 @@ var Ariakit = require('ariakit/menu');
 var ReactDOM = _interopDefault(require('react-dom'));
 var dayjs = _interopDefault(require('dayjs'));
 var LocalizedFormat = _interopDefault(require('dayjs/plugin/localizedFormat'));
-var dialog$1 = require('@reach/dialog');
 
 function ownKeys(object, enumerableOnly) {
   var keys = Object.keys(object);
@@ -1321,7 +1320,8 @@ function ToastsProvider({
   defaultAutoDismissDelay = 10
   /* seconds */
   ,
-  defaultDismissLabel = 'Close'
+  defaultDismissLabel = 'Close',
+  containerClassName
 }) {
   const [toasts, setToasts] = React__default.useState([]);
   const {
@@ -1355,11 +1355,12 @@ function ToastsProvider({
   return /*#__PURE__*/React__default.createElement(ToastsContext.Provider, {
     value: showToast
   }, children, /*#__PURE__*/React__default.createElement(portal.Portal, null, toasts.length === 0 ? null : /*#__PURE__*/React__default.createElement(Box, {
-    className: modules_d11e18f0.stackedToastsView,
+    className: [modules_d11e18f0.stackedToastsView, containerClassName],
     position: "fixed",
     width: "full",
     paddingX: padding,
-    paddingBottom: padding
+    paddingBottom: padding,
+    "data-testid": "toasts-container"
   }, /*#__PURE__*/React__default.createElement(Stack, {
     space: "medium"
   }, toasts.map(_ref => {
@@ -2044,7 +2045,7 @@ const SwitchField = /*#__PURE__*/React.forwardRef(function SwitchField(_ref, ref
   }, hint) : null);
 });
 
-var modules_2728c236 = {"textAreaContainer":"fdc243b3","innerContainer":"_5c1dd8bc","bordered":"_269f9e63","error":"d1e4b585","autoExpand":"_10c6f2ef"};
+var modules_2728c236 = {"textAreaContainer":"_29503131","innerContainer":"_6ea894ce","bordered":"e1e8b6a7","error":"_1b94ff46","autoExpand":"e82223c4"};
 
 const _excluded$o = ["variant", "id", "label", "secondaryLabel", "auxiliaryLabel", "hint", "message", "tone", "maxWidth", "hidden", "aria-describedby", "rows", "autoExpand"];
 const TextArea = /*#__PURE__*/React.forwardRef(function TextArea(_ref, ref) {
@@ -2647,18 +2648,12 @@ function TabAwareSlot({
   }) : null;
 }
 
-var modules_2befbba6 = {"menuList":"c63e79f3","subMenuList":"_1e89cfc6","iconMenuItem":"_1b808bea","menuItem":"_8607099d","legacyLayout":"_609759d5","menuGroupLabel":"f1730843","menuItemIcon":"_7cec7dce","menuItemLabel":"_91c012d8","menuItemDescription":"bb494fd4","destructive":"_503b074a","menuGroupInfo":"ad6d2e4a","iconsMenuGroup":"_410b11f2"};
-
 const _excluded$t = ["children", "onItemSelect"],
       _excluded2$3 = ["exceptionallySetClassName"],
-      _excluded3$2 = ["exceptionallySetClassName", "label", "icon"],
-      _excluded4$1 = ["as"],
-      _excluded5$1 = ["exceptionallySetClassName", "modal"],
-      _excluded6 = ["exceptionallySetClassName", "modal"],
-      _excluded7 = ["value", "label", "description", "icon", "shortcut", "tone", "children", "onSelect", "hideOnSelect", "onClick", "exceptionallySetClassName", "as"],
-      _excluded8 = ["label", "info", "children", "exceptionallySetClassName"],
-      _excluded9 = ["value", "label", "description", "icon", "onSelect", "hideOnSelect", "onClick", "exceptionallySetClassName", "as"],
-      _excluded10 = ["children"];
+      _excluded3$2 = ["as"],
+      _excluded4$1 = ["exceptionallySetClassName", "modal"],
+      _excluded5$1 = ["value", "children", "onSelect", "hideOnSelect", "onClick", "exceptionallySetClassName", "as"],
+      _excluded6 = ["label", "children", "exceptionallySetClassName"];
 const MenuContext = /*#__PURE__*/React.createContext( // Ariakit gives us no means to obtain a valid initial/default value of type MenuStateReturn
 // (it is normally obtained by calling useMenuState but we can't call hooks outside components).
 // This is however of little consequence since this value is only used if some of the components
@@ -2670,7 +2665,7 @@ const MenuContext = /*#__PURE__*/React.createContext( // Ariakit gives us no mea
  * management for the menu components inside it.
  */
 
-const Menu = /*#__PURE__*/React.forwardRef(function Menu(_ref, ref) {
+function Menu(_ref) {
   let {
     children,
     onItemSelect
@@ -2690,9 +2685,6 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(_ref, ref) {
   React.useEffect(() => {
     if (!state.open) handleAnchorRectChange(null);
   }, [state.open]);
-  React.useImperativeHandle(ref, () => ({
-    open: state.show
-  }));
   const handleItemSelect = React.useCallback(function handleItemSelect(value) {
     if (onItemSelect) onItemSelect(value);
   }, [onItemSelect]);
@@ -2704,11 +2696,12 @@ const Menu = /*#__PURE__*/React.forwardRef(function Menu(_ref, ref) {
   return /*#__PURE__*/React.createElement(MenuContext.Provider, {
     value: value
   }, children);
-});
+}
 /**
  * A button to toggle a dropdown menu open or closed.
  */
 
+
 const MenuButton = /*#__PURE__*/polymorphicComponent(function MenuButton(_ref2, ref) {
   let {
     exceptionallySetClassName
@@ -2721,104 +2714,17 @@ const MenuButton = /*#__PURE__*/polymorphicComponent(function MenuButton(_ref2,
   return /*#__PURE__*/React.createElement(Ariakit.MenuButton, _objectSpread2(_objectSpread2({}, props), {}, {
     state: state,
     ref: ref,
-    className: exceptionallySetClassName
-  }));
-});
-/**
- * Renders the content inside a standard MenuItem. It is extracted into a component for reuse in
- * the SubMenuItem, which is a MenuItem visually, but semantically it's closer to be a MenuButton.
- * @private
- */
-
-function MenuItemContent({
-  label,
-  description,
-  icon,
-  shortcut,
-  id
-}) {
-  if (!label) return null;
-  return /*#__PURE__*/React.createElement(Box, {
-    display: "flex",
-    gap: "small",
-    alignItems: "center",
-    width: "full",
-    "aria-hidden": true
-  }, icon ? /*#__PURE__*/React.createElement("div", {
-    className: modules_2befbba6.menuItemIcon
-  }, icon) : null, /*#__PURE__*/React.createElement(Box, {
-    display: "inlineFlex",
-    flexDirection: "column",
-    gap: "xsmall",
-    paddingY: "xsmall",
-    alignItems: "flexStart",
-    overflow: "hidden",
-    flexGrow: 1
-  }, /*#__PURE__*/React.createElement(Text, {
-    id: id + "-label",
-    weight: description ? 'semibold' : 'regular',
-    size: "copy",
-    lineClamp: 1,
-    exceptionallySetClassName: modules_2befbba6.menuItemLabel
-  }, label), description ? /*#__PURE__*/React.createElement(Text, {
-    id: id + "-description",
-    size: "copy",
-    tone: "secondary",
-    exceptionallySetClassName: modules_2befbba6.menuItemDescription
-  }, description) : null), shortcut ? /*#__PURE__*/React.createElement("div", null, shortcut) : null);
-} //
-// SubMenuItem
-//
-
-
-function ArrowRightIcon() {
-  return /*#__PURE__*/React.createElement("svg", {
-    width: "24",
-    height: "24"
-  }, /*#__PURE__*/React.createElement("path", {
-    d: "M14.243 12L9.646 7.404a.5.5 0 1 1 .708-.707l4.95 4.95a.5.5 0 0 1 0 .707l-4.95 4.95a.5.5 0 0 1-.708-.708L14.243 12z",
-    fill: "currentColor",
-    fillRule: "evenodd"
-  }));
-}
-/**
- * A menu item to toggle a sub-menu open or closed.
- */
-
-
-const SubMenuItem = /*#__PURE__*/polymorphicComponent(function SubMenuItem(_ref3, ref) {
-  let {
-    exceptionallySetClassName,
-    label,
-    icon
-  } = _ref3,
-      props = _objectWithoutProperties(_ref3, _excluded3$2);
-
-  const id = useId(props.id);
-  const {
-    state
-  } = React.useContext(MenuContext);
-  return /*#__PURE__*/React.createElement(Ariakit.MenuButton, _objectSpread2(_objectSpread2({
-    "aria-labelledby": label && !props['aria-label'] ? id + "-label" : undefined
-  }, props), {}, {
-    state: state,
-    ref: ref,
-    className: classNames(modules_2befbba6.menuItem, exceptionallySetClassName)
-  }), /*#__PURE__*/React.createElement(MenuItemContent, {
-    id: id,
-    icon: icon,
-    label: label,
-    shortcut: /*#__PURE__*/React.createElement(ArrowRightIcon, null)
+    className: classNames('reactist_menubutton', exceptionallySetClassName)
   }));
 }); //
 // ContextMenuTrigger
 //
 
-const ContextMenuTrigger = /*#__PURE__*/polymorphicComponent(function ContextMenuTrigger(_ref4, ref) {
+const ContextMenuTrigger = /*#__PURE__*/polymorphicComponent(function ContextMenuTrigger(_ref3, ref) {
   let {
     as: component = 'div'
-  } = _ref4,
-      props = _objectWithoutProperties(_ref4, _excluded4$1);
+  } = _ref3,
+      props = _objectWithoutProperties(_ref3, _excluded3$2);
 
   const {
     handleAnchorRectChange,
@@ -2841,59 +2747,42 @@ const ContextMenuTrigger = /*#__PURE__*/polymorphicComponent(function ContextMen
  * The dropdown menu itself, containing a list of menu items.
  */
 
-const MenuList = /*#__PURE__*/polymorphicComponent(function MenuList(_ref5, ref) {
+const MenuList = /*#__PURE__*/polymorphicComponent(function MenuList(_ref4, ref) {
   let {
     exceptionallySetClassName,
     modal = true
-  } = _ref5,
-      props = _objectWithoutProperties(_ref5, _excluded5$1);
+  } = _ref4,
+      props = _objectWithoutProperties(_ref4, _excluded4$1);
 
   const {
     state
   } = React.useContext(MenuContext);
-  if (!state.open) return null;
-  return /*#__PURE__*/React.createElement(portal.Portal, {
+  return state.open ? /*#__PURE__*/React.createElement(portal.Portal, {
     preserveTabOrder: true
   }, /*#__PURE__*/React.createElement(Ariakit.Menu, _objectSpread2(_objectSpread2({}, props), {}, {
     state: state,
     ref: ref,
-    className: classNames(modules_2befbba6.menuList, exceptionallySetClassName),
+    className: classNames('reactist_menulist', exceptionallySetClassName),
     modal: modal
-  })));
+  }))) : null;
 });
 /**
- * Mostly equivalent to the `MenuList`, but to be used inside a `SubMenu`.
+ * A menu item inside a menu list. It can be selected by the user, triggering the `onSelect`
+ * callback.
  */
 
-const SubMenuList = /*#__PURE__*/polymorphicComponent(function SubMenuList(_ref6, ref) {
+const MenuItem = /*#__PURE__*/polymorphicComponent(function MenuItem(_ref5, ref) {
   let {
+    value,
+    children,
+    onSelect,
+    hideOnSelect = true,
+    onClick,
     exceptionallySetClassName,
-    modal = true
-  } = _ref6,
-      props = _objectWithoutProperties(_ref6, _excluded6);
-
-  const {
-    state
-  } = React.useContext(MenuContext);
-  if (!state.open) return null;
-  return /*#__PURE__*/React.createElement(portal.Portal, {
-    preserveTabOrder: true
-  }, /*#__PURE__*/React.createElement(Ariakit.Menu, _objectSpread2(_objectSpread2({}, props), {}, {
-    state: state,
-    ref: ref,
-    className: classNames(modules_2befbba6.menuList, modules_2befbba6.subMenuList, exceptionallySetClassName),
-    modal: modal
-  })));
-}); //
-// MenuItem
-//
+    as = 'button'
+  } = _ref5,
+      props = _objectWithoutProperties(_ref5, _excluded5$1);
 
-function useMenuItemClickHandler({
-  value,
-  hideOnSelect,
-  onClick,
-  onSelect
-}) {
   const {
     handleItemSelect,
     state
@@ -2901,95 +2790,42 @@ function useMenuItemClickHandler({
   const {
     hide
   } = state;
-  return React.useCallback(function handleClick(event) {
+  const handleClick = React.useCallback(function handleClick(event) {
     onClick == null ? void 0 : onClick(event);
     const onSelectResult = onSelect && !event.defaultPrevented ? onSelect() : undefined;
     const shouldClose = onSelectResult !== false && hideOnSelect;
     handleItemSelect(value);
     if (shouldClose) hide();
   }, [onSelect, onClick, handleItemSelect, hideOnSelect, hide, value]);
-}
-/**
- * A menu item inside a menu list. It can be selected by the user, triggering the `onSelect`
- * callback.
- */
-
-
-const MenuItem = /*#__PURE__*/polymorphicComponent(function MenuItem(_ref7, ref) {
-  let {
-    value,
-    label,
-    description,
-    icon,
-    shortcut,
-    tone,
-    children,
-    onSelect,
-    hideOnSelect = true,
-    onClick,
-    exceptionallySetClassName,
-    as = 'button'
-  } = _ref7,
-      props = _objectWithoutProperties(_ref7, _excluded7);
-
-  const id = useId(props.id);
-  const {
-    state
-  } = React.useContext(MenuContext);
-  const handleClick = useMenuItemClickHandler({
-    value,
-    onSelect,
-    onClick,
-    hideOnSelect
-  });
-  return /*#__PURE__*/React.createElement(Ariakit.MenuItem, _objectSpread2(_objectSpread2({
-    "aria-labelledby": label && !props['aria-label'] ? id + "-label" : undefined,
-    "aria-describedby": label && description ? id + "-description" : undefined
-  }, props), {}, {
+  return /*#__PURE__*/React.createElement(Ariakit.MenuItem, _objectSpread2(_objectSpread2({}, props), {}, {
     as: as,
     state: state,
     ref: ref,
     onClick: handleClick,
-    className: classNames(modules_2befbba6.menuItem, tone === 'destructive' ? modules_2befbba6.destructive : null, exceptionallySetClassName),
+    className: exceptionallySetClassName,
     hideOnClick: false
-  }), children ? /*#__PURE__*/React.createElement(Box, {
-    width: "full",
-    className: label ? undefined : modules_2befbba6.legacyLayout
-  }, children) : null, /*#__PURE__*/React.createElement(MenuItemContent, {
-    id: id,
-    icon: icon,
-    label: label,
-    description: description,
-    shortcut: shortcut
-  }));
+  }), children);
 });
 /**
- * This component can be rendered alongside other `MenuItem` elements inside a `MenuList` to show a
- * sub-menu.
+ * This component can be rendered alongside other `MenuItem` inside a `MenuList` in order to have
+ * a sub-menu.
  *
- * Its children are expected to be exactly two elements, in the following order:
- *
- * 1. A `SubMenuItem` element: the menu item that triggers the sub-menu to open.
- * 2. A `SubMenuList` element: the list of menu items that will be shown when the sub-menu is open.
- *
- * ## Usage
+ * Its children are expected to have the structure of a first level menu (a `MenuButton` and a
+ * `MenuList`).
  *
  * ```jsx
- * <Menu>
- *   <MenuButton>Menu</MenuButton>
+ * <MenuItem label="Edit profile" />
+ * <SubMenu>
+ *   <MenuButton>More options</MenuButton>
  *   <MenuList>
- *     <MenuItem label="Item 1" />
- *     <MenuItem label="Item 2" />
- *     <SubMenu>
- *       <SubMenuItem label="Submenu" />
- *       <SubMenuList>
- *         <MenuItem label="Submenu Item 1" />
- *         <MenuItem label="Submenu Item 2" />
- *       </SubMenuList>
- *     </SubMenu>
+ *     <MenuItem label="Preferences" />
+ *     <MenuItem label="Sign out" />
  *   </MenuList>
- * </Menu>
+ * </SubMenu>
  * ```
+ *
+ * The `MenuButton` will become a menu item in the current menu items list, and it will lead to
+ * opening a sub-menu with the menu items list below it.
  */
 
 const SubMenu = /*#__PURE__*/React.forwardRef(function SubMenu({
@@ -3021,9 +2857,7 @@ const SubMenu = /*#__PURE__*/React.forwardRef(function SubMenu({
     state: state,
     ref: ref,
     hideOnClick: false
-  }, renderMenuButton), /*#__PURE__*/React.createElement("div", {
-    className: modules_2befbba6.subMenuContainer
-  }, list));
+  }, renderMenuButton), list);
 });
 /**
  * A way to semantically group some menu items.
@@ -3032,100 +2866,25 @@ const SubMenu = /*#__PURE__*/React.forwardRef(function SubMenu({
  * before and/or after the group if you so wish.
  */
 
-const MenuGroup = /*#__PURE__*/polymorphicComponent(function MenuGroup(_ref8, ref) {
+const MenuGroup = /*#__PURE__*/polymorphicComponent(function MenuGroup(_ref6, ref) {
   let {
     label,
-    info,
     children,
     exceptionallySetClassName
-  } = _ref8,
-      props = _objectWithoutProperties(_ref8, _excluded8);
+  } = _ref6,
+      props = _objectWithoutProperties(_ref6, _excluded6);
 
-  const id = useId(props.id);
   const {
     state
   } = React.useContext(MenuContext);
-  return /*#__PURE__*/React.createElement(Ariakit.MenuGroup, _objectSpread2(_objectSpread2({
-    "aria-labelledby": "menugroup-label-" + id
-  }, props), {}, {
-    id: id,
+  return /*#__PURE__*/React.createElement(Ariakit.MenuGroup, _objectSpread2(_objectSpread2({}, props), {}, {
     ref: ref,
     state: state,
     className: exceptionallySetClassName
-  }), /*#__PURE__*/React.createElement(Box, {
-    display: "flex",
-    alignItems: "center",
-    gap: "small",
-    className: modules_2befbba6.menuGroupLabel
-  }, /*#__PURE__*/React.createElement(Text, {
-    id: "menugroup-label-" + id,
-    size: "copy",
-    weight: "semibold"
-  }, label), info ? /*#__PURE__*/React.createElement(Box, {
-    flexShrink: 0,
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    className: modules_2befbba6.menuGroupInfo
-  }, info) : null), children);
-});
-/**
- * A menu item that visually only shows as an icon. It must be used inside an `IconsMenuGroup`.
- */
-
-const IconMenuItem = /*#__PURE__*/polymorphicComponent(function IconMenuItem(_ref9, ref) {
-  let {
-    value,
-    label,
-    description,
-    icon,
-    onSelect,
-    hideOnSelect = true,
-    onClick,
-    exceptionallySetClassName,
-    as = 'button'
-  } = _ref9,
-      props = _objectWithoutProperties(_ref9, _excluded9);
-
-  const id = useId(props.id);
-  const {
-    state
-  } = React.useContext(MenuContext);
-  const handleClick = useMenuItemClickHandler({
-    value,
-    onSelect,
-    onClick,
-    hideOnSelect
-  });
-  return /*#__PURE__*/React.createElement(Tooltip, {
-    content: label
-  }, /*#__PURE__*/React.createElement(Ariakit.MenuItem, _objectSpread2(_objectSpread2({
-    "aria-label": label,
-    "aria-describedby": id + "-description"
-  }, props), {}, {
-    as: as,
-    state: state,
-    ref: ref,
-    onClick: handleClick,
-    className: classNames(modules_2befbba6.iconMenuItem, exceptionallySetClassName),
-    hideOnClick: false
-  }), icon));
-});
-/**
- * Semantically equivalent to `MenuGroup`, but meant to group `IconMenuItem`s only.
- */
-
-const IconsMenuGroup = /*#__PURE__*/polymorphicComponent(function IconsMenuGroup(_ref10, ref) {
-  let {
-    children
-  } = _ref10,
-      props = _objectWithoutProperties(_ref10, _excluded10);
-
-  return /*#__PURE__*/React.createElement(MenuGroup, _objectSpread2(_objectSpread2({}, props), {}, {
-    ref: ref
-  }), /*#__PURE__*/React.createElement("div", {
-    className: modules_2befbba6.iconsMenuGroup
-  }, children));
+  }), label ? /*#__PURE__*/React.createElement("div", {
+    role: "presentation",
+    className: "reactist_menugroup__label"
+  }, label) : null, children);
 });
 
 const _excluded$u = ["type", "variant", "size", "loading", "disabled", "tooltip", "onClick", "children"];
@@ -3979,212 +3738,6 @@ Select.defaultProps = {
   disabled: false
 };
 
-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"};
-
-const _excluded$y = ["isOpen", "onDismiss", "height", "width", "exceptionallySetClassName", "autoFocus", "children"],
-      _excluded2$4 = ["children", "button", "withDivider", "exceptionallySetClassName"],
-      _excluded3$3 = ["exceptionallySetClassName", "children"],
-      _excluded4$2 = ["exceptionallySetClassName", "withDivider"],
-      _excluded5$2 = ["children"];
-const ModalContext$1 = /*#__PURE__*/React.createContext({
-  onDismiss: undefined,
-  height: 'fitContent'
-});
-
-function isNotInternalFrame$1(element) {
-  return !(element.ownerDocument === document && element.tagName.toLowerCase() === 'iframe');
-}
-/**
- * Renders a modal that sits on top of the rest of the content in the entire page.
- *
- * Follows the WAI-ARIA Dialog (Modal) Pattern.
- *
- * @see DeprecatedModalHeader
- * @see DeprecatedModalFooter
- * @see DeprecatedModalBody
- * @deprecated
- */
-
-
-function DeprecatedModal(_ref) {
-  let {
-    isOpen,
-    onDismiss,
-    height = 'fitContent',
-    width = 'medium',
-    exceptionallySetClassName,
-    autoFocus = true,
-    children
-  } = _ref,
-      props = _objectWithoutProperties(_ref, _excluded$y);
-
-  const contextValue = React.useMemo(() => ({
-    onDismiss,
-    height
-  }), [onDismiss, height]);
-  return /*#__PURE__*/React.createElement(dialog$1.DialogOverlay, {
-    isOpen: isOpen,
-    onDismiss: onDismiss,
-    dangerouslyBypassFocusLock // We're setting up our own focus lock below
-    : true,
-    className: classNames(modules_8f59d13b$1.overlay, modules_8f59d13b$1[height], modules_8f59d13b$1[width]),
-    "data-testid": "modal-overlay"
-  }, /*#__PURE__*/React.createElement(FocusLock, {
-    autoFocus: autoFocus,
-    whiteList: isNotInternalFrame$1,
-    returnFocus: true
-  }, /*#__PURE__*/React.createElement(dialog$1.DialogContent, _objectSpread2(_objectSpread2({}, props), {}, {
-    as: Box,
-    borderRadius: "full",
-    background: "default",
-    display: "flex",
-    flexDirection: "column",
-    overflow: "hidden",
-    height: height === 'expand' ? 'full' : undefined,
-    flexGrow: height === 'expand' ? 1 : 0,
-    className: [exceptionallySetClassName, modules_8f59d13b$1.container]
-  }), /*#__PURE__*/React.createElement(ModalContext$1.Provider, {
-    value: contextValue
-  }, children))));
-}
-/**
- * The close button rendered by ModalHeader. Provided independently so that consumers can customize
- * the button's label.
- *
- * @see DeprecatedModalHeader
- */
-
-function DeprecatedModalCloseButton(props) {
-  const {
-    onDismiss
-  } = React.useContext(ModalContext$1);
-  const [includeInTabOrder, setIncludeInTabOrder] = React.useState(false);
-  const [isMounted, setIsMounted] = React.useState(false);
-  React.useEffect(function skipAutoFocus() {
-    if (isMounted) {
-      setIncludeInTabOrder(true);
-    } else {
-      setIsMounted(true);
-    }
-  }, [isMounted]);
-  return /*#__PURE__*/React.createElement(Button, _objectSpread2(_objectSpread2({}, props), {}, {
-    variant: "quaternary",
-    onClick: onDismiss,
-    icon: /*#__PURE__*/React.createElement(CloseIcon, null),
-    tabIndex: includeInTabOrder ? 0 : -1
-  }));
-}
-/**
- * Renders a standard modal header area with an optional close button.
- *
- * @see DeprecatedModal
- * @see DeprecatedModalFooter
- * @see DeprecatedModalBody
- */
-
-function DeprecatedModalHeader(_ref2) {
-  let {
-    children,
-    button = true,
-    withDivider = false,
-    exceptionallySetClassName
-  } = _ref2,
-      props = _objectWithoutProperties(_ref2, _excluded2$4);
-
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Box, _objectSpread2(_objectSpread2({}, props), {}, {
-    as: "header",
-    paddingLeft: "large",
-    paddingRight: button === false || button === null ? 'large' : 'small',
-    paddingY: "small",
-    className: exceptionallySetClassName
-  }), /*#__PURE__*/React.createElement(Columns, {
-    space: "large",
-    alignY: "center"
-  }, /*#__PURE__*/React.createElement(Column, {
-    width: "auto"
-  }, children), button === false || button === null ? /*#__PURE__*/React.createElement("div", {
-    className: modules_8f59d13b$1.headerContent
-  }) : /*#__PURE__*/React.createElement(Column, {
-    width: "content",
-    exceptionallySetClassName: modules_8f59d13b$1.buttonContainer,
-    "data-testid": "button-container"
-  }, typeof button === 'boolean' ? /*#__PURE__*/React.createElement(DeprecatedModalCloseButton, {
-    "aria-label": "Close modal",
-    autoFocus: false
-  }) : button))), withDivider ? /*#__PURE__*/React.createElement(Divider, null) : null);
-}
-/**
- * Renders the body of a modal.
- *
- * Convenient to use alongside ModalHeader and/or ModalFooter as needed. It ensures, among other
- * things, that the contet of the modal body expands or contracts depending on the modal height
- * setting or the size of the content. The body content also automatically scrolls when it's too
- * large to fit the available space.
- *
- * @see DeprecatedModal
- * @see DeprecatedModalHeader
- * @see DeprecatedModalFooter
- */
-
-function DeprecatedModalBody(_ref3) {
-  let {
-    exceptionallySetClassName,
-    children
-  } = _ref3,
-      props = _objectWithoutProperties(_ref3, _excluded3$3);
-
-  const {
-    height
-  } = React.useContext(ModalContext$1);
-  return /*#__PURE__*/React.createElement(Box, _objectSpread2(_objectSpread2({}, props), {}, {
-    className: exceptionallySetClassName,
-    flexGrow: height === 'expand' ? 1 : 0,
-    height: height === 'expand' ? 'full' : undefined,
-    overflow: "auto"
-  }), /*#__PURE__*/React.createElement(Box, {
-    padding: "large",
-    paddingBottom: "xxlarge"
-  }, children));
-}
-/**
- * Renders a standard modal footer area.
- *
- * @see DeprecatedModal
- * @see DeprecatedModalHeader
- * @see DeprecatedModalBody
- */
-
-function DeprecatedModalFooter(_ref4) {
-  let {
-    exceptionallySetClassName,
-    withDivider = false
-  } = _ref4,
-      props = _objectWithoutProperties(_ref4, _excluded4$2);
-
-  return /*#__PURE__*/React.createElement(React.Fragment, null, withDivider ? /*#__PURE__*/React.createElement(Divider, null) : null, /*#__PURE__*/React.createElement(Box, _objectSpread2(_objectSpread2({
-    as: "footer"
-  }, props), {}, {
-    className: exceptionallySetClassName,
-    padding: "large"
-  })));
-}
-/**
- * A specific version of the ModalFooter, tailored to showing an inline list of actions (buttons).
- * @see DeprecatedModalFooter
- */
-
-function DeprecatedModalActions(_ref5) {
-  let {
-    children
-  } = _ref5,
-      props = _objectWithoutProperties(_ref5, _excluded5$2);
-
-  return /*#__PURE__*/React.createElement(DeprecatedModalFooter, _objectSpread2({}, props), /*#__PURE__*/React.createElement(Inline, {
-    align: "right",
-    space: "large"
-  }, children));
-}
-
 exports.Alert = Alert;
 exports.Avatar = Avatar;
 exports.Badge = Badge;
@@ -4201,19 +3754,11 @@ exports.ContextMenuTrigger = ContextMenuTrigger;
 exports.DeprecatedButton = Button$1;
 exports.DeprecatedDropdown = Dropdown;
 exports.DeprecatedInput = Input;
-exports.DeprecatedModal = DeprecatedModal;
-exports.DeprecatedModalActions = DeprecatedModalActions;
-exports.DeprecatedModalBody = DeprecatedModalBody;
-exports.DeprecatedModalCloseButton = DeprecatedModalCloseButton;
-exports.DeprecatedModalFooter = DeprecatedModalFooter;
-exports.DeprecatedModalHeader = DeprecatedModalHeader;
 exports.DeprecatedSelect = Select;
 exports.Divider = Divider;
 exports.Heading = Heading;
 exports.Hidden = Hidden;
 exports.HiddenVisually = HiddenVisually;
-exports.IconMenuItem = IconMenuItem;
-exports.IconsMenuGroup = IconsMenuGroup;
 exports.Inline = Inline;
 exports.KeyCapturer = KeyCapturer;
 exports.KeyboardShortcut = KeyboardShortcut;
@@ -4238,8 +3783,6 @@ exports.SelectField = SelectField;
 exports.Stack = Stack;
 exports.StaticToast = StaticToast;
 exports.SubMenu = SubMenu;
-exports.SubMenuItem = SubMenuItem;
-exports.SubMenuList = SubMenuList;
 exports.SwitchField = SwitchField;
 exports.Tab = Tab;
 exports.TabAwareSlot = TabAwareSlot;