npm - @vibe/core - Versions diffs - 3.86.0 → 3.88.0 - Mend

@vibe/core 3.86.0 → 3.88.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1703) hide show

package/dist/src/components/Modal/ModalHeader/ModalHeader.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={header:"header_800b5a6e99",title:"title_6ebfe43bcb",descriptionIcon:"descriptionIcon_d50300c91c"};!function(e){const n="s_id-9882eed3e38d_3_85_1";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".header_800b5a6e99 {\n  width: 100%;\n  align-self: flex-start;\n}\n.header_800b5a6e99 .title_6ebfe43bcb {\n  width: 100%;\n}\n.header_800b5a6e99 .descriptionIcon_d50300c91c {\n  flex-shrink: 0;\n  margin-inline-end: var(--spacing-xs);\n  color: var(--icon-color);\n}");export{e as default};
+var e={header:"header_7046de9099",title:"title_d745a166ba",descriptionIcon:"descriptionIcon_97cec06f2f"};!function(e){const n="s_id-9882eed3e38d_3_87_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".header_7046de9099 {\n  width: 100%;\n  align-self: flex-start;\n}\n.header_7046de9099 .title_d745a166ba {\n  width: 100%;\n}\n.header_7046de9099 .descriptionIcon_97cec06f2f {\n  flex-shrink: 0;\n  margin-inline-end: var(--spacing-xs);\n  color: var(--icon-color);\n}");export{e as default};
 //# sourceMappingURL=ModalHeader.module.scss.js.map

package/dist/src/components/Modal/ModalMedia/ModalMedia.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import t,{forwardRef as e}from"react";import s from"./ModalMedia.module.scss.js";import a from"classnames";import{getTestId as r,ComponentDefaultTestId as m}from"../../../tests/testIds.js";import o from"../../../../components/layout/dist/Flex/Flex.js";var i=e((function(e,i){var d=e.children,l=e.className,c=e.id;return t.createElement(o,{id:c,"data-testid":e["data-testid"]||r(m.MODAL_MEDIA,c),justify:"center",align:"stretch",ref:i,className:a(s.media,l)},d)}));export{i as default};
+import t,{forwardRef as e}from"react";import s from"./ModalMedia.module.scss.js";import a from"classnames";import{getTestId as r,ComponentDefaultTestId as m}from"../../../tests/testIds.js";import o from"../../../../components/layout/dist/Flex/Flex.js";var i=e((function(e,i){var d=e.children,l=e.className,c=e.id;return t.createElement(o,{id:c,"data-testid":e["data-testid"]||r(m.MODAL_NEXT_MEDIA,c),justify:"center",align:"stretch",ref:i,className:a(s.media,l)},d)}));export{i as default};
 //# sourceMappingURL=ModalMedia.js.map

package/dist/src/components/Modal/ModalMedia/ModalMedia.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalMedia.js","sources":["../../../../../src/components/Modal/ModalMedia/ModalMedia.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport { Flex } from \"@vibe/layout\";\nimport { type ModalMediaProps } from \"./ModalMedia.types\";\nimport styles from \"./ModalMedia.module.scss\";\nimport cx from \"classnames\";\nimport { ComponentDefaultTestId, getTestId } from \"../../../tests/test-ids-utils\";\n\nconst ModalMedia = forwardRef(\n (\n { children, className, id, \"data-testid\": dataTestId }: ModalMediaProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n return (\n <Flex\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.~~MODAL_MEDIA~~, id)}\n justify=\"center\"\n align=\"stretch\"\n ref={ref}\n className={cx(styles.media, className)}\n >\n {children}\n </Flex>\n );\n }\n);\n\nexport default ModalMedia;\n"],"names":["ModalMedia","forwardRef","_ref","ref","children","className","id","React","Flex","getTestId","ComponentDefaultTestId","~~MODAL_MEDIA~~","justify","align","cx","styles","media"],"mappings":"4PAOMA,IAAAA,EAAaC,GACjB,SAAAC,EAEEC,GACE,IAFAC,EAAQF,EAARE,SAAUC,EAASH,EAATG,UAAWC,EAAEJ,EAAFI,GAGvB,OACEC,gBAACC,EAAI,CACHF,GAAIA,gBAL4CJ,EAAzB,gBAMIO,EAAUC,EAAuBC,~~YAAaL~~,~~GACzEM~~,QAAQ,SACRC,MAAM,UACNV,IAAKA,EACLE,UAAWS,EAAGC,EAAOC,MAAOX,IAE3BD,EAGP"}
1	+ {"version":3,"file":"ModalMedia.js","sources":["../../../../../src/components/Modal/ModalMedia/ModalMedia.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport { Flex } from \"@vibe/layout\";\nimport { type ModalMediaProps } from \"./ModalMedia.types\";\nimport styles from \"./ModalMedia.module.scss\";\nimport cx from \"classnames\";\nimport { ComponentDefaultTestId, getTestId } from \"../../../tests/test-ids-utils\";\n\nconst ModalMedia = forwardRef(\n (\n { children, className, id, \"data-testid\": dataTestId }: ModalMediaProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n return (\n <Flex\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.MODAL_NEXT_MEDIA, id)}\n justify=\"center\"\n align=\"stretch\"\n ref={ref}\n className={cx(styles.media, className)}\n >\n {children}\n </Flex>\n );\n }\n);\n\nexport default ModalMedia;\n"],"names":["ModalMedia","forwardRef","_ref","ref","children","className","id","React","Flex","getTestId","ComponentDefaultTestId","MODAL_NEXT_MEDIA","justify","align","cx","styles","media"],"mappings":"4PAOMA,IAAAA,EAAaC,GACjB,SAAAC,EAEEC,GACE,IAFAC,EAAQF,EAARE,SAAUC,EAASH,EAATG,UAAWC,EAAEJ,EAAFI,GAGvB,OACEC,gBAACC,EAAI,CACHF,GAAIA,gBAL4CJ,EAAzB,gBAMIO,EAAUC,EAAuBC,iBAAkBL,GAC9EM,QAAQ,SACRC,MAAM,UACNV,IAAKA,EACLE,UAAWS,EAAGC,EAAOC,MAAOX,IAE3BD,EAGP"}

package/dist/src/components/Modal/ModalMedia/ModalMedia.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={media:"media_4f5085886b"};!function(e){const t="s_id-17d5de3a21d7_3_85_1";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const d=document.createElement("style");d.id=t,n.firstChild?n.insertBefore(d,n.firstChild):n.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".media_4f5085886b {\n  max-width: 100%;\n  max-height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex: 1 0;\n  overflow: hidden;\n  position: relative;\n}");export{e as default};
+var e={media:"media_4b3e89cc7a"};!function(e){const t="s_id-17d5de3a21d7_3_87_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const d=document.createElement("style");d.id=t,n.firstChild?n.insertBefore(d,n.firstChild):n.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".media_4b3e89cc7a {\n  max-width: 100%;\n  max-height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex: 1 0;\n  overflow: hidden;\n  position: relative;\n}");export{e as default};
 //# sourceMappingURL=ModalMedia.module.scss.js.map

package/dist/src/components/Modal/ModalTopActions/ModalTopActions.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import t from"react";import o from"./ModalTopActions.module.scss.js";import{ComponentDefaultTestId as e}from"../../../tests/constants.js";import r from"../../../../components/icon-button/dist/IconButton/IconButton.js";import i from"../../../../icons/dist/react/CloseMedium.js";var a={dark:"fixed-dark",light:"fixed-light"},n=function(n){var s=n.renderAction,c=n.closeButtonAriaLabel,m=n.onClose,l=a[n.theme]||"primary";return t.createElement("div",{className:o.actions,"data-no-autofocus":!0},"function"==typeof s?s(l):s,t.createElement(r,{"data-testid":e.MODAL_CLOSE_BUTTON,icon:i,onClick:m,size:"small",kind:"tertiary",color:l,ariaLabel:c}))};export{n as default};
+import t from"react";import o from"./ModalTopActions.module.scss.js";import{ComponentDefaultTestId as e}from"../../../tests/constants.js";import r from"../../../../components/icon-button/dist/IconButton/IconButton.js";import i from"../../../../icons/dist/react/CloseMedium.js";var a={dark:"fixed-dark",light:"fixed-light"},n=function(n){var s=n.renderAction,c=n.closeButtonAriaLabel,m=n.onClose,l=a[n.theme]||"primary";return t.createElement("div",{className:o.actions,"data-no-autofocus":!0},"function"==typeof s?s(l):s,t.createElement(r,{"data-testid":e.MODAL_NEXT_CLOSE_BUTTON,icon:i,onClick:m,size:"small",kind:"tertiary",color:l,ariaLabel:c}))};export{n as default};
 //# sourceMappingURL=ModalTopActions.js.map

package/dist/src/components/Modal/ModalTopActions/ModalTopActions.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalTopActions.js","sources":["../../../../../src/components/Modal/ModalTopActions/ModalTopActions.tsx"],"sourcesContent":["import React from \"react\";\nimport styles from \"./ModalTopActions.module.scss\";\nimport {\n type ModalTopActionsButtonColor,\n type ModalTopActionsTheme,\n type ModalTopActionsProps\n} from \"./ModalTopActions.types\";\nimport { IconButton } from \"@vibe/icon-button\";\nimport { CloseMedium } from \"@vibe/icons\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\n\nconst colorToButtonColor: Record<ModalTopActionsTheme, ModalTopActionsButtonColor> = {\n dark: \"fixed-dark\",\n light: \"fixed-light\"\n};\n\nconst ModalTopActions = ({ renderAction, theme, closeButtonAriaLabel, onClose }: ModalTopActionsProps) => {\n const buttonColor = colorToButtonColor[theme] \|\| \"primary\";\n\n return (\n <div className={styles.actions} data-no-autofocus={true}>\n {typeof renderAction === \"function\" ? renderAction(buttonColor) : renderAction}\n <IconButton\n data-testid={ComponentDefaultTestId.~~MODAL_CLOSE_BUTTON~~}\n icon={CloseMedium}\n onClick={onClose}\n size=\"small\"\n kind=\"tertiary\"\n color={buttonColor}\n ariaLabel={closeButtonAriaLabel}\n />\n </div>\n );\n};\n\nexport default ModalTopActions;\n"],"names":["colorToButtonColor","dark","light","ModalTopActions","_ref","renderAction","closeButtonAriaLabel","onClose","buttonColor","theme","React","className","styles","actions","createElement","IconButton","ComponentDefaultTestId","~~MODAL_CLOSE_BUTTON~~","icon","CloseMedium","onClick","size","kind","color","ariaLabel"],"mappings":"qRAWA,IAAMA,EAA+E,CACnFC,KAAM,aACNC,MAAO,eAGHC,EAAkB,SAAHC,GAAoF,IAA9EC,EAAYD,EAAZC,aAAqBC,EAAoBF,EAApBE,qBAAsBC,EAAOH,EAAPG,QAC9DC,EAAcR,EADwBI,EAALK,QACU,UAEjD,OACEC,uBAAKC,UAAWC,EAAOC,6BAA4B,GACxB,mBAAjBR,EAA8BA,EAAaG,GAAeH,EAClEK,EAAAI,cAACC,EAAU,CAAA,cACIC,EAAuBC,~~mBACpCC~~,KAAMC,EACNC,QAASb,EACTc,KAAK,QACLC,KAAK,WACLC,MAAOf,EACPgB,UAAWlB,IAInB"}
1	+ {"version":3,"file":"ModalTopActions.js","sources":["../../../../../src/components/Modal/ModalTopActions/ModalTopActions.tsx"],"sourcesContent":["import React from \"react\";\nimport styles from \"./ModalTopActions.module.scss\";\nimport {\n type ModalTopActionsButtonColor,\n type ModalTopActionsTheme,\n type ModalTopActionsProps\n} from \"./ModalTopActions.types\";\nimport { IconButton } from \"@vibe/icon-button\";\nimport { CloseMedium } from \"@vibe/icons\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\n\nconst colorToButtonColor: Record<ModalTopActionsTheme, ModalTopActionsButtonColor> = {\n dark: \"fixed-dark\",\n light: \"fixed-light\"\n};\n\nconst ModalTopActions = ({ renderAction, theme, closeButtonAriaLabel, onClose }: ModalTopActionsProps) => {\n const buttonColor = colorToButtonColor[theme] \|\| \"primary\";\n\n return (\n <div className={styles.actions} data-no-autofocus={true}>\n {typeof renderAction === \"function\" ? renderAction(buttonColor) : renderAction}\n <IconButton\n data-testid={ComponentDefaultTestId.MODAL_NEXT_CLOSE_BUTTON}\n icon={CloseMedium}\n onClick={onClose}\n size=\"small\"\n kind=\"tertiary\"\n color={buttonColor}\n ariaLabel={closeButtonAriaLabel}\n />\n </div>\n );\n};\n\nexport default ModalTopActions;\n"],"names":["colorToButtonColor","dark","light","ModalTopActions","_ref","renderAction","closeButtonAriaLabel","onClose","buttonColor","theme","React","className","styles","actions","createElement","IconButton","ComponentDefaultTestId","MODAL_NEXT_CLOSE_BUTTON","icon","CloseMedium","onClick","size","kind","color","ariaLabel"],"mappings":"qRAWA,IAAMA,EAA+E,CACnFC,KAAM,aACNC,MAAO,eAGHC,EAAkB,SAAHC,GAAoF,IAA9EC,EAAYD,EAAZC,aAAqBC,EAAoBF,EAApBE,qBAAsBC,EAAOH,EAAPG,QAC9DC,EAAcR,EADwBI,EAALK,QACU,UAEjD,OACEC,uBAAKC,UAAWC,EAAOC,6BAA4B,GACxB,mBAAjBR,EAA8BA,EAAaG,GAAeH,EAClEK,EAAAI,cAACC,EAAU,CAAA,cACIC,EAAuBC,wBACpCC,KAAMC,EACNC,QAASb,EACTc,KAAK,QACLC,KAAK,WACLC,MAAOf,EACPgB,UAAWlB,IAInB"}

package/dist/src/components/Modal/ModalTopActions/ModalTopActions.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={actions:"actions_e53fb022de"};!function(e){const t="s_id-86629ffbaf1c_3_85_1";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const i=document.createElement("style");i.id=t,n.firstChild?n.insertBefore(i,n.firstChild):n.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".actions_e53fb022de {\n  display: flex;\n  align-items: center;\n  position: absolute;\n  right: var(--top-actions-margin-inline);\n  top: var(--top-actions-margin-block);\n}");export{e as default};
+var e={actions:"actions_3c53320511"};!function(e){const t="s_id-86629ffbaf1c_3_87_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const i=document.createElement("style");i.id=t,n.firstChild?n.insertBefore(i,n.firstChild):n.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".actions_3c53320511 {\n  display: flex;\n  align-items: center;\n  position: absolute;\n  right: var(--top-actions-margin-inline);\n  top: var(--top-actions-margin-block);\n}");export{e as default};
 //# sourceMappingURL=ModalTopActions.module.scss.js.map

package/dist/src/components/Modal/footers/ModalFooter/ModalFooter.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import t,{forwardRef as r}from"react";import o from"../ModalFooterBase/ModalFooterBase.js";import{getTestId as e}from"../../../../tests/testIds.js";import{ComponentDefaultTestId as s}from"../../../../tests/constants.js";import a from"./ModalFooter.module.scss.js";import{getPropsForButton as m}from"../utils/getPropsForButton.js";var d=r((function(r,d){var i=r.secondaryButton,n=r.renderSideAction,c=r["data-testid"],p=r.className,u=r.id,f=m(r.primaryButton,a.primary),l=m(i,a.secondary);return t.createElement(o,{ref:d,className:p,id:u,"data-testid":c||e(s.MODAL_FOOTER,u),primaryButton:f,secondaryButton:l,renderAction:n})}));export{d as default};
+import t,{forwardRef as r}from"react";import o from"../ModalFooterBase/ModalFooterBase.js";import{getTestId as e}from"../../../../tests/testIds.js";import{ComponentDefaultTestId as s}from"../../../../tests/constants.js";import a from"./ModalFooter.module.scss.js";import{getPropsForButton as m}from"../utils/getPropsForButton.js";var d=r((function(r,d){var i=r.secondaryButton,n=r.renderSideAction,c=r["data-testid"],p=r.className,u=r.id,f=m(r.primaryButton,a.primary),l=m(i,a.secondary);return t.createElement(o,{ref:d,className:p,id:u,"data-testid":c||e(s.MODAL_NEXT_FOOTER,u),primaryButton:f,secondaryButton:l,renderAction:n})}));export{d as default};
 //# sourceMappingURL=ModalFooter.js.map

package/dist/src/components/Modal/footers/ModalFooter/ModalFooter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalFooter.js","sources":["../../../../../../src/components/Modal/footers/ModalFooter/ModalFooter.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport ModalFooterBase from \"../ModalFooterBase/ModalFooterBase\";\nimport { getTestId } from \"../../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../../tests/constants\";\nimport { type ModalFooterProps } from \"./ModalFooter.types\";\nimport styles from \"./ModalFooter.module.scss\";\nimport { getPropsForButton } from \"../utils/getPropsForButton\";\n\nconst ModalFooter = forwardRef(\n (\n { primaryButton, secondaryButton, renderSideAction, \"data-testid\": dataTestId, className, id }: ModalFooterProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const primary = getPropsForButton(primaryButton, styles.primary);\n const secondary = getPropsForButton(secondaryButton, styles.secondary);\n\n return (\n <ModalFooterBase\n ref={ref}\n className={className}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.~~MODAL_FOOTER~~, id)}\n primaryButton={primary}\n secondaryButton={secondary}\n renderAction={renderSideAction}\n />\n );\n }\n);\n\nexport default ModalFooter;\n"],"names":["ModalFooter","forwardRef","_ref","ref","secondaryButton","renderSideAction","dataTestId","className","id","primary","getPropsForButton","primaryButton","styles","secondary","React","createElement","ModalFooterBase","getTestId","ComponentDefaultTestId","~~MODAL_FOOTER~~","renderAction"],"mappings":"0UAQMA,IAAAA,EAAcC,GAClB,SAAAC,EAEEC,GACE,IAFeC,EAAeF,EAAfE,gBAAiBC,EAAgBH,EAAhBG,iBAAiCC,EAAUJ,EAAzB,eAA2BK,EAASL,EAATK,UAAWC,EAAEN,EAAFM,GAGpFC,EAAUC,EAHDR,EAAbS,cAG+CC,EAAOH,SAClDI,EAAYH,EAAkBN,EAAiBQ,EAAOC,WAE5D,OACEC,EAACC,cAAAC,GACCb,IAAKA,EACLI,UAAWA,EACXC,GAAIA,EACS,cAAAF,GAAcW,EAAUC,EAAuBC,~~aAAcX~~,~~GAC1EG~~,cAAeF,EACfL,gBAAiBS,EACjBO,aAAcf,GAGpB"}
1	+ {"version":3,"file":"ModalFooter.js","sources":["../../../../../../src/components/Modal/footers/ModalFooter/ModalFooter.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport ModalFooterBase from \"../ModalFooterBase/ModalFooterBase\";\nimport { getTestId } from \"../../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../../tests/constants\";\nimport { type ModalFooterProps } from \"./ModalFooter.types\";\nimport styles from \"./ModalFooter.module.scss\";\nimport { getPropsForButton } from \"../utils/getPropsForButton\";\n\nconst ModalFooter = forwardRef(\n (\n { primaryButton, secondaryButton, renderSideAction, \"data-testid\": dataTestId, className, id }: ModalFooterProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const primary = getPropsForButton(primaryButton, styles.primary);\n const secondary = getPropsForButton(secondaryButton, styles.secondary);\n\n return (\n <ModalFooterBase\n ref={ref}\n className={className}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.MODAL_NEXT_FOOTER, id)}\n primaryButton={primary}\n secondaryButton={secondary}\n renderAction={renderSideAction}\n />\n );\n }\n);\n\nexport default ModalFooter;\n"],"names":["ModalFooter","forwardRef","_ref","ref","secondaryButton","renderSideAction","dataTestId","className","id","primary","getPropsForButton","primaryButton","styles","secondary","React","createElement","ModalFooterBase","getTestId","ComponentDefaultTestId","MODAL_NEXT_FOOTER","renderAction"],"mappings":"0UAQMA,IAAAA,EAAcC,GAClB,SAAAC,EAEEC,GACE,IAFeC,EAAeF,EAAfE,gBAAiBC,EAAgBH,EAAhBG,iBAAiCC,EAAUJ,EAAzB,eAA2BK,EAASL,EAATK,UAAWC,EAAEN,EAAFM,GAGpFC,EAAUC,EAHDR,EAAbS,cAG+CC,EAAOH,SAClDI,EAAYH,EAAkBN,EAAiBQ,EAAOC,WAE5D,OACEC,EAACC,cAAAC,GACCb,IAAKA,EACLI,UAAWA,EACXC,GAAIA,EACS,cAAAF,GAAcW,EAAUC,EAAuBC,kBAAmBX,GAC/EG,cAAeF,EACfL,gBAAiBS,EACjBO,aAAcf,GAGpB"}

