@telus-uds/components-base 1.83.0 → 1.85.0

package/lib/OrderedList/OrderedList.js

@@ -4,24 +4,22 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _utils = require("../utils");
 var _OrderedListBase = _interopRequireDefault(require("./OrderedListBase"));
 var _Item = _interopRequireDefault(require("./Item"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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; }
 const [selectProps, selectedSystemPropsTypes] = (0, _utils.selectSystemProps)([_utils.htmlAttrs, _utils.viewProps]);
-const OrderedList = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+const OrderedList = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     children,
-    start,
-    variant,
+    start = 1,
+    variant = {},
     ...rest
   } = _ref;
-  const childrenWithParentVariants = (0, _react.useMemo)(() => {
+  const childrenWithParentVariants = _react.default.useMemo(() => {
     const addVariantToProps = (child, i, isLastChild) => {
       var _child$props;
       const existingChildVariants = ((_child$props = child.props) === null || _child$props === void 0 ? void 0 : _child$props.variant) ?? {};
@@ -50,7 +48,6 @@ const OrderedList = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
 });
 OrderedList.propTypes = {
   ...selectedSystemPropsTypes,
-  tokens: (0, _utils.getTokensPropType)('OrderedList'),
   /**
    * A list of ordered items wrapped in `OrderedList.Item`.
    */
@@ -61,11 +58,6 @@ OrderedList.propTypes = {
   start: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
   variant: _utils.variantProp.propType
 };
-OrderedList.defaultProps = {
-  start: 1,
-  tokens: {},
-  variant: {}
-};
 OrderedList.displayName = 'OrderedList';
 OrderedList.Item = _Item.default;
 var _default = OrderedList;

package/lib/OrderedList/OrderedListBase.js

@@ -4,18 +4,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
 var _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
 var _ItemBase = _interopRequireDefault(require("./ItemBase"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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; }
 /* eslint-disable react-native-a11y/has-valid-accessibility-role */
 
-const OrderedListBase = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+const OrderedListBase = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     children,
     ...rest

package/lib/Pagination/PageButton.js

@@ -14,7 +14,7 @@ var _dictionary = _interopRequireDefault(require("./dictionary"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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; }
-const PageButton = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+const PageButton = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     label,
     onPress,

package/lib/Pagination/Pagination.js

@@ -37,7 +37,7 @@ const selectTextStyles = (_ref, themeOptions) => {
     themeOptions
   });
 };
-const Pagination = /*#__PURE__*/(0, _react.forwardRef)((_ref2, ref) => {
+const Pagination = /*#__PURE__*/_react.default.forwardRef((_ref2, ref) => {
   let {
     children,
     copy = 'en',

package/lib/Pagination/SideButton.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _Text = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Text"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _ButtonBase = _interopRequireDefault(require("../Button/ButtonBase"));
@@ -16,8 +16,6 @@ var _dictionary = _interopRequireDefault(require("./dictionary"));
 var _useCopy = _interopRequireDefault(require("../utils/useCopy"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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; }
 // We need to drop the icon here since it gets rendered via children and not
 // `ButtonBase` in order to tap into the state of the button; `displayLabel` flag
 // is also not needed
@@ -45,7 +43,7 @@ const directionToSide = {
   previous: 'left',
   next: 'right'
 };
-const SideButton = /*#__PURE__*/(0, _react.forwardRef)((_ref3, ref) => {
+const SideButton = /*#__PURE__*/_react.default.forwardRef((_ref3, ref) => {
   let {
     direction = 'previous',
     onPress,

package/lib/PriceLockup/PriceLockup.js

@@ -92,7 +92,7 @@ const selectBottomTextTypographyTokens = _ref6 => {
     lineHeight: bottomTextLineHeight
   };
 };
-const PriceLockup = _ref7 => {
+const PriceLockup = /*#__PURE__*/_react.default.forwardRef((_ref7, ref) => {
   let {
     size = 'medium',
     signDirection = 'left',
@@ -134,9 +134,9 @@ const PriceLockup = _ref7 => {
   const topTextTypographyTokens = selectTopTextTypographyTokens(themeTokens);
   const bottomTextTypographyTokens = selectBottomTextTypographyTokens(themeTokens);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_View.default, {
-    style: [staticStyles.priceLockupContainer, {
-      ...selectProps(rest)
-    }],
+    style: [staticStyles.priceLockupContainer],
+    ref: ref,
+    ...selectProps(rest),
     children: [topText ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
       style: staticStyles.topText,
       children: (0, _renderTypography.default)(topText, topTextTypographyTokens)
@@ -150,7 +150,7 @@ const PriceLockup = _ref7 => {
       }), (0, _renderFootnoteContent.default)(footnoteMarginTop, bottomTextMarginTop, bottomText, bottomTextTypographyTokens, fontColor, footnoteLinks, bottomLinksMarginLeft, onClickFootnote, themeTokens)]
     }) : null]
   });
-};
+});
 PriceLockup.displayName = 'PriceLockup';
 PriceLockup.propTypes = {
   ...selectedSystemPropTypes,

package/lib/ProductCard/ProductCard.js

@@ -41,7 +41,7 @@ const selectProductCardTokens = _ref => {
     paddingVertical
   };
 };
-const ProductCard = _ref2 => {
+const ProductCard = /*#__PURE__*/_react.default.forwardRef((_ref2, ref) => {
   var _getCopy;
   let {
     copy = 'en',
@@ -108,6 +108,7 @@ const ProductCard = _ref2 => {
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_View.default, {
     ...selectProps(rest),
     style: [selectProductCardTokens(themeTokens), staticStyles.container],
+    ref: ref,
     children: [image !== null && image !== void 0 && image.src ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
       style: staticStyles.imageContainer,
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Image.default, {
@@ -179,7 +180,7 @@ const ProductCard = _ref2 => {
       })
     })]
   });
-};
+});
 ProductCard.displayName = 'ProductCard';
 
 // If a language dictionary entry is provided, it must contain every key

package/lib/ProductCardGroup/ProductCardGroup.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
 var _utils = require("../utils");
@@ -12,16 +12,14 @@ var _ProductCard = _interopRequireDefault(require("../ProductCard"));
 var _StackView = require("../StackView");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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; }
 const [selectProps, selectedSystemPropTypes] = (0, _utils.selectSystemProps)([_utils.htmlAttrs, _utils.viewProps, _utils.a11yProps]);
-const ProductCardGroup = _ref => {
+const ProductCardGroup = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     productCards,
     maxSelection = 1,
     ...rest
   } = _ref;
-  const [selectedCardIds, setSelectedCardIds] = (0, _react.useState)([]);
+  const [selectedCardIds, setSelectedCardIds] = _react.default.useState([]);
   const handleSelect = id => {
     const isAlreadySelected = selectedCardIds.includes(id);
     let updatedSelectedCardIds;
@@ -36,6 +34,7 @@ const ProductCardGroup = _ref => {
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
     ...selectProps(rest),
+    ref: ref,
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_StackView.StackWrap, {
       direction: {
         xs: 'column',
@@ -55,7 +54,7 @@ const ProductCardGroup = _ref => {
       })
     })
   });
-};
+});
 ProductCardGroup.displayName = 'ProductCardGroup';
 ProductCardGroup.propTypes = {
   ...selectedSystemPropTypes,

package/lib/Progress/Progress.js

@@ -4,15 +4,13 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
 var _ThemeProvider = require("../ThemeProvider");
 var _utils = require("../utils");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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; }
 const [selectProps, selectedSystemPropTypes] = (0, _utils.selectSystemProps)([_utils.a11yProps, _utils.viewProps]);
 const selectProgressStyles = _ref => {
   let {
@@ -60,7 +58,7 @@ const selectProgressStyles = _ref => {
  * role.
  *
  */
-const Progress = /*#__PURE__*/(0, _react.forwardRef)((_ref2, ref) => {
+const Progress = /*#__PURE__*/_react.default.forwardRef((_ref2, ref) => {
   let {
     children,
     tokens,

package/lib/Progress/ProgressBar.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
 var _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
@@ -14,8 +14,6 @@ var _ThemeProvider = require("../ThemeProvider");
 var _utils = require("../utils");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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; }
 const [selectProps, selectedSystemPropTypes] = (0, _utils.selectSystemProps)([_utils.a11yProps, _utils.viewProps]);
 const selectBarStyles = (_ref, percentage) => {
   let {
@@ -67,7 +65,7 @@ const selectBarStyles = (_ref, percentage) => {
  * - `accessibilityValue.text` (`aria-valuetext`): `%{percentage}%`,
  *
  */
-const ProgressBar = /*#__PURE__*/(0, _react.forwardRef)((_ref2, ref) => {
+const ProgressBar = /*#__PURE__*/_react.default.forwardRef((_ref2, ref) => {
   let {
     children = null,
     percentage = 0,

package/lib/Progress/ProgressBarBackground.js

@@ -4,17 +4,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _ImageBackground = _interopRequireDefault(require("react-native-web/dist/cjs/exports/ImageBackground"));
 var _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
 var _utils = require("../utils");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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; }
 const inactiveBackground = `%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='24'%3E%3Cdefs%3E%3Cpattern id='inactive' patternUnits='userSpaceOnUse' width='8' height='8'%3E%3Crect width='8' height='8' fill='rgba(255, 255, 255, 0)'%3E%3C/rect%3E%3Ccircle cx='4' cy='4' r='2' fill='rgba(0, 0, 0, 0.4)' stroke='rgba(0, 0, 0, 0.4)' stroke-width='0'%3E%3C/circle%3E%3Ccircle cx='0' cy='0' r='2' fill='rgba(0, 0, 0, 0.4)' stroke='rgba(0, 0, 0, 0.4)' stroke-width='0'%3E%3C/circle%3E%3Ccircle cx='0' cy='8' r='2' fill='rgba(0, 0, 0, 0.4)' stroke='rgba(0, 0, 0, 0.4)' stroke-width='0'%3E%3C/circle%3E%3Ccircle cx='8' cy='0' r='2' fill='rgba(0, 0, 0, 0.4)' stroke='rgba(0, 0, 0, 0.4)' stroke-width='0'%3E%3C/circle%3E%3Ccircle cx='8' cy='8' r='2' fill='rgba(0, 0, 0, 0.4)' stroke='rgba(0, 0, 0, 0.4)' stroke-width='0'%3E%3C/circle%3E%3C/pattern%3E%3C/defs%3E%3Cpath d='M 0 0 L 0 140 L 2000 2000 L 2000 0 Z' style='fill: url("%23inactive");'%3E%3C/path%3E%3C/svg%3E`;
 const negativeBackground = `%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='24'%3E%3Cdefs%3E%3Cpattern id='negative' patternUnits='userSpaceOnUse' width='8' height='8'%3E%3Crect width='8' height='8' fill='rgba(255, 255, 255, 0)'%3E%3C/rect%3E%3Cpath d='M 0,8 l 8,-8 M -2,2 l 4,-4 M 6,10 l 4,-4' stroke-width='1' shape-rendering='auto' stroke='rgba(255, 255, 255, 0.4)' stroke-linecap='square'%3E%3C/path%3E%3C/pattern%3E%3C/defs%3E%3Cpath d='M 0 0 L 0 140 L 2000 2000 L 2000 0 Z' style='fill: url("%23negative");'%3E%3C/path%3E%3C/svg%3E`;
-const ProgressBarBackground = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+const ProgressBarBackground = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     variant
   } = _ref;

package/lib/QuickLinks/QuickLinks.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _ThemeProvider = require("../ThemeProvider");
 var _ViewportProvider = require("../ViewportProvider");
@@ -14,14 +14,12 @@ var _StackWrap = _interopRequireDefault(require("../StackView/StackWrap"));
 var _QuickLinksCard = _interopRequireDefault(require("./QuickLinksCard"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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; }
 /**
  * QuickLinks renders a list of interactive items. How it renders these items depends on theme options:
  *  - If the theme returns `list` token as true, it renders an ordered list based on List
  *  - If the theme returns `button` token as true and `list` as false, it renders a wrapping horizontal bar of buttons
  *  - If the theme returns `card` token as true, it wraps the above with a `Card`.
- */const QuickLinks = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+ */const QuickLinks = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     tokens,
     variant,

package/lib/QuickLinks/QuickLinksCard.js

@@ -16,7 +16,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
  *
  * Restyled Card with identical behaviour to Card, but themed according to the
  * QuickLinksCard theme rather than the Card theme.
- */const QuickLinksList = _ref => {
+ */const QuickLinksList = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     tokens,
     variant,
@@ -25,9 +25,11 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
   const themeTokens = (0, _ThemeProvider.useThemeTokens)('QuickLinksCard', tokens, variant);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_CardBase.default, {
     tokens: themeTokens,
+    ref: ref,
     children: children
   });
-};
+});
+QuickLinksList.displayName = 'QuickLinksList';
 QuickLinksList.propTypes = {
   tokens: (0, _utils.getTokensPropType)('QuickLinksCard'),
   variant: _utils.variantProp.propType,

package/lib/QuickLinks/QuickLinksItem.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _utils = require("../utils");
 var _ViewportProvider = require("../ViewportProvider");
@@ -13,13 +13,11 @@ var _PressableListItemBase = _interopRequireDefault(require("../List/PressableLi
 var _ButtonBase = _interopRequireDefault(require("../Button/ButtonBase"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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; }
 /**
  * Public component exported as QuickLinks.Item, for use as children of QuickLinks.
  *
  * Receives props injected by QuickLinks and renders the appropriate child component.
- */const QuickLinksItem = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+ */const QuickLinksItem = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     tokens,
     variant,

package/lib/QuickLinksFeature/QuickLinksFeature.js

@@ -4,15 +4,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _StackView = require("../StackView");
+var _ViewportProvider = require("../ViewportProvider");
 var _ThemeProvider = require("../ThemeProvider");
 var _utils = require("../utils");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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; }
 // pass through and type relevant system props - add more sets for interactive components
 const [selectProps, selectedSystemPropTypes] = (0, _utils.selectSystemProps)([_utils.a11yProps, _utils.viewProps]);
 const isQuickListItem = element => {
@@ -25,7 +24,7 @@ const isQuickListItem = element => {
  * QuickLinksFeature renders a list of interactive items.
  *  - This is the base component that is used as a wrapper and accepts a List of `QuickLinksFeature.Item`
  */
-const QuickLinksFeature = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+const QuickLinksFeature = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     tokens,
     variant,
@@ -33,14 +32,17 @@ const QuickLinksFeature = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     children,
     ...rest
   } = _ref;
+  const viewport = (0, _ViewportProvider.useViewport)();
   const {
     stackGap,
     stackJustify,
     stackSpace
-  } = (0, _ThemeProvider.useThemeTokens)('QuickLinksFeature', tokens, variant);
-  const items = _react.Children.map(children, child => {
+  } = (0, _ThemeProvider.useThemeTokens)('QuickLinksFeature', tokens, variant, {
+    viewport
+  });
+  const items = _react.default.Children.map(children, child => {
     if (isQuickListItem(child)) {
-      return /*#__PURE__*/(0, _react.cloneElement)(child, child.props);
+      return /*#__PURE__*/_react.default.cloneElement(child, child.props);
     }
     return null;
   });

package/lib/QuickLinksFeature/QuickLinksFeatureItem.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _Image = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Image"));
 var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
@@ -17,8 +17,6 @@ var _Link = require("../Link");
 var _StackView = require("../StackView");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-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; }
 // pass through and type relevant system props - add more sets for interactive components
 const [selectProps, selectedSystemPropTypes] = (0, _utils.selectSystemProps)([_utils.a11yProps, _utils.linkProps]);
 const selectImageStyle = imageDimension => ({
@@ -63,7 +61,7 @@ const selectLinkToken = _ref2 => {
  *
  * It will receive a image source and a accessibility label and will render a link accordingly with the theme tokens
  */
-const QuickLinksFeatureItem = /*#__PURE__*/(0, _react.forwardRef)((_ref3, ref) => {
+const QuickLinksFeatureItem = /*#__PURE__*/_react.default.forwardRef((_ref3, ref) => {
   let {
     tokens,
     variant,
@@ -108,25 +106,25 @@ const QuickLinksFeatureItem = /*#__PURE__*/(0, _react.forwardRef)((_ref3, ref) =
           ...themeTokens,
           contentMaxDimension
         }),
-        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_StackView.StackWrap, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_StackView.StackWrap, {
           direction: contentDirection,
           space: contentSpace,
           gap: gap,
           tokens: {
             alignItems: contentAlignItems
           },
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
+          children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_View.default, {
             style: selectImageContainerStyle(contentMaxDimension),
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Image.default, {
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Image.default, {
               accessibilityIgnoresInvertColors: true,
               imageAccessibilityLabel: imageAccessibilityLabel,
               source: imageSource,
               style: selectImageStyle(imageDimension)
-            })
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.default, {
-            style: textStyle,
-            children: children
-          })]
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.default, {
+              style: textStyle,
+              children: children
+            })]
+          })
         })
       });
     }

package/lib/Radio/Radio.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _Pressable = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Pressable"));
 var _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
@@ -16,9 +16,9 @@ var _ThemeProvider = require("../ThemeProvider");
 var _utils = require("../utils");
 var _StackView = _interopRequireDefault(require("../StackView"));
 var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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 }; }
 const [selectProps, selectedSystemPropTypes] = (0, _utils.selectSystemProps)([_utils.a11yProps, _utils.focusHandlerProps, _utils.viewProps]);
 const selectContainerStyles = _ref => {
   let {
@@ -116,7 +116,7 @@ const selectLabelStyles = _ref3 => {
  * or the internal state in case of uncontrolled radio button.
  *
  */
-const Radio = /*#__PURE__*/(0, _react.forwardRef)((_ref4, ref) => {
+const Radio = /*#__PURE__*/_react.default.forwardRef((_ref4, ref) => {
   let {
     checked,
     defaultChecked,