npm - @vibe/core - Versions diffs - 4.2.3 → 4.2.4 - Mend

@vibe/core 4.2.3 → 4.2.4

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 (1134) hide show

package/dist/mocked_classnames/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"../../../../../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_FOOTER,u),primaryButton:f,secondaryButton:l,renderAction:n})}));export{d as default};
 //# sourceMappingURL=ModalFooter.js.map

package/dist/mocked_classnames/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":"~~uUAQA~~,~~IAAMA~~,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,~~EAAAC~~,~~cAACC~~,GACCb,IAAKA,EACLI,UAAWA,EACXC,GAAIA,~~EAAE~~,~~cACOF~~,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_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"}

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

@@ -1,2 +1,2 @@
-var e={primary:"primary",secondary:"secondary"};!function(e){const n="s_id-b4b122708c23_4_2_2";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)}(".primary {\n  order: 2;\n}\n.primary:only-child {\n  margin-inline-start: auto;\n}\n.secondary {\n  order: 1;\n  margin-inline-start: auto;\n}");export{e as default};
+var e={primary:"primary",secondary:"secondary"};!function(e){const n="s_id-b4b122708c23_4_2_3";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)}(".primary {\n  order: 2;\n}\n.primary:only-child {\n  margin-inline-start: auto;\n}\n.secondary {\n  order: 1;\n  margin-inline-start: auto;\n}");export{e as default};
 //# sourceMappingURL=ModalFooter.module.scss.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalFooterBase.js","sources":["../../../../../../../src/components/Modal/footers/ModalFooterBase/ModalFooterBase.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport styles from \"./ModalFooterBase.module.scss\";\nimport { Button } from \"@vibe/button\";\nimport { Flex } from \"@vibe/layout\";\nimport { type ModalFooterBaseProps } from \"./ModalFooterBase.types\";\nimport cx from \"classnames\";\nimport { Tooltip } from \"@vibe/tooltip\";\n\nconst ModalFooterBase = forwardRef(\n (\n { primaryButton, secondaryButton, renderAction, id, className, \"data-testid\": dataTestId }: ModalFooterBaseProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const {\n text: primaryButtonText,\n tooltipProps: primaryButtonTooltipProps = {},\n ...primaryButtonProps\n } = primaryButton;\n const {\n text: secondaryButtonText,\n tooltipProps: secondaryButtonTooltipProps = {},\n ...secondaryButtonProps\n } = secondaryButton \|\| {};\n\n return (\n <Flex\n ref={ref}\n id={id}\n justify=\"space-between\"\n gap=\"small\"\n className={cx(styles.footer, className)}\n data-testid={dataTestId}\n >\n <Tooltip {...primaryButtonTooltipProps} content={primaryButtonTooltipProps.content}>\n <Button {...primaryButtonProps}>{primaryButtonText}</Button>\n </Tooltip>\n {secondaryButton && (\n <Tooltip {...secondaryButtonTooltipProps} content={secondaryButtonTooltipProps.content}>\n <Button {...secondaryButtonProps} kind=\"tertiary\">\n {secondaryButtonText}\n </Button>\n </Tooltip>\n )}\n {renderAction}\n </Flex>\n );\n }\n);\n\nexport default ModalFooterBase;\n"],"names":["ModalFooterBase","forwardRef","_ref","ref","primaryButton","secondaryButton","renderAction","id","className","dataTestId","primaryButtonText","text","_primaryButton$toolti","tooltipProps","primaryButtonTooltipProps","primaryButtonProps","__rest","_a","secondaryButtonText","_a$tooltipProps","secondaryButtonTooltipProps","secondaryButtonProps","React","createElement","Flex","justify","gap","cx","styles","footer","Tooltip","content","Button","Object","assign","kind"],"mappings":"~~gVAQA~~,~~IAAMA~~,EAAkBC,GACtB,SAAAC,EAEEC,GACE,IAFAC,EAAaF,EAAbE,cAAeC,EAAeH,EAAfG,gBAAiBC,EAAYJ,EAAZI,aAAcC,EAAEL,EAAFK,GAAIC,EAASN,EAATM,UAA0BC,EAAUP,EAAzB,eAIvDQ,EAGJN,EAHFO,KAAIC,EAGFR,EAFFS,aAAcC,OAAyB,IAAAF,EAAG,~~CAAA~~,~~EAAEA~~,EACzCG,EAAkBC,EACnBZ,EAJE,CAAA,OAAA,iBAKAa,EAIFZ,GAAmB,~~CAAA~~,~~EAHfa~~,EACwCD,EAD9CN,KAAIQ,EAC0CF,EAA9CJ,aAAcO,OAA2B,IAAAD,EAAG,~~CAAA~~,~~EAAEA~~,EAC3CE,EAAoBL,EAAAC,EAHnB,~~CAAA~~,OAAA,~~iBAMN~~,OACEK,EAAAC,cAACC,EAAI,CACHrB,IAAKA,EACLI,GAAIA,EACJkB,QAAQ,gBACRC,IAAI,QACJlB,UAAWmB,EAAGC,EAAOC,OAAQrB,iBAChBC,GAEba,~~EAAAC~~,~~cAACO~~,mBAAYhB,EAAyB,CAAEiB,QAASjB,EAA0BiB,UACzET,EAAAC,cAACS,~~EAAMC~~,OAAAC,OAAA,CAAA,~~EAAKnB~~,GAAqBL,IAElCL,GACCiB,EAAAC,cAACO,EAAOG,OAAAC,OAAA,CAAA,EAAKd,EAA2B,CAAEW,QAASX,EAA4BW,UAC7ET,~~EAAAC~~,~~cAACS~~,~~EAAMC~~,OAAAC,OAAA,CAAA,~~EAAKb~~,~~EAAoB~~,~~CAAEc~~,KAAK,aACpCjB,IAINZ,EAGP"}
1	+ {"version":3,"file":"ModalFooterBase.js","sources":["../../../../../../../src/components/Modal/footers/ModalFooterBase/ModalFooterBase.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport styles from \"./ModalFooterBase.module.scss\";\nimport { Button } from \"@vibe/button\";\nimport { Flex } from \"@vibe/layout\";\nimport { type ModalFooterBaseProps } from \"./ModalFooterBase.types\";\nimport cx from \"classnames\";\nimport { Tooltip } from \"@vibe/tooltip\";\n\nconst ModalFooterBase = forwardRef(\n (\n { primaryButton, secondaryButton, renderAction, id, className, \"data-testid\": dataTestId }: ModalFooterBaseProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const {\n text: primaryButtonText,\n tooltipProps: primaryButtonTooltipProps = {},\n ...primaryButtonProps\n } = primaryButton;\n const {\n text: secondaryButtonText,\n tooltipProps: secondaryButtonTooltipProps = {},\n ...secondaryButtonProps\n } = secondaryButton \|\| {};\n\n return (\n <Flex\n ref={ref}\n id={id}\n justify=\"space-between\"\n gap=\"small\"\n className={cx(styles.footer, className)}\n data-testid={dataTestId}\n >\n <Tooltip {...primaryButtonTooltipProps} content={primaryButtonTooltipProps.content}>\n <Button {...primaryButtonProps}>{primaryButtonText}</Button>\n </Tooltip>\n {secondaryButton && (\n <Tooltip {...secondaryButtonTooltipProps} content={secondaryButtonTooltipProps.content}>\n <Button {...secondaryButtonProps} kind=\"tertiary\">\n {secondaryButtonText}\n </Button>\n </Tooltip>\n )}\n {renderAction}\n </Flex>\n );\n }\n);\n\nexport default ModalFooterBase;\n"],"names":["ModalFooterBase","forwardRef","_ref","ref","primaryButton","secondaryButton","renderAction","id","className","dataTestId","primaryButtonText","text","_primaryButton$toolti","tooltipProps","primaryButtonTooltipProps","primaryButtonProps","__rest","_a","secondaryButtonText","_a$tooltipProps","secondaryButtonTooltipProps","secondaryButtonProps","React","createElement","Flex","justify","gap","cx","styles","footer","Tooltip","content","Button","Object","assign","kind"],"mappings":"gVAQMA,IAAAA,EAAkBC,GACtB,SAAAC,EAEEC,GACE,IAFAC,EAAaF,EAAbE,cAAeC,EAAeH,EAAfG,gBAAiBC,EAAYJ,EAAZI,aAAcC,EAAEL,EAAFK,GAAIC,EAASN,EAATM,UAA0BC,EAAUP,EAAzB,eAIvDQ,EAGJN,EAHFO,KAAIC,EAGFR,EAFFS,aAAcC,OAAyB,IAAAF,EAAG,CAAE,EAAAA,EACzCG,EAAkBC,EACnBZ,EAJE,CAAA,OAAA,iBAKAa,EAIFZ,GAAmB,CAAE,EAHjBa,EACwCD,EAD9CN,KAAIQ,EAC0CF,EAA9CJ,aAAcO,OAA2B,IAAAD,EAAG,CAAE,EAAAA,EAC3CE,EAAoBL,EAAAC,EAHnB,CAIL,OAAA,iBAED,OACEK,EAAAC,cAACC,EAAI,CACHrB,IAAKA,EACLI,GAAIA,EACJkB,QAAQ,gBACRC,IAAI,QACJlB,UAAWmB,EAAGC,EAAOC,OAAQrB,iBAChBC,GAEba,EAACC,cAAAO,mBAAYhB,EAAyB,CAAEiB,QAASjB,EAA0BiB,UACzET,EAAAC,cAACS,EAAWC,OAAAC,OAAA,CAAA,EAAAnB,GAAqBL,IAElCL,GACCiB,EAAAC,cAACO,EAAOG,OAAAC,OAAA,CAAA,EAAKd,EAA2B,CAAEW,QAASX,EAA4BW,UAC7ET,EAACC,cAAAS,EAAWC,OAAAC,OAAA,CAAA,EAAAb,EAAsB,CAAAc,KAAK,aACpCjB,IAINZ,EAGP"}

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

