@telus-uds/components-base 1.65.0 → 1.67.0

package/lib/Typography/Typography.js

@@ -4,37 +4,22 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _Text = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Text"));
-
 var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
-
 var _ThemeProvider = require("../ThemeProvider");
-
 var _ViewportProvider = require("../ViewportProvider");
-
 var _utils = require("../ThemeProvider/utils");
-
 var _utils2 = 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; }
-
 /**
  * @typedef {import('../utils/a11y/semantics').TextTag} TextTag
- */
-const [selectContainerProps, selectedContainerPropTypes] = (0, _utils2.selectSystemProps)([_utils2.a11yProps, _utils2.viewProps]);
+ */const [selectContainerProps, selectedContainerPropTypes] = (0, _utils2.selectSystemProps)([_utils2.a11yProps, _utils2.viewProps]);
 const [selectTextProps, selectedTextPropTypes] = (0, _utils2.selectSystemProps)([_utils2.textProps]);
-
 const selectTextStyles = (_ref, themeOptions) => {
   let {
     fontWeight,
@@ -57,9 +42,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__*/(0, _react.forwardRef)((_ref2, ref) => {
   let {
     children,
@@ -84,8 +69,10 @@ const Typography = /*#__PURE__*/(0, _react.forwardRef)((_ref2, ref) => {
   const {
     themeOptions
   } = (0, _ThemeProvider.useTheme)();
-  const resolvedTextProps = { ...selectTextProps(rest),
-    style: selectTextStyles(align ? { ...themeTokens,
+  const resolvedTextProps = {
+    ...selectTextProps(rest),
+    style: selectTextStyles(align ? {
+      ...themeTokens,
       textAlign: align
     } : themeTokens, themeOptions),
     dataSet,
@@ -96,39 +83,33 @@ const Typography = /*#__PURE__*/(0, _react.forwardRef)((_ref2, ref) => {
     ...(0, _utils2.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.default.cloneElement(child, {
-        style: { ...childStyles,
+        style: {
+          ...childStyles,
           ...(supFontSize ? {
             fontSize: supFontSize
           } : {}),
           lineHeight: 0
         }
       });
-
       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
@@ -136,7 +117,8 @@ const Typography = /*#__PURE__*/(0, _react.forwardRef)((_ref2, ref) => {
   return block ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
     ref: ref,
     ...containerProps,
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.default, { ...resolvedTextProps,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.default, {
+      ...resolvedTextProps,
       style: textStyles,
       children: sanitizeChildren(children)
     })
@@ -149,16 +131,15 @@ const Typography = /*#__PURE__*/(0, _react.forwardRef)((_ref2, ref) => {
   });
 });
 Typography.displayName = 'Typography';
-Typography.propTypes = { ...selectedContainerPropTypes,
+Typography.propTypes = {
+  ...selectedContainerPropTypes,
   ...selectedTextPropTypes,
   tokens: (0, _utils2.getTokensPropType)('Typography'),
   variant: _utils2.variantProp.propType,
-
   /**
    * Renders the text with "text-decoration: 'line-through'" applied.
    */
   strikeThrough: _propTypes.default.bool,
-
   /**
    * Renders the text as a semantic heading. If a html heading tag is provided, uses that tag on Web.
    *
@@ -169,7 +150,6 @@ Typography.propTypes = { ...selectedContainerPropTypes,
    * is not defined, the accessibilityRole will default to "heading".
    */
   heading: _propTypes.default.oneOf([..._utils2.headingTags, true]),
-
   /**
    * Optional semantic HTML tag, to apply to the text on web. Does not change styling.
    *
@@ -179,18 +159,15 @@ Typography.propTypes = { ...selectedContainerPropTypes,
    * is not defined, the accessibilityRole will default to "heading".
    */
   tag: _propTypes.default.oneOf(_utils2.textTags),
-
   /**
    * If true, forces the element to behave as a View block even if nested in other text
    */
   block: _propTypes.default.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.default.oneOf(['auto', 'left', 'right', 'center', 'justify']),
-
   /**
    * Same children allowed as a React Native <Text> node
    */

package/lib/Typography/index.js

@@ -4,10 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _Typography = _interopRequireDefault(require("./Typography"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 var _default = _Typography.default;
 exports.default = _default;

package/lib/Validator/Validator.js

@@ -4,37 +4,21 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
-
 var _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
-
 var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
-
 var _utils = require("../utils");
-
 var _TextInput = require("../TextInput");
-
 var _StackView = _interopRequireDefault(require("../StackView"));
-
 var _InputSupports = _interopRequireDefault(require("../InputSupports"));
-
 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 [selectProps, selectedSystemPropTypes] = (0, _utils.selectSystemProps)([_utils.inputSupportsProps]);
-
 const selectCodeTextInputTokens = _ref => {
   let {
     outerBorderColor,
@@ -46,7 +30,6 @@ const selectCodeTextInputTokens = _ref => {
     icon: null
   };
 };
-
 const Validator = /*#__PURE__*/(0, _react.forwardRef)((_ref2, ref) => {
   let {
     value = '',
@@ -68,93 +51,72 @@ const Validator = /*#__PURE__*/(0, _react.forwardRef)((_ref2, ref) => {
   const prefix = 'code';
   const sufixValidation = 'Validation';
   const [isHover, setIsHover] = (0, _react.useState)(false);
-
   const handleMouseOver = () => {
     setIsHover(true);
   };
-
   const handleMouseOut = () => {
     setIsHover(false);
   };
-
   const themeTokens = (0, _ThemeProvider.useThemeTokens)('TextInput', tokens, variant, {
     hover: isHover
   });
   const [codeReferences, singleCodes] = (0, _react.useMemo)(() => {
     const codes = [];
     const valueCodes = {};
-
     for (let i = 0; validatorsLength && i < validatorsLength; i += 1) {
       codes[prefix + i] = /*#__PURE__*/(0, _react.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 = {
@@ -165,7 +127,6 @@ const Validator = /*#__PURE__*/(0, _react.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),
@@ -176,44 +137,39 @@ const Validator = /*#__PURE__*/(0, _react.forwardRef)((_ref2, ref) => {
       codeInputProps.validation || delete codeInputProps.validation;
       components.push( /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
         style: staticStyles.codeInputWidth,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextInput.TextInput, { ...codeInputProps
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextInput.TextInput, {
+          ...codeInputProps
         })
       }, codeId));
     }
-
     return components;
   };
-
   (0, _react.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 */
   (0, _react.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 */
   (0, _react.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.default.OS === 'web') {
       for (let i = 0; i < validatorsLength; i += 1) {
         codeReferences[prefix + i].current.addEventListener('paste', handlePasteCode);
@@ -221,12 +177,10 @@ const Validator = /*#__PURE__*/(0, _react.forwardRef)((_ref2, ref) => {
         codeReferences[prefix + i].current.addEventListener('input', event => handleChangeCodeValues(event, prefix + i, i + 1));
       }
     }
-
     return () => {
       if (_Platform.default.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));
@@ -234,7 +188,8 @@ const Validator = /*#__PURE__*/(0, _react.forwardRef)((_ref2, ref) => {
       }
     };
   }, []);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputSupports.default, { ...supportsProps,
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_InputSupports.default, {
+    ...supportsProps,
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_StackView.default, {
       space: 2,
       direction: "row",
@@ -244,18 +199,16 @@ const Validator = /*#__PURE__*/(0, _react.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.default.string,
-
   /**
    * If true, the component is inactive and non editable.
    */
   inactive: _propTypes.default.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.
    */
@@ -263,7 +216,6 @@ Validator.propTypes = { ...selectedSystemPropTypes,
 };
 var _default = Validator;
 exports.default = _default;
-
 const staticStyles = _StyleSheet.default.create({
   codeInputWidth: {
     width: 43

package/lib/Validator/index.js

@@ -4,10 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _Validator = _interopRequireDefault(require("./Validator"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 var _default = _Validator.default;
 exports.default = _default;

package/lib/ViewportProvider/ViewportProvider.js

@@ -4,29 +4,18 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _systemConstants = require("@telus-uds/system-constants");
-
 var _useViewport = require("./useViewport");
-
 var _useViewportListener = _interopRequireDefault(require("./useViewportListener"));
-
 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; }
-
 /**
  * Provides an up-to-date viewport value from system-constants, available via the `useViewport` hook
- */
-const ViewportProvider = _ref => {
+ */const ViewportProvider = _ref => {
   let {
     children
   } = _ref;
@@ -39,7 +28,6 @@ const ViewportProvider = _ref => {
     children: children
   });
 };
-
 ViewportProvider.propTypes = {
   children: _propTypes.default.node.isRequired
 };

package/lib/ViewportProvider/index.js

@@ -5,11 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 var _exportNames = {};
 exports.default = void 0;
-
 var _ViewportProvider = _interopRequireDefault(require("./ViewportProvider"));
-
 var _useViewport = require("./useViewport");
-
 Object.keys(_useViewport).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
@@ -21,8 +18,6 @@ Object.keys(_useViewport).forEach(function (key) {
     }
   });
 });
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 var _default = _ViewportProvider.default;
 exports.default = _default;

package/lib/ViewportProvider/useViewport.js

@@ -4,12 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useViewport = exports.ViewportContext = void 0;
-
 var _react = require("react");
-
 const ViewportContext = /*#__PURE__*/(0, _react.createContext)({});
 exports.ViewportContext = ViewportContext;
-
 const useViewport = () => (0, _react.useContext)(ViewportContext);
-
 exports.useViewport = useViewport;

package/lib/ViewportProvider/useViewportListener.js

@@ -4,50 +4,41 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _Dimensions = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Dimensions"));
-
 var _systemConstants = require("@telus-uds/system-constants");
-
 var _useSafeLayoutEffect = _interopRequireDefault(require("../utils/useSafeLayoutEffect"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 // 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 = () => _systemConstants.viewports.select(_Dimensions.default.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 => {
   (0, _useSafeLayoutEffect.default)(() => {
     setViewport(lookupViewport());
-
     const onChange = _ref => {
       let {
         window
       } = _ref;
       return setViewport(_systemConstants.viewports.select(window.width));
     };
-
     const listener = _Dimensions.default.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.default.removeEventListener === 'function') {
         _Dimensions.default.removeEventListener('change', onChange);
       }
     };
   }, [setViewport]);
 };
-
 var _default = useViewportListener;
 exports.default = _default;