@telus-uds/components-base 2.0.0 → 2.0.2

package/lib/server.js

@@ -0,0 +1,4 @@
+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,33 +1,15 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _react = _interopRequireWildcard(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 }; }
-
-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; }
+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';
 
 /**
  * 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__*/(0, _react.forwardRef)((_ref, ref) => {
+import { jsx as _jsx } from "react/jsx-runtime";
+const BaseView = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
     children,
     style,
@@ -35,30 +17,26 @@ const BaseView = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   } = _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, { ...rest,
+  return /*#__PURE__*/_jsx(NativeView, {
+    ...rest,
     style: styleProp,
     ref: ref,
     children: children
   });
 });
 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,16 +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,13 +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,31 +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,18 +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.
@@ -32,10 +21,7 @@ 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} */
-{
+const rolesToTags = /** @type {const} */{
   article: 'article',
   banner: 'header',
   blockquote: 'blockquote',
@@ -54,24 +40,20 @@ const rolesToTags =
   region: 'section',
   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
+  label: 'label'
+};
 
-const tagsToRoles = Object.fromEntries(Object.entries(rolesToTags).map(_ref => {
+// Invert React Native Web's mapping, so a tag gets the role that gets that tag
+export const tagsToRoles = Object.fromEntries(Object.entries(rolesToTags).map(_ref => {
   let [key, value] = _ref;
   return [value, key];
 }));
+
 /**
  * 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
  */
@@ -82,9 +64,7 @@ const headingTags =
  *
  * 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
@@ -96,13 +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
  */
@@ -112,13 +86,7 @@ const layoutTags =
  *
  * 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
  */
@@ -130,10 +98,8 @@ const textTags =
  * @param {string} [tag] - HTML tag string; returns undefined if not a {@link HeadingTag}
  * @returns {'1' | '2' | '3' | '4' | '5' | '6' | undefined}
  */
+export const getHeadingLevel = tag => headingTags.includes(tag) ? Number(tag[1]) : undefined;
 
-exports.textTags = textTags;
-
-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
  * render that tag.
@@ -146,19 +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
     };
@@ -167,11 +128,8 @@ const getA11yPropsFromHtmlTag = (tag, nativeRole) => {
       accessibilityRole: 'header',
       accessibilityLevel
     };
-  } // If nothing matches or no tag supplied, return undefined and let component decide how to fall back.
+  }
+  // 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,16 +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.
@@ -18,12 +7,13 @@ 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;
 };
+
 /**
  * Native only, returns `undefined` on Web.
  *
@@ -34,18 +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,15 +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,21 +1,8 @@
-"use strict";
-
-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 }; }
+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';
 
 // TODO: systematise animations
 // https://github.com/telus/universal-design-system/issues/487
@@ -25,72 +12,68 @@ 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.OS === 'web') {
+      if (!elementRef.current) return () => {};
 
-    if (_Platform.default.OS === 'web') {
-      if (!elementRef.current) return () => {}; // React Native Web does not pass `onTransitionEnd` through, must attach manually.
+      // React Native Web does not pass `onTransitionEnd` through, must attach manually.
       // https://github.com/necolas/react-native-web/pull/1713
-
       const element = elementRef.current;
       element.addEventListener('transitionend', onComplete);
       return () => element.removeEventListener('transitionend', onComplete);
     }
-
     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') {
-      // Without `visibility: 'hidden', descendents are focusable on web even when collapsed.
-      containerStyles.visibility = 'hidden';
+    if (Platform.OS === 'web') {
+      // Without `display: 'none', descendents are focusable on web even when collapsed.
+      containerStyles.display = 'none';
     } else {
       // There's no `visibility: hidden` in React Native, and display: none causes a flicker on expand.
       // Without some form of hiding, some children leak through even when closed e.g. `List.Item` bullets.
       containerStyles.opacity = 0;
     }
-  } // don't visually collapse the container until we have it measured
-
+  }
 
+  // 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.visibility = 'hidden';
+      containerStyles.display = 'none';
     }
-  } else if (_Platform.default.OS === 'web') {
+  } else if (Platform.OS === 'web') {
     const transitionDuration = isExpanded ? expandDuration : collapseDuration;
-    containerStyles.transition = "height ".concat(transitionDuration, "ms ease-in-out");
+    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.
@@ -98,9 +81,6 @@ function useVerticalExpandAnimation(_ref) {
   } else {
     containerStyles.height = expandAnimatedValue;
   }
-
   return [containerStyles, elementRef];
 }
-
-var _default = useVerticalExpandAnimation;
-exports.default = _default;
+export default useVerticalExpandAnimation;

package/lib/utils/children.js

@@ -1,23 +1,6 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.wrapStringsInText = exports.unpackFragment = void 0;
-
-var _react = _interopRequireWildcard(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 }; }
-
-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; }
+import React from 'react';
+import Text from "react-native-web/dist/exports/Text";
+import A11yText from '../A11yText';
 
 /**
  * Unpacks top-level fragments, so that common compositional patterns such as the following examples
@@ -51,42 +34,39 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
  * @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.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 (React.Children.count(child) > 1) return React.Children.map(child, unpackFragment);
 
-  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
+  // 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.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 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 || ''}`, '');
 
-const combineKeys = childrenArray => childrenArray.reduce((newKey, child) => "".concat(newKey).concat(child.key || ''), ''); // Group wrappable children for one `<Text>` parent, merging adjacent text nodes
-
-
+// Group wrappable children for one `<Text>` parent, merging adjacent text nodes
 const wrapChild = (child, wrappedText) => {
-  const lastIndex = wrappedText.length - 1; // If possible, simplify content by combining text nodes into one string.
+  const lastIndex = wrappedText.length - 1;
+  // If possible, simplify content by combining text nodes into one string.
   // jest-native's `.toHaveTextContent` is buggy about array of text nodes in <Text> elements.
-
   if (lastIndex >= 0 && isStringOrNumber(child) && isStringOrNumber(wrappedText[lastIndex])) {
     /* eslint-disable-next-line no-param-reassign */
-    wrappedText[lastIndex] = "".concat(wrappedText[lastIndex]).concat(child);
+    wrappedText[lastIndex] = `${wrappedText[lastIndex]}${child}`;
   } else {
     wrappedText.push(child);
   }
 };
+
 /**
  * React Native on Native crashes if text content is rendered outside `<Text>`, and on web,
  * text style inheritance behaves differently with text compared to regular HTML.
@@ -102,13 +82,12 @@ 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.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>
+  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>
   const wrapables = [[]];
   let wrapablesIndex = 0;
   childrenArray.forEach(child => {
@@ -129,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, { ...textProps,
+    _jsx(Text, {
+      ...textProps,
       children: group.length === 1 ? group[0] : group
     }, combineKeys(group) || index) : group];
   }, []);
   return items.length === 1 ? items[0] : items;
-};
-
-exports.wrapStringsInText = wrapStringsInText;
+};