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

@vibe/core 4.2.3 → 4.2.4

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

Files changed (1134) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Label.js","sources":["../../../../../src/components/Label/Label.tsx"],"sourcesContent":["import { camelCase } from \"es-toolkit\";\nimport cx from \"classnames\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { getStyle, useMergeRef } from \"@vibe/shared\";\nimport React, { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { Text } from \"@vibe/typography\";\nimport Leg from \"./Leg\";\nimport { type LabelColor, type LabelKind, type ContentColor } from \"./Label.types\";\nimport { contentColors } from \"../../utils/colors-vars-map\";\nimport { type VibeComponentProps } from \"../../types\";\nimport { useClickableProps } from \"@vibe/clickable\";\n\nimport styles from \"./Label.module.scss\";\nimport LabelCelebrationAnimation from \"./LabelCelebrationAnimation\";\nimport { type LabelSizes } from \"./Label.types\";\nimport { mapSizesToTextSize } from \"./LabelConstants\";\nimport { ComponentVibeId } from \"../../tests/constants\";\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 if (kind === \"line\") {\n return { color: `var(--color-${color})` };\n }\n return { backgroundColor: `var(--color-${color})` };\n }\n }, [color, kind]);\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 \"aria-hidden\": false,\n \"aria-haspopup\": false,\n \"aria-expanded\": 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 data-vibe={ComponentVibeId.LABEL}\n ref={mergedRef}\n >\n <Text\n style={backgroundColorStyle}\n element=\"span\"\n type={mapSizesToTextSize[size]}\n className={classNames}\n color={color === \"dark\" ? \"onInverted\" : \"onPrimary\"}\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 color\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 Label;\n"],"names":["Label","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","concat","backgroundColor","onClickCallback","useCallback","event","preventDefault","clickableProps","useClickableProps","useEffect","React","createElement","Object","assign","clickableWrapper","getTestId","ComponentDefaultTestId","LABEL","ComponentVibeId","Text","style","element","type","mapSizesToTextSize","smallText","legWrapper","Leg","LabelCelebrationAnimation","onAnimationEnd"],"mappings":"~~mzBAqDA~~,~~IAAMA~~,EAAQC,GACZ,SAAAC,EAcEC,GACE,IAbAC,EAASF,EAATE,UACAC,EAAcH,EAAdG,eAAcC,EAAAJ,EACdK,KAAAA,~~OAAI~~,~~IAAAD~~,EAAG,OAAMA,EAAAE,EAAAN,EACbO,MAAAA,~~OAAK~~,~~IAAAD~~,EAAG,UAASA,EAAAE,EAAAR,EACjBS,KAAAA,~~OAAI~~,~~IAAAD~~,EAAG,GAAEA,EAAAE,EAAAV,EACTW,cAAAA,~~OAAa~~,~~IAAAD~~,GAAQA,EACrBE,EAAEZ,EAAFY,GACeC,EAAUb,EAAzB,eACAc,EAAOd,EAAPc,QACAC,EAAoBf,EAApBe,qBAAoBC,EAAAhB,EACpBiB,KAAAA,~~OAAI~~,~~IAAAD~~,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,MAAa,SAATF,EACK,CAAEE,MAAK,eAAAoC,OAAiBpC,EAAK,MAE/B,CAAEqC,gBAAe,eAAAD,OAAiBpC,EAAK,KAElD,GAAG,CAACA,EAAOF,IAELwC,EAAkBC,GACtB,SAACC,GACKjC,IACFiC,EAAMC,iBACNlC,EAAQiC,GAEZ,GACA,CAACjC,IAGGmC,EAAiBC,EACrB,CACEpC,QAAS+B,EACTjC,GAAAA,EACA,eAAe,EACf,iBAAiB,EACjB,iBAAiB,GAEnBM,GAGFiC,GAAU,WACRxB,EAA0BZ,EAC5B,GAAG,CAACA,IAEJ,IAAMkB,EAAQH,GAAQ,WACpB,OACEsB,~~EAAAC~~,cAAA,OAAAC,OAAAC,OAAA,CAAA,~~EACO3B~~,GAAeqB,~~EAAe~~,~~CACnC~~/C,UAAW6B,EAAEK,~~EAAA~~,~~CAAA~~,~~EAAIJ~~,EAAOwB,iBAAmB5B,GAAe1B,~~GAAU~~,~~cACvDW~~,GAAc4C,EAAUC,EAAuBC,MAAO/C,eACxDgD,EAAgBD,MAC3B1D,IAAKmB,IAELgC,EAAAC,cAACQ,EAAI,CACHC,MAAOtB,EACPuB,QAAQ,OACRC,KAAMC,EAAmBhD,GACzBf,UAAW2B,EACXtB,MAAiB,SAAVA,EAAmB,aAAe,oCAClBmB,GAEvB0B,EAAAC,cAACQ,EAAI,CACHE,QAAQ,OACRC,KAAMC,EAAmBhD,GACzBV,MAAM,UACNL,UAAW6B,EAAEK,~~EAAA~~,~~CAAA~~,~~EAAIJ~~,EAAOkC,UAAqB,UAATjD,KAEnCR,GAEH2C,~~EAAAC~~,cAAA,OAAA,~~CAAMnD~~,UAAW6B,EAAGC,EAAOmC,aAAcxD,EAAgByC,~~EAAAC~~,~~cAACe~~,~~EAAG~~,~~MAAM~~,OAI3E,GAAG,CACDxC,EACAqB,EACA/C,EACAW,EACAD,EACAQ,EACAS,EACAH,EACAjB,EACAE,EACAM,EACAuB,EACAjC,IAIF,OAAImB,GAAmC,SAATrB,EAE1B+C,~~EAAAC~~,~~cAACgB~~,~~EAAyB~~,~~CAACC~~,eAAgB,WAAA,OAAM3C,GAA0B,EAAM,GAC9EM,GAKAA,CACT"}
1	+ {"version":3,"file":"Label.js","sources":["../../../../../src/components/Label/Label.tsx"],"sourcesContent":["import { camelCase } from \"es-toolkit\";\nimport cx from \"classnames\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { getStyle, useMergeRef } from \"@vibe/shared\";\nimport React, { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { Text } from \"@vibe/typography\";\nimport Leg from \"./Leg\";\nimport { type LabelColor, type LabelKind, type ContentColor } from \"./Label.types\";\nimport { contentColors } from \"../../utils/colors-vars-map\";\nimport { type VibeComponentProps } from \"../../types\";\nimport { useClickableProps } from \"@vibe/clickable\";\n\nimport styles from \"./Label.module.scss\";\nimport LabelCelebrationAnimation from \"./LabelCelebrationAnimation\";\nimport { type LabelSizes } from \"./Label.types\";\nimport { mapSizesToTextSize } from \"./LabelConstants\";\nimport { ComponentVibeId } from \"../../tests/constants\";\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 if (kind === \"line\") {\n return { color: `var(--color-${color})` };\n }\n return { backgroundColor: `var(--color-${color})` };\n }\n }, [color, kind]);\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 \"aria-hidden\": false,\n \"aria-haspopup\": false,\n \"aria-expanded\": 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 data-vibe={ComponentVibeId.LABEL}\n ref={mergedRef}\n >\n <Text\n style={backgroundColorStyle}\n element=\"span\"\n type={mapSizesToTextSize[size]}\n className={classNames}\n color={color === \"dark\" ? \"onInverted\" : \"onPrimary\"}\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 color\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 Label;\n"],"names":["Label","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","concat","backgroundColor","onClickCallback","useCallback","event","preventDefault","clickableProps","useClickableProps","useEffect","React","createElement","Object","assign","clickableWrapper","getTestId","ComponentDefaultTestId","LABEL","ComponentVibeId","Text","style","element","type","mapSizesToTextSize","smallText","legWrapper","Leg","LabelCelebrationAnimation","onAnimationEnd"],"mappings":"szBAqDMA,IAAAA,EAAQC,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,MAAa,SAATF,EACK,CAAEE,MAAK,eAAAoC,OAAiBpC,EAAK,MAE/B,CAAEqC,gBAAe,eAAAD,OAAiBpC,EAAK,KAElD,GAAG,CAACA,EAAOF,IAELwC,EAAkBC,GACtB,SAACC,GACKjC,IACFiC,EAAMC,iBACNlC,EAAQiC,GAEZ,GACA,CAACjC,IAGGmC,EAAiBC,EACrB,CACEpC,QAAS+B,EACTjC,GAAAA,EACA,eAAe,EACf,iBAAiB,EACjB,iBAAiB,GAEnBM,GAGFiC,GAAU,WACRxB,EAA0BZ,EAC5B,GAAG,CAACA,IAEJ,IAAMkB,EAAQH,GAAQ,WACpB,OACEsB,EACMC,cAAA,OAAAC,OAAAC,OAAA,CAAA,EAAC3B,GAAeqB,EACpB,CAAA/C,UAAW6B,EAAEK,EAAIJ,CAAAA,EAAAA,EAAOwB,iBAAmB5B,GAAe1B,GAC7C,cAAAW,GAAc4C,EAAUC,EAAuBC,MAAO/C,eACxDgD,EAAgBD,MAC3B1D,IAAKmB,IAELgC,EAAAC,cAACQ,EAAI,CACHC,MAAOtB,EACPuB,QAAQ,OACRC,KAAMC,EAAmBhD,GACzBf,UAAW2B,EACXtB,MAAiB,SAAVA,EAAmB,aAAe,oCAClBmB,GAEvB0B,EAAAC,cAACQ,EAAI,CACHE,QAAQ,OACRC,KAAMC,EAAmBhD,GACzBV,MAAM,UACNL,UAAW6B,EAAEK,EAAIJ,CAAAA,EAAAA,EAAOkC,UAAqB,UAATjD,KAEnCR,GAEH2C,EAAMC,cAAA,OAAA,CAAAnD,UAAW6B,EAAGC,EAAOmC,aAAcxD,EAAgByC,EAACC,cAAAe,EAAM,MAAG,OAI3E,GAAG,CACDxC,EACAqB,EACA/C,EACAW,EACAD,EACAQ,EACAS,EACAH,EACAjB,EACAE,EACAM,EACAuB,EACAjC,IAIF,OAAImB,GAAmC,SAATrB,EAE1B+C,EAACC,cAAAgB,EAA0B,CAAAC,eAAgB,WAAA,OAAM3C,GAA0B,EAAM,GAC9EM,GAKAA,CACT"}

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

