npm - @vibe/core - Versions diffs - 3.42.0 → 3.43.1 - Mend

@vibe/core 3.42.0 → 3.43.1

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

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

@@ -1,2 +1,2 @@
-var n={h1Bold:"h1Bold_9e7f50ae71",h1Medium:"h1Medium_fdf914584d",h1Normal:"h1Normal_20f519c419",h1Light:"h1Light_c8f77eb5a9",h2Bold:"h2Bold_33f8ad2aa9",h2Medium:"h2Medium_47c329fefb",h2Normal:"h2Normal_59b2baf3ae",h2Light:"h2Light_ac4c96cb5c",h3Bold:"h3Bold_308a7e8e6c",h3Medium:"h3Medium_3daec265a1",h3Normal:"h3Normal_db495b4c4b",h3Light:"h3Light_921a01f9bf",heading:"heading_7627065ae9"};!function(n){const o="s_id-7b3706ef5cf5_3_41_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_9e7f50ae71 {\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_fdf914584d {\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_20f519c419 {\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_c8f77eb5a9 {\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_33f8ad2aa9 {\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_47c329fefb {\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_59b2baf3ae {\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_ac4c96cb5c {\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_308a7e8e6c {\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_3daec265a1 {\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_db495b4c4b {\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_921a01f9bf {\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_7627065ae9 {\n  margin: 0;\n}");export{n as default};
+var n={h1Bold:"h1Bold_815fa27483",h1Medium:"h1Medium_2a14a0cd00",h1Normal:"h1Normal_d329612cf4",h1Light:"h1Light_5ecbec77d6",h2Bold:"h2Bold_d825bc9eaf",h2Medium:"h2Medium_de4b92f373",h2Normal:"h2Normal_b775191828",h2Light:"h2Light_80b1095e49",h3Bold:"h3Bold_4789d64ecd",h3Medium:"h3Medium_c50493c8d2",h3Normal:"h3Normal_9bca423573",h3Light:"h3Light_eec22e35ac",heading:"heading_d997ba769d"};!function(n){const o="s_id-7b3706ef5cf5_3_43_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_815fa27483 {\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_2a14a0cd00 {\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_d329612cf4 {\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_5ecbec77d6 {\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_d825bc9eaf {\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_de4b92f373 {\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_b775191828 {\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_80b1095e49 {\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_4789d64ecd {\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_c50493c8d2 {\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_9bca423573 {\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_eec22e35ac {\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_d997ba769d {\n  margin: 0;\n}");export{n as default};
 //# sourceMappingURL=Heading.module.scss.js.map

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

