@kaizen/components 3.3.1 → 3.3.3

package/dist/esm/src/Notification/subcomponents/NotificationHeading/NotificationHeading.mjs

@@ -1,30 +1,27 @@
-import React from 'react';
+import React__default from 'react';
 import { Heading } from '../../../Heading/Heading.mjs';
 import modules_f5422433 from '../GenericNotification/GenericNotification.module.css.mjs';
-const NotificationHeading = /*#__PURE__*/function () {
-  const NotificationHeading = function (_a) {
-    var _b, _c, _d;
-    var titleProp = _a.titleProp,
-      headingProps = _a.headingProps;
-    if (headingProps) {
-      return /*#__PURE__*/React.createElement(Heading, {
-        variant: (_b = headingProps.variant) !== null && _b !== void 0 ? _b : 'heading-6',
-        tag: (_c = headingProps.tag) !== null && _c !== void 0 ? _c : 'div',
-        color: (_d = headingProps.color) !== null && _d !== void 0 ? _d : 'dark',
-        classNameOverride: modules_f5422433.notificationTitle
-      }, headingProps.children);
-    }
-    if (titleProp) {
-      return /*#__PURE__*/React.createElement(Heading, {
-        variant: "heading-6",
-        tag: "div",
-        color: "dark",
-        classNameOverride: modules_f5422433.notificationTitle
-      }, titleProp);
-    }
-    return null;
-  };
-  NotificationHeading.displayName = 'NotificationHeading';
-  return NotificationHeading;
-}();
+var NotificationHeading = function (_a) {
+  var _b, _c, _d;
+  var titleProp = _a.titleProp,
+    headingProps = _a.headingProps;
+  if (headingProps) {
+    return /*#__PURE__*/React__default.createElement(Heading, {
+      variant: (_b = headingProps.variant) !== null && _b !== void 0 ? _b : 'heading-6',
+      tag: (_c = headingProps.tag) !== null && _c !== void 0 ? _c : 'div',
+      color: (_d = headingProps.color) !== null && _d !== void 0 ? _d : 'dark',
+      classNameOverride: modules_f5422433.notificationTitle
+    }, headingProps.children);
+  }
+  if (titleProp) {
+    return /*#__PURE__*/React__default.createElement(Heading, {
+      variant: "heading-6",
+      tag: "div",
+      color: "dark",
+      classNameOverride: modules_f5422433.notificationTitle
+    }, titleProp);
+  }
+  return null;
+};
+NotificationHeading.displayName = 'NotificationHeading';
 export { NotificationHeading };

package/dist/esm/src/Notification/subcomponents/NotificationIcon/NotificationIcon.mjs