@@ -1,2 +1,2 @@
-var n={clickableWrapper:"clickableWrapper","focus-visible":"focus-visible",label:"label",small:"small",withLeg:"withLeg",legWrapper:"legWrapper",kindFill:"kindFill",colorPrimary:"colorPrimary",clickable:"clickable",colorDark:"colorDark",colorNegative:"colorNegative",colorPositive:"colorPositive",kindLine:"kindLine",smallText:"smallText"};!function(n){const r="s_id-05b0d3f05a05_4_2_2";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+r))return;const i=document.createElement("style");i.id=r,o.firstChild?o.insertBefore(i,o.firstChild):o.appendChild(i),i.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=n)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable */\n/* stylelint-enable */\n.clickableWrapper {\n  cursor: pointer;\n}\n.clickableWrapper:focus-visible, .clickableWrapper.focus-visible {\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:focus:not(.focus-visible) {\n  outline: none;\n}\n.clickableWrapper:active {\n  transform: scale(0.95) translate3d(0, 0, 0);\n  transition: var(--motion-productive-short) transform;\n}\n.label {\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(--space-8);\n  position: relative;\n}\n.label.small {\n  padding: 0 var(--space-4);\n  border-radius: 2px;\n}\n.withLeg {\n  border-start-start-radius: var(--border-radius-small);\n  border-start-end-radius: var(--border-radius-small);\n  border-end-end-radius: var(--border-radius-small);\n  border-end-start-radius: 0;\n}\n.legWrapper {\n  position: absolute;\n  height: 8px;\n  top: 100%;\n  inset-inline-start: 0;\n  display: inline-flex;\n}\n.kindFill.colorPrimary {\n  background-color: var(--primary-color);\n}\n.kindFill.colorPrimary svg path {\n  fill: var(--primary-color);\n}\n.kindFill.colorPrimary.clickable:hover, .kindFill.colorPrimary.clickable:active {\n  background-color: var(--primary-hover-color);\n}\n.kindFill.colorDark {\n  background-color: var(--inverted-color-background);\n}\n.kindFill.colorDark svg path {\n  fill: var(--inverted-color-background);\n}\n.kindFill.colorNegative {\n  background-color: var(--negative-color);\n}\n.kindFill.colorNegative svg path {\n  fill: var(--negative-color);\n}\n.kindFill.colorNegative.clickable:hover, .kindFill.colorNegative.clickable:active {\n  background-color: var(--negative-color-hover);\n}\n.kindFill.colorPositive {\n  background-color: var(--positive-color);\n}\n.kindFill.colorPositive svg path {\n  fill: var(--positive-color);\n}\n.kindFill.colorPositive.clickable:hover, .kindFill.colorPositive.clickable:active {\n  background-color: var(--positive-color-hover);\n}\n.kindLine {\n  border: 1px solid currentColor;\n  padding: 1px var(--space-8);\n}\n.kindLine .legWrapper {\n  inset-inline-start: -1px;\n  top: calc(100% + 1px);\n}\n.kindLine.colorPrimary {\n  color: var(--primary-color);\n}\n.kindLine.colorPrimary svg path {\n  fill: var(--primary-color);\n}\n.kindLine.colorPrimary.clickable:hover, .kindLine.colorPrimary.clickable:active {\n  background-color: var(--primary-background-hover-color);\n}\n.kindLine.colorDark {\n  color: var(--inverted-color-background);\n}\n.kindLine.colorDark svg path {\n  fill: var(--inverted-color-background);\n}\n.kindLine.colorDark.clickable:hover, .kindLine.colorDark.clickable:active {\n  background-color: var(--primary-background-hover-color);\n}\n.kindLine.colorNegative {\n  color: var(--negative-color);\n}\n.kindLine.colorNegative svg path {\n  fill: var(--negative-color);\n}\n.kindLine.colorNegative.clickable:hover, .kindLine.colorNegative.clickable:active {\n  background-color: var(--negative-color-selected);\n}\n.kindLine.colorPositive {\n  color: var(--positive-color);\n}\n.kindLine.colorPositive svg path {\n  fill: var(--positive-color);\n}\n.kindLine.colorPositive.clickable:hover, .kindLine.colorPositive.clickable:active {\n  background-color: var(--positive-color-selected);\n}\n.kindLine .smallText {\n  line-height: 14px;\n}");export{n as default};
+var n={clickableWrapper:"clickableWrapper","focus-visible":"focus-visible",label:"label",small:"small",withLeg:"withLeg",legWrapper:"legWrapper",kindFill:"kindFill",colorPrimary:"colorPrimary",clickable:"clickable",colorDark:"colorDark",colorNegative:"colorNegative",colorPositive:"colorPositive",kindLine:"kindLine",smallText:"smallText"};!function(n){const r="s_id-05b0d3f05a05_4_2_3";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+r))return;const i=document.createElement("style");i.id=r,o.firstChild?o.insertBefore(i,o.firstChild):o.appendChild(i),i.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=n)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable */\n/* stylelint-enable */\n.clickableWrapper {\n  cursor: pointer;\n}\n.clickableWrapper:focus-visible, .clickableWrapper.focus-visible {\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:focus:not(.focus-visible) {\n  outline: none;\n}\n.clickableWrapper:active {\n  transform: scale(0.95) translate3d(0, 0, 0);\n  transition: var(--motion-productive-short) transform;\n}\n.label {\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(--space-8);\n  position: relative;\n}\n.label.small {\n  padding: 0 var(--space-4);\n  border-radius: 2px;\n}\n.withLeg {\n  border-start-start-radius: var(--border-radius-small);\n  border-start-end-radius: var(--border-radius-small);\n  border-end-end-radius: var(--border-radius-small);\n  border-end-start-radius: 0;\n}\n.legWrapper {\n  position: absolute;\n  height: 8px;\n  top: 100%;\n  inset-inline-start: 0;\n  display: inline-flex;\n}\n.kindFill.colorPrimary {\n  background-color: var(--primary-color);\n}\n.kindFill.colorPrimary svg path {\n  fill: var(--primary-color);\n}\n.kindFill.colorPrimary.clickable:hover, .kindFill.colorPrimary.clickable:active {\n  background-color: var(--primary-hover-color);\n}\n.kindFill.colorDark {\n  background-color: var(--inverted-color-background);\n}\n.kindFill.colorDark svg path {\n  fill: var(--inverted-color-background);\n}\n.kindFill.colorNegative {\n  background-color: var(--negative-color);\n}\n.kindFill.colorNegative svg path {\n  fill: var(--negative-color);\n}\n.kindFill.colorNegative.clickable:hover, .kindFill.colorNegative.clickable:active {\n  background-color: var(--negative-color-hover);\n}\n.kindFill.colorPositive {\n  background-color: var(--positive-color);\n}\n.kindFill.colorPositive svg path {\n  fill: var(--positive-color);\n}\n.kindFill.colorPositive.clickable:hover, .kindFill.colorPositive.clickable:active {\n  background-color: var(--positive-color-hover);\n}\n.kindLine {\n  border: 1px solid currentColor;\n  padding: 1px var(--space-8);\n}\n.kindLine .legWrapper {\n  inset-inline-start: -1px;\n  top: calc(100% + 1px);\n}\n.kindLine.colorPrimary {\n  color: var(--primary-color);\n}\n.kindLine.colorPrimary svg path {\n  fill: var(--primary-color);\n}\n.kindLine.colorPrimary.clickable:hover, .kindLine.colorPrimary.clickable:active {\n  background-color: var(--primary-background-hover-color);\n}\n.kindLine.colorDark {\n  color: var(--inverted-color-background);\n}\n.kindLine.colorDark svg path {\n  fill: var(--inverted-color-background);\n}\n.kindLine.colorDark.clickable:hover, .kindLine.colorDark.clickable:active {\n  background-color: var(--primary-background-hover-color);\n}\n.kindLine.colorNegative {\n  color: var(--negative-color);\n}\n.kindLine.colorNegative svg path {\n  fill: var(--negative-color);\n}\n.kindLine.colorNegative.clickable:hover, .kindLine.colorNegative.clickable:active {\n  background-color: var(--negative-color-selected);\n}\n.kindLine.colorPositive {\n  color: var(--positive-color);\n}\n.kindLine.colorPositive svg path {\n  fill: var(--positive-color);\n}\n.kindLine.colorPositive.clickable:hover, .kindLine.colorPositive.clickable:active {\n  background-color: var(--positive-color-selected);\n}\n.kindLine .smallText {\n  line-height: 14px;\n}");export{n as default};
 //# sourceMappingURL=Label.module.scss.js.map

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

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

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

@@ -1,2 +1,2 @@
-var n={celebration:"celebration",svg:"svg",stroke:"stroke",base:"base",first:"first",second:"second",third:"third"};!function(n){const e="s_id-f81803454b25_4_2_2";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const r=document.createElement("style");r.id=e,t.firstChild?t.insertBefore(r,t.firstChild):t.appendChild(r),r.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".celebration {\n  --container-perimeter: 840;\n  position: relative;\n}\n.celebration .svg {\n  position: absolute;\n  top: 0;\n  inset-inline-start: 0;\n  height: 100%;\n  width: 100%;\n}\n.celebration .svg .stroke {\n  fill: none;\n  stroke-width: 1;\n  stroke-linecap: round;\n  stroke-linejoin: round;\n  animation: stroke-rotate cubic-bezier(0.33, 0, 0.67, 1) forwards;\n  stroke-dasharray: var(--container-perimeter);\n  stroke-dashoffset: var(--container-perimeter);\n}\n.celebration .svg .stroke.base {\n  stroke: var(--color-egg_yolk);\n  animation: fade 200ms linear forwards;\n  animation-delay: 80ms;\n  stroke-dasharray: 0;\n  stroke-dashoffset: 0;\n  opacity: 0;\n}\n.celebration .svg .stroke.first {\n  stroke: var(--color-done-green);\n  animation-delay: 80ms;\n  animation-duration: 320ms;\n}\n.celebration .svg .stroke.second {\n  stroke: var(--color-stuck-red);\n  animation-delay: 200ms;\n  animation-duration: 320ms;\n}\n.celebration .svg .stroke.third {\n  stroke: var(--primary-color);\n  animation-delay: 360ms;\n  animation-duration: 320ms;\n}\n.celebration.celebration [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 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 {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n@keyframes stroke-rotate {\n  to {\n    stroke-dashoffset: 0;\n  }\n}\n@keyframes gradient-text-fill {\n  from {\n    background-position: 150% 0;\n  }\n  to {\n    background-position: 0% 0;\n  }\n}");export{n as default};
+var n={celebration:"celebration",svg:"svg",stroke:"stroke","stroke-rotate":"stroke-rotate",base:"base",fade:"fade",first:"first",second:"second",third:"third","gradient-text-fill":"gradient-text-fill"};!function(n){const e="s_id-f81803454b25_4_2_3";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const r=document.createElement("style");r.id=e,t.firstChild?t.insertBefore(r,t.firstChild):t.appendChild(r),r.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".celebration {\n  --container-perimeter: 840;\n  position: relative;\n}\n.celebration .svg {\n  position: absolute;\n  top: 0;\n  inset-inline-start: 0;\n  height: 100%;\n  width: 100%;\n}\n.celebration .svg .stroke {\n  fill: none;\n  stroke-width: 1;\n  stroke-linecap: round;\n  stroke-linejoin: round;\n  animation: stroke-rotate cubic-bezier(0.33, 0, 0.67, 1) forwards;\n  stroke-dasharray: var(--container-perimeter);\n  stroke-dashoffset: var(--container-perimeter);\n}\n.celebration .svg .stroke.base {\n  stroke: var(--color-egg_yolk);\n  animation: fade 200ms linear forwards;\n  animation-delay: 80ms;\n  stroke-dasharray: 0;\n  stroke-dashoffset: 0;\n  opacity: 0;\n}\n.celebration .svg .stroke.first {\n  stroke: var(--color-done-green);\n  animation-delay: 80ms;\n  animation-duration: 320ms;\n}\n.celebration .svg .stroke.second {\n  stroke: var(--color-stuck-red);\n  animation-delay: 200ms;\n  animation-duration: 320ms;\n}\n.celebration .svg .stroke.third {\n  stroke: var(--primary-color);\n  animation-delay: 360ms;\n  animation-duration: 320ms;\n}\n.celebration.celebration [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 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 {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n@keyframes stroke-rotate {\n  to {\n    stroke-dashoffset: 0;\n  }\n}\n@keyframes gradient-text-fill {\n  from {\n    background-position: 150% 0;\n  }\n  to {\n    background-position: 0% 0;\n  }\n}");export{n as default};
 //# sourceMappingURL=LabelCelebrationAnimation.module.scss.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Leg.js","sources":["../../../../../src/components/Label/Leg.tsx"],"sourcesContent":["import React from \"react\";\n\nconst Leg = () => (\n <svg width=\"8\" height=\"5\" viewBox=\"0 0 8 5\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M0 0V2.76772C0 4.21783 1.77351 4.92116 2.76736 3.86519L5.45681 1.00765C6.06097 0.365738 6.90294 0.00127805 7.7843 3.35493e-06C5.30942 2.53165e-06 2.69058 1.4328e-06 0 0Z\"\n fill=\"#E44258\"\n />\n </svg>\n);\n\nLeg.displayName = \"Leg\";\n\nexport default Leg;\n"],"names":["Leg","React","createElement","width","height","viewBox","fill","xmlns","d","displayName"],"mappings":"qBAEA,IAAMA,EAAM,WAAH,OACPC,~~EAAAC~~,cAAA,MAAA,~~CAAKC~~,MAAM,IAAIC,OAAO,IAAIC,QAAQ,UAAUC,KAAK,OAAOC,MAAM,8BAC5DN,~~EAAAC~~,cAAA,OAAA,~~CACEM~~,EAAE,4KACFF,KAAK,YAEH,EAGRN,EAAIS,YAAc"}
1	+ {"version":3,"file":"Leg.js","sources":["../../../../../src/components/Label/Leg.tsx"],"sourcesContent":["import React from \"react\";\n\nconst Leg = () => (\n <svg width=\"8\" height=\"5\" viewBox=\"0 0 8 5\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M0 0V2.76772C0 4.21783 1.77351 4.92116 2.76736 3.86519L5.45681 1.00765C6.06097 0.365738 6.90294 0.00127805 7.7843 3.35493e-06C5.30942 2.53165e-06 2.69058 1.4328e-06 0 0Z\"\n fill=\"#E44258\"\n />\n </svg>\n);\n\nLeg.displayName = \"Leg\";\n\nexport default Leg;\n"],"names":["Leg","React","createElement","width","height","viewBox","fill","xmlns","d","displayName"],"mappings":"qBAEA,IAAMA,EAAM,WAAH,OACPC,EAAKC,cAAA,MAAA,CAAAC,MAAM,IAAIC,OAAO,IAAIC,QAAQ,UAAUC,KAAK,OAAOC,MAAM,8BAC5DN,EACEC,cAAA,OAAA,CAAAM,EAAE,4KACFF,KAAK,YAEH,EAGRN,EAAIS,YAAc"}

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

@@ -1,2 +1,2 @@
-import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{getTestId as i,ComponentDefaultTestId as t}from"../../../testIds.js";import r from"classnames";import o,{forwardRef as a,useCallback as s}from"react";import{NOOP as l,getStyle as n}from"@vibe/shared";import{Icon as d}from"@vibe/icon/mockedClassNames";import m from"./Link.module.scss.js";import{camelCase as c}from"es-toolkit";import{ComponentVibeId as v}from"../../tests/constants.js";var f=a((function(a,d){var f=a.className,b=a.textClassName,u=a.href,y=void 0===u?"":u,N=a.text,k=void 0===N?"":N,x=a.rel,h=void 0===x?"noreferrer":x,g=a.onClick,j=void 0===g?l:g,C=a.target,E=void 0===C?"_blank":C,I=a["aria-label"],L=void 0===I?"":I,P=a.color,S=void 0===P?"primary":P,_=a["aria-describedby"],z=void 0===_?"":_,F=a.icon,K=void 0===F?"":F,T=a.iconPosition,B=a.id,D=void 0===B?"":B,H=a["aria-labelledby"],q=void 0===H?"":H,w=a.disableNavigation,A=void 0!==w&&w,G=a.inheritFontSize,J=void 0!==G&&G,M=a.inlineText,O=void 0!==M&&M,Q=a.style,R=a["data-testid"],U="start"===(void 0===T?"start":T),V=s((function(e){A&&e.preventDefault(),j&&j(e)}),[A,j]);return o.createElement("a",{"data-testid":R||i(t.LINK,D),"data-vibe":v.LINK,id:D,href:y,rel:h,ref:d,onClick:V,target:E,style:Q,className:r(m.link,f,n(m,c("color-"+S)),e(e({},m.inheritFontSize,J),m.inlineText,O)),"aria-label":L,"aria-describedby":z,"aria-labelledby":q},p(U,K,r(m.iconStart)),o.createElement("span",{className:r(m.text,b)},k),p(!U,K,r(m.iconEnd)))}));function p(e,i,t){if(e)return o.createElement(d,{className:t,icon:i,type:"font"})}export{f as default};
+import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{getTestId as i,ComponentDefaultTestId as t}from"../../tests/testIds.js";import r from"classnames";import o,{forwardRef as a,useCallback as s}from"react";import{getStyle as l,NOOP as n}from"@vibe/shared";import{Icon as d}from"@vibe/icon/mockedClassNames";import m from"./Link.module.scss.js";import{camelCase as c}from"es-toolkit";import{ComponentVibeId as v}from"../../tests/constants.js";var f=a((function(a,d){var f=a.className,b=a.textClassName,u=a.href,y=void 0===u?"":u,N=a.text,k=void 0===N?"":N,x=a.rel,h=void 0===x?"noreferrer":x,g=a.onClick,j=void 0===g?n:g,C=a.target,E=void 0===C?"_blank":C,I=a["aria-label"],L=void 0===I?"":I,P=a.color,S=void 0===P?"primary":P,_=a["aria-describedby"],z=void 0===_?"":_,F=a.icon,K=void 0===F?"":F,T=a.iconPosition,B=a.id,D=void 0===B?"":B,H=a["aria-labelledby"],q=void 0===H?"":H,w=a.disableNavigation,A=void 0!==w&&w,G=a.inheritFontSize,J=void 0!==G&&G,M=a.inlineText,O=void 0!==M&&M,Q=a.style,R=a["data-testid"],U="start"===(void 0===T?"start":T),V=s((function(e){A&&e.preventDefault(),j&&j(e)}),[A,j]);return o.createElement("a",{"data-testid":R||i(t.LINK,D),"data-vibe":v.LINK,id:D,href:y,rel:h,ref:d,onClick:V,target:E,style:Q,className:r(m.link,f,l(m,c("color-"+S)),e(e({},m.inheritFontSize,J),m.inlineText,O)),"aria-label":L,"aria-describedby":z,"aria-labelledby":q},p(U,K,r(m.iconStart)),o.createElement("span",{className:r(m.text,b)},k),p(!U,K,r(m.iconEnd)))}));function p(e,i,t){if(e)return o.createElement(d,{className:t,icon:i,type:"font"})}export{f as default};
 //# sourceMappingURL=Link.js.map

package/dist/mocked_classnames/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, getStyle } from \"@vibe/shared\";\nimport { Icon, type SubIcon } from \"@vibe/icon\";\nimport { type LinkColor, type LinkIconPosition, type LinkTarget } from \"./Link.types\";\nimport { type VibeComponentProps } from \"../../types\";\nimport styles from \"./Link.module.scss\";\n\nimport { camelCase } from \"es-toolkit\";\nimport { ComponentVibeId } from \"../../tests/constants\";\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 for accessibility.\n /\n \"aria-label\"?: string;\n /\n The ID of the element that describes this link.\n /\n \"aria-describedby\"?: string;\n /\n The ID of the element labeling this link.\n /\n \"aria-labelledby\"?: 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 Inline style object applied to the link element.\n */\n style?: React.CSSProperties;\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 \"aria-label\": ariaLabel = \"\",\n color = \"primary\",\n \"aria-describedby\": ariaDescribedby = \"\",\n icon = \"\",\n iconPosition = \"start\",\n id = \"\",\n \"aria-labelledby\": ariaLabelledBy = \"\",\n disableNavigation = false,\n inheritFontSize = false,\n inlineText = false,\n style,\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 data-vibe={ComponentVibeId.LINK}\n id={id}\n href={href}\n rel={rel}\n ref={ref}\n onClick={onClickWrapper}\n target={target}\n style={style}\n className={cx(styles.link, className, getStyle(styles, camelCase(\"color-\" + color)), {\n [styles.inheritFontSize]: inheritFontSize,\n [styles.inlineText]: inlineText\n })}\n aria-label={ariaLabel}\n aria-describedby={ariaDescribedby}\n aria-labelledby={ariaLabelledBy}\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} type=\"font\" />;\n}\n\nexport default Link;\n"],"names":["Link","forwardRef","_ref","ref","className","textClassName","_ref$href","href","_ref$text","text","_ref$rel","rel","_ref$onClick","onClick","NOOP","_ref$target","target","_ref$ariaLabel","ariaLabel","_ref$color","color","_ref$ariaDescribedby","ariaDescribedby","_ref$icon","icon","_ref$iconPosition","iconPosition","_ref$id","id","_ref$ariaLabelledby","ariaLabelledBy","_ref$disableNavigatio","disableNavigation","_ref$inheritFontSize","inheritFontSize","_ref$inlineText","inlineText","style","dataTestId","isStart","onClickWrapper","useCallback","e","preventDefault","React","createElement","getTestId","ComponentDefaultTestId","LINK","ComponentVibeId","cx","styles","link","getStyle","camelCase","_defineProperty","getIcon","iconStart","iconEnd","shouldShow","Icon","type"],"mappings":"~~ydA6EA~~,~~IAAMA~~,EAAOC,GACX,SAAAC,EAsBEC,GACE,IArBAC,EAASF,EAATE,UACAC,EAAaH,EAAbG,cAAaC,EAAAJ,EACbK,KAAAA,~~OAAI~~,~~IAAAD~~,EAAG,GAAEA,EAAAE,EAAAN,EACTO,KAAAA,~~OAAI~~,~~IAAAD~~,EAAG,GAAEA,EAAAE,EAAAR,EACTS,IAAAA,~~OAAG~~,~~IAAAD~~,EAAG,aAAYA,EAAAE,EAAAV,EAClBW,QAAAA,~~OAAO~~,~~IAAAD~~,EAAGE,EAAIF,EAAAG,EAAAb,EACdc,OAAAA,~~OAAM~~,~~IAAAD~~,EAAG,SAAQA,EAAAE,EAAAf,EACjB,cAAcgB,~~OAAS~~,~~IAAAD~~,EAAG,GAAEA,EAAAE,EAAAjB,EAC5BkB,MAAAA,~~OAAK~~,~~IAAAD~~,EAAG,UAASA,EAAAE,EAAAnB,EACjB,oBAAoBoB,~~OAAe~~,~~IAAAD~~,EAAG,GAAEA,EAAAE,EAAArB,EACxCsB,KAAAA,~~OAAI~~,~~IAAAD~~,EAAG,GAAEA,EAAAE,EAAAvB,EACTwB,aAAsBC,EAAAzB,EACtB0B,GAAAA,~~OAAE~~,~~IAAAD~~,EAAG,GAAEA,EAAAE,EAAA3B,EACP,mBAAmB4B,~~OAAc~~,~~IAAAD~~,EAAG,GAAEA,EAAAE,EAAA7B,EACtC8B,kBAAAA,~~OAAiB~~,~~IAAAD~~,GAAQA,EAAAE,EAAA/B,EACzBgC,gBAAAA,~~OAAe~~,~~IAAAD~~,GAAQA,EAAAE,EAAAjC,EACvBkC,WAAAA,~~OAAU~~,~~IAAAD~~,GAAQA,EAClBE,EAAKnC,EAALmC,MACeC,EAAUpC,EAAzB,eAIIqC,EAA2B,~~gBAXnB~~,~~IAAAd~~,EAAG,QAAOA,GAalBe,EAAiBC,GACrB,SAACC,GACKV,GACFU,EAAEC,iBAEJ9B,GAAWA,EAAQ6B,EACrB,GACA,CAACV,EAAmBnB,IAGtB,OACE+B,EAAAC,cAAA,IAAA,CAAA,cACeP,GAAcQ,EAAUC,EAAuBC,KAAMpB,eACvDqB,EAAgBD,KAC3BpB,GAAIA,EACJrB,KAAMA,EACNI,IAAKA,EACLR,IAAKA,EACLU,QAAS2B,EACTxB,OAAQA,EACRqB,MAAOA,EACPjC,UAAW8C,EAAGC,EAAOC,KAAMhD,EAAWiD,EAASF,EAAQG,EAAU,SAAWlC,IAAOmC,EAAAA,EAAA,CAAA,EAChFJ,EAAOjB,gBAAkBA,GACzBiB,EAAOf,WAAaA,~~IACrB~~,~~aACUlB~~,~~EAAS~~,~~mBACHI~~,oBACDQ,GAEhB0B,EAAQjB,EAASf,EAAM0B,EAAGC,EAAOM,YAClCb,EAAAC,cAAA,OAAA,CAAMzC,UAAW8C,EAAGC,EAAO1C,KAAMJ,IAAiBI,GACjD+C,GAASjB,EAASf,EAAM0B,EAAGC,EAAOO,UAGzC,IAGF,SAASF,EAAQG,EAAqBnC,EAA+CpB,GACnF,GAAKuD,EACL,OAAOf,~~EAAAC~~,~~cAACe~~,~~EAAI~~,~~CAACxD~~,UAAWA,EAAWoB,KAAMA,EAAMqC,KAAK,QACtD"}
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, getStyle } from \"@vibe/shared\";\nimport { Icon, type SubIcon } from \"@vibe/icon\";\nimport { type LinkColor, type LinkIconPosition, type LinkTarget } from \"./Link.types\";\nimport { type VibeComponentProps } from \"../../types\";\nimport styles from \"./Link.module.scss\";\n\nimport { camelCase } from \"es-toolkit\";\nimport { ComponentVibeId } from \"../../tests/constants\";\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 for accessibility.\n /\n \"aria-label\"?: string;\n /\n The ID of the element that describes this link.\n /\n \"aria-describedby\"?: string;\n /\n The ID of the element labeling this link.\n /\n \"aria-labelledby\"?: 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 Inline style object applied to the link element.\n */\n style?: React.CSSProperties;\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 \"aria-label\": ariaLabel = \"\",\n color = \"primary\",\n \"aria-describedby\": ariaDescribedby = \"\",\n icon = \"\",\n iconPosition = \"start\",\n id = \"\",\n \"aria-labelledby\": ariaLabelledBy = \"\",\n disableNavigation = false,\n inheritFontSize = false,\n inlineText = false,\n style,\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 data-vibe={ComponentVibeId.LINK}\n id={id}\n href={href}\n rel={rel}\n ref={ref}\n onClick={onClickWrapper}\n target={target}\n style={style}\n className={cx(styles.link, className, getStyle(styles, camelCase(\"color-\" + color)), {\n [styles.inheritFontSize]: inheritFontSize,\n [styles.inlineText]: inlineText\n })}\n aria-label={ariaLabel}\n aria-describedby={ariaDescribedby}\n aria-labelledby={ariaLabelledBy}\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} type=\"font\" />;\n}\n\nexport default Link;\n"],"names":["Link","forwardRef","_ref","ref","className","textClassName","_ref$href","href","_ref$text","text","_ref$rel","rel","_ref$onClick","onClick","NOOP","_ref$target","target","_ref$ariaLabel","ariaLabel","_ref$color","color","_ref$ariaDescribedby","ariaDescribedby","_ref$icon","icon","_ref$iconPosition","iconPosition","_ref$id","id","_ref$ariaLabelledby","ariaLabelledBy","_ref$disableNavigatio","disableNavigation","_ref$inheritFontSize","inheritFontSize","_ref$inlineText","inlineText","style","dataTestId","isStart","onClickWrapper","useCallback","e","preventDefault","React","createElement","getTestId","ComponentDefaultTestId","LINK","ComponentVibeId","cx","styles","link","getStyle","camelCase","_defineProperty","getIcon","iconStart","iconEnd","shouldShow","Icon","type"],"mappings":"4dA6EMA,IAAAA,EAAOC,GACX,SAAAC,EAsBEC,GACE,IArBAC,EAASF,EAATE,UACAC,EAAaH,EAAbG,cAAaC,EAAAJ,EACbK,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EAAAE,EAAAN,EACTO,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EAAAE,EAAAR,EACTS,IAAAA,OAAM,IAAHD,EAAG,aAAYA,EAAAE,EAAAV,EAClBW,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAb,EACdc,OAAAA,OAAS,IAAHD,EAAG,SAAQA,EAAAE,EAAAf,EACjB,cAAcgB,OAAY,IAAHD,EAAG,GAAEA,EAAAE,EAAAjB,EAC5BkB,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EAAAE,EAAAnB,EACjB,oBAAoBoB,OAAkB,IAAHD,EAAG,GAAEA,EAAAE,EAAArB,EACxCsB,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EAAAE,EAAAvB,EACTwB,aAAsBC,EAAAzB,EACtB0B,GAAAA,OAAK,IAAHD,EAAG,GAAEA,EAAAE,EAAA3B,EACP,mBAAmB4B,OAAiB,IAAHD,EAAG,GAAEA,EAAAE,EAAA7B,EACtC8B,kBAAAA,OAAoB,IAAHD,GAAQA,EAAAE,EAAA/B,EACzBgC,gBAAAA,OAAkB,IAAHD,GAAQA,EAAAE,EAAAjC,EACvBkC,WAAAA,OAAa,IAAHD,GAAQA,EAClBE,EAAKnC,EAALmC,MACeC,EAAUpC,EAAzB,eAIIqC,EAA2B,gBAXhB,IAAHd,EAAG,QAAOA,GAalBe,EAAiBC,GACrB,SAACC,GACKV,GACFU,EAAEC,iBAEJ9B,GAAWA,EAAQ6B,EACrB,GACA,CAACV,EAAmBnB,IAGtB,OACE+B,EAAAC,cAAA,IAAA,CAAA,cACeP,GAAcQ,EAAUC,EAAuBC,KAAMpB,eACvDqB,EAAgBD,KAC3BpB,GAAIA,EACJrB,KAAMA,EACNI,IAAKA,EACLR,IAAKA,EACLU,QAAS2B,EACTxB,OAAQA,EACRqB,MAAOA,EACPjC,UAAW8C,EAAGC,EAAOC,KAAMhD,EAAWiD,EAASF,EAAQG,EAAU,SAAWlC,IAAOmC,EAAAA,EAAA,CAAA,EAChFJ,EAAOjB,gBAAkBA,GACzBiB,EAAOf,WAAaA,IAEX,aAAAlB,EACM,mBAAAI,oBACDQ,GAEhB0B,EAAQjB,EAASf,EAAM0B,EAAGC,EAAOM,YAClCb,EAAAC,cAAA,OAAA,CAAMzC,UAAW8C,EAAGC,EAAO1C,KAAMJ,IAAiBI,GACjD+C,GAASjB,EAASf,EAAM0B,EAAGC,EAAOO,UAGzC,IAGF,SAASF,EAAQG,EAAqBnC,EAA+CpB,GACnF,GAAKuD,EACL,OAAOf,EAACC,cAAAe,EAAK,CAAAxD,UAAWA,EAAWoB,KAAMA,EAAMqC,KAAK,QACtD"}

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

