@skyscanner/backpack-web 25.3.0 → 25.4.0-alpha

package/bpk-component-input/src/withOpenEvents.js

@@ -1,149 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = require("react");
-var _bpkReactUtils = require("../../bpk-react-utils");
-var _BpkInputModule = _interopRequireDefault(require("./BpkInput.module.css"));
-var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["className", "hasTouchSupport", "isOpen", "onBlur", "onClick", "onFocus", "onKeyDown", "onKeyUp", "onOpen", "onTouchEnd"];
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } /*
-                                                                                                                                                                                                                                                                                                                                                                                           * Backpack - Skyscanner's Design System
-                                                                                                                                                                                                                                                                                                                                                                                           *
-                                                                                                                                                                                                                                                                                                                                                                                           * Copyright 2016 Skyscanner Ltd
-                                                                                                                                                                                                                                                                                                                                                                                           *
-                                                                                                                                                                                                                                                                                                                                                                                           * Licensed under the Apache License, Version 2.0 (the "License");
-                                                                                                                                                                                                                                                                                                                                                                                           * you may not use this file except in compliance with the License.
-                                                                                                                                                                                                                                                                                                                                                                                           * You may obtain a copy of the License at
-                                                                                                                                                                                                                                                                                                                                                                                           *
-                                                                                                                                                                                                                                                                                                                                                                                           *   http://www.apache.org/licenses/LICENSE-2.0
-                                                                                                                                                                                                                                                                                                                                                                                           *
-                                                                                                                                                                                                                                                                                                                                                                                           * Unless required by applicable law or agreed to in writing, software
-                                                                                                                                                                                                                                                                                                                                                                                           * distributed under the License is distributed on an "AS IS" BASIS,
-                                                                                                                                                                                                                                                                                                                                                                                           * 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.
-                                                                                                                                                                                                                                                                                                                                                                                           */
-const getClassName = (0, _bpkReactUtils.cssModules)(_BpkInputModule.default);
-const KEYCODES = {
-  ENTER: 13,
-  SPACEBAR: 32
-};
-const handleKeyEvent = (keyCode, callback) => e => {
-  if (e instanceof KeyboardEvent && e.keyCode === keyCode) {
-    e.preventDefault();
-    if (callback) {
-      callback();
-    }
-  }
-};
-const withEventHandler = (fn, eventHandler) => e => {
-  if (fn) {
-    fn(e);
-  }
-  if (eventHandler) {
-    eventHandler(e);
-  }
-};
-const withOpenEvents = InputComponent => {
-  class WithOpenEvents extends _react.Component {
-    constructor(props) {
-      super(props);
-      _defineProperty(this, "focusCanOpen", void 0);
-      _defineProperty(this, "handleTouchEnd", event => {
-        // preventDefault fixes an issue on Android and iOS in which the popover closes immediately
-        // because a touch event is registered on one of the dates.
-        // We can only run preventDefault when the input is already focused - otherwise it would never set
-        // focus on it, and when closing the modal/popover focus would return to the previously focused
-        // element (which is annoying if it's an autosuggest or another datepicker, for example).
-        if (document && event.target === document.activeElement) {
-          event.preventDefault();
-          if (this.props.onOpen) {
-            this.props.onOpen();
-          }
-        }
-      });
-      _defineProperty(this, "handleFocus", () => {
-        if (this.focusCanOpen && this.props.onOpen) {
-          this.props.onOpen();
-        }
-      });
-      _defineProperty(this, "handleBlur", () => {
-        // If the input loses focus when the target is open, it should not open on a subsequent focus.
-        // Fixes an issue with IE9.
-        if (this.props.isOpen) {
-          this.focusCanOpen = false;
-        } else {
-          this.focusCanOpen = true;
-        }
-      });
-      this.focusCanOpen = true;
-    }
-    render() {
-      const _this$props = this.props,
-        {
-          className,
-          hasTouchSupport,
-          isOpen,
-          onBlur,
-          onClick,
-          onFocus,
-          onKeyDown,
-          onKeyUp,
-          onOpen,
-          onTouchEnd
-        } = _this$props,
-        rest = _objectWithoutProperties(_this$props, _excluded);
-      const classNames = [getClassName('bpk-input--with-open-events')];
-      if (className) {
-        classNames.push(className);
-      }
-      const eventHandlers = {
-        onClick: withEventHandler(onOpen, onClick),
-        onKeyDown: withEventHandler(handleKeyEvent(KEYCODES.ENTER, onOpen), onKeyDown),
-        onKeyUp: withEventHandler(handleKeyEvent(KEYCODES.SPACEBAR, onOpen), onKeyUp)
-      };
-      if (hasTouchSupport) {
-        // Prevents the mobile keyboard from opening (iOS / Android), while not announcing it as 'read only' to a screen reader
-        eventHandlers.readOnly = 'readOnly';
-        eventHandlers['aria-readonly'] = false;
-        eventHandlers.onTouchEnd = withEventHandler(this.handleTouchEnd, onTouchEnd);
-      }
-
-      // Needed on desktop to allow the intended behaviour of opening on focus
-      // Needed on mobile as some Android devices do not trigger onClick or onTouch when TalkBack is active but do trigger onFocus
-      eventHandlers.onFocus = withEventHandler(this.handleFocus, onFocus);
-      eventHandlers.onBlur = withEventHandler(this.handleBlur, onBlur);
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(InputComponent, _objectSpread(_objectSpread({
-        className: classNames.join(' ')
-      }, eventHandlers), rest));
-    }
-  }
-  _defineProperty(WithOpenEvents, "displayName", void 0);
-  _defineProperty(WithOpenEvents, "defaultProps", {
-    // Custom props
-    isOpen: false,
-    hasTouchSupport: !!(typeof window !== 'undefined' && 'ontouchstart' in window),
-    onOpen: null,
-    // Input props
-    onClick: null,
-    onFocus: null,
-    onBlur: null,
-    onTouchEnd: null,
-    onKeyDown: null,
-    onKeyUp: null
-  });
-  WithOpenEvents.displayName = (0, _bpkReactUtils.wrapDisplayName)(InputComponent, 'withOpenEvents');
-  return WithOpenEvents;
-};
-var _default = withOpenEvents;
-exports.default = _default;

