@telus-uds/components-web 2.21.2 → 2.23.0

package/CHANGELOG.md

@@ -1,12 +1,33 @@
 # Change Log - @telus-uds/components-web
 
-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 -->
 
+## 2.23.0
+
+Fri, 10 Nov 2023 22:28:25 GMT
+
+### Minor changes
+
+- Ribbon component modified to match design intention (35577399+JoshHC@users.noreply.github.com)
+- Bump @telus-uds/components-base to v1.67.1
+- Bump @telus-uds/system-theme-tokens to v2.44.1
+
+## 2.22.0
+
+Tue, 07 Nov 2023 16:32:21 GMT
+
+### Minor changes
+
+- enable ability to position rate text (evander.owusu@telus.com)
+- test deleted for modal from components web (35577399+JoshHC@users.noreply.github.com)
+- Bump @telus-uds/components-base to v1.67.0
+- Bump @telus-uds/system-theme-tokens to v2.44.0
+
 ## 2.21.2
 
-Wed, 01 Nov 2023 00:54:31 GMT
+Wed, 01 Nov 2023 01:05:43 GMT
 
 ### Patches
 

package/lib/Badge/Badge.js

@@ -4,23 +4,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _componentsBase = require("@telus-uds/components-base");
-
 var _utils = require("../utils");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 const [selectProps, selectedSystemPropTypes] = (0, _componentsBase.selectSystemProps)([_utils.htmlAttrs]);
-
 const BadgeContainer = /*#__PURE__*/_styledComponents.default.div.withConfig({
   displayName: "Badge__BadgeContainer",
   componentId: "components-web__sc-tsiuo2-0"
@@ -57,7 +48,6 @@ const BadgeContainer = /*#__PURE__*/_styledComponents.default.div.withConfig({
 	    ${gradient && '-webkit-text-fill-color: transparent;'}
     }`;
 });
-
 const Badge = _ref6 => {
   let {
     children,
@@ -88,13 +78,11 @@ const Badge = _ref6 => {
   } = variant;
   let background = backgroundColor;
   const isOutlineOffer = purpose === 'offer' && outline;
-
   if ((isOutlineOffer || alternative) && gradient) {
     background = `linear-gradient(#fff 0 0) padding-box, ${semanticGradient} border-box`;
   } else if (purpose === 'offer' && gradient) {
     background = semanticGradient;
   }
-
   const fontSizeMapping = {
     12: 'micro',
     14: 'small',
@@ -124,8 +112,8 @@ const Badge = _ref6 => {
     })
   });
 };
