@telus-uds/components-base 1.96.0 → 1.97.1

package/lib/server.js

@@ -1,40 +1,4 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "getComponentTheme", {
-  enumerable: true,
-  get: function () {
-    return _themeTokens.getComponentTheme;
-  }
-});
-Object.defineProperty(exports, "getThemeTokens", {
-  enumerable: true,
-  get: function () {
-    return _themeTokens.getThemeTokens;
-  }
-});
-Object.defineProperty(exports, "getTokensPropType", {
-  enumerable: true,
-  get: function () {
-    return _tokens.getTokensPropType;
-  }
-});
-Object.defineProperty(exports, "htmlAttrs", {
-  enumerable: true,
-  get: function () {
-    return _htmlAttrs.default;
-  }
-});
-Object.defineProperty(exports, "selectSystemProps", {
-  enumerable: true,
-  get: function () {
-    return _selectSystemProps.default;
-  }
-});
-var _selectSystemProps = _interopRequireDefault(require("./utils/props/selectSystemProps"));
-var _tokens = require("./utils/props/tokens");
-var _htmlAttrs = _interopRequireDefault(require("./utils/htmlAttrs"));
-var _themeTokens = require("./ThemeProvider/utils/theme-tokens");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+export { default as selectSystemProps } from './utils/props/selectSystemProps';
+export { getTokensPropType } from './utils/props/tokens';
+export { default as htmlAttrs } from './utils/htmlAttrs';
+export { getComponentTheme, getThemeTokens } from './ThemeProvider/utils/theme-tokens';

package/lib/utils/BaseView/BaseView.js

@@ -1,20 +1,15 @@
-"use strict";
+import React from 'react';
+import NativeView from "react-native-web/dist/exports/View";
+import StyleSheet from "react-native-web/dist/exports/StyleSheet";
+import PropTypes from 'prop-types';
+import { useTheme } from '../../ThemeProvider';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-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 _ThemeProvider = require("../../ThemeProvider");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /**
  * Identical to React Native's View and supporting all the same props, but with:
  *  - a zIndex: 'auto' style added to prevent unexpectedly causing children to overlap other elements from other stacking contexts
- */const BaseView = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+const BaseView = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
     children,
     style,
@@ -22,12 +17,12 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
   } = _ref;
   const {
     themeOptions
-  } = (0, _ThemeProvider.useTheme)();
+  } = useTheme();
   const styleProp = Array.isArray(style) ? [...style] : [style];
   if (!themeOptions.forceZIndex) {
     styleProp.unshift(styles.resetZIndex);
   }
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
+  return /*#__PURE__*/_jsx(NativeView, {
     ...rest,
     style: styleProp,
     ref: ref,
@@ -35,14 +30,13 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
   });
 });
 BaseView.displayName = 'BaseView';
-const styles = _StyleSheet.default.create({
+const styles = StyleSheet.create({
   resetZIndex: {
     zIndex: 'auto'
   }
 });
 BaseView.propTypes = {
-  children: _propTypes.default.node,
-  style: _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.array])
+  children: PropTypes.node,
+  style: PropTypes.oneOfType([PropTypes.object, PropTypes.array])
 };
-var _default = BaseView;
-exports.default = _default;
+export default BaseView;

package/lib/utils/BaseView/BaseView.native.js

@@ -1,13 +1,5 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+import BaseView from "react-native-web/dist/exports/View";
 /**
  * Android crashes on non-standard style properties like `zIndex` so adding a `BaseView` for native platforms
  */
-var _default = _View.default;
-exports.default = _default;
+export default BaseView;

package/lib/utils/BaseView/index.js

@@ -1,10 +1,2 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _BaseView = _interopRequireDefault(require("./BaseView"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-var _default = _BaseView.default;
-exports.default = _default;
+import BaseView from './BaseView';
+export default BaseView;

package/lib/utils/a11y/index.js

@@ -1,27 +1,2 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _textSize = require("./textSize");
-Object.keys(_textSize).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _textSize[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _textSize[key];
-    }
-  });
-});
-var _semantics = require("./semantics");
-Object.keys(_semantics).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _semantics[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _semantics[key];
-    }
-  });
-});
+export * from './textSize';
+export * from './semantics';

