@telus-uds/components-base 1.83.0 → 1.85.0

package/lib/ExpandCollapse/Panel.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 _Animated = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Animated"));
 var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
 var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
@@ -14,10 +14,9 @@ var _airbnbPropTypes = _interopRequireDefault(require("airbnb-prop-types"));
 var _Control = _interopRequireDefault(require("./Control"));
 var _ThemeProvider = require("../ThemeProvider");
 var _utils = require("../utils");
+var _dictionary = _interopRequireDefault(require("./dictionary"));
 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]);
 
 // just void functions for now, since there are no style tokens for a panel or control at this point
@@ -95,7 +94,7 @@ const selectControlPanelStyles = _ref4 => {
  * The panel does not need to be a direct child of the `<ExpandCollapse>` (unless this is required
  * by the chosen accessibility props for a particular accessibility tools).
  */
-const ExpandCollapsePanel = /*#__PURE__*/(0, _react.forwardRef)((_ref5, ref) => {
+const ExpandCollapsePanel = /*#__PURE__*/_react.default.forwardRef((_ref5, ref) => {
   let {
     openIds = [],
     panelId,
@@ -108,10 +107,15 @@ const ExpandCollapsePanel = /*#__PURE__*/(0, _react.forwardRef)((_ref5, ref) =>
     variant,
     controlRef,
     content,
+    copy = 'en',
     ...rest
   } = _ref5;
-  const [containerHeight, setContainerHeight] = (0, _react.useState)(null);
+  const [containerHeight, setContainerHeight] = _react.default.useState(null);
   const isExpanded = openIds.includes(panelId);
+  const getCopy = (0, _utils.useCopy)({
+    dictionary: _dictionary.default,
+    copy
+  });
   const selectedProps = selectProps({
     ...rest,
     accessibilityState: {
@@ -142,15 +146,20 @@ const ExpandCollapsePanel = /*#__PURE__*/(0, _react.forwardRef)((_ref5, ref) =>
     tokens: themeTokens
   });
   const focusabilityProps = isExpanded ? {} : _utils.a11yProps.nonFocusableProps;
+  const panelAccessibilityLabel = `${panelId} ${getCopy('panel')}`;
+  const subPanelAccessibilityLabel = `${panelId} ${getCopy('subPanel')}`;
   return content ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
     style: selectContentPanelStyles(themeTokens),
+    accessibilityLabel: panelAccessibilityLabel,
     children: typeof children === 'string' ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.default, {
       style: selectTextStyles(themeTokens),
+      accessibilityLabel: subPanelAccessibilityLabel,
       children: children
     }) : children
   }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_View.default, {
     ref: ref,
     style: themeTokens,
+    accessibilityLabel: panelAccessibilityLabel,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
       style: selectControlPanelStyles(themeTokens),
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Control.default, {
@@ -185,6 +194,7 @@ const ExpandCollapsePanel = /*#__PURE__*/(0, _react.forwardRef)((_ref5, ref) =>
         },
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
           style: selectContainerStyles(themeTokens),
+          accessibilityLabel: subPanelAccessibilityLabel,
           children: children
         })
       })

package/lib/ExpandCollapse/dictionary.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _default = {
+  en: {
+    panel: 'Panel',
+    subPanel: 'SubPanel'
+  },
+  fr: {
+    panel: 'Panneau',
+    subPanel: 'Sous-Panneau'
+  }
+};
+exports.default = _default;

package/lib/Feedback/Feedback.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 _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
 var _Text = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Text"));
 var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
@@ -14,8 +14,6 @@ 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; }
 const [selectProps, selectedSystemPropTypes] = (0, _utils.selectSystemProps)([_utils.a11yProps, _utils.viewProps]);
 const selectStyles = tokens => (0, _utils.selectTokens)('Feedback', tokens);
 const selectTitleTextStyles = (_ref, themeOptions) => {
@@ -82,7 +80,7 @@ const selectIconContainerStyles = _ref4 => {
  * ### Accessibility
  * All accessibility props set on this component will be applied to the outer container.
  */
-const Feedback = /*#__PURE__*/(0, _react.forwardRef)((_ref5, ref) => {
+const Feedback = /*#__PURE__*/_react.default.forwardRef((_ref5, ref) => {
   let {
     title,
     children,

package/lib/Fieldset/Fieldset.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 _Feedback = _interopRequireDefault(require("../Feedback"));
 var _utils = require("../utils");
@@ -15,14 +15,12 @@ var _InputLabel = _interopRequireDefault(require("../InputLabel"));
 var _useInputSupports = _interopRequireDefault(require("../InputSupports/useInputSupports"));
 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; }
 /**
  * An alternative to InputSupports for groups of input elements that, on web, are to be
  * wrapped in a `<fieldset>` tag, with label content displated in a `<legend>` tag.
  *
  * Follows the same theming and most of the same props as InputSupports.
- */const Fieldset = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+ */const Fieldset = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     copy = 'en',
     space,

package/lib/Fieldset/FieldsetContainer.js

@@ -4,20 +4,18 @@ 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 _cssReset = _interopRequireDefault(require("./cssReset"));
 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.htmlAttrs]);
 
 /**
  * On Web, wraps children with a HTML `<fieldset>` and sets its attributes as necessary.
  */
-const FieldsetContainer = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+const FieldsetContainer = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     children,
     inactive,

package/lib/Fieldset/FieldsetContainer.native.js

@@ -4,19 +4,17 @@ 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");
 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]);
 
 // No equivalent of `<fieldset>` on native, so just apply accessibility role to container.
 // If a11y testing finds any additional handling is needed at the container level, add it here.
-const FieldsetContainer = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+const FieldsetContainer = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     children,
     accessibilityRole,

package/lib/Fieldset/Legend.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 _propTypes = _interopRequireDefault(require("prop-types"));
 var _cssReset = _interopRequireDefault(require("./cssReset"));
 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; }
 /**
  * On Web, wraps children in HTML `<legend>` tag.
  * On Native, `<legend>` does not exist, wraps in a width 100% block to follow <legend>'s behaviour in a flex.
- */const Legend = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+ */const Legend = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     children
   } = _ref;

package/lib/Fieldset/Legend.native.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 _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
 var _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 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; }
 /**
  * On Web, wraps children in HTML `<legend>` tag.
  * On Native, `<legend>` does not exist, wraps in a width 100% block to follow <legend>'s behaviour in a flex.
- */const Legend = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+ */const Legend = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     children
   } = _ref;

package/lib/FlexGrid/Col/Col.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 _GutterContext = _interopRequireDefault(require("../providers/GutterContext"));
@@ -14,9 +14,7 @@ var _ViewportProvider = require("../../ViewportProvider");
 var _ThemeProvider = require("../../ThemeProvider");
 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 Col = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+const Col = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     horizontalAlign,
     children,
@@ -33,7 +31,7 @@ const Col = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     flex,
     ...viewProps
   } = _ref;