package/dist/src/components/Modal/footers/ModalFooter/ModalFooter.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={primary:"primary_dfa8c0fb88",secondary:"secondary_afdbc50475"};!function(e){const n="s_id-4cbf6fa94914_3_85_1";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,d.firstChild?d.insertBefore(t,d.firstChild):d.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".primary_dfa8c0fb88 {\n  order: 2;\n}\n.primary_dfa8c0fb88:only-child {\n  margin-left: auto;\n}\n.secondary_afdbc50475 {\n  order: 1;\n  margin-left: auto;\n}");export{e as default};
+var e={primary:"primary_e6da5c70a0",secondary:"secondary_b85a0153d5"};!function(e){const n="s_id-4cbf6fa94914_3_87_0";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,a.firstChild?a.insertBefore(d,a.firstChild):a.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".primary_e6da5c70a0 {\n  order: 2;\n}\n.primary_e6da5c70a0:only-child {\n  margin-left: auto;\n}\n.secondary_b85a0153d5 {\n  order: 1;\n  margin-left: auto;\n}");export{e as default};
 //# sourceMappingURL=ModalFooter.module.scss.js.map

package/dist/src/components/Modal/footers/ModalFooterBase/ModalFooterBase.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={footer:"footer_358aeb1608"};!function(e){const t="s_id-23913bf713c7_3_85_1";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".footer_358aeb1608 {\n  position: relative;\n  width: 100%;\n  padding: 20px var(--spacing-large);\n  flex-shrink: 0;\n  background-color: var(--primary-background-color);\n}");export{e as default};
+var e={footer:"footer_ac23766c80"};!function(e){const t="s_id-23913bf713c7_3_87_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".footer_ac23766c80 {\n  position: relative;\n  width: 100%;\n  padding: 20px var(--spacing-large);\n  flex-shrink: 0;\n  background-color: var(--primary-background-color);\n}");export{e as default};
 //# sourceMappingURL=ModalFooterBase.module.scss.js.map

package/dist/src/components/Modal/footers/ModalFooterWizard/ModalFooterWizard.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import t,{forwardRef as e}from"react";import o from"../ModalFooterBase/ModalFooterBase.js";import{getTestId as r}from"../../../../tests/testIds.js";import{ComponentDefaultTestId as s}from"../../../../tests/constants.js";import a from"./ModalFooterWizard.module.scss.js";import{StepsGalleryHeader as n}from"../../../Steps/StepsGalleryHeader.js";import{getPropsForButton as i}from"../utils/getPropsForButton.js";var m=e((function(e,m){var p=e.secondaryButton,d=e.stepCount,c=e.activeStep,l=e.onStepClick,u=e["data-testid"],f=e.className,y=e.id,B=i(e.primaryButton,a.primary),j=i(p,a.secondary),S=t.createElement(n,{stepsCount:d,activeStepIndex:c,onChangeActiveStep:function(t,e){return l(e)},className:a.stepDots});return t.createElement(o,{ref:m,className:f,id:y,"data-testid":u||r(s.MODAL_FOOTER,y),primaryButton:B,secondaryButton:j,renderAction:S})}));export{m as default};
+import t,{forwardRef as e}from"react";import o from"../ModalFooterBase/ModalFooterBase.js";import{getTestId as r}from"../../../../tests/testIds.js";import{ComponentDefaultTestId as s}from"../../../../tests/constants.js";import a from"./ModalFooterWizard.module.scss.js";import{StepsGalleryHeader as n}from"../../../Steps/StepsGalleryHeader.js";import{getPropsForButton as i}from"../utils/getPropsForButton.js";var m=e((function(e,m){var p=e.secondaryButton,d=e.stepCount,c=e.activeStep,l=e.onStepClick,u=e["data-testid"],f=e.className,y=e.id,B=i(e.primaryButton,a.primary),j=i(p,a.secondary),S=t.createElement(n,{stepsCount:d,activeStepIndex:c,onChangeActiveStep:function(t,e){return l(e)},className:a.stepDots});return t.createElement(o,{ref:m,className:f,id:y,"data-testid":u||r(s.MODAL_NEXT_FOOTER,y),primaryButton:B,secondaryButton:j,renderAction:S})}));export{m as default};
 //# sourceMappingURL=ModalFooterWizard.js.map

package/dist/src/components/Modal/footers/ModalFooterWizard/ModalFooterWizard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalFooterWizard.js","sources":["../../../../../../src/components/Modal/footers/ModalFooterWizard/ModalFooterWizard.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport ModalFooterBase from \"../ModalFooterBase/ModalFooterBase\";\nimport { getTestId } from \"../../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../../tests/constants\";\nimport styles from \"./ModalFooterWizard.module.scss\";\nimport { StepsGalleryHeader } from \"../../../Steps/StepsGalleryHeader\";\nimport { type ModalFooterWizardProps } from \"./ModalFooterWizard.types\";\nimport { getPropsForButton } from \"../utils/getPropsForButton\";\n\nconst ModalFooterWizard = forwardRef(\n (\n {\n primaryButton,\n secondaryButton,\n stepCount,\n activeStep,\n onStepClick,\n \"data-testid\": dataTestId,\n className,\n id\n }: ModalFooterWizardProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const primary = getPropsForButton(primaryButton, styles.primary);\n const secondary = getPropsForButton(secondaryButton, styles.secondary);\n\n const steps = (\n <StepsGalleryHeader\n stepsCount={stepCount}\n activeStepIndex={activeStep}\n onChangeActiveStep={(_, newStep) => onStepClick(newStep)}\n className={styles.stepDots}\n />\n );\n\n return (\n <ModalFooterBase\n ref={ref}\n className={className}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.~~MODAL_FOOTER~~, id)}\n primaryButton={primary}\n secondaryButton={secondary}\n renderAction={steps}\n />\n );\n }\n);\n\nexport default ModalFooterWizard;\n"],"names":["ModalFooterWizard","forwardRef","_ref","ref","secondaryButton","stepCount","activeStep","onStepClick","dataTestId","className","id","primary","getPropsForButton","primaryButton","styles","secondary","steps","React","createElement","StepsGalleryHeader","stepsCount","activeStepIndex","onChangeActiveStep","_","newStep","stepDots","ModalFooterBase","getTestId","ComponentDefaultTestId","~~MODAL_FOOTER~~","renderAction"],"mappings":"0ZASMA,IAAAA,EAAoBC,GACxB,SAAAC,EAWEC,GACE,IATAC,EAAeF,EAAfE,gBACAC,EAASH,EAATG,UACAC,EAAUJ,EAAVI,WACAC,EAAWL,EAAXK,YACeC,EAAUN,EAAzB,eACAO,EAASP,EAATO,UACAC,EAAER,EAAFQ,GAIIC,EAAUC,EAXDV,EAAbW,cAW+CC,EAAOH,SAClDI,EAAYH,EAAkBR,EAAiBU,EAAOC,WAEtDC,EACJC,EAAAC,cAACC,EACC,CAAAC,WAAYf,EACZgB,gBAAiBf,EACjBgB,mBAAoB,SAACC,EAAGC,GAAO,OAAKjB,EAAYiB,EAAQ,EACxDf,UAAWK,EAAOW,WAItB,OACER,EAACC,cAAAQ,GACCvB,IAAKA,EACLM,UAAWA,EACXC,GAAIA,EACS,cAAAF,GAAcmB,EAAUC,EAAuBC,~~aAAcnB~~,~~GAC1EG~~,cAAeF,EACfP,gBAAiBW,EACjBe,aAAcd,GAGpB"}
1	+ {"version":3,"file":"ModalFooterWizard.js","sources":["../../../../../../src/components/Modal/footers/ModalFooterWizard/ModalFooterWizard.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport ModalFooterBase from \"../ModalFooterBase/ModalFooterBase\";\nimport { getTestId } from \"../../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../../tests/constants\";\nimport styles from \"./ModalFooterWizard.module.scss\";\nimport { StepsGalleryHeader } from \"../../../Steps/StepsGalleryHeader\";\nimport { type ModalFooterWizardProps } from \"./ModalFooterWizard.types\";\nimport { getPropsForButton } from \"../utils/getPropsForButton\";\n\nconst ModalFooterWizard = forwardRef(\n (\n {\n primaryButton,\n secondaryButton,\n stepCount,\n activeStep,\n onStepClick,\n \"data-testid\": dataTestId,\n className,\n id\n }: ModalFooterWizardProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const primary = getPropsForButton(primaryButton, styles.primary);\n const secondary = getPropsForButton(secondaryButton, styles.secondary);\n\n const steps = (\n <StepsGalleryHeader\n stepsCount={stepCount}\n activeStepIndex={activeStep}\n onChangeActiveStep={(_, newStep) => onStepClick(newStep)}\n className={styles.stepDots}\n />\n );\n\n return (\n <ModalFooterBase\n ref={ref}\n className={className}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.MODAL_NEXT_FOOTER, id)}\n primaryButton={primary}\n secondaryButton={secondary}\n renderAction={steps}\n />\n );\n }\n);\n\nexport default ModalFooterWizard;\n"],"names":["ModalFooterWizard","forwardRef","_ref","ref","secondaryButton","stepCount","activeStep","onStepClick","dataTestId","className","id","primary","getPropsForButton","primaryButton","styles","secondary","steps","React","createElement","StepsGalleryHeader","stepsCount","activeStepIndex","onChangeActiveStep","_","newStep","stepDots","ModalFooterBase","getTestId","ComponentDefaultTestId","MODAL_NEXT_FOOTER","renderAction"],"mappings":"0ZASMA,IAAAA,EAAoBC,GACxB,SAAAC,EAWEC,GACE,IATAC,EAAeF,EAAfE,gBACAC,EAASH,EAATG,UACAC,EAAUJ,EAAVI,WACAC,EAAWL,EAAXK,YACeC,EAAUN,EAAzB,eACAO,EAASP,EAATO,UACAC,EAAER,EAAFQ,GAIIC,EAAUC,EAXDV,EAAbW,cAW+CC,EAAOH,SAClDI,EAAYH,EAAkBR,EAAiBU,EAAOC,WAEtDC,EACJC,EAAAC,cAACC,EACC,CAAAC,WAAYf,EACZgB,gBAAiBf,EACjBgB,mBAAoB,SAACC,EAAGC,GAAO,OAAKjB,EAAYiB,EAAQ,EACxDf,UAAWK,EAAOW,WAItB,OACER,EAACC,cAAAQ,GACCvB,IAAKA,EACLM,UAAWA,EACXC,GAAIA,EACS,cAAAF,GAAcmB,EAAUC,EAAuBC,kBAAmBnB,GAC/EG,cAAeF,EACfP,gBAAiBW,EACjBe,aAAcd,GAGpB"}

package/dist/src/components/Modal/footers/ModalFooterWizard/ModalFooterWizard.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={primary:"primary_dfa8c0fb88",secondary:"secondary_0b77fe80d9",stepDots:"stepDots_4d06fa3d38"};!function(e){const n="s_id-51737ad1ac1f_3_85_1";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".primary_dfa8c0fb88 {\n  order: 2;\n}\n\n.secondary_0b77fe80d9 {\n  order: 1;\n}\n\n.stepDots_4d06fa3d38 {\n  position: absolute;\n  left: 50%;\n  transform: translateX(-50%);\n  margin: 0;\n}");export{e as default};
+var e={primary:"primary_e6da5c70a0",secondary:"secondary_f383e0b03c",stepDots:"stepDots_b267854187"};!function(e){const n="s_id-51737ad1ac1f_3_87_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,t.firstChild?t.insertBefore(a,t.firstChild):t.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".primary_e6da5c70a0 {\n  order: 2;\n}\n\n.secondary_f383e0b03c {\n  order: 1;\n}\n\n.stepDots_b267854187 {\n  position: absolute;\n  left: 50%;\n  transform: translateX(-50%);\n  margin: 0;\n}");export{e as default};
 //# sourceMappingURL=ModalFooterWizard.module.scss.js.map

package/dist/src/components/Modal/layouts/ModalBasicLayout/ModalBasicLayout.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{slicedToArray as e,defineProperty as t}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import r,{forwardRef as o}from"react";import a from"classnames";import{getTestId as l}from"../../../../tests/testIds.js";import{ComponentDefaultTestId as s}from"../../../../tests/constants.js";import i from"./ModalBasicLayout.module.scss.js";import m from"../../../Divider/Divider.js";import n from"../ModalFooterShadow.js";import c from"../ModalLayoutScrollableContent.js";import d from"../useLayoutScrolledContent.js";import f from"../../../../../components/layout/dist/Flex/Flex.js";var p=o((function(o,p){var u=o.children,j=o.className,S=o.id,v=o["data-testid"],y=d(),h=y.ref,E=y.isContentScrolled,A=y.isScrollable,C=y.isScrolledToEnd,L=y.onScroll,M=r.Children.toArray(u),N=e(M,2),g=N[0],w=N[1];return r.createElement(r.Fragment,null,r.createElement(f,{direction:"column",align:"start",ref:p,className:a(i.layout,j),id:S,"data-testid":v||l(s.MODAL_BASIC_LAYOUT,S)},r.createElement("div",{className:i.header},g),r.createElement(m,{className:a(i.divider,t({},i.showDivider,E)),withoutMargin:!0}),r.createElement(c,{onScroll:L,className:i.content,ref:h},w)),A&&r.createElement(n,{show:!C}))}));export{p as default};
+import{slicedToArray as e,defineProperty as t}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import r,{forwardRef as o}from"react";import a from"classnames";import{getTestId as l}from"../../../../tests/testIds.js";import{ComponentDefaultTestId as s}from"../../../../tests/constants.js";import i from"./ModalBasicLayout.module.scss.js";import m from"../../../Divider/Divider.js";import n from"../ModalFooterShadow.js";import c from"../ModalLayoutScrollableContent.js";import d from"../useLayoutScrolledContent.js";import f from"../../../../../components/layout/dist/Flex/Flex.js";var p=o((function(o,p){var u=o.children,j=o.className,S=o.id,v=o["data-testid"],y=d(),E=y.ref,h=y.isContentScrolled,N=y.isScrollable,A=y.isScrolledToEnd,C=y.onScroll,L=r.Children.toArray(u),M=e(L,2),_=M[0],g=M[1];return r.createElement(r.Fragment,null,r.createElement(f,{direction:"column",align:"start",ref:p,className:a(i.layout,j),id:S,"data-testid":v||l(s.MODAL_NEXT_BASIC_LAYOUT,S)},r.createElement("div",{className:i.header},_),r.createElement(m,{className:a(i.divider,t({},i.showDivider,h)),withoutMargin:!0}),r.createElement(c,{onScroll:C,className:i.content,ref:E},g)),N&&r.createElement(n,{show:!A}))}));export{p as default};
 //# sourceMappingURL=ModalBasicLayout.js.map

package/dist/src/components/Modal/layouts/ModalBasicLayout/ModalBasicLayout.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalBasicLayout.js","sources":["../../../../../../src/components/Modal/layouts/ModalBasicLayout/ModalBasicLayout.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport cx from \"classnames\";\nimport { getTestId } from \"../../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../../tests/constants\";\nimport styles from \"./ModalBasicLayout.module.scss\";\nimport { type ModalBasicLayoutProps } from \"./ModalBasicLayout.types\";\nimport { Flex } from \"@vibe/layout\";\nimport Divider from \"../../../Divider/Divider\";\nimport ModalFooterShadow from \"../ModalFooterShadow\";\nimport ModalLayoutScrollableContent from \"../ModalLayoutScrollableContent\";\nimport useLayoutScrolledContent from \"../useLayoutScrolledContent\";\n\nconst ModalBasicLayout = forwardRef(\n (\n { children, className, id, \"data-testid\": dataTestId }: ModalBasicLayoutProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const { ref: contentRef, isContentScrolled, isScrollable, isScrolledToEnd, onScroll } = useLayoutScrolledContent();\n const [header, content] = React.Children.toArray(children);\n\n return (\n <>\n <Flex\n direction=\"column\"\n align=\"start\"\n ref={ref}\n className={cx(styles.layout, className)}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.~~MODAL_BASIC_LAYOUT~~, id)}\n >\n <div className={styles.header}>{header}</div>\n <Divider className={cx(styles.divider, { [styles.showDivider]: isContentScrolled })} withoutMargin />\n <ModalLayoutScrollableContent onScroll={onScroll} className={styles.content} ref={contentRef}>\n {content}\n </ModalLayoutScrollableContent>\n </Flex>\n {isScrollable && <ModalFooterShadow show={!isScrolledToEnd} />}\n </>\n );\n }\n);\n\nexport default ModalBasicLayout;\n"],"names":["ModalBasicLayout","forwardRef","_ref","ref","children","className","id","dataTestId","_useLayoutScrolledCon","useLayoutScrolledContent","contentRef","isContentScrolled","isScrollable","isScrolledToEnd","onScroll","_React$Children$toArr","React","Children","toArray","_React$Children$toArr2","_slicedToArray","header","content","createElement","Fragment","Flex","direction","align","cx","styles","layout","getTestId","ComponentDefaultTestId","~~MODAL_BASIC_LAYOUT~~","Divider","divider","_defineProperty","showDivider","withoutMargin","ModalLayoutScrollableContent","ModalFooterShadow","show"],"mappings":"+kBAYMA,IAAAA,EAAmBC,GACvB,SAAAC,EAEEC,GACE,IAFAC,EAAQF,EAARE,SAAUC,EAASH,EAATG,UAAWC,EAAEJ,EAAFI,GAAmBC,EAAUL,EAAzB,eAG3BM,EAAwFC,IAA3EC,EAAUF,EAAfL,IAAiBQ,EAAiBH,EAAjBG,kBAAmBC,EAAYJ,EAAZI,aAAcC,EAAeL,EAAfK,gBAAiBC,EAAQN,EAARM,SAC3EC,EAA0BC,EAAMC,SAASC,QAAQd,GAASe,EAAAC,EAAAL,EAAA,GAAnDM,EAAMF,EAAA,GAAEG,EAAOH,EAAA,GAEtB,OACEH,EAAAO,cAAAP,EAAAQ,SAAA,KACER,EAAAO,cAACE,EACC,CAAAC,UAAU,SACVC,MAAM,QACNxB,IAAKA,EACLE,UAAWuB,EAAGC,EAAOC,OAAQzB,GAC7BC,GAAIA,EAAE,cACOC,GAAcwB,EAAUC,EAAuBC,~~mBAAoB3B~~,~~IAEhFU~~,EAAAO,cAAA,MAAA,CAAKlB,UAAWwB,EAAOR,QAASA,GAChCL,EAACO,cAAAW,GAAQ7B,UAAWuB,EAAGC,EAAOM,QAAOC,EAAA,CAAA,EAAKP,EAAOQ,YAAc1B,IAAsB2B,eAAgB,IACrGtB,EAAAO,cAACgB,EAA6B,CAAAzB,SAAUA,EAAUT,UAAWwB,EAAOP,QAASnB,IAAKO,GAC/EY,IAGJV,GAAgBI,EAACO,cAAAiB,EAAkB,CAAAC,MAAO5B,IAGjD"}
1	+ {"version":3,"file":"ModalBasicLayout.js","sources":["../../../../../../src/components/Modal/layouts/ModalBasicLayout/ModalBasicLayout.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport cx from \"classnames\";\nimport { getTestId } from \"../../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../../tests/constants\";\nimport styles from \"./ModalBasicLayout.module.scss\";\nimport { type ModalBasicLayoutProps } from \"./ModalBasicLayout.types\";\nimport { Flex } from \"@vibe/layout\";\nimport Divider from \"../../../Divider/Divider\";\nimport ModalFooterShadow from \"../ModalFooterShadow\";\nimport ModalLayoutScrollableContent from \"../ModalLayoutScrollableContent\";\nimport useLayoutScrolledContent from \"../useLayoutScrolledContent\";\n\nconst ModalBasicLayout = forwardRef(\n (\n { children, className, id, \"data-testid\": dataTestId }: ModalBasicLayoutProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const { ref: contentRef, isContentScrolled, isScrollable, isScrolledToEnd, onScroll } = useLayoutScrolledContent();\n const [header, content] = React.Children.toArray(children);\n\n return (\n <>\n <Flex\n direction=\"column\"\n align=\"start\"\n ref={ref}\n className={cx(styles.layout, className)}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.MODAL_NEXT_BASIC_LAYOUT, id)}\n >\n <div className={styles.header}>{header}</div>\n <Divider className={cx(styles.divider, { [styles.showDivider]: isContentScrolled })} withoutMargin />\n <ModalLayoutScrollableContent onScroll={onScroll} className={styles.content} ref={contentRef}>\n {content}\n </ModalLayoutScrollableContent>\n </Flex>\n {isScrollable && <ModalFooterShadow show={!isScrolledToEnd} />}\n </>\n );\n }\n);\n\nexport default ModalBasicLayout;\n"],"names":["ModalBasicLayout","forwardRef","_ref","ref","children","className","id","dataTestId","_useLayoutScrolledCon","useLayoutScrolledContent","contentRef","isContentScrolled","isScrollable","isScrolledToEnd","onScroll","_React$Children$toArr","React","Children","toArray","_React$Children$toArr2","_slicedToArray","header","content","createElement","Fragment","Flex","direction","align","cx","styles","layout","getTestId","ComponentDefaultTestId","MODAL_NEXT_BASIC_LAYOUT","Divider","divider","_defineProperty","showDivider","withoutMargin","ModalLayoutScrollableContent","ModalFooterShadow","show"],"mappings":"+kBAYMA,IAAAA,EAAmBC,GACvB,SAAAC,EAEEC,GACE,IAFAC,EAAQF,EAARE,SAAUC,EAASH,EAATG,UAAWC,EAAEJ,EAAFI,GAAmBC,EAAUL,EAAzB,eAG3BM,EAAwFC,IAA3EC,EAAUF,EAAfL,IAAiBQ,EAAiBH,EAAjBG,kBAAmBC,EAAYJ,EAAZI,aAAcC,EAAeL,EAAfK,gBAAiBC,EAAQN,EAARM,SAC3EC,EAA0BC,EAAMC,SAASC,QAAQd,GAASe,EAAAC,EAAAL,EAAA,GAAnDM,EAAMF,EAAA,GAAEG,EAAOH,EAAA,GAEtB,OACEH,EAAAO,cAAAP,EAAAQ,SAAA,KACER,EAAAO,cAACE,EACC,CAAAC,UAAU,SACVC,MAAM,QACNxB,IAAKA,EACLE,UAAWuB,EAAGC,EAAOC,OAAQzB,GAC7BC,GAAIA,EAAE,cACOC,GAAcwB,EAAUC,EAAuBC,wBAAyB3B,IAErFU,EAAAO,cAAA,MAAA,CAAKlB,UAAWwB,EAAOR,QAASA,GAChCL,EAACO,cAAAW,GAAQ7B,UAAWuB,EAAGC,EAAOM,QAAOC,EAAA,CAAA,EAAKP,EAAOQ,YAAc1B,IAAsB2B,eAAgB,IACrGtB,EAAAO,cAACgB,EAA6B,CAAAzB,SAAUA,EAAUT,UAAWwB,EAAOP,QAASnB,IAAKO,GAC/EY,IAGJV,GAAgBI,EAACO,cAAAiB,EAAkB,CAAAC,MAAO5B,IAGjD"}

