@skyscanner/backpack-web 14.0.0 → 14.2.0-beta.1

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

@@ -1,87 +1,60 @@
-/*
- * 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.
- */
-
-/* @flow strict */
-
-import React from 'react';
-import PropTypes from 'prop-types';
-
-import { cssModules } from '../../bpk-react-utils';
-
-import { BpkStarNonRtl, STAR_TYPES } from './BpkStar';
-import STYLES from './BpkInteractiveStar.module.scss';
-
-const getClassName = cssModules(STYLES);
-
-type Props = {
-  label: string,
-  name: string,
-  onClick: () => mixed,
-  onMouseEnter: () => mixed,
-  type: typeof STAR_TYPES.EMPTY | typeof STAR_TYPES.FULL,
-  value: number,
-  selected: boolean,
-};
-
-const BpkInteractiveStar = (props: Props) => {
-  const { label, name, onClick, onMouseEnter, selected, type, value, ...rest } =
-    props;
-
-  const buttonClassNames = getClassName(
-    'bpk-interactive-star',
-    selected && 'bpk-interactive-star--selected',
-  );
-
-  const iconClassNames = getClassName(
-    'bpk-interactive-star__icon',
-    selected && 'bpk-interactive-star__icon--selected',
-  );
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _bpkReactUtils = require("../../bpk-react-utils");
+var _BpkStar = require("./BpkStar");
+var _BpkInteractiveStarModule = _interopRequireDefault(require("./BpkInteractiveStar.module.css"));
+const _excluded = ["label", "name", "onClick", "onMouseEnter", "selected", "type", "value"];
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+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)(_BpkInteractiveStarModule.default);
+const BpkInteractiveStar = props => {
+  const {
+      label,
+      name,
+      onClick,
+      onMouseEnter,
+      selected,
+      type,
+      value
+    } = props,
+    rest = _objectWithoutProperties(props, _excluded);
+  const buttonClassNames = getClassName('bpk-interactive-star', selected && 'bpk-interactive-star--selected');
+  const iconClassNames = getClassName('bpk-interactive-star__icon', selected && 'bpk-interactive-star__icon--selected');
 
   // Note we use `BpkStarRatingNonRtl` here otherwise it already has `scaleX(-1)` applied in RTL.
   // That causes the scale animation to be a bit over the top.
 
-  return (
-    <button
-      aria-label={label}
-      onClick={onClick}
-      onMouseEnter={onMouseEnter}
-      className={buttonClassNames}
-      aria-pressed={selected}
-      type="button"
-    >
-      {/* $FlowFixMe[cannot-spread-inexact] - inexact rest. See decisions/flowfixme.md */}
-      <BpkStarNonRtl className={iconClassNames} type={type} {...rest} />
-    </button>
-  );
+  return /*#__PURE__*/_react.default.createElement("button", {
+    "aria-label": label,
+    onClick: onClick,
+    onMouseEnter: onMouseEnter,
+    className: buttonClassNames,
+    "aria-pressed": selected,
+    type: "button"
+  }, /*#__PURE__*/_react.default.createElement(_BpkStar.BpkStarNonRtl, _extends({
+    className: iconClassNames,
+    type: type
+  }, rest)));
 };
-
 BpkInteractiveStar.propTypes = {
-  label: PropTypes.string.isRequired,
-  name: PropTypes.string.isRequired,
-  onClick: PropTypes.func.isRequired,
-  onMouseEnter: PropTypes.func.isRequired,
-  type: PropTypes.oneOf([STAR_TYPES.EMPTY, STAR_TYPES.FULL]).isRequired,
-  value: PropTypes.number.isRequired,
-  selected: PropTypes.bool,
+  label: _propTypes.default.string.isRequired,
+  name: _propTypes.default.string.isRequired,
+  onClick: _propTypes.default.func.isRequired,
+  onMouseEnter: _propTypes.default.func.isRequired,
+  type: _propTypes.default.oneOf([_BpkStar.STAR_TYPES.EMPTY, _BpkStar.STAR_TYPES.FULL]).isRequired,
+  value: _propTypes.default.number.isRequired,
+  selected: _propTypes.default.bool
 };
