@kaizen/components 1.25.0 → 1.27.0

package/dist/esm/AvatarGroup/AvatarGroup.module.scss.mjs

@@ -0,0 +1,10 @@
+var styles = {
+  "AvatarGroup": "AvatarGroup-module_AvatarGroup__bdL0o",
+  "small": "AvatarGroup-module_small__7uv8k",
+  "AvatarGroupItem": "AvatarGroup-module_AvatarGroupItem__xQol-",
+  "medium": "AvatarGroup-module_medium__af52y",
+  "large": "AvatarGroup-module_large__HN9Yy",
+  "AvatarCounter": "AvatarGroup-module_AvatarCounter__PKFzl"
+};
+export { styles as default };
+//# sourceMappingURL=AvatarGroup.module.scss.mjs.map

package/dist/esm/AvatarGroup/AvatarGroup.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AvatarGroup.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/dist/esm/Badge/Badge.mjs

@@ -0,0 +1,43 @@
+import { __rest, __assign } from 'tslib';
+import React, { useState, useLayoutEffect } from 'react';
+import classnames from 'classnames';
+import styles from './Badge.module.scss.mjs';
+
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3064857333/Badge Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-badge--docs Storybook}
+ */
+const Badge = /*#__PURE__*/function () {
+  const Badge = function (_a) {
+    var children = _a.children,
+      _b = _a.variant,
+      variant = _b === void 0 ? "default" : _b,
+      _c = _a.reversed,
+      reversed = _c === void 0 ? false : _c,
+      _d = _a.size,
+      size = _d === void 0 ? "small" : _d,
+      classNameOverride = _a.classNameOverride,
+      restProps = __rest(_a, ["children", "variant", "reversed", "size", "classNameOverride"]);
+    return /*#__PURE__*/React.createElement("span", __assign({
+      className: classnames(styles.badge, styles[variant], classNameOverride, reversed && styles.reversed, size === "large" && styles.large)
+    }, restProps), variant !== "dot" && children);
+  };
+  Badge.displayName = "Badge";
+  return Badge;
+}();
+var BadgeAnimated = function (props) {
+  var _a = useState(false),
+    isFocused = _a[0],
+    setIsFocused = _a[1];
+  useLayoutEffect(function () {
+    setIsFocused(true);
+    setTimeout(function () {
+      setIsFocused(false);
+    }, 150);
+  }, [props.children]);
+  return /*#__PURE__*/React.createElement("span", {
+    className: classnames(styles.animation, isFocused && styles.animationOn)
+  }, /*#__PURE__*/React.createElement(Badge, __assign({}, props)));
+};
+export { Badge, BadgeAnimated };
+//# sourceMappingURL=Badge.mjs.map

package/dist/esm/Badge/Badge.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.mjs","sources":["../../../src/Badge/Badge.tsx"],"sourcesContent":["import React, { HTMLAttributes, useLayoutEffect, useState } from \"react\"\nimport classnames from \"classnames\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport styles from \"./Badge.module.scss\"\n\ntype BadgeCommonProps = {\n  children?: string\n  /**\n   * The \"dark\" variant is no longer in the UI kit\n   */\n  variant?: \"default\" | \"active\" | \"dark\"\n  /**\n   * renders reversed colors. Use on purple background\n   */\n  reversed?: boolean\n  /**\n   * Supports \"small\" and \"large\" sizes - defaults to \"small\"\n   */\n  size?: \"small\" | \"large\"\n} & OverrideClassName<HTMLAttributes<HTMLSpanElement>>\n\ntype DotProps = Omit<BadgeCommonProps, \"variant\"> & {\n  children?: never\n  variant: \"dot\"\n}\n\nexport type BadgeProps = BadgeCommonProps | DotProps\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3064857333/Badge Guidance} |\n * {@link https://cultureamp.design/?path=/docs/components-badge--docs Storybook}\n */\nexport const Badge = ({\n  children,\n  variant = \"default\",\n  reversed = false,\n  size = \"small\",\n  classNameOverride,\n  ...restProps\n}: BadgeProps): JSX.Element => (\n  <span\n    className={classnames(\n      styles.badge,\n      styles[variant],\n      classNameOverride,\n      reversed && styles.reversed,\n      size === \"large\" && styles.large\n    )}\n    {...restProps}\n  >\n    {variant !== \"dot\" && children}\n  </span>\n)\n\nexport const BadgeAnimated = (props: BadgeProps): JSX.Element => {\n  const [isFocused, setIsFocused] = useState(false)\n\n  useLayoutEffect(() => {\n    setIsFocused(true)\n    setTimeout(() => {\n      setIsFocused(false)\n    }, 150)\n  }, [props.children])\n\n  return (\n    <span\n      className={classnames(styles.animation, isFocused && styles.animationOn)}\n    >\n      <Badge {...props} />\n    </span>\n  )\n}\n\nBadge.displayName = \"Badge\"\n"],"names":["Badge","_a","children","_b","variant","_c","reversed","_d","size","classNameOverride","restProps","__rest","React","createElement","__assign","className","classnames","styles","badge","large","displayName","BadgeAnimated","props","useState","isFocused","setIsFocused","useLayoutEffect","setTimeout","animation","animationOn"],"mappings":";;;;;AA4BA;;;AAGG;AAHH,MAIaA,KAAK;EAAA,MAALA,KAAK,GAAG,SAAAA,CAACC,EAOT,EAAA;IANX,IAAAC,QAAQ,GAAAD,EAAA,CAAAC,QAAA;MACRC,EAAA,GAAAF,EAAA,CAAAG,OAAmB;MAAnBA,OAAO,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,SAAS,GAAAA,EAAA;MACnBE,EAAgB,GAAAJ,EAAA,CAAAK,QAAA;MAAhBA,QAAQ,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,KAAK,GAAAA,EAAA;MAChBE,EAAc,GAAAN,EAAA,CAAAO,IAAA;MAAdA,IAAI,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,OAAO,GAAAA,EAAA;MACdE,iBAAiB,GAAAR,EAAA,CAAAQ,iBAAA;MACdC,SAAS,GAAAC,MAAA,CAAAV,EAAA,EANQ,gEAOrB,CADa;IACiB,oBAC7BW,KACE,CAAAC,aAAA,CAAA,MAAA,EAAAC,QAAA,CAAA;MAAAC,SAAS,EAAEC,UAAU,CACnBC,MAAM,CAACC,KAAK,EACZD,MAAM,CAACb,OAAO,CAAC,EACfK,iBAAiB,EACjBH,QAAQ,IAAIW,MAAM,CAACX,QAAQ,EAC3BE,IAAI,KAAK,OAAO,IAAIS,MAAM,CAACE,KAAK;OAE9BT,SAAS,CAAA,EAEZN,OAAO,KAAK,KAAK,IAAIF,QAAQ,CACzB;GACR;EAqBDF,KAAK,CAACoB,WAAW,GAAG,OAAO;EAAA,OAzCdpB,KAAK;AAAA;AAsBX,IAAMqB,aAAa,GAAG,SAAAA,CAACC,KAAiB,EAAA;EACvC,IAAArB,EAAA,GAA4BsB,QAAQ,CAAC,KAAK,CAAC;IAA1CC,SAAS,GAAAvB,EAAA,CAAA,CAAA,CAAA;IAAEwB,YAAY,GAAAxB,EAAA,CAAA,CAAA,CAAmB;EAEjDyB,eAAe,CAAC,YAAA;IACdD,YAAY,CAAC,IAAI,CAAC;IAClBE,UAAU,CAAC,YAAA;MACTF,YAAY,CAAC,KAAK,CAAC;IACpB,CAAA,EAAE,GAAG,CAAC;EACT,CAAC,EAAE,CAACH,KAAK,CAACpB,QAAQ,CAAC,CAAC;EAEpB,oBACEU,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IACEE,SAAS,EAAEC,UAAU,CAACC,MAAM,CAACW,SAAS,EAAEJ,SAAS,IAAIP,MAAM,CAACY,WAAW;EAAC,CAAA,eAExEjB,KAAA,CAAAC,aAAA,CAACb,KAAK,EAAKc,QAAA,CAAA,CAAA,CAAA,EAAAQ,KAAK,CAAI,CAAA,CACf;AAEX,CAAC;"}

