@kaizen/components 0.0.0-canary-debug-kaizen-provider-20241223031700 → 0.0.0-canary-debug-kaizen-provider-20250107211815

package/dist/cjs/Filter/FilterBar/subcomponents/AddFiltersMenu/AddFiltersMenu.cjs

@@ -18,7 +18,7 @@ var AddFiltersMenu = function () {
   var buttonRef = React.useRef(null);
   var menuButtonLabel = formatMessage({
     id: 'filterBar.addFiltersMenu.buttonLabel',
-    defaultMessage: 'Add Filters',
+    defaultMessage: 'Add filters',
     description: 'Menu button label to show additional available filter options'
   });
   var _a = FilterBarContext.useFilterBarContext(),

package/dist/cjs/LinkButton/LinkButton.cjs

@@ -3,7 +3,6 @@
 var tslib = require('tslib');
 var React = require('react');
 var reactAriaComponents = require('react-aria-components');
-var buttonStyles = require('~components/__rc__/Button/Button.module.css');
 require('classnames');
 require('../Loading/LoadingGraphic/LoadingGraphic.cjs');
 require('../Loading/LoadingHeading/LoadingHeading.cjs');
@@ -13,6 +12,7 @@ require('../Loading/LoadingSpinner/LoadingSpinner.cjs');
 require('../VisuallyHidden/VisuallyHidden.cjs');
 var ButtonContent = require('../__rc__/Button/subcomponents/ButtonContent/ButtonContent.cjs');
 var mergeClassNames = require('../utils/mergeClassNames.cjs');
+var Button_module = require('../__rc__/Button/Button.module.css.cjs');
 var LinkButton_module = require('./LinkButton.module.css.cjs');
 var ReversedColors = require('../__utilities__/ReversedColors/v3/ReversedColors.cjs');
 function _interopDefault(e) {
@@ -21,7 +21,6 @@ function _interopDefault(e) {
   };
 }
 var React__default = /*#__PURE__*/_interopDefault(React);
-var buttonStyles__default = /*#__PURE__*/_interopDefault(buttonStyles);
 var LinkButton = React.forwardRef(function (_a, ref) {
   var children = _a.children,
     _b = _a.variant,
@@ -43,7 +42,7 @@ var LinkButton = React.forwardRef(function (_a, ref) {
   var isReversedVariant = isReversed !== null && isReversed !== void 0 ? isReversed : shouldUseReverse;
   return React__default.default.createElement(reactAriaComponents.Link, tslib.__assign({
     ref: ref,
-    className: mergeClassNames.mergeClassNames(LinkButton_module.linkButton, buttonStyles__default.default.button, buttonStyles__default.default[size], hasHiddenLabel && buttonStyles__default.default["".concat(size, "IconButton")], isDisabled && buttonStyles__default.default.isDisabled, isReversedVariant ? buttonStyles__default.default["".concat(variant, "Reversed")] : buttonStyles__default.default[variant], isFullWidth && buttonStyles__default.default.fullWidth, className),
+    className: mergeClassNames.mergeClassNames(LinkButton_module.linkButton, Button_module.button, Button_module[size], hasHiddenLabel && Button_module["".concat(size, "IconButton")], isDisabled && Button_module.isDisabled, isReversedVariant ? Button_module["".concat(variant, "Reversed")] : Button_module[variant], isFullWidth && Button_module.fullWidth, className),
     isDisabled: isDisabled
   }, otherProps), function (racStateProps) {
     var childIsFunction = typeof children === 'function';

package/dist/cjs/Notification/ToastNotification/ToastNotificationsList/ToastNotificationsList.cjs

@@ -1,7 +1,6 @@
 'use strict';
 
 var React = require('react');
-var ReactDOM = require('react-dom');
 var ToastNotificationContext = require('../context/ToastNotificationContext.cjs');
 var ToastNotificationsMap = require('./subcomponents/ToastNotificationsMap/ToastNotificationsMap.cjs');
 var ToastNotificationsList_module = require('./ToastNotificationsList.module.scss.cjs');
@@ -15,24 +14,25 @@ var ToastNotificationsList = function () {
   var _a = ToastNotificationContext.useToastNotificationContext(),
     notifications = _a.notifications,
     removeToastNotification = _a.removeToastNotification;
-  var containers = document.querySelectorAll('[data-testid="toast-notifications-list"');
-  if (containers) {
-    // Remove any duplicate instances
-    // (eg. Storybook docs page has multiple stories each with their own context)
-    containers.forEach(function (c, i) {
-      if (i === 0) return;
-      c.remove();
-    });
-  }
-  return ReactDOM.createPortal(React__default.default.createElement("div", {
-    "data-testid": "toast-notifications-list",
-    role: "status",
-    className: ToastNotificationsList_module.toastNotificationsList
-  }, React__default.default.createElement(ToastNotificationsMap.ToastNotificationsMap, {
+  var _b = React.useState(null),
+    toastContainer = _b[0],
+    setToastContainer = _b[1];
+  React.useEffect(function () {
+    var container = document.querySelector('[data-testid="toast-notifications-list"]');
+    if (!container) {
+      container = document.createElement('div');
+      container.setAttribute('data-testid', 'toast-notifications-list');
+      container.setAttribute('role', 'status');
+      container.className = ToastNotificationsList_module.toastNotificationsList;
+      document.body.appendChild(container);
+    }
+    setToastContainer(container);
+  }, []);
+  return toastContainer ? React__default.default.createElement(ToastNotificationsMap.ToastNotificationsMap, {
     notifications: notifications,
     onHide: removeToastNotification,
-    container: containers[0]
-  })), document.body);
+    container: toastContainer
+  }) : React__default.default.createElement(React__default.default.Fragment, null);
 };
 ToastNotificationsList.displayName = 'ToastNotificationsList';
 exports.ToastNotificationsList = ToastNotificationsList;

package/dist/cjs/__rc__/Button/Button.module.css.cjs

@@ -1,6 +1,6 @@
 'use strict';
 
-var styles = {
+var buttonStyles = {
   "button": "Button-module_button__llv4w",
   "fullWidth": "Button-module_fullWidth__yyvBq",
   "small": "Button-module_small__NHLqb",
@@ -18,4 +18,4 @@ var styles = {
   "hideContentWidth": "Button-module_hideContentWidth__WTIHN",
   "retainContentWidth": "Button-module_retainContentWidth__dRMEx"
 };
-module.exports = styles;
+module.exports = buttonStyles;

package/dist/esm/Filter/FilterBar/subcomponents/AddFiltersMenu/AddFiltersMenu.mjs

@@ -11,7 +11,7 @@ const AddFiltersMenu = /*#__PURE__*/function () {
     var buttonRef = useRef(null);
     var menuButtonLabel = formatMessage({
       id: 'filterBar.addFiltersMenu.buttonLabel',
-      defaultMessage: 'Add Filters',
+      defaultMessage: 'Add filters',
       description: 'Menu button label to show additional available filter options'
     });
     var _a = useFilterBarContext(),

package/dist/esm/LinkButton/LinkButton.mjs

@@ -1,7 +1,6 @@
 import { __rest, __assign } from 'tslib';
 import React, { forwardRef } from 'react';
 import { Link } from 'react-aria-components';
-import buttonStyles from '~components/__rc__/Button/Button.module.css';
 import 'classnames';
 import '../Loading/LoadingGraphic/LoadingGraphic.mjs';
 import '../Loading/LoadingHeading/LoadingHeading.mjs';
@@ -11,6 +10,7 @@ import '../Loading/LoadingSpinner/LoadingSpinner.mjs';
 import '../VisuallyHidden/VisuallyHidden.mjs';
 import { ButtonContent } from '../__rc__/Button/subcomponents/ButtonContent/ButtonContent.mjs';
 import { mergeClassNames } from '../utils/mergeClassNames.mjs';
+import buttonStyles from '../__rc__/Button/Button.module.css.mjs';
 import styles from './LinkButton.module.css.mjs';
 import { useReversedColors } from '../__utilities__/ReversedColors/v3/ReversedColors.mjs';
 const LinkButton = /*#__PURE__*/function () {

package/dist/esm/Notification/ToastNotification/ToastNotificationsList/ToastNotificationsList.mjs

@@ -1,5 +1,4 @@
-import React from 'react';
-import { createPortal } from 'react-dom';
+import React, { useState, useEffect } from 'react';
 import { useToastNotificationContext } from '../context/ToastNotificationContext.mjs';
 import { ToastNotificationsMap } from './subcomponents/ToastNotificationsMap/ToastNotificationsMap.mjs';
 import styles from './ToastNotificationsList.module.scss.mjs';
@@ -8,24 +7,25 @@ const ToastNotificationsList = /*#__PURE__*/function () {
     var _a = useToastNotificationContext(),
       notifications = _a.notifications,
       removeToastNotification = _a.removeToastNotification;
-    var containers = document.querySelectorAll('[data-testid="toast-notifications-list"');
-    if (containers) {
-      // Remove any duplicate instances
-      // (eg. Storybook docs page has multiple stories each with their own context)
-      containers.forEach(function (c, i) {
-        if (i === 0) return;
-        c.remove();
-      });
-    }
-    return /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement("div", {
-      "data-testid": "toast-notifications-list",
-      role: "status",
-      className: styles.toastNotificationsList
-    }, /*#__PURE__*/React.createElement(ToastNotificationsMap, {
+    var _b = useState(null),
+      toastContainer = _b[0],
+      setToastContainer = _b[1];
+    useEffect(function () {
+      var container = document.querySelector('[data-testid="toast-notifications-list"]');
+      if (!container) {
+        container = document.createElement('div');
+        container.setAttribute('data-testid', 'toast-notifications-list');
+        container.setAttribute('role', 'status');
+        container.className = styles.toastNotificationsList;
+        document.body.appendChild(container);
+      }
+      setToastContainer(container);
+    }, []);
+    return toastContainer ? ( /*#__PURE__*/React.createElement(ToastNotificationsMap, {
       notifications: notifications,
       onHide: removeToastNotification,
-      container: containers[0]
-    })), document.body);
+      container: toastContainer
+    })) : ( /*#__PURE__*/React.createElement(React.Fragment, null));
   };
   ToastNotificationsList.displayName = 'ToastNotificationsList';
   return ToastNotificationsList;

package/dist/esm/__rc__/Button/Button.mjs

@@ -4,7 +4,7 @@ import { Button as Button$1 } from 'react-aria-components';
 import { mergeClassNames } from '../../utils/mergeClassNames.mjs';
 import { PendingContent } from './subcomponents/PendingContent/PendingContent.mjs';
 import { ButtonContent } from './subcomponents/ButtonContent/ButtonContent.mjs';
-import styles from './Button.module.css.mjs';
+import buttonStyles from './Button.module.css.mjs';
 import { useReversedColors } from '../../__utilities__/ReversedColors/v3/ReversedColors.mjs';
 const Button = /*#__PURE__*/function () {
   const Button = /*#__PURE__*/forwardRef(function (_a, ref) {
@@ -34,10 +34,10 @@ const Button = /*#__PURE__*/function () {
       hasHiddenPendingLabel: hasHiddenLabel || propsHasHiddenPendingLabel,
       pendingLabel: pendingLabel
     } : {};
-    var buttonContentClass = isPending ? !hasHiddenLabel && propsHasHiddenPendingLabel ? styles.retainContentWidth : styles.hideContentWidth : undefined;
+    var buttonContentClass = isPending ? !hasHiddenLabel && propsHasHiddenPendingLabel ? buttonStyles.retainContentWidth : buttonStyles.hideContentWidth : undefined;
     return /*#__PURE__*/React.createElement(Button$1, __assign({
       ref: ref,
-      className: mergeClassNames(styles.button, styles[size], hasHiddenLabel && styles["".concat(size, "IconButton")], isDisabled && styles.isDisabled, isReversedVariant ? styles["".concat(variant, "Reversed")] : styles[variant], isFullWidth && styles.fullWidth, className),
+      className: mergeClassNames(buttonStyles.button, buttonStyles[size], hasHiddenLabel && buttonStyles["".concat(size, "IconButton")], isDisabled && buttonStyles.isDisabled, isReversedVariant ? buttonStyles["".concat(variant, "Reversed")] : buttonStyles[variant], isFullWidth && buttonStyles.fullWidth, className),
       isDisabled: isDisabled,
       isPending: isPending
     }, restProps), function (racStateProps) {

package/dist/esm/__rc__/Button/Button.module.css.mjs

@@ -1,4 +1,4 @@
-var styles = {
+var buttonStyles = {
   "button": "Button-module_button__llv4w",
   "fullWidth": "Button-module_fullWidth__yyvBq",
   "small": "Button-module_small__NHLqb",
@@ -16,4 +16,4 @@ var styles = {
   "hideContentWidth": "Button-module_hideContentWidth__WTIHN",
   "retainContentWidth": "Button-module_retainContentWidth__dRMEx"
 };
-export { styles as default };
+export { buttonStyles as default };