-  const gutter = (0, _react.useContext)(_GutterContext.default);
+  const gutter = _react.default.useContext(_GutterContext.default);
   const viewport = (0, _ViewportProvider.useViewport)();
   const {
     themeOptions: {

package/lib/FlexGrid/FlexGrid.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 _systemConstants = require("@telus-uds/system-constants");
 var _utils = require("../utils");
@@ -16,15 +16,13 @@ var _ThemeProvider = require("../ThemeProvider");
 var _ViewportProvider = require("../ViewportProvider");
 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]);
 
 /**
  * A mobile-first flexbox grid.
  */
 
-const FlexGrid = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+const FlexGrid = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     limitWidth = true,
     gutter = true,

package/lib/FlexGrid/Row/Row.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 _helpers = _interopRequireDefault(require("../helpers"));
 var _utils = require("../../utils");
@@ -12,8 +12,6 @@ var _ThemeProvider = require("../../ThemeProvider");
 var _ViewportProvider = require("../../ViewportProvider");
 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 horizontalAlignStyles = horizontalAlign => {
   switch (horizontalAlign) {
     case 'start':
@@ -67,7 +65,7 @@ const distributeStyles = distribute => {
       return {};
   }
 };
-const Row = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+const Row = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     horizontalAlign,
     verticalAlign,

package/lib/Footnote/Footnote.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 _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
 var _Text = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Text"));
@@ -23,8 +23,6 @@ var _Icon = _interopRequireDefault(require("../Icon"));
 var _OrderedList = _interopRequireDefault(require("../OrderedList"));
 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]);
 const selectFootnoteStyle = _ref => {
   let {
@@ -139,7 +137,7 @@ const selectCustomContentFontStyle = _ref5 => {
  * - When `Footnote` is open, the inert prop must be set on all children of body excluding the Footnote
  * - When `Footnote` is closed, focus must return to the initiating element
  */
-const Footnote = _ref6 => {
+const Footnote = /*#__PURE__*/_react.default.forwardRef((_ref6, ref) => {
   let {
     copy = 'en',
     number = undefined,
@@ -160,10 +158,10 @@ const Footnote = _ref6 => {
     dictionary,
     copy
   });
-  const [isVisible, setIsVisible] = (0, _react.useState)(false);
+  const [isVisible, setIsVisible] = _react.default.useState(false);
   const screenHeight = _Dimensions.default.get('screen').height;
   const screenWidth = _Dimensions.default.get('screen').width;
-  const getFootnoteBodyContent = (0, _react.useCallback)(() => {
+  const getFootnoteBodyContent = _react.default.useCallback(() => {
     if (!number || !content) {
       return null;
     }
@@ -183,12 +181,12 @@ const Footnote = _ref6 => {
       }, number)
     });
   }, [content, number, themeTokens]);
-  (0, _react.useEffect)(() => {
+  _react.default.useEffect(() => {
     if (isOpen) {
       setIsVisible(true);
     }
   }, [isOpen]);
-  const closeFootnote = (0, _react.useCallback)((event, options) => {
+  const closeFootnote = _react.default.useCallback((event, options) => {
     onClose(event, options);
     setIsVisible(false);
   }, [onClose]);
@@ -197,6 +195,7 @@ const Footnote = _ref6 => {
   });
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
     ...selectProps(rest),
+    ref: ref,
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Modal.default, {
       visible: isVisible,
       animationType: "slide",
@@ -247,7 +246,8 @@ const Footnote = _ref6 => {
       })
     })
   });
-};
+});
+Footnote.displayName = 'Footnote';
 const copyShape = _propTypes.default.shape({
   close: _propTypes.default.string.isRequired,
   heading: _propTypes.default.string.isRequired

package/lib/Footnote/FootnoteLink.js

@@ -39,7 +39,7 @@ const selectTextStyle = _ref => {
     })
   };
 };