package/dist/esm/Badge/Badge.module.scss.mjs

@@ -0,0 +1,13 @@
+var styles = {
+  "badge": "Badge-module_badge__CRtsW",
+  "large": "Badge-module_large__0QOpY",
+  "default": "Badge-module_default__k4Kcf",
+  "active": "Badge-module_active__-e-i2",
+  "reversed": "Badge-module_reversed__OgQLB",
+  "dark": "Badge-module_dark__RH34a",
+  "dot": "Badge-module_dot__BOKL1",
+  "animation": "Badge-module_animation__NTy6C",
+  "animationOn": "Badge-module_animationOn__nWK38"
+};
+export { styles as default };
+//# sourceMappingURL=Badge.module.scss.mjs.map

package/dist/esm/Badge/Badge.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}

package/dist/esm/Brand/Brand.mjs

@@ -0,0 +1,32 @@
+import { __rest, __assign } from 'tslib';
+import React from 'react';
+import { assetUrl } from '@kaizen/hosted-assets';
+import styles from './Brand.module.scss.mjs';
+const Brand = /*#__PURE__*/function () {
+  const Brand = function (_a) {
+    var variant = _a.variant,
+      alt = _a.alt,
+      _b = _a.reversed,
+      reversed = _b === void 0 ? false : _b,
+      classNameOverride = _a.classNameOverride,
+      restProps = __rest(_a, ["variant", "alt", "reversed", "classNameOverride"]);
+    var brandTheme = reversed ? "-reversed" : "-default";
+    return /*#__PURE__*/React.createElement("picture", __assign({
+      className: classNameOverride
+    }, restProps), /*#__PURE__*/React.createElement("source", {
+      srcSet: assetUrl("brand/".concat(variant, "-reversed.svg")),
+      media: "(forced-colors: active) and (prefers-color-scheme: dark)"
+    }), /*#__PURE__*/React.createElement("source", {
+      srcSet: assetUrl("brand/".concat(variant, "-default.svg")),
+      media: "(forced-colors: active) and (prefers-color-scheme: light)"
+    }), /*#__PURE__*/React.createElement("img", {
+      src: assetUrl("brand/".concat(variant).concat(brandTheme, ".svg")),
+      alt: alt,
+      className: styles.img
+    }));
+  };
+  Brand.displayName = "Brand";
+  return Brand;
+}();
+export { Brand };
+//# sourceMappingURL=Brand.mjs.map

