@skyscanner/backpack-web 36.11.0 → 36.11.1-alpha.0

package/bpk-component-pagination/src/BpkPaginationNudger.js

@@ -22,7 +22,7 @@ import { withRtlSupport, withButtonAlignment } from "../../bpk-component-icon";
 import ArrowLeftIcon from "../../bpk-component-icon/sm/arrow-left";
 import ArrowRightIcon from "../../bpk-component-icon/sm/arrow-right";
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkPaginationNudger.module.css";
+import * as STYLES from "./BpkPaginationNudger.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const AlignedArrowLeftIcon = withRtlSupport(withButtonAlignment(ArrowLeftIcon));

package/bpk-component-pagination/src/BpkPaginationPage.js

@@ -18,7 +18,7 @@
 
 import PropTypes from 'prop-types';
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkPaginationPage.module.css";
+import * as STYLES from "./BpkPaginationPage.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkPaginationPage = props => {

package/bpk-component-panel/src/BpkPanel.js

@@ -18,7 +18,7 @@
 
 import PropTypes from 'prop-types';
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkPanel.module.css";
+import * as STYLES from "./BpkPanel.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkPanel = props => {

package/bpk-component-phone-input/src/BpkPhoneInput.js

@@ -19,7 +19,7 @@ import BpkInput, { INPUT_TYPES } from "../../bpk-component-input";
 import BpkLabel from "../../bpk-component-label";
 import BpkSelect from "../../bpk-component-select";
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkPhoneInput.module.css";
+import * as STYLES from "./BpkPhoneInput.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkPhoneInput = props => {

package/bpk-component-popover/src/BpkPopover.js

@@ -27,7 +27,7 @@ import { BpkButtonLink } from "../../bpk-component-link";
 import BpkText, { TEXT_STYLES } from "../../bpk-component-text";
 import { TransitionInitialMount, cssModules } from "../../bpk-react-utils";
 import { ARROW_ID } from "./constants";