package/dist/src/components/Modal/layouts/ModalBasicLayout/ModalBasicLayout.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={layout:"layout_2c9e3f1503",header:"header_5566496cd0",divider:"divider_645bfb4c48",showDivider:"showDivider_a7f31623e1",content:"content_7718fe7cf4"};!function(e){const n="s_id-b8093a4a9ca9_3_85_1";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,i.firstChild?i.insertBefore(t,i.firstChild):i.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".layout_2c9e3f1503 {\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n}\n.layout_2c9e3f1503 .header_5566496cd0 {\n  width: 100%;\n  margin-block: var(--spacing-xl) var(--spacing-large);\n  padding-inline-end: calc(var(--top-actions-margin-inline) + var(--top-actions-width) + var(--spacing-medium));\n  padding-inline-start: var(--modal-inline-padding);\n}\n.layout_2c9e3f1503 .divider_645bfb4c48 {\n  flex-shrink: 0;\n  opacity: 0;\n  transition: opacity var(--motion-productive-medium) ease-out;\n}\n.layout_2c9e3f1503 .divider_645bfb4c48.showDivider_a7f31623e1 {\n  opacity: 1;\n}\n.layout_2c9e3f1503 .content_7718fe7cf4 {\n  padding-block-end: var(--spacing-xl);\n}");export{e as default};
+var a={layout:"layout_aa4fcd4b2a",header:"header_5f33f186b4",divider:"divider_85765872c2",showDivider:"showDivider_cfd6f1a252",content:"content_da1d90369a"};!function(a){const e="s_id-b8093a4a9ca9_3_87_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+e))return;const d=document.createElement("style");d.id=e,n.firstChild?n.insertBefore(d,n.firstChild):n.appendChild(d),d.appendChild(document.createTextNode(a))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=a)}(".layout_aa4fcd4b2a {\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n}\n.layout_aa4fcd4b2a .header_5f33f186b4 {\n  width: 100%;\n  margin-block: var(--spacing-xl) var(--spacing-large);\n  padding-inline-end: calc(var(--top-actions-margin-inline) + var(--top-actions-width) + var(--spacing-medium));\n  padding-inline-start: var(--modal-inline-padding);\n}\n.layout_aa4fcd4b2a .divider_85765872c2 {\n  flex-shrink: 0;\n  opacity: 0;\n  transition: opacity var(--motion-productive-medium) ease-out;\n}\n.layout_aa4fcd4b2a .divider_85765872c2.showDivider_cfd6f1a252 {\n  opacity: 1;\n}\n.layout_aa4fcd4b2a .content_da1d90369a {\n  padding-block-end: var(--spacing-xl);\n}");export{a as default};
 //# sourceMappingURL=ModalBasicLayout.module.scss.js.map

package/dist/src/components/Modal/layouts/ModalFooterShadow.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={shadowWrapper:"shadowWrapper_1ea726f9d4",show:"show_52d4335cb2"};!function(e){const t="s_id-c76d397ed7f2_3_85_1";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+t))return;const d=document.createElement("style");d.id=t,o.firstChild?o.insertBefore(d,o.firstChild):o.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}('.shadowWrapper_1ea726f9d4::after {\n  content: "";\n  position: absolute;\n  opacity: 0;\n  transition: opacity var(--motion-productive-medium) ease-out;\n  width: 100%;\n  height: 10px;\n  box-shadow: var(--box-shadow-medium);\n}\n.shadowWrapper_1ea726f9d4.show_52d4335cb2::after {\n  opacity: 1;\n}');export{e as default};
+var e={shadowWrapper:"shadowWrapper_ff799ee09c",show:"show_ff399e45ef"};!function(e){const t="s_id-c76d397ed7f2_3_87_0";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,o.firstChild?o.insertBefore(n,o.firstChild):o.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}('.shadowWrapper_ff799ee09c::after {\n  content: "";\n  position: absolute;\n  opacity: 0;\n  transition: opacity var(--motion-productive-medium) ease-out;\n  width: 100%;\n  height: 10px;\n  box-shadow: var(--box-shadow-medium);\n}\n.shadowWrapper_ff799ee09c.show_ff399e45ef::after {\n  opacity: 1;\n}');export{e as default};
 //# sourceMappingURL=ModalFooterShadow.module.scss.js.map

package/dist/src/components/Modal/layouts/ModalLayoutScrollableContent.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={content:"content_175460cba0"};!function(e){const n="s_id-a5c90e45f208_3_85_1";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const i=document.createElement("style");i.id=n,t.firstChild?t.insertBefore(i,t.firstChild):t.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.content_175460cba0 {\n  width: 100%;\n  height: 100%;\n  padding-inline: var(--modal-inline-padding);\n  overflow: auto;\n}\n.content_175460cba0::-webkit-scrollbar {\n  width: 4px;\n  height: 6px;\n}\n.content_175460cba0::-webkit-scrollbar-thumb {\n  background-color: var(--ui-border-color);\n  border-radius: 4px;\n}");export{e as default};
+var e={content:"content_578f3371db"};!function(e){const n="s_id-a5c90e45f208_3_87_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.content_578f3371db {\n  width: 100%;\n  height: 100%;\n  padding-inline: var(--modal-inline-padding);\n  overflow: auto;\n}\n.content_578f3371db::-webkit-scrollbar {\n  width: 4px;\n  height: 6px;\n}\n.content_578f3371db::-webkit-scrollbar-thumb {\n  background-color: var(--ui-border-color);\n  border-radius: 4px;\n}");export{e as default};
 //# sourceMappingURL=ModalLayoutScrollableContent.module.scss.js.map

package/dist/src/components/Modal/layouts/ModalMediaLayout/ModalMediaLayout.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{slicedToArray as e}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import t,{forwardRef as a}from"react";import s from"classnames";import{getTestId as r}from"../../../../tests/testIds.js";import{ComponentDefaultTestId as o}from"../../../../tests/constants.js";import l from"./ModalMediaLayout.module.scss.js";import m from"../../../../../components/layout/dist/Flex/Flex.js";var i=a((function(a,i){var d=a.className,c=a.id,n=a["data-testid"],p=t.Children.toArray(a.children),u=e(p,3),f=u[0],v=u[1],j=u[2];return t.createElement(m,{ref:i,direction:"column",align:"start",className:s(l.layout,d),id:c,"data-testid":n||r(o.MODAL_MEDIA_LAYOUT,c)},t.createElement("div",{className:l.media},f),t.createElement("div",{className:l.header},v),t.createElement("div",{className:l.content},j))}));export{i as default};
+import{slicedToArray as e}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import t,{forwardRef as a}from"react";import s from"classnames";import{getTestId as r}from"../../../../tests/testIds.js";import{ComponentDefaultTestId as o}from"../../../../tests/constants.js";import l from"./ModalMediaLayout.module.scss.js";import m from"../../../../../components/layout/dist/Flex/Flex.js";var i=a((function(a,i){var d=a.className,c=a.id,n=a["data-testid"],p=t.Children.toArray(a.children),u=e(p,3),f=u[0],v=u[1],E=u[2];return t.createElement(m,{ref:i,direction:"column",align:"start",className:s(l.layout,d),id:c,"data-testid":n||r(o.MODAL_NEXT_MEDIA_LAYOUT,c)},t.createElement("div",{className:l.media},f),t.createElement("div",{className:l.header},v),t.createElement("div",{className:l.content},E))}));export{i as default};
 //# sourceMappingURL=ModalMediaLayout.js.map

package/dist/src/components/Modal/layouts/ModalMediaLayout/ModalMediaLayout.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalMediaLayout.js","sources":["../../../../../../src/components/Modal/layouts/ModalMediaLayout/ModalMediaLayout.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport cx from \"classnames\";\nimport { getTestId } from \"../../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../../tests/constants\";\nimport styles from \"./ModalMediaLayout.module.scss\";\nimport { type ModalMediaLayoutProps } from \"./ModalMediaLayout.types\";\nimport { Flex } from \"@vibe/layout\";\n\nconst ModalMediaLayout = forwardRef(\n (\n { children, className, id, \"data-testid\": dataTestId }: ModalMediaLayoutProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const [media, header, content] = React.Children.toArray(children);\n\n return (\n <Flex\n ref={ref}\n direction=\"column\"\n align=\"start\"\n className={cx(styles.layout, className)}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.~~MODAL_MEDIA_LAYOUT~~, id)}\n >\n <div className={styles.media}>{media}</div>\n <div className={styles.header}>{header}</div>\n <div className={styles.content}>{content}</div>\n </Flex>\n );\n }\n);\n\nexport default ModalMediaLayout;\n"],"names":["ModalMediaLayout","forwardRef","_ref","ref","className","id","dataTestId","_React$Children$toArr","React","Children","toArray","children","_React$Children$toArr2","_slicedToArray","media","header","content","createElement","Flex","direction","align","cx","styles","layout","getTestId","ComponentDefaultTestId","~~MODAL_MEDIA_LAYOUT~~"],"mappings":"yYAQMA,IAAAA,EAAmBC,GACvB,SAAAC,EAEEC,GACE,IAFUC,EAASF,EAATE,UAAWC,EAAEH,EAAFG,GAAmBC,EAAUJ,EAAzB,eAG3BK,EAAiCC,EAAMC,SAASC,QAHtCR,EAARS,UAG+DC,EAAAC,EAAAN,EAAA,GAA1DO,EAAKF,EAAA,GAAEG,EAAMH,EAAA,GAAEI,EAAOJ,EAAA,GAE7B,OACEJ,EAACS,cAAAC,GACCf,IAAKA,EACLgB,UAAU,SACVC,MAAM,QACNhB,UAAWiB,EAAGC,EAAOC,OAAQnB,GAC7BC,GAAIA,EAAE,cACOC,GAAckB,EAAUC,EAAuBC,~~mBAAoBrB~~,~~IAEhFG~~,EAAAS,cAAA,MAAA,CAAKb,UAAWkB,EAAOR,OAAQA,GAC/BN,EAAAS,cAAA,MAAA,CAAKb,UAAWkB,EAAOP,QAASA,GAChCP,EAAKS,cAAA,MAAA,CAAAb,UAAWkB,EAAON,SAAUA,GAGvC"}
1	+ {"version":3,"file":"ModalMediaLayout.js","sources":["../../../../../../src/components/Modal/layouts/ModalMediaLayout/ModalMediaLayout.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport cx from \"classnames\";\nimport { getTestId } from \"../../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../../tests/constants\";\nimport styles from \"./ModalMediaLayout.module.scss\";\nimport { type ModalMediaLayoutProps } from \"./ModalMediaLayout.types\";\nimport { Flex } from \"@vibe/layout\";\n\nconst ModalMediaLayout = forwardRef(\n (\n { children, className, id, \"data-testid\": dataTestId }: ModalMediaLayoutProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const [media, header, content] = React.Children.toArray(children);\n\n return (\n <Flex\n ref={ref}\n direction=\"column\"\n align=\"start\"\n className={cx(styles.layout, className)}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.MODAL_NEXT_MEDIA_LAYOUT, id)}\n >\n <div className={styles.media}>{media}</div>\n <div className={styles.header}>{header}</div>\n <div className={styles.content}>{content}</div>\n </Flex>\n );\n }\n);\n\nexport default ModalMediaLayout;\n"],"names":["ModalMediaLayout","forwardRef","_ref","ref","className","id","dataTestId","_React$Children$toArr","React","Children","toArray","children","_React$Children$toArr2","_slicedToArray","media","header","content","createElement","Flex","direction","align","cx","styles","layout","getTestId","ComponentDefaultTestId","MODAL_NEXT_MEDIA_LAYOUT"],"mappings":"yYAQMA,IAAAA,EAAmBC,GACvB,SAAAC,EAEEC,GACE,IAFUC,EAASF,EAATE,UAAWC,EAAEH,EAAFG,GAAmBC,EAAUJ,EAAzB,eAG3BK,EAAiCC,EAAMC,SAASC,QAHtCR,EAARS,UAG+DC,EAAAC,EAAAN,EAAA,GAA1DO,EAAKF,EAAA,GAAEG,EAAMH,EAAA,GAAEI,EAAOJ,EAAA,GAE7B,OACEJ,EAACS,cAAAC,GACCf,IAAKA,EACLgB,UAAU,SACVC,MAAM,QACNhB,UAAWiB,EAAGC,EAAOC,OAAQnB,GAC7BC,GAAIA,EAAE,cACOC,GAAckB,EAAUC,EAAuBC,wBAAyBrB,IAErFG,EAAAS,cAAA,MAAA,CAAKb,UAAWkB,EAAOR,OAAQA,GAC/BN,EAAAS,cAAA,MAAA,CAAKb,UAAWkB,EAAOP,QAASA,GAChCP,EAAKS,cAAA,MAAA,CAAAb,UAAWkB,EAAON,SAAUA,GAGvC"}