@@ -1,2 +1,2 @@
-var n={link:"link","focus-visible":"focus-visible",colorOnPrimary:"colorOnPrimary",colorOnInverted:"colorOnInverted",text:"text",inlineText:"inlineText",inheritFontSize:"inheritFontSize",iconStart:"iconStart",iconEnd:"iconEnd"};!function(n){const e="s_id-c2cddf2190ae_4_2_2";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+e))return;const t=document.createElement("style");t.id=e,i.firstChild?i.insertBefore(t,i.firstChild):i.appendChild(t),t.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable */\n/* stylelint-enable */\n.link {\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:focus-visible, .link.focus-visible {\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:focus:not(.focus-visible) {\n  outline: none;\n}\n.link.colorOnPrimary {\n  color: var(--text-color-on-primary);\n}\n.link.colorOnInverted {\n  color: var(--text-color-on-inverted);\n}\n.link:hover .text {\n  text-decoration: underline;\n  color: inherit;\n}\n.link.inlineText {\n  display: inline-flex;\n  align-items: unset;\n}\n.link.inheritFontSize {\n  font-size: inherit;\n  line-height: inherit;\n}\n.iconStart {\n  line-height: 24px;\n  margin-inline-end: var(--space-4);\n}\n.iconEnd {\n  line-height: 24px;\n  margin-inline-start: var(--space-4);\n}");export{n as default};
+var n={link:"link","focus-visible":"focus-visible",colorOnPrimary:"colorOnPrimary",colorOnInverted:"colorOnInverted",text:"text",inlineText:"inlineText",inheritFontSize:"inheritFontSize",iconStart:"iconStart",iconEnd:"iconEnd"};!function(n){const e="s_id-c2cddf2190ae_4_2_3";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+e))return;const t=document.createElement("style");t.id=e,i.firstChild?i.insertBefore(t,i.firstChild):i.appendChild(t),t.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable */\n/* stylelint-enable */\n.link {\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:focus-visible, .link.focus-visible {\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:focus:not(.focus-visible) {\n  outline: none;\n}\n.link.colorOnPrimary {\n  color: var(--text-color-on-primary);\n}\n.link.colorOnInverted {\n  color: var(--text-color-on-inverted);\n}\n.link:hover .text {\n  text-decoration: underline;\n  color: inherit;\n}\n.link.inlineText {\n  display: inline-flex;\n  align-items: unset;\n}\n.link.inheritFontSize {\n  font-size: inherit;\n  line-height: inherit;\n}\n.iconStart {\n  line-height: 24px;\n  margin-inline-end: var(--space-4);\n}\n.iconEnd {\n  line-height: 24px;\n  margin-inline-start: var(--space-4);\n}");export{n as default};
 //# sourceMappingURL=Link.module.scss.js.map

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

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

package/dist/mocked_classnames/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 type AriaAttributes,\n type AriaRole,\n type CSSProperties,\n forwardRef,\n type ReactElement,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState\n} from \"react\";\nimport { useMergeRef } from \"@vibe/shared\";\nimport useKeyEvent from \"../../hooks/useKeyEvent\";\nimport { VirtualizedListItems } from \"./VirtualizedListItems/VirtualizedListItems\";\nimport { keyCodes, UP_DOWN_ARROWS } from \"../../constants/keyCodes\";\nimport { type VibeComponentProps } from \"../../types\";\nimport { type ListItemProps } from \"../ListItem/ListItem\";\nimport { type ListTitleProps } from \"../ListTitle/ListTitle\";\nimport { type 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 \"aria-label\"?: string;\n /\n The ID of an element that describes the list.\n /\n \"aria-describedby\"?: 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 = \"ul\",\n children,\n \"aria-label\": ariaLabel,\n \"aria-describedby\": 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\nexport default List;\n"],"names":["List","forwardRef","_ref","ref","className","id","_ref$component","component","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","tabIndex","getListItemComponentType","ListContext","Provider","value","getTestId","ComponentDefaultTestId","LIST","ComponentVibeId","cx","styles","list"],"mappings":"21BAsEA,IAAMA,EAAOC,GACX,SAAAC,EAcEC,GACE,IAbAC,EAASF,EAATE,UACAC,EAAEH,EAAFG,GAAEC,EAAAJ,EACFK,UAAAA,OAAS,IAAAD,EAAG,KAAIA,EAChBE,EAAQN,EAARM,SACcC,EAASP,EAAvB,cACoBQ,EAAeR,EAAnC,oBACiBS,EAAYT,EAA7B,iBAAeU,EAAAV,EACfW,uBAAAA,OAAsB,IAAAD,GAAQA,EAC9BE,EAAKZ,EAALY,MAAKC,EAAAb,EACLc,KAAAA,OAAI,IAAAD,EAAG,UAASA,EACDE,EAAUf,EAAzB,eAIIgB,EAAeC,EAAO,MACtBC,EAAYC,EAAYlB,EAAKe,GAC7BI,EAAsDH,EAAO,IAE7DI,EAAaC,EAAUnB,GAC7BoB,EAAoCC,EAAS,GAAEC,EAAAC,EAAAH,EAAA,GAAxCI,EAAUF,EAAA,GAAEG,EAAaH,EAAA,GAC1BI,EAAYxB,EAEZyB,EAAoBC,GAAY,SAAC5B,SACrCyB,EAAcI,EAAqBZ,EAAcjB,IAC5B,QAArB8B,EAAAjB,aAAY,EAAZA,EAAckB,eAAO,IAAAD,GAAAA,EAAEE,aAAa,wBAAyBhC,EAC/D,GAAG,IAEGiC,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,QAd3C,CAgBF,GACA,CAACvB,EAAYhB,EAAwBmB,IAGvCqB,EAAY,CACVC,KAAMC,EACNC,SAAUlB,EACVnC,IAAKe,IAGPuC,GAAU,WACR,IAAMC,EAAoBpC,EAAac,QAAQuB,WAC7C,SAAAC,GAAK,OAAIA,aAAiBC,aAAeC,EAAWF,IAAmD,UAAzCA,aAAK,EAALA,EAAOG,aAAa,iBAA2B,IAE/G,IAA0B,IAAtBL,EACF1B,EAAkBmB,EAAqB7B,EAAcoC,QAChD,CACL,IAAMM,EAAsB1C,EAAac,QAAQuB,WAAU,SAAAC,GAAK,OAAIE,EAAWF,EAAM,KACzD,IAAxBI,GACFhC,EAAkBmB,EAAqB7B,EAAc0C,GAEzD,CACF,GAAG,CAAChC,IAEJ,IAAMiC,EAAmBC,GAAQ,WAC/B,IAAIC,EAA0CC,MAAMC,QAAQ7D,GAAYA,EAAW,CAACA,GAuBpF,OAtBIK,EACFsD,EAAWG,EAAAC,cAACC,EAAoB,KAAEL,IAElC7C,EAAac,QAAUd,EAAac,QAAQqC,MAAM,EAAGN,EAASnB,QAC9DmB,EAAWG,EAAMI,SAASC,IAAIR,GAAU,SAACP,EAAOgB,GAC9C,IAAKN,EAAMO,eAAejB,GACxB,OAAOA,EAET,IAAMvD,EAAMuD,EAAMkB,MAAwBzE,IAAE,GAAA0E,OAAOxD,EAAU,UAAAwD,OAASH,GAChEI,EAAa1D,EAAac,QAAQwC,GAClCK,EAAkBD,SAAmDlB,EAAWkB,GACtF,OAAOV,EAAMY,aAAatB,EAAO,CAE/BzD,IAAK,SAAAA,GAAG,OAAKmB,EAAac,QAAQwC,GAASzE,CAAG,EAC9CgF,SAAUtD,IAAe+C,GAASK,EAAkB,GAAI,EACxD5E,GAAAA,EACAE,UAAW6E,EAAyB7E,GACpCS,KAAO4C,EAAMkB,MAAwB9D,MAEzC,KAGKmD,CACT,GAAG,CAAC3D,EAAUD,EAAWsB,EAAYN,EAAYV,IAEjD,OACEyD,EAAAC,cAACc,EAAYC,UAASC,MAAO,CAAEvD,kBAAAA,IAC7BsC,EAAAC,cAACxC,EAAS,CAAA,cACKd,GAAcuE,EAAUC,EAAuBC,KAAMrF,GAAG,YAC1DsF,EAAgBD,KAC3BvF,IAAKiB,EACLN,MAAOA,EACPV,UAAWwF,EAAGC,EAAOC,KAAM1F,GAC3BC,GAAIkB,EAAU,aACFd,EAAS,mBACHC,EAAe,gBAClBC,EACfwE,UAAU,EACVnE,KAAMA,GAELiD,GAIT"}
1	+ {"version":3,"file":"List.js","sources":["../../../../../src/components/List/List.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, {\n type AriaAttributes,\n type AriaRole,\n type CSSProperties,\n forwardRef,\n type ReactElement,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState\n} from \"react\";\nimport { useMergeRef } from \"@vibe/shared\";\nimport useKeyEvent from \"../../hooks/useKeyEvent\";\nimport { VirtualizedListItems } from \"./VirtualizedListItems/VirtualizedListItems\";\nimport { keyCodes, UP_DOWN_ARROWS } from \"../../constants/keyCodes\";\nimport { type VibeComponentProps } from \"../../types\";\nimport { type ListItemProps } from \"../ListItem/ListItem\";\nimport { type ListTitleProps } from \"../ListTitle/ListTitle\";\nimport { type 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 \"aria-label\"?: string;\n /\n The ID of an element that describes the list.\n /\n \"aria-describedby\"?: 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 = \"ul\",\n children,\n \"aria-label\": ariaLabel,\n \"aria-describedby\": 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\nexport default List;\n"],"names":["List","forwardRef","_ref","ref","className","id","_ref$component","component","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"],"mappings":"81BAsEMA,IAAAA,EAAOC,GACX,SAAAC,EAcEC,GACE,IAbAC,EAASF,EAATE,UACAC,EAAEH,EAAFG,GAAEC,EAAAJ,EACFK,UAAAA,OAAY,IAAHD,EAAG,KAAIA,EAChBE,EAAQN,EAARM,SACcC,EAASP,EAAvB,cACoBQ,EAAeR,EAAnC,oBACiBS,EAAYT,EAA7B,iBAAeU,EAAAV,EACfW,uBAAAA,OAAyB,IAAHD,GAAQA,EAC9BE,EAAKZ,EAALY,MAAKC,EAAAb,EACLc,KAAAA,OAAO,IAAHD,EAAG,UAASA,EACDE,EAAUf,EAAzB,eAIIgB,EAAeC,EAAO,MACtBC,EAAYC,EAAYlB,EAAKe,GAC7BI,EAAsDH,EAAO,IAE7DI,EAAaC,EAAUnB,GAC7BoB,EAAoCC,EAAS,GAAEC,EAAAC,EAAAH,EAAA,GAAxCI,EAAUF,EAAA,GAAEG,EAAaH,EAAA,GAC1BI,EAAYxB,EAEZyB,EAAoBC,GAAY,SAAC5B,SACrCyB,EAAcI,EAAqBZ,EAAcjB,IAC1B,QAAvB8B,EAAAjB,aAAY,EAAZA,EAAckB,eAAS,IAAAD,GAAAA,EAAAE,aAAa,wBAAyBhC,EAC9D,GAAE,IAEGiC,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,QAd3C,CAgBD,GACD,CAACvB,EAAYhB,EAAwBmB,IAGvCqB,EAAY,CACVC,KAAMC,EACNC,SAAUlB,EACVnC,IAAKe,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,GAEzD,CACF,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,IAAMvD,EAAMuD,EAAMkB,MAAwBzE,IAAE0E,GAAAA,OAAOxD,EAAU,UAAAwD,OAASH,GAChEI,EAAa1D,EAAac,QAAQwC,GAClCK,EAAkBD,SAAmDlB,EAAWkB,GACtF,OAAOV,EAAMY,aAAatB,EAAO,CAE/BzD,IAAK,SAAGgF,GAAA,OAAK7D,EAAac,QAAQwC,GAASzE,CAAI,EAC/CiF,SAAUvD,IAAe+C,GAASK,EAAkB,GAAK,EACzD5E,GAAAA,EACAE,UAAW8E,EAAyB9E,GACpCS,KAAO4C,EAAMkB,MAAwB9D,MAEzC,KAGKmD,CACT,GAAG,CAAC3D,EAAUD,EAAWsB,EAAYN,EAAYV,IAEjD,OACEyD,EAACC,cAAAe,EAAYC,UAASC,MAAO,CAAExD,kBAAAA,IAC7BsC,EAACC,cAAAxC,EACc,CAAA,cAAAd,GAAcwE,EAAUC,EAAuBC,KAAMtF,GAAG,YAC1DuF,EAAgBD,KAC3BxF,IAAKiB,EACLN,MAAOA,EACPV,UAAWyF,EAAGC,EAAOC,KAAM3F,GAC3BC,GAAIkB,EACQ,aAAAd,EACM,mBAAAC,EACH,gBAAAC,EACfyE,UAAW,EACXpE,KAAMA,GAELiD,GAIT"}

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

