@telus-uds/components-base 1.96.0 → 1.97.1

package/lib/QuickLinks/QuickLinks.js

@@ -1,25 +1,20 @@
-"use strict";
+import React from 'react';
+import PropTypes from 'prop-types';
+import { useThemeTokens } from '../ThemeProvider';
+import { useViewport } from '../ViewportProvider';
+import { getTokensPropType, variantProp } from '../utils';
+import List from '../List';
+import StackWrap from '../StackView/StackWrap';
+import QuickLinksCard from './QuickLinksCard';
 
-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 _ViewportProvider = require("../ViewportProvider");
-var _utils = require("../utils");
-var _List = _interopRequireDefault(require("../List"));
-var _StackWrap = _interopRequireDefault(require("../StackView/StackWrap"));
-var _QuickLinksCard = _interopRequireDefault(require("./QuickLinksCard"));
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /**
  * QuickLinks renders a list of interactive items. How it renders these items depends on theme options:
  *  - If the theme returns `list` token as true, it renders an ordered list based on List
  *  - If the theme returns `button` token as true and `list` as false, it renders a wrapping horizontal bar of buttons
  *  - If the theme returns `card` token as true, it wraps the above with a `Card`.
- */const QuickLinks = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+const QuickLinks = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
     tokens,
     variant,
@@ -29,7 +24,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
     tag = 'ul',
     ...rest
   } = _ref;
