@telus-uds/components-web 4.2.0 → 4.3.0

package/CHANGELOG.md

@@ -1,12 +1,37 @@
 # Change Log - @telus-uds/components-web
 
-This log was last generated on Fri, 14 Feb 2025 18:59:39 GMT and should not be manually modified.
+This log was last generated on Tue, 11 Mar 2025 21:13:58 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## 4.3.0
+
+Tue, 11 Mar 2025 21:13:58 GMT
+
+### Minor changes
+
+- `Tooltip`: Customized/optional type props (shivam.gupta3@telus.com)
+- Bump @telus-uds/components-base to v3.4.0
+
+### Patches
+
+- `Table`: fix row border tokens (guillermo.peitzner@telus.com)
+- `Card`: fix interactiveCard background color (guillermo.peitzner@telus.com)
+
+## 4.2.1
+
+Wed, 05 Mar 2025 00:06:37 GMT
+
+### Patches
+
+- `Alignment`: fix Typography align issue when using `align` (sergio.ramirez@telus.com)
+- `List`: remove textAlign parent value (sergio.ramirez@telus.com)
+- `Breadcrumbs`: fix layout shifts (guillermo.peitzner@telus.com)
+- Bump @telus-uds/components-base to v3.3.0
+
 ## 4.2.0
 
-Fri, 14 Feb 2025 18:59:39 GMT
+Fri, 14 Feb 2025 19:03:35 GMT
 
 ### Minor changes
 

package/lib/cjs/Breadcrumbs/Breadcrumbs.js

@@ -174,7 +174,7 @@ const Breadcrumbs = /*#__PURE__*/_react.default.forwardRef((_ref2, ref) => {
       setItemsToBeRendered(activeRoutes);
     }
   }, [viewport, activeRoutes, optionsHidden, itemsToBeRendered, newItems]);