@@ -1,2 +1,2 @@
-var e={list:"list"};!function(e){const t="s_id-ed9bf484fec4_4_2_2";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable selector-class-pattern */\n/* stylelint-disable */\n/* stylelint-enable */\n.list {\n  margin: 0;\n  padding: 0;\n  overflow: auto;\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n.list::-webkit-scrollbar {\n  width: 4px;\n  height: 6px;\n}\n.list::-webkit-scrollbar-thumb {\n  background-color: var(--ui-border-color);\n  border-radius: 4px;\n}");export{e as default};
+var e={list:"list"};!function(e){const t="s_id-ed9bf484fec4_4_2_3";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable selector-class-pattern */\n/* stylelint-disable */\n/* stylelint-enable */\n.list {\n  margin: 0;\n  padding: 0;\n  overflow: auto;\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}\n.list::-webkit-scrollbar {\n  width: 4px;\n  height: 6px;\n}\n.list::-webkit-scrollbar-thumb {\n  background-color: var(--ui-border-color);\n  border-radius: 4px;\n}");export{e as default};
 //# sourceMappingURL=List.module.scss.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"VirtualizedListItems.js","sources":["../../../../../../src/components/List/VirtualizedListItems/VirtualizedListItems.tsx"],"sourcesContent":["import React, { type CSSProperties, type ReactElement, useCallback, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport ListItem, { type ListItemProps } from \"../../../components/ListItem/ListItem\";\nimport ListTitle, { type ListTitleProps } from \"../../ListTitle/ListTitle\";\nimport VirtualizedList from \"../../../components/VirtualizedList/VirtualizedList\";\nimport type VibeComponentProps from \"../../../types/VibeComponentProps\";\nimport { type ListItemIconProps } from \"../../ListItemIcon/ListItemIcon\";\nimport styles from \"./VirtualizedListItems.module.scss\";\n\nconst ITEM_CHILDREN_TYPES = {\n TITLE: \"title\",\n ITEM: \"item\"\n};\n\nconst LIST_TITLE_HEIGHT = 48;\nconst LIST_ITEM_HEIGHT = 32;\n\nexport interface VirtualizedListItemsProps extends VibeComponentProps {\n /*\n The list of children.\n */\n children?: React.ReactElement<ListItemProps \| ListTitleProps> \| React.ReactElement<ListItemProps \| ListTitleProps>[];\n}\n\nexport const VirtualizedListItems: React.FC<VirtualizedListItemsProps> = ({ children }) => {\n const items = useMemo(() => {\n const childrenArr = Array.isArray(children) ? children : [children];\n return childrenArr\n .map((child, index) => {\n // @ts-ignore displayName is coming from Component assigned field: ListTitle, ListItem\n const childTypeDisplayName = child.type.displayName;\n if (childTypeDisplayName === ListTitle.displayName) {\n return {\n type: ITEM_CHILDREN_TYPES.TITLE,\n id: `list-title-${index}`,\n props: child.props,\n // avoid add spacing to the first category on the list\n height: LIST_TITLE_HEIGHT\n };\n } else if (childTypeDisplayName === ListItem.displayName) {\n const { id } = child.props;\n return {\n type: ITEM_CHILDREN_TYPES.ITEM,\n id: id \|\| `list-item-${index}`,\n props: child.props,\n height: LIST_ITEM_HEIGHT\n };\n } else {\n return undefined;\n }\n })\n .filter(item => item !== undefined);\n }, [children]);\n\n const itemRenderer = useCallback(\n (item: ReactElement<ListItemProps \| ListItemIconProps \| ListTitleProps>, index: number, style: CSSProperties) => {\n const { type, props } = item;\n let element;\n switch (type) {\n case ITEM_CHILDREN_TYPES.TITLE: {\n element = <ListTitle {...(props as ListTitleProps)} />;\n break;\n }\n case ITEM_CHILDREN_TYPES.ITEM: {\n element = <ListItem {...(props as ListItemProps)} />;\n break;\n }\n }\n\n return <div style={style}>{element}</div>;\n },\n []\n );\n\n return (\n // @ts-ignore TODO TS-migration fix when VirtualizedList is converted to TS\n <VirtualizedList scrollableClassName={cx(styles.scrollableContainer)} items={items} itemRenderer={itemRenderer} />\n );\n};\n"],"names":["ITEM_CHILDREN_TYPES","VirtualizedListItems","_ref","children","items","useMemo","Array","isArray","map","child","index","childTypeDisplayName","type","displayName","ListTitle","id","concat","props","height","ListItem","filter","item","undefined","itemRenderer","useCallback","style","element","React","createElement","Object","assign","VirtualizedList","scrollableClassName","cx","styles","scrollableContainer"],"mappings":"iRASA,IAAMA,EACG,QADHA,EAEE,OAaKC,EAA4D,SAAxCC,GAAyD,IAAdC,EAAQD,EAARC,SACpEC,EAAQC,GAAQ,WAEpB,OADoBC,MAAMC,QAAQJ,GAAYA,EAAW,CAACA,IAEvDK,KAAI,SAACC,EAAOC,GAEX,IAAMC,EAAuBF,EAAMG,KAAKC,YACxC,OAAIF,IAAyBG,EAAUD,YAC9B,CACLD,KAAMZ,EACNe,~~GAAE~~,~~cAAAC~~,OAAgBN,GAClBO,MAAOR,EAAMQ,MAEbC,OAvBc,IAyBPP,IAAyBQ,EAASN,YAEpC,CACLD,KAAMZ,EACNe,GAHaN,EAAMQ,MAAbF,IAGA,aAAAC,OAAiBN,GACvBO,MAAOR,EAAMQ,MACbC,OA9Ba,SAiCf,CAEJ,IACCE,QAAO,SAAAC,GAAI,YAAaC,IAATD,~~CAAkB~~,~~GACtC,~~GAAG,CAAClB,IAEEoB,EAAeC,GACnB,SAACH,EAAwEX,EAAee,GACtF,IACIC,EADUT,EAAUI,EAAVJ,MAEd,OAFwBI,EAAhBT,MAGN,KAAKZ,EACH0B,EAAUC,~~EAAAC~~,~~cAACd~~,~~EAASe~~,OAAAC,OAAA,CAAA,~~EAAMb~~,IAC1B,MAEF,KAAKjB,EACH0B,EAAUC,~~EAAAC~~,~~cAACT~~,~~EAAQU~~,OAAAC,OAAA,CAAA,~~EAAMb~~,IAK7B,OAAOU,uBAAKF,MAAOA,GAAQC,~~EAC7B~~,~~GACA~~,IAGF,OAEEC,~~EAAAC~~,~~cAACG~~,GAAgBC,oBAAqBC,EAAGC,EAAOC,qBAAsB/B,MAAOA,EAAOmB,aAAcA,GAEtG"}
1	+ {"version":3,"file":"VirtualizedListItems.js","sources":["../../../../../../src/components/List/VirtualizedListItems/VirtualizedListItems.tsx"],"sourcesContent":["import React, { type CSSProperties, type ReactElement, useCallback, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport ListItem, { type ListItemProps } from \"../../../components/ListItem/ListItem\";\nimport ListTitle, { type ListTitleProps } from \"../../ListTitle/ListTitle\";\nimport VirtualizedList from \"../../../components/VirtualizedList/VirtualizedList\";\nimport type VibeComponentProps from \"../../../types/VibeComponentProps\";\nimport { type ListItemIconProps } from \"../../ListItemIcon/ListItemIcon\";\nimport styles from \"./VirtualizedListItems.module.scss\";\n\nconst ITEM_CHILDREN_TYPES = {\n TITLE: \"title\",\n ITEM: \"item\"\n};\n\nconst LIST_TITLE_HEIGHT = 48;\nconst LIST_ITEM_HEIGHT = 32;\n\nexport interface VirtualizedListItemsProps extends VibeComponentProps {\n /*\n The list of children.\n */\n children?: React.ReactElement<ListItemProps \| ListTitleProps> \| React.ReactElement<ListItemProps \| ListTitleProps>[];\n}\n\nexport const VirtualizedListItems: React.FC<VirtualizedListItemsProps> = ({ children }) => {\n const items = useMemo(() => {\n const childrenArr = Array.isArray(children) ? children : [children];\n return childrenArr\n .map((child, index) => {\n // @ts-ignore displayName is coming from Component assigned field: ListTitle, ListItem\n const childTypeDisplayName = child.type.displayName;\n if (childTypeDisplayName === ListTitle.displayName) {\n return {\n type: ITEM_CHILDREN_TYPES.TITLE,\n id: `list-title-${index}`,\n props: child.props,\n // avoid add spacing to the first category on the list\n height: LIST_TITLE_HEIGHT\n };\n } else if (childTypeDisplayName === ListItem.displayName) {\n const { id } = child.props;\n return {\n type: ITEM_CHILDREN_TYPES.ITEM,\n id: id \|\| `list-item-${index}`,\n props: child.props,\n height: LIST_ITEM_HEIGHT\n };\n } else {\n return undefined;\n }\n })\n .filter(item => item !== undefined);\n }, [children]);\n\n const itemRenderer = useCallback(\n (item: ReactElement<ListItemProps \| ListItemIconProps \| ListTitleProps>, index: number, style: CSSProperties) => {\n const { type, props } = item;\n let element;\n switch (type) {\n case ITEM_CHILDREN_TYPES.TITLE: {\n element = <ListTitle {...(props as ListTitleProps)} />;\n break;\n }\n case ITEM_CHILDREN_TYPES.ITEM: {\n element = <ListItem {...(props as ListItemProps)} />;\n break;\n }\n }\n\n return <div style={style}>{element}</div>;\n },\n []\n );\n\n return (\n // @ts-ignore TODO TS-migration fix when VirtualizedList is converted to TS\n <VirtualizedList scrollableClassName={cx(styles.scrollableContainer)} items={items} itemRenderer={itemRenderer} />\n );\n};\n"],"names":["ITEM_CHILDREN_TYPES","VirtualizedListItems","_ref","children","items","useMemo","Array","isArray","map","child","index","childTypeDisplayName","type","displayName","ListTitle","id","concat","props","height","ListItem","filter","item","undefined","itemRenderer","useCallback","style","element","React","createElement","Object","assign","VirtualizedList","scrollableClassName","cx","styles","scrollableContainer"],"mappings":"iRASA,IAAMA,EACG,QADHA,EAEE,OAaKC,EAA4D,SAAxCC,GAAyD,IAAdC,EAAQD,EAARC,SACpEC,EAAQC,GAAQ,WAEpB,OADoBC,MAAMC,QAAQJ,GAAYA,EAAW,CAACA,IAEvDK,KAAI,SAACC,EAAOC,GAEX,IAAMC,EAAuBF,EAAMG,KAAKC,YACxC,OAAIF,IAAyBG,EAAUD,YAC9B,CACLD,KAAMZ,EACNe,GAAEC,cAAAA,OAAgBN,GAClBO,MAAOR,EAAMQ,MAEbC,OAvBc,IAyBPP,IAAyBQ,EAASN,YAEpC,CACLD,KAAMZ,EACNe,GAHaN,EAAMQ,MAAbF,IAGA,aAAAC,OAAiBN,GACvBO,MAAOR,EAAMQ,MACbC,OA9Ba,SAiCf,CAEJ,IACCE,QAAO,SAAAC,GAAI,YAAaC,IAATD,IACpB,GAAG,CAAClB,IAEEoB,EAAeC,GACnB,SAACH,EAAwEX,EAAee,GACtF,IACIC,EADUT,EAAUI,EAAVJ,MAEd,OAFwBI,EAAhBT,MAGN,KAAKZ,EACH0B,EAAUC,EAACC,cAAAd,EAAee,OAAAC,OAAA,CAAA,EAAAb,IAC1B,MAEF,KAAKjB,EACH0B,EAAUC,EAACC,cAAAT,EAAcU,OAAAC,OAAA,CAAA,EAAAb,IAK7B,OAAOU,uBAAKF,MAAOA,GAAQC,EAC5B,GACD,IAGF,OAEEC,EAACC,cAAAG,GAAgBC,oBAAqBC,EAAGC,EAAOC,qBAAsB/B,MAAOA,EAAOmB,aAAcA,GAEtG"}

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

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

package/dist/mocked_classnames/src/components/List/utils/ListUtils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListUtils.js","sources":["../../../../../../src/components/List/utils/ListUtils.ts"],"sourcesContent":["import { type MutableRefObject, useState } from \"react\";\nimport { type ListItemElement } from \"../../ListItem/ListItem.types\";\nimport { type ListElement } from \"../List.types\";\nimport { useIsomorphicLayoutEffect } from \"@vibe/shared\";\n\nlet listIdCounter = 0;\nexport const generateListId = () => {\n return `list-${listIdCounter++}`;\n};\n\nconst VALID_ROLES = [\"option\", \"listitem\", \"menuitem\", \"tab\", \"treeitem\"];\n\nexport const useListId = (id: string) => {\n const [listId, setListId] = useState<string>();\n useIsomorphicLayoutEffect(() => {\n setListId(id \|\| generateListId());\n }, [id]);\n return listId;\n};\n\nexport const getListItemIdByIndex = (childrenRefs: MutableRefObject<HTMLElement[]>, index: number): string => {\n return childrenRefs.current[index]?.id;\n};\n\nexport const getListItemIndexById = (childrenRefs: MutableRefObject<HTMLElement[]>, id: string): number => {\n return childrenRefs.current.findIndex(child => child?.id === id);\n};\n\nexport const getListItemComponentType = (listComponent: ListElement): ListItemElement => {\n switch (listComponent) {\n case \"ul\":\n case \"ol\":\n return \"li\";\n case \"nav\":\n return \"a\";\n default:\n return \"div\";\n }\n};\n\nexport const isListItem = (element: HTMLElement) => {\n return element && element instanceof HTMLElement && VALID_ROLES.includes(element.getAttribute(\"role\"));\n};\n\nexport const getNextListItemIndex = (currentIndex: number, childrenRefs: MutableRefObject<HTMLElement[]>) => {\n while (currentIndex < childrenRefs.current.length - 1) {\n const child = childrenRefs.current[++currentIndex];\n if (isListItem(child)) {\n return currentIndex;\n }\n }\n return undefined;\n};\n\nexport const getPrevListItemIndex = (currentIndex: number, childrenRefs: MutableRefObject<HTMLElement[]>) => {\n while (currentIndex > 0) {\n const child = childrenRefs.current[--currentIndex];\n if (isListItem(child)) {\n return currentIndex;\n }\n }\n return undefined;\n};\n"],"names":["listIdCounter","generateListId","concat","VALID_ROLES","useListId","id","_useState","useState","_useState2","_slicedToArray","listId","setListId","useIsomorphicLayoutEffect","getListItemIdByIndex","childrenRefs","index","_a","current","getListItemIndexById","findIndex","child","getListItemComponentType","listComponent","isListItem","element","HTMLElement","includes","getAttribute","getNextListItemIndex","currentIndex","length","getPrevListItemIndex"],"mappings":"4KAKA,IAAIA,EAAgB,EACPC,EAAiB,WAC5B,~~MAAA~~,~~QAAAC~~,OAAeF,IACjB,EAEMG,EAAc,CAAC,SAAU,WAAY,WAAY,MAAO,YAEjDC,EAAY,SAACC,GACxB,IAAAC,EAA4BC,IAAkBC,EAAAC,EAAAH,EAAA,GAAvCI,EAAMF,EAAA,GAAEG,EAASH,EAAA,GAIxB,OAHAI,GAA0B,WACxBD,EAAUN,GAAMJ,IAClB,GAAG,CAACI,IACGK,CACT,EAEaG,EAAuB,SAACC,EAA+CC,SAClF,~~OAAkC~~,~~QAA3BC~~,EAAAF,EAAaG,QAAQF,~~UAAM~~,IAAAC,OAAA,EAAAA,~~EAAEX~~,EACtC,EAEaa,EAAuB,SAACJ,EAA+CT,GAClF,OAAOS,EAAaG,QAAQE,WAAU,SAAAC,GAAK,OAAIA,~~aAAK~~,~~EAALA~~,EAAOf,MAAOA,~~CAAE~~,~~GACjE,~~EAEagB,EAA2B,SAACC,GACvC,OAAQA,GACN,IAAK,KACL,IAAK,KACH,MAAO,KACT,IAAK,MACH,MAAO,IACT,QACE,MAAO,MAEb,EAEaC,EAAa,SAACC,GACzB,OAAOA,GAAWA,aAAmBC,aAAetB,EAAYuB,SAASF,EAAQG,aAAa,QAChG,EAEaC,EAAuB,SAACC,EAAsBf,GACzD,KAAsBA,EAAaG,QAAQa,OAAS,EAA7CD,GAAgD,CACrD,IAAMT,EAAQN,EAAaG,UAAUY,GACrC,GAAIN,EAAWH,GACb,OAAOS,CAEX,CAEF,EAEaE,EAAuB,SAACF,EAAsBf,GACzD,KAAOe,EAAe,GAAG,CACvB,IAAMT,EAAQN,EAAaG,UAAUY,GACrC,GAAIN,EAAWH,GACb,OAAOS,CAEX,CAEF"}
1	+ {"version":3,"file":"ListUtils.js","sources":["../../../../../../src/components/List/utils/ListUtils.ts"],"sourcesContent":["import { type MutableRefObject, useState } from \"react\";\nimport { type ListItemElement } from \"../../ListItem/ListItem.types\";\nimport { type ListElement } from \"../List.types\";\nimport { useIsomorphicLayoutEffect } from \"@vibe/shared\";\n\nlet listIdCounter = 0;\nexport const generateListId = () => {\n return `list-${listIdCounter++}`;\n};\n\nconst VALID_ROLES = [\"option\", \"listitem\", \"menuitem\", \"tab\", \"treeitem\"];\n\nexport const useListId = (id: string) => {\n const [listId, setListId] = useState<string>();\n useIsomorphicLayoutEffect(() => {\n setListId(id \|\| generateListId());\n }, [id]);\n return listId;\n};\n\nexport const getListItemIdByIndex = (childrenRefs: MutableRefObject<HTMLElement[]>, index: number): string => {\n return childrenRefs.current[index]?.id;\n};\n\nexport const getListItemIndexById = (childrenRefs: MutableRefObject<HTMLElement[]>, id: string): number => {\n return childrenRefs.current.findIndex(child => child?.id === id);\n};\n\nexport const getListItemComponentType = (listComponent: ListElement): ListItemElement => {\n switch (listComponent) {\n case \"ul\":\n case \"ol\":\n return \"li\";\n case \"nav\":\n return \"a\";\n default:\n return \"div\";\n }\n};\n\nexport const isListItem = (element: HTMLElement) => {\n return element && element instanceof HTMLElement && VALID_ROLES.includes(element.getAttribute(\"role\"));\n};\n\nexport const getNextListItemIndex = (currentIndex: number, childrenRefs: MutableRefObject<HTMLElement[]>) => {\n while (currentIndex < childrenRefs.current.length - 1) {\n const child = childrenRefs.current[++currentIndex];\n if (isListItem(child)) {\n return currentIndex;\n }\n }\n return undefined;\n};\n\nexport const getPrevListItemIndex = (currentIndex: number, childrenRefs: MutableRefObject<HTMLElement[]>) => {\n while (currentIndex > 0) {\n const child = childrenRefs.current[--currentIndex];\n if (isListItem(child)) {\n return currentIndex;\n }\n }\n return undefined;\n};\n"],"names":["listIdCounter","generateListId","concat","VALID_ROLES","useListId","id","_useState","useState","_useState2","_slicedToArray","listId","setListId","useIsomorphicLayoutEffect","getListItemIdByIndex","childrenRefs","index","_a","current","getListItemIndexById","findIndex","child","getListItemComponentType","listComponent","isListItem","element","HTMLElement","includes","getAttribute","getNextListItemIndex","currentIndex","length","getPrevListItemIndex"],"mappings":"4KAKA,IAAIA,EAAgB,EACPC,EAAiB,WAC5B,MAAAC,QAAAA,OAAeF,IACjB,EAEMG,EAAc,CAAC,SAAU,WAAY,WAAY,MAAO,YAEjDC,EAAY,SAACC,GACxB,IAAAC,EAA4BC,IAAkBC,EAAAC,EAAAH,EAAA,GAAvCI,EAAMF,EAAA,GAAEG,EAASH,EAAA,GAIxB,OAHAI,GAA0B,WACxBD,EAAUN,GAAMJ,IAClB,GAAG,CAACI,IACGK,CACT,EAEaG,EAAuB,SAACC,EAA+CC,SAClF,OAAoC,QAA7BC,EAAAF,EAAaG,QAAQF,UAAQ,IAAAC,OAAA,EAAAA,EAAAX,EACtC,EAEaa,EAAuB,SAACJ,EAA+CT,GAClF,OAAOS,EAAaG,QAAQE,WAAU,SAAAC,GAAK,OAAIA,aAAA,EAAAA,EAAOf,MAAOA,IAC/D,EAEagB,EAA2B,SAACC,GACvC,OAAQA,GACN,IAAK,KACL,IAAK,KACH,MAAO,KACT,IAAK,MACH,MAAO,IACT,QACE,MAAO,MAEb,EAEaC,EAAa,SAACC,GACzB,OAAOA,GAAWA,aAAmBC,aAAetB,EAAYuB,SAASF,EAAQG,aAAa,QAChG,EAEaC,EAAuB,SAACC,EAAsBf,GACzD,KAAsBA,EAAaG,QAAQa,OAAS,EAA7CD,GAAgD,CACrD,IAAMT,EAAQN,EAAaG,UAAUY,GACrC,GAAIN,EAAWH,GACb,OAAOS,CAEX,CAEF,EAEaE,EAAuB,SAACF,EAAsBf,GACzD,KAAOe,EAAe,GAAG,CACvB,IAAMT,EAAQN,EAAaG,UAAUY,GACrC,GAAIN,EAAWH,GACb,OAAOS,CAEX,CAEF"}

package/dist/mocked_classnames/src/components/ListItem/ListItem.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import o from"classnames";import t,{forwardRef as i,useContext as s,useRef as r,useEffect as a,useCallback as n}from"react";import{camelCase as d}from"es-toolkit";import{useMergeRef as m,NOOP as l,useKeyEvent as c,getStyle as p}from"@vibe/shared";import{Text as u}from"@vibe/typography/mockedClassNames";import{SELECTION_KEYS as f}from"../../constants/keyCodes.js";import{SIZES as v}from"../../constants/sizes.js";import"@vibe/hooks";import"../Menu/Menu/hooks/useLastNavigationDirection.js";import"../../hooks/useFullKeyboardListeners.js";import"../../hooks/useActiveDescendantListFocus/index.js";import"../../hooks/useVibeMediaQuery/index.js";import"../../hooks/useSwitch/index.js";import{ListContext as b}from"../List/utils/ListContext.js";import k from"./ListItem.module.scss.js";var j=i((function(i,j){var h=i.className,y=i.id,L=i.component,x=void 0===L?"div":L,I=i.onClick,C=void 0===I?l:I,M=i.onHover,N=void 0===M?l:M,g=i.selected,F=i.disabled,P=void 0!==F&&F,z=i.size,A=void 0===z?v.SMALL:z,D=i.tabIndex,E=void 0===D?0:D,H=i.children,S=i["aria-current"],_=i["data-testid"],w=i.role,B=void 0===w?"option":w,K=i.tooltipProps,O=s(b).updateFocusedItem,Q=r(null),V=m(j,Q);a((function(){g&&(null==O||O(y))}),[g,y,O]);var q=n((function(e){P||C(e,y)}),[P,C,y]),G=n((function(e){return q(e)}),[q]);c({keys:f,ref:Q,callback:G});var J=n((function(e){P||N(e,y)}),[P,N,y]);return t.createElement(u,{element:x,"data-testid":_||y,ref:V,className:o(k.listItem,h,p(k,d(A)),e(e({},k.selected,g&&!P),k.disabled,P)),id:y,type:"text2","aria-disabled":P,"aria-selected":g,onClick:q,onMouseEnter:J,onFocus:J,role:B,tabIndex:E,"aria-current":S,tooltipProps:K},H)}));Object.assign(j,{displayName:"ListItem"});export{j as default};
+import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import o from"classnames";import t,{forwardRef as i,useContext as s,useRef as r,useEffect as a,useCallback as n}from"react";import{camelCase as d}from"es-toolkit";import{useMergeRef as m,useKeyEvent as l,getStyle as c,NOOP as p}from"@vibe/shared";import{Text as u}from"@vibe/typography/mockedClassNames";import{SELECTION_KEYS as f}from"../../constants/keyCodes.js";import{SIZES as v}from"../../constants/sizes.js";import"@vibe/hooks";import"../Menu/Menu/hooks/useLastNavigationDirection.js";import"../../hooks/useFullKeyboardListeners.js";import"../../hooks/useActiveDescendantListFocus/index.js";import"../../hooks/useVibeMediaQuery/index.js";import"../../hooks/useSwitch/index.js";import{ListContext as b}from"../List/utils/ListContext.js";import k from"./ListItem.module.scss.js";var j=i((function(i,j){var h=i.className,y=i.id,L=i.component,x=void 0===L?"div":L,I=i.onClick,C=void 0===I?p:I,M=i.onHover,N=void 0===M?p:M,g=i.selected,F=i.disabled,P=void 0!==F&&F,z=i.size,A=void 0===z?v.SMALL:z,D=i.tabIndex,E=void 0===D?0:D,H=i.children,S=i["aria-current"],_=i["data-testid"],w=i.role,B=void 0===w?"option":w,K=i.tooltipProps,O=s(b).updateFocusedItem,Q=r(null),V=m(j,Q);a((function(){g&&(null==O||O(y))}),[g,y,O]);var q=n((function(e){P||C(e,y)}),[P,C,y]),G=n((function(e){return q(e)}),[q]);l({keys:f,ref:Q,callback:G});var J=n((function(e){P||N(e,y)}),[P,N,y]);return t.createElement(u,{element:x,"data-testid":_||y,ref:V,className:o(k.listItem,h,c(k,d(A)),e(e({},k.selected,g&&!P),k.disabled,P)),id:y,type:"text2","aria-disabled":P,"aria-selected":g,onClick:q,onMouseEnter:J,onFocus:J,role:B,tabIndex:E,"aria-current":S,tooltipProps:K},H)}));Object.assign(j,{displayName:"ListItem"});export{j as default};
 //# sourceMappingURL=ListItem.js.map

package/dist/mocked_classnames/src/components/ListItem/ListItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItem.js","sources":["../../../../../src/components/ListItem/ListItem.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, {\n type AriaAttributes,\n type AriaRole,\n forwardRef,\n useCallback,\n useContext,\n useEffect,\n useRef\n} from \"react\";\nimport { camelCase } from \"es-toolkit\";\nimport { getStyle, NOOP, useMergeRef } from \"@vibe/shared\";\nimport { Text } from \"@vibe/typography\";\nimport { SIZES, SELECTION_KEYS } from \"../../constants\";\n\nimport { type VibeComponentProps, type ElementContent } from \"../../types\";\nimport { useKeyEvent } from \"../../hooks\";\n\nimport { ListContext } from \"../List/utils/ListContext\";\nimport { type ListItemElement, type ListItemSize } from \"./ListItem.types\";\nimport { type TooltipProps } from \"@vibe/tooltip\";\nimport styles from \"./ListItem.module.scss\";\n\nexport interface ListItemProps extends VibeComponentProps {\n /*\n The HTML element used for the list item.\n /\n component?: ListItemElement;\n /\n The textual content inside the list item.\n /\n children?: ElementContent;\n /\n Callback fired when the item is clicked.\n /\n onClick?: (event: React.MouseEvent \| React.KeyboardEvent, id: string) => void;\n /\n Callback fired when the item is hovered.\n /\n onHover?: (event: React.MouseEvent \| React.FocusEvent, id: string) => void;\n /\n If true, disables the item and prevents interactions.\n /\n disabled?: boolean;\n /\n If true, marks the item as selected.\n /\n selected?: boolean;\n /\n The size of the list item.\n /\n size?: ListItemSize;\n /\n The tab index of the list item for keyboard navigation.\n /\n tabIndex?: number;\n /\n Indicates the current state of the item in a set of items.\n /\n \"aria-current\"?: AriaAttributes[\"aria-current\"];\n /\n The ARIA role of the list item.\n /\n role?: AriaRole;\n /\n Props passed to the tooltip displayed when hovering over the text.\n */\n tooltipProps?: Partial<TooltipProps>;\n}\n\nconst ListItem = forwardRef(\n (\n {\n className,\n id,\n component = \"div\",\n onClick = NOOP,\n onHover = NOOP,\n selected,\n disabled = false,\n size = SIZES.SMALL,\n tabIndex = 0,\n children,\n \"aria-current\": ariaCurrent,\n \"data-testid\": dataTestId,\n role = \"option\",\n tooltipProps\n }: ListItemProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n const { updateFocusedItem } = useContext(ListContext);\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n useEffect(() => {\n if (selected) {\n updateFocusedItem?.(id);\n }\n }, [selected, id, updateFocusedItem]);\n\n const componentOnClick = useCallback(\n (event: React.MouseEvent \| React.KeyboardEvent) => {\n if (disabled) return;\n onClick(event, id);\n },\n [disabled, onClick, id]\n );\n\n const onKeyboardSelect = useCallback((event: React.KeyboardEvent) => componentOnClick(event), [componentOnClick]);\n\n useKeyEvent({\n keys: SELECTION_KEYS,\n ref: componentRef,\n callback: onKeyboardSelect\n });\n\n const componentOnHover = useCallback(\n (event: React.MouseEvent \| React.FocusEvent) => {\n if (disabled) return;\n onHover(event, id);\n },\n [disabled, onHover, id]\n );\n\n return (\n <Text\n element={component}\n data-testid={dataTestId \|\| id}\n ref={mergedRef}\n className={cx(styles.listItem, className, getStyle(styles, camelCase(size)), {\n [styles.selected]: selected && !disabled,\n [styles.disabled]: disabled\n })}\n id={id}\n type=\"text2\"\n aria-disabled={disabled}\n aria-selected={selected}\n onClick={componentOnClick}\n onMouseEnter={componentOnHover}\n onFocus={componentOnHover}\n role={role}\n tabIndex={tabIndex}\n aria-current={ariaCurrent}\n tooltipProps={tooltipProps}\n >\n {children}\n </Text>\n );\n }\n);\n\nObject.assign(ListItem, {\n // Used by VirtualizedListItems\n displayName: \"ListItem\"\n});\n\nexport default ListItem;\n"],"names":["ListItem","forwardRef","_ref","ref","className","id","_ref$component","component","_ref$onClick","onClick","NOOP","_ref$onHover","onHover","selected","_ref$disabled","disabled","_ref$size","size","SIZES","SMALL","_ref$tabIndex","tabIndex","children","ariaCurrent","dataTestId","_ref$role","role","tooltipProps","updateFocusedItem","useContext","ListContext","componentRef","useRef","mergedRef","useMergeRef","useEffect","componentOnClick","useCallback","event","onKeyboardSelect","useKeyEvent","keys","SELECTION_KEYS","callback","componentOnHover","React","createElement","Text","element","cx","styles","listItem","getStyle","camelCase","_defineProperty","type","onMouseEnter","onFocus","Object","assign","displayName"],"mappings":"+~~1BAsEA~~,~~IAAMA~~,EAAWC,GACf,SAAAC,EAiBEC,GACE,IAhBAC,EAASF,EAATE,UACAC,EAAEH,EAAFG,GAAEC,EAAAJ,EACFK,UAAAA,~~OAAS~~,~~IAAAD~~,EAAG,MAAKA,EAAAE,EAAAN,EACjBO,QAAAA,~~OAAO~~,~~IAAAD~~,EAAGE,EAAIF,EAAAG,EAAAT,EACdU,QAAAA,~~OAAO~~,~~IAAAD~~,EAAGD,EAAIC,EACdE,EAAQX,EAARW,SAAQC,EAAAZ,EACRa,SAAAA,~~OAAQ~~,~~IAAAD~~,GAAQA,EAAAE,EAAAd,EAChBe,KAAAA,OAAI,IAAAD,EAAGE,EAAMC,MAAKH,EAAAI,EAAAlB,EAClBmB,SAAAA,~~OAAQ~~,~~IAAAD~~,EAAG,EAACA,EACZE,EAAQpB,EAARoB,SACgBC,EAAWrB,EAA3B,gBACesB,EAAUtB,EAAzB,eAAauB,EAAAvB,EACbwB,KAAAA,~~OAAI~~,~~IAAAD~~,EAAG,SAAQA,EACfE,EAAYzB,EAAZyB,aAIMC,EAAsBC,EAAWC,GAAjCF,kBACFG,EAAeC,EAAO,MACtBC,EAAYC,EAAY/B,EAAK4B,GAEnCI,GAAU,WACJtB,IACFe,SAAAA,EAAoBvB,~~GAExB~~,~~GAAG~~,CAACQ,EAAUR,EAAIuB,IAElB,IAAMQ,EAAmBC,GACvB,SAACC,GACKvB,GACJN,EAAQ6B,EAAOjC,~~EACjB~~,~~GACA~~,CAACU,EAAUN,EAASJ,IAGhBkC,EAAmBF,GAAY,SAACC,GAA0B,OAAKF,EAAiBE,~~EAAM~~,~~GAAE,~~CAACF,IAE/FI,EAAY,CACVC,KAAMC,EACNvC,IAAK4B,EACLY,SAAUJ,IAGZ,IAAMK,EAAmBP,GACvB,SAACC,GACKvB,GACJH,EAAQ0B,EAAOjC,~~EACjB~~,~~GACA~~,CAACU,EAAUH,EAASP,IAGtB,OACEwC,EAAAC,cAACC,EAAI,CACHC,QAASzC,~~EAAS~~,~~cACLiB~~,GAAcnB,EAC3BF,IAAK8B,EACL7B,UAAW6C,EAAGC,EAAOC,SAAU/C,EAAWgD,EAASF,EAAQG,EAAUpC,IAAMqC,EAAAA,~~EAAA~~,~~CAAA~~,~~EACxEJ~~,EAAOrC,SAAWA,IAAaE,GAC/BmC,EAAOnC,SAAWA,IAErBV,GAAIA,EACJkD,KAAK,QAAO,gBACGxC,~~EAAQ~~,~~gBACRF~~,EACfJ,QAAS2B,EACToB,aAAcZ,EACda,QAASb,EACTlB,KAAMA,EACNL,SAAUA,iBACIE,EACdI,aAAcA,GAEbL,EAGP,IAGFoC,OAAOC,OAAO3D,EAAU,CAEtB4D,YAAa"}
1	+ {"version":3,"file":"ListItem.js","sources":["../../../../../src/components/ListItem/ListItem.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, {\n type AriaAttributes,\n type AriaRole,\n forwardRef,\n useCallback,\n useContext,\n useEffect,\n useRef\n} from \"react\";\nimport { camelCase } from \"es-toolkit\";\nimport { getStyle, NOOP, useMergeRef } from \"@vibe/shared\";\nimport { Text } from \"@vibe/typography\";\nimport { SIZES, SELECTION_KEYS } from \"../../constants\";\n\nimport { type VibeComponentProps, type ElementContent } from \"../../types\";\nimport { useKeyEvent } from \"../../hooks\";\n\nimport { ListContext } from \"../List/utils/ListContext\";\nimport { type ListItemElement, type ListItemSize } from \"./ListItem.types\";\nimport { type TooltipProps } from \"@vibe/tooltip\";\nimport styles from \"./ListItem.module.scss\";\n\nexport interface ListItemProps extends VibeComponentProps {\n /*\n The HTML element used for the list item.\n /\n component?: ListItemElement;\n /\n The textual content inside the list item.\n /\n children?: ElementContent;\n /\n Callback fired when the item is clicked.\n /\n onClick?: (event: React.MouseEvent \| React.KeyboardEvent, id: string) => void;\n /\n Callback fired when the item is hovered.\n /\n onHover?: (event: React.MouseEvent \| React.FocusEvent, id: string) => void;\n /\n If true, disables the item and prevents interactions.\n /\n disabled?: boolean;\n /\n If true, marks the item as selected.\n /\n selected?: boolean;\n /\n The size of the list item.\n /\n size?: ListItemSize;\n /\n The tab index of the list item for keyboard navigation.\n /\n tabIndex?: number;\n /\n Indicates the current state of the item in a set of items.\n /\n \"aria-current\"?: AriaAttributes[\"aria-current\"];\n /\n The ARIA role of the list item.\n /\n role?: AriaRole;\n /\n Props passed to the tooltip displayed when hovering over the text.\n */\n tooltipProps?: Partial<TooltipProps>;\n}\n\nconst ListItem = forwardRef(\n (\n {\n className,\n id,\n component = \"div\",\n onClick = NOOP,\n onHover = NOOP,\n selected,\n disabled = false,\n size = SIZES.SMALL,\n tabIndex = 0,\n children,\n \"aria-current\": ariaCurrent,\n \"data-testid\": dataTestId,\n role = \"option\",\n tooltipProps\n }: ListItemProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n const { updateFocusedItem } = useContext(ListContext);\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n useEffect(() => {\n if (selected) {\n updateFocusedItem?.(id);\n }\n }, [selected, id, updateFocusedItem]);\n\n const componentOnClick = useCallback(\n (event: React.MouseEvent \| React.KeyboardEvent) => {\n if (disabled) return;\n onClick(event, id);\n },\n [disabled, onClick, id]\n );\n\n const onKeyboardSelect = useCallback((event: React.KeyboardEvent) => componentOnClick(event), [componentOnClick]);\n\n useKeyEvent({\n keys: SELECTION_KEYS,\n ref: componentRef,\n callback: onKeyboardSelect\n });\n\n const componentOnHover = useCallback(\n (event: React.MouseEvent \| React.FocusEvent) => {\n if (disabled) return;\n onHover(event, id);\n },\n [disabled, onHover, id]\n );\n\n return (\n <Text\n element={component}\n data-testid={dataTestId \|\| id}\n ref={mergedRef}\n className={cx(styles.listItem, className, getStyle(styles, camelCase(size)), {\n [styles.selected]: selected && !disabled,\n [styles.disabled]: disabled\n })}\n id={id}\n type=\"text2\"\n aria-disabled={disabled}\n aria-selected={selected}\n onClick={componentOnClick}\n onMouseEnter={componentOnHover}\n onFocus={componentOnHover}\n role={role}\n tabIndex={tabIndex}\n aria-current={ariaCurrent}\n tooltipProps={tooltipProps}\n >\n {children}\n </Text>\n );\n }\n);\n\nObject.assign(ListItem, {\n // Used by VirtualizedListItems\n displayName: \"ListItem\"\n});\n\nexport default ListItem;\n"],"names":["ListItem","forwardRef","_ref","ref","className","id","_ref$component","component","_ref$onClick","onClick","NOOP","_ref$onHover","onHover","selected","_ref$disabled","disabled","_ref$size","size","SIZES","SMALL","_ref$tabIndex","tabIndex","children","ariaCurrent","dataTestId","_ref$role","role","tooltipProps","updateFocusedItem","useContext","ListContext","componentRef","useRef","mergedRef","useMergeRef","useEffect","componentOnClick","useCallback","event","onKeyboardSelect","useKeyEvent","keys","SELECTION_KEYS","callback","componentOnHover","React","createElement","Text","element","cx","styles","listItem","getStyle","camelCase","_defineProperty","type","onMouseEnter","onFocus","Object","assign","displayName"],"mappings":"+1BAsEMA,IAAAA,EAAWC,GACf,SAAAC,EAiBEC,GACE,IAhBAC,EAASF,EAATE,UACAC,EAAEH,EAAFG,GAAEC,EAAAJ,EACFK,UAAAA,OAAY,IAAHD,EAAG,MAAKA,EAAAE,EAAAN,EACjBO,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAT,EACdU,QAAAA,OAAUF,IAAHC,EAAGD,EAAIC,EACdE,EAAQX,EAARW,SAAQC,EAAAZ,EACRa,SAAAA,OAAW,IAAHD,GAAQA,EAAAE,EAAAd,EAChBe,KAAAA,OAAI,IAAAD,EAAGE,EAAMC,MAAKH,EAAAI,EAAAlB,EAClBmB,SAAAA,OAAW,IAAHD,EAAG,EAACA,EACZE,EAAQpB,EAARoB,SACgBC,EAAWrB,EAA3B,gBACesB,EAAUtB,EAAzB,eAAauB,EAAAvB,EACbwB,KAAAA,OAAO,IAAHD,EAAG,SAAQA,EACfE,EAAYzB,EAAZyB,aAIMC,EAAsBC,EAAWC,GAAjCF,kBACFG,EAAeC,EAAO,MACtBC,EAAYC,EAAY/B,EAAK4B,GAEnCI,GAAU,WACJtB,IACFe,SAAAA,EAAoBvB,GAEvB,GAAE,CAACQ,EAAUR,EAAIuB,IAElB,IAAMQ,EAAmBC,GACvB,SAACC,GACKvB,GACJN,EAAQ6B,EAAOjC,EAChB,GACD,CAACU,EAAUN,EAASJ,IAGhBkC,EAAmBF,GAAY,SAACC,GAA0B,OAAKF,EAAiBE,KAAQ,CAACF,IAE/FI,EAAY,CACVC,KAAMC,EACNvC,IAAK4B,EACLY,SAAUJ,IAGZ,IAAMK,EAAmBP,GACvB,SAACC,GACKvB,GACJH,EAAQ0B,EAAOjC,EAChB,GACD,CAACU,EAAUH,EAASP,IAGtB,OACEwC,EAAAC,cAACC,EAAI,CACHC,QAASzC,EACI,cAAAiB,GAAcnB,EAC3BF,IAAK8B,EACL7B,UAAW6C,EAAGC,EAAOC,SAAU/C,EAAWgD,EAASF,EAAQG,EAAUpC,IAAMqC,EAAAA,EACxEJ,CAAAA,EAAAA,EAAOrC,SAAWA,IAAaE,GAC/BmC,EAAOnC,SAAWA,IAErBV,GAAIA,EACJkD,KAAK,QAAO,gBACGxC,EACA,gBAAAF,EACfJ,QAAS2B,EACToB,aAAcZ,EACda,QAASb,EACTlB,KAAMA,EACNL,SAAUA,iBACIE,EACdI,aAAcA,GAEbL,EAGP,IAGFoC,OAAOC,OAAO3D,EAAU,CAEtB4D,YAAa"}

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