-
 BpkInteractiveStar.defaultProps = {
-  selected: false,
+  selected: false
 };
-
-export default BpkInteractiveStar;
+var _default = BpkInteractiveStar;
+exports.default = _default;

package/bpk-component-star-rating/src/BpkInteractiveStar.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
 */
-@keyframes bpk-keyframe-spin{100%{transform:rotate(1turn)}}@keyframes star_dust{0%{transform:scale(1)}50%{transform:scale(0.5)}100%{transform:scale(1)}}.bpk-interactive-star{margin:0;padding:0;border:none;background:transparent;cursor:pointer;appearance:none}.bpk-no-touch-support .bpk-interactive-star:hover:not(:active):not(:disabled) .bpk-interactive-star__icon{transform:rotate(10deg) scale(1.2)}.bpk-no-touch-support .bpk-interactive-star:hover:not(:active):not(:disabled) .bpk-interactive-star__icon--selected{transform:rotate(0deg) scale(1)}:global(.bpk-no-touch-support) .bpk-interactive-star:hover:not(:active):not(:disabled) .bpk-interactive-star__icon{transform:rotate(10deg) scale(1.2)}:global(.bpk-no-touch-support) .bpk-interactive-star:hover:not(:active):not(:disabled) .bpk-interactive-star__icon--selected{transform:rotate(0deg) scale(1)}.bpk-interactive-star--selected{cursor:default}.bpk-interactive-star__icon{transform:rotate(0deg) scale(1);transition:transform 200ms ease-in-out}.bpk-interactive-star__icon--selected{animation-duration:300ms;animation-name:star_dust}
+@keyframes bpk-keyframe-spin{100%{transform:rotate(1turn)}}@keyframes star-dust{0%{transform:scale(1)}50%{transform:scale(0.5)}100%{transform:scale(1)}}.bpk-interactive-star{margin:0;padding:0;border:none;background:transparent;cursor:pointer;appearance:none}.bpk-no-touch-support .bpk-interactive-star:hover:not(:active):not(:disabled) .bpk-interactive-star__icon{transform:rotate(10deg) scale(1.2)}.bpk-no-touch-support .bpk-interactive-star:hover:not(:active):not(:disabled) .bpk-interactive-star__icon--selected{transform:rotate(0deg) scale(1)}:global(.bpk-no-touch-support) .bpk-interactive-star:hover:not(:active):not(:disabled) .bpk-interactive-star__icon{transform:rotate(10deg) scale(1.2)}:global(.bpk-no-touch-support) .bpk-interactive-star:hover:not(:active):not(:disabled) .bpk-interactive-star__icon--selected{transform:rotate(0deg) scale(1)}.bpk-interactive-star--selected{cursor:default}.bpk-interactive-star__icon{transform:rotate(0deg) scale(1);transition:transform 200ms ease-in-out}.bpk-interactive-star__icon--selected{animation-duration:300ms;animation-name:star-dust}

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

@@ -1,118 +1,80 @@
-/*
- * 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.
- */
-
-/* @flow strict */
-
-import React from 'react';
-import PropTypes from 'prop-types';
-
-import { cssModules } from '../../bpk-react-utils';
-
-import { STAR_TYPES } from './BpkStar';
-import BpkInteractiveStar from './BpkInteractiveStar';
-import STYLES from './BpkStarRating.module.scss';
-
-const getClassName = cssModules(STYLES);
-
-export const getTypeByRating = (starNumber: number, rating: number) => {
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getTypeByRating = exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _bpkReactUtils = require("../../bpk-react-utils");
+var _BpkStar = require("./BpkStar");
+var _BpkInteractiveStar = _interopRequireDefault(require("./BpkInteractiveStar"));
+var _BpkStarRatingModule = _interopRequireDefault(require("./BpkStarRating.module.css"));
+const _excluded = ["className", "getStarLabel", "hoverRating", "id", "large", "maxRating", "onMouseLeave", "onRatingHover", "onRatingSelect", "rating"];
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+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)(_BpkStarRatingModule.default);
+const getTypeByRating = (starNumber, rating) => {
   if (starNumber > rating) {
-    return STAR_TYPES.EMPTY;
+    return _BpkStar.STAR_TYPES.EMPTY;
   }
-
-  return STAR_TYPES.FULL;
+  return _BpkStar.STAR_TYPES.FULL;
 };
