@telus-uds/components-base 1.66.0 → 1.67.1

package/CHANGELOG.md

@@ -1,16 +1,36 @@
 # Change Log - @telus-uds/components-base
 
-This log was last generated on Wed, 01 Nov 2023 00:54:31 GMT and should not be manually modified.
+This log was last generated on Fri, 10 Nov 2023 22:28:25 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## 1.67.1
+
+Fri, 10 Nov 2023 22:28:25 GMT
+
+### Patches
+
+- Add new stories for quiet variant for Link component (email not defined)
+- fixes for error border validation to checkboxgroup, checkboxcardgroup, radiogroup and radiocardgroup (email not defined)
+- Bump @telus-uds/system-theme-tokens to v2.44.1
+
+## 1.67.0
+
+Tue, 07 Nov 2023 16:32:21 GMT
+
+### Minor changes
+
+- New test added from components web to components base (35577399+JoshHC@users.noreply.github.com)
+- new CheckboxCardGroup component (email not defined)
+- Bump @telus-uds/system-theme-tokens to v2.44.0
+
 ## 1.66.0
 
-Wed, 01 Nov 2023 00:54:31 GMT
+Wed, 01 Nov 2023 01:05:43 GMT
 
 ### Minor changes
 
-- card type for textInput component  (srikanthkhari@gmail.com)
+- card type for textInput component (srikanthkhari@gmail.com)
 - Add responsive `width` variant to `ButtonGroup` (shahzaibkhalidmalik@outlook.com)
 - Bump @telus-uds/system-theme-tokens to v2.43.0
 

package/lib/A11yInfoProvider/index.js

@@ -4,26 +4,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useA11yInfo = exports.default = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _AccessibilityInfo = _interopRequireDefault(require("react-native-web/dist/cjs/exports/AccessibilityInfo"));
-
 var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
-
 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 ScreenReaderContext = /*#__PURE__*/(0, _react.createContext)(false);
 const ReducedMotionContext = /*#__PURE__*/(0, _react.createContext)(false);
-
 const A11yInfoProvider = _ref => {
   let {
     children
@@ -36,22 +26,20 @@ const A11yInfoProvider = _ref => {
       // and "...after the Jest environment has been torn down" errors, so skip them.
       return () => {};
     }
-
     const motionSubscription = _AccessibilityInfo.default.addEventListener('reduceMotionChanged', setReduceMotionEnabled);
-
     const setInitialA11yInfo = async () => {
-      const [initialReduceMotionEnabled, initialScreenReaderEnabled] = await Promise.all([_AccessibilityInfo.default.isReduceMotionEnabled(), _AccessibilityInfo.default.isScreenReaderEnabled()]); // Browsers can't detect screen readers; in RNW isScreenReaderEnabled() is always `true`
-      // https://github.com/necolas/react-native-web/blob/master/packages/react-native-web/src/exports/AccessibilityInfo/index.js#L14
+      const [initialReduceMotionEnabled, initialScreenReaderEnabled] = await Promise.all([_AccessibilityInfo.default.isReduceMotionEnabled(), _AccessibilityInfo.default.isScreenReaderEnabled()]);
 
-      setScreenReaderEnabled(_Platform.default.OS !== 'web' && !!initialScreenReaderEnabled); // RNW does support isReduceMotionEnabled looking for 'prefers-reduced-motion' state
+      // Browsers can't detect screen readers; in RNW isScreenReaderEnabled() is always `true`
+      // https://github.com/necolas/react-native-web/blob/master/packages/react-native-web/src/exports/AccessibilityInfo/index.js#L14
+      setScreenReaderEnabled(_Platform.default.OS !== 'web' && !!initialScreenReaderEnabled);
 
+      // RNW does support isReduceMotionEnabled looking for 'prefers-reduced-motion' state
       setReduceMotionEnabled(!!initialReduceMotionEnabled);
     };
-
     if (_AccessibilityInfo.default.isReduceMotionEnabled && _AccessibilityInfo.default.isScreenReaderEnabled) {
       setInitialA11yInfo();
     }
-
     return () => {
       // From react-native 0.65, AccessibilityInfo.removeEventListener is deprecated for `remove` on addEventListener return value
       if (typeof (motionSubscription === null || motionSubscription === void 0 ? void 0 : motionSubscription.remove) === 'function') {
@@ -69,13 +57,11 @@ const A11yInfoProvider = _ref => {
     })
   });
 };
-
 A11yInfoProvider.propTypes = {
   children: _propTypes.default.node.isRequired
 };
 var _default = A11yInfoProvider;
 exports.default = _default;
-
 const useA11yInfo = () => {
   const screenReaderEnabled = (0, _react.useContext)(ScreenReaderContext);
   const reduceMotionEnabled = (0, _react.useContext)(ReducedMotionContext);
@@ -84,5 +70,4 @@ const useA11yInfo = () => {
     screenReaderEnabled
   };
 };
-
 exports.useA11yInfo = useA11yInfo;

package/lib/A11yText/index.js

@@ -4,35 +4,24 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
-
 var _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
-
 var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _props = require("../utils/props");
-
 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, _props.selectSystemProps)([_props.a11yProps, _props.viewProps]);
+
 /**
  * A11yText is a zero-size invisible element that adds text to be read by screen readers.
  *
  * It should be used to add selectable screen-reader-only text to the main document flow,
  * as a sibling to blocks of text like paragraphs and interactive elements like buttons.
  */