@@ -1,2 +1,2 @@
-var e={listItem:"listItem","focus-visible":"focus-visible",disabled:"disabled",selected:"selected",small:"small",medium:"medium",large:"large"};!function(e){const n="s_id-8402a299d384_4_2_2";if("undefined"!=typeof document){const l=document.head||document.getElementsByTagName("head")[0];if(l.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,l.firstChild?l.insertBefore(t,l.firstChild):l.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable selector-class-pattern */\n/* stylelint-disable */\n/* stylelint-enable */\n.listItem {\n  display: flex;\n  align-items: center;\n  padding: 8px 16px;\n  border-radius: 4px;\n  cursor: pointer;\n}\n.listItem:focus-visible, .listItem.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5) inset, 0 0 0 1px var(--primary-hover-color) inset;\n}\n.listItem:focus:not(.focus-visible) {\n  outline: none;\n}\n.listItem:hover {\n  background-color: var(--primary-background-hover-color);\n}\n.disabled {\n  cursor: not-allowed;\n}\n.disabled:hover {\n  background-color: transparent;\n}\n.selected {\n  background-color: var(--primary-selected-color);\n}\n.selected:hover {\n  background-color: var(--primary-selected-color);\n}\n.small {\n  height: 32px;\n}\n.medium {\n  height: 40px;\n}\n.large {\n  height: 48px;\n}");export{e as default};
+var e={listItem:"listItem","focus-visible":"focus-visible",disabled:"disabled",selected:"selected",small:"small",medium:"medium",large:"large"};!function(e){const n="s_id-8402a299d384_4_2_3";if("undefined"!=typeof document){const l=document.head||document.getElementsByTagName("head")[0];if(l.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,l.firstChild?l.insertBefore(t,l.firstChild):l.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable selector-class-pattern */\n/* stylelint-disable */\n/* stylelint-enable */\n.listItem {\n  display: flex;\n  align-items: center;\n  padding: 8px 16px;\n  border-radius: 4px;\n  cursor: pointer;\n}\n.listItem:focus-visible, .listItem.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5) inset, 0 0 0 1px var(--primary-hover-color) inset;\n}\n.listItem:focus:not(.focus-visible) {\n  outline: none;\n}\n.listItem:hover {\n  background-color: var(--primary-background-hover-color);\n}\n.disabled {\n  cursor: not-allowed;\n}\n.disabled:hover {\n  background-color: transparent;\n}\n.selected {\n  background-color: var(--primary-selected-color);\n}\n.selected:hover {\n  background-color: var(--primary-selected-color);\n}\n.small {\n  height: 32px;\n}\n.medium {\n  height: 40px;\n}\n.large {\n  height: 48px;\n}");export{e as default};
 //# sourceMappingURL=ListItem.module.scss.js.map

package/dist/mocked_classnames/src/components/ListItemAvatar/ListItemAvatar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItemAvatar.js","sources":["../../../../../src/components/ListItemAvatar/ListItemAvatar.tsx"],"sourcesContent":["import React, { forwardRef, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { useMergeRef } from \"@vibe/shared\";\nimport { type VibeComponentProps } from \"../../types\";\nimport Avatar from \"../Avatar/Avatar\";\nimport { type ListItemElement } from \"../ListItem\";\nimport styles from \"./ListItemAvatar.module.scss\";\n\nexport interface ListItemAvatarProps extends VibeComponentProps {\n /*\n The HTML element used for the list item avatar.\n /\n component?: ListItemElement;\n /\n The source URL of the avatar image.\n /\n src?: string;\n /\n Class name applied to the avatar.\n */\n avatarClassName?: string;\n}\n\nconst ListItemAvatar = forwardRef(\n (\n { className, id, src, avatarClassName, component: Component = \"div\" }: ListItemAvatarProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n return (\n <Component ref={mergedRef} className={cx(styles.listItemAvatar, className)} id={id} aria-hidden=\"true\">\n <Avatar src={src} type=\"img\" size=\"small\" className={cx(styles.avatar, avatarClassName)} />\n </Component>\n );\n }\n);\n\nexport default ListItemAvatar;\n"],"names":["ListItemAvatar","forwardRef","_ref","ref","className","id","src","avatarClassName","_ref$component","component","Component","componentRef","useRef","mergedRef","useMergeRef","React","cx","styles","listItemAvatar","createElement","Avatar","type","size","avatar"],"mappings":"~~yMAuBA~~,~~IAAMA~~,EAAiBC,GACrB,SAAAC,EAEEC,GACE,IAFAC,EAASF,EAATE,UAAWC,EAAEH,EAAFG,GAAIC,EAAGJ,EAAHI,IAAKC,EAAeL,EAAfK,gBAAeC,EAAAN,EAAEO,UAAWC,~~OAAS~~,~~IAAAF~~,EAAG,MAAKA,EAG7DG,EAAeC,EAAO,MACtBC,EAAYC,EAAYX,EAAKQ,GAEnC,OACEI,gBAACL,EAAS,CAACP,IAAKU,EAAWT,UAAWY,EAAGC,EAAOC,eAAgBd,GAAYC,GAAIA,EAAE,cAAc,QAC9FU,~~EAAAI~~,~~cAACC~~,~~EAAM~~,~~CAACd~~,IAAKA,EAAKe,KAAK,MAAMC,KAAK,QAAQlB,UAAWY,EAAGC,EAAOM,OAAQhB,KAG7E"}
1	+ {"version":3,"file":"ListItemAvatar.js","sources":["../../../../../src/components/ListItemAvatar/ListItemAvatar.tsx"],"sourcesContent":["import React, { forwardRef, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { useMergeRef } from \"@vibe/shared\";\nimport { type VibeComponentProps } from \"../../types\";\nimport Avatar from \"../Avatar/Avatar\";\nimport { type ListItemElement } from \"../ListItem\";\nimport styles from \"./ListItemAvatar.module.scss\";\n\nexport interface ListItemAvatarProps extends VibeComponentProps {\n /*\n The HTML element used for the list item avatar.\n /\n component?: ListItemElement;\n /\n The source URL of the avatar image.\n /\n src?: string;\n /\n Class name applied to the avatar.\n */\n avatarClassName?: string;\n}\n\nconst ListItemAvatar = forwardRef(\n (\n { className, id, src, avatarClassName, component: Component = \"div\" }: ListItemAvatarProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n return (\n <Component ref={mergedRef} className={cx(styles.listItemAvatar, className)} id={id} aria-hidden=\"true\">\n <Avatar src={src} type=\"img\" size=\"small\" className={cx(styles.avatar, avatarClassName)} />\n </Component>\n );\n }\n);\n\nexport default ListItemAvatar;\n"],"names":["ListItemAvatar","forwardRef","_ref","ref","className","id","src","avatarClassName","_ref$component","component","Component","componentRef","useRef","mergedRef","useMergeRef","React","cx","styles","listItemAvatar","createElement","Avatar","type","size","avatar"],"mappings":"yMAuBMA,IAAAA,EAAiBC,GACrB,SAAAC,EAEEC,GACE,IAFAC,EAASF,EAATE,UAAWC,EAAEH,EAAFG,GAAIC,EAAGJ,EAAHI,IAAKC,EAAeL,EAAfK,gBAAeC,EAAAN,EAAEO,UAAWC,OAAY,IAAHF,EAAG,MAAKA,EAG7DG,EAAeC,EAAO,MACtBC,EAAYC,EAAYX,EAAKQ,GAEnC,OACEI,gBAACL,EAAS,CAACP,IAAKU,EAAWT,UAAWY,EAAGC,EAAOC,eAAgBd,GAAYC,GAAIA,EAAE,cAAc,QAC9FU,EAACI,cAAAC,EAAO,CAAAd,IAAKA,EAAKe,KAAK,MAAMC,KAAK,QAAQlB,UAAWY,EAAGC,EAAOM,OAAQhB,KAG7E"}

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

@@ -1,2 +1,2 @@
-var e={listItemAvatar:"listItemAvatar",avatar:"avatar"};!function(e){const t="s_id-4e549e461b77_4_2_2";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const a=document.createElement("style");a.id=t,n.firstChild?n.insertBefore(a,n.firstChild):n.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.listItemAvatar {\n  display: flex;\n  align-items: center;\n  color: var(--primary-text-color);\n}\n.avatar {\n  width: 22px;\n  height: 22px;\n  margin-inline-end: var(--space-8);\n}");export{e as default};
+var e={listItemAvatar:"listItemAvatar",avatar:"avatar"};!function(e){const t="s_id-4e549e461b77_4_2_3";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const a=document.createElement("style");a.id=t,n.firstChild?n.insertBefore(a,n.firstChild):n.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.listItemAvatar {\n  display: flex;\n  align-items: center;\n  color: var(--primary-text-color);\n}\n.avatar {\n  width: 22px;\n  height: 22px;\n  margin-inline-end: var(--space-8);\n}");export{e as default};
 //# sourceMappingURL=ListItemAvatar.module.scss.js.map

package/dist/mocked_classnames/src/components/ListItemIcon/ListItemIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListItemIcon.js","sources":["../../../../../src/components/ListItemIcon/ListItemIcon.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, useRef } from \"react\";\nimport { useMergeRef, getStyle } from \"@vibe/shared\";\nimport { Icon, type SubIcon } from \"@vibe/icon\";\nimport { type ListItemElement } from \"../ListItem\";\nimport { type VibeComponentProps } from \"../../types\";\n\nimport styles from \"./ListItemIcon.module.scss\";\nimport { type ListItemIconMargin } from \"./ListItemIcon.types\";\n\nexport const LIST_ITEM_ICON_SIZE = 18;\n\nexport interface ListItemIconProps extends VibeComponentProps {\n /*\n The HTML element used for the list item icon.\n /\n component?: ListItemElement;\n /\n The icon displayed inside the list item.\n /\n icon?: SubIcon;\n /\n The position of the icon inside the list item, determining its margins.\n */\n margin?: ListItemIconMargin;\n}\n\nconst ListItemIcon = forwardRef(\n (\n { className, id, icon, margin = \"start\", component: Component = \"div\" }: ListItemIconProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n return (\n <Component\n ref={mergedRef}\n className={cx(styles.listItemIcon, getStyle(styles, margin), className)}\n id={id}\n aria-hidden=\"true\"\n >\n <Icon icon={icon} ignoreFocusStyle size={LIST_ITEM_ICON_SIZE} />\n </Component>\n );\n }\n);\n\nexport default ListItemIcon;\n"],"names":["LIST_ITEM_ICON_SIZE","ListItemIcon","forwardRef","_ref","ref","className","id","icon","_ref$margin","margin","_ref$component","component","Component","componentRef","useRef","mergedRef","useMergeRef","React","createElement","cx","styles","listItemIcon","getStyle","Icon","ignoreFocusStyle","size"],"mappings":"qOAUO,IAAMA,EAAsB,GAiB7BC,EAAeC,GACnB,SAAAC,EAEEC,GACE,IAFAC,EAASF,EAATE,UAAWC,EAAEH,EAAFG,GAAIC,EAAIJ,EAAJI,KAAIC,EAAAL,EAAEM,OAAAA,~~OAAM~~,~~IAAAD~~,EAAG,QAAOA,EAAAE,EAAAP,EAAEQ,UAAWC,~~OAAS~~,~~IAAAF~~,EAAG,MAAKA,EAG/DG,EAAeC,EAAO,MACtBC,EAAYC,EAAYZ,EAAKS,GAEnC,OACEI,EAAAC,cAACN,EAAS,CACRR,IAAKW,EACLV,UAAWc,EAAGC,EAAOC,aAAcC,EAASF,EAAQX,GAASJ,GAC7DC,GAAIA,gBACQ,QAEZW,EAAAC,cAACK,EAAI,CAAChB,KAAMA,EAAMiB,~~kBAAgB~~,~~EAACC~~,KAhCR,KAmCjC"}
1	+ {"version":3,"file":"ListItemIcon.js","sources":["../../../../../src/components/ListItemIcon/ListItemIcon.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, useRef } from \"react\";\nimport { useMergeRef, getStyle } from \"@vibe/shared\";\nimport { Icon, type SubIcon } from \"@vibe/icon\";\nimport { type ListItemElement } from \"../ListItem\";\nimport { type VibeComponentProps } from \"../../types\";\n\nimport styles from \"./ListItemIcon.module.scss\";\nimport { type ListItemIconMargin } from \"./ListItemIcon.types\";\n\nexport const LIST_ITEM_ICON_SIZE = 18;\n\nexport interface ListItemIconProps extends VibeComponentProps {\n /*\n The HTML element used for the list item icon.\n /\n component?: ListItemElement;\n /\n The icon displayed inside the list item.\n /\n icon?: SubIcon;\n /\n The position of the icon inside the list item, determining its margins.\n */\n margin?: ListItemIconMargin;\n}\n\nconst ListItemIcon = forwardRef(\n (\n { className, id, icon, margin = \"start\", component: Component = \"div\" }: ListItemIconProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n return (\n <Component\n ref={mergedRef}\n className={cx(styles.listItemIcon, getStyle(styles, margin), className)}\n id={id}\n aria-hidden=\"true\"\n >\n <Icon icon={icon} ignoreFocusStyle size={LIST_ITEM_ICON_SIZE} />\n </Component>\n );\n }\n);\n\nexport default ListItemIcon;\n"],"names":["LIST_ITEM_ICON_SIZE","ListItemIcon","forwardRef","_ref","ref","className","id","icon","_ref$margin","margin","_ref$component","component","Component","componentRef","useRef","mergedRef","useMergeRef","React","createElement","cx","styles","listItemIcon","getStyle","Icon","ignoreFocusStyle","size"],"mappings":"qOAUO,IAAMA,EAAsB,GAiB7BC,EAAeC,GACnB,SAAAC,EAEEC,GACE,IAFAC,EAASF,EAATE,UAAWC,EAAEH,EAAFG,GAAIC,EAAIJ,EAAJI,KAAIC,EAAAL,EAAEM,OAAAA,OAAS,IAAHD,EAAG,QAAOA,EAAAE,EAAAP,EAAEQ,UAAWC,OAAY,IAAHF,EAAG,MAAKA,EAG/DG,EAAeC,EAAO,MACtBC,EAAYC,EAAYZ,EAAKS,GAEnC,OACEI,EAAAC,cAACN,EAAS,CACRR,IAAKW,EACLV,UAAWc,EAAGC,EAAOC,aAAcC,EAASF,EAAQX,GAASJ,GAC7DC,GAAIA,gBACQ,QAEZW,EAAAC,cAACK,EAAI,CAAChB,KAAMA,EAAMiB,kBAAiB,EAAAC,KAhCR,KAmCjC"}

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

