@zendeskgarden/react-modals 8.75.1 → 8.76.1

package/dist/esm/elements/Body.js

@@ -0,0 +1,42 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default, { forwardRef } from 'react';
+import '../styled/StyledBackdrop.js';
+import { StyledBody } from '../styled/StyledBody.js';
+import '../styled/StyledClose.js';
+import '../styled/StyledFooter.js';
+import '../styled/StyledFooterItem.js';
+import '../styled/StyledHeader.js';
+import '../styled/StyledDangerIcon.js';
+import '../styled/StyledModal.js';
+import '../styled/StyledTooltipModalBackdrop.js';
+import '../styled/StyledTooltipWrapper.js';
+import '../styled/StyledTooltipModal.js';
+import '../styled/StyledTooltipModalTitle.js';
+import '../styled/StyledTooltipModalBody.js';
+import '../styled/StyledTooltipModalFooter.js';
+import '../styled/StyledTooltipModalFooterItem.js';
+import '../styled/StyledTooltipModalClose.js';
+import '../styled/StyledDrawerModal.js';
+import '../styled/StyledDrawerModalHeader.js';
+import '../styled/StyledDrawerModalClose.js';
+import '../styled/StyledDrawerModalBody.js';
+import '../styled/StyledDrawerModalFooter.js';
+import '../styled/StyledDrawerModalFooterItem.js';
+import { useModalContext } from '../utils/useModalContext.js';
+
+const Body = forwardRef((props, ref) => {
+  const {
+    getContentProps
+  } = useModalContext();
+  return React__default.createElement(StyledBody, Object.assign({}, getContentProps(props), {
+    ref: ref
+  }));
+});
+Body.displayName = 'Body';
+
+export { Body };

package/dist/esm/elements/Close.js

@@ -0,0 +1,53 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default, { forwardRef, useEffect } from 'react';
+import '../styled/StyledBackdrop.js';
+import '../styled/StyledBody.js';
+import { StyledClose } from '../styled/StyledClose.js';
+import '../styled/StyledFooter.js';
+import '../styled/StyledFooterItem.js';
+import '../styled/StyledHeader.js';
+import '../styled/StyledDangerIcon.js';
+import '../styled/StyledModal.js';
+import '../styled/StyledTooltipModalBackdrop.js';
+import '../styled/StyledTooltipWrapper.js';
+import '../styled/StyledTooltipModal.js';
+import '../styled/StyledTooltipModalTitle.js';
+import '../styled/StyledTooltipModalBody.js';
+import '../styled/StyledTooltipModalFooter.js';
+import '../styled/StyledTooltipModalFooterItem.js';
+import '../styled/StyledTooltipModalClose.js';
+import '../styled/StyledDrawerModal.js';
+import '../styled/StyledDrawerModalHeader.js';
+import '../styled/StyledDrawerModalClose.js';
+import '../styled/StyledDrawerModalBody.js';
+import '../styled/StyledDrawerModalFooter.js';
+import '../styled/StyledDrawerModalFooterItem.js';
+import { useText } from '@zendeskgarden/react-theming';
+import { useModalContext } from '../utils/useModalContext.js';
+import SvgXStroke from '../node_modules/@zendeskgarden/svg-icons/src/16/x-stroke.svg.js';
+
+const Close = forwardRef((props, ref) => {
+  const {
+    getCloseProps,
+    setIsCloseButtonPresent
+  } = useModalContext();
+  useEffect(() => {
+    setIsCloseButtonPresent(true);
+    return () => setIsCloseButtonPresent(false);
+  });
+  const ariaLabel = useText(Close, props, 'aria-label', 'Close modal');
+  return React__default.createElement(StyledClose, Object.assign({}, getCloseProps({
+    ...props,
+    'aria-label': ariaLabel
+  }), {
+    ref: ref
+  }), React__default.createElement(SvgXStroke, null));
+});
+Close.displayName = 'Close';
+
+export { Close };

package/dist/esm/elements/DrawerModal/Body.js