-import STYLES from "./BpkPopover.module.css";
+import * as STYLES from "./BpkPopover.module.css";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const EVENT_SOURCES = {

package/bpk-component-price/src/BpkPrice.js

@@ -18,7 +18,7 @@
 import BpkText, { TEXT_STYLES } from "../../bpk-component-text";
 import { cssModules } from "../../bpk-react-utils";
 import { SIZES, ALIGNS } from "./common-types";
-import STYLES from "./BpkPrice.module.css";
+import * as STYLES from "./BpkPrice.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const getPriceTextStyle = size => {

package/bpk-component-progress/src/BpkProgress.js

@@ -18,7 +18,7 @@
 import { Component } from 'react';
 import clamp from 'lodash.clamp';
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkProgress.module.css";
+import * as STYLES from "./BpkProgress.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const isTransitionEndSupported = () => !!(typeof window !== 'undefined' && 'TransitionEvent' in window);

package/bpk-component-radio/src/BpkRadio.js

@@ -16,7 +16,7 @@
  * limitations under the License.
  */import PropTypes from 'prop-types';
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkRadio.module.css";
+import * as STYLES from "./BpkRadio.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkRadio = props => {

package/bpk-component-rating/src/BpkRating.js

@@ -21,7 +21,7 @@ import clamp from 'lodash.clamp';
 import BpkText, { TEXT_STYLES } from "../../bpk-component-text";
 import { cssModules } from "../../bpk-react-utils";
 import { RATING_SIZES, RATING_SCALES } from "./common-types";
-import STYLES from "./BpkRating.module.css";
+import * as STYLES from "./BpkRating.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const getMinValue = () =>

package/bpk-component-scrollable-calendar/src/BpkScrollableCalendarGrid.js

@@ -19,7 +19,7 @@
 import { BpkCalendarGrid } from "../../bpk-component-calendar";
 import BpkText, { TEXT_STYLES } from "../../bpk-component-text";
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkScrollableCalendarGrid.module.css";
+import * as STYLES from "./BpkScrollableCalendarGrid.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkScrollableCalendarGrid = ({

package/bpk-component-scrollable-calendar/src/BpkScrollableCalendarGridList.js

@@ -24,7 +24,7 @@ import { CALENDAR_SELECTION_TYPE, DateUtils } from "../../bpk-component-calendar
 import { cssModules } from "../../bpk-react-utils";
 import BpkScrollableCalendarGrid from "./BpkScrollableCalendarGrid";
 import { getMonthsArray, getMonthItemHeights } from "./utils";
-import STYLES from "./BpkScrollableCalendarGridList.module.css";
+import * as STYLES from "./BpkScrollableCalendarGridList.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 

package/bpk-component-section-header/src/BpkSectionHeader.js

@@ -18,7 +18,7 @@
 
 import BpkText from "../../bpk-component-text";
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkSectionHeader.module.css";
+import * as STYLES from "./BpkSectionHeader.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 export const SECTION_TYPES = {

package/bpk-component-section-list/src/BpkSectionListItem.js

@@ -18,7 +18,7 @@
 import { withRtlSupport } from "../../bpk-component-icon";
 import BpkLargeChevronRightIcon from "../../bpk-component-icon/lg/chevron-right";
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkSectionListItem.module.css";
+import * as STYLES from "./BpkSectionListItem.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const BpkLargeChevronRightIconWithRtlSupport = withRtlSupport(BpkLargeChevronRightIcon);
 const getClassName = cssModules(STYLES);

package/bpk-component-section-list/src/BpkSectionListSection.js

@@ -18,7 +18,7 @@
 import { Children } from 'react';
 import BpkText, { TEXT_STYLES } from "../../bpk-component-text";
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkSectionListSection.module.css";
+import * as STYLES from "./BpkSectionListSection.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkSectionListSection = props => {

package/bpk-component-segmented-control/src/BpkSegmentedControl.js

@@ -18,7 +18,7 @@
 
 import { useState } from 'react';
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkSegmentedControl.module.css";
+import * as STYLES from "./BpkSegmentedControl.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 export const SEGMENT_TYPES = {

package/bpk-component-select/src/BpkSelect.js

@@ -17,7 +17,7 @@
  */import PropTypes from 'prop-types';
 import { cloneElement } from 'react';
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkSelect.module.css";
+import * as STYLES from "./BpkSelect.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkSelect = props => {

package/bpk-component-skeleton/src/BpkBaseSkeleton.js

@@ -17,7 +17,7 @@
  */
 
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkBaseSkeleton.module.css";
+import * as STYLES from "./BpkBaseSkeleton.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkBaseSkeleton = ({

package/bpk-component-skeleton/src/BpkSkeleton.js

@@ -19,7 +19,7 @@
 import { cssModules } from "../../bpk-react-utils";
 import BpkBaseSkeleton from "./BpkBaseSkeleton";
 import { SKELETON_TYPES, IMAGE_SKELETON_STYLE, SIZE_TYPES } from "./common-types";
-import STYLES from "./BpkSkeleton.module.css";
+import * as STYLES from "./BpkSkeleton.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkSkeleton = props => {

package/bpk-component-skip-link/src/BpkSkipLink.js

@@ -16,7 +16,7 @@
  * limitations under the License.
  */import PropTypes from 'prop-types';
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkSkipLink.module.css";
+import * as STYLES from "./BpkSkipLink.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkSkipLink = props => {

package/bpk-component-slider/src/BpkSlider.js

@@ -19,7 +19,7 @@ import { forwardRef, useRef, useEffect } from 'react';
 import { useComposedRefs } from '@radix-ui/react-compose-refs';
 import * as Slider from '@radix-ui/react-slider';
 import { cssModules, isRTL, setNativeValue } from "../../bpk-react-utils";
-import STYLES from "./BpkSlider.module.css";
+import * as STYLES from "./BpkSlider.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkSlider = ({

package/bpk-component-snippet/src/BpkSnippet.js

@@ -21,7 +21,7 @@ import { BpkButtonV2, BUTTON_TYPES } from "../../bpk-component-button";
 import BpkImage, { BORDER_RADIUS_STYLES, withLazyLoading } from "../../bpk-component-image";
 import BpkText, { TEXT_STYLES } from "../../bpk-component-text/src/BpkText";
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkSnippet.module.css";
+import * as STYLES from "./BpkSnippet.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 export const BODY_STYLE = {

package/bpk-component-spinner/src/BpkExtraLargeSpinner.js

@@ -19,7 +19,7 @@
 import { cssModules } from "../../bpk-react-utils";
 import SPINNER_TYPES from "./spinnerTypes";
 import XlSpinner from "./spinners/xl";
-import STYLES from "./BpkSpinner.module.css";
+import * as STYLES from "./BpkSpinner.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkExtraLargeSpinner = ({

package/bpk-component-spinner/src/BpkLargeSpinner.js

@@ -19,7 +19,7 @@
 import { cssModules } from "../../bpk-react-utils";
 import SPINNER_TYPES from "./spinnerTypes";
 import LgSpinner from "./spinners/lg";
-import STYLES from "./BpkSpinner.module.css";
+import * as STYLES from "./BpkSpinner.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkLargeSpinner = ({

package/bpk-component-spinner/src/BpkSpinner.js

@@ -19,7 +19,7 @@
 import { cssModules } from "../../bpk-react-utils";
 import SPINNER_TYPES from "./spinnerTypes";
 import SmSpinner from "./spinners/sm";
-import STYLES from "./BpkSpinner.module.css";
+import * as STYLES from "./BpkSpinner.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkSpinner = ({

package/bpk-component-split-input/src/BpkInputField.js

@@ -19,7 +19,7 @@
 import { PureComponent } from 'react';
 import BpkInput from "../../bpk-component-input";
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkInputField.module.css";
+import * as STYLES from "./BpkInputField.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 class BpkInputField extends PureComponent {

package/bpk-component-split-input/src/BpkSplitInput.js

@@ -20,7 +20,7 @@ import { Component } from 'react';
 import { INPUT_TYPES } from "../../bpk-component-input";
 import { cssModules } from "../../bpk-react-utils";
 import InputField from "./BpkInputField";
-import STYLES from "./BpkSplitInput.module.css";
+import * as STYLES from "./BpkSplitInput.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 class BpkSplitInput extends Component {

package/bpk-component-star-rating/src/BpkInteractiveStar.js

@@ -17,7 +17,7 @@
  */import PropTypes from 'prop-types';
 import { cssModules } from "../../bpk-react-utils";
 import { BpkStarNonRtl, STAR_TYPES } from "./BpkStar";
-import STYLES from "./BpkInteractiveStar.module.css";
+import * as STYLES from "./BpkInteractiveStar.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkInteractiveStar = props => {

package/bpk-component-star-rating/src/BpkInteractiveStarRating.js

@@ -18,7 +18,7 @@
 import { cssModules } from "../../bpk-react-utils";
 import BpkInteractiveStar from "./BpkInteractiveStar";
 import { STAR_TYPES } from "./BpkStar";
-import STYLES from "./BpkStarRating.module.css";
+import * as STYLES from "./BpkStarRating.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 export const getTypeByRating = (starNumber, rating) => {

package/bpk-component-star-rating/src/BpkStar.js

@@ -23,7 +23,7 @@ import SmallIcon from "../../bpk-component-icon/sm/star";
 import HalfSmallIcon from "../../bpk-component-icon/sm/star-half";
 import OutlineSmallIcon from "../../bpk-component-icon/sm/star-outline";
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkStar.module.css";
+import * as STYLES from "./BpkStar.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 export const STAR_TYPES = {

package/bpk-component-star-rating/src/BpkStarRating.js

@@ -17,7 +17,7 @@
  */import PropTypes from 'prop-types';
 import { cssModules } from "../../bpk-react-utils";
 import BpkStar, { STAR_TYPES } from "./BpkStar";
-import STYLES from "./BpkStarRating.module.css";
+import * as STYLES from "./BpkStarRating.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 export const getTypeByRating = (starNumber, rating) => {

package/bpk-component-swap-button/src/BpkSwapButton.js

@@ -19,7 +19,7 @@
 import { useState } from 'react';
 import SwapVertical from "../../bpk-component-icon/sm/swap--vertical";
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkSwapButton.module.css";
+import * as STYLES from "./BpkSwapButton.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 export const SWAPBUTTON_STYLES = {

package/bpk-component-switch/src/BpkSwitch.js

@@ -17,7 +17,7 @@
  */
 
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkSwitch.module.css";
+import * as STYLES from "./BpkSwitch.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkSwitch = ({

package/bpk-component-table/src/BpkTable.js

@@ -16,7 +16,7 @@
  * limitations under the License.
  */import PropTypes from 'prop-types';
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkTable.module.css";
+import * as STYLES from "./BpkTable.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkTable = props => {

package/bpk-component-table/src/BpkTableCell.js

@@ -16,7 +16,7 @@
  * limitations under the License.
  */import PropTypes from 'prop-types';
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkTable.module.css";
+import * as STYLES from "./BpkTable.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkTableCell = props => {

package/bpk-component-table/src/BpkTableHeadCell.js

@@ -16,7 +16,7 @@
  * limitations under the License.
  */import PropTypes from 'prop-types';
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkTable.module.css";
+import * as STYLES from "./BpkTable.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkTableHeadCell = props => {

package/bpk-component-text/src/BpkText.js

@@ -17,7 +17,7 @@
  */
 
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkText.module.css";
+import * as STYLES from "./BpkText.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 export const TEXT_STYLES = {

package/bpk-component-textarea/src/BpkTextarea.js

@@ -16,7 +16,7 @@
  * limitations under the License.
  */import PropTypes from 'prop-types';
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkTextarea.module.css";
+import * as STYLES from "./BpkTextarea.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkTextarea = props => {

package/bpk-component-theme-toggle/src/BpkThemeToggle.js

@@ -22,7 +22,7 @@ import BpkSelect from "../../bpk-component-select";
 import { cssModules } from "../../bpk-react-utils";
 import bpkCustomThemes from "./theming";
 import { getHtmlElement, THEME_CHANGE_EVENT } from "./utils";
-import STYLES from "./BpkThemeToggle.module.css";
+import * as STYLES from "./BpkThemeToggle.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const inputId = 'theme-select';
 const getClassName = cssModules(STYLES);

package/bpk-component-ticket/src/BpkTicket.js

@@ -18,7 +18,7 @@
 /* eslint-disable valid-jsdoc */
 import PropTypes from 'prop-types';
 import { cssModules } from "../../bpk-react-utils";
-import STYLES from "./BpkTicket.module.css";
+import * as STYLES from "./BpkTicket.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 /**

package/bpk-component-tooltip/src/BpkTooltip.js

@@ -24,7 +24,7 @@ The actual component that developers create (i.e. the default export from this p
 
 import { TransitionInitialMount, cssModules } from "../../bpk-react-utils";
 import { ARROW_ID, TOOLTIP_TYPES } from "./constants";
-import STYLES from "./BpkTooltip.module.css";
+import * as STYLES from "./BpkTooltip.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkTooltip = ({

package/bpk-component-tooltip/src/BpkTooltipPortal.js

@@ -21,7 +21,7 @@ import { createPopper } from '@popperjs/core';
 import { Portal, cssModules } from "../../bpk-react-utils";
 import BpkTooltip from "./BpkTooltip";
 import { TOOLTIP_TYPES } from "./constants";
-import STYLES from "./BpkTooltip.module.css";
+import * as STYLES from "./BpkTooltip.module.css";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const hasTouchSupport = () => !!(typeof window !== 'undefined' && ('ontouchstart' in window || navigator.maxTouchPoints > 0));

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

@@ -19,7 +19,7 @@
 import { useEffect, useRef, useState } from "react";
 import CSSTransition from 'react-transition-group/CSSTransition';
 import cssModules from "../cssModules";
-import STYLES from "./BpkDialogWrapper.module.css";
+import * as STYLES from "./BpkDialogWrapper.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 ;

package/bpk-scrim-utils/src/BpkScrim.js

@@ -17,7 +17,7 @@
  */
 
 import { TransitionInitialMount, cssModules } from "../../bpk-react-utils";
-import STYLES from "./bpk-scrim.module.css";
+import * as STYLES from "./bpk-scrim.module.css";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const BpkScrim = ({

package/bpk-scrim-utils/src/withScrim.js

@@ -25,7 +25,7 @@ import focusStore from 'a11y-focus-store';
 import { cssModules, isDeviceIpad, isDeviceIphone, wrapDisplayName } from "../../bpk-react-utils";
 import BpkScrim from "./BpkScrim";
 import { fixBody, lockScroll, restoreScroll, storeScroll, unfixBody, unlockScroll } from "./scroll-utils";
-import STYLES from "./bpk-scrim-content.module.css";
+import * as STYLES from "./bpk-scrim-content.module.css";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const getClassName = cssModules(STYLES);
 const withScrim = WrappedComponent => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@skyscanner/backpack-web",
-  "version": "36.11.0",
+  "version": "36.11.1-alpha.0",
   "description": "Backpack Design System web library",
   "repository": {
     "type": "git",