@telus-uds/components-base 1.65.0 → 1.67.0

package/lib-module/TooltipButton/TooltipButton.js

@@ -8,7 +8,6 @@ import { a11yProps, getTokensPropType, selectSystemProps, variantProp, viewProps
 import Icon from '../Icon';
 import { jsx as _jsx } from "react/jsx-runtime";
 const [selectProps, selectedSystemPropTypes] = selectSystemProps([a11yProps, viewProps]);
-
 const selectInnerContainerStyles = _ref => {
   let {
     borderRadius,
@@ -21,7 +20,6 @@ const selectInnerContainerStyles = _ref => {
     backgroundColor
   };
 };
-
 const selectIconTokens = _ref2 => {
   let {
     iconSize,
@@ -34,13 +32,12 @@ const selectIconTokens = _ref2 => {
     scale: iconScale
   };
 };
+
 /**
  * `TooltipButton` is a helper component used as a default control for the `Tooltip` component.
  * In fact though, it isn't actually a pressable - it's meant to be used as pressable's content.
  * Due to this any interaction states (e.g. pressed, hover, etc.) has to be passed down to it as a prop.
  */
-
-
 const TooltipButton = _ref3 => {
   let {
     pressableState,
@@ -66,17 +63,17 @@ const TooltipButton = _ref3 => {
     })
   });
 };
-
 const staticStyles = StyleSheet.create({
-  bubblePointerEvents: { ...Platform.select({
+  bubblePointerEvents: {
+    ...Platform.select({
       web: {
         pointerEvents: 'none'
       }
     })
   }
 });
-TooltipButton.propTypes = { ...selectedSystemPropTypes,
-
+TooltipButton.propTypes = {
+  ...selectedSystemPropTypes,
   /**
    * Used as appearances when resolving theme tokens.
    */

package/lib-module/Typography/Typography.js

@@ -9,11 +9,9 @@ import { a11yProps, variantProp, getTokensPropType, getMaxFontMultiplier, headin
 /**
  * @typedef {import('../utils/a11y/semantics').TextTag} TextTag
  */
-
 import { jsx as _jsx } from "react/jsx-runtime";
 const [selectContainerProps, selectedContainerPropTypes] = selectSystemProps([a11yProps, viewProps]);
 const [selectTextProps, selectedTextPropTypes] = selectSystemProps([textProps]);
-
 const selectTextStyles = (_ref, themeOptions) => {
   let {
     fontWeight,
@@ -36,9 +34,9 @@ const selectTextStyles = (_ref, themeOptions) => {
     textTransform,
     letterSpacing
   });
-}; // General-purpose flexible theme-neutral base component for text
-
+};
 
+// General-purpose flexible theme-neutral base component for text
 const Typography = /*#__PURE__*/forwardRef((_ref2, ref) => {
   let {
     children,
@@ -63,8 +61,10 @@ const Typography = /*#__PURE__*/forwardRef((_ref2, ref) => {
   const {
     themeOptions
   } = useTheme();
-  const resolvedTextProps = { ...selectTextProps(rest),
-    style: selectTextStyles(align ? { ...themeTokens,
+  const resolvedTextProps = {
+    ...selectTextProps(rest),
+    style: selectTextStyles(align ? {
+      ...themeTokens,
       textAlign: align
     } : themeTokens, themeOptions),
     dataSet,
@@ -75,15 +75,14 @@ const Typography = /*#__PURE__*/forwardRef((_ref2, ref) => {
     ...getA11yPropsFromHtmlTag(tag, accessibilityRole),
     ...selectContainerProps(rest)
   };
-
   const resetTagStyling = child => {
     if (typeof child === 'object' && ((child === null || child === void 0 ? void 0 : child.type) === 'sub' || (child === null || child === void 0 ? void 0 : child.type) === 'sup')) {
       var _child$props;
-
       const childStyles = (child === null || child === void 0 ? void 0 : (_child$props = child.props) === null || _child$props === void 0 ? void 0 : _child$props.style) || {};
       const supFontSize = childStyles.fontSize ?? superScriptFontSize;
       const sanitizedChild = /*#__PURE__*/React.cloneElement(child, {
-        style: { ...childStyles,
+        style: {
+          ...childStyles,
           ...(supFontSize ? {
             fontSize: supFontSize
           } : {}),
@@ -92,20 +91,17 @@ const Typography = /*#__PURE__*/forwardRef((_ref2, ref) => {
       });
       return sanitizedChild;
     }
-
     return child;
   };
-
   const sanitizeChildren = () => {
     if (Array.isArray(children)) {
       return children.map(resetTagStyling);
     }
-
     return resetTagStyling(children);
   };
-
   const textDecorationLine = strikeThrough ? 'line-through' : 'none';
-  const textStyles = resolvedTextProps.style ? { ...resolvedTextProps.style,
+  const textStyles = resolvedTextProps.style ? {
+    ...resolvedTextProps.style,
     textDecorationLine
   } : {
     textDecorationLine
@@ -113,7 +109,8 @@ const Typography = /*#__PURE__*/forwardRef((_ref2, ref) => {
   return block ? /*#__PURE__*/_jsx(View, {
     ref: ref,
     ...containerProps,
-    children: /*#__PURE__*/_jsx(Text, { ...resolvedTextProps,
+    children: /*#__PURE__*/_jsx(Text, {
+      ...resolvedTextProps,
       style: textStyles,
       children: sanitizeChildren(children)
     })
@@ -126,16 +123,15 @@ const Typography = /*#__PURE__*/forwardRef((_ref2, ref) => {
   });
 });
 Typography.displayName = 'Typography';
-Typography.propTypes = { ...selectedContainerPropTypes,
+Typography.propTypes = {
+  ...selectedContainerPropTypes,
   ...selectedTextPropTypes,
   tokens: getTokensPropType('Typography'),
   variant: variantProp.propType,
-
   /**
    * Renders the text with "text-decoration: 'line-through'" applied.
    */
   strikeThrough: PropTypes.bool,
-
   /**
    * Renders the text as a semantic heading. If a html heading tag is provided, uses that tag on Web.
    *
@@ -146,7 +142,6 @@ Typography.propTypes = { ...selectedContainerPropTypes,
    * is not defined, the accessibilityRole will default to "heading".
    */
   heading: PropTypes.oneOf([...headingTags, true]),
-
   /**
    * Optional semantic HTML tag, to apply to the text on web. Does not change styling.
    *
@@ -156,18 +151,15 @@ Typography.propTypes = { ...selectedContainerPropTypes,
    * is not defined, the accessibilityRole will default to "heading".
    */
   tag: PropTypes.oneOf(textTags),
-
   /**
    * If true, forces the element to behave as a View block even if nested in other text
    */
   block: PropTypes.bool,
-
   /**
    * Works the same as css text-align, note that RN doesn't support "start" or "end" (see https://reactnative.dev/docs/text-style-props#textalign)
    * Justify is known to make text harder to read, especially for people with dyslexia (see https://developer.mozilla.org/en-US/docs/Web/CSS/text-align#accessibility_concerns)
    */
   align: PropTypes.oneOf(['auto', 'left', 'right', 'center', 'justify']),
-
   /**
    * Same children allowed as a React Native <Text> node
    */

package/lib-module/Validator/Validator.js

@@ -10,7 +10,6 @@ import InputSupports from '../InputSupports';
 import { useThemeTokens } from '../ThemeProvider';
 import { jsx as _jsx } from "react/jsx-runtime";
 const [selectProps, selectedSystemPropTypes] = selectSystemProps([inputSupportsProps]);
-
 const selectCodeTextInputTokens = _ref => {
   let {
     outerBorderColor,
@@ -22,7 +21,6 @@ const selectCodeTextInputTokens = _ref => {
     icon: null
   };
 };
-
 const Validator = /*#__PURE__*/forwardRef((_ref2, ref) => {
   let {
     value = '',
@@ -44,93 +42,72 @@ const Validator = /*#__PURE__*/forwardRef((_ref2, ref) => {
   const prefix = 'code';
   const sufixValidation = 'Validation';
   const [isHover, setIsHover] = useState(false);
-
   const handleMouseOver = () => {
     setIsHover(true);
   };
-
   const handleMouseOut = () => {
     setIsHover(false);
   };
-
   const themeTokens = useThemeTokens('TextInput', tokens, variant, {
     hover: isHover
   });
   const [codeReferences, singleCodes] = useMemo(() => {
     const codes = [];
     const valueCodes = {};
-
     for (let i = 0; validatorsLength && i < validatorsLength; i += 1) {
       codes[prefix + i] = /*#__PURE__*/createRef();
       valueCodes[prefix + i] = '';
       valueCodes[prefix + i + sufixValidation] = '';
     }
-
     return [codes, valueCodes];
   }, []);
-
   const handleSingleCodes = (codeId, val, validation) => {
     singleCodes[codeId] = val;
     singleCodes[codeId + sufixValidation] = validation;
     /* eslint-disable no-unused-expressions */
-
-    setIndividualCodes({ ...individualCodes,
+    setIndividualCodes({
+      ...individualCodes,
       [codeId]: val
     });
   };
-
   const handleChangeCode = () => {
     let code = '';
-
     for (let i = 0; i < validatorsLength; i += 1) code += singleCodes[prefix + i];
-
     if (typeof onChange === 'function') onChange(code, singleCodes);
   };
-
   const handleChangeCodeValues = (event, codeId, nextIndex) => {
     var _codeReferences$codeI, _event$nativeEvent, _event$target, _codeElement$value, _codeElement$value2;
-
     const codeElement = (_codeReferences$codeI = codeReferences[codeId]) === null || _codeReferences$codeI === void 0 ? void 0 : _codeReferences$codeI.current;
     const val = ((_event$nativeEvent = event.nativeEvent) === null || _event$nativeEvent === void 0 ? void 0 : _event$nativeEvent.value) || ((_event$target = event.target) === null || _event$target === void 0 ? void 0 : _event$target.value);
-
     if (Number(val).toString() === 'NaN') {
       codeElement.value = singleCodes[codeId] ?? '';
       return;
     }
-
     if ((codeElement === null || codeElement === void 0 ? void 0 : (_codeElement$value = codeElement.value) === null || _codeElement$value === void 0 ? void 0 : _codeElement$value.length) > 1) {
       const oldValue = singleCodes[codeId];
       const newValue = codeElement.value.replace(oldValue, '');
       codeElement.value = newValue;
       handleSingleCodes(codeId, codeElement.value, 'success');
     }
-
     handleSingleCodes(codeId, (codeElement === null || codeElement === void 0 ? void 0 : codeElement.value) ?? singleCodes[codeId], 'success');
     handleChangeCode();
-
     if (nextIndex === validatorsLength) {
       codeElement.blur();
       return;
     }
-
     if ((codeElement === null || codeElement === void 0 ? void 0 : (_codeElement$value2 = codeElement.value) === null || _codeElement$value2 === void 0 ? void 0 : _codeElement$value2.length) > 0) codeReferences[prefix + nextIndex].current.focus();
   };
-
   const handleKeyPress = (event, currentIndex, previousIndex) => {
     if (!(event.keyCode === 8 || event.code === 'Backspace')) return;
-
     if (currentIndex > 0) {
       codeReferences[prefix + currentIndex].current.value = '';
       codeReferences[prefix + previousIndex].current.focus();
     }
-
     handleSingleCodes(prefix + currentIndex, '', '');
     handleChangeCode();
   };
-
   const getCodeComponents = () => {
     const components = [];
-
     for (let i = 0; validatorsLength && i < validatorsLength; i += 1) {
       const codeId = prefix + i;
       const codeInputProps = {
@@ -141,7 +118,6 @@ const Validator = /*#__PURE__*/forwardRef((_ref2, ref) => {
         tokens: selectCodeTextInputTokens(themeTokens),
         onFocus: () => {
           var _codeReferences$codeI2, _codeReferences$codeI3;
-
           return ((_codeReferences$codeI2 = codeReferences[codeId]) === null || _codeReferences$codeI2 === void 0 ? void 0 : (_codeReferences$codeI3 = _codeReferences$codeI2.current) === null || _codeReferences$codeI3 === void 0 ? void 0 : _codeReferences$codeI3.select()) ?? null;
         },
         onKeyPress: event => handleKeyPress(event, i, i - 1),
@@ -152,44 +128,39 @@ const Validator = /*#__PURE__*/forwardRef((_ref2, ref) => {
       codeInputProps.validation || delete codeInputProps.validation;
       components.push( /*#__PURE__*/_jsx(View, {
         style: staticStyles.codeInputWidth,
-        children: /*#__PURE__*/_jsx(TextInput, { ...codeInputProps
+        children: /*#__PURE__*/_jsx(TextInput, {
+          ...codeInputProps
         })
       }, codeId));
     }
-
     return components;
   };
-
   useEffect(() => {
     /* eslint-disable no-unused-expressions */
     if (Number(value).toString() !== 'NaN') setText(value);
   }, [value]);
-  /* eslint-disable react-hooks/exhaustive-deps */
 
+  /* eslint-disable react-hooks/exhaustive-deps */
   useEffect(() => {
     for (let i = 0; i < validatorsLength; i += 1) {
       codeReferences[prefix + i].current.value = text[i] ?? '';
       handleSingleCodes(prefix + i, text[i] ?? '', text[i] ? 'success' : '');
     }
   }, [text]);
-  /* eslint-disable react-hooks/exhaustive-deps */
 
+  /* eslint-disable react-hooks/exhaustive-deps */
   useEffect(() => {
     const handlePasteCode = event => {
       setText('');
       const clipBoardText = event.clipboardData.getData('text');
       if (Number(clipBoardText).toString() !== 'NaN') setText(clipBoardText);
     };
-
     const handleCopy = event => {
       let clipBoardText = '';
-
       for (let i = 0; i < validatorsLength; i += 1) singleCodes[prefix + i] && (clipBoardText += singleCodes[prefix + i]);
-
       event.clipboardData.setData('text/plain', clipBoardText);
       event.preventDefault();
     };
-
     if (Platform.OS === 'web') {
       for (let i = 0; i < validatorsLength; i += 1) {
         codeReferences[prefix + i].current.addEventListener('paste', handlePasteCode);
@@ -197,12 +168,10 @@ const Validator = /*#__PURE__*/forwardRef((_ref2, ref) => {
         codeReferences[prefix + i].current.addEventListener('input', event => handleChangeCodeValues(event, prefix + i, i + 1));
       }
     }
-
     return () => {
       if (Platform.oldValue === 'web') {
         for (let i = 0; i < validatorsLength; i += 1) {
           var _codeReferences, _codeReferences$curre, _codeReferences2, _codeReferences2$curr, _codeReferences3, _codeReferences3$curr;
-
           (_codeReferences = codeReferences[prefix + i]) === null || _codeReferences === void 0 ? void 0 : (_codeReferences$curre = _codeReferences.current) === null || _codeReferences$curre === void 0 ? void 0 : _codeReferences$curre.removeEventListener('paste', handlePasteCode);
           (_codeReferences2 = codeReferences[prefix + i]) === null || _codeReferences2 === void 0 ? void 0 : (_codeReferences2$curr = _codeReferences2.current) === null || _codeReferences2$curr === void 0 ? void 0 : _codeReferences2$curr.removeEventListener('copy', handleCopy);
           (_codeReferences3 = codeReferences[prefix + i]) === null || _codeReferences3 === void 0 ? void 0 : (_codeReferences3$curr = _codeReferences3.current) === null || _codeReferences3$curr === void 0 ? void 0 : _codeReferences3$curr.removeEventListener('input', event => handleChangeCodeValues(event, prefix + i, i + 1));
@@ -210,7 +179,8 @@ const Validator = /*#__PURE__*/forwardRef((_ref2, ref) => {
       }
     };
   }, []);
-  return /*#__PURE__*/_jsx(InputSupports, { ...supportsProps,
+  return /*#__PURE__*/_jsx(InputSupports, {
+    ...supportsProps,
     children: /*#__PURE__*/_jsx(StackView, {
       space: 2,
       direction: "row",
@@ -220,18 +190,16 @@ const Validator = /*#__PURE__*/forwardRef((_ref2, ref) => {
   });
 });
 Validator.displayName = 'Validator';
-Validator.propTypes = { ...selectedSystemPropTypes,
-
+Validator.propTypes = {
+  ...selectedSystemPropTypes,
   /**
    * The value is a 6-digit code, may be only numeric characters, non numeric character aren't renderize
    */
   value: PropTypes.string,
-
   /**
    * If true, the component is inactive and non editable.
    */
   inactive: PropTypes.bool,
-
   /**
    * Use to react upon input's value changes. Required when the `value` prop is set. Will receive the input's value as an argument.
    */

package/lib-module/ViewportProvider/ViewportProvider.js

@@ -3,12 +3,11 @@ import PropTypes from 'prop-types';
 import { viewports } from '@telus-uds/system-constants';
 import { ViewportContext } from './useViewport';
 import useViewportListener from './useViewportListener';
+
 /**
  * Provides an up-to-date viewport value from system-constants, available via the `useViewport` hook
  */
-
 import { jsx as _jsx } from "react/jsx-runtime";
-
 const ViewportProvider = _ref => {
   let {
     children
@@ -22,7 +21,6 @@ const ViewportProvider = _ref => {
     children: children
   });
 };
-
 ViewportProvider.propTypes = {
   children: PropTypes.node.isRequired
 };

package/lib-module/ViewportProvider/useViewportListener.js

@@ -1,39 +1,37 @@
 import Dimensions from "react-native-web/dist/exports/Dimensions";
 import { viewports } from '@telus-uds/system-constants';
-import useSafeLayoutEffect from '../utils/useSafeLayoutEffect'; // Use Dimensions instead of useWindowDimensions because useWindowDimensions forces context
+import useSafeLayoutEffect from '../utils/useSafeLayoutEffect';
+
+// Use Dimensions instead of useWindowDimensions because useWindowDimensions forces context
 // to update on every pixel change during window resize; but we only want rerenders to occur
 // when a viewport threshold has been crossed.
-
 const lookupViewport = () => viewports.select(Dimensions.get('window').width);
+
 /**
  * When client-side rendering, immediately set the viewport to the correct value as a layout effect so
  * if the viewport isn't the smallest, any SSR-rendered components rerender correctly before anything
  * is shown to the user. Then bind events to update the viewport if it changes.
  */
-
-
 const useViewportListener = setViewport => {
   useSafeLayoutEffect(() => {
     setViewport(lookupViewport());
-
     const onChange = _ref => {
       let {
         window
       } = _ref;
       return setViewport(viewports.select(window.width));
     };
-
     const listener = Dimensions.addEventListener('change', onChange);
     return () => {
       if (typeof (listener === null || listener === void 0 ? void 0 : listener.remove) === 'function') {
         // Can't just return listener.remove because listener.emitter disappears, causing an internal error.
         // See https://github.com/facebook/react-native/issues/34508
-        listener.remove(); // From RN 0.65.0, Dimensions.removeEventListener is deprecated for `remove` on addEventListener return value
+        listener.remove();
+        // From RN 0.65.0, Dimensions.removeEventListener is deprecated for `remove` on addEventListener return value
       } else if (typeof Dimensions.removeEventListener === 'function') {
         Dimensions.removeEventListener('change', onChange);
       }
     };
   }, [setViewport]);
 };
-
 export default useViewportListener;

package/lib-module/index.js

@@ -9,6 +9,7 @@ export { default as Listbox } from './Listbox';
 export { default as Checkbox } from './Checkbox';
 export * from './Checkbox';
 export { default as CheckboxCard } from './CheckboxCard';
+export { default as CheckboxCardGroup } from './CheckboxCardGroup';
 export { default as Divider } from './Divider';
 export { default as ExpandCollapse, Accordion } from './ExpandCollapse';
 export { default as Feedback } from './Feedback';

package/lib-module/utils/BaseView/BaseView.js

@@ -3,11 +3,11 @@ 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
  */
-
 import { jsx as _jsx } from "react/jsx-runtime";
 const BaseView = /*#__PURE__*/forwardRef((_ref, ref) => {
   let {
@@ -19,12 +19,11 @@ const BaseView = /*#__PURE__*/forwardRef((_ref, ref) => {
     themeOptions
   } = useTheme();
   const styleProp = Array.isArray(style) ? [...style] : [style];
-
   if (!themeOptions.forceZIndex) {
     styleProp.unshift(styles.resetZIndex);
   }
-
-  return /*#__PURE__*/_jsx(NativeView, { ...rest,
+  return /*#__PURE__*/_jsx(NativeView, {
+    ...rest,
     style: styleProp,
     ref: ref,
     children: children

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

@@ -2,5 +2,4 @@ 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
  */
-
 export default BaseView;

package/lib-module/utils/a11y/semantics.js

@@ -2,7 +2,6 @@ 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.
@@ -23,10 +22,7 @@ import Platform from "react-native-web/dist/exports/Platform";
  */
 // 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',
@@ -45,23 +41,22 @@ 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'
+  // eslint-disable-next-line prettier/prettier
+};
 
+// 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
-
-export 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
  */
@@ -72,7 +67,6 @@ export const headingTags =
  *
  * Of these, only headers (h1, h2, ...h5, h6) set a corresponding accessibilityRole in native apps ("heading").
  */
-
 export const supportedTags = [...Object.keys(tagsToRoles), ...headingTags];
 /**
  * Uses readonly mapping keys/values to generate static types for IDEs that support TS in JSDoc.
@@ -86,10 +80,8 @@ export 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
-
-export 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'
+// eslint-disable-next-line prettier/prettier
 ];
 /**
  * @typedef {typeof layoutTags[number]} LayoutTag
@@ -101,10 +93,8 @@ export const layoutTags =
  * Of these, only headers (h1, h2, ...h5, h6) set a corresponding accessibilityRole in native apps ("heading").
  */
 // eslint-disable-next-line prettier/prettier
-
-export 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'
+// eslint-disable-next-line prettier/prettier
 ];
 /**
  * @typedef {typeof layoutTags[number]} TextTag
@@ -117,8 +107,8 @@ export 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;
+
 /**
  * Takes a supported HTML tag, and returns the accessibility props that, on web, make React Native Web
  * render that tag.
@@ -131,13 +121,11 @@ export const getHeadingLevel = tag => headingTags.includes(tag) ? Number(tag[1])
  * @param {AccessibilityRole | null} [nativeRole] - optional accessibilityRole for native apps
  * @returns {{ accessibilityRole: string, accessibilityLevel?: string } | undefined}
  */
-
 export const getA11yPropsFromHtmlTag = (tag, nativeRole) => {
   // Allow cross-platform apps to set accessibilityRoles alongside a web tag without conflict
   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.OS === 'web' && tagsToRoles[tag];
@@ -149,9 +137,8 @@ export 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;
 };

package/lib-module/utils/a11y/textSize.js

@@ -7,13 +7,13 @@ import Platform from "react-native-web/dist/exports/Platform";
  * @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
  */
-
 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.getFontScale(), maxScale) || 1;
   return value * scale;
 };
+
 /**
  * Native only, returns `undefined` on Web.
  *
@@ -24,7 +24,6 @@ export const scaleWithText = function (value) {
  * The return value of this function can be used as a React Native `Text` element's
  * `maxFontSizeMultiplier` prop value.
  */
-
 export const getMaxFontMultiplier = _ref => {
   let {
     fontSize,