-
-type Props = {
-  getStarLabel: (number, number) => string,
-  id: string,
-  className: ?string,
-  hoverRating: number,
-  large: boolean,
-  maxRating: number,
-  onMouseLeave: () => mixed,
-  onRatingHover: (number, any) => mixed,
-  onRatingSelect: (number, any) => mixed,
-  rating: number,
-};
-
-const BpkInteractiveStarRating = (props: Props) => {
+exports.getTypeByRating = getTypeByRating;
+const BpkInteractiveStarRating = props => {
   const {
-    className,
-    getStarLabel,
-    hoverRating,
-    id,
-    large,
-    maxRating,
-    onMouseLeave,
-    onRatingHover,
-    onRatingSelect,
-    rating,
-    ...rest
-  } = props;
-
+      className,
+      getStarLabel,
+      hoverRating,
+      id,
+      large,
+      maxRating,
+      onMouseLeave,
+      onRatingHover,
+      onRatingSelect,
+      rating
+    } = props,
+    rest = _objectWithoutProperties(props, _excluded);
   const stars = [];
   const classNames = [getClassName('bpk-star-rating')];
   const displayRating = hoverRating || rating;
-
   const currentRating = displayRating > maxRating ? maxRating : displayRating;
-
   if (className) {
     classNames.push(className);
   }
-
   for (let starNumber = 1; starNumber <= maxRating; starNumber += 1) {
     const type = getTypeByRating(starNumber, currentRating);
-
-    stars.push(
-      <BpkInteractiveStar
-        key={`star-${starNumber}`}
-        onClick={(event) => onRatingSelect(starNumber, event)}
-        type={type}
-        large={large}
-        onMouseEnter={(event) => onRatingHover(starNumber, event)}
-        selected={rating === starNumber}
-        label={getStarLabel(starNumber, maxRating)}
-        name={`${id}_rating`}
-        value={starNumber}
-      />,
-    );
+    stars.push( /*#__PURE__*/_react.default.createElement(_BpkInteractiveStar.default, {
+      key: `star-${starNumber}`,
+      onClick: event => onRatingSelect(starNumber, event),
+      type: type,
+      large: large,
+      onMouseEnter: event => onRatingHover(starNumber, event),
+      selected: rating === starNumber,
+      label: getStarLabel(starNumber, maxRating),
+      name: `${id}_rating`,
+      value: starNumber
+    }));
   }
-
-  return (
-    <div {...rest} className={classNames.join(' ')} onMouseLeave={onMouseLeave}>
-      {stars}
-    </div>
-  );
+  return /*#__PURE__*/_react.default.createElement("div", _extends({}, rest, {
+    className: classNames.join(' '),
+    onMouseLeave: onMouseLeave
+  }), stars);
 };
-
 BpkInteractiveStarRating.propTypes = {
-  getStarLabel: PropTypes.func.isRequired,
-  id: PropTypes.string.isRequired,
-  className: PropTypes.string,
-  hoverRating: PropTypes.number,
-  large: PropTypes.bool,
-  maxRating: PropTypes.number,
-  onMouseLeave: PropTypes.func,
-  onRatingHover: PropTypes.func,
-  onRatingSelect: PropTypes.func,
-  rating: PropTypes.number,
+  getStarLabel: _propTypes.default.func.isRequired,
+  id: _propTypes.default.string.isRequired,
+  className: _propTypes.default.string,
+  hoverRating: _propTypes.default.number,
+  large: _propTypes.default.bool,
+  maxRating: _propTypes.default.number,
+  onMouseLeave: _propTypes.default.func,
+  onRatingHover: _propTypes.default.func,
+  onRatingSelect: _propTypes.default.func,
+  rating: _propTypes.default.number
 };