@@ -1,2 +1,2 @@
-var e={footer:"footer"};!function(e){const t="s_id-5c7b28cf0c05_4_2_2";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 {\n  position: relative;\n  width: 100%;\n  padding: 20px var(--space-24);\n  flex-shrink: 0;\n  background-color: var(--primary-background-color);\n}");export{e as default};
+var e={footer:"footer"};!function(e){const t="s_id-5c7b28cf0c05_4_2_3";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 {\n  position: relative;\n  width: 100%;\n  padding: 20px var(--space-24);\n  flex-shrink: 0;\n  background-color: var(--primary-background-color);\n}");export{e as default};
 //# sourceMappingURL=ModalFooterBase.module.scss.js.map

package/dist/mocked_classnames/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"../../../../../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_FOOTER,y),primaryButton:B,secondaryButton:j,renderAction:S})}));export{m as default};
 //# sourceMappingURL=ModalFooterWizard.js.map

package/dist/mocked_classnames/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":"~~uZASA~~,~~IAAMA~~,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,~~EAAkB~~,~~CACjBC~~,WAAYf,EACZgB,gBAAiBf,EACjBgB,mBAAoB,SAACC,EAAGC,GAAO,OAAKjB,EAAYiB,EAAQ,EACxDf,UAAWK,EAAOW,WAItB,OACER,~~EAAAC~~,~~cAACQ~~,GACCvB,IAAKA,EACLM,UAAWA,EACXC,GAAIA,~~EAAE~~,~~cACOF~~,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_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"}

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

@@ -1,2 +1,2 @@
-var e={primary:"primary",secondary:"secondary",stepDots:"stepDots"};!function(e){const n="s_id-51737ad1ac1f_4_2_2";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)}(".primary {\n  order: 2;\n}\n\n.secondary {\n  order: 1;\n}\n\n.stepDots {\n  position: absolute;\n  left: 50%;\n  transform: translateX(-50%);\n  margin: 0;\n}");export{e as default};
+var e={primary:"primary",secondary:"secondary",stepDots:"stepDots"};!function(e){const n="s_id-51737ad1ac1f_4_2_3";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)}(".primary {\n  order: 2;\n}\n\n.secondary {\n  order: 1;\n}\n\n.stepDots {\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/mocked_classnames/src/components/Modal/footers/utils/getPropsForButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"getPropsForButton.js","sources":["../../../../../../../src/components/Modal/footers/utils/getPropsForButton.ts"],"sourcesContent":["import { type ModalFooterActionProps } from \"../ModalFooterBase/ModalFooterBase.types\";\nimport cx from \"classnames\";\n\nexport function getPropsForButton(button?: ModalFooterActionProps, buttonClassName?: string) {\n if (!button) return undefined;\n const { tooltipProps, className, ...rest } = button;\n return {\n ...rest,\n className: tooltipProps?.content ? className : cx(className, buttonClassName),\n tooltipProps: tooltipProps?.content\n ? { ...tooltipProps, referenceWrapperClassName: cx(tooltipProps.referenceWrapperClassName, buttonClassName) }\n : undefined\n };\n}\n"],"names":["getPropsForButton","button","buttonClassName","tooltipProps","className","rest","__rest","Object","assign","content","cx","referenceWrapperClassName","undefined"],"mappings":"~~qFAGM~~,~~SAAUA~~,EAAkBC,EAAiCC,GACjE,GAAKD,EAAL,CACA,IAAQE,EAAqCF,EAArCE,aAAcC,EAAuBH,EAAvBG,UAAcC,~~EAAIC~~,~~EAAKL~~,EAAvC,CAAA,eAAA,cACN,OAAAM,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EACKH,GAAI,CACPD,WAAWD,aAAY,EAAZA,EAAcM,SAAUL,EAAYM,EAAGN,EAAWF,GAC7DC,cAAcA,~~aAAY~~,~~EAAZA~~,EAAcM,wCACnBN,GAAY,CAAEQ,0BAA2BD,EAAGP,EAAaQ,0BAA2BT,UACzFU,GAPuB,CAS/B"}
1	+ {"version":3,"file":"getPropsForButton.js","sources":["../../../../../../../src/components/Modal/footers/utils/getPropsForButton.ts"],"sourcesContent":["import { type ModalFooterActionProps } from \"../ModalFooterBase/ModalFooterBase.types\";\nimport cx from \"classnames\";\n\nexport function getPropsForButton(button?: ModalFooterActionProps, buttonClassName?: string) {\n if (!button) return undefined;\n const { tooltipProps, className, ...rest } = button;\n return {\n ...rest,\n className: tooltipProps?.content ? className : cx(className, buttonClassName),\n tooltipProps: tooltipProps?.content\n ? { ...tooltipProps, referenceWrapperClassName: cx(tooltipProps.referenceWrapperClassName, buttonClassName) }\n : undefined\n };\n}\n"],"names":["getPropsForButton","button","buttonClassName","tooltipProps","className","rest","__rest","Object","assign","content","cx","referenceWrapperClassName","undefined"],"mappings":"qFAGgB,SAAAA,EAAkBC,EAAiCC,GACjE,GAAKD,EAAL,CACA,IAAQE,EAAqCF,EAArCE,aAAcC,EAAuBH,EAAvBG,UAAcC,EAASC,EAAAL,EAAvC,CAAA,eAAA,cACN,OAAAM,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EACKH,GAAI,CACPD,WAAWD,aAAY,EAAZA,EAAcM,SAAUL,EAAYM,EAAGN,EAAWF,GAC7DC,cAAcA,aAAA,EAAAA,EAAcM,wCACnBN,GAAY,CAAEQ,0BAA2BD,EAAGP,EAAaQ,0BAA2BT,UACzFU,GAPuB,CAS/B"}

package/dist/mocked_classnames/src/components/Modal/hooks/usePortalTarget/usePortalTarget.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"usePortalTarget.js","sources":["../../../../../../../src/components/Modal/hooks/usePortalTarget/usePortalTarget.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { type PortalTarget } from \"./usePortalTarget.types\";\n\nconst usePortalTarget = (portalTarget?: PortalTarget): Element \| DocumentFragment => {\n const [resolvedTarget, setResolvedTarget] = useState<Element \| DocumentFragment>(document.body);\n\n useEffect(() => {\n const resolveTarget = (): Element \| DocumentFragment => {\n if (!portalTarget) {\n return document.body;\n }\n\n if (typeof portalTarget === \"string\") {\n const target = document.querySelector(portalTarget);\n if (!target) {\n warn(`Target with selector \"${portalTarget}\" not found. Falling back to document.body.`);\n return document.body;\n }\n return target;\n }\n\n if (portalTarget instanceof Element \|\| portalTarget instanceof DocumentFragment) {\n return portalTarget;\n }\n\n if (portalTarget.current instanceof Element) {\n return portalTarget.current;\n }\n\n warn(\"Invalid target provided. Falling back to document.body.\");\n return document.body;\n };\n\n const target = resolveTarget();\n setResolvedTarget(target);\n }, [portalTarget]);\n\n return resolvedTarget;\n};\n\nexport default usePortalTarget;\n\nfunction warn(message: string): void {\n if (process.env.NODE_ENV !== \"production\") {\n console.warn(message);\n }\n}\n"],"names":["usePortalTarget","portalTarget","_useState","useState","document","body","_useState2","_slicedToArray","resolvedTarget","setResolvedTarget","useEffect","target","querySelector","warn","concat","Element","DocumentFragment","current","resolveTarget","message","process","env","NODE_ENV","console"],"mappings":"qIAGA,IAAMA,EAAkB,SAACC,GACvB,IAAAC,EAA4CC,EAAqCC,SAASC,MAAKC,EAAAC,EAAAL,EAAA,GAAxFM,EAAcF,EAAA,GAAEG,EAAiBH,EAAA,GAiCxC,OA/BAI,GAAU,WACR,IA0BMC,EA1BgB,WACpB,IAAKV,EACH,OAAOG,SAASC,KAGlB,GAA4B,iBAAjBJ,EAA2B,CACpC,IAAMU,EAASP,SAASQ,cAAcX,GACtC,OAAKU,IACHE,~~EAAI~~,~~yBAAAC~~,OAA0Bb,kDACvBG,SAASC,KAGpB,CAEA,OAAIJ,aAAwBc,SAAWd,aAAwBe,iBACtDf,EAGLA,EAAagB,mBAAmBF,QAC3Bd,EAAagB,SAGtBJ,EAAK,2DACET,SAASC,~~KAClB~~,~~CAEea,~~GACfT,EAAkBE,EACpB,GAAG,CAACV,IAEGO,CACT,EAIA,SAASK,EAAKM,GACiB,eAAzBC,QAAQC,IAAIC,UACdC,QAAQV,KAAKM,EAEjB"}
1	+ {"version":3,"file":"usePortalTarget.js","sources":["../../../../../../../src/components/Modal/hooks/usePortalTarget/usePortalTarget.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { type PortalTarget } from \"./usePortalTarget.types\";\n\nconst usePortalTarget = (portalTarget?: PortalTarget): Element \| DocumentFragment => {\n const [resolvedTarget, setResolvedTarget] = useState<Element \| DocumentFragment>(document.body);\n\n useEffect(() => {\n const resolveTarget = (): Element \| DocumentFragment => {\n if (!portalTarget) {\n return document.body;\n }\n\n if (typeof portalTarget === \"string\") {\n const target = document.querySelector(portalTarget);\n if (!target) {\n warn(`Target with selector \"${portalTarget}\" not found. Falling back to document.body.`);\n return document.body;\n }\n return target;\n }\n\n if (portalTarget instanceof Element \|\| portalTarget instanceof DocumentFragment) {\n return portalTarget;\n }\n\n if (portalTarget.current instanceof Element) {\n return portalTarget.current;\n }\n\n warn(\"Invalid target provided. Falling back to document.body.\");\n return document.body;\n };\n\n const target = resolveTarget();\n setResolvedTarget(target);\n }, [portalTarget]);\n\n return resolvedTarget;\n};\n\nexport default usePortalTarget;\n\nfunction warn(message: string): void {\n if (process.env.NODE_ENV !== \"production\") {\n console.warn(message);\n }\n}\n"],"names":["usePortalTarget","portalTarget","_useState","useState","document","body","_useState2","_slicedToArray","resolvedTarget","setResolvedTarget","useEffect","target","querySelector","warn","concat","Element","DocumentFragment","current","resolveTarget","message","process","env","NODE_ENV","console"],"mappings":"qIAGA,IAAMA,EAAkB,SAACC,GACvB,IAAAC,EAA4CC,EAAqCC,SAASC,MAAKC,EAAAC,EAAAL,EAAA,GAAxFM,EAAcF,EAAA,GAAEG,EAAiBH,EAAA,GAiCxC,OA/BAI,GAAU,WACR,IA0BMC,EA1BgB,WACpB,IAAKV,EACH,OAAOG,SAASC,KAGlB,GAA4B,iBAAjBJ,EAA2B,CACpC,IAAMU,EAASP,SAASQ,cAAcX,GACtC,OAAKU,IACHE,EAAIC,yBAAAA,OAA0Bb,kDACvBG,SAASC,KAGpB,CAEA,OAAIJ,aAAwBc,SAAWd,aAAwBe,iBACtDf,EAGLA,EAAagB,mBAAmBF,QAC3Bd,EAAagB,SAGtBJ,EAAK,2DACET,SAASC,MAGHa,GACfT,EAAkBE,EACpB,GAAG,CAACV,IAEGO,CACT,EAIA,SAASK,EAAKM,GACiB,eAAzBC,QAAQC,IAAIC,UACdC,QAAQV,KAAKM,EAEjB"}

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

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