package/dist/esm/Brand/Brand.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Brand.mjs","sources":["../../../src/Brand/Brand.tsx"],"sourcesContent":["import React, { HTMLAttributes } from \"react\"\nimport { assetUrl } from \"@kaizen/hosted-assets\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport styles from \"./Brand.module.scss\"\n\nexport type BrandProps = {\n  variant:\n    | \"logo-horizontal\"\n    | \"logo-vertical\"\n    | \"enso\"\n    | \"collective-intelligence\"\n  alt: string\n  reversed?: boolean\n} & OverrideClassName<HTMLAttributes<HTMLElement>>\n\nexport const Brand = ({\n  variant,\n  alt,\n  reversed = false,\n  classNameOverride,\n  ...restProps\n}: BrandProps): JSX.Element => {\n  const brandTheme = reversed ? \"-reversed\" : \"-default\"\n\n  return (\n    <picture className={classNameOverride} {...restProps}>\n      <source\n        srcSet={assetUrl(`brand/${variant}-reversed.svg`)}\n        media=\"(forced-colors: active) and (prefers-color-scheme: dark)\"\n      />\n      <source\n        srcSet={assetUrl(`brand/${variant}-default.svg`)}\n        media=\"(forced-colors: active) and (prefers-color-scheme: light)\"\n      />\n      <img\n        src={assetUrl(`brand/${variant}${brandTheme}.svg`)}\n        alt={alt}\n        className={styles.img}\n      />\n    </picture>\n  )\n}\n\nBrand.displayName = \"Brand\"\n"],"names":["Brand","_a","variant","alt","_b","reversed","classNameOverride","restProps","__rest","brandTheme","React","createElement","__assign","className","srcSet","assetUrl","concat","media","src","styles","img","displayName"],"mappings":";;;;MAeaA,KAAK;EAAA,MAALA,KAAK,GAAG,SAAAA,CAACC,EAMT,EAAA;IALX,IAAAC,OAAO,GAAAD,EAAA,CAAAC,OAAA;MACPC,GAAG,GAAAF,EAAA,CAAAE,GAAA;MACHC,gBAAgB;MAAhBC,QAAQ,mBAAG,KAAK,GAAAD,EAAA;MAChBE,iBAAiB,GAAAL,EAAA,CAAAK,iBAAA;MACdC,SAAS,GAAAC,MAAA,CAAAP,EAAA,EALQ,mDAMrB,CADa;IAEZ,IAAMQ,UAAU,GAAGJ,QAAQ,GAAG,WAAW,GAAG,UAAU;IAEtD,oBACEK,KAAS,CAAAC,aAAA,CAAA,SAAA,EAAAC,QAAA,CAAA;MAAAC,SAAS,EAAEP;OAAuBC,SAAS,CAAA,eAClDG,KAAA,CAAAC,aAAA,CAAA,QAAA,EAAA;MACEG,MAAM,EAAEC,QAAQ,CAAC,QAAS,CAAAC,MAAA,CAAAd,OAAO,EAAe,eAAA,CAAA,CAAC;MACjDe,KAAK,EAAC;IAA0D,CAChE,CAAA,eACFP,KAAA,CAAAC,aAAA,CAAA,QAAA,EAAA;MACEG,MAAM,EAAEC,QAAQ,CAAC,QAAS,CAAAC,MAAA,CAAAd,OAAO,EAAc,cAAA,CAAA,CAAC;MAChDe,KAAK,EAAC;IAA2D,CACjE,CAAA,eACFP,KACE,CAAAC,aAAA,CAAA,KAAA,EAAA;MAAAO,GAAG,EAAEH,QAAQ,CAAC,gBAASb,OAAO,CAAA,CAAAc,MAAA,CAAGP,UAAU,EAAA,MAAA,CAAM,CAAC;MAClDN,GAAG,EAAEA,GAAG;MACRU,SAAS,EAAEM,MAAM,CAACC;IAAG,CAAA,CACrB,CACM;EAEd,CAAC;EAEDpB,KAAK,CAACqB,WAAW,GAAG,OAAO;EAAA,OA5BdrB,KAAK;AAAA;"}

package/dist/esm/Brand/Brand.module.scss.mjs

@@ -0,0 +1,5 @@
+var styles = {
+  "img": "Brand-module_img__uWvra"
+};
+export { styles as default };
+//# sourceMappingURL=Brand.module.scss.mjs.map

package/dist/esm/Brand/Brand.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Brand.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/esm/BrandMoment/BrandMoment.mjs