@@ -1,2 +1,2 @@
-var e={listItemIcon:"listItemIcon",start:"start",end:"end"};!function(e){const n="s_id-1b4ecdbffa23_4_2_2";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const i=document.createElement("style");i.id=n,t.firstChild?t.insertBefore(i,t.firstChild):t.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.listItemIcon {\n  display: flex;\n  align-items: center;\n  color: var(--primary-text-color);\n}\n.start {\n  margin-inline-end: var(--space-8);\n}\n.end {\n  margin-inline-start: var(--space-8);\n}");export{e as default};
+var e={listItemIcon:"listItemIcon",start:"start",end:"end"};!function(e){const n="s_id-1b4ecdbffa23_4_2_3";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const i=document.createElement("style");i.id=n,t.firstChild?t.insertBefore(i,t.firstChild):t.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.listItemIcon {\n  display: flex;\n  align-items: center;\n  color: var(--primary-text-color);\n}\n.start {\n  margin-inline-end: var(--space-8);\n}\n.end {\n  margin-inline-start: var(--space-8);\n}");export{e as default};
 //# sourceMappingURL=ListItemIcon.module.scss.js.map

package/dist/mocked_classnames/src/components/ListTitle/ListTitle.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ListTitle.js","sources":["../../../../../src/components/ListTitle/ListTitle.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, useRef } from \"react\";\nimport { useMergeRef } from \"@vibe/shared\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { Text } from \"@vibe/typography\";\nimport styles from \"./ListTitle.module.scss\";\n\nexport interface ListTitleProps extends VibeComponentProps {\n /*\n The tab index for keyboard navigation.\n /\n tabIndex?: number;\n /\n The title text.\n */\n children?: string;\n}\n\nconst ListTitle: React.FC<ListTitleProps> = forwardRef(\n ({ className, id, children, tabIndex, \"data-testid\": dataTestId }, ref) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n return (\n <Text\n type=\"text1\"\n weight=\"medium\"\n data-testid={dataTestId \|\| id}\n aria-level={3}\n tabIndex={tabIndex}\n role=\"heading\"\n ref={mergedRef}\n className={cx(styles.listTitle, className)}\n id={id}\n >\n {children}\n </Text>\n );\n }\n);\n\nObject.assign(ListTitle, {\n // Used by VirtualizedListItems\n displayName: \"ListTitle\"\n});\n\nexport default ListTitle;\n"],"names":["ListTitle","forwardRef","_ref","ref","className","id","children","tabIndex","dataTestId","componentRef","useRef","mergedRef","useMergeRef","React","Text","type","weight","role","cx","styles","listTitle","Object","assign","displayName"],"mappings":"~~0NAkBA~~,~~IAAMA~~,EAAsCC,GAC1C,SAAAC,EAAmEC,GAAO,IAAvEC,EAASF,EAATE,UAAWC,EAAEH,EAAFG,GAAIC,EAAQJ,EAARI,SAAUC,EAAQL,EAARK,SAAyBC,EAAUN,EAAzB,eAC9BO,EAAeC,EAAO,MACtBC,EAAYC,EAAYT,EAAKM,GAEnC,OACEI,gBAACC,EAAI,CACHC,KAAK,QACLC,OAAO,uBACMR,GAAcH,~~EAAE~~,~~aACjB~~,EACZE,SAAUA,EACVU,KAAK,UACLd,IAAKQ,EACLP,UAAWc,EAAGC,EAAOC,UAAWhB,GAChCC,GAAIA,GAEHC,EAGP,IAGFe,OAAOC,OAAOtB,EAAW,CAEvBuB,YAAa"}
1	+ {"version":3,"file":"ListTitle.js","sources":["../../../../../src/components/ListTitle/ListTitle.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { forwardRef, useRef } from \"react\";\nimport { useMergeRef } from \"@vibe/shared\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { Text } from \"@vibe/typography\";\nimport styles from \"./ListTitle.module.scss\";\n\nexport interface ListTitleProps extends VibeComponentProps {\n /*\n The tab index for keyboard navigation.\n /\n tabIndex?: number;\n /\n The title text.\n */\n children?: string;\n}\n\nconst ListTitle: React.FC<ListTitleProps> = forwardRef(\n ({ className, id, children, tabIndex, \"data-testid\": dataTestId }, ref) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n return (\n <Text\n type=\"text1\"\n weight=\"medium\"\n data-testid={dataTestId \|\| id}\n aria-level={3}\n tabIndex={tabIndex}\n role=\"heading\"\n ref={mergedRef}\n className={cx(styles.listTitle, className)}\n id={id}\n >\n {children}\n </Text>\n );\n }\n);\n\nObject.assign(ListTitle, {\n // Used by VirtualizedListItems\n displayName: \"ListTitle\"\n});\n\nexport default ListTitle;\n"],"names":["ListTitle","forwardRef","_ref","ref","className","id","children","tabIndex","dataTestId","componentRef","useRef","mergedRef","useMergeRef","React","Text","type","weight","role","cx","styles","listTitle","Object","assign","displayName"],"mappings":"0NAkBMA,IAAAA,EAAsCC,GAC1C,SAAAC,EAAmEC,GAAO,IAAvEC,EAASF,EAATE,UAAWC,EAAEH,EAAFG,GAAIC,EAAQJ,EAARI,SAAUC,EAAQL,EAARK,SAAyBC,EAAUN,EAAzB,eAC9BO,EAAeC,EAAO,MACtBC,EAAYC,EAAYT,EAAKM,GAEnC,OACEI,gBAACC,EAAI,CACHC,KAAK,QACLC,OAAO,uBACMR,GAAcH,EACf,aAAA,EACZE,SAAUA,EACVU,KAAK,UACLd,IAAKQ,EACLP,UAAWc,EAAGC,EAAOC,UAAWhB,GAChCC,GAAIA,GAEHC,EAGP,IAGFe,OAAOC,OAAOtB,EAAW,CAEvBuB,YAAa"}

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