@@ -1,42 +1,39 @@
-import React from 'react';
+import React__default from 'react';
 import { Icon } from '../../../Icon/Icon.mjs';
 import modules_ebcc20c9 from './NotificationIcon.module.css.mjs';
 var NotificationIcon = function (_a) {
   var name = _a.name;
-  return /*#__PURE__*/React.createElement(Icon, {
+  return /*#__PURE__*/React__default.createElement(Icon, {
     name: name,
     isFilled: true,
     isPresentational: true,
     className: modules_ebcc20c9.notificationIcon
   });
 };
-const NotificationIconVariant = /*#__PURE__*/function () {
-  const NotificationIconVariant = function (_a) {
-    var variant = _a.variant;
-    switch (variant) {
-      case 'success':
-        return /*#__PURE__*/React.createElement(NotificationIcon, {
-          name: "check_circle"
-        });
-      case 'warning':
-        return /*#__PURE__*/React.createElement(NotificationIcon, {
-          name: "error"
-        });
-      case 'cautionary':
-        return /*#__PURE__*/React.createElement(NotificationIcon, {
-          name: "warning"
-        });
-      case 'informative':
-        return /*#__PURE__*/React.createElement(NotificationIcon, {
-          name: "info"
-        });
-      case 'security':
-        return /*#__PURE__*/React.createElement(NotificationIcon, {
-          name: "privacy_tip"
-        });
-    }
-  };
-  NotificationIconVariant.displayName = 'NotificationIconVariant';
-  return NotificationIconVariant;
-}();
+var NotificationIconVariant = function (_a) {
+  var variant = _a.variant;
+  switch (variant) {
+    case 'success':
+      return /*#__PURE__*/React__default.createElement(NotificationIcon, {
+        name: "check_circle"
+      });
+    case 'warning':
+      return /*#__PURE__*/React__default.createElement(NotificationIcon, {
+        name: "error"
+      });
+    case 'cautionary':
+      return /*#__PURE__*/React__default.createElement(NotificationIcon, {
+        name: "warning"
+      });
+    case 'informative':
+      return /*#__PURE__*/React__default.createElement(NotificationIcon, {
+        name: "info"
+      });
+    case 'security':
+      return /*#__PURE__*/React__default.createElement(NotificationIcon, {
+        name: "privacy_tip"
+      });
+  }
+};
+NotificationIconVariant.displayName = 'NotificationIconVariant';
 export { NotificationIconVariant };

package/dist/esm/src/Pagination/Pagination.mjs

@@ -1,5 +1,5 @@
 import { __rest, __assign } from 'tslib';
-import React from 'react';
+import React__default from 'react';
 import classnames from 'classnames';
 import { useMediaQueries } from '../utils/useMediaQueries.mjs';
 import 'use-debounce';
@@ -38,7 +38,7 @@ var Pagination = function (_a) {
     onPageChange(newPage);
   };
   var paginationIndicator = function (page) {
-    return /*#__PURE__*/React.createElement(PaginationLink, {
+    return /*#__PURE__*/React__default.createElement(PaginationLink, {
       key: page,
       pageNumber: page,
       isActive: currentPage === page,
@@ -74,7 +74,7 @@ var Pagination = function (_a) {
       // Calculate and add truncate before group of main pages
       var firstEllipsisPageNumber = mainPagesStart - 1;
       var showPageInsteadOfFirstEllipsis = firstEllipsisPageNumber === firstPagesEnd + 1;
-      items.push(showPageInsteadOfFirstEllipsis ? paginationIndicator(firstEllipsisPageNumber) : (/*#__PURE__*/React.createElement(TruncateIndicator, {
+      items.push(showPageInsteadOfFirstEllipsis ? paginationIndicator(firstEllipsisPageNumber) : (/*#__PURE__*/React__default.createElement(TruncateIndicator, {
         key: firstEllipsisPageNumber
       })));
       // Add group of main pages
@@ -82,7 +82,7 @@ var Pagination = function (_a) {
       // Calculate and add truncate after group of main pages
       var secondEllipsisPageNumber = mainPagesEnd + 1;
       var showPageInsteadOfSecondEllipsis = secondEllipsisPageNumber === lastPagesStart - 1;
-      items.push(showPageInsteadOfSecondEllipsis ? paginationIndicator(secondEllipsisPageNumber) : (/*#__PURE__*/React.createElement(TruncateIndicator, {
+      items.push(showPageInsteadOfSecondEllipsis ? paginationIndicator(secondEllipsisPageNumber) : (/*#__PURE__*/React__default.createElement(TruncateIndicator, {
         key: secondEllipsisPageNumber
       })));
       // Add group of last pages
@@ -92,18 +92,18 @@ var Pagination = function (_a) {
   };
   var previousPageDisabled = currentPage <= 1;
   var nextPageDisabled = currentPage >= pageCount;
-  return /*#__PURE__*/React.createElement("nav", __assign({
+  return /*#__PURE__*/React__default.createElement("nav", __assign({
     className: classnames(modules_e3c5bce1.container, classNameOverride)
-  }, restProps), /*#__PURE__*/React.createElement(DirectionalLink, {
+  }, restProps), /*#__PURE__*/React__default.createElement(DirectionalLink, {
     label: ariaLabelPreviousPage,
     direction: "prev",
     disabled: previousPageDisabled,
     onClick: function () {
       return handleButtonClick('prev');
     }
-  }), /*#__PURE__*/React.createElement("div", {
+  }), /*#__PURE__*/React__default.createElement("div", {
     className: modules_e3c5bce1.pagesIndicatorWrapper
-  }, pagination(queries.isMediumOrSmaller ? 0 : 1, queries.isSmall ? 0 : 1)), /*#__PURE__*/React.createElement(DirectionalLink, {
+  }, pagination(queries.isMediumOrSmaller ? 0 : 1, queries.isSmall ? 0 : 1)), /*#__PURE__*/React__default.createElement(DirectionalLink, {
     label: ariaLabelNextPage,
     direction: "next",
     disabled: nextPageDisabled,

package/dist/esm/src/Pagination/subcomponents/DirectionalLink/DirectionalLink.mjs

@@ -1,5 +1,5 @@
 import { __rest, __assign } from 'tslib';
-import React from 'react';
+import React__default from 'react';
 import { GenericButton } from '../../../ButtonV1/GenericButton/GenericButton.mjs';
 import { Icon } from '../../../Icon/Icon.mjs';
 var iconNameMap = {
@@ -12,27 +12,24 @@ var iconNameMap = {
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082092975/Pagination Guidance} |
  * {@link https://cultureamp.design/?path=/docs/components-pagination-directionallink--docs Storybook}
  */
-const DirectionalLink = /*#__PURE__*/function () {
-  const DirectionalLink = function (_a) {
-    var _b = _a.reversed,
-      reversed = _b === void 0 ? false : _b,
-      _c = _a.disabled,
-      disabled = _c === void 0 ? false : _c,
-      otherProps = __rest(_a, ["reversed", "disabled"]);
-    return /*#__PURE__*/React.createElement(GenericButton, __assign({
-      reversed: reversed,
-      disabled: disabled
-    }, otherProps, {
-      iconButton: true,
-      directionalLink: true,
-      icon: /*#__PURE__*/React.createElement(Icon, {
-        name: iconNameMap[otherProps.direction],
-        isPresentational: true,
-        shouldMirrorInRTL: true
-      })
-    }));
-  };
-  DirectionalLink.displayName = 'DirectionalLink';
-  return DirectionalLink;
-}();
+var DirectionalLink = function (_a) {
+  var _b = _a.reversed,
+    reversed = _b === void 0 ? false : _b,
+    _c = _a.disabled,
+    disabled = _c === void 0 ? false : _c,
+    otherProps = __rest(_a, ["reversed", "disabled"]);
+  return /*#__PURE__*/React__default.createElement(GenericButton, __assign({
+    reversed: reversed,
+    disabled: disabled
+  }, otherProps, {
+    iconButton: true,
+    directionalLink: true,
+    icon: /*#__PURE__*/React__default.createElement(Icon, {
+      name: iconNameMap[otherProps.direction],
+      isPresentational: true,
+      shouldMirrorInRTL: true
+    })
+  }));
+};
+DirectionalLink.displayName = 'DirectionalLink';
 export { DirectionalLink };

package/dist/esm/src/Pagination/subcomponents/PaginationLink/PaginationLink.mjs

@@ -1,27 +1,24 @@
 import { __rest, __assign } from 'tslib';
-import React from 'react';
+import React__default from 'react';
 import { GenericButton } from '../../../ButtonV1/GenericButton/GenericButton.mjs';
 
 /**
  * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082092975/Pagination Guidance} |
  * {@link https://cultureamp.design/?path=/docs/components-pagination-paginationlink--docs Storybook}
  */
-const PaginationLink = /*#__PURE__*/function () {
-  const PaginationLink = function (_a) {
-    var pageNumber = _a.pageNumber,
-      _b = _a.reversed,
-      reversed = _b === void 0 ? false : _b,
-      _c = _a.isActive,
-      isActive = _c === void 0 ? false : _c,
-      restProps = __rest(_a, ["pageNumber", "reversed", "isActive"]);
-    return /*#__PURE__*/React.createElement(GenericButton, __assign({}, restProps, {
-      paginationLink: true,
-      reversed: reversed,
-      isActive: isActive,
-      label: "".concat(pageNumber)
-    }));
-  };
-  PaginationLink.displayName = 'PaginationLink';
-  return PaginationLink;
-}();
+var PaginationLink = function (_a) {
+  var pageNumber = _a.pageNumber,
+    _b = _a.reversed,
+    reversed = _b === void 0 ? false : _b,
+    _c = _a.isActive,
+    isActive = _c === void 0 ? false : _c,
+    restProps = __rest(_a, ["pageNumber", "reversed", "isActive"]);
+  return /*#__PURE__*/React__default.createElement(GenericButton, __assign({}, restProps, {
+    paginationLink: true,
+    reversed: reversed,
+    isActive: isActive,
+    label: "".concat(pageNumber)
+  }));
+};
+PaginationLink.displayName = 'PaginationLink';
 export { PaginationLink };

package/dist/esm/src/Pagination/subcomponents/TruncateIndicator/TruncateIndicator.mjs

@@ -1,11 +1,11 @@
-import React from 'react';
+import React__default from 'react';
 import { Icon } from '../../../Icon/Icon.mjs';
 import modules_002da23c from './TruncateIndicator.module.css.mjs';
 var TruncateIndicator = function () {
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React__default.createElement("div", {
     className: modules_002da23c.truncateIndicatorWrapper,
     "data-testid": "truncate-indicator"
-  }, /*#__PURE__*/React.createElement(Icon, {
+  }, /*#__PURE__*/React__default.createElement(Icon, {
     name: "more_horiz",
     isPresentational: true
   }));

package/dist/esm/src/Pagination/subcomponents/TruncateIndicator/TruncateIndicator.module.css.mjs

@@ -1,4 +1,4 @@
 var modules_002da23c = {
-  "truncateIndicatorWrapper": "TruncateIndicator_module_truncateIndicatorWrapper__a6a2a3a5"
+  "truncateIndicatorWrapper": "TruncateIndicator_module_truncateIndicatorWrapper__f9c06ea9"
 };
 export { modules_002da23c as default };

package/dist/esm/src/Popover/Popover.mjs

@@ -1,5 +1,5 @@
 import { __rest, __assign } from 'tslib';
-import React, { useState, useMemo } from 'react';
+import React__default, { useState, useMemo } from 'react';
 import classnames from 'classnames';
 import { usePopper } from 'react-popper';
 import { Heading } from '../Heading/Heading.mjs';
@@ -15,119 +15,116 @@ var arrowHeight = 7;
  * {@link https://cultureamp.design/components/popover/ Guidance} |
  * {@link https://cultureamp.design/storybook/?path=/docs/components-popover--default-kaizen-site-demo Storybook}
  */
-const Popover = /*#__PURE__*/function () {
-  const Popover = function (_a) {
-    var children = _a.children,
-      _b = _a.placement,
-      placement = _b === void 0 ? 'top' : _b,
-      _c = _a.size,
-      size = _c === void 0 ? 'small' : _c,
-      heading = _a.heading,
-      _d = _a.dismissible,
-      dismissible = _d === void 0 ? false : _d,
-      onClose = _a.onClose,
-      _e = _a.singleLine,
-      singleLine = _e === void 0 ? false : _e,
-      referenceElement = _a.referenceElement,
-      classNameOverride = _a.classNameOverride,
-      restProps = __rest(_a, ["children", "placement", "size", "heading", "dismissible", "onClose", "singleLine", "referenceElement", "classNameOverride"]);
-    var _f = useState(null),
-      popperElement = _f[0],
-      setPopperElement = _f[1];
-    var _g = useState(null),
-      arrowElement = _g[0],
-      setArrowElement = _g[1];
-    var _h = usePopper(referenceElement, popperElement, {
-        modifiers: [{
-          name: 'arrow',
-          options: {
-            element: arrowElement,
-            // Ensures that the arrow doesn't go too far to the left or right
-            // of the tooltip.
-            padding: arrowWidth / 2 + 10
-          }
-        }, {
-          name: 'offset',
-          options: {
-            offset: [0, arrowHeight + 6]
-          }
-        }, {
-          name: 'preventOverflow',
-          options: {
-            // Makes sure that the popover isn't flush up against the end of the
-            // viewport
-            padding: 8,
-            altAxis: true,
-            altBoundary: true,
-            tetherOffset: 50
-          }
-        }, {
-          name: 'flip',
-          options: {
-            padding: 8,
-            altBoundary: true,
-            fallbackPlacements: ['left', 'top', 'bottom', 'right']
-          }
-        }],
-        placement: placement
-      }),
-      popperStyles = _h.styles,
-      attributes = _h.attributes;
-    return /*#__PURE__*/React.createElement("div", __assign({
-      ref: setPopperElement,
-      style: popperStyles.popper
-    }, attributes.popper, {
-      className: classnames(modules_ef8f756f.root, mapSizeToClass(size), classNameOverride)
-    }, restProps), /*#__PURE__*/React.createElement("div", {
-      className: modules_ef8f756f.defaultBox
-    }, heading && (/*#__PURE__*/React.createElement("div", {
-      className: modules_ef8f756f.header
-    }, /*#__PURE__*/React.createElement(Heading, {
-      variant: "heading-6",
-      classNameOverride: modules_ef8f756f.singleLine
-    }, heading), dismissible && (/*#__PURE__*/React.createElement("button", {
-      className: modules_ef8f756f.close,
-      onClick: onClose,
-      type: "button",
-      "aria-label": "close"
-    }, /*#__PURE__*/React.createElement(Icon, {
-      name: "close",
-      isPresentational: true,
-      isFilled: true
-    }))))), /*#__PURE__*/React.createElement(Text, {
-      tag: "div",
-      variant: "small",
-      classNameOverride: classnames(modules_ef8f756f.container, mapLineVariant(singleLine))
-    }, children)), /*#__PURE__*/React.createElement("div", {
-      ref: setArrowElement,
-      style: popperStyles.arrow,
-      className: modules_ef8f756f.arrowWrapper
-    }, /*#__PURE__*/React.createElement("div", {
-      className: classnames(modules_ef8f756f.arrow, modules_ef8f756f.defaultArrow)
-    })));
-  };
-  Popover.displayName = 'Popover';
-  /**
-   * How to use:
-   *
-   * const [referenceElementRef, Popover] = usePopover()
-   *
-   * return (<>
-   *   <button ref={referenceElementRef}>
-   *     Hello world
-   *   </button>
-   *   <Popover>Hello world</Popover>
-   * </>)
-   *
-   * The purpose of this hook is to abstract away some of the awkwardness with the
-   * requirement of passing in refs with popper. We need to use `useState` instead
-   * of `useRef`, which may not be immediately intuitive.
-   *
-   * The popper documentation to help provide more context:
-   *   https://popper.js.org/react-popper/v2/hook/
-   */
-  return Popover;
-}();
+var Popover = function (_a) {
+  var children = _a.children,
+    _b = _a.placement,
+    placement = _b === void 0 ? 'top' : _b,
+    _c = _a.size,
+    size = _c === void 0 ? 'small' : _c,
+    heading = _a.heading,
+    _d = _a.dismissible,
+    dismissible = _d === void 0 ? false : _d,
+    onClose = _a.onClose,
+    _e = _a.singleLine,
+    singleLine = _e === void 0 ? false : _e,
+    referenceElement = _a.referenceElement,
+    classNameOverride = _a.classNameOverride,
+    restProps = __rest(_a, ["children", "placement", "size", "heading", "dismissible", "onClose", "singleLine", "referenceElement", "classNameOverride"]);
+  var _f = useState(null),
+    popperElement = _f[0],
+    setPopperElement = _f[1];
+  var _g = useState(null),
+    arrowElement = _g[0],
+    setArrowElement = _g[1];
+  var _h = usePopper(referenceElement, popperElement, {
+      modifiers: [{
+        name: 'arrow',
+        options: {
+          element: arrowElement,
+          // Ensures that the arrow doesn't go too far to the left or right
+          // of the tooltip.
+          padding: arrowWidth / 2 + 10
+        }
+      }, {
+        name: 'offset',
+        options: {
+          offset: [0, arrowHeight + 6]
+        }
+      }, {
+        name: 'preventOverflow',
+        options: {
+          // Makes sure that the popover isn't flush up against the end of the
+          // viewport
+          padding: 8,
+          altAxis: true,
+          altBoundary: true,
+          tetherOffset: 50
+        }
+      }, {
+        name: 'flip',
+        options: {
+          padding: 8,
+          altBoundary: true,
+          fallbackPlacements: ['left', 'top', 'bottom', 'right']
+        }
+      }],
+      placement: placement
+    }),
+    popperStyles = _h.styles,
+    attributes = _h.attributes;
+  return /*#__PURE__*/React__default.createElement("div", __assign({
+    ref: setPopperElement,
+    style: popperStyles.popper
+  }, attributes.popper, {
+    className: classnames(modules_ef8f756f.root, mapSizeToClass(size), classNameOverride)
+  }, restProps), /*#__PURE__*/React__default.createElement("div", {
+    className: modules_ef8f756f.defaultBox
+  }, heading && (/*#__PURE__*/React__default.createElement("div", {
+    className: modules_ef8f756f.header
+  }, /*#__PURE__*/React__default.createElement(Heading, {
+    variant: "heading-6",
+    classNameOverride: modules_ef8f756f.singleLine
+  }, heading), dismissible && (/*#__PURE__*/React__default.createElement("button", {
+    className: modules_ef8f756f.close,
+    onClick: onClose,
+    type: "button",
+    "aria-label": "close"
+  }, /*#__PURE__*/React__default.createElement(Icon, {
+    name: "close",
+    isPresentational: true,
+    isFilled: true
+  }))))), /*#__PURE__*/React__default.createElement(Text, {
+    tag: "div",
+    variant: "small",
+    classNameOverride: classnames(modules_ef8f756f.container, mapLineVariant(singleLine))
+  }, children)), /*#__PURE__*/React__default.createElement("div", {
+    ref: setArrowElement,
+    style: popperStyles.arrow,
+    className: modules_ef8f756f.arrowWrapper
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: classnames(modules_ef8f756f.arrow, modules_ef8f756f.defaultArrow)
+  })));
+};
+Popover.displayName = 'Popover';
+/**
+ * How to use:
+ *
+ * const [referenceElementRef, Popover] = usePopover()
+ *
+ * return (<>
+ *   <button ref={referenceElementRef}>
+ *     Hello world
+ *   </button>
+ *   <Popover>Hello world</Popover>
+ * </>)
+ *
+ * The purpose of this hook is to abstract away some of the awkwardness with the
+ * requirement of passing in refs with popper. We need to use `useState` instead
+ * of `useRef`, which may not be immediately intuitive.
+ *
+ * The popper documentation to help provide more context:
+ *   https://popper.js.org/react-popper/v2/hook/
+ */
 var usePopover = function () {
   var _a = useState(null),
     referenceElement = _a[0],
@@ -140,7 +137,7 @@ var usePopover = function () {
   // eslint-disable-next-line react/display-name
   function () {
     return function (props) {
-      return referenceElement ? /*#__PURE__*/React.createElement(Popover, __assign({}, props, {
+      return referenceElement ? /*#__PURE__*/React__default.createElement(Popover, __assign({}, props, {
         referenceElement: referenceElement
       })) : null;
     };