@@ -0,0 +1,43 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default, { forwardRef } from 'react';
+import { useModalContext } from '../../utils/useModalContext.js';
+import '../../styled/StyledBackdrop.js';
+import '../../styled/StyledBody.js';
+import '../../styled/StyledClose.js';
+import '../../styled/StyledFooter.js';
+import '../../styled/StyledFooterItem.js';
+import '../../styled/StyledHeader.js';
+import '../../styled/StyledDangerIcon.js';
+import '../../styled/StyledModal.js';
+import '../../styled/StyledTooltipModalBackdrop.js';
+import '../../styled/StyledTooltipWrapper.js';
+import '../../styled/StyledTooltipModal.js';
+import '../../styled/StyledTooltipModalTitle.js';
+import '../../styled/StyledTooltipModalBody.js';
+import '../../styled/StyledTooltipModalFooter.js';
+import '../../styled/StyledTooltipModalFooterItem.js';
+import '../../styled/StyledTooltipModalClose.js';
+import '../../styled/StyledDrawerModal.js';
+import '../../styled/StyledDrawerModalHeader.js';
+import '../../styled/StyledDrawerModalClose.js';
+import { StyledDrawerModalBody } from '../../styled/StyledDrawerModalBody.js';
+import '../../styled/StyledDrawerModalFooter.js';
+import '../../styled/StyledDrawerModalFooterItem.js';
+
+const BodyComponent = forwardRef((props, ref) => {
+  const {
+    getContentProps
+  } = useModalContext();
+  return React__default.createElement(StyledDrawerModalBody, Object.assign({}, getContentProps(props), {
+    ref: ref
+  }), props.children);
+});
+BodyComponent.displayName = 'DrawerModal.Body';
+const Body = BodyComponent;
+
+export { Body };

package/dist/esm/elements/DrawerModal/Close.js

@@ -0,0 +1,54 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default, { forwardRef, useEffect } from 'react';
+import '../../styled/StyledBackdrop.js';
+import '../../styled/StyledBody.js';
+import '../../styled/StyledClose.js';
+import '../../styled/StyledFooter.js';
+import '../../styled/StyledFooterItem.js';
+import '../../styled/StyledHeader.js';
+import '../../styled/StyledDangerIcon.js';
+import '../../styled/StyledModal.js';
+import '../../styled/StyledTooltipModalBackdrop.js';
+import '../../styled/StyledTooltipWrapper.js';
+import '../../styled/StyledTooltipModal.js';
+import '../../styled/StyledTooltipModalTitle.js';
+import '../../styled/StyledTooltipModalBody.js';
+import '../../styled/StyledTooltipModalFooter.js';
+import '../../styled/StyledTooltipModalFooterItem.js';
+import '../../styled/StyledTooltipModalClose.js';
+import '../../styled/StyledDrawerModal.js';
+import '../../styled/StyledDrawerModalHeader.js';
+import { StyledDrawerModalClose } from '../../styled/StyledDrawerModalClose.js';
+import '../../styled/StyledDrawerModalBody.js';
+import '../../styled/StyledDrawerModalFooter.js';
+import '../../styled/StyledDrawerModalFooterItem.js';
+import { useText } from '@zendeskgarden/react-theming';
+import { useModalContext } from '../../utils/useModalContext.js';
+import SvgXStroke from '../../node_modules/@zendeskgarden/svg-icons/src/16/x-stroke.svg.js';
+
+const CloseComponent = forwardRef((props, ref) => {
+  const {
+    getCloseProps,
+    setIsCloseButtonPresent
+  } = useModalContext();
+  useEffect(() => {
+    setIsCloseButtonPresent(true);
+    return () => setIsCloseButtonPresent(false);
+  });
+  const ariaLabel = useText(CloseComponent, props, 'aria-label', 'Close drawer');
+  return React__default.createElement(StyledDrawerModalClose, Object.assign({}, getCloseProps({
+    ...props,
+    'aria-label': ariaLabel
+  }), {
+    ref: ref
+  }), React__default.createElement(SvgXStroke, null));
+});
+CloseComponent.displayName = 'DrawerModal.Close';
+const Close = CloseComponent;
+
+export { Close };