@@ -0,0 +1,97 @@
+import { __rest, __assign } from 'tslib';
+import React from 'react';
+import classnames from 'classnames';
+import { assetUrl } from '@kaizen/hosted-assets';
+import { useMediaQueries } from '@kaizen/responsive';
+import { Heading, Paragraph } from '@kaizen/typography';
+import { Button } from '../Button/Button/Button.mjs';
+import '../Button/IconButton/IconButton.mjs';
+import '../Button/PaginationLink/PaginationLink.mjs';
+import '../Button/DirectionalLink/DirectionalLink.mjs';
+import styles from './BrandMoment.module.scss.mjs';
+
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082061589/Brand+Moment Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-brand-moment--docs Storybook}
+ */
+const BrandMoment = /*#__PURE__*/function () {
+  const BrandMoment = function (_a) {
+    var mood = _a.mood,
+      illustration = _a.illustration,
+      header = _a.header,
+      body = _a.body,
+      primaryAction = _a.primaryAction,
+      secondaryAction = _a.secondaryAction,
+      text = _a.text,
+      classNameOverride = _a.classNameOverride,
+      restProps = __rest(_a, ["mood", "illustration", "header", "body", "primaryAction", "secondaryAction", "text", "classNameOverride"]);
+    var queries = useMediaQueries().queries;
+    return /*#__PURE__*/React.createElement("div", __assign({
+      className: classnames(styles.body, styles[mood], classNameOverride)
+    }, restProps), /*#__PURE__*/React.createElement("header", {
+      className: styles.header
+    }, header), /*#__PURE__*/React.createElement("main", {
+      className: styles.main
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles.container
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles.mainInner
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles.left
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles.leftInner
+    }, illustration)), /*#__PURE__*/React.createElement("div", {
+      className: styles.right
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles.rightInner
+    }, text.subtitle && /*#__PURE__*/React.createElement(Heading, {
+      variant: "heading-3",
+      tag: "h1",
+      classNameOverride: styles.subtitle
+    }, text.subtitle), /*#__PURE__*/React.createElement(Heading, {
+      variant: "display-0",
+      tag: text.subtitle ? "h2" : "h1",
+      classNameOverride: styles.title
+    }, text.title), text.body && /*#__PURE__*/React.createElement(Paragraph, {
+      variant: "intro-lede",
+      classNameOverride: styles.textBody
+    }, text.body), body && /*#__PURE__*/React.createElement("div", {
+      className: styles.textBody
+    }, body), /*#__PURE__*/React.createElement("div", {
+      className: styles.actions
+    }, primaryAction && /*#__PURE__*/React.createElement(Button, __assign({
+      primary: true,
+      fullWidth: queries.isSmall
+    }, primaryAction)), secondaryAction && /*#__PURE__*/React.createElement("div", {
+      className: styles.secondaryAction
+    }, /*#__PURE__*/React.createElement(Button, __assign({
+      secondary: true,
+      fullWidth: queries.isSmall
+    }, secondaryAction))))))))), text.footer && /*#__PURE__*/React.createElement("footer", {
+      className: styles.footer
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles.container
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles.footerInner
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles.poweredByContainer
+    }, /*#__PURE__*/React.createElement(Paragraph, {
+      variant: "extra-small",
+      color: "dark-reduced-opacity"
+    }, "Powered by"), /*#__PURE__*/React.createElement("a", {
+      href: "https://www.cultureamp.com",
+      className: styles.poweredByLogo
+    }, /*#__PURE__*/React.createElement("img", {
+      src: assetUrl("brand/logo-horizontal-default.svg"),
+      alt: "Culture Amp"
+    }))), /*#__PURE__*/React.createElement("div", {
+      className: styles.footerTextContainer
+    }, /*#__PURE__*/React.createElement(Paragraph, {
+      variant: "extra-small"
+    }, text.footer))))));
+  };
+  BrandMoment.displayName = "BrandMoment";
+  return BrandMoment;
+}();
+export { BrandMoment };
+//# sourceMappingURL=BrandMoment.mjs.map

package/dist/esm/BrandMoment/BrandMoment.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BrandMoment.mjs","sources":["../../../src/BrandMoment/BrandMoment.tsx"],"sourcesContent":["import React, { ReactNode, ReactElement, HTMLAttributes } from \"react\"\nimport classnames from \"classnames\"\nimport { SceneProps } from \"@kaizen/draft-illustration\"\nimport { assetUrl } from \"@kaizen/hosted-assets\"\nimport { useMediaQueries } from \"@kaizen/responsive\"\nimport { Heading, Paragraph } from \"@kaizen/typography\"\nimport { Button, ButtonProps } from \"~components/Button\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport styles from \"./BrandMoment.module.scss\"\n\nexport type BrandMomentProps = {\n  mood: \"informative\" | \"positive\" | \"negative\"\n  illustration: ReactElement<SceneProps>\n  header: ReactNode\n  body?: ReactNode\n  primaryAction?: ButtonProps\n  secondaryAction?: ButtonProps\n  text: {\n    title: ReactNode\n    subtitle?: ReactNode\n    body?: ReactNode\n    footer?: ReactNode\n  }\n} & OverrideClassName<HTMLAttributes<HTMLDivElement>>\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082061589/Brand+Moment Guidance} |\n * {@link https://cultureamp.design/?path=/docs/components-brand-moment--docs Storybook}\n */\nexport const BrandMoment = ({\n  mood,\n  illustration,\n  header,\n  body,\n  primaryAction,\n  secondaryAction,\n  text,\n  classNameOverride,\n  ...restProps\n}: BrandMomentProps): JSX.Element => {\n  const { queries } = useMediaQueries()\n\n  return (\n    <div\n      className={classnames(styles.body, styles[mood], classNameOverride)}\n      {...restProps}\n    >\n      <header className={styles.header}>{header}</header>\n      <main className={styles.main}>\n        <div className={styles.container}>\n          <div className={styles.mainInner}>\n            <div className={styles.left}>\n              <div className={styles.leftInner}>{illustration}</div>\n            </div>\n            <div className={styles.right}>\n              <div className={styles.rightInner}>\n                {text.subtitle && (\n                  <Heading\n                    variant=\"heading-3\"\n                    tag=\"h1\"\n                    classNameOverride={styles.subtitle}\n                  >\n                    {text.subtitle}\n                  </Heading>\n                )}\n                <Heading\n                  variant=\"display-0\"\n                  tag={text.subtitle ? \"h2\" : \"h1\"}\n                  classNameOverride={styles.title}\n                >\n                  {text.title}\n                </Heading>\n                {text.body && (\n                  <Paragraph\n                    variant=\"intro-lede\"\n                    classNameOverride={styles.textBody}\n                  >\n                    {text.body}\n                  </Paragraph>\n                )}\n                {body && <div className={styles.textBody}>{body}</div>}\n                <div className={styles.actions}>\n                  {primaryAction && (\n                    <Button\n                      primary\n                      fullWidth={queries.isSmall}\n                      {...primaryAction}\n                    />\n                  )}\n                  {secondaryAction && (\n                    <div className={styles.secondaryAction}>\n                      <Button\n                        secondary\n                        fullWidth={queries.isSmall}\n                        {...secondaryAction}\n                      />\n                    </div>\n                  )}\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n      </main>\n      {text.footer && (\n        <footer className={styles.footer}>\n          <div className={styles.container}>\n            <div className={styles.footerInner}>\n              <div className={styles.poweredByContainer}>\n                <Paragraph variant=\"extra-small\" color=\"dark-reduced-opacity\">\n                  Powered by\n                </Paragraph>\n                <a\n                  href=\"https://www.cultureamp.com\"\n                  className={styles.poweredByLogo}\n                >\n                  <img\n                    src={assetUrl(\"brand/logo-horizontal-default.svg\")}\n                    alt=\"Culture Amp\"\n                  />\n                </a>\n              </div>\n              <div className={styles.footerTextContainer}>\n                <Paragraph variant=\"extra-small\">{text.footer}</Paragraph>\n              </div>\n            </div>\n          </div>\n        </footer>\n      )}\n    </div>\n  )\n}\n\nBrandMoment.displayName = \"BrandMoment\"\n"],"names":["BrandMoment","_a","mood","illustration","header","body","primaryAction","secondaryAction","text","classNameOverride","restProps","__rest","queries","useMediaQueries","React","createElement","__assign","className","classnames","styles","main","container","mainInner","left","leftInner","right","rightInner","subtitle","Heading","variant","tag","title","Paragraph","textBody","actions","Button","primary","fullWidth","isSmall","secondary","footer","footerInner","poweredByContainer","color","href","poweredByLogo","src","assetUrl","alt","footerTextContainer","displayName"],"mappings":"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"}

