npm - @vibe/core - Versions diffs - 3.35.0 → 3.36.0 - Mend

@vibe/core 3.35.0 → 3.36.0

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

Files changed (945) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Heading.js","sources":["../../../../src/components/Heading/Heading.tsx"],"sourcesContent":["import React, { forwardRef, ReactNode } from \"react\";\nimport cx from \"classnames\";\nimport { camelCase } from \"lodash-es\";\nimport VibeComponent from \"../../types/VibeComponent\";\nimport { withStaticProps } from \"../../types\";\nimport { HeadingType as HeadingTypeEnum, HeadingWeight as HeadingWeightEnum } from \"./HeadingConstants\";\nimport Typography, { TypographyProps } from \"../Typography/Typography\";\nimport {\n TypographyAlign as TypographyAlignEnum,\n TypographyColor as TypographyColorEnum\n} from \"../Typography/TypographyConstants\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport styles from \"./Heading.module.scss\";\nimport { TypographyContext } from \"../Typography/utils/TypographyContext\";\nimport { HeadingType, HeadingWeight } from \"./Heading.types\";\nimport { TypographyAlign, TypographyColor } from \"../Typography/Typography.types\";\n\nconst OVERFLOW_TOLERANCE_IN_PX = 4;\n\nexport interface HeadingProps extends TypographyProps {\n type?: HeadingType;\n weight?: HeadingWeight;\n align?: TypographyAlign;\n color?: TypographyColor;\n children: ReactNode;\n}\n\nconst Heading: VibeComponent<HeadingProps, HTMLElement> & {\n types?: typeof HeadingTypeEnum;\n weights?: typeof HeadingWeightEnum;\n colors?: typeof TypographyColorEnum;\n align?: typeof TypographyAlignEnum;\n} = forwardRef(({ className, type = \"h1\", weight = \"normal\", ...typographyProps }: HeadingProps, ref) => {\n return (\n <TypographyContext.Provider value={{ overflowTolerance: OVERFLOW_TOLERANCE_IN_PX }}>\n <Typography\n element={type}\n ref={ref}\n className={cx(styles.heading, getStyle(styles, camelCase(type + \"-\" + weight)), className)}\n {...typographyProps}\n />\n </TypographyContext.Provider>\n );\n});\n\nexport default withStaticProps(Heading, {\n types: HeadingTypeEnum,\n weights: HeadingWeightEnum,\n align: TypographyAlignEnum,\n colors: TypographyColorEnum\n});\n"],"names":["withStaticProps","forwardRef","_a","ref","className","_a$type","type","_a$weight","weight","typographyProps","__rest","React","createElement","TypographyContext","Provider","value","overflowTolerance","Typography","Object","assign","element","cx","styles","heading","getStyle","camelCase","types","HeadingTypeEnum","weights","HeadingWeightEnum","align","TypographyAlignEnum","colors","TypographyColorEnum"],"mappings":"4oBAiBA,~~IA4BeA~~,EAAAA,EAbXC,GAAW,SAACC,EAAiFC,GAAjF,IAAEC,EAA6EF,EAA7EE,UAASC,EAAoEH,EAAlEI,KAAAA,OAAO,IAAHD,EAAG,KAAIA,EAAAE,EAAuDL,EAArDM,OAAAA,OAAS,IAAHD,EAAG,SAAQA,EAAKE,EAAeC,EAAAR,EAA/D,+BACd,OACES,EAAAC,cAACC,EAAkBC,SAAQ,CAACC,MAAO,CAAEC,~~kBAjBR~~,~~IAkB3BL~~,EAAAC,cAACK,EACCC,OAAAC,OAAA,CAAAC,QAASd,EACTH,IAAKA,EACLC,UAAWiB,EAAGC,EAAOC,QAASC,EAASF,EAAQG,EAAUnB,EAAO,IAAME,IAAUJ,IAC5EK,IAIZ,IAEwC,CACtCiB,MAAOC,EACPC,QAASC,EACTC,MAAOC,EACPC,OAAQC"}
1	+ {"version":3,"file":"Heading.js","sources":["../../../../src/components/Heading/Heading.tsx"],"sourcesContent":["import React, { forwardRef, ReactNode } from \"react\";\nimport cx from \"classnames\";\nimport { camelCase } from \"lodash-es\";\nimport VibeComponent from \"../../types/VibeComponent\";\nimport { withStaticProps } from \"../../types\";\nimport { HeadingType as HeadingTypeEnum, HeadingWeight as HeadingWeightEnum } from \"./HeadingConstants\";\nimport Typography, { TypographyProps } from \"../Typography/Typography\";\nimport {\n TypographyAlign as TypographyAlignEnum,\n TypographyColor as TypographyColorEnum\n} from \"../Typography/TypographyConstants\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport styles from \"./Heading.module.scss\";\nimport { TypographyContext } from \"../Typography/utils/TypographyContext\";\nimport { HeadingType, HeadingWeight } from \"./Heading.types\";\nimport { TypographyAlign, TypographyColor } from \"../Typography/Typography.types\";\n\nconst OVERFLOW_TOLERANCE_IN_PX = 4;\n\nexport interface HeadingProps extends TypographyProps {\n /*\n The heading type.\n /\n type?: HeadingType;\n /\n The font weight of the heading.\n /\n weight?: HeadingWeight;\n /\n The text alignment.\n /\n align?: TypographyAlign;\n /\n The text color.\n /\n color?: TypographyColor;\n /\n The content inside the heading.\n */\n children: ReactNode;\n}\n\nconst Heading: VibeComponent<HeadingProps, HTMLElement> & {\n types?: typeof HeadingTypeEnum;\n weights?: typeof HeadingWeightEnum;\n colors?: typeof TypographyColorEnum;\n align?: typeof TypographyAlignEnum;\n} = forwardRef(({ className, type = \"h1\", weight = \"normal\", ...typographyProps }: HeadingProps, ref) => {\n return (\n <TypographyContext.Provider value={{ overflowTolerance: OVERFLOW_TOLERANCE_IN_PX }}>\n <Typography\n element={type}\n ref={ref}\n className={cx(styles.heading, getStyle(styles, camelCase(type + \"-\" + weight)), className)}\n {...typographyProps}\n />\n </TypographyContext.Provider>\n );\n});\n\nexport default withStaticProps(Heading, {\n types: HeadingTypeEnum,\n weights: HeadingWeightEnum,\n align: TypographyAlignEnum,\n colors: TypographyColorEnum\n});\n"],"names":["withStaticProps","forwardRef","_a","ref","className","_a$type","type","_a$weight","weight","typographyProps","__rest","React","createElement","TypographyContext","Provider","value","overflowTolerance","Typography","Object","assign","element","cx","styles","heading","getStyle","camelCase","types","HeadingTypeEnum","weights","HeadingWeightEnum","align","TypographyAlignEnum","colors","TypographyColorEnum"],"mappings":"4oBAiBA,IA2CeA,EAAAA,EAbXC,GAAW,SAACC,EAAiFC,GAAjF,IAAEC,EAA6EF,EAA7EE,UAASC,EAAoEH,EAAlEI,KAAAA,OAAO,IAAHD,EAAG,KAAIA,EAAAE,EAAuDL,EAArDM,OAAAA,OAAS,IAAHD,EAAG,SAAQA,EAAKE,EAAeC,EAAAR,EAA/D,+BACd,OACES,EAAAC,cAACC,EAAkBC,SAAQ,CAACC,MAAO,CAAEC,kBAhCR,IAiC3BL,EAAAC,cAACK,EACCC,OAAAC,OAAA,CAAAC,QAASd,EACTH,IAAKA,EACLC,UAAWiB,EAAGC,EAAOC,QAASC,EAASF,EAAQG,EAAUnB,EAAO,IAAME,IAAUJ,IAC5EK,IAIZ,IAEwC,CACtCiB,MAAOC,EACPC,QAASC,EACTC,MAAOC,EACPC,OAAQC"}

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