package/dist/esm/elements/DrawerModal/DrawerModal.js

@@ -0,0 +1,187 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default, { forwardRef, useRef, useContext, useState, useEffect, useMemo } from 'react';
+import ReactDOM from 'react-dom';
+import PropTypes from 'prop-types';
+import mergeRefs from 'react-merge-refs';
+import { CSSTransition } from 'react-transition-group';
+import { ThemeContext } from 'styled-components';
+import { useModal } from '@zendeskgarden/container-modal';
+import { useDocument, useText } from '@zendeskgarden/react-theming';
+import { useFocusVisible } from '@zendeskgarden/container-focusvisible';
+import activeElement from 'dom-helpers/activeElement';
+import { ModalsContext } from '../../utils/useModalContext.js';
+import { StyledBackdrop } from '../../styled/StyledBackdrop.js';
+import '../../styled/StyledBody.js';
+import '../../styled/StyledClose.js';
+import '../../styled/StyledFooter.js';
+import '../../styled/StyledFooterItem.js';
+import '../../styled/StyledHeader.js';
+import '../../styled/StyledDangerIcon.js';
+import '../../styled/StyledModal.js';
+import '../../styled/StyledTooltipModalBackdrop.js';
+import '../../styled/StyledTooltipWrapper.js';
+import '../../styled/StyledTooltipModal.js';
+import '../../styled/StyledTooltipModalTitle.js';
+import '../../styled/StyledTooltipModalBody.js';
+import '../../styled/StyledTooltipModalFooter.js';
+import '../../styled/StyledTooltipModalFooterItem.js';
+import '../../styled/StyledTooltipModalClose.js';
+import { StyledDrawerModal } from '../../styled/StyledDrawerModal.js';
+import '../../styled/StyledDrawerModalHeader.js';
+import '../../styled/StyledDrawerModalClose.js';
+import '../../styled/StyledDrawerModalBody.js';
+import '../../styled/StyledDrawerModalFooter.js';
+import '../../styled/StyledDrawerModalFooterItem.js';
+import { Header } from './Header.js';
+import { Body } from './Body.js';
+import { Close } from './Close.js';
+import { Footer } from './Footer.js';
+import { FooterItem } from './FooterItem.js';
+
+const DrawerModalComponent = forwardRef((_ref, ref) => {
+  let {
+    id,
+    isOpen,
+    onClose,
+    backdropProps,
+    appendToNode,
+    focusOnMount,
+    restoreFocus,
+    ...props
+  } = _ref;
+  const modalRef = useRef(null);
+  const transitionRef = useRef(null);
+  const triggerRef = useRef(null);
+  const theme = useContext(ThemeContext);
+  const environment = useDocument(theme);
+  const [isCloseButtonPresent, setIsCloseButtonPresent] = useState(false);
+  const [hasHeader, setHasHeader] = useState(false);
+  useFocusVisible({
+    scope: modalRef,
+    relativeDocument: modalRef.current
+  });
+  const {
+    getTitleProps,
+    getCloseProps,
+    getContentProps,
+    getBackdropProps,
+    getModalProps
+  } = useModal({
+    idPrefix: id,
+    modalRef,
+    focusOnMount: false ,
+    restoreFocus: false ,
+    environment,
+    onClose
+  });
+  useEffect(() => {
+    if (environment) {
+      if (isOpen && modalRef.current) {
+        if (restoreFocus) {
+          triggerRef.current = activeElement(environment);
+        }
+        if (focusOnMount) {
+          modalRef.current.focus();
+        }
+      }
+      if (!isOpen && triggerRef.current) {
+        triggerRef.current.focus();
+      }
+    }
+    return () => {
+      if (!(restoreFocus && isOpen)) {
+        triggerRef.current = null;
+      }
+    };
+  }, [environment, restoreFocus, focusOnMount, isOpen]);
+  useEffect(() => {
+    if (!environment) {
+      return undefined;
+    }
+    const htmlElement = environment.querySelector('html');
+    let previousHtmlOverflow;
+    if (htmlElement && isOpen) {
+      previousHtmlOverflow = htmlElement.style.overflow;
+      htmlElement.style.overflow = 'hidden';
+    }
+    return () => {
+      if (htmlElement && isOpen) {
+        htmlElement.style.overflow = previousHtmlOverflow;
+      }
+    };
+  }, [environment, isOpen]);
+  const rootNode = useMemo(() => {
+    if (appendToNode) {
+      return appendToNode;
+    }
+    if (environment) {
+      return environment.body;
+    }
+    return undefined;
+  }, [appendToNode, environment]);
+  const value = useMemo(() => ({
+    isCloseButtonPresent,
+    hasHeader,
+    setHasHeader,
+    getTitleProps,
+    getContentProps,
+    getCloseProps,
+    setIsCloseButtonPresent
+  }), [isCloseButtonPresent, hasHeader, getTitleProps, getContentProps, getCloseProps]);
+  const modalProps = getModalProps({
+    'aria-describedby': undefined,
+    ...(hasHeader ? {} : {
+      'aria-labelledby': undefined
+    })
+  });
+  const attribute = hasHeader ? 'aria-labelledby' : 'aria-label';
+  const defaultValue = hasHeader ? modalProps['aria-labelledby'] : 'Modal dialog';
+  const labelValue = hasHeader ? modalProps['aria-labelledby'] : props['aria-label'];
+  const ariaProps = {
+    [attribute]: useText(DrawerModalComponent, {
+      [attribute]: labelValue
+    }, attribute, defaultValue)
+  };
+  if (!rootNode) {
+    return null;
+  }
+  return ReactDOM.createPortal( React__default.createElement(ModalsContext.Provider, {
+    value: value
+  }, React__default.createElement(CSSTransition, {
+    in: isOpen,
+    timeout: 250,
+    unmountOnExit: true,
+    classNames: "garden-drawer-transition",
+    nodeRef: transitionRef
+  }, React__default.createElement(StyledBackdrop, Object.assign({
+    isAnimated: true
+  }, getBackdropProps(backdropProps)), React__default.createElement(StyledDrawerModal, Object.assign({}, modalProps, ariaProps, props, {
+    ref: mergeRefs([ref, modalRef, transitionRef])
+  }))))), rootNode);
+});
+DrawerModalComponent.displayName = 'DrawerModal';
+DrawerModalComponent.propTypes = {
+  backdropProps: PropTypes.object,
+  focusOnMount: PropTypes.bool,
+  restoreFocus: PropTypes.bool,
+  onClose: PropTypes.func,
+  appendToNode: PropTypes.any,
+  isOpen: PropTypes.bool
+};
+DrawerModalComponent.defaultProps = {
+  focusOnMount: true ,
+  restoreFocus: true
+};
+const DrawerModal = DrawerModalComponent;
+DrawerModal.Body = Body;
+DrawerModal.Close = Close;
+DrawerModal.Footer = Footer;
+DrawerModal.FooterItem = FooterItem;
+DrawerModal.Header = Header;
+
+export { DrawerModal };

