@telus-uds/components-base 1.96.0 → 1.97.1

package/lib/ActivityIndicator/Spinner.native.js

@@ -1,21 +1,14 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(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 _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
-var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
-var _shared = require("./shared");
-var _A11yInfoProvider = require("../A11yInfoProvider");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-const ea = _shared.MIN_EMPTY_ANGLE / 2;
-const sa = _shared.MIN_STROKE_ANGLE / 2;
-const Spinner = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
+import React from 'react';
+import Animated from "react-native-web/dist/exports/Animated";
+import Easing from "react-native-web/dist/exports/Easing";
+import StyleSheet from "react-native-web/dist/exports/StyleSheet";
+import View from "react-native-web/dist/exports/View";
+import { DURATION, MIN_EMPTY_ANGLE, MIN_STROKE_ANGLE, BEZIER, propTypes } from './shared';
+import { useA11yInfo } from '../A11yInfoProvider';
+import { jsx as _jsx } from "react/jsx-runtime";
+const ea = MIN_EMPTY_ANGLE / 2;
+const sa = MIN_STROKE_ANGLE / 2;
+const Spinner = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
     size,
     color,
@@ -25,24 +18,24 @@ const Spinner = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   } = _ref;
   const {
     current: timer
-  } = _react.default.useRef(new _Animated.default.Value(0));
+  } = React.useRef(new Animated.Value(0));
   const {
     reduceMotionEnabled
-  } = (0, _A11yInfoProvider.useA11yInfo)();
+  } = useA11yInfo();
   const reduceMotion = reduceMotionEnabled || isStatic;