package/lib/utils/a11y/semantics.js

@@ -1,15 +1,7 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.textTags = exports.tagsToRoles = exports.supportedTags = exports.layoutTags = exports.headingTags = exports.getHeadingLevel = exports.getA11yPropsFromHtmlTag = void 0;
-var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+import Platform from "react-native-web/dist/exports/Platform";
 /**
  * @typedef {import('react-native').AccessibilityRole} AccessibilityRole
  */
-
 /**
  * This is based on the role-to-tag mapping that React Native Web uses to set HTML tags.
  * It's not exported in any way from RNW, so we need to keep this up-to-date manually.
@@ -29,7 +21,6 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
  * https://github.com/necolas/react-native-web/blob/master/packages/react-native-web/src/modules/AccessibilityUtil/propsToAriaRole.js
  */
 // Adding `/** @type {const} */ ({...})` denotes object content as `readonly` in many IDEs
-// eslint-disable-next-line prettier/prettier
 const rolesToTags = /** @type {const} */{
   article: 'article',
   banner: 'header',
@@ -50,11 +41,10 @@ const rolesToTags = /** @type {const} */{
   strong: 'strong',
   // Add special cases that are in RNW's function logic but not in its mapping object
   label: 'label'
-  // eslint-disable-next-line prettier/prettier
 };
 
 // Invert React Native Web's mapping, so a tag gets the role that gets that tag
-const tagsToRoles = Object.fromEntries(Object.entries(rolesToTags).map(_ref => {
+export const tagsToRoles = Object.fromEntries(Object.entries(rolesToTags).map(_ref => {
   let [key, value] = _ref;
   return [value, key];
 }));
@@ -63,9 +53,7 @@ const tagsToRoles = Object.fromEntries(Object.entries(rolesToTags).map(_ref => {
  * Heading HTML tags map to the "heading" accessibilityRole in native apps, which is similar
  * to headings on web but without the expectation of a hierarchy of headings within one screen.
  */
-// eslint-disable-next-line prettier/prettier
-exports.tagsToRoles = tagsToRoles;
-const headingTags = /** @type {const} */['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
+export const headingTags = /** @type {const} */['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
 /**
  * @typedef {typeof headingTags[number]} HeadingTag
  */
@@ -76,8 +64,7 @@ const headingTags = /** @type {const} */['h1', 'h2', 'h3', 'h4', 'h5', 'h6'];
  *
  * Of these, only headers (h1, h2, ...h5, h6) set a corresponding accessibilityRole in native apps ("heading").
  */
-exports.headingTags = headingTags;
-const supportedTags = [...Object.keys(tagsToRoles), ...headingTags];
+export const supportedTags = [...Object.keys(tagsToRoles), ...headingTags];
 /**
  * Uses readonly mapping keys/values to generate static types for IDEs that support TS in JSDoc.
  * @typedef {keyof rolesToTags} RoleWithTag
@@ -89,11 +76,7 @@ const supportedTags = [...Object.keys(tagsToRoles), ...headingTags];
  *
  * Of these, only headers (h1, h2, ...h5, h6) set a corresponding accessibilityRole in native apps ("heading").
  */
-// eslint-disable-next-line prettier/prettier
-exports.supportedTags = supportedTags;
-const layoutTags = /** @type {const} */[...headingTags, 'article', 'aside', 'blockquote', 'footer', 'figure', 'form', 'header', 'ul', 'li', 'main', 'nav', 'section', 'label'
-// eslint-disable-next-line prettier/prettier
-];
+export const layoutTags = /** @type {const} */[...headingTags, 'article', 'aside', 'blockquote', 'footer', 'figure', 'form', 'header', 'ul', 'li', 'main', 'nav', 'section', 'label'];
 /**
  * @typedef {typeof layoutTags[number]} LayoutTag
  */
@@ -103,11 +86,7 @@ const layoutTags = /** @type {const} */[...headingTags, 'article', 'aside', 'blo
  *
  * Of these, only headers (h1, h2, ...h5, h6) set a corresponding accessibilityRole in native apps ("heading").
  */
-// eslint-disable-next-line prettier/prettier
-exports.layoutTags = layoutTags;
-const textTags = /** @type {const} */[...headingTags, 'blockquote', 'code', 'del', 'em', 'ins', 'li', 'strong', 'label'
-// eslint-disable-next-line prettier/prettier
-];
+export const textTags = /** @type {const} */[...headingTags, 'blockquote', 'code', 'del', 'em', 'ins', 'li', 'strong', 'label'];
 /**
  * @typedef {typeof layoutTags[number]} TextTag
  */
@@ -119,8 +98,7 @@ const textTags = /** @type {const} */[...headingTags, 'blockquote', 'code', 'del
  * @param {string} [tag] - HTML tag string; returns undefined if not a {@link HeadingTag}
  * @returns {'1' | '2' | '3' | '4' | '5' | '6' | undefined}
  */
-exports.textTags = textTags;
-const getHeadingLevel = tag => headingTags.includes(tag) ? Number(tag[1]) : undefined;
+export const getHeadingLevel = tag => headingTags.includes(tag) ? Number(tag[1]) : undefined;
 
 /**
  * Takes a supported HTML tag, and returns the accessibility props that, on web, make React Native Web
@@ -134,15 +112,14 @@ const getHeadingLevel = tag => headingTags.includes(tag) ? Number(tag[1]) : unde
  * @param {AccessibilityRole | null} [nativeRole] - optional accessibilityRole for native apps
  * @returns {{ accessibilityRole: string, accessibilityLevel?: string } | undefined}
  */
-exports.getHeadingLevel = getHeadingLevel;
-const getA11yPropsFromHtmlTag = (tag, nativeRole) => {
+export const getA11yPropsFromHtmlTag = (tag, nativeRole) => {
   // Allow cross-platform apps to set accessibilityRoles alongside a web tag without conflict
-  if (nativeRole !== undefined && _Platform.default.OS !== 'web') return {
+  if (nativeRole !== undefined && Platform.OS !== 'web') return {
     accessibilityRole: nativeRole
   };
   if (tag) {
     // aria roles don't have native counterparts and RN may throw an error if an unrecognised role is passed
-    const ariaRole = _Platform.default.OS === 'web' && tagsToRoles[tag];
+    const ariaRole = Platform.OS === 'web' && tagsToRoles[tag];
     if (ariaRole) return {
       accessibilityRole: ariaRole
     };
@@ -155,5 +132,4 @@ const getA11yPropsFromHtmlTag = (tag, nativeRole) => {
   // If nothing matches or no tag supplied, return undefined and let component decide how to fall back.
   // Note that return value may always be spread in objects (it is safe to spread undefined like { ...undefined })
   return undefined;
-};
-exports.getA11yPropsFromHtmlTag = getA11yPropsFromHtmlTag;
+};

package/lib/utils/a11y/textSize.js

@@ -1,12 +1,5 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.scaleWithText = exports.getMaxFontMultiplier = void 0;
-var _PixelRatio = _interopRequireDefault(require("react-native-web/dist/cjs/exports/PixelRatio"));
-var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+import PixelRatio from "react-native-web/dist/exports/PixelRatio";
+import Platform from "react-native-web/dist/exports/Platform";
 /**
  * When a user increases text size using device accessibility settings, some elements
  * should also scale, such as icons alongside text and space between paragraphs.
@@ -14,10 +7,10 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
  * @param {number} [value] - the value to multiply; defaults to system default font size
  * @param {number} [maxScale] - the maximum multiplier to apply; defaults to no maximum
  */
-const scaleWithText = function (value) {
+export const scaleWithText = function (value) {
   let maxScale = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : Infinity;
   if (!value) return value;
-  const scale = Math.min(_PixelRatio.default.getFontScale(), maxScale) || 1;
+  const scale = Math.min(PixelRatio.getFontScale(), maxScale) || 1;
   return value * scale;
 };
 
@@ -31,14 +24,12 @@ const scaleWithText = function (value) {
  * The return value of this function can be used as a React Native `Text` element's
  * `maxFontSizeMultiplier` prop value.
  */
-exports.scaleWithText = scaleWithText;
-const getMaxFontMultiplier = _ref => {
+export const getMaxFontMultiplier = _ref => {
   let {
     fontSize,
     fontScaleCap
   } = _ref;
-  if (_Platform.default.OS === 'web' || !fontScaleCap || !fontSize) return undefined;
+  if (Platform.OS === 'web' || !fontScaleCap || !fontSize) return undefined;
   if (fontScaleCap <= fontSize) return 1;
   return fontScaleCap / fontSize;
-};
-exports.getMaxFontMultiplier = getMaxFontMultiplier;
+};

package/lib/utils/animation/index.js

@@ -1,13 +1,2 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "useVerticalExpandAnimation", {
-  enumerable: true,
-  get: function () {
-    return _useVerticalExpandAnimation.default;
-  }
-});
-var _useVerticalExpandAnimation = _interopRequireDefault(require("./useVerticalExpandAnimation"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+/* eslint-disable import/prefer-default-export */
+export { default as useVerticalExpandAnimation } from './useVerticalExpandAnimation';

package/lib/utils/animation/useVerticalExpandAnimation.js

@@ -1,15 +1,9 @@
-"use strict";
+import { useEffect, useRef, useState } from 'react';
+import Animated from "react-native-web/dist/exports/Animated";
+import Easing from "react-native-web/dist/exports/Easing";
+import Platform from "react-native-web/dist/exports/Platform";
+import useSafeLayoutEffect from '../useSafeLayoutEffect';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = require("react");
-var _Animated = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Animated"));
-var _Easing = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Easing"));
-var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
-var _useSafeLayoutEffect = _interopRequireDefault(require("../useSafeLayoutEffect"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 // TODO: systematise animations
 // https://github.com/telus/universal-design-system/issues/487
 function useVerticalExpandAnimation(_ref) {
@@ -18,24 +12,24 @@ function useVerticalExpandAnimation(_ref) {
     isExpanded,
     tokens
   } = _ref;
-  const [isAnimating, setIsAnimating] = (0, _react.useState)(false);
-  const [wasExpanded, setWasExpanded] = (0, _react.useState)(isExpanded);
+  const [isAnimating, setIsAnimating] = useState(false);
+  const [wasExpanded, setWasExpanded] = useState(isExpanded);
   const expandStateChanged = isExpanded !== wasExpanded;
-  const expandAnimatedValue = (0, _react.useRef)(new _Animated.default.Value(0)).current;
-  const elementRef = (0, _react.useRef)(null);
+  const expandAnimatedValue = useRef(new Animated.Value(0)).current;
+  const elementRef = useRef(null);
   const {
     expandDuration,
     collapseDuration
   } = tokens;
-  (0, _useSafeLayoutEffect.default)(() => {
+  useSafeLayoutEffect(() => {
     if (expandStateChanged) {
       setIsAnimating(true);
       setWasExpanded(isExpanded);
     }
   }, [expandStateChanged, isExpanded]);
-  (0, _react.useEffect)(() => {
+  useEffect(() => {
     const onComplete = () => setIsAnimating(false);
-    if (_Platform.default.OS === 'web') {
+    if (Platform.OS === 'web') {
       if (!elementRef.current) return () => {};
 
       // React Native Web does not pass `onTransitionEnd` through, must attach manually.
@@ -46,18 +40,18 @@ function useVerticalExpandAnimation(_ref) {
     }
     const animationConfig = {
       duration: isExpanded ? expandDuration : collapseDuration,
-      easing: _Easing.default.inOut(_Easing.default.ease),
+      easing: Easing.inOut(Easing.ease),
       toValue: isExpanded ? containerHeight : 0,
       useNativeDriver: false
     };
-    const animation = _Animated.default.timing(expandAnimatedValue, animationConfig);
+    const animation = Animated.timing(expandAnimatedValue, animationConfig);
     animation.start(onComplete);
     return () => animation.stop();
   }, [isExpanded, expandAnimatedValue, containerHeight, expandDuration, collapseDuration]);
   const containerStyles = {};
   if (isAnimating || expandStateChanged) containerStyles.overflow = 'hidden';
   if (!isExpanded && !isAnimating && !expandStateChanged) {
-    if (_Platform.default.OS === 'web') {
+    if (Platform.OS === 'web') {
       // Without `display: 'none', descendents are focusable on web even when collapsed.
       containerStyles.display = 'none';
     } else {
@@ -69,17 +63,17 @@ function useVerticalExpandAnimation(_ref) {
 
   // don't visually collapse the container until we have it measured
   if (containerHeight === null) {
-    if (_Platform.default.OS === 'web') {
+    if (Platform.OS === 'web') {
       // on web we can hide the contents until we have the container measured and avoid occasional jitter
       // this won't work on native platforms
       containerStyles.height = 0;
       containerStyles.display = 'none';
     }
-  } else if (_Platform.default.OS === 'web') {
+  } else if (Platform.OS === 'web') {
     const transitionDuration = isExpanded ? expandDuration : collapseDuration;
     containerStyles.transition = `height ${transitionDuration}ms ease-in-out`;
     containerStyles.height = isExpanded ? containerHeight : 0;
-  } else if (_Platform.default.OS === 'ios' && isExpanded && !isAnimating && !expandStateChanged && typeof containerHeight === 'number') {
+  } else if (Platform.OS === 'ios' && isExpanded && !isAnimating && !expandStateChanged && typeof containerHeight === 'number') {
     // iOS reflows text while the height animation is in progress. Sometimes, it hits a timing bug where
     // it fails to reflow properly after the last animation frame, leaving the last line of text not visible.
     // Force reflow after animation completes with a static height non-identical to the last animated height.
@@ -89,5 +83,4 @@ function useVerticalExpandAnimation(_ref) {
   }
   return [containerStyles, elementRef];
 }
-var _default = useVerticalExpandAnimation;
-exports.default = _default;
+export default useVerticalExpandAnimation;

package/lib/utils/children.js

@@ -1,14 +1,7 @@
-"use strict";
+import React from 'react';
+import Text from "react-native-web/dist/exports/Text";
+import A11yText from '../A11yText';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.wrapStringsInText = exports.unpackFragment = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _Text = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Text"));
-var _A11yText = _interopRequireDefault(require("../A11yText"));
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /**
  * Unpacks top-level fragments, so that common compositional patterns such as the following examples
  * can be iterated as flat siblings (as if they were `<Child1 /><Child2 /><Child3 />`):
@@ -41,23 +34,23 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
  * @param {ReactChildren} child
  * @returns {ReactChildren}
  */
-const unpackFragment = child => {
+import { jsx as _jsx } from "react/jsx-runtime";
+export const unpackFragment = child => {
   var _child$props;
   // If this level is a set of top-level siblings rather than one child, check each in turn
-  if (_react.default.Children.count(child) > 1) return _react.default.Children.map(child, unpackFragment);
+  if (React.Children.count(child) > 1) return React.Children.map(child, unpackFragment);
 
   // When a fragment is found, unpack its children to the top level and check them
-  if ((child === null || child === void 0 ? void 0 : child.type) === _react.default.Fragment) return unpackFragment((_child$props = child.props) === null || _child$props === void 0 ? void 0 : _child$props.children);
+  if ((child === null || child === void 0 ? void 0 : child.type) === React.Fragment) return unpackFragment((_child$props = child.props) === null || _child$props === void 0 ? void 0 : _child$props.children);
 
   // Stop unpacking as soon as any non-fragment child is found
   return child;
 };
-exports.unpackFragment = unpackFragment;
 const isStringOrNumber = child => typeof child === 'string' || typeof child === 'number';
 // Wrap an A11yText with neighouring text strings so it doesn't split them into multiple <Text>s
 const isWrapable = child => {
   var _child$type;
-  return isStringOrNumber(child) || child.type === _A11yText.default || ((_child$type = child.type) === null || _child$type === void 0 ? void 0 : _child$type.name) === 'FootnoteLink';
+  return isStringOrNumber(child) || child.type === A11yText || ((_child$type = child.type) === null || _child$type === void 0 ? void 0 : _child$type.name) === 'FootnoteLink';
 };
 const combineKeys = childrenArray => childrenArray.reduce((newKey, child) => `${newKey}${child.key || ''}`, '');
 
@@ -89,9 +82,9 @@ const wrapChild = (child, wrappedText) => {
  * @param {TextProps} props
  * @returns {ReactChildren}
  */
-const wrapStringsInText = function (children) {
+export const wrapStringsInText = function (children) {
   let textProps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-  const childrenArray = unpackFragment(_react.default.Children.toArray(children));
+  const childrenArray = unpackFragment(React.Children.toArray(children));
 
   // Group adjacent wrapable children together in one Text element to create as few Text elements
   // as possible, e.g. give <X>Text {someString}</X> one Text, same as <X>{`Text ${someString}`}</X>
@@ -115,11 +108,10 @@ const wrapStringsInText = function (children) {
     // Wrap text nodes and their wrappable neighbours in Text with as stable a key as possible.
     // Avoid one-item arrays because jest-native's `.toHaveTextContent` is buggy
     // and sometimes fails to match text content in arrays.
-    (0, _jsxRuntime.jsx)(_Text.default, {
+    _jsx(Text, {
       ...textProps,
       children: group.length === 1 ? group[0] : group
     }, combineKeys(group) || index) : group];
   }, []);
   return items.length === 1 ? items[0] : items;
-};
-exports.wrapStringsInText = wrapStringsInText;
+};

package/lib/utils/containUniqueFields.js

@@ -1,9 +1,3 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
 // Returns true if there are no duplicate values of the fields listed
 // in the `fields` array across the objects in the `items` array, false
 // otherwise.
@@ -27,5 +21,4 @@ const containUniqueFields = (items, fields) => {
   }));
   return !itemsHaveDuplicateFields;
 };
-var _default = containUniqueFields;
-exports.default = _default;
+export default containUniqueFields;

package/lib/utils/convertFromMegaByteToByte.js

@@ -1,9 +1,3 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = convertFromMegaByteToByte;
 /**
  * Converts a value from megabytes to bytes.
  *
@@ -11,6 +5,6 @@ exports.default = convertFromMegaByteToByte;
  * @returns {number} The converted value in bytes.
  */
 const BYTES_IN_A_MEGABYTE = 1024 * 1024;
-function convertFromMegaByteToByte(megaByte) {
+export default function convertFromMegaByteToByte(megaByte) {
   return megaByte * BYTES_IN_A_MEGABYTE;
 }

package/lib/utils/floating-ui/index.js

@@ -1,42 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "arrow", {
-  enumerable: true,
-  get: function () {
-    return _reactDom.arrow;
-  }
-});
-Object.defineProperty(exports, "autoPlacement", {
-  enumerable: true,
-  get: function () {
-    return _reactDom.autoPlacement;
-  }
-});
-Object.defineProperty(exports, "flip", {
-  enumerable: true,
-  get: function () {
-    return _reactDom.flip;
-  }
-});
-Object.defineProperty(exports, "offset", {
-  enumerable: true,
-  get: function () {
-    return _reactDom.offset;
-  }
-});
-Object.defineProperty(exports, "shift", {
-  enumerable: true,
-  get: function () {
-    return _reactDom.shift;
-  }
-});
-Object.defineProperty(exports, "useFloating", {
-  enumerable: true,
-  get: function () {
-    return _reactDom.useFloating;
-  }
-});
-var _reactDom = require("@floating-ui/react-dom");
+export { useFloating, arrow, offset, shift, flip, autoPlacement } from '@floating-ui/react-dom';

package/lib/utils/floating-ui/index.native.js

@@ -1,42 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "arrow", {
-  enumerable: true,
-  get: function () {
-    return _reactNative.arrow;
-  }
-});
-Object.defineProperty(exports, "autoPlacement", {
-  enumerable: true,
-  get: function () {
-    return _reactNative.autoPlacement;
-  }
-});
-Object.defineProperty(exports, "flip", {
-  enumerable: true,
-  get: function () {
-    return _reactNative.flip;
-  }
-});
-Object.defineProperty(exports, "offset", {
-  enumerable: true,
-  get: function () {
-    return _reactNative.offset;
-  }
-});
-Object.defineProperty(exports, "shift", {
-  enumerable: true,
-  get: function () {
-    return _reactNative.shift;
-  }
-});
-Object.defineProperty(exports, "useFloating", {
-  enumerable: true,
-  get: function () {
-    return _reactNative.useFloating;
-  }
-});
-var _reactNative = require("@floating-ui/react-native");
+export { useFloating, arrow, offset, shift, flip, autoPlacement } from '@floating-ui/react-native';