-
 BpkInteractiveStarRating.defaultProps = {
   className: null,
   hoverRating: 0,
@@ -121,7 +83,7 @@ BpkInteractiveStarRating.defaultProps = {
   onMouseLeave: () => null,
   onRatingHover: () => null,
   onRatingSelect: () => null,
-  rating: 0,
+  rating: 0
 };
-
-export default BpkInteractiveStarRating;
+var _default = BpkInteractiveStarRating;
+exports.default = _default;

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

@@ -1,112 +1,83 @@
-/*
- * 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.
- */
-
-/* @flow strict */
-
-import React from 'react';
-import PropTypes from 'prop-types';
-
-import SmallIcon from '../../bpk-component-icon/sm/star';
-import LargeIcon from '../../bpk-component-icon/lg/star';
-import OutlineSmallIcon from '../../bpk-component-icon/sm/star-outline';
-import OutlineLargeIcon from '../../bpk-component-icon/lg/star-outline';
-import HalfSmallIcon from '../../bpk-component-icon/sm/star-half';
-import HalfLargeIcon from '../../bpk-component-icon/lg/star-half';
-import { withRtlSupport } from '../../bpk-component-icon';
-import { cssModules } from '../../bpk-react-utils';
-
-import STYLES from './BpkStar.module.scss';
-
-const getClassName = cssModules(STYLES);
-
-export const STAR_TYPES = {
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.STAR_TYPES = exports.BpkStarNonRtl = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _star = _interopRequireDefault(require("../../bpk-component-icon/sm/star"));
+var _star2 = _interopRequireDefault(require("../../bpk-component-icon/lg/star"));
+var _starOutline = _interopRequireDefault(require("../../bpk-component-icon/sm/star-outline"));
+var _starOutline2 = _interopRequireDefault(require("../../bpk-component-icon/lg/star-outline"));
+var _starHalf = _interopRequireDefault(require("../../bpk-component-icon/sm/star-half"));
+var _starHalf2 = _interopRequireDefault(require("../../bpk-component-icon/lg/star-half"));
+var _bpkComponentIcon = require("../../bpk-component-icon");
+var _bpkReactUtils = require("../../bpk-react-utils");
+var _BpkStarModule = _interopRequireDefault(require("./BpkStar.module.css"));
+const _excluded = ["className", "large", "type"];
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+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)(_BpkStarModule.default);
+const STAR_TYPES = {
   EMPTY: 'empty',
   HALF: 'half',
-  FULL: 'full',
-};
-
-type Props = {
-  type: $Keys<typeof STAR_TYPES>,
-  className: ?string,
-  large: boolean,
+  FULL: 'full'
 };
-
-const BpkStar = (props: Props) => {
-  const { className, large, type, ...rest } = props;
-  const iconClassNames = getClassName(
-    'bpk-star',
-    large && 'bpk-star--large',
-    type === STAR_TYPES.FULL && 'bpk-star--filled',
-    className,
-  );
-
-  const containerClassNames = getClassName(
-    'bpk-star__container',
-    'bpk-star__container--half-star',
-    large && 'bpk-star__container--large',
-    className,
-  );
-
-  const halfIconClassNames = getClassName(
-    'bpk-star',
-    'bpk-star--half',
-    'bpk-star--filled',
-  );
-
-  let Icon = SmallIcon;
-  let OutlineIcon = OutlineSmallIcon;
-  let HalfIcon = HalfSmallIcon;
-
+exports.STAR_TYPES = STAR_TYPES;
+const BpkStar = props => {
+  const {
+      className,
+      large,
+      type
+    } = props,
+    rest = _objectWithoutProperties(props, _excluded);
+  const iconClassNames = getClassName('bpk-star', large && 'bpk-star--large', type === STAR_TYPES.FULL && 'bpk-star--filled', className);
+  const containerClassNames = getClassName('bpk-star__container', 'bpk-star__container--half-star', large && 'bpk-star__container--large', className);
+  const halfIconClassNames = getClassName('bpk-star', 'bpk-star--half', 'bpk-star--filled');
+  let Icon = _star.default;
+  let OutlineIcon = _starOutline.default;
+  let HalfIcon = _starHalf.default;
   if (large) {
-    Icon = LargeIcon;
-    OutlineIcon = OutlineLargeIcon;
-    HalfIcon = HalfLargeIcon;
+    Icon = _star2.default;
+    OutlineIcon = _starOutline2.default;
+    HalfIcon = _starHalf2.default;
   }
-
   if (type === STAR_TYPES.HALF) {
     return (
+      /*#__PURE__*/
       // $FlowFixMe[cannot-spread-inexact] - inexact rest. See decisions/flowfixme.md
-      <span className={containerClassNames} {...rest}>
-        <HalfIcon className={halfIconClassNames} />
-      </span>
+      _react.default.createElement("span", _extends({
+        className: containerClassNames
+      }, rest), /*#__PURE__*/_react.default.createElement(HalfIcon, {
+        className: halfIconClassNames
+      }))
     );
   }
-
-  return type === STAR_TYPES.FULL ? (
-    // $FlowFixMe[cannot-spread-inexact] - inexact rest. See decisions/flowfixme.md
-    <Icon className={iconClassNames} {...rest} />
-  ) : (
-    // $FlowFixMe[cannot-spread-inexact] - inexact rest. See decisions/flowfixme.md
-    <OutlineIcon className={iconClassNames} {...rest} />
-  );
+  return type === STAR_TYPES.FULL ?
+  /*#__PURE__*/
+  // $FlowFixMe[cannot-spread-inexact] - inexact rest. See decisions/flowfixme.md
+  _react.default.createElement(Icon, _extends({
+    className: iconClassNames
+  }, rest)) :
+  /*#__PURE__*/
+  // $FlowFixMe[cannot-spread-inexact] - inexact rest. See decisions/flowfixme.md
+  _react.default.createElement(OutlineIcon, _extends({
+    className: iconClassNames
+  }, rest));
 };
-
 BpkStar.propTypes = {
-  type: PropTypes.oneOf([STAR_TYPES.EMPTY, STAR_TYPES.HALF, STAR_TYPES.FULL])
-    .isRequired,
-  className: PropTypes.string,
-  large: PropTypes.bool,
+  type: _propTypes.default.oneOf([STAR_TYPES.EMPTY, STAR_TYPES.HALF, STAR_TYPES.FULL]).isRequired,
+  className: _propTypes.default.string,
+  large: _propTypes.default.bool
 };
-
 BpkStar.defaultProps = {
   className: null,
-  large: false,
+  large: false
 };
-
-export const BpkStarNonRtl = BpkStar;
-export default withRtlSupport(BpkStar);
+const BpkStarNonRtl = BpkStar;
+exports.BpkStarNonRtl = BpkStarNonRtl;
+var _default = (0, _bpkComponentIcon.withRtlSupport)(BpkStar);
+exports.default = _default;

package/bpk-component-star-rating/src/BpkStar.module.css

@@ -15,4 +15,4 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
 */
-@keyframes bpk-keyframe-spin{100%{transform:rotate(1turn)}}.bpk-star{display:inline-block;vertical-align:text-bottom;fill:#b2b2bf}.bpk-star--large{width:1.5rem;height:1.5rem;vertical-align:bottom}.bpk-star--half{position:absolute;left:0}.bpk-star--filled{fill:#ff9400;fill:var(--bpk-star-rating-filled-color, #ff9400)}.bpk-star__container{display:inline-block;width:1.125rem;height:1.125rem}.bpk-star__container--half-star{position:relative;vertical-align:text-bottom}.bpk-star__container--large{width:1.5rem;height:1.5rem;vertical-align:bottom}
+@keyframes bpk-keyframe-spin{100%{transform:rotate(1turn)}}.bpk-star{display:inline-block;vertical-align:text-bottom;fill:rgba(0,0,0,0.2)}.bpk-star--large{width:1.5rem;height:1.5rem;vertical-align:bottom}.bpk-star--half{position:absolute;left:0}.bpk-star--filled{fill:#f55d42;fill:var(--bpk-star-rating-filled-color, #f55d42)}.bpk-star__container{display:inline-block;width:1.125rem;height:1.125rem}.bpk-star__container--half-star{position:relative;vertical-align:text-bottom}.bpk-star__container--large{width:1.5rem;height:1.5rem;vertical-align:bottom}