package/bpk-component-modal/index.js

@@ -1,55 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "BpkModalV2", {
-  enumerable: true,
-  get: function () {
-    return _BpkModal.BpkModalV2;
-  }
-});
-exports.default = void 0;
-Object.defineProperty(exports, "defaultProps", {
-  enumerable: true,
-  get: function () {
-    return _legacyPropTypes.defaultProps;
-  }
-});
-Object.defineProperty(exports, "propTypes", {
-  enumerable: true,
-  get: function () {
-    return _legacyPropTypes.propTypes;
-  }
-});
-Object.defineProperty(exports, "themeAttributes", {
-  enumerable: true,
-  get: function () {
-    return _themeAttributes.default;
-  }
-});
-var _BpkModal = require("./src/BpkModalV2/BpkModal");
-var _themeAttributes = _interopRequireDefault(require("./src/themeAttributes"));
-var _BpkModal2 = _interopRequireDefault(require("./src/BpkModal"));
-var _legacyPropTypes = require("./src/legacy-prop-types");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-/*
- * Backpack - Skyscanner's Design System
- *
- * Copyright 2016 Skyscanner Ltd
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * 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`.
-var _default = _BpkModal2.default;
-exports.default = _default;

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

@@ -1,94 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _bpkScrimUtils = require("../../bpk-scrim-utils");
-var _bpkReactUtils = require("../../bpk-react-utils");
-var _BpkModalModule = _interopRequireDefault(require("./BpkModal.module.css"));
-var _BpkModalInner = _interopRequireDefault(require("./BpkModalInner"));
-var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["accessoryView", "className", "closeLabel", "closeOnEscPressed", "closeOnScrimClick", "closeText", "contentClassName", "dialogRef", "fullScreen", "fullScreenOnMobile", "isIphone", "isOpen", "onClose", "padded", "renderTarget", "showHeader", "title", "wide"];
-/*
- * Backpack - Skyscanner's Design System
- *
- * Copyright 2016 Skyscanner Ltd
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * 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.
- */
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
-function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-const getClassName = (0, _bpkReactUtils.cssModules)(_BpkModalModule.default);
-const ScrimBpkModalInner = (0, _bpkScrimUtils.withScrim)(_BpkModalInner.default);
-const BpkModal = _ref => {
-  let {
-      accessoryView = null,
-      className = null,
-      closeLabel = '',
-      closeOnEscPressed = true,
-      closeOnScrimClick = true,
-      closeText = null,
-      contentClassName = null,
-      dialogRef = () => null,
-      fullScreen = false,
-      fullScreenOnMobile = true,
-      isIphone = (0, _bpkReactUtils.isDeviceIphone)(),
-      isOpen,
-      onClose = () => null,
-      padded = true,
-      renderTarget = null,
-      showHeader = true,
-      title = null,
-      wide = false
-    } = _ref,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  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'));
-  }
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_bpkReactUtils.Portal, {
-    isOpen: isOpen,
-    onClose: onClose,
-    renderTarget: renderTarget,
-    closeOnEscPressed: closeOnEscPressed,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ScrimBpkModalInner, _objectSpread({
-      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
-    }, rest))
-  });
-};
-var _default = BpkModal;
-exports.default = _default;

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