package/dist/mocked_classnames/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":"~~+jBAYA~~,~~IAAMA~~,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,~~EAAI~~,~~CACHC~~,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,~~EAAAO~~,~~cAACW~~,GAAQ7B,UAAWuB,EAAGC,EAAOM,QAAOC,EAAA,CAAA,EAAKP,EAAOQ,YAAc1B,IAAsB2B,~~eAAa~~,~~IAClGtB~~,EAAAO,cAACgB,~~EAA4B~~,~~CAACzB~~,SAAUA,EAAUT,UAAWwB,EAAOP,QAASnB,IAAKO,GAC/EY,IAGJV,GAAgBI,~~EAAAO~~,~~cAACiB~~,~~EAAiB~~,~~CAACC~~,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_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":"kkBAYMA,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"}

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

@@ -1,2 +1,2 @@
-var e={layout:"layout",header:"header",divider:"divider",showDivider:"showDivider",content:"content"};!function(e){const n="s_id-324b836d97d8_4_2_2";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 {\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n}\n.layout .header {\n  width: 100%;\n  margin-block: var(--space-32) var(--space-24);\n  padding-inline-end: calc(var(--top-actions-margin-inline) + var(--top-actions-width) + var(--space-16));\n  padding-inline-start: var(--modal-inline-padding);\n}\n.layout .divider {\n  flex-shrink: 0;\n  opacity: 0;\n  transition: opacity var(--motion-productive-medium) ease-out;\n}\n.layout .divider.showDivider {\n  opacity: 1;\n}\n.layout .content {\n  padding-block-end: var(--space-32);\n}");export{e as default};
+var e={layout:"layout",header:"header",divider:"divider",showDivider:"showDivider",content:"content"};!function(e){const n="s_id-324b836d97d8_4_2_3";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 {\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n}\n.layout .header {\n  width: 100%;\n  margin-block: var(--space-32) var(--space-24);\n  padding-inline-end: calc(var(--top-actions-margin-inline) + var(--top-actions-width) + var(--space-16));\n  padding-inline-start: var(--modal-inline-padding);\n}\n.layout .divider {\n  flex-shrink: 0;\n  opacity: 0;\n  transition: opacity var(--motion-productive-medium) ease-out;\n}\n.layout .divider.showDivider {\n  opacity: 1;\n}\n.layout .content {\n  padding-block-end: var(--space-32);\n}");export{e as default};
 //# sourceMappingURL=ModalBasicLayout.module.scss.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalFooterShadow.js","sources":["../../../../../../src/components/Modal/layouts/ModalFooterShadow.tsx"],"sourcesContent":["import React from \"react\";\nimport cx from \"classnames\";\nimport styles from \"./ModalFooterShadow.module.scss\";\nimport { type ModalFooterShadowProps } from \"./ModalFooterShadow.types\";\n\nconst ModalFooterShadow = ({ show }: ModalFooterShadowProps) => {\n return <div className={cx(styles.shadowWrapper, { [styles.show]: show })} />;\n};\n\nexport default ModalFooterShadow;\n"],"names":["ModalFooterShadow","_ref","React","createElement","className","cx","styles","shadowWrapper","_defineProperty","show"],"mappings":"oLAKA,IAAMA,EAAoB,SAAHC,GACrB,OAAOC,EAAAC,cAAA,MAAA,CAAKC,UAAWC,EAAGC,EAAOC,cAAaC,EAAA,~~GAAKF~~,EAAOG,KAD3BR,EAAJQ,QAE7B"}
1	+ {"version":3,"file":"ModalFooterShadow.js","sources":["../../../../../../src/components/Modal/layouts/ModalFooterShadow.tsx"],"sourcesContent":["import React from \"react\";\nimport cx from \"classnames\";\nimport styles from \"./ModalFooterShadow.module.scss\";\nimport { type ModalFooterShadowProps } from \"./ModalFooterShadow.types\";\n\nconst ModalFooterShadow = ({ show }: ModalFooterShadowProps) => {\n return <div className={cx(styles.shadowWrapper, { [styles.show]: show })} />;\n};\n\nexport default ModalFooterShadow;\n"],"names":["ModalFooterShadow","_ref","React","createElement","className","cx","styles","shadowWrapper","_defineProperty","show"],"mappings":"oLAKA,IAAMA,EAAoB,SAAHC,GACrB,OAAOC,EAAAC,cAAA,MAAA,CAAKC,UAAWC,EAAGC,EAAOC,cAAaC,EAAA,CAAA,EAAKF,EAAOG,KAD3BR,EAAJQ,QAE7B"}

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

@@ -1,2 +1,2 @@
-var e={shadowWrapper:"shadowWrapper",show:"show"};!function(e){const t="s_id-c76d397ed7f2_4_2_2";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::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.show::after {\n  opacity: 1;\n}');export{e as default};
+var e={shadowWrapper:"shadowWrapper",show:"show"};!function(e){const t="s_id-c76d397ed7f2_4_2_3";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::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.show::after {\n  opacity: 1;\n}');export{e as default};
 //# sourceMappingURL=ModalFooterShadow.module.scss.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ModalLayoutScrollableContent.js","sources":["../../../../../../src/components/Modal/layouts/ModalLayoutScrollableContent.tsx"],"sourcesContent":["import React, { type ForwardedRef, forwardRef } from \"react\";\nimport cx from \"classnames\";\nimport styles from \"./ModalLayoutScrollableContent.module.scss\";\nimport { type ModalLayoutScrollableContentProps } from \"./ModalLayoutScrollableContent.types\";\n\nconst ModalLayoutScrollableContent = forwardRef(\n ({ onScroll, className, children }: ModalLayoutScrollableContentProps, ref: ForwardedRef<HTMLDivElement>) => {\n return (\n <div ref={ref} className={cx(styles.content, className)} onScroll={onScroll}>\n {children}\n </div>\n );\n }\n);\n\nexport default ModalLayoutScrollableContent;\n"],"names":["ModalLayoutScrollableContent","forwardRef","_ref","ref","onScroll","children","React","createElement","className","cx","styles","content"],"mappings":"~~6HAKA~~,~~IAAMA~~,EAA+BC,GACnC,SAAAC,EAAuEC,GAAqC,IAAzGC,EAAQF,EAARE,SAAqBC,EAAQH,EAARG,SACtB,OACEC,~~EAAAC~~,cAAA,MAAA,~~CAAKJ~~,IAAKA,EAAKK,UAAWC,EAAGC,EAAOC,QAFlBT,EAATM,WAEgDJ,SAAUA,GAChEC,EAGP"}
1	+ {"version":3,"file":"ModalLayoutScrollableContent.js","sources":["../../../../../../src/components/Modal/layouts/ModalLayoutScrollableContent.tsx"],"sourcesContent":["import React, { type ForwardedRef, forwardRef } from \"react\";\nimport cx from \"classnames\";\nimport styles from \"./ModalLayoutScrollableContent.module.scss\";\nimport { type ModalLayoutScrollableContentProps } from \"./ModalLayoutScrollableContent.types\";\n\nconst ModalLayoutScrollableContent = forwardRef(\n ({ onScroll, className, children }: ModalLayoutScrollableContentProps, ref: ForwardedRef<HTMLDivElement>) => {\n return (\n <div ref={ref} className={cx(styles.content, className)} onScroll={onScroll}>\n {children}\n </div>\n );\n }\n);\n\nexport default ModalLayoutScrollableContent;\n"],"names":["ModalLayoutScrollableContent","forwardRef","_ref","ref","onScroll","children","React","createElement","className","cx","styles","content"],"mappings":"6HAKMA,IAAAA,EAA+BC,GACnC,SAAAC,EAAuEC,GAAqC,IAAzGC,EAAQF,EAARE,SAAqBC,EAAQH,EAARG,SACtB,OACEC,EAAKC,cAAA,MAAA,CAAAJ,IAAKA,EAAKK,UAAWC,EAAGC,EAAOC,QAFlBT,EAATM,WAEgDJ,SAAUA,GAChEC,EAGP"}

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

@@ -1,2 +1,2 @@
-var e={content:"content"};!function(e){const n="s_id-09bedfbbc65c_4_2_2";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 {\n  width: 100%;\n  height: 100%;\n  padding-inline: var(--modal-inline-padding);\n  overflow: auto;\n}\n.content::-webkit-scrollbar {\n  width: 4px;\n  height: 6px;\n}\n.content::-webkit-scrollbar-thumb {\n  background-color: var(--ui-border-color);\n  border-radius: 4px;\n}");export{e as default};
+var e={content:"content"};!function(e){const n="s_id-09bedfbbc65c_4_2_3";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 {\n  width: 100%;\n  height: 100%;\n  padding-inline: var(--modal-inline-padding);\n  overflow: auto;\n}\n.content::-webkit-scrollbar {\n  width: 4px;\n  height: 6px;\n}\n.content::-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/mocked_classnames/src/components/Modal/layouts/ModalMediaLayout/ModalMediaLayout.js CHANGED Viewed

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

package/dist/mocked_classnames/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":"~~yXAQA~~,~~IAAMA~~,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,~~EAAAS~~,~~cAACC~~,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,~~EAAAS~~,cAAA,MAAA,~~CAAKb~~,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_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":"4XAQMA,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"}

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

@@ -1,2 +1,2 @@
-var e={layout:"layout",media:"media",header:"header",content:"content"};!function(e){const n="s_id-d089cc4b12c5_4_2_2";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)}(".layout {\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n}\n.layout .media {\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 .header {\n  width: 100%;\n  text-align: center;\n  margin-block: var(--space-32) var(--space-8);\n  padding-inline: var(--modal-inline-padding);\n}\n.layout .content {\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(--space-24);\n  text-align: center;\n  overflow: hidden;\n}");export{e as default};
+var e={layout:"layout",media:"media",header:"header",content:"content"};!function(e){const n="s_id-d089cc4b12c5_4_2_3";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)}(".layout {\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n}\n.layout .media {\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 .header {\n  width: 100%;\n  text-align: center;\n  margin-block: var(--space-32) var(--space-8);\n  padding-inline: var(--modal-inline-padding);\n}\n.layout .content {\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(--space-24);\n  text-align: center;\n  overflow: hidden;\n}");export{e as default};
 //# sourceMappingURL=ModalMediaLayout.module.scss.js.map

package/dist/mocked_classnames/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 o}from"../../../../../testIds.js";import{ComponentDefaultTestId as s}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||o(s.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],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};
 //# sourceMappingURL=ModalSideBySideLayout.js.map

package/dist/mocked_classnames/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":"~~kaASA~~,~~IAAMA~~,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,~~EAAE~~,~~cACOC~~,GAAcgB,EAAUC,EAAuBC,0BAA2BnB,IAEvFG,EAAAS,cAAA,MAAA,CAAKb,UAAWgB,EAAON,QAASA,GAChCN,~~EAAAS~~,~~cAACQ~~,GAA6BrB,UAAWgB,EAAOL,SAAUA,GAC1DP,~~EAAAS~~,cAAA,MAAA,~~CAAKb~~,UAAWgB,EAAOJ,OAAQA,IAEjCR,EAAAS,cAACS,~~EAAiB~~,~~CAACC~~,~~MAAI~~,~~IAG7B~~"}
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"}

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

@@ -1,2 +1,2 @@
-var e={layout:"layout",header:"header",content:"content",media:"media"};!function(e){const n="s_id-510a2449b45a_4_2_2";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)}(".layout {\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 .header {\n  width: 100%;\n  margin-block: var(--space-32) var(--space-24);\n  padding-inline: var(--modal-inline-padding);\n  grid-column: 1/2;\n  grid-row: 1;\n}\n.layout .content {\n  grid-column: 1/2;\n  grid-row: 2;\n  padding-block-end: var(--space-32);\n}\n.layout .media {\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",header:"header",content:"content",media:"media"};!function(e){const n="s_id-510a2449b45a_4_2_3";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)}(".layout {\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 .header {\n  width: 100%;\n  margin-block: var(--space-32) var(--space-24);\n  padding-inline: var(--modal-inline-padding);\n  grid-column: 1/2;\n  grid-row: 1;\n}\n.layout .content {\n  grid-column: 1/2;\n  grid-row: 2;\n  padding-block-end: var(--space-32);\n}\n.layout .media {\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/mocked_classnames/src/components/Modal/layouts/useLayoutScrolledContent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useLayoutScrolledContent.js","sources":["../../../../../../src/components/Modal/layouts/useLayoutScrolledContent.ts"],"sourcesContent":["import { type UIEventHandler, useCallback, useEffect, useRef, useState } from \"react\";\n\nconst useLayoutScrolledContent = () => {\n const [isContentScrolled, setContentScrolled] = useState<boolean>(false);\n const [isScrollable, setScrollable] = useState<boolean>(false);\n const [isScrolledToEnd, setScrolledToEnd] = useState<boolean>(false);\n\n const ref = useRef<HTMLDivElement>(null);\n\n const checkScroll = useCallback(() => {\n const element = ref.current;\n if (element) {\n const { scrollTop, scrollHeight, clientHeight } = element;\n setScrollable(scrollHeight > clientHeight);\n setContentScrolled(scrollTop > 0);\n setScrolledToEnd(scrollTop + clientHeight >= scrollHeight);\n }\n }, []);\n\n const onScroll: UIEventHandler<HTMLDivElement> = useCallback(() => {\n checkScroll();\n }, [checkScroll]);\n\n useEffect(() => {\n if (!window.ResizeObserver) {\n return;\n }\n\n const element = ref.current;\n if (!element) return;\n\n const resizeObserver = new ResizeObserver(() => {\n checkScroll();\n });\n\n resizeObserver.observe(element);\n\n checkScroll();\n\n return () => {\n resizeObserver.disconnect();\n };\n }, [checkScroll]);\n\n return { ref, isContentScrolled, isScrollable, isScrolledToEnd, onScroll };\n};\n\nexport default useLayoutScrolledContent;\n"],"names":["useLayoutScrolledContent","_useState","useState","_useState2","_slicedToArray","isContentScrolled","setContentScrolled","_useState3","_useState4","isScrollable","setScrollable","_useState5","_useState6","isScrolledToEnd","setScrolledToEnd","ref","useRef","checkScroll","useCallback","element","current","scrollTop","scrollHeight","clientHeight","onScroll","useEffect","window","ResizeObserver","resizeObserver","observe","disconnect"],"mappings":"+JAEA,IAAMA,EAA2B,WAC/B,IAAAC,EAAgDC,GAAkB,GAAMC,EAAAC,EAAAH,EAAA,GAAjEI,EAAiBF,EAAA,GAAEG,EAAkBH,EAAA,GAC5CI,EAAsCL,GAAkB,GAAMM,EAAAJ,EAAAG,EAAA,GAAvDE,EAAYD,EAAA,GAAEE,EAAaF,EAAA,GAClCG,EAA4CT,GAAkB,GAAMU,EAAAR,EAAAO,EAAA,GAA7DE,EAAeD,EAAA,GAAEE,EAAgBF,EAAA,GAElCG,EAAMC,EAAuB,MAE7BC,EAAcC,GAAY,WAC9B,IAAMC,EAAUJ,EAAIK,QACpB,GAAID,EAAS,CACX,IAAQE,EAA0CF,EAA1CE,UAAWC,EAA+BH,EAA/BG,aAAcC,EAAiBJ,EAAjBI,aACjCb,EAAcY,EAAeC,GAC7BjB,EAAmBe,EAAY,GAC/BP,EAAiBO,EAAYE,GAAgBD,EAC/C,~~CACF~~,~~GAAG~~,IAEGE,EAA2CN,GAAY,WAC3DD,GACF,GAAG,CAACA,IAuBJ,OArBAQ,GAAU,WACR,GAAKC,OAAOC,eAAZ,CAIA,IAAMR,EAAUJ,EAAIK,QACpB,GAAKD,EAAL,CAEA,IAAMS,EAAiB,IAAID,gBAAe,WACxCV,GACF,IAMA,OAJAW,EAAeC,QAAQV,GAEvBF,IAEO,WACLW,EAAeE,~~YACjB~~,~~CAZc,~~CAHd,CAgBF,GAAG,CAACb,IAEG,CAAEF,IAAAA,EAAKV,kBAAAA,EAAmBI,aAAAA,EAAcI,gBAAAA,EAAiBW,SAAAA,EAClE"}
1	+ {"version":3,"file":"useLayoutScrolledContent.js","sources":["../../../../../../src/components/Modal/layouts/useLayoutScrolledContent.ts"],"sourcesContent":["import { type UIEventHandler, useCallback, useEffect, useRef, useState } from \"react\";\n\nconst useLayoutScrolledContent = () => {\n const [isContentScrolled, setContentScrolled] = useState<boolean>(false);\n const [isScrollable, setScrollable] = useState<boolean>(false);\n const [isScrolledToEnd, setScrolledToEnd] = useState<boolean>(false);\n\n const ref = useRef<HTMLDivElement>(null);\n\n const checkScroll = useCallback(() => {\n const element = ref.current;\n if (element) {\n const { scrollTop, scrollHeight, clientHeight } = element;\n setScrollable(scrollHeight > clientHeight);\n setContentScrolled(scrollTop > 0);\n setScrolledToEnd(scrollTop + clientHeight >= scrollHeight);\n }\n }, []);\n\n const onScroll: UIEventHandler<HTMLDivElement> = useCallback(() => {\n checkScroll();\n }, [checkScroll]);\n\n useEffect(() => {\n if (!window.ResizeObserver) {\n return;\n }\n\n const element = ref.current;\n if (!element) return;\n\n const resizeObserver = new ResizeObserver(() => {\n checkScroll();\n });\n\n resizeObserver.observe(element);\n\n checkScroll();\n\n return () => {\n resizeObserver.disconnect();\n };\n }, [checkScroll]);\n\n return { ref, isContentScrolled, isScrollable, isScrolledToEnd, onScroll };\n};\n\nexport default useLayoutScrolledContent;\n"],"names":["useLayoutScrolledContent","_useState","useState","_useState2","_slicedToArray","isContentScrolled","setContentScrolled","_useState3","_useState4","isScrollable","setScrollable","_useState5","_useState6","isScrolledToEnd","setScrolledToEnd","ref","useRef","checkScroll","useCallback","element","current","scrollTop","scrollHeight","clientHeight","onScroll","useEffect","window","ResizeObserver","resizeObserver","observe","disconnect"],"mappings":"+JAEA,IAAMA,EAA2B,WAC/B,IAAAC,EAAgDC,GAAkB,GAAMC,EAAAC,EAAAH,EAAA,GAAjEI,EAAiBF,EAAA,GAAEG,EAAkBH,EAAA,GAC5CI,EAAsCL,GAAkB,GAAMM,EAAAJ,EAAAG,EAAA,GAAvDE,EAAYD,EAAA,GAAEE,EAAaF,EAAA,GAClCG,EAA4CT,GAAkB,GAAMU,EAAAR,EAAAO,EAAA,GAA7DE,EAAeD,EAAA,GAAEE,EAAgBF,EAAA,GAElCG,EAAMC,EAAuB,MAE7BC,EAAcC,GAAY,WAC9B,IAAMC,EAAUJ,EAAIK,QACpB,GAAID,EAAS,CACX,IAAQE,EAA0CF,EAA1CE,UAAWC,EAA+BH,EAA/BG,aAAcC,EAAiBJ,EAAjBI,aACjCb,EAAcY,EAAeC,GAC7BjB,EAAmBe,EAAY,GAC/BP,EAAiBO,EAAYE,GAAgBD,EAC/C,CACD,GAAE,IAEGE,EAA2CN,GAAY,WAC3DD,GACF,GAAG,CAACA,IAuBJ,OArBAQ,GAAU,WACR,GAAKC,OAAOC,eAAZ,CAIA,IAAMR,EAAUJ,EAAIK,QACpB,GAAKD,EAAL,CAEA,IAAMS,EAAiB,IAAID,gBAAe,WACxCV,GACF,IAMA,OAJAW,EAAeC,QAAQV,GAEvBF,IAEO,WACLW,EAAeE,aAXH,CAHd,CAgBF,GAAG,CAACb,IAEG,CAAEF,IAAAA,EAAKV,kBAAAA,EAAmBI,aAAAA,EAAcI,gBAAAA,EAAiBW,SAAAA,EAClE"}