package/dist/esm/BrandMoment/BrandMoment.module.scss.mjs

@@ -0,0 +1,26 @@
+var styles = {
+  "body": "BrandMoment-module_body__J4lls",
+  "informative": "BrandMoment-module_informative__Qvwcd",
+  "positive": "BrandMoment-module_positive__78wqJ",
+  "negative": "BrandMoment-module_negative__atXal",
+  "container": "BrandMoment-module_container__4ORHI",
+  "header": "BrandMoment-module_header__EAP5Q",
+  "main": "BrandMoment-module_main__cdWko",
+  "mainInner": "BrandMoment-module_mainInner__xsFA6",
+  "left": "BrandMoment-module_left__ZHJiM",
+  "leftInner": "BrandMoment-module_leftInner__TY5DY",
+  "right": "BrandMoment-module_right__B-PR2",
+  "rightInner": "BrandMoment-module_rightInner__XvQ5Y",
+  "subtitle": "BrandMoment-module_subtitle__z9PL8",
+  "title": "BrandMoment-module_title__GrdAR",
+  "textBody": "BrandMoment-module_textBody__W6LvQ",
+  "secondaryAction": "BrandMoment-module_secondaryAction__d18oJ",
+  "actions": "BrandMoment-module_actions__Z3NrK",
+  "footer": "BrandMoment-module_footer__vSeX1",
+  "footerInner": "BrandMoment-module_footerInner__Wt9Rt",
+  "poweredByContainer": "BrandMoment-module_poweredByContainer__OkhVN",
+  "footerTextContainer": "BrandMoment-module_footerTextContainer__8iin9",
+  "poweredByLogo": "BrandMoment-module_poweredByLogo__w6M7o"
+};
+export { styles as default };
+//# sourceMappingURL=BrandMoment.module.scss.mjs.map

package/dist/esm/BrandMoment/BrandMoment.module.scss.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BrandMoment.module.scss.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}

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