package/dist/esm/elements/DrawerModal/Footer.js

@@ -0,0 +1,37 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default, { forwardRef } from 'react';
+import '../../styled/StyledBackdrop.js';
+import '../../styled/StyledBody.js';
+import '../../styled/StyledClose.js';
+import '../../styled/StyledFooter.js';
+import '../../styled/StyledFooterItem.js';
+import '../../styled/StyledHeader.js';
+import '../../styled/StyledDangerIcon.js';
+import '../../styled/StyledModal.js';
+import '../../styled/StyledTooltipModalBackdrop.js';
+import '../../styled/StyledTooltipWrapper.js';
+import '../../styled/StyledTooltipModal.js';
+import '../../styled/StyledTooltipModalTitle.js';
+import '../../styled/StyledTooltipModalBody.js';
+import '../../styled/StyledTooltipModalFooter.js';
+import '../../styled/StyledTooltipModalFooterItem.js';
+import '../../styled/StyledTooltipModalClose.js';
+import '../../styled/StyledDrawerModal.js';
+import '../../styled/StyledDrawerModalHeader.js';
+import '../../styled/StyledDrawerModalClose.js';
+import '../../styled/StyledDrawerModalBody.js';
+import { StyledDrawerModalFooter } from '../../styled/StyledDrawerModalFooter.js';
+import '../../styled/StyledDrawerModalFooterItem.js';
+
+const FooterComponent = forwardRef((props, ref) => React__default.createElement(StyledDrawerModalFooter, Object.assign({
+  ref: ref
+}, props)));
+FooterComponent.displayName = 'DrawerModal.Footer';
+const Footer = FooterComponent;
+
+export { Footer };