package/dist/mocked_classnames/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 r}from"react";import{Check as s}from"@vibe/icons";import a from"../Divider/Divider.js";import{NOOP as n}from"@vibe/shared";import p from"./components/StepIndicator/StepIndicator.js";import{getTestId as m}from"../../../testIds.js";import{ComponentDefaultTestId as c}from"../../tests/constants.js";import d from"./MultiStepIndicator.module.scss.js";var f=l((function(l,f){var u=l.className,v=l.steps,y=void 0===v?[]:v,N=l.type,C=void 0===N?"primary":N,I=l.stepComponentClassName,S=l.dividerComponentClassName,b=l.fulfilledStepIcon,g=void 0===b?s:b,j=l.fulfilledStepIconType,D=void 0===j?"svg":j,T=l.isFulfilledStepDisplayNumber,h=void 0!==T&&T,E=l.onClick,_=void 0===E?n:E,k=l.textPlacement,F=void 0===k?"horizontal":k,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(p,Object.assign({},l,{stepNumber:o+1,type:C,stepComponentClassName:I,fulfilledStepIcon:g,fulfilledStepIconType:D,onClick:_,isFulfilledStepDisplayNumber:h,size:z})),o!==y.length-1&&i.createElement(a,{className:t(d.divider,S,e({},d.compact,"compact"===z))}))}),[_,h,C,I,g,D,S,y.length,z]),w=o((function(e,l){return i.createElement(p,Object.assign({},e,{key:"".concat(e.titleText,"_").concat(l),stepNumber:l+1,type:C,stepComponentClassName:I,fulfilledStepIcon:g,fulfilledStepIconType:D,onClick:_,isFollowedByDivider:l!==y.length-1,stepDividerClassName:t(d.divider,S),isVertical:!0,isFulfilledStepDisplayNumber:h}))}),[_,h,C,I,g,D,S,y.length]),B=r((function(){return"vertical"===F?w:O}),[F,w,O]);return i.createElement("ol",{ref:f,id:x,"data-testid":P||m(c.MULTI_STEP_INDICATOR,x),className:t(d.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 l,useCallback as o,useMemo as r}from"react";import{Check as s}from"@vibe/icons";import a from"../Divider/Divider.js";import{NOOP as n}from"@vibe/shared";import p from"./components/StepIndicator/StepIndicator.js";import{getTestId as m}from"../../tests/testIds.js";import{ComponentDefaultTestId as c}from"../../tests/constants.js";import d from"./MultiStepIndicator.module.scss.js";var f=l((function(l,f){var u=l.className,v=l.steps,y=void 0===v?[]:v,N=l.type,C=void 0===N?"primary":N,I=l.stepComponentClassName,S=l.dividerComponentClassName,b=l.fulfilledStepIcon,g=void 0===b?s:b,j=l.fulfilledStepIconType,D=void 0===j?"svg":j,T=l.isFulfilledStepDisplayNumber,h=void 0!==T&&T,E=l.onClick,_=void 0===E?n:E,k=l.textPlacement,F=void 0===k?"horizontal":k,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(p,Object.assign({},l,{stepNumber:o+1,type:C,stepComponentClassName:I,fulfilledStepIcon:g,fulfilledStepIconType:D,onClick:_,isFulfilledStepDisplayNumber:h,size:z})),o!==y.length-1&&i.createElement(a,{className:t(d.divider,S,e({},d.compact,"compact"===z))}))}),[_,h,C,I,g,D,S,y.length,z]),w=o((function(e,l){return i.createElement(p,Object.assign({},e,{key:"".concat(e.titleText,"_").concat(l),stepNumber:l+1,type:C,stepComponentClassName:I,fulfilledStepIcon:g,fulfilledStepIconType:D,onClick:_,isFollowedByDivider:l!==y.length-1,stepDividerClassName:t(d.divider,S),isVertical:!0,isFulfilledStepDisplayNumber:h}))}),[_,h,C,I,g,D,S,y.length]),B=r((function(){return"vertical"===F?w:O}),[F,w,O]);return i.createElement("ol",{ref:f,id:x,"data-testid":P||m(c.MULTI_STEP_INDICATOR,x),className:t(d.wrapper,u)},y.map(B))}));export{f as default};
 //# sourceMappingURL=MultiStepIndicator.js.map