package/dist/src/components/Modal/layouts/ModalMediaLayout/ModalMediaLayout.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={layout:"layout_2c9e3f1503",media:"media_644d5bbadd",header:"header_6ab3a845b2",content:"content_5ee427864c"};!function(e){const n="s_id-0e68c3ff993d_3_85_1";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".layout_2c9e3f1503 {\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n}\n.layout_2c9e3f1503 .media_644d5bbadd {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  overflow: hidden;\n  position: relative;\n  width: 100%;\n  flex-shrink: 0;\n}\n.layout_2c9e3f1503 .header_6ab3a845b2 {\n  width: 100%;\n  text-align: center;\n  margin-block: var(--spacing-xl) var(--spacing-small);\n  padding-inline: var(--modal-inline-padding);\n}\n.layout_2c9e3f1503 .content_5ee427864c {\n  width: 100%;\n  height: 100%;\n  flex: 1;\n  align-self: flex-start;\n  padding-inline: var(--modal-inline-padding);\n  padding-block-end: var(--spacing-large);\n  text-align: center;\n  overflow: hidden;\n}");export{e as default};
+var e={layout:"layout_aa4fcd4b2a",media:"media_82da89fb72",header:"header_847f823bcd",content:"content_c929174eb3"};!function(e){const n="s_id-0e68c3ff993d_3_87_0";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,a.firstChild?a.insertBefore(t,a.firstChild):a.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".layout_aa4fcd4b2a {\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n}\n.layout_aa4fcd4b2a .media_82da89fb72 {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  overflow: hidden;\n  position: relative;\n  width: 100%;\n  flex-shrink: 0;\n}\n.layout_aa4fcd4b2a .header_847f823bcd {\n  width: 100%;\n  text-align: center;\n  margin-block: var(--spacing-xl) var(--spacing-small);\n  padding-inline: var(--modal-inline-padding);\n}\n.layout_aa4fcd4b2a .content_c929174eb3 {\n  width: 100%;\n  height: 100%;\n  flex: 1;\n  align-self: flex-start;\n  padding-inline: var(--modal-inline-padding);\n  padding-block-end: var(--spacing-large);\n  text-align: center;\n  overflow: hidden;\n}");export{e as default};
 //# sourceMappingURL=ModalMediaLayout.module.scss.js.map

package/dist/src/components/Modal/layouts/ModalSideBySideLayout/ModalSideBySideLayout.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{slicedToArray as e}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import t,{forwardRef as a}from"react";import r from"classnames";import{getTestId as s}from"../../../../tests/testIds.js";import{ComponentDefaultTestId as o}from"../../../../tests/constants.js";import l from"./ModalSideBySideLayout.module.scss.js";import m from"../ModalLayoutScrollableContent.js";import i from"../ModalFooterShadow.js";var d=a((function(a,d){var n=a.className,c=a.id,f=a["data-testid"],p=t.Children.toArray(a.children),u=e(p,3),E=u[0],j=u[1],v=u[2];return t.createElement(t.Fragment,null,t.createElement("div",{ref:d,className:r(l.layout,n),id:c,"data-testid":f||s(o.MODAL_SIDE_BY_SIDE_LAYOUT,c)},t.createElement("div",{className:l.header},E),t.createElement(m,{className:l.content},j),t.createElement("div",{className:l.media},v)),t.createElement(i,{show:!0}))}));export{d as default};
+import{slicedToArray as e}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import t,{forwardRef as a}from"react";import r from"classnames";import{getTestId as s}from"../../../../tests/testIds.js";import{ComponentDefaultTestId as o}from"../../../../tests/constants.js";import l from"./ModalSideBySideLayout.module.scss.js";import m from"../ModalLayoutScrollableContent.js";import i from"../ModalFooterShadow.js";var d=a((function(a,d){var n=a.className,c=a.id,f=a["data-testid"],p=t.Children.toArray(a.children),u=e(p,3),E=u[0],_=u[1],j=u[2];return t.createElement(t.Fragment,null,t.createElement("div",{ref:d,className:r(l.layout,n),id:c,"data-testid":f||s(o.MODAL_NEXT_SIDE_BY_SIDE_LAYOUT,c)},t.createElement("div",{className:l.header},E),t.createElement(m,{className:l.content},_),t.createElement("div",{className:l.media},j)),t.createElement(i,{show:!0}))}));export{d as default};
 //# sourceMappingURL=ModalSideBySideLayout.js.map

package/dist/src/components/Modal/layouts/ModalSideBySideLayout/ModalSideBySideLayout.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalSideBySideLayout.js","sources":["../../../../../../src/components/Modal/layouts/ModalSideBySideLayout/ModalSideBySideLayout.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport cx from \"classnames\";\nimport { getTestId } from \"../../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../../tests/constants\";\nimport styles from \"./ModalSideBySideLayout.module.scss\";\nimport { type ModalSideBySideLayoutProps } from \"./ModalSideBySideLayout.types\";\nimport ModalLayoutScrollableContent from \"../ModalLayoutScrollableContent\";\nimport ModalFooterShadow from \"../ModalFooterShadow\";\n\nconst ModalSideBySideLayout = forwardRef(\n (\n { children, className, id, \"data-testid\": dataTestId }: ModalSideBySideLayoutProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const [header, content, media] = React.Children.toArray(children);\n return (\n <>\n <div\n ref={ref}\n className={cx(styles.layout, className)}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.~~MODAL_SIDE_BY_SIDE_LAYOUT~~, id)}\n >\n <div className={styles.header}>{header}</div>\n <ModalLayoutScrollableContent className={styles.content}>{content}</ModalLayoutScrollableContent>\n <div className={styles.media}>{media}</div>\n </div>\n <ModalFooterShadow show />\n </>\n );\n }\n);\n\nexport default ModalSideBySideLayout;\n"],"names":["ModalSideBySideLayout","forwardRef","_ref","ref","className","id","dataTestId","_React$Children$toArr","React","Children","toArray","children","_React$Children$toArr2","_slicedToArray","header","content","media","createElement","Fragment","cx","styles","layout","getTestId","ComponentDefaultTestId","~~MODAL_SIDE_BY_SIDE_LAYOUT~~","ModalLayoutScrollableContent","ModalFooterShadow","show"],"mappings":"qaASMA,IAAAA,EAAwBC,GAC5B,SAAAC,EAEEC,GACE,IAFUC,EAASF,EAATE,UAAWC,EAAEH,EAAFG,GAAmBC,EAAUJ,EAAzB,eAG3BK,EAAiCC,EAAMC,SAASC,QAHtCR,EAARS,UAG+DC,EAAAC,EAAAN,EAAA,GAA1DO,EAAMF,EAAA,GAAEG,EAAOH,EAAA,GAAEI,EAAKJ,EAAA,GAC7B,OACEJ,EAAAS,cAAAT,EAAAU,SAAA,KACEV,EAAAS,cAAA,MAAA,CACEd,IAAKA,EACLC,UAAWe,EAAGC,EAAOC,OAAQjB,GAC7BC,GAAIA,EACS,cAAAC,GAAcgB,EAAUC,EAAuBC,~~0BAA2BnB~~,~~IAEvFG,~~EAAAS,cAAA,MAAA,CAAKb,UAAWgB,EAAON,QAASA,GAChCN,EAACS,cAAAQ,GAA6BrB,UAAWgB,EAAOL,SAAUA,GAC1DP,EAAKS,cAAA,MAAA,CAAAb,UAAWgB,EAAOJ,OAAQA,IAEjCR,EAAAS,cAACS,EAAkB,CAAAC,MAAO,IAGhC"}
1	+ {"version":3,"file":"ModalSideBySideLayout.js","sources":["../../../../../../src/components/Modal/layouts/ModalSideBySideLayout/ModalSideBySideLayout.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport cx from \"classnames\";\nimport { getTestId } from \"../../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../../tests/constants\";\nimport styles from \"./ModalSideBySideLayout.module.scss\";\nimport { type ModalSideBySideLayoutProps } from \"./ModalSideBySideLayout.types\";\nimport ModalLayoutScrollableContent from \"../ModalLayoutScrollableContent\";\nimport ModalFooterShadow from \"../ModalFooterShadow\";\n\nconst ModalSideBySideLayout = forwardRef(\n (\n { children, className, id, \"data-testid\": dataTestId }: ModalSideBySideLayoutProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const [header, content, media] = React.Children.toArray(children);\n return (\n <>\n <div\n ref={ref}\n className={cx(styles.layout, className)}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.MODAL_NEXT_SIDE_BY_SIDE_LAYOUT, id)}\n >\n <div className={styles.header}>{header}</div>\n <ModalLayoutScrollableContent className={styles.content}>{content}</ModalLayoutScrollableContent>\n <div className={styles.media}>{media}</div>\n </div>\n <ModalFooterShadow show />\n </>\n );\n }\n);\n\nexport default ModalSideBySideLayout;\n"],"names":["ModalSideBySideLayout","forwardRef","_ref","ref","className","id","dataTestId","_React$Children$toArr","React","Children","toArray","children","_React$Children$toArr2","_slicedToArray","header","content","media","createElement","Fragment","cx","styles","layout","getTestId","ComponentDefaultTestId","MODAL_NEXT_SIDE_BY_SIDE_LAYOUT","ModalLayoutScrollableContent","ModalFooterShadow","show"],"mappings":"qaASMA,IAAAA,EAAwBC,GAC5B,SAAAC,EAEEC,GACE,IAFUC,EAASF,EAATE,UAAWC,EAAEH,EAAFG,GAAmBC,EAAUJ,EAAzB,eAG3BK,EAAiCC,EAAMC,SAASC,QAHtCR,EAARS,UAG+DC,EAAAC,EAAAN,EAAA,GAA1DO,EAAMF,EAAA,GAAEG,EAAOH,EAAA,GAAEI,EAAKJ,EAAA,GAC7B,OACEJ,EAAAS,cAAAT,EAAAU,SAAA,KACEV,EAAAS,cAAA,MAAA,CACEd,IAAKA,EACLC,UAAWe,EAAGC,EAAOC,OAAQjB,GAC7BC,GAAIA,EACS,cAAAC,GAAcgB,EAAUC,EAAuBC,+BAAgCnB,IAE5FG,EAAAS,cAAA,MAAA,CAAKb,UAAWgB,EAAON,QAASA,GAChCN,EAACS,cAAAQ,GAA6BrB,UAAWgB,EAAOL,SAAUA,GAC1DP,EAAKS,cAAA,MAAA,CAAAb,UAAWgB,EAAOJ,OAAQA,IAEjCR,EAAAS,cAACS,EAAkB,CAAAC,MAAO,IAGhC"}

package/dist/src/components/Modal/layouts/ModalSideBySideLayout/ModalSideBySideLayout.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={layout:"layout_08b89cfef8",header:"header_eef4252e9d",content:"content_e311755b99",media:"media_20dd126fd7"};!function(e){const n="s_id-5a065e57e1cb_3_85_1";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,d.firstChild?d.insertBefore(t,d.firstChild):d.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".layout_08b89cfef8 {\n  width: 100%;\n  height: 100%;\n  display: grid;\n  grid-template-columns: 60% 40%;\n  grid-template-rows: auto 1fr;\n  min-height: 0;\n}\n.layout_08b89cfef8 .header_eef4252e9d {\n  width: 100%;\n  margin-block: var(--spacing-xl) var(--spacing-large);\n  padding-inline: var(--modal-inline-padding);\n  grid-column: 1/2;\n  grid-row: 1;\n}\n.layout_08b89cfef8 .content_e311755b99 {\n  grid-column: 1/2;\n  grid-row: 2;\n  padding-block-end: var(--spacing-xl);\n}\n.layout_08b89cfef8 .media_20dd126fd7 {\n  grid-column: 2/3;\n  grid-row: 1/3;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n  position: relative;\n}");export{e as default};
+var e={layout:"layout_278c4d6d2e",header:"header_8e745c4cdc",content:"content_9180766281",media:"media_aae91e0f31"};!function(e){const n="s_id-5a065e57e1cb_3_87_0";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,d.firstChild?d.insertBefore(t,d.firstChild):d.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".layout_278c4d6d2e {\n  width: 100%;\n  height: 100%;\n  display: grid;\n  grid-template-columns: 60% 40%;\n  grid-template-rows: auto 1fr;\n  min-height: 0;\n}\n.layout_278c4d6d2e .header_8e745c4cdc {\n  width: 100%;\n  margin-block: var(--spacing-xl) var(--spacing-large);\n  padding-inline: var(--modal-inline-padding);\n  grid-column: 1/2;\n  grid-row: 1;\n}\n.layout_278c4d6d2e .content_9180766281 {\n  grid-column: 1/2;\n  grid-row: 2;\n  padding-block-end: var(--spacing-xl);\n}\n.layout_278c4d6d2e .media_aae91e0f31 {\n  grid-column: 2/3;\n  grid-row: 1/3;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n  position: relative;\n}");export{e as default};
 //# sourceMappingURL=ModalSideBySideLayout.module.scss.js.map

package/dist/src/components/MultiStepIndicator/MultiStepConstants.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ var n,c,i,r;!function(n){n.PRIMARY="primary",n.SUCCESS="success",n.DANGER="danger",n.DARK="dark"}(n\|\|(n={})),function(n){n.PENDING="pending",n.ACTIVE="active",n.FULFILLED="fulfilled"}(c\|\|(c={})),function(n){n.HORIZONTAL="horizontal",n.VERTICAL="vertical"}(i\|\|(i={})),function(n){n.REGULAR="regular",n.COMPACT="compact"}(r\|\|(r={}));export{n as MultiStepType,r as Size,c as StepStatus,i as TextPlacement};
2	+ //# sourceMappingURL=MultiStepConstants.js.map

package/dist/src/components/MultiStepIndicator/MultiStepConstants.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"MultiStepConstants.js","sources":["../../../../src/components/MultiStepIndicator/MultiStepConstants.ts"],"sourcesContent":["/**\n * @deprecated\n */\nexport enum MultiStepType {\n PRIMARY = \"primary\",\n SUCCESS = \"success\",\n DANGER = \"danger\",\n DARK = \"dark\"\n}\n\n/**\n * @deprecated\n */\nexport enum StepStatus {\n PENDING = \"pending\",\n ACTIVE = \"active\",\n FULFILLED = \"fulfilled\"\n}\n\n/**\n * @deprecated\n */\nexport enum TextPlacement {\n HORIZONTAL = \"horizontal\",\n VERTICAL = \"vertical\"\n}\n\n/**\n * @deprecated\n */\nexport enum Size {\n REGULAR = \"regular\",\n COMPACT = \"compact\"\n}\n"],"names":["MultiStepType","StepStatus","TextPlacement","Size"],"mappings":"IAGYA,EAUAC,EASAC,EAQAC,GA3BZ,SAAYH,GACVA,EAAA,QAAA,UACAA,EAAA,QAAA,UACAA,EAAA,OAAA,SACAA,EAAA,KAAA,MACD,CALD,CAAYA,IAAAA,EAKX,CAAA,IAKD,SAAYC,GACVA,EAAA,QAAA,UACAA,EAAA,OAAA,SACAA,EAAA,UAAA,WACD,CAJD,CAAYA,IAAAA,EAIX,CAAA,IAKD,SAAYC,GACVA,EAAA,WAAA,aACAA,EAAA,SAAA,UACD,CAHD,CAAYA,IAAAA,EAGX,CAAA,IAKD,SAAYC,GACVA,EAAA,QAAA,UACAA,EAAA,QAAA,SACD,CAHD,CAAYA,IAAAA,EAGX,CAAA"}

package/dist/src/components/MultiStepIndicator/MultiStepIndicator.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import t from"classnames";import i,{forwardRef as l,useCallback as o,useMemo as s}from"react";import r from"../Divider/Divider.js";import{NOOP as a}from"../../utils/function-utils.js";import n from"./components/StepIndicator/StepIndicator.js";import{getTestId as p}from"../../tests/testIds.js";import{ComponentDefaultTestId as c}from"../../tests/constants.js";import m from"./MultiStepIndicator.module.scss.js";import d from"../../../icons/dist/react/Check.js";var f=l((function(l,f){var u=l.className,v=l.steps,y=void 0===v?[]:v,C=l.type,N=void 0===C?"primary":C,I=l.stepComponentClassName,S=l.dividerComponentClassName,g=l.fulfilledStepIcon,j=void 0===g?d:g,b=l.fulfilledStepIconType,D=void 0===b?"svg":b,T=l.isFulfilledStepDisplayNumber,h=void 0!==T&&T,k=l.onClick,E=void 0===k?a:k,_=l.textPlacement,F=void 0===_?"horizontal":_,x=l.id,P=l["data-testid"],z="vertical"===F?"regular":l.size,O=o((function(l,o){return i.createElement(i.Fragment,{key:"".concat(l.titleText,"_").concat(o)},i.createElement(n,Object.assign({},l,{stepNumber:o+1,type:N,stepComponentClassName:I,fulfilledStepIcon:j,fulfilledStepIconType:D,onClick:E,isFulfilledStepDisplayNumber:h,size:z})),o!==y.length-1&&i.createElement(r,{className:t(m.divider,S,e({},m.compact,"compact"===z))}))}),[E,h,N,I,j,D,S,y.length,z]),w=o((function(e,l){return i.createElement(n,Object.assign({},e,{key:"".concat(e.titleText,"_").concat(l),stepNumber:l+1,type:N,stepComponentClassName:I,fulfilledStepIcon:j,fulfilledStepIconType:D,onClick:E,isFollowedByDivider:l!==y.length-1,stepDividerClassName:t(m.divider,S),isVertical:!0,isFulfilledStepDisplayNumber:h}))}),[E,h,N,I,j,D,S,y.length]),B=s((function(){return"vertical"===F?w:O}),[F,w,O]);return i.createElement("ol",{ref:f,id:x,"data-testid":P||p(c.MULTI_STEP_INDICATOR,x),className:t(m.wrapper,u)},y.map(B))}));export{f as default};
+import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import t from"classnames";import i,{forwardRef as s,useCallback as o,useMemo as r}from"react";import l from"../Divider/Divider.js";import{NOOP as a}from"../../utils/function-utils.js";import n from"./components/StepIndicator/StepIndicator.js";import{MultiStepType as p,StepStatus as m,TextPlacement as c,Size as d}from"./MultiStepConstants.js";import{getTestId as f}from"../../tests/testIds.js";import{ComponentDefaultTestId as u}from"../../tests/constants.js";import{withStaticProps as v}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import y from"./MultiStepIndicator.module.scss.js";import S from"../../../icons/dist/react/Check.js";var C=v(s((function(s,p){var m=s.className,c=s.steps,d=void 0===c?[]:c,v=s.type,C=void 0===v?"primary":v,N=s.stepComponentClassName,j=s.dividerComponentClassName,I=s.fulfilledStepIcon,g=void 0===I?S:I,b=s.fulfilledStepIconType,D=void 0===b?"svg":b,T=s.isFulfilledStepDisplayNumber,h=void 0!==T&&T,k=s.onClick,E=void 0===k?a:k,P=s.textPlacement,_=void 0===P?"horizontal":P,x=s.id,F=s["data-testid"],z="vertical"===_?"regular":s.size,w=o((function(s,o){return i.createElement(i.Fragment,{key:"".concat(s.titleText,"_").concat(o)},i.createElement(n,Object.assign({},s,{stepNumber:o+1,type:C,stepComponentClassName:N,fulfilledStepIcon:g,fulfilledStepIconType:D,onClick:E,isFulfilledStepDisplayNumber:h,size:z})),o!==d.length-1&&i.createElement(l,{className:t(y.divider,j,e({},y.compact,"compact"===z))}))}),[E,h,C,N,g,D,j,d.length,z]),M=o((function(e,s){return i.createElement(n,Object.assign({},e,{key:"".concat(e.titleText,"_").concat(s),stepNumber:s+1,type:C,stepComponentClassName:N,fulfilledStepIcon:g,fulfilledStepIconType:D,onClick:E,isFollowedByDivider:s!==d.length-1,stepDividerClassName:t(y.divider,j),isVertical:!0,isFulfilledStepDisplayNumber:h}))}),[E,h,C,N,g,D,j,d.length]),O=r((function(){return"vertical"===_?M:w}),[_,M,w]);return i.createElement("ol",{ref:p,id:x,"data-testid":F||f(u.MULTI_STEP_INDICATOR,x),className:t(y.wrapper,m)},d.map(O))})),{types:p,stepStatuses:m,textPlacements:c,sizes:d});export{C as default};
 //# sourceMappingURL=MultiStepIndicator.js.map