@@ -1,2 +1,2 @@
-var e={hiddenTextWrapper:"hiddenTextWrapper_b7cc171087"};!function(e){const t="s_id-5ac012179a41_3_41_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_b7cc171087 {\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_c4a2935ab4"};!function(e){const t="s_id-5ac012179a41_3_43_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_c4a2935ab4 {\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/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 /*\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"}
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, 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 = 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: React.ForwardedRef<HTMLElement>\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);\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,EAAWC,GACf,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 /*\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"}
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, 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 = 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: React.ForwardedRef<HTMLElement>\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 const isFunctionType = typeof icon === \"function\";\n const overrideDataTestId = dataTestId \|\| getTestId(ComponentDefaultTestId.ICON, id);\n\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\ninterface IconStaticProps {\n type: typeof IconTypeEnum;\n}\n\nexport default withStaticProps<IconProps, IconStaticProps>(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,IAmFeA,EAAAA,EAnFFC,GACX,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,KAGT,IAAM0B,EAAiC,mBAAT1B,EACxB2B,EAAqBd,GAAce,EAAUC,EAAuBC,KAAMhC,GAEhF,MAAiB,QAAbI,GAAsBwB,GAAkC,WAAhBK,EAAO/B,GA9FvD,SAAoBgC,EAAeC,GAEjC,OACEC,EAACC,cAAAH,EACKI,OAAAC,OAAA,CAAA,EAAAJ,iBAHWA,EAAM,gBAIML,EAAUC,EAAuBC,KAAMG,EAAMnC,IAAG,YAChEwC,EAAgBR,OAGjC,CAsFaS,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,IAO+D,CAC/DqB,KAAMC"}

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

@@ -1,2 +1,2 @@
-var e={icon:"icon_d1d0fa9d65",noFocusStyle:"noFocusStyle_22a54768a1",clickable:"clickable_472a3de4cd"};!function(e){const n="s_id-039c30c54242_3_41_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)}(".icon_d1d0fa9d65 {\n  position: relative;\n}\n\n.icon_d1d0fa9d65:before {\n  text-decoration: none !important;\n}\n\n.noFocusStyle_22a54768a1:focus {\n  outline: none;\n}\n\n.clickable_472a3de4cd {\n  cursor: pointer;\n}");export{e as default};
+var e={icon:"icon_d0351456d6",noFocusStyle:"noFocusStyle_5b180e1b9f",clickable:"clickable_79eed86ead"};!function(e){const n="s_id-039c30c54242_3_43_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)}(".icon_d0351456d6 {\n  position: relative;\n}\n\n.icon_d0351456d6:before {\n  text-decoration: none !important;\n}\n\n.noFocusStyle_5b180e1b9f:focus {\n  outline: none;\n}\n\n.clickable_79eed86ead {\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 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":"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"}
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, 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\";\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 = 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: React.ForwardedRef<HTMLElement>\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\ninterface IconButtonStaticProps {\n sizes: typeof Button.sizes;\n kinds: typeof Button.kinds;\n colors: typeof Button.colors;\n}\n\nexport default withStaticProps<IconButtonProps, IconButtonStaticProps>(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":"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"}

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

@@ -1,2 +1,2 @@
-var e={wrapper:"wrapper_b52a365480",referenceWrapper:"referenceWrapper_5c05a8541b",loader:"loader_e6a1ca7886",xxs:"xxs_a32783c96a"};!function(e){const n="s_id-8d1605f1f87b_3_41_0";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+n))return;const r=document.createElement("style");r.id=n,a.firstChild?a.insertBefore(r,a.firstChild):a.appendChild(r),r.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".wrapper_b52a365480 {\n  width: fit-content;\n  height: fit-content;\n  display: inline-flex;\n}\n\n.referenceWrapper_5c05a8541b {\n  display: inline-flex;\n}\n\n.referenceWrapper_5c05a8541b button .loader_e6a1ca7886 {\n  width: 16px;\n  height: 16px;\n}\n\n.referenceWrapper_5c05a8541b button .loader_e6a1ca7886.xxs_a32783c96a {\n  width: 10px;\n  height: 10px;\n}\n\n.referenceWrapper_5c05a8541b button .loader_e6a1ca7886.xxs_a32783c96a svg {\n  display: block;\n}");export{e as default};
+var e={wrapper:"wrapper_286a6eac17",referenceWrapper:"referenceWrapper_107bf139cb",loader:"loader_a22e366ea8",xxs:"xxs_6c8ffc7439"};!function(e){const n="s_id-8d1605f1f87b_3_43_0";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_286a6eac17 {\n  width: fit-content;\n  height: fit-content;\n  display: inline-flex;\n}\n\n.referenceWrapper_107bf139cb {\n  display: inline-flex;\n}\n\n.referenceWrapper_107bf139cb button .loader_a22e366ea8 {\n  width: 16px;\n  height: 16px;\n}\n\n.referenceWrapper_107bf139cb button .loader_a22e366ea8.xxs_6c8ffc7439 {\n  width: 10px;\n  height: 10px;\n}\n\n.referenceWrapper_107bf139cb button .loader_a22e366ea8.xxs_6c8ffc7439 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 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"}
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 { 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 = 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\ninterface LabelStaticProps {\n colors: typeof LabelColorEnum;\n kinds: typeof LabelKindEnum;\n}\n\nexport default withStaticProps<LabelProps, LabelStaticProps>(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,IAmIeA,EAAAA,EAnIDC,GACZ,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,IAQkE,CAClEwC,OAAQC,EACRC,MAAOC"}

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

@@ -1,2 +1,2 @@
-var e={clickable:"clickable_472a3de4cd","focus-visible":"focus-visible_988e67fb06",disabled:"disabled_9d96195db7",disableTextSelection:"disableTextSelection_6f1efe69aa",clickableWrapper:"clickableWrapper_472a3de4cd",label:"label_09762db65a",small:"small_334362333e",withLeg:"withLeg_9a0bfab114",legWrapper:"legWrapper_26253d4742",kindFill:"kindFill_8b1aa6b641",colorPrimary:"colorPrimary_112696f326",colorDark:"colorDark_dbb0c7b93d",colorNegative:"colorNegative_8fd8b9cb27",colorPositive:"colorPositive_8e68154188",kindLine:"kindLine_b7e757a7c6",smallText:"smallText_8d75034af5"};!function(e){const a="s_id-4bcc4b0ff746_3_41_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+a))return;const o=document.createElement("style");o.id=a,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[a]=e)}(".clickable_472a3de4cd {\n  cursor: pointer;\n}\n.clickable_472a3de4cd:focus-visible, .clickable_472a3de4cd.focus-visible_988e67fb06 {\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_472a3de4cd:focus:not(.focus-visible_988e67fb06) {\n  outline: none;\n}\n.clickable_472a3de4cd.disabled_9d96195db7 {\n  cursor: default;\n}\n.disableTextSelection_6f1efe69aa {\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_472a3de4cd {\n  cursor: pointer;\n}\n.clickableWrapper_472a3de4cd:focus-visible, .clickableWrapper_472a3de4cd.focus-visible_988e67fb06 {\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_472a3de4cd:focus:not(.focus-visible_988e67fb06) {\n  outline: none;\n}\n.clickableWrapper_472a3de4cd:active {\n  transform: scale(0.95) translate3d(0, 0, 0);\n  transition: var(--motion-productive-short) transform;\n}\n.label_09762db65a {\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_09762db65a.small_334362333e {\n  padding: 0 var(--spacing-xs);\n  border-radius: 2px;\n}\n.withLeg_9a0bfab114 {\n  border-radius: var(--border-radius-small) var(--border-radius-small) var(--border-radius-small) 0;\n}\n.legWrapper_26253d4742 {\n  position: absolute;\n  height: 8px;\n  top: 100%;\n  left: 0;\n  display: inline-flex;\n}\n.kindFill_8b1aa6b641.colorPrimary_112696f326 {\n  background-color: var(--primary-color);\n}\n.kindFill_8b1aa6b641.colorPrimary_112696f326 svg path {\n  fill: var(--primary-color);\n}\n.kindFill_8b1aa6b641.colorPrimary_112696f326.clickable_472a3de4cd:hover, .kindFill_8b1aa6b641.colorPrimary_112696f326.clickable_472a3de4cd:active {\n  background-color: var(--primary-hover-color);\n}\n.kindFill_8b1aa6b641.colorDark_dbb0c7b93d {\n  background-color: var(--inverted-color-background);\n}\n.kindFill_8b1aa6b641.colorDark_dbb0c7b93d svg path {\n  fill: var(--inverted-color-background);\n}\n.kindFill_8b1aa6b641.colorNegative_8fd8b9cb27 {\n  background-color: var(--negative-color);\n}\n.kindFill_8b1aa6b641.colorNegative_8fd8b9cb27 svg path {\n  fill: var(--negative-color);\n}\n.kindFill_8b1aa6b641.colorNegative_8fd8b9cb27.clickable_472a3de4cd:hover, .kindFill_8b1aa6b641.colorNegative_8fd8b9cb27.clickable_472a3de4cd:active {\n  background-color: var(--negative-color-hover);\n}\n.kindFill_8b1aa6b641.colorPositive_8e68154188 {\n  background-color: var(--positive-color);\n}\n.kindFill_8b1aa6b641.colorPositive_8e68154188 svg path {\n  fill: var(--positive-color);\n}\n.kindFill_8b1aa6b641.colorPositive_8e68154188.clickable_472a3de4cd:hover, .kindFill_8b1aa6b641.colorPositive_8e68154188.clickable_472a3de4cd:active {\n  background-color: var(--positive-color-hover);\n}\n.kindLine_b7e757a7c6 {\n  border: 1px solid currentColor;\n  padding: 1px var(--spacing-small);\n}\n.kindLine_b7e757a7c6 .legWrapper_26253d4742 {\n  left: -1px;\n  top: calc(100% + 1px);\n}\n.kindLine_b7e757a7c6.colorPrimary_112696f326 {\n  color: var(--primary-color);\n}\n.kindLine_b7e757a7c6.colorPrimary_112696f326 svg path {\n  fill: var(--primary-color);\n}\n.kindLine_b7e757a7c6.colorPrimary_112696f326.clickable_472a3de4cd:hover, .kindLine_b7e757a7c6.colorPrimary_112696f326.clickable_472a3de4cd:active {\n  background-color: var(--primary-background-hover-color);\n}\n.kindLine_b7e757a7c6.colorDark_dbb0c7b93d {\n  color: var(--inverted-color-background);\n}\n.kindLine_b7e757a7c6.colorDark_dbb0c7b93d svg path {\n  fill: var(--inverted-color-background);\n}\n.kindLine_b7e757a7c6.colorDark_dbb0c7b93d.clickable_472a3de4cd:hover, .kindLine_b7e757a7c6.colorDark_dbb0c7b93d.clickable_472a3de4cd:active {\n  background-color: var(--primary-background-hover-color);\n}\n.kindLine_b7e757a7c6.colorNegative_8fd8b9cb27 {\n  color: var(--negative-color);\n}\n.kindLine_b7e757a7c6.colorNegative_8fd8b9cb27 svg path {\n  fill: var(--negative-color);\n}\n.kindLine_b7e757a7c6.colorNegative_8fd8b9cb27.clickable_472a3de4cd:hover, .kindLine_b7e757a7c6.colorNegative_8fd8b9cb27.clickable_472a3de4cd:active {\n  background-color: var(--negative-color-selected);\n}\n.kindLine_b7e757a7c6.colorPositive_8e68154188 {\n  color: var(--positive-color);\n}\n.kindLine_b7e757a7c6.colorPositive_8e68154188 svg path {\n  fill: var(--positive-color);\n}\n.kindLine_b7e757a7c6.colorPositive_8e68154188.clickable_472a3de4cd:hover, .kindLine_b7e757a7c6.colorPositive_8e68154188.clickable_472a3de4cd:active {\n  background-color: var(--positive-color-selected);\n}\n.kindLine_b7e757a7c6 .smallText_8d75034af5 {\n  line-height: 14px;\n}");export{e as default};
+var e={clickable:"clickable_79eed86ead","focus-visible":"focus-visible_30e51b3368",disabled:"disabled_b6afcd20b4",disableTextSelection:"disableTextSelection_59b9d4d50f",clickableWrapper:"clickableWrapper_79eed86ead",label:"label_9e124b54b5",small:"small_7ba78071fe",withLeg:"withLeg_91b4855290",legWrapper:"legWrapper_eeb2f50288",kindFill:"kindFill_d62ad0fb81",colorPrimary:"colorPrimary_12957807ec",colorDark:"colorDark_cf9139f4b9",colorNegative:"colorNegative_edca6bf904",colorPositive:"colorPositive_d4ad829adc",kindLine:"kindLine_3fe608fa81",smallText:"smallText_69a60818aa"};!function(e){const a="s_id-4bcc4b0ff746_3_43_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+a))return;const o=document.createElement("style");o.id=a,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[a]=e)}(".clickable_79eed86ead {\n  cursor: pointer;\n}\n.clickable_79eed86ead:focus-visible, .clickable_79eed86ead.focus-visible_30e51b3368 {\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_79eed86ead:focus:not(.focus-visible_30e51b3368) {\n  outline: none;\n}\n.clickable_79eed86ead.disabled_b6afcd20b4 {\n  cursor: default;\n}\n.disableTextSelection_59b9d4d50f {\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_79eed86ead {\n  cursor: pointer;\n}\n.clickableWrapper_79eed86ead:focus-visible, .clickableWrapper_79eed86ead.focus-visible_30e51b3368 {\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_79eed86ead:focus:not(.focus-visible_30e51b3368) {\n  outline: none;\n}\n.clickableWrapper_79eed86ead:active {\n  transform: scale(0.95) translate3d(0, 0, 0);\n  transition: var(--motion-productive-short) transform;\n}\n.label_9e124b54b5 {\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_9e124b54b5.small_7ba78071fe {\n  padding: 0 var(--spacing-xs);\n  border-radius: 2px;\n}\n.withLeg_91b4855290 {\n  border-radius: var(--border-radius-small) var(--border-radius-small) var(--border-radius-small) 0;\n}\n.legWrapper_eeb2f50288 {\n  position: absolute;\n  height: 8px;\n  top: 100%;\n  left: 0;\n  display: inline-flex;\n}\n.kindFill_d62ad0fb81.colorPrimary_12957807ec {\n  background-color: var(--primary-color);\n}\n.kindFill_d62ad0fb81.colorPrimary_12957807ec svg path {\n  fill: var(--primary-color);\n}\n.kindFill_d62ad0fb81.colorPrimary_12957807ec.clickable_79eed86ead:hover, .kindFill_d62ad0fb81.colorPrimary_12957807ec.clickable_79eed86ead:active {\n  background-color: var(--primary-hover-color);\n}\n.kindFill_d62ad0fb81.colorDark_cf9139f4b9 {\n  background-color: var(--inverted-color-background);\n}\n.kindFill_d62ad0fb81.colorDark_cf9139f4b9 svg path {\n  fill: var(--inverted-color-background);\n}\n.kindFill_d62ad0fb81.colorNegative_edca6bf904 {\n  background-color: var(--negative-color);\n}\n.kindFill_d62ad0fb81.colorNegative_edca6bf904 svg path {\n  fill: var(--negative-color);\n}\n.kindFill_d62ad0fb81.colorNegative_edca6bf904.clickable_79eed86ead:hover, .kindFill_d62ad0fb81.colorNegative_edca6bf904.clickable_79eed86ead:active {\n  background-color: var(--negative-color-hover);\n}\n.kindFill_d62ad0fb81.colorPositive_d4ad829adc {\n  background-color: var(--positive-color);\n}\n.kindFill_d62ad0fb81.colorPositive_d4ad829adc svg path {\n  fill: var(--positive-color);\n}\n.kindFill_d62ad0fb81.colorPositive_d4ad829adc.clickable_79eed86ead:hover, .kindFill_d62ad0fb81.colorPositive_d4ad829adc.clickable_79eed86ead:active {\n  background-color: var(--positive-color-hover);\n}\n.kindLine_3fe608fa81 {\n  border: 1px solid currentColor;\n  padding: 1px var(--spacing-small);\n}\n.kindLine_3fe608fa81 .legWrapper_eeb2f50288 {\n  left: -1px;\n  top: calc(100% + 1px);\n}\n.kindLine_3fe608fa81.colorPrimary_12957807ec {\n  color: var(--primary-color);\n}\n.kindLine_3fe608fa81.colorPrimary_12957807ec svg path {\n  fill: var(--primary-color);\n}\n.kindLine_3fe608fa81.colorPrimary_12957807ec.clickable_79eed86ead:hover, .kindLine_3fe608fa81.colorPrimary_12957807ec.clickable_79eed86ead:active {\n  background-color: var(--primary-background-hover-color);\n}\n.kindLine_3fe608fa81.colorDark_cf9139f4b9 {\n  color: var(--inverted-color-background);\n}\n.kindLine_3fe608fa81.colorDark_cf9139f4b9 svg path {\n  fill: var(--inverted-color-background);\n}\n.kindLine_3fe608fa81.colorDark_cf9139f4b9.clickable_79eed86ead:hover, .kindLine_3fe608fa81.colorDark_cf9139f4b9.clickable_79eed86ead:active {\n  background-color: var(--primary-background-hover-color);\n}\n.kindLine_3fe608fa81.colorNegative_edca6bf904 {\n  color: var(--negative-color);\n}\n.kindLine_3fe608fa81.colorNegative_edca6bf904 svg path {\n  fill: var(--negative-color);\n}\n.kindLine_3fe608fa81.colorNegative_edca6bf904.clickable_79eed86ead:hover, .kindLine_3fe608fa81.colorNegative_edca6bf904.clickable_79eed86ead:active {\n  background-color: var(--negative-color-selected);\n}\n.kindLine_3fe608fa81.colorPositive_d4ad829adc {\n  color: var(--positive-color);\n}\n.kindLine_3fe608fa81.colorPositive_d4ad829adc svg path {\n  fill: var(--positive-color);\n}\n.kindLine_3fe608fa81.colorPositive_d4ad829adc.clickable_79eed86ead:hover, .kindLine_3fe608fa81.colorPositive_d4ad829adc.clickable_79eed86ead:active {\n  background-color: var(--positive-color-selected);\n}\n.kindLine_3fe608fa81 .smallText_69a60818aa {\n  line-height: 14px;\n}");export{e as default};
 //# sourceMappingURL=Label.module.scss.js.map

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

@@ -1,2 +1,2 @@
-var e={celebration:"celebration_ba6af2445b",svg:"svg_aed855f3fe",stroke:"stroke_573599e01e","stroke-rotate":"stroke-rotate_96866649df",base:"base_b6c22b6015",fade:"fade_aa8d395911",first:"first_828de554ae",second:"second_3ec5c5bf01",third:"third_87aa7051ae","gradient-text-fill":"gradient-text-fill_d4307aa0d1"};!function(e){const a="s_id-cc5df975abc6_3_41_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+a))return;const t=document.createElement("style");t.id=a,n.firstChild?n.insertBefore(t,n.firstChild):n.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[a]=e)}(".celebration_ba6af2445b {\n  --container-perimeter: 840;\n  position: relative;\n}\n.celebration_ba6af2445b .svg_aed855f3fe {\n  position: absolute;\n  top: 0;\n  left: 0;\n  height: 100%;\n  width: 100%;\n}\n.celebration_ba6af2445b .svg_aed855f3fe .stroke_573599e01e {\n  fill: none;\n  stroke-width: 1;\n  stroke-linecap: round;\n  stroke-linejoin: round;\n  animation: stroke-rotate_96866649df cubic-bezier(0.33, 0, 0.67, 1) forwards;\n  stroke-dasharray: var(--container-perimeter);\n  stroke-dashoffset: var(--container-perimeter);\n}\n.celebration_ba6af2445b .svg_aed855f3fe .stroke_573599e01e.base_b6c22b6015 {\n  stroke: var(--color-egg_yolk);\n  animation: fade_aa8d395911 200ms linear forwards;\n  animation-delay: 80ms;\n  stroke-dasharray: 0;\n  stroke-dashoffset: 0;\n  opacity: 0;\n}\n.celebration_ba6af2445b .svg_aed855f3fe .stroke_573599e01e.first_828de554ae {\n  stroke: var(--color-done-green);\n  animation-delay: 80ms;\n  animation-duration: 320ms;\n}\n.celebration_ba6af2445b .svg_aed855f3fe .stroke_573599e01e.second_3ec5c5bf01 {\n  stroke: var(--color-stuck-red);\n  animation-delay: 200ms;\n  animation-duration: 320ms;\n}\n.celebration_ba6af2445b .svg_aed855f3fe .stroke_573599e01e.third_87aa7051ae {\n  stroke: var(--primary-color);\n  animation-delay: 360ms;\n  animation-duration: 320ms;\n}\n.celebration_ba6af2445b.celebration_ba6af2445b [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_d4307aa0d1 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_aa8d395911 {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n@keyframes stroke-rotate_96866649df {\n  to {\n    stroke-dashoffset: 0;\n  }\n}\n@keyframes gradient-text-fill_d4307aa0d1 {\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_fa244076d4",svg:"svg_47109082a8",stroke:"stroke_4a3244df4d","stroke-rotate":"stroke-rotate_723ccc4567",base:"base_790e636c00",fade:"fade_68f5d72f2f",first:"first_697e51e5eb",second:"second_8befd4570c",third:"third_ed145bb510","gradient-text-fill":"gradient-text-fill_afe9a7aa7d"};!function(e){const n="s_id-cc5df975abc6_3_43_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_fa244076d4 {\n  --container-perimeter: 840;\n  position: relative;\n}\n.celebration_fa244076d4 .svg_47109082a8 {\n  position: absolute;\n  top: 0;\n  left: 0;\n  height: 100%;\n  width: 100%;\n}\n.celebration_fa244076d4 .svg_47109082a8 .stroke_4a3244df4d {\n  fill: none;\n  stroke-width: 1;\n  stroke-linecap: round;\n  stroke-linejoin: round;\n  animation: stroke-rotate_723ccc4567 cubic-bezier(0.33, 0, 0.67, 1) forwards;\n  stroke-dasharray: var(--container-perimeter);\n  stroke-dashoffset: var(--container-perimeter);\n}\n.celebration_fa244076d4 .svg_47109082a8 .stroke_4a3244df4d.base_790e636c00 {\n  stroke: var(--color-egg_yolk);\n  animation: fade_68f5d72f2f 200ms linear forwards;\n  animation-delay: 80ms;\n  stroke-dasharray: 0;\n  stroke-dashoffset: 0;\n  opacity: 0;\n}\n.celebration_fa244076d4 .svg_47109082a8 .stroke_4a3244df4d.first_697e51e5eb {\n  stroke: var(--color-done-green);\n  animation-delay: 80ms;\n  animation-duration: 320ms;\n}\n.celebration_fa244076d4 .svg_47109082a8 .stroke_4a3244df4d.second_8befd4570c {\n  stroke: var(--color-stuck-red);\n  animation-delay: 200ms;\n  animation-duration: 320ms;\n}\n.celebration_fa244076d4 .svg_47109082a8 .stroke_4a3244df4d.third_ed145bb510 {\n  stroke: var(--primary-color);\n  animation-delay: 360ms;\n  animation-duration: 320ms;\n}\n.celebration_fa244076d4.celebration_fa244076d4 [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_afe9a7aa7d 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_68f5d72f2f {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n@keyframes stroke-rotate_723ccc4567 {\n  to {\n    stroke-dashoffset: 0;\n  }\n}\n@keyframes gradient-text-fill_afe9a7aa7d {\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/LegacyModal/LegacyModal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LegacyModal.js","sources":["../../../../src/components/LegacyModal/LegacyModal.tsx"],"sourcesContent":["import React, { cloneElement, ~~FC,~~ ReactElement, useCallback, useMemo } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport cx from \"classnames\";\nimport { useA11yDialog } from \"./a11yDialog\";\nimport ModalContent from \"./LegacyModalContent/LegacyModalContent\";\nimport ModalHeader from \"./LegacyModalHeader/LegacyModalHeader\";\nimport useBodyScrollLock from \"./useBodyScrollLock\";\nimport useShowHideModal from \"./useShowHideModal\";\nimport {\n isModalContent,\n isModalFooter,\n isModalHeader,\n ModalWidth as ModalWidthEnum,\n validateTitleProp\n} from \"./ModalHelper\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { withStaticProps } from \"../../types\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport styles from \"./LegacyModal.module.scss\";\nimport { ModalWidth } from \"./LegacyModal.types\";\nimport LayerProvider from \"../LayerProvider/LayerProvider\";\nimport { isClient } from \"../../utils/ssr-utils\";\n\nexport interface LegacyModalProps {\n /*\n Id of the modal, used internally and for accessibility\n /\n id?: string;\n \"data-testid\"?: string;\n /\n Show/hide the Dialog\n /\n show: boolean;\n /\n Heading for the modal, mandatory when ModalHeader isn't provided in children\n /\n title?: string;\n /\n Description for the modal title\n /\n description?: string;\n /\n Called when the modal is closed (by close button/click outside/esc key)\n /\n onClose: () => void;\n /\n Makes the dialog behave like a modal (preventing closing on click outside of\n * ESC key)..\n /\n alertDialog?: boolean;\n /\n Used for the fromOrigin animation\n /\n triggerElement?: Element;\n /\n Set the modal's width. Can be one of the presets or any custom size\n /\n width?: ModalWidth \| string;\n /\n Aria label for the close button\n /\n closeButtonAriaLabel?: string;\n /\n Add gaps between parts of the modal\n /\n contentSpacing?: boolean;\n /\n classNames for specific parts of the dialog\n /\n classNames?: {\n container?: string;\n overlay?: string;\n modal?: string;\n };\n /\n Dialog content\n /\n children?: ReactElement \| ReactElement[];\n /\n z-index attribute of the container\n /\n zIndex?: number;\n /\n When `false`, the modal will remain in the DOM when closed\n /\n unmountOnClose?: boolean;\n}\n\nconst Modal: ~~FC<LegacyModalProps> & { width?: typeof ModalWidthEnum }~~ = ({\n classNames = { container: \"\", overlay: \"\", modal: \"\" },\n id,\n show,\n title = \"\",\n description = \"\",\n onClose = NOOP,\n alertDialog = false,\n children,\n triggerElement,\n width = \"default\",\n closeButtonAriaLabel = \"Close\",\n contentSpacing = false,\n zIndex = 10000,\n unmountOnClose = true,\n \"data-testid\": dataTestId\n}: LegacyModalProps) => {\n const childrenArray: ReactElement[] = useMemo(\n () => (children ? (React.Children.toArray(children) as ReactElement[]) : []),\n [children]\n );\n validateTitleProp(title, childrenArray);\n\n const [instance, attr] = useA11yDialog({\n id,\n alertDialog\n });\n\n const closeIfNotAlertType = useCallback(() => {\n if (!alertDialog) {\n onClose?.();\n }\n }, [alertDialog, onClose]);\n\n // lock body scroll when modal is open\n useBodyScrollLock({ instance });\n\n // show/hide and animate the modal\n const { shouldShow } = useShowHideModal({\n instance,\n show,\n triggerElement,\n onClose,\n alertDialog\n });\n\n const header = useMemo(() => {\n const { id } = attr.title;\n const header = childrenArray.find(isModalHeader);\n if (header) {\n return cloneElement(header, { id, closeModal: onClose });\n }\n return (\n <ModalHeader\n title={title}\n description={description}\n closeModal={onClose}\n id={id}\n closeButtonAriaLabel={closeButtonAriaLabel}\n />\n );\n }, [attr.title, childrenArray, title, description, onClose, closeButtonAriaLabel]);\n\n const content = useMemo(() => {\n return (\n childrenArray.find(isModalContent) \|\| (\n <ModalContent>{childrenArray.filter(child => !isModalHeader(child) && !isModalFooter(child))}</ModalContent>\n )\n );\n }, [childrenArray]);\n\n const footer = useMemo(() => {\n return childrenArray.find(isModalFooter) \|\| null;\n }, [childrenArray]);\n\n const customWidth = width !== \"default\" && width !== \"full-width\";\n\n const dialog = (\n <LayerProvider layerRef={{ current: instance?.$el }}>\n <div\n {...attr.container}\n className={cx(styles.container, classNames.container)}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.MODAL, id)}\n style={{ \"--monday-modal-z-index\": zIndex }}\n >\n {/ eslint-disable-next-line jsx-a11y/click-events-have-key-events */}\n <div\n onClick={closeIfNotAlertType}\n className={cx(styles.overlay, classNames.overlay)}\n data-testid={ComponentDefaultTestId.MODAL_OVERLAY}\n />\n <div\n {...attr.dialog}\n className={cx(styles.dialog, classNames.modal, {\n [styles.default]: width === \"default\",\n [styles.full]: width === \"full-width\",\n [styles.spacing]: contentSpacing\n })}\n style={{ width: customWidth ? width : null }}\n >\n {header}\n {content}\n {footer}\n </div>\n </div>\n </LayerProvider>\n );\n\n if (unmountOnClose && !shouldShow) {\n return null;\n }\n return isClient() ? ReactDOM.createPortal(dialog, document.body) : null;\n};\n\nexport default withStaticProps(Modal, {\n width: ModalWidthEnum\n});\n"],"names":["withStaticProps","_ref","_ref$classNames","classNames","container","overlay","modal","id","show","_ref$title","title","_ref$description","description","_ref$onClose","onClose","NOOP","_ref$alertDialog","alertDialog","children","triggerElement","_ref$width","width","_ref$closeButtonAriaL","closeButtonAriaLabel","_ref$contentSpacing","contentSpacing","_ref$zIndex","zIndex","_ref$unmountOnClose","unmountOnClose","dataTestId","childrenArray","useMemo","React","Children","toArray","validateTitleProp","_useA11yDialog","useA11yDialog","_useA11yDialog2","_slicedToArray","instance","attr","closeIfNotAlertType","useCallback","useBodyScrollLock","shouldShow","useShowHideModal","header","find","isModalHeader","cloneElement","closeModal","createElement","ModalHeader","content","isModalContent","ModalContent","filter","child","isModalFooter","footer","customWidth","dialog","LayerProvider","layerRef","current","$el","Object","assign","className","cx","styles","getTestId","ComponentDefaultTestId","MODAL","style","onClick","MODAL_OVERLAY","_defineProperty","default","full","spacing","isClient","ReactDOM","createPortal","document","body","ModalWidthEnum"],"mappings":"2+BAyFA,~~IAkHeA~~,EAAAA,~~GAlHyD~~,~~SAA7DC~~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~~GAEsC~~,~~CACpClE~~,MAAOmE"}
1	+ {"version":3,"file":"LegacyModal.js","sources":["../../../../src/components/LegacyModal/LegacyModal.tsx"],"sourcesContent":["import React, { cloneElement, ReactElement, useCallback, useMemo } from \"react\";\nimport ReactDOM from \"react-dom\";\nimport cx from \"classnames\";\nimport { useA11yDialog } from \"./a11yDialog\";\nimport ModalContent from \"./LegacyModalContent/LegacyModalContent\";\nimport ModalHeader from \"./LegacyModalHeader/LegacyModalHeader\";\nimport useBodyScrollLock from \"./useBodyScrollLock\";\nimport useShowHideModal from \"./useShowHideModal\";\nimport {\n isModalContent,\n isModalFooter,\n isModalHeader,\n ModalWidth as ModalWidthEnum,\n validateTitleProp\n} from \"./ModalHelper\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { withStaticProps } from \"../../types\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport styles from \"./LegacyModal.module.scss\";\nimport { ModalWidth } from \"./LegacyModal.types\";\nimport LayerProvider from \"../LayerProvider/LayerProvider\";\nimport { isClient } from \"../../utils/ssr-utils\";\n\nexport interface LegacyModalProps {\n /*\n Id of the modal, used internally and for accessibility\n /\n id?: string;\n \"data-testid\"?: string;\n /\n Show/hide the Dialog\n /\n show: boolean;\n /\n Heading for the modal, mandatory when ModalHeader isn't provided in children\n /\n title?: string;\n /\n Description for the modal title\n /\n description?: string;\n /\n Called when the modal is closed (by close button/click outside/esc key)\n /\n onClose: () => void;\n /\n Makes the dialog behave like a modal (preventing closing on click outside of\n * ESC key)..\n /\n alertDialog?: boolean;\n /\n Used for the fromOrigin animation\n /\n triggerElement?: Element;\n /\n Set the modal's width. Can be one of the presets or any custom size\n /\n width?: ModalWidth \| string;\n /\n Aria label for the close button\n /\n closeButtonAriaLabel?: string;\n /\n Add gaps between parts of the modal\n /\n contentSpacing?: boolean;\n /\n classNames for specific parts of the dialog\n /\n classNames?: {\n container?: string;\n overlay?: string;\n modal?: string;\n };\n /\n Dialog content\n /\n children?: ReactElement \| ReactElement[];\n /\n z-index attribute of the container\n /\n zIndex?: number;\n /\n When `false`, the modal will remain in the DOM when closed\n /\n unmountOnClose?: boolean;\n}\n\nconst Modal = ({\n classNames = { container: \"\", overlay: \"\", modal: \"\" },\n id,\n show,\n title = \"\",\n description = \"\",\n onClose = NOOP,\n alertDialog = false,\n children,\n triggerElement,\n width = \"default\",\n closeButtonAriaLabel = \"Close\",\n contentSpacing = false,\n zIndex = 10000,\n unmountOnClose = true,\n \"data-testid\": dataTestId\n}: LegacyModalProps) => {\n const childrenArray: ReactElement[] = useMemo(\n () => (children ? (React.Children.toArray(children) as ReactElement[]) : []),\n [children]\n );\n validateTitleProp(title, childrenArray);\n\n const [instance, attr] = useA11yDialog({\n id,\n alertDialog\n });\n\n const closeIfNotAlertType = useCallback(() => {\n if (!alertDialog) {\n onClose?.();\n }\n }, [alertDialog, onClose]);\n\n // lock body scroll when modal is open\n useBodyScrollLock({ instance });\n\n // show/hide and animate the modal\n const { shouldShow } = useShowHideModal({\n instance,\n show,\n triggerElement,\n onClose,\n alertDialog\n });\n\n const header = useMemo(() => {\n const { id } = attr.title;\n const header = childrenArray.find(isModalHeader);\n if (header) {\n return cloneElement(header, { id, closeModal: onClose });\n }\n return (\n <ModalHeader\n title={title}\n description={description}\n closeModal={onClose}\n id={id}\n closeButtonAriaLabel={closeButtonAriaLabel}\n />\n );\n }, [attr.title, childrenArray, title, description, onClose, closeButtonAriaLabel]);\n\n const content = useMemo(() => {\n return (\n childrenArray.find(isModalContent) \|\| (\n <ModalContent>{childrenArray.filter(child => !isModalHeader(child) && !isModalFooter(child))}</ModalContent>\n )\n );\n }, [childrenArray]);\n\n const footer = useMemo(() => {\n return childrenArray.find(isModalFooter) \|\| null;\n }, [childrenArray]);\n\n const customWidth = width !== \"default\" && width !== \"full-width\";\n\n const dialog = (\n <LayerProvider layerRef={{ current: instance?.$el }}>\n <div\n {...attr.container}\n className={cx(styles.container, classNames.container)}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.MODAL, id)}\n style={{ \"--monday-modal-z-index\": zIndex }}\n >\n {/ eslint-disable-next-line jsx-a11y/click-events-have-key-events */}\n <div\n onClick={closeIfNotAlertType}\n className={cx(styles.overlay, classNames.overlay)}\n data-testid={ComponentDefaultTestId.MODAL_OVERLAY}\n />\n <div\n {...attr.dialog}\n className={cx(styles.dialog, classNames.modal, {\n [styles.default]: width === \"default\",\n [styles.full]: width === \"full-width\",\n [styles.spacing]: contentSpacing\n })}\n style={{ width: customWidth ? width : null }}\n >\n {header}\n {content}\n {footer}\n </div>\n </div>\n </LayerProvider>\n );\n\n if (unmountOnClose && !shouldShow) {\n return null;\n }\n return isClient() ? ReactDOM.createPortal(dialog, document.body) : null;\n};\n\ninterface LegacyModalStaticProps {\n width: typeof ModalWidthEnum;\n}\n\nexport default withStaticProps<LegacyModalProps, LegacyModalStaticProps>(Modal, {\n width: ModalWidthEnum\n});\n"],"names":["withStaticProps","_ref","_ref$classNames","classNames","container","overlay","modal","id","show","_ref$title","title","_ref$description","description","_ref$onClose","onClose","NOOP","_ref$alertDialog","alertDialog","children","triggerElement","_ref$width","width","_ref$closeButtonAriaL","closeButtonAriaLabel","_ref$contentSpacing","contentSpacing","_ref$zIndex","zIndex","_ref$unmountOnClose","unmountOnClose","dataTestId","childrenArray","useMemo","React","Children","toArray","validateTitleProp","_useA11yDialog","useA11yDialog","_useA11yDialog2","_slicedToArray","instance","attr","closeIfNotAlertType","useCallback","useBodyScrollLock","shouldShow","useShowHideModal","header","find","isModalHeader","cloneElement","closeModal","createElement","ModalHeader","content","isModalContent","ModalContent","filter","child","isModalFooter","footer","customWidth","dialog","LayerProvider","layerRef","current","$el","Object","assign","className","cx","styles","getTestId","ComponentDefaultTestId","MODAL","style","onClick","MODAL_OVERLAY","_defineProperty","default","full","spacing","isClient","ReactDOM","createPortal","document","body","ModalWidthEnum"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-var n={container:"container_0578447461",overlay:"overlay_83f1b00a11","overlay-fade-out":"overlay-fade-out_22988eb444","overlay-fade-in":"overlay-fade-in_aa8d395911",dialog:"dialog_dc7a82f8db",default:"default_d9fe5e923c",full:"full_c0f4cadbc1",spacing:"spacing_da4b68f9e3"};!function(n){const a="s_id-fe267e23c74c_3_41_0";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+a))return;const d=document.createElement("style");d.id=a,e.firstChild?e.insertBefore(d,e.firstChild):e.appendChild(d),d.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[a]=n)}(".container_0578447461,\n.overlay_83f1b00a11 {\n  position: fixed;\n  inset: 0;\n}\n\n.container_0578447461 {\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_0578447461[aria-hidden=true] {\n  display: none;\n}\n\n.container_0578447461[aria-hidden=true] .overlay_83f1b00a11 {\n  background-color: transparent;\n  animation: overlay-fade-out_22988eb444 70ms var(--motion-timing-enter);\n}\n\n.overlay_83f1b00a11 {\n  background-color: rgba(41, 47, 76, 0.7);\n  animation: overlay-fade-in_aa8d395911 70ms var(--motion-timing-enter);\n}\n\n.dialog_dc7a82f8db {\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_dc7a82f8db.default_d9fe5e923c {\n  width: 520px;\n}\n\n.dialog_dc7a82f8db.full_c0f4cadbc1 {\n  width: 100vw;\n}\n\n.dialog_dc7a82f8db.spacing_da4b68f9e3 {\n  gap: var(--spacing-medium);\n}\n\n@keyframes overlay-fade-in_aa8d395911 {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n\n@keyframes overlay-fade-out_22988eb444 {\n  from {\n    opacity: 1;\n  }\n  to {\n    opacity: 0;\n  }\n}");export{n as default};
+var n={container:"container_7414d25c24",overlay:"overlay_8b82cfac53","overlay-fade-out":"overlay-fade-out_2882a21bb7","overlay-fade-in":"overlay-fade-in_68f5d72f2f",dialog:"dialog_04bc864efc",default:"default_be4a3b7d92",full:"full_e0c5b0ca81",spacing:"spacing_e353d78a7e"};!function(n){const e="s_id-fe267e23c74c_3_43_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_7414d25c24,\n.overlay_8b82cfac53 {\n  position: fixed;\n  inset: 0;\n}\n\n.container_7414d25c24 {\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_7414d25c24[aria-hidden=true] {\n  display: none;\n}\n\n.container_7414d25c24[aria-hidden=true] .overlay_8b82cfac53 {\n  background-color: transparent;\n  animation: overlay-fade-out_2882a21bb7 70ms var(--motion-timing-enter);\n}\n\n.overlay_8b82cfac53 {\n  background-color: rgba(41, 47, 76, 0.7);\n  animation: overlay-fade-in_68f5d72f2f 70ms var(--motion-timing-enter);\n}\n\n.dialog_04bc864efc {\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_04bc864efc.default_be4a3b7d92 {\n  width: 520px;\n}\n\n.dialog_04bc864efc.full_e0c5b0ca81 {\n  width: 100vw;\n}\n\n.dialog_04bc864efc.spacing_e353d78a7e {\n  gap: var(--spacing-medium);\n}\n\n@keyframes overlay-fade-in_68f5d72f2f {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n\n@keyframes overlay-fade-out_2882a21bb7 {\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_b854f6401d"};!function(e){const n="s_id-40a1f8a37338_3_41_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_b854f6401d {\n  flex-grow: 1;\n  overflow: auto;\n}\n.container_b854f6401d::-webkit-scrollbar {\n  width: 4px;\n  height: 6px;\n}\n.container_b854f6401d::-webkit-scrollbar-thumb {\n  background-color: var(--ui-border-color);\n  border-radius: 4px;\n}");export{e as default};
+var e={container:"container_86c40536ba"};!function(e){const n="s_id-40a1f8a37338_3_43_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_86c40536ba {\n  flex-grow: 1;\n  overflow: auto;\n}\n.container_86c40536ba::-webkit-scrollbar {\n  width: 4px;\n  height: 6px;\n}\n.container_86c40536ba::-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_7471ed0be3"};!function(e){const t="s_id-9ff7e713f88b_3_41_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_7471ed0be3 {\n  margin-block-start: var(--spacing-large);\n}");export{e as default};
+var e={container:"container_8fd799e0fc"};!function(e){const t="s_id-9ff7e713f88b_3_43_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_8fd799e0fc {\n  margin-block-start: var(--spacing-large);\n}");export{e as default};
 //# sourceMappingURL=LegacyModalFooter.module.scss.js.map

