@telus-uds/components-base 1.0.1 → 1.3.0

package/lib/List/List.js

@@ -15,7 +15,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _utils = require("../utils");
 
-var _propTypes2 = require("../utils/propTypes");
+var _props = require("../utils/props");
 
 var _ListItem = _interopRequireDefault(require("./ListItem"));
 
@@ -28,7 +28,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 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; }
 
 /**
- * A Unordered List component has a child a ListItem that
+ * An unordered List component has a child a ListItem that
  * allows icon, dividers and customized typography
  */
 const List = /*#__PURE__*/(0, _react.forwardRef)(({
@@ -43,7 +43,7 @@ const List = /*#__PURE__*/(0, _react.forwardRef)(({
     default: 'none'
   });
 
-  const a11y = _propTypes2.a11yProps.select(rest);
+  const a11y = _props.a11yProps.select(rest);
 
   const items = _react.Children.map(children, (child, index) => {
     if (child.type.name === _ListItem.default.name) {
@@ -66,8 +66,7 @@ const List = /*#__PURE__*/(0, _react.forwardRef)(({
   });
 });
 List.displayName = 'List';
-List.Item = _ListItem.default;
-List.propTypes = { ..._propTypes2.a11yProps.types,
+List.propTypes = { ..._props.a11yProps.types,
   tokens: (0, _utils.getTokensPropType)('List'),
   variant: _utils.variantProp.propType,
   children: (0, _utils.componentPropType)('ListItem'),

package/lib/List/ListItem.js

@@ -11,8 +11,6 @@ var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Vi
 
 var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
 
-var _Text = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Text"));
-
 var _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -57,6 +55,12 @@ const selectItemIconTokens = ({
   color: itemIconColor
 });
 
+const selectCommonIconStyles = ({
+  iconMarginTop
+}) => ({
+  marginTop: iconMarginTop
+});
+
 const selectSideItemContainerStyles = ({
   listGutter
 }) => ({
@@ -113,6 +117,7 @@ const ListItem = /*#__PURE__*/(0, _react.forwardRef)(({
   const itemBulletContainerStyles = selectBulletContainerStyles(themeTokens);
   const itemBulletStyles = selectBulletStyles(themeTokens);
   const iconTokens = selectItemIconTokens(themeTokens);
+  const commonIconStyles = selectCommonIconStyles(themeTokens);
   const sideItemContainerStyles = selectSideItemContainerStyles(themeTokens);
 
   const accessibilityRole = _Platform.default.select({
@@ -120,27 +125,12 @@ const ListItem = /*#__PURE__*/(0, _react.forwardRef)(({
     default: 'item'
   });
 
-  const areChildrenStrings = () => {
-    if (Array.isArray(children)) {
-      return children.every(child => typeof child === 'string');
-    }
-
-    return typeof children === 'string';
-  };
-
-  const renderItem = () => {
-    if (areChildrenStrings()) {
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.default, {
-        style: itemStyles,
-        children: children
-      });
-    }
-
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
-      style: staticStyles.wrap,
-      children: children
-    });
-  };
+  const renderItem = () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
+    style: staticStyles.wrap,
+    children: (0, _utils.wrapStringsInText)(children, {
+      style: itemStyles
+    })
+  });
   /**
    * Function responsible returning styling, in case the item is the last shouldn't
    * add extra margin on the bottom, if "showDivider" is true it should add a divider
@@ -171,7 +161,7 @@ const ListItem = /*#__PURE__*/(0, _react.forwardRef)(({
 
     if (icon) {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
-        style: [sideItemContainerStyles, areChildrenStrings() ? staticStyles.centeredIcons : undefined],
+        style: [sideItemContainerStyles, commonIconStyles],
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(IconComponent, {
           size: iconSize || iconTokens.size,
           color: iconColor || iconTokens.color
@@ -201,9 +191,6 @@ const staticStyles = _StyleSheet.default.create({
   itemContainer: {
     flexDirection: 'row'
   },
-  centeredIcons: {
-    justifyContent: 'center'
-  },
   wrap: {
     flex: 1
   }

package/lib/List/index.js

@@ -3,11 +3,26 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+Object.defineProperty(exports, "ListBase", {
+  enumerable: true,
+  get: function () {
+    return _List.default;
+  }
+});
+Object.defineProperty(exports, "ListItem", {
+  enumerable: true,
+  get: function () {
+    return _ListItem.default;
+  }
+});
 exports.default = void 0;
 
 var _List = _interopRequireDefault(require("./List"));
 
+var _ListItem = _interopRequireDefault(require("./ListItem"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+_List.default.Item = _ListItem.default;
 var _default = _List.default;
 exports.default = _default;

package/lib/Pagination/PageButton.js

@@ -78,18 +78,14 @@ const PageButton = /*#__PURE__*/(0, _react.forwardRef)(({
   });
 });
 PageButton.displayName = 'PageButton';
-PageButton.propTypes = {
-  // Spreading any props into a secondary component accessed like Pagination.PageButton
-  // crashes a Docusaurus props table, but only in production, not in development
-  onPress: _propTypes.default.func,
-  href: _propTypes.default.string,
-  // If the above is fixed, the above can be replaced with this which includes full a11y etc:
-  // ...linkProps.types,
+PageButton.propTypes = { ..._utils.linkProps.types,
   label: _propTypes.default.string,
   isActive: _propTypes.default.bool,
   copy: _utils.copyPropTypes,
   variant: _utils.variantProp.propType,
   tokens: (0, _utils.getTokensPropType)('PaginationPageButton')
 };
-var _default = PageButton;
+
+var _default = (0, _utils.withLinkRouter)(PageButton);
+
 exports.default = _default;

package/lib/Pagination/Pagination.js

@@ -55,7 +55,9 @@ const Pagination = /*#__PURE__*/(0, _react.forwardRef)(({
   variant,
   tokens,
   sideButtonVariant,
-  sideButtonTokens
+  sideButtonTokens,
+  LinkRouter,
+  linkRouterProps
 }, ref) => {
   const viewport = (0, _ViewportProvider.useViewport)();
   const {
@@ -93,13 +95,21 @@ const Pagination = /*#__PURE__*/(0, _react.forwardRef)(({
     direction: "previous",
     copy: copy,
     variant: sideButtonVariant,
-    tokens: sideButtonTokens
+    tokens: sideButtonTokens,
+    LinkRouter: LinkRouter,
+    linkRouterProps: linkRouterProps
   }), ...items.map((child, itemIndex) => {
     const buttonLabel = `${itemIndex + 1}`;
     const itemProps = getItemProps(itemIndex);
+    const ItemLinkRouter = itemProps.LinkRouter ?? LinkRouter;
+    const itemLinkRouterProps = { ...linkRouterProps,
+      ...itemProps.linkRouterProps
+    };
 
     if (shouldRenderButton(itemIndex)) {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_PageButton.default, { ...itemProps,
+        LinkRouter: ItemLinkRouter,
+        linkRouterProps: itemLinkRouterProps,
         label: buttonLabel,
         copy: copy,
         isActive: isItemActive(itemIndex)
@@ -118,7 +128,9 @@ const Pagination = /*#__PURE__*/(0, _react.forwardRef)(({
     direction: "next",
     copy: copy,
     variant: sideButtonVariant,
-    tokens: sideButtonTokens
+    tokens: sideButtonTokens,
+    LinkRouter: LinkRouter,
+    linkRouterProps: linkRouterProps
   })];
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
     style: staticStyles.container,
@@ -132,7 +144,7 @@ const Pagination = /*#__PURE__*/(0, _react.forwardRef)(({
 });
 _PageButton.default.displayName = 'PageButton';
 Pagination.PageButton = _PageButton.default;
-Pagination.propTypes = {
+Pagination.propTypes = { ..._utils.withLinkRouter.propTypes,
   children: (0, _utils.componentPropType)('PageButton'),
   copy: _utils.copyPropTypes,
   variant: _utils.variantProp.propType,

package/lib/Pagination/SideButton.js

@@ -125,5 +125,7 @@ SideButton.propTypes = {
   copy: _utils.copyPropTypes,
   ..._utils.linkProps.types
 };
-var _default = SideButton;
+
+var _default = (0, _utils.withLinkRouter)(SideButton);
+
 exports.default = _default;

package/lib/Progress/Progress.js

@@ -11,7 +11,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
 
-var _propTypes2 = require("../utils/propTypes");
+var _props = require("../utils/props");
 
 var _ThemeProvider = require("../ThemeProvider");
 
@@ -79,7 +79,7 @@ const Progress = /*#__PURE__*/(0, _react.forwardRef)(({
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
     ref: ref,
     style: selectProgressStyles(themeTokens),
-    ..._propTypes2.a11yProps.select(rest),
+    ..._props.a11yProps.select(rest),
     children: children
   });
 });

package/lib/Progress/ProgressBar.js

@@ -17,7 +17,7 @@ var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Vi
 
 var _ProgressBarBackground = _interopRequireDefault(require("./ProgressBarBackground"));
 
-var _propTypes2 = require("../utils/propTypes");
+var _props = require("../utils/props");
 
 var _ThemeProvider = require("../ThemeProvider");
 
@@ -102,7 +102,7 @@ const ProgressBar = /*#__PURE__*/(0, _react.forwardRef)(({
       now: percentage,
       text: `${percentage}%`
     },
-    ..._propTypes2.a11yProps.select(rest)
+    ..._props.a11yProps.select(rest)
   };
   return percentage > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
     ref: ref,

package/lib/Radio/Radio.js

@@ -25,7 +25,7 @@ var _ThemeProvider = require("../ThemeProvider");
 
 var _utils = require("../utils");
 
-var _propTypes2 = require("../utils/propTypes");
+var _props = require("../utils/props");
 
 var _StackView = _interopRequireDefault(require("../StackView"));
 
@@ -37,8 +37,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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; }
 
-// @todo move `LabelContent` outside of the `InputLabel` and fix
-// the issue with the cursor not being pointer on Web
 const selectContainerStyles = ({
   containerBackgroundColor,
   containerBorderRadius,
@@ -165,7 +163,7 @@ const Radio = /*#__PURE__*/(0, _react.forwardRef)(({
     if ((event === null || event === void 0 ? void 0 : event.key) === ' ') handleChange(event);
   };
 
-  const accessibilityProps = _propTypes2.a11yProps.select(rest);
+  const accessibilityProps = _props.a11yProps.select(rest);
 
   const uniqueId = (0, _utils.useUniqueId)('radio');
   const inputId = id ?? uniqueId;
@@ -220,7 +218,7 @@ const Radio = /*#__PURE__*/(0, _react.forwardRef)(({
   });
 });
 Radio.displayName = 'Radio';
-Radio.propTypes = { ..._propTypes2.a11yProps.propTypes,
+Radio.propTypes = { ..._props.a11yProps.propTypes,
 
   /**
    * Use `checked` for controlled Radio. For uncontrolled Radio, use the `defaultChecked` prop.

package/lib/Spacer/Spacer.js

@@ -24,8 +24,8 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 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; }
 
 /**
- * @typedef {import('../utils/propTypes.js').SpacingValue} SpacingValue
- * @typedef {import('../utils/propTypes.js').SpacingObject} SpacingObject
+ * @typedef {import('../utils/props/spacingProps.js').SpacingValue} SpacingValue
+ * @typedef {import('../utils/props/spacingProps.js').SpacingObject} SpacingObject
  */
 const selectSizeStyle = (size, direction) => ({
   // Only apply space in one direction at a time, else large spacers will increase the

package/lib/StackView/StackWrap.js

@@ -21,8 +21,15 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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; }
 
-// CSS.supports needs an example of the type of value you intend to use.
+// In Jest/CI/SSR, global CSS isn't always available and doesn't always have .supports method
+const cssSupports = (...args) => {
+  var _window$CSS;
+
+  return typeof window !== 'undefined' && typeof ((_window$CSS = window.CSS) === null || _window$CSS === void 0 ? void 0 : _window$CSS.supports) === 'function' && window.CSS.supports(...args);
+}; // CSS.supports needs an example of the type of value you intend to use.
 // Will be an integer appended `px` after hooks and JSX styles are resolved.
+
+
 const exampleGapValue = '1px';
 /**
  * StackWrap is an alternative to StackView where the spaced items are allowed to wrap.
@@ -33,15 +40,12 @@ const exampleGapValue = '1px';
  */
 
 const StackWrap = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
-  var _CSS;
-
   const {
     space
   } = props; // Don't apply separate gap if `null` or `undefined`, so can be unset in Storybook etc
 
   const gap = props.gap ?? space;
-  const canUseCSSGap = _Platform.default.OS === 'web' && gap === space && // In Jest/CI, global CSS isn't always available and doesn't always have .supports method
-  typeof ((_CSS = CSS) === null || _CSS === void 0 ? void 0 : _CSS.supports) === 'function' && CSS.supports('gap', exampleGapValue);
+  const canUseCSSGap = _Platform.default.OS === 'web' && gap === space && cssSupports('gap', exampleGapValue);
   return canUseCSSGap ?
   /*#__PURE__*/
   // If possible, use the cleaner implementation that applies CSS `gap` styles to the container.

package/lib/StackView/getStackedContent.js

@@ -24,7 +24,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 /**
  * @typedef {import('react').ReactChildren} ReactChildren
  * @typedef {import('react').ReactElement} ReactElement
- * @typedef {import('../utils/propTypes.js').SpacingValue} SpacingValue
+ * @typedef {import('../utils/props/spacingProps.js').SpacingValue} SpacingValue
  */
 
 /**

package/lib/StepTracker/StepTracker.js

@@ -21,7 +21,7 @@ var _ThemeProvider = require("../ThemeProvider");
 
 var _utils = require("../utils");
 
-var _propTypes2 = require("../utils/propTypes");
+var _props = require("../utils/props");
 
 var _ViewportProvider = require("../ViewportProvider");
 
@@ -136,7 +136,7 @@ const StepTracker = /*#__PURE__*/(0, _react.forwardRef)(({
       now: current,
       text: steps[current]
     },
-    ..._propTypes2.a11yProps.select(rest)
+    ..._props.a11yProps.select(rest)
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
     ref: ref,

package/lib/Tabs/Tabs.js

@@ -46,7 +46,9 @@ const Tabs = /*#__PURE__*/(0, _react.forwardRef)(({
   value,
   initialValue,
   onChange,
-  items = []
+  items = [],
+  LinkRouter,
+  linkRouterProps
 }, ref) => {
   const {
     space,
@@ -82,7 +84,9 @@ const Tabs = /*#__PURE__*/(0, _react.forwardRef)(({
         href,
         label,
         id,
-        ref: itemRef
+        ref: itemRef,
+        LinkRouter: ItemLinkRouter = LinkRouter,
+        linkRouterProps: itemLinkRouterProps
       }, index) => {
         const itemId = id ?? label;
         const isSelected = Boolean(currentValue && currentValue === itemId);
@@ -98,6 +102,10 @@ const Tabs = /*#__PURE__*/(0, _react.forwardRef)(({
           selected: isSelected,
           itemPositions: itemPositions,
           index: index,
+          LinkRouter: ItemLinkRouter,
+          linkRouterProps: { ...linkRouterProps,
+            ...itemLinkRouterProps
+          },
           children: label
         }, itemId);
       })
@@ -105,8 +113,8 @@ const Tabs = /*#__PURE__*/(0, _react.forwardRef)(({
   });
 });
 Tabs.displayName = 'Tabs';
-Tabs.propTypes = {
-  items: _propTypes.default.arrayOf(_propTypes.default.shape({
+Tabs.propTypes = { ..._utils.withLinkRouter.PropTypes,
+  items: _propTypes.default.arrayOf(_propTypes.default.shape({ ..._utils.withLinkRouter.PropTypes,
     href: _propTypes.default.string,
     label: _propTypes.default.string,
     id: _propTypes.default.string,

package/lib/Tabs/TabsItem.js

@@ -99,7 +99,6 @@ const selectContainerStyles = ({
 
 
 const TabsItem = /*#__PURE__*/(0, _react.forwardRef)(({
-  onPress,
   href,
   variant,
   tokens,
@@ -114,8 +113,14 @@ const TabsItem = /*#__PURE__*/(0, _react.forwardRef)(({
   } : {
     selected
   },
-  ...rest
+  ...rawRest
 }, ref) => {
+  // Convert onClick etc to onPress etc if used in an integration
+  const {
+    onPress,
+    ...rest
+  } = _utils.clickProps.toPressProps(rawRest);
+
   const getTokens = (0, _ThemeProvider.useThemeTokensCallback)('TabsItem', tokens, variant);
 
   const resolveTokens = pressableState => (0, _utils.resolvePressableTokens)(getTokens, pressableState, {
@@ -139,9 +144,9 @@ const TabsItem = /*#__PURE__*/(0, _react.forwardRef)(({
     href
   });
 
-  const handlePress = onPress || openHref ? () => {
-    if (onPress) onPress();
-    if (openHref) openHref();
+  const handlePress = onPress || openHref ? (...args) => {
+    if (onPress) onPress(...args);
+    if (openHref) openHref(...args);
   } : undefined;
   const a11y = {
     accessibilityRole,
@@ -234,5 +239,6 @@ const staticStyles = _StyleSheet.default.create({
   }
 });
 
-var _default = TabsItem;
+var _default = (0, _utils.withLinkRouter)(TabsItem);
+
 exports.default = _default;

package/lib/Tags/Tags.js

@@ -27,7 +27,7 @@ var _ViewportProvider = require("../ViewportProvider");
 
 var _ThemeProvider = require("../ThemeProvider");
 
-var _propTypes2 = require("../utils/propTypes");
+var _props = require("../utils/props");
 
 var _input = require("../utils/input");
 
@@ -97,14 +97,14 @@ const Tags = /*#__PURE__*/(0, _react.forwardRef)(({
   const themeTokens = (0, _ThemeProvider.useThemeTokens)('Tags', tokens, variant, {
     viewport
   });
-  const stackTokens = (0, _propTypes2.selectTokens)('StackView', themeTokens);
+  const stackTokens = (0, _props.selectTokens)('StackView', themeTokens);
   const {
     direction,
     space
   } = themeTokens;
   const getItemTokens = (0, _ThemeProvider.useThemeTokensCallback)('TagsItem', tokens, variant);
 
-  const getButtonTokens = buttonState => (0, _propTypes2.selectTokens)('Button', getItemTokens(buttonState));
+  const getButtonTokens = buttonState => (0, _props.selectTokens)('Button', getItemTokens(buttonState));
 
   const {
     currentValues,
@@ -117,7 +117,7 @@ const Tags = /*#__PURE__*/(0, _react.forwardRef)(({
     readOnly
   });
 
-  const a11y = _propTypes2.a11yProps.select({
+  const a11y = _props.a11yProps.select({
     accessibilityRole,
     ...rest
   });
@@ -154,7 +154,7 @@ const Tags = /*#__PURE__*/(0, _react.forwardRef)(({
         },
         accessibilityRole: itemA11yRole,
         accessibilityLabel,
-        ..._propTypes2.a11yProps.getPositionInSet(items.length, index)
+        ..._props.a11yProps.getPositionInSet(items.length, index)
       };
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ButtonBase.default, {
         ref: itemRef,
@@ -202,10 +202,10 @@ const Tags = /*#__PURE__*/(0, _react.forwardRef)(({
   });
 });
 Tags.displayName = 'Tags';
-Tags.propTypes = { ..._propTypes2.a11yProps.propTypes,
-  ..._propTypes2.pressProps.propTypes,
-  tokens: (0, _propTypes2.getTokensPropType)('Tags'),
-  variant: _propTypes2.variantProp.propType,
+Tags.propTypes = { ..._props.a11yProps.propTypes,
+  ..._props.pressProps.propTypes,
+  tokens: (0, _props.getTokensPropType)('Tags'),
+  variant: _props.variantProp.propType,
 
   /**
    * If provided, sets a maximum number of items a user may select at once.

package/lib/ThemeProvider/useThemeTokens.js

@@ -14,9 +14,9 @@ var _utils = require("./utils");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /**
- * @typedef {import('../utils/propTypes.js').AppearanceSet} AppearanceSet
- * @typedef {import('../utils/propTypes.js').TokensProp} TokensProp
- * @typedef {import('../utils/propTypes.js').TokensSet} TokensSet
+ * @typedef {import('../utils/props/variantProp.js').AppearanceSet} AppearanceSet
+ * @typedef {import('../utils/props/tokens.js').TokensProp} TokensProp
+ * @typedef {import('../utils/props/tokens.js').TokensSet} TokensSet
  */
 
 /**

package/lib/ThemeProvider/utils/theme-tokens.js

@@ -14,9 +14,9 @@ var _package = _interopRequireDefault(require("../../../package.json"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /**
- * @typedef {import('../../utils/propTypes.js').AppearanceSet} AppearanceSet
- * @typedef {import('../../utils/propTypes.js').TokensProp} TokensProp
- * @typedef {import('../../utils/propTypes.js').TokensSet} TokensSet
+ * @typedef {import('../../utils/props/variantProp.js').AppearanceSet} AppearanceSet
+ * @typedef {import('../../utils/props/tokens.js').TokensProp} TokensProp
+ * @typedef {import('../../utils/props/tokens.js').TokensSet} TokensSet
  */
 
 /**