-const FootnoteLink = _ref2 => {
+const FootnoteLink = /*#__PURE__*/_react.default.forwardRef((_ref2, ref) => {
   let {
     copy = 'en',
     content = [],
@@ -59,7 +59,8 @@ const FootnoteLink = _ref2 => {
     dictionary: _dictionary.default,
     copy
   });
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
+    ref: ref,
     children: numbers.map((num, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
       accessibilityLabel: getCopy('a11yLabel'),
       ref: refs[index],
@@ -77,7 +78,8 @@ const FootnoteLink = _ref2 => {
       })
     }, num))
   });
-};
+});
+FootnoteLink.displayName = 'FootnoteLink';
 const copyShape = _propTypes.default.shape({
   a11yLabel: _propTypes.default.string.isRequired
 });

package/lib/HorizontalScroll/HorizontalScroll.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.selectHorizontalScrollTokens = 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"));
@@ -15,8 +15,6 @@ var _ScrollViewEnd = _interopRequireDefault(require("./ScrollViewEnd"));
 var _itemPositions = require("./itemPositions");
 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 tokenKeys = ['nextIcon', 'previousIcon', 'gutter', 'borderBottomWidth', 'borderBottomColor', 'buttonClearance'];
 const selectHorizontalScrollTokens = (themeTokens, prefix) => (0, _utils.selectTokens)(tokenKeys, themeTokens, prefix);
@@ -28,7 +26,7 @@ const selectHorizontalScrollTokens = (themeTokens, prefix) => (0, _utils.selectT
  * @TODO revisit `ScrollButton` after IconButton is stable.
  */
 exports.selectHorizontalScrollTokens = selectHorizontalScrollTokens;
-const HorizontalScroll = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+const HorizontalScroll = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     ScrollButton,
     tokens,
@@ -48,8 +46,8 @@ const HorizontalScroll = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   (0, _utils.getTokensSetPropType)(tokenKeys, {
     partial: true
   }), 'HorizontalScroll');