-  const viewport = (0, _ViewportProvider.useViewport)();
+  const viewport = useViewport();
   const {
     dividers,
     list,
@@ -37,17 +32,17 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
     stackSpace,
     stackGap,
     stackJustify
-  } = (0, _ThemeProvider.useThemeTokens)('QuickLinks', tokens, variant, {
+  } = useThemeTokens('QuickLinks', tokens, variant, {
     viewport
   });
-  const content = list && /*#__PURE__*/(0, _jsxRuntime.jsx)(_List.default, {
+  const content = list && /*#__PURE__*/_jsx(List, {
     ref: ref,
     tokens: listTokens,
     showDivider: dividers,
     tag: tag,
     ...rest,
     children: children
-  }) || /*#__PURE__*/(0, _jsxRuntime.jsx)(_StackWrap.default, {
+  }) || /*#__PURE__*/_jsx(StackWrap, {
     space: stackSpace,
     gap: stackGap,
     tokens: {
@@ -57,28 +52,27 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
     ...rest,
     children: children
   });
-  return card ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_QuickLinksCard.default, {
+  return card ? /*#__PURE__*/_jsx(QuickLinksCard, {
     tokens: cardTokens,
     children: content
   }) : content;
 });
 QuickLinks.displayName = 'QuickLinks';
 QuickLinks.propTypes = {
-  tokens: (0, _utils.getTokensPropType)('QuickLinks'),
+  tokens: getTokensPropType('QuickLinks'),
   /**
    * Custom tokens override for `Card`
    */
-  cardTokens: (0, _utils.getTokensPropType)('Card'),
+  cardTokens: getTokensPropType('Card'),
   /**
    * Custom tokens override for `QuickLinksList`
    */
-  listTokens: (0, _utils.getTokensPropType)('QuickLinksList'),
+  listTokens: getTokensPropType('QuickLinksList'),
   /**
    * The HTML tag to render the list as
    */
-  tag: _propTypes.default.string,
-  variant: _utils.variantProp.propType,
-  children: _propTypes.default.node
+  tag: PropTypes.string,
+  variant: variantProp.propType,
+  children: PropTypes.node
 };
-var _default = QuickLinks;
-exports.default = _default;
+export default QuickLinks;

package/lib/QuickLinks/QuickLinksCard.js

@@ -1,29 +1,24 @@
-"use strict";
+import React from 'react';
+import PropTypes from 'prop-types';
+import { useThemeTokens } from '../ThemeProvider';
+import { getTokensPropType, variantProp } from '../utils';
+import CardBase from '../Card/CardBase';
 
-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 _utils = require("../utils");
-var _CardBase = _interopRequireDefault(require("../Card/CardBase"));
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /**
  * Private subcomponent for use within QuickLinks.
  *
  * Restyled Card with identical behaviour to Card, but themed according to the
  * QuickLinksCard theme rather than the Card theme.
- */const QuickLinksList = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+const QuickLinksList = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
     tokens,
     variant,
     children
   } = _ref;
-  const themeTokens = (0, _ThemeProvider.useThemeTokens)('QuickLinksCard', tokens, variant);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_CardBase.default, {
+  const themeTokens = useThemeTokens('QuickLinksCard', tokens, variant);
+  return /*#__PURE__*/_jsx(CardBase, {
     tokens: themeTokens,
     ref: ref,
     children: children
@@ -31,9 +26,8 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 });
 QuickLinksList.displayName = 'QuickLinksList';
 QuickLinksList.propTypes = {
-  tokens: (0, _utils.getTokensPropType)('QuickLinksCard'),
-  variant: _utils.variantProp.propType,
-  children: _propTypes.default.node
+  tokens: getTokensPropType('QuickLinksCard'),
+  variant: variantProp.propType,
+  children: PropTypes.node
 };
-var _default = QuickLinksList;
-exports.default = _default;
+export default QuickLinksList;

package/lib/QuickLinks/QuickLinksItem.js

@@ -1,43 +1,38 @@
-"use strict";
+import React from 'react';
+import PropTypes from 'prop-types';
+import { getTokensPropType, variantProp, withLinkRouter } from '../utils';
+import { useViewport } from '../ViewportProvider';
+import { useThemeTokens, useThemeTokensCallback } from '../ThemeProvider';
+import PressableListItemBase from '../List/PressableListItemBase';
+import ButtonBase from '../Button/ButtonBase';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _utils = require("../utils");
-var _ViewportProvider = require("../ViewportProvider");
-var _ThemeProvider = require("../ThemeProvider");
-var _PressableListItemBase = _interopRequireDefault(require("../List/PressableListItemBase"));
-var _ButtonBase = _interopRequireDefault(require("../Button/ButtonBase"));
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /**
  * Public component exported as QuickLinks.Item, for use as children of QuickLinks.
  *
  * Receives props injected by QuickLinks and renders the appropriate child component.
- */const QuickLinksItem = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
+ */
+import { jsx as _jsx } from "react/jsx-runtime";
+const QuickLinksItem = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
     tokens,
     variant,
     children,
     ...rest
   } = _ref;
-  const viewport = (0, _ViewportProvider.useViewport)();
+  const viewport = useViewport();
   const {
     list
-  } = (0, _ThemeProvider.useThemeTokens)('QuickLinks', tokens, variant, {
+  } = useThemeTokens('QuickLinks', tokens, variant, {
     viewport
   });
   const themeName = list ? 'QuickLinksList' : 'QuickLinksButton';
-  const getTokens = (0, _ThemeProvider.useThemeTokensCallback)(themeName, tokens, variant);
-  return list ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_PressableListItemBase.default, {
+  const getTokens = useThemeTokensCallback(themeName, tokens, variant);
+  return list ? /*#__PURE__*/_jsx(PressableListItemBase, {
     ref: ref,
     tokens: getTokens,
     ...rest,
     children: children
-  }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_ButtonBase.default, {
+  }) : /*#__PURE__*/_jsx(ButtonBase, {
     ref: ref,
     tokens: getTokens,
     ...rest,
@@ -46,12 +41,11 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 });
 QuickLinksItem.displayName = 'QuickLinksItem';
 QuickLinksItem.propTypes = {
-  ..._utils.withLinkRouter.propTypes,
-  ..._PressableListItemBase.default.propTypes,
-  ..._ButtonBase.default.propTypes,
-  tokens: (0, _utils.getTokensPropType)('QuickLinksList', 'QuickLinksButton'),
-  variant: _utils.variantProp.propType,
-  children: _propTypes.default.node
+  ...withLinkRouter.propTypes,
+  ...PressableListItemBase.propTypes,
+  ...ButtonBase.propTypes,
+  tokens: getTokensPropType('QuickLinksList', 'QuickLinksButton'),
+  variant: variantProp.propType,
+  children: PropTypes.node
 };
-var _default = (0, _utils.withLinkRouter)(QuickLinksItem);
-exports.default = _default;
+export default withLinkRouter(QuickLinksItem);

package/lib/QuickLinks/index.js

@@ -1,12 +1,4 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _QuickLinks = _interopRequireDefault(require("./QuickLinks"));
-var _QuickLinksItem = _interopRequireDefault(require("./QuickLinksItem"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-_QuickLinks.default.Item = _QuickLinksItem.default;
-var _default = _QuickLinks.default;
-exports.default = _default;
+import QuickLinks from './QuickLinks';
+import QuickLinksItem from './QuickLinksItem';
+QuickLinks.Item = QuickLinksItem;
+export default QuickLinks;

package/lib/QuickLinksFeature/QuickLinksFeature.js

@@ -1,22 +1,16 @@
-"use strict";
+import React from 'react';
+import PropTypes from 'prop-types';
+import { StackWrap } from '../StackView';
+import { useViewport } from '../ViewportProvider';
+import { useThemeTokens } from '../ThemeProvider';
+import { a11yProps, getTokensPropType, selectSystemProps, variantProp, viewProps } from '../utils';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _StackView = require("../StackView");
-var _ViewportProvider = require("../ViewportProvider");
-var _ThemeProvider = require("../ThemeProvider");
-var _utils = require("../utils");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 // pass through and type relevant system props - add more sets for interactive components
-const [selectProps, selectedSystemPropTypes] = (0, _utils.selectSystemProps)([_utils.a11yProps, _utils.viewProps]);
+import { jsx as _jsx } from "react/jsx-runtime";
+const [selectProps, selectedSystemPropTypes] = selectSystemProps([a11yProps, viewProps]);
 const isQuickListItem = element => {
   var _element$type, _element$type2;
-  const elementName = (element === null || element === void 0 ? void 0 : (_element$type = element.type) === null || _element$type === void 0 ? void 0 : _element$type.displayName) || (element === null || element === void 0 ? void 0 : (_element$type2 = element.type) === null || _element$type2 === void 0 ? void 0 : _element$type2.name);
+  const elementName = (element === null || element === void 0 || (_element$type = element.type) === null || _element$type === void 0 ? void 0 : _element$type.displayName) || (element === null || element === void 0 || (_element$type2 = element.type) === null || _element$type2 === void 0 ? void 0 : _element$type2.name);
   return Boolean(elementName.match(/QuickLinksFeatureItem/));
 };
 
@@ -24,7 +18,7 @@ const isQuickListItem = element => {
  * QuickLinksFeature renders a list of interactive items.
  *  - This is the base component that is used as a wrapper and accepts a List of `QuickLinksFeature.Item`
  */
-const QuickLinksFeature = /*#__PURE__*/_react.default.forwardRef((_ref, ref) => {
+const QuickLinksFeature = /*#__PURE__*/React.forwardRef((_ref, ref) => {
   let {
     tokens,
     variant,
@@ -32,21 +26,21 @@ const QuickLinksFeature = /*#__PURE__*/_react.default.forwardRef((_ref, ref) =>
     children,
     ...rest
   } = _ref;
-  const viewport = (0, _ViewportProvider.useViewport)();
+  const viewport = useViewport();
   const {
     stackGap,
     stackJustify,
     stackSpace
-  } = (0, _ThemeProvider.useThemeTokens)('QuickLinksFeature', tokens, variant, {
+  } = useThemeTokens('QuickLinksFeature', tokens, variant, {
     viewport
   });
-  const items = _react.default.Children.map(children, child => {
+  const items = React.Children.map(children, child => {
     if (isQuickListItem(child)) {
-      return /*#__PURE__*/_react.default.cloneElement(child, child.props);
+      return /*#__PURE__*/React.cloneElement(child, child.props);
     }
     return null;
   });
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_StackView.StackWrap, {
+  return /*#__PURE__*/_jsx(StackWrap, {
     space: stackSpace,
     gap: stackGap,
     tokens: {
@@ -61,16 +55,15 @@ const QuickLinksFeature = /*#__PURE__*/_react.default.forwardRef((_ref, ref) =>
 QuickLinksFeature.displayName = 'QuickLinksFeature';
 QuickLinksFeature.propTypes = {
   ...selectedSystemPropTypes,
-  tokens: (0, _utils.getTokensPropType)('QuickLinksFeature'),
-  variant: _utils.variantProp.propType,
+  tokens: getTokensPropType('QuickLinksFeature'),
+  variant: variantProp.propType,
   /**
    * Default wrapper tag, by default it's "ul"
    */
-  tag: _propTypes.default.string,
+  tag: PropTypes.string,
   /**
    * QuickLinksFeature.Item component
    */
-  children: _propTypes.default.node
+  children: PropTypes.node
 };
-var _default = QuickLinksFeature;
-exports.default = _default;
+export default QuickLinksFeature;

package/lib/QuickLinksFeature/QuickLinksFeatureItem.js

@@ -1,28 +1,22 @@
-"use strict";
+import React from 'react';
+import PropTypes from 'prop-types';
+import Image from "react-native-web/dist/exports/Image";
+import Platform from "react-native-web/dist/exports/Platform";
+import Text from "react-native-web/dist/exports/Text";
+import View from "react-native-web/dist/exports/View";
+import { getTokensPropType, variantProp, withLinkRouter, a11yProps, linkProps, selectSystemProps } from '../utils';
+import { useViewport } from '../ViewportProvider';
+import { applyTextStyles, useThemeTokensCallback } from '../ThemeProvider';
+import { Link } from '../Link';
+import { StackWrap } from '../StackView';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _Image = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Image"));
-var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
-var _Text = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Text"));
-var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
-var _utils = require("../utils");
-var _ViewportProvider = require("../ViewportProvider");
-var _ThemeProvider = require("../ThemeProvider");
-var _Link = require("../Link");
-var _StackView = require("../StackView");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 // pass through and type relevant system props - add more sets for interactive components
-const [selectProps, selectedSystemPropTypes] = (0, _utils.selectSystemProps)([_utils.a11yProps, _utils.linkProps]);
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const [selectProps, selectedSystemPropTypes] = selectSystemProps([a11yProps, linkProps]);
 const selectImageStyle = imageDimension => ({
   width: imageDimension,
   height: imageDimension,
-  ..._Platform.default.select({
+  ...Platform.select({
     // TODO: https://github.com/telus/universal-design-system/issues/487
     web: {
       transition: 'width 200ms, height 200ms'
@@ -61,7 +55,7 @@ const selectLinkToken = _ref2 => {
  *
  * It will receive a image source and a accessibility label and will render a link accordingly with the theme tokens
  */
-const QuickLinksFeatureItem = /*#__PURE__*/_react.default.forwardRef((_ref3, ref) => {
+const QuickLinksFeatureItem = /*#__PURE__*/React.forwardRef((_ref3, ref) => {
   let {
     tokens,
     variant,
@@ -70,9 +64,9 @@ const QuickLinksFeatureItem = /*#__PURE__*/_react.default.forwardRef((_ref3, ref
     imageSource,
     ...rest
   } = _ref3;
-  const viewport = (0, _ViewportProvider.useViewport)();
-  const getTokens = (0, _ThemeProvider.useThemeTokensCallback)('QuickLinksFeatureItem', tokens, variant);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Link.Link, {
+  const viewport = useViewport();
+  const getTokens = useThemeTokensCallback('QuickLinksFeatureItem', tokens, variant);
+  return /*#__PURE__*/_jsx(Link, {
     ref: ref,
     ...selectProps(rest),
     tokens: state => selectLinkToken(getTokens(state)),
@@ -98,29 +92,29 @@ const QuickLinksFeatureItem = /*#__PURE__*/_react.default.forwardRef((_ref3, ref
         focus
       });
       const textStyle = {
-        ...(0, _ThemeProvider.applyTextStyles)(themeTokens),
+        ...applyTextStyles(themeTokens),
         textDecorationLine: textLine
       };
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
+      return /*#__PURE__*/_jsx(View, {
         style: selectContainerStyle({
           ...themeTokens,
           contentMaxDimension
         }),
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_StackView.StackWrap, {
+        children: /*#__PURE__*/_jsx(StackWrap, {
           direction: contentDirection,
           space: contentSpace,
           gap: gap,
           tokens: {
             alignItems: contentAlignItems
           },
-          children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_View.default, {
+          children: /*#__PURE__*/_jsxs(View, {
             style: selectImageContainerStyle(contentMaxDimension),
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Image.default, {
+            children: [/*#__PURE__*/_jsx(Image, {
               accessibilityIgnoresInvertColors: true,
               imageAccessibilityLabel: imageAccessibilityLabel,
               source: imageSource,
               style: selectImageStyle(imageDimension)
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.default, {
+            }), /*#__PURE__*/_jsx(Text, {
               style: textStyle,
               children: children
             })]
@@ -132,22 +126,21 @@ const QuickLinksFeatureItem = /*#__PURE__*/_react.default.forwardRef((_ref3, ref
 });
 QuickLinksFeatureItem.displayName = 'QuickLinksFeatureItem';
 QuickLinksFeatureItem.propTypes = {
-  ..._utils.withLinkRouter.propTypes,
+  ...withLinkRouter.propTypes,
   ...selectedSystemPropTypes,
-  tokens: (0, _utils.getTokensPropType)('QuickLinksFeatureItem'),
-  variant: _utils.variantProp.propType,
+  tokens: getTokensPropType('QuickLinksFeatureItem'),
+  variant: variantProp.propType,
   /**
    * Text which will be rendered within the Link
    */
-  children: _propTypes.default.node.isRequired,
+  children: PropTypes.node.isRequired,
   /**
    * Image accessibility label
    */
-  imageAccessibilityLabel: _propTypes.default.string.isRequired,
+  imageAccessibilityLabel: PropTypes.string.isRequired,
   /**
    * Image node or Image url
    */
-  imageSource: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.node]).isRequired
+  imageSource: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired
 };
-var _default = (0, _utils.withLinkRouter)(QuickLinksFeatureItem);
-exports.default = _default;
+export default withLinkRouter(QuickLinksFeatureItem);

package/lib/QuickLinksFeature/index.js

@@ -1,12 +1,4 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _QuickLinksFeature = _interopRequireDefault(require("./QuickLinksFeature"));
-var _QuickLinksFeatureItem = _interopRequireDefault(require("./QuickLinksFeatureItem"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-_QuickLinksFeature.default.Item = _QuickLinksFeatureItem.default;
-var _default = _QuickLinksFeature.default;
-exports.default = _default;
+import QuickLinksFeature from './QuickLinksFeature';
+import QuickLinksFeatureItem from './QuickLinksFeatureItem';
+QuickLinksFeature.Item = QuickLinksFeatureItem;
+export default QuickLinksFeature;