package/dist/src/components/MultiStepIndicator/MultiStepIndicator.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MultiStepIndicator.js","sources":["../../../../src/components/MultiStepIndicator/MultiStepIndicator.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, useCallback, useMemo } from \"react\";\nimport { Check } from \"@vibe/icons\";\nimport { type SubIcon } from \"@vibe/icon\";\nimport Divider from \"../../components/Divider/Divider\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport StepIndicator from \"./components/StepIndicator/StepIndicator\";\nimport { type MultiStepType, type MultiStepSize, type TextPlacement, type Step } from \"./MultiStep.types\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport { type VibeComponentProps } from \"../../types\";\nimport styles from \"./MultiStepIndicator.module.scss\";\n\nexport interface MultiStepIndicatorProps extends VibeComponentProps {\n /*\n The list of steps in the multi-step indicator.\n /\n steps?: Step[];\n /\n The visual style of the multi-step indicator.\n /\n type?: MultiStepType;\n /\n Class name applied to each step component.\n /\n stepComponentClassName?: string;\n /\n Class name applied to the divider between steps.\n /\n dividerComponentClassName?: string;\n /\n The icon used for fulfilled steps.\n /\n fulfilledStepIcon?: SubIcon;\n /\n The type of the fulfilled step icon.\n /\n fulfilledStepIconType?: \"svg\" \| \"font\";\n /\n If true, displays the step number instead of the fulfilled step icon.\n /\n isFulfilledStepDisplayNumber?: boolean;\n /\n Callback fired when a step is clicked.\n /\n onClick?: (stepNumber: number) => void;\n /\n The placement of the step text.\n /\n textPlacement?: TextPlacement;\n /\n The size of the multi-step indicator.\n */\n size?: MultiStepSize;\n}\n\nconst MultiStepIndicator = forwardRef(\n (\n {\n className,\n steps = [],\n type = \"primary\",\n stepComponentClassName,\n dividerComponentClassName,\n fulfilledStepIcon = Check,\n fulfilledStepIconType = \"svg\",\n isFulfilledStepDisplayNumber = false,\n onClick = NOOP,\n textPlacement = \"horizontal\",\n id,\n size,\n \"data-testid\": dataTestId\n }: MultiStepIndicatorProps,\n ref: React.ForwardedRef<HTMLOListElement>\n ) => {\n const finalSize = textPlacement === \"vertical\" ? \"regular\" : size;\n\n const renderHorizontalStepIndicator = useCallback(\n (step: Step, index: number) => {\n return (\n <React.Fragment key={`${step.titleText}_${index}`}>\n <StepIndicator\n {...step}\n stepNumber={index + 1}\n type={type}\n stepComponentClassName={stepComponentClassName}\n fulfilledStepIcon={fulfilledStepIcon}\n fulfilledStepIconType={fulfilledStepIconType}\n onClick={onClick}\n isFulfilledStepDisplayNumber={isFulfilledStepDisplayNumber}\n size={finalSize}\n />\n {index !== steps.length - 1 && (\n <Divider\n className={cx(styles.divider, dividerComponentClassName, {\n [styles.compact]: finalSize === \"compact\"\n })}\n />\n )}\n </React.Fragment>\n );\n },\n [\n onClick,\n isFulfilledStepDisplayNumber,\n type,\n stepComponentClassName,\n fulfilledStepIcon,\n fulfilledStepIconType,\n dividerComponentClassName,\n steps.length,\n finalSize\n ]\n );\n\n const renderVerticalStepIndicator = useCallback(\n (step: Step, index: number) => {\n return (\n <StepIndicator\n {...step}\n key={`${step.titleText}_${index}`}\n stepNumber={index + 1}\n type={type}\n stepComponentClassName={stepComponentClassName}\n fulfilledStepIcon={fulfilledStepIcon}\n fulfilledStepIconType={fulfilledStepIconType}\n onClick={onClick}\n isFollowedByDivider={index !== steps.length - 1}\n stepDividerClassName={cx(styles.divider, dividerComponentClassName)}\n isVertical\n isFulfilledStepDisplayNumber={isFulfilledStepDisplayNumber}\n />\n );\n },\n [\n onClick,\n isFulfilledStepDisplayNumber,\n type,\n stepComponentClassName,\n fulfilledStepIcon,\n fulfilledStepIconType,\n dividerComponentClassName,\n steps.length\n ]\n );\n\n const stepRenderer = useMemo(\n () => (textPlacement === \"vertical\" ? renderVerticalStepIndicator : renderHorizontalStepIndicator),\n [textPlacement, renderVerticalStepIndicator, renderHorizontalStepIndicator]\n );\n\n return (\n <ol\n ref={ref}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.MULTI_STEP_INDICATOR, id)}\n className={cx(styles.wrapper, className)}\n >\n {steps.map(stepRenderer)}\n </ol>\n );\n }\n);\n\nexport default MultiStepIndicator;\n"],"names":["~~MultiStepIndicator~~","forwardRef","_ref","ref","className","_ref$steps","steps","_ref$type","type","stepComponentClassName","dividerComponentClassName","_ref$fulfilledStepIco","fulfilledStepIcon","Check","_ref$fulfilledStepIco2","fulfilledStepIconType","_ref$isFulfilledStepD","isFulfilledStepDisplayNumber","_ref$onClick","onClick","NOOP","_ref$textPlacement","textPlacement","id","dataTestId","finalSize","size","renderHorizontalStepIndicator","useCallback","step","index","React","createElement","Fragment","key","concat","titleText","StepIndicator","Object","assign","stepNumber","length","Divider","cx","styles","divider","_defineProperty","compact","renderVerticalStepIndicator","isFollowedByDivider","stepDividerClassName","isVertical","stepRenderer","useMemo","getTestId","ComponentDefaultTestId","MULTI_STEP_INDICATOR","wrapper","map"],"mappings":"~~6hBAwDMA~~,~~IAAAA~~,~~EAAqBC~~,GACzB,SAAAC,EAgBEC,GACE,IAfAC,EAASF,EAATE,UAASC,EAAAH,EACTI,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EAAAE,EAAAL,EACVM,KAAAA,OAAO,IAAHD,EAAG,UAASA,EAChBE,EAAsBP,EAAtBO,uBACAC,EAAyBR,EAAzBQ,0BAAyBC,EAAAT,EACzBU,kBAAAA,OAAoBC,IAAHF,EAAGE,EAAKF,EAAAG,EAAAZ,EACzBa,sBAAAA,OAAwB,IAAHD,EAAG,MAAKA,EAAAE,EAAAd,EAC7Be,6BAAAA,OAA+B,IAAHD,GAAQA,EAAAE,EAAAhB,EACpCiB,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAnB,EACdoB,cAAAA,OAAgB,IAAHD,EAAG,aAAYA,EAC5BE,EAAErB,EAAFqB,GAEeC,EAAUtB,EAAzB,eAIIuB,EAA8B,aAAlBH,EAA+B,UAL3CpB,EAAJwB,KAOIC,EAAgCC,GACpC,SAACC,EAAYC,GACX,OACEC,EAAAC,cAACD,EAAME,SAAS,CAAAC,IAAG,GAAAC,OAAKN,EAAKO,UAAS,KAAAD,OAAIL,IACxCC,EAAAC,cAACK,EACKC,OAAAC,OAAA,CAAA,EAAAV,EACJ,CAAAW,WAAYV,EAAQ,EACpBtB,KAAMA,EACNC,uBAAwBA,EACxBG,kBAAmBA,EACnBG,sBAAuBA,EACvBI,QAASA,EACTF,6BAA8BA,EAC9BS,KAAMD,KAEPK,IAAUxB,EAAMmC,OAAS,GACxBV,EAACC,cAAAU,GACCtC,UAAWuC,EAAGC,EAAOC,QAASnC,EAAyBoC,EAAA,CAAA,EACpDF,EAAOG,QAAwB,YAAdtB,MAM7B,GACD,CACEN,EACAF,EACAT,EACAC,EACAG,EACAG,EACAL,EACAJ,EAAMmC,OACNhB,IAIEuB,EAA8BpB,GAClC,SAACC,EAAYC,GACX,OACEC,EAAAC,cAACK,EAAaC,OAAAC,OAAA,CAAA,EACRV,EACJ,CAAAK,IAAG,GAAAC,OAAKN,EAAKO,UAASD,KAAAA,OAAIL,GAC1BU,WAAYV,EAAQ,EACpBtB,KAAMA,EACNC,uBAAwBA,EACxBG,kBAAmBA,EACnBG,sBAAuBA,EACvBI,QAASA,EACT8B,oBAAqBnB,IAAUxB,EAAMmC,OAAS,EAC9CS,qBAAsBP,EAAGC,EAAOC,QAASnC,GACzCyC,cACAlC,6BAA8BA,IAGnC,GACD,CACEE,EACAF,EACAT,EACAC,EACAG,EACAG,EACAL,EACAJ,EAAMmC,SAIJW,EAAeC,GACnB,WAAA,MAAyB,aAAlB/B,EAA+B0B,EAA8BrB,CAA8B,GAClG,CAACL,EAAe0B,EAA6BrB,IAG/C,OACEI,EACEC,cAAA,KAAA,CAAA7B,IAAKA,EACLoB,GAAIA,EACS,cAAAC,GAAc8B,EAAUC,EAAuBC,qBAAsBjC,GAClFnB,UAAWuC,EAAGC,EAAOa,QAASrD,IAE7BE,EAAMoD,IAAIN,GAGjB"}
1	+ {"version":3,"file":"MultiStepIndicator.js","sources":["../../../../src/components/MultiStepIndicator/MultiStepIndicator.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, useCallback, useMemo } from \"react\";\nimport { Check } from \"@vibe/icons\";\nimport { type SubIcon } from \"@vibe/icon\";\nimport Divider from \"../../components/Divider/Divider\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport StepIndicator from \"./components/StepIndicator/StepIndicator\";\nimport {\n MultiStepType as MultiStepTypeEnum,\n Size as SizeEnum,\n StepStatus as StepStatusEnum,\n TextPlacement as TextPlacementEnum\n} from \"./MultiStepConstants\";\nimport { type MultiStepType, type MultiStepSize, type TextPlacement, type Step } from \"./MultiStep.types\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport { type VibeComponentProps, withStaticProps } from \"../../types\";\nimport styles from \"./MultiStepIndicator.module.scss\";\n\nexport interface MultiStepIndicatorProps extends VibeComponentProps {\n /*\n The list of steps in the multi-step indicator.\n /\n steps?: Step[];\n /\n The visual style of the multi-step indicator.\n /\n type?: MultiStepType;\n /\n Class name applied to each step component.\n /\n stepComponentClassName?: string;\n /\n Class name applied to the divider between steps.\n /\n dividerComponentClassName?: string;\n /\n The icon used for fulfilled steps.\n /\n fulfilledStepIcon?: SubIcon;\n /\n The type of the fulfilled step icon.\n /\n fulfilledStepIconType?: \"svg\" \| \"font\";\n /\n If true, displays the step number instead of the fulfilled step icon.\n /\n isFulfilledStepDisplayNumber?: boolean;\n /\n Callback fired when a step is clicked.\n /\n onClick?: (stepNumber: number) => void;\n /\n The placement of the step text.\n /\n textPlacement?: TextPlacement;\n /\n The size of the multi-step indicator.\n */\n size?: MultiStepSize;\n}\n\nconst MultiStepIndicator = forwardRef(\n (\n {\n className,\n steps = [],\n type = \"primary\",\n stepComponentClassName,\n dividerComponentClassName,\n fulfilledStepIcon = Check,\n fulfilledStepIconType = \"svg\",\n isFulfilledStepDisplayNumber = false,\n onClick = NOOP,\n textPlacement = \"horizontal\",\n id,\n size,\n \"data-testid\": dataTestId\n }: MultiStepIndicatorProps,\n ref: React.ForwardedRef<HTMLOListElement>\n ) => {\n const finalSize = textPlacement === \"vertical\" ? \"regular\" : size;\n\n const renderHorizontalStepIndicator = useCallback(\n (step: Step, index: number) => {\n return (\n <React.Fragment key={`${step.titleText}_${index}`}>\n <StepIndicator\n {...step}\n stepNumber={index + 1}\n type={type}\n stepComponentClassName={stepComponentClassName}\n fulfilledStepIcon={fulfilledStepIcon}\n fulfilledStepIconType={fulfilledStepIconType}\n onClick={onClick}\n isFulfilledStepDisplayNumber={isFulfilledStepDisplayNumber}\n size={finalSize}\n />\n {index !== steps.length - 1 && (\n <Divider\n className={cx(styles.divider, dividerComponentClassName, {\n [styles.compact]: finalSize === \"compact\"\n })}\n />\n )}\n </React.Fragment>\n );\n },\n [\n onClick,\n isFulfilledStepDisplayNumber,\n type,\n stepComponentClassName,\n fulfilledStepIcon,\n fulfilledStepIconType,\n dividerComponentClassName,\n steps.length,\n finalSize\n ]\n );\n\n const renderVerticalStepIndicator = useCallback(\n (step: Step, index: number) => {\n return (\n <StepIndicator\n {...step}\n key={`${step.titleText}_${index}`}\n stepNumber={index + 1}\n type={type}\n stepComponentClassName={stepComponentClassName}\n fulfilledStepIcon={fulfilledStepIcon}\n fulfilledStepIconType={fulfilledStepIconType}\n onClick={onClick}\n isFollowedByDivider={index !== steps.length - 1}\n stepDividerClassName={cx(styles.divider, dividerComponentClassName)}\n isVertical\n isFulfilledStepDisplayNumber={isFulfilledStepDisplayNumber}\n />\n );\n },\n [\n onClick,\n isFulfilledStepDisplayNumber,\n type,\n stepComponentClassName,\n fulfilledStepIcon,\n fulfilledStepIconType,\n dividerComponentClassName,\n steps.length\n ]\n );\n\n const stepRenderer = useMemo(\n () => (textPlacement === \"vertical\" ? renderVerticalStepIndicator : renderHorizontalStepIndicator),\n [textPlacement, renderVerticalStepIndicator, renderHorizontalStepIndicator]\n );\n\n return (\n <ol\n ref={ref}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.MULTI_STEP_INDICATOR, id)}\n className={cx(styles.wrapper, className)}\n >\n {steps.map(stepRenderer)}\n </ol>\n );\n }\n);\n\ninterface MultiStepIndicatorStaticProps {\n types: typeof MultiStepTypeEnum;\n stepStatuses: typeof StepStatusEnum;\n textPlacements: typeof TextPlacementEnum;\n sizes: typeof SizeEnum;\n}\n\nexport default withStaticProps<MultiStepIndicatorProps, MultiStepIndicatorStaticProps>(MultiStepIndicator, {\n types: MultiStepTypeEnum,\n stepStatuses: StepStatusEnum,\n textPlacements: TextPlacementEnum,\n sizes: SizeEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","_ref$steps","steps","_ref$type","type","stepComponentClassName","dividerComponentClassName","_ref$fulfilledStepIco","fulfilledStepIcon","Check","_ref$fulfilledStepIco2","fulfilledStepIconType","_ref$isFulfilledStepD","isFulfilledStepDisplayNumber","_ref$onClick","onClick","NOOP","_ref$textPlacement","textPlacement","id","dataTestId","finalSize","size","renderHorizontalStepIndicator","useCallback","step","index","React","createElement","Fragment","key","concat","titleText","StepIndicator","Object","assign","stepNumber","length","Divider","cx","styles","divider","_defineProperty","compact","renderVerticalStepIndicator","isFollowedByDivider","stepDividerClassName","isVertical","stepRenderer","useMemo","getTestId","ComponentDefaultTestId","MULTI_STEP_INDICATOR","wrapper","map","types","MultiStepTypeEnum","stepStatuses","StepStatusEnum","textPlacements","TextPlacementEnum","sizes","SizeEnum"],"mappings":"0uBA8DA,IAmHeA,EAAAA,EAnHYC,GACzB,SAAAC,EAgBEC,GACE,IAfAC,EAASF,EAATE,UAASC,EAAAH,EACTI,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EAAAE,EAAAL,EACVM,KAAAA,OAAO,IAAHD,EAAG,UAASA,EAChBE,EAAsBP,EAAtBO,uBACAC,EAAyBR,EAAzBQ,0BAAyBC,EAAAT,EACzBU,kBAAAA,OAAoBC,IAAHF,EAAGE,EAAKF,EAAAG,EAAAZ,EACzBa,sBAAAA,OAAwB,IAAHD,EAAG,MAAKA,EAAAE,EAAAd,EAC7Be,6BAAAA,OAA+B,IAAHD,GAAQA,EAAAE,EAAAhB,EACpCiB,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAnB,EACdoB,cAAAA,OAAgB,IAAHD,EAAG,aAAYA,EAC5BE,EAAErB,EAAFqB,GAEeC,EAAUtB,EAAzB,eAIIuB,EAA8B,aAAlBH,EAA+B,UAL3CpB,EAAJwB,KAOIC,EAAgCC,GACpC,SAACC,EAAYC,GACX,OACEC,EAAAC,cAACD,EAAME,SAAS,CAAAC,IAAG,GAAAC,OAAKN,EAAKO,UAAS,KAAAD,OAAIL,IACxCC,EAAAC,cAACK,EACKC,OAAAC,OAAA,CAAA,EAAAV,EACJ,CAAAW,WAAYV,EAAQ,EACpBtB,KAAMA,EACNC,uBAAwBA,EACxBG,kBAAmBA,EACnBG,sBAAuBA,EACvBI,QAASA,EACTF,6BAA8BA,EAC9BS,KAAMD,KAEPK,IAAUxB,EAAMmC,OAAS,GACxBV,EAACC,cAAAU,GACCtC,UAAWuC,EAAGC,EAAOC,QAASnC,EAAyBoC,EAAA,CAAA,EACpDF,EAAOG,QAAwB,YAAdtB,MAM7B,GACD,CACEN,EACAF,EACAT,EACAC,EACAG,EACAG,EACAL,EACAJ,EAAMmC,OACNhB,IAIEuB,EAA8BpB,GAClC,SAACC,EAAYC,GACX,OACEC,EAAAC,cAACK,EAAaC,OAAAC,OAAA,CAAA,EACRV,EACJ,CAAAK,IAAG,GAAAC,OAAKN,EAAKO,UAASD,KAAAA,OAAIL,GAC1BU,WAAYV,EAAQ,EACpBtB,KAAMA,EACNC,uBAAwBA,EACxBG,kBAAmBA,EACnBG,sBAAuBA,EACvBI,QAASA,EACT8B,oBAAqBnB,IAAUxB,EAAMmC,OAAS,EAC9CS,qBAAsBP,EAAGC,EAAOC,QAASnC,GACzCyC,cACAlC,6BAA8BA,IAGnC,GACD,CACEE,EACAF,EACAT,EACAC,EACAG,EACAG,EACAL,EACAJ,EAAMmC,SAIJW,EAAeC,GACnB,WAAA,MAAyB,aAAlB/B,EAA+B0B,EAA8BrB,CAA8B,GAClG,CAACL,EAAe0B,EAA6BrB,IAG/C,OACEI,EACEC,cAAA,KAAA,CAAA7B,IAAKA,EACLoB,GAAIA,EACS,cAAAC,GAAc8B,EAAUC,EAAuBC,qBAAsBjC,GAClFnB,UAAWuC,EAAGC,EAAOa,QAASrD,IAE7BE,EAAMoD,IAAIN,GAGjB,IAUyG,CACzGO,MAAOC,EACPC,aAAcC,EACdC,eAAgBC,EAChBC,MAAOC"}