@@ -1,122 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _bpkComponentLink = require("../../bpk-component-link");
-var _bpkComponentCloseButton = _interopRequireDefault(require("../../bpk-component-close-button"));
-var _bpkComponentNavigationBar = _interopRequireDefault(require("../../bpk-component-navigation-bar"));
-var _bpkReactUtils = require("../../bpk-react-utils");
-var _BpkModalInnerModule = _interopRequireDefault(require("./BpkModalInner.module.css"));
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-/*
- * Backpack - Skyscanner's Design System
- *
- * Copyright 2016 Skyscanner Ltd
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * 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`.
-
-// @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
-
-// @ts-expect-error Untyped import. See `decisions/imports-ts-suppressions.md`.
-
-const getClassName = (0, _bpkReactUtils.cssModules)(_BpkModalInnerModule.default);
-const BpkModalInner = ({
-  accessoryView = null,
-  children,
-  className = null,
-  closeLabel = '',
-  closeText = null,
-  contentClassName = null,
-  dialogRef,
-  fullScreen = false,
-  fullScreenOnMobile = true,
-  id,
-  isIphone,
-  onClose = () => null,
-  padded = true,
-  showHeader = true,
-  title = null,
-  wide = false
-}) => {
-  const classNames = [getClassName('bpk-modal')];
-  const contentClassNames = [getClassName('bpk-modal__content')];
-  const navigationStyles = [getClassName('bpk-modal__navigation')];
-  if (wide) {
-    classNames.push(getClassName('bpk-modal--wide'));
-  }
-  if (className) {
-    classNames.push(className);
-  }
-  if (fullScreen || isIphone) {
-    classNames.push(getClassName('bpk-modal--full-screen'));
-  } else if (fullScreenOnMobile) {
-    classNames.push(getClassName('bpk-modal--full-screen-mobile'));
-  }
-  if (padded) {
-    contentClassNames.push(getClassName('bpk-modal__content--padded'));
-  }
-  if (contentClassName) {
-    contentClassNames.push(contentClassName);
-  }
-  const headingId = `bpk-modal-heading-${id}`;
-  const accessoryViewFinal = accessoryView ? /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-    className: getClassName('bpk-modal__accessory-view'),
-    children: accessoryView
-  }) : null;
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_bpkReactUtils.TransitionInitialMount, {
-    appearClassName: getClassName('bpk-modal--appear'),
-    appearActiveClassName: getClassName('bpk-modal--appear-active'),
-    transitionTimeout: 300,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("section", {
-      id: id,
-      tabIndex: -1,
-      role: "dialog",
-      "aria-labelledby": showHeader ? headingId : undefined,
-      className: classNames.join(' '),
-      ref: dialogRef,
-      children: [showHeader && /*#__PURE__*/(0, _jsxRuntime.jsx)("header", {
-        className: getClassName('bpk-modal__header'),
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_bpkComponentNavigationBar.default, {
-          id: headingId,
-          className: navigationStyles.join(' '),
-          title: /*#__PURE__*/(0, _jsxRuntime.jsx)("h2", {
-            id: headingId,
-            className: getClassName('bpk-modal__heading'),
-            children: title
-          }),
-          leadingButton: accessoryViewFinal,
-          trailingButton: closeText ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_bpkComponentLink.BpkButtonLink, {
-            className: getClassName('bpk-modal__close-button'),
-            onClick: onClose,
-            children: closeText
-          }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_bpkComponentCloseButton.default, {
-            className: getClassName('bpk-modal__close-button'),
-            label: closeLabel,
-            onClick: onClose
-          })
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: contentClassNames.join(' '),
-        children: children
-      })]
-    })
-  });
-};
-var _default = BpkModalInner;
-exports.default = _default;