@@ -1,2 +1,2 @@
-var n={h1Bold:"h1Bold_c0fa38c0d9",h1Medium:"h1Medium_8078847060",h1Normal:"h1Normal_b558cb2717",h1Light:"h1Light_048af176f2",h2Bold:"h2Bold_2315d8b567",h2Medium:"h2Medium_69d7087be3",h2Normal:"h2Normal_d32470e033",h2Light:"h2Light_492319688d",h3Bold:"h3Bold_979755e0f3",h3Medium:"h3Medium_21142ebfbd",h3Normal:"h3Normal_d6aeca0d49",h3Light:"h3Light_051c816c7a",heading:"heading_994ec68a54"};!function(n){const o="s_id-7b3706ef5cf5_3_34_2";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+o))return;const i=document.createElement("style");i.id=o,t.firstChild?t.insertBefore(i,t.firstChild):t.appendChild(i),i.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[o]=n)}(".h1Bold_c0fa38c0d9 {\n  font: var(--font-h1-bold);\n  letter-spacing: var(--letter-spacing-h1-bold);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h1Medium_8078847060 {\n  font: var(--font-h1-medium);\n  letter-spacing: var(--letter-spacing-h1-medium);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h1Normal_b558cb2717 {\n  font: var(--font-h1-normal);\n  letter-spacing: var(--letter-spacing-h1-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h1Light_048af176f2 {\n  font: var(--font-h1-light);\n  letter-spacing: var(--letter-spacing-h1-light);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h2Bold_2315d8b567 {\n  font: var(--font-h2-bold);\n  letter-spacing: var(--letter-spacing-h2-bold);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h2Medium_69d7087be3 {\n  font: var(--font-h2-medium);\n  letter-spacing: var(--letter-spacing-h2-medium);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h2Normal_d32470e033 {\n  font: var(--font-h2-normal);\n  letter-spacing: var(--letter-spacing-h2-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h2Light_492319688d {\n  font: var(--font-h2-light);\n  letter-spacing: var(--letter-spacing-h2-light);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h3Bold_979755e0f3 {\n  font: var(--font-h3-bold);\n  letter-spacing: var(--letter-spacing-h3-bold);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h3Medium_21142ebfbd {\n  font: var(--font-h3-medium);\n  letter-spacing: var(--letter-spacing-h3-medium);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h3Normal_d6aeca0d49 {\n  font: var(--font-h3-normal);\n  letter-spacing: var(--letter-spacing-h3-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h3Light_051c816c7a {\n  font: var(--font-h3-light);\n  letter-spacing: var(--letter-spacing-h3-light);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.heading_994ec68a54 {\n  margin: 0;\n}");export{n as default};
+var n={h1Bold:"h1Bold_b768b462d4",h1Medium:"h1Medium_e76281f769",h1Normal:"h1Normal_09a6a8ce9f",h1Light:"h1Light_04f3699633",h2Bold:"h2Bold_77c68f225f",h2Medium:"h2Medium_abac924f23",h2Normal:"h2Normal_058e4e27f7",h2Light:"h2Light_311e15cd67",h3Bold:"h3Bold_90eab0c896",h3Medium:"h3Medium_53ebd7752d",h3Normal:"h3Normal_6cc2e13a65",h3Light:"h3Light_10d4e99934",heading:"heading_747cb1aaf8"};!function(n){const o="s_id-7b3706ef5cf5_3_35_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+o))return;const e=document.createElement("style");e.id=o,t.firstChild?t.insertBefore(e,t.firstChild):t.appendChild(e),e.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[o]=n)}(".h1Bold_b768b462d4 {\n  font: var(--font-h1-bold);\n  letter-spacing: var(--letter-spacing-h1-bold);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h1Medium_e76281f769 {\n  font: var(--font-h1-medium);\n  letter-spacing: var(--letter-spacing-h1-medium);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h1Normal_09a6a8ce9f {\n  font: var(--font-h1-normal);\n  letter-spacing: var(--letter-spacing-h1-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h1Light_04f3699633 {\n  font: var(--font-h1-light);\n  letter-spacing: var(--letter-spacing-h1-light);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h2Bold_77c68f225f {\n  font: var(--font-h2-bold);\n  letter-spacing: var(--letter-spacing-h2-bold);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h2Medium_abac924f23 {\n  font: var(--font-h2-medium);\n  letter-spacing: var(--letter-spacing-h2-medium);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h2Normal_058e4e27f7 {\n  font: var(--font-h2-normal);\n  letter-spacing: var(--letter-spacing-h2-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h2Light_311e15cd67 {\n  font: var(--font-h2-light);\n  letter-spacing: var(--letter-spacing-h2-light);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h3Bold_90eab0c896 {\n  font: var(--font-h3-bold);\n  letter-spacing: var(--letter-spacing-h3-bold);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h3Medium_53ebd7752d {\n  font: var(--font-h3-medium);\n  letter-spacing: var(--letter-spacing-h3-medium);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h3Normal_6cc2e13a65 {\n  font: var(--font-h3-normal);\n  letter-spacing: var(--letter-spacing-h3-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.h3Light_10d4e99934 {\n  font: var(--font-h3-light);\n  letter-spacing: var(--letter-spacing-h3-light);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n\n.heading_747cb1aaf8 {\n  margin: 0;\n}");export{n as default};
 //# sourceMappingURL=Heading.module.scss.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"HiddenText.js","sources":["../../../../src/components/HiddenText/HiddenText.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { useRef, forwardRef } from \"react\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport styles from \"./HiddenText.module.scss\";\n\nexport interface HiddenTextProps extends VibeComponentProps {\n text: string;\n}\n\nconst HiddenText = forwardRef<HTMLSpanElement, HiddenTextProps>(\n ({ text, className = \"\", id = \"hiddenText\", \"data-testid\": dataTestId }, ref) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n return (\n <span\n ref={mergedRef}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.HIDDEN_TEXT, id)}\n className={cx(styles.hiddenTextWrapper, className)}\n >\n {text}\n </span>\n );\n }\n);\n\nexport default HiddenText;\n"],"names":["HiddenText","forwardRef","_ref","ref","text","_ref$className","className","_ref$id","id","dataTestId","componentRef","useRef","mergedRef","useMergeRef","React","createElement","getTestId","ComponentDefaultTestId","HIDDEN_TEXT","cx","styles","hiddenTextWrapper"],"mappings":"~~gPAWMA~~,IAAAA,EAAaC,GACjB,SAAAC,EAAyEC,GAAO,IAA7EC,EAAIF,EAAJE,KAAIC,EAAAH,EAAEI,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAAAE,EAAAL,EAAEM,GAAAA,OAAK,IAAHD,EAAG,aAAYA,EAAiBE,EAAUP,EAAzB,eACpCQ,EAAeC,EAAO,MACtBC,EAAYC,EAAYV,EAAKO,GAEnC,OACEI,EAAAC,cAAA,OAAA,CACEZ,IAAKS,EACLJ,GAAIA,gBACSC,GAAcO,EAAUC,EAAuBC,YAAaV,GACzEF,UAAWa,EAAGC,EAAOC,kBAAmBf,IAEvCF,EAGP"}
1	+ {"version":3,"file":"HiddenText.js","sources":["../../../../src/components/HiddenText/HiddenText.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { useRef, forwardRef } from \"react\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport styles from \"./HiddenText.module.scss\";\n\nexport interface HiddenTextProps extends VibeComponentProps {\n /*\n The text content that is hidden but available for assistive technologies.\n */\n text: string;\n}\n\nconst HiddenText = forwardRef<HTMLSpanElement, HiddenTextProps>(\n ({ text, className = \"\", id = \"hiddenText\", \"data-testid\": dataTestId }, ref) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n return (\n <span\n ref={mergedRef}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.HIDDEN_TEXT, id)}\n className={cx(styles.hiddenTextWrapper, className)}\n >\n {text}\n </span>\n );\n }\n);\n\nexport default HiddenText;\n"],"names":["HiddenText","forwardRef","_ref","ref","text","_ref$className","className","_ref$id","id","dataTestId","componentRef","useRef","mergedRef","useMergeRef","React","createElement","getTestId","ComponentDefaultTestId","HIDDEN_TEXT","cx","styles","hiddenTextWrapper"],"mappings":"gPAcMA,IAAAA,EAAaC,GACjB,SAAAC,EAAyEC,GAAO,IAA7EC,EAAIF,EAAJE,KAAIC,EAAAH,EAAEI,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAAAE,EAAAL,EAAEM,GAAAA,OAAK,IAAHD,EAAG,aAAYA,EAAiBE,EAAUP,EAAzB,eACpCQ,EAAeC,EAAO,MACtBC,EAAYC,EAAYV,EAAKO,GAEnC,OACEI,EAAAC,cAAA,OAAA,CACEZ,IAAKS,EACLJ,GAAIA,gBACSC,GAAcO,EAAUC,EAAuBC,YAAaV,GACzEF,UAAWa,EAAGC,EAAOC,kBAAmBf,IAEvCF,EAGP"}

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

@@ -1,2 +1,2 @@
-var e={hiddenTextWrapper:"hiddenTextWrapper_96339bc54b"};!function(e){const t="s_id-5ac012179a41_3_34_2";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const d=document.createElement("style");d.id=t,n.firstChild?n.insertBefore(d,n.firstChild):n.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".hiddenTextWrapper_96339bc54b {\n  /* clip pattern taken from https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/. */\n  clip: rect(0, 0, 0, 0);\n  clip-path: inset(50%);\n  height: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}");export{e as default};
+var e={hiddenTextWrapper:"hiddenTextWrapper_916bf24110"};!function(e){const t="s_id-5ac012179a41_3_35_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const d=document.createElement("style");d.id=t,n.firstChild?n.insertBefore(d,n.firstChild):n.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".hiddenTextWrapper_916bf24110 {\n  /* clip pattern taken from https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/. */\n  clip: rect(0, 0, 0, 0);\n  clip-path: inset(50%);\n  height: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}");export{e as default};
 //# sourceMappingURL=HiddenText.module.scss.js.map

package/dist/src/components/Icon/CustomSvgIcon/CustomSvgIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CustomSvgIcon.js","sources":["../../../../../src/components/Icon/CustomSvgIcon/CustomSvgIcon.tsx"],"sourcesContent":["import React, { FunctionComponent, useCallback, AriaRole, Ref } from \"react\";\nimport SVG from \"react-inlinesvg\";\nimport useIconScreenReaderAccessProps from \"../../../hooks/useIconScreenReaderAccessProps\";\nimport VibeComponentProps from \"../../../types/VibeComponentProps\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../../tests/constants\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { useIsMounted } from \"../../../hooks/ssr/useIsMounted\";\n\nfunction modifySvgCode(svg: string, color = \"currentColor\") {\n return svg.replace(/fill=\".*?\"/g, `fill=\"${color}\"`);\n}\n\nexport interface CustomSvgIconProps extends VibeComponentProps {\n onClick?: (event: React.MouseEvent) => void;\n src: string \| object;\n ariaLabel?: string;\n tabIndex?: number;\n role?: AriaRole;\n ariaHidden?: boolean;\n clickable?: boolean;\n replaceToCurrentColor?: boolean;\n customColor?: string;\n ref?: Ref<SVGElement>;\n}\n\nconst CustomSvgIcon: FunctionComponent<CustomSvgIconProps> = ({\n className,\n ref,\n src,\n onClick,\n clickable,\n ariaLabel,\n ariaHidden,\n replaceToCurrentColor = false,\n customColor,\n id,\n \"data-testid\": dataTestId\n}) => {\n const screenReaderAccessProps = useIconScreenReaderAccessProps({\n isClickable: clickable,\n label: ariaLabel,\n isDecorationOnly: ariaHidden\n });\n\n const isMounted = useIsMounted();\n\n const svgProcessor = useCallback(\n (svg: string) => {\n if (replaceToCurrentColor) return modifySvgCode(svg, \"currentColor\");\n if (customColor) return modifySvgCode(svg, customColor);\n return svg;\n },\n [replaceToCurrentColor, customColor]\n );\n\n if (typeof src !== \"string\") return null;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const SVGComponent = (SVG.default \|\| SVG) as React.FC<any>; // fix esm issue\n\n const PlaceHolder = <div className={className} id={id}></div>;\n\n if (!isMounted) {\n // placeholder for server side rendering\n return PlaceHolder;\n }\n return (\n <SVGComponent\n innerRef={ref}\n {...screenReaderAccessProps}\n onClick={onClick}\n loader={PlaceHolder} // avoid flickering\n src={src}\n className={className}\n preProcessor={svgProcessor}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.SVG_ICON, id)}\n data-vibe={ComponentVibeId.ICON}\n >\n {PlaceHolder}\n </SVGComponent>\n );\n};\n\nexport default CustomSvgIcon;\n"],"names":["modifySvgCode","svg","replace","concat","arguments","length","undefined","CustomSvgIcon","_ref","className","ref","src","onClick","_ref$replaceToCurrent","replaceToCurrentColor","customColor","id","dataTestId","screenReaderAccessProps","useIconScreenReaderAccessProps","isClickable","clickable","label","ariaLabel","isDecorationOnly","ariaHidden","isMounted","useIsMounted","svgProcessor","useCallback","SVGComponent","SVG","default","PlaceHolder","React","createElement","Object","assign","innerRef","loader","preProcessor","getTestId","ComponentDefaultTestId","SVG_ICON","ComponentVibeId","ICON"],"mappings":"wVAQA,SAASA,EAAcC,GACrB,OAAOA,EAAIC,QAAQ,uBAAaC,OADOC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAG,eACM,KAClD,~~CAeA~~,IAAMG,EAAuD,SAA1CC,GAYd,IAXHC,EAASD,EAATC,UACAC,EAAGF,EAAHE,IACAC,EAAGH,EAAHG,IACAC,EAAOJ,EAAPI,QAGUC,EAAAL,EACVM,sBAAAA,OAAwB,IAAHD,GAAQA,EAC7BE,EAAWP,EAAXO,YACAC,EAAER,EAAFQ,GACeC,EAAUT,EAAzB,eAEMU,EAA0BC,EAA+B,CAC7DC,YATOZ,EAATa,UAUEC,MATOd,EAATe,UAUEC,iBATQhB,EAAViB,aAYMC,EAAYC,IAEZC,EAAeC,GACnB,SAAC5B,GACC,OAAIa,EAA8Bd,EAAcC,EAAK,gBACjDc,EAAoBf,EAAcC,EAAKc,GACpCd,CACT,GACA,CAACa,EAAuBC,IAG1B,GAAmB,iBAARJ,EAAkB,OAAO,KAGpC,IAAMmB,EAAgBC,EAAIC,SAAWD,EAE/BE,EAAcC,EAAAC,cAAA,MAAA,CAAK1B,UAAWA,EAAWO,GAAIA,IAEnD,OAAKU,EAKHQ,EAACC,cAAAL,EACCM,OAAAC,OAAA,CAAAC,SAAU5B,GACNQ,EAAuB,CAC3BN,QAASA,EACT2B,OAAQN,EACRtB,IAAKA,EACLF,UAAWA,EACX+B,aAAcZ,EACdZ,GAAIA,gBACSC,GAAcwB,EAAUC,EAAuBC,SAAU3B,GAAG,YAC9D4B,EAAgBC,OAE1BZ,GAfIA,CAkBX"}
1	+ {"version":3,"file":"CustomSvgIcon.js","sources":["../../../../../src/components/Icon/CustomSvgIcon/CustomSvgIcon.tsx"],"sourcesContent":["import React, { FunctionComponent, useCallback, AriaRole, Ref } from \"react\";\nimport SVG from \"react-inlinesvg\";\nimport useIconScreenReaderAccessProps from \"../../../hooks/useIconScreenReaderAccessProps\";\nimport VibeComponentProps from \"../../../types/VibeComponentProps\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../../tests/constants\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { useIsMounted } from \"../../../hooks/ssr/useIsMounted\";\n\nfunction modifySvgCode(svg: string, color = \"currentColor\") {\n return svg.replace(/fill=\".?\"/g, `fill=\"${color}\"`);\n}\n\nexport interface CustomSvgIconProps extends VibeComponentProps {\n /\n Callback fired when the icon is clicked.\n /\n onClick?: (event: React.MouseEvent) => void;\n /\n The source URL or object of the SVG icon.\n /\n src: string \| object;\n /\n The accessible label for the icon.\n /\n ariaLabel?: string;\n /\n The tab index of the icon for keyboard navigation.\n /\n tabIndex?: number;\n /\n The ARIA role of the icon.\n /\n role?: AriaRole;\n /\n If true, hides the icon from screen readers.\n /\n ariaHidden?: boolean;\n /\n If true, makes the icon clickable.\n /\n clickable?: boolean;\n /\n If true, replaces the `fill` attribute in the SVG with `currentColor`.\n /\n replaceToCurrentColor?: boolean;\n /\n Overrides the default color of the icon.\n /\n customColor?: string;\n /\n Reference to the SVG element.\n */\n ref?: Ref<SVGElement>;\n}\n\nconst CustomSvgIcon: FunctionComponent<CustomSvgIconProps> = ({\n className,\n ref,\n src,\n onClick,\n clickable,\n ariaLabel,\n ariaHidden,\n replaceToCurrentColor = false,\n customColor,\n id,\n \"data-testid\": dataTestId\n}) => {\n const screenReaderAccessProps = useIconScreenReaderAccessProps({\n isClickable: clickable,\n label: ariaLabel,\n isDecorationOnly: ariaHidden\n });\n\n const isMounted = useIsMounted();\n\n const svgProcessor = useCallback(\n (svg: string) => {\n if (replaceToCurrentColor) return modifySvgCode(svg, \"currentColor\");\n if (customColor) return modifySvgCode(svg, customColor);\n return svg;\n },\n [replaceToCurrentColor, customColor]\n );\n\n if (typeof src !== \"string\") return null;\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const SVGComponent = (SVG.default \|\| SVG) as React.FC<any>; // fix esm issue\n\n const PlaceHolder = <div className={className} id={id}></div>;\n\n if (!isMounted) {\n // placeholder for server side rendering\n return PlaceHolder;\n }\n return (\n <SVGComponent\n innerRef={ref}\n {...screenReaderAccessProps}\n onClick={onClick}\n loader={PlaceHolder} // avoid flickering\n src={src}\n className={className}\n preProcessor={svgProcessor}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.SVG_ICON, id)}\n data-vibe={ComponentVibeId.ICON}\n >\n {PlaceHolder}\n </SVGComponent>\n );\n};\n\nexport default CustomSvgIcon;\n"],"names":["modifySvgCode","svg","replace","concat","arguments","length","undefined","CustomSvgIcon","_ref","className","ref","src","onClick","_ref$replaceToCurrent","replaceToCurrentColor","customColor","id","dataTestId","screenReaderAccessProps","useIconScreenReaderAccessProps","isClickable","clickable","label","ariaLabel","isDecorationOnly","ariaHidden","isMounted","useIsMounted","svgProcessor","useCallback","SVGComponent","SVG","default","PlaceHolder","React","createElement","Object","assign","innerRef","loader","preProcessor","getTestId","ComponentDefaultTestId","SVG_ICON","ComponentVibeId","ICON"],"mappings":"wVAQA,SAASA,EAAcC,GACrB,OAAOA,EAAIC,QAAQ,uBAAaC,OADOC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAG,eACM,KAClD,CA6CA,IAAMG,EAAuD,SAA1CC,GAYd,IAXHC,EAASD,EAATC,UACAC,EAAGF,EAAHE,IACAC,EAAGH,EAAHG,IACAC,EAAOJ,EAAPI,QAGUC,EAAAL,EACVM,sBAAAA,OAAwB,IAAHD,GAAQA,EAC7BE,EAAWP,EAAXO,YACAC,EAAER,EAAFQ,GACeC,EAAUT,EAAzB,eAEMU,EAA0BC,EAA+B,CAC7DC,YATOZ,EAATa,UAUEC,MATOd,EAATe,UAUEC,iBATQhB,EAAViB,aAYMC,EAAYC,IAEZC,EAAeC,GACnB,SAAC5B,GACC,OAAIa,EAA8Bd,EAAcC,EAAK,gBACjDc,EAAoBf,EAAcC,EAAKc,GACpCd,CACT,GACA,CAACa,EAAuBC,IAG1B,GAAmB,iBAARJ,EAAkB,OAAO,KAGpC,IAAMmB,EAAgBC,EAAIC,SAAWD,EAE/BE,EAAcC,EAAAC,cAAA,MAAA,CAAK1B,UAAWA,EAAWO,GAAIA,IAEnD,OAAKU,EAKHQ,EAACC,cAAAL,EACCM,OAAAC,OAAA,CAAAC,SAAU5B,GACNQ,EAAuB,CAC3BN,QAASA,EACT2B,OAAQN,EACRtB,IAAKA,EACLF,UAAWA,EACX+B,aAAcZ,EACdZ,GAAIA,gBACSC,GAAcwB,EAAUC,EAAuBC,SAAU3B,GAAG,YAC9D4B,EAAgBC,OAE1BZ,GAfIA,CAkBX"}

package/dist/src/components/Icon/FontIcon/FontIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FontIcon.js","sources":["../../../../../src/components/Icon/FontIcon/FontIcon.tsx"],"sourcesContent":["import React, { AriaRole, forwardRef } from \"react\";\nimport classNames from \"classnames\";\nimport { SubIcon, VibeComponent, VibeComponentProps } from \"../../../types\";\nimport { ComponentVibeId } from \"../../../tests/constants\";\n\nexport interface FontIconProps extends VibeComponentProps {\n onClick?: (event: React.MouseEvent<HTMLSpanElement>) => void;\n \"aria-label\"?: string;\n tabIndex?: number;\n icon?: SubIcon;\n role?: AriaRole;\n \"aria-hidden\"?: boolean;\n}\n\nconst FontIcon: VibeComponent<FontIconProps, HTMLElement> = forwardRef(\n (\n {\n id,\n className,\n onClick,\n \"aria-label\": iconLabel,\n tabIndex,\n icon: Icon,\n role = \"img\",\n \"aria-hidden\": ariaHidden,\n \"data-testid\": dataTestId\n }: FontIconProps,\n iconRef\n ) => {\n const isIconFunction = typeof Icon === \"function\";\n const iconClassName = isIconFunction ? \"\" : Icon;\n return (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events\n <span\n aria-hidden={ariaHidden}\n className={classNames(className, \"fa\", iconClassName)}\n onClick={onClick}\n ref={iconRef}\n aria-label={iconLabel}\n tabIndex={tabIndex}\n role={role}\n id={id}\n data-testid={dataTestId}\n data-vibe={ComponentVibeId.ICON}\n >\n {isIconFunction && <Icon />}\n </span>\n );\n }\n);\nexport default FontIcon;\n"],"names":["FontIcon","forwardRef","_ref","iconRef","id","onClick","iconLabel","tabIndex","Icon","icon","_ref$role","role","dataTestId","isIconFunction","React","createElement","className","classNames","ref","ComponentVibeId","ICON"],"mappings":"~~8HAcMA~~,IAAAA,EAAsDC,GAC1D,SAAAC,EAYEC,GACE,IAXAC,EAAEF,EAAFE,GAEAC,EAAOH,EAAPG,QACcC,EAASJ,EAAvB,cACAK,EAAQL,EAARK,SACMC,EAAIN,EAAVO,KAAIC,EAAAR,EACJS,KAAAA,OAAO,IAAHD,EAAG,MAAKA,EAEGE,EAAUV,EAAzB,eAIIW,EAAiC,mBAATL,EAE9B,OAEEM,EACeC,cAAA,OAAA,CAAA,cAVUb,EAAzB,eAWEc,UAAWC,EAjBJf,EAATc,UAiBmC,KALfH,EAAiB,GAAKL,GAMxCH,QAASA,EACTa,IAAKf,EACO,aAAAG,EACZC,SAAUA,EACVI,KAAMA,EACNP,GAAIA,EAAE,cACOQ,EAAU,YACZO,EAAgBC,MAE1BP,GAAkBC,gBAACN,EAAI,MAG9B"}
1	+ {"version":3,"file":"FontIcon.js","sources":["../../../../../src/components/Icon/FontIcon/FontIcon.tsx"],"sourcesContent":["import React, { AriaRole, forwardRef } from \"react\";\nimport classNames from \"classnames\";\nimport { SubIcon, VibeComponent, VibeComponentProps } from \"../../../types\";\nimport { ComponentVibeId } from \"../../../tests/constants\";\n\nexport interface FontIconProps extends VibeComponentProps {\n /*\n Callback fired when the icon is clicked.\n /\n onClick?: (event: React.MouseEvent<HTMLSpanElement>) => void;\n /\n The accessible label for the icon.\n /\n \"aria-label\"?: string;\n /\n The tab index of the icon for keyboard navigation.\n /\n tabIndex?: number;\n /\n The icon name or component.\n /\n icon?: SubIcon;\n /\n The ARIA role of the icon.\n /\n role?: AriaRole;\n /\n If true, hides the icon from screen readers.\n */\n \"aria-hidden\"?: boolean;\n}\n\nconst FontIcon: VibeComponent<FontIconProps, HTMLElement> = forwardRef(\n (\n {\n id,\n className,\n onClick,\n \"aria-label\": iconLabel,\n tabIndex,\n icon: Icon,\n role = \"img\",\n \"aria-hidden\": ariaHidden,\n \"data-testid\": dataTestId\n }: FontIconProps,\n iconRef\n ) => {\n const isIconFunction = typeof Icon === \"function\";\n const iconClassName = isIconFunction ? \"\" : Icon;\n return (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events\n <span\n aria-hidden={ariaHidden}\n className={classNames(className, \"fa\", iconClassName)}\n onClick={onClick}\n ref={iconRef}\n aria-label={iconLabel}\n tabIndex={tabIndex}\n role={role}\n id={id}\n data-testid={dataTestId}\n data-vibe={ComponentVibeId.ICON}\n >\n {isIconFunction && <Icon />}\n </span>\n );\n }\n);\nexport default FontIcon;\n"],"names":["FontIcon","forwardRef","_ref","iconRef","id","onClick","iconLabel","tabIndex","Icon","icon","_ref$role","role","dataTestId","isIconFunction","React","createElement","className","classNames","ref","ComponentVibeId","ICON"],"mappings":"8HAgCMA,IAAAA,EAAsDC,GAC1D,SAAAC,EAYEC,GACE,IAXAC,EAAEF,EAAFE,GAEAC,EAAOH,EAAPG,QACcC,EAASJ,EAAvB,cACAK,EAAQL,EAARK,SACMC,EAAIN,EAAVO,KAAIC,EAAAR,EACJS,KAAAA,OAAO,IAAHD,EAAG,MAAKA,EAEGE,EAAUV,EAAzB,eAIIW,EAAiC,mBAATL,EAE9B,OAEEM,EACeC,cAAA,OAAA,CAAA,cAVUb,EAAzB,eAWEc,UAAWC,EAjBJf,EAATc,UAiBmC,KALfH,EAAiB,GAAKL,GAMxCH,QAASA,EACTa,IAAKf,EACO,aAAAG,EACZC,SAAUA,EACVI,KAAMA,EACNP,GAAIA,EAAE,cACOQ,EAAU,YACZO,EAAgBC,MAE1BP,GAAkBC,gBAACN,EAAI,MAG9B"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Icon.js","sources":["../../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { CSSProperties, forwardRef, Ref } from \"react\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { IconType as IconTypeEnum } from \"./IconConstants\";\nimport { IconType } from \"./Icon.types\";\nimport CustomSvgIcon from \"./CustomSvgIcon/CustomSvgIcon\";\nimport FontIcon from \"./FontIcon/FontIcon\";\nimport useIconProps from \"./hooks/useIconProps\";\nimport { VibeComponentProps, VibeComponent, SubIcon, withStaticProps } from \"../../types\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface IconSubComponentProps {\n ref?: Ref<HTMLElement>;\n id?: string;\n size?: string \| number;\n className?: string;\n style?: CSSProperties;\n \"data-testid\"?: string;\n}\n\nfunction renderIcon(Icon: SubIcon, props: IconSubComponentProps) {\n const dataTestId = props[\"data-testid\"];\n return (\n <Icon\n {...props}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.ICON, props.id)}\n data-vibe={ComponentVibeId.ICON}\n />\n );\n}\n\nexport interface IconProps extends VibeComponentProps {\n /*\n We ~~support~~ ~~three~~ ~~types of icons - SVG~~, ~~FONT and SRC (classname) so this prop is either the name of the icon~~ or ~~the~~ ~~component\~~n /\n icon: SubIcon;\n /\n ~~Icon~~ ~~aria~~ label ~~[aria~~ ~~label](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label)\~~n /\n iconLabel?: string;\n /\n The type of the ~~component~~ - svg, font or ~~custom~~ ~~svg~~ (~~using~~ ~~[`react-inlinesvg`](https://github.com/gilbarbara/react-inlinesvg#readme~~))\n /\n iconType?: IconType;\n /\n ~~Size~~ ~~for~~ ~~font~~ icon\n /\n iconSize?: number \| string;\n /\n ~~Remove~~ focus ~~style\~~n /\n ignoreFocusStyle?: boolean;\n tabindex?: number \| string;\n /\n ~~Hide~~ icon ~~asset~~ from screen ~~reader.~~ No ~~need~~ to ~~set~~ ~~value~~ ~~for~~ ~~this prop when `clickable` is false\~~n /\n ~~ariaHidden?: boolean;\n~~ style?: React.CSSProperties;\n /\n ~~When~~ ~~using~~ ~~svg~~ ~~from~~ ~~src~~ ~~(Icon.type.SRC)~~ ~~this~~ ~~boolean~~ ~~will~~ ~~transform~~ ~~the~~ ~~\"fill\" property to \"currentColor\"\~~n /\n useCurrentColor?: boolean;\n /\n ~~Override~~ the default color with a custom ~~one\~~n /\n customColor?: string;\n}\n\nconst Icon: VibeComponent<IconProps, HTMLElement> & { type?: typeof IconTypeEnum } = forwardRef(\n (\n {\n /\n component id\n */\n id,\n className,\n icon = \"\",\n iconLabel,\n iconType = \"svg\",\n iconSize = 16,\n ignoreFocusStyle = false,\n tabindex: externalTabIndex,\n ariaHidden,\n style,\n useCurrentColor = false,\n customColor,\n \"data-testid\": dataTestId\n }: IconProps,\n ref\n ) => {\n const overrideExternalTabIndex = externalTabIndex && +externalTabIndex;\n const { screenReaderAccessProps, onClickCallback, computedClassName, iconRef } = useIconProps({\n iconLabel,\n className,\n isDecorationOnly: ariaHidden,\n ignoreFocusStyle,\n externalTabIndex: overrideExternalTabIndex\n });\n\n const mergedRef = useMergeRef(ref, iconRef);\n\n if (!icon) {\n return null;\n }\n\n // TODO: [breaking] make more accurate check\n const isFunctionType = typeof icon === \"function\";\n\n const overrideDataTestId = dataTestId \|\| getTestId(ComponentDefaultTestId.ICON, id);\n\n // TODO: [breaking] make more accurate check\n if (iconType === \"svg\" \|\| isFunctionType \|\| typeof icon === \"object\") {\n return renderIcon(icon, {\n id,\n ...screenReaderAccessProps,\n ref: isFunctionType ? undefined : mergedRef,\n size: iconSize.toString(),\n className: computedClassName,\n style,\n \"data-testid\": overrideDataTestId\n });\n }\n if (iconType === \"src\") {\n return (\n <CustomSvgIcon\n id={id}\n src={icon}\n {...screenReaderAccessProps}\n className={cx(computedClassName)}\n onClick={onClickCallback}\n replaceToCurrentColor={useCurrentColor}\n customColor={customColor}\n data-testid={overrideDataTestId}\n />\n );\n }\n return (\n <FontIcon\n id={id}\n {...screenReaderAccessProps}\n className={cx(computedClassName)}\n onClick={onClickCallback}\n ref={mergedRef}\n icon={icon}\n data-testid={overrideDataTestId}\n />\n );\n }\n);\n\nexport default withStaticProps(Icon, {\n type: IconTypeEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","id","_ref$icon","icon","_ref$iconType","iconType","_ref$iconSize","iconSize","_ref$ignoreFocusStyle","ignoreFocusStyle","externalTabIndex","tabindex","style","_ref$useCurrentColor","useCurrentColor","customColor","dataTestId","_useIconProps","useIconProps","iconLabel","className","isDecorationOnly","ariaHidden","screenReaderAccessProps","onClickCallback","computedClassName","mergedRef","useMergeRef","iconRef","isFunctionType","overrideDataTestId","getTestId","ComponentDefaultTestId","ICON","_typeof","Icon","props","React","createElement","Object","assign","ComponentVibeId","renderIcon","undefined","size","CustomSvgIcon","src","cx","onClick","replaceToCurrentColor","FontIcon","type","IconTypeEnum"],"mappings":"+~~kBAqEA~~,IAkFeA,EAAAA,EAlFsEC,GACnF,SAAAC,EAmBEC,GACE,IAfAC,EAAEF,EAAFE,GACSC,EAAAH,EACTI,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EACAE,EAAAL,EACTM,SAAAA,OAAW,IAAHD,EAAG,MAAKA,EAAAE,EAAAP,EAChBQ,SAAAA,OAAW,IAAHD,EAAG,GAAEA,EAAAE,EAAAT,EACbU,iBACUC,EAAgBX,EAA1BY,SAEAC,EAAKb,EAALa,MAAKC,EAAAd,EACLe,gBAAAA,OAAkB,IAAHD,GAAQA,EACvBE,EAAWhB,EAAXgB,YACeC,EAAUjB,EAAzB,eAKFkB,EAAiFC,EAAa,CAC5FC,UAfSpB,EAAToB,UAgBAC,UAlBSrB,EAATqB,UAmBAC,iBAZUtB,EAAVuB,WAaAb,sBAfmB,IAAHD,GAAQA,EAgBxBE,iBAN+BA,IAAqBA,IAC9Ca,EAAuBN,EAAvBM,wBAAyBC,EAAeP,EAAfO,gBAAiBC,EAAiBR,EAAjBQ,kBAQ5CC,EAAYC,EAAY3B,EAR8CiB,EAAPW,SAUrE,IAAKzB,EACH,OAAO,KAIT,IAAM0B,EAAiC,mBAAT1B,EAExB2B,EAAqBd,GAAce,EAAUC,EAAuBC,KAAMhC,GAGhF,MAAiB,QAAbI,GAAsBwB,GAAkC,WAAhBK,EAAO/B,~~GA3FvD~~,SAAoBgC,EAAeC,GAEjC,OACEC,EAACC,cAAAH,EACKI,OAAAC,OAAA,CAAA,EAAAJ,iBAHWA,EAAM,gBAIML,EAAUC,EAAuBC,KAAMG,EAAMnC,IAAG,YAChEwC,EAAgBR,OAGjC,~~CAmFaS~~,CAAWvC,EAChBoC,OAAAC,OAAAD,OAAAC,OAAA,CAAAvC,GAAAA,GACGsB,GAAuB,CAC1BvB,IAAK6B,OAAiBc,EAAYjB,EAClCkB,KAAMrC,KACNa,UAAWK,EACXb,MAAAA,EACA,cAAekB,KAGF,QAAbzB,EAEAgC,EAACC,cAAAO,EACCN,OAAAC,OAAA,CAAAvC,GAAIA,EACJ6C,IAAK3C,GACDoB,EACJ,CAAAH,UAAW2B,EAAGtB,GACduB,QAASxB,EACTyB,sBAAuBnC,EACvBC,YAAaA,EAAW,cACXe,KAKjBO,EAAAC,cAACY,EAAQX,OAAAC,OAAA,CACPvC,GAAIA,GACAsB,EACJ,CAAAH,UAAW2B,EAAGtB,GACduB,QAASxB,EACTxB,IAAK0B,EACLvB,KAAMA,EAAI,cACG2B,IAGnB,IAGmC,CACnCqB,KAAMC"}
1	+ {"version":3,"file":"Icon.js","sources":["../../../../src/components/Icon/Icon.tsx"],"sourcesContent":["import { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { CSSProperties, forwardRef, Ref } from \"react\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { IconType as IconTypeEnum } from \"./IconConstants\";\nimport { IconType } from \"./Icon.types\";\nimport CustomSvgIcon from \"./CustomSvgIcon/CustomSvgIcon\";\nimport FontIcon from \"./FontIcon/FontIcon\";\nimport useIconProps from \"./hooks/useIconProps\";\nimport { VibeComponentProps, VibeComponent, SubIcon, withStaticProps } from \"../../types\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface IconSubComponentProps {\n /*\n Ref for the icon component.\n /\n ref?: Ref<HTMLElement>;\n /\n The ID of the icon component.\n /\n id?: string;\n /\n The size of the icon.\n /\n size?: string \| number;\n /\n Class name applied to the icon.\n /\n className?: string;\n /\n Inline styles applied to the icon.\n /\n style?: CSSProperties;\n /\n Test ID for testing purposes.\n /\n \"data-testid\"?: string;\n}\n\nfunction renderIcon(Icon: SubIcon, props: IconSubComponentProps) {\n const dataTestId = props[\"data-testid\"];\n return (\n <Icon\n {...props}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.ICON, props.id)}\n data-vibe={ComponentVibeId.ICON}\n />\n );\n}\n\nexport interface IconProps extends VibeComponentProps {\n /\n The icon name, component, or source URL.\n /\n icon: SubIcon;\n /\n The accessible label for the icon.\n /\n iconLabel?: string;\n /\n The type of the icon: `svg`, `font`, or `src` (external source).\n /\n iconType?: IconType;\n /\n The size of the icon.\n /\n iconSize?: number \| string;\n /\n If true, removes focus styles from the icon.\n /\n ignoreFocusStyle?: boolean;\n /\n The tab index of the icon for keyboard navigation.\n /\n tabindex?: number \| string;\n /\n If true, hides the icon from screen readers.\n /\n ariaHidden?: boolean;\n /\n Inline styles applied to the icon.\n /\n style?: React.CSSProperties;\n /\n If true, replaces `fill` property with `currentColor` when using an `src` icon.\n /\n useCurrentColor?: boolean;\n /\n Overrides the default color with a custom color.\n /\n customColor?: string;\n}\n\nconst Icon: VibeComponent<IconProps, HTMLElement> & { type?: typeof IconTypeEnum } = forwardRef(\n (\n {\n /\n component id\n */\n id,\n className,\n icon = \"\",\n iconLabel,\n iconType = \"svg\",\n iconSize = 16,\n ignoreFocusStyle = false,\n tabindex: externalTabIndex,\n ariaHidden,\n style,\n useCurrentColor = false,\n customColor,\n \"data-testid\": dataTestId\n }: IconProps,\n ref\n ) => {\n const overrideExternalTabIndex = externalTabIndex && +externalTabIndex;\n const { screenReaderAccessProps, onClickCallback, computedClassName, iconRef } = useIconProps({\n iconLabel,\n className,\n isDecorationOnly: ariaHidden,\n ignoreFocusStyle,\n externalTabIndex: overrideExternalTabIndex\n });\n\n const mergedRef = useMergeRef(ref, iconRef);\n\n if (!icon) {\n return null;\n }\n\n // TODO: [breaking] make more accurate check\n const isFunctionType = typeof icon === \"function\";\n\n const overrideDataTestId = dataTestId \|\| getTestId(ComponentDefaultTestId.ICON, id);\n\n // TODO: [breaking] make more accurate check\n if (iconType === \"svg\" \|\| isFunctionType \|\| typeof icon === \"object\") {\n return renderIcon(icon, {\n id,\n ...screenReaderAccessProps,\n ref: isFunctionType ? undefined : mergedRef,\n size: iconSize.toString(),\n className: computedClassName,\n style,\n \"data-testid\": overrideDataTestId\n });\n }\n if (iconType === \"src\") {\n return (\n <CustomSvgIcon\n id={id}\n src={icon}\n {...screenReaderAccessProps}\n className={cx(computedClassName)}\n onClick={onClickCallback}\n replaceToCurrentColor={useCurrentColor}\n customColor={customColor}\n data-testid={overrideDataTestId}\n />\n );\n }\n return (\n <FontIcon\n id={id}\n {...screenReaderAccessProps}\n className={cx(computedClassName)}\n onClick={onClickCallback}\n ref={mergedRef}\n icon={icon}\n data-testid={overrideDataTestId}\n />\n );\n }\n);\n\nexport default withStaticProps(Icon, {\n type: IconTypeEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","id","_ref$icon","icon","_ref$iconType","iconType","_ref$iconSize","iconSize","_ref$ignoreFocusStyle","ignoreFocusStyle","externalTabIndex","tabindex","style","_ref$useCurrentColor","useCurrentColor","customColor","dataTestId","_useIconProps","useIconProps","iconLabel","className","isDecorationOnly","ariaHidden","screenReaderAccessProps","onClickCallback","computedClassName","mergedRef","useMergeRef","iconRef","isFunctionType","overrideDataTestId","getTestId","ComponentDefaultTestId","ICON","_typeof","Icon","props","React","createElement","Object","assign","ComponentVibeId","renderIcon","undefined","size","CustomSvgIcon","src","cx","onClick","replaceToCurrentColor","FontIcon","type","IconTypeEnum"],"mappings":"+kBA6FA,IAkFeA,EAAAA,EAlFsEC,GACnF,SAAAC,EAmBEC,GACE,IAfAC,EAAEF,EAAFE,GACSC,EAAAH,EACTI,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EACAE,EAAAL,EACTM,SAAAA,OAAW,IAAHD,EAAG,MAAKA,EAAAE,EAAAP,EAChBQ,SAAAA,OAAW,IAAHD,EAAG,GAAEA,EAAAE,EAAAT,EACbU,iBACUC,EAAgBX,EAA1BY,SAEAC,EAAKb,EAALa,MAAKC,EAAAd,EACLe,gBAAAA,OAAkB,IAAHD,GAAQA,EACvBE,EAAWhB,EAAXgB,YACeC,EAAUjB,EAAzB,eAKFkB,EAAiFC,EAAa,CAC5FC,UAfSpB,EAAToB,UAgBAC,UAlBSrB,EAATqB,UAmBAC,iBAZUtB,EAAVuB,WAaAb,sBAfmB,IAAHD,GAAQA,EAgBxBE,iBAN+BA,IAAqBA,IAC9Ca,EAAuBN,EAAvBM,wBAAyBC,EAAeP,EAAfO,gBAAiBC,EAAiBR,EAAjBQ,kBAQ5CC,EAAYC,EAAY3B,EAR8CiB,EAAPW,SAUrE,IAAKzB,EACH,OAAO,KAIT,IAAM0B,EAAiC,mBAAT1B,EAExB2B,EAAqBd,GAAce,EAAUC,EAAuBC,KAAMhC,GAGhF,MAAiB,QAAbI,GAAsBwB,GAAkC,WAAhBK,EAAO/B,GAjGvD,SAAoBgC,EAAeC,GAEjC,OACEC,EAACC,cAAAH,EACKI,OAAAC,OAAA,CAAA,EAAAJ,iBAHWA,EAAM,gBAIML,EAAUC,EAAuBC,KAAMG,EAAMnC,IAAG,YAChEwC,EAAgBR,OAGjC,CAyFaS,CAAWvC,EAChBoC,OAAAC,OAAAD,OAAAC,OAAA,CAAAvC,GAAAA,GACGsB,GAAuB,CAC1BvB,IAAK6B,OAAiBc,EAAYjB,EAClCkB,KAAMrC,KACNa,UAAWK,EACXb,MAAAA,EACA,cAAekB,KAGF,QAAbzB,EAEAgC,EAACC,cAAAO,EACCN,OAAAC,OAAA,CAAAvC,GAAIA,EACJ6C,IAAK3C,GACDoB,EACJ,CAAAH,UAAW2B,EAAGtB,GACduB,QAASxB,EACTyB,sBAAuBnC,EACvBC,YAAaA,EAAW,cACXe,KAKjBO,EAAAC,cAACY,EAAQX,OAAAC,OAAA,CACPvC,GAAIA,GACAsB,EACJ,CAAAH,UAAW2B,EAAGtB,GACduB,QAASxB,EACTxB,IAAK0B,EACLvB,KAAMA,EAAI,cACG2B,IAGnB,IAGmC,CACnCqB,KAAMC"}

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

@@ -1,2 +1,2 @@
-var e={icon:"icon_b545ef2d9f",noFocusStyle:"noFocusStyle_17c0e6db5d",clickable:"clickable_f8f16ee482"};!function(e){const n="s_id-039c30c54242_3_34_2";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const o=document.createElement("style");o.id=n,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".icon_b545ef2d9f {\n  position: relative;\n}\n\n.icon_b545ef2d9f:before {\n  text-decoration: none !important;\n}\n\n.noFocusStyle_17c0e6db5d:focus {\n  outline: none;\n}\n\n.clickable_f8f16ee482 {\n  cursor: pointer;\n}");export{e as default};
+var e={icon:"icon_24cf8b9c4c",noFocusStyle:"noFocusStyle_e6a70bec4e",clickable:"clickable_ea8f1836f3"};!function(e){const n="s_id-039c30c54242_3_35_0";if("undefined"!=typeof document){const c=document.head||document.getElementsByTagName("head")[0];if(c.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,c.firstChild?c.insertBefore(t,c.firstChild):c.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".icon_24cf8b9c4c {\n  position: relative;\n}\n\n.icon_24cf8b9c4c:before {\n  text-decoration: none !important;\n}\n\n.noFocusStyle_e6a70bec4e:focus {\n  outline: none;\n}\n\n.clickable_ea8f1836f3 {\n  cursor: pointer;\n}");export{e as default};
 //# sourceMappingURL=Icon.module.scss.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"IconButton.js","sources":["../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import React, { AriaAttributes, forwardRef, Fragment, useMemo, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { noop as NOOP } from \"lodash-es\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport Tooltip, { TooltipProps } from \"../Tooltip/Tooltip\";\nimport Icon from \"../Icon/Icon\";\nimport { AddSmall } from \"@vibe/icons\";\nimport { getWidthHeight, Size } from \"./services/IconButton-helpers\";\nimport { SubIcon, VibeComponent, VibeComponentProps, withStaticProps } from \"../../types\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport Button from \"../Button/Button\";\nimport { BUTTON_ICON_SIZE, SMALL_BUTTON_ICON_SIZE } from \"../Button/ButtonConstants\";\nimport { ButtonColor, ButtonType } from \"../Button/Button.types\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport styles from \"./IconButton.module.scss\";\n\nexport interface IconButtonProps extends VibeComponentProps {\n /*\n id to be added to the element\n /\n id?: string;\n /\n callback function when clicking the icon button\n /\n onClick?: (event: React.MouseEvent) => void;\n /\n the class name of the button wrapper\n /\n wrapperClassName?: string;\n /\n the class name of the button icon\n /\n iconClassName?: string;\n /\n Icon to be rendered\n /\n icon?: SubIcon;\n /\n element id to describe the button accordingly\n * /\n ariaLabeledBy?: string;\n /\n a11y property to be added, used for screen reader to know what kind of button it is\n /\n ariaLabel?: string;\n /\n aria for a button popup\n /\n ariaHasPopup?: React.HTMLProps<HTMLButtonElement>[\"aria-haspopup\"];\n /\n a11y property to be added, used for screen reader to know if the button is expanded\n /\n ariaExpanded?: boolean;\n /\n aria controls - receives id for the controlled region\n /\n ariaControls?: string;\n \"aria-describedby\"?: AriaAttributes[\"aria-describedby\"];\n /\n a11y property to be added, used for screen reader to know if the button is hidden\n /\n \"aria-hidden\"?: AriaAttributes[\"aria-hidden\"];\n /\n Indicates the current \"pressed\" state of toggle buttons\n /\n \"aria-pressed\"?: AriaAttributes[\"aria-pressed\"];\n /\n Size of the icon\n /\n size?: Size;\n /\n Whether the tooltip should be displayed or not\n /\n hideTooltip?: boolean;\n /\n Props for Tooltip component\n /\n tooltipProps?: Partial<TooltipProps>;\n /\n Tooltip wraps the button icon, it will display in the tooltip, if not present the aria label will be shown\n /\n tooltipContent?: string;\n /\n Kind of button - like Button\n /\n kind?: ButtonType;\n active?: boolean;\n /* The button's color /\n color?: ButtonColor;\n /\n disabled state\n /\n disabled?: boolean;\n /\n if disabled - this will be shown in the tooltip\n /\n disabledReason?: string;\n /* Change the focus indicator from around the button to within it /\n insetFocus?: boolean;\n /* Specifies the tab order of an element /\n tabIndex?: number;\n /* Show a loader instead of the icon */\n loading?: boolean;\n}\n\nconst IconButton: VibeComponent<IconButtonProps> & {\n sizes?: typeof Button.sizes;\n kinds?: typeof Button.kinds;\n colors?: typeof Button.colors;\n} = forwardRef(\n (\n {\n className,\n wrapperClassName,\n iconClassName,\n id,\n icon = AddSmall,\n size = \"medium\",\n tooltipProps = {} as TooltipProps,\n tooltipContent,\n ariaLabeledBy,\n ariaLabel,\n ariaHasPopup,\n ariaExpanded,\n ariaControls,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-hidden\": ariaHidden,\n \"aria-pressed\": ariaPressed,\n hideTooltip = false,\n kind = \"tertiary\",\n active,\n disabled = false,\n disabledReason,\n onClick = NOOP,\n color,\n \"data-testid\": dataTestId,\n insetFocus = false,\n tabIndex,\n loading = false\n }: IconButtonProps,\n ref\n ) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n const overrideTooltipContent = useMemo(\n () => tooltipProps?.content \|\| tooltipContent,\n [tooltipProps?.content, tooltipContent]\n );\n\n const buttonAriaLabel = useMemo(() => {\n if (ariaLabel) return ariaLabel;\n if (typeof overrideTooltipContent === \"string\") return overrideTooltipContent;\n return undefined;\n }, [ariaLabel, overrideTooltipContent]);\n\n const iconSize = useMemo(() => {\n switch (size) {\n case \"xxs\":\n case \"xs\":\n return SMALL_BUTTON_ICON_SIZE;\n case \"small\":\n case \"medium\":\n case \"large\":\n return BUTTON_ICON_SIZE;\n default:\n return 24;\n }\n }, [size]);\n\n const overrideStyle = useMemo(() => {\n let style = {\n justifyContent: \"center\",\n alignItems: \"center\",\n padding: 0\n } as React.CSSProperties;\n\n if (size) {\n style = { ...style, ...getWidthHeight(size) };\n }\n return style;\n }, [size]);\n\n const calculatedTooltipContent = useMemo(() => {\n if (hideTooltip) return null;\n if (disabled && disabledReason) return disabledReason;\n if (overrideTooltipContent) return overrideTooltipContent as never;\n return ariaLabel;\n }, [hideTooltip, disabled, disabledReason, overrideTooltipContent, ariaLabel]);\n\n const IconButtonWrapper = wrapperClassName ? \"div\" : Fragment;\n const iconButtonWrapperProps = useMemo(() => {\n return wrapperClassName ? { className: cx(wrapperClassName, styles.wrapper) } : {};\n }, [wrapperClassName]);\n\n return (\n <IconButtonWrapper {...iconButtonWrapperProps}>\n <Tooltip\n {...tooltipProps}\n content={calculatedTooltipContent}\n referenceWrapperClassName={styles.referenceWrapper}\n >\n <Button\n onClick={onClick}\n disabled={disabled}\n color={color}\n kind={kind}\n ariaLabeledBy={ariaLabeledBy}\n ariaLabel={buttonAriaLabel}\n ariaHasPopup={ariaHasPopup}\n ariaExpanded={ariaExpanded}\n ariaControls={ariaControls}\n aria-describedby={ariaDescribedBy}\n aria-hidden={ariaHidden}\n aria-pressed={ariaPressed}\n ref={mergedRef}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.ICON_BUTTON, id)}\n data-vibe={ComponentVibeId.ICON_BUTTON}\n noSidePadding\n active={active}\n className={className}\n style={overrideStyle}\n insetFocus={insetFocus}\n tabIndex={tabIndex}\n loading={loading}\n loaderClassName={cx(styles.loader, getStyle(styles, size))}\n >\n <Icon icon={icon} iconType=\"svg\" iconSize={iconSize} ignoreFocusStyle className={iconClassName} />\n </Button>\n </Tooltip>\n </IconButtonWrapper>\n );\n }\n);\n\nexport default withStaticProps(IconButton, {\n sizes: Button.sizes,\n kinds: Button.kinds,\n colors: Button.colors\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","wrapperClassName","iconClassName","id","_ref$icon","icon","AddSmall","_ref$size","size","_ref$tooltipProps","tooltipProps","tooltipContent","ariaLabeledBy","ariaLabel","ariaHasPopup","ariaExpanded","ariaControls","ariaDescribedBy","ariaHidden","ariaPressed","_ref$hideTooltip","hideTooltip","_ref$kind","kind","active","_ref$disabled","disabled","disabledReason","_ref$onClick","onClick","NOOP","color","dataTestId","_ref$insetFocus","insetFocus","tabIndex","_ref$loading","loading","componentRef","useRef","mergedRef","useMergeRef","overrideTooltipContent","useMemo","content","buttonAriaLabel","iconSize","SMALL_BUTTON_ICON_SIZE","BUTTON_ICON_SIZE","overrideStyle","style","justifyContent","alignItems","padding","Object","assign","getWidthHeight","calculatedTooltipContent","IconButtonWrapper","Fragment","iconButtonWrapperProps","cx","styles","wrapper","React","createElement","Tooltip","referenceWrapperClassName","referenceWrapper","Button","getTestId","ComponentDefaultTestId","ICON_BUTTON","ComponentVibeId","noSidePadding","loaderClassName","loader","getStyle","Icon","iconType","ignoreFocusStyle","sizes","kinds","colors"],"mappings":"+0BA0GA,IAmIeA,EAAAA,EA/HXC,GACF,SAAAC,EA8BEC,GACE,IA7BAC,EAASF,EAATE,UACAC,EAAgBH,EAAhBG,iBACAC,EAAaJ,EAAbI,cACAC,EAAEL,EAAFK,GAAEC,EAAAN,EACFO,KAAAA,OAAOC,IAAHF,EAAGE,EAAQF,EAAAG,EAAAT,EACfU,KAAAA,OAAO,IAAHD,EAAG,SAAQA,EAAAE,EAAAX,EACfY,aAAAA,OAAY,IAAAD,EAAG,CAAkB,EAAAA,EACjCE,EAAcb,EAAda,eACAC,EAAad,EAAbc,cACAC,EAASf,EAATe,UACAC,EAAYhB,EAAZgB,aACAC,EAAYjB,EAAZiB,aACAC,EAAYlB,EAAZkB,aACoBC,EAAenB,EAAnC,oBACeoB,EAAUpB,EAAzB,eACgBqB,EAAWrB,EAA3B,gBAAcsB,EAAAtB,EACduB,YAAAA,OAAc,IAAHD,GAAQA,EAAAE,EAAAxB,EACnByB,KAAAA,OAAO,IAAHD,EAAG,WAAUA,EACjBE,EAAM1B,EAAN0B,OAAMC,EAAA3B,EACN4B,SAAAA,OAAW,IAAHD,GAAQA,EAChBE,EAAc7B,EAAd6B,eAAcC,EAAA9B,EACd+B,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EACdG,EAAKjC,EAALiC,MACeC,EAAUlC,EAAzB,eAAamC,EAAAnC,EACboC,WAAAA,OAAa,IAAHD,GAAQA,EAClBE,GAAQrC,EAARqC,SAAQC,GAAAtC,EACRuC,QAAAA,QAAU,IAAHD,IAAQA,GAIXE,GAAeC,EAAO,MACtBC,GAAYC,EAAY1C,EAAKuC,IAE7BI,GAAyBC,GAC7B,WAAA,OAAMjC,aAAY,EAAZA,EAAckC,UAAWjC,CAAc,GAC7C,CAACD,aAAY,EAAZA,EAAckC,QAASjC,IAGpBkC,GAAkBF,GAAQ,WAC9B,OAAI9B,IACkC,iBAA3B6B,GAA4CA,QAAvD,EAEF,GAAG,CAAC7B,EAAW6B,KAETI,GAAWH,GAAQ,WACvB,OAAQnC,GACN,IAAK,MACL,IAAK,KACH,OAAOuC,EACT,IAAK,QACL,IAAK,SACL,IAAK,QACH,OAAOC,EACT,QACE,OAAO,GAEb,GAAG,CAACxC,IAEEyC,GAAgBN,GAAQ,WAC5B,IAAIO,EAAQ,CACVC,eAAgB,SAChBC,WAAY,SACZC,QAAS,GAMX,OAHI7C,IACF0C,EAAKI,OAAAC,OAAAD,OAAAC,OAAA,GAAQL,GAAUM,EAAehD,KAEjC0C,CACT,GAAG,CAAC1C,IAEEiD,GAA2Bd,GAAQ,WACvC,OAAItB,EAAoB,KACpBK,GAAYC,EAAuBA,EACnCe,IACG7B,CACT,GAAG,CAACQ,EAAaK,EAAUC,EAAgBe,GAAwB7B,IAE7D6C,GAAoBzD,EAAmB,MAAQ0D,EAC/CC,GAAyBjB,GAAQ,WACrC,OAAO1C,EAAmB,CAAED,UAAW6D,EAAG5D,EAAkB6D,EAAOC,UAAa,EAClF,GAAG,CAAC9D,IAEJ,OACE+D,EAAAC,cAACP,GAAiBJ,OAAAC,OAAA,CAAA,EAAKK,IACrBI,EAAAC,cAACC,EAAOZ,OAAAC,OAAA,CAAA,EACF7C,EAAY,CAChBkC,QAASa,GACTU,0BAA2BL,EAAOM,mBAElCJ,EAACC,cAAAI,GACCxC,QAASA,EACTH,SAAUA,EACVK,MAAOA,EACPR,KAAMA,EACNX,cAAeA,EACfC,UAAWgC,GACX/B,aAAcA,EACdC,aAAcA,EACdC,aAAcA,EACI,mBAAAC,gBACLC,EAAU,eACTC,EACdpB,IAAKyC,GACLrC,GAAIA,EACS,cAAA6B,GAAcsC,EAAUC,EAAuBC,YAAarE,GAAG,YACjEsE,EAAgBD,YAC3BE,eACA,EAAAlD,OAAQA,EACRxB,UAAWA,EACXkD,MAAOD,GACPf,WAAYA,EACZC,SAAUA,GACVE,QAASA,GACTsC,gBAAiBd,EAAGC,EAAOc,OAAQC,EAASf,EAAQtD,KAEpDwD,EAACC,cAAAa,EAAK,CAAAzE,KAAMA,EAAM0E,SAAS,MAAMjC,SAAUA,GAAUkC,kBAAiB,EAAAhF,UAAWE,MAK3F,IAGyC,CACzC+E,MAAOZ,EAAOY,MACdC,MAAOb,EAAOa,MACdC,OAAQd,EAAOc"}
1	+ {"version":3,"file":"IconButton.js","sources":["../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import React, { AriaAttributes, forwardRef, Fragment, useMemo, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { noop as NOOP } from \"lodash-es\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport Tooltip, { TooltipProps } from \"../Tooltip/Tooltip\";\nimport Icon from \"../Icon/Icon\";\nimport { AddSmall } from \"@vibe/icons\";\nimport { getWidthHeight, Size } from \"./services/IconButton-helpers\";\nimport { SubIcon, VibeComponent, VibeComponentProps, withStaticProps } from \"../../types\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport Button from \"../Button/Button\";\nimport { BUTTON_ICON_SIZE, SMALL_BUTTON_ICON_SIZE } from \"../Button/ButtonConstants\";\nimport { ButtonColor, ButtonType } from \"../Button/Button.types\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport styles from \"./IconButton.module.scss\";\n\nexport interface IconButtonProps extends VibeComponentProps {\n /*\n Callback fired when the button is clicked.\n /\n onClick?: (event: React.MouseEvent) => void;\n /\n Class name applied to the button wrapper.\n /\n wrapperClassName?: string;\n /\n Class name applied to the icon.\n /\n iconClassName?: string;\n /\n The icon displayed inside the button.\n /\n icon?: SubIcon;\n /\n The ID of the element that labels this button.\n /\n ariaLabeledBy?: string;\n /\n The ARIA label for accessibility.\n /\n ariaLabel?: string;\n /\n If true, indicates that the button controls a popup.\n /\n ariaHasPopup?: React.HTMLProps<HTMLButtonElement>[\"aria-haspopup\"];\n /\n If true, indicates that the associated popup is open.\n /\n ariaExpanded?: boolean;\n /\n The ID of the region controlled by the button.\n /\n ariaControls?: string;\n /\n ID of the element describing the button.\n /\n \"aria-describedby\"?: AriaAttributes[\"aria-describedby\"];\n /\n If true, hides the button from assistive technologies.\n /\n \"aria-hidden\"?: AriaAttributes[\"aria-hidden\"];\n /\n Indicates the current \"pressed\" state of toggle buttons.\n /\n \"aria-pressed\"?: AriaAttributes[\"aria-pressed\"];\n /\n The size of the button.\n /\n size?: Size;\n /\n If true, hides the tooltip.\n /\n hideTooltip?: boolean;\n /\n Props for the Tooltip component.\n /\n tooltipProps?: Partial<TooltipProps>;\n /\n Tooltip content displayed on hover.\n /\n tooltipContent?: string;\n /\n The button variant.\n /\n kind?: ButtonType;\n /\n If true, the button is in an active state.\n /\n active?: boolean;\n /\n The color of the button.\n /\n color?: ButtonColor;\n /\n If true, the button is disabled.\n /\n disabled?: boolean;\n /\n If disabled, this message will be displayed in the tooltip.\n /\n disabledReason?: string;\n /\n If true, the focus indicator is displayed inside the button instead of around it.\n /\n insetFocus?: boolean;\n /\n The tab order of the button.\n /\n tabIndex?: number;\n /\n If true, a loader replaces the icon.\n */\n loading?: boolean;\n}\n\nconst IconButton: VibeComponent<IconButtonProps> & {\n sizes?: typeof Button.sizes;\n kinds?: typeof Button.kinds;\n colors?: typeof Button.colors;\n} = forwardRef(\n (\n {\n className,\n wrapperClassName,\n iconClassName,\n id,\n icon = AddSmall,\n size = \"medium\",\n tooltipProps = {} as TooltipProps,\n tooltipContent,\n ariaLabeledBy,\n ariaLabel,\n ariaHasPopup,\n ariaExpanded,\n ariaControls,\n \"aria-describedby\": ariaDescribedBy,\n \"aria-hidden\": ariaHidden,\n \"aria-pressed\": ariaPressed,\n hideTooltip = false,\n kind = \"tertiary\",\n active,\n disabled = false,\n disabledReason,\n onClick = NOOP,\n color,\n \"data-testid\": dataTestId,\n insetFocus = false,\n tabIndex,\n loading = false\n }: IconButtonProps,\n ref\n ) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n const overrideTooltipContent = useMemo(\n () => tooltipProps?.content \|\| tooltipContent,\n [tooltipProps?.content, tooltipContent]\n );\n\n const buttonAriaLabel = useMemo(() => {\n if (ariaLabel) return ariaLabel;\n if (typeof overrideTooltipContent === \"string\") return overrideTooltipContent;\n return undefined;\n }, [ariaLabel, overrideTooltipContent]);\n\n const iconSize = useMemo(() => {\n switch (size) {\n case \"xxs\":\n case \"xs\":\n return SMALL_BUTTON_ICON_SIZE;\n case \"small\":\n case \"medium\":\n case \"large\":\n return BUTTON_ICON_SIZE;\n default:\n return 24;\n }\n }, [size]);\n\n const overrideStyle = useMemo(() => {\n let style = {\n justifyContent: \"center\",\n alignItems: \"center\",\n padding: 0\n } as React.CSSProperties;\n\n if (size) {\n style = { ...style, ...getWidthHeight(size) };\n }\n return style;\n }, [size]);\n\n const calculatedTooltipContent = useMemo(() => {\n if (hideTooltip) return null;\n if (disabled && disabledReason) return disabledReason;\n if (overrideTooltipContent) return overrideTooltipContent as never;\n return ariaLabel;\n }, [hideTooltip, disabled, disabledReason, overrideTooltipContent, ariaLabel]);\n\n const IconButtonWrapper = wrapperClassName ? \"div\" : Fragment;\n const iconButtonWrapperProps = useMemo(() => {\n return wrapperClassName ? { className: cx(wrapperClassName, styles.wrapper) } : {};\n }, [wrapperClassName]);\n\n return (\n <IconButtonWrapper {...iconButtonWrapperProps}>\n <Tooltip\n {...tooltipProps}\n content={calculatedTooltipContent}\n referenceWrapperClassName={styles.referenceWrapper}\n >\n <Button\n onClick={onClick}\n disabled={disabled}\n color={color}\n kind={kind}\n ariaLabeledBy={ariaLabeledBy}\n ariaLabel={buttonAriaLabel}\n ariaHasPopup={ariaHasPopup}\n ariaExpanded={ariaExpanded}\n ariaControls={ariaControls}\n aria-describedby={ariaDescribedBy}\n aria-hidden={ariaHidden}\n aria-pressed={ariaPressed}\n ref={mergedRef}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.ICON_BUTTON, id)}\n data-vibe={ComponentVibeId.ICON_BUTTON}\n noSidePadding\n active={active}\n className={className}\n style={overrideStyle}\n insetFocus={insetFocus}\n tabIndex={tabIndex}\n loading={loading}\n loaderClassName={cx(styles.loader, getStyle(styles, size))}\n >\n <Icon icon={icon} iconType=\"svg\" iconSize={iconSize} ignoreFocusStyle className={iconClassName} />\n </Button>\n </Tooltip>\n </IconButtonWrapper>\n );\n }\n);\n\nexport default withStaticProps(IconButton, {\n sizes: Button.sizes,\n kinds: Button.kinds,\n colors: Button.colors\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","wrapperClassName","iconClassName","id","_ref$icon","icon","AddSmall","_ref$size","size","_ref$tooltipProps","tooltipProps","tooltipContent","ariaLabeledBy","ariaLabel","ariaHasPopup","ariaExpanded","ariaControls","ariaDescribedBy","ariaHidden","ariaPressed","_ref$hideTooltip","hideTooltip","_ref$kind","kind","active","_ref$disabled","disabled","disabledReason","_ref$onClick","onClick","NOOP","color","dataTestId","_ref$insetFocus","insetFocus","tabIndex","_ref$loading","loading","componentRef","useRef","mergedRef","useMergeRef","overrideTooltipContent","useMemo","content","buttonAriaLabel","iconSize","SMALL_BUTTON_ICON_SIZE","BUTTON_ICON_SIZE","overrideStyle","style","justifyContent","alignItems","padding","Object","assign","getWidthHeight","calculatedTooltipContent","IconButtonWrapper","Fragment","iconButtonWrapperProps","cx","styles","wrapper","React","createElement","Tooltip","referenceWrapperClassName","referenceWrapper","Button","getTestId","ComponentDefaultTestId","ICON_BUTTON","ComponentVibeId","noSidePadding","loaderClassName","loader","getStyle","Icon","iconType","ignoreFocusStyle","sizes","kinds","colors"],"mappings":"+0BAoHA,IAmIeA,EAAAA,EA/HXC,GACF,SAAAC,EA8BEC,GACE,IA7BAC,EAASF,EAATE,UACAC,EAAgBH,EAAhBG,iBACAC,EAAaJ,EAAbI,cACAC,EAAEL,EAAFK,GAAEC,EAAAN,EACFO,KAAAA,OAAOC,IAAHF,EAAGE,EAAQF,EAAAG,EAAAT,EACfU,KAAAA,OAAO,IAAHD,EAAG,SAAQA,EAAAE,EAAAX,EACfY,aAAAA,OAAY,IAAAD,EAAG,CAAkB,EAAAA,EACjCE,EAAcb,EAAda,eACAC,EAAad,EAAbc,cACAC,EAASf,EAATe,UACAC,EAAYhB,EAAZgB,aACAC,EAAYjB,EAAZiB,aACAC,EAAYlB,EAAZkB,aACoBC,EAAenB,EAAnC,oBACeoB,EAAUpB,EAAzB,eACgBqB,EAAWrB,EAA3B,gBAAcsB,EAAAtB,EACduB,YAAAA,OAAc,IAAHD,GAAQA,EAAAE,EAAAxB,EACnByB,KAAAA,OAAO,IAAHD,EAAG,WAAUA,EACjBE,EAAM1B,EAAN0B,OAAMC,EAAA3B,EACN4B,SAAAA,OAAW,IAAHD,GAAQA,EAChBE,EAAc7B,EAAd6B,eAAcC,EAAA9B,EACd+B,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EACdG,EAAKjC,EAALiC,MACeC,EAAUlC,EAAzB,eAAamC,EAAAnC,EACboC,WAAAA,OAAa,IAAHD,GAAQA,EAClBE,GAAQrC,EAARqC,SAAQC,GAAAtC,EACRuC,QAAAA,QAAU,IAAHD,IAAQA,GAIXE,GAAeC,EAAO,MACtBC,GAAYC,EAAY1C,EAAKuC,IAE7BI,GAAyBC,GAC7B,WAAA,OAAMjC,aAAY,EAAZA,EAAckC,UAAWjC,CAAc,GAC7C,CAACD,aAAY,EAAZA,EAAckC,QAASjC,IAGpBkC,GAAkBF,GAAQ,WAC9B,OAAI9B,IACkC,iBAA3B6B,GAA4CA,QAAvD,EAEF,GAAG,CAAC7B,EAAW6B,KAETI,GAAWH,GAAQ,WACvB,OAAQnC,GACN,IAAK,MACL,IAAK,KACH,OAAOuC,EACT,IAAK,QACL,IAAK,SACL,IAAK,QACH,OAAOC,EACT,QACE,OAAO,GAEb,GAAG,CAACxC,IAEEyC,GAAgBN,GAAQ,WAC5B,IAAIO,EAAQ,CACVC,eAAgB,SAChBC,WAAY,SACZC,QAAS,GAMX,OAHI7C,IACF0C,EAAKI,OAAAC,OAAAD,OAAAC,OAAA,GAAQL,GAAUM,EAAehD,KAEjC0C,CACT,GAAG,CAAC1C,IAEEiD,GAA2Bd,GAAQ,WACvC,OAAItB,EAAoB,KACpBK,GAAYC,EAAuBA,EACnCe,IACG7B,CACT,GAAG,CAACQ,EAAaK,EAAUC,EAAgBe,GAAwB7B,IAE7D6C,GAAoBzD,EAAmB,MAAQ0D,EAC/CC,GAAyBjB,GAAQ,WACrC,OAAO1C,EAAmB,CAAED,UAAW6D,EAAG5D,EAAkB6D,EAAOC,UAAa,EAClF,GAAG,CAAC9D,IAEJ,OACE+D,EAAAC,cAACP,GAAiBJ,OAAAC,OAAA,CAAA,EAAKK,IACrBI,EAAAC,cAACC,EAAOZ,OAAAC,OAAA,CAAA,EACF7C,EAAY,CAChBkC,QAASa,GACTU,0BAA2BL,EAAOM,mBAElCJ,EAACC,cAAAI,GACCxC,QAASA,EACTH,SAAUA,EACVK,MAAOA,EACPR,KAAMA,EACNX,cAAeA,EACfC,UAAWgC,GACX/B,aAAcA,EACdC,aAAcA,EACdC,aAAcA,EACI,mBAAAC,gBACLC,EAAU,eACTC,EACdpB,IAAKyC,GACLrC,GAAIA,EACS,cAAA6B,GAAcsC,EAAUC,EAAuBC,YAAarE,GAAG,YACjEsE,EAAgBD,YAC3BE,eACA,EAAAlD,OAAQA,EACRxB,UAAWA,EACXkD,MAAOD,GACPf,WAAYA,EACZC,SAAUA,GACVE,QAASA,GACTsC,gBAAiBd,EAAGC,EAAOc,OAAQC,EAASf,EAAQtD,KAEpDwD,EAACC,cAAAa,EAAK,CAAAzE,KAAMA,EAAM0E,SAAS,MAAMjC,SAAUA,GAAUkC,kBAAiB,EAAAhF,UAAWE,MAK3F,IAGyC,CACzC+E,MAAOZ,EAAOY,MACdC,MAAOb,EAAOa,MACdC,OAAQd,EAAOc"}

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

@@ -1,2 +1,2 @@
-var e={wrapper:"wrapper_ef789c4569",referenceWrapper:"referenceWrapper_fe723f6ed0",loader:"loader_6622f8b417",xxs:"xxs_b46c9b6bd8"};!function(e){const n="s_id-8d1605f1f87b_3_34_2";if("undefined"!=typeof document){const r=document.head||document.getElementsByTagName("head")[0];if(r.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,r.firstChild?r.insertBefore(t,r.firstChild):r.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".wrapper_ef789c4569 {\n  width: fit-content;\n  height: fit-content;\n  display: inline-flex;\n}\n\n.referenceWrapper_fe723f6ed0 {\n  display: inline-flex;\n}\n\n.referenceWrapper_fe723f6ed0 button .loader_6622f8b417 {\n  width: 16px;\n  height: 16px;\n}\n\n.referenceWrapper_fe723f6ed0 button .loader_6622f8b417.xxs_b46c9b6bd8 {\n  width: 10px;\n  height: 10px;\n}\n\n.referenceWrapper_fe723f6ed0 button .loader_6622f8b417.xxs_b46c9b6bd8 svg {\n  display: block;\n}");export{e as default};
+var e={wrapper:"wrapper_e2e9ebc10c",referenceWrapper:"referenceWrapper_cb8cc1a489",loader:"loader_a029e813c1",xxs:"xxs_df0007d5b4"};!function(e){const n="s_id-8d1605f1f87b_3_35_0";if("undefined"!=typeof document){const r=document.head||document.getElementsByTagName("head")[0];if(r.querySelector("#"+n))return;const c=document.createElement("style");c.id=n,r.firstChild?r.insertBefore(c,r.firstChild):r.appendChild(c),c.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".wrapper_e2e9ebc10c {\n  width: fit-content;\n  height: fit-content;\n  display: inline-flex;\n}\n\n.referenceWrapper_cb8cc1a489 {\n  display: inline-flex;\n}\n\n.referenceWrapper_cb8cc1a489 button .loader_a029e813c1 {\n  width: 16px;\n  height: 16px;\n}\n\n.referenceWrapper_cb8cc1a489 button .loader_a029e813c1.xxs_df0007d5b4 {\n  width: 10px;\n  height: 10px;\n}\n\n.referenceWrapper_cb8cc1a489 button .loader_a029e813c1.xxs_df0007d5b4 svg {\n  display: block;\n}");export{e as default};
 //# sourceMappingURL=IconButton.module.scss.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Label.js","sources":["../../../../src/components/Label/Label.tsx"],"sourcesContent":["import { camelCase } from \"lodash-es\";\nimport cx from \"classnames\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport React, { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport Text from \"../Text/Text\";\nimport Leg from \"./Leg\";\nimport { LabelAllowedColor as LabelColorEnum, LabelKind as LabelKindEnum, mapSizesToTextSize } from \"./LabelConstants\";\nimport { LabelColor, LabelKind, ContentColor } from \"./Label.types\";\nimport { contentColors } from \"../../utils/colors-vars-map\";\nimport { VibeComponent, VibeComponentProps, withStaticProps } from \"../../types\";\nimport useClickableProps from \"../../hooks/useClickableProps/useClickableProps\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport styles from \"./Label.module.scss\";\nimport LabelCelebrationAnimation from \"./LabelCelebrationAnimation\";\nimport { LabelSizes } from \"./Label.types\";\n\nexport interface LabelProps extends VibeComponentProps {\n /*\n Class name ~~for~~ an inner text wrapper\n */\n labelClassName?: string;\n kind?: LabelKind;\n color?: LabelColor;\n text?: string;\n isLegIncluded?: boolean;\n onClick?: (event: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;\n celebrationAnimation?: boolean;\n size?: LabelSizes;\n}\n\nconst Label: VibeComponent<LabelProps> & {\n colors?: typeof LabelColorEnum;\n kinds?: typeof LabelKindEnum;\n} = forwardRef<HTMLElement, LabelProps>(\n (\n {\n className,\n labelClassName,\n kind = \"fill\",\n color = \"primary\",\n text = \"\",\n isLegIncluded = false,\n id,\n \"data-testid\": dataTestId,\n onClick,\n celebrationAnimation,\n size = \"medium\"\n }: LabelProps,\n ref\n ) => {\n const labelRef = useRef<HTMLSpanElement>(null);\n const mergedRef = useMergeRef(ref, labelRef);\n const [isCelebrationAnimation, setIsCelebrationAnimation] = useState(celebrationAnimation);\n\n const isClickable = Boolean(onClick);\n\n const classNames = useMemo(\n () =>\n cx(\n styles.label,\n getStyle(styles, camelCase(\"kind\" + \"-\" + kind)),\n getStyle(styles, camelCase(\"color\" + \"-\" + color)),\n {\n [styles.withLeg]: isLegIncluded,\n [styles.clickable]: isClickable,\n [styles.small]: size === \"small\"\n },\n labelClassName\n ),\n [kind, color, isLegIncluded, labelClassName, isClickable, size]\n );\n\n const backgroundColorStyle = useMemo(() => {\n if (contentColors.includes(color as ContentColor)) {\n return { backgroundColor: `var(--color-${color})` };\n }\n }, [color]);\n\n const onClickCallback = useCallback(\n (event: React.MouseEvent<HTMLSpanElement, MouseEvent>) => {\n if (onClick) {\n event.preventDefault();\n onClick(event);\n }\n },\n [onClick]\n );\n\n const clickableProps = useClickableProps(\n {\n onClick: onClickCallback,\n id,\n ariaHidden: false,\n ariaHasPopup: false,\n ariaExpanded: false\n },\n labelRef\n );\n\n useEffect(() => {\n setIsCelebrationAnimation(celebrationAnimation);\n }, [celebrationAnimation]);\n\n const label = useMemo(() => {\n return (\n <span\n {...(isClickable && clickableProps)}\n className={cx({ [styles.clickableWrapper]: isClickable }, className)}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.LABEL, id)}\n ref={mergedRef}\n >\n <Text\n style={backgroundColorStyle}\n element=\"span\"\n type={mapSizesToTextSize[size]}\n className={classNames}\n color=\"onInverted\"\n data-celebration-text={isCelebrationAnimation}\n >\n <Text\n element=\"span\"\n type={mapSizesToTextSize[size]}\n color=\"inherit\"\n className={cx({ [styles.smallText]: size === \"small\" })}\n >\n {text}\n </Text>\n <span className={cx(styles.legWrapper)}>{isLegIncluded ? <Leg /> : null}</span>\n </Text>\n </span>\n );\n }, [\n isClickable,\n clickableProps,\n className,\n dataTestId,\n id,\n mergedRef,\n classNames,\n isCelebrationAnimation,\n text,\n isLegIncluded,\n size,\n backgroundColorStyle\n ]);\n\n // Celebration animation is applied only for line kind\n if (isCelebrationAnimation && kind === \"line\") {\n return (\n <LabelCelebrationAnimation onAnimationEnd={() => setIsCelebrationAnimation(false)}>\n {label}\n </LabelCelebrationAnimation>\n );\n }\n\n return label;\n }\n);\n\nexport default withStaticProps(Label, {\n colors: LabelColorEnum,\n kinds: LabelKindEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","labelClassName","_ref$kind","kind","_ref$color","color","_ref$text","text","_ref$isLegIncluded","isLegIncluded","id","dataTestId","onClick","celebrationAnimation","_ref$size","size","labelRef","useRef","mergedRef","useMergeRef","_useState","useState","_useState2","_slicedToArray","isCelebrationAnimation","setIsCelebrationAnimation","isClickable","classNames","useMemo","cx","styles","label","getStyle","camelCase","_defineProperty","withLeg","clickable","small","backgroundColorStyle","contentColors","includes","backgroundColor","concat","onClickCallback","useCallback","event","preventDefault","clickableProps","useClickableProps","ariaHidden","ariaHasPopup","ariaExpanded","useEffect","React","createElement","Object","assign","clickableWrapper","getTestId","ComponentDefaultTestId","LABEL","Text","style","element","type","mapSizesToTextSize","smallText","legWrapper","Leg","LabelCelebrationAnimation","onAnimationEnd","colors","LabelColorEnum","kinds","LabelKindEnum"],"mappings":"~~23BA+BA~~,IAiIeA,EAAAA,EA9HXC,GACF,SAAAC,EAcEC,GACE,IAbAC,EAASF,EAATE,UACAC,EAAcH,EAAdG,eAAcC,EAAAJ,EACdK,KAAAA,OAAO,IAAHD,EAAG,OAAMA,EAAAE,EAAAN,EACbO,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EAAAE,EAAAR,EACjBS,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EAAAE,EAAAV,EACTW,cAAAA,OAAgB,IAAHD,GAAQA,EACrBE,EAAEZ,EAAFY,GACeC,EAAUb,EAAzB,eACAc,EAAOd,EAAPc,QACAC,EAAoBf,EAApBe,qBAAoBC,EAAAhB,EACpBiB,KAAAA,OAAO,IAAHD,EAAG,SAAQA,EAIXE,EAAWC,EAAwB,MACnCC,EAAYC,EAAYpB,EAAKiB,GACnCI,EAA4DC,EAASR,GAAqBS,EAAAC,EAAAH,EAAA,GAAnFI,EAAsBF,EAAA,GAAEG,EAAyBH,EAAA,GAElDI,IAAsBd,EAEtBe,EAAaC,GACjB,WAAA,OACEC,EACEC,EAAOC,MACPC,EAASF,EAAQG,EAAU,QAAe9B,IAC1C6B,EAASF,EAAQG,EAAU,SAAgB5B,IAAO6B,EAAAA,EAAAA,EAAA,CAAA,EAE/CJ,EAAOK,QAAU1B,GACjBqB,EAAOM,UAAYV,GACnBI,EAAOO,MAAiB,UAATtB,GAElBd,EACD,GACH,CAACE,EAAME,EAAOI,EAAeR,EAAgByB,EAAaX,IAGtDuB,EAAuBV,GAAQ,WACnC,GAAIW,EAAcC,SAASnC,GACzB,MAAO,CAAEoC,gBAAe,eAAAC,OAAiBrC,EAAK,KAElD,GAAG,CAACA,IAEEsC,EAAkBC,GACtB,SAACC,GACKjC,IACFiC,EAAMC,iBACNlC,EAAQiC,GAEZ,GACA,CAACjC,IAGGmC,EAAiBC,EACrB,CACEpC,QAAS+B,EACTjC,GAAAA,EACAuC,YAAY,EACZC,cAAc,EACdC,cAAc,GAEhBnC,GAGFoC,GAAU,WACR3B,EAA0BZ,EAC5B,GAAG,CAACA,IAEJ,IAAMkB,EAAQH,GAAQ,WACpB,OACEyB,EACMC,cAAA,OAAAC,OAAAC,OAAA,CAAA,EAAC9B,GAAeqB,EAAe,CACnC/C,UAAW6B,EAAEK,EAAIJ,CAAAA,EAAAA,EAAO2B,iBAAmB/B,GAAe1B,GAC7C,cAAAW,GAAc+C,EAAUC,EAAuBC,MAAOlD,GACnEX,IAAKmB,IAELmC,EAACC,cAAAO,EACC,CAAAC,MAAOxB,EACPyB,QAAQ,OACRC,KAAMC,EAAmBlD,GACzBf,UAAW2B,EACXtB,MAAM,aAAY,wBACKmB,GAEvB6B,EAAAC,cAACO,EAAI,CACHE,QAAQ,OACRC,KAAMC,EAAmBlD,GACzBV,MAAM,UACNL,UAAW6B,EAAEK,EAAIJ,CAAAA,EAAAA,EAAOoC,UAAqB,UAATnD,KAEnCR,GAEH8C,EAAMC,cAAA,OAAA,CAAAtD,UAAW6B,EAAGC,EAAOqC,aAAc1D,EAAgB4C,EAACC,cAAAc,EAAM,MAAG,OAI1E,GAAE,CACD1C,EACAqB,EACA/C,EACAW,EACAD,EACAQ,EACAS,EACAH,EACAjB,EACAE,EACAM,EACAuB,IAIF,OAAId,GAAmC,SAATrB,EAE1BkD,EAACC,cAAAe,EAA0B,CAAAC,eAAgB,WAAA,OAAM7C,GAA0B,EAAM,GAC9EM,GAKAA,CACT,IAGoC,CACpCwC,OAAQC,EACRC,MAAOC"}
1	+ {"version":3,"file":"Label.js","sources":["../../../../src/components/Label/Label.tsx"],"sourcesContent":["import { camelCase } from \"lodash-es\";\nimport cx from \"classnames\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport React, { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport Text from \"../Text/Text\";\nimport Leg from \"./Leg\";\nimport { LabelAllowedColor as LabelColorEnum, LabelKind as LabelKindEnum, mapSizesToTextSize } from \"./LabelConstants\";\nimport { LabelColor, LabelKind, ContentColor } from \"./Label.types\";\nimport { contentColors } from \"../../utils/colors-vars-map\";\nimport { VibeComponent, VibeComponentProps, withStaticProps } from \"../../types\";\nimport useClickableProps from \"../../hooks/useClickableProps/useClickableProps\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport styles from \"./Label.module.scss\";\nimport LabelCelebrationAnimation from \"./LabelCelebrationAnimation\";\nimport { LabelSizes } from \"./Label.types\";\n\nexport interface LabelProps extends VibeComponentProps {\n /*\n Class name applied to the inner text wrapper.\n /\n labelClassName?: string;\n /\n The visual style of the label.\n /\n kind?: LabelKind;\n /\n The background color of the label.\n /\n color?: LabelColor;\n /\n The text content of the label.\n /\n text?: string;\n /\n If true, includes a leg (decorative extension).\n /\n isLegIncluded?: boolean;\n /\n Callback fired when the label is clicked.\n /\n onClick?: (event: React.MouseEvent<HTMLSpanElement, MouseEvent>) => void;\n /\n If true, triggers a celebration animation.\n /\n celebrationAnimation?: boolean;\n /\n The size of the label.\n */\n size?: LabelSizes;\n}\n\nconst Label: VibeComponent<LabelProps> & {\n colors?: typeof LabelColorEnum;\n kinds?: typeof LabelKindEnum;\n} = forwardRef<HTMLElement, LabelProps>(\n (\n {\n className,\n labelClassName,\n kind = \"fill\",\n color = \"primary\",\n text = \"\",\n isLegIncluded = false,\n id,\n \"data-testid\": dataTestId,\n onClick,\n celebrationAnimation,\n size = \"medium\"\n }: LabelProps,\n ref\n ) => {\n const labelRef = useRef<HTMLSpanElement>(null);\n const mergedRef = useMergeRef(ref, labelRef);\n const [isCelebrationAnimation, setIsCelebrationAnimation] = useState(celebrationAnimation);\n\n const isClickable = Boolean(onClick);\n\n const classNames = useMemo(\n () =>\n cx(\n styles.label,\n getStyle(styles, camelCase(\"kind\" + \"-\" + kind)),\n getStyle(styles, camelCase(\"color\" + \"-\" + color)),\n {\n [styles.withLeg]: isLegIncluded,\n [styles.clickable]: isClickable,\n [styles.small]: size === \"small\"\n },\n labelClassName\n ),\n [kind, color, isLegIncluded, labelClassName, isClickable, size]\n );\n\n const backgroundColorStyle = useMemo(() => {\n if (contentColors.includes(color as ContentColor)) {\n return { backgroundColor: `var(--color-${color})` };\n }\n }, [color]);\n\n const onClickCallback = useCallback(\n (event: React.MouseEvent<HTMLSpanElement, MouseEvent>) => {\n if (onClick) {\n event.preventDefault();\n onClick(event);\n }\n },\n [onClick]\n );\n\n const clickableProps = useClickableProps(\n {\n onClick: onClickCallback,\n id,\n ariaHidden: false,\n ariaHasPopup: false,\n ariaExpanded: false\n },\n labelRef\n );\n\n useEffect(() => {\n setIsCelebrationAnimation(celebrationAnimation);\n }, [celebrationAnimation]);\n\n const label = useMemo(() => {\n return (\n <span\n {...(isClickable && clickableProps)}\n className={cx({ [styles.clickableWrapper]: isClickable }, className)}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.LABEL, id)}\n ref={mergedRef}\n >\n <Text\n style={backgroundColorStyle}\n element=\"span\"\n type={mapSizesToTextSize[size]}\n className={classNames}\n color=\"onInverted\"\n data-celebration-text={isCelebrationAnimation}\n >\n <Text\n element=\"span\"\n type={mapSizesToTextSize[size]}\n color=\"inherit\"\n className={cx({ [styles.smallText]: size === \"small\" })}\n >\n {text}\n </Text>\n <span className={cx(styles.legWrapper)}>{isLegIncluded ? <Leg /> : null}</span>\n </Text>\n </span>\n );\n }, [\n isClickable,\n clickableProps,\n className,\n dataTestId,\n id,\n mergedRef,\n classNames,\n isCelebrationAnimation,\n text,\n isLegIncluded,\n size,\n backgroundColorStyle\n ]);\n\n // Celebration animation is applied only for line kind\n if (isCelebrationAnimation && kind === \"line\") {\n return (\n <LabelCelebrationAnimation onAnimationEnd={() => setIsCelebrationAnimation(false)}>\n {label}\n </LabelCelebrationAnimation>\n );\n }\n\n return label;\n }\n);\n\nexport default withStaticProps(Label, {\n colors: LabelColorEnum,\n kinds: LabelKindEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","labelClassName","_ref$kind","kind","_ref$color","color","_ref$text","text","_ref$isLegIncluded","isLegIncluded","id","dataTestId","onClick","celebrationAnimation","_ref$size","size","labelRef","useRef","mergedRef","useMergeRef","_useState","useState","_useState2","_slicedToArray","isCelebrationAnimation","setIsCelebrationAnimation","isClickable","classNames","useMemo","cx","styles","label","getStyle","camelCase","_defineProperty","withLeg","clickable","small","backgroundColorStyle","contentColors","includes","backgroundColor","concat","onClickCallback","useCallback","event","preventDefault","clickableProps","useClickableProps","ariaHidden","ariaHasPopup","ariaExpanded","useEffect","React","createElement","Object","assign","clickableWrapper","getTestId","ComponentDefaultTestId","LABEL","Text","style","element","type","mapSizesToTextSize","smallText","legWrapper","Leg","LabelCelebrationAnimation","onAnimationEnd","colors","LabelColorEnum","kinds","LabelKindEnum"],"mappings":"23BAoDA,IAiIeA,EAAAA,EA9HXC,GACF,SAAAC,EAcEC,GACE,IAbAC,EAASF,EAATE,UACAC,EAAcH,EAAdG,eAAcC,EAAAJ,EACdK,KAAAA,OAAO,IAAHD,EAAG,OAAMA,EAAAE,EAAAN,EACbO,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EAAAE,EAAAR,EACjBS,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EAAAE,EAAAV,EACTW,cAAAA,OAAgB,IAAHD,GAAQA,EACrBE,EAAEZ,EAAFY,GACeC,EAAUb,EAAzB,eACAc,EAAOd,EAAPc,QACAC,EAAoBf,EAApBe,qBAAoBC,EAAAhB,EACpBiB,KAAAA,OAAO,IAAHD,EAAG,SAAQA,EAIXE,EAAWC,EAAwB,MACnCC,EAAYC,EAAYpB,EAAKiB,GACnCI,EAA4DC,EAASR,GAAqBS,EAAAC,EAAAH,EAAA,GAAnFI,EAAsBF,EAAA,GAAEG,EAAyBH,EAAA,GAElDI,IAAsBd,EAEtBe,EAAaC,GACjB,WAAA,OACEC,EACEC,EAAOC,MACPC,EAASF,EAAQG,EAAU,QAAe9B,IAC1C6B,EAASF,EAAQG,EAAU,SAAgB5B,IAAO6B,EAAAA,EAAAA,EAAA,CAAA,EAE/CJ,EAAOK,QAAU1B,GACjBqB,EAAOM,UAAYV,GACnBI,EAAOO,MAAiB,UAATtB,GAElBd,EACD,GACH,CAACE,EAAME,EAAOI,EAAeR,EAAgByB,EAAaX,IAGtDuB,EAAuBV,GAAQ,WACnC,GAAIW,EAAcC,SAASnC,GACzB,MAAO,CAAEoC,gBAAe,eAAAC,OAAiBrC,EAAK,KAElD,GAAG,CAACA,IAEEsC,EAAkBC,GACtB,SAACC,GACKjC,IACFiC,EAAMC,iBACNlC,EAAQiC,GAEZ,GACA,CAACjC,IAGGmC,EAAiBC,EACrB,CACEpC,QAAS+B,EACTjC,GAAAA,EACAuC,YAAY,EACZC,cAAc,EACdC,cAAc,GAEhBnC,GAGFoC,GAAU,WACR3B,EAA0BZ,EAC5B,GAAG,CAACA,IAEJ,IAAMkB,EAAQH,GAAQ,WACpB,OACEyB,EACMC,cAAA,OAAAC,OAAAC,OAAA,CAAA,EAAC9B,GAAeqB,EAAe,CACnC/C,UAAW6B,EAAEK,EAAIJ,CAAAA,EAAAA,EAAO2B,iBAAmB/B,GAAe1B,GAC7C,cAAAW,GAAc+C,EAAUC,EAAuBC,MAAOlD,GACnEX,IAAKmB,IAELmC,EAACC,cAAAO,EACC,CAAAC,MAAOxB,EACPyB,QAAQ,OACRC,KAAMC,EAAmBlD,GACzBf,UAAW2B,EACXtB,MAAM,aAAY,wBACKmB,GAEvB6B,EAAAC,cAACO,EAAI,CACHE,QAAQ,OACRC,KAAMC,EAAmBlD,GACzBV,MAAM,UACNL,UAAW6B,EAAEK,EAAIJ,CAAAA,EAAAA,EAAOoC,UAAqB,UAATnD,KAEnCR,GAEH8C,EAAMC,cAAA,OAAA,CAAAtD,UAAW6B,EAAGC,EAAOqC,aAAc1D,EAAgB4C,EAACC,cAAAc,EAAM,MAAG,OAI1E,GAAE,CACD1C,EACAqB,EACA/C,EACAW,EACAD,EACAQ,EACAS,EACAH,EACAjB,EACAE,EACAM,EACAuB,IAIF,OAAId,GAAmC,SAATrB,EAE1BkD,EAACC,cAAAe,EAA0B,CAAAC,eAAgB,WAAA,OAAM7C,GAA0B,EAAM,GAC9EM,GAKAA,CACT,IAGoC,CACpCwC,OAAQC,EACRC,MAAOC"}

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

@@ -1,2 +1,2 @@
-var e={clickable:"clickable_f8f16ee482","focus-visible":"focus-visible_827afe335f",disabled:"disabled_ebf94c686f",disableTextSelection:"disableTextSelection_e27ae4df2a",clickableWrapper:"clickableWrapper_f8f16ee482",label:"label_9f94b469cf",small:"small_3e4caf2e60",withLeg:"withLeg_8c7ffa3186",legWrapper:"legWrapper_70e25229ea",kindFill:"kindFill_6c9e7c03be",colorPrimary:"colorPrimary_7c8667f66e",colorDark:"colorDark_18fff1a345",colorNegative:"colorNegative_447abefc13",colorPositive:"colorPositive_d5e6a88bdb",kindLine:"kindLine_f512538122",smallText:"smallText_8a2e3a9e28"};!function(e){const n="s_id-4bcc4b0ff746_3_34_2";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+n))return;const r=document.createElement("style");r.id=n,o.firstChild?o.insertBefore(r,o.firstChild):o.appendChild(r),r.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".clickable_f8f16ee482 {\n  cursor: pointer;\n}\n.clickable_f8f16ee482:focus-visible, .clickable_f8f16ee482.focus-visible_827afe335f {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.clickable_f8f16ee482:focus:not(.focus-visible_827afe335f) {\n  outline: none;\n}\n.clickable_f8f16ee482.disabled_ebf94c686f {\n  cursor: default;\n}\n.disableTextSelection_e27ae4df2a {\n  -webkit-touch-callout: none; /* iOS Safari */ /* Safari */ /* Konqueror HTML */ /* Old versions of Firefox */ /* Internet Explorer/Edge */\n  user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */\n}\n.clickableWrapper_f8f16ee482 {\n  cursor: pointer;\n}\n.clickableWrapper_f8f16ee482:focus-visible, .clickableWrapper_f8f16ee482.focus-visible_827afe335f {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.clickableWrapper_f8f16ee482:focus:not(.focus-visible_827afe335f) {\n  outline: none;\n}\n.clickableWrapper_f8f16ee482:active {\n  transform: scale(0.95) translate3d(0, 0, 0);\n  transition: var(--motion-productive-short) transform;\n}\n.label_9f94b469cf {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: var(--border-radius-small);\n  padding: 2px var(--spacing-small);\n  position: relative;\n}\n.label_9f94b469cf.small_3e4caf2e60 {\n  padding: 0 var(--spacing-xs);\n  border-radius: 2px;\n}\n.withLeg_8c7ffa3186 {\n  border-radius: var(--border-radius-small) var(--border-radius-small) var(--border-radius-small) 0;\n}\n.legWrapper_70e25229ea {\n  position: absolute;\n  height: 8px;\n  top: 100%;\n  left: 0;\n  display: inline-flex;\n}\n.kindFill_6c9e7c03be.colorPrimary_7c8667f66e {\n  background-color: var(--primary-color);\n}\n.kindFill_6c9e7c03be.colorPrimary_7c8667f66e svg path {\n  fill: var(--primary-color);\n}\n.kindFill_6c9e7c03be.colorPrimary_7c8667f66e.clickable_f8f16ee482:hover, .kindFill_6c9e7c03be.colorPrimary_7c8667f66e.clickable_f8f16ee482:active {\n  background-color: var(--primary-hover-color);\n}\n.kindFill_6c9e7c03be.colorDark_18fff1a345 {\n  background-color: var(--inverted-color-background);\n}\n.kindFill_6c9e7c03be.colorDark_18fff1a345 svg path {\n  fill: var(--inverted-color-background);\n}\n.kindFill_6c9e7c03be.colorNegative_447abefc13 {\n  background-color: var(--negative-color);\n}\n.kindFill_6c9e7c03be.colorNegative_447abefc13 svg path {\n  fill: var(--negative-color);\n}\n.kindFill_6c9e7c03be.colorNegative_447abefc13.clickable_f8f16ee482:hover, .kindFill_6c9e7c03be.colorNegative_447abefc13.clickable_f8f16ee482:active {\n  background-color: var(--negative-color-hover);\n}\n.kindFill_6c9e7c03be.colorPositive_d5e6a88bdb {\n  background-color: var(--positive-color);\n}\n.kindFill_6c9e7c03be.colorPositive_d5e6a88bdb svg path {\n  fill: var(--positive-color);\n}\n.kindFill_6c9e7c03be.colorPositive_d5e6a88bdb.clickable_f8f16ee482:hover, .kindFill_6c9e7c03be.colorPositive_d5e6a88bdb.clickable_f8f16ee482:active {\n  background-color: var(--positive-color-hover);\n}\n.kindLine_f512538122 {\n  border: 1px solid currentColor;\n  padding: 1px var(--spacing-small);\n}\n.kindLine_f512538122 .legWrapper_70e25229ea {\n  left: -1px;\n  top: calc(100% + 1px);\n}\n.kindLine_f512538122.colorPrimary_7c8667f66e {\n  color: var(--primary-color);\n}\n.kindLine_f512538122.colorPrimary_7c8667f66e svg path {\n  fill: var(--primary-color);\n}\n.kindLine_f512538122.colorPrimary_7c8667f66e.clickable_f8f16ee482:hover, .kindLine_f512538122.colorPrimary_7c8667f66e.clickable_f8f16ee482:active {\n  background-color: var(--primary-background-hover-color);\n}\n.kindLine_f512538122.colorDark_18fff1a345 {\n  color: var(--inverted-color-background);\n}\n.kindLine_f512538122.colorDark_18fff1a345 svg path {\n  fill: var(--inverted-color-background);\n}\n.kindLine_f512538122.colorDark_18fff1a345.clickable_f8f16ee482:hover, .kindLine_f512538122.colorDark_18fff1a345.clickable_f8f16ee482:active {\n  background-color: var(--primary-background-hover-color);\n}\n.kindLine_f512538122.colorNegative_447abefc13 {\n  color: var(--negative-color);\n}\n.kindLine_f512538122.colorNegative_447abefc13 svg path {\n  fill: var(--negative-color);\n}\n.kindLine_f512538122.colorNegative_447abefc13.clickable_f8f16ee482:hover, .kindLine_f512538122.colorNegative_447abefc13.clickable_f8f16ee482:active {\n  background-color: var(--negative-color-selected);\n}\n.kindLine_f512538122.colorPositive_d5e6a88bdb {\n  color: var(--positive-color);\n}\n.kindLine_f512538122.colorPositive_d5e6a88bdb svg path {\n  fill: var(--positive-color);\n}\n.kindLine_f512538122.colorPositive_d5e6a88bdb.clickable_f8f16ee482:hover, .kindLine_f512538122.colorPositive_d5e6a88bdb.clickable_f8f16ee482:active {\n  background-color: var(--positive-color-selected);\n}\n.kindLine_f512538122 .smallText_8a2e3a9e28 {\n  line-height: 14px;\n}");export{e as default};
+var e={clickable:"clickable_ea8f1836f3","focus-visible":"focus-visible_eb6b496cf8",disabled:"disabled_12d0f15ef4",disableTextSelection:"disableTextSelection_3f06344baf",clickableWrapper:"clickableWrapper_ea8f1836f3",label:"label_5bce4618dc",small:"small_8205ee42c5",withLeg:"withLeg_4e034afbef",legWrapper:"legWrapper_528ef44602",kindFill:"kindFill_17071c1e95",colorPrimary:"colorPrimary_3f157c15ac",colorDark:"colorDark_c8869fa30c",colorNegative:"colorNegative_435dbf5ce4",colorPositive:"colorPositive_b60a785725",kindLine:"kindLine_8a11ff7ecd",smallText:"smallText_bd45f4b980"};!function(e){const n="s_id-4bcc4b0ff746_3_35_0";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,o.firstChild?o.insertBefore(a,o.firstChild):o.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".clickable_ea8f1836f3 {\n  cursor: pointer;\n}\n.clickable_ea8f1836f3:focus-visible, .clickable_ea8f1836f3.focus-visible_eb6b496cf8 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.clickable_ea8f1836f3:focus:not(.focus-visible_eb6b496cf8) {\n  outline: none;\n}\n.clickable_ea8f1836f3.disabled_12d0f15ef4 {\n  cursor: default;\n}\n.disableTextSelection_3f06344baf {\n  -webkit-touch-callout: none; /* iOS Safari */ /* Safari */ /* Konqueror HTML */ /* Old versions of Firefox */ /* Internet Explorer/Edge */\n  user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */\n}\n.clickableWrapper_ea8f1836f3 {\n  cursor: pointer;\n}\n.clickableWrapper_ea8f1836f3:focus-visible, .clickableWrapper_ea8f1836f3.focus-visible_eb6b496cf8 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.clickableWrapper_ea8f1836f3:focus:not(.focus-visible_eb6b496cf8) {\n  outline: none;\n}\n.clickableWrapper_ea8f1836f3:active {\n  transform: scale(0.95) translate3d(0, 0, 0);\n  transition: var(--motion-productive-short) transform;\n}\n.label_5bce4618dc {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: var(--border-radius-small);\n  padding: 2px var(--spacing-small);\n  position: relative;\n}\n.label_5bce4618dc.small_8205ee42c5 {\n  padding: 0 var(--spacing-xs);\n  border-radius: 2px;\n}\n.withLeg_4e034afbef {\n  border-radius: var(--border-radius-small) var(--border-radius-small) var(--border-radius-small) 0;\n}\n.legWrapper_528ef44602 {\n  position: absolute;\n  height: 8px;\n  top: 100%;\n  left: 0;\n  display: inline-flex;\n}\n.kindFill_17071c1e95.colorPrimary_3f157c15ac {\n  background-color: var(--primary-color);\n}\n.kindFill_17071c1e95.colorPrimary_3f157c15ac svg path {\n  fill: var(--primary-color);\n}\n.kindFill_17071c1e95.colorPrimary_3f157c15ac.clickable_ea8f1836f3:hover, .kindFill_17071c1e95.colorPrimary_3f157c15ac.clickable_ea8f1836f3:active {\n  background-color: var(--primary-hover-color);\n}\n.kindFill_17071c1e95.colorDark_c8869fa30c {\n  background-color: var(--inverted-color-background);\n}\n.kindFill_17071c1e95.colorDark_c8869fa30c svg path {\n  fill: var(--inverted-color-background);\n}\n.kindFill_17071c1e95.colorNegative_435dbf5ce4 {\n  background-color: var(--negative-color);\n}\n.kindFill_17071c1e95.colorNegative_435dbf5ce4 svg path {\n  fill: var(--negative-color);\n}\n.kindFill_17071c1e95.colorNegative_435dbf5ce4.clickable_ea8f1836f3:hover, .kindFill_17071c1e95.colorNegative_435dbf5ce4.clickable_ea8f1836f3:active {\n  background-color: var(--negative-color-hover);\n}\n.kindFill_17071c1e95.colorPositive_b60a785725 {\n  background-color: var(--positive-color);\n}\n.kindFill_17071c1e95.colorPositive_b60a785725 svg path {\n  fill: var(--positive-color);\n}\n.kindFill_17071c1e95.colorPositive_b60a785725.clickable_ea8f1836f3:hover, .kindFill_17071c1e95.colorPositive_b60a785725.clickable_ea8f1836f3:active {\n  background-color: var(--positive-color-hover);\n}\n.kindLine_8a11ff7ecd {\n  border: 1px solid currentColor;\n  padding: 1px var(--spacing-small);\n}\n.kindLine_8a11ff7ecd .legWrapper_528ef44602 {\n  left: -1px;\n  top: calc(100% + 1px);\n}\n.kindLine_8a11ff7ecd.colorPrimary_3f157c15ac {\n  color: var(--primary-color);\n}\n.kindLine_8a11ff7ecd.colorPrimary_3f157c15ac svg path {\n  fill: var(--primary-color);\n}\n.kindLine_8a11ff7ecd.colorPrimary_3f157c15ac.clickable_ea8f1836f3:hover, .kindLine_8a11ff7ecd.colorPrimary_3f157c15ac.clickable_ea8f1836f3:active {\n  background-color: var(--primary-background-hover-color);\n}\n.kindLine_8a11ff7ecd.colorDark_c8869fa30c {\n  color: var(--inverted-color-background);\n}\n.kindLine_8a11ff7ecd.colorDark_c8869fa30c svg path {\n  fill: var(--inverted-color-background);\n}\n.kindLine_8a11ff7ecd.colorDark_c8869fa30c.clickable_ea8f1836f3:hover, .kindLine_8a11ff7ecd.colorDark_c8869fa30c.clickable_ea8f1836f3:active {\n  background-color: var(--primary-background-hover-color);\n}\n.kindLine_8a11ff7ecd.colorNegative_435dbf5ce4 {\n  color: var(--negative-color);\n}\n.kindLine_8a11ff7ecd.colorNegative_435dbf5ce4 svg path {\n  fill: var(--negative-color);\n}\n.kindLine_8a11ff7ecd.colorNegative_435dbf5ce4.clickable_ea8f1836f3:hover, .kindLine_8a11ff7ecd.colorNegative_435dbf5ce4.clickable_ea8f1836f3:active {\n  background-color: var(--negative-color-selected);\n}\n.kindLine_8a11ff7ecd.colorPositive_b60a785725 {\n  color: var(--positive-color);\n}\n.kindLine_8a11ff7ecd.colorPositive_b60a785725 svg path {\n  fill: var(--positive-color);\n}\n.kindLine_8a11ff7ecd.colorPositive_b60a785725.clickable_ea8f1836f3:hover, .kindLine_8a11ff7ecd.colorPositive_b60a785725.clickable_ea8f1836f3:active {\n  background-color: var(--positive-color-selected);\n}\n.kindLine_8a11ff7ecd .smallText_bd45f4b980 {\n  line-height: 14px;\n}");export{e as default};
 //# sourceMappingURL=Label.module.scss.js.map

package/dist/src/components/Label/LabelCelebrationAnimation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LabelCelebrationAnimation.js","sources":["../../../../src/components/Label/LabelCelebrationAnimation.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, useCallback, useRef, useState } from \"react\";\nimport cx from \"classnames\";\nimport useResizeObserver from \"../../hooks/useResizeObserver\";\nimport styles from \"./LabelCelebrationAnimation.module.scss\";\n\nconst DEFAULT_BORDER_RADIUS = 4;\nconst DEFAULT_STROKE_WIDTH = 1;\n\nexport interface LabelCelebrationAnimationProps {\n children: React.ReactElement;\n onAnimationEnd: () => void;\n}\n\nfunction LabelCelebrationAnimation({ children, onAnimationEnd }: LabelCelebrationAnimationProps) {\n const wrapperRef = useRef<HTMLDivElement>();\n const childRef = useRef<HTMLDivElement>();\n\n const [path, setPath] = useState<string>();\n\n const resizeObserverCallback = useCallback(\n ({ borderBoxSize }: { borderBoxSize: { blockSize: number; inlineSize: number } }) => {\n const { blockSize: height, inlineSize: width } = borderBoxSize \|\| {};\n\n if (wrapperRef.current) {\n const d = getPath({ width, height });\n setPath(d);\n\n const perimeter = getPerimeter({ width, height });\n wrapperRef.current.style.setProperty(\"--container-perimeter\", String(perimeter));\n }\n },\n []\n );\n\n useResizeObserver({\n ref: wrapperRef,\n callback: resizeObserverCallback,\n debounceTime: 0\n });\n\n const ChildComponentWithRef = forwardRef((_props, ref) =>\n cloneElement(children, {\n ref\n })\n );\n\n return (\n <div className={styles.celebration} ref={wrapperRef}>\n <svg className={styles.svg}>\n <path className={cx(styles.stroke, styles.base)} d={path} />\n <path className={cx(styles.stroke, styles.first)} d={path} />\n <path className={cx(styles.stroke, styles.second)} d={path} />\n <path className={cx(styles.stroke, styles.third)} d={path} onAnimationEnd={onAnimationEnd} />\n </svg>\n <ChildComponentWithRef ref={childRef} />\n </div>\n );\n}\n\nexport default LabelCelebrationAnimation;\n\nfunction getPath({\n width,\n height,\n borderRadius = DEFAULT_BORDER_RADIUS,\n strokeWidth = DEFAULT_STROKE_WIDTH\n}: {\n width: number;\n height: number;\n borderRadius?: number;\n strokeWidth?: number;\n}) {\n const offset = strokeWidth / 2;\n\n return `M ${width - strokeWidth / 2}, ${borderRadius} V ${\n height - borderRadius\n } A ${borderRadius} ${borderRadius} 0 0 1 ${width - borderRadius} ${height - strokeWidth / 2} H ${\n borderRadius + offset\n } A ${borderRadius} ${borderRadius} 0 0 1 ${strokeWidth / 2} ${height - borderRadius} V ${\n borderRadius + offset\n } A ${borderRadius} ${borderRadius} 0 0 1 ${borderRadius} ${strokeWidth / 2} L ${width - borderRadius}, ${\n strokeWidth / 2\n } A ${borderRadius} ${borderRadius} 0 0 1 ${width - strokeWidth / 2} ${borderRadius} Z`;\n}\n\nfunction getPerimeter({\n width,\n height,\n borderRadius = DEFAULT_BORDER_RADIUS\n}: {\n width: number;\n height: number;\n borderRadius?: number;\n}) {\n const straightWidth = width - 2 * borderRadius;\n const straightHeight = height - 2 * borderRadius;\n const cornerCircumference = 2 * Math.PI * borderRadius;\n return cornerCircumference + 2 * straightWidth + 2 * straightHeight;\n}\n"],"names":["DEFAULT_BORDER_RADIUS","DEFAULT_STROKE_WIDTH","LabelCelebrationAnimation","_ref","children","onAnimationEnd","wrapperRef","useRef","childRef","_useState","useState","_useState2","_slicedToArray","path","setPath","resizeObserverCallback","useCallback","_ref2","_ref3","borderBoxSize","height","blockSize","width","inlineSize","current","d","_ref4","_ref4$borderRadius","borderRadius","_ref4$strokeWidth","strokeWidth","offset","concat","getPath","perimeter","_ref5","_ref5$borderRadius","straightWidth","straightHeight","Math","PI","getPerimeter","style","setProperty","String","useResizeObserver","ref","callback","debounceTime","ChildComponentWithRef","forwardRef","_props","cloneElement","React","createElement","className","styles","celebration","svg","cx","stroke","base","first","second","third"],"mappings":"sTAKA,IAAMA,EAAwB,EACxBC,EAAuB,~~EAO7B~~,SAASC,EAAyBC,GAA6D,IAA1DC,EAAQD,EAARC,SAAUC,EAAcF,EAAdE,eACvCC,EAAaC,IACbC,EAAWD,IAEjBE,EAAwBC,IAAkBC,EAAAC,EAAAH,EAAA,GAAnCI,EAAIF,EAAA,GAAEG,EAAOH,EAAA,GAEdI,EAAyBC,GAC7B,SAAAC,GAAoF,IAClFC,EADcD,EAAbE,eACiE,CAAE,EAAjDC,EAAMF,EAAjBG,UAA+BC,EAAKJ,EAAjBK,WAE3B,GAAIjB,EAAWkB,QAAS,CACtB,IAAMC,EAqCd,SAAgBC,GAUf,IATCJ,EAAKI,EAALJ,MACAF,EAAMM,EAANN,OAAMO,EAAAD,EACNE,aAAAA,OAAe5B,IAAH2B,EAAG3B,EAAqB2B,EAAAE,EAAAH,EACpCI,YAAAA,OAAc7B,IAAH4B,EAAG5B,EAAoB4B,EAO5BE,EAASD,EAAc,EAE7B,MAAAE,KAAAA,OAAYV,EAAQQ,EAAc,EAACE,MAAAA,OAAKJ,EAAYI,OAAAA,OAClDZ,EAASQ,EACXI,OAAAA,OAAMJ,EAAYI,KAAAA,OAAIJ,EAAYI,WAAAA,OAAUV,EAAQM,EAAY,KAAAI,OAAIZ,EAASU,EAAc,EAAC,OAAAE,OAC1FJ,EAAeG,EACjB,OAAAC,OAAMJ,EAAY,KAAAI,OAAIJ,EAAY,WAAAI,OAAUF,EAAc,EAAC,KAAAE,OAAIZ,EAASQ,EAAYI,OAAAA,OAClFJ,EAAeG,EACjBC,OAAAA,OAAMJ,EAAYI,KAAAA,OAAIJ,EAAYI,WAAAA,OAAUJ,EAAYI,KAAAA,OAAIF,EAAc,EAACE,OAAAA,OAAMV,EAAQM,EAAY,MAAAI,OACnGF,EAAc,EAChB,OAAAE,OAAMJ,EAAY,KAAAI,OAAIJ,EAAY,WAAAI,OAAUV,EAAQQ,EAAc,EAAC,KAAAE,OAAIJ,EAAY,KACrF,CA3DkBK,CAAQ,CAAEX,MAAAA,EAAOF,OAAAA,IAC3BN,EAAQW,GAER,IAAMS,EA0Dd,SAAqBC,GAQpB,IAPCb,EAAKa,EAALb,MACAF,EAAMe,EAANf,OAAMgB,EAAAD,EACNP,aAAAA,OAAe5B,IAAHoC,EAAGpC,EAAqBoC,EAM9BC,EAAgBf,EAAQ,EAAIM,EAC5BU,EAAiBlB,EAAS,EAAIQ,EAEpC,OAD4B,EAAIW,KAAKC,GAAKZ,EACb,EAAIS,EAAgB,EAAIC,CACvD,CAvE0BG,CAAa,CAAEnB,MAAAA,EAAOF,OAAAA,IACxCd,EAAWkB,QAAQkB,MAAMC,YAAY,wBAAgCT,EAAPU,GAC/D,CACF,GACD,IAGFC,EAAkB,CAChBC,IAAKxC,EACLyC,SAAUhC,EACViC,aAAc,IAGhB,IAAMC,EAAwBC,GAAW,SAACC,EAAQL,GAAG,OACnDM,EAAahD,EAAU,CACrB0C,IAAAA,OAIJ,OACEO,EAAKC,cAAA,MAAA,CAAAC,UAAWC,EAAOC,YAAaX,IAAKxC,GACvC+C,EAAAC,cAAA,MAAA,CAAKC,UAAWC,EAAOE,KACrBL,EAAAC,cAAA,OAAA,CAAMC,UAAWI,EAAGH,EAAOI,OAAQJ,EAAOK,MAAOpC,EAAGZ,IACpDwC,EAAAC,cAAA,OAAA,CAAMC,UAAWI,EAAGH,EAAOI,OAAQJ,EAAOM,OAAQrC,EAAGZ,IACrDwC,EAAAC,cAAA,OAAA,CAAMC,UAAWI,EAAGH,EAAOI,OAAQJ,EAAOO,QAAStC,EAAGZ,IACtDwC,EAAMC,cAAA,OAAA,CAAAC,UAAWI,EAAGH,EAAOI,OAAQJ,EAAOQ,OAAQvC,EAAGZ,EAAMR,eAAgBA,KAE7EgD,EAACC,cAAAL,GAAsBH,IAAKtC,IAGlC"}
1	+ {"version":3,"file":"LabelCelebrationAnimation.js","sources":["../../../../src/components/Label/LabelCelebrationAnimation.tsx"],"sourcesContent":["import React, { cloneElement, forwardRef, useCallback, useRef, useState } from \"react\";\nimport cx from \"classnames\";\nimport useResizeObserver from \"../../hooks/useResizeObserver\";\nimport styles from \"./LabelCelebrationAnimation.module.scss\";\n\nconst DEFAULT_BORDER_RADIUS = 4;\nconst DEFAULT_STROKE_WIDTH = 1;\n\nexport interface LabelCelebrationAnimationProps {\n /*\n The child component that will be wrapped by the animation.\n /\n children: React.ReactElement;\n /\n Callback fired when the celebration animation ends.\n /\n onAnimationEnd: () => void;\n}\n\nfunction LabelCelebrationAnimation({ children, onAnimationEnd }: LabelCelebrationAnimationProps) {\n const wrapperRef = useRef<HTMLDivElement>();\n const childRef = useRef<HTMLDivElement>();\n\n const [path, setPath] = useState<string>();\n\n const resizeObserverCallback = useCallback(\n ({ borderBoxSize }: { borderBoxSize: { blockSize: number; inlineSize: number } }) => {\n const { blockSize: height, inlineSize: width } = borderBoxSize \|\| {};\n\n if (wrapperRef.current) {\n const d = getPath({ width, height });\n setPath(d);\n\n const perimeter = getPerimeter({ width, height });\n wrapperRef.current.style.setProperty(\"--container-perimeter\", String(perimeter));\n }\n },\n []\n );\n\n useResizeObserver({\n ref: wrapperRef,\n callback: resizeObserverCallback,\n debounceTime: 0\n });\n\n const ChildComponentWithRef = forwardRef((_props, ref) =>\n cloneElement(children, {\n ref\n })\n );\n\n return (\n <div className={styles.celebration} ref={wrapperRef}>\n <svg className={styles.svg}>\n <path className={cx(styles.stroke, styles.base)} d={path} />\n <path className={cx(styles.stroke, styles.first)} d={path} />\n <path className={cx(styles.stroke, styles.second)} d={path} />\n <path className={cx(styles.stroke, styles.third)} d={path} onAnimationEnd={onAnimationEnd} />\n </svg>\n <ChildComponentWithRef ref={childRef} />\n </div>\n );\n}\n\nexport default LabelCelebrationAnimation;\n\nfunction getPath({\n width,\n height,\n borderRadius = DEFAULT_BORDER_RADIUS,\n strokeWidth = DEFAULT_STROKE_WIDTH\n}: {\n width: number;\n height: number;\n borderRadius?: number;\n strokeWidth?: number;\n}) {\n const offset = strokeWidth / 2;\n\n return `M ${width - strokeWidth / 2}, ${borderRadius} V ${\n height - borderRadius\n } A ${borderRadius} ${borderRadius} 0 0 1 ${width - borderRadius} ${height - strokeWidth / 2} H ${\n borderRadius + offset\n } A ${borderRadius} ${borderRadius} 0 0 1 ${strokeWidth / 2} ${height - borderRadius} V ${\n borderRadius + offset\n } A ${borderRadius} ${borderRadius} 0 0 1 ${borderRadius} ${strokeWidth / 2} L ${width - borderRadius}, ${\n strokeWidth / 2\n } A ${borderRadius} ${borderRadius} 0 0 1 ${width - strokeWidth / 2} ${borderRadius} Z`;\n}\n\nfunction getPerimeter({\n width,\n height,\n borderRadius = DEFAULT_BORDER_RADIUS\n}: {\n width: number;\n height: number;\n borderRadius?: number;\n}) {\n const straightWidth = width - 2 borderRadius;\n const straightHeight = height - 2 * borderRadius;\n const cornerCircumference = 2 * Math.PI * borderRadius;\n return cornerCircumference + 2 * straightWidth + 2 * straightHeight;\n}\n"],"names":["DEFAULT_BORDER_RADIUS","DEFAULT_STROKE_WIDTH","LabelCelebrationAnimation","_ref","children","onAnimationEnd","wrapperRef","useRef","childRef","_useState","useState","_useState2","_slicedToArray","path","setPath","resizeObserverCallback","useCallback","_ref2","_ref3","borderBoxSize","height","blockSize","width","inlineSize","current","d","_ref4","_ref4$borderRadius","borderRadius","_ref4$strokeWidth","strokeWidth","offset","concat","getPath","perimeter","_ref5","_ref5$borderRadius","straightWidth","straightHeight","Math","PI","getPerimeter","style","setProperty","String","useResizeObserver","ref","callback","debounceTime","ChildComponentWithRef","forwardRef","_props","cloneElement","React","createElement","className","styles","celebration","svg","cx","stroke","base","first","second","third"],"mappings":"sTAKA,IAAMA,EAAwB,EACxBC,EAAuB,EAa7B,SAASC,EAAyBC,GAA6D,IAA1DC,EAAQD,EAARC,SAAUC,EAAcF,EAAdE,eACvCC,EAAaC,IACbC,EAAWD,IAEjBE,EAAwBC,IAAkBC,EAAAC,EAAAH,EAAA,GAAnCI,EAAIF,EAAA,GAAEG,EAAOH,EAAA,GAEdI,EAAyBC,GAC7B,SAAAC,GAAoF,IAClFC,EADcD,EAAbE,eACiE,CAAE,EAAjDC,EAAMF,EAAjBG,UAA+BC,EAAKJ,EAAjBK,WAE3B,GAAIjB,EAAWkB,QAAS,CACtB,IAAMC,EAqCd,SAAgBC,GAUf,IATCJ,EAAKI,EAALJ,MACAF,EAAMM,EAANN,OAAMO,EAAAD,EACNE,aAAAA,OAAe5B,IAAH2B,EAAG3B,EAAqB2B,EAAAE,EAAAH,EACpCI,YAAAA,OAAc7B,IAAH4B,EAAG5B,EAAoB4B,EAO5BE,EAASD,EAAc,EAE7B,MAAAE,KAAAA,OAAYV,EAAQQ,EAAc,EAACE,MAAAA,OAAKJ,EAAYI,OAAAA,OAClDZ,EAASQ,EACXI,OAAAA,OAAMJ,EAAYI,KAAAA,OAAIJ,EAAYI,WAAAA,OAAUV,EAAQM,EAAY,KAAAI,OAAIZ,EAASU,EAAc,EAAC,OAAAE,OAC1FJ,EAAeG,EACjB,OAAAC,OAAMJ,EAAY,KAAAI,OAAIJ,EAAY,WAAAI,OAAUF,EAAc,EAAC,KAAAE,OAAIZ,EAASQ,EAAYI,OAAAA,OAClFJ,EAAeG,EACjBC,OAAAA,OAAMJ,EAAYI,KAAAA,OAAIJ,EAAYI,WAAAA,OAAUJ,EAAYI,KAAAA,OAAIF,EAAc,EAACE,OAAAA,OAAMV,EAAQM,EAAY,MAAAI,OACnGF,EAAc,EAChB,OAAAE,OAAMJ,EAAY,KAAAI,OAAIJ,EAAY,WAAAI,OAAUV,EAAQQ,EAAc,EAAC,KAAAE,OAAIJ,EAAY,KACrF,CA3DkBK,CAAQ,CAAEX,MAAAA,EAAOF,OAAAA,IAC3BN,EAAQW,GAER,IAAMS,EA0Dd,SAAqBC,GAQpB,IAPCb,EAAKa,EAALb,MACAF,EAAMe,EAANf,OAAMgB,EAAAD,EACNP,aAAAA,OAAe5B,IAAHoC,EAAGpC,EAAqBoC,EAM9BC,EAAgBf,EAAQ,EAAIM,EAC5BU,EAAiBlB,EAAS,EAAIQ,EAEpC,OAD4B,EAAIW,KAAKC,GAAKZ,EACb,EAAIS,EAAgB,EAAIC,CACvD,CAvE0BG,CAAa,CAAEnB,MAAAA,EAAOF,OAAAA,IACxCd,EAAWkB,QAAQkB,MAAMC,YAAY,wBAAgCT,EAAPU,GAC/D,CACF,GACD,IAGFC,EAAkB,CAChBC,IAAKxC,EACLyC,SAAUhC,EACViC,aAAc,IAGhB,IAAMC,EAAwBC,GAAW,SAACC,EAAQL,GAAG,OACnDM,EAAahD,EAAU,CACrB0C,IAAAA,OAIJ,OACEO,EAAKC,cAAA,MAAA,CAAAC,UAAWC,EAAOC,YAAaX,IAAKxC,GACvC+C,EAAAC,cAAA,MAAA,CAAKC,UAAWC,EAAOE,KACrBL,EAAAC,cAAA,OAAA,CAAMC,UAAWI,EAAGH,EAAOI,OAAQJ,EAAOK,MAAOpC,EAAGZ,IACpDwC,EAAAC,cAAA,OAAA,CAAMC,UAAWI,EAAGH,EAAOI,OAAQJ,EAAOM,OAAQrC,EAAGZ,IACrDwC,EAAAC,cAAA,OAAA,CAAMC,UAAWI,EAAGH,EAAOI,OAAQJ,EAAOO,QAAStC,EAAGZ,IACtDwC,EAAMC,cAAA,OAAA,CAAAC,UAAWI,EAAGH,EAAOI,OAAQJ,EAAOQ,OAAQvC,EAAGZ,EAAMR,eAAgBA,KAE7EgD,EAACC,cAAAL,GAAsBH,IAAKtC,IAGlC"}

package/dist/src/components/Label/LabelCelebrationAnimation.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={celebration:"celebration_00c872463a",svg:"svg_d78d1d94c5",stroke:"stroke_982924740a","stroke-rotate":"stroke-rotate_c5aa76b955",base:"base_22ab14d96f",fade:"fade_da1ec813eb",first:"first_ff9bf81123",second:"second_e825ab1ecf",third:"third_ccea09a026","gradient-text-fill":"gradient-text-fill_a1b9d2c6de"};!function(e){const n="s_id-cc5df975abc6_3_34_2";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,a.firstChild?a.insertBefore(t,a.firstChild):a.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".celebration_00c872463a {\n  --container-perimeter: 840;\n  position: relative;\n}\n.celebration_00c872463a .svg_d78d1d94c5 {\n  position: absolute;\n  top: 0;\n  left: 0;\n  height: 100%;\n  width: 100%;\n}\n.celebration_00c872463a .svg_d78d1d94c5 .stroke_982924740a {\n  fill: none;\n  stroke-width: 1;\n  stroke-linecap: round;\n  stroke-linejoin: round;\n  animation: stroke-rotate_c5aa76b955 cubic-bezier(0.33, 0, 0.67, 1) forwards;\n  stroke-dasharray: var(--container-perimeter);\n  stroke-dashoffset: var(--container-perimeter);\n}\n.celebration_00c872463a .svg_d78d1d94c5 .stroke_982924740a.base_22ab14d96f {\n  stroke: var(--color-egg_yolk);\n  animation: fade_da1ec813eb 200ms linear forwards;\n  animation-delay: 80ms;\n  stroke-dasharray: 0;\n  stroke-dashoffset: 0;\n  opacity: 0;\n}\n.celebration_00c872463a .svg_d78d1d94c5 .stroke_982924740a.first_ff9bf81123 {\n  stroke: var(--color-done-green);\n  animation-delay: 80ms;\n  animation-duration: 320ms;\n}\n.celebration_00c872463a .svg_d78d1d94c5 .stroke_982924740a.second_e825ab1ecf {\n  stroke: var(--color-stuck-red);\n  animation-delay: 200ms;\n  animation-duration: 320ms;\n}\n.celebration_00c872463a .svg_d78d1d94c5 .stroke_982924740a.third_ccea09a026 {\n  stroke: var(--primary-color);\n  animation-delay: 360ms;\n  animation-duration: 320ms;\n}\n.celebration_00c872463a.celebration_00c872463a [data-celebration-text] {\n  background-size: 300% 100%;\n  background-repeat: no-repeat;\n  background-clip: text;\n  -webkit-background-clip: text;\n  color: transparent;\n  animation: gradient-text-fill_a1b9d2c6de 680ms linear forwards;\n  background-image: linear-gradient(to right, var(--primary-color) 30%, var(--color-stuck-red) 40%, var(--color-done-green) 60%, var(--color-egg_yolk) 85%, transparent 90%);\n}\n@keyframes fade_da1ec813eb {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n@keyframes stroke-rotate_c5aa76b955 {\n  to {\n    stroke-dashoffset: 0;\n  }\n}\n@keyframes gradient-text-fill_a1b9d2c6de {\n  from {\n    background-position: 150% 0;\n  }\n  to {\n    background-position: 0% 0;\n  }\n}");export{e as default};
+var e={celebration:"celebration_27f3b26387",svg:"svg_da41159a2f",stroke:"stroke_275590381e","stroke-rotate":"stroke-rotate_3dff3e8a20",base:"base_42fc58dc01",fade:"fade_da0ad7f568",first:"first_c30fa69dc5",second:"second_24455b5417",third:"third_d278365f25","gradient-text-fill":"gradient-text-fill_ff2045c6e5"};!function(e){const n="s_id-cc5df975abc6_3_35_0";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,a.firstChild?a.insertBefore(t,a.firstChild):a.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".celebration_27f3b26387 {\n  --container-perimeter: 840;\n  position: relative;\n}\n.celebration_27f3b26387 .svg_da41159a2f {\n  position: absolute;\n  top: 0;\n  left: 0;\n  height: 100%;\n  width: 100%;\n}\n.celebration_27f3b26387 .svg_da41159a2f .stroke_275590381e {\n  fill: none;\n  stroke-width: 1;\n  stroke-linecap: round;\n  stroke-linejoin: round;\n  animation: stroke-rotate_3dff3e8a20 cubic-bezier(0.33, 0, 0.67, 1) forwards;\n  stroke-dasharray: var(--container-perimeter);\n  stroke-dashoffset: var(--container-perimeter);\n}\n.celebration_27f3b26387 .svg_da41159a2f .stroke_275590381e.base_42fc58dc01 {\n  stroke: var(--color-egg_yolk);\n  animation: fade_da0ad7f568 200ms linear forwards;\n  animation-delay: 80ms;\n  stroke-dasharray: 0;\n  stroke-dashoffset: 0;\n  opacity: 0;\n}\n.celebration_27f3b26387 .svg_da41159a2f .stroke_275590381e.first_c30fa69dc5 {\n  stroke: var(--color-done-green);\n  animation-delay: 80ms;\n  animation-duration: 320ms;\n}\n.celebration_27f3b26387 .svg_da41159a2f .stroke_275590381e.second_24455b5417 {\n  stroke: var(--color-stuck-red);\n  animation-delay: 200ms;\n  animation-duration: 320ms;\n}\n.celebration_27f3b26387 .svg_da41159a2f .stroke_275590381e.third_d278365f25 {\n  stroke: var(--primary-color);\n  animation-delay: 360ms;\n  animation-duration: 320ms;\n}\n.celebration_27f3b26387.celebration_27f3b26387 [data-celebration-text] {\n  background-size: 300% 100%;\n  background-repeat: no-repeat;\n  background-clip: text;\n  -webkit-background-clip: text;\n  color: transparent;\n  animation: gradient-text-fill_ff2045c6e5 680ms linear forwards;\n  background-image: linear-gradient(to right, var(--primary-color) 30%, var(--color-stuck-red) 40%, var(--color-done-green) 60%, var(--color-egg_yolk) 85%, transparent 90%);\n}\n@keyframes fade_da0ad7f568 {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n@keyframes stroke-rotate_3dff3e8a20 {\n  to {\n    stroke-dashoffset: 0;\n  }\n}\n@keyframes gradient-text-fill_ff2045c6e5 {\n  from {\n    background-position: 150% 0;\n  }\n  to {\n    background-position: 0% 0;\n  }\n}");export{e as default};
 //# sourceMappingURL=LabelCelebrationAnimation.module.scss.js.map

package/dist/src/components/LayerProvider/LayerContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LayerContext.js","sources":["../../../../src/components/LayerProvider/LayerContext.ts"],"sourcesContent":["import React from \"react\";\n\nexport interface LayersContextType {\n layerRef: React.RefObject<HTMLElement>;\n}\n\nconst LayerContext = React.createContext<LayersContextType>({\n layerRef: null\n});\n\nexport default LayerContext;\n"],"names":["LayerContext","React","createContext","layerRef"],"mappings":"~~qBAMA~~,IAAMA,EAAeC,EAAMC,cAAiC,CAC1DC,SAAU"}
1	+ {"version":3,"file":"LayerContext.js","sources":["../../../../src/components/LayerProvider/LayerContext.ts"],"sourcesContent":["import React from \"react\";\n\nexport interface LayersContextType {\n /*\n A reference to the layer container element.\n */\n layerRef: React.RefObject<HTMLElement>;\n}\n\nconst LayerContext = React.createContext<LayersContextType>({\n layerRef: null\n});\n\nexport default LayerContext;\n"],"names":["LayerContext","React","createContext","layerRef"],"mappings":"qBASA,IAAMA,EAAeC,EAAMC,cAAiC,CAC1DC,SAAU"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"LayerProvider.js","sources":["../../../../src/components/LayerProvider/LayerProvider.tsx"],"sourcesContent":["import React, { FC, ReactNode, RefObject } from \"react\";\nimport LayerContext from \"./LayerContext\";\n\nexport interface LayerProviderType {\n children: ReactNode \| ReactNode;\n layerRef: RefObject<HTMLElement> \| null;\n}\n\nconst LayerProvider: FC<LayerProviderType> = ({ children, layerRef }) => {\n return <LayerContext.Provider value={{ layerRef }}>{children}</LayerContext.Provider>;\n};\n\nexport default LayerProvider;\n"],"names":["LayerProvider","_ref","React","createElement","LayerContext","Provider","value","layerRef","children"],"mappings":"~~sDAQA~~,IAAMA,EAAuC,SAA1BC,GACjB,OAAOC,EAACC,cAAAC,EAAaC,SAAS,CAAAC,MAAO,CAAEC,SADyBN,EAARM,WAAFN,EAARO,SAEhD"}
1	+ {"version":3,"file":"LayerProvider.js","sources":["../../../../src/components/LayerProvider/LayerProvider.tsx"],"sourcesContent":["import React, { FC, ReactNode, RefObject } from \"react\";\nimport LayerContext from \"./LayerContext\";\n\nexport interface LayerProviderType {\n /*\n The child elements.\n /\n children: ReactNode \| ReactNode[];\n /\n A reference to the layer container element.\n */\n layerRef: RefObject<HTMLElement> \| null;\n}\n\nconst LayerProvider: FC<LayerProviderType> = ({ children, layerRef }) => {\n return <LayerContext.Provider value={{ layerRef }}>{children}</LayerContext.Provider>;\n};\n\nexport default LayerProvider;\n"],"names":["LayerProvider","_ref","React","createElement","LayerContext","Provider","value","layerRef","children"],"mappings":"sDAcA,IAAMA,EAAuC,SAA1BC,GACjB,OAAOC,EAACC,cAAAC,EAAaC,SAAS,CAAAC,MAAO,CAAEC,SADyBN,EAARM,WAAFN,EAARO,SAEhD"}

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

@@ -1,2 +1,2 @@
-var n={container:"container_9738b1e7c6",overlay:"overlay_c201f32c47","overlay-fade-out":"overlay-fade-out_df53dd34d1","overlay-fade-in":"overlay-fade-in_da1ec813eb",dialog:"dialog_96fd68ff5f",default:"default_875f1c0c22",full:"full_542a0002e3",spacing:"spacing_3d1d81e758"};!function(n){const e="s_id-fe267e23c74c_3_34_2";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+e))return;const d=document.createElement("style");d.id=e,a.firstChild?a.insertBefore(d,a.firstChild):a.appendChild(d),d.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".container_9738b1e7c6,\n.overlay_c201f32c47 {\n  position: fixed;\n  inset: 0;\n}\n\n.container_9738b1e7c6 {\n  --monday-modal-z-index: 10000;\n  z-index: var(--monday-modal-z-index);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.container_9738b1e7c6[aria-hidden=true] {\n  display: none;\n}\n\n.container_9738b1e7c6[aria-hidden=true] .overlay_c201f32c47 {\n  background-color: transparent;\n  animation: overlay-fade-out_df53dd34d1 70ms var(--motion-timing-enter);\n}\n\n.overlay_c201f32c47 {\n  background-color: rgba(41, 47, 76, 0.7);\n  animation: overlay-fade-in_da1ec813eb 70ms var(--motion-timing-enter);\n}\n\n.dialog_96fd68ff5f {\n  display: flex;\n  position: relative;\n  flex-direction: column;\n  padding-block: var(--spacing-large);\n  padding-inline: var(--spacing-xl);\n  border-radius: var(--border-radius-big);\n  box-shadow: var(--box-shadow-large);\n  background-color: var(--secondary-background-color);\n  max-height: 90vh;\n  max-width: 90vw;\n}\n\n.dialog_96fd68ff5f.default_875f1c0c22 {\n  width: 520px;\n}\n\n.dialog_96fd68ff5f.full_542a0002e3 {\n  width: 100vw;\n}\n\n.dialog_96fd68ff5f.spacing_3d1d81e758 {\n  gap: var(--spacing-medium);\n}\n\n@keyframes overlay-fade-in_da1ec813eb {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n\n@keyframes overlay-fade-out_df53dd34d1 {\n  from {\n    opacity: 1;\n  }\n  to {\n    opacity: 0;\n  }\n}");export{n as default};
+var n={container:"container_3892b25086",overlay:"overlay_56b3744fcf","overlay-fade-out":"overlay-fade-out_c215973e51","overlay-fade-in":"overlay-fade-in_da0ad7f568",dialog:"dialog_74b23e926a",default:"default_1e498694d9",full:"full_0937788ceb",spacing:"spacing_342851ec25"};!function(n){const e="s_id-fe267e23c74c_3_35_0";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+e))return;const o=document.createElement("style");o.id=e,a.firstChild?a.insertBefore(o,a.firstChild):a.appendChild(o),o.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".container_3892b25086,\n.overlay_56b3744fcf {\n  position: fixed;\n  inset: 0;\n}\n\n.container_3892b25086 {\n  --monday-modal-z-index: 10000;\n  z-index: var(--monday-modal-z-index);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.container_3892b25086[aria-hidden=true] {\n  display: none;\n}\n\n.container_3892b25086[aria-hidden=true] .overlay_56b3744fcf {\n  background-color: transparent;\n  animation: overlay-fade-out_c215973e51 70ms var(--motion-timing-enter);\n}\n\n.overlay_56b3744fcf {\n  background-color: rgba(41, 47, 76, 0.7);\n  animation: overlay-fade-in_da0ad7f568 70ms var(--motion-timing-enter);\n}\n\n.dialog_74b23e926a {\n  display: flex;\n  position: relative;\n  flex-direction: column;\n  padding-block: var(--spacing-large);\n  padding-inline: var(--spacing-xl);\n  border-radius: var(--border-radius-big);\n  box-shadow: var(--box-shadow-large);\n  background-color: var(--secondary-background-color);\n  max-height: 90vh;\n  max-width: 90vw;\n}\n\n.dialog_74b23e926a.default_1e498694d9 {\n  width: 520px;\n}\n\n.dialog_74b23e926a.full_0937788ceb {\n  width: 100vw;\n}\n\n.dialog_74b23e926a.spacing_342851ec25 {\n  gap: var(--spacing-medium);\n}\n\n@keyframes overlay-fade-in_da0ad7f568 {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n\n@keyframes overlay-fade-out_c215973e51 {\n  from {\n    opacity: 1;\n  }\n  to {\n    opacity: 0;\n  }\n}");export{n as default};
 //# sourceMappingURL=LegacyModal.module.scss.js.map

package/dist/src/components/LegacyModal/LegacyModalContent/LegacyModalContent.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={container:"container_68b9c46a63"};!function(e){const n="s_id-40a1f8a37338_3_34_2";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const o=document.createElement("style");o.id=n,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".container_68b9c46a63 {\n  flex-grow: 1;\n  overflow: auto;\n}\n.container_68b9c46a63::-webkit-scrollbar {\n  width: 4px;\n  height: 6px;\n}\n.container_68b9c46a63::-webkit-scrollbar-thumb {\n  background-color: var(--ui-border-color);\n  border-radius: 4px;\n}");export{e as default};
+var e={container:"container_c4c2f825ec"};!function(e){const n="s_id-40a1f8a37338_3_35_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const c=document.createElement("style");c.id=n,t.firstChild?t.insertBefore(c,t.firstChild):t.appendChild(c),c.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".container_c4c2f825ec {\n  flex-grow: 1;\n  overflow: auto;\n}\n.container_c4c2f825ec::-webkit-scrollbar {\n  width: 4px;\n  height: 6px;\n}\n.container_c4c2f825ec::-webkit-scrollbar-thumb {\n  background-color: var(--ui-border-color);\n  border-radius: 4px;\n}");export{e as default};
 //# sourceMappingURL=LegacyModalContent.module.scss.js.map

package/dist/src/components/LegacyModal/LegacyModalFooter/LegacyModalFooter.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={container:"container_74f268eaf0"};!function(e){const t="s_id-9ff7e713f88b_3_34_2";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const a=document.createElement("style");a.id=t,n.firstChild?n.insertBefore(a,n.firstChild):n.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".container_74f268eaf0 {\n  margin-block-start: var(--spacing-large);\n}");export{e as default};
+var e={container:"container_ef87c6010d"};!function(e){const t="s_id-9ff7e713f88b_3_35_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const d=document.createElement("style");d.id=t,n.firstChild?n.insertBefore(d,n.firstChild):n.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".container_ef87c6010d {\n  margin-block-start: var(--spacing-large);\n}");export{e as default};
 //# sourceMappingURL=LegacyModalFooter.module.scss.js.map

package/dist/src/components/LegacyModal/LegacyModalHeader/LegacyModalHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LegacyModalHeader.js","sources":["../../../../../src/components/LegacyModal/LegacyModalHeader/LegacyModalHeader.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport cx from \"classnames\";\nimport IconButton from \"../../IconButton/IconButton\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport Icon from \"../../Icon/Icon\";\nimport VibeComponentProps from \"../../../types/VibeComponentProps\";\nimport { NOOP } from \"../../../utils/function-utils\";\nimport { ElementContent } from \"src/types/ElementContent\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\nimport Text from \"../../Text/Text\";\nimport Heading from \"../../Heading/Heading\";\nimport Flex from \"../../Flex/Flex\";\nimport styles from \"./LegacyModalHeader.module.scss\";\nimport { SubIcon } from \"../../../types/SubIcon\";\n\ninterface BaseLegacyModalHeaderProps extends VibeComponentProps {\n /*\n Description of the modal - pure string description is a recommended standard, use JSX ability only if there is a need to add links\n /\n description?: ElementContent;\n /\n Icon to be rendered before the title\n /\n // icon?: string \| React.FunctionComponent<IconSubComponentProps> \| null;\n icon?: SubIcon;\n /\n Class name for the ~~wrapper\n /\n className?: string;\n /\n Class name for the~~ title\n /\n titleClassName?: string;\n /\n closes the Modal. No need to provide it, it is being provided by the modal\n /\n closeModal?: () => void;\n /* /*\n ID for the title, needed for accessibility. No need to provide it, it is being provided by the modal\n /\n id?: string;\n /\n Class name for the description\n /\n descriptionClassName?: string;\n /\n Size of the icon\n /\n iconSize?: number;\n /\n class name for the icon\n /\n iconClassName?: string;\n /\n Aria label for the close button\n */\n closeButtonAriaLabel?: string;\n}\n\ninterface LegacyModalHeaderWithOnlyTitle extends BaseLegacyModalHeaderProps {\n title: ElementContent;\n children?: never;\n}\n\ninterface LegacyModalHeaderWithOnlyChildren extends BaseLegacyModalHeaderProps {\n title?: never;\n children: ElementContent;\n}\n\nexport type LegacyModalHeaderProps = LegacyModalHeaderWithOnlyTitle \| LegacyModalHeaderWithOnlyChildren;\n\nconst LegacyModalHeader: FC<LegacyModalHeaderProps> = ({\n className,\n title,\n children,\n titleClassName,\n description = \"\",\n descriptionClassName,\n icon,\n closeModal = NOOP,\n iconSize = 24,\n iconClassName,\n closeButtonAriaLabel = \"close\",\n id,\n \"data-testid\": dataTestId\n}) => {\n return (\n <div\n className={cx(styles.container, className)}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.MODAL_HEADER, id)}\n >\n {children ? (\n children\n ) : (\n <Flex align=\"start\" gap=\"small\" className={titleClassName}>\n {icon && (\n <Icon\n className={cx(styles.icon, iconClassName)}\n icon={icon}\n iconType=\"svg\"\n iconSize={iconSize}\n ignoreFocusStyle\n />\n )}\n <Heading id={id} maxLines={2}>\n {title}\n </Heading>\n </Flex>\n )}\n {description && (\n <Text type=\"text2\" maxLines={2} className={cx(styles.description, descriptionClassName)}>\n {description}\n </Text>\n )}\n\n <div className={cx(styles.closeButton)}>\n <IconButton\n key=\"xxs\"\n onClick={closeModal}\n ariaLabel={closeButtonAriaLabel}\n icon={CloseSmall}\n kind=\"tertiary\"\n size=\"small\"\n />\n </div>\n </div>\n );\n};\n\nObject.assign(LegacyModalHeader, {\n displayName: \"ModalHeader\"\n});\n\nexport default LegacyModalHeader;\n"],"names":["LegacyModalHeader","_ref","title","children","titleClassName","_ref$description","description","descriptionClassName","icon","_ref$closeModal","closeModal","NOOP","_ref$iconSize","iconSize","iconClassName","_ref$closeButtonAriaL","closeButtonAriaLabel","id","dataTestId","React","className","cx","styles","container","getTestId","ComponentDefaultTestId","MODAL_HEADER","createElement","Flex","align","gap","Icon","iconType","ignoreFocusStyle","Heading","maxLines","Text","type","closeButton","IconButton","key","onClick","ariaLabel","CloseSmall","kind","size","Object","assign","displayName"],"mappings":"~~0gBAwEA~~,IAAMA,EAAgD,SAA/BC,GAclB,IAZHC,EAAKD,EAALC,MACAC,EAAQF,EAARE,SACAC,EAAcH,EAAdG,eAAcC,EAAAJ,EACdK,YAAAA,OAAc,IAAHD,EAAG,GAAEA,EAChBE,EAAoBN,EAApBM,qBACAC,EAAIP,EAAJO,KAAIC,EAAAR,EACJS,WAAAA,OAAaC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAX,EACjBY,SAAAA,OAAW,IAAHD,EAAG,GAAEA,EACbE,EAAab,EAAba,cAAaC,EAAAd,EACbe,qBAAAA,OAAuB,IAAHD,EAAG,QAAOA,EAC9BE,EAAEhB,EAAFgB,GACeC,EAAUjB,EAAzB,eAEA,OACEkB,uBACEC,UAAWC,EAAGC,EAAOC,UAhBhBtB,EAATmB,WAiBiB,cAAAF,GAAcM,EAAUC,EAAuBC,aAAcT,IAEzEd,GAGCgB,EAAAQ,cAACC,EAAK,CAAAC,MAAM,QAAQC,IAAI,QAAQV,UAAWhB,GACxCI,GACCW,EAACQ,cAAAI,EACC,CAAAX,UAAWC,EAAGC,EAAOd,KAAMM,GAC3BN,KAAMA,EACNwB,SAAS,MACTnB,SAAUA,EACVoB,sBAGJd,EAAAQ,cAACO,EAAO,CAACjB,GAAIA,EAAIkB,SAAU,GACxBjC,IAINI,GACCa,EAAAQ,cAACS,EAAI,CAACC,KAAK,QAAQF,SAAU,EAAGf,UAAWC,EAAGC,EAAOhB,YAAaC,IAC/DD,GAILa,EAAAQ,cAAA,MAAA,CAAKP,UAAWC,EAAGC,EAAOgB,cACxBnB,EAAAQ,cAACY,EAAU,CACTC,IAAI,MACJC,QAAS/B,EACTgC,UAAW1B,EACXR,KAAMmC,EACNC,KAAK,WACLC,KAAK,WAKf,EAEAC,OAAOC,OAAO/C,EAAmB,CAC/BgD,YAAa"}
1	+ {"version":3,"file":"LegacyModalHeader.js","sources":["../../../../../src/components/LegacyModal/LegacyModalHeader/LegacyModalHeader.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport cx from \"classnames\";\nimport IconButton from \"../../IconButton/IconButton\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport Icon from \"../../Icon/Icon\";\nimport VibeComponentProps from \"../../../types/VibeComponentProps\";\nimport { NOOP } from \"../../../utils/function-utils\";\nimport { ElementContent } from \"src/types/ElementContent\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\nimport Text from \"../../Text/Text\";\nimport Heading from \"../../Heading/Heading\";\nimport Flex from \"../../Flex/Flex\";\nimport styles from \"./LegacyModalHeader.module.scss\";\nimport { SubIcon } from \"../../../types/SubIcon\";\n\ninterface BaseLegacyModalHeaderProps extends VibeComponentProps {\n /*\n Description of the modal - pure string description is a recommended standard, use JSX ability only if there is a need to add links\n /\n description?: ElementContent;\n /\n Icon to be rendered before the title\n /\n // icon?: string \| React.FunctionComponent<IconSubComponentProps> \| null;\n icon?: SubIcon;\n /\n Class name for the title\n /\n titleClassName?: string;\n /\n closes the Modal. No need to provide it, it is being provided by the modal\n /\n closeModal?: () => void;\n /\n Class name for the description\n /\n descriptionClassName?: string;\n /\n Size of the icon\n /\n iconSize?: number;\n /\n class name for the icon\n /\n iconClassName?: string;\n /\n Aria label for the close button\n */\n closeButtonAriaLabel?: string;\n}\n\ninterface LegacyModalHeaderWithOnlyTitle extends BaseLegacyModalHeaderProps {\n title: ElementContent;\n children?: never;\n}\n\ninterface LegacyModalHeaderWithOnlyChildren extends BaseLegacyModalHeaderProps {\n title?: never;\n children: ElementContent;\n}\n\nexport type LegacyModalHeaderProps = LegacyModalHeaderWithOnlyTitle \| LegacyModalHeaderWithOnlyChildren;\n\nconst LegacyModalHeader: FC<LegacyModalHeaderProps> = ({\n className,\n title,\n children,\n titleClassName,\n description = \"\",\n descriptionClassName,\n icon,\n closeModal = NOOP,\n iconSize = 24,\n iconClassName,\n closeButtonAriaLabel = \"close\",\n id,\n \"data-testid\": dataTestId\n}) => {\n return (\n <div\n className={cx(styles.container, className)}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.MODAL_HEADER, id)}\n >\n {children ? (\n children\n ) : (\n <Flex align=\"start\" gap=\"small\" className={titleClassName}>\n {icon && (\n <Icon\n className={cx(styles.icon, iconClassName)}\n icon={icon}\n iconType=\"svg\"\n iconSize={iconSize}\n ignoreFocusStyle\n />\n )}\n <Heading id={id} maxLines={2}>\n {title}\n </Heading>\n </Flex>\n )}\n {description && (\n <Text type=\"text2\" maxLines={2} className={cx(styles.description, descriptionClassName)}>\n {description}\n </Text>\n )}\n\n <div className={cx(styles.closeButton)}>\n <IconButton\n key=\"xxs\"\n onClick={closeModal}\n ariaLabel={closeButtonAriaLabel}\n icon={CloseSmall}\n kind=\"tertiary\"\n size=\"small\"\n />\n </div>\n </div>\n );\n};\n\nObject.assign(LegacyModalHeader, {\n displayName: \"ModalHeader\"\n});\n\nexport default LegacyModalHeader;\n"],"names":["LegacyModalHeader","_ref","title","children","titleClassName","_ref$description","description","descriptionClassName","icon","_ref$closeModal","closeModal","NOOP","_ref$iconSize","iconSize","iconClassName","_ref$closeButtonAriaL","closeButtonAriaLabel","id","dataTestId","React","className","cx","styles","container","getTestId","ComponentDefaultTestId","MODAL_HEADER","createElement","Flex","align","gap","Icon","iconType","ignoreFocusStyle","Heading","maxLines","Text","type","closeButton","IconButton","key","onClick","ariaLabel","CloseSmall","kind","size","Object","assign","displayName"],"mappings":"0gBAgEA,IAAMA,EAAgD,SAA/BC,GAclB,IAZHC,EAAKD,EAALC,MACAC,EAAQF,EAARE,SACAC,EAAcH,EAAdG,eAAcC,EAAAJ,EACdK,YAAAA,OAAc,IAAHD,EAAG,GAAEA,EAChBE,EAAoBN,EAApBM,qBACAC,EAAIP,EAAJO,KAAIC,EAAAR,EACJS,WAAAA,OAAaC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAX,EACjBY,SAAAA,OAAW,IAAHD,EAAG,GAAEA,EACbE,EAAab,EAAba,cAAaC,EAAAd,EACbe,qBAAAA,OAAuB,IAAHD,EAAG,QAAOA,EAC9BE,EAAEhB,EAAFgB,GACeC,EAAUjB,EAAzB,eAEA,OACEkB,uBACEC,UAAWC,EAAGC,EAAOC,UAhBhBtB,EAATmB,WAiBiB,cAAAF,GAAcM,EAAUC,EAAuBC,aAAcT,IAEzEd,GAGCgB,EAAAQ,cAACC,EAAK,CAAAC,MAAM,QAAQC,IAAI,QAAQV,UAAWhB,GACxCI,GACCW,EAACQ,cAAAI,EACC,CAAAX,UAAWC,EAAGC,EAAOd,KAAMM,GAC3BN,KAAMA,EACNwB,SAAS,MACTnB,SAAUA,EACVoB,sBAGJd,EAAAQ,cAACO,EAAO,CAACjB,GAAIA,EAAIkB,SAAU,GACxBjC,IAINI,GACCa,EAAAQ,cAACS,EAAI,CAACC,KAAK,QAAQF,SAAU,EAAGf,UAAWC,EAAGC,EAAOhB,YAAaC,IAC/DD,GAILa,EAAAQ,cAAA,MAAA,CAAKP,UAAWC,EAAGC,EAAOgB,cACxBnB,EAAAQ,cAACY,EAAU,CACTC,IAAI,MACJC,QAAS/B,EACTgC,UAAW1B,EACXR,KAAMmC,EACNC,KAAK,WACLC,KAAK,WAKf,EAEAC,OAAOC,OAAO/C,EAAmB,CAC/BgD,YAAa"}

package/dist/src/components/LegacyModal/LegacyModalHeader/LegacyModalHeader.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={container:"container_c0206bb5be",icon:"icon_01f2ea1d60",description:"description_ea8d2f5bc2",closeButton:"closeButton_086ac613ac"};!function(e){const n="s_id-f34f7b91e8f3_3_34_2";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const c=document.createElement("style");c.id=n,t.firstChild?t.insertBefore(c,t.firstChild):t.appendChild(c),c.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".container_c0206bb5be {\n  margin-block-start: var(--spacing-medium);\n}\n.container_c0206bb5be .icon_01f2ea1d60 {\n  margin-top: var(--spacing-xs);\n  flex-shrink: 0;\n  color: var(--primary-text-color);\n}\n.container_c0206bb5be .description_ea8d2f5bc2 {\n  margin-block-start: var(--spacing-small);\n  color: var(--secondary-text-color);\n}\n.container_c0206bb5be .closeButton_086ac613ac {\n  position: absolute;\n  right: 20px;\n  top: 20px;\n}");export{e as default};
+var e={container:"container_b937cf24a7",icon:"icon_4b4f8ae184",description:"description_c8ece0d2b9",closeButton:"closeButton_94471bef24"};!function(e){const n="s_id-f34f7b91e8f3_3_35_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const o=document.createElement("style");o.id=n,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".container_b937cf24a7 {\n  margin-block-start: var(--spacing-medium);\n}\n.container_b937cf24a7 .icon_4b4f8ae184 {\n  margin-top: var(--spacing-xs);\n  flex-shrink: 0;\n  color: var(--primary-text-color);\n}\n.container_b937cf24a7 .description_c8ece0d2b9 {\n  margin-block-start: var(--spacing-small);\n  color: var(--secondary-text-color);\n}\n.container_b937cf24a7 .closeButton_94471bef24 {\n  position: absolute;\n  right: 20px;\n  top: 20px;\n}");export{e as default};
 //# sourceMappingURL=LegacyModalHeader.module.scss.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Link.js","sources":["../../../../src/components/Link/Link.tsx"],"sourcesContent":["import { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { forwardRef, useCallback } from \"react\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport Icon from \"../Icon/Icon\";\nimport { IconPosition as IconPositionEnum, LinkTarget as LinkTargetEnum } from \"./LinkConsts\";\nimport { LinkColor, LinkIconPosition, LinkTarget } from \"./Link.types\";\nimport { SubIcon, VibeComponent, VibeComponentProps, withStaticProps } from \"../../types\";\nimport styles from \"./Link.module.scss\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { camelCase } from \"lodash-es\";\n\nexport interface LinkProps extends VibeComponentProps {\n /*\n Class name ~~for~~ ~~overriding~~ link text ~~styles\~~n /\n textClassName?: string;\n /* ~~Specifies~~ ~~the location (~~URL) of the ~~external~~ ~~resource~~ /\n href?: string;\n /* The ~~link~~ text /\n text?: string;\n /* ~~Defines~~ the relationship between a ~~linked~~ ~~resource~~ and the ~~current~~ ~~document~~ /\n rel?: string;\n /* ~~onClick~~ ~~function~~ - ~~MouseEvent~~ /\n onClick?: (event: React.MouseEvent) => void;\n /* Specifies where to open the linked document /\n target?: LinkTarget;\n /* ~~Aria~~ label description /\n ariaLabelDescription?: string;\n /* ~~Identifies~~ the element ~~(or elements)~~ that describes ~~the~~ ~~element on which the attribute is set.~~ /\n ariaDescribedby?: string;\n /* ~~element~~ id to ~~describe~~ the ~~counter~~ ~~accordingly~~ /\n ariaLabeledBy?: string;\n /* Icon to ~~add~~ to the link ~~element~~ /\n icon?: SubIcon;\n /* ~~the~~ position of the icon in ~~relation~~ to the text /\n iconPosition?: LinkIconPosition;\n /* ~~disable~~ navigation /\n disableNavigation?: boolean;\n /* ~~inherit~~ text size /\n inheritFontSize?: boolean;\n /* if the link is in ~~part~~ of ~~other~~ text content /\n inlineText?: boolean;\n /* The link's color style */\n color?: LinkColor;\n}\n\nconst Link: VibeComponent<LinkProps, HTMLAnchorElement> & {\n targets?: typeof LinkTargetEnum;\n iconPositions?: typeof IconPositionEnum;\n position?: typeof IconPositionEnum;\n} = forwardRef(\n (\n {\n className,\n textClassName,\n href = \"\",\n text = \"\",\n rel = \"noreferrer\",\n onClick = NOOP,\n target = \"_blank\",\n ariaLabelDescription = \"\",\n color = \"primary\",\n ariaDescribedby = \"\",\n icon = \"\",\n iconPosition = \"start\",\n id = \"\",\n ariaLabeledBy = \"\",\n disableNavigation = false,\n inheritFontSize = false,\n inlineText = false,\n \"data-testid\": dataTestId\n }: LinkProps,\n ref: React.ForwardedRef<HTMLAnchorElement>\n ) => {\n const isStart = iconPosition === \"start\";\n\n const onClickWrapper = useCallback(\n (e: React.MouseEvent<HTMLElement>) => {\n if (disableNavigation) {\n e.preventDefault();\n }\n onClick && onClick(e);\n },\n [disableNavigation, onClick]\n );\n\n return (\n <a\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.LINK, id)}\n id={id}\n href={href}\n rel={rel}\n ref={ref}\n onClick={onClickWrapper}\n target={target}\n className={cx(styles.link, className, getStyle(styles, camelCase(\"color-\" + color)), {\n [styles.inheritFontSize]: inheritFontSize,\n [styles.inlineText]: inlineText\n })}\n aria-label={ariaLabelDescription}\n aria-describedby={ariaDescribedby}\n aria-labelledby={ariaLabeledBy}\n >\n {getIcon(isStart, icon, cx(styles.iconStart))}\n <span className={cx(styles.text, textClassName)}>{text}</span>\n {getIcon(!isStart, icon, cx(styles.iconEnd))}\n </a>\n );\n }\n);\n\nfunction getIcon(shouldShow: boolean, icon: string \| React.FunctionComponent \| null, className: string) {\n if (!shouldShow) return;\n return <Icon className={className} icon={icon} iconType=\"font\" />;\n}\n\nexport default withStaticProps(Link, {\n position: IconPositionEnum,\n iconPositions: IconPositionEnum,\n targets: LinkTargetEnum\n});\n"],"names":["getIcon","shouldShow","icon","className","React","createElement","Icon","iconType","withStaticProps","forwardRef","_ref","ref","textClassName","_ref$href","href","_ref$text","text","_ref$rel","rel","_ref$onClick","onClick","NOOP","_ref$target","target","_ref$ariaLabelDescrip","ariaLabelDescription","_ref$color","color","_ref$ariaDescribedby","ariaDescribedby","_ref$icon","_ref$iconPosition","iconPosition","_ref$id","id","_ref$ariaLabeledBy","ariaLabeledBy","_ref$disableNavigatio","disableNavigation","_ref$inheritFontSize","inheritFontSize","_ref$inlineText","inlineText","dataTestId","isStart","onClickWrapper","useCallback","e","preventDefault","getTestId","ComponentDefaultTestId","LINK","cx","styles","link","getStyle","camelCase","_defineProperty","iconStart","iconEnd","position","IconPositionEnum","iconPositions","targets","LinkTargetEnum"],"mappings":"~~4nBAgHA~~,SAASA,EAAQC,EAAqBC,EAA+CC,GACnF,GAAKF,EACL,OAAOG,EAACC,cAAAC,EAAK,CAAAH,UAAWA,EAAWD,KAAMA,EAAMK,SAAS,QAC1D,CAEA,IAAeC,EAAAA,EAlEXC,GACF,SAAAC,EAqBEC,GACE,IApBAR,EAASO,EAATP,UACAS,EAAaF,EAAbE,cAAaC,EAAAH,EACbI,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EAAAE,EAAAL,EACTM,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EAAAE,EAAAP,EACTQ,IAAAA,OAAM,IAAHD,EAAG,aAAYA,EAAAE,EAAAT,EAClBU,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAZ,EACda,OAAAA,OAAS,IAAHD,EAAG,SAAQA,EAAAE,EAAAd,EACjBe,qBAAAA,OAAuB,IAAHD,EAAG,GAAEA,EAAAE,EAAAhB,EACzBiB,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EAAAE,EAAAlB,EACjBmB,gBAAAA,OAAkB,IAAHD,EAAG,GAAEA,EAAAE,EAAApB,EACpBR,KAAAA,OAAO,IAAH4B,EAAG,GAAEA,EAAAC,EAAArB,EACTsB,aAAsBC,EAAAvB,EACtBwB,GAAAA,OAAK,IAAHD,EAAG,GAAEA,EAAAE,EAAAzB,EACP0B,cAAAA,OAAgB,IAAHD,EAAG,GAAEA,EAAAE,EAAA3B,EAClB4B,kBAAAA,OAAoB,IAAHD,GAAQA,EAAAE,EAAA7B,EACzB8B,gBAAAA,OAAkB,IAAHD,GAAQA,EAAAE,EAAA/B,EACvBgC,WAAAA,OAAa,IAAHD,GAAQA,EACHE,EAAUjC,EAAzB,eAIIkC,EAA2B,gBAVhB,IAAHb,EAAG,QAAOA,GAYlBc,EAAiBC,GACrB,SAACC,GACKT,GACFS,EAAEC,iBAEJ5B,GAAWA,EAAQ2B,EACrB,GACA,CAACT,EAAmBlB,IAGtB,OACEhB,EACeC,cAAA,IAAA,CAAA,cAAAsC,GAAcM,EAAUC,EAAuBC,KAAMjB,GAClEA,GAAIA,EACJpB,KAAMA,EACNI,IAAKA,EACLP,IAAKA,EACLS,QAASyB,EACTtB,OAAQA,EACRpB,UAAWiD,EAAGC,EAAOC,KAAMnD,EAAWoD,EAASF,EAAQG,EAAU,SAAW7B,IAAO8B,EAAAA,EAAA,CAAA,EAChFJ,EAAOb,gBAAkBA,GACzBa,EAAOX,WAAaA,IAEX,aAAAjB,EACM,mBAAAI,oBACDO,GAEhBpC,EAAQ4C,EAAS1C,EAAMkD,EAAGC,EAAOK,YAClCtD,EAAAC,cAAA,OAAA,CAAMF,UAAWiD,EAAGC,EAAOrC,KAAMJ,IAAiBI,GACjDhB,GAAS4C,EAAS1C,EAAMkD,EAAGC,EAAOM,UAGzC,IAQmC,CACnCC,SAAUC,EACVC,cAAeD,EACfE,QAASC"}
1	+ {"version":3,"file":"Link.js","sources":["../../../../src/components/Link/Link.tsx"],"sourcesContent":["import { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { forwardRef, useCallback } from \"react\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport Icon from \"../Icon/Icon\";\nimport { IconPosition as IconPositionEnum, LinkTarget as LinkTargetEnum } from \"./LinkConsts\";\nimport { LinkColor, LinkIconPosition, LinkTarget } from \"./Link.types\";\nimport { SubIcon, VibeComponent, VibeComponentProps, withStaticProps } from \"../../types\";\nimport styles from \"./Link.module.scss\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { camelCase } from \"lodash-es\";\n\nexport interface LinkProps extends VibeComponentProps {\n /*\n Class name applied to the link text.\n /\n textClassName?: string;\n /\n The URL the link points to.\n /\n href?: string;\n /\n The text content of the link.\n /\n text?: string;\n /\n Specifies the relationship between the current document and the linked resource.\n /\n rel?: string;\n /\n Callback fired when the link is clicked.\n /\n onClick?: (event: React.MouseEvent) => void;\n /\n Specifies where to open the linked document.\n /\n target?: LinkTarget;\n /\n The ARIA label description for accessibility.\n /\n ariaLabelDescription?: string;\n /\n The ID of the element that describes this link.\n /\n ariaDescribedby?: string;\n /\n The ID of the element labeling this link.\n /\n ariaLabeledBy?: string;\n /\n Icon displayed next to the link text.\n /\n icon?: SubIcon;\n /\n The position of the icon relative to the text.\n /\n iconPosition?: LinkIconPosition;\n /\n If true, disables navigation when the link is clicked.\n /\n disableNavigation?: boolean;\n /\n If true, the link inherits the surrounding text's font size.\n /\n inheritFontSize?: boolean;\n /\n If true, the link is styled to fit within inline text content.\n /\n inlineText?: boolean;\n /* The link's color style */\n color?: LinkColor;\n}\n\nconst Link: VibeComponent<LinkProps, HTMLAnchorElement> & {\n targets?: typeof LinkTargetEnum;\n iconPositions?: typeof IconPositionEnum;\n position?: typeof IconPositionEnum;\n} = forwardRef(\n (\n {\n className,\n textClassName,\n href = \"\",\n text = \"\",\n rel = \"noreferrer\",\n onClick = NOOP,\n target = \"_blank\",\n ariaLabelDescription = \"\",\n color = \"primary\",\n ariaDescribedby = \"\",\n icon = \"\",\n iconPosition = \"start\",\n id = \"\",\n ariaLabeledBy = \"\",\n disableNavigation = false,\n inheritFontSize = false,\n inlineText = false,\n \"data-testid\": dataTestId\n }: LinkProps,\n ref: React.ForwardedRef<HTMLAnchorElement>\n ) => {\n const isStart = iconPosition === \"start\";\n\n const onClickWrapper = useCallback(\n (e: React.MouseEvent<HTMLElement>) => {\n if (disableNavigation) {\n e.preventDefault();\n }\n onClick && onClick(e);\n },\n [disableNavigation, onClick]\n );\n\n return (\n <a\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.LINK, id)}\n id={id}\n href={href}\n rel={rel}\n ref={ref}\n onClick={onClickWrapper}\n target={target}\n className={cx(styles.link, className, getStyle(styles, camelCase(\"color-\" + color)), {\n [styles.inheritFontSize]: inheritFontSize,\n [styles.inlineText]: inlineText\n })}\n aria-label={ariaLabelDescription}\n aria-describedby={ariaDescribedby}\n aria-labelledby={ariaLabeledBy}\n >\n {getIcon(isStart, icon, cx(styles.iconStart))}\n <span className={cx(styles.text, textClassName)}>{text}</span>\n {getIcon(!isStart, icon, cx(styles.iconEnd))}\n </a>\n );\n }\n);\n\nfunction getIcon(shouldShow: boolean, icon: string \| React.FunctionComponent \| null, className: string) {\n if (!shouldShow) return;\n return <Icon className={className} icon={icon} iconType=\"font\" />;\n}\n\nexport default withStaticProps(Link, {\n position: IconPositionEnum,\n iconPositions: IconPositionEnum,\n targets: LinkTargetEnum\n});\n"],"names":["getIcon","shouldShow","icon","className","React","createElement","Icon","iconType","withStaticProps","forwardRef","_ref","ref","textClassName","_ref$href","href","_ref$text","text","_ref$rel","rel","_ref$onClick","onClick","NOOP","_ref$target","target","_ref$ariaLabelDescrip","ariaLabelDescription","_ref$color","color","_ref$ariaDescribedby","ariaDescribedby","_ref$icon","_ref$iconPosition","iconPosition","_ref$id","id","_ref$ariaLabeledBy","ariaLabeledBy","_ref$disableNavigatio","disableNavigation","_ref$inheritFontSize","inheritFontSize","_ref$inlineText","inlineText","dataTestId","isStart","onClickWrapper","useCallback","e","preventDefault","getTestId","ComponentDefaultTestId","LINK","cx","styles","link","getStyle","camelCase","_defineProperty","iconStart","iconEnd","position","IconPositionEnum","iconPositions","targets","LinkTargetEnum"],"mappings":"4nBA0IA,SAASA,EAAQC,EAAqBC,EAA+CC,GACnF,GAAKF,EACL,OAAOG,EAACC,cAAAC,EAAK,CAAAH,UAAWA,EAAWD,KAAMA,EAAMK,SAAS,QAC1D,CAEA,IAAeC,EAAAA,EAlEXC,GACF,SAAAC,EAqBEC,GACE,IApBAR,EAASO,EAATP,UACAS,EAAaF,EAAbE,cAAaC,EAAAH,EACbI,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EAAAE,EAAAL,EACTM,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EAAAE,EAAAP,EACTQ,IAAAA,OAAM,IAAHD,EAAG,aAAYA,EAAAE,EAAAT,EAClBU,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAZ,EACda,OAAAA,OAAS,IAAHD,EAAG,SAAQA,EAAAE,EAAAd,EACjBe,qBAAAA,OAAuB,IAAHD,EAAG,GAAEA,EAAAE,EAAAhB,EACzBiB,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EAAAE,EAAAlB,EACjBmB,gBAAAA,OAAkB,IAAHD,EAAG,GAAEA,EAAAE,EAAApB,EACpBR,KAAAA,OAAO,IAAH4B,EAAG,GAAEA,EAAAC,EAAArB,EACTsB,aAAsBC,EAAAvB,EACtBwB,GAAAA,OAAK,IAAHD,EAAG,GAAEA,EAAAE,EAAAzB,EACP0B,cAAAA,OAAgB,IAAHD,EAAG,GAAEA,EAAAE,EAAA3B,EAClB4B,kBAAAA,OAAoB,IAAHD,GAAQA,EAAAE,EAAA7B,EACzB8B,gBAAAA,OAAkB,IAAHD,GAAQA,EAAAE,EAAA/B,EACvBgC,WAAAA,OAAa,IAAHD,GAAQA,EACHE,EAAUjC,EAAzB,eAIIkC,EAA2B,gBAVhB,IAAHb,EAAG,QAAOA,GAYlBc,EAAiBC,GACrB,SAACC,GACKT,GACFS,EAAEC,iBAEJ5B,GAAWA,EAAQ2B,EACrB,GACA,CAACT,EAAmBlB,IAGtB,OACEhB,EACeC,cAAA,IAAA,CAAA,cAAAsC,GAAcM,EAAUC,EAAuBC,KAAMjB,GAClEA,GAAIA,EACJpB,KAAMA,EACNI,IAAKA,EACLP,IAAKA,EACLS,QAASyB,EACTtB,OAAQA,EACRpB,UAAWiD,EAAGC,EAAOC,KAAMnD,EAAWoD,EAASF,EAAQG,EAAU,SAAW7B,IAAO8B,EAAAA,EAAA,CAAA,EAChFJ,EAAOb,gBAAkBA,GACzBa,EAAOX,WAAaA,IAEX,aAAAjB,EACM,mBAAAI,oBACDO,GAEhBpC,EAAQ4C,EAAS1C,EAAMkD,EAAGC,EAAOK,YAClCtD,EAAAC,cAAA,OAAA,CAAMF,UAAWiD,EAAGC,EAAOrC,KAAMJ,IAAiBI,GACjDhB,GAAS4C,EAAS1C,EAAMkD,EAAGC,EAAOM,UAGzC,IAQmC,CACnCC,SAAUC,EACVC,cAAeD,EACfE,QAASC"}

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

@@ -1,2 +1,2 @@
-var n={link:"link_f1a47eb155","focus-visible":"focus-visible_827afe335f",colorOnPrimary:"colorOnPrimary_605185bf04",colorOnInverted:"colorOnInverted_a63216f209",text:"text_2a8a89bf5f",inlineText:"inlineText_323aadb71e",inheritFontSize:"inheritFontSize_b04ca8490e",iconStart:"iconStart_337a0ede23",iconEnd:"iconEnd_96734a4c30"};!function(n){const e="s_id-6fcc93dacbaa_3_34_2";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+e))return;const t=document.createElement("style");t.id=e,i.firstChild?i.insertBefore(t,i.firstChild):i.appendChild(t),t.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".link_f1a47eb155 {\n  display: flex;\n  align-items: center;\n  color: var(--link-color);\n  font: var(--font-text2-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  text-decoration: none;\n  writing-mode: horizontal-tb;\n}\n.link_f1a47eb155:focus-visible, .link_f1a47eb155.focus-visible_827afe335f {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.link_f1a47eb155:focus:not(.focus-visible_827afe335f) {\n  outline: none;\n}\n.link_f1a47eb155.colorOnPrimary_605185bf04 {\n  color: var(--text-color-on-primary);\n}\n.link_f1a47eb155.colorOnInverted_a63216f209 {\n  color: var(--text-color-on-inverted);\n}\n.link_f1a47eb155:hover .text_2a8a89bf5f {\n  text-decoration: underline;\n  color: inherit;\n}\n.link_f1a47eb155.inlineText_323aadb71e {\n  display: inline-flex;\n  align-items: unset;\n}\n.link_f1a47eb155.inheritFontSize_b04ca8490e {\n  font-size: inherit;\n  line-height: inherit;\n}\n.iconStart_337a0ede23 {\n  line-height: 24px;\n  margin-right: var(--spacing-small);\n}\n.iconEnd_96734a4c30 {\n  line-height: 24px;\n  margin-left: var(--spacing-small);\n}\n@supports (margin-inline-start: initial) {\n  .iconStart_337a0ede23 {\n    line-height: 24px;\n    margin-right: 0;\n    margin-inline-end: var(--spacing-xs);\n  }\n  .iconEnd_96734a4c30 {\n    line-height: 24px;\n    margin-left: 0;\n    margin-inline-start: var(--spacing-xs);\n  }\n}");export{n as default};
+var n={link:"link_b9a2918068","focus-visible":"focus-visible_eb6b496cf8",colorOnPrimary:"colorOnPrimary_5744ef2742",colorOnInverted:"colorOnInverted_4db6d8f7b0",text:"text_f837cf49c7",inlineText:"inlineText_d6ee4f3511",inheritFontSize:"inheritFontSize_fc32c2006c",iconStart:"iconStart_6d54e4fcc5",iconEnd:"iconEnd_529f7f1654"};!function(n){const e="s_id-6fcc93dacbaa_3_35_0";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+e))return;const t=document.createElement("style");t.id=e,i.firstChild?i.insertBefore(t,i.firstChild):i.appendChild(t),t.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".link_b9a2918068 {\n  display: flex;\n  align-items: center;\n  color: var(--link-color);\n  font: var(--font-text2-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  text-decoration: none;\n  writing-mode: horizontal-tb;\n}\n.link_b9a2918068:focus-visible, .link_b9a2918068.focus-visible_eb6b496cf8 {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.link_b9a2918068:focus:not(.focus-visible_eb6b496cf8) {\n  outline: none;\n}\n.link_b9a2918068.colorOnPrimary_5744ef2742 {\n  color: var(--text-color-on-primary);\n}\n.link_b9a2918068.colorOnInverted_4db6d8f7b0 {\n  color: var(--text-color-on-inverted);\n}\n.link_b9a2918068:hover .text_f837cf49c7 {\n  text-decoration: underline;\n  color: inherit;\n}\n.link_b9a2918068.inlineText_d6ee4f3511 {\n  display: inline-flex;\n  align-items: unset;\n}\n.link_b9a2918068.inheritFontSize_fc32c2006c {\n  font-size: inherit;\n  line-height: inherit;\n}\n.iconStart_6d54e4fcc5 {\n  line-height: 24px;\n  margin-right: var(--spacing-small);\n}\n.iconEnd_529f7f1654 {\n  line-height: 24px;\n  margin-left: var(--spacing-small);\n}\n@supports (margin-inline-start: initial) {\n  .iconStart_6d54e4fcc5 {\n    line-height: 24px;\n    margin-right: 0;\n    margin-inline-end: var(--spacing-xs);\n  }\n  .iconEnd_529f7f1654 {\n    line-height: 24px;\n    margin-left: 0;\n    margin-inline-start: var(--spacing-xs);\n  }\n}");export{n as default};
 //# sourceMappingURL=Link.module.scss.js.map