package/dist/src/components/LegacyModal/LegacyModalFooter/LegacyModalFooterButtons/LegacyModalFooterButtons.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LegacyModalFooterButtons.js","sources":["../../../../../../src/components/LegacyModal/LegacyModalFooter/LegacyModalFooterButtons/LegacyModalFooterButtons.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport ~~VibeComponentProps~~ ~~from \"../../../../types/~~VibeComponentProps~~\";\nimport~~ ~~VibeComponent~~ from \"../../../../types~~/VibeComponent~~\";\nimport { getTestId } from \"../../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../../tests/constants\";\nimport Flex from \"../../../Flex/Flex\";\nimport Button from \"../../../Button/Button\";\nimport LegacyModalFooter from \"../LegacyModalFooter\";\n\nexport interface LegacyModalFooterButtonsProps extends VibeComponentProps {\n primaryButtonText: string;\n secondaryButtonText?: string;\n disablePrimaryButton?: boolean;\n onPrimaryButtonClick?: () => void;\n onSecondaryButtonClick?: () => void;\n}\n\nconst LegacyModalFooterButtons: ~~VibeComponent<LegacyModalFooterButtonsProps>~~ = forwardRef(\n (\n {\n primaryButtonText,\n secondaryButtonText,\n disablePrimaryButton,\n onPrimaryButtonClick,\n onSecondaryButtonClick,\n className,\n id,\n \"data-testid\": dataTestId\n }: LegacyModalFooterButtonsProps,\n // As ModalFooter does not currently forward refs\n // eslint-disable-next-line\n ref\n ) => {\n return (\n <LegacyModalFooter\n id={id}\n className={className}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.MODAL_FOOTER_BUTTONS, id)}\n >\n <Flex justify=\"end\" gap=\"small\">\n {secondaryButtonText && (\n <Button onClick={onSecondaryButtonClick} kind=\"tertiary\">\n {secondaryButtonText}\n </Button>\n )}\n <Button onClick={onPrimaryButtonClick} disabled={disablePrimaryButton}>\n {primaryButtonText}\n </Button>\n </Flex>\n </LegacyModalFooter>\n );\n }\n);\n\nObject.assign(LegacyModalFooterButtons, {\n displayName: \"ModalFooterButtons\"\n});\n\nexport default LegacyModalFooterButtons;\n"],"names":["LegacyModalFooterButtons","forwardRef","_ref","ref","primaryButtonText","secondaryButtonText","disablePrimaryButton","onPrimaryButtonClick","onSecondaryButtonClick","id","React","LegacyModalFooter","className","getTestId","ComponentDefaultTestId","MODAL_FOOTER_BUTTONS","createElement","Flex","justify","gap","Button","onClick","kind","disabled","Object","assign","displayName"],"mappings":"~~4RAiBA~~,IAAMA,~~EAAyEC~~,~~GAC7E~~,SAAAC,EAaEC,GACE,IAZAC,EAAiBF,EAAjBE,kBACAC,EAAmBH,EAAnBG,oBACAC,EAAoBJ,EAApBI,qBACAC,EAAoBL,EAApBK,qBACAC,EAAsBN,EAAtBM,uBAEAC,EAAEP,EAAFO,GAOF,OACEC,gBAACC,EAAiB,CAChBF,GAAIA,EACJG,UAXOV,EAATU,UAYe,cAVUV,EAAzB,gBAU6BW,EAAUC,EAAuBC,qBAAsBN,IAElFC,EAACM,cAAAC,GAAKC,QAAQ,MAAMC,IAAI,SACrBd,GACCK,EAACM,cAAAI,GAAOC,QAASb,EAAwBc,KAAK,YAC3CjB,GAGLK,EAAAM,cAACI,EAAM,CAACC,QAASd,EAAsBgB,SAAUjB,GAC9CF,IAKX,IAGFoB,OAAOC,OAAOzB,EAA0B,CACtC0B,YAAa"}
1	+ {"version":3,"file":"LegacyModalFooterButtons.js","sources":["../../../../../../src/components/LegacyModal/LegacyModalFooter/LegacyModalFooterButtons/LegacyModalFooterButtons.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport { VibeComponentProps } from \"../../../../types\";\nimport { getTestId } from \"../../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../../tests/constants\";\nimport Flex from \"../../../Flex/Flex\";\nimport Button from \"../../../Button/Button\";\nimport LegacyModalFooter from \"../LegacyModalFooter\";\n\nexport interface LegacyModalFooterButtonsProps extends VibeComponentProps {\n primaryButtonText: string;\n secondaryButtonText?: string;\n disablePrimaryButton?: boolean;\n onPrimaryButtonClick?: () => void;\n onSecondaryButtonClick?: () => void;\n}\n\nconst LegacyModalFooterButtons = forwardRef(\n (\n {\n primaryButtonText,\n secondaryButtonText,\n disablePrimaryButton,\n onPrimaryButtonClick,\n onSecondaryButtonClick,\n className,\n id,\n \"data-testid\": dataTestId\n }: LegacyModalFooterButtonsProps,\n // As ModalFooter does not currently forward refs\n // eslint-disable-next-line\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n return (\n <LegacyModalFooter\n id={id}\n className={className}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.MODAL_FOOTER_BUTTONS, id)}\n >\n <Flex justify=\"end\" gap=\"small\">\n {secondaryButtonText && (\n <Button onClick={onSecondaryButtonClick} kind=\"tertiary\">\n {secondaryButtonText}\n </Button>\n )}\n <Button onClick={onPrimaryButtonClick} disabled={disablePrimaryButton}>\n {primaryButtonText}\n </Button>\n </Flex>\n </LegacyModalFooter>\n );\n }\n);\n\nObject.assign(LegacyModalFooterButtons, {\n displayName: \"ModalFooterButtons\"\n});\n\nexport default LegacyModalFooterButtons;\n"],"names":["LegacyModalFooterButtons","forwardRef","_ref","ref","primaryButtonText","secondaryButtonText","disablePrimaryButton","onPrimaryButtonClick","onSecondaryButtonClick","id","React","LegacyModalFooter","className","getTestId","ComponentDefaultTestId","MODAL_FOOTER_BUTTONS","createElement","Flex","justify","gap","Button","onClick","kind","disabled","Object","assign","displayName"],"mappings":"4RAgBA,IAAMA,EAA2BC,GAC/B,SAAAC,EAaEC,GACE,IAZAC,EAAiBF,EAAjBE,kBACAC,EAAmBH,EAAnBG,oBACAC,EAAoBJ,EAApBI,qBACAC,EAAoBL,EAApBK,qBACAC,EAAsBN,EAAtBM,uBAEAC,EAAEP,EAAFO,GAOF,OACEC,gBAACC,EAAiB,CAChBF,GAAIA,EACJG,UAXOV,EAATU,UAYe,cAVUV,EAAzB,gBAU6BW,EAAUC,EAAuBC,qBAAsBN,IAElFC,EAACM,cAAAC,GAAKC,QAAQ,MAAMC,IAAI,SACrBd,GACCK,EAACM,cAAAI,GAAOC,QAASb,EAAwBc,KAAK,YAC3CjB,GAGLK,EAAAM,cAACI,EAAM,CAACC,QAASd,EAAsBgB,SAAUjB,GAC9CF,IAKX,IAGFoB,OAAOC,OAAOzB,EAA0B,CACtC0B,YAAa"}

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 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"}
1	+ {"version":3,"file":"LegacyModalHeader.js","sources":["../../../../../src/components/LegacyModal/LegacyModalHeader/LegacyModalHeader.tsx"],"sourcesContent":["import React from \"react\";\nimport cx from \"classnames\";\nimport IconButton from \"../../IconButton/IconButton\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport Icon from \"../../Icon/Icon\";\nimport { SubIcon, ElementContent, VibeComponentProps } from \"../../../types\";\nimport { NOOP } from \"../../../utils/function-utils\";\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\";\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 = ({\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}: LegacyModalHeaderProps) => {\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":"0gBA8DA,IAAMA,EAAoB,SAAHC,GAcM,IAZ3BC,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_de95eec132",icon:"icon_f4b7cd0c2c",description:"description_f43fcfed7b",closeButton:"closeButton_a7c8b53074"};!function(e){const n="s_id-f34f7b91e8f3_3_41_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_de95eec132 {\n  margin-block-start: var(--spacing-medium);\n}\n.container_de95eec132 .icon_f4b7cd0c2c {\n  margin-top: var(--spacing-xs);\n  flex-shrink: 0;\n  color: var(--primary-text-color);\n}\n.container_de95eec132 .description_f43fcfed7b {\n  margin-block-start: var(--spacing-small);\n  color: var(--secondary-text-color);\n}\n.container_de95eec132 .closeButton_a7c8b53074 {\n  position: absolute;\n  right: 20px;\n  top: 20px;\n}");export{e as default};
+var n={container:"container_91c581dd31",icon:"icon_f67a9f3386",description:"description_ff5cbd589d",closeButton:"closeButton_4d71c9a7c9"};!function(n){const e="s_id-f34f7b91e8f3_3_43_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const c=document.createElement("style");c.id=e,t.firstChild?t.insertBefore(c,t.firstChild):t.appendChild(c),c.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".container_91c581dd31 {\n  margin-block-start: var(--spacing-medium);\n}\n.container_91c581dd31 .icon_f67a9f3386 {\n  margin-top: var(--spacing-xs);\n  flex-shrink: 0;\n  color: var(--primary-text-color);\n}\n.container_91c581dd31 .description_ff5cbd589d {\n  margin-block-start: var(--spacing-small);\n  color: var(--secondary-text-color);\n}\n.container_91c581dd31 .closeButton_4d71c9a7c9 {\n  position: absolute;\n  right: 20px;\n  top: 20px;\n}");export{n 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 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"}
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, 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 = 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\ninterface LinkStaticProps {\n targets: typeof LinkTargetEnum;\n iconPositions: typeof IconPositionEnum;\n position: typeof IconPositionEnum;\n}\n\nexport default withStaticProps<LinkProps, LinkStaticProps>(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":"4nBAsIA,SAASA,EAAQC,EAAqBC,EAA+CC,GACnF,GAAKF,EACL,OAAOG,EAACC,cAAAC,EAAK,CAAAH,UAAWA,EAAWD,KAAMA,EAAMK,SAAS,QAC1D,CAQA,IAAeC,EAAAA,EAxEFC,GACX,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,IAc+D,CAC/DC,SAAUC,EACVC,cAAeD,EACfE,QAASC"}

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

@@ -1,2 +1,2 @@
-var n={link:"link_096d879159","focus-visible":"focus-visible_988e67fb06",colorOnPrimary:"colorOnPrimary_b8c6a39946",colorOnInverted:"colorOnInverted_4268e71807",text:"text_bb2b3239f3",inlineText:"inlineText_2c822b6961",inheritFontSize:"inheritFontSize_a6f39f80b9",iconStart:"iconStart_ec2705076d",iconEnd:"iconEnd_e6898fa3d6"};!function(n){const i="s_id-6fcc93dacbaa_3_41_0";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+i))return;const t=document.createElement("style");t.id=i,e.firstChild?e.insertBefore(t,e.firstChild):e.appendChild(t),t.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[i]=n)}(".link_096d879159 {\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_096d879159:focus-visible, .link_096d879159.focus-visible_988e67fb06 {\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_096d879159:focus:not(.focus-visible_988e67fb06) {\n  outline: none;\n}\n.link_096d879159.colorOnPrimary_b8c6a39946 {\n  color: var(--text-color-on-primary);\n}\n.link_096d879159.colorOnInverted_4268e71807 {\n  color: var(--text-color-on-inverted);\n}\n.link_096d879159:hover .text_bb2b3239f3 {\n  text-decoration: underline;\n  color: inherit;\n}\n.link_096d879159.inlineText_2c822b6961 {\n  display: inline-flex;\n  align-items: unset;\n}\n.link_096d879159.inheritFontSize_a6f39f80b9 {\n  font-size: inherit;\n  line-height: inherit;\n}\n.iconStart_ec2705076d {\n  line-height: 24px;\n  margin-right: var(--spacing-small);\n}\n.iconEnd_e6898fa3d6 {\n  line-height: 24px;\n  margin-left: var(--spacing-small);\n}\n@supports (margin-inline-start: initial) {\n  .iconStart_ec2705076d {\n    line-height: 24px;\n    margin-right: 0;\n    margin-inline-end: var(--spacing-xs);\n  }\n  .iconEnd_e6898fa3d6 {\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_127860993b","focus-visible":"focus-visible_30e51b3368",colorOnPrimary:"colorOnPrimary_c396a53bba",colorOnInverted:"colorOnInverted_73bda0787d",text:"text_467377edb0",inlineText:"inlineText_d5393c5cc8",inheritFontSize:"inheritFontSize_a90fff925c",iconStart:"iconStart_0b2dee646c",iconEnd:"iconEnd_619998f992"};!function(n){const i="s_id-6fcc93dacbaa_3_43_0";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+i))return;const t=document.createElement("style");t.id=i,e.firstChild?e.insertBefore(t,e.firstChild):e.appendChild(t),t.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[i]=n)}(".link_127860993b {\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_127860993b:focus-visible, .link_127860993b.focus-visible_30e51b3368 {\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_127860993b:focus:not(.focus-visible_30e51b3368) {\n  outline: none;\n}\n.link_127860993b.colorOnPrimary_c396a53bba {\n  color: var(--text-color-on-primary);\n}\n.link_127860993b.colorOnInverted_73bda0787d {\n  color: var(--text-color-on-inverted);\n}\n.link_127860993b:hover .text_467377edb0 {\n  text-decoration: underline;\n  color: inherit;\n}\n.link_127860993b.inlineText_d5393c5cc8 {\n  display: inline-flex;\n  align-items: unset;\n}\n.link_127860993b.inheritFontSize_a90fff925c {\n  font-size: inherit;\n  line-height: inherit;\n}\n.iconStart_0b2dee646c {\n  line-height: 24px;\n  margin-right: var(--spacing-small);\n}\n.iconEnd_619998f992 {\n  line-height: 24px;\n  margin-left: var(--spacing-small);\n}\n@supports (margin-inline-start: initial) {\n  .iconStart_0b2dee646c {\n    line-height: 24px;\n    margin-right: 0;\n    margin-inline-end: var(--spacing-xs);\n  }\n  .iconEnd_619998f992 {\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

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

@@ -1,2 +1,2 @@
-import{slicedToArray as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import e from"classnames";import r,{forwardRef as i,useRef as o,useState as n,useCallback as s,useEffect as a,useMemo as l}from"react";import c from"../../hooks/useMergeRef.js";import u from"../../hooks/useKeyEvent/index.js";import{VirtualizedListItems as m}from"./VirtualizedListItems/VirtualizedListItems.js";import{keyCodes as d,UP_DOWN_ARROWS as f}from"../../constants/keyCodes.js";import{withStaticProps as p}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import{ListWrapperComponentType as v}from"./ListConstants.js";import{getTestId as b,ComponentDefaultTestId as y}from"../../tests/testIds.js";import{ListContext as j}from"./utils/ListContext.js";import{useListId as I,getListItemIndexById as L,getNextListItemIndex as x,getPrevListItemIndex as h,getListItemIdByIndex as k,isListItem as A,getListItemComponentType as E}from"./utils/ListUtils.js";import g from"./List.module.scss.js";import{ComponentVibeId as R}from"../../tests/constants.js";var C=i((function(i,p){var v=i.className,O=i.id,P=i.component,T=void 0===P?C.components.UL:P,V=i.children,_=i.ariaLabel,D=i.ariaDescribedBy,N=i["aria-controls"],S=i.renderOnlyVisibleItems,U=void 0!==S&&S,W=i.style,z=i.role,B=void 0===z?"listbox":z,H=i["data-testid"],M=o(null),w=c(p,M),F=o([]),K=I(O),q=n(0),G=t(q,2),J=G[0],Q=G[1],X=T,Y=s((function(t){var e;Q(L(F,t)),null===(e=null==M?void 0:M.current)||void 0===e||e.setAttribute("aria-activedescendant",t)}),[]),Z=s((function(t){if(!U){t.preventDefault();var e=t.key===d.UP_ARROW,r=void 0;t.key===d.DOWN_ARROW&&F.current.length>J+1?r=x(J,F):e&&J>0&&(r=h(J,F)),void 0!==r&&(Y(k(F,r)),F.current[r].focus())}}),[J,U,Y]);u({keys:f,callback:Z,ref:M}),a((function(){var t=F.current.findIndex((function(t){return t instanceof HTMLElement&&A(t)&&"true"===(null==t?void 0:t.getAttribute("aria-selected"))}));if(-1!==t)Y(k(F,t));else{var e=F.current.findIndex((function(t){return A(t)}));-1!==e&&Y(k(F,e))}}),[Y]);var $=l((function(){var t=Array.isArray(V)?V:[V];return U?t=r.createElement(m,null,t):(F.current=F.current.slice(0,t.length),t=r.Children.map(t,(function(t,e){if(!r.isValidElement(t))return t;var i=t.props.id||"".concat(K,"-item-").concat(e),o=F.current[e],n=null==o||A(o);return r.cloneElement(t,{ref:function(t){return F.current[e]=t},tabIndex:J===e&&n?0:-1,id:i,component:E(T),role:t.props.role})}))),t}),[V,T,J,K,U]);return r.createElement(j.Provider,{value:{updateFocusedItem:Y}},r.createElement(X,{"data-testid":H||b(y.LIST,O),"data-vibe":R.LIST,ref:w,style:W,className:e(g.list,v),id:K,"aria-label":_,"aria-describedby":D,"aria-controls":N,tabIndex:-1,role:B},$))})),O=p(C,{components:v});export{O as default};
+import{slicedToArray as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import e from"classnames";import r,{forwardRef as i,useRef as o,useState as s,useCallback as n,useEffect as a,useMemo as l}from"react";import c from"../../hooks/useMergeRef.js";import u from"../../hooks/useKeyEvent/index.js";import{VirtualizedListItems as m}from"./VirtualizedListItems/VirtualizedListItems.js";import{keyCodes as d,UP_DOWN_ARROWS as f}from"../../constants/keyCodes.js";import{withStaticProps as p}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import{ListWrapperComponentType as v}from"./ListConstants.js";import{getTestId as b,ComponentDefaultTestId as y}from"../../tests/testIds.js";import{ListContext as j}from"./utils/ListContext.js";import{useListId as I,getListItemIndexById as L,getNextListItemIndex as x,getPrevListItemIndex as h,getListItemIdByIndex as k,isListItem as A,getListItemComponentType as E}from"./utils/ListUtils.js";import g from"./List.module.scss.js";import{ComponentVibeId as R}from"../../tests/constants.js";var C=p(i((function(i,p){var C=i.className,O=i.id,P=i.component,T=void 0===P?v.UL:P,V=i.children,_=i.ariaLabel,D=i.ariaDescribedBy,N=i["aria-controls"],S=i.renderOnlyVisibleItems,U=void 0!==S&&S,W=i.style,z=i.role,B=void 0===z?"listbox":z,H=i["data-testid"],M=o(null),w=c(p,M),F=o([]),K=I(O),q=s(0),G=t(q,2),J=G[0],Q=G[1],X=T,Y=n((function(t){var e;Q(L(F,t)),null===(e=null==M?void 0:M.current)||void 0===e||e.setAttribute("aria-activedescendant",t)}),[]),Z=n((function(t){if(!U){t.preventDefault();var e=t.key===d.UP_ARROW,r=void 0;t.key===d.DOWN_ARROW&&F.current.length>J+1?r=x(J,F):e&&J>0&&(r=h(J,F)),void 0!==r&&(Y(k(F,r)),F.current[r].focus())}}),[J,U,Y]);u({keys:f,callback:Z,ref:M}),a((function(){var t=F.current.findIndex((function(t){return t instanceof HTMLElement&&A(t)&&"true"===(null==t?void 0:t.getAttribute("aria-selected"))}));if(-1!==t)Y(k(F,t));else{var e=F.current.findIndex((function(t){return A(t)}));-1!==e&&Y(k(F,e))}}),[Y]);var $=l((function(){var t=Array.isArray(V)?V:[V];return U?t=r.createElement(m,null,t):(F.current=F.current.slice(0,t.length),t=r.Children.map(t,(function(t,e){if(!r.isValidElement(t))return t;var i=t.props.id||"".concat(K,"-item-").concat(e),o=F.current[e],s=null==o||A(o);return r.cloneElement(t,{ref:function(t){return F.current[e]=t},tabIndex:J===e&&s?0:-1,id:i,component:E(T),role:t.props.role})}))),t}),[V,T,J,K,U]);return r.createElement(j.Provider,{value:{updateFocusedItem:Y}},r.createElement(X,{"data-testid":H||b(y.LIST,O),"data-vibe":R.LIST,ref:w,style:W,className:e(g.list,C),id:K,"aria-label":_,"aria-describedby":D,"aria-controls":N,tabIndex:-1,role:B},$))})),{components:v});export{C as default};
 //# sourceMappingURL=List.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"List.js","sources":["../../../../src/components/List/List.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, {\n AriaAttributes,\n AriaRole,\n CSSProperties,\n forwardRef,\n ReactElement,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState\n} from \"react\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport useKeyEvent from \"../../hooks/useKeyEvent\";\nimport { VirtualizedListItems } from \"./VirtualizedListItems/VirtualizedListItems\";\nimport { keyCodes, UP_DOWN_ARROWS } from \"../../constants/keyCodes\";\nimport { VibeComponent, withStaticProps, VibeComponentProps } from \"../../types\";\nimport { ListItemProps } from \"../ListItem/ListItem\";\nimport { ListTitleProps } from \"../ListTitle/ListTitle\";\nimport { ListWrapperComponentType as ListWrapperComponentTypeEnum } from \"./ListConstants\";\nimport { ListElement } from \"./List.types\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { ListContext } from \"./utils/ListContext\";\nimport {\n getListItemComponentType,\n getListItemIdByIndex,\n getListItemIndexById,\n getNextListItemIndex,\n getPrevListItemIndex,\n isListItem,\n useListId\n} from \"./utils/ListUtils\";\nimport styles from \"./List.module.scss\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface ListProps extends VibeComponentProps {\n /*\n The wrapping component for the list.\n /\n component?: ListElement;\n /\n The ARIA label describing the list.\n /\n ariaLabel?: string;\n /\n The ID of an element that describes the list.\n /\n ariaDescribedBy?: string;\n /\n The ID of an element controlled by the list.\n /\n \"aria-controls\"?: AriaAttributes[\"aria-controls\"];\n /\n The child elements inside the list.\n /\n children?: ReactElement<ListItemProps \| ListTitleProps> \| ReactElement<ListItemProps \| ListTitleProps>[];\n /\n If true, uses a virtualized list to render only visible items for performance optimization.\n /\n renderOnlyVisibleItems?: boolean;\n /\n Custom inline styles applied to the list.\n /\n style?: CSSProperties;\n /\n The ARIA role of the list.\n */\n role?: AriaRole;\n}\n\nconst List: VibeComponent<ListProps> & {\n components?: typeof ListWrapperComponentTypeEnum;\n} = forwardRef(\n (\n {\n className,\n id,\n component = List.components.UL,\n children,\n ariaLabel,\n ariaDescribedBy,\n \"aria-controls\": ariaControls,\n renderOnlyVisibleItems = false,\n style,\n role = \"listbox\",\n \"data-testid\": dataTestId\n }: ListProps,\n ref\n ) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n const childrenRefs: React.MutableRefObject<HTMLElement[]> = useRef([]);\n\n const overrideId = useListId(id);\n const [focusIndex, setFocusIndex] = useState(0);\n const Component = component;\n\n const updateFocusedItem = useCallback((id: string) => {\n setFocusIndex(getListItemIndexById(childrenRefs, id));\n componentRef?.current?.setAttribute(\"aria-activedescendant\", id);\n }, []);\n\n const onUpDownArrows = useCallback(\n (event: KeyboardEvent) => {\n if (renderOnlyVisibleItems) {\n return;\n }\n event.preventDefault();\n\n const isUpKey = event.key === keyCodes.UP_ARROW;\n const isDownKey = event.key === keyCodes.DOWN_ARROW;\n let overrideFocusIndex = undefined;\n\n if (isDownKey && focusIndex + 1 < childrenRefs.current.length) {\n overrideFocusIndex = getNextListItemIndex(focusIndex, childrenRefs);\n } else if (isUpKey && focusIndex > 0) {\n overrideFocusIndex = getPrevListItemIndex(focusIndex, childrenRefs);\n }\n if (overrideFocusIndex !== undefined) {\n updateFocusedItem(getListItemIdByIndex(childrenRefs, overrideFocusIndex));\n childrenRefs.current[overrideFocusIndex].focus();\n }\n },\n [focusIndex, renderOnlyVisibleItems, updateFocusedItem]\n );\n\n useKeyEvent({\n keys: UP_DOWN_ARROWS,\n callback: onUpDownArrows,\n ref: componentRef\n });\n\n useEffect(() => {\n const selectedItemIndex = childrenRefs.current.findIndex(\n child => child instanceof HTMLElement && isListItem(child) && child?.getAttribute(\"aria-selected\") === \"true\"\n );\n if (selectedItemIndex !== -1) {\n updateFocusedItem(getListItemIdByIndex(childrenRefs, selectedItemIndex));\n } else {\n const firstFocusableIndex = childrenRefs.current.findIndex(child => isListItem(child));\n if (firstFocusableIndex !== -1) {\n updateFocusedItem(getListItemIdByIndex(childrenRefs, firstFocusableIndex));\n }\n }\n }, [updateFocusedItem]);\n\n const overrideChildren = useMemo(() => {\n let override: ReactElement \| ReactElement[] = Array.isArray(children) ? children : [children];\n if (renderOnlyVisibleItems) {\n override = <VirtualizedListItems>{override}</VirtualizedListItems>;\n } else {\n childrenRefs.current = childrenRefs.current.slice(0, override.length);\n override = React.Children.map(override, (child, index) => {\n if (!React.isValidElement(child)) {\n return child;\n }\n const id = (child.props as ListItemProps).id \|\| `${overrideId}-item-${index}`;\n const currentRef = childrenRefs.current[index];\n const isFocusableItem = currentRef === undefined \|\| currentRef === null \|\| isListItem(currentRef);\n return React.cloneElement(child, {\n // @ts-ignore not sure how to deal with ref here\n ref: ref => (childrenRefs.current[index] = ref),\n tabIndex: focusIndex === index && isFocusableItem ? 0 : -1,\n id,\n component: getListItemComponentType(component),\n role: (child.props as ListItemProps).role\n });\n });\n }\n\n return override;\n }, [children, component, focusIndex, overrideId, renderOnlyVisibleItems]);\n\n return (\n <ListContext.Provider value={{ updateFocusedItem }}>\n <Component\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.LIST, id)}\n data-vibe={ComponentVibeId.LIST}\n ref={mergedRef}\n style={style}\n className={cx(styles.list, className)}\n id={overrideId}\n aria-label={ariaLabel}\n aria-describedby={ariaDescribedBy}\n aria-controls={ariaControls}\n tabIndex={-1}\n role={role}\n >\n {overrideChildren}\n </Component>\n </ListContext.Provider>\n );\n }\n);\n\nexport default withStaticProps(List, {\n components: ListWrapperComponentTypeEnum\n});\n"],"names":["List","forwardRef","_ref","ref","className","id","_ref$component","component","components","UL","children","ariaLabel","ariaDescribedBy","ariaControls","_ref$renderOnlyVisibl","renderOnlyVisibleItems","style","_ref$role","role","dataTestId","componentRef","useRef","mergedRef","useMergeRef","childrenRefs","overrideId","useListId","_useState","useState","_useState2","_slicedToArray","focusIndex","setFocusIndex","Component","updateFocusedItem","useCallback","getListItemIndexById","_a","current","setAttribute","onUpDownArrows","event","preventDefault","isUpKey","key","keyCodes","UP_ARROW","overrideFocusIndex","undefined","DOWN_ARROW","length","getNextListItemIndex","getPrevListItemIndex","getListItemIdByIndex","focus","useKeyEvent","keys","UP_DOWN_ARROWS","callback","useEffect","selectedItemIndex","findIndex","child","HTMLElement","isListItem","getAttribute","firstFocusableIndex","overrideChildren","useMemo","override","Array","isArray","React","createElement","VirtualizedListItems","slice","Children","map","index","isValidElement","props","concat","currentRef","isFocusableItem","cloneElement","_ref2","tabIndex","getListItemComponentType","ListContext","Provider","value","getTestId","ComponentDefaultTestId","LIST","ComponentVibeId","cx","styles","list","withStaticProps","ListWrapperComponentTypeEnum"],"mappings":"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"}
1	+ {"version":3,"file":"List.js","sources":["../../../../src/components/List/List.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, {\n AriaAttributes,\n AriaRole,\n CSSProperties,\n forwardRef,\n ReactElement,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState\n} from \"react\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport useKeyEvent from \"../../hooks/useKeyEvent\";\nimport { VirtualizedListItems } from \"./VirtualizedListItems/VirtualizedListItems\";\nimport { keyCodes, UP_DOWN_ARROWS } from \"../../constants/keyCodes\";\nimport { withStaticProps, VibeComponentProps } from \"../../types\";\nimport { ListItemProps } from \"../ListItem/ListItem\";\nimport { ListTitleProps } from \"../ListTitle/ListTitle\";\nimport { ListWrapperComponentType as ListWrapperComponentTypeEnum } from \"./ListConstants\";\nimport { ListElement } from \"./List.types\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { ListContext } from \"./utils/ListContext\";\nimport {\n getListItemComponentType,\n getListItemIdByIndex,\n getListItemIndexById,\n getNextListItemIndex,\n getPrevListItemIndex,\n isListItem,\n useListId\n} from \"./utils/ListUtils\";\nimport styles from \"./List.module.scss\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface ListProps extends VibeComponentProps {\n /*\n The wrapping component for the list.\n /\n component?: ListElement;\n /\n The ARIA label describing the list.\n /\n ariaLabel?: string;\n /\n The ID of an element that describes the list.\n /\n ariaDescribedBy?: string;\n /\n The ID of an element controlled by the list.\n /\n \"aria-controls\"?: AriaAttributes[\"aria-controls\"];\n /\n The child elements inside the list.\n /\n children?: ReactElement<ListItemProps \| ListTitleProps> \| ReactElement<ListItemProps \| ListTitleProps>[];\n /\n If true, uses a virtualized list to render only visible items for performance optimization.\n /\n renderOnlyVisibleItems?: boolean;\n /\n Custom inline styles applied to the list.\n /\n style?: CSSProperties;\n /\n The ARIA role of the list.\n */\n role?: AriaRole;\n}\n\nconst List = forwardRef(\n (\n {\n className,\n id,\n component = ListWrapperComponentTypeEnum.UL,\n children,\n ariaLabel,\n ariaDescribedBy,\n \"aria-controls\": ariaControls,\n renderOnlyVisibleItems = false,\n style,\n role = \"listbox\",\n \"data-testid\": dataTestId\n }: ListProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n const childrenRefs: React.MutableRefObject<HTMLElement[]> = useRef([]);\n\n const overrideId = useListId(id);\n const [focusIndex, setFocusIndex] = useState(0);\n const Component = component;\n\n const updateFocusedItem = useCallback((id: string) => {\n setFocusIndex(getListItemIndexById(childrenRefs, id));\n componentRef?.current?.setAttribute(\"aria-activedescendant\", id);\n }, []);\n\n const onUpDownArrows = useCallback(\n (event: KeyboardEvent) => {\n if (renderOnlyVisibleItems) {\n return;\n }\n event.preventDefault();\n\n const isUpKey = event.key === keyCodes.UP_ARROW;\n const isDownKey = event.key === keyCodes.DOWN_ARROW;\n let overrideFocusIndex = undefined;\n\n if (isDownKey && focusIndex + 1 < childrenRefs.current.length) {\n overrideFocusIndex = getNextListItemIndex(focusIndex, childrenRefs);\n } else if (isUpKey && focusIndex > 0) {\n overrideFocusIndex = getPrevListItemIndex(focusIndex, childrenRefs);\n }\n if (overrideFocusIndex !== undefined) {\n updateFocusedItem(getListItemIdByIndex(childrenRefs, overrideFocusIndex));\n childrenRefs.current[overrideFocusIndex].focus();\n }\n },\n [focusIndex, renderOnlyVisibleItems, updateFocusedItem]\n );\n\n useKeyEvent({\n keys: UP_DOWN_ARROWS,\n callback: onUpDownArrows,\n ref: componentRef\n });\n\n useEffect(() => {\n const selectedItemIndex = childrenRefs.current.findIndex(\n child => child instanceof HTMLElement && isListItem(child) && child?.getAttribute(\"aria-selected\") === \"true\"\n );\n if (selectedItemIndex !== -1) {\n updateFocusedItem(getListItemIdByIndex(childrenRefs, selectedItemIndex));\n } else {\n const firstFocusableIndex = childrenRefs.current.findIndex(child => isListItem(child));\n if (firstFocusableIndex !== -1) {\n updateFocusedItem(getListItemIdByIndex(childrenRefs, firstFocusableIndex));\n }\n }\n }, [updateFocusedItem]);\n\n const overrideChildren = useMemo(() => {\n let override: ReactElement \| ReactElement[] = Array.isArray(children) ? children : [children];\n if (renderOnlyVisibleItems) {\n override = <VirtualizedListItems>{override}</VirtualizedListItems>;\n } else {\n childrenRefs.current = childrenRefs.current.slice(0, override.length);\n override = React.Children.map(override, (child, index) => {\n if (!React.isValidElement(child)) {\n return child;\n }\n const id = (child.props as ListItemProps).id \|\| `${overrideId}-item-${index}`;\n const currentRef = childrenRefs.current[index];\n const isFocusableItem = currentRef === undefined \|\| currentRef === null \|\| isListItem(currentRef);\n return React.cloneElement(child, {\n // @ts-ignore not sure how to deal with ref here\n ref: ref => (childrenRefs.current[index] = ref),\n tabIndex: focusIndex === index && isFocusableItem ? 0 : -1,\n id,\n component: getListItemComponentType(component),\n role: (child.props as ListItemProps).role\n });\n });\n }\n\n return override;\n }, [children, component, focusIndex, overrideId, renderOnlyVisibleItems]);\n\n return (\n <ListContext.Provider value={{ updateFocusedItem }}>\n <Component\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.LIST, id)}\n data-vibe={ComponentVibeId.LIST}\n ref={mergedRef}\n style={style}\n className={cx(styles.list, className)}\n id={overrideId}\n aria-label={ariaLabel}\n aria-describedby={ariaDescribedBy}\n aria-controls={ariaControls}\n tabIndex={-1}\n role={role}\n >\n {overrideChildren}\n </Component>\n </ListContext.Provider>\n );\n }\n);\n\ninterface ListStaticProps {\n components: typeof ListWrapperComponentTypeEnum;\n}\n\nexport default withStaticProps<ListProps, ListStaticProps>(List, {\n components: ListWrapperComponentTypeEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","id","_ref$component","component","ListWrapperComponentTypeEnum","UL","children","ariaLabel","ariaDescribedBy","ariaControls","_ref$renderOnlyVisibl","renderOnlyVisibleItems","style","_ref$role","role","dataTestId","componentRef","useRef","mergedRef","useMergeRef","childrenRefs","overrideId","useListId","_useState","useState","_useState2","_slicedToArray","focusIndex","setFocusIndex","Component","updateFocusedItem","useCallback","getListItemIndexById","_a","current","setAttribute","onUpDownArrows","event","preventDefault","isUpKey","key","keyCodes","UP_ARROW","overrideFocusIndex","undefined","DOWN_ARROW","length","getNextListItemIndex","getPrevListItemIndex","getListItemIdByIndex","focus","useKeyEvent","keys","UP_DOWN_ARROWS","callback","useEffect","selectedItemIndex","findIndex","child","HTMLElement","isListItem","getAttribute","firstFocusableIndex","overrideChildren","useMemo","override","Array","isArray","React","createElement","VirtualizedListItems","slice","Children","map","index","isValidElement","props","concat","currentRef","isFocusableItem","cloneElement","_ref2","tabIndex","getListItemComponentType","ListContext","Provider","value","getTestId","ComponentDefaultTestId","LIST","ComponentVibeId","cx","styles","list","components"],"mappings":"kiCAuEA,IA+HeA,EAAAA,EA/HFC,GACX,SAAAC,EAcEC,GACE,IAbAC,EAASF,EAATE,UACAC,EAAEH,EAAFG,GAAEC,EAAAJ,EACFK,UAAAA,OAAS,IAAAD,EAAGE,EAA6BC,GAAEH,EAC3CI,EAAQR,EAARQ,SACAC,EAAST,EAATS,UACAC,EAAeV,EAAfU,gBACiBC,EAAYX,EAA7B,iBAAeY,EAAAZ,EACfa,uBAAAA,OAAyB,IAAHD,GAAQA,EAC9BE,EAAKd,EAALc,MAAKC,EAAAf,EACLgB,KAAAA,OAAO,IAAHD,EAAG,UAASA,EACDE,EAAUjB,EAAzB,eAIIkB,EAAeC,EAAO,MACtBC,EAAYC,EAAYpB,EAAKiB,GAC7BI,EAAsDH,EAAO,IAE7DI,EAAaC,EAAUrB,GAC7BsB,EAAoCC,EAAS,GAAEC,EAAAC,EAAAH,EAAA,GAAxCI,EAAUF,EAAA,GAAEG,EAAaH,EAAA,GAC1BI,EAAY1B,EAEZ2B,EAAoBC,GAAY,SAAC9B,SACrC2B,EAAcI,EAAqBZ,EAAcnB,IAC1B,QAAvBgC,EAAAjB,aAAY,EAAZA,EAAckB,eAAS,IAAAD,GAAAA,EAAAE,aAAa,wBAAyBlC,EAC9D,GAAE,IAEGmC,EAAiBL,GACrB,SAACM,GACC,IAAI1B,EAAJ,CAGA0B,EAAMC,iBAEN,IAAMC,EAAUF,EAAMG,MAAQC,EAASC,SAEnCC,OAAqBC,EADPP,EAAMG,MAAQC,EAASI,YAGPzB,EAAac,QAAQY,OAAtCnB,EAAa,EAC5BgB,EAAqBI,EAAqBpB,EAAYP,GAC7CmB,GAAWZ,EAAa,IACjCgB,EAAqBK,EAAqBrB,EAAYP,SAE7BwB,IAAvBD,IACFb,EAAkBmB,EAAqB7B,EAAcuB,IACrDvB,EAAac,QAAQS,GAAoBO,QAd1C,CAgBF,GACD,CAACvB,EAAYhB,EAAwBmB,IAGvCqB,EAAY,CACVC,KAAMC,EACNC,SAAUlB,EACVrC,IAAKiB,IAGPuC,GAAU,WACR,IAAMC,EAAoBpC,EAAac,QAAQuB,WAC7C,SAAAC,GAAK,OAAIA,aAAiBC,aAAeC,EAAWF,IAAmD,UAAzCA,aAAA,EAAAA,EAAOG,aAAa,qBAEpF,IAA2B,IAAvBL,EACF1B,EAAkBmB,EAAqB7B,EAAcoC,QAChD,CACL,IAAMM,EAAsB1C,EAAac,QAAQuB,WAAU,SAAAC,GAAK,OAAIE,EAAWF,OAClD,IAAzBI,GACFhC,EAAkBmB,EAAqB7B,EAAc0C,GAExD,CACH,GAAG,CAAChC,IAEJ,IAAMiC,EAAmBC,GAAQ,WAC/B,IAAIC,EAA0CC,MAAMC,QAAQ7D,GAAYA,EAAW,CAACA,GAuBpF,OAtBIK,EACFsD,EAAWG,EAACC,cAAAC,EAAsB,KAAAL,IAElC7C,EAAac,QAAUd,EAAac,QAAQqC,MAAM,EAAGN,EAASnB,QAC9DmB,EAAWG,EAAMI,SAASC,IAAIR,GAAU,SAACP,EAAOgB,GAC9C,IAAKN,EAAMO,eAAejB,GACxB,OAAOA,EAET,IAAMzD,EAAMyD,EAAMkB,MAAwB3E,IAAE4E,GAAAA,OAAOxD,EAAU,UAAAwD,OAASH,GAChEI,EAAa1D,EAAac,QAAQwC,GAClCK,EAAkBD,SAAmDlB,EAAWkB,GACtF,OAAOV,EAAMY,aAAatB,EAAO,CAE/B3D,IAAK,SAAGkF,GAAA,OAAK7D,EAAac,QAAQwC,GAAS3E,CAAI,EAC/CmF,SAAUvD,IAAe+C,GAASK,EAAkB,GAAK,EACzD9E,GAAAA,EACAE,UAAWgF,EAAyBhF,GACpCW,KAAO4C,EAAMkB,MAAwB9D,MAEzC,KAGKmD,CACT,GAAG,CAAC3D,EAAUH,EAAWwB,EAAYN,EAAYV,IAEjD,OACEyD,EAACC,cAAAe,EAAYC,UAASC,MAAO,CAAExD,kBAAAA,IAC7BsC,EAACC,cAAAxC,EACc,CAAA,cAAAd,GAAcwE,EAAUC,EAAuBC,KAAMxF,GAAG,YAC1DyF,EAAgBD,KAC3B1F,IAAKmB,EACLN,MAAOA,EACPZ,UAAW2F,EAAGC,EAAOC,KAAM7F,GAC3BC,GAAIoB,EACQ,aAAAd,EACM,mBAAAC,EACH,gBAAAC,EACfyE,UAAW,EACXpE,KAAMA,GAELiD,GAIT,IAO+D,CAC/D+B,WAAY1F"}