package/dist/src/components/MultiStepIndicator/MultiStepIndicator.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={wrapper:"wrapper_12475324f9",divider:"divider_21c9499d06",compact:"compact_d548b3afdb"};!function(e){const n="s_id-0040463364ed_3_85_1";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+n))return;const i=document.createElement("style");i.id=n,d.firstChild?d.insertBefore(i,d.firstChild):d.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".wrapper_12475324f9 {\n  display: flex;\n}\n.wrapper_12475324f9 .divider_21c9499d06 {\n  background-color: var(--ui-border-color);\n  margin: 16px;\n  height: 1px;\n  width: 48px;\n}\n.wrapper_12475324f9 .divider_21c9499d06.compact_d548b3afdb {\n  max-width: 40px;\n  min-width: 16px;\n  margin-inline-start: var(--spacing-small);\n  margin-inline-end: var(--spacing-small);\n}");export{e as default};
+var e={wrapper:"wrapper_1df6e1b172",divider:"divider_7b556119e8",compact:"compact_742862518e"};!function(e){const n="s_id-0040463364ed_3_87_0";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+n))return;const i=document.createElement("style");i.id=n,d.firstChild?d.insertBefore(i,d.firstChild):d.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".wrapper_1df6e1b172 {\n  display: flex;\n}\n.wrapper_1df6e1b172 .divider_7b556119e8 {\n  background-color: var(--ui-border-color);\n  margin: 16px;\n  height: 1px;\n  width: 48px;\n}\n.wrapper_1df6e1b172 .divider_7b556119e8.compact_742862518e {\n  max-width: 40px;\n  min-width: 16px;\n  margin-inline-start: var(--spacing-small);\n  margin-inline-end: var(--spacing-small);\n}");export{e as default};
 //# sourceMappingURL=MultiStepIndicator.module.scss.js.map

package/dist/src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{slicedToArray as e,toConsumableArray as t,defineProperty as i}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{camelCase as n}from"es-toolkit";import{getStyle as a}from"../../../../helpers/typesciptCssModulesHelper.js";import{getTestId as o,ComponentDefaultTestId as r}from"../../../../tests/testIds.js";import l from"classnames";import{keyCodes as s}from"../../../../constants/keyCodes.js";import c,{useState as m,useRef as p,useCallback as d,useEffect as u,useMemo as f}from"react";import{SwitchTransition as v,CSSTransition as y}from"react-transition-group";import _ from"../../../../hooks/useEventListener/index.js";import E from"../../../../hooks/useKeyEvent/index.js";import b from"../../../Divider/Divider.js";import{NOOP as x}from"../../../../utils/function-utils.js";import N from"../../../HiddenText/HiddenText.js";import k from"./StepIndicator.module.scss.js";import C from"../../../../../components/clickable/dist/Clickable/Clickable.js";import I from"../../../../../components/icon/dist/Icon/Icon.js";import S from"../../../../../icons/dist/react/Check.js";var j=[s.ENTER,s.SPACE],T=function(e){var t=e.fulfilledStepIcon,i=e.fulfilledStepIconType;return"fulfilled"!==e.status||e.isFulfilledStepDisplayNumber?c.createElement(c.Fragment,null,e.stepNumber):c.createElement(I,{icon:t,className:l(k.numberContainerTextCheckIcon),type:i,ignoreFocusStyle:!0,ariaHidden:!0})},A=function(s){var I=s.stepComponentClassName,A=s.stepNumber,g=void 0===A?1:A,D=s.status,h=void 0===D?"pending":D,w=s.titleText,F=void 0===w?"Heading text":w,H=s.subtitleText,P=void 0===H?"Subtitle text":H,L=s.type,z=void 0===L?"primary":L,B=s.fulfilledStepIcon,R=void 0===B?S:B,V=s.fulfilledStepIconType,K=void 0===V?"svg":V,M=s.isFulfilledStepDisplayNumber,O=void 0!==M&&M,q=s.onClick,G=void 0===q?x:q,J=s.isFollowedByDivider,Q=void 0!==J&&J,U=s.stepDividerClassName,W=s.isVertical,X=void 0!==W&&W,Y=s.id,Z=s.size,$=void 0===Z?"regular":Z,ee=s["data-testid"],te=m(!1),ie=e(te,2),ne=ie[0],ae=ie[1],oe=p(null),re=p(h),le=d((function(){ae(!0)}),[ae]),se=d((function(){ae(!1)}),[ae]),ce=d((function(){return re.current!==h}),[re,h]),me=d((function(){G&&G(g)}),[G,g]);_({eventName:"animationend",callback:se,ref:oe}),E({keys:j,callback:me,ref:oe}),u((function(){ce()&&le()}),[h,ce,le]),u((function(){re.current=h}),[h]);var pe=f((function(){return"Step ".concat(g,": ").concat(F," - ").concat(P,", status: ").concat(h)}),[h,F,g,P]),de=function(e){return[a(k,n(e||"indicator")),a(k,n("type-".concat(z).concat(e))),a(k,n("status-".concat(h).concat(e))),a(k,n("size-".concat($).concat(e)))]};return c.createElement(C,{tabIndex:"-1",elementType:"li",className:l.apply(void 0,t(de("")).concat([I,i(i(i({},k.withAnimation,ne),k.clickable,G),k.textPlacementVertical,X)])),"aria-label":pe,onClick:me,"data-testid":ee||o(r.STEP_INDICATOR,Y)},c.createElement("div",{className:l.apply(void 0,t(de("__number-divider-container")))},c.createElement("div",{className:l.apply(void 0,t(de("__number-container"))),ref:oe,tabIndex:0,role:"button"},c.createElement(v,{mode:"out-in"},c.createElement(y,{classNames:{enter:k.swapEnter,enterActive:k.swapEnterActive,exit:k.swapExit,exitActive:k.swapExitActive},addEndListener:function(e,t){e.addEventListener("transitionend",t,!1)},key:h},c.createElement("span",{className:l.apply(void 0,t(de("__number-container__text")))},c.createElement(T,{fulfilledStepIcon:R,fulfilledStepIconType:K,isFulfilledStepDisplayNumber:O,stepNumber:g,status:h}))))),Q&&X&&c.createElement(b,{className:l(k.divider,U)})),c.createElement("div",{className:l.apply(void 0,t(de("__text-container")))},c.createElement("div",{className:l.apply(void 0,t(de("__text-container__title")))},c.createElement(N,{text:h})," ",c.createElement("span",{className:l.apply(void 0,t(de("__text-container__title__text")))},F)),"compact"!==$?c.createElement("span",{className:l.apply(void 0,t(de("__text-container__subtitle__text")))},P):null))};export{A as default};
+import{slicedToArray as e,toConsumableArray as t,defineProperty as i}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{camelCase as n}from"es-toolkit";import{getStyle as a}from"../../../../helpers/typesciptCssModulesHelper.js";import{getTestId as o,ComponentDefaultTestId as r}from"../../../../tests/testIds.js";import l from"classnames";import{keyCodes as s}from"../../../../constants/keyCodes.js";import c,{useState as m,useRef as p,useCallback as d,useEffect as u,useMemo as f}from"react";import{SwitchTransition as v,CSSTransition as y}from"react-transition-group";import _ from"../../../../hooks/useEventListener/index.js";import E from"../../../../hooks/useKeyEvent/index.js";import b from"../../../Divider/Divider.js";import{NOOP as x}from"../../../../utils/function-utils.js";import N from"../../../HiddenText/HiddenText.js";import k from"./StepIndicator.module.scss.js";import C from"../../../../../components/clickable/dist/Clickable/Clickable.js";import I from"../../../../../components/icon/dist/Icon/Icon.js";import S from"../../../../../icons/dist/react/Check.js";var T=[s.ENTER,s.SPACE],j=function(e){var t=e.fulfilledStepIcon,i=e.fulfilledStepIconType;return"fulfilled"!==e.status||e.isFulfilledStepDisplayNumber?c.createElement(c.Fragment,null,e.stepNumber):c.createElement(I,{icon:t,className:l(k.numberContainerTextCheckIcon),iconType:i,ignoreFocusStyle:!0,ariaHidden:!0})},A=function(s){var I=s.stepComponentClassName,A=s.stepNumber,g=void 0===A?1:A,D=s.status,h=void 0===D?"pending":D,w=s.titleText,F=void 0===w?"Heading text":w,H=s.subtitleText,P=void 0===H?"Subtitle text":H,L=s.type,z=void 0===L?"primary":L,B=s.fulfilledStepIcon,R=void 0===B?S:B,V=s.fulfilledStepIconType,K=void 0===V?"svg":V,M=s.isFulfilledStepDisplayNumber,O=void 0!==M&&M,q=s.onClick,G=void 0===q?x:q,J=s.isFollowedByDivider,Q=void 0!==J&&J,U=s.stepDividerClassName,W=s.isVertical,X=void 0!==W&&W,Y=s.id,Z=s.size,$=void 0===Z?"regular":Z,ee=s["data-testid"],te=m(!1),ie=e(te,2),ne=ie[0],ae=ie[1],oe=p(null),re=p(h),le=d((function(){ae(!0)}),[ae]),se=d((function(){ae(!1)}),[ae]),ce=d((function(){return re.current!==h}),[re,h]),me=d((function(){G&&G(g)}),[G,g]);_({eventName:"animationend",callback:se,ref:oe}),E({keys:T,callback:me,ref:oe}),u((function(){ce()&&le()}),[h,ce,le]),u((function(){re.current=h}),[h]);var pe=f((function(){return"Step ".concat(g,": ").concat(F," - ").concat(P,", status: ").concat(h)}),[h,F,g,P]),de=function(e){return[a(k,n(e||"indicator")),a(k,n("type-".concat(z).concat(e))),a(k,n("status-".concat(h).concat(e))),a(k,n("size-".concat($).concat(e)))]};return c.createElement(C,{tabIndex:"-1",elementType:"li",className:l.apply(void 0,t(de("")).concat([I,i(i(i({},k.withAnimation,ne),k.clickable,G),k.textPlacementVertical,X)])),"aria-label":pe,onClick:me,"data-testid":ee||o(r.STEP_INDICATOR,Y)},c.createElement("div",{className:l.apply(void 0,t(de("__number-divider-container")))},c.createElement("div",{className:l.apply(void 0,t(de("__number-container"))),ref:oe,tabIndex:0,role:"button"},c.createElement(v,{mode:"out-in"},c.createElement(y,{classNames:{enter:k.swapEnter,enterActive:k.swapEnterActive,exit:k.swapExit,exitActive:k.swapExitActive},addEndListener:function(e,t){e.addEventListener("transitionend",t,!1)},key:h},c.createElement("span",{className:l.apply(void 0,t(de("__number-container__text")))},c.createElement(j,{fulfilledStepIcon:R,fulfilledStepIconType:K,isFulfilledStepDisplayNumber:O,stepNumber:g,status:h}))))),Q&&X&&c.createElement(b,{className:l(k.divider,U)})),c.createElement("div",{className:l.apply(void 0,t(de("__text-container")))},c.createElement("div",{className:l.apply(void 0,t(de("__text-container__title")))},c.createElement(N,{text:h})," ",c.createElement("span",{className:l.apply(void 0,t(de("__text-container__title__text")))},F)),"compact"!==$?c.createElement("span",{className:l.apply(void 0,t(de("__text-container__subtitle__text")))},P):null))};export{A as default};
 //# sourceMappingURL=StepIndicator.js.map