-  const items = getItems(itemsToBeRendered, params, !children);
+  const items = getItems(itemsToBeRendered.length > 0 ? itemsToBeRendered : activeRoutes, params, !children);
   const themeTokens = (0, _componentsBase.useThemeTokens)('Breadcrumbs', tokens, variant);
   const metadata = /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactHelmetAsync.HelmetProvider, {
     context: helmetContext,

package/lib/cjs/Table/Row.js

@@ -13,7 +13,7 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
 const StyledTR = /*#__PURE__*/_styledComponents.default.tr.withConfig({
   displayName: "Row__StyledTR",
   componentId: "components-web__sc-6pbb9a-0"
-})(["&:hover{background-color:", " !important;}border-style:", ";border-color:", ";border-width:", ";border-top-width:", ";"], _ref => {
+})(["&:hover{background-color:", " !important;}border-style:", ";border-color:", ";border-width:", "px;border-top-width:", "px;"], _ref => {
   let {
     tokens
   } = _ref;
@@ -32,12 +32,12 @@ const StyledTR = /*#__PURE__*/_styledComponents.default.tr.withConfig({
   let {
     tokens
   } = _ref4;
-  return tokens?.rowBorderWidth || '0px';
+  return `${tokens?.rowBorderWidth}` || 0;
 }, _ref5 => {
   let {
     tokens
   } = _ref5;
-  return tokens?.rowBorderTopWidth || tokens?.rowBorderWidth;
+  return `${tokens?.rowBorderTopWidth}` || tokens?.rowBorderWidth;
 });
 const Row = /*#__PURE__*/_react.default.forwardRef((_ref6, ref) => {
   let {

package/lib/cjs/Table/Table.js

@@ -20,7 +20,7 @@ const StyledContainer = /*#__PURE__*/_styledComponents.default.div.withConfig({
 const StyledTable = /*#__PURE__*/_styledComponents.default.table.withConfig({
   displayName: "Table__StyledTable",
   componentId: "components-web__sc-10d9q3m-1"
-})(["margin:0;padding:0;width:", ";border:", ";"], _ref => {
+})(["margin:0;padding:0;width:", ";border:", ";border-collapse:collapse;"], _ref => {
   let {
     fullWidth,
     tableWidth

package/lib/esm/Breadcrumbs/Breadcrumbs.js

@@ -165,7 +165,7 @@ const Breadcrumbs = /*#__PURE__*/React.forwardRef((_ref2, ref) => {
       setItemsToBeRendered(activeRoutes);
     }
   }, [viewport, activeRoutes, optionsHidden, itemsToBeRendered, newItems]);
-  const items = getItems(itemsToBeRendered, params, !children);
+  const items = getItems(itemsToBeRendered.length > 0 ? itemsToBeRendered : activeRoutes, params, !children);
   const themeTokens = useThemeTokens('Breadcrumbs', tokens, variant);
   const metadata = /*#__PURE__*/_jsx(HelmetProvider, {
     context: helmetContext,

package/lib/esm/Table/Row.js

@@ -6,7 +6,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 const StyledTR = /*#__PURE__*/styled.tr.withConfig({
   displayName: "Row__StyledTR",
   componentId: "components-web__sc-6pbb9a-0"
-})(["&:hover{background-color:", " !important;}border-style:", ";border-color:", ";border-width:", ";border-top-width:", ";"], _ref => {
+})(["&:hover{background-color:", " !important;}border-style:", ";border-color:", ";border-width:", "px;border-top-width:", "px;"], _ref => {
   let {
     tokens
   } = _ref;
@@ -25,12 +25,12 @@ const StyledTR = /*#__PURE__*/styled.tr.withConfig({
   let {
     tokens
   } = _ref4;
-  return tokens?.rowBorderWidth || '0px';
+  return `${tokens?.rowBorderWidth}` || 0;
 }, _ref5 => {
   let {
     tokens
   } = _ref5;
-  return tokens?.rowBorderTopWidth || tokens?.rowBorderWidth;
+  return `${tokens?.rowBorderTopWidth}` || tokens?.rowBorderWidth;
 });
 const Row = /*#__PURE__*/React.forwardRef((_ref6, ref) => {
   let {

package/lib/esm/Table/Table.js

@@ -13,7 +13,7 @@ const StyledContainer = /*#__PURE__*/styled.div.withConfig({
 const StyledTable = /*#__PURE__*/styled.table.withConfig({
   displayName: "Table__StyledTable",
   componentId: "components-web__sc-10d9q3m-1"
-})(["margin:0;padding:0;width:", ";border:", ";"], _ref => {
+})(["margin:0;padding:0;width:", ";border:", ";border-collapse:collapse;"], _ref => {
   let {
     fullWidth,
     tableWidth

package/package.json

@@ -5,7 +5,7 @@
   ],
   "dependencies": {
     "@gorhom/portal": "^1.0.14",
-    "@telus-uds/components-base": "^3.2.0",
+    "@telus-uds/components-base": "^3.4.0",
     "@telus-uds/system-constants": "^3.0.0",
     "fscreen": "^1.2.0",
     "lodash.omit": "^4.5.0",
@@ -82,5 +82,5 @@
     "skip": true
   },
   "types": "types/index.d.ts",
-  "version": "4.2.0"
+  "version": "4.3.0"
 }

package/src/Breadcrumbs/Breadcrumbs.jsx

@@ -186,7 +186,11 @@ const Breadcrumbs = React.forwardRef(
       }
     }, [viewport, activeRoutes, optionsHidden, itemsToBeRendered, newItems])
 
-    const items = getItems(itemsToBeRendered, params, !children)
+    const items = getItems(
+      itemsToBeRendered.length > 0 ? itemsToBeRendered : activeRoutes,
+      params,
+      !children
+    )
     const themeTokens = useThemeTokens('Breadcrumbs', tokens, variant)
 
     const metadata = (

package/src/Table/Row.jsx

@@ -10,8 +10,8 @@ const StyledTR = styled.tr`
   border-style: ${({ tokens }) =>
     tokens?.rowBorderWidth || tokens?.rowBorderTopWidth ? 'solid' : 'none'};
   border-color: ${({ tokens }) => tokens?.rowBorderColor};
-  border-width: ${({ tokens }) => tokens?.rowBorderWidth || '0px'};
-  border-top-width: ${({ tokens }) => tokens?.rowBorderTopWidth || tokens?.rowBorderWidth};
+  border-width: ${({ tokens }) => `${tokens?.rowBorderWidth}` || 0}px;
+  border-top-width: ${({ tokens }) => `${tokens?.rowBorderTopWidth}` || tokens?.rowBorderWidth}px;
 `
 
 const Row = React.forwardRef(({ children, tokens: rowTokens }, ref) => {

package/src/Table/Table.jsx

@@ -22,6 +22,7 @@ const StyledTable = styled.table`
   padding: 0;
   width: ${({ fullWidth, tableWidth }) => (fullWidth ? '100%' : `${tableWidth}px`)};
   border: ${(props) => `${props.borderWidth}px solid ${props.borderColor}`};
+  border-collapse: collapse;
 `
 
 const TableContext = React.createContext({})

package/types/Tooltip.d.ts

@@ -12,6 +12,8 @@ export interface TooltipProps extends A11yProps, ViewProps {
   tooltipButtonTokens?: Tokens
   variant?: Variant
   onPress?: () => void
+  inline?: boolean
+  activateOnHover?: boolean
 }
 
 declare const Tooltip: ComponentType<TooltipProps>