-
-Badge.propTypes = { ...selectedSystemPropTypes,
+Badge.propTypes = {
+  ...selectedSystemPropTypes,
   children: _propTypes.default.node,
   tokens: (0, _componentsBase.getTokensPropType)('Badge'),
   variant: _propTypes.default.exact({

package/lib/Badge/index.js

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

package/lib/BlockQuote/BlockQuote.js

@@ -4,23 +4,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _componentsBase = require("@telus-uds/components-base");
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _utils = require("../utils");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 const [selectProps, selectedSystemPropTypes] = (0, _componentsBase.selectSystemProps)([_utils.htmlAttrs]);
-
 const BlockQuoteContainer = /*#__PURE__*/_styledComponents.default.blockquote.withConfig({
   displayName: "BlockQuote__BlockQuoteContainer",
   componentId: "components-web__sc-vals3u-0"
@@ -55,7 +46,6 @@ const BlockQuoteContainer = /*#__PURE__*/_styledComponents.default.blockquote.wi
   } = _ref6;
   return backgroundGradient && (0, _utils.transformGradient)(backgroundGradient);
 });
-
 const QuoteContainer = /*#__PURE__*/_styledComponents.default.div.withConfig({
   displayName: "BlockQuote__QuoteContainer",
   componentId: "components-web__sc-vals3u-1"
@@ -65,7 +55,6 @@ const QuoteContainer = /*#__PURE__*/_styledComponents.default.div.withConfig({
   } = _ref7;
   return `${marginBottom}px`;
 });
-
 const BlockQuote = _ref8 => {
   let {
     children,
@@ -116,7 +105,6 @@ const BlockQuote = _ref8 => {
     fontWeight: titleFontWeight,
     lineHeight: titleLineHeight
   };
-
   const renderLink = () => {
     if (linkHref) {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_componentsBase.Link, {
@@ -136,7 +124,6 @@ const BlockQuote = _ref8 => {
         children: link
       });
     }
-
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(_componentsBase.Typography, {
       tokens: {
         color,
@@ -148,7 +135,6 @@ const BlockQuote = _ref8 => {
       children: link
     });
   };
-
   const renderQuote = () => {
     const quote = /*#__PURE__*/(0, _jsxRuntime.jsx)(_componentsBase.Typography, {
       tokens: {
@@ -160,18 +146,16 @@ const BlockQuote = _ref8 => {
       },
       children: children
     });
-
     if (additionalInfo || link) {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(QuoteContainer, {
         marginBottom: marginBottom,
         children: quote
       });
     }
-
     return quote;
   };
-
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(BlockQuoteContainer, { ...selectProps(rest),
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(BlockQuoteContainer, {
+    ...selectProps(rest),
     paddingTop: paddingTop,
     paddingBottom: paddingBottom,
     paddingLeft: paddingLeft,
@@ -192,35 +176,30 @@ const BlockQuote = _ref8 => {
     })]
   });
 };
-
-BlockQuote.propTypes = { ...selectedSystemPropTypes,
+BlockQuote.propTypes = {
+  ...selectedSystemPropTypes,
   ..._componentsBase.withLinkRouter.propTypes,
   tokens: (0, _componentsBase.getTokensPropType)('BlockQuote'),
   variant: _propTypes.default.exact({
     alternative: _propTypes.default.bool,
     size: _propTypes.default.string
   }),
-
   /**
    * Children nodes that can be added
    */
   children: _propTypes.default.node.isRequired,
-
   /**
    * External source's identifier (e.g. author's name)
    */
   link: _propTypes.default.string,
-
   /**
    * External source's URL
    */
   linkHref: _propTypes.default.string,
-
   /**
    * To provide additional information about the source, rendered underneath `link`
    */
   additionalInfo: _propTypes.default.string,
-
   /**
    * Whether to render BlockQuote as a heading size of `h3` or large text size
    */

package/lib/BlockQuote/index.js

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

package/lib/Breadcrumbs/Breadcrumbs.js

@@ -4,31 +4,18 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _reactHelmetAsync = require("react-helmet-async");
-
 var _componentsBase = require("@telus-uds/components-base");
-
 var _utils = require("../utils");
-
 var _Item = _interopRequireDefault(require("./Item/Item"));
-
 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, _componentsBase.selectSystemProps)([_utils.htmlAttrs]);
-
 const StyledList = /*#__PURE__*/_styledComponents.default.ol.withConfig({
   displayName: "Breadcrumbs__StyledList",
   componentId: "components-web__sc-gwwxrc-0"
@@ -42,7 +29,6 @@ const StyledList = /*#__PURE__*/_styledComponents.default.ol.withConfig({
   padding: 0,
   alignItems: 'baseline'
 });
-
 const omitProps = _ref => {
   let {
     current,
@@ -55,12 +41,10 @@ const omitProps = _ref => {
   } = _ref;
   return props;
 };
-
 const getBreadcrumbName = (item, params) => {
   if (!item.breadcrumbName) {
     return null;
   }
-
   let {
     breadcrumbName
   } = item;
@@ -69,26 +53,20 @@ const getBreadcrumbName = (item, params) => {
   });
   return breadcrumbName;
 };
-
 const getPath = (path, params, concatenatePaths, paths) => {
   let p = path;
-
   if (concatenatePaths) {
     p = p.replace(/^\//, '');
     Object.keys(params).forEach(key => {
       p = p.replace(`:${key}`, params[key]);
     });
-
     if (p) {
       paths.push(p);
     }
-
     return `/${paths.join('/')}`;
   }
-
   return p;
 };
-
 const getItems = (items, params, concatenatePaths) => {
   const paths = [];
   return items.filter(item => item.path).map((item, i, filteredItems) => {
@@ -109,7 +87,6 @@ const getItems = (items, params, concatenatePaths) => {
     };
   });
 };
-
 const getStructuredData = (items, baseUrl) => {
   return items.map((item, index) => ({
     '@type': 'ListItem',
@@ -120,11 +97,10 @@ const getStructuredData = (items, baseUrl) => {
     }
   }));
 };
+
 /**
  * Display a hierarchy of links, commonly used for navigation.
  */
-
-
 const Breadcrumbs = _ref2 => {
   let {
     baseUrl,
@@ -139,7 +115,6 @@ const Breadcrumbs = _ref2 => {
   } = _ref2;
   // React Helmet can cause a memory leak in SSR if not properly configured.
   // Only run it in SSR if theme options tells us to.
-
   /* const {
     themeOptions: { enableHelmetSSR }
   } = useTheme() */
@@ -192,15 +167,18 @@ const Breadcrumbs = _ref2 => {
           linkRouterProps: itemLinkRouterProps,
           ...itemRest
         } = _ref4;
-        return /*#__PURE__*/(0, _react.createElement)(_Item.default, { ...itemRest,
+        return /*#__PURE__*/(0, _react.createElement)(_Item.default, {
+          ...itemRest,
           current: current,
           href: href,
           tokens: tokens,
           key: href,
-          linkRouterProps: { ...linkRouterProps,
+          linkRouterProps: {
+            ...linkRouterProps,
             ...itemLinkRouterProps
           },
-          variant: { ...variant,
+          variant: {
+            ...variant,
             size: 'micro'
           },
           LinkRouter: ItemLinkRouter
@@ -209,26 +187,22 @@ const Breadcrumbs = _ref2 => {
     }), metadata]
   });
 };
-
-Breadcrumbs.propTypes = { ...selectedSystemPropTypes,
+Breadcrumbs.propTypes = {
+  ...selectedSystemPropTypes,
   tokens: (0, _componentsBase.getTokensPropType)('Breadcrumbs'),
   ..._componentsBase.withLinkRouter.propTypes,
-
   /**
    * Base URL used to build structured data.
    */
   baseUrl: _propTypes.default.string,
-
   /**
    * A list of Items to be used as an alternative to the `routes` prop.
    */
   children: (0, _componentsBase.componentPropType)('Item'),
-
   /**
    * React Router params.
    */
   params: _propTypes.default.object,
-
   /**
    * An array of routes to be displayed as breadcrumbs.
    */
@@ -236,7 +210,6 @@ Breadcrumbs.propTypes = { ...selectedSystemPropTypes,
     path: _propTypes.default.string,
     breadcrumbName: _propTypes.default.string
   })),
-
   /**
    * Variant to render.
    */

package/lib/Breadcrumbs/Item/Item.js

@@ -4,27 +4,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _componentsBase = require("@telus-uds/components-base");
-
 var _utils = 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; }
-
 const [selectProps, selectedSystemPropTypes] = (0, _componentsBase.selectSystemProps)([_utils.htmlAttrs]);
-
 const StyledItemContainer = /*#__PURE__*/_styledComponents.default.li.withConfig({
   displayName: "Item__StyledItemContainer",
   componentId: "components-web__sc-1rfdaul-0"
@@ -37,7 +26,6 @@ const StyledItemContainer = /*#__PURE__*/_styledComponents.default.li.withConfig
     return `${listItemPadding}px`;
   }
 });
-
 const IconContainer = /*#__PURE__*/_styledComponents.default.span.withConfig({
   displayName: "Item__IconContainer",
   componentId: "components-web__sc-1rfdaul-1"
@@ -67,7 +55,6 @@ const IconContainer = /*#__PURE__*/_styledComponents.default.span.withConfig({
     }).fontFamily;
   }
 });
-
 const Item = /*#__PURE__*/(0, _react.forwardRef)((_ref5, ref) => {
   let {
     href,
@@ -91,20 +78,24 @@ const Item = /*#__PURE__*/(0, _react.forwardRef)((_ref5, ref) => {
     fontSize,
     ...themeTokens
   } = (0, _componentsBase.useThemeTokens)('Breadcrumbs', tokens, variant);
-  const linkOptions = { ..._componentsBase.clickProps.toPressProps(selectProps(rest)),
+  const linkOptions = {
+    ..._componentsBase.clickProps.toPressProps(selectProps(rest)),
     href
   };
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledItemContainer, { ...themeTokens,
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledItemContainer, {
+    ...themeTokens,
     children: current ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_componentsBase.Typography, {
       tokens: {
         color: currentColor,
         fontSize
       },
-      variant: { ...variant
+      variant: {
+        ...variant
       },
       children: children
     }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_componentsBase.Link, { ...linkOptions,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_componentsBase.Link, {
+        ...linkOptions,
         ref: ref,
         tokens: {
           color,
@@ -114,7 +105,8 @@ const Item = /*#__PURE__*/(0, _react.forwardRef)((_ref5, ref) => {
         linkRouterProps: linkRouterProps,
         variant: variant,
         children: children
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(IconContainer, { ...themeTokens,
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(IconContainer, {
+        ...themeTokens,
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ChevronRightIcon, {
           size: iconSize,
           color: iconColor
@@ -124,35 +116,33 @@ const Item = /*#__PURE__*/(0, _react.forwardRef)((_ref5, ref) => {
   });
 });
 Item.displayName = 'Item';
-Item.propTypes = { ...selectedSystemPropTypes,
-
+Item.propTypes = {
+  ...selectedSystemPropTypes,
   /**
    * Breadcrumb text
    */
   children: _propTypes.default.node.isRequired,
-
   /**
    * @ignore
    *
    * Indicates whether or not the Item should be as current/active
    */
   current: _propTypes.default.bool,
-
   /**
    * Target URL. This will be converted to `to` if the `LinkRouter`
    * prop is provided to the `Item` or parent `Breadcrumbs` element.
    */
   href: _propTypes.default.string.isRequired,
-
   /**
    * Variant to render.
    */
   variant: _propTypes.default.shape({
     inverse: _propTypes.default.bool
   })
-}; // Since react/require-default-props eslint rule doesn't pick up default arguments as default props when combined with `forwardRef`
-// - probably related https://github.com/yannickcr/eslint-plugin-react/issues/2760
+};
 
+// Since react/require-default-props eslint rule doesn't pick up default arguments as default props when combined with `forwardRef`
+// - probably related https://github.com/yannickcr/eslint-plugin-react/issues/2760
 Item.defaultProps = {
   current: false,
   variant: {

package/lib/Breadcrumbs/index.js

@@ -9,7 +9,5 @@ Object.defineProperty(exports, "default", {
     return _Breadcrumbs.default;
   }
 });
-
 var _Breadcrumbs = _interopRequireDefault(require("./Breadcrumbs"));
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/lib/Callout/Callout.js

@@ -4,56 +4,39 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _styledComponents = _interopRequireDefault(require("styled-components"));
-
 var _componentsBase = require("@telus-uds/components-base");
-
 var _utils = require("../utils");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
 const [selectProps, selectedSystemPropTypes] = (0, _componentsBase.selectSystemProps)([_utils.htmlAttrs]);
-
 const getAlignment = (rounded, textAlignToFlex) => {
   if (textAlignToFlex) {
     switch (textAlignToFlex) {
       case 'left':
         return 'flex-star';
-
       case 'center':
         return 'center';
-
       default:
         return 'flex-start';
     }
   }
-
   return rounded ? 'center' : ' flex-start';
 };
-
 const verticalAlignToFlex = verticalAlign => {
   switch (verticalAlign) {
     case 'top':
       return 'flex-start';
-
     case 'middle':
       return 'center';
-
     case 'bottom':
       return 'flex-end';
-
     default:
       return 'top';
   }
 };
-
 const CalloutContainer = /*#__PURE__*/_styledComponents.default.div.withConfig({
   displayName: "Callout__CalloutContainer",
   componentId: "components-web__sc-1a7ptx-0"
@@ -77,7 +60,6 @@ const CalloutContainer = /*#__PURE__*/_styledComponents.default.div.withConfig({
     alignItems: verticalAlignToFlex(verticalAlign)
   };
 });
-
 const Callout = _ref2 => {
   let {
     icon,
@@ -134,25 +116,21 @@ const Callout = _ref2 => {
     })]
   });
 };
-
-Callout.propTypes = { ...selectedSystemPropTypes,
+Callout.propTypes = {
+  ...selectedSystemPropTypes,
   tokens: (0, _componentsBase.getTokensPropType)('Callout'),
-
   /**
    * Icon to display on the left side of the Callout
    */
   icon: _propTypes.default.elementType,
-
   /**
    * Children nodes that can be added
    */
   children: _propTypes.default.node.isRequired,
-
   /**
    * To change the horizontal alignment of the Callout's text
    */
   textAlignToFlex: _propTypes.default.oneOf(['center', 'left']),
-
   /**
    * To change the vertical alignment of the Callout's icon
    */

package/lib/Callout/index.js

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