-  _react.default.useLayoutEffect(() => {
-    const loop = _Animated.default.timing(timer, {
-      duration: _shared.DURATION,
-      easing: _Easing.default.linear,
+  React.useLayoutEffect(() => {
+    const loop = Animated.timing(timer, {
+      duration: DURATION,
+      easing: Easing.linear,
       // Animated.loop does not work if useNativeDriver is true on web
       useNativeDriver: true,
       toValue: 1,
       isInteraction: false
     });
-    if (!reduceMotion) _Animated.default.loop(loop).start();else loop.stop();
+    if (!reduceMotion) Animated.loop(loop).start();else loop.stop();
   }, [timer, reduceMotion]);
-  const frames = 60 * _shared.DURATION / 1000;
-  const easing = _Easing.default.bezier(..._shared.BEZIER);
+  const frames = 60 * DURATION / 1000;
+  const easing = Easing.bezier(...BEZIER);
   const containerStyle = {
     width: size,
     height: size / (reduceMotion ? 1.5 : 2),
@@ -51,7 +44,7 @@ const Spinner = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   const animationFrequency = reduceMotion ? [0] : [0, 1];
 
   // Credit to https://github.com/n4kz/react-native-indicators and https://github.com/callstack/react-native-paper for this
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
+  return /*#__PURE__*/_jsx(View, {
     ref: ref,
     style: [styles.container],
     accessible: true,
@@ -60,7 +53,7 @@ const Spinner = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
     accessibilityState: {
       busy: true
     },
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Animated.default.View, {
+    children: /*#__PURE__*/_jsx(Animated.View, {
       style: [{
         width: size,
         height: size
@@ -111,19 +104,19 @@ const Spinner = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
           borderWidth: thickness,
           borderRadius: size / 2
         };
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Animated.default.View, {
+        return /*#__PURE__*/_jsx(Animated.View, {
           style: [styles.layer],
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Animated.default.View, {
+          children: /*#__PURE__*/_jsx(Animated.View, {
             style: layerStyle,
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Animated.default.View, {
+            children: /*#__PURE__*/_jsx(Animated.View, {
               style: [containerStyle, offsetStyle],
               collapsable: false,
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Animated.default.View, {
+              children: /*#__PURE__*/_jsx(Animated.View, {
                 style: viewportStyle,
-                children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Animated.default.View, {
+                children: /*#__PURE__*/_jsx(Animated.View, {
                   style: containerStyle,
                   collapsable: false,
-                  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Animated.default.View, {
+                  children: /*#__PURE__*/_jsx(Animated.View, {
                     style: lineStyle
                   })
                 })
@@ -136,17 +129,16 @@ const Spinner = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
   });
 });
 Spinner.displayName = 'Spinner';
-Spinner.propTypes = _shared.propTypes;
-const styles = _StyleSheet.default.create({
+Spinner.propTypes = propTypes;
+const styles = StyleSheet.create({
   container: {
     flexGrow: 0,
     flexShrink: 0
   },
   layer: {
-    ..._StyleSheet.default.absoluteFillObject,
+    ...StyleSheet.absoluteFillObject,
     justifyContent: 'center',
     alignItems: 'center'
   }
 });
-var _default = Spinner;
-exports.default = _default;
+export default Spinner;

package/lib/ActivityIndicator/index.js

@@ -1,20 +1,15 @@
-"use strict";
+import React from 'react';
+import PropTypes from 'prop-types';
+import { useThemeTokens } from '../ThemeProvider';
+import { getTokensPropType, variantProp } from '../utils/props';
+import Spinner from './Spinner';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _ThemeProvider = require("../ThemeProvider");
-var _props = require("../utils/props");
-var _Spinner = _interopRequireDefault(require("./Spinner"));
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /**
  * `ActivityIndicator` renders a visual loading state.
  * It does not handle positioning or layout of that visual loader.
- */const ActivityIndicator = _ref => {
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+const ActivityIndicator = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
     variant,
     tokens,
@@ -25,26 +20,27 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
     size,
     color,
     thickness
-  } = (0, _ThemeProvider.useThemeTokens)('ActivityIndicator', tokens, variant);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Spinner.default, {
+  } = useThemeTokens('ActivityIndicator', tokens, variant);
+  return /*#__PURE__*/_jsx(Spinner, {
+    ref: ref,
     size: size,
     color: color,
     thickness: thickness,
     label: label,
     isStatic: isStatic
   });
-};
+});
+ActivityIndicator.displayName = 'ActivityIndicator';
 ActivityIndicator.propTypes = {
-  variant: _props.variantProp.propType,
-  tokens: (0, _props.getTokensPropType)('ActivityIndicator'),
+  variant: variantProp.propType,
+  tokens: getTokensPropType('ActivityIndicator'),
   /**
    * A visually hidden accessible label describing the action taking place
    */
-  label: _propTypes.default.string.isRequired,
+  label: PropTypes.string.isRequired,
   /**
    * If true, it should render a static spinner
    */
-  isStatic: _propTypes.default.bool
+  isStatic: PropTypes.bool
 };
-var _default = ActivityIndicator;
-exports.default = _default;
+export default ActivityIndicator;

package/lib/ActivityIndicator/shared.js

@@ -1,25 +1,14 @@
-"use strict";
+import PropTypes from 'prop-types';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.propTypes = exports.MIN_STROKE_ANGLE = exports.MIN_EMPTY_ANGLE = exports.DURATION = exports.BEZIER = void 0;
-var _propTypes = _interopRequireDefault(require("prop-types"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 // these could be specified by the theme
-const DURATION = 1800;
-exports.DURATION = DURATION;
-const MIN_EMPTY_ANGLE = 60;
-exports.MIN_EMPTY_ANGLE = MIN_EMPTY_ANGLE;
-const MIN_STROKE_ANGLE = 30;
-exports.MIN_STROKE_ANGLE = MIN_STROKE_ANGLE;
-const BEZIER = [0.42, 0.0, 0.58, 1.0];
-exports.BEZIER = BEZIER;
-const propTypes = {
-  color: _propTypes.default.string.isRequired,
-  label: _propTypes.default.string.isRequired,
-  size: _propTypes.default.number.isRequired,
-  thickness: _propTypes.default.number.isRequired,
-  isStatic: _propTypes.default.bool
-};
-exports.propTypes = propTypes;
+export const DURATION = 1800;
+export const MIN_EMPTY_ANGLE = 60;
+export const MIN_STROKE_ANGLE = 30;
+export const BEZIER = [0.42, 0.0, 0.58, 1.0];
+export const propTypes = {
+  color: PropTypes.string.isRequired,
+  label: PropTypes.string.isRequired,
+  size: PropTypes.number.isRequired,
+  thickness: PropTypes.number.isRequired,
+  isStatic: PropTypes.bool
+};