package/dist/mocked_classnames/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 \"@vibe/shared\";\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":"~~2fAwDA~~,~~IAAMA~~,EAAqBC,GACzB,SAAAC,EAgBEC,GACE,IAfAC,EAASF,EAATE,UAASC,EAAAH,EACTI,MAAAA,~~OAAK~~,~~IAAAD~~,EAAG,GAAEA,EAAAE,EAAAL,EACVM,KAAAA,~~OAAI~~,~~IAAAD~~,EAAG,UAASA,EAChBE,EAAsBP,EAAtBO,uBACAC,EAAyBR,EAAzBQ,0BAAyBC,EAAAT,EACzBU,kBAAAA,~~OAAiB~~,~~IAAAD~~,EAAGE,EAAKF,EAAAG,EAAAZ,EACzBa,sBAAAA,~~OAAqB~~,~~IAAAD~~,EAAG,MAAKA,EAAAE,EAAAd,EAC7Be,6BAAAA,~~OAA4B~~,~~IAAAD~~,GAAQA,EAAAE,EAAAhB,EACpCiB,QAAAA,~~OAAO~~,~~IAAAD~~,EAAGE,EAAIF,EAAAG,EAAAnB,EACdoB,cAAAA,~~OAAa~~,~~IAAAD~~,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,~~SAAQ~~,~~CAACC~~,IAAG,GAAAC,OAAKN,EAAKO,UAAS,KAAAD,OAAIL,IACxCC,EAAAC,cAACK,~~EAAaC~~,OAAAC,OAAA,CAAA,~~EACRV~~,~~EAAI~~,~~CACRW~~,WAAYV,EAAQ,EACpBtB,KAAMA,EACNC,uBAAwBA,EACxBG,kBAAmBA,EACnBG,sBAAuBA,EACvBI,QAASA,EACTF,6BAA8BA,EAC9BS,KAAMD,KAEPK,IAAUxB,EAAMmC,OAAS,GACxBV,~~EAAAC~~,~~cAACU~~,GACCtC,UAAWuC,EAAGC,EAAOC,QAASnC,EAAyBoC,EAAA,CAAA,EACpDF,EAAOG,QAAwB,YAAdtB,~~MAM9B~~,~~GACA~~,CACEN,EACAF,EACAT,EACAC,EACAG,EACAG,EACAL,EACAJ,EAAMmC,OACNhB,IAIEuB,EAA8BpB,GAClC,SAACC,EAAYC,GACX,OACEC,EAAAC,cAACK,EAAaC,OAAAC,OAAA,CAAA,EACRV,~~EAAI~~,~~CACRK~~,IAAG,GAAAC,OAAKN,EAAKO,~~UAAS~~,~~KAAAD~~,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,~~IAGpC~~,~~GACA~~,CACEE,EACAF,EACAT,EACAC,EACAG,EACAG,EACAL,EACAJ,EAAMmC,SAIJW,EAAeC,GACnB,WAAA,MAAyB,aAAlB/B,EAA+B0B,EAA8BrB,~~CAA6B~~,~~GACjG~~,CAACL,EAAe0B,EAA6BrB,IAG/C,OACEI,~~EAAAC~~,cAAA,KAAA,~~CACE7B~~,IAAKA,EACLoB,GAAIA,~~EAAE~~,~~cACOC~~,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 \"@vibe/shared\";\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":"8fAwDMA,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"}

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

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

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