@@ -0,0 +1,29 @@
+import { __assign } from 'tslib';
+import React, { forwardRef } from 'react';
+import { GenericButton } from '../GenericButton/GenericButton.mjs';
+
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3062890984/Button Guidance} |
+ * {@link https://cultureamp.design/?path=/docs/components-buttons-button--docs Storybook}
+ */
+const Button = /*#__PURE__*/function () {
+  const Button = /*#__PURE__*/forwardRef(function (props, ref) {
+    return /*#__PURE__*/React.createElement(GenericButton, __assign({}, props, {
+      ref: ref
+    }));
+  });
+  Button.defaultProps = {
+    fullWidth: false,
+    primary: false,
+    secondary: false,
+    destructive: false,
+    disabled: false,
+    reversed: false,
+    iconPosition: "start",
+    newTabAndIUnderstandTheAccessibilityImplications: false
+  };
+  Button.displayName = "Button";
+  return Button;
+}();
+export { Button };
+//# sourceMappingURL=Button.mjs.map

package/dist/esm/Button/Button/Button.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.mjs","sources":["../../../../src/Button/Button/Button.tsx"],"sourcesContent":["import React, { forwardRef, Ref } from \"react\"\n\nimport { GenericButton, GenericButtonProps, ButtonRef } from \"../GenericButton\"\n\nexport type ButtonProps = GenericButtonProps\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3062890984/Button Guidance} |\n * {@link https://cultureamp.design/?path=/docs/components-buttons-button--docs Storybook}\n */\nexport const Button = forwardRef(\n  (props: ButtonProps, ref: Ref<ButtonRef | undefined>) => (\n    <GenericButton {...props} ref={ref} />\n  )\n)\n\nButton.defaultProps = {\n  fullWidth: false,\n  primary: false,\n  secondary: false,\n  destructive: false,\n  disabled: false,\n  reversed: false,\n  iconPosition: \"start\",\n  newTabAndIUnderstandTheAccessibilityImplications: false,\n}\n\nButton.displayName = \"Button\"\n"],"names":["Button","forwardRef","props","ref","React","GenericButton","__assign","defaultProps","fullWidth","primary","secondary","destructive","disabled","reversed","iconPosition","newTabAndIUnderstandTheAccessibilityImplications","displayName"],"mappings":";;;;AAMA;;;AAGG;AAHH,MAIaA,MAAM;EAAA,MAANA,MAAM,gBAAGC,UAAU,CAC9B,UAACC,KAAkB,EAAEC,GAA+B,EAAA;IAAK,oBACvDC,oBAACC,aAAa,EAAAC,QAAA,CAAA,CAAA,CAAA,EAAKJ,KAAK,EAAA;MAAEC,GAAG,EAAEA;IAAG,CAAA,CAAA,CAAI;GACvC,CACF;EAEDH,MAAM,CAACO,YAAY,GAAG;IACpBC,SAAS,EAAE,KAAK;IAChBC,OAAO,EAAE,KAAK;IACdC,SAAS,EAAE,KAAK;IAChBC,WAAW,EAAE,KAAK;IAClBC,QAAQ,EAAE,KAAK;IACfC,QAAQ,EAAE,KAAK;IACfC,YAAY,EAAE,OAAO;IACrBC,gDAAgD,EAAE;GACnD;EAEDf,MAAM,CAACgB,WAAW,GAAG,QAAQ;EAAA,OAjBhBhB,MAAM;AAAA;"}

package/dist/esm/Button/DirectionalLink/DirectionalLink.mjs

@@ -0,0 +1,44 @@
+import { __assign } from 'tslib';
+import React from 'react';
+import 'uuid';
+import '../../Icon/subcomponents/SVG/SVG.mjs';
+import { ArrowBackwardIcon } from '../../Icon/ArrowBackwardIcon.mjs';
+import { ArrowForwardIcon } from '../../Icon/ArrowForwardIcon.mjs';
+import { EndIcon } from '../../Icon/EndIcon.mjs';
+import { StartIcon } from '../../Icon/StartIcon.mjs';
+import { GenericButton } from '../GenericButton/GenericButton.mjs';
+var iconMap = {
+  prev: /*#__PURE__*/React.createElement(ArrowBackwardIcon, {
+    role: "presentation"
+  }),
+  next: /*#__PURE__*/React.createElement(ArrowForwardIcon, {
+    role: "presentation"
+  }),
+  start: /*#__PURE__*/React.createElement(StartIcon, {
+    role: "presentation"
+  }),
+  end: /*#__PURE__*/React.createElement(EndIcon, {
+    role: "presentation"
+  })
+};
+/**
+ * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082092975/Pagination Guidance} |
+ * {@link https://cultureamp.design/?path=/story/components-buttons-directionallink--docs Storybook}
+ */
+const DirectionalLink = /*#__PURE__*/function () {
+  const DirectionalLink = function (props) {
+    return /*#__PURE__*/React.createElement(GenericButton, __assign({}, props, {
+      iconButton: true,
+      directionalLink: true,
+      icon: iconMap[props.direction]
+    }));
+  };
+  DirectionalLink.defaultProps = {
+    reversed: false,
+    disabled: false
+  };
+  DirectionalLink.displayName = "DirectionalLink";
+  return DirectionalLink;
+}();
+export { DirectionalLink };
+//# sourceMappingURL=DirectionalLink.mjs.map

package/dist/esm/Button/DirectionalLink/DirectionalLink.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"DirectionalLink.mjs","sources":["../../../../src/Button/DirectionalLink/DirectionalLink.tsx"],"sourcesContent":["import React from \"react\"\nimport {\n  ArrowBackwardIcon,\n  ArrowForwardIcon,\n  EndIcon,\n  StartIcon,\n} from \"~components/Icon\"\nimport { GenericButton, GenericProps } from \"../GenericButton\"\n\nexport type DirectionalLinkProps = {\n  label: string\n  disabled?: boolean\n  direction: \"prev\" | \"next\" | \"start\" | \"end\"\n} & GenericProps\n\nconst iconMap = {\n  prev: <ArrowBackwardIcon role=\"presentation\" />,\n  next: <ArrowForwardIcon role=\"presentation\" />,\n  start: <StartIcon role=\"presentation\" />,\n  end: <EndIcon role=\"presentation\" />,\n}\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3082092975/Pagination Guidance} |\n * {@link https://cultureamp.design/?path=/story/components-buttons-directionallink--docs Storybook}\n */\nexport const DirectionalLink = (props: DirectionalLinkProps): JSX.Element => (\n  <GenericButton\n    {...props}\n    iconButton\n    directionalLink\n    icon={iconMap[props.direction]}\n  />\n)\n\nDirectionalLink.defaultProps = {\n  reversed: false,\n  disabled: false,\n}\n\nDirectionalLink.displayName = \"DirectionalLink\"\n"],"names":["iconMap","prev","React","createElement","ArrowBackwardIcon","role","next","ArrowForwardIcon","start","StartIcon","end","EndIcon","DirectionalLink","props","GenericButton","__assign","iconButton","directionalLink","icon","direction","defaultProps","reversed","disabled","displayName"],"mappings":";;;;;;;;;AAeA,IAAMA,OAAO,GAAG;EACdC,IAAI,eAAEC,KAAC,CAAAC,aAAA,CAAAC,iBAAiB;IAACC,IAAI,EAAC;GAAiB,CAAA;EAC/CC,IAAI,eAAEJ,KAAC,CAAAC,aAAA,CAAAI,gBAAgB;IAACF,IAAI,EAAC;GAAiB,CAAA;EAC9CG,KAAK,eAAEN,KAAC,CAAAC,aAAA,CAAAM,SAAS;IAACJ,IAAI,EAAC;GAAiB,CAAA;EACxCK,GAAG,eAAER,KAAC,CAAAC,aAAA,CAAAQ,OAAO;IAACN,IAAI,EAAC;GAAiB;CACrC;AAED;;;AAGG;AAHH,MAIaO,eAAe;EAAA,MAAfA,eAAe,GAAG,SAAAA,CAACC,KAA2B,EAAkB;IAAA,oBAC3EX,KAAA,CAAAC,aAAA,CAACW,aAAa,EAAAC,QAAA,CAAA,CAAA,CAAA,EACRF,KAAK,EACT;MAAAG,UAAU,EACV,IAAA;MAAAC,eAAe,EACf,IAAA;MAAAC,IAAI,EAAElB,OAAO,CAACa,KAAK,CAACM,SAAS;KAAC,CAAA,CAC9B;EACH,CAAA;EAEDP,eAAe,CAACQ,YAAY,GAAG;IAC7BC,QAAQ,EAAE,KAAK;IACfC,QAAQ,EAAE;GACX;EAEDV,eAAe,CAACW,WAAW,GAAG,iBAAiB;EAAA,OAdlCX,eAAe;AAAA;"}