package/dist/esm/elements/DrawerModal/FooterItem.js

@@ -0,0 +1,37 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default, { forwardRef } from 'react';
+import '../../styled/StyledBackdrop.js';
+import '../../styled/StyledBody.js';
+import '../../styled/StyledClose.js';
+import '../../styled/StyledFooter.js';
+import '../../styled/StyledFooterItem.js';
+import '../../styled/StyledHeader.js';
+import '../../styled/StyledDangerIcon.js';
+import '../../styled/StyledModal.js';
+import '../../styled/StyledTooltipModalBackdrop.js';
+import '../../styled/StyledTooltipWrapper.js';
+import '../../styled/StyledTooltipModal.js';
+import '../../styled/StyledTooltipModalTitle.js';
+import '../../styled/StyledTooltipModalBody.js';
+import '../../styled/StyledTooltipModalFooter.js';
+import '../../styled/StyledTooltipModalFooterItem.js';
+import '../../styled/StyledTooltipModalClose.js';
+import '../../styled/StyledDrawerModal.js';
+import '../../styled/StyledDrawerModalHeader.js';
+import '../../styled/StyledDrawerModalClose.js';
+import '../../styled/StyledDrawerModalBody.js';
+import '../../styled/StyledDrawerModalFooter.js';
+import { StyledDrawerModalFooterItem } from '../../styled/StyledDrawerModalFooterItem.js';
+
+const FooterItemComponent = forwardRef((props, ref) => React__default.createElement(StyledDrawerModalFooterItem, Object.assign({
+  ref: ref
+}, props)));
+FooterItemComponent.displayName = 'DrawerModal.FooterItem';
+const FooterItem = FooterItemComponent;
+
+export { FooterItem };

package/dist/esm/elements/DrawerModal/Header.js

@@ -0,0 +1,69 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default, { forwardRef, useEffect } from 'react';
+import PropTypes from 'prop-types';
+import { useModalContext } from '../../utils/useModalContext.js';
+import '../../styled/StyledBackdrop.js';
+import '../../styled/StyledBody.js';
+import '../../styled/StyledClose.js';
+import '../../styled/StyledFooter.js';
+import '../../styled/StyledFooterItem.js';
+import '../../styled/StyledHeader.js';
+import '../../styled/StyledDangerIcon.js';
+import '../../styled/StyledModal.js';
+import '../../styled/StyledTooltipModalBackdrop.js';
+import '../../styled/StyledTooltipWrapper.js';
+import '../../styled/StyledTooltipModal.js';
+import '../../styled/StyledTooltipModalTitle.js';
+import '../../styled/StyledTooltipModalBody.js';
+import '../../styled/StyledTooltipModalFooter.js';
+import '../../styled/StyledTooltipModalFooterItem.js';
+import '../../styled/StyledTooltipModalClose.js';
+import '../../styled/StyledDrawerModal.js';
+import { StyledDrawerModalHeader } from '../../styled/StyledDrawerModalHeader.js';
+import '../../styled/StyledDrawerModalClose.js';
+import '../../styled/StyledDrawerModalBody.js';
+import '../../styled/StyledDrawerModalFooter.js';
+import '../../styled/StyledDrawerModalFooterItem.js';
+
+const HeaderComponent = forwardRef((_ref, ref) => {
+  let {
+    tag,
+    ...other
+  } = _ref;
+  const {
+    isCloseButtonPresent,
+    hasHeader,
+    setHasHeader,
+    getTitleProps
+  } = useModalContext();
+  useEffect(() => {
+    if (!hasHeader && setHasHeader) {
+      setHasHeader(true);
+    }
+    return () => {
+      if (hasHeader && setHasHeader) {
+        setHasHeader(false);
+      }
+    };
+  }, [hasHeader, setHasHeader]);
+  return React__default.createElement(StyledDrawerModalHeader, Object.assign({}, getTitleProps(other), {
+    as: tag,
+    isCloseButtonPresent: isCloseButtonPresent,
+    ref: ref
+  }));
+});
+HeaderComponent.displayName = 'DrawerModal.Header';
+HeaderComponent.propTypes = {
+  tag: PropTypes.any
+};
+HeaderComponent.defaultProps = {
+  tag: 'div'
+};
+const Header = HeaderComponent;
+
+export { Header };