@@ -1,2 +1,2 @@
-var e={listTitle:"listTitle"};!function(e){const t="s_id-76c16cf3efba_4_2_2";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const i=document.createElement("style");i.id=t,n.firstChild?n.insertBefore(i,n.firstChild):n.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.listTitle {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  padding: var(--space-16) var(--space-16) var(--space-8);\n  border-radius: var(--border-radius-small);\n}");export{e as default};
+var e={listTitle:"listTitle"};!function(e){const t="s_id-76c16cf3efba_4_2_3";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const i=document.createElement("style");i.id=t,n.firstChild?n.insertBefore(i,n.firstChild):n.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n.listTitle {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  padding: var(--space-16) var(--space-16) var(--space-8);\n  border-radius: var(--border-radius-small);\n}");export{e as default};
 //# sourceMappingURL=ListTitle.module.scss.js.map

package/dist/mocked_classnames/src/components/Menu/Menu/Menu.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{slicedToArray as e}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import n from"classnames";import{SIZES as t}from"../../../constants/sizes.js";import o,{forwardRef as s,useRef as u,useState as i,useMemo as r,useCallback as l,useEffect as d}from"react";import{useMergeRef as a,useIsomorphicLayoutEffect as c,getStyle as m}from"@vibe/shared";import{useClickOutside as v}from"@vibe/hooks";import I from"./hooks/useSubMenuIndex.js";import f from"./hooks/useOnCloseMenu.js";import p from"./hooks/useCloseMenuOnKeyEvent.js";import b from"./hooks/useMenuKeyboardNavigation.js";import M from"./hooks/useMouseLeave.js";import{useAdjacentSelectableMenuIndex as x}from"./hooks/useAdjacentSelectableMenuIndex.js";import{useFocusWithin as h}from"../../../hooks/useFocusWithin.js";import S from"../../../hooks/usePrevious/index.js";import{getTestId as O}from"../../../../testIds.js";import{ComponentVibeId as j,ComponentDefaultTestId as g}from"../../../tests/constants.js";import{useFocusOnMount as k}from"./hooks/useFocusOnMount.js";import{useMenuId as E}from"./hooks/useMenuId.js";import{generateMenuItemId as A}from"./utils/utils.js";import C from"./Menu.module.scss.js";var y=s((function(s,y){var N=s.id,F=s.className,B=s.size,P=void 0===B?t.MEDIUM:B,D=s.tabIndex,L=void 0===D?0:D,V=s["aria-label"],U=void 0===V?"Menu":V,T=s["aria-describedby"],W=s.children,z=s.isVisible,K=void 0===z||z,R=s.onClose,_=s.onItemFocus,q=s.focusOnMount,H=void 0!==q&&q,w=s.focusItemIndex,G=void 0===w?-1:w,J=s.focusItemIndexOnMount,Q=void 0===J?-1:J,X=s.isSubMenu,Y=void 0!==X&&X,Z=s.useDocumentEventListeners,$=void 0!==Z&&Z,ee=s.shouldScrollMenu,ne=void 0!==ee&&ee,te=s["data-testid"],oe=u(null),se=a(oe,y),ue=E(N),ie=u(null),re=i(G),le=e(re,2),de=le[0],ae=le[1],ce=i(!1),me=e(ce,2),ve=me[0],Ie=me[1],fe=r((function(){return o.Children.toArray(W).filter((function(e){return!!e.type.isMenuChild||(console.error("Menu child must be a menuChild item (such as MenuItem, MenuDivider, MenuTitle, etc). This child is not supported: ",e),!1)}))}),[W]),pe=l((function(e){var n,t,s;ae(e);var u=fe[e],i=o.isValidElement(u)?(null===(n=null==u?void 0:u.props)||void 0===n?void 0:n.id)||"".concat(ue,"-item-").concat(e):void 0;i?null===(t=null==oe?void 0:oe.current)||void 0===t||t.setAttribute("aria-activedescendant",i):null===(s=null==oe?void 0:oe.current)||void 0===s||s.removeAttribute("aria-activedescendant")}),[fe,ue]),be=l((function(e){_&&_(e),pe(e),Ie(!1)}),[pe,_]),Me=I(),xe=Me.setSubMenuIsOpenByIndex,he=Me.hasOpenSubMenu,Se=Me.openSubMenuIndex,Oe=Me.resetOpenSubMenuIndex,je=f({setActiveItemIndex:be,setOpenSubMenuIndex:Me.setOpenSubMenuIndex,onClose:R});v({ref:oe,callback:function(){return je()}}),p({hasOpenSubMenu:he,onCloseMenu:je,ref:oe,onClose:R,isSubMenu:Y,useDocumentEventListeners:$});var ge=x({children:fe}),ke=ge.getNextSelectableIndex,Ee=ge.getPreviousSelectableIndex;b({hasOpenSubMenu:he,getNextSelectableIndex:ke,getPreviousSelectableIndex:Ee,activeItemIndex:de,setActiveItemIndex:be,isVisible:K,ref:oe,useDocumentEventListeners:$}),M({resetOpenSubMenuIndex:Oe,hasOpenSubMenu:he,ref:oe,setActiveItemIndex:be}),k({focusItemIndexOnMount:Q,focusChildOnMount:fe[Q],getNextSelectableIndex:ke,updateActiveItemIndex:pe,setIsInitialFocusSet:Ie});var Ae=l((function(){Ie(!0)}),[Ie]),Ce=S(he);d((function(){var e;he||$||de>-1&&Ce&&(null===(e=null==oe?void 0:oe.current)||void 0===e||e.focus())}),[de,he,Ce,$]),c((function(){H&&!$&&requestAnimationFrame((function(){oe&&oe.current&&oe.current.focus()}))}),[oe,H,$]);var ye=h({onBlurWithin:function(){je&&je()}}).focusWithinProps;return o.createElement("ul",{onFocus:null==ye?void 0:ye.onFocus,onBlur:null==ye?void 0:ye.onBlur,id:ue,"data-testid":te||O(g.MENU,N),"data-vibe":j.MENU,className:n(C.menu,m(C,P),F),ref:se,tabIndex:L,"aria-label":U,role:"menu","aria-describedby":T,onMouseOver:Ae},fe&&o.Children.map(fe,(function(e,n){return o.isValidElement(e)?o.cloneElement(e,Object.assign(Object.assign({},null==e?void 0:e.props),{activeItemIndex:de,index:n,setActiveItemIndex:pe,menuRef:oe,resetOpenSubMenuIndex:Oe,isParentMenuVisible:K,setSubMenuIsOpenByIndex:xe,hasOpenSubMenu:n===Se,closeMenu:je,id:A(ue,e,n),useDocumentEventListeners:$,isInitialSelectedState:ve,shouldScrollMenu:ne,getNextSelectableIndex:ke,getPreviousSelectableIndex:Ee,isUnderSubMenu:Y,splitMenuItemIconButtonRef:ie})):null})))}));Object.assign(y,{isMenu:!0,supportFocusOnMount:!0});export{y as default};
+import{slicedToArray as e}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import n from"classnames";import{SIZES as t}from"../../../constants/sizes.js";import o,{forwardRef as s,useRef as u,useState as i,useMemo as r,useCallback as l,useEffect as d}from"react";import{useMergeRef as a,useIsomorphicLayoutEffect as c,getStyle as m}from"@vibe/shared";import{useClickOutside as v}from"@vibe/hooks";import I from"./hooks/useSubMenuIndex.js";import f from"./hooks/useOnCloseMenu.js";import p from"./hooks/useCloseMenuOnKeyEvent.js";import b from"./hooks/useMenuKeyboardNavigation.js";import M from"./hooks/useMouseLeave.js";import{useAdjacentSelectableMenuIndex as x}from"./hooks/useAdjacentSelectableMenuIndex.js";import{useFocusWithin as h}from"../../../hooks/useFocusWithin.js";import S from"../../../hooks/usePrevious/index.js";import{getTestId as O}from"../../../tests/testIds.js";import{ComponentDefaultTestId as j,ComponentVibeId as g}from"../../../tests/constants.js";import{useFocusOnMount as k}from"./hooks/useFocusOnMount.js";import{useMenuId as E}from"./hooks/useMenuId.js";import{generateMenuItemId as A}from"./utils/utils.js";import C from"./Menu.module.scss.js";var y=s((function(s,y){var N=s.id,F=s.className,B=s.size,P=void 0===B?t.MEDIUM:B,D=s.tabIndex,L=void 0===D?0:D,V=s["aria-label"],U=void 0===V?"Menu":V,T=s["aria-describedby"],W=s.children,z=s.isVisible,K=void 0===z||z,R=s.onClose,_=s.onItemFocus,q=s.focusOnMount,H=void 0!==q&&q,w=s.focusItemIndex,G=void 0===w?-1:w,J=s.focusItemIndexOnMount,Q=void 0===J?-1:J,X=s.isSubMenu,Y=void 0!==X&&X,Z=s.useDocumentEventListeners,$=void 0!==Z&&Z,ee=s.shouldScrollMenu,ne=void 0!==ee&&ee,te=s["data-testid"],oe=u(null),se=a(oe,y),ue=E(N),ie=u(null),re=i(G),le=e(re,2),de=le[0],ae=le[1],ce=i(!1),me=e(ce,2),ve=me[0],Ie=me[1],fe=r((function(){return o.Children.toArray(W).filter((function(e){return!!e.type.isMenuChild||(console.error("Menu child must be a menuChild item (such as MenuItem, MenuDivider, MenuTitle, etc). This child is not supported: ",e),!1)}))}),[W]),pe=l((function(e){var n,t,s;ae(e);var u=fe[e],i=o.isValidElement(u)?(null===(n=null==u?void 0:u.props)||void 0===n?void 0:n.id)||"".concat(ue,"-item-").concat(e):void 0;i?null===(t=null==oe?void 0:oe.current)||void 0===t||t.setAttribute("aria-activedescendant",i):null===(s=null==oe?void 0:oe.current)||void 0===s||s.removeAttribute("aria-activedescendant")}),[fe,ue]),be=l((function(e){_&&_(e),pe(e),Ie(!1)}),[pe,_]),Me=I(),xe=Me.setSubMenuIsOpenByIndex,he=Me.hasOpenSubMenu,Se=Me.openSubMenuIndex,Oe=Me.resetOpenSubMenuIndex,je=f({setActiveItemIndex:be,setOpenSubMenuIndex:Me.setOpenSubMenuIndex,onClose:R});v({ref:oe,callback:function(){return je()}}),p({hasOpenSubMenu:he,onCloseMenu:je,ref:oe,onClose:R,isSubMenu:Y,useDocumentEventListeners:$});var ge=x({children:fe}),ke=ge.getNextSelectableIndex,Ee=ge.getPreviousSelectableIndex;b({hasOpenSubMenu:he,getNextSelectableIndex:ke,getPreviousSelectableIndex:Ee,activeItemIndex:de,setActiveItemIndex:be,isVisible:K,ref:oe,useDocumentEventListeners:$}),M({resetOpenSubMenuIndex:Oe,hasOpenSubMenu:he,ref:oe,setActiveItemIndex:be}),k({focusItemIndexOnMount:Q,focusChildOnMount:fe[Q],getNextSelectableIndex:ke,updateActiveItemIndex:pe,setIsInitialFocusSet:Ie});var Ae=l((function(){Ie(!0)}),[Ie]),Ce=S(he);d((function(){var e;he||$||de>-1&&Ce&&(null===(e=null==oe?void 0:oe.current)||void 0===e||e.focus())}),[de,he,Ce,$]),c((function(){H&&!$&&requestAnimationFrame((function(){oe&&oe.current&&oe.current.focus()}))}),[oe,H,$]);var ye=h({onBlurWithin:function(){je&&je()}}).focusWithinProps;return o.createElement("ul",{onFocus:null==ye?void 0:ye.onFocus,onBlur:null==ye?void 0:ye.onBlur,id:ue,"data-testid":te||O(j.MENU,N),"data-vibe":g.MENU,className:n(C.menu,m(C,P),F),ref:se,tabIndex:L,"aria-label":U,role:"menu","aria-describedby":T,onMouseOver:Ae},fe&&o.Children.map(fe,(function(e,n){return o.isValidElement(e)?o.cloneElement(e,Object.assign(Object.assign({},null==e?void 0:e.props),{activeItemIndex:de,index:n,setActiveItemIndex:pe,menuRef:oe,resetOpenSubMenuIndex:Oe,isParentMenuVisible:K,setSubMenuIsOpenByIndex:xe,hasOpenSubMenu:n===Se,closeMenu:je,id:A(ue,e,n),useDocumentEventListeners:$,isInitialSelectedState:ve,shouldScrollMenu:ne,getNextSelectableIndex:ke,getPreviousSelectableIndex:Ee,isUnderSubMenu:Y,splitMenuItemIconButtonRef:ie})):null})))}));Object.assign(y,{isMenu:!0,supportFocusOnMount:!0});export{y as default};
 //# sourceMappingURL=Menu.js.map