package/dist/src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepIndicator.js","sources":["../../../../../../src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.tsx"],"sourcesContent":["import { camelCase } from \"es-toolkit\";\nimport { getStyle } from \"../../../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport { keyCodes } from \"../../../../constants/keyCodes\";\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { CSSTransition, SwitchTransition } from \"react-transition-group\";\nimport useEventListener from \"../../../../hooks/useEventListener\";\nimport useKeyEvent from \"../../../../hooks/useKeyEvent\";\nimport { Icon } from \"@vibe/icon\";\nimport { Check } from \"@vibe/icons\";\nimport Divider from \"../../../../components/Divider/Divider\";\nimport { NOOP } from \"../../../../utils/function-utils\";\nimport HiddenText from \"../../../../components/HiddenText/HiddenText\";\nimport { Clickable } from \"@vibe/clickable\";\nimport { type MultiStepSize, type MultiStepType, type StepStatus } from \"../../MultiStep.types\";\nimport styles from \"./StepIndicator.module.scss\";\nimport classNames from \"classnames\";\nimport { type VibeComponentProps } from \"../../../../types\";\nimport { type SubIcon } from \"@vibe/icon\";\n\nconst KEYS = [keyCodes.ENTER, keyCodes.SPACE];\n\nexport interface StepCircleDisplayProps {\n /*\n The status of the step.\n /\n status: StepStatus;\n /\n If true, displays the step number instead of the fulfilled step icon.\n /\n isFulfilledStepDisplayNumber: boolean;\n /\n The icon displayed when the step is fulfilled.\n /\n fulfilledStepIcon: SubIcon;\n /\n The type of icon used.\n /\n fulfilledStepIconType: \"svg\" \| \"font\";\n /\n The step number in the sequence.\n /\n stepNumber: number;\n}\n\nconst StepCircleDisplay: React.FC<StepCircleDisplayProps> = ({\n status,\n isFulfilledStepDisplayNumber,\n fulfilledStepIcon,\n fulfilledStepIconType,\n stepNumber\n}) => {\n return status === \"fulfilled\" && !isFulfilledStepDisplayNumber ? (\n <Icon\n icon={fulfilledStepIcon}\n className={classNames(styles.numberContainerTextCheckIcon)}\n type={fulfilledStepIconType}\n ignoreFocusStyle\n ariaHidden={true}\n />\n ) : (\n <>{stepNumber}</>\n );\n};\n\nexport interface StepIndicatorProps extends VibeComponentProps {\n /\n The status of the step.\n /\n status: StepStatus;\n /\n The main title text for the step.\n /\n titleText: string;\n /\n The subtitle text for the step.\n /\n subtitleText?: string;\n /\n The number of the step in the sequence.\n /\n stepNumber?: number;\n /\n Class name applied to the step component.\n /\n stepComponentClassName?: string;\n /\n The visual style of the step indicator.\n /\n type?: MultiStepType;\n /\n The icon used for a fulfilled step.\n /\n fulfilledStepIcon?: SubIcon;\n /\n The type of icon used.\n /\n fulfilledStepIconType?: \"svg\" \| \"font\";\n /\n If true, displays the step number instead of the fulfilled step icon.\n /\n isFulfilledStepDisplayNumber?: boolean;\n /\n Callback fired when the step is clicked.\n /\n onClick?: (stepNumber: number) => void;\n /\n If true, adds a divider after the step.\n /\n isFollowedByDivider?: boolean;\n /\n Class name applied to the step divider.\n /\n stepDividerClassName?: string;\n /\n If true, the step indicator is displayed vertically.\n /\n isVertical?: boolean;\n /\n The size of the step indicator.\n /\n size?: MultiStepSize;\n}\n\nconst StepIndicator: React.FC<StepIndicatorProps> = ({\n stepComponentClassName,\n stepNumber = 1,\n status = \"pending\",\n titleText = \"Heading text\",\n subtitleText = \"Subtitle text\",\n type = \"primary\",\n fulfilledStepIcon = Check,\n fulfilledStepIconType = \"svg\",\n isFulfilledStepDisplayNumber = false,\n onClick = NOOP,\n isFollowedByDivider = false,\n stepDividerClassName,\n isVertical = false,\n id,\n size = \"regular\",\n \"data-testid\": dataTestId\n}: StepIndicatorProps) => {\n // Animations state\n const [statusChangeAnimationState, setStatusChangeAnimationState] = useState(false);\n\n // Refs\n const componentRef = useRef(null);\n const prevStatusRef = useRef(status);\n\n // Callbacks for modifying animation state\n const enableStatusChangeAnimation = useCallback(() => {\n setStatusChangeAnimationState(true);\n }, [setStatusChangeAnimationState]);\n\n const disableStatusChangeAnimation = useCallback(() => {\n setStatusChangeAnimationState(false);\n }, [setStatusChangeAnimationState]);\n\n const isStatusTransition = useCallback(() => prevStatusRef.current !== status, [prevStatusRef, status]);\n\n const handleClick = useCallback(() => {\n if (onClick) onClick(stepNumber);\n }, [onClick, stepNumber]);\n\n // Event listeners for removing animation.\n useEventListener({\n eventName: \"animationend\",\n callback: disableStatusChangeAnimation,\n ref: componentRef\n });\n\n useKeyEvent({\n keys: KEYS,\n callback: handleClick,\n ref: componentRef\n });\n\n // Effect - triggering animation when necessary.\n useEffect(() => {\n if (isStatusTransition()) {\n enableStatusChangeAnimation();\n }\n }, [status, isStatusTransition, enableStatusChangeAnimation]);\n\n // Effect - updating previous status ref value (for animation) after component update.\n useEffect(() => {\n prevStatusRef.current = status;\n }, [status]);\n\n const ariaLabel = useMemo(() => {\n return `Step ${stepNumber}: ${titleText} - ${subtitleText}, status: ${status}`;\n }, [status, titleText, stepNumber, subtitleText]);\n\n const getClassNamesWithSuffix = (suffix: string) => {\n return [\n getStyle(styles, camelCase(suffix \|\| \"indicator\")),\n getStyle(styles, camelCase(`type-${type}${suffix}`)),\n getStyle(styles, camelCase(`status-${status}${suffix}`)),\n getStyle(styles, camelCase(`size-${size}${suffix}`))\n ];\n };\n\n return (\n <Clickable\n tabIndex=\"-1\"\n elementType=\"li\"\n className={cx(...getClassNamesWithSuffix(\"\"), stepComponentClassName, {\n [styles.withAnimation]: statusChangeAnimationState,\n [styles.clickable]: onClick,\n [styles.textPlacementVertical]: isVertical\n })}\n aria-label={ariaLabel}\n onClick={handleClick}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.STEP_INDICATOR, id)}\n >\n <div className={cx(...getClassNamesWithSuffix(\"__number-divider-container\"))}>\n <div\n className={cx(...getClassNamesWithSuffix(\"__number-container\"))}\n ref={componentRef}\n tabIndex={0}\n role=\"button\"\n >\n <SwitchTransition mode=\"out-in\">\n <CSSTransition<undefined>\n // CSSTransition needs to be specified with the generic parameter to decide type for addEndListener's callback\n // otherwise, addEndListener cb has only `done` param (ts error)\n classNames={{\n enter: styles.swapEnter,\n enterActive: styles.swapEnterActive,\n exit: styles.swapExit,\n exitActive: styles.swapExitActive\n }}\n addEndListener={(node: HTMLElement, done: () => void) => {\n node.addEventListener(\"transitionend\", done, false);\n }}\n key={status}\n >\n <span className={cx(...getClassNamesWithSuffix(\"__number-container__text\"))}>\n <StepCircleDisplay\n fulfilledStepIcon={fulfilledStepIcon}\n fulfilledStepIconType={fulfilledStepIconType}\n isFulfilledStepDisplayNumber={isFulfilledStepDisplayNumber}\n stepNumber={stepNumber}\n status={status}\n />\n </span>\n </CSSTransition>\n </SwitchTransition>\n </div>\n {isFollowedByDivider && isVertical && <Divider className={cx(styles.divider, stepDividerClassName)} />}\n </div>\n <div className={cx(...getClassNamesWithSuffix(\"__text-container\"))}>\n <div className={cx(...getClassNamesWithSuffix(\"__text-container__title\"))}>\n <HiddenText text={status} /> {/ for accessibility */}\n <span className={cx(...getClassNamesWithSuffix(\"__text-container__title__text\"))}>{titleText}</span>\n </div>\n {size !== \"compact\" ? (\n <span className={cx(...getClassNamesWithSuffix(\"__text-container__subtitle__text\"))}>{subtitleText}</span>\n ) : null}\n </div>\n </Clickable>\n );\n};\n\nexport default StepIndicator;\n"],"names":["KEYS","keyCodes","ENTER","SPACE","StepCircleDisplay","_ref","fulfilledStepIcon","fulfilledStepIconType","status","isFulfilledStepDisplayNumber","React","createElement","Fragment","stepNumber","Icon","icon","className","classNames","styles","numberContainerTextCheckIcon","type","ignoreFocusStyle","ariaHidden","StepIndicator","_ref2","stepComponentClassName","_ref2$stepNumber","_ref2$status","_ref2$titleText","titleText","_ref2$subtitleText","subtitleText","_ref2$type","_ref2$fulfilledStepIc","Check","_ref2$fulfilledStepIc2","_ref2$isFulfilledStep","_ref2$onClick","onClick","NOOP","_ref2$isFollowedByDiv","isFollowedByDivider","stepDividerClassName","_ref2$isVertical","isVertical","id","_ref2$size","size","dataTestId","_useState","useState","_useState2","_slicedToArray","statusChangeAnimationState","setStatusChangeAnimationState","componentRef","useRef","prevStatusRef","enableStatusChangeAnimation","useCallback","disableStatusChangeAnimation","isStatusTransition","current","handleClick","useEventListener","eventName","callback","ref","useKeyEvent","keys","useEffect","ariaLabel","useMemo","concat","getClassNamesWithSuffix","suffix","getStyle","camelCase","Clickable","tabIndex","elementType","cx","apply","_toConsumableArray","_defineProperty","withAnimation","clickable","textPlacementVertical","getTestId","ComponentDefaultTestId","STEP_INDICATOR","role","SwitchTransition","mode","CSSTransition","enter","swapEnter","enterActive","swapEnterActive","exit","swapExit","exitActive","swapExitActive","addEndListener","node","done","addEventListener","key","Divider","divider","HiddenText","text"],"mappings":"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"}
1	+ {"version":3,"file":"StepIndicator.js","sources":["../../../../../../src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.tsx"],"sourcesContent":["import { camelCase } from \"es-toolkit\";\nimport { getStyle } from \"../../../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport { keyCodes } from \"../../../../constants/keyCodes\";\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { CSSTransition, SwitchTransition } from \"react-transition-group\";\nimport useEventListener from \"../../../../hooks/useEventListener\";\nimport useKeyEvent from \"../../../../hooks/useKeyEvent\";\nimport { Icon } from \"@vibe/icon\";\nimport { Check } from \"@vibe/icons\";\nimport Divider from \"../../../../components/Divider/Divider\";\nimport { NOOP } from \"../../../../utils/function-utils\";\nimport HiddenText from \"../../../../components/HiddenText/HiddenText\";\nimport { Clickable } from \"@vibe/clickable\";\nimport { type MultiStepSize, type MultiStepType, type StepStatus } from \"../../MultiStep.types\";\nimport styles from \"./StepIndicator.module.scss\";\nimport classNames from \"classnames\";\nimport { type VibeComponentProps } from \"../../../../types\";\nimport { type SubIcon } from \"@vibe/icon\";\n\nconst KEYS = [keyCodes.ENTER, keyCodes.SPACE];\n\nexport interface StepCircleDisplayProps {\n /*\n The status of the step.\n /\n status: StepStatus;\n /\n If true, displays the step number instead of the fulfilled step icon.\n /\n isFulfilledStepDisplayNumber: boolean;\n /\n The icon displayed when the step is fulfilled.\n /\n fulfilledStepIcon: SubIcon;\n /\n The type of icon used.\n /\n fulfilledStepIconType: \"svg\" \| \"font\";\n /\n The step number in the sequence.\n /\n stepNumber: number;\n}\n\nconst StepCircleDisplay: React.FC<StepCircleDisplayProps> = ({\n status,\n isFulfilledStepDisplayNumber,\n fulfilledStepIcon,\n fulfilledStepIconType,\n stepNumber\n}) => {\n return status === \"fulfilled\" && !isFulfilledStepDisplayNumber ? (\n <Icon\n icon={fulfilledStepIcon}\n className={classNames(styles.numberContainerTextCheckIcon)}\n iconType={fulfilledStepIconType}\n ignoreFocusStyle\n ariaHidden={true}\n />\n ) : (\n <>{stepNumber}</>\n );\n};\n\nexport interface StepIndicatorProps extends VibeComponentProps {\n /\n The status of the step.\n /\n status: StepStatus;\n /\n The main title text for the step.\n /\n titleText: string;\n /\n The subtitle text for the step.\n /\n subtitleText?: string;\n /\n The number of the step in the sequence.\n /\n stepNumber?: number;\n /\n Class name applied to the step component.\n /\n stepComponentClassName?: string;\n /\n The visual style of the step indicator.\n /\n type?: MultiStepType;\n /\n The icon used for a fulfilled step.\n /\n fulfilledStepIcon?: SubIcon;\n /\n The type of icon used.\n /\n fulfilledStepIconType?: \"svg\" \| \"font\";\n /\n If true, displays the step number instead of the fulfilled step icon.\n /\n isFulfilledStepDisplayNumber?: boolean;\n /\n Callback fired when the step is clicked.\n /\n onClick?: (stepNumber: number) => void;\n /\n If true, adds a divider after the step.\n /\n isFollowedByDivider?: boolean;\n /\n Class name applied to the step divider.\n /\n stepDividerClassName?: string;\n /\n If true, the step indicator is displayed vertically.\n /\n isVertical?: boolean;\n /\n The size of the step indicator.\n /\n size?: MultiStepSize;\n}\n\nconst StepIndicator: React.FC<StepIndicatorProps> = ({\n stepComponentClassName,\n stepNumber = 1,\n status = \"pending\",\n titleText = \"Heading text\",\n subtitleText = \"Subtitle text\",\n type = \"primary\",\n fulfilledStepIcon = Check,\n fulfilledStepIconType = \"svg\",\n isFulfilledStepDisplayNumber = false,\n onClick = NOOP,\n isFollowedByDivider = false,\n stepDividerClassName,\n isVertical = false,\n id,\n size = \"regular\",\n \"data-testid\": dataTestId\n}: StepIndicatorProps) => {\n // Animations state\n const [statusChangeAnimationState, setStatusChangeAnimationState] = useState(false);\n\n // Refs\n const componentRef = useRef(null);\n const prevStatusRef = useRef(status);\n\n // Callbacks for modifying animation state\n const enableStatusChangeAnimation = useCallback(() => {\n setStatusChangeAnimationState(true);\n }, [setStatusChangeAnimationState]);\n\n const disableStatusChangeAnimation = useCallback(() => {\n setStatusChangeAnimationState(false);\n }, [setStatusChangeAnimationState]);\n\n const isStatusTransition = useCallback(() => prevStatusRef.current !== status, [prevStatusRef, status]);\n\n const handleClick = useCallback(() => {\n if (onClick) onClick(stepNumber);\n }, [onClick, stepNumber]);\n\n // Event listeners for removing animation.\n useEventListener({\n eventName: \"animationend\",\n callback: disableStatusChangeAnimation,\n ref: componentRef\n });\n\n useKeyEvent({\n keys: KEYS,\n callback: handleClick,\n ref: componentRef\n });\n\n // Effect - triggering animation when necessary.\n useEffect(() => {\n if (isStatusTransition()) {\n enableStatusChangeAnimation();\n }\n }, [status, isStatusTransition, enableStatusChangeAnimation]);\n\n // Effect - updating previous status ref value (for animation) after component update.\n useEffect(() => {\n prevStatusRef.current = status;\n }, [status]);\n\n const ariaLabel = useMemo(() => {\n return `Step ${stepNumber}: ${titleText} - ${subtitleText}, status: ${status}`;\n }, [status, titleText, stepNumber, subtitleText]);\n\n const getClassNamesWithSuffix = (suffix: string) => {\n return [\n getStyle(styles, camelCase(suffix \|\| \"indicator\")),\n getStyle(styles, camelCase(`type-${type}${suffix}`)),\n getStyle(styles, camelCase(`status-${status}${suffix}`)),\n getStyle(styles, camelCase(`size-${size}${suffix}`))\n ];\n };\n\n return (\n <Clickable\n tabIndex=\"-1\"\n elementType=\"li\"\n className={cx(...getClassNamesWithSuffix(\"\"), stepComponentClassName, {\n [styles.withAnimation]: statusChangeAnimationState,\n [styles.clickable]: onClick,\n [styles.textPlacementVertical]: isVertical\n })}\n aria-label={ariaLabel}\n onClick={handleClick}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.STEP_INDICATOR, id)}\n >\n <div className={cx(...getClassNamesWithSuffix(\"__number-divider-container\"))}>\n <div\n className={cx(...getClassNamesWithSuffix(\"__number-container\"))}\n ref={componentRef}\n tabIndex={0}\n role=\"button\"\n >\n <SwitchTransition mode=\"out-in\">\n <CSSTransition<undefined>\n // CSSTransition needs to be specified with the generic parameter to decide type for addEndListener's callback\n // otherwise, addEndListener cb has only `done` param (ts error)\n classNames={{\n enter: styles.swapEnter,\n enterActive: styles.swapEnterActive,\n exit: styles.swapExit,\n exitActive: styles.swapExitActive\n }}\n addEndListener={(node: HTMLElement, done: () => void) => {\n node.addEventListener(\"transitionend\", done, false);\n }}\n key={status}\n >\n <span className={cx(...getClassNamesWithSuffix(\"__number-container__text\"))}>\n <StepCircleDisplay\n fulfilledStepIcon={fulfilledStepIcon}\n fulfilledStepIconType={fulfilledStepIconType}\n isFulfilledStepDisplayNumber={isFulfilledStepDisplayNumber}\n stepNumber={stepNumber}\n status={status}\n />\n </span>\n </CSSTransition>\n </SwitchTransition>\n </div>\n {isFollowedByDivider && isVertical && <Divider className={cx(styles.divider, stepDividerClassName)} />}\n </div>\n <div className={cx(...getClassNamesWithSuffix(\"__text-container\"))}>\n <div className={cx(...getClassNamesWithSuffix(\"__text-container__title\"))}>\n <HiddenText text={status} /> {/ for accessibility */}\n <span className={cx(...getClassNamesWithSuffix(\"__text-container__title__text\"))}>{titleText}</span>\n </div>\n {size !== \"compact\" ? (\n <span className={cx(...getClassNamesWithSuffix(\"__text-container__subtitle__text\"))}>{subtitleText}</span>\n ) : null}\n </div>\n </Clickable>\n );\n};\n\nexport default StepIndicator;\n"],"names":["KEYS","keyCodes","ENTER","SPACE","StepCircleDisplay","_ref","fulfilledStepIcon","fulfilledStepIconType","status","isFulfilledStepDisplayNumber","React","createElement","Fragment","stepNumber","Icon","icon","className","classNames","styles","numberContainerTextCheckIcon","iconType","ignoreFocusStyle","ariaHidden","StepIndicator","_ref2","stepComponentClassName","_ref2$stepNumber","_ref2$status","_ref2$titleText","titleText","_ref2$subtitleText","subtitleText","_ref2$type","type","_ref2$fulfilledStepIc","Check","_ref2$fulfilledStepIc2","_ref2$isFulfilledStep","_ref2$onClick","onClick","NOOP","_ref2$isFollowedByDiv","isFollowedByDivider","stepDividerClassName","_ref2$isVertical","isVertical","id","_ref2$size","size","dataTestId","_useState","useState","_useState2","_slicedToArray","statusChangeAnimationState","setStatusChangeAnimationState","componentRef","useRef","prevStatusRef","enableStatusChangeAnimation","useCallback","disableStatusChangeAnimation","isStatusTransition","current","handleClick","useEventListener","eventName","callback","ref","useKeyEvent","keys","useEffect","ariaLabel","useMemo","concat","getClassNamesWithSuffix","suffix","getStyle","camelCase","Clickable","tabIndex","elementType","cx","apply","_toConsumableArray","_defineProperty","withAnimation","clickable","textPlacementVertical","getTestId","ComponentDefaultTestId","STEP_INDICATOR","role","SwitchTransition","mode","CSSTransition","enter","swapEnter","enterActive","swapEnterActive","exit","swapExit","exitActive","swapExitActive","addEndListener","node","done","addEventListener","key","Divider","divider","HiddenText","text"],"mappings":"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"}