package/bpk-component-modal/src/BpkModalV2/BpKModal.module.css

@@ -1,18 +0,0 @@
-/*
- * Backpack - Skyscanner's Design System
- * 
- * Copyright 2016 Skyscanner Ltd
- * 
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- * 
- *   http://www.apache.org/licenses/LICENSE-2.0
- * 
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * 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.
-*/
-@keyframes bpk-keyframe-spin{100%{transform:rotate(1turn)}}@keyframes bpk-modal-scrim{0%{opacity:0}100%{opacity:1}}@keyframes bpk-modal-scale{0%{transform:scale(0.9)}100%{transform:scale(1)}}.bpk-modal-wrapper.bpk-modal-polyfill .bpk-modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;margin:0 auto;background-color:rgba(0,0,0,0.7);animation:bpk-modal-scrim 200ms ease-in-out;inset:0;inset-block-end:0;inset-inline:0;inset-inline-end:0}.bpk-modal-wrapper.bpk-modal-polyfill .bpk-modal{position:fixed;top:50%;left:50%;display:block;z-index:1;transform:translate(-50%, -50%) scale(1);transition:transform 200ms ease-in-out 200ms}.bpk-modal-wrapper.bpk-modal-polyfill .bpk-modal:not([data-open='true']),.bpk-modal-wrapper.bpk-modal-polyfill .bpk-modal-backdrop:not([data-open='true']){display:none}.bpk-modal{padding:0;border:none;border-radius:.75rem;background:#fff;overflow-y:scroll;scrollbar-width:none;box-shadow:0px 12px 50px 0px rgba(37,32,31,0.25)}@media (min-width: 32.0625rem){.bpk-modal{width:32rem;max-width:none;height:fit-content;max-height:90%}.bpk-modal--full-screen-desktop{width:100%;height:100%;max-height:100%;border-radius:0}.bpk-modal--wide{width:64rem}}.bpk-modal[open]{animation:bpk-modal-scale 200ms ease-in-out}.bpk-modal--no-full-screen-mobile{width:90%;max-width:none;height:fit-content;max-height:90%}@media (min-width: 32.0625rem){.bpk-modal--no-full-screen-mobile{width:32rem;max-width:none}}.bpk-modal::backdrop{position:fixed;background-color:rgba(0,0,0,0.7);animation:bpk-modal-scrim 200ms ease-in-out;inset:0;inset-block-end:0;inset-inline:0;inset-inline-end:0}.bpk-modal::-webkit-scrollbar{display:none}.bpk-modal__header-title{padding:1rem;border-block-end:solid 0.0625rem #C2C9CD;display:flex;min-height:1.5rem;flex-wrap:nowrap;justify-content:flex-end;align-items:center}.bpk-modal__header-title-container{display:flex;width:100%;justify-content:flex-start}.bpk-modal__title{padding-inline-end:1rem;font-size:1rem;line-height:1.5rem;font-weight:700}.bpk-modal__button-container{padding-block-start:1rem;padding-inline-end:1rem;display:flex;min-height:1.5rem;flex-wrap:nowrap;justify-content:flex-end;align-items:center}.bpk-modal__container{min-height:100%;padding:1rem}.bpk-modal__container--padded{padding:0}.bpk-modal__container--full-screen-desktop{height:100%}

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

@@ -1,154 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.BpkModalV2 = void 0;
-var _react = require("react");
-var _bpkComponentCloseButton = _interopRequireDefault(require("../../../bpk-component-close-button"));
-var _bpkComponentText = _interopRequireWildcard(require("../../../bpk-component-text"));
-var _bpkReactUtils = require("../../../bpk-react-utils");
-var _BpKModalModule = _interopRequireDefault(require("./BpKModal.module.css"));
-var _jsxRuntime = require("react/jsx-runtime");
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-/*
- * Backpack - Skyscanner's Design System
- *
- * Copyright 2016 Skyscanner Ltd
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * 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`.
-
-const getClassName = (0, _bpkReactUtils.cssModules)(_BpKModalModule.default);
-const Header = ({
-  closeLabel,
-  id,
-  onClose,
-  title
-}) => {
-  if (title) {
-    return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      id: id,
-      className: getClassName('bpk-modal__header-title'),
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: getClassName('bpk-modal__header-title-container'),
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Heading, {
-          children: title
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_bpkComponentCloseButton.default, {
-        label: closeLabel,
-        onClick: onClose
-      })]
-    });
-  }
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    className: getClassName('bpk-modal__button-container'),
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_bpkComponentCloseButton.default, {
-      label: closeLabel,
-      onClick: onClose
-    })
-  });
-};
-const Heading = (0, _bpkReactUtils.withDefaultProps)(_bpkComponentText.default, {
-  textStyle: _bpkComponentText.TEXT_STYLES.label1,
-  tagName: 'h2',
-  className: getClassName('bpk-modal__title')
-});
-// TODO: this check if the browser support the HTML dialog element. We can remove it once we drop support as a business for Safari 14
-const dialogSupported = typeof HTMLDialogElement === 'function';
-const setPageProperties = ({
-  isDialogOpen
-}) => {
-  document.body.style.overflowY = isDialogOpen ? 'hidden' : 'visible';
-  if (!dialogSupported) {
-    document.body.style.position = isDialogOpen ? 'fixed' : 'relative';
-    document.body.style.width = isDialogOpen ? '100%' : 'auto';
-  }
-};
-const BpkModalV2 = props => {
-  const {
-    ariaLabelledby,
-    children,
-    closeLabel,
-    fullScreenOnDesktop,
-    id,
-    isOpen,
-    noFullScreenOnMobile,
-    onClose,
-    padded,
-    showHeader = true,
-    title,
-    wide
-  } = props;
-  const ref = (0, _react.useRef)(null);
-  (0, _react.useEffect)(() => {
-    if (isOpen) {
-      ref.current?.showModal?.();
-      const dialog = document.getElementById(`${id}`);
-      const dialogWithPolyfill = document.getElementById(`${id}-polyfill`);
-      const handleBackdropClick = modal => {
-        if (modal) {
-          modal.addEventListener('click', event => {
-            const {
-              target
-            } = event;
-            if (target === modal) {
-              modal === dialog ? ref.current?.close?.() : onClose();
-            }
-          });
-        }
-      };
-      handleBackdropClick(dialog);
-      handleBackdropClick(dialogWithPolyfill);
-    } else {
-      ref.current?.close?.();
-    }
-    setPageProperties({
-      isDialogOpen: isOpen
-    });
-    return () => setPageProperties({
-      isDialogOpen: false
-    });
-  }, [id, isOpen, onClose]);
-  const classNames = getClassName('bpk-modal', fullScreenOnDesktop && 'bpk-modal--full-screen-desktop', noFullScreenOnMobile && 'bpk-modal--no-full-screen-mobile', wide && 'bpk-modal--wide');
-  const contentClassNames = getClassName('bpk-modal__container', fullScreenOnDesktop && 'bpk-modal__container--full-screen-desktop', padded && 'bpk-modal__container--padded');
-  return isOpen ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-    className: getClassName('bpk-modal-wrapper', dialogSupported ? '' : 'bpk-modal-polyfill'),
-    children: [!dialogSupported && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      id: `${id}-polyfill`,
-      className: getClassName('bpk-modal-backdrop'),
-      "data-open": isOpen
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("dialog", {
-      id: id,
-      className: classNames,
-      onClose: onClose,
-      "aria-labelledby": ariaLabelledby,
-      "data-open": isOpen,
-      ref: ref,
-      children: [showHeader && /*#__PURE__*/(0, _jsxRuntime.jsx)(Header, {
-        id: `${id}-title`,
-        title: title,
-        closeLabel: closeLabel,
-        onClose: onClose
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: contentClassNames,
-        children: children
-      })]
-    })]
-  }) : null;
-};
-exports.BpkModalV2 = BpkModalV2;

package/bpk-component-overlay/index.js

@@ -1,34 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "OVERLAY_TYPES", {
-  enumerable: true,
-  get: function () {
-    return _BpkOverlay.OVERLAY_TYPES;
-  }
-});
-exports.default = void 0;
-var _BpkOverlay = _interopRequireWildcard(require("./src/BpkOverlay"));
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-/*
- * Backpack - Skyscanner's Design System
- *
- * Copyright 2016 Skyscanner Ltd
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * 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.
- */
-var _default = _BpkOverlay.default;
-exports.default = _default;