-
 const A11yText = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
     text,
@@ -56,19 +45,17 @@ const A11yText = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   });
 });
 A11yText.displayName = 'A11yText';
-A11yText.propTypes = { ...selectedSystemPropTypes,
-
+A11yText.propTypes = {
+  ...selectedSystemPropTypes,
   /**
    * Text to be read by screen readers
    */
   text: _propTypes.default.string.isRequired,
-
   /**
    * Whether text should be rendered as a heading
    */
   heading: _propTypes.default.bool
 };
-
 const styles = _StyleSheet.default.create({
   invisible: {
     // Without width or height it is not shown
@@ -82,6 +69,5 @@ const styles = _StyleSheet.default.create({
     top: -1
   }
 });
-
 var _default = A11yText;
 exports.default = _default;

package/lib/ActivityIndicator/Spinner.js

@@ -4,19 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _shared = require("./shared");
-
 var _A11yInfoProvider = require("../A11yInfoProvider");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 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 SVG_RADIUS = 20;
 const SVG_CIRCUMFERENCE = SVG_RADIUS * 2 * Math.PI;
 const MIN_SVG_LENGTH = _shared.MIN_STROKE_ANGLE / 360 * SVG_CIRCUMFERENCE;
@@ -31,9 +24,9 @@ const bezierProps = {
   calcMode: 'spline',
   keyTimes: '0; 0.5; 1',
   keySplines: `${_shared.BEZIER.join(', ')} ; ${_shared.BEZIER.join(', ')}`
-}; // We're using svg rather than css here to define the animation to avoid needing to introduce css injection mechanism
+};
+// We're using svg rather than css here to define the animation to avoid needing to introduce css injection mechanism
 // It's possible to replicate this functionality with RNW animations, but it snags on chrome at least, see https://github.com/telus/universal-design-system/pull/477 for details.
-
 const Spinner = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
   let {
     size,

package/lib/ActivityIndicator/Spinner.native.js

@@ -4,29 +4,17 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireWildcard(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 }; }
-
 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 ea = _shared.MIN_EMPTY_ANGLE / 2;
 const sa = _shared.MIN_STROKE_ANGLE / 2;
 const Spinner = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
@@ -37,16 +25,13 @@ const Spinner = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
     label,
     isStatic = false
   } = _ref;
-
   const {
     current: timer
   } = _react.default.useRef(new _Animated.default.Value(0));
-
   const {
     reduceMotionEnabled
   } = (0, _A11yInfoProvider.useA11yInfo)();
   const reduceMotion = reduceMotionEnabled || isStatic;
-
   _react.default.useLayoutEffect(() => {
     const loop = _Animated.default.timing(timer, {
       duration: _shared.DURATION,
@@ -56,21 +41,18 @@ const Spinner = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
       toValue: 1,
       isInteraction: false
     });
-
     if (!reduceMotion) _Animated.default.loop(loop).start();else loop.stop();
   }, [timer, reduceMotion]);
-
   const frames = 60 * _shared.DURATION / 1000;
-
   const easing = _Easing.default.bezier(..._shared.BEZIER);
-
   const containerStyle = {
     width: size,
     height: size / (reduceMotion ? 1.5 : 2),
     overflow: 'hidden'
   };
-  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
+  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, {
     ref: ref,
     style: [styles.container],
@@ -91,11 +73,9 @@ const Spinner = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
         const outputRange = Array.from(new Array(frames), (_, frameIndex) => {
           let progress = 2 * frameIndex / (frames - 1);
           const rotation = index ? +(360 - sa) : -(180 - sa);
-
           if (progress > 1.0) {
             progress = 2.0 - progress;
           }
-
           const direction = index ? -1 : +1;
           return `${direction * (180 - (sa + ea)) * easing(progress) + rotation}deg`;
         });
@@ -107,7 +87,6 @@ const Spinner = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
           width: size,
           height: size
         };
-
         if (!reduceMotion) {
           layerStyle.transform = [{
             rotate: timer.interpolate({
@@ -124,7 +103,6 @@ const Spinner = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
             })
           }];
         }
-
         const offsetStyle = index ? {
           top: size / 2
         } : null;
@@ -161,17 +139,16 @@ const Spinner = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
 });
 Spinner.displayName = 'Spinner';
 Spinner.propTypes = _shared.propTypes;
-
 const styles = _StyleSheet.default.create({
   container: {
     flexGrow: 0,
     flexShrink: 0
   },
-  layer: { ..._StyleSheet.default.absoluteFillObject,
+  layer: {
+    ..._StyleSheet.default.absoluteFillObject,
     justifyContent: 'center',
     alignItems: 'center'
   }
 });
-
 var _default = Spinner;
 exports.default = _default;

package/lib/ActivityIndicator/index.js

@@ -4,26 +4,17 @@ 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 => {
+ */const ActivityIndicator = _ref => {
   let {
     variant,
     tokens,
@@ -43,16 +34,13 @@ const ActivityIndicator = _ref => {
     isStatic: isStatic
   });
 };
-
 ActivityIndicator.propTypes = {
   variant: _props.variantProp.propType,
   tokens: (0, _props.getTokensPropType)('ActivityIndicator'),
-
   /**
    * A visually hidden accessible label describing the action taking place
    */
   label: _propTypes.default.string.isRequired,
-
   /**
    * If true, it should render a static spinner
    */

package/lib/ActivityIndicator/shared.js

@@ -4,11 +4,8 @@ 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;