package/dist/mocked_classnames/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, NOOP } from \"@vibe/shared\";\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\";\n\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 aria-hidden={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 nodeRef = useRef<HTMLSpanElement>(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\n key={status}\n nodeRef={nodeRef}\n classNames={{\n enter: styles.swapEnter,\n enterActive: styles.swapEnterActive,\n exit: styles.swapExit,\n exitActive: styles.swapExitActive\n }}\n addEndListener={done => {\n nodeRef.current?.addEventListener(\"transitionend\", done, false);\n }}\n >\n <span ref={nodeRef} 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","stepNumber","createElement","Icon","icon","className","classNames","styles","numberContainerTextCheckIcon","type","ignoreFocusStyle","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","nodeRef","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","key","enter","swapEnter","enterActive","swapEnterActive","exit","swapExit","exitActive","swapExitActive","addEndListener","done","_a","addEventListener","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, NOOP } from \"@vibe/shared\";\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\";\n\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 aria-hidden={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 nodeRef = useRef<HTMLSpanElement>(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\n key={status}\n nodeRef={nodeRef}\n classNames={{\n enter: styles.swapEnter,\n enterActive: styles.swapEnterActive,\n exit: styles.swapExit,\n exitActive: styles.swapExitActive\n }}\n addEndListener={done => {\n nodeRef.current?.addEventListener(\"transitionend\", done, false);\n }}\n >\n <span ref={nodeRef} 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","stepNumber","createElement","Icon","icon","className","classNames","styles","numberContainerTextCheckIcon","type","ignoreFocusStyle","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","nodeRef","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","key","enter","swapEnter","enterActive","swapEnterActive","exit","swapExit","exitActive","swapExitActive","addEndListener","done","_a","addEventListener","Divider","divider","HiddenText","text"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-var n={indicator:"indicator",textContainer:"textContainer",sizeCompactTextContainer:"sizeCompactTextContainer",textContainerTitle:"textContainerTitle",visuallyHidden:"visuallyHidden",textContainerTitleText:"textContainerTitleText",textContainerSubtitleText:"textContainerSubtitleText",sizeCompactTextContainerTitle:"sizeCompactTextContainerTitle",textPlacementVertical:"textPlacementVertical",numberDividerContainer:"numberDividerContainer",sizeCompactTextContainerTitleText:"sizeCompactTextContainerTitleText",divider:"divider",sizeCompactNumberDividerContainer:"sizeCompactNumberDividerContainer",statusActiveNumberDividerContainer:"statusActiveNumberDividerContainer",clickable:"clickable",withAnimation:"withAnimation",stepIndicatiorCirclePopElastic:"stepIndicatiorCirclePopElastic",swapEnter:"swapEnter",swapEnterActive:"swapEnterActive",swapExit:"swapExit",swapExitActive:"swapExitActive",numberContainer:"numberContainer",numberContainerText:"numberContainerText",numberContainerTextCheckIcon:"numberContainerTextCheckIcon",typePrimaryNumberContainer:"typePrimaryNumberContainer",typeDangerNumberContainer:"typeDangerNumberContainer",typeSuccessNumberContainer:"typeSuccessNumberContainer",typeDarkNumberContainer:"typeDarkNumberContainer",statusActiveNumberContainer:"statusActiveNumberContainer",sizeCompactNumberContainer:"sizeCompactNumberContainer",statusPendingNumberContainer:"statusPendingNumberContainer","step-indicatior-circle-pop-elastic":"step-indicatior-circle-pop-elastic"};!function(n){const e="s_id-baef60137dae_4_2_2";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 {\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 {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  margin-inline-start: 16px;\n}\n.sizeCompactTextContainer {\n  margin-inline-start: var(--space-8);\n  justify-content: center;\n  align-content: center;\n}\n.textContainerTitle {\n  width: 100%;\n  margin-bottom: var(--space-4);\n}\n.textContainerTitle .visuallyHidden {\n  display: none;\n}\n.textContainerTitleText {\n  font: var(--font-text2-medium);\n  color: var(--primary-text-color);\n  margin-bottom: 2px;\n}\n.textContainerSubtitleText {\n  width: 100%;\n  font: var(--font-text2-normal);\n  color: var(--primary-text-color);\n}\n.sizeCompactTextContainerTitle {\n  margin-bottom: 0px;\n}\n.textPlacementVertical {\n  margin: 8px;\n  flex-direction: column;\n  flex: 1 1 0px;\n}\n.textPlacementVertical .textContainer {\n  margin-inline-start: 0;\n  margin-top: var(--space-16);\n}\n.textPlacementVertical .numberDividerContainer {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  width: 100%;\n}\n.sizeCompactTextContainerTitleText {\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 .numberDividerContainer .divider {\n  background-color: var(--ui-border-color);\n  margin: 16px 0 16px;\n  margin-inline-start: 16px;\n  height: 1px;\n  flex: 1 1 0;\n}\n.sizeCompactNumberDividerContainer {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.sizeCompactNumberDividerContainer.statusActiveNumberDividerContainer {\n  width: 40px;\n}\n.indicator.clickable {\n  cursor: pointer;\n}\n.withAnimation {\n  animation: stepIndicatiorCirclePopElastic var(--motion-expressive-short);\n}\n/* New state enters */\n.swapEnter {\n  opacity: 0;\n  transform: translateY(15px);\n}\n.swapEnterActive {\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 {\n  position: relative;\n  opacity: 1;\n  transform: translateY(0);\n}\n.swapExitActive {\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 {\n  width: 36px;\n  height: 36px;\n  border-radius: 50%;\n  display: flex;\n}\n.numberContainerText {\n  margin: auto;\n  display: flex;\n  align-items: center;\n}\n.numberContainerTextCheckIcon {\n  width: 20px;\n  height: 20px;\n  margin-top: 2px;\n}\n.typePrimaryNumberContainer {\n  background-color: var(--primary-color);\n}\n.typePrimaryNumberContainer:hover {\n  background-color: var(--primary-hover-color);\n}\n.typeDangerNumberContainer {\n  background-color: var(--negative-color);\n}\n.typeDangerNumberContainer:hover {\n  background-color: var(--negative-color-hover);\n}\n.typeSuccessNumberContainer {\n  background-color: var(--positive-color);\n}\n.typeSuccessNumberContainer:hover {\n  background-color: var(--positive-color-hover);\n}\n.typeDarkNumberContainer {\n  background-color: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n.typeDarkNumberContainer:hover {\n  background-color: var(--secondary-text-color);\n}\n.statusActiveNumberContainer {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--primary-color);\n}\n.statusActiveNumberContainer.typeDangerNumberContainer {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--negative-color);\n}\n.statusActiveNumberContainer.typeSuccessNumberContainer {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--positive-color);\n}\n.statusActiveNumberContainer.typeDarkNumberContainer {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--primary-text-color);\n}\n.sizeCompactNumberContainer {\n  width: 28px;\n  height: 28px;\n}\n.statusPendingNumberContainer {\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:hover {\n  background-color: var(--primary-color);\n  color: var(--text-color-on-primary);\n  border: none;\n}\n.statusPendingNumberContainer.typeDangerNumberContainer:hover {\n  background-color: var(--negative-color);\n}\n.statusPendingNumberContainer.typeSuccessNumberContainer:hover {\n  background-color: var(--positive-color);\n}\n.statusPendingNumberContainer.typeDarkNumberContainer:hover {\n  background-color: var(--text-color-on-inverted);\n}\n@keyframes step-indicatior-circle-pop-elastic {\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};
+var n={indicator:"indicator",textContainer:"textContainer",sizeCompactTextContainer:"sizeCompactTextContainer",textContainerTitle:"textContainerTitle",visuallyHidden:"visuallyHidden",textContainerTitleText:"textContainerTitleText",textContainerSubtitleText:"textContainerSubtitleText",sizeCompactTextContainerTitle:"sizeCompactTextContainerTitle",textPlacementVertical:"textPlacementVertical",numberDividerContainer:"numberDividerContainer",sizeCompactTextContainerTitleText:"sizeCompactTextContainerTitleText",divider:"divider",sizeCompactNumberDividerContainer:"sizeCompactNumberDividerContainer",statusActiveNumberDividerContainer:"statusActiveNumberDividerContainer",clickable:"clickable",withAnimation:"withAnimation",stepIndicatiorCirclePopElastic:"stepIndicatiorCirclePopElastic",swapEnter:"swapEnter",swapEnterActive:"swapEnterActive",swapExit:"swapExit",swapExitActive:"swapExitActive",numberContainer:"numberContainer",numberContainerText:"numberContainerText",numberContainerTextCheckIcon:"numberContainerTextCheckIcon",typePrimaryNumberContainer:"typePrimaryNumberContainer",typeDangerNumberContainer:"typeDangerNumberContainer",typeSuccessNumberContainer:"typeSuccessNumberContainer",typeDarkNumberContainer:"typeDarkNumberContainer",statusActiveNumberContainer:"statusActiveNumberContainer",sizeCompactNumberContainer:"sizeCompactNumberContainer",statusPendingNumberContainer:"statusPendingNumberContainer","step-indicatior-circle-pop-elastic":"step-indicatior-circle-pop-elastic"};!function(n){const e="s_id-baef60137dae_4_2_3";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 {\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 {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  margin-inline-start: 16px;\n}\n.sizeCompactTextContainer {\n  margin-inline-start: var(--space-8);\n  justify-content: center;\n  align-content: center;\n}\n.textContainerTitle {\n  width: 100%;\n  margin-bottom: var(--space-4);\n}\n.textContainerTitle .visuallyHidden {\n  display: none;\n}\n.textContainerTitleText {\n  font: var(--font-text2-medium);\n  color: var(--primary-text-color);\n  margin-bottom: 2px;\n}\n.textContainerSubtitleText {\n  width: 100%;\n  font: var(--font-text2-normal);\n  color: var(--primary-text-color);\n}\n.sizeCompactTextContainerTitle {\n  margin-bottom: 0px;\n}\n.textPlacementVertical {\n  margin: 8px;\n  flex-direction: column;\n  flex: 1 1 0px;\n}\n.textPlacementVertical .textContainer {\n  margin-inline-start: 0;\n  margin-top: var(--space-16);\n}\n.textPlacementVertical .numberDividerContainer {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  width: 100%;\n}\n.sizeCompactTextContainerTitleText {\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 .numberDividerContainer .divider {\n  background-color: var(--ui-border-color);\n  margin: 16px 0 16px;\n  margin-inline-start: 16px;\n  height: 1px;\n  flex: 1 1 0;\n}\n.sizeCompactNumberDividerContainer {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.sizeCompactNumberDividerContainer.statusActiveNumberDividerContainer {\n  width: 40px;\n}\n.indicator.clickable {\n  cursor: pointer;\n}\n.withAnimation {\n  animation: stepIndicatiorCirclePopElastic var(--motion-expressive-short);\n}\n/* New state enters */\n.swapEnter {\n  opacity: 0;\n  transform: translateY(15px);\n}\n.swapEnterActive {\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 {\n  position: relative;\n  opacity: 1;\n  transform: translateY(0);\n}\n.swapExitActive {\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 {\n  width: 36px;\n  height: 36px;\n  border-radius: 50%;\n  display: flex;\n}\n.numberContainerText {\n  margin: auto;\n  display: flex;\n  align-items: center;\n}\n.numberContainerTextCheckIcon {\n  width: 20px;\n  height: 20px;\n  margin-top: 2px;\n}\n.typePrimaryNumberContainer {\n  background-color: var(--primary-color);\n}\n.typePrimaryNumberContainer:hover {\n  background-color: var(--primary-hover-color);\n}\n.typeDangerNumberContainer {\n  background-color: var(--negative-color);\n}\n.typeDangerNumberContainer:hover {\n  background-color: var(--negative-color-hover);\n}\n.typeSuccessNumberContainer {\n  background-color: var(--positive-color);\n}\n.typeSuccessNumberContainer:hover {\n  background-color: var(--positive-color-hover);\n}\n.typeDarkNumberContainer {\n  background-color: var(--inverted-color-background);\n  color: var(--text-color-on-inverted);\n}\n.typeDarkNumberContainer:hover {\n  background-color: var(--secondary-text-color);\n}\n.statusActiveNumberContainer {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--primary-color);\n}\n.statusActiveNumberContainer.typeDangerNumberContainer {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--negative-color);\n}\n.statusActiveNumberContainer.typeSuccessNumberContainer {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--positive-color);\n}\n.statusActiveNumberContainer.typeDarkNumberContainer {\n  box-shadow: 0 0 0 4px var(--primary-background-color), 0 0 0 6px var(--primary-text-color);\n}\n.sizeCompactNumberContainer {\n  width: 28px;\n  height: 28px;\n}\n.statusPendingNumberContainer {\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:hover {\n  background-color: var(--primary-color);\n  color: var(--text-color-on-primary);\n  border: none;\n}\n.statusPendingNumberContainer.typeDangerNumberContainer:hover {\n  background-color: var(--negative-color);\n}\n.statusPendingNumberContainer.typeSuccessNumberContainer:hover {\n  background-color: var(--positive-color);\n}\n.statusPendingNumberContainer.typeDarkNumberContainer:hover {\n  background-color: var(--text-color-on-inverted);\n}\n@keyframes step-indicatior-circle-pop-elastic {\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/mocked_classnames/src/components/NumberField/NumberField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NumberField.js","sources":["../../../../../src/components/NumberField/NumberField.tsx"],"sourcesContent":["import React, { forwardRef, useMemo, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { type NumberFieldProps } from \"./NumberField.types\";\nimport useNumberFieldState from \"./hooks/useNumberFieldState\";\nimport useSpinButtonHandlers from \"./hooks/useSpinButtonHandlers\";\nimport { BaseInput } from \"@vibe/base\";\nimport FieldLabel from \"../FieldLabel/FieldLabel\";\nimport InfoText from \"../InfoText/InfoText\";\nimport { Icon } from \"@vibe/icon\";\nimport NumberFieldSpinButton from \"./components/NumberFieldSpinButton/NumberFieldSpinButton\";\nimport styles from \"./NumberField.module.scss\";\nimport { Flex } from \"@vibe/layout\";\nimport { useMergeRef } from \"@vibe/shared\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nconst NumberField = forwardRef(\n (\n {\n className,\n value,\n onChange,\n label,\n required,\n placeholder,\n infoText,\n error,\n success,\n disabled,\n readOnly,\n min,\n max,\n step = 1,\n size = \"medium\",\n leftIcon,\n \"aria-label\": ariaLabel,\n id,\n \"data-testid\": dataTestId,\n allowOutOfBounds,\n onValidityChange,\n ...inputProps\n }: NumberFieldProps,\n ref: React.ForwardedRef<HTMLInputElement>\n ) => {\n const inputRef = useRef<HTMLInputElement>(null);\n const mergedRef = useMergeRef<HTMLInputElement>(ref, inputRef);\n\n const {\n inputValue,\n numericValue,\n onChange: handleChange,\n onKeyDown,\n isAtMin,\n isAtMax\n } = useNumberFieldState({\n value,\n onChange,\n min,\n max,\n step,\n disabled,\n readOnly,\n allowOutOfBounds,\n onValidityChange\n });\n\n const { onIncrement, onDecrement } = useSpinButtonHandlers({\n onChange,\n value: numericValue,\n step,\n min,\n max,\n allowOutOfBounds,\n readOnly,\n inputRef\n });\n\n const renderedLeftIcon = useMemo(() => {\n if (!leftIcon) return null;\n return <Icon icon={leftIcon} className={styles.leftIcon} />;\n }, [leftIcon]);\n\n const renderedRightIcon = useMemo(() => {\n return (\n <NumberFieldSpinButton\n inputId={id}\n onIncrement={onIncrement}\n onDecrement={onDecrement}\n disabled={disabled \|\| readOnly}\n size={size}\n isAtMin={isAtMin}\n isAtMax={isAtMax}\n />\n );\n }, [id, onIncrement, onDecrement, disabled, readOnly, size, isAtMin, isAtMax]);\n\n const infoTextId = useMemo(() => {\n return infoText && id ? `${id}-info-text` : undefined;\n }, [infoText, id]);\n\n const labelId = useMemo(() => {\n return label && id ? `${id}-label` : undefined;\n }, [label, id]);\n\n return (\n <Flex\n direction=\"column\"\n align=\"stretch\"\n gap=\"xs\"\n className={cx(styles.numberField, className)}\n data-vibe={ComponentVibeId.NUMBER_FIELD}\n >\n <FieldLabel id={labelId} className={styles.label} labelText={label} required={required} labelFor={id} />\n <BaseInput\n {...inputProps}\n data-testid={dataTestId}\n ref={mergedRef}\n id={id}\n value={inputValue}\n onChange={handleChange}\n onKeyDown={onKeyDown}\n placeholder={placeholder}\n type=\"text\"\n inputMode=\"numeric\"\n inputRole=\"spinbutton\"\n aria-valuenow={numericValue}\n aria-valuemin={min}\n aria-valuemax={max}\n aria-required={required}\n aria-label={ariaLabel \|\| label}\n aria-labelledby={labelId}\n aria-describedby={infoTextId}\n disabled={disabled}\n readOnly={readOnly}\n size={size}\n error={error}\n success={success}\n renderLeft={renderedLeftIcon}\n renderRight={renderedRightIcon}\n />\n <InfoText\n id={infoTextId}\n text={infoText}\n error={error}\n success={success}\n disabled={disabled}\n readOnly={readOnly}\n />\n </Flex>\n );\n }\n);\n\nexport default NumberField;\n"],"names":["NumberField","forwardRef","_a","ref","className","value","onChange","label","required","placeholder","infoText","error","success","disabled","readOnly","min","max","_a$step","step","_a$size","size","leftIcon","ariaLabel","id","dataTestId","allowOutOfBounds","onValidityChange","inputProps","__rest","inputRef","useRef","mergedRef","useMergeRef","_useNumberFieldState","useNumberFieldState","inputValue","numericValue","handleChange","onKeyDown","isAtMin","isAtMax","_useSpinButtonHandler","useSpinButtonHandlers","onIncrement","onDecrement","renderedLeftIcon","useMemo","React","createElement","Icon","icon","styles","renderedRightIcon","NumberFieldSpinButton","inputId","infoTextId","concat","undefined","labelId","Flex","direction","align","gap","cx","numberField","ComponentVibeId","NUMBER_FIELD","FieldLabel","labelText","labelFor","BaseInput","Object","assign","type","inputMode","inputRole","renderLeft","renderRight","InfoText","text"],"mappings":"~~2rBAeA~~,~~IAAMA~~,EAAcC,GAClB,SACEC,EAwBAC,OAvBEC,EAoBgBF,EApBhBE,UACAC,EAmBgBH,EAnBhBG,MACAC,EAkBgBJ,EAlBhBI,SACAC,EAiBgBL,EAjBhBK,MACAC,EAgBgBN,EAhBhBM,SACAC,EAegBP,EAfhBO,YACAC,EAcgBR,EAdhBQ,SACAC,EAagBT,EAbhBS,MACAC,EAYgBV,EAZhBU,QACAC,EAWgBX,EAXhBW,SACAC,EAUgBZ,EAVhBY,SACAC,EASgBb,EAThBa,IACAC,EAQgBd,EARhBc,IAAGC,EAQaf,EAPhBgB,KAAAA,~~OAAI~~,~~IAAAD~~,EAAG,EAACA,EAAAE,EAOQjB,EANhBkB,KAAAA,~~OAAI~~,~~IAAAD~~,EAAG,SAAQA,EACfE,EAKgBnB,EALhBmB,SACcC,EAIEpB,EAJhB,cACAqB,EAGgBrB,EAHhBqB,GACeC,EAECtB,EAFhB,eACAuB,EACgBvB,EADhBuB,iBACAC,EAAgBxB,EAAhBwB,iBACGC,~~EAAUC~~,EAAA1B,~~EAtBf~~,CAAA,YAAA,QAAA,WAAA,QAAA,WAAA,cAAA,WAAA,QAAA,UAAA,WAAA,WAAA,MAAA,MAAA,OAAA,OAAA,WAAA,aAAA,KAAA,cAAA,mBAAA,qBA0BM2B,EAAWC,EAAyB,MACpCC,EAAYC,EAA8B7B,EAAK0B,GAErDI,EAOIC,EAAoB,CACtB7B,MAAAA,EACAC,SAAAA,EACAS,IAAAA,EACAC,IAAAA,EACAE,KAAAA,EACAL,SAAAA,EACAC,SAAAA,EACAW,iBAAAA,EACAC,iBAAAA,IAfAS,EAAUF,EAAVE,WACAC,EAAYH,EAAZG,aACUC,EAAYJ,EAAtB3B,SACAgC,EAASL,EAATK,UACAC,EAAON,EAAPM,QACAC,EAAOP,EAAPO,QAaFC,EAAqCC,EAAsB,CACzDpC,SAAAA,EACAD,MAAO+B,EACPlB,KAAAA,EACAH,IAAAA,EACAC,IAAAA,EACAS,iBAAAA,EACAX,SAAAA,EACAe,SAAAA,IARMc,EAAWF,EAAXE,YAAaC,EAAWH,EAAXG,YAWfC,GAAmBC,GAAQ,WAC/B,OAAKzB,EACE0B,~~EAAAC~~,~~cAACC~~,~~EAAI~~,~~CAACC~~,KAAM7B,EAAUjB,UAAW+C,EAAO9B,WADzB,IAExB,GAAG,CAACA,IAEE+B,GAAoBN,GAAQ,WAChC,OACEC,EAAAC,cAACK,EAAqB,CACpBC,QAAS/B,EACToB,YAAaA,EACbC,YAAaA,EACb/B,SAAUA,GAAYC,EACtBM,KAAMA,EACNmB,QAASA,EACTC,QAASA,GAGf,GAAG,CAACjB,EAAIoB,EAAaC,EAAa/B,EAAUC,EAAUM,EAAMmB,EAASC,IAE/De,GAAaT,GAAQ,WACzB,OAAOpC,GAAYa,EAAE,GAAAiC,OAAMjC,qBAAiBkC,CAC9C,GAAG,CAAC/C,EAAUa,IAERmC,GAAUZ,GAAQ,WACtB,OAAOvC,GAASgB,EAAE,GAAAiC,OAAMjC,iBAAakC,CACvC,GAAG,CAAClD,EAAOgB,IAEX,OACEwB,EAAAC,cAACW,EAAI,CACHC,UAAU,SACVC,MAAM,UACNC,IAAI,KACJ1D,UAAW2D,EAAGZ,EAAOa,YAAa5D,~~GAAU~~,~~YACjC6D~~,EAAgBC,cAE3BnB,~~EAAAC~~,~~cAACmB~~,GAAW5C,GAAImC,GAAStD,UAAW+C,EAAO5C,MAAO6D,UAAW7D,EAAOC,SAAUA,EAAU6D,SAAU9C,IAClGwB,EAAAC,cAACsB,~~EAASC~~,OAAAC,OAAA,CAAA,~~EACJ7C~~,iBACSH,EACbrB,IAAK4B,EACLR,GAAIA,EACJlB,MAAO8B,EACP7B,SAAU+B,EACVC,UAAWA,EACX7B,YAAaA,EACbgE,KAAK,OACLC,UAAU,UACVC,UAAU,aAAY,gBACPvC,EAAY,gBACZrB,~~EAAG~~,~~gBACHC~~,kBACAR,EAAQ,aACXc,GAAaf,~~EAAK~~,~~kBACbmD~~,sBACCH,GAClB1C,SAAUA,EACVC,SAAUA,EACVM,KAAMA,EACNT,MAAOA,EACPC,QAASA,EACTgE,WAAY/B,GACZgC,YAAazB,MAEfL,EAAAC,cAAC8B,EAAQ,CACPvD,GAAIgC,GACJwB,KAAMrE,EACNC,MAAOA,EACPC,QAASA,EACTC,SAAUA,EACVC,SAAUA,IAIlB"}
1	+ {"version":3,"file":"NumberField.js","sources":["../../../../../src/components/NumberField/NumberField.tsx"],"sourcesContent":["import React, { forwardRef, useMemo, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { type NumberFieldProps } from \"./NumberField.types\";\nimport useNumberFieldState from \"./hooks/useNumberFieldState\";\nimport useSpinButtonHandlers from \"./hooks/useSpinButtonHandlers\";\nimport { BaseInput } from \"@vibe/base\";\nimport FieldLabel from \"../FieldLabel/FieldLabel\";\nimport InfoText from \"../InfoText/InfoText\";\nimport { Icon } from \"@vibe/icon\";\nimport NumberFieldSpinButton from \"./components/NumberFieldSpinButton/NumberFieldSpinButton\";\nimport styles from \"./NumberField.module.scss\";\nimport { Flex } from \"@vibe/layout\";\nimport { useMergeRef } from \"@vibe/shared\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nconst NumberField = forwardRef(\n (\n {\n className,\n value,\n onChange,\n label,\n required,\n placeholder,\n infoText,\n error,\n success,\n disabled,\n readOnly,\n min,\n max,\n step = 1,\n size = \"medium\",\n leftIcon,\n \"aria-label\": ariaLabel,\n id,\n \"data-testid\": dataTestId,\n allowOutOfBounds,\n onValidityChange,\n ...inputProps\n }: NumberFieldProps,\n ref: React.ForwardedRef<HTMLInputElement>\n ) => {\n const inputRef = useRef<HTMLInputElement>(null);\n const mergedRef = useMergeRef<HTMLInputElement>(ref, inputRef);\n\n const {\n inputValue,\n numericValue,\n onChange: handleChange,\n onKeyDown,\n isAtMin,\n isAtMax\n } = useNumberFieldState({\n value,\n onChange,\n min,\n max,\n step,\n disabled,\n readOnly,\n allowOutOfBounds,\n onValidityChange\n });\n\n const { onIncrement, onDecrement } = useSpinButtonHandlers({\n onChange,\n value: numericValue,\n step,\n min,\n max,\n allowOutOfBounds,\n readOnly,\n inputRef\n });\n\n const renderedLeftIcon = useMemo(() => {\n if (!leftIcon) return null;\n return <Icon icon={leftIcon} className={styles.leftIcon} />;\n }, [leftIcon]);\n\n const renderedRightIcon = useMemo(() => {\n return (\n <NumberFieldSpinButton\n inputId={id}\n onIncrement={onIncrement}\n onDecrement={onDecrement}\n disabled={disabled \|\| readOnly}\n size={size}\n isAtMin={isAtMin}\n isAtMax={isAtMax}\n />\n );\n }, [id, onIncrement, onDecrement, disabled, readOnly, size, isAtMin, isAtMax]);\n\n const infoTextId = useMemo(() => {\n return infoText && id ? `${id}-info-text` : undefined;\n }, [infoText, id]);\n\n const labelId = useMemo(() => {\n return label && id ? `${id}-label` : undefined;\n }, [label, id]);\n\n return (\n <Flex\n direction=\"column\"\n align=\"stretch\"\n gap=\"xs\"\n className={cx(styles.numberField, className)}\n data-vibe={ComponentVibeId.NUMBER_FIELD}\n >\n <FieldLabel id={labelId} className={styles.label} labelText={label} required={required} labelFor={id} />\n <BaseInput\n {...inputProps}\n data-testid={dataTestId}\n ref={mergedRef}\n id={id}\n value={inputValue}\n onChange={handleChange}\n onKeyDown={onKeyDown}\n placeholder={placeholder}\n type=\"text\"\n inputMode=\"numeric\"\n inputRole=\"spinbutton\"\n aria-valuenow={numericValue}\n aria-valuemin={min}\n aria-valuemax={max}\n aria-required={required}\n aria-label={ariaLabel \|\| label}\n aria-labelledby={labelId}\n aria-describedby={infoTextId}\n disabled={disabled}\n readOnly={readOnly}\n size={size}\n error={error}\n success={success}\n renderLeft={renderedLeftIcon}\n renderRight={renderedRightIcon}\n />\n <InfoText\n id={infoTextId}\n text={infoText}\n error={error}\n success={success}\n disabled={disabled}\n readOnly={readOnly}\n />\n </Flex>\n );\n }\n);\n\nexport default NumberField;\n"],"names":["NumberField","forwardRef","_a","ref","className","value","onChange","label","required","placeholder","infoText","error","success","disabled","readOnly","min","max","_a$step","step","_a$size","size","leftIcon","ariaLabel","id","dataTestId","allowOutOfBounds","onValidityChange","inputProps","__rest","inputRef","useRef","mergedRef","useMergeRef","_useNumberFieldState","useNumberFieldState","inputValue","numericValue","handleChange","onKeyDown","isAtMin","isAtMax","_useSpinButtonHandler","useSpinButtonHandlers","onIncrement","onDecrement","renderedLeftIcon","useMemo","React","createElement","Icon","icon","styles","renderedRightIcon","NumberFieldSpinButton","inputId","infoTextId","concat","undefined","labelId","Flex","direction","align","gap","cx","numberField","ComponentVibeId","NUMBER_FIELD","FieldLabel","labelText","labelFor","BaseInput","Object","assign","type","inputMode","inputRole","renderLeft","renderRight","InfoText","text"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-var e={numberField:"numberField",label:"label",leftIcon:"leftIcon"};!function(e){const n="s_id-043e6276934a_4_2_2";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 {\n  width: 100%;\n}\n.numberField .label {\n  padding-bottom: 0;\n}\n.numberField .leftIcon {\n  color: var(--icon-color);\n}");export{e as default};
+var e={numberField:"numberField",label:"label",leftIcon:"leftIcon"};!function(e){const n="s_id-043e6276934a_4_2_3";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 {\n  width: 100%;\n}\n.numberField .label {\n  padding-bottom: 0;\n}\n.numberField .leftIcon {\n  color: var(--icon-color);\n}");export{e as default};
 //# sourceMappingURL=NumberField.module.scss.js.map