-  const [containerWidth, setContainerWidth] = (0, _react.useState)(0);
-  const [contentWidth, setContentWidth] = (0, _react.useState)(0);
+  const [containerWidth, setContainerWidth] = _react.default.useState(0);
+  const [contentWidth, setContentWidth] = _react.default.useState(0);
   const handleContentWidth = width => setContentWidth(width);
   const handleContainerLayout = _ref2 => {
     let {
@@ -64,7 +62,7 @@ const HorizontalScroll = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
 
   // Update the scroll position only when scrolling actions ends to minimally rerender
   // and update which buttons are conditionally rendered.
-  const [scrollOffset, setScrollOffset] = (0, _react.useState)(0);
+  const [scrollOffset, setScrollOffset] = _react.default.useState(0);
   const handleScrollEnd = _ref3 => {
     let {
       nativeEvent: {
@@ -78,7 +76,7 @@ const HorizontalScroll = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   const scrollMax = Math.max(0, contentWidth - containerWidth);
   const showNextButton = scrollOffset < scrollMax;
   const showPreviousButton = scrollOffset > 0;
-  const scrollRef = (0, _react.useRef)(null);
+  const scrollRef = _react.default.useRef(null);
   const scrollTo = targetX => {
     var _scrollRef$current;
     if (typeof ((_scrollRef$current = scrollRef.current) === null || _scrollRef$current === void 0 ? void 0 : _scrollRef$current.scrollTo) === 'function') {
@@ -105,8 +103,8 @@ const HorizontalScroll = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   itemPositions.contentWidth = contentWidth;
   /* eslint-disable-next-line no-param-reassign */
   itemPositions.scrollOffset = scrollOffset;
-  const hasWidths = itemPositions.contentWidth > 0 && itemPositions.contentWidth > 0;
-  (0, _react.useEffect)(() => {
+  const hasWidths = itemPositions.contentWidth > 0;
+  _react.default.useEffect(() => {
     if (hasWidths) itemPositions.setIsReady(true);
     // itemPositions is a ref object so this should occur only when elements' widths are set in state
   }, [hasWidths, itemPositions]);

package/lib/HorizontalScroll/HorizontalScrollButton.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 _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
 var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
@@ -14,8 +14,6 @@ var _IconButton = _interopRequireDefault(require("../IconButton"));
 var _dictionary = _interopRequireDefault(require("./dictionary"));
 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 selectContainerStyles = _ref => {
   let {
     offset
@@ -33,7 +31,7 @@ const selectContainerStyles = _ref => {
  *
  * @TODO when IconButton is complete and stable revisit this and update interaction state styles.
  */
-const HorizontalScrollButton = /*#__PURE__*/(0, _react.forwardRef)((_ref2, ref) => {
+const HorizontalScrollButton = /*#__PURE__*/_react.default.forwardRef((_ref2, ref) => {
   let {
     direction = 'next',
     icon,

package/lib/HorizontalScroll/ScrollViewEnd.js

@@ -4,14 +4,12 @@ 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 _ScrollView = _interopRequireDefault(require("react-native-web/dist/cjs/exports/ScrollView"));
 var _lodash = _interopRequireDefault(require("lodash.debounce"));
 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 DEBOUNCE_MS = 100;
 
 /**
@@ -21,16 +19,16 @@ const DEBOUNCE_MS = 100;
  * so we need to work around it with debouncing on `onScroll`. See:
  * https://github.com/necolas/react-native-web/issues/1021
  */
-const ScrollViewEnd = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+const ScrollViewEnd = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     onScrollEnd,
-    onScroll,
+    onScroll = null,
     ...props
   } = _ref;
   // Return debounced function directly from useCallback so it has .cancel method etc.
   // Linter complains this stops it automatically scanning the deps, but we can check them manually.
   // eslint-disable-next-line react-hooks/exhaustive-deps
-  const debounceScrollEnd = (0, _react.useCallback)((0, _lodash.default)(event => onScrollEnd(event), DEBOUNCE_MS), [onScrollEnd]);
+  const debounceScrollEnd = _react.default.useCallback((0, _lodash.default)(event => onScrollEnd(event), DEBOUNCE_MS), [onScrollEnd]);
 
   // Call any onScroll handler immediately, and any onScrollEnd handler after 100ms of no scrolling
   const handleScroll = event => {
@@ -39,7 +37,7 @@ const ScrollViewEnd = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   };
 
   // Cancel any lingering debounce timeouts on dismount
-  (0, _react.useEffect)(() => debounceScrollEnd.cancel);
+  _react.default.useEffect(() => debounceScrollEnd.cancel);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ScrollView.default, {
     ref: ref,
     ...props,
@@ -52,8 +50,5 @@ ScrollViewEnd.propTypes = {
   onScrollEnd: _propTypes.default.func.isRequired,
   onScroll: _propTypes.default.func
 };
-ScrollViewEnd.defaultProps = {
-  onScroll: null
-};
 var _default = ScrollViewEnd;
 exports.default = _default;

package/lib/HorizontalScroll/ScrollViewEnd.native.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 _ScrollView = _interopRequireDefault(require("react-native-web/dist/cjs/exports/ScrollView"));
 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; }
 /**
  * A wrapper for ScrollView that supports an `onScrollEnd` function.
  *
  * React Native has two scroll end handlers, we want to treat them both the same.
- */const ScrollViewEnd = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+ */const ScrollViewEnd = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   let {
     onScrollEnd,
     ...props