@skyscanner/backpack-web 34.14.0 → 34.15.1

package/bpk-component-accordion/src/BpkAccordionItem.js

@@ -31,10 +31,12 @@ const BpkAccordionItem = props => {
     divider,
     onDark
   } = useContext(BpkAccordionContext);
+  const itemClassNames = [getClassName('bpk-accordion__item')];
   const iconClassNames = [getClassName('bpk-accordion__item-expand-icon')];
   const titleTextClassNames = [getClassName('bpk-accordion__title-text')];
   const titleClassNames = [getClassName('bpk-accordion__title')];
   const contentClassNames = [getClassName('bpk-accordion__content-container')];
+  const contentInnerClassNames = [getClassName('bpk-accordion__content-inner-container')];
   const {
     children,
     expanded,
@@ -52,30 +54,29 @@ const BpkAccordionItem = props => {
   // it, but the benefit of a better container api versus this was worth it
   // $FlowFixMe[prop-missing] - see above
   delete rest.initiallyExpanded;
+  if (divider) {
+    contentInnerClassNames.push(getClassName('bpk-accordion__content-inner-container--with-divider'));
+    if (onDark) {
+      itemClassNames.push(getClassName('bpk-accordion__item--with-divider-on-dark'));
+    } else {
+      itemClassNames.push(getClassName('bpk-accordion__item--with-divider'));
+    }
+  }
+  if (onDark) {
+    itemClassNames.push(getClassName('bpk-accordion__item--on-dark'));
+  }
   if (expanded && !onDark) {
     iconClassNames.push(getClassName('bpk-accordion__item-expand-icon--flipped'));
-    if (divider) {
-      contentClassNames.push(getClassName('bpk-accordion__content-container--expanded'));
-    }
   }
   if (expanded && onDark) {
     iconClassNames.push(getClassName('bpk-accordion__item-expand-icon--flipped'));
     iconClassNames.push(getClassName('bpk-accordion__item-expand-icon--on-dark'));
-    if (divider) {
-      contentClassNames.push(getClassName('bpk-accordion__content-container--expanded-on-dark'));
-    }
     titleTextClassNames.push(getClassName('bpk-accordion__title-text--on-dark'));
   }
   if (!expanded && onDark) {
     iconClassNames.push(getClassName('bpk-accordion__item-expand-icon--on-dark'));
-    if (divider) {
-      titleClassNames.push(getClassName('bpk-accordion__title--collapsed-on-dark'));
-    }
     titleTextClassNames.push(getClassName('bpk-accordion__title-text--on-dark'));
   }
-  if (!expanded && !onDark && divider) {
-    titleClassNames.push(getClassName('bpk-accordion__title--collapsed'));
-  }
   const contentId = `${id}_content`;
   const clonedIcon = icon ? /*#__PURE__*/cloneElement(icon, {
     className: getClassName('bpk-accordion__leading-icon')
@@ -85,6 +86,7 @@ const BpkAccordionItem = props => {
     // $FlowFixMe[cannot-spread-inexact] - inexact rest. See decisions/flowfixme.md
     _jsxs("div", {
       id: id,
+      className: itemClassNames.join(' '),
       ...rest,
       children: [/*#__PURE__*/_jsx("div", {
         className: titleClassNames.join(' '),
@@ -115,7 +117,10 @@ const BpkAccordionItem = props => {
         children: /*#__PURE__*/_jsx(AnimateHeight, {
           duration: 200,
           height: expanded ? 'auto' : 0,
-          children: children
+          children: /*#__PURE__*/_jsx("div", {
+            className: contentInnerClassNames.join(' '),
+            children: children
+          })
         })
       })]
     })

package/bpk-component-accordion/src/BpkAccordionItem.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-.bpk-accordion__title{height:auto}.bpk-accordion__title--collapsed{box-shadow:0 -1px 0 0 #c1c7cf inset}.bpk-accordion__title--collapsed-on-dark{box-shadow:0 -1px 0 0 rgba(255,255,255,.5) inset}.bpk-accordion__toggle-button{width:100%;padding:0;border:0;background-color:rgba(0,0,0,0);color:#161616;text-align:left;cursor:pointer;appearance:none}html[dir=rtl] .bpk-accordion__toggle-button{text-align:right}.bpk-accordion__flex-container{display:inline-flex;width:100%;margin:1rem 0;flex-direction:row}.bpk-accordion__title-text{flex-grow:1}.bpk-accordion__title-text--on-dark{color:#fff}.bpk-accordion__icon-wrapper{display:inline-block}.bpk-accordion__leading-icon{margin-left:0;margin-right:.5rem}html[dir=rtl] .bpk-accordion__leading-icon{margin-left:.5rem;margin-right:0}.bpk-accordion__item-expand-icon{fill:#161616}.bpk-accordion__item-expand-icon--flipped{transform:scaleY(-1)}.bpk-accordion__item-expand-icon--on-dark{fill:#fff}.bpk-accordion__content-container{margin:0}.bpk-accordion__content-container--expanded{padding-bottom:1rem;box-shadow:0 -1px 0 0 #c1c7cf inset}.bpk-accordion__content-container--expanded-on-dark{padding-bottom:1rem;box-shadow:0 -1px 0 0 rgba(255,255,255,.5) inset}
+.bpk-accordion__item--with-divider{box-shadow:0 -1px 0 0 #c1c7cf inset}.bpk-accordion__item--with-divider-on-dark{box-shadow:0 -1px 0 0 rgba(255,255,255,.5) inset}.bpk-accordion__title{height:auto}.bpk-accordion__toggle-button{width:100%;padding:0;border:0;background-color:rgba(0,0,0,0);color:#161616;text-align:left;cursor:pointer;appearance:none}html[dir=rtl] .bpk-accordion__toggle-button{text-align:right}.bpk-accordion__flex-container{display:inline-flex;width:100%;margin:1rem 0;flex-direction:row}.bpk-accordion__title-text{flex-grow:1}.bpk-accordion__title-text--on-dark{color:#fff}.bpk-accordion__icon-wrapper{display:inline-block}.bpk-accordion__leading-icon{margin-left:0;margin-right:.5rem}html[dir=rtl] .bpk-accordion__leading-icon{margin-left:.5rem;margin-right:0}.bpk-accordion__item-expand-icon{fill:#161616}.bpk-accordion__item-expand-icon--flipped{transform:scaleY(-1)}.bpk-accordion__item-expand-icon--on-dark{fill:#fff}.bpk-accordion__content-container{margin:0}.bpk-accordion__content-inner-container--with-divider{padding-bottom:1rem}

package/bpk-component-datepicker/src/BpkDatepicker.d.ts

@@ -40,7 +40,7 @@ type Props = {
     onOpenChange?: (arg0: boolean) => void | null;
     selectionConfiguration?: SelectionConfiguration;
     initiallyFocusedDate?: Date;
-    renderTarget?: (() => HTMLElement | null) | HTMLElement | null;
+    renderTarget?: null | HTMLElement | (() => null | HTMLElement);
     isOpen?: boolean;
     valid?: boolean;
     onClose?: () => void;

package/bpk-component-dialog/src/BpkDialog.js

@@ -16,16 +16,13 @@
  * limitations under the License.
  */
 
-import { useEffect } from 'react';
-import { FloatingPortal } from '@floating-ui/react';
-
 // @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
 import BpkCloseButton from "../../bpk-component-close-button";
-import { cssModules } from "../../bpk-react-utils";
+import { cssModules, Portal } from "../../bpk-react-utils";
 import BpkDialogInner from "./BpkDialogInner";
 import { HEADER_ICON_TYPES } from "./common-types";
 import STYLES from "./BpkDialog.module.css";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkDialog = ({
   children,
@@ -44,39 +41,27 @@ const BpkDialog = ({
     // eslint-disable-next-line no-console
     console.warn('BpkDialog: dismissible is true but no onClose prop was provided. Dialog will not be dismissible.');
   }
-  useEffect(() => {
-    const handleKeyDown = event => {
-      if (event.key === 'Escape' && dismissible && onClose) {
-        onClose();
-      }
-    };
-    if (isOpen) {
-      window.addEventListener('keydown', handleKeyDown);
-    }
-    return () => {
-      window.removeEventListener('keydown', handleKeyDown);
-    };
-  }, [isOpen, onClose, dismissible]);
-  return /*#__PURE__*/_jsx(_Fragment, {
-    children: isOpen && /*#__PURE__*/_jsx(FloatingPortal, {
-      root: renderTarget(),
-      children: /*#__PURE__*/_jsxs(BpkDialogInner, {
-        onClose: onClose,
-        closeOnScrimClick: dismissible,
-        containerClassName: getClassName('bpk-dialog__container'),
-        contentClassName: headerIcon ? getClassName('bpk-dialog--with-icon') : undefined,
-        ...rest,
-        children: [headerIcon && /*#__PURE__*/_jsx("div", {
-          className: headerIconClassNames,
-          children: headerIcon
-        }), dismissible && /*#__PURE__*/_jsx("span", {
-          className: closeButtonClassNames,
-          children: /*#__PURE__*/_jsx(BpkCloseButton, {
-            label: closeLabel,
-            onClick: onClose
-          })
-        }), children]
-      })
+  return /*#__PURE__*/_jsx(Portal, {
+    isOpen: isOpen,
+    onClose: onClose,
+    renderTarget: renderTarget,
+    closeOnEscPressed: dismissible,
+    children: /*#__PURE__*/_jsxs(BpkDialogInner, {
+      onClose: onClose,
+      closeOnScrimClick: dismissible,
+      containerClassName: getClassName('bpk-dialog__container'),
+      contentClassName: headerIcon ? getClassName('bpk-dialog--with-icon') : undefined,
+      ...rest,
+      children: [headerIcon && /*#__PURE__*/_jsx("div", {
+        className: headerIconClassNames,
+        children: headerIcon
+      }), dismissible && /*#__PURE__*/_jsx("span", {
+        className: closeButtonClassNames,
+        children: /*#__PURE__*/_jsx(BpkCloseButton, {
+          label: closeLabel,
+          onClick: onClose
+        })
+      }), children]
     })
   });
 };

package/bpk-component-drawer/src/BpkDrawer.js

@@ -14,25 +14,16 @@
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
- */
-
+ */import PropTypes from 'prop-types';
 import { Component } from 'react';
-import { FloatingPortal } from '@floating-ui/react';
+import { Portal } from "../../bpk-react-utils";
 import { withScrim } from "../../bpk-scrim-utils";
 import BpkDrawerContent from "./BpkDrawerContent";
-import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 const BpkScrimDrawerContent = withScrim(BpkDrawerContent);
 class BpkDrawer extends Component {
-  static defaultProps = {
-    renderTarget: () => null,
-    className: null,
-    contentClassName: null,
-    closeLabel: null,
-    closeText: null,
-    hideTitle: false
-  };
-  constructor(props) {
-    super(props);
+  constructor() {
+    super();
     this.state = {
       isDrawerShown: true
     };
@@ -42,19 +33,11 @@ class BpkDrawer extends Component {
       this.setState({
         isDrawerShown: true
       });
-      window.addEventListener('keydown', this.handleKeyDown);
-    } else {
-      window.removeEventListener('keydown', this.handleKeyDown);
     }
   }
   onCloseAnimationComplete = () => {
     this.props.onClose();
   };
-  handleKeyDown = event => {
-    if (event.key === 'Escape' && this.props.onClose) {
-      this.props.onClose();
-    }
-  };
   hide = () => {
     this.setState({
       isDrawerShown: false
@@ -70,18 +53,45 @@ class BpkDrawer extends Component {
     const {
       isDrawerShown
     } = this.state;
-    const renTarget = typeof renderTarget === 'function' ? renderTarget() : renderTarget;
-    return /*#__PURE__*/_jsx(_Fragment, {
-      children: isOpen && /*#__PURE__*/_jsx(FloatingPortal, {
-        root: renTarget,
-        children: /*#__PURE__*/_jsx(BpkScrimDrawerContent, {
-          isDrawerShown: isDrawerShown,
-          onClose: this.hide,
-          onCloseAnimationComplete: this.onCloseAnimationComplete,
-          ...rest
-        })
+    return /*#__PURE__*/_jsx(Portal, {
+      isOpen: isOpen,
+      onClose: this.hide,
+      renderTarget: renderTarget,
+      children: /*#__PURE__*/_jsx(BpkScrimDrawerContent, {
+        isDrawerShown: isDrawerShown,
+        onClose: this.hide,
+        onCloseAnimationComplete: this.onCloseAnimationComplete,
+        ...rest
       })
     });
   }
 }
+BpkDrawer.propTypes = {
+  id: PropTypes.string.isRequired,
+  children: PropTypes.node.isRequired,
+  isOpen: PropTypes.bool.isRequired,
+  onClose: PropTypes.func.isRequired,
+  title: PropTypes.string.isRequired,
+  /**
+   * **Note:** In order to "hide" your application from screen readers whilst the drawer is open you need to let it know what
+   * the root element for your application is by returning it's DOM node via the function passed to the
+   * `getApplicationElement` prop (see the example above). The `pagewrap` element id is a convention we use internally at Skyscanner. In most cases it should "just work".
+   */
+  getApplicationElement: PropTypes.func.isRequired,
+  renderTarget: PropTypes.func,
+  dialogRef: PropTypes.func,
+  className: PropTypes.string,
+  contentClassName: PropTypes.string,
+  closeLabel: PropTypes.string,
+  closeText: PropTypes.string,
+  hideTitle: PropTypes.bool
+};
+BpkDrawer.defaultProps = {
+  renderTarget: null,
+  className: null,
+  contentClassName: null,
+  closeLabel: null,
+  closeText: null,
+  hideTitle: false
+};
 export default BpkDrawer;

package/bpk-component-drawer/src/BpkDrawerContent.js

@@ -14,41 +14,37 @@
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
- */
-
-// @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
+ */import PropTypes from 'prop-types';
 import Transition from 'react-transition-group/Transition';
 import { animations } from '@skyscanner/bpk-foundations-web/tokens/base.es6';
-
-// @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
 import BpkCloseButton from "../../bpk-component-close-button";
-// @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
 import { BpkButtonLink } from "../../bpk-component-link";
 import { cssModules } from "../../bpk-react-utils";
 import STYLES from "./BpkDrawerContent.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
-const BpkDrawerContent = ({
-  children,
-  className = null,
-  closeLabel = null,
-  closeOnScrimClick = true,
-  // Unused from withScrim scrim HOC
-  closeText = null,
-  contentClassName = null,
-  dialogRef,
-  hideTitle = false,
-  id,
-  isDrawerShown = true,
-  isIpad = false,
-  // Unused from withScrim scrim HOC
-  isIphone = false,
-  // Unused from withScrim scrim HOC
-  onClose,
-  onCloseAnimationComplete,
-  title,
-  ...rest
-}) => {
+const BpkDrawerContent = props => {
+  const {
+    children,
+    className,
+    closeLabel,
+    closeOnScrimClick,
+    // Unused from withScrim scrim HOC
+    closeText,
+    contentClassName,
+    dialogRef,
+    hideTitle,
+    id,
+    isDrawerShown,
+    isIpad,
+    // Unused from withScrim scrim HOC
+    isIphone,
+    // Unused from withScrim scrim HOC
+    onClose,
+    onCloseAnimationComplete,
+    title,
+    ...rest
+  } = props;
   const drawerClassNames = [getClassName('bpk-drawer')];
   const headerClassNames = [getClassName('bpk-drawer__heading')];
   const contentClassNames = [getClassName('bpk-drawer__content')];
@@ -72,9 +68,12 @@ const BpkDrawerContent = ({
     exit: true,
     in: isDrawerShown,
     onExited: onCloseAnimationComplete,
-    children: status => /*#__PURE__*/_jsxs("section", {
+    children: status =>
+    /*#__PURE__*/
+    // $FlowFixMe[cannot-spread-inexact] - inexact rest. See decisions/flowfixme.md
+    _jsxs("section", {
       id: id,
-      tabIndex: -1,
+      tabIndex: "-1",
       role: "dialog",
       "aria-labelledby": headingId,
       className: [drawerClassNames.join(' '), getClassName(`bpk-drawer--${status}`)].join(' '),
@@ -103,4 +102,32 @@ const BpkDrawerContent = ({
     }, "dialog")
   });
 };
+BpkDrawerContent.propTypes = {
+  children: PropTypes.node.isRequired,
+  dialogRef: PropTypes.func.isRequired,
+  onCloseAnimationComplete: PropTypes.func.isRequired,
+  onClose: PropTypes.func.isRequired,
+  id: PropTypes.string.isRequired,
+  title: PropTypes.string.isRequired,
+  className: PropTypes.string,
+  contentClassName: PropTypes.string,
+  closeLabel: PropTypes.string,
+  closeText: PropTypes.string,
+  isDrawerShown: PropTypes.bool,
+  hideTitle: PropTypes.bool,
+  closeOnScrimClick: PropTypes.bool,
+  isIphone: PropTypes.bool,
+  isIpad: PropTypes.bool
+};
+BpkDrawerContent.defaultProps = {
+  className: null,
+  contentClassName: null,
+  closeLabel: null,
+  closeText: null,
+  isDrawerShown: true,
+  hideTitle: false,
+  closeOnScrimClick: true,
+  isIphone: false,
+  isIpad: false
+};
 export default BpkDrawerContent;

package/bpk-component-drawer/src/themeAttributes.js

@@ -14,8 +14,5 @@
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
- */
-
-// @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
-import { themeAttributes as linkAttributes } from "../../bpk-component-link";
+ */import { themeAttributes as linkAttributes } from "../../bpk-component-link";
 export default [...linkAttributes];

package/bpk-component-modal/src/BpkModal.d.ts

@@ -7,7 +7,7 @@ export type Props = Partial<ModalDialogProps> & {
     isOpen: boolean;
     closeOnScrimClick?: boolean;
     closeOnEscPressed?: boolean;
-    renderTarget?: (() => HTMLElement | null) | HTMLElement | null;
+    renderTarget?: null | HTMLElement | (() => null | HTMLElement);
     modalStyle?: ModalStyle;
     onClose?: (arg0?: TouchEvent | MouseEvent | KeyboardEvent, arg1?: {
         source: 'ESCAPE' | 'DOCUMENT_CLICK';

package/bpk-component-modal/src/BpkModal.js

@@ -16,13 +16,11 @@
  * limitations under the License.
  */
 
-import { useEffect } from 'react';
-import { FloatingPortal } from '@floating-ui/react';
-import { cssModules, isDeviceIphone } from "../../bpk-react-utils";
+import { Portal, cssModules, isDeviceIphone } from "../../bpk-react-utils";
 import { withScrim } from "../../bpk-scrim-utils";
 import BpkModalInner, { MODAL_STYLING } from "./BpkModalInner";
 import STYLES from "./BpkModal.module.css";
-import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const ScrimBpkModalInner = withScrim(BpkModalInner);
 const BpkModal = ({
@@ -41,55 +39,42 @@ const BpkModal = ({
   modalStyle = MODAL_STYLING.default,
   onClose = () => null,
   padded = true,
-  renderTarget = () => null,
+  renderTarget = null,
   showHeader = true,
   title = null,
   wide = false,
   ...rest
 }) => {
-  useEffect(() => {
-    const handleKeyDown = event => {
-      if (event.key === 'Escape' && onClose) {
-        onClose();
-      }
-    };
-    if (isOpen) {
-      window.addEventListener('keydown', handleKeyDown);
-    }
-    return () => {
-      window.removeEventListener('keydown', handleKeyDown);
-    };
-  }, [isOpen, onClose]);
   const containerClass = [getClassName('bpk-modal__container')];
   if (fullScreen || isIphone) {
     containerClass.push(getClassName('bpk-modal__container--full-screen'));
   } else if (fullScreenOnMobile) {
     containerClass.push(getClassName('bpk-modal__container--full-screen-mobile'));
   }
-  const renTarget = typeof renderTarget === 'function' ? renderTarget() : renderTarget;
-  return /*#__PURE__*/_jsx(_Fragment, {
-    children: isOpen && /*#__PURE__*/_jsx(FloatingPortal, {
-      root: renTarget,
-      children: /*#__PURE__*/_jsx(ScrimBpkModalInner, {
-        onClose: onClose,
-        fullScreenOnMobile: fullScreenOnMobile,
-        fullScreen: fullScreen,
-        closeOnScrimClick: closeOnScrimClick,
-        containerClassName: containerClass.join(' '),
-        isIphone: isIphone,
-        title: title,
-        className: className,
-        contentClassName: contentClassName,
-        closeLabel: closeLabel,
-        closeText: closeText,
-        wide: wide,
-        showHeader: showHeader,
-        padded: padded,
-        accessoryView: accessoryView,
-        dialogRef: dialogRef,
-        modalStyle: modalStyle,
-        ...rest
-      })
+  return /*#__PURE__*/_jsx(Portal, {
+    isOpen: isOpen,
+    onClose: onClose,
+    renderTarget: renderTarget,
+    closeOnEscPressed: closeOnEscPressed,
+    children: /*#__PURE__*/_jsx(ScrimBpkModalInner, {
+      onClose: onClose,
+      fullScreenOnMobile: fullScreenOnMobile,
+      fullScreen: fullScreen,
+      closeOnScrimClick: closeOnScrimClick,
+      containerClassName: containerClass.join(' '),
+      isIphone: isIphone,
+      title: title,
+      className: className,
+      contentClassName: contentClassName,
+      closeLabel: closeLabel,
+      closeText: closeText,
+      wide: wide,
+      showHeader: showHeader,
+      padded: padded,
+      accessoryView: accessoryView,
+      dialogRef: dialogRef,
+      modalStyle: modalStyle,
+      ...rest
     })
   });
 };

package/bpk-react-utils/src/Portal.d.ts

@@ -20,10 +20,6 @@ type Props = {
 type State = {
     isVisible: boolean;
 };
-/**
- * @deprecated the portal is deprecated and will be removed in a future release. Please read [](https://github.com/Skyscanner/backpack/blob/main/packages/bpk-react-utils/docs/portal-migration.md) for further information
- * @returns{Component} used to render children into a new component tree. For use with Modals, popovers, tooltips.
-*/
 declare class Portal extends Component<Props, State> {
     portalElement: null | HTMLDivElement;
     shouldClose: boolean;

package/bpk-react-utils/src/Portal.js

@@ -25,10 +25,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
 const KEYCODES = {
   ESCAPE: 'Escape'
 };
-/**
- * @deprecated the portal is deprecated and will be removed in a future release. Please read [](https://github.com/Skyscanner/backpack/blob/main/packages/bpk-react-utils/docs/portal-migration.md) for further information
- * @returns{Component} used to render children into a new component tree. For use with Modals, popovers, tooltips.
-*/
 class Portal extends Component {
   static defaultProps = {
     beforeClose: null,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skyscanner/backpack-web",
-  "version": "34.14.0",
+  "version": "34.15.1",
   "description": "Backpack Design System web library",
   "repository": {
     "type": "git",

package/bpk-component-drawer/src/BpkDrawer.d.ts

@@ -1,43 +0,0 @@
-import type { ReactNode } from 'react';
-import { Component } from 'react';
-export type Props = {
-    id: string;
-    children: ReactNode | string;
-    isOpen: boolean;
-    onClose: () => void;
-    title: string;
-    /**
-     * **Note:** In order to "hide" your application from screen readers whilst the drawer is open you need to let it know what
-     * the root element for your application is by returning it's DOM node via the function passed to the
-     * `getApplicationElement` prop (see the example above). The `pagewrap` element id is a convention we use internally at Skyscanner. In most cases it should "just work".
-     */
-    getApplicationElement: () => HTMLElement | null;
-    renderTarget?: () => HTMLElement | HTMLElement | null;
-    dialogRef?: (ref: HTMLElement | null | undefined) => void;
-    className?: string | null;
-    contentClassName?: string | null;
-    closeLabel?: string | null;
-    closeText?: string | null;
-    hideTitle?: boolean;
-    [rest: string]: any;
-};
-type State = {
-    isDrawerShown: boolean;
-};
-declare class BpkDrawer extends Component<Props, State> {
-    static defaultProps: {
-        renderTarget: () => null;
-        className: null;
-        contentClassName: null;
-        closeLabel: null;
-        closeText: null;
-        hideTitle: boolean;
-    };
-    constructor(props: Props);
-    UNSAFE_componentWillReceiveProps(nextProps: Props): void;
-    onCloseAnimationComplete: () => void;
-    handleKeyDown: (event: KeyboardEvent) => void;
-    hide: () => void;
-    render(): JSX.Element;
-}
-export default BpkDrawer;

package/bpk-component-drawer/src/BpkDrawerContent.d.ts

@@ -1,21 +0,0 @@
-import type { ReactNode } from 'react';
-export type Props = {
-    children: ReactNode;
-    dialogRef: () => void;
-    onCloseAnimationComplete: () => void;
-    onClose: () => void;
-    id: string;
-    title: string;
-    className?: string | null;
-    contentClassName?: string | null;
-    closeLabel?: string | null;
-    closeText?: string | null;
-    isDrawerShown?: boolean;
-    hideTitle?: boolean;
-    closeOnScrimClick?: boolean;
-    isIphone?: boolean;
-    isIpad?: boolean;
-    [rest: string]: any;
-};
-declare const BpkDrawerContent: ({ children, className, closeLabel, closeOnScrimClick, closeText, contentClassName, dialogRef, hideTitle, id, isDrawerShown, isIpad, isIphone, onClose, onCloseAnimationComplete, title, ...rest }: Props) => JSX.Element;
-export default BpkDrawerContent;

package/bpk-component-drawer/src/themeAttributes.d.ts

@@ -1,2 +0,0 @@
-declare const _default: any[];
-export default _default;