package/dist/src/components/MultiStepIndicator/components/StepIndicator/StepIndicator.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={indicator:"indicator_4c2c5a5966",textContainer:"textContainer_5c0ca54753",sizeCompactTextContainer:"sizeCompactTextContainer_3a7312880f",textContainerTitle:"textContainerTitle_6f4fe49e1b",visuallyHidden:"visuallyHidden_09e25e6d23",textContainerTitleText:"textContainerTitleText_e46b2aa18b",textContainerSubtitleText:"textContainerSubtitleText_c4a2d712a7",sizeCompactTextContainerTitle:"sizeCompactTextContainerTitle_7aecee57d8",textPlacementVertical:"textPlacementVertical_3bc69c007c",numberDividerContainer:"numberDividerContainer_4942aeab0c",sizeCompactTextContainerTitleText:"sizeCompactTextContainerTitleText_c72948a155",divider:"divider_52cf0f1e54",sizeCompactNumberDividerContainer:"sizeCompactNumberDividerContainer_61544be304",statusActiveNumberDividerContainer:"statusActiveNumberDividerContainer_eff956b74e",clickable:"clickable_4fafe720c9",withAnimation:"withAnimation_1ea4c31ba0",stepIndicatiorCirclePopElastic:"stepIndicatiorCirclePopElastic_453286b111",swapEnter:"swapEnter_820c081ece",swapEnterActive:"swapEnterActive_61aa34a6ec",swapExit:"swapExit_e6827b0ca2",swapExitActive:"swapExitActive_6a58ce3f7b",numberContainer:"numberContainer_4063aff9ff",numberContainerText:"numberContainerText_105f36e703",numberContainerTextCheckIcon:"numberContainerTextCheckIcon_3d2a716306",typePrimaryNumberContainer:"typePrimaryNumberContainer_20be3c4026",typeDangerNumberContainer:"typeDangerNumberContainer_0cd2437284",typeSuccessNumberContainer:"typeSuccessNumberContainer_a75bb7d7d2",typeDarkNumberContainer:"typeDarkNumberContainer_bdd1532f9c",statusActiveNumberContainer:"statusActiveNumberContainer_ef757be200",sizeCompactNumberContainer:"sizeCompactNumberContainer_059f3145b3",statusPendingNumberContainer:"statusPendingNumberContainer_282fe55044","step-indicatior-circle-pop-elastic":"step-indicatior-circle-pop-elastic_51f45519ca"};!function(e){const n="s_id-f9249b867669_3_85_1";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const r=document.createElement("style");r.id=n,t.firstChild?t.insertBefore(r,t.firstChild):t.appendChild(r),r.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable */\n/* stylelint-enable */\n.indicator_4c2c5a5966 {\n  font: var(--font-text2-normal);\n  color: var(--text-color-on-primary);\n  display: flex;\n  margin: 0;\n  padding: 0;\n  text-indent: 0;\n  list-style-type: none;\n}\n.textContainer_5c0ca54753 {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  margin-left: 16px;\n}\n.sizeCompactTextContainer_3a7312880f {\n  margin-left: var(--spacing-small);\n  justify-content: center;\n  align-content: center;\n}\n.textContainerTitle_6f4fe49e1b {\n  width: 100%;\n  margin-bottom: var(--spacing-xs);\n}\n.textContainerTitle_6f4fe49e1b .visuallyHidden_09e25e6d23 {\n  display: none;\n}\n.textContainerTitleText_e46b2aa18b {\n  font: var(--font-text2-medium);\n  color: var(--primary-text-color);\n  margin-bottom: 2px;\n}\n.textContainerSubtitleText_c4a2d712a7 {\n  width: 100%;\n  font: var(--font-text2-normal);\n  color: var(--primary-text-color);\n}\n.sizeCompactTextContainerTitle_7aecee57d8 {\n  margin-bottom: 0px;\n}\n.textPlacementVertical_3bc69c007c {\n  margin: 8px;\n  flex-direction: column;\n  flex: 1 1 0px;\n}\n.textPlacementVertical_3bc69c007c .textContainer_5c0ca54753 {\n  margin-left: 0;\n  margin-top: var(--spacing-medium);\n}\n.textPlacementVertical_3bc69c007c .numberDividerContainer_4942aeab0c {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  width: 100%;\n}\n.sizeCompactTextContainerTitleText_c72948a155 {\n  display: block;\n  font: var(--font-text2-normal);\n  max-width: 150px;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  margin-bottom: 0;\n}\n.textPlacementVertical_3bc69c007c .numberDividerContainer_4942aeab0c .divider_52cf0f1e54 {\n  background-color: var(--ui-border-color);\n  margin: 16px 0 16px 16px;\n  height: 1px;\n  flex: 1 1 0;\n}\n.sizeCompactNumberDividerContainer_61544be304 {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.sizeCompactNumberDividerContainer_61544be304.statusActiveNumberDividerContainer_eff956b74e {\n  width: 40px;\n}\n.indicator_4c2c5a5966.clickable_4fafe720c9 {\n  cursor: pointer;\n}\n.withAnimation_1ea4c31ba0 {\n  animation: stepIndicatiorCirclePopElastic_453286b111 var(--motion-expressive-short);\n}\n/* New state enters */\n.swapEnter_820c081ece {\n  opacity: 0;\n  transform: translateY(15px);\n}\n.swapEnterActive_61aa34a6ec {\n  position: relative;\n  opacity: 1;\n  transition: transform var(--motion-productive-long) var(--motion-timing-enter), opacity var(--motion-productive-short);\n  transform: translateY(0);\n}\n/* Old state leaves */\n.swapExit_e6827b0ca2 {\n  position: relative;\n  opacity: 1;\n  transform: translateY(0);\n}\n.swapExitActive_6a58ce3f7b {\n  position: relative;\n  opacity: 0;\n  transform: translateY(-15px);\n  transition: transform var(--motion-productive-long) var(--motion-timing-enter), opacity var(--motion-productive-short);\n}\n.numberContainer_4063aff9ff {\n  width: 36px;\n  height: 36px;\n  border-radius: 50%;\n  display: flex;\n}\n.numberContainerText_105f36e703 {\n  margin: auto;\n  display: flex;\n  align-items: center;\n}\n.numberContainerTextCheckIcon_3d2a716306 {\n  width: 20px;\n  height: 20px;\n  margin-top: 2px;\n}\n.typePrimaryNumberContainer_20be3c4026 {\n  background-color: var(--primary-color);\n}\n.typePrimaryNumberContainer_20be3c4026:hover {\n  background-color: var(--primary-hover-color);\n}\n.typeDangerNumberContainer_0cd2437284 {\n  background-color: var(--negative-color);\n}\n.typeDangerNumberContainer_0cd2437284:hover {\n  background-color: var(--negative-color-hover);\n}\n.typeSuccessNumberContainer_a75bb7d7d2 {\n  background-color: var(--positive-color);\n}\n.typeSuccessNumberContainer_a75bb7d7d2:hover {\n  background-color: var(--positive-color-hover);\n}\n.typeDarkNumberContainer_bdd1532f9c {\n  background-color: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n.typeDarkNumberContainer_bdd1532f9c:hover {\n  background-color: var(--secondary-text-color);\n}\n.statusActiveNumberContainer_ef757be200 {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--primary-color);\n}\n.statusActiveNumberContainer_ef757be200.typeDangerNumberContainer_0cd2437284 {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--negative-color);\n}\n.statusActiveNumberContainer_ef757be200.typeSuccessNumberContainer_a75bb7d7d2 {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--positive-color);\n}\n.statusActiveNumberContainer_ef757be200.typeDarkNumberContainer_bdd1532f9c {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--primary-text-color);\n}\n.sizeCompactNumberContainer_059f3145b3 {\n  width: 28px;\n  height: 28px;\n}\n.statusPendingNumberContainer_282fe55044 {\n  background-color: var(--primary-background-color);\n  color: var(--primary-text-color);\n  border-color: var(--ui-border-color) !important;\n  border: 1px solid;\n}\n.statusPendingNumberContainer_282fe55044:hover {\n  background-color: var(--primary-color);\n  color: var(--text-color-on-primary);\n  border: none;\n}\n.statusPendingNumberContainer_282fe55044.typeDangerNumberContainer_0cd2437284:hover {\n  background-color: var(--negative-color);\n}\n.statusPendingNumberContainer_282fe55044.typeSuccessNumberContainer_a75bb7d7d2:hover {\n  background-color: var(--positive-color);\n}\n.statusPendingNumberContainer_282fe55044.typeDarkNumberContainer_bdd1532f9c:hover {\n  background-color: var(--text-color-on-inverted);\n}\n@keyframes step-indicatior-circle-pop-elastic_51f45519ca {\n  0% {\n    transform: scale(1);\n  }\n  33% {\n    transform: scale(1.2);\n  }\n  66% {\n    transform: scale(0.9);\n  }\n  100% {\n    transform: scale(1);\n  }\n}");export{e as default};
+var n={indicator:"indicator_4cb77df5d8",textContainer:"textContainer_ba52a3faee",sizeCompactTextContainer:"sizeCompactTextContainer_caf20280b3",textContainerTitle:"textContainerTitle_0777d0789a",visuallyHidden:"visuallyHidden_bba0cb4dbd",textContainerTitleText:"textContainerTitleText_1281042f88",textContainerSubtitleText:"textContainerSubtitleText_f230009c30",sizeCompactTextContainerTitle:"sizeCompactTextContainerTitle_90acb38ef2",textPlacementVertical:"textPlacementVertical_bb3c06248a",numberDividerContainer:"numberDividerContainer_60577fd61d",sizeCompactTextContainerTitleText:"sizeCompactTextContainerTitleText_963dd11aa4",divider:"divider_7617ea546b",sizeCompactNumberDividerContainer:"sizeCompactNumberDividerContainer_ca1b81ff11",statusActiveNumberDividerContainer:"statusActiveNumberDividerContainer_73c3679535",clickable:"clickable_9dc084e6c7",withAnimation:"withAnimation_f069a9ce31",stepIndicatiorCirclePopElastic:"stepIndicatiorCirclePopElastic_d07e3d1a06",swapEnter:"swapEnter_a6a2ff02a2",swapEnterActive:"swapEnterActive_1457094c45",swapExit:"swapExit_1d4929bc13",swapExitActive:"swapExitActive_6af47210f8",numberContainer:"numberContainer_1978832680",numberContainerText:"numberContainerText_ac25edaf0b",numberContainerTextCheckIcon:"numberContainerTextCheckIcon_03cda5a4cb",typePrimaryNumberContainer:"typePrimaryNumberContainer_1262b68b6b",typeDangerNumberContainer:"typeDangerNumberContainer_be452dc44d",typeSuccessNumberContainer:"typeSuccessNumberContainer_120361a962",typeDarkNumberContainer:"typeDarkNumberContainer_ee813d2d7d",statusActiveNumberContainer:"statusActiveNumberContainer_409e805dd5",sizeCompactNumberContainer:"sizeCompactNumberContainer_4416860a8a",statusPendingNumberContainer:"statusPendingNumberContainer_dc1af9fae9","step-indicatior-circle-pop-elastic":"step-indicatior-circle-pop-elastic_9f1622d6d9"};!function(n){const e="s_id-f9249b867669_3_87_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const r=document.createElement("style");r.id=e,t.firstChild?t.insertBefore(r,t.firstChild):t.appendChild(r),r.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable */\n/* stylelint-enable */\n.indicator_4cb77df5d8 {\n  font: var(--font-text2-normal);\n  color: var(--text-color-on-primary);\n  display: flex;\n  margin: 0;\n  padding: 0;\n  text-indent: 0;\n  list-style-type: none;\n}\n.textContainer_ba52a3faee {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  margin-left: 16px;\n}\n.sizeCompactTextContainer_caf20280b3 {\n  margin-left: var(--spacing-small);\n  justify-content: center;\n  align-content: center;\n}\n.textContainerTitle_0777d0789a {\n  width: 100%;\n  margin-bottom: var(--spacing-xs);\n}\n.textContainerTitle_0777d0789a .visuallyHidden_bba0cb4dbd {\n  display: none;\n}\n.textContainerTitleText_1281042f88 {\n  font: var(--font-text2-medium);\n  color: var(--primary-text-color);\n  margin-bottom: 2px;\n}\n.textContainerSubtitleText_f230009c30 {\n  width: 100%;\n  font: var(--font-text2-normal);\n  color: var(--primary-text-color);\n}\n.sizeCompactTextContainerTitle_90acb38ef2 {\n  margin-bottom: 0px;\n}\n.textPlacementVertical_bb3c06248a {\n  margin: 8px;\n  flex-direction: column;\n  flex: 1 1 0px;\n}\n.textPlacementVertical_bb3c06248a .textContainer_ba52a3faee {\n  margin-left: 0;\n  margin-top: var(--spacing-medium);\n}\n.textPlacementVertical_bb3c06248a .numberDividerContainer_60577fd61d {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  width: 100%;\n}\n.sizeCompactTextContainerTitleText_963dd11aa4 {\n  display: block;\n  font: var(--font-text2-normal);\n  max-width: 150px;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  margin-bottom: 0;\n}\n.textPlacementVertical_bb3c06248a .numberDividerContainer_60577fd61d .divider_7617ea546b {\n  background-color: var(--ui-border-color);\n  margin: 16px 0 16px 16px;\n  height: 1px;\n  flex: 1 1 0;\n}\n.sizeCompactNumberDividerContainer_ca1b81ff11 {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.sizeCompactNumberDividerContainer_ca1b81ff11.statusActiveNumberDividerContainer_73c3679535 {\n  width: 40px;\n}\n.indicator_4cb77df5d8.clickable_9dc084e6c7 {\n  cursor: pointer;\n}\n.withAnimation_f069a9ce31 {\n  animation: stepIndicatiorCirclePopElastic_d07e3d1a06 var(--motion-expressive-short);\n}\n/* New state enters */\n.swapEnter_a6a2ff02a2 {\n  opacity: 0;\n  transform: translateY(15px);\n}\n.swapEnterActive_1457094c45 {\n  position: relative;\n  opacity: 1;\n  transition: transform var(--motion-productive-long) var(--motion-timing-enter), opacity var(--motion-productive-short);\n  transform: translateY(0);\n}\n/* Old state leaves */\n.swapExit_1d4929bc13 {\n  position: relative;\n  opacity: 1;\n  transform: translateY(0);\n}\n.swapExitActive_6af47210f8 {\n  position: relative;\n  opacity: 0;\n  transform: translateY(-15px);\n  transition: transform var(--motion-productive-long) var(--motion-timing-enter), opacity var(--motion-productive-short);\n}\n.numberContainer_1978832680 {\n  width: 36px;\n  height: 36px;\n  border-radius: 50%;\n  display: flex;\n}\n.numberContainerText_ac25edaf0b {\n  margin: auto;\n  display: flex;\n  align-items: center;\n}\n.numberContainerTextCheckIcon_03cda5a4cb {\n  width: 20px;\n  height: 20px;\n  margin-top: 2px;\n}\n.typePrimaryNumberContainer_1262b68b6b {\n  background-color: var(--primary-color);\n}\n.typePrimaryNumberContainer_1262b68b6b:hover {\n  background-color: var(--primary-hover-color);\n}\n.typeDangerNumberContainer_be452dc44d {\n  background-color: var(--negative-color);\n}\n.typeDangerNumberContainer_be452dc44d:hover {\n  background-color: var(--negative-color-hover);\n}\n.typeSuccessNumberContainer_120361a962 {\n  background-color: var(--positive-color);\n}\n.typeSuccessNumberContainer_120361a962:hover {\n  background-color: var(--positive-color-hover);\n}\n.typeDarkNumberContainer_ee813d2d7d {\n  background-color: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n.typeDarkNumberContainer_ee813d2d7d:hover {\n  background-color: var(--secondary-text-color);\n}\n.statusActiveNumberContainer_409e805dd5 {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--primary-color);\n}\n.statusActiveNumberContainer_409e805dd5.typeDangerNumberContainer_be452dc44d {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--negative-color);\n}\n.statusActiveNumberContainer_409e805dd5.typeSuccessNumberContainer_120361a962 {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--positive-color);\n}\n.statusActiveNumberContainer_409e805dd5.typeDarkNumberContainer_ee813d2d7d {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--primary-text-color);\n}\n.sizeCompactNumberContainer_4416860a8a {\n  width: 28px;\n  height: 28px;\n}\n.statusPendingNumberContainer_dc1af9fae9 {\n  background-color: var(--primary-background-color);\n  color: var(--primary-text-color);\n  border-color: var(--ui-border-color) !important;\n  border: 1px solid;\n}\n.statusPendingNumberContainer_dc1af9fae9:hover {\n  background-color: var(--primary-color);\n  color: var(--text-color-on-primary);\n  border: none;\n}\n.statusPendingNumberContainer_dc1af9fae9.typeDangerNumberContainer_be452dc44d:hover {\n  background-color: var(--negative-color);\n}\n.statusPendingNumberContainer_dc1af9fae9.typeSuccessNumberContainer_120361a962:hover {\n  background-color: var(--positive-color);\n}\n.statusPendingNumberContainer_dc1af9fae9.typeDarkNumberContainer_ee813d2d7d:hover {\n  background-color: var(--text-color-on-inverted);\n}\n@keyframes step-indicatior-circle-pop-elastic_9f1622d6d9 {\n  0% {\n    transform: scale(1);\n  }\n  33% {\n    transform: scale(1.2);\n  }\n  66% {\n    transform: scale(0.9);\n  }\n  100% {\n    transform: scale(1);\n  }\n}");export{n as default};
 //# sourceMappingURL=StepIndicator.module.scss.js.map

package/dist/src/components/NumberField/NumberField.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={numberField:"numberField_6ebfe43bcb",label:"label_ae187a7af2",leftIcon:"leftIcon_b5d99e7628"};!function(e){const n="s_id-043e6276934a_3_85_1";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const l=document.createElement("style");l.id=n,t.firstChild?t.insertBefore(l,t.firstChild):t.appendChild(l),l.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".numberField_6ebfe43bcb {\n  width: 100%;\n}\n.numberField_6ebfe43bcb .label_ae187a7af2 {\n  padding-bottom: 0;\n}\n.numberField_6ebfe43bcb .leftIcon_b5d99e7628 {\n  color: var(--icon-color);\n}");export{e as default};
+var e={numberField:"numberField_d745a166ba",label:"label_5c8f99b551",leftIcon:"leftIcon_f55b06aab3"};!function(e){const n="s_id-043e6276934a_3_87_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".numberField_d745a166ba {\n  width: 100%;\n}\n.numberField_d745a166ba .label_5c8f99b551 {\n  padding-bottom: 0;\n}\n.numberField_d745a166ba .leftIcon_f55b06aab3 {\n  color: var(--icon-color);\n}");export{e as default};
 //# sourceMappingURL=NumberField.module.scss.js.map

package/dist/src/components/NumberField/components/NumberFieldSpinButton/NumberFieldSpinButton.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={spinButton:"spinButton_202b85cb2a",large:"large_ed3ed273be",icon:"icon_ea93d9316f",medium:"medium_b3826d8f2a",small:"small_8547e1239f"};!function(e){const n="s_id-eb36452422c9_3_85_1";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const i=document.createElement("style");i.id=n,t.firstChild?t.insertBefore(i,t.firstChild):t.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".spinButton_202b85cb2a.large_ed3ed273be {\n  width: 28px;\n  height: 20px;\n}\n.spinButton_202b85cb2a.large_ed3ed273be .icon_ea93d9316f {\n  width: 16px;\n  height: 16px;\n}\n.spinButton_202b85cb2a.medium_b3826d8f2a {\n  width: 24px;\n  height: 16px;\n}\n.spinButton_202b85cb2a.medium_b3826d8f2a .icon_ea93d9316f {\n  width: 16px;\n  height: 16px;\n}\n.spinButton_202b85cb2a.small_8547e1239f {\n  width: 22px;\n  height: 14px;\n}\n.spinButton_202b85cb2a.small_8547e1239f .icon_ea93d9316f {\n  width: 14px;\n  height: 14px;\n}");export{e as default};
+var e={spinButton:"spinButton_bda2287329",large:"large_bb74c49c12",icon:"icon_10eca346d4",medium:"medium_b6ad3c5f2f",small:"small_e0d93e82a3"};!function(e){const n="s_id-eb36452422c9_3_87_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".spinButton_bda2287329.large_bb74c49c12 {\n  width: 28px;\n  height: 20px;\n}\n.spinButton_bda2287329.large_bb74c49c12 .icon_10eca346d4 {\n  width: 16px;\n  height: 16px;\n}\n.spinButton_bda2287329.medium_b6ad3c5f2f {\n  width: 24px;\n  height: 16px;\n}\n.spinButton_bda2287329.medium_b6ad3c5f2f .icon_10eca346d4 {\n  width: 16px;\n  height: 16px;\n}\n.spinButton_bda2287329.small_e0d93e82a3 {\n  width: 22px;\n  height: 14px;\n}\n.spinButton_bda2287329.small_e0d93e82a3 .icon_10eca346d4 {\n  width: 14px;\n  height: 14px;\n}");export{e as default};
 //# sourceMappingURL=NumberFieldSpinButton.module.scss.js.map

package/dist/src/components/ProgressBars/LinearProgressBar/Bar/Bar.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as r}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import e,{useMemo as a}from"react";import{camelCase as t}from"es-toolkit";import{getStyle as s}from"../../../../helpers/typesciptCssModulesHelper.js";import{getTestId as o,ComponentDefaultTestId as l}from"../../../../tests/testIds.js";import i from"classnames";import{calculatePercentage as m}from"../LinearProgressBarHelpers.js";import n from"./Bar.module.scss.js";var p=function(p){var u=p.value,c=p.type,d=p.barStyle,f=p.animated,b=p.min,v=p.max,j=p.color,y=p.barLabelName,g=p.id,B=p["data-testid"],_=p.className,x=a((function(){return i(n.bar,s(n,t("type__"+c+"--"+d)),_,r({},n.animate,f))}),[c,d,f,_]),H=a((function(){return null==u?0:m(u,b,v)}),[u,b,v]);return u?e.createElement("div",{role:"progressbar","aria-label":y,"aria-valuenow":H,"aria-valuemin":0,"aria-valuemax":100,className:x,style:Object.assign({width:"".concat(H,"%")},j&&{backgroundColor:j}),id:g,"data-testid":B||o(l.BAR,g)}):null};export{p as default};
+import{defineProperty as r}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import a,{useMemo as e}from"react";import{camelCase as t}from"es-toolkit";import{getStyle as o}from"../../../../helpers/typesciptCssModulesHelper.js";import{getTestId as s,ComponentDefaultTestId as i}from"../../../../tests/testIds.js";import l from"classnames";import{calculatePercentage as n}from"../LinearProgressBarHelpers.js";import m from"./Bar.module.scss.js";var u=function(u){var p=u.value,c=u.type,d=u.barStyle,f=u.animated,b=u.min,v=u.max,g=u.color,j=u.barLabelName,x=u.id,y=u["data-testid"],h=u.className,B=u.allowExceedingMax,M=void 0!==B&&B,_=e((function(){return l(m.bar,o(m,t("type__"+c+"--"+d)),h,r({},m.animate,f))}),[c,d,f,h]),w=e((function(){return null==p?0:n(p,b,v,M)}),[p,b,v,M]),H=e((function(){return Math.min(w,100)}),[w]),N=e((function(){return M&&w>100?Math.max(w,100):100}),[M,w]);return p?a.createElement("div",{role:"progressbar","aria-label":j,"aria-valuenow":w,"aria-valuemin":0,"aria-valuemax":N,className:_,style:Object.assign({width:"".concat(H,"%")},g&&{backgroundColor:g}),id:x,"data-testid":y||s(i.BAR,x)}):null};export{u as default};
 //# sourceMappingURL=Bar.js.map