@kaizen/components 0.0.0-canary-rollup-plugin-node-externals-v7-20240206233319 → 0.0.0-canary-remove-tailwind-from-kaio-20240305223928

package/dist/cjs/Modal/GenericModal/GenericModal.cjs

@@ -81,11 +81,20 @@ const GenericModal = /*#__PURE__*/function () {
         });
       }
     };
-    var onAfterLeaveHandler = function () {
+    var cleanUpAfterClose = function () {
       document.documentElement.classList.remove(GenericModal_module.unscrollable, GenericModal_module.pseudoScrollbar);
       if (onEscapeKeyup) {
         document.removeEventListener("keyup", onEscapeKeyup);
       }
+    };
+    /* Ensure sure add-on styles (e.g. unscrollable) and key event is cleaned up when the modal is unmounted*/
+    React.useEffect(function () {
+      return function () {
+        return cleanUpAfterClose();
+      };
+    }, []);
+    var onAfterLeaveHandler = function () {
+      cleanUpAfterClose();
       propsOnAfterLeave === null || propsOnAfterLeave === void 0 ? void 0 : propsOnAfterLeave();
     };
     return ReactDOM.createPortal(React.createElement(react.Transition, {

package/dist/cjs/Modal/GenericModal/GenericModal.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"GenericModal.cjs","sources":["../../../../src/Modal/GenericModal/GenericModal.tsx"],"sourcesContent":["import React, { useId, useState } from \"react\"\nimport { createPortal } from \"react-dom\"\nimport { Transition } from \"@headlessui/react\"\nimport FocusLock from \"react-focus-lock\"\nimport { warn } from \"../util/console\"\nimport { ModalContext } from \"./context/ModalContext\"\nimport styles from \"./GenericModal.module.scss\"\n\nexport type GenericModalProps = {\n  id?: string\n  isOpen: boolean\n  children: React.ReactNode\n  focusLockDisabled?: boolean\n  onEscapeKeyup?: (event: KeyboardEvent) => void\n  onOutsideModalClick?: (event: React.MouseEvent) => void\n  onAfterLeave?: () => void\n}\n\nexport const GenericModal = ({\n  id: propsId,\n  children,\n  isOpen = true,\n  focusLockDisabled,\n  onEscapeKeyup,\n  onOutsideModalClick,\n  onAfterLeave: propsOnAfterLeave,\n}: GenericModalProps): JSX.Element => {\n  const reactId = useId()\n  const id = propsId ?? reactId\n\n  const labelledByID = useId()\n  const describedByID = useId()\n\n  const [scrollLayer, setScrollLayer] = useState<HTMLDivElement | null>(null)\n  const [modalLayer, setModalLayer] = useState<HTMLDivElement | null>(null)\n\n  const scrollModalToTop = (): void => {\n    // If we have a really long modal, the autofocus could land on an element down below\n    // causing the modal to scroll down and skipping over the content near the modal's top.\n    // Ensure that when the modal opens, we are at the top of its content.\n    requestAnimationFrame(() => {\n      if (!scrollLayer) return\n      scrollLayer.scrollTop = 0\n    })\n  }\n\n  const outsideModalClickHandler = (event: React.MouseEvent): void => {\n    if (event.target === scrollLayer || event.target === modalLayer) {\n      onOutsideModalClick?.(event)\n    }\n  }\n\n  const focusAccessibleLabel = (): void => {\n    if (modalLayer) {\n      const labelElement: HTMLElement | null =\n        document.getElementById(labelledByID)\n      if (labelElement) {\n        labelElement.focus()\n      }\n    }\n  }\n\n  const a11yWarn = (): void => {\n    if (!modalLayer) return\n    // Ensure that consumers have provided an element that labels the modal\n    // to meet ARIA accessibility guidelines.\n    if (!document.getElementById(labelledByID)) {\n      warn(\n        `When using the Modal component, you must provide a label for the modal.\n        Make sure you have a <ModalAccessibleLabel /> component with content that labels the modal.`\n      )\n    }\n  }\n\n  const preventBodyScroll = (): void => {\n    const hasScrollbar =\n      window.innerWidth > document.documentElement.clientWidth\n    const scrollStyles = [styles.unscrollable]\n\n    if (hasScrollbar) {\n      scrollStyles.push(styles.pseudoScrollbar)\n    }\n\n    document.documentElement.classList.add(...scrollStyles)\n  }\n\n  const onAfterEnterHandler = (): void => {\n    scrollModalToTop()\n    focusAccessibleLabel()\n    a11yWarn()\n  }\n\n  const onBeforeEnterHandler = (): void => {\n    preventBodyScroll()\n\n    if (onEscapeKeyup) {\n      document.addEventListener(\"keyup\", event => {\n        if (event.key === \"Escape\") {\n          onEscapeKeyup?.(event)\n        }\n      })\n    }\n  }\n\n  const onAfterLeaveHandler = (): void => {\n    document.documentElement.classList.remove(\n      styles.unscrollable,\n      styles.pseudoScrollbar\n    )\n\n    if (onEscapeKeyup) {\n      document.removeEventListener(\"keyup\", onEscapeKeyup)\n    }\n\n    propsOnAfterLeave?.()\n  }\n\n  return createPortal(\n    <Transition\n      appear={true}\n      show={isOpen}\n      enter={styles.animatingEnter}\n      leave={styles.animatingLeave}\n      beforeEnter={onBeforeEnterHandler}\n      afterEnter={onAfterEnterHandler}\n      afterLeave={onAfterLeaveHandler}\n      data-generic-modal-transition-wrapper\n      onClick={(e: React.MouseEvent): void => e.stopPropagation()}\n    >\n      <FocusLock\n        disabled={focusLockDisabled}\n        returnFocus={true}\n        // Disabling false positive\n        // eslint-disable-next-line jsx-a11y/no-autofocus\n        autoFocus={false}\n      >\n        <div className={styles.backdropLayer} />\n        {/* Disabling these because we don't want this to be keyboard focusable. Users can use Esc to achieve this with a keyboard.\n         */}\n        {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */}\n        <div\n          className={styles.scrollLayer}\n          ref={(scrollLayerRef): void => {\n            setScrollLayer(scrollLayerRef)\n          }}\n          onClick={outsideModalClickHandler}\n          data-testid={`${id}-scrollLayer`}\n        >\n          <ModalContext.Provider\n            value={{\n              labelledByID,\n              describedByID,\n            }}\n          >\n            <div\n              role=\"dialog\"\n              className={styles.modalLayer}\n              aria-labelledby={labelledByID}\n              aria-describedby={describedByID}\n              ref={(modalLayerRef): void => setModalLayer(modalLayerRef)}\n              data-testid={id}\n            >\n              {children}\n            </div>\n          </ModalContext.Provider>\n        </div>\n      </FocusLock>\n    </Transition>,\n    document.body\n  )\n}\n\nGenericModal.displayName = \"GenericModal\"\n"],"names":["GenericModal","_a","propsId","id","children","_b","isOpen","focusLockDisabled","onEscapeKeyup","onOutsideModalClick","propsOnAfterLeave","onAfterLeave","reactId","useId","labelledByID","describedByID","_c","useState","scrollLayer","setScrollLayer","_d","modalLayer","setModalLayer","scrollModalToTop","requestAnimationFrame","scrollTop","outsideModalClickHandler","event","target","focusAccessibleLabel","labelElement","document","getElementById","focus","a11yWarn","warn","preventBodyScroll","hasScrollbar","window","innerWidth","documentElement","clientWidth","scrollStyles","styles","unscrollable","push","pseudoScrollbar","classList","add","apply","onAfterEnterHandler","onBeforeEnterHandler","addEventListener","key","onAfterLeaveHandler","remove","removeEventListener","createPortal","React","createElement","Transition","appear","show","enter","animatingEnter","leave","animatingLeave","beforeEnter","afterEnter","afterLeave","onClick","e","stopPropagation","FocusLock","disabled","returnFocus","autoFocus","className","backdropLayer","ref","scrollLayerRef","concat","ModalContext","Provider","value","role","modalLayerRef","body","displayName"],"mappings":"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"}
+{"version":3,"file":"GenericModal.cjs","sources":["../../../../src/Modal/GenericModal/GenericModal.tsx"],"sourcesContent":["import React, { useEffect, useId, useState } from \"react\"\nimport { createPortal } from \"react-dom\"\nimport { Transition } from \"@headlessui/react\"\nimport FocusLock from \"react-focus-lock\"\nimport { warn } from \"../util/console\"\nimport { ModalContext } from \"./context/ModalContext\"\nimport styles from \"./GenericModal.module.scss\"\n\nexport type GenericModalProps = {\n  id?: string\n  isOpen: boolean\n  children: React.ReactNode\n  focusLockDisabled?: boolean\n  onEscapeKeyup?: (event: KeyboardEvent) => void\n  onOutsideModalClick?: (event: React.MouseEvent) => void\n  onAfterLeave?: () => void\n}\n\nexport const GenericModal = ({\n  id: propsId,\n  children,\n  isOpen = true,\n  focusLockDisabled,\n  onEscapeKeyup,\n  onOutsideModalClick,\n  onAfterLeave: propsOnAfterLeave,\n}: GenericModalProps): JSX.Element => {\n  const reactId = useId()\n  const id = propsId ?? reactId\n\n  const labelledByID = useId()\n  const describedByID = useId()\n\n  const [scrollLayer, setScrollLayer] = useState<HTMLDivElement | null>(null)\n  const [modalLayer, setModalLayer] = useState<HTMLDivElement | null>(null)\n\n  const scrollModalToTop = (): void => {\n    // If we have a really long modal, the autofocus could land on an element down below\n    // causing the modal to scroll down and skipping over the content near the modal's top.\n    // Ensure that when the modal opens, we are at the top of its content.\n    requestAnimationFrame(() => {\n      if (!scrollLayer) return\n      scrollLayer.scrollTop = 0\n    })\n  }\n\n  const outsideModalClickHandler = (event: React.MouseEvent): void => {\n    if (event.target === scrollLayer || event.target === modalLayer) {\n      onOutsideModalClick?.(event)\n    }\n  }\n\n  const focusAccessibleLabel = (): void => {\n    if (modalLayer) {\n      const labelElement: HTMLElement | null =\n        document.getElementById(labelledByID)\n      if (labelElement) {\n        labelElement.focus()\n      }\n    }\n  }\n\n  const a11yWarn = (): void => {\n    if (!modalLayer) return\n    // Ensure that consumers have provided an element that labels the modal\n    // to meet ARIA accessibility guidelines.\n    if (!document.getElementById(labelledByID)) {\n      warn(\n        `When using the Modal component, you must provide a label for the modal.\n        Make sure you have a <ModalAccessibleLabel /> component with content that labels the modal.`\n      )\n    }\n  }\n\n  const preventBodyScroll = (): void => {\n    const hasScrollbar =\n      window.innerWidth > document.documentElement.clientWidth\n    const scrollStyles = [styles.unscrollable]\n\n    if (hasScrollbar) {\n      scrollStyles.push(styles.pseudoScrollbar)\n    }\n\n    document.documentElement.classList.add(...scrollStyles)\n  }\n\n  const onAfterEnterHandler = (): void => {\n    scrollModalToTop()\n    focusAccessibleLabel()\n    a11yWarn()\n  }\n\n  const onBeforeEnterHandler = (): void => {\n    preventBodyScroll()\n\n    if (onEscapeKeyup) {\n      document.addEventListener(\"keyup\", event => {\n        if (event.key === \"Escape\") {\n          onEscapeKeyup?.(event)\n        }\n      })\n    }\n  }\n\n  const cleanUpAfterClose = (): void => {\n    document.documentElement.classList.remove(\n      styles.unscrollable,\n      styles.pseudoScrollbar\n    )\n\n    if (onEscapeKeyup) {\n      document.removeEventListener(\"keyup\", onEscapeKeyup)\n    }\n  }\n\n  /* Ensure sure add-on styles (e.g. unscrollable) and key event is cleaned up when the modal is unmounted*/\n  useEffect(() => () => cleanUpAfterClose(), [])\n\n  const onAfterLeaveHandler = (): void => {\n    cleanUpAfterClose()\n    propsOnAfterLeave?.()\n  }\n\n  return createPortal(\n    <Transition\n      appear={true}\n      show={isOpen}\n      enter={styles.animatingEnter}\n      leave={styles.animatingLeave}\n      beforeEnter={onBeforeEnterHandler}\n      afterEnter={onAfterEnterHandler}\n      afterLeave={onAfterLeaveHandler}\n      data-generic-modal-transition-wrapper\n      onClick={(e: React.MouseEvent): void => e.stopPropagation()}\n    >\n      <FocusLock\n        disabled={focusLockDisabled}\n        returnFocus={true}\n        // Disabling false positive\n        // eslint-disable-next-line jsx-a11y/no-autofocus\n        autoFocus={false}\n      >\n        <div className={styles.backdropLayer} />\n        {/* Disabling these because we don't want this to be keyboard focusable. Users can use Esc to achieve this with a keyboard.\n         */}\n        {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */}\n        <div\n          className={styles.scrollLayer}\n          ref={(scrollLayerRef): void => {\n            setScrollLayer(scrollLayerRef)\n          }}\n          onClick={outsideModalClickHandler}\n          data-testid={`${id}-scrollLayer`}\n        >\n          <ModalContext.Provider\n            value={{\n              labelledByID,\n              describedByID,\n            }}\n          >\n            <div\n              role=\"dialog\"\n              className={styles.modalLayer}\n              aria-labelledby={labelledByID}\n              aria-describedby={describedByID}\n              ref={(modalLayerRef): void => setModalLayer(modalLayerRef)}\n              data-testid={id}\n            >\n              {children}\n            </div>\n          </ModalContext.Provider>\n        </div>\n      </FocusLock>\n    </Transition>,\n    document.body\n  )\n}\n\nGenericModal.displayName = \"GenericModal\"\n"],"names":["GenericModal","_a","propsId","id","children","_b","isOpen","focusLockDisabled","onEscapeKeyup","onOutsideModalClick","propsOnAfterLeave","onAfterLeave","reactId","useId","labelledByID","describedByID","_c","useState","scrollLayer","setScrollLayer","_d","modalLayer","setModalLayer","scrollModalToTop","requestAnimationFrame","scrollTop","outsideModalClickHandler","event","target","focusAccessibleLabel","labelElement","document","getElementById","focus","a11yWarn","warn","preventBodyScroll","hasScrollbar","window","innerWidth","documentElement","clientWidth","scrollStyles","styles","unscrollable","push","pseudoScrollbar","classList","add","apply","onAfterEnterHandler","onBeforeEnterHandler","addEventListener","key","cleanUpAfterClose","remove","removeEventListener","useEffect","onAfterLeaveHandler","createPortal","React","createElement","Transition","appear","show","enter","animatingEnter","leave","animatingLeave","beforeEnter","afterEnter","afterLeave","onClick","e","stopPropagation","FocusLock","disabled","returnFocus","autoFocus","className","backdropLayer","ref","scrollLayerRef","concat","ModalContext","Provider","value","role","modalLayerRef","body","displayName"],"mappings":"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"}

package/dist/cjs/Slider/Slider.cjs

@@ -34,7 +34,7 @@ const Slider = /*#__PURE__*/function () {
     }, React.createElement("div", {
       className: Slider_module.labelWrapper
     }, React.createElement("div", {
-      className: "mb-4"
+      className: Slider_module.label
     }, React.createElement(Label.Label, {
       htmlFor: id,
       labelText: labelText,

package/dist/cjs/Slider/Slider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Slider.cjs","sources":["../../../src/Slider/Slider.tsx"],"sourcesContent":["import React, { ReactNode, useId } from \"react\"\nimport classnames from \"classnames\"\nimport { FieldGroup } from \"~components/FieldGroup\"\nimport { InputRange, InputRangeProps } from \"~components/Input/InputRange\"\nimport { Label } from \"~components/Label\"\nimport { Text } from \"~components/Text\"\nimport styles from \"./Slider.module.scss\"\n\nexport type SliderFieldProps = {\n  id?: string\n  labelText: ReactNode\n  description?: ReactNode\n  labelPosition?: \"inline\" | \"block\"\n  variant?: \"default\" | \"prominent\"\n  disabled?: boolean\n  readOnlyMessage?: ReactNode\n} & Omit<InputRangeProps, \"id\">\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081896335/Slider Guidance} |\n * {@link https://cultureamp.design/?path=/docs/components-slider--docs Storybook}\n */\nexport const Slider = ({\n  id: propsId,\n  labelText,\n  description,\n  labelPosition = \"inline\",\n  variant = \"default\",\n  disabled,\n  readOnlyMessage,\n  ...restProps\n}: SliderFieldProps): JSX.Element => {\n  const id = propsId ?? useId()\n  const descriptionId = `${id}-description`\n\n  return (\n    <FieldGroup inline>\n      <div\n        className={classnames(\n          styles.wrapper,\n          labelPosition === \"inline\" && styles.labelInline\n        )}\n      >\n        <div className={styles.labelWrapper}>\n          <div className=\"mb-4\">\n            <Label\n              htmlFor={id}\n              labelText={labelText}\n              variant={variant}\n              disabled={disabled}\n            />\n          </div>\n          {description && (\n            <Text\n              variant=\"small\"\n              id={descriptionId}\n              classNameOverride={\n                disabled ? styles.descriptionDisabled : undefined\n              }\n            >\n              {description}\n            </Text>\n          )}\n        </div>\n        <div className={styles.inputWrapper}>\n          <InputRange\n            id={id}\n            aria-describedby={descriptionId}\n            disabled={disabled}\n            {...restProps}\n          />\n          {readOnlyMessage && (\n            <div className={styles.readOnlyMessage}>{readOnlyMessage}</div>\n          )}\n        </div>\n      </div>\n    </FieldGroup>\n  )\n}\n\nSlider.displayName = \"Slider\"\n"],"names":["Slider","_a","propsId","id","labelText","description","_b","labelPosition","_c","variant","disabled","readOnlyMessage","restProps","__rest","useId","descriptionId","concat","React","createElement","FieldGroup","inline","className","classnames","styles","wrapper","labelInline","labelWrapper","Label","htmlFor","Text","classNameOverride","descriptionDisabled","undefined","inputWrapper","InputRange","__assign","displayName"],"mappings":";;;;;;;;;;;AAkBA;;;AAGG;AAHH,MAIaA,MAAM;EAAA,MAANA,MAAM,GAAG,SAAAA,CAACC,EASJ,EAAA;IARjB,IAAIC,OAAO,GAAAD,EAAA,CAAAE,EAAA;MACXC,SAAS,eAAA;MACTC,WAAW,GAAAJ,EAAA,CAAAI,WAAA;MACXC,EAAwB,GAAAL,EAAA,CAAAM,aAAA;MAAxBA,aAAa,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,QAAQ,GAAAA,EAAA;MACxBE,EAAmB,GAAAP,EAAA,CAAAQ,OAAA;MAAnBA,OAAO,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,SAAS,GAAAA,EAAA;MACnBE,QAAQ,GAAAT,EAAA,CAAAS,QAAA;MACRC,eAAe,GAAAV,EAAA,CAAAU,eAAA;MACZC,SAAS,GAAAC,KAAAA,CAAAA,MAAA,CAAAZ,EAAA,EARS,6FAStB,CADa;IAEZ,IAAME,EAAE,GAAGD,OAAO,KAAP,IAAA,IAAAA,OAAO,cAAPA,OAAO,GAAIY,KAAAA,CAAAA,KAAK,EAAE;IAC7B,IAAMC,aAAa,GAAG,EAAG,CAAAC,MAAA,CAAAb,EAAE,iBAAc;IAEzC,OACEc,KAAA,CAAAC,aAAA,CAACC,UAAU,CAAAA,UAAA,EAAA;MAACC,MAAM,EAAA;IAAA,CAAA,EAChBH,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;MACEG,SAAS,EAAEC,UAAU,CACnBC,aAAM,CAACC,OAAO,EACdjB,aAAa,KAAK,QAAQ,IAAIgB,aAAM,CAACE,WAAW;IACjD,CAAA,EAEDR,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;MAAKG,SAAS,EAAEE,aAAM,CAACG;IAAY,CAAA,EACjCT,KAAK,CAAAC,aAAA,CAAA,KAAA,EAAA;MAAAG,SAAS,EAAC;IAAM,CAAA,EACnBJ,KAAA,CAAAC,aAAA,CAACS,KAAAA,CAAAA,KAAK,EACJ;MAAAC,OAAO,EAAEzB,EAAE;MACXC,SAAS,EAAEA,SAAS;MACpBK,OAAO,EAAEA,OAAO;MAChBC,QAAQ,EAAEA;MACV,CACE,EACLL,WAAW,IACVY,KAAC,CAAAC,aAAA,CAAAW,IAAI,CAAAA,IAAA,EACH;MAAApB,OAAO,EAAC,OAAO;MACfN,EAAE,EAAEY,aAAa;MACjBe,iBAAiB,EACfpB,QAAQ,GAAGa,aAAM,CAACQ,mBAAmB,GAAGC;IAAS,CAAA,EAGlD3B,WAAW,CAEf,CACG,EACNY,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;MAAKG,SAAS,EAAEE,aAAM,CAACU;IAAY,CAAA,EACjChB,KAAA,CAAAC,aAAA,CAACgB,UAAAA,CAAAA,UAAU,EAAAC,KAAA,CAAAA,QAAA,CAAA;MACThC,EAAE,EAAEA,EAAE;MAAA,kBAAA,EACYY,aAAa;MAC/BL,QAAQ,EAAEA;IAAQ,CAAA,EACdE,SAAS,CACb,CAAA,EACDD,eAAe,IACdM,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;MAAKG,SAAS,EAAEE,aAAM,CAACZ;KAAkB,EAAAA,eAAe,CACzD,CACG,CACF,CACK;EAEjB,CAAC;EAEDX,MAAM,CAACoC,WAAW,GAAG,QAAQ;EAAA,OA1DhBpC,MAAM;AAAA;"}
+{"version":3,"file":"Slider.cjs","sources":["../../../src/Slider/Slider.tsx"],"sourcesContent":["import React, { ReactNode, useId } from \"react\"\nimport classnames from \"classnames\"\nimport { FieldGroup } from \"~components/FieldGroup\"\nimport { InputRange, InputRangeProps } from \"~components/Input/InputRange\"\nimport { Label } from \"~components/Label\"\nimport { Text } from \"~components/Text\"\nimport styles from \"./Slider.module.scss\"\n\nexport type SliderFieldProps = {\n  id?: string\n  labelText: ReactNode\n  description?: ReactNode\n  labelPosition?: \"inline\" | \"block\"\n  variant?: \"default\" | \"prominent\"\n  disabled?: boolean\n  readOnlyMessage?: ReactNode\n} & Omit<InputRangeProps, \"id\">\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3081896335/Slider Guidance} |\n * {@link https://cultureamp.design/?path=/docs/components-slider--docs Storybook}\n */\nexport const Slider = ({\n  id: propsId,\n  labelText,\n  description,\n  labelPosition = \"inline\",\n  variant = \"default\",\n  disabled,\n  readOnlyMessage,\n  ...restProps\n}: SliderFieldProps): JSX.Element => {\n  const id = propsId ?? useId()\n  const descriptionId = `${id}-description`\n\n  return (\n    <FieldGroup inline>\n      <div\n        className={classnames(\n          styles.wrapper,\n          labelPosition === \"inline\" && styles.labelInline\n        )}\n      >\n        <div className={styles.labelWrapper}>\n          <div className={styles.label}>\n            <Label\n              htmlFor={id}\n              labelText={labelText}\n              variant={variant}\n              disabled={disabled}\n            />\n          </div>\n          {description && (\n            <Text\n              variant=\"small\"\n              id={descriptionId}\n              classNameOverride={\n                disabled ? styles.descriptionDisabled : undefined\n              }\n            >\n              {description}\n            </Text>\n          )}\n        </div>\n        <div className={styles.inputWrapper}>\n          <InputRange\n            id={id}\n            aria-describedby={descriptionId}\n            disabled={disabled}\n            {...restProps}\n          />\n          {readOnlyMessage && (\n            <div className={styles.readOnlyMessage}>{readOnlyMessage}</div>\n          )}\n        </div>\n      </div>\n    </FieldGroup>\n  )\n}\n\nSlider.displayName = \"Slider\"\n"],"names":["Slider","_a","propsId","id","labelText","description","_b","labelPosition","_c","variant","disabled","readOnlyMessage","restProps","__rest","useId","descriptionId","concat","React","createElement","FieldGroup","inline","className","classnames","styles","wrapper","labelInline","labelWrapper","label","Label","htmlFor","Text","classNameOverride","descriptionDisabled","undefined","inputWrapper","InputRange","__assign","displayName"],"mappings":";;;;;;;;;;;AAkBA;;;AAGG;AAHH,MAIaA,MAAM;EAAA,MAANA,MAAM,GAAG,SAAAA,CAACC,EASJ,EAAA;IARjB,IAAIC,OAAO,GAAAD,EAAA,CAAAE,EAAA;MACXC,SAAS,eAAA;MACTC,WAAW,GAAAJ,EAAA,CAAAI,WAAA;MACXC,EAAwB,GAAAL,EAAA,CAAAM,aAAA;MAAxBA,aAAa,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,QAAQ,GAAAA,EAAA;MACxBE,EAAmB,GAAAP,EAAA,CAAAQ,OAAA;MAAnBA,OAAO,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,SAAS,GAAAA,EAAA;MACnBE,QAAQ,GAAAT,EAAA,CAAAS,QAAA;MACRC,eAAe,GAAAV,EAAA,CAAAU,eAAA;MACZC,SAAS,GAAAC,KAAAA,CAAAA,MAAA,CAAAZ,EAAA,EARS,6FAStB,CADa;IAEZ,IAAME,EAAE,GAAGD,OAAO,KAAP,IAAA,IAAAA,OAAO,cAAPA,OAAO,GAAIY,KAAAA,CAAAA,KAAK,EAAE;IAC7B,IAAMC,aAAa,GAAG,EAAG,CAAAC,MAAA,CAAAb,EAAE,iBAAc;IAEzC,OACEc,KAAA,CAAAC,aAAA,CAACC,UAAU,CAAAA,UAAA,EAAA;MAACC,MAAM,EAAA;IAAA,CAAA,EAChBH,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;MACEG,SAAS,EAAEC,UAAU,CACnBC,aAAM,CAACC,OAAO,EACdjB,aAAa,KAAK,QAAQ,IAAIgB,aAAM,CAACE,WAAW;IACjD,CAAA,EAEDR,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;MAAKG,SAAS,EAAEE,aAAM,CAACG;IAAY,CAAA,EACjCT,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;MAAKG,SAAS,EAAEE,aAAM,CAACI;IAAK,CAAA,EAC1BV,KAAA,CAAAC,aAAA,CAACU,KAAAA,CAAAA,KAAK,EACJ;MAAAC,OAAO,EAAE1B,EAAE;MACXC,SAAS,EAAEA,SAAS;MACpBK,OAAO,EAAEA,OAAO;MAChBC,QAAQ,EAAEA;MACV,CACE,EACLL,WAAW,IACVY,KAAC,CAAAC,aAAA,CAAAY,IAAI,CAAAA,IAAA,EACH;MAAArB,OAAO,EAAC,OAAO;MACfN,EAAE,EAAEY,aAAa;MACjBgB,iBAAiB,EACfrB,QAAQ,GAAGa,aAAM,CAACS,mBAAmB,GAAGC;IAAS,CAAA,EAGlD5B,WAAW,CAEf,CACG,EACNY,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;MAAKG,SAAS,EAAEE,aAAM,CAACW;IAAY,CAAA,EACjCjB,KAAA,CAAAC,aAAA,CAACiB,UAAAA,CAAAA,UAAU,EAAAC,KAAA,CAAAA,QAAA,CAAA;MACTjC,EAAE,EAAEA,EAAE;MAAA,kBAAA,EACYY,aAAa;MAC/BL,QAAQ,EAAEA;IAAQ,CAAA,EACdE,SAAS,CACb,CAAA,EACDD,eAAe,IACdM,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;MAAKG,SAAS,EAAEE,aAAM,CAACZ;KAAkB,EAAAA,eAAe,CACzD,CACG,CACF,CACK;EAEjB,CAAC;EAEDX,MAAM,CAACqC,WAAW,GAAG,QAAQ;EAAA,OA1DhBrC,MAAM;AAAA;"}

package/dist/cjs/Slider/Slider.module.scss.cjs

@@ -3,6 +3,7 @@
 var styles = {
   "wrapper": "Slider-module_wrapper__zVX6g",
   "labelWrapper": "Slider-module_labelWrapper__WuUIw",
+  "label": "Slider-module_label__CfIjh",
   "labelInline": "Slider-module_labelInline__zjINd",
   "inputWrapper": "Slider-module_inputWrapper__n16yj",
   "descriptionDisabled": "Slider-module_descriptionDisabled__8GwiS",

package/dist/cjs/Slider/Slider.module.scss.cjs.map

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

package/dist/cjs/Tile/MultiActionTile/MultiActionTile.cjs

@@ -9,7 +9,7 @@ var renderActions = function (primaryAction, secondaryAction) {
   return React.createElement("div", {
     className: MultiActionTile_module.actions
   }, secondaryAction && React.createElement("div", {
-    className: "mr-8"
+    className: MultiActionTile_module.secondaryAction
   }, React.createElement(Action, {
     action: secondaryAction,
     secondary: true

package/dist/cjs/Tile/MultiActionTile/MultiActionTile.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"MultiActionTile.cjs","sources":["../../../../src/Tile/MultiActionTile/MultiActionTile.tsx"],"sourcesContent":["import React from \"react\"\nimport {\n  GenericTile,\n  GenericTileProps,\n  TileAction,\n} from \"../subcomponents/GenericTile\"\nimport Action from \"../subcomponents/GenericTile/Action\"\nimport styles from \"./MultiActionTile.module.scss\"\n\nexport type MultiActionTileProps = {\n  primaryAction: TileAction\n  secondaryAction?: TileAction\n} & Omit<GenericTileProps, \"footer\">\n\nconst renderActions = (\n  primaryAction: TileAction,\n  secondaryAction?: TileAction\n): JSX.Element => (\n  <div className={styles.actions}>\n    {secondaryAction && (\n      <div className=\"mr-8\">\n        <Action action={secondaryAction} secondary />\n      </div>\n    )}\n    <Action action={primaryAction} />\n  </div>\n)\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3079077889/Tile#MultiActionTile.1 Guidance} |\n * {@link https://cultureamp.design/?path=/docs/components-tiles-multiactiontile--docs Storybook}\n */\nexport const MultiActionTile = ({\n  children,\n  primaryAction,\n  secondaryAction,\n  ...restProps\n}: MultiActionTileProps): JSX.Element => (\n  <GenericTile\n    footer={renderActions(primaryAction, secondaryAction)}\n    {...restProps}\n  >\n    {children}\n  </GenericTile>\n)\n\nMultiActionTile.displayName = \"MultiActionTile\"\n"],"names":["renderActions","primaryAction","secondaryAction","React","createElement","className","styles","actions","Action","action","secondary","MultiActionTile","_a","children","restProps","__rest","GenericTile","footer","displayName"],"mappings":";;;;;;;AAcA,IAAMA,aAAa,GAAG,SAAAA,CACpBC,aAAyB,EACzBC,eAA4B,EAAA;EACZ,OAChBC,KAAK,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAAC,SAAS,EAAEC,sBAAM,CAACC;EAAO,CAAA,EAC3BL,eAAe,IACdC,KAAK,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAAC,SAAS,EAAC;EAAM,CAAA,EACnBF,KAAC,CAAAC,aAAA,CAAAI,MAAM;IAACC,MAAM,EAAEP,eAAe;IAAEQ,SAAS,EAAG;EAAA,CAAA,CAAA,CAEhD,EACDP,KAAC,CAAAC,aAAA,CAAAI,MAAM,EAAC;IAAAC,MAAM,EAAER;IAAiB,CAC7B;CACP;AAED;;;AAGG;AAHH,MAIaU,eAAe;EAAA,MAAfA,eAAe,GAAG,SAAAA,CAACC,EAKT,EAAA;IAJrB,IAAAC,QAAQ,GAAAD,EAAA,CAAAC,QAAA;MACRZ,aAAa,GAAAW,EAAA,CAAAX,aAAA;MACbC,eAAe,GAAAU,EAAA,CAAAV,eAAA;MACZY,SAAS,GAJkBC,KAAAA,CAAAA,MAAA,CAAAH,EAAA,EAAA,CAAA,UAAA,EAAA,eAAA,EAAA,iBAAA,CAK/B,CADa;IAC2B,OACvCT,KAAC,CAAAC,aAAA,CAAAY,uBAAW;MACVC,MAAM,EAAEjB,aAAa,CAACC,aAAa,EAAEC,eAAe;IAAC,CACjD,EAAAY,SAAS,GAEZD,QAAQ,CACG;GACf;EAEDF,eAAe,CAACO,WAAW,GAAG,iBAAiB;EAAA,OAdlCP,eAAe;AAAA;"}
+{"version":3,"file":"MultiActionTile.cjs","sources":["../../../../src/Tile/MultiActionTile/MultiActionTile.tsx"],"sourcesContent":["import React from \"react\"\nimport {\n  GenericTile,\n  GenericTileProps,\n  TileAction,\n} from \"../subcomponents/GenericTile\"\nimport Action from \"../subcomponents/GenericTile/Action\"\nimport styles from \"./MultiActionTile.module.scss\"\n\nexport type MultiActionTileProps = {\n  primaryAction: TileAction\n  secondaryAction?: TileAction\n} & Omit<GenericTileProps, \"footer\">\n\nconst renderActions = (\n  primaryAction: TileAction,\n  secondaryAction?: TileAction\n): JSX.Element => (\n  <div className={styles.actions}>\n    {secondaryAction && (\n      <div className={styles.secondaryAction}>\n        <Action action={secondaryAction} secondary />\n      </div>\n    )}\n    <Action action={primaryAction} />\n  </div>\n)\n\n/**\n * {@link https://cultureamp.atlassian.net/wiki/spaces/DesignSystem/pages/3079077889/Tile#MultiActionTile.1 Guidance} |\n * {@link https://cultureamp.design/?path=/docs/components-tiles-multiactiontile--docs Storybook}\n */\nexport const MultiActionTile = ({\n  children,\n  primaryAction,\n  secondaryAction,\n  ...restProps\n}: MultiActionTileProps): JSX.Element => (\n  <GenericTile\n    footer={renderActions(primaryAction, secondaryAction)}\n    {...restProps}\n  >\n    {children}\n  </GenericTile>\n)\n\nMultiActionTile.displayName = \"MultiActionTile\"\n"],"names":["renderActions","primaryAction","secondaryAction","React","createElement","className","styles","actions","Action","action","secondary","MultiActionTile","_a","children","restProps","__rest","GenericTile","footer","displayName"],"mappings":";;;;;;;AAcA,IAAMA,aAAa,GAAG,SAAAA,CACpBC,aAAyB,EACzBC,eAA4B,EAAA;EACZ,OAChBC,KAAK,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAAC,SAAS,EAAEC,sBAAM,CAACC;EAAO,CAAA,EAC3BL,eAAe,IACdC,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;IAAKC,SAAS,EAAEC,sBAAM,CAACJ;EAAe,CAAA,EACpCC,KAAC,CAAAC,aAAA,CAAAI,MAAM;IAACC,MAAM,EAAEP,eAAe;IAAEQ,SAAS,EAAG;EAAA,CAAA,CAAA,CAEhD,EACDP,KAAC,CAAAC,aAAA,CAAAI,MAAM,EAAC;IAAAC,MAAM,EAAER;IAAiB,CAC7B;CACP;AAED;;;AAGG;AAHH,MAIaU,eAAe;EAAA,MAAfA,eAAe,GAAG,SAAAA,CAACC,EAKT,EAAA;IAJrB,IAAAC,QAAQ,GAAAD,EAAA,CAAAC,QAAA;MACRZ,aAAa,GAAAW,EAAA,CAAAX,aAAA;MACbC,eAAe,GAAAU,EAAA,CAAAV,eAAA;MACZY,SAAS,GAJkBC,KAAAA,CAAAA,MAAA,CAAAH,EAAA,EAAA,CAAA,UAAA,EAAA,eAAA,EAAA,iBAAA,CAK/B,CADa;IAC2B,OACvCT,KAAC,CAAAC,aAAA,CAAAY,uBAAW;MACVC,MAAM,EAAEjB,aAAa,CAACC,aAAa,EAAEC,eAAe;IAAC,CACjD,EAAAY,SAAS,GAEZD,QAAQ,CACG;GACf;EAEDF,eAAe,CAACO,WAAW,GAAG,iBAAiB;EAAA,OAdlCP,eAAe;AAAA;"}

package/dist/cjs/Tile/MultiActionTile/MultiActionTile.module.scss.cjs

@@ -1,7 +1,8 @@
 'use strict';
 
 var styles = {
-  "actions": "MultiActionTile-module_actions__mntsC"
+  "actions": "MultiActionTile-module_actions__mntsC",
+  "secondaryAction": "MultiActionTile-module_secondaryAction__DuXdD"
 };
 module.exports = styles;
 //# sourceMappingURL=MultiActionTile.module.scss.cjs.map

package/dist/cjs/Tile/MultiActionTile/MultiActionTile.module.scss.cjs.map

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

package/dist/cjs/Tile/subcomponents/GenericTile/GenericTile.cjs

@@ -34,7 +34,7 @@ const GenericTile = /*#__PURE__*/function () {
         variant: "heading-3",
         tag: titleTag
       }, title), metadata && React.createElement("div", {
-        className: "pt-4"
+        className: GenericTile_module.titleMeta
       }, React.createElement(Text.Text, {
         variant: "small",
         color: "dark-reduced-opacity"

package/dist/cjs/Tile/subcomponents/GenericTile/GenericTile.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"GenericTile.cjs","sources":["../../../../../src/Tile/subcomponents/GenericTile/GenericTile.tsx"],"sourcesContent":["import React, { HTMLAttributes, useState } from \"react\"\nimport classnames from \"classnames\"\nimport { IconButton } from \"~components/Button\"\nimport { GenericButtonProps } from \"~components/Button/GenericButton\"\nimport { AllowedHeadingTags, Heading } from \"~components/Heading\"\nimport { ArrowBackwardIcon, InformationIcon } from \"~components/Icon\"\nimport { Text } from \"~components/Text\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport Action from \"./Action\"\nimport { Moods } from \"./types\"\nimport styles from \"./GenericTile.module.scss\"\n\nexport type TileAction = {\n  label: string\n  onClick?: GenericButtonProps[\"onClick\"]\n  href?: string\n  icon?: JSX.Element\n  /**\n   * @deprecated use data-testid instead\n   */\n  automationId?: string\n  newTabAndIUnderstandTheAccessibilityImplications?: boolean\n} & HTMLAttributes<HTMLButtonElement>\n\nexport type TileInformation = {\n  text: string\n  primaryAction?: TileAction\n  secondaryAction?: TileAction\n}\n\nexport type GenericTileProps = {\n  children?: React.ReactNode\n  title: React.ReactNode\n  titleTag?: AllowedHeadingTags\n  metadata?: string\n  information?: TileInformation | React.ReactNode\n  mood?: Moods\n  footer: React.ReactNode\n} & OverrideClassName<Omit<HTMLAttributes<HTMLDivElement>, \"title\">>\n\nexport const GenericTile = ({\n  children,\n  title,\n  titleTag = \"h3\",\n  metadata,\n  information,\n  mood,\n  footer,\n  classNameOverride,\n  ...restProps\n}: GenericTileProps): JSX.Element => {\n  const [isFlipped, setIsFlipped] = useState<boolean>(false)\n\n  const renderTitle = (): JSX.Element => (\n    <div className={styles.title}>\n      <Heading variant=\"heading-3\" tag={titleTag}>\n        {title}\n      </Heading>\n      {metadata && (\n        <div className=\"pt-4\">\n          <Text variant=\"small\" color=\"dark-reduced-opacity\">\n            {metadata}\n          </Text>\n        </div>\n      )}\n    </div>\n  )\n\n  const renderActions = (\n    primaryAction?: TileAction,\n    secondaryAction?: TileAction,\n    disabled?: boolean\n  ): JSX.Element => (\n    <div className={styles.actions}>\n      {secondaryAction && (\n        <Action action={secondaryAction} secondary disabled={disabled} />\n      )}\n      {primaryAction && <Action action={primaryAction} disabled={disabled} />}\n    </div>\n  )\n\n  const renderFront = (): JSX.Element => (\n    <div\n      className={classnames(\n        styles.face,\n        styles.faceFront,\n        mood === \"positive\" && styles.faceMoodPositive,\n        mood === \"informative\" && styles.faceMoodInformative,\n        mood === \"cautionary\" && styles.faceMoodCautionary,\n        mood === \"assertive\" && styles.faceMoodAssertive,\n        mood === \"negative\" && styles.faceMoodNegative,\n        mood === \"prominent\" && styles.faceMoodProminent\n      )}\n    >\n      {information && (\n        <div className={styles.informationBtn}>\n          <IconButton\n            label=\"Information\"\n            icon={<InformationIcon role=\"presentation\" />}\n            onClick={(): void => setIsFlipped(true)}\n            disabled={isFlipped}\n            aria-hidden={isFlipped}\n          />\n        </div>\n      )}\n      {renderTitle()}\n      <div className={styles.children}>{children && children}</div>\n      {footer && <div className={styles.footer}>{footer}</div>}\n    </div>\n  )\n\n  const renderInformation = (\n    informationProp: GenericTileProps[\"information\"] | undefined\n  ): JSX.Element | React.ReactNode => {\n    if (\n      informationProp &&\n      typeof informationProp === \"object\" &&\n      \"text\" in informationProp\n    ) {\n      return (\n        <>\n          <Text variant=\"body\">{informationProp.text}</Text>\n          {(informationProp.primaryAction ||\n            informationProp.secondaryAction) && (\n            <div className={styles.footer}>\n              {renderActions(\n                informationProp.primaryAction,\n                informationProp.secondaryAction,\n                !isFlipped\n              )}\n            </div>\n          )}\n        </>\n      )\n    }\n\n    return informationProp\n  }\n\n  const renderBack = (): JSX.Element | void => {\n    if (!information) return\n\n    return (\n      <div className={classnames(styles.face, styles.faceBack)}>\n        <div className={styles.informationBtn}>\n          <IconButton\n            label=\"Information\"\n            icon={<ArrowBackwardIcon role=\"presentation\" />}\n            onClick={(): void => setIsFlipped(false)}\n            disabled={!isFlipped}\n            aria-hidden={!isFlipped}\n          />\n        </div>\n        <div className={styles.information}>\n          {renderInformation(information)}\n        </div>\n      </div>\n    )\n  }\n\n  return (\n    <div className={classnames(styles.root, classNameOverride)} {...restProps}>\n      <div className={classnames(styles.tile, isFlipped && styles.isFlipped)}>\n        <>\n          {renderFront()}\n          {renderBack()}\n        </>\n      </div>\n    </div>\n  )\n}\n\nGenericTile.displayName = \"GenericTile\"\n"],"names":["GenericTile","_a","children","title","_b","titleTag","metadata","information","mood","footer","classNameOverride","restProps","__rest","_c","useState","isFlipped","setIsFlipped","renderTitle","React","className","styles","createElement","Heading","variant","tag","Text","color","renderActions","primaryAction","secondaryAction","disabled","actions","Action","action","secondary","renderFront","classnames","face","faceFront","faceMoodPositive","faceMoodInformative","faceMoodCautionary","faceMoodAssertive","faceMoodNegative","faceMoodProminent","informationBtn","IconButton","label","icon","InformationIcon","role","onClick","renderInformation","informationProp","Fragment","text","renderBack","faceBack","ArrowBackwardIcon","__assign","root","tile","displayName"],"mappings":"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"}
+{"version":3,"file":"GenericTile.cjs","sources":["../../../../../src/Tile/subcomponents/GenericTile/GenericTile.tsx"],"sourcesContent":["import React, { HTMLAttributes, useState } from \"react\"\nimport classnames from \"classnames\"\nimport { IconButton } from \"~components/Button\"\nimport { GenericButtonProps } from \"~components/Button/GenericButton\"\nimport { AllowedHeadingTags, Heading } from \"~components/Heading\"\nimport { ArrowBackwardIcon, InformationIcon } from \"~components/Icon\"\nimport { Text } from \"~components/Text\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport Action from \"./Action\"\nimport { Moods } from \"./types\"\nimport styles from \"./GenericTile.module.scss\"\n\nexport type TileAction = {\n  label: string\n  onClick?: GenericButtonProps[\"onClick\"]\n  href?: string\n  icon?: JSX.Element\n  /**\n   * @deprecated use data-testid instead\n   */\n  automationId?: string\n  newTabAndIUnderstandTheAccessibilityImplications?: boolean\n} & HTMLAttributes<HTMLButtonElement>\n\nexport type TileInformation = {\n  text: string\n  primaryAction?: TileAction\n  secondaryAction?: TileAction\n}\n\nexport type GenericTileProps = {\n  children?: React.ReactNode\n  title: React.ReactNode\n  titleTag?: AllowedHeadingTags\n  metadata?: string\n  information?: TileInformation | React.ReactNode\n  mood?: Moods\n  footer: React.ReactNode\n} & OverrideClassName<Omit<HTMLAttributes<HTMLDivElement>, \"title\">>\n\nexport const GenericTile = ({\n  children,\n  title,\n  titleTag = \"h3\",\n  metadata,\n  information,\n  mood,\n  footer,\n  classNameOverride,\n  ...restProps\n}: GenericTileProps): JSX.Element => {\n  const [isFlipped, setIsFlipped] = useState<boolean>(false)\n\n  const renderTitle = (): JSX.Element => (\n    <div className={styles.title}>\n      <Heading variant=\"heading-3\" tag={titleTag}>\n        {title}\n      </Heading>\n      {metadata && (\n        <div className={styles.titleMeta}>\n          <Text variant=\"small\" color=\"dark-reduced-opacity\">\n            {metadata}\n          </Text>\n        </div>\n      )}\n    </div>\n  )\n\n  const renderActions = (\n    primaryAction?: TileAction,\n    secondaryAction?: TileAction,\n    disabled?: boolean\n  ): JSX.Element => (\n    <div className={styles.actions}>\n      {secondaryAction && (\n        <Action action={secondaryAction} secondary disabled={disabled} />\n      )}\n      {primaryAction && <Action action={primaryAction} disabled={disabled} />}\n    </div>\n  )\n\n  const renderFront = (): JSX.Element => (\n    <div\n      className={classnames(\n        styles.face,\n        styles.faceFront,\n        mood === \"positive\" && styles.faceMoodPositive,\n        mood === \"informative\" && styles.faceMoodInformative,\n        mood === \"cautionary\" && styles.faceMoodCautionary,\n        mood === \"assertive\" && styles.faceMoodAssertive,\n        mood === \"negative\" && styles.faceMoodNegative,\n        mood === \"prominent\" && styles.faceMoodProminent\n      )}\n    >\n      {information && (\n        <div className={styles.informationBtn}>\n          <IconButton\n            label=\"Information\"\n            icon={<InformationIcon role=\"presentation\" />}\n            onClick={(): void => setIsFlipped(true)}\n            disabled={isFlipped}\n            aria-hidden={isFlipped}\n          />\n        </div>\n      )}\n      {renderTitle()}\n      <div className={styles.children}>{children && children}</div>\n      {footer && <div className={styles.footer}>{footer}</div>}\n    </div>\n  )\n\n  const renderInformation = (\n    informationProp: GenericTileProps[\"information\"] | undefined\n  ): JSX.Element | React.ReactNode => {\n    if (\n      informationProp &&\n      typeof informationProp === \"object\" &&\n      \"text\" in informationProp\n    ) {\n      return (\n        <>\n          <Text variant=\"body\">{informationProp.text}</Text>\n          {(informationProp.primaryAction ||\n            informationProp.secondaryAction) && (\n            <div className={styles.footer}>\n              {renderActions(\n                informationProp.primaryAction,\n                informationProp.secondaryAction,\n                !isFlipped\n              )}\n            </div>\n          )}\n        </>\n      )\n    }\n\n    return informationProp\n  }\n\n  const renderBack = (): JSX.Element | void => {\n    if (!information) return\n\n    return (\n      <div className={classnames(styles.face, styles.faceBack)}>\n        <div className={styles.informationBtn}>\n          <IconButton\n            label=\"Information\"\n            icon={<ArrowBackwardIcon role=\"presentation\" />}\n            onClick={(): void => setIsFlipped(false)}\n            disabled={!isFlipped}\n            aria-hidden={!isFlipped}\n          />\n        </div>\n        <div className={styles.information}>\n          {renderInformation(information)}\n        </div>\n      </div>\n    )\n  }\n\n  return (\n    <div className={classnames(styles.root, classNameOverride)} {...restProps}>\n      <div className={classnames(styles.tile, isFlipped && styles.isFlipped)}>\n        <>\n          {renderFront()}\n          {renderBack()}\n        </>\n      </div>\n    </div>\n  )\n}\n\nGenericTile.displayName = \"GenericTile\"\n"],"names":["GenericTile","_a","children","title","_b","titleTag","metadata","information","mood","footer","classNameOverride","restProps","__rest","_c","useState","isFlipped","setIsFlipped","renderTitle","React","className","styles","createElement","Heading","variant","tag","titleMeta","Text","color","renderActions","primaryAction","secondaryAction","disabled","actions","Action","action","secondary","renderFront","classnames","face","faceFront","faceMoodPositive","faceMoodInformative","faceMoodCautionary","faceMoodAssertive","faceMoodNegative","faceMoodProminent","informationBtn","IconButton","label","icon","InformationIcon","role","onClick","renderInformation","informationProp","Fragment","text","renderBack","faceBack","ArrowBackwardIcon","__assign","root","tile","displayName"],"mappings":";;;;;;;;;;;;;;MAwCaA,WAAW;EAAA,MAAXA,WAAW,GAAG,SAAAA,CAACC,EAUT,EAAA;IATjB,IAAAC,QAAQ,GAAAD,EAAA,CAAAC,QAAA;MACRC,KAAK,GAAAF,EAAA,CAAAE,KAAA;MACLC,EAAe,GAAAH,EAAA,CAAAI,QAAA;MAAfA,QAAQ,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,IAAI,GAAAA,EAAA;MACfE,QAAQ,GAAAL,EAAA,CAAAK,QAAA;MACRC,WAAW,GAAAN,EAAA,CAAAM,WAAA;MACXC,IAAI,GAAAP,EAAA,CAAAO,IAAA;MACJC,MAAM,GAAAR,EAAA,CAAAQ,MAAA;MACNC,iBAAiB,GAAAT,EAAA,CAAAS,iBAAA;MACdC,SAAS,GAAAC,KAAA,CAAAA,MAAA,CAAAX,EAAA,EATc,mGAU3B,CADa;IAEN,IAAAY,EAAA,GAA4BC,KAAAA,CAAAA,QAAQ,CAAU,KAAK,CAAC;MAAnDC,SAAS,GAAAF,EAAA,CAAA,CAAA,CAAA;MAAEG,YAAY,GAAAH,EAAA,CAAA,CAAA,CAA4B;IAE1D,IAAMI,WAAW,GAAG,SAAAA,CAAA,EAAA;MAAmB,OACrCC;QAAKC,SAAS,EAAEC,kBAAM,CAACjB;MAAK,CAAA,EAC1Be,KAAC,CAAAG,aAAA,CAAAC,OAAAA,CAAAA,OAAO,EAAC;QAAAC,OAAO,EAAC,WAAW;QAACC,GAAG,EAAEnB;MAC/B,CAAA,EAAAF,KAAK,CACE,EACTG,QAAQ,IACPY,KAAA,CAAAG,aAAA,CAAA,KAAA,EAAA;QAAKF,SAAS,EAAEC,kBAAM,CAACK;MAAS,CAAA,EAC9BP,KAAA,CAAAG,aAAA,CAACK,SAAI,EAAC;QAAAH,OAAO,EAAC,OAAO;QAACI,KAAK,EAAC;MACzB,CAAA,EAAArB,QAAQ,CACJ,CAEV,CACG;IACP,CAAA;IAED,IAAMsB,aAAa,GAAG,SAAAA,CACpBC,aAA0B,EAC1BC,eAA4B,EAC5BC,QAAkB,EACF;MAAA,OAChBb,KAAK,CAAAG,aAAA,CAAA,KAAA,EAAA;QAAAF,SAAS,EAAEC,kBAAM,CAACY;MAAO,CAAA,EAC3BF,eAAe,IACdZ,KAAC,CAAAG,aAAA,CAAAY,MAAM;QAACC,MAAM,EAAEJ,eAAe;QAAEK,SAAS,EAAC,IAAA;QAAAJ,QAAQ,EAAEA;QACtD,EACAF,aAAa,IAAIX,KAAC,CAAAG,aAAA,CAAAY,MAAM,EAAC;QAAAC,MAAM,EAAEL,aAAa;QAAEE,QAAQ,EAAEA;OAAY,CAAA,CACnE;IACP,CAAA;IAED,IAAMK,WAAW,GAAG,SAAAA,CAAA,EAAmB;MAAA,OACrClB,KAAA,CAAAG,aAAA,CAAA,KAAA,EAAA;QACEF,SAAS,EAAEkB,UAAU,CACnBjB,kBAAM,CAACkB,IAAI,EACXlB,kBAAM,CAACmB,SAAS,EAChB/B,IAAI,KAAK,UAAU,IAAIY,kBAAM,CAACoB,gBAAgB,EAC9ChC,IAAI,KAAK,aAAa,IAAIY,kBAAM,CAACqB,mBAAmB,EACpDjC,IAAI,KAAK,YAAY,IAAIY,kBAAM,CAACsB,kBAAkB,EAClDlC,IAAI,KAAK,WAAW,IAAIY,kBAAM,CAACuB,iBAAiB,EAChDnC,IAAI,KAAK,UAAU,IAAIY,kBAAM,CAACwB,gBAAgB,EAC9CpC,IAAI,KAAK,WAAW,IAAIY,kBAAM,CAACyB,iBAAiB;MACjD,CAAA,EAEAtC,WAAW,IACVW,KAAA,CAAAG,aAAA,CAAA,KAAA,EAAA;QAAKF,SAAS,EAAEC,kBAAM,CAAC0B;MAAc,CAAA,EACnC5B,KAAA,CAAAG,aAAA,CAAC0B,qBAAU,EAAA;QACTC,KAAK,EAAC,aAAa;QACnBC,IAAI,EAAE/B,KAAA,CAAAG,aAAA,CAAC6B,+BAAe,EAAC;UAAAC,IAAI,EAAC;QAAc,EAAG;QAC7CC,OAAO,EAAE,SAAAA,CAAA,EAAA;UAAY,OAAApC,YAAY,CAAC,IAAI,CAAC;QAAlB,CAAkB;QACvCe,QAAQ,EAAEhB,SAAS;QAAA,aAAA,EACNA;MAAS,CAAA,CACtB,CAEL,EACAE,WAAW,CAAE,CAAA,EACdC,KAAK,CAAAG,aAAA,CAAA,KAAA,EAAA;QAAAF,SAAS,EAAEC,kBAAM,CAAClB;MAAQ,CAAG,EAAAA,QAAQ,IAAIA,QAAQ,CAAO,EAC5DO,MAAM,IAAIS,KAAA,CAAAG,aAAA,CAAA,KAAA,EAAA;QAAKF,SAAS,EAAEC,kBAAM,CAACX;MAAS,CAAA,EAAAA,MAAM,CAAO,CACpD;IACP,CAAA;IAED,IAAM4C,iBAAiB,GAAG,SAAAA,CACxBC,eAA4D,EAAA;MAE5D,IACEA,eAAe,IACf,OAAOA,eAAe,KAAK,QAAQ,IACnC,MAAM,IAAIA,eAAe,EACzB;QACA,OACEpC,KAAA,CAAAG,aAAA,CAAAH,KAAA,CAAAqC,QAAA,EAAA,IAAA,EACErC,KAAC,CAAAG,aAAA,CAAAK,SAAI;UAACH,OAAO,EAAC;QAAQ,CAAA,EAAA+B,eAAe,CAACE,IAAI,CAAQ,EACjD,CAACF,eAAe,CAACzB,aAAa,IAC7ByB,eAAe,CAACxB,eAAe,KAC/BZ,KAAA,CAAAG,aAAA,CAAA,KAAA,EAAA;UAAKF,SAAS,EAAEC,kBAAM,CAACX;QAAM,CAAA,EAC1BmB,aAAa,CACZ0B,eAAe,CAACzB,aAAa,EAC7ByB,eAAe,CAACxB,eAAe,EAC/B,CAACf,SAAS,CACX,CAEJ,CACA;MAEN;MAED,OAAOuC,eAAe;IACxB,CAAC;IAED,IAAMG,UAAU,GAAG,SAAAA,CAAA,EAAA;MACjB,IAAI,CAAClD,WAAW,EAAE;MAElB,OACEW,KAAA,CAAAG,aAAA,CAAA,KAAA,EAAA;QAAKF,SAAS,EAAEkB,UAAU,CAACjB,kBAAM,CAACkB,IAAI,EAAElB,kBAAM,CAACsC,QAAQ;MAAC,CAAA,EACtDxC,KAAA,CAAAG,aAAA,CAAA,KAAA,EAAA;QAAKF,SAAS,EAAEC,kBAAM,CAAC0B;MAAc,CAAA,EACnC5B,KAAA,CAAAG,aAAA,CAAC0B,qBAAU,EAAA;QACTC,KAAK,EAAC,aAAa;QACnBC,IAAI,EAAE/B,KAAA,CAAAG,aAAA,CAACsC,mCAAiB,EAAC;UAAAR,IAAI,EAAC;QAAc,EAAG;QAC/CC,OAAO,EAAE,SAAAA,CAAA,EAAA;UAAY,OAAApC,YAAY,CAAC,KAAK,CAAC;SAAA;QACxCe,QAAQ,EAAE,CAAChB,SAAS;QAAA,aAAA,EACP,CAACA;QACd,CACE,EACNG,KAAA,CAAAG,aAAA,CAAA,KAAA,EAAA;QAAKF,SAAS,EAAEC,kBAAM,CAACb;MAAW,CAAA,EAC/B8C,iBAAiB,CAAC9C,WAAW,CAAC,CAC3B,CACF;IAEV,CAAC;IAED,OACEW,KAAA,CAAAG,aAAA,CAAA,KAAA,EAAAuC,KAAA,CAAAA,QAAA,CAAA;MAAKzC,SAAS,EAAEkB,UAAU,CAACjB,kBAAM,CAACyC,IAAI,EAAEnD,iBAAiB;IAAC,GAAMC,SAAS,CAAA,EACvEO,KAAA,CAAAG,aAAA,CAAA,KAAA,EAAA;MAAKF,SAAS,EAAEkB,UAAU,CAACjB,kBAAM,CAAC0C,IAAI,EAAE/C,SAAS,IAAIK,kBAAM,CAACL,SAAS;IAAC,CAAA,EACpEG,KAAA,CAAAG,aAAA,CAAAH,KAAA,CAAAqC,QAAA,EAAA,IAAA,EACGnB,WAAW,CAAE,CAAA,EACbqB,UAAU,CAAA,CAAE,CACZ,CACC,CACF;EAEV,CAAC;EAEDzD,WAAW,CAAC+D,WAAW,GAAG,aAAa;EAAA,OApI1B/D,WAAW;AAAA;"}

package/dist/cjs/Tile/subcomponents/GenericTile/GenericTile.module.scss.cjs

@@ -3,6 +3,7 @@
 var styles = {
   "root": "GenericTile-module_root__9ZHdH",
   "tile": "GenericTile-module_tile__mgFhk",
+  "titleMeta": "GenericTile-module_titleMeta__EREc9",
   "face": "GenericTile-module_face__-KLVi",
   "faceFront": "GenericTile-module_faceFront__HywHi",
   "faceBack": "GenericTile-module_faceBack__NDCQ8",

package/dist/cjs/Tile/subcomponents/GenericTile/GenericTile.module.scss.cjs.map

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

package/dist/cjs/Workflow/subcomponents/Footer/components/ProgressStepper/ProgressStepper.cjs

@@ -8,6 +8,7 @@ var IndicatorActiveIcon = require('../../../../../Icon/IndicatorActiveIcon.cjs')
 var IndicatorInactiveIcon = require('../../../../../Icon/IndicatorInactiveIcon.cjs');
 var SuccessIcon = require('../../../../../Icon/SuccessIcon.cjs');
 var Text = require('../../../../../Text/Text.cjs');
+var VisuallyHidden = require('../../../../../VisuallyHidden/VisuallyHidden.cjs');
 var ProgressStepper_module = require('./ProgressStepper.module.scss.cjs');
 var getStepStatus = function (isComplete, isCurrentStep, step, index) {
   if (isComplete) {
@@ -68,9 +69,7 @@ const ProgressStepper = /*#__PURE__*/function () {
         "aria-current": isCurrentStep
       }, React.createElement("div", {
         className: ProgressStepper_module.stepContent
-      }, React.createElement("span", {
-        className: "sr-only"
-      }, accessibleName), React.createElement(Text.Text, {
+      }, React.createElement(VisuallyHidden.VisuallyHidden, null, accessibleName), React.createElement(Text.Text, {
         classNameOverride: ProgressStepper_module.stepName,
         variant: "small",
         color: "white",

package/dist/cjs/Workflow/subcomponents/Footer/components/ProgressStepper/ProgressStepper.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressStepper.cjs","sources":["../../../../../../../src/Workflow/subcomponents/Footer/components/ProgressStepper/ProgressStepper.tsx"],"sourcesContent":["import React from \"react\"\nimport classnames from \"classnames\"\nimport {\n  IndicatorActiveIcon,\n  IndicatorInactiveIcon,\n  SuccessIcon,\n} from \"~components/Icon\"\nimport { Text } from \"~components/Text\"\nimport styles from \"./ProgressStepper.module.scss\"\n\nexport type ProgressStepperProps = {\n  stepName: string\n  steps: [string, ...string[]]\n  isComplete?: boolean\n}\n\nconst getStepStatus = (\n  isComplete: boolean,\n  isCurrentStep: boolean,\n  step: string,\n  index: number\n): {\n  icon: JSX.Element\n  accessibleName: string\n} => {\n  if (isComplete) {\n    return {\n      icon: (\n        <SuccessIcon\n          key={index}\n          inheritSize\n          role=\"presentation\"\n          classNameOverride=\"success\"\n        />\n      ),\n      accessibleName: `Completed: ${step}`,\n    }\n  }\n  if (isCurrentStep) {\n    return {\n      icon: (\n        <IndicatorActiveIcon\n          key={index}\n          inheritSize\n          role=\"presentation\"\n          classNameOverride=\"active\"\n        />\n      ),\n      accessibleName: `Current: ${step}`,\n    }\n  }\n  return {\n    icon: (\n      <IndicatorInactiveIcon\n        key={index}\n        inheritSize\n        classNameOverride=\"incomplete\"\n        role=\"presentation\"\n      />\n    ),\n    accessibleName: `Not started: ${step}`,\n  }\n}\n\nexport const ProgressStepper = ({\n  stepName,\n  steps,\n  isComplete = false,\n  ...restprops\n}: ProgressStepperProps): JSX.Element => {\n  const currentStepIndex = steps.indexOf(stepName)\n\n  return (\n    <div className={styles.stepsContainer}>\n      <ol\n        className={styles.stepList}\n        {...restprops}\n        aria-labelledby=\"stepper-description\"\n      >\n        {steps.map((step: string, index: number) => {\n          const isCurrentStep = currentStepIndex === index\n          const isCompletedStep = index < currentStepIndex || isComplete\n          const { accessibleName, icon: Icon } = getStepStatus(\n            isCompletedStep,\n            isCurrentStep,\n            step,\n            index\n          )\n          return (\n            <li\n              className={styles.step}\n              key={`${index}-${step}`}\n              aria-current={isCurrentStep}\n            >\n              <div className={styles.stepContent}>\n                <span className=\"sr-only\">\n                  {/* will need to be translated */}\n                  {accessibleName}\n                </span>\n                <Text\n                  classNameOverride={styles.stepName}\n                  variant=\"small\"\n                  color=\"white\"\n                  aria-hidden\n                >\n                  {step}\n                </Text>\n                <div className={styles.stepIndicator}>\n                  <span className={styles.stepIcon}>{Icon}</span>\n                </div>\n                {index < steps.length - 1 && (\n                  <div\n                    className={classnames([\n                      styles.stepDivider,\n                      isCompletedStep && styles.completedStep,\n                    ])}\n                  />\n                )}\n              </div>\n            </li>\n          )\n        })}\n      </ol>\n      <Text\n        classNameOverride={styles.stepperDescription}\n        variant=\"small\"\n        color=\"white\"\n        id=\"stepper-description\"\n      >\n        Step {currentStepIndex + 1} of {steps.length}\n      </Text>\n    </div>\n  )\n}\n\nProgressStepper.displayName = \"Workflow.ProgressStepper\"\n"],"names":["getStepStatus","isComplete","isCurrentStep","step","index","icon","React","createElement","SuccessIcon","key","inheritSize","role","classNameOverride","accessibleName","concat","IndicatorActiveIcon","IndicatorInactiveIcon","ProgressStepper","_a","stepName","steps","_b","restprops","__rest","currentStepIndex","indexOf","className","styles","stepsContainer","__assign","stepList","map","isCompletedStep","Icon","stepContent","Text","variant","color","stepIndicator","stepIcon","length","classnames","stepDivider","completedStep","stepperDescription","id","displayName"],"mappings":"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"}
+{"version":3,"file":"ProgressStepper.cjs","sources":["../../../../../../../src/Workflow/subcomponents/Footer/components/ProgressStepper/ProgressStepper.tsx"],"sourcesContent":["import React from \"react\"\nimport classnames from \"classnames\"\nimport {\n  IndicatorActiveIcon,\n  IndicatorInactiveIcon,\n  SuccessIcon,\n} from \"~components/Icon\"\nimport { Text } from \"~components/Text\"\nimport { VisuallyHidden } from \"~components/VisuallyHidden\"\nimport styles from \"./ProgressStepper.module.scss\"\n\nexport type ProgressStepperProps = {\n  stepName: string\n  steps: [string, ...string[]]\n  isComplete?: boolean\n}\n\nconst getStepStatus = (\n  isComplete: boolean,\n  isCurrentStep: boolean,\n  step: string,\n  index: number\n): {\n  icon: JSX.Element\n  accessibleName: string\n} => {\n  if (isComplete) {\n    return {\n      icon: (\n        <SuccessIcon\n          key={index}\n          inheritSize\n          role=\"presentation\"\n          classNameOverride=\"success\"\n        />\n      ),\n      accessibleName: `Completed: ${step}`,\n    }\n  }\n  if (isCurrentStep) {\n    return {\n      icon: (\n        <IndicatorActiveIcon\n          key={index}\n          inheritSize\n          role=\"presentation\"\n          classNameOverride=\"active\"\n        />\n      ),\n      accessibleName: `Current: ${step}`,\n    }\n  }\n  return {\n    icon: (\n      <IndicatorInactiveIcon\n        key={index}\n        inheritSize\n        classNameOverride=\"incomplete\"\n        role=\"presentation\"\n      />\n    ),\n    accessibleName: `Not started: ${step}`,\n  }\n}\n\nexport const ProgressStepper = ({\n  stepName,\n  steps,\n  isComplete = false,\n  ...restprops\n}: ProgressStepperProps): JSX.Element => {\n  const currentStepIndex = steps.indexOf(stepName)\n\n  return (\n    <div className={styles.stepsContainer}>\n      <ol\n        className={styles.stepList}\n        {...restprops}\n        aria-labelledby=\"stepper-description\"\n      >\n        {steps.map((step: string, index: number) => {\n          const isCurrentStep = currentStepIndex === index\n          const isCompletedStep = index < currentStepIndex || isComplete\n          const { accessibleName, icon: Icon } = getStepStatus(\n            isCompletedStep,\n            isCurrentStep,\n            step,\n            index\n          )\n          return (\n            <li\n              className={styles.step}\n              key={`${index}-${step}`}\n              aria-current={isCurrentStep}\n            >\n              <div className={styles.stepContent}>\n                <VisuallyHidden>\n                  {/* will need to be translated */}\n                  {accessibleName}\n                </VisuallyHidden>\n                <Text\n                  classNameOverride={styles.stepName}\n                  variant=\"small\"\n                  color=\"white\"\n                  aria-hidden\n                >\n                  {step}\n                </Text>\n                <div className={styles.stepIndicator}>\n                  <span className={styles.stepIcon}>{Icon}</span>\n                </div>\n                {index < steps.length - 1 && (\n                  <div\n                    className={classnames([\n                      styles.stepDivider,\n                      isCompletedStep && styles.completedStep,\n                    ])}\n                  />\n                )}\n              </div>\n            </li>\n          )\n        })}\n      </ol>\n      <Text\n        classNameOverride={styles.stepperDescription}\n        variant=\"small\"\n        color=\"white\"\n        id=\"stepper-description\"\n      >\n        Step {currentStepIndex + 1} of {steps.length}\n      </Text>\n    </div>\n  )\n}\n\nProgressStepper.displayName = \"Workflow.ProgressStepper\"\n"],"names":["getStepStatus","isComplete","isCurrentStep","step","index","icon","React","createElement","SuccessIcon","key","inheritSize","role","classNameOverride","accessibleName","concat","IndicatorActiveIcon","IndicatorInactiveIcon","ProgressStepper","_a","stepName","steps","_b","restprops","__rest","currentStepIndex","indexOf","className","styles","stepsContainer","__assign","stepList","map","isCompletedStep","Icon","stepContent","VisuallyHidden","Text","variant","color","stepIndicator","stepIcon","length","classnames","stepDivider","completedStep","stepperDescription","id","displayName"],"mappings":"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"}

package/dist/cjs/Workflow/subcomponents/Header/components/Titles/Titles.cjs

@@ -4,6 +4,7 @@ var tslib = require('tslib');
 var React = require('react');
 var Heading = require('../../../../../Heading/Heading.cjs');
 var Tag = require('../../../../../Tag/Tag.cjs');
+var VisuallyHidden = require('../../../../../VisuallyHidden/VisuallyHidden.cjs');
 var Titles_module = require('./Titles.module.scss.cjs');
 const Titles = /*#__PURE__*/function () {
   const Titles = function (_a) {
@@ -23,9 +24,7 @@ const Titles = /*#__PURE__*/function () {
       variant: "heading-6",
       tag: "span",
       color: "dark-reduced-opacity"
-    }, workflowName, React.createElement("span", {
-      className: "sr-only"
-    }, ":")), React.createElement("span", null, stepName)), status &&
+    }, workflowName, React.createElement(VisuallyHidden.VisuallyHidden, null, ":")), React.createElement("span", null, stepName)), status &&
     // status may need to be update by a fetch
     React.createElement("div", {
       className: Titles_module.status

package/dist/cjs/Workflow/subcomponents/Header/components/Titles/Titles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Titles.cjs","sources":["../../../../../../../src/Workflow/subcomponents/Header/components/Titles/Titles.tsx"],"sourcesContent":["import React, { HTMLAttributes } from \"react\"\nimport { Heading } from \"~components/Heading\"\nimport { Tag, DefaultTagProps } from \"~components/Tag\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport styles from \"./Titles.module.scss\"\n\nexport type WorkflowStatus = {\n  /** @default: \"statusDraft\" */\n  variant?: DefaultTagProps[\"variant\"]\n  content?: string\n}\n\nexport type WorkflowTitlesProps = {\n  workflowName: string\n  stepName: string\n  status?: WorkflowStatus\n} & OverrideClassName<HTMLAttributes<HTMLDivElement>>\n\nexport const Titles = ({\n  workflowName,\n  stepName,\n  status,\n  ...restProps\n}: WorkflowTitlesProps): JSX.Element => (\n  <div className={styles.titles} {...restProps}>\n    <Heading\n      variant=\"heading-1\"\n      tag=\"h1\"\n      color=\"dark\"\n      classNameOverride={styles.pageTitle}\n    >\n      <Heading\n        classNameOverride={styles.prefix}\n        variant=\"heading-6\"\n        tag=\"span\"\n        color=\"dark-reduced-opacity\"\n      >\n        {workflowName}\n        <span className=\"sr-only\">:</span>\n      </Heading>\n      <span>{stepName}</span>\n    </Heading>\n    {status && (\n      // status may need to be update by a fetch\n      <div className={styles.status}>\n        <Tag inline variant={status?.variant || \"statusDraft\"}>\n          {status?.content}\n        </Tag>\n      </div>\n    )}\n  </div>\n)\n\nTitles.displayName = \"Workflow.Titles\"\n"],"names":["Titles","_a","workflowName","stepName","status","restProps","__rest","React","className","styles","titles","createElement","Heading","variant","tag","color","classNameOverride","pageTitle","prefix","Tag","inline","content","displayName"],"mappings":";;;;;;;MAkBaA,MAAM;EAAA,MAANA,MAAM,GAAG,SAAAA,CAACC,EAKD,EAAA;IAJpB,IAAAC,YAAY,GAAAD,EAAA,CAAAC,YAAA;MACZC,QAAQ,GAAAF,EAAA,CAAAE,QAAA;MACRC,MAAM,GAAAH,EAAA,CAAAG,MAAA;MACHC,SAAS,GAJSC,KAAAA,CAAAA,MAAA,CAAAL,EAAA,EAAA,CAAA,cAAA,EAAA,UAAA,EAAA,QAAA,CAKtB,CADa;IAC0B,OACtCM;MAAKC,SAAS,EAAEC,aAAM,CAACC;OAAYL,SAAS,CAAA,EAC1CE,KAAA,CAAAI,aAAA,CAACC,OAAAA,CAAAA,OAAO,EACN;MAAAC,OAAO,EAAC,WAAW;MACnBC,GAAG,EAAC,IAAI;MACRC,KAAK,EAAC,MAAM;MACZC,iBAAiB,EAAEP,aAAM,CAACQ;IAAS,CAAA,EAEnCV,KAAA,CAAAI,aAAA,CAACC,OAAAA,CAAAA,OAAO,EACN;MAAAI,iBAAiB,EAAEP,aAAM,CAACS,MAAM;MAChCL,OAAO,EAAC,WAAW;MACnBC,GAAG,EAAC,MAAM;MACVC,KAAK,EAAC;IAAsB,CAAA,EAE3Bb,YAAY,EACbK,KAAA,CAAAI,aAAA,CAAA,MAAA,EAAA;MAAMH,SAAS,EAAC;IAAS,CAAA,EAAA,GAAA,CAAS,CAC1B,EACVD,KAAO,CAAAI,aAAA,CAAA,MAAA,EAAA,IAAA,EAAAR,QAAQ,CAAQ,CACf,EACTC,MAAM;;IAELG,KAAA,CAAAI,aAAA,CAAA,KAAA,EAAA;MAAKH,SAAS,EAAEC,aAAM,CAACL;IAAM,CAAA,EAC3BG,KAAA,CAAAI,aAAA,CAACQ,GAAAA,CAAAA,GAAG,EAAA;MAACC,MAAM,EAAA,IAAA;MAACP,OAAO,EAAE,CAAAT,MAAM,KAAN,IAAA,IAAAA,MAAM,KAAN,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,MAAM,CAAES,OAAO,KAAI;IACrC,CAAA,EAAAT,MAAM,KAAN,IAAA,IAAAA,MAAM,KAAN,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,MAAM,CAAEiB,OAAO,CACZ,CAET,CACG;GACP;EAEDrB,MAAM,CAACsB,WAAW,GAAG,iBAAiB;EAAA,OAnCzBtB,MAAM;AAAA;"}
+{"version":3,"file":"Titles.cjs","sources":["../../../../../../../src/Workflow/subcomponents/Header/components/Titles/Titles.tsx"],"sourcesContent":["import React, { HTMLAttributes } from \"react\"\nimport { Heading } from \"~components/Heading\"\nimport { Tag, DefaultTagProps } from \"~components/Tag\"\nimport { VisuallyHidden } from \"~components/VisuallyHidden\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport styles from \"./Titles.module.scss\"\n\nexport type WorkflowStatus = {\n  /** @default: \"statusDraft\" */\n  variant?: DefaultTagProps[\"variant\"]\n  content?: string\n}\n\nexport type WorkflowTitlesProps = {\n  workflowName: string\n  stepName: string\n  status?: WorkflowStatus\n} & OverrideClassName<HTMLAttributes<HTMLDivElement>>\n\nexport const Titles = ({\n  workflowName,\n  stepName,\n  status,\n  ...restProps\n}: WorkflowTitlesProps): JSX.Element => (\n  <div className={styles.titles} {...restProps}>\n    <Heading\n      variant=\"heading-1\"\n      tag=\"h1\"\n      color=\"dark\"\n      classNameOverride={styles.pageTitle}\n    >\n      <Heading\n        classNameOverride={styles.prefix}\n        variant=\"heading-6\"\n        tag=\"span\"\n        color=\"dark-reduced-opacity\"\n      >\n        {workflowName}\n        <VisuallyHidden>:</VisuallyHidden>\n      </Heading>\n      <span>{stepName}</span>\n    </Heading>\n    {status && (\n      // status may need to be update by a fetch\n      <div className={styles.status}>\n        <Tag inline variant={status?.variant || \"statusDraft\"}>\n          {status?.content}\n        </Tag>\n      </div>\n    )}\n  </div>\n)\n\nTitles.displayName = \"Workflow.Titles\"\n"],"names":["Titles","_a","workflowName","stepName","status","restProps","__rest","React","className","styles","titles","createElement","Heading","variant","tag","color","classNameOverride","pageTitle","prefix","VisuallyHidden","Tag","inline","content","displayName"],"mappings":";;;;;;;;MAmBaA,MAAM;EAAA,MAANA,MAAM,GAAG,SAAAA,CAACC,EAKD,EAAA;IAJpB,IAAAC,YAAY,GAAAD,EAAA,CAAAC,YAAA;MACZC,QAAQ,GAAAF,EAAA,CAAAE,QAAA;MACRC,MAAM,GAAAH,EAAA,CAAAG,MAAA;MACHC,SAAS,GAJSC,KAAAA,CAAAA,MAAA,CAAAL,EAAA,EAAA,CAAA,cAAA,EAAA,UAAA,EAAA,QAAA,CAKtB,CADa;IAC0B,OACtCM;MAAKC,SAAS,EAAEC,aAAM,CAACC;OAAYL,SAAS,CAAA,EAC1CE,KAAA,CAAAI,aAAA,CAACC,OAAAA,CAAAA,OAAO,EACN;MAAAC,OAAO,EAAC,WAAW;MACnBC,GAAG,EAAC,IAAI;MACRC,KAAK,EAAC,MAAM;MACZC,iBAAiB,EAAEP,aAAM,CAACQ;IAAS,CAAA,EAEnCV,KAAA,CAAAI,aAAA,CAACC,OAAAA,CAAAA,OAAO,EACN;MAAAI,iBAAiB,EAAEP,aAAM,CAACS,MAAM;MAChCL,OAAO,EAAC,WAAW;MACnBC,GAAG,EAAC,MAAM;MACVC,KAAK,EAAC;IAAsB,CAAA,EAE3Bb,YAAY,EACbK,KAAC,CAAAI,aAAA,CAAAQ,cAAAA,CAAAA,cAAc,YAAmB,CAC1B,EACVZ,KAAO,CAAAI,aAAA,CAAA,MAAA,EAAA,IAAA,EAAAR,QAAQ,CAAQ,CACf,EACTC,MAAM;;IAELG,KAAA,CAAAI,aAAA,CAAA,KAAA,EAAA;MAAKH,SAAS,EAAEC,aAAM,CAACL;IAAM,CAAA,EAC3BG,KAAA,CAAAI,aAAA,CAACS,GAAAA,CAAAA,GAAG,EAAA;MAACC,MAAM,EAAA,IAAA;MAACR,OAAO,EAAE,CAAAT,MAAM,KAAN,IAAA,IAAAA,MAAM,KAAN,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,MAAM,CAAES,OAAO,KAAI;IACrC,CAAA,EAAAT,MAAM,KAAN,IAAA,IAAAA,MAAM,KAAN,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,MAAM,CAAEkB,OAAO,CACZ,CAET,CACG;GACP;EAEDtB,MAAM,CAACuB,WAAW,GAAG,iBAAiB;EAAA,OAnCzBvB,MAAM;AAAA;"}

package/dist/cjs/__future__/Workflow/subcomponents/Footer/components/ProgressStepper/ProgressStepper.cjs

@@ -8,6 +8,7 @@ var IndicatorActiveIcon = require('../../../../../../Icon/IndicatorActiveIcon.cj
 var IndicatorInactiveIcon = require('../../../../../../Icon/IndicatorInactiveIcon.cjs');
 var SuccessIcon = require('../../../../../../Icon/SuccessIcon.cjs');
 var Text = require('../../../../../../Text/Text.cjs');
+var VisuallyHidden = require('../../../../../../VisuallyHidden/VisuallyHidden.cjs');
 var ProgressStepper_module = require('./ProgressStepper.module.scss.cjs');
 var getStepStatus = function (isComplete, isCurrentStep, step, index) {
   if (isComplete) {
@@ -70,9 +71,7 @@ const ProgressStepper = /*#__PURE__*/function () {
         "aria-current": isCurrentStep
       }, React.createElement("div", {
         className: ProgressStepper_module.stepContent
-      }, React.createElement("span", {
-        className: "sr-only"
-      }, accessibleName), React.createElement(Text.Text, {
+      }, React.createElement(VisuallyHidden.VisuallyHidden, null, accessibleName), React.createElement(Text.Text, {
         classNameOverride: ProgressStepper_module.stepName,
         variant: "small",
         color: "white",

package/dist/cjs/__future__/Workflow/subcomponents/Footer/components/ProgressStepper/ProgressStepper.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressStepper.cjs","sources":["../../../../../../../../src/__future__/Workflow/subcomponents/Footer/components/ProgressStepper/ProgressStepper.tsx"],"sourcesContent":["import React from \"react\"\nimport classnames from \"classnames\"\nimport {\n  IndicatorActiveIcon,\n  IndicatorInactiveIcon,\n  SuccessIcon,\n} from \"~components/Icon\"\nimport { Text } from \"~components/Text\"\nimport styles from \"./ProgressStepper.module.scss\"\n\nexport type Step = {\n  id: string\n  label: string\n}\n\nexport type Steps = [Step, ...Step[]]\n\nexport type ProgressStepperProps = {\n  /** The id reference to within a Step object */\n  currentStepId: Step[\"id\"]\n  /** A non-empty array of Steps */\n  steps: Steps\n  isComplete?: boolean\n}\n\nconst getStepStatus = (\n  isComplete: boolean,\n  isCurrentStep: boolean,\n  step: Step,\n  index: number\n): {\n  icon: JSX.Element\n  accessibleName: string\n} => {\n  if (isComplete) {\n    return {\n      icon: (\n        <SuccessIcon\n          key={index}\n          inheritSize\n          role=\"presentation\"\n          classNameOverride=\"success\"\n        />\n      ),\n      accessibleName: `Completed: ${step.label}`,\n    }\n  }\n  if (isCurrentStep) {\n    return {\n      icon: (\n        <IndicatorActiveIcon\n          key={index}\n          inheritSize\n          role=\"presentation\"\n          classNameOverride=\"active\"\n        />\n      ),\n      accessibleName: `Current: ${step.label}`,\n    }\n  }\n  return {\n    icon: (\n      <IndicatorInactiveIcon\n        key={index}\n        inheritSize\n        classNameOverride=\"incomplete\"\n        role=\"presentation\"\n      />\n    ),\n    accessibleName: `Not started: ${step.label}`,\n  }\n}\n\nexport const ProgressStepper = ({\n  currentStepId,\n  steps,\n  isComplete = false,\n  ...restprops\n}: ProgressStepperProps): JSX.Element => {\n  const currentStepIndex = steps.findIndex(\n    stepItem => stepItem.id === currentStepId\n  )\n\n  return (\n    <div className={styles.stepsContainer}>\n      <ol\n        className={styles.stepList}\n        {...restprops}\n        aria-labelledby=\"stepper-description\"\n      >\n        {steps.map((step, index: number) => {\n          const isCurrentStep = currentStepIndex === index\n          const isCompletedStep = index < currentStepIndex || isComplete\n          const { accessibleName, icon: Icon } = getStepStatus(\n            isCompletedStep,\n            isCurrentStep,\n            step,\n            index\n          )\n          return (\n            <li\n              className={styles.step}\n              key={`${step.id}`}\n              aria-current={isCurrentStep}\n            >\n              <div className={styles.stepContent}>\n                <span className=\"sr-only\">\n                  {/* will need to be translated */}\n                  {accessibleName}\n                </span>\n                <Text\n                  classNameOverride={styles.stepName}\n                  variant=\"small\"\n                  color=\"white\"\n                  aria-hidden\n                >\n                  {step.label}\n                </Text>\n                <div className={styles.stepIndicator}>\n                  <span className={styles.stepIcon}>{Icon}</span>\n                </div>\n                {index < steps.length - 1 && (\n                  <div\n                    className={classnames([\n                      styles.stepDivider,\n                      isCompletedStep && styles.completedStep,\n                    ])}\n                  />\n                )}\n              </div>\n            </li>\n          )\n        })}\n      </ol>\n      <Text\n        classNameOverride={styles.stepperDescription}\n        variant=\"small\"\n        color=\"white\"\n        id=\"stepper-description\"\n      >\n        Step {currentStepIndex + 1} of {steps.length}\n      </Text>\n    </div>\n  )\n}\n\nProgressStepper.displayName = \"Workflow.ProgressStepper\"\n"],"names":["getStepStatus","isComplete","isCurrentStep","step","index","icon","React","createElement","SuccessIcon","key","inheritSize","role","classNameOverride","accessibleName","concat","label","IndicatorActiveIcon","IndicatorInactiveIcon","ProgressStepper","_a","currentStepId","steps","_b","restprops","__rest","currentStepIndex","findIndex","stepItem","id","className","styles","stepsContainer","__assign","stepList","map","isCompletedStep","Icon","stepContent","Text","stepName","variant","color","stepIndicator","stepIcon","length","classnames","stepDivider","completedStep","stepperDescription","displayName"],"mappings":"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"}
+{"version":3,"file":"ProgressStepper.cjs","sources":["../../../../../../../../src/__future__/Workflow/subcomponents/Footer/components/ProgressStepper/ProgressStepper.tsx"],"sourcesContent":["import React from \"react\"\nimport classnames from \"classnames\"\nimport {\n  IndicatorActiveIcon,\n  IndicatorInactiveIcon,\n  SuccessIcon,\n} from \"~components/Icon\"\nimport { Text } from \"~components/Text\"\nimport { VisuallyHidden } from \"~components/VisuallyHidden\"\nimport styles from \"./ProgressStepper.module.scss\"\n\nexport type Step = {\n  id: string\n  label: string\n}\n\nexport type Steps = [Step, ...Step[]]\n\nexport type ProgressStepperProps = {\n  /** The id reference to within a Step object */\n  currentStepId: Step[\"id\"]\n  /** A non-empty array of Steps */\n  steps: Steps\n  isComplete?: boolean\n}\n\nconst getStepStatus = (\n  isComplete: boolean,\n  isCurrentStep: boolean,\n  step: Step,\n  index: number\n): {\n  icon: JSX.Element\n  accessibleName: string\n} => {\n  if (isComplete) {\n    return {\n      icon: (\n        <SuccessIcon\n          key={index}\n          inheritSize\n          role=\"presentation\"\n          classNameOverride=\"success\"\n        />\n      ),\n      accessibleName: `Completed: ${step.label}`,\n    }\n  }\n  if (isCurrentStep) {\n    return {\n      icon: (\n        <IndicatorActiveIcon\n          key={index}\n          inheritSize\n          role=\"presentation\"\n          classNameOverride=\"active\"\n        />\n      ),\n      accessibleName: `Current: ${step.label}`,\n    }\n  }\n  return {\n    icon: (\n      <IndicatorInactiveIcon\n        key={index}\n        inheritSize\n        classNameOverride=\"incomplete\"\n        role=\"presentation\"\n      />\n    ),\n    accessibleName: `Not started: ${step.label}`,\n  }\n}\n\nexport const ProgressStepper = ({\n  currentStepId,\n  steps,\n  isComplete = false,\n  ...restprops\n}: ProgressStepperProps): JSX.Element => {\n  const currentStepIndex = steps.findIndex(\n    stepItem => stepItem.id === currentStepId\n  )\n\n  return (\n    <div className={styles.stepsContainer}>\n      <ol\n        className={styles.stepList}\n        {...restprops}\n        aria-labelledby=\"stepper-description\"\n      >\n        {steps.map((step, index: number) => {\n          const isCurrentStep = currentStepIndex === index\n          const isCompletedStep = index < currentStepIndex || isComplete\n          const { accessibleName, icon: Icon } = getStepStatus(\n            isCompletedStep,\n            isCurrentStep,\n            step,\n            index\n          )\n          return (\n            <li\n              className={styles.step}\n              key={`${step.id}`}\n              aria-current={isCurrentStep}\n            >\n              <div className={styles.stepContent}>\n                <VisuallyHidden>\n                  {/* will need to be translated */}\n                  {accessibleName}\n                </VisuallyHidden>\n                <Text\n                  classNameOverride={styles.stepName}\n                  variant=\"small\"\n                  color=\"white\"\n                  aria-hidden\n                >\n                  {step.label}\n                </Text>\n                <div className={styles.stepIndicator}>\n                  <span className={styles.stepIcon}>{Icon}</span>\n                </div>\n                {index < steps.length - 1 && (\n                  <div\n                    className={classnames([\n                      styles.stepDivider,\n                      isCompletedStep && styles.completedStep,\n                    ])}\n                  />\n                )}\n              </div>\n            </li>\n          )\n        })}\n      </ol>\n      <Text\n        classNameOverride={styles.stepperDescription}\n        variant=\"small\"\n        color=\"white\"\n        id=\"stepper-description\"\n      >\n        Step {currentStepIndex + 1} of {steps.length}\n      </Text>\n    </div>\n  )\n}\n\nProgressStepper.displayName = \"Workflow.ProgressStepper\"\n"],"names":["getStepStatus","isComplete","isCurrentStep","step","index","icon","React","createElement","SuccessIcon","key","inheritSize","role","classNameOverride","accessibleName","concat","label","IndicatorActiveIcon","IndicatorInactiveIcon","ProgressStepper","_a","currentStepId","steps","_b","restprops","__rest","currentStepIndex","findIndex","stepItem","id","className","styles","stepsContainer","__assign","stepList","map","isCompletedStep","Icon","stepContent","VisuallyHidden","Text","stepName","variant","color","stepIndicator","stepIcon","length","classnames","stepDivider","completedStep","stepperDescription","displayName"],"mappings":"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"}

package/dist/cjs/__future__/Workflow/subcomponents/Header/components/Titles/Titles.cjs

@@ -4,6 +4,7 @@ var tslib = require('tslib');
 var React = require('react');
 var Heading = require('../../../../../../Heading/Heading.cjs');
 var Tag = require('../../../../../../Tag/Tag.cjs');
+var VisuallyHidden = require('../../../../../../VisuallyHidden/VisuallyHidden.cjs');
 var Titles_module = require('./Titles.module.scss.cjs');
 const Titles = /*#__PURE__*/function () {
   const Titles = function (_a) {
@@ -23,9 +24,7 @@ const Titles = /*#__PURE__*/function () {
       variant: "heading-6",
       tag: "span",
       color: "dark-reduced-opacity"
-    }, workflowName, React.createElement("span", {
-      className: "sr-only"
-    }, ":")), React.createElement("span", null, stepName)), status &&
+    }, workflowName, React.createElement(VisuallyHidden.VisuallyHidden, null, ":")), React.createElement("span", null, stepName)), status &&
     // status may need to be update by a fetch
     React.createElement("div", {
       className: Titles_module.status

package/dist/cjs/__future__/Workflow/subcomponents/Header/components/Titles/Titles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Titles.cjs","sources":["../../../../../../../../src/__future__/Workflow/subcomponents/Header/components/Titles/Titles.tsx"],"sourcesContent":["import React, { HTMLAttributes } from \"react\"\nimport { Heading } from \"~components/Heading\"\nimport { Tag, DefaultTagProps } from \"~components/Tag\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport styles from \"./Titles.module.scss\"\n\nexport type WorkflowStatus = {\n  /** @default: \"statusDraft\" */\n  variant?: DefaultTagProps[\"variant\"]\n  content?: string\n}\n\nexport type WorkflowTitlesProps = {\n  workflowName: string\n  stepName: string\n  status?: WorkflowStatus\n} & OverrideClassName<HTMLAttributes<HTMLDivElement>>\n\nexport const Titles = ({\n  workflowName,\n  stepName,\n  status,\n  ...restProps\n}: WorkflowTitlesProps): JSX.Element => (\n  <div className={styles.titles} {...restProps}>\n    <Heading\n      variant=\"heading-1\"\n      tag=\"h1\"\n      color=\"dark\"\n      classNameOverride={styles.pageTitle}\n    >\n      <Heading\n        classNameOverride={styles.prefix}\n        variant=\"heading-6\"\n        tag=\"span\"\n        color=\"dark-reduced-opacity\"\n      >\n        {workflowName}\n        <span className=\"sr-only\">:</span>\n      </Heading>\n      <span>{stepName}</span>\n    </Heading>\n    {status && (\n      // status may need to be update by a fetch\n      <div className={styles.status}>\n        <Tag inline variant={status?.variant || \"statusDraft\"}>\n          {status?.content}\n        </Tag>\n      </div>\n    )}\n  </div>\n)\n\nTitles.displayName = \"Workflow.Titles\"\n"],"names":["Titles","_a","workflowName","stepName","status","restProps","__rest","React","className","styles","titles","createElement","Heading","variant","tag","color","classNameOverride","pageTitle","prefix","Tag","inline","content","displayName"],"mappings":";;;;;;;MAkBaA,MAAM;EAAA,MAANA,MAAM,GAAG,SAAAA,CAACC,EAKD,EAAA;IAJpB,IAAAC,YAAY,GAAAD,EAAA,CAAAC,YAAA;MACZC,QAAQ,GAAAF,EAAA,CAAAE,QAAA;MACRC,MAAM,GAAAH,EAAA,CAAAG,MAAA;MACHC,SAAS,GAJSC,KAAAA,CAAAA,MAAA,CAAAL,EAAA,EAAA,CAAA,cAAA,EAAA,UAAA,EAAA,QAAA,CAKtB,CADa;IAC0B,OACtCM;MAAKC,SAAS,EAAEC,aAAM,CAACC;OAAYL,SAAS,CAAA,EAC1CE,KAAA,CAAAI,aAAA,CAACC,OAAAA,CAAAA,OAAO,EACN;MAAAC,OAAO,EAAC,WAAW;MACnBC,GAAG,EAAC,IAAI;MACRC,KAAK,EAAC,MAAM;MACZC,iBAAiB,EAAEP,aAAM,CAACQ;IAAS,CAAA,EAEnCV,KAAA,CAAAI,aAAA,CAACC,OAAAA,CAAAA,OAAO,EACN;MAAAI,iBAAiB,EAAEP,aAAM,CAACS,MAAM;MAChCL,OAAO,EAAC,WAAW;MACnBC,GAAG,EAAC,MAAM;MACVC,KAAK,EAAC;IAAsB,CAAA,EAE3Bb,YAAY,EACbK,KAAA,CAAAI,aAAA,CAAA,MAAA,EAAA;MAAMH,SAAS,EAAC;IAAS,CAAA,EAAA,GAAA,CAAS,CAC1B,EACVD,KAAO,CAAAI,aAAA,CAAA,MAAA,EAAA,IAAA,EAAAR,QAAQ,CAAQ,CACf,EACTC,MAAM;;IAELG,KAAA,CAAAI,aAAA,CAAA,KAAA,EAAA;MAAKH,SAAS,EAAEC,aAAM,CAACL;IAAM,CAAA,EAC3BG,KAAA,CAAAI,aAAA,CAACQ,GAAAA,CAAAA,GAAG,EAAA;MAACC,MAAM,EAAA,IAAA;MAACP,OAAO,EAAE,CAAAT,MAAM,KAAN,IAAA,IAAAA,MAAM,KAAN,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,MAAM,CAAES,OAAO,KAAI;IACrC,CAAA,EAAAT,MAAM,KAAN,IAAA,IAAAA,MAAM,KAAN,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,MAAM,CAAEiB,OAAO,CACZ,CAET,CACG;GACP;EAEDrB,MAAM,CAACsB,WAAW,GAAG,iBAAiB;EAAA,OAnCzBtB,MAAM;AAAA;"}
+{"version":3,"file":"Titles.cjs","sources":["../../../../../../../../src/__future__/Workflow/subcomponents/Header/components/Titles/Titles.tsx"],"sourcesContent":["import React, { HTMLAttributes } from \"react\"\nimport { Heading } from \"~components/Heading\"\nimport { Tag, DefaultTagProps } from \"~components/Tag\"\nimport { VisuallyHidden } from \"~components/VisuallyHidden\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport styles from \"./Titles.module.scss\"\n\nexport type WorkflowStatus = {\n  /** @default: \"statusDraft\" */\n  variant?: DefaultTagProps[\"variant\"]\n  content?: string\n}\n\nexport type WorkflowTitlesProps = {\n  workflowName: string\n  stepName: string\n  status?: WorkflowStatus\n} & OverrideClassName<HTMLAttributes<HTMLDivElement>>\n\nexport const Titles = ({\n  workflowName,\n  stepName,\n  status,\n  ...restProps\n}: WorkflowTitlesProps): JSX.Element => (\n  <div className={styles.titles} {...restProps}>\n    <Heading\n      variant=\"heading-1\"\n      tag=\"h1\"\n      color=\"dark\"\n      classNameOverride={styles.pageTitle}\n    >\n      <Heading\n        classNameOverride={styles.prefix}\n        variant=\"heading-6\"\n        tag=\"span\"\n        color=\"dark-reduced-opacity\"\n      >\n        {workflowName}\n        <VisuallyHidden>:</VisuallyHidden>\n      </Heading>\n      <span>{stepName}</span>\n    </Heading>\n    {status && (\n      // status may need to be update by a fetch\n      <div className={styles.status}>\n        <Tag inline variant={status?.variant || \"statusDraft\"}>\n          {status?.content}\n        </Tag>\n      </div>\n    )}\n  </div>\n)\n\nTitles.displayName = \"Workflow.Titles\"\n"],"names":["Titles","_a","workflowName","stepName","status","restProps","__rest","React","className","styles","titles","createElement","Heading","variant","tag","color","classNameOverride","pageTitle","prefix","VisuallyHidden","Tag","inline","content","displayName"],"mappings":";;;;;;;;MAmBaA,MAAM;EAAA,MAANA,MAAM,GAAG,SAAAA,CAACC,EAKD,EAAA;IAJpB,IAAAC,YAAY,GAAAD,EAAA,CAAAC,YAAA;MACZC,QAAQ,GAAAF,EAAA,CAAAE,QAAA;MACRC,MAAM,GAAAH,EAAA,CAAAG,MAAA;MACHC,SAAS,GAJSC,KAAAA,CAAAA,MAAA,CAAAL,EAAA,EAAA,CAAA,cAAA,EAAA,UAAA,EAAA,QAAA,CAKtB,CADa;IAC0B,OACtCM;MAAKC,SAAS,EAAEC,aAAM,CAACC;OAAYL,SAAS,CAAA,EAC1CE,KAAA,CAAAI,aAAA,CAACC,OAAAA,CAAAA,OAAO,EACN;MAAAC,OAAO,EAAC,WAAW;MACnBC,GAAG,EAAC,IAAI;MACRC,KAAK,EAAC,MAAM;MACZC,iBAAiB,EAAEP,aAAM,CAACQ;IAAS,CAAA,EAEnCV,KAAA,CAAAI,aAAA,CAACC,OAAAA,CAAAA,OAAO,EACN;MAAAI,iBAAiB,EAAEP,aAAM,CAACS,MAAM;MAChCL,OAAO,EAAC,WAAW;MACnBC,GAAG,EAAC,MAAM;MACVC,KAAK,EAAC;IAAsB,CAAA,EAE3Bb,YAAY,EACbK,KAAC,CAAAI,aAAA,CAAAQ,cAAAA,CAAAA,cAAc,YAAmB,CAC1B,EACVZ,KAAO,CAAAI,aAAA,CAAA,MAAA,EAAA,IAAA,EAAAR,QAAQ,CAAQ,CACf,EACTC,MAAM;;IAELG,KAAA,CAAAI,aAAA,CAAA,KAAA,EAAA;MAAKH,SAAS,EAAEC,aAAM,CAACL;IAAM,CAAA,EAC3BG,KAAA,CAAAI,aAAA,CAACS,GAAAA,CAAAA,GAAG,EAAA;MAACC,MAAM,EAAA,IAAA;MAACR,OAAO,EAAE,CAAAT,MAAM,KAAN,IAAA,IAAAA,MAAM,KAAN,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,MAAM,CAAES,OAAO,KAAI;IACrC,CAAA,EAAAT,MAAM,KAAN,IAAA,IAAAA,MAAM,KAAN,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,MAAM,CAAEkB,OAAO,CACZ,CAET,CACG;GACP;EAEDtB,MAAM,CAACuB,WAAW,GAAG,iBAAiB;EAAA,OAnCzBvB,MAAM;AAAA;"}