package/dist/esm/elements/Footer.js

@@ -0,0 +1,43 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default from 'react';
+import '../styled/StyledBackdrop.js';
+import '../styled/StyledBody.js';
+import '../styled/StyledClose.js';
+import { StyledFooter } from '../styled/StyledFooter.js';
+import '../styled/StyledFooterItem.js';
+import '../styled/StyledHeader.js';
+import '../styled/StyledDangerIcon.js';
+import '../styled/StyledModal.js';
+import '../styled/StyledTooltipModalBackdrop.js';
+import '../styled/StyledTooltipWrapper.js';
+import '../styled/StyledTooltipModal.js';
+import '../styled/StyledTooltipModalTitle.js';
+import '../styled/StyledTooltipModalBody.js';
+import '../styled/StyledTooltipModalFooter.js';
+import '../styled/StyledTooltipModalFooterItem.js';
+import '../styled/StyledTooltipModalClose.js';
+import '../styled/StyledDrawerModal.js';
+import '../styled/StyledDrawerModalHeader.js';
+import '../styled/StyledDrawerModalClose.js';
+import '../styled/StyledDrawerModalBody.js';
+import '../styled/StyledDrawerModalFooter.js';
+import '../styled/StyledDrawerModalFooterItem.js';
+import { useModalContext } from '../utils/useModalContext.js';
+
+const Footer = React__default.forwardRef((props, ref) => {
+  const {
+    isLarge
+  } = useModalContext();
+  return React__default.createElement(StyledFooter, Object.assign({
+    ref: ref,
+    isLarge: isLarge
+  }, props));
+});
+Footer.displayName = 'Footer';
+
+export { Footer };

package/dist/esm/elements/FooterItem.js

@@ -0,0 +1,36 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default from 'react';
+import '../styled/StyledBackdrop.js';
+import '../styled/StyledBody.js';
+import '../styled/StyledClose.js';
+import '../styled/StyledFooter.js';
+import { StyledFooterItem } from '../styled/StyledFooterItem.js';
+import '../styled/StyledHeader.js';
+import '../styled/StyledDangerIcon.js';
+import '../styled/StyledModal.js';
+import '../styled/StyledTooltipModalBackdrop.js';
+import '../styled/StyledTooltipWrapper.js';
+import '../styled/StyledTooltipModal.js';
+import '../styled/StyledTooltipModalTitle.js';
+import '../styled/StyledTooltipModalBody.js';
+import '../styled/StyledTooltipModalFooter.js';
+import '../styled/StyledTooltipModalFooterItem.js';
+import '../styled/StyledTooltipModalClose.js';
+import '../styled/StyledDrawerModal.js';
+import '../styled/StyledDrawerModalHeader.js';
+import '../styled/StyledDrawerModalClose.js';
+import '../styled/StyledDrawerModalBody.js';
+import '../styled/StyledDrawerModalFooter.js';
+import '../styled/StyledDrawerModalFooterItem.js';
+
+const FooterItem = React__default.forwardRef((props, ref) => React__default.createElement(StyledFooterItem, Object.assign({
+  ref: ref
+}, props)));
+FooterItem.displayName = 'FooterItem';
+
+export { FooterItem };