package/dist/esm/Button/GenericButton/GenericButton.mjs

@@ -0,0 +1,215 @@
+import { __rest, __assign } from 'tslib';
+import React, { forwardRef, useRef, useImperativeHandle } from 'react';
+import classnames from 'classnames';
+import { BadgeAnimated, Badge } from '@kaizen/draft-badge';
+import { LoadingSpinner } from '@kaizen/loading-spinner';
+import styles from './GenericButton.module.scss.mjs';
+
+// We're treating custom props as anything that is kebab cased.
+// This is so we can support properties like aria-* or data-*
+var getCustomProps = function (props) {
+  var keys = Object.keys(props).filter(function (k) {
+    return k.indexOf("-") !== -1;
+  });
+  return keys.reduce(function (acc, val) {
+    acc[val] = props[val];
+    return acc;
+  }, {});
+};
+const GenericButton = /*#__PURE__*/function () {
+  const GenericButton = /*#__PURE__*/forwardRef(function (props, ref) {
+    var buttonRef = useRef();
+    useImperativeHandle(ref, function () {
+      return {
+        focus: function () {
+          var _a;
+          (_a = buttonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+        }
+      };
+    });
+    var determineButtonRenderer = function () {
+      if (props.component) {
+        return renderCustomComponent(props.component, props);
+      }
+      if (props.href && !props.disabled && !props.working) {
+        return renderLink(props, buttonRef);
+      }
+      return renderButton(props, buttonRef);
+    };
+    return /*#__PURE__*/React.createElement("span", {
+      className: classnames(styles.container, props.fullWidth && styles.fullWidth),
+      "aria-live": "polite"
+    }, determineButtonRenderer());
+  });
+  GenericButton.defaultProps = {
+    iconPosition: "start",
+    iconButton: false,
+    primary: false,
+    secondary: false,
+    newTabAndIUnderstandTheAccessibilityImplications: false,
+    disableTabFocusAndIUnderstandTheAccessibilityImplications: false,
+    type: "button"
+  };
+  GenericButton.displayName = "GenericButton";
+  return GenericButton;
+}();
+var renderCustomComponent = function (CustomComponent, props) {
+  var id = props.id,
+    disabled = props.disabled,
+    href = props.href,
+    onClick = props.onClick,
+    onFocus = props.onFocus,
+    onBlur = props.onBlur,
+    rest = __rest(props, ["id", "disabled", "href", "onClick", "onFocus", "onBlur"]);
+  var customProps = getCustomProps(rest);
+  return /*#__PURE__*/React.createElement(CustomComponent, __assign({
+    id: id,
+    className: buttonClass(props),
+    disabled: disabled,
+    href: href,
+    onClick: onClick,
+    onFocus: onFocus,
+    onBlur: onBlur,
+    "aria-label": generateAriaLabel(props)
+  }, customProps), renderContent(props));
+};
+var renderButton = function (props, ref) {
+  var id = props.id,
+    disabled = props.disabled,
+    onClick = props.onClick,
+    onMouseDown = props.onMouseDown,
+    type = props.type,
+    disableTabFocusAndIUnderstandTheAccessibilityImplications = props.disableTabFocusAndIUnderstandTheAccessibilityImplications,
+    onFocus = props.onFocus,
+    onBlur = props.onBlur,
+    form = props.form,
+    formAction = props.formAction,
+    formMethod = props.formMethod,
+    formEncType = props.formEncType,
+    formTarget = props.formTarget,
+    formNoValidate = props.formNoValidate,
+    rest = __rest(props, ["id", "disabled", "onClick", "onMouseDown", "type", "disableTabFocusAndIUnderstandTheAccessibilityImplications", "onFocus", "onBlur", "form", "formAction", "formMethod", "formEncType", "formTarget", "formNoValidate"]);
+  var customProps = getCustomProps(rest);
+  return /*#__PURE__*/React.createElement("button", __assign({
+    // eslint-disable-next-line react/button-has-type
+    type: type,
+    id: id,
+    disabled: disabled,
+    className: buttonClass(props),
+    onClick: onClick,
+    onFocus: onFocus,
+    onBlur: onBlur,
+    onMouseDown: function (e) {
+      return onMouseDown && onMouseDown(e);
+    },
+    "aria-label": generateAriaLabel(props),
+    "aria-disabled": disabled || props.working ? true : undefined,
+    form: form,
+    formAction: formAction,
+    formMethod: formMethod,
+    formEncType: formEncType,
+    formTarget: formTarget,
+    formNoValidate: formNoValidate,
+    tabIndex: disableTabFocusAndIUnderstandTheAccessibilityImplications ? -1 : undefined,
+    ref: ref
+  }, customProps), renderContent(props));
+};
+var renderLink = function (props, ref) {
+  var id = props.id,
+    href = props.href,
+    onClick = props.onClick,
+    newTabAndIUnderstandTheAccessibilityImplications = props.newTabAndIUnderstandTheAccessibilityImplications,
+    onFocus = props.onFocus,
+    onBlur = props.onBlur,
+    rest = __rest(props, ["id", "href", "onClick", "newTabAndIUnderstandTheAccessibilityImplications", "onFocus", "onBlur"]);
+  var customProps = getCustomProps(rest);
+  var target = newTabAndIUnderstandTheAccessibilityImplications ? "_blank" : "_self";
+  return /*#__PURE__*/React.createElement("a", __assign({
+    id: id,
+    href: href,
+    target: target,
+    rel: target === "_blank" ? "noopener noreferrer" : undefined,
+    className: buttonClass(props),
+    onClick: onClick,
+    onFocus: onFocus,
+    onBlur: onBlur,
+    ref: ref,
+    "aria-label": generateAriaLabel(props)
+  }, customProps), renderContent(props));
+};
+var buttonClass = function (props) {
+  var isDefault = !props.primary && !props.destructive && !props.secondary;
+  return classnames(styles.button, isDefault && styles["default"], props.primary && styles.primary, props.destructive && styles.destructive, props.secondary && styles.secondary, props.size && styles[props.size], props.reversed && styles.reversed, props.iconButton && styles.iconButton, props.working && styles.working, (props.directionalLink || props.paginationLink) && styles.circleButton, props.directionalLink && styles.directionalLink, props.paginationLink && styles.paginationLink, props.isActive && styles.isPaginationLinkActive, props.classNameOverride);
+};
+var renderLoadingSpinner = function () {
+  return /*#__PURE__*/React.createElement("div", {
+    className: styles.loadingSpinner
+  }, /*#__PURE__*/React.createElement(LoadingSpinner, {
+    accessibilityLabel: "",
+    size: "sm"
+  }));
+};
+var renderWorkingContent = function (props) {
+  if (props.workingLabelHidden) {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
+      className: styles.hidden,
+      "aria-hidden": "true"
+    }, renderDefaultContent(props)), /*#__PURE__*/React.createElement("span", {
+      className: styles.centeredLoadingSpinner
+    }, renderLoadingSpinner()));
+  }
+  return /*#__PURE__*/React.createElement(React.Fragment, null, props.iconPosition !== "end" && renderLoadingSpinner(), /*#__PURE__*/React.createElement("span", {
+    className: styles.label
+  }, props.workingLabel), props.additionalContent && /*#__PURE__*/React.createElement("span", {
+    className: styles.additionalContentWrapper
+  }, props.additionalContent), props.iconPosition === "end" && renderLoadingSpinner());
+};
+var renderDefaultContent = function (props) {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, props.icon && props.iconPosition !== "end" && renderIcon(props.icon), (!props.icon || !props.iconButton) && /*#__PURE__*/React.createElement("span", {
+    className: styles.label
+  }, props.label), props.additionalContent && /*#__PURE__*/React.createElement("span", {
+    className: styles.additionalContentWrapper
+  }, props.additionalContent), renderBadge(props), props.icon && props.iconPosition === "end" && renderIcon(props.icon));
+};
+var renderBadge = function (props) {
+  if (!props.badge) return null;
+  var _a = props.badge,
+    text = _a.text,
+    animateChange = _a.animateChange,
+    reversed = _a.reversed,
+    variant = _a.variant;
+  if (animateChange) {
+    return /*#__PURE__*/React.createElement(BadgeAnimated, {
+      variant: variant,
+      reversed: reversed
+    }, text);
+  }
+  return /*#__PURE__*/React.createElement(Badge, {
+    variant: variant,
+    reversed: reversed
+  }, text);
+};
+var renderContent = function (props) {
+  return /*#__PURE__*/React.createElement("span", {
+    className: styles.content
+  }, props.working ? renderWorkingContent(props) : renderDefaultContent(props));
+};
+var renderIcon = function (icon) {
+  return /*#__PURE__*/React.createElement("span", {
+    className: styles.iconWrapper
+  }, icon);
+};
+// We only want an aria-label in the case that the button has just an icon and no text
+// This can happen when the button is working and workingLabelHidden is true,
+// or when this is an IconButton
+var generateAriaLabel = function (props) {
+  if (props.working && props.workingLabelHidden) {
+    return props.workingLabel;
+  }
+  if (props.iconButton) {
+    return props.label;
+  }
+  return undefined;
+};
+export { GenericButton };
+//# sourceMappingURL=GenericButton.mjs.map