npm - @vibe/core - Versions diffs - 3.82.3 → 3.83.1 - Mend

@vibe/core 3.82.3 → 3.83.1

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

Files changed (960) hide show

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

@@ -1,2 +1,2 @@
-import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{getStyle as t}from"../../helpers/typesciptCssModulesHelper.js";import r from"classnames";import n,{forwardRef as o,useMemo as a}from"react";import s from"../IconButton/IconButton.js";import{AlertBannerBackgroundColor as i}from"./AlertBannerConstants.js";import{NOOP as l}from"../../utils/function-utils.js";import{ComponentDefaultTestId as m,ComponentVibeId as c}from"../../tests/constants.js";import{getTestId as d}from"../../tests/testIds.js";import{withStaticProps as p}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import u from"./AlertBanner.module.scss.js";import f from"../Text/Text.js";import{AlertBannerContext as v}from"./AlertBannerContext.js";import B from"../../../icons/dist/react/CloseSmall.js";var b=p(o((function(o,i){var p=o.children,b=o.className,j=o.backgroundColor,A=void 0===j?"primary":j,y=o.onClose,C=void 0===y?l:y,E=o.ariaLabel,N=void 0===E?"":E,k=o.closeButtonAriaLabel,x=void 0===k?"Close":k,g=o.isCloseHidden,T=void 0!==g&&g,I=o.id,L=o["data-testid"],h=a((function(){return r(b,u.alertBanner,t(u,A))}),[b,A]),P="dark"===A,R="warning"===A,_=a((function(){return R?"fixedDark":P?"onInverted":"onPrimary"}),[P,R]),D=a((function(){return n.Children.toArray(p).filter((function(e){return!(!e.type.isAlertBannerItem&&"MDXCreateElement"!==e.type.displayName)||(console.error("Alert banner child is not supported. Please use AlertBannerText, AlertBannerLink or AlertBannerButton.",e),!1)})).map((function(e,t){return n.cloneElement(e,Object.assign(Object.assign({},null==e?void 0:e.props),{marginLeft:t>0,isDarkBackground:P}))}))}),[p,P]);return n.createElement(f,{type:"text2",color:_,ref:i,className:h,role:"banner","aria-label":N||"banner",id:I,"data-testid":L||d(m.ALERT_BANNER,I),"data-vibe":c.ALERT_BANNER},n.createElement(v.Provider,{value:{textColor:_}},n.createElement("div",{className:r(u.content)},D.map((function(t,o){var a=t.type.isAlertBannerText;return n.createElement("div",{key:o,className:r(u.contentItem,e({},u.contentItemText,a))},a?n.createElement("div",{className:r(u.ellipsis)},t):t)})))),n.createElement("div",{className:r(u.closeButtonWrapper)},T?null:n.createElement(s,{"data-testid":"alert-banner-close-button",icon:B,className:r(u.closeBtn),hideTooltip:!0,onClick:C,size:"small",kind:"tertiary",color:P?"on-inverted-background":"on-primary-color",ariaLabel:x})))})),{backgroundColors:i});export{b as default};
+import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{getStyle as t}from"../../helpers/typesciptCssModulesHelper.js";import r from"classnames";import o,{forwardRef as n,useMemo as a}from"react";import{AlertBannerBackgroundColor as s}from"./AlertBannerConstants.js";import{NOOP as i}from"../../utils/function-utils.js";import{ComponentDefaultTestId as l,ComponentVibeId as m}from"../../tests/constants.js";import{getTestId as c}from"../../tests/testIds.js";import{withStaticProps as p}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import d from"./AlertBanner.module.scss.js";import{AlertBannerContext as u}from"./AlertBannerContext.js";import f from"../../../components/typography/dist/Text/Text.js";import v from"../../../components/icon-button/dist/IconButton/IconButton.js";import B from"../../../icons/dist/react/CloseSmall.js";var b=p(n((function(n,s){var p=n.children,b=n.className,y=n.backgroundColor,j=void 0===y?"primary":y,A=n.onClose,C=void 0===A?i:A,E=n.ariaLabel,N=void 0===E?"":E,k=n.closeButtonAriaLabel,g=void 0===k?"Close":k,x=n.isCloseHidden,T=void 0!==x&&x,h=n.id,I=n["data-testid"],L=a((function(){return r(b,d.alertBanner,t(d,j))}),[b,j]),P="dark"===j,R="warning"===j,_=a((function(){return R?"fixedDark":P?"onInverted":"onPrimary"}),[P,R]),D=a((function(){return o.Children.toArray(p).filter((function(e){return!(!e.type.isAlertBannerItem&&"MDXCreateElement"!==e.type.displayName)||(console.error("Alert banner child is not supported. Please use AlertBannerText, AlertBannerLink or AlertBannerButton.",e),!1)})).map((function(e,t){return o.cloneElement(e,Object.assign(Object.assign({},null==e?void 0:e.props),{marginLeft:t>0,isDarkBackground:P}))}))}),[p,P]);return o.createElement(f,{type:"text2",color:_,ref:s,className:L,role:"banner","aria-label":N||"banner",id:h,"data-testid":I||c(l.ALERT_BANNER,h),"data-vibe":m.ALERT_BANNER},o.createElement(u.Provider,{value:{textColor:_}},o.createElement("div",{className:r(d.content)},D.map((function(t,n){var a=t.type.isAlertBannerText;return o.createElement("div",{key:n,className:r(d.contentItem,e({},d.contentItemText,a))},a?o.createElement("div",{className:r(d.ellipsis)},t):t)})))),o.createElement("div",{className:r(d.closeButtonWrapper)},T?null:o.createElement(v,{"data-testid":"alert-banner-close-button",icon:B,className:r(d.closeBtn),hideTooltip:!0,onClick:C,size:"small",kind:"tertiary",color:P?"on-inverted-background":"on-primary-color",ariaLabel:g})))})),{backgroundColors:s});export{b as default};
 //# sourceMappingURL=AlertBanner.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"AlertBanner.js","sources":["../../../../src/components/AlertBanner/AlertBanner.tsx"],"sourcesContent":["import { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport cx from \"classnames\";\nimport React, { type ForwardedRef, forwardRef, type ReactElement, useMemo } from \"react\";\nimport IconButton from \"~~../../components~~/~~IconButton/IconButton~~\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport { AlertBannerBackgroundColor as AlertBannerBackgroundColorEnum } from \"./AlertBannerConstants\";\nimport { type AlertBannerBackgroundColor } from \"./AlertBanner.types\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { type AlertBannerLinkProps } from \"./AlertBannerLink/AlertBannerLink\";\nimport { type AlertBannerButtonProps } from \"./AlertBannerButton/AlertBannerButton\";\nimport { type AlertBannerTextProps } from \"./AlertBannerText/AlertBannerText\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { type VibeComponentProps, withStaticProps } from \"../../types\";\nimport styles from \"./AlertBanner.module.scss\";\nimport Text from \"~~../Text~~/~~Text~~\";\nimport { AlertBannerContext } from \"./AlertBannerContext\";\n\ntype ChildrenType = ReactElement<AlertBannerButtonProps \| AlertBannerLinkProps \| AlertBannerTextProps>;\n\nexport interface AlertBannerProps extends VibeComponentProps {\n /*\n The background color of the alert banner.\n /\n backgroundColor?: AlertBannerBackgroundColor;\n /\n If true, the close button is hidden.\n /\n isCloseHidden?: boolean;\n /\n The ARIA label of the alert banner for accessibility.\n /\n ariaLabel?: string;\n /\n The ARIA label of the close button for accessibility.\n /\n closeButtonAriaLabel?: string;\n /\n Callback fired when the close button is clicked.\n /\n onClose?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n /\n The content of the alert banner.\n */\n children?: ChildrenType \| ChildrenType[];\n}\n\nconst AlertBanner = forwardRef(\n (\n {\n children: originalChildren,\n className,\n backgroundColor = \"primary\",\n onClose = NOOP,\n ariaLabel = \"\",\n closeButtonAriaLabel = \"Close\",\n isCloseHidden = false,\n id,\n \"data-testid\": dataTestId\n }: AlertBannerProps,\n ref: ForwardedRef<HTMLDivElement>\n ) => {\n const classNames = useMemo(() => {\n return cx(className, styles.alertBanner, getStyle(styles, backgroundColor));\n }, [className, backgroundColor]);\n\n const isDarkBackground = backgroundColor === \"dark\";\n const isFixedColor = backgroundColor === \"warning\";\n const textColor = useMemo(() => {\n if (isFixedColor) {\n return \"fixedDark\";\n }\n return isDarkBackground ? \"onInverted\" : \"onPrimary\";\n }, [isDarkBackground, isFixedColor]);\n const children = useMemo(() => {\n const allChildren = React.Children.toArray(originalChildren) as ReactElement[];\n const filteredChildren = allChildren.filter(\n (\n child: ReactElement & {\n type: Record<string, unknown>;\n }\n ) => {\n if (child.type.isAlertBannerItem \|\| child.type.displayName === \"MDXCreateElement\") return true;\n console.error(\n \"Alert banner child is not supported. Please use AlertBannerText, AlertBannerLink or AlertBannerButton.\",\n child\n );\n return false;\n }\n );\n\n return filteredChildren.map((child, index) => {\n return React.cloneElement(child, {\n ...child?.props,\n marginLeft: index > 0,\n isDarkBackground\n });\n });\n }, [originalChildren, isDarkBackground]);\n\n return (\n <Text\n type=\"text2\"\n color={textColor}\n ref={ref}\n className={classNames}\n role=\"banner\"\n aria-label={ariaLabel \|\| \"banner\"}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.ALERT_BANNER, id)}\n data-vibe={ComponentVibeId.ALERT_BANNER}\n >\n <AlertBannerContext.Provider value={{ textColor }}>\n <div className={cx(styles.content)}>\n {children.map(\n (\n child: ReactElement & {\n type: Record<string, unknown>;\n },\n index\n ) => {\n const childTypeIsAlertBannerText = child.type.isAlertBannerText;\n return (\n <div\n key={index}\n className={cx(styles.contentItem, {\n [styles.contentItemText]: childTypeIsAlertBannerText\n })}\n >\n {childTypeIsAlertBannerText ? <div className={cx(styles.ellipsis)}>{child}</div> : child}\n </div>\n );\n }\n )}\n </div>\n </AlertBannerContext.Provider>\n <div className={cx(styles.closeButtonWrapper)}>\n {isCloseHidden ? null : (\n <IconButton\n data-testid=\"alert-banner-close-button\"\n icon={CloseSmall}\n className={cx(styles.closeBtn)}\n hideTooltip\n onClick={onClose}\n size=\"small\"\n kind=\"tertiary\"\n color={isDarkBackground ? \"on-inverted-background\" : \"on-primary-color\"}\n ariaLabel={closeButtonAriaLabel}\n />\n )}\n </div>\n </Text>\n );\n }\n);\n\ninterface AlertBannerStaticProps {\n backgroundColors: typeof AlertBannerBackgroundColorEnum;\n}\n\nexport default withStaticProps<AlertBannerProps, AlertBannerStaticProps>(AlertBanner, {\n backgroundColors: AlertBannerBackgroundColorEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","originalChildren","children","className","_ref$backgroundColor","backgroundColor","_ref$onClose","onClose","NOOP","_ref$ariaLabel","ariaLabel","_ref$closeButtonAriaL","closeButtonAriaLabel","_ref$isCloseHidden","isCloseHidden","id","dataTestId","classNames","useMemo","cx","styles","alertBanner","getStyle","isDarkBackground","isFixedColor","textColor","React","Children","toArray","filter","child","type","isAlertBannerItem","displayName","console","error","map","index","cloneElement","Object","assign","props","marginLeft","Text","color","role","getTestId","ComponentDefaultTestId","ALERT_BANNER","ComponentVibeId","createElement","AlertBannerContext","Provider","value","content","childTypeIsAlertBannerText","isAlertBannerText","key","contentItem","_defineProperty","contentItemText","ellipsis","closeButtonWrapper","IconButton","icon","CloseSmall","closeBtn","hideTooltip","onClick","size","kind","backgroundColors","AlertBannerBackgroundColorEnum"],"mappings":"~~2zBA~~+CA,IAiHeA,EAAAA,EAjHKC,GAClB,SAAAC,EAYEC,GACE,IAXUC,EAAgBF,EAA1BG,SACAC,EAASJ,EAATI,UAASC,EAAAL,EACTM,gBAAAA,OAAkB,IAAHD,EAAG,UAASA,EAAAE,EAAAP,EAC3BQ,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAV,EACdW,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAAAE,EAAAZ,EACda,qBAAAA,OAAuB,IAAHD,EAAG,QAAOA,EAAAE,EAAAd,EAC9Be,cAAAA,OAAgB,IAAHD,GAAQA,EACrBE,EAAEhB,EAAFgB,GACeC,EAAUjB,EAAzB,eAIIkB,EAAaC,GAAQ,WACzB,OAAOC,EAAGhB,EAAWiB,EAAOC,YAAaC,EAASF,EAAQf,GAC5D,GAAG,CAACF,EAAWE,IAETkB,EAAuC,SAApBlB,EACnBmB,EAAmC,YAApBnB,EACfoB,EAAYP,GAAQ,WACxB,OAAIM,EACK,YAEFD,EAAmB,aAAe,WAC3C,GAAG,CAACA,EAAkBC,IAChBtB,EAAWgB,GAAQ,WAiBvB,OAhBoBQ,EAAMC,SAASC,QAAQ3B,GACN4B,QACnC,SACEC,GAIA,SAAIA,EAAMC,KAAKC,mBAAgD,qBAA3BF,EAAMC,KAAKE,eAC/CC,QAAQC,MACN,yGACAL,IAEK,EACT,IAGsBM,KAAI,SAACN,EAAOO,GAClC,OAAOX,EAAMY,aAAaR,EACrBS,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAAV,aAAA,EAAAA,EAAOW,OAAK,CACfC,WAAYL,EAAQ,EACpBd,iBAAAA,IAEJ,GACF,GAAG,CAACtB,EAAkBsB,IAEtB,OACEG,gBAACiB,EAAI,CACHZ,KAAK,QACLa,MAAOnB,EACPzB,IAAKA,EACLG,UAAWc,EACX4B,KAAK,SACO,aAAAnC,GAAa,SACzBK,GAAIA,gBACSC,GAAc8B,EAAUC,EAAuBC,aAAcjC,GAAG,YAClEkC,EAAgBD,cAE3BtB,EAACwB,cAAAC,EAAmBC,SAAQ,CAACC,MAAO,CAAE5B,UAAAA,IACpCC,EAAAwB,cAAA,MAAA,CAAK/C,UAAWgB,EAAGC,EAAOkC,UACvBpD,EAASkC,KACR,SACEN,EAGAO,GAEA,IAAMkB,EAA6BzB,EAAMC,KAAKyB,kBAC9C,OACE9B,EAAAwB,cAAA,MAAA,CACEO,IAAKpB,EACLlC,UAAWgB,EAAGC,EAAOsC,YAAWC,EAAA,CAAA,EAC7BvC,EAAOwC,gBAAkBL,KAG3BA,EAA6B7B,EAAKwB,cAAA,MAAA,CAAA/C,UAAWgB,EAAGC,EAAOyC,WAAY/B,GAAeA,EAGxF,MAIPJ,EAAAwB,cAAA,MAAA,CAAK/C,UAAWgB,EAAGC,EAAO0C,qBACvBhD,EAAgB,KACfY,EAACwB,cAAAa,EACa,CAAA,cAAA,4BACZC,KAAMC,EACN9D,UAAWgB,EAAGC,EAAO8C,UACrBC,aACA,EAAAC,QAAS7D,EACT8D,KAAK,QACLC,KAAK,WACL1B,MAAOrB,EAAmB,yBAA2B,mBACrDb,UAAWE,KAMvB,IAOoF,CACpF2D,iBAAkBC"}
1	+ {"version":3,"file":"AlertBanner.js","sources":["../../../../src/components/AlertBanner/AlertBanner.tsx"],"sourcesContent":["import { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport cx from \"classnames\";\nimport React, { type ForwardedRef, forwardRef, type ReactElement, useMemo } from \"react\";\nimport { IconButton } from \"@vibe/icon-button\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport { AlertBannerBackgroundColor as AlertBannerBackgroundColorEnum } from \"./AlertBannerConstants\";\nimport { type AlertBannerBackgroundColor } from \"./AlertBanner.types\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { type AlertBannerLinkProps } from \"./AlertBannerLink/AlertBannerLink\";\nimport { type AlertBannerButtonProps } from \"./AlertBannerButton/AlertBannerButton\";\nimport { type AlertBannerTextProps } from \"./AlertBannerText/AlertBannerText\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { type VibeComponentProps, withStaticProps } from \"../../types\";\nimport styles from \"./AlertBanner.module.scss\";\nimport { Text } from \"@vibe/typography\";\nimport { AlertBannerContext } from \"./AlertBannerContext\";\n\ntype ChildrenType = ReactElement<AlertBannerButtonProps \| AlertBannerLinkProps \| AlertBannerTextProps>;\n\nexport interface AlertBannerProps extends VibeComponentProps {\n /*\n The background color of the alert banner.\n /\n backgroundColor?: AlertBannerBackgroundColor;\n /\n If true, the close button is hidden.\n /\n isCloseHidden?: boolean;\n /\n The ARIA label of the alert banner for accessibility.\n /\n ariaLabel?: string;\n /\n The ARIA label of the close button for accessibility.\n /\n closeButtonAriaLabel?: string;\n /\n Callback fired when the close button is clicked.\n /\n onClose?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n /\n The content of the alert banner.\n */\n children?: ChildrenType \| ChildrenType[];\n}\n\nconst AlertBanner = forwardRef(\n (\n {\n children: originalChildren,\n className,\n backgroundColor = \"primary\",\n onClose = NOOP,\n ariaLabel = \"\",\n closeButtonAriaLabel = \"Close\",\n isCloseHidden = false,\n id,\n \"data-testid\": dataTestId\n }: AlertBannerProps,\n ref: ForwardedRef<HTMLDivElement>\n ) => {\n const classNames = useMemo(() => {\n return cx(className, styles.alertBanner, getStyle(styles, backgroundColor));\n }, [className, backgroundColor]);\n\n const isDarkBackground = backgroundColor === \"dark\";\n const isFixedColor = backgroundColor === \"warning\";\n const textColor = useMemo(() => {\n if (isFixedColor) {\n return \"fixedDark\";\n }\n return isDarkBackground ? \"onInverted\" : \"onPrimary\";\n }, [isDarkBackground, isFixedColor]);\n const children = useMemo(() => {\n const allChildren = React.Children.toArray(originalChildren) as ReactElement[];\n const filteredChildren = allChildren.filter(\n (\n child: ReactElement & {\n type: Record<string, unknown>;\n }\n ) => {\n if (child.type.isAlertBannerItem \|\| child.type.displayName === \"MDXCreateElement\") return true;\n console.error(\n \"Alert banner child is not supported. Please use AlertBannerText, AlertBannerLink or AlertBannerButton.\",\n child\n );\n return false;\n }\n );\n\n return filteredChildren.map((child, index) => {\n return React.cloneElement(child, {\n ...child?.props,\n marginLeft: index > 0,\n isDarkBackground\n });\n });\n }, [originalChildren, isDarkBackground]);\n\n return (\n <Text\n type=\"text2\"\n color={textColor}\n ref={ref}\n className={classNames}\n role=\"banner\"\n aria-label={ariaLabel \|\| \"banner\"}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.ALERT_BANNER, id)}\n data-vibe={ComponentVibeId.ALERT_BANNER}\n >\n <AlertBannerContext.Provider value={{ textColor }}>\n <div className={cx(styles.content)}>\n {children.map(\n (\n child: ReactElement & {\n type: Record<string, unknown>;\n },\n index\n ) => {\n const childTypeIsAlertBannerText = child.type.isAlertBannerText;\n return (\n <div\n key={index}\n className={cx(styles.contentItem, {\n [styles.contentItemText]: childTypeIsAlertBannerText\n })}\n >\n {childTypeIsAlertBannerText ? <div className={cx(styles.ellipsis)}>{child}</div> : child}\n </div>\n );\n }\n )}\n </div>\n </AlertBannerContext.Provider>\n <div className={cx(styles.closeButtonWrapper)}>\n {isCloseHidden ? null : (\n <IconButton\n data-testid=\"alert-banner-close-button\"\n icon={CloseSmall}\n className={cx(styles.closeBtn)}\n hideTooltip\n onClick={onClose}\n size=\"small\"\n kind=\"tertiary\"\n color={isDarkBackground ? \"on-inverted-background\" : \"on-primary-color\"}\n ariaLabel={closeButtonAriaLabel}\n />\n )}\n </div>\n </Text>\n );\n }\n);\n\ninterface AlertBannerStaticProps {\n backgroundColors: typeof AlertBannerBackgroundColorEnum;\n}\n\nexport default withStaticProps<AlertBannerProps, AlertBannerStaticProps>(AlertBanner, {\n backgroundColors: AlertBannerBackgroundColorEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","originalChildren","children","className","_ref$backgroundColor","backgroundColor","_ref$onClose","onClose","NOOP","_ref$ariaLabel","ariaLabel","_ref$closeButtonAriaL","closeButtonAriaLabel","_ref$isCloseHidden","isCloseHidden","id","dataTestId","classNames","useMemo","cx","styles","alertBanner","getStyle","isDarkBackground","isFixedColor","textColor","React","Children","toArray","filter","child","type","isAlertBannerItem","displayName","console","error","map","index","cloneElement","Object","assign","props","marginLeft","Text","color","role","getTestId","ComponentDefaultTestId","ALERT_BANNER","ComponentVibeId","createElement","AlertBannerContext","Provider","value","content","childTypeIsAlertBannerText","isAlertBannerText","key","contentItem","_defineProperty","contentItemText","ellipsis","closeButtonWrapper","IconButton","icon","CloseSmall","closeBtn","hideTooltip","onClick","size","kind","backgroundColors","AlertBannerBackgroundColorEnum"],"mappings":"83BA+CA,IAiHeA,EAAAA,EAjHKC,GAClB,SAAAC,EAYEC,GACE,IAXUC,EAAgBF,EAA1BG,SACAC,EAASJ,EAATI,UAASC,EAAAL,EACTM,gBAAAA,OAAkB,IAAHD,EAAG,UAASA,EAAAE,EAAAP,EAC3BQ,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAV,EACdW,UAAAA,OAAY,IAAHD,EAAG,GAAEA,EAAAE,EAAAZ,EACda,qBAAAA,OAAuB,IAAHD,EAAG,QAAOA,EAAAE,EAAAd,EAC9Be,cAAAA,OAAgB,IAAHD,GAAQA,EACrBE,EAAEhB,EAAFgB,GACeC,EAAUjB,EAAzB,eAIIkB,EAAaC,GAAQ,WACzB,OAAOC,EAAGhB,EAAWiB,EAAOC,YAAaC,EAASF,EAAQf,GAC5D,GAAG,CAACF,EAAWE,IAETkB,EAAuC,SAApBlB,EACnBmB,EAAmC,YAApBnB,EACfoB,EAAYP,GAAQ,WACxB,OAAIM,EACK,YAEFD,EAAmB,aAAe,WAC3C,GAAG,CAACA,EAAkBC,IAChBtB,EAAWgB,GAAQ,WAiBvB,OAhBoBQ,EAAMC,SAASC,QAAQ3B,GACN4B,QACnC,SACEC,GAIA,SAAIA,EAAMC,KAAKC,mBAAgD,qBAA3BF,EAAMC,KAAKE,eAC/CC,QAAQC,MACN,yGACAL,IAEK,EACT,IAGsBM,KAAI,SAACN,EAAOO,GAClC,OAAOX,EAAMY,aAAaR,EACrBS,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAAV,aAAA,EAAAA,EAAOW,OAAK,CACfC,WAAYL,EAAQ,EACpBd,iBAAAA,IAEJ,GACF,GAAG,CAACtB,EAAkBsB,IAEtB,OACEG,gBAACiB,EAAI,CACHZ,KAAK,QACLa,MAAOnB,EACPzB,IAAKA,EACLG,UAAWc,EACX4B,KAAK,SACO,aAAAnC,GAAa,SACzBK,GAAIA,gBACSC,GAAc8B,EAAUC,EAAuBC,aAAcjC,GAAG,YAClEkC,EAAgBD,cAE3BtB,EAACwB,cAAAC,EAAmBC,SAAQ,CAACC,MAAO,CAAE5B,UAAAA,IACpCC,EAAAwB,cAAA,MAAA,CAAK/C,UAAWgB,EAAGC,EAAOkC,UACvBpD,EAASkC,KACR,SACEN,EAGAO,GAEA,IAAMkB,EAA6BzB,EAAMC,KAAKyB,kBAC9C,OACE9B,EAAAwB,cAAA,MAAA,CACEO,IAAKpB,EACLlC,UAAWgB,EAAGC,EAAOsC,YAAWC,EAAA,CAAA,EAC7BvC,EAAOwC,gBAAkBL,KAG3BA,EAA6B7B,EAAKwB,cAAA,MAAA,CAAA/C,UAAWgB,EAAGC,EAAOyC,WAAY/B,GAAeA,EAGxF,MAIPJ,EAAAwB,cAAA,MAAA,CAAK/C,UAAWgB,EAAGC,EAAO0C,qBACvBhD,EAAgB,KACfY,EAACwB,cAAAa,EACa,CAAA,cAAA,4BACZC,KAAMC,EACN9D,UAAWgB,EAAGC,EAAO8C,UACrBC,aACA,EAAAC,QAAS7D,EACT8D,KAAK,QACLC,KAAK,WACL1B,MAAOrB,EAAmB,yBAA2B,mBACrDb,UAAWE,KAMvB,IAOoF,CACpF2D,iBAAkBC"}

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

@@ -1,2 +1,2 @@
-var n={alertBanner:"alertBanner_62f0edf27d",primary:"primary_3801ae88d0",positive:"positive_f25b3f4ab4",negative:"negative_1a9ca1f15d",dark:"dark_a4e7b65720",warning:"warning_0c3403b034",closeBtn:"closeBtn_3199915fd3",content:"content_bda6a2cc9a",closeButtonWrapper:"closeButtonWrapper_8164ab9c4a",ellipsis:"ellipsis_862aa3e3a5",contentItem:"contentItem_d4d15a363e",contentItemText:"contentItemText_ba3430d026"};!function(n){const e="s_id-2b16d36a7fd0_3_82_2";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const a=document.createElement("style");a.id=e,t.firstChild?t.insertBefore(a,t.firstChild):t.appendChild(a),a.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".alertBanner_62f0edf27d {\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n}\n\n.primary_3801ae88d0 {\n  background-color: var(--primary-color);\n}\n\n.positive_f25b3f4ab4 {\n  background-color: var(--positive-color);\n}\n\n.negative_1a9ca1f15d {\n  background-color: var(--negative-color);\n}\n\n.dark_a4e7b65720 {\n  background-color: var(--inverted-color-background);\n}\n\n.warning_0c3403b034 {\n  background-color: var(--warning-color);\n  color: var(--fixed-dark-color);\n}\n\n.warning_0c3403b034 .closeBtn_3199915fd3 {\n  color: var(--fixed-dark-color);\n}\n\n.content_bda6a2cc9a {\n  flex: 1 1 auto;\n  display: flex;\n  height: 100%;\n  min-width: 0;\n  align-items: center;\n  justify-content: center;\n  padding-left: var(--spacing-medium);\n}\n\n.closeButtonWrapper_8164ab9c4a {\n  flex: 0 0 40px;\n  position: relative;\n  height: 100%;\n  min-width: 0;\n}\n\n.closeBtn_3199915fd3 {\n  position: absolute;\n  right: 4px;\n  top: 4px;\n}\n\n.ellipsis_862aa3e3a5 {\n  flex: 0 1 auto;\n}\n\n.contentItem_d4d15a363e {\n  flex: 0 0 auto;\n  min-width: 0;\n}\n\n.contentItemText_ba3430d026 {\n  flex: 0 1 auto;\n  min-width: 0;\n}");export{n as default};
+var n={alertBanner:"alertBanner_d9eb9e1393",primary:"primary_d1b82bb03f",positive:"positive_4a60e994b3",negative:"negative_0cc447c47d",dark:"dark_0d2370361c",warning:"warning_eba5ce8b4d",closeBtn:"closeBtn_b6a6c8492a",content:"content_2e0a0ed855",closeButtonWrapper:"closeButtonWrapper_2fa70f72e2",ellipsis:"ellipsis_990eeba4b7",contentItem:"contentItem_f3c4836b1e",contentItemText:"contentItemText_ccb63bbe62"};!function(n){const e="s_id-2b16d36a7fd0_3_83_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const o=document.createElement("style");o.id=e,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".alertBanner_d9eb9e1393 {\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n}\n\n.primary_d1b82bb03f {\n  background-color: var(--primary-color);\n}\n\n.positive_4a60e994b3 {\n  background-color: var(--positive-color);\n}\n\n.negative_0cc447c47d {\n  background-color: var(--negative-color);\n}\n\n.dark_0d2370361c {\n  background-color: var(--inverted-color-background);\n}\n\n.warning_eba5ce8b4d {\n  background-color: var(--warning-color);\n  color: var(--fixed-dark-color);\n}\n\n.warning_eba5ce8b4d .closeBtn_b6a6c8492a {\n  color: var(--fixed-dark-color);\n}\n\n.content_2e0a0ed855 {\n  flex: 1 1 auto;\n  display: flex;\n  height: 100%;\n  min-width: 0;\n  align-items: center;\n  justify-content: center;\n  padding-left: var(--spacing-medium);\n}\n\n.closeButtonWrapper_2fa70f72e2 {\n  flex: 0 0 40px;\n  position: relative;\n  height: 100%;\n  min-width: 0;\n}\n\n.closeBtn_b6a6c8492a {\n  position: absolute;\n  right: 4px;\n  top: 4px;\n}\n\n.ellipsis_990eeba4b7 {\n  flex: 0 1 auto;\n}\n\n.contentItem_f3c4836b1e {\n  flex: 0 0 auto;\n  min-width: 0;\n}\n\n.contentItemText_ccb63bbe62 {\n  flex: 0 1 auto;\n  min-width: 0;\n}");export{n as default};
 //# sourceMappingURL=AlertBanner.module.scss.js.map

package/dist/src/components/AlertBanner/AlertBannerButton/AlertBannerButton.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var n={bannerButton:"bannerButton_317f3d7299",darkBackground:"darkBackground_317f3d7299",marginLeft:"marginLeft_8d798c5b0a"};!function(n){const e="s_id-b41ba610a75a_3_82_2";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const a=document.createElement("style");a.id=e,t.firstChild?t.insertBefore(a,t.firstChild):t.appendChild(a),a.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".bannerButton_317f3d7299 {\n  -webkit-font-smoothing: auto;\n  -moz-osx-font-smoothing: auto;\n}\n\n.dark-app-theme .darkBackground_317f3d7299 .bannerButton_317f3d7299 {\n  background-color: var(--dark-background-color);\n}\n\n.marginLeft_8d798c5b0a {\n  margin-left: var(--spacing-small);\n}");export{n as default};
+var e={bannerButton:"bannerButton_2e74462a51",darkBackground:"darkBackground_2e74462a51",marginLeft:"marginLeft_6cc7f49b7e"};!function(e){const n="s_id-b41ba610a75a_3_83_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,t.firstChild?t.insertBefore(a,t.firstChild):t.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".bannerButton_2e74462a51 {\n  -webkit-font-smoothing: auto;\n  -moz-osx-font-smoothing: auto;\n}\n\n.dark-app-theme .darkBackground_2e74462a51 .bannerButton_2e74462a51 {\n  background-color: var(--dark-background-color);\n}\n\n.marginLeft_6cc7f49b7e {\n  margin-left: var(--spacing-small);\n}");export{e as default};
 //# sourceMappingURL=AlertBannerButton.module.scss.js.map

package/dist/src/components/AlertBanner/AlertBannerContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AlertBannerContext.js","sources":["../../../../src/components/AlertBanner/AlertBannerContext.ts"],"sourcesContent":["import React from \"react\";\nimport { type TypographyColor } from \"~~../Typography~~/~~Typography.types~~\";\n\ntype AlertBannerContextType = {\n textColor: Extract<TypographyColor, \"onPrimary\" \| \"onInverted\" \| \"fixedDark\">;\n};\n\nexport const AlertBannerContext = React.createContext<AlertBannerContextType>({\n textColor: \"onPrimary\"\n});\n"],"names":["AlertBannerContext","React","createContext","textColor"],"mappings":"yBAOaA,EAAqBC,EAAMC,cAAsC,CAC5EC,UAAW"}
1	+ {"version":3,"file":"AlertBannerContext.js","sources":["../../../../src/components/AlertBanner/AlertBannerContext.ts"],"sourcesContent":["import React from \"react\";\nimport { type TypographyColor } from \"@vibe/typography\";\n\ntype AlertBannerContextType = {\n textColor: Extract<TypographyColor, \"onPrimary\" \| \"onInverted\" \| \"fixedDark\">;\n};\n\nexport const AlertBannerContext = React.createContext<AlertBannerContextType>({\n textColor: \"onPrimary\"\n});\n"],"names":["AlertBannerContext","React","createContext","textColor"],"mappings":"yBAOaA,EAAqBC,EAAMC,cAAsC,CAC5EC,UAAW"}

package/dist/src/components/AlertBanner/AlertBannerLink/AlertBannerLink.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var n={bannerLink:"bannerLink_348cfe1f10",bannerLinkTextColorOnPrimary:"bannerLinkTextColorOnPrimary_dce46c41ba",bannerLinkTextColorOnInverted:"bannerLinkTextColorOnInverted_a8b9fcf800",marginLeft:"marginLeft_8d798c5b0a"};!function(n){const e="s_id-59c5b2cdc5e5_3_82_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)}(".bannerLink_348cfe1f10 {\n  text-decoration: underline;\n  -webkit-font-smoothing: auto;\n  -moz-osx-font-smoothing: auto;\n}\n\n.bannerLinkTextColorOnPrimary_dce46c41ba {\n  color: var(--text-color-on-primary);\n}\n\n.bannerLinkTextColorOnInverted_a8b9fcf800 {\n  color: var(--text-color-on-inverted);\n}\n\n.marginLeft_8d798c5b0a {\n  margin-left: var(--spacing-small);\n}");export{n as default};
+var n={bannerLink:"bannerLink_73f3373635",bannerLinkTextColorOnPrimary:"bannerLinkTextColorOnPrimary_416e68de0d",bannerLinkTextColorOnInverted:"bannerLinkTextColorOnInverted_abc5cff04c",marginLeft:"marginLeft_6cc7f49b7e"};!function(n){const e="s_id-59c5b2cdc5e5_3_83_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const r=document.createElement("style");r.id=e,t.firstChild?t.insertBefore(r,t.firstChild):t.appendChild(r),r.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".bannerLink_73f3373635 {\n  text-decoration: underline;\n  -webkit-font-smoothing: auto;\n  -moz-osx-font-smoothing: auto;\n}\n\n.bannerLinkTextColorOnPrimary_416e68de0d {\n  color: var(--text-color-on-primary);\n}\n\n.bannerLinkTextColorOnInverted_abc5cff04c {\n  color: var(--text-color-on-inverted);\n}\n\n.marginLeft_6cc7f49b7e {\n  margin-left: var(--spacing-small);\n}");export{n as default};
 //# sourceMappingURL=AlertBannerLink.module.scss.js.map

package/dist/src/components/AlertBanner/AlertBannerText/AlertBannerText.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{defineProperty as e}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import{getTestId as t,ComponentDefaultTestId as r}from"../../../tests/testIds.js";import o from"classnames";import s,{useRef as i}from"react";import a from"../../Tooltip/Tooltip.js";import n from"../../../hooks/useIsOverflowing/useIsOverflowing.js";import m from"./AlertBannerText.module.scss.js";var l=function(l){var f=l.text,p=l.marginLeft,d=void 0!==p&&p,u=l.id,c=l["data-testid"],g=l.ariaLive,v=i(null),T=o(m.bannerText,e({},m.marginLeft,d)),j=n({ref:v});return s.createElement(a,{position:"bottom",content:j&&f,showTrigger:["mouseenter"],hideTrigger:["mouseleave"]},s.createElement("div",{ref:v,className:T,id:u,"data-testid":c||t(r.ALERT_BANNER_TEXT,u)},s.createElement("span",{"aria-live":g},f)))};Object.assign(l,{isAlertBannerItem:!0,isAlertBannerText:!0});export{l as default};
+import{defineProperty as e}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import{getTestId as t,ComponentDefaultTestId as r}from"../../../tests/testIds.js";import o from"classnames";import i,{useRef as s}from"react";import a from"./AlertBannerText.module.scss.js";import n from"../../../../hooks/dist/useIsOverflowing/index.js";import m from"../../../../components/tooltip/dist/Tooltip/Tooltip.js";var l=function(l){var p=l.text,d=l.marginLeft,f=void 0!==d&&d,c=l.id,u=l["data-testid"],T=l.ariaLive,g=s(null),v=o(a.bannerText,e({},a.marginLeft,f)),j=n({ref:g});return i.createElement(m,{position:"bottom",content:j&&p,showTrigger:["mouseenter"],hideTrigger:["mouseleave"]},i.createElement("div",{ref:g,className:v,id:c,"data-testid":u||t(r.ALERT_BANNER_TEXT,c)},i.createElement("span",{"aria-live":T},p)))};Object.assign(l,{isAlertBannerItem:!0,isAlertBannerText:!0});export{l as default};
 //# sourceMappingURL=AlertBannerText.js.map

package/dist/src/components/AlertBanner/AlertBannerText/AlertBannerText.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AlertBannerText.js","sources":["../../../../../src/components/AlertBanner/AlertBannerText/AlertBannerText.tsx"],"sourcesContent":["import { ComponentDefaultTestId, getTestId } from \"../../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { type FC, useRef } from \"react\";\nimport Tooltip from \"~~../../Tooltip~~/~~Tooltip~~\";\nimport useIsOverflowing from \"~~../../../~~hooks~~/useIsOverflowing/useIsOverflowing~~\";\nimport type VibeComponentProps from \"../../../types/VibeComponentProps\";\n\nimport styles from \"./AlertBannerText.module.scss\";\n\nexport interface AlertBannerTextProps extends VibeComponentProps {\n /*\n The text content displayed within the alert banner.\n /\n text: string;\n /\n If true, a left margin is applied to the alert banner text.\n /\n marginLeft?: boolean;\n /\n The aria-live attribute value for the alert banner text.\n */\n ariaLive?: \"polite\" \| \"assertive\" \| \"off\";\n}\n\nconst AlertBannerText: FC<AlertBannerTextProps> = ({\n text,\n marginLeft = false,\n id,\n \"data-testid\": dataTestId,\n ariaLive\n}) => {\n const componentRef = useRef(null);\n const classNames = cx(styles.bannerText, {\n [styles.marginLeft]: marginLeft\n });\n const isOverflowing = useIsOverflowing({ ref: componentRef });\n\n return (\n <Tooltip\n position=\"bottom\"\n content={isOverflowing && text}\n showTrigger={[\"mouseenter\"]}\n hideTrigger={[\"mouseleave\"]}\n >\n <div\n ref={componentRef}\n className={classNames}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.ALERT_BANNER_TEXT, id)}\n >\n <span aria-live={ariaLive}>{text}</span>\n </div>\n </Tooltip>\n );\n};\n\nObject.assign(AlertBannerText, {\n isAlertBannerItem: true,\n isAlertBannerText: true\n});\n\nexport default AlertBannerText;\n"],"names":["AlertBannerText","_ref","text","_ref$marginLeft","marginLeft","id","dataTestId","ariaLive","componentRef","useRef","classNames","cx","styles","bannerText","_defineProperty","isOverflowing","useIsOverflowing","ref","React","createElement","Tooltip","position","content","showTrigger","hideTrigger","className","getTestId","ComponentDefaultTestId","ALERT_BANNER_TEXT","Object","assign","isAlertBannerItem","isAlertBannerText"],"mappings":"~~4XAwBA~~,IAAMA,EAA4C,SAA7BC,GAMhB,IALHC,EAAID,EAAJC,KAAIC,EAAAF,EACJG,WAAAA,OAAa,IAAHD,GAAQA,EAClBE,EAAEJ,EAAFI,GACeC,EAAUL,EAAzB,eACAM,EAAQN,EAARM,SAEMC,EAAeC,EAAO,MACtBC,EAAaC,EAAGC,EAAOC,WAAUC,EAAA,CAAA,EACpCF,EAAOR,WAAaA,IAEjBW,EAAgBC,EAAiB,CAAEC,IAAKT,IAE9C,OACEU,EAACC,cAAAC,EACC,CAAAC,SAAS,SACTC,QAASP,GAAiBb,EAC1BqB,YAAa,CAAC,cACdC,YAAa,CAAC,eAEdN,EACEC,cAAA,MAAA,CAAAF,IAAKT,EACLiB,UAAWf,EACXL,GAAIA,EACS,cAAAC,GAAcoB,EAAUC,EAAuBC,kBAAmBvB,IAE/Ea,EAAAC,cAAA,OAAA,CAAA,YAAiBZ,GAAWL,IAIpC,EAEA2B,OAAOC,OAAO9B,EAAiB,CAC7B+B,mBAAmB,EACnBC,mBAAmB"}
1	+ {"version":3,"file":"AlertBannerText.js","sources":["../../../../../src/components/AlertBanner/AlertBannerText/AlertBannerText.tsx"],"sourcesContent":["import { ComponentDefaultTestId, getTestId } from \"../../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { type FC, useRef } from \"react\";\nimport { Tooltip } from \"@vibe/tooltip\";\nimport { useIsOverflowing } from \"@vibe/hooks\";\nimport type VibeComponentProps from \"../../../types/VibeComponentProps\";\n\nimport styles from \"./AlertBannerText.module.scss\";\n\nexport interface AlertBannerTextProps extends VibeComponentProps {\n /*\n The text content displayed within the alert banner.\n /\n text: string;\n /\n If true, a left margin is applied to the alert banner text.\n /\n marginLeft?: boolean;\n /\n The aria-live attribute value for the alert banner text.\n */\n ariaLive?: \"polite\" \| \"assertive\" \| \"off\";\n}\n\nconst AlertBannerText: FC<AlertBannerTextProps> = ({\n text,\n marginLeft = false,\n id,\n \"data-testid\": dataTestId,\n ariaLive\n}) => {\n const componentRef = useRef(null);\n const classNames = cx(styles.bannerText, {\n [styles.marginLeft]: marginLeft\n });\n const isOverflowing = useIsOverflowing({ ref: componentRef });\n\n return (\n <Tooltip\n position=\"bottom\"\n content={isOverflowing && text}\n showTrigger={[\"mouseenter\"]}\n hideTrigger={[\"mouseleave\"]}\n >\n <div\n ref={componentRef}\n className={classNames}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.ALERT_BANNER_TEXT, id)}\n >\n <span aria-live={ariaLive}>{text}</span>\n </div>\n </Tooltip>\n );\n};\n\nObject.assign(AlertBannerText, {\n isAlertBannerItem: true,\n isAlertBannerText: true\n});\n\nexport default AlertBannerText;\n"],"names":["AlertBannerText","_ref","text","_ref$marginLeft","marginLeft","id","dataTestId","ariaLive","componentRef","useRef","classNames","cx","styles","bannerText","_defineProperty","isOverflowing","useIsOverflowing","ref","React","createElement","Tooltip","position","content","showTrigger","hideTrigger","className","getTestId","ComponentDefaultTestId","ALERT_BANNER_TEXT","Object","assign","isAlertBannerItem","isAlertBannerText"],"mappings":"uZAwBA,IAAMA,EAA4C,SAA7BC,GAMhB,IALHC,EAAID,EAAJC,KAAIC,EAAAF,EACJG,WAAAA,OAAa,IAAHD,GAAQA,EAClBE,EAAEJ,EAAFI,GACeC,EAAUL,EAAzB,eACAM,EAAQN,EAARM,SAEMC,EAAeC,EAAO,MACtBC,EAAaC,EAAGC,EAAOC,WAAUC,EAAA,CAAA,EACpCF,EAAOR,WAAaA,IAEjBW,EAAgBC,EAAiB,CAAEC,IAAKT,IAE9C,OACEU,EAACC,cAAAC,EACC,CAAAC,SAAS,SACTC,QAASP,GAAiBb,EAC1BqB,YAAa,CAAC,cACdC,YAAa,CAAC,eAEdN,EACEC,cAAA,MAAA,CAAAF,IAAKT,EACLiB,UAAWf,EACXL,GAAIA,EACS,cAAAC,GAAcoB,EAAUC,EAAuBC,kBAAmBvB,IAE/Ea,EAAAC,cAAA,OAAA,CAAA,YAAiBZ,GAAWL,IAIpC,EAEA2B,OAAOC,OAAO9B,EAAiB,CAC7B+B,mBAAmB,EACnBC,mBAAmB"}

package/dist/src/components/AlertBanner/AlertBannerText/AlertBannerText.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={bannerText:"bannerText_59016c7d4e",marginLeft:"marginLeft_8d798c5b0a"};!function(e){const n="s_id-35d8b4a93255_3_82_2";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,t.firstChild?t.insertBefore(a,t.firstChild):t.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".bannerText_59016c7d4e {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.marginLeft_8d798c5b0a {\n  margin-left: var(--spacing-small);\n}");export{e as default};
+var e={bannerText:"bannerText_4cd99abdfb",marginLeft:"marginLeft_6cc7f49b7e"};!function(e){const n="s_id-35d8b4a93255_3_83_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,t.firstChild?t.insertBefore(a,t.firstChild):t.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".bannerText_4cd99abdfb {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.marginLeft_6cc7f49b7e {\n  margin-left: var(--spacing-small);\n}");export{e as default};
 //# sourceMappingURL=AlertBannerText.module.scss.js.map

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

@@ -1,2 +1,2 @@
-import{defineProperty as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import e from"classnames";import o,{useMemo as i}from"react";import{camelCase as s}from"es-toolkit";import{getStyle as r}from"../../helpers/typesciptCssModulesHelper.js";import{getTestId as a,ComponentDefaultTestId as n}from"../../tests/testIds.js";import c from"../IconButton/IconButton.js";import{AttentionBoxType as m,IconTypeEnum as l}from"./AttentionBoxConstants.js";import{withStaticPropsWithoutForwardRef as p}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import d from"../Text/Text.js";import f from"./AttentionBox.module.scss.js";import{ComponentVibeId as u}from"../../tests/constants.js";import y from"../../../icons/dist/react/Info.js";import j from"../../../icons/dist/react/Alert.js";import v from"../../../components/layout/dist/Flex/Flex.js";import x from"../../../components/icon/dist/Icon/Icon.js";import I from"../../../icons/dist/react/CloseSmall.js";var T=p((function(m){var l=m.className,p=m.withIconWithoutHeader,T=void 0!==p&&p,N=m.type,g=void 0===N?"primary":N,h=m.icon,E=m.iconType,B=void 0===E?"svg":E,C=m.title,A=m.text,S=m.children,b=m.withoutIcon,w=void 0!==b&&b,H=m.onClose,F=m.compact,O=void 0!==F&&F,_=m.id,z=m["data-testid"],P=m.closeButtonAriaLabel,k=void 0===P?"Close":P,L=m.entryAnimation,W=void 0!==L&&L,X=i((function(){return"primary"===g?y:j}),[g]),M=void 0===h?X:h;return o.createElement("aside",{className:e(f.attentionBox,r(f,s("type-".concat(g))),l,t({},f.entryAnimation,W)),role:"alert","data-testid":z||a(n.ATTENTION_BOX,_),"data-vibe":u.ATTENTION_BOX},C&&o.createElement(v,{justify:"start",align:"center",className:f.titleContainer,gap:"xs"},!w&&o.createElement(x,{className:f.icon,iconType:B,ariaHidden:!0,icon:M,ignoreFocusStyle:!0,iconSize:"20"}),o.createElement(d,{type:"text1",element:"h5",weight:"medium",className:f.title},C)),o.createElement(v,{justify:"start",align:"center",gap:"xs"},!C&&O&&!w&&T&&o.createElement(x,{iconType:B,iconSize:18,ariaHidden:!0,icon:M,ignoreFocusStyle:!0}),o.createElement(d,{type:"text2",element:O?void 0:"p",className:e(f.text,t(t(t({},f.compact,O),f.dismissible,!!H),f.paragraph,!O))},A||S)),H&&o.createElement(c,{size:"small",color:"on-primary-color",className:f.closeIcon,wrapperClassName:e(f.closeIconWrapper,t({},f.closeIconCompact,O)),ariaLabel:k,hideTooltip:!0,icon:I,onClick:H}))}),{types:m,iconTypes:l});export{T as default};
+import{defineProperty as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import e from"classnames";import o,{useMemo as i}from"react";import{camelCase as s}from"es-toolkit";import{getStyle as r}from"../../helpers/typesciptCssModulesHelper.js";import{getTestId as n,ComponentDefaultTestId as a}from"../../tests/testIds.js";import{AttentionBoxType as c,IconTypeEnum as m}from"./AttentionBoxConstants.js";import{withStaticPropsWithoutForwardRef as l}from"../../types/withStaticProps.js";import"../../utils/colors-vars-map.js";import p from"./AttentionBox.module.scss.js";import{ComponentVibeId as d}from"../../tests/constants.js";import f from"../../../icons/dist/react/Info.js";import y from"../../../icons/dist/react/Alert.js";import u from"../../../components/layout/dist/Flex/Flex.js";import j from"../../../components/icon/dist/Icon/Icon.js";import v from"../../../components/typography/dist/Text/Text.js";import x from"../../../components/icon-button/dist/IconButton/IconButton.js";import I from"../../../icons/dist/react/CloseSmall.js";var T=l((function(c){var m=c.className,l=c.withIconWithoutHeader,T=void 0!==l&&l,N=c.type,g=void 0===N?"primary":N,h=c.icon,E=c.iconType,B=void 0===E?"svg":E,C=c.title,A=c.text,b=c.children,S=c.withoutIcon,w=void 0!==S&&S,H=c.onClose,F=c.compact,O=void 0!==F&&F,_=c.id,z=c["data-testid"],P=c.closeButtonAriaLabel,k=void 0===P?"Close":P,L=c.entryAnimation,W=void 0!==L&&L,X=i((function(){return"primary"===g?f:y}),[g]),M=void 0===h?X:h;return o.createElement("aside",{className:e(p.attentionBox,r(p,s("type-".concat(g))),m,t({},p.entryAnimation,W)),role:"alert","data-testid":z||n(a.ATTENTION_BOX,_),"data-vibe":d.ATTENTION_BOX},C&&o.createElement(u,{justify:"start",align:"center",className:p.titleContainer,gap:"xs"},!w&&o.createElement(j,{className:p.icon,iconType:B,ariaHidden:!0,icon:M,ignoreFocusStyle:!0,iconSize:"20"}),o.createElement(v,{type:"text1",element:"h5",weight:"medium",className:p.title},C)),o.createElement(u,{justify:"start",align:"center",gap:"xs"},!C&&O&&!w&&T&&o.createElement(j,{iconType:B,iconSize:18,ariaHidden:!0,icon:M,ignoreFocusStyle:!0}),o.createElement(v,{type:"text2",element:O?void 0:"p",className:e(p.text,t(t(t({},p.compact,O),p.dismissible,!!H),p.paragraph,!O))},A||b)),H&&o.createElement(x,{size:"small",color:"on-primary-color",className:p.closeIcon,wrapperClassName:e(p.closeIconWrapper,t({},p.closeIconCompact,O)),ariaLabel:k,hideTooltip:!0,icon:I,onClick:H}))}),{types:c,iconTypes:m});export{T as default};
 //# sourceMappingURL=AttentionBox.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"AttentionBox.js","sources":["../../../../src/components/AttentionBox/AttentionBox.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { useMemo } from \"react\";\nimport { camelCase } from \"es-toolkit\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { Icon, type SubIcon } from \"@vibe/icon\";\nimport IconButton from \"~~../IconButton~~/~~IconButton~~\";\nimport { CloseSmall, Alert as AlertIcon, Info as InfoIcon } from \"@vibe/icons\";\nimport { AttentionBoxType as AttentionBoxTypeEnum, IconTypeEnum } from \"./AttentionBoxConstants\";\nimport { type AttentionBoxType } from \"./AttentionBox.types\";\nimport { type VibeComponentProps, type ElementContent, withStaticPropsWithoutForwardRef } from \"../../types\";\nimport Text from \"~~../Text~~/~~Text~~\";\nimport { Flex } from \"@vibe/layout\";\nimport styles from \"./AttentionBox.module.scss\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\n/*\n @deprecated AttentionBox is deprecated. Please use AttentionBox from \"@vibe/core/next\" instead.\n /\nexport interface AttentionBoxProps extends VibeComponentProps {\n // TODO: [breaking] remove prop\n /\n If true, displays an icon even when no header is provided.\n /\n withIconWithoutHeader?: boolean;\n /\n The type of the AttentionBox.\n /\n type?: AttentionBoxType;\n /\n The icon displayed next to the title or text.\n /\n icon?: SubIcon;\n /\n The type of the icon.\n /\n iconType?: \"svg\" \| \"font\";\n /\n The title of the component.\n /\n title?: string;\n /\n The text content displayed inside.\n /\n text?: string;\n /\n The content of the component.\n /\n children?: ElementContent;\n // TODO: [breaking] remove prop\n /\n If true, the icon is not displayed.\n /\n withoutIcon?: boolean;\n /\n Callback fired when the close button is clicked.\n /\n onClose?: (event: React.MouseEvent) => void;\n /\n If true, renders in compact mode.\n /\n compact?: boolean;\n /\n The label of the close button.\n /\n closeButtonAriaLabel?: string;\n /\n If true, an entry animation is applied when the component appears.\n /\n entryAnimation?: boolean;\n}\n\n/\n @deprecated AttentionBox is deprecated. Please use AttentionBox from \"@vibe/core/next\" instead.\n */\nconst AttentionBox = ({\n className,\n withIconWithoutHeader = false,\n type = \"primary\",\n icon,\n iconType = \"svg\",\n title,\n text,\n children,\n withoutIcon = false,\n onClose,\n compact = false,\n id,\n \"data-testid\": dataTestId,\n closeButtonAriaLabel = \"Close\",\n entryAnimation = false\n}: AttentionBoxProps) => {\n const defaultIcon = useMemo(() => {\n return type === \"primary\" ? InfoIcon : AlertIcon;\n }, [type]);\n\n const overrideIcon = icon === undefined ? defaultIcon : icon;\n\n return (\n <aside\n className={cx(styles.attentionBox, getStyle(styles, camelCase(`type-${type}`)), className, {\n [styles.entryAnimation]: entryAnimation\n })}\n role=\"alert\"\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.ATTENTION_BOX, id)}\n data-vibe={ComponentVibeId.ATTENTION_BOX}\n >\n {title && (\n <Flex justify=\"start\" align=\"center\" className={styles.titleContainer} gap=\"xs\">\n {!withoutIcon && (\n <Icon\n className={styles.icon}\n iconType={iconType}\n ariaHidden\n icon={overrideIcon}\n ignoreFocusStyle\n iconSize=\"20\"\n />\n )}\n <Text type=\"text1\" element=\"h5\" weight=\"medium\" className={styles.title}>\n {title}\n </Text>\n </Flex>\n )}\n <Flex justify=\"start\" align=\"center\" gap=\"xs\">\n {!title && compact && !withoutIcon && withIconWithoutHeader && (\n <Icon iconType={iconType} iconSize={18} ariaHidden icon={overrideIcon} ignoreFocusStyle />\n )}\n <Text\n type=\"text2\"\n element={compact ? undefined : \"p\"}\n className={cx(styles.text, {\n [styles.compact]: compact,\n [styles.dismissible]: !!onClose,\n [styles.paragraph]: !compact\n })}\n >\n {text \|\| children}\n </Text>\n </Flex>\n {onClose && (\n <IconButton\n size=\"small\"\n color=\"on-primary-color\"\n className={styles.closeIcon}\n wrapperClassName={cx(styles.closeIconWrapper, {\n [styles.closeIconCompact]: compact\n })}\n ariaLabel={closeButtonAriaLabel}\n hideTooltip\n icon={CloseSmall}\n onClick={onClose}\n />\n )}\n </aside>\n );\n};\n\ninterface AttentionBoxStaticProps {\n types: typeof AttentionBoxTypeEnum;\n iconTypes: typeof IconTypeEnum;\n}\n\nexport default withStaticPropsWithoutForwardRef<AttentionBoxProps, AttentionBoxStaticProps>(AttentionBox, {\n types: AttentionBoxTypeEnum,\n iconTypes: IconTypeEnum\n});\n"],"names":["withStaticPropsWithoutForwardRef","_ref","className","_ref$withIconWithoutH","withIconWithoutHeader","_ref$type","type","icon","_ref$iconType","iconType","title","text","children","_ref$withoutIcon","withoutIcon","onClose","_ref$compact","compact","id","dataTestId","_ref$closeButtonAriaL","closeButtonAriaLabel","_ref$entryAnimation","entryAnimation","defaultIcon","useMemo","InfoIcon","AlertIcon","overrideIcon","undefined","React","cx","styles","attentionBox","getStyle","camelCase","concat","_defineProperty","role","getTestId","ComponentDefaultTestId","ATTENTION_BOX","ComponentVibeId","createElement","Flex","justify","align","titleContainer","gap","Icon","ariaHidden","ignoreFocusStyle","iconSize","Text","element","weight","dismissible","paragraph","IconButton","size","color","closeIcon","wrapperClassName","closeIconWrapper","closeIconCompact","ariaLabel","hideTooltip","CloseSmall","onClick","types","AttentionBoxTypeEnum","iconTypes","IconTypeEnum"],"mappings":"~~o9BA2EA~~,IAwFeA,EAAAA,GAxFM,SAAHC,GAgBM,IAftBC,EAASD,EAATC,UAASC,EAAAF,EACTG,sBAAAA,OAAwB,IAAHD,GAAQA,EAAAE,EAAAJ,EAC7BK,KAAAA,OAAO,IAAHD,EAAG,UAASA,EAChBE,EAAIN,EAAJM,KAAIC,EAAAP,EACJQ,SAAAA,OAAW,IAAHD,EAAG,MAAKA,EAChBE,EAAKT,EAALS,MACAC,EAAIV,EAAJU,KACAC,EAAQX,EAARW,SAAQC,EAAAZ,EACRa,YAAAA,OAAc,IAAHD,GAAQA,EACnBE,EAAOd,EAAPc,QAAOC,EAAAf,EACPgB,QAAAA,OAAU,IAAHD,GAAQA,EACfE,EAAEjB,EAAFiB,GACeC,EAAUlB,EAAzB,eAAamB,EAAAnB,EACboB,qBAAAA,OAAuB,IAAHD,EAAG,QAAOA,EAAAE,EAAArB,EAC9BsB,eAAAA,OAAiB,IAAHD,GAAQA,EAEhBE,EAAcC,GAAQ,WAC1B,MAAgB,YAATnB,EAAqBoB,EAAWC,CACzC,GAAG,CAACrB,IAEEsB,OAAwBC,IAATtB,EAAqBiB,EAAcjB,EAExD,OACEuB,yBACE5B,UAAW6B,EAAGC,EAAOC,aAAcC,EAASF,EAAQG,UAASC,OAAS9B,KAAUJ,EAASmC,EACtFL,CAAAA,EAAAA,EAAOT,eAAiBA,IAE3Be,KAAK,QACQ,cAAAnB,GAAcoB,EAAUC,EAAuBC,cAAevB,GAChE,YAAAwB,EAAgBD,eAE1B/B,GACCoB,EAACa,cAAAC,GAAKC,QAAQ,QAAQC,MAAM,SAAS5C,UAAW8B,EAAOe,eAAgBC,IAAI,OACvElC,GACAgB,EAAAa,cAACM,EAAI,CACH/C,UAAW8B,EAAOzB,KAClBE,SAAUA,EACVyC,YAAU,EACV3C,KAAMqB,EACNuB,kBAAgB,EAChBC,SAAS,OAGbtB,EAACa,cAAAU,GAAK/C,KAAK,QAAQgD,QAAQ,KAAKC,OAAO,SAASrD,UAAW8B,EAAOtB,OAC/DA,IAIPoB,EAAAa,cAACC,EAAI,CAACC,QAAQ,QAAQC,MAAM,SAASE,IAAI,OACrCtC,GAASO,IAAYH,GAAeV,GACpC0B,EAACa,cAAAM,EAAK,CAAAxC,SAAUA,EAAU2C,SAAU,GAAIF,YAAW,EAAA3C,KAAMqB,EAAcuB,sBAEzErB,EAACa,cAAAU,EACC,CAAA/C,KAAK,QACLgD,QAASrC,OAAUY,EAAY,IAC/B3B,UAAW6B,EAAGC,EAAOrB,KAAI0B,EAAAA,EAAAA,EAAA,CAAA,EACtBL,EAAOf,QAAUA,GACjBe,EAAOwB,cAAgBzC,GACvBiB,EAAOyB,WAAaxC,KAGtBN,GAAQC,IAGZG,GACCe,EAAAa,cAACe,EAAU,CACTC,KAAK,QACLC,MAAM,mBACN1D,UAAW8B,EAAO6B,UAClBC,iBAAkB/B,EAAGC,EAAO+B,iBAAgB1B,EAAA,CAAA,EACzCL,EAAOgC,iBAAmB/C,IAE7BgD,UAAW5C,EACX6C,eACA3D,KAAM4D,EACNC,QAASrD,IAKnB,GAO0G,CACxGsD,MAAOC,EACPC,UAAWC"}
1	+ {"version":3,"file":"AttentionBox.js","sources":["../../../../src/components/AttentionBox/AttentionBox.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { useMemo } from \"react\";\nimport { camelCase } from \"es-toolkit\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { Icon, type SubIcon } from \"@vibe/icon\";\nimport { IconButton } from \"@vibe/icon-button\";\nimport { CloseSmall, Alert as AlertIcon, Info as InfoIcon } from \"@vibe/icons\";\nimport { AttentionBoxType as AttentionBoxTypeEnum, IconTypeEnum } from \"./AttentionBoxConstants\";\nimport { type AttentionBoxType } from \"./AttentionBox.types\";\nimport { type VibeComponentProps, type ElementContent, withStaticPropsWithoutForwardRef } from \"../../types\";\nimport { Text } from \"@vibe/typography\";\nimport { Flex } from \"@vibe/layout\";\nimport styles from \"./AttentionBox.module.scss\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\n/*\n @deprecated AttentionBox is deprecated. Please use AttentionBox from \"@vibe/core/next\" instead.\n /\nexport interface AttentionBoxProps extends VibeComponentProps {\n // TODO: [breaking] remove prop\n /\n If true, displays an icon even when no header is provided.\n /\n withIconWithoutHeader?: boolean;\n /\n The type of the AttentionBox.\n /\n type?: AttentionBoxType;\n /\n The icon displayed next to the title or text.\n /\n icon?: SubIcon;\n /\n The type of the icon.\n /\n iconType?: \"svg\" \| \"font\";\n /\n The title of the component.\n /\n title?: string;\n /\n The text content displayed inside.\n /\n text?: string;\n /\n The content of the component.\n /\n children?: ElementContent;\n // TODO: [breaking] remove prop\n /\n If true, the icon is not displayed.\n /\n withoutIcon?: boolean;\n /\n Callback fired when the close button is clicked.\n /\n onClose?: (event: React.MouseEvent) => void;\n /\n If true, renders in compact mode.\n /\n compact?: boolean;\n /\n The label of the close button.\n /\n closeButtonAriaLabel?: string;\n /\n If true, an entry animation is applied when the component appears.\n /\n entryAnimation?: boolean;\n}\n\n/\n @deprecated AttentionBox is deprecated. Please use AttentionBox from \"@vibe/core/next\" instead.\n */\nconst AttentionBox = ({\n className,\n withIconWithoutHeader = false,\n type = \"primary\",\n icon,\n iconType = \"svg\",\n title,\n text,\n children,\n withoutIcon = false,\n onClose,\n compact = false,\n id,\n \"data-testid\": dataTestId,\n closeButtonAriaLabel = \"Close\",\n entryAnimation = false\n}: AttentionBoxProps) => {\n const defaultIcon = useMemo(() => {\n return type === \"primary\" ? InfoIcon : AlertIcon;\n }, [type]);\n\n const overrideIcon = icon === undefined ? defaultIcon : icon;\n\n return (\n <aside\n className={cx(styles.attentionBox, getStyle(styles, camelCase(`type-${type}`)), className, {\n [styles.entryAnimation]: entryAnimation\n })}\n role=\"alert\"\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.ATTENTION_BOX, id)}\n data-vibe={ComponentVibeId.ATTENTION_BOX}\n >\n {title && (\n <Flex justify=\"start\" align=\"center\" className={styles.titleContainer} gap=\"xs\">\n {!withoutIcon && (\n <Icon\n className={styles.icon}\n iconType={iconType}\n ariaHidden\n icon={overrideIcon}\n ignoreFocusStyle\n iconSize=\"20\"\n />\n )}\n <Text type=\"text1\" element=\"h5\" weight=\"medium\" className={styles.title}>\n {title}\n </Text>\n </Flex>\n )}\n <Flex justify=\"start\" align=\"center\" gap=\"xs\">\n {!title && compact && !withoutIcon && withIconWithoutHeader && (\n <Icon iconType={iconType} iconSize={18} ariaHidden icon={overrideIcon} ignoreFocusStyle />\n )}\n <Text\n type=\"text2\"\n element={compact ? undefined : \"p\"}\n className={cx(styles.text, {\n [styles.compact]: compact,\n [styles.dismissible]: !!onClose,\n [styles.paragraph]: !compact\n })}\n >\n {text \|\| children}\n </Text>\n </Flex>\n {onClose && (\n <IconButton\n size=\"small\"\n color=\"on-primary-color\"\n className={styles.closeIcon}\n wrapperClassName={cx(styles.closeIconWrapper, {\n [styles.closeIconCompact]: compact\n })}\n ariaLabel={closeButtonAriaLabel}\n hideTooltip\n icon={CloseSmall}\n onClick={onClose}\n />\n )}\n </aside>\n );\n};\n\ninterface AttentionBoxStaticProps {\n types: typeof AttentionBoxTypeEnum;\n iconTypes: typeof IconTypeEnum;\n}\n\nexport default withStaticPropsWithoutForwardRef<AttentionBoxProps, AttentionBoxStaticProps>(AttentionBox, {\n types: AttentionBoxTypeEnum,\n iconTypes: IconTypeEnum\n});\n"],"names":["withStaticPropsWithoutForwardRef","_ref","className","_ref$withIconWithoutH","withIconWithoutHeader","_ref$type","type","icon","_ref$iconType","iconType","title","text","children","_ref$withoutIcon","withoutIcon","onClose","_ref$compact","compact","id","dataTestId","_ref$closeButtonAriaL","closeButtonAriaLabel","_ref$entryAnimation","entryAnimation","defaultIcon","useMemo","InfoIcon","AlertIcon","overrideIcon","undefined","React","cx","styles","attentionBox","getStyle","camelCase","concat","_defineProperty","role","getTestId","ComponentDefaultTestId","ATTENTION_BOX","ComponentVibeId","createElement","Flex","justify","align","titleContainer","gap","Icon","ariaHidden","ignoreFocusStyle","iconSize","Text","element","weight","dismissible","paragraph","IconButton","size","color","closeIcon","wrapperClassName","closeIconWrapper","closeIconCompact","ariaLabel","hideTooltip","CloseSmall","onClick","types","AttentionBoxTypeEnum","iconTypes","IconTypeEnum"],"mappings":"uhCA2EA,IAwFeA,EAAAA,GAxFM,SAAHC,GAgBM,IAftBC,EAASD,EAATC,UAASC,EAAAF,EACTG,sBAAAA,OAAwB,IAAHD,GAAQA,EAAAE,EAAAJ,EAC7BK,KAAAA,OAAO,IAAHD,EAAG,UAASA,EAChBE,EAAIN,EAAJM,KAAIC,EAAAP,EACJQ,SAAAA,OAAW,IAAHD,EAAG,MAAKA,EAChBE,EAAKT,EAALS,MACAC,EAAIV,EAAJU,KACAC,EAAQX,EAARW,SAAQC,EAAAZ,EACRa,YAAAA,OAAc,IAAHD,GAAQA,EACnBE,EAAOd,EAAPc,QAAOC,EAAAf,EACPgB,QAAAA,OAAU,IAAHD,GAAQA,EACfE,EAAEjB,EAAFiB,GACeC,EAAUlB,EAAzB,eAAamB,EAAAnB,EACboB,qBAAAA,OAAuB,IAAHD,EAAG,QAAOA,EAAAE,EAAArB,EAC9BsB,eAAAA,OAAiB,IAAHD,GAAQA,EAEhBE,EAAcC,GAAQ,WAC1B,MAAgB,YAATnB,EAAqBoB,EAAWC,CACzC,GAAG,CAACrB,IAEEsB,OAAwBC,IAATtB,EAAqBiB,EAAcjB,EAExD,OACEuB,yBACE5B,UAAW6B,EAAGC,EAAOC,aAAcC,EAASF,EAAQG,UAASC,OAAS9B,KAAUJ,EAASmC,EACtFL,CAAAA,EAAAA,EAAOT,eAAiBA,IAE3Be,KAAK,QACQ,cAAAnB,GAAcoB,EAAUC,EAAuBC,cAAevB,GAChE,YAAAwB,EAAgBD,eAE1B/B,GACCoB,EAACa,cAAAC,GAAKC,QAAQ,QAAQC,MAAM,SAAS5C,UAAW8B,EAAOe,eAAgBC,IAAI,OACvElC,GACAgB,EAAAa,cAACM,EAAI,CACH/C,UAAW8B,EAAOzB,KAClBE,SAAUA,EACVyC,YAAU,EACV3C,KAAMqB,EACNuB,kBAAgB,EAChBC,SAAS,OAGbtB,EAACa,cAAAU,GAAK/C,KAAK,QAAQgD,QAAQ,KAAKC,OAAO,SAASrD,UAAW8B,EAAOtB,OAC/DA,IAIPoB,EAAAa,cAACC,EAAI,CAACC,QAAQ,QAAQC,MAAM,SAASE,IAAI,OACrCtC,GAASO,IAAYH,GAAeV,GACpC0B,EAACa,cAAAM,EAAK,CAAAxC,SAAUA,EAAU2C,SAAU,GAAIF,YAAW,EAAA3C,KAAMqB,EAAcuB,sBAEzErB,EAACa,cAAAU,EACC,CAAA/C,KAAK,QACLgD,QAASrC,OAAUY,EAAY,IAC/B3B,UAAW6B,EAAGC,EAAOrB,KAAI0B,EAAAA,EAAAA,EAAA,CAAA,EACtBL,EAAOf,QAAUA,GACjBe,EAAOwB,cAAgBzC,GACvBiB,EAAOyB,WAAaxC,KAGtBN,GAAQC,IAGZG,GACCe,EAAAa,cAACe,EAAU,CACTC,KAAK,QACLC,MAAM,mBACN1D,UAAW8B,EAAO6B,UAClBC,iBAAkB/B,EAAGC,EAAO+B,iBAAgB1B,EAAA,CAAA,EACzCL,EAAOgC,iBAAmB/C,IAE7BgD,UAAW5C,EACX6C,eACA3D,KAAM4D,EACNC,QAASrD,IAKnB,GAO0G,CACxGsD,MAAOC,EACPC,UAAWC"}

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

@@ -1,2 +1,2 @@
-var e={attentionBox:"attentionBox_01def7e79f",entryAnimation:"entryAnimation_a9f0ece34e",closeIconWrapper:"closeIconWrapper_8f51800bf3",closeIcon:"closeIcon_7dbec1bf29",icon:"icon_b385db8120",title:"title_4ebfae9c83",text:"text_5d3a5da92d",titleContainer:"titleContainer_7dbec1bf29",typePrimary:"typePrimary_9ba9695f95",typeDanger:"typeDanger_5e1071f830",typeSuccess:"typeSuccess_7b44bb076a",typeDark:"typeDark_2df5eb56c0",typeWarning:"typeWarning_1b72a8b274",closeIconCompact:"closeIconCompact_bfe040a900",compact:"compact_544c04ce99",dismissible:"dismissible_79ffc3be7e",paragraph:"paragraph_9272b5a267"};!function(e){const n="s_id-7d53612c3785_3_82_2";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,t.firstChild?t.insertBefore(a,t.firstChild):t.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("@keyframes entryAnimation_a9f0ece34e {\n  0% {\n    transform: translateY(-10px);\n    opacity: 0;\n  }\n  50% {\n    opacity: 1;\n  }\n  100% {\n    transform: translateX(0);\n    opacity: 1;\n  }\n}\n.attentionBox_01def7e79f {\n  position: relative;\n  padding: 12px var(--spacing-medium);\n  border-radius: var(--border-radius-medium);\n  width: fit-content;\n  max-width: 100%;\n  height: fit-content;\n}\n.attentionBox_01def7e79f.entryAnimation_a9f0ece34e {\n  animation: entryAnimation_a9f0ece34e 200ms cubic-bezier(0, 0, 0.4, 1) forwards;\n}\n.attentionBox_01def7e79f .closeIconWrapper_8f51800bf3 .closeIcon_7dbec1bf29 {\n  color: var(--primary-text-color);\n}\n.attentionBox_01def7e79f .icon_b385db8120 {\n  flex-shrink: 0;\n}\n.title_4ebfae9c83 {\n  margin: 0;\n  padding-right: var(--spacing-xl);\n}\n.text_5d3a5da92d,\n.titleContainer_7dbec1bf29 {\n  color: var(--primary-text-color);\n}\n.typePrimary_9ba9695f95 {\n  color: var(--primary-text-color);\n  background-color: var(--primary-selected-color);\n}\n.typeDanger_5e1071f830 {\n  background-color: var(--negative-color-selected);\n}\n.typeSuccess_7b44bb076a {\n  background-color: var(--positive-color-selected);\n}\n.typeDark_2df5eb56c0 {\n  background-color: var(--ui-background-color);\n  color: var(--primary-text-color);\n}\n.typeWarning_1b72a8b274 {\n  background-color: var(--warning-color-selected);\n  color: var(--primary-text-color);\n}\n.titleContainer_7dbec1bf29 {\n  margin-bottom: var(--spacing-xs);\n}\n.titleContainer_7dbec1bf29:empty {\n  margin-bottom: 0;\n}\n.closeIconWrapper_8f51800bf3 {\n  position: absolute;\n  top: 12px;\n  right: 12px;\n}\n.closeIconCompact_bfe040a900 {\n  top: calc(50% - 16px);\n}\n.text_5d3a5da92d.compact_544c04ce99 {\n  flex: 1;\n}\n.text_5d3a5da92d.compact_544c04ce99.dismissible_79ffc3be7e {\n  padding-right: var(--spacing-xl);\n}\n.text_5d3a5da92d.paragraph_9272b5a267 {\n  margin: 0 var(--spacing-medium) 0 0;\n}");export{e as default};
+var n={attentionBox:"attentionBox_305aa9e5f4",entryAnimation:"entryAnimation_46bf1cdf90",closeIconWrapper:"closeIconWrapper_91f5ae3226",closeIcon:"closeIcon_45a8019018",icon:"icon_aba80a681e",title:"title_395530b422",text:"text_7021a10967",titleContainer:"titleContainer_45a8019018",typePrimary:"typePrimary_b4b29dc322",typeDanger:"typeDanger_b3e8021477",typeSuccess:"typeSuccess_bdd8e7fd0d",typeDark:"typeDark_d1b3819fae",typeWarning:"typeWarning_b8746f5f9a",closeIconCompact:"closeIconCompact_fee841b765",compact:"compact_760517f232",dismissible:"dismissible_41b2434958",paragraph:"paragraph_b2e5be4c76"};!function(n){const e="s_id-7d53612c3785_3_83_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const a=document.createElement("style");a.id=e,t.firstChild?t.insertBefore(a,t.firstChild):t.appendChild(a),a.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}("@keyframes entryAnimation_46bf1cdf90 {\n  0% {\n    transform: translateY(-10px);\n    opacity: 0;\n  }\n  50% {\n    opacity: 1;\n  }\n  100% {\n    transform: translateX(0);\n    opacity: 1;\n  }\n}\n.attentionBox_305aa9e5f4 {\n  position: relative;\n  padding: 12px var(--spacing-medium);\n  border-radius: var(--border-radius-medium);\n  width: fit-content;\n  max-width: 100%;\n  height: fit-content;\n}\n.attentionBox_305aa9e5f4.entryAnimation_46bf1cdf90 {\n  animation: entryAnimation_46bf1cdf90 200ms cubic-bezier(0, 0, 0.4, 1) forwards;\n}\n.attentionBox_305aa9e5f4 .closeIconWrapper_91f5ae3226 .closeIcon_45a8019018 {\n  color: var(--primary-text-color);\n}\n.attentionBox_305aa9e5f4 .icon_aba80a681e {\n  flex-shrink: 0;\n}\n.title_395530b422 {\n  margin: 0;\n  padding-right: var(--spacing-xl);\n}\n.text_7021a10967,\n.titleContainer_45a8019018 {\n  color: var(--primary-text-color);\n}\n.typePrimary_b4b29dc322 {\n  color: var(--primary-text-color);\n  background-color: var(--primary-selected-color);\n}\n.typeDanger_b3e8021477 {\n  background-color: var(--negative-color-selected);\n}\n.typeSuccess_bdd8e7fd0d {\n  background-color: var(--positive-color-selected);\n}\n.typeDark_d1b3819fae {\n  background-color: var(--ui-background-color);\n  color: var(--primary-text-color);\n}\n.typeWarning_b8746f5f9a {\n  background-color: var(--warning-color-selected);\n  color: var(--primary-text-color);\n}\n.titleContainer_45a8019018 {\n  margin-bottom: var(--spacing-xs);\n}\n.titleContainer_45a8019018:empty {\n  margin-bottom: 0;\n}\n.closeIconWrapper_91f5ae3226 {\n  position: absolute;\n  top: 12px;\n  right: 12px;\n}\n.closeIconCompact_fee841b765 {\n  top: calc(50% - 16px);\n}\n.text_7021a10967.compact_760517f232 {\n  flex: 1;\n}\n.text_7021a10967.compact_760517f232.dismissible_41b2434958 {\n  padding-right: var(--spacing-xl);\n}\n.text_7021a10967.paragraph_b2e5be4c76 {\n  margin: 0 var(--spacing-medium) 0 0;\n}");export{n as default};
 //# sourceMappingURL=AttentionBox.module.scss.js.map

package/dist/src/components/AttentionBox/AttentionBoxLink/AttentionBoxLink.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={attentionBoxLink:"attentionBoxLink_94cabeaa5a"};!function(e){const t="s_id-683678bf9fce_3_82_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)}("a[href].attentionBoxLink_94cabeaa5a,\na[href].attentionBoxLink_94cabeaa5a:hover {\n  color: var(--primary-text-color);\n  text-decoration: underline;\n}");export{e as default};
+var e={attentionBoxLink:"attentionBoxLink_b802130e2a"};!function(e){const t="s_id-683678bf9fce_3_83_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}("a[href].attentionBoxLink_b802130e2a,\na[href].attentionBoxLink_b802130e2a:hover {\n  color: var(--primary-text-color);\n  text-decoration: underline;\n}");export{e as default};
 //# sourceMappingURL=AttentionBoxLink.module.scss.js.map

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

@@ -1,2 +1,2 @@
-import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{isNil as t,camelCase as o}from"es-toolkit";import{getStyle as a}from"../../helpers/typesciptCssModulesHelper.js";import{getTestId as r,ComponentDefaultTestId as s}from"../../tests/testIds.js";import i from"classnames";import l,{useMemo as n,useCallback as c}from"react";import{ElementAllowedColor as m}from"../../utils/colors-vars-map.js";import{getElementColor as d}from"../../types/Colors.js";import{AvatarType as p,AvatarSize as u}from"./AvatarConstants.js";import b from"./AvatarBadge.js";import g from"./AvatarContent.js";import f from"../Tooltip/Tooltip.js";import{withStaticPropsWithoutForwardRef as v}from"../../types/withStaticProps.js";import h from"./Avatar.module.scss.js";import{ComponentVibeId as j}from"../../tests/constants.js";import k from"../../../components/clickable/dist/Clickable/ClickableWrapper.js";var C=v((function(m){var p=m.id,u=m.type,v=void 0===u?"text":u,C=m.className,E=m.avatarContentWrapperClassName,y=m.textClassName,N=void 0===y?"":y,B=m.size,A=void 0===B?"large":B,x=m.src,P=m.icon,T=m.text,z=m.tooltipProps,O=m.ariaLabel,w=m.withoutTooltip,L=void 0!==w&&w,R=m.role,I=m.backgroundColor,H=void 0===I?"chili-blue":I,W=m.square,q=m.disabled,S=m.tabIndex,V=m.ariaHidden,_=void 0!==V&&V,D=m.topLeftBadgeProps,M=m.topRightBadgeProps,F=m.bottomLeftBadgeProps,G=m.bottomRightBadgeProps,J=m.withoutBorder,K=void 0!==J&&J,Q=m.customSize,U=void 0===Q?null:Q,X=m.customBackgroundColor,Y=void 0===X?null:X,Z=m.onClick,$=m["data-testid"],ee=n((function(){return Y?{backgroundColor:Y}:x?{}:{backgroundColor:d(H)}}),[x,H,Y]),te=n((function(){return U?{height:U,width:U}:{}}),[U]),oe=n((function(){if(!L)return z?Object.assign({content:O},z):{content:O}}),[O,z,L]),ae=n((function(){var e=[];return t(D)||e.push(l.createElement("div",{key:"top-left-badge",className:i(h.badge,h.badgeTopLeft)},l.createElement(b,Object.assign({size:A},D)))),t(M)||e.push(l.createElement("div",{key:"top-right-badge",className:i(h.badge,h.badgeTopRight)},l.createElement(b,Object.assign({size:A},M)))),t(F)||e.push(l.createElement("div",{key:"bottom-left-badge",className:i(h.badge,h.badgeBottomLeft)},l.createElement(b,Object.assign({size:A},F)))),t(G)||e.push(l.createElement("div",{key:"bottom-right-bade",className:i(h.badge,h.badgeBottomRight)},l.createElement(b,Object.assign({size:A},G)))),e.length>0?l.createElement("div",{className:i(h.badges)},e):null}),[A,D,M,F,G]),re=n((function(){return q||!Z&&!(null==oe?void 0:oe.content)?-1:0}),[q,Z,null==oe?void 0:oe.content]),se=null!=S?S:re,ie=c((function(e){e.preventDefault(),Z&&Z(e,p)}),[Z,p]);return l.createElement("div",{id:p,"data-testid":$||r(s.AVATAR,p),className:i(h.avatar,h[A],C),style:te,"data-vibe":j.AVATAR},l.createElement(k,{isClickable:!!Z,clickableProps:{onClick:ie,tabIndex:"-1",className:h.clickableWrapper}},l.createElement(f,Object.assign({showTrigger:["focus","mouseenter"],hideTrigger:["blur","mouseleave"]},oe),l.createElement("div",{className:i(h.circle,a(h,o("circle--"+v)),e(e(e({},h.disabled,q),h.square,W),h.withoutBorder,K),E),"aria-hidden":_,tabIndex:se,style:Object.assign({},ee)},l.createElement(g,{type:v,size:A,src:x,icon:P,text:T,ariaLabel:O,role:R,textClassName:N})),ae)))}),{types:p,sizes:u,colors:m,backgroundColors:m});export{C as default};
+import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{isNil as t,camelCase as o}from"es-toolkit";import{getStyle as a}from"../../helpers/typesciptCssModulesHelper.js";import{getTestId as r,ComponentDefaultTestId as s}from"../../tests/testIds.js";import i from"classnames";import l,{useMemo as n,useCallback as c}from"react";import{ElementAllowedColor as m}from"../../utils/colors-vars-map.js";import{getElementColor as d}from"../../types/Colors.js";import{AvatarType as p,AvatarSize as u}from"./AvatarConstants.js";import b from"./AvatarBadge.js";import g from"./AvatarContent.js";import{withStaticPropsWithoutForwardRef as f}from"../../types/withStaticProps.js";import v from"./Avatar.module.scss.js";import{ComponentVibeId as h}from"../../tests/constants.js";import j from"../../../components/clickable/dist/Clickable/ClickableWrapper.js";import k from"../../../components/tooltip/dist/Tooltip/Tooltip.js";var C=f((function(m){var p=m.id,u=m.type,f=void 0===u?"text":u,C=m.className,E=m.avatarContentWrapperClassName,y=m.textClassName,N=void 0===y?"":y,B=m.size,A=void 0===B?"large":B,x=m.src,P=m.icon,T=m.text,z=m.tooltipProps,O=m.ariaLabel,w=m.withoutTooltip,L=void 0!==w&&w,R=m.role,I=m.backgroundColor,H=void 0===I?"chili-blue":I,W=m.square,q=m.disabled,S=m.tabIndex,V=m.ariaHidden,_=void 0!==V&&V,D=m.topLeftBadgeProps,M=m.topRightBadgeProps,F=m.bottomLeftBadgeProps,G=m.bottomRightBadgeProps,J=m.withoutBorder,K=void 0!==J&&J,Q=m.customSize,U=void 0===Q?null:Q,X=m.customBackgroundColor,Y=void 0===X?null:X,Z=m.onClick,$=m["data-testid"],ee=n((function(){return Y?{backgroundColor:Y}:x?{}:{backgroundColor:d(H)}}),[x,H,Y]),te=n((function(){return U?{height:U,width:U}:{}}),[U]),oe=n((function(){if(!L)return z?Object.assign({content:O},z):{content:O}}),[O,z,L]),ae=n((function(){var e=[];return t(D)||e.push(l.createElement("div",{key:"top-left-badge",className:i(v.badge,v.badgeTopLeft)},l.createElement(b,Object.assign({size:A},D)))),t(M)||e.push(l.createElement("div",{key:"top-right-badge",className:i(v.badge,v.badgeTopRight)},l.createElement(b,Object.assign({size:A},M)))),t(F)||e.push(l.createElement("div",{key:"bottom-left-badge",className:i(v.badge,v.badgeBottomLeft)},l.createElement(b,Object.assign({size:A},F)))),t(G)||e.push(l.createElement("div",{key:"bottom-right-bade",className:i(v.badge,v.badgeBottomRight)},l.createElement(b,Object.assign({size:A},G)))),e.length>0?l.createElement("div",{className:i(v.badges)},e):null}),[A,D,M,F,G]),re=n((function(){return q||!Z&&!(null==oe?void 0:oe.content)?-1:0}),[q,Z,null==oe?void 0:oe.content]),se=null!=S?S:re,ie=c((function(e){e.preventDefault(),Z&&Z(e,p)}),[Z,p]);return l.createElement("div",{id:p,"data-testid":$||r(s.AVATAR,p),className:i(v.avatar,v[A],C),style:te,"data-vibe":h.AVATAR},l.createElement(j,{isClickable:!!Z,clickableProps:{onClick:ie,tabIndex:"-1",className:v.clickableWrapper}},l.createElement(k,Object.assign({showTrigger:["focus","mouseenter"],hideTrigger:["blur","mouseleave"]},oe),l.createElement("div",{className:i(v.circle,a(v,o("circle--"+f)),e(e(e({},v.disabled,q),v.square,W),v.withoutBorder,K),E),"aria-hidden":_,tabIndex:se,style:Object.assign({},ee)},l.createElement(g,{type:f,size:A,src:x,icon:P,text:T,ariaLabel:O,role:R,textClassName:N})),ae)))}),{types:p,sizes:u,colors:m,backgroundColors:m});export{C as default};
 //# sourceMappingURL=Avatar.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Avatar.js","sources":["../../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import { camelCase } from \"es-toolkit\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { type AriaRole, useCallback, useMemo } from \"react\";\nimport { isNil } from \"es-toolkit\";\nimport { ElementAllowedColor as ElementAllowedColorEnum } from \"../../utils/colors-vars-map\";\nimport { type ElementAllowedColor, getElementColor } from \"../../types/Colors\";\nimport { AvatarSize as AvatarSizeEnum, AvatarType as AvatarTypeEnum } from \"./AvatarConstants\";\nimport { type AvatarSize, type AvatarType } from \"./Avatar.types\";\nimport AvatarBadge, { type AvatarBadgeProps } from \"./AvatarBadge\";\nimport AvatarContent from \"./AvatarContent\";\nimport Tooltip, { type TooltipProps } from \"../Tooltip/Tooltip\";\nimport { ClickableWrapper } from \"@vibe/clickable\";\nimport { type VibeComponentProps, withStaticPropsWithoutForwardRef } from \"../../types\";\nimport { type SubIcon } from \"@vibe/icon\";\nimport styles from \"./Avatar.module.scss\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface AvatarProps extends VibeComponentProps {\n /*\n The image source for the avatar.\n /\n src?: string;\n /\n The text displayed inside the avatar.\n /\n text?: string;\n /\n Props passed to the Tooltip component. See full options in the [Tooltip documentation](https://vibe.monday.com/?path=/docs/components-tooltip--docs).\n /\n tooltipProps?: Partial<TooltipProps>;\n /\n The ARIA label of the avatar.\n /\n ariaLabel?: string;\n /\n If true, the tooltip is disabled.\n /\n withoutTooltip?: boolean;\n /\n The icon displayed inside the avatar.\n /\n icon?: SubIcon;\n /\n The type of the avatar.\n /\n type?: AvatarType;\n /\n Class name applied to the text inside the avatar.\n /\n textClassName?: string;\n /\n Class name applied to the avatar content wrapper.\n /\n avatarContentWrapperClassName?: string;\n /\n The background color of the avatar.\n /\n backgroundColor?: ElementAllowedColor;\n /\n A custom background color.\n /\n customBackgroundColor?: string;\n /\n The ARIA role of the avatar.\n /\n role?: AriaRole;\n /\n The size of the avatar.\n /\n size?: AvatarSize;\n /\n A custom size in pixels.\n /\n customSize?: number;\n /\n The tab index of the avatar.\n /\n tabIndex?: number;\n /\n If true, the avatar is hidden from assistive technologies.\n /\n ariaHidden?: boolean;\n /\n If true, the avatar is disabled.\n /\n disabled?: boolean;\n /\n If true, renders the avatar as a square instead of a circle.\n /\n square?: boolean;\n /\n Props for the top-left badge.\n /\n topLeftBadgeProps?: AvatarBadgeProps;\n /\n Props for the top-right badge.\n /\n topRightBadgeProps?: AvatarBadgeProps;\n /\n Props for the bottom-left badge.\n /\n bottomLeftBadgeProps?: AvatarBadgeProps;\n /\n Props for the bottom-right badge.\n /\n bottomRightBadgeProps?: AvatarBadgeProps;\n /\n If true, removes the avatar's border.\n /\n withoutBorder?: boolean;\n /\n Callback fired when the avatar is clicked.\n */\n onClick?: (event: React.MouseEvent \| React.KeyboardEvent, avatarId: string) => void;\n}\n\nconst Avatar = ({\n id,\n type = \"text\",\n className,\n avatarContentWrapperClassName,\n textClassName = \"\",\n size = \"large\",\n src,\n icon,\n text,\n tooltipProps,\n ariaLabel,\n withoutTooltip = false,\n role,\n backgroundColor = \"chili-blue\",\n square,\n disabled,\n tabIndex,\n ariaHidden = false,\n topLeftBadgeProps,\n topRightBadgeProps,\n bottomLeftBadgeProps,\n bottomRightBadgeProps,\n withoutBorder = false,\n customSize = null,\n customBackgroundColor = null,\n onClick,\n \"data-testid\": dataTestId\n}: AvatarProps) => {\n const backgroundColorStyle = useMemo(() => {\n if (customBackgroundColor) return { backgroundColor: customBackgroundColor };\n return src ? {} : { backgroundColor: getElementColor(backgroundColor) };\n }, [src, backgroundColor, customBackgroundColor]);\n const sizeStyle = useMemo(() => {\n return customSize ? { height: customSize, width: customSize } : {};\n }, [customSize]);\n\n const overrideTooltipProps = useMemo(() => {\n if (withoutTooltip) return undefined;\n\n if (tooltipProps) {\n return { content: ariaLabel, ...tooltipProps };\n } else {\n return { content: ariaLabel };\n }\n }, [ariaLabel, tooltipProps, withoutTooltip]);\n\n const badgesContainer = useMemo(() => {\n const badges = [];\n if (!isNil(topLeftBadgeProps)) {\n badges.push(\n <div key=\"top-left-badge\" className={cx(styles.badge, styles.badgeTopLeft)}>\n <AvatarBadge size={size} {...topLeftBadgeProps} />\n </div>\n );\n }\n if (!isNil(topRightBadgeProps)) {\n badges.push(\n <div key=\"top-right-badge\" className={cx(styles.badge, styles.badgeTopRight)}>\n <AvatarBadge size={size} {...topRightBadgeProps} />\n </div>\n );\n }\n if (!isNil(bottomLeftBadgeProps)) {\n badges.push(\n <div key=\"bottom-left-badge\" className={cx(styles.badge, styles.badgeBottomLeft)}>\n <AvatarBadge size={size} {...bottomLeftBadgeProps} />\n </div>\n );\n }\n if (!isNil(bottomRightBadgeProps)) {\n badges.push(\n <div key=\"bottom-right-bade\" className={cx(styles.badge, styles.badgeBottomRight)}>\n <AvatarBadge size={size} {...bottomRightBadgeProps} />\n </div>\n );\n }\n\n return badges.length > 0 ? <div className={cx(styles.badges)}>{badges}</div> : null;\n }, [size, topLeftBadgeProps, topRightBadgeProps, bottomLeftBadgeProps, bottomRightBadgeProps]);\n\n const defaultTabIndex = useMemo(() => {\n if (!disabled && (onClick \|\| overrideTooltipProps?.content)) {\n return 0;\n }\n return -1;\n }, [disabled, onClick, overrideTooltipProps?.content]);\n\n const overrideTabIndex = tabIndex ?? defaultTabIndex;\n\n const clickHandler = useCallback(\n (event: React.MouseEvent \| React.KeyboardEvent) => {\n event.preventDefault();\n if (onClick) {\n onClick(event, id);\n }\n },\n [onClick, id]\n );\n\n return (\n <div\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.AVATAR, id)}\n className={cx(styles.avatar, styles[size], className)}\n style={sizeStyle}\n data-vibe={ComponentVibeId.AVATAR}\n >\n <ClickableWrapper\n isClickable={!!onClick}\n clickableProps={{\n onClick: clickHandler,\n tabIndex: \"-1\",\n className: styles.clickableWrapper\n }}\n >\n <Tooltip showTrigger={[\"focus\", \"mouseenter\"]} hideTrigger={[\"blur\", \"mouseleave\"]} {...overrideTooltipProps}>\n <div\n className={cx(\n styles.circle,\n getStyle(styles, camelCase(\"circle--\" + type)),\n {\n [styles.disabled]: disabled,\n [styles.square]: square,\n [styles.withoutBorder]: withoutBorder\n },\n avatarContentWrapperClassName\n )}\n aria-hidden={ariaHidden}\n tabIndex={overrideTabIndex}\n style={{ ...backgroundColorStyle }}\n >\n <AvatarContent\n type={type}\n size={size}\n src={src}\n icon={icon}\n text={text}\n ariaLabel={ariaLabel}\n role={role}\n textClassName={textClassName}\n />\n </div>\n {badgesContainer}\n </Tooltip>\n </ClickableWrapper>\n </div>\n );\n};\n\ninterface AvatarStaticProps {\n types: typeof AvatarTypeEnum;\n sizes: typeof AvatarSizeEnum;\n colors: typeof ElementAllowedColorEnum;\n backgroundColors: typeof ElementAllowedColorEnum;\n}\n\nexport default withStaticPropsWithoutForwardRef<AvatarProps, AvatarStaticProps>(Avatar, {\n types: AvatarTypeEnum,\n sizes: AvatarSizeEnum,\n colors: ElementAllowedColorEnum,\n backgroundColors: ElementAllowedColorEnum\n});\n"],"names":["withStaticPropsWithoutForwardRef","_ref","id","_ref$type","type","className","avatarContentWrapperClassName","_ref$textClassName","textClassName","_ref$size","size","src","icon","text","tooltipProps","ariaLabel","_ref$withoutTooltip","withoutTooltip","role","_ref$backgroundColor","backgroundColor","square","disabled","tabIndex","_ref$ariaHidden","ariaHidden","topLeftBadgeProps","topRightBadgeProps","bottomLeftBadgeProps","bottomRightBadgeProps","_ref$withoutBorder","withoutBorder","_ref$customSize","customSize","_ref$customBackground","customBackgroundColor","onClick","dataTestId","backgroundColorStyle","useMemo","getElementColor","sizeStyle","height","width","overrideTooltipProps","Object","assign","content","badgesContainer","badges","isNil","push","React","key","cx","styles","badge","badgeTopLeft","createElement","AvatarBadge","badgeTopRight","badgeBottomLeft","badgeBottomRight","length","defaultTabIndex","overrideTabIndex","clickHandler","useCallback","event","preventDefault","getTestId","ComponentDefaultTestId","AVATAR","avatar","style","ComponentVibeId","ClickableWrapper","isClickable","clickableProps","clickableWrapper","Tooltip","showTrigger","hideTrigger","circle","getStyle","camelCase","_defineProperty","AvatarContent","types","AvatarTypeEnum","sizes","AvatarSizeEnum","colors","ElementAllowedColorEnum","backgroundColors"],"mappings":"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"}
1	+ {"version":3,"file":"Avatar.js","sources":["../../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import { camelCase } from \"es-toolkit\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\nimport React, { type AriaRole, useCallback, useMemo } from \"react\";\nimport { isNil } from \"es-toolkit\";\nimport { ElementAllowedColor as ElementAllowedColorEnum } from \"../../utils/colors-vars-map\";\nimport { type ElementAllowedColor, getElementColor } from \"../../types/Colors\";\nimport { AvatarSize as AvatarSizeEnum, AvatarType as AvatarTypeEnum } from \"./AvatarConstants\";\nimport { type AvatarSize, type AvatarType } from \"./Avatar.types\";\nimport AvatarBadge, { type AvatarBadgeProps } from \"./AvatarBadge\";\nimport AvatarContent from \"./AvatarContent\";\nimport { Tooltip, type TooltipProps } from \"@vibe/tooltip\";\nimport { ClickableWrapper } from \"@vibe/clickable\";\nimport { type VibeComponentProps, withStaticPropsWithoutForwardRef } from \"../../types\";\nimport { type SubIcon } from \"@vibe/icon\";\nimport styles from \"./Avatar.module.scss\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface AvatarProps extends VibeComponentProps {\n /*\n The image source for the avatar.\n /\n src?: string;\n /\n The text displayed inside the avatar.\n /\n text?: string;\n /\n Props passed to the Tooltip component. See full options in the [Tooltip documentation](https://vibe.monday.com/?path=/docs/components-tooltip--docs).\n /\n tooltipProps?: Partial<TooltipProps>;\n /\n The ARIA label of the avatar.\n /\n ariaLabel?: string;\n /\n If true, the tooltip is disabled.\n /\n withoutTooltip?: boolean;\n /\n The icon displayed inside the avatar.\n /\n icon?: SubIcon;\n /\n The type of the avatar.\n /\n type?: AvatarType;\n /\n Class name applied to the text inside the avatar.\n /\n textClassName?: string;\n /\n Class name applied to the avatar content wrapper.\n /\n avatarContentWrapperClassName?: string;\n /\n The background color of the avatar.\n /\n backgroundColor?: ElementAllowedColor;\n /\n A custom background color.\n /\n customBackgroundColor?: string;\n /\n The ARIA role of the avatar.\n /\n role?: AriaRole;\n /\n The size of the avatar.\n /\n size?: AvatarSize;\n /\n A custom size in pixels.\n /\n customSize?: number;\n /\n The tab index of the avatar.\n /\n tabIndex?: number;\n /\n If true, the avatar is hidden from assistive technologies.\n /\n ariaHidden?: boolean;\n /\n If true, the avatar is disabled.\n /\n disabled?: boolean;\n /\n If true, renders the avatar as a square instead of a circle.\n /\n square?: boolean;\n /\n Props for the top-left badge.\n /\n topLeftBadgeProps?: AvatarBadgeProps;\n /\n Props for the top-right badge.\n /\n topRightBadgeProps?: AvatarBadgeProps;\n /\n Props for the bottom-left badge.\n /\n bottomLeftBadgeProps?: AvatarBadgeProps;\n /\n Props for the bottom-right badge.\n /\n bottomRightBadgeProps?: AvatarBadgeProps;\n /\n If true, removes the avatar's border.\n /\n withoutBorder?: boolean;\n /\n Callback fired when the avatar is clicked.\n */\n onClick?: (event: React.MouseEvent \| React.KeyboardEvent, avatarId: string) => void;\n}\n\nconst Avatar = ({\n id,\n type = \"text\",\n className,\n avatarContentWrapperClassName,\n textClassName = \"\",\n size = \"large\",\n src,\n icon,\n text,\n tooltipProps,\n ariaLabel,\n withoutTooltip = false,\n role,\n backgroundColor = \"chili-blue\",\n square,\n disabled,\n tabIndex,\n ariaHidden = false,\n topLeftBadgeProps,\n topRightBadgeProps,\n bottomLeftBadgeProps,\n bottomRightBadgeProps,\n withoutBorder = false,\n customSize = null,\n customBackgroundColor = null,\n onClick,\n \"data-testid\": dataTestId\n}: AvatarProps) => {\n const backgroundColorStyle = useMemo(() => {\n if (customBackgroundColor) return { backgroundColor: customBackgroundColor };\n return src ? {} : { backgroundColor: getElementColor(backgroundColor) };\n }, [src, backgroundColor, customBackgroundColor]);\n const sizeStyle = useMemo(() => {\n return customSize ? { height: customSize, width: customSize } : {};\n }, [customSize]);\n\n const overrideTooltipProps = useMemo(() => {\n if (withoutTooltip) return undefined;\n\n if (tooltipProps) {\n return { content: ariaLabel, ...tooltipProps };\n } else {\n return { content: ariaLabel };\n }\n }, [ariaLabel, tooltipProps, withoutTooltip]);\n\n const badgesContainer = useMemo(() => {\n const badges = [];\n if (!isNil(topLeftBadgeProps)) {\n badges.push(\n <div key=\"top-left-badge\" className={cx(styles.badge, styles.badgeTopLeft)}>\n <AvatarBadge size={size} {...topLeftBadgeProps} />\n </div>\n );\n }\n if (!isNil(topRightBadgeProps)) {\n badges.push(\n <div key=\"top-right-badge\" className={cx(styles.badge, styles.badgeTopRight)}>\n <AvatarBadge size={size} {...topRightBadgeProps} />\n </div>\n );\n }\n if (!isNil(bottomLeftBadgeProps)) {\n badges.push(\n <div key=\"bottom-left-badge\" className={cx(styles.badge, styles.badgeBottomLeft)}>\n <AvatarBadge size={size} {...bottomLeftBadgeProps} />\n </div>\n );\n }\n if (!isNil(bottomRightBadgeProps)) {\n badges.push(\n <div key=\"bottom-right-bade\" className={cx(styles.badge, styles.badgeBottomRight)}>\n <AvatarBadge size={size} {...bottomRightBadgeProps} />\n </div>\n );\n }\n\n return badges.length > 0 ? <div className={cx(styles.badges)}>{badges}</div> : null;\n }, [size, topLeftBadgeProps, topRightBadgeProps, bottomLeftBadgeProps, bottomRightBadgeProps]);\n\n const defaultTabIndex = useMemo(() => {\n if (!disabled && (onClick \|\| overrideTooltipProps?.content)) {\n return 0;\n }\n return -1;\n }, [disabled, onClick, overrideTooltipProps?.content]);\n\n const overrideTabIndex = tabIndex ?? defaultTabIndex;\n\n const clickHandler = useCallback(\n (event: React.MouseEvent \| React.KeyboardEvent) => {\n event.preventDefault();\n if (onClick) {\n onClick(event, id);\n }\n },\n [onClick, id]\n );\n\n return (\n <div\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.AVATAR, id)}\n className={cx(styles.avatar, styles[size], className)}\n style={sizeStyle}\n data-vibe={ComponentVibeId.AVATAR}\n >\n <ClickableWrapper\n isClickable={!!onClick}\n clickableProps={{\n onClick: clickHandler,\n tabIndex: \"-1\",\n className: styles.clickableWrapper\n }}\n >\n <Tooltip showTrigger={[\"focus\", \"mouseenter\"]} hideTrigger={[\"blur\", \"mouseleave\"]} {...overrideTooltipProps}>\n <div\n className={cx(\n styles.circle,\n getStyle(styles, camelCase(\"circle--\" + type)),\n {\n [styles.disabled]: disabled,\n [styles.square]: square,\n [styles.withoutBorder]: withoutBorder\n },\n avatarContentWrapperClassName\n )}\n aria-hidden={ariaHidden}\n tabIndex={overrideTabIndex}\n style={{ ...backgroundColorStyle }}\n >\n <AvatarContent\n type={type}\n size={size}\n src={src}\n icon={icon}\n text={text}\n ariaLabel={ariaLabel}\n role={role}\n textClassName={textClassName}\n />\n </div>\n {badgesContainer}\n </Tooltip>\n </ClickableWrapper>\n </div>\n );\n};\n\ninterface AvatarStaticProps {\n types: typeof AvatarTypeEnum;\n sizes: typeof AvatarSizeEnum;\n colors: typeof ElementAllowedColorEnum;\n backgroundColors: typeof ElementAllowedColorEnum;\n}\n\nexport default withStaticPropsWithoutForwardRef<AvatarProps, AvatarStaticProps>(Avatar, {\n types: AvatarTypeEnum,\n sizes: AvatarSizeEnum,\n colors: ElementAllowedColorEnum,\n backgroundColors: ElementAllowedColorEnum\n});\n"],"names":["withStaticPropsWithoutForwardRef","_ref","id","_ref$type","type","className","avatarContentWrapperClassName","_ref$textClassName","textClassName","_ref$size","size","src","icon","text","tooltipProps","ariaLabel","_ref$withoutTooltip","withoutTooltip","role","_ref$backgroundColor","backgroundColor","square","disabled","tabIndex","_ref$ariaHidden","ariaHidden","topLeftBadgeProps","topRightBadgeProps","bottomLeftBadgeProps","bottomRightBadgeProps","_ref$withoutBorder","withoutBorder","_ref$customSize","customSize","_ref$customBackground","customBackgroundColor","onClick","dataTestId","backgroundColorStyle","useMemo","getElementColor","sizeStyle","height","width","overrideTooltipProps","Object","assign","content","badgesContainer","badges","isNil","push","React","key","cx","styles","badge","badgeTopLeft","createElement","AvatarBadge","badgeTopRight","badgeBottomLeft","badgeBottomRight","length","defaultTabIndex","overrideTabIndex","clickHandler","useCallback","event","preventDefault","getTestId","ComponentDefaultTestId","AVATAR","avatar","style","ComponentVibeId","ClickableWrapper","isClickable","clickableProps","clickableWrapper","Tooltip","showTrigger","hideTrigger","circle","getStyle","camelCase","_defineProperty","AvatarContent","types","AvatarTypeEnum","sizes","AvatarSizeEnum","colors","ElementAllowedColorEnum","backgroundColors"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-var e={avatar:"avatar_20c41e9a37",large:"large_1e82f0333c",medium:"medium_c654fe2af7",small:"small_dc1ba86053",xs:"xs_21277c1296",clickableWrapper:"clickableWrapper_20bfd84e09",circle:"circle_c95dfc70d0","focus-visible":"focus-visible_ec730f9a2c",circleImg:"circleImg_a340b80432",circleText:"circleText_c725e0e82a",disabled:"disabled_740aa79ac3",square:"square_1f25dc1867",withoutBorder:"withoutBorder_64ce528d7a",badges:"badges_8d9326e559",badge:"badge_bd0851d343",badgeTopLeft:"badgeTopLeft_6420a12f43",badgeTopRight:"badgeTopRight_215ea2bb16",badgeBottomLeft:"badgeBottomLeft_09d73eb2cc",badgeBottomRight:"badgeBottomRight_bdd2d919fe"};!function(e){const n="s_id-dccf983c2f60_3_82_2";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,d.firstChild?d.insertBefore(a,d.firstChild):d.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}('/* stylelint-disable */\n/* stylelint-enable */\n.avatar_20c41e9a37 {\n  position: relative;\n}\n.large_1e82f0333c {\n  height: 50px;\n  width: 50px;\n}\n.medium_c654fe2af7 {\n  height: 32px;\n  width: 32px;\n}\n.small_dc1ba86053 {\n  height: 28px;\n  width: 28px;\n}\n.xs_21277c1296 {\n  height: 20px;\n  width: 20px;\n}\n.clickableWrapper_20bfd84e09 {\n  height: 100%;\n  width: 100%;\n}\n.circle_c95dfc70d0 {\n  height: 100%;\n  width: 100%;\n  position: relative;\n  border: 1px solid;\n  border-radius: 50%;\n  overflow: hidden;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  color: var(--text-color-on-primary);\n}\n.circle_c95dfc70d0:focus {\n  outline: none;\n}\n.circle_c95dfc70d0:focus:focus-visible, .circle_c95dfc70d0:focus.focus-visible_ec730f9a2c {\n  outline: none;\n  z-index: 11;\n  border-radius: 50%;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.circle_c95dfc70d0:focus:focus:not(.focus-visible_ec730f9a2c) {\n  outline: none;\n}\n.circleImg_a340b80432 {\n  border-color: var(--primary-background-color);\n}\n.circleText_c725e0e82a {\n  border-color: var(--layout-border-color);\n}\n.disabled_740aa79ac3:before {\n  content: "";\n  height: 100%;\n  width: 100%;\n  position: absolute;\n  top: 0;\n  opacity: 0.7;\n  background: var(--primary-background-color);\n}\n.square_1f25dc1867 {\n  border-radius: var(--border-radius-small);\n}\n.square_1f25dc1867:focus {\n  outline: none;\n}\n.square_1f25dc1867:focus:focus-visible, .square_1f25dc1867:focus.focus-visible_ec730f9a2c {\n  outline: none;\n  z-index: 11;\n  border-radius: var(--border-radius-small);\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.square_1f25dc1867:focus:focus:not(.focus-visible_ec730f9a2c) {\n  outline: none;\n}\n.withoutBorder_64ce528d7a {\n  border: none;\n}\n.badges_8d9326e559 {\n  position: absolute;\n  top: 50%;\n  left: 50%; /* position the left edge of the element at the middle of the parent */\n  transform: translate(-50%, -50%);\n  display: grid;\n  grid-template-columns: 50% 50%;\n  margin-left: auto;\n  margin-right: auto;\n  height: 110%;\n  width: 110%;\n}\n.badges_8d9326e559 .badge_bd0851d343 {\n  display: flex;\n}\n.badges_8d9326e559 .badgeTopLeft_6420a12f43 {\n  grid-row: 1;\n  grid-column: 1;\n  justify-self: start;\n}\n.badges_8d9326e559 .badgeTopRight_215ea2bb16 {\n  grid-row: 1;\n  grid-column: 2;\n  justify-self: end;\n}\n.badges_8d9326e559 .badgeBottomLeft_09d73eb2cc {\n  grid-row: 2;\n  grid-column: 1;\n  justify-self: start;\n  align-self: end;\n}\n.badges_8d9326e559 .badgeBottomRight_bdd2d919fe {\n  grid-row: 2;\n  grid-column: 2;\n  justify-self: end;\n  align-self: end;\n}');export{e as default};
+var e={avatar:"avatar_d23aeb6b5b",large:"large_50edd0596f",medium:"medium_5dd27a268a",small:"small_176bae17b6",xs:"xs_50ab950fee",clickableWrapper:"clickableWrapper_9d39d60a99",circle:"circle_7db4a5f18a","focus-visible":"focus-visible_87d12d724e",circleImg:"circleImg_b4b0d706c8",circleText:"circleText_830d500b43",disabled:"disabled_93141cf0a3",square:"square_1fe14258f4",withoutBorder:"withoutBorder_722e10db04",badges:"badges_0a53954403",badge:"badge_d4ff0511e1",badgeTopLeft:"badgeTopLeft_173633a052",badgeTopRight:"badgeTopRight_8e56ae8a08",badgeBottomLeft:"badgeBottomLeft_4e97a900cd",badgeBottomRight:"badgeBottomRight_0969762d99"};!function(e){const n="s_id-dccf983c2f60_3_83_0";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,a.firstChild?a.insertBefore(d,a.firstChild):a.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}('/* stylelint-disable */\n/* stylelint-enable */\n.avatar_d23aeb6b5b {\n  position: relative;\n}\n.large_50edd0596f {\n  height: 50px;\n  width: 50px;\n}\n.medium_5dd27a268a {\n  height: 32px;\n  width: 32px;\n}\n.small_176bae17b6 {\n  height: 28px;\n  width: 28px;\n}\n.xs_50ab950fee {\n  height: 20px;\n  width: 20px;\n}\n.clickableWrapper_9d39d60a99 {\n  height: 100%;\n  width: 100%;\n}\n.circle_7db4a5f18a {\n  height: 100%;\n  width: 100%;\n  position: relative;\n  border: 1px solid;\n  border-radius: 50%;\n  overflow: hidden;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  color: var(--text-color-on-primary);\n}\n.circle_7db4a5f18a:focus {\n  outline: none;\n}\n.circle_7db4a5f18a:focus:focus-visible, .circle_7db4a5f18a:focus.focus-visible_87d12d724e {\n  outline: none;\n  z-index: 11;\n  border-radius: 50%;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.circle_7db4a5f18a:focus:focus:not(.focus-visible_87d12d724e) {\n  outline: none;\n}\n.circleImg_b4b0d706c8 {\n  border-color: var(--primary-background-color);\n}\n.circleText_830d500b43 {\n  border-color: var(--layout-border-color);\n}\n.disabled_93141cf0a3:before {\n  content: "";\n  height: 100%;\n  width: 100%;\n  position: absolute;\n  top: 0;\n  opacity: 0.7;\n  background: var(--primary-background-color);\n}\n.square_1fe14258f4 {\n  border-radius: var(--border-radius-small);\n}\n.square_1fe14258f4:focus {\n  outline: none;\n}\n.square_1fe14258f4:focus:focus-visible, .square_1fe14258f4:focus.focus-visible_87d12d724e {\n  outline: none;\n  z-index: 11;\n  border-radius: var(--border-radius-small);\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.square_1fe14258f4:focus:focus:not(.focus-visible_87d12d724e) {\n  outline: none;\n}\n.withoutBorder_722e10db04 {\n  border: none;\n}\n.badges_0a53954403 {\n  position: absolute;\n  top: 50%;\n  left: 50%; /* position the left edge of the element at the middle of the parent */\n  transform: translate(-50%, -50%);\n  display: grid;\n  grid-template-columns: 50% 50%;\n  margin-left: auto;\n  margin-right: auto;\n  height: 110%;\n  width: 110%;\n}\n.badges_0a53954403 .badge_d4ff0511e1 {\n  display: flex;\n}\n.badges_0a53954403 .badgeTopLeft_173633a052 {\n  grid-row: 1;\n  grid-column: 1;\n  justify-self: start;\n}\n.badges_0a53954403 .badgeTopRight_8e56ae8a08 {\n  grid-row: 1;\n  grid-column: 2;\n  justify-self: end;\n}\n.badges_0a53954403 .badgeBottomLeft_4e97a900cd {\n  grid-row: 2;\n  grid-column: 1;\n  justify-self: start;\n  align-self: end;\n}\n.badges_0a53954403 .badgeBottomRight_0969762d99 {\n  grid-row: 2;\n  grid-column: 2;\n  justify-self: end;\n  align-self: end;\n}');export{e as default};
 //# sourceMappingURL=Avatar.module.scss.js.map

package/dist/src/components/Avatar/AvatarBadge.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={badgeLarge:"badgeLarge_20bd6334e2",badgeMedium:"badgeMedium_f86861edb3",badgeSmall:"badgeSmall_b5d6e0fae1",badgeXs:"badgeXs_edcbbc14f0"};!function(e){const d="s_id-e545a08d61b0_3_82_2";if("undefined"!=typeof document){const a=document.head||document.getElementsByTagName("head")[0];if(a.querySelector("#"+d))return;const n=document.createElement("style");n.id=d,a.firstChild?a.insertBefore(n,a.firstChild):a.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[d]=e)}(".badgeLarge_20bd6334e2 {\n  height: 19px;\n  width: 19px;\n}\n\n.badgeMedium_f86861edb3 {\n  height: 13px;\n  width: 13px;\n}\n\n.badgeSmall_b5d6e0fae1,\n.badgeXs_edcbbc14f0 {\n  height: 10px;\n  width: 10px;\n}");export{e as default};
+var e={badgeLarge:"badgeLarge_fdf9e4ffee",badgeMedium:"badgeMedium_b0b390f972",badgeSmall:"badgeSmall_5bd6619691",badgeXs:"badgeXs_438b25e58d"};!function(e){const d="s_id-e545a08d61b0_3_83_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+d))return;const t=document.createElement("style");t.id=d,n.firstChild?n.insertBefore(t,n.firstChild):n.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[d]=e)}(".badgeLarge_fdf9e4ffee {\n  height: 19px;\n  width: 19px;\n}\n\n.badgeMedium_b0b390f972 {\n  height: 13px;\n  width: 13px;\n}\n\n.badgeSmall_5bd6619691,\n.badgeXs_438b25e58d {\n  height: 10px;\n  width: 10px;\n}");export{e as default};
 //# sourceMappingURL=AvatarBadge.module.scss.js.map

package/dist/src/components/Avatar/AvatarContent.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var n={contentImg:"contentImg_f87ae76f99",contentText:"contentText_c9f5c4e902",contentTextLarge:"contentTextLarge_07889263eb",contentTextMedium:"contentTextMedium_009b6e6dd7",contentTextSmall:"contentTextSmall_19a4420e47",contentTextXs:"contentTextXs_57a9dc90a5",contentIconLarge:"contentIconLarge_dc1ba86053",contentIconMedium:"contentIconMedium_445efc7d10",contentIconSmall:"contentIconSmall_5da7ee9bd4"};!function(n){const t="s_id-50188146c7c7_3_82_2";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,e.firstChild?e.insertBefore(o,e.firstChild):e.appendChild(o),o.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=n)}("/* stylelint-disable */\n/* stylelint-enable */\n.contentImg_f87ae76f99 {\n  object-fit: cover;\n  width: 100%;\n  height: 100%;\n}\n.contentText_c9f5c4e902 {\n  font-family: var(--font-family);\n  font-weight: 400;\n  line-height: 21px;\n  letter-spacing: -0.5px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  height: 100%;\n}\n.contentTextLarge_07889263eb {\n  font: var(--font-h3-normal);\n  letter-spacing: var(--letter-spacing-h3-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font-family: var(--font-family) !important;\n}\n.contentTextMedium_009b6e6dd7 {\n  font: var(--font-text1-normal);\n  margin-top: 1px;\n}\n.contentTextSmall_19a4420e47 {\n  margin-top: 1px;\n  font-size: 12px;\n}\n.contentTextXs_57a9dc90a5 {\n  margin-top: 1px;\n  font: var(--font-text3-normal);\n}\n.contentIconLarge_dc1ba86053 {\n  height: 28px;\n  width: 28px;\n}\n.contentIconMedium_445efc7d10 {\n  height: 18px;\n  width: 18px;\n}\n.contentIconSmall_5da7ee9bd4 {\n  height: 12px;\n  width: 12px;\n}");export{n as default};
+var n={contentImg:"contentImg_f3de47465c",contentText:"contentText_598e9dfcf8",contentTextLarge:"contentTextLarge_7aab7d50f0",contentTextMedium:"contentTextMedium_7e14026c7f",contentTextSmall:"contentTextSmall_5da2b509f3",contentTextXs:"contentTextXs_cccd8b84ca",contentIconLarge:"contentIconLarge_176bae17b6",contentIconMedium:"contentIconMedium_eba0ab3feb",contentIconSmall:"contentIconSmall_f93e2c62e9"};!function(n){const t="s_id-50188146c7c7_3_83_0";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,e.firstChild?e.insertBefore(o,e.firstChild):e.appendChild(o),o.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=n)}("/* stylelint-disable */\n/* stylelint-enable */\n.contentImg_f3de47465c {\n  object-fit: cover;\n  width: 100%;\n  height: 100%;\n}\n.contentText_598e9dfcf8 {\n  font-family: var(--font-family);\n  font-weight: 400;\n  line-height: 21px;\n  letter-spacing: -0.5px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n  height: 100%;\n}\n.contentTextLarge_7aab7d50f0 {\n  font: var(--font-h3-normal);\n  letter-spacing: var(--letter-spacing-h3-normal);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  font-family: var(--font-family) !important;\n}\n.contentTextMedium_7e14026c7f {\n  font: var(--font-text1-normal);\n  margin-top: 1px;\n}\n.contentTextSmall_5da2b509f3 {\n  margin-top: 1px;\n  font-size: 12px;\n}\n.contentTextXs_cccd8b84ca {\n  margin-top: 1px;\n  font: var(--font-text3-normal);\n}\n.contentIconLarge_176bae17b6 {\n  height: 28px;\n  width: 28px;\n}\n.contentIconMedium_eba0ab3feb {\n  height: 18px;\n  width: 18px;\n}\n.contentIconSmall_f93e2c62e9 {\n  height: 12px;\n  width: 12px;\n}");export{n as default};
 //# sourceMappingURL=AvatarContent.module.scss.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"AvatarGroup.js","sources":["../../../../src/components/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import React, { type ReactElement, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport { type AvatarProps } from \"../Avatar/Avatar\";\nimport AvatarGroupCounter from \"./AvatarGroupCounter\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { type AvatarSize, type AvatarType } from \"../Avatar/Avatar.types\";\nimport { avatarOnClick } from \"./AvatarGroupHelper\";\nimport { type TooltipProps } from \"~~../Tooltip~~/~~Tooltip~~\";\nimport styles from \"./AvatarGroup.module.scss\";\nimport { type AvatarGroupCounterVisualProps } from \"./AvatarGroup.types\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface AvatarGroupProps extends VibeComponentProps {\n /*\n Class name applied to each avatar.\n /\n avatarClassName?: string;\n /\n The avatars displayed in the group.\n /\n children?: ReactElement<AvatarProps> \| ReactElement<AvatarProps>[];\n /\n The size of the avatars in the group.\n /\n size?: AvatarSize;\n /\n The type of the avatars in the group.\n /\n type?: AvatarType;\n /\n The maximum number of avatars displayed before showing a counter.\n /\n max?: number;\n /\n Props for customizing the counter display.\n /\n counterProps?: AvatarGroupCounterVisualProps;\n /\n Props passed to the Tooltip component. See full options in the [Tooltip documentation](https://vibe.monday.com/?path=/docs/components-tooltip--docs).\n /\n counterTooltipCustomProps?: Partial<TooltipProps>;\n /\n If true, the counter tooltip uses a virtualized list for performance optimization.\n /\n counterTooltipIsVirtualizedList?: boolean;\n /\n If true, the component is disabled and non-interactive.\n */\n disabled?: boolean;\n}\n\nconst AvatarGroup: React.FC<AvatarGroupProps> = ({\n className,\n avatarClassName,\n id,\n children,\n size,\n type,\n max = 5,\n counterProps,\n counterTooltipCustomProps,\n counterTooltipIsVirtualizedList = false,\n disabled\n}) => {\n const { displayAvatars, counterTooltipAvatars } = useMemo(() => {\n if (!children) {\n return {};\n }\n const childrenArray = Array.isArray(children) ? children : [children];\n return {\n displayAvatars: childrenArray.slice(0, max).map((avatar, index) => {\n return React.cloneElement(avatar, {\n key: index,\n ...avatar?.props,\n size: size \|\| avatar?.props?.size,\n type: type \|\| avatar?.props?.type,\n className: cx(styles.avatarContainer, avatarClassName),\n onClick: (event: React.MouseEvent \| React.KeyboardEvent) => avatarOnClick(event, avatar.props),\n disabled\n });\n }),\n counterTooltipAvatars: childrenArray.slice(max)\n };\n }, [avatarClassName, children, disabled, max, size, type]);\n\n if (!children) {\n return null;\n }\n\n return (\n <div className={cx(styles.avatarGroupContainer, className)} id={id} data-vibe={ComponentVibeId.AVATAR_GROUP}>\n {displayAvatars}\n <AvatarGroupCounter\n counterTooltipAvatars={counterTooltipAvatars}\n counterProps={counterProps}\n counterTooltipCustomProps={counterTooltipCustomProps}\n counterTooltipIsVirtualizedList={counterTooltipIsVirtualizedList}\n size={size}\n type={type}\n disabled={disabled}\n />\n </div>\n );\n};\n\nexport default AvatarGroup;\n"],"names":["AvatarGroup","_ref","className","avatarClassName","id","children","size","type","_ref$max","max","counterProps","counterTooltipCustomProps","_ref$counterTooltipIs","counterTooltipIsVirtualizedList","disabled","_useMemo","useMemo","childrenArray","Array","isArray","displayAvatars","slice","map","avatar","index","React","cloneElement","key","props","_a","_b","cx","styles","avatarContainer","onClick","event","avatarOnClick","counterTooltipAvatars","createElement","avatarGroupContainer","ComponentVibeId","AVATAR_GROUP","AvatarGroupCounter"],"mappings":"kQAmDA,IAAMA,EAA0C,SAA/BC,GAYZ,IAXHC,EAASD,EAATC,UACAC,EAAeF,EAAfE,gBACAC,EAAEH,EAAFG,GACAC,EAAQJ,EAARI,SACAC,EAAIL,EAAJK,KACAC,EAAIN,EAAJM,KAAIC,EAAAP,EACJQ,IAAAA,OAAM,IAAHD,EAAG,EAACA,EACPE,EAAYT,EAAZS,aACAC,EAAyBV,EAAzBU,0BAAyBC,EAAAX,EACzBY,gCAAAA,OAAkC,IAAHD,GAAQA,EACvCE,EAAQb,EAARa,SAEAC,EAAkDC,GAAQ,WACxD,IAAKX,EACH,MAAO,GAET,IAAMY,EAAgBC,MAAMC,QAAQd,GAAYA,EAAW,CAACA,GAC5D,MAAO,CACLe,eAAgBH,EAAcI,MAAM,EAAGZ,GAAKa,KAAI,SAACC,EAAQC,WACvD,OAAOC,EAAMC,aAAaH,+BACxBI,IAAKH,GACFD,aAAA,EAAAA,EAAQK,OAAK,CAChBtB,KAAMA,YAAQuB,EAAAN,aAAA,EAAAA,EAAQK,4BAAOtB,MAC7BC,KAAMA,YAAQuB,EAAAP,aAAA,EAAAA,EAAQK,4BAAOrB,MAC7BL,UAAW6B,EAAGC,EAAOC,gBAAiB9B,GACtC+B,QAAS,SAACC,GAA6C,OAAKC,EAAcD,EAAOZ,EAAOK,MAAM,EAC9Fd,SAAAA,IAEJ,IACAuB,sBAAuBpB,EAAcI,MAAMZ,GAE/C,GAAG,CAACN,EAAiBE,EAAUS,EAAUL,EAAKH,EAAMC,IAnB5Ca,EAAcL,EAAdK,eAAgBiB,EAAqBtB,EAArBsB,sBAqBxB,OAAKhC,EAKHoB,EAAKa,cAAA,MAAA,CAAApC,UAAW6B,EAAGC,EAAOO,qBAAsBrC,GAAYE,GAAIA,EAAe,YAAAoC,EAAgBC,cAC5FrB,EACDK,EAAAa,cAACI,EAAkB,CACjBL,sBAAuBA,EACvB3B,aAAcA,EACdC,0BAA2BA,EAC3BE,gCAAiCA,EACjCP,KAAMA,EACNC,KAAMA,EACNO,SAAUA,KAbP,IAiBX"}
1	+ {"version":3,"file":"AvatarGroup.js","sources":["../../../../src/components/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import React, { type ReactElement, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport { type AvatarProps } from \"../Avatar/Avatar\";\nimport AvatarGroupCounter from \"./AvatarGroupCounter\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { type AvatarSize, type AvatarType } from \"../Avatar/Avatar.types\";\nimport { avatarOnClick } from \"./AvatarGroupHelper\";\nimport { type TooltipProps } from \"@vibe/tooltip\";\nimport styles from \"./AvatarGroup.module.scss\";\nimport { type AvatarGroupCounterVisualProps } from \"./AvatarGroup.types\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface AvatarGroupProps extends VibeComponentProps {\n /*\n Class name applied to each avatar.\n /\n avatarClassName?: string;\n /\n The avatars displayed in the group.\n /\n children?: ReactElement<AvatarProps> \| ReactElement<AvatarProps>[];\n /\n The size of the avatars in the group.\n /\n size?: AvatarSize;\n /\n The type of the avatars in the group.\n /\n type?: AvatarType;\n /\n The maximum number of avatars displayed before showing a counter.\n /\n max?: number;\n /\n Props for customizing the counter display.\n /\n counterProps?: AvatarGroupCounterVisualProps;\n /\n Props passed to the Tooltip component. See full options in the [Tooltip documentation](https://vibe.monday.com/?path=/docs/components-tooltip--docs).\n /\n counterTooltipCustomProps?: Partial<TooltipProps>;\n /\n If true, the counter tooltip uses a virtualized list for performance optimization.\n /\n counterTooltipIsVirtualizedList?: boolean;\n /\n If true, the component is disabled and non-interactive.\n */\n disabled?: boolean;\n}\n\nconst AvatarGroup: React.FC<AvatarGroupProps> = ({\n className,\n avatarClassName,\n id,\n children,\n size,\n type,\n max = 5,\n counterProps,\n counterTooltipCustomProps,\n counterTooltipIsVirtualizedList = false,\n disabled\n}) => {\n const { displayAvatars, counterTooltipAvatars } = useMemo(() => {\n if (!children) {\n return {};\n }\n const childrenArray = Array.isArray(children) ? children : [children];\n return {\n displayAvatars: childrenArray.slice(0, max).map((avatar, index) => {\n return React.cloneElement(avatar, {\n key: index,\n ...avatar?.props,\n size: size \|\| avatar?.props?.size,\n type: type \|\| avatar?.props?.type,\n className: cx(styles.avatarContainer, avatarClassName),\n onClick: (event: React.MouseEvent \| React.KeyboardEvent) => avatarOnClick(event, avatar.props),\n disabled\n });\n }),\n counterTooltipAvatars: childrenArray.slice(max)\n };\n }, [avatarClassName, children, disabled, max, size, type]);\n\n if (!children) {\n return null;\n }\n\n return (\n <div className={cx(styles.avatarGroupContainer, className)} id={id} data-vibe={ComponentVibeId.AVATAR_GROUP}>\n {displayAvatars}\n <AvatarGroupCounter\n counterTooltipAvatars={counterTooltipAvatars}\n counterProps={counterProps}\n counterTooltipCustomProps={counterTooltipCustomProps}\n counterTooltipIsVirtualizedList={counterTooltipIsVirtualizedList}\n size={size}\n type={type}\n disabled={disabled}\n />\n </div>\n );\n};\n\nexport default AvatarGroup;\n"],"names":["AvatarGroup","_ref","className","avatarClassName","id","children","size","type","_ref$max","max","counterProps","counterTooltipCustomProps","_ref$counterTooltipIs","counterTooltipIsVirtualizedList","disabled","_useMemo","useMemo","childrenArray","Array","isArray","displayAvatars","slice","map","avatar","index","React","cloneElement","key","props","_a","_b","cx","styles","avatarContainer","onClick","event","avatarOnClick","counterTooltipAvatars","createElement","avatarGroupContainer","ComponentVibeId","AVATAR_GROUP","AvatarGroupCounter"],"mappings":"kQAmDA,IAAMA,EAA0C,SAA/BC,GAYZ,IAXHC,EAASD,EAATC,UACAC,EAAeF,EAAfE,gBACAC,EAAEH,EAAFG,GACAC,EAAQJ,EAARI,SACAC,EAAIL,EAAJK,KACAC,EAAIN,EAAJM,KAAIC,EAAAP,EACJQ,IAAAA,OAAM,IAAHD,EAAG,EAACA,EACPE,EAAYT,EAAZS,aACAC,EAAyBV,EAAzBU,0BAAyBC,EAAAX,EACzBY,gCAAAA,OAAkC,IAAHD,GAAQA,EACvCE,EAAQb,EAARa,SAEAC,EAAkDC,GAAQ,WACxD,IAAKX,EACH,MAAO,GAET,IAAMY,EAAgBC,MAAMC,QAAQd,GAAYA,EAAW,CAACA,GAC5D,MAAO,CACLe,eAAgBH,EAAcI,MAAM,EAAGZ,GAAKa,KAAI,SAACC,EAAQC,WACvD,OAAOC,EAAMC,aAAaH,+BACxBI,IAAKH,GACFD,aAAA,EAAAA,EAAQK,OAAK,CAChBtB,KAAMA,YAAQuB,EAAAN,aAAA,EAAAA,EAAQK,4BAAOtB,MAC7BC,KAAMA,YAAQuB,EAAAP,aAAA,EAAAA,EAAQK,4BAAOrB,MAC7BL,UAAW6B,EAAGC,EAAOC,gBAAiB9B,GACtC+B,QAAS,SAACC,GAA6C,OAAKC,EAAcD,EAAOZ,EAAOK,MAAM,EAC9Fd,SAAAA,IAEJ,IACAuB,sBAAuBpB,EAAcI,MAAMZ,GAE/C,GAAG,CAACN,EAAiBE,EAAUS,EAAUL,EAAKH,EAAMC,IAnB5Ca,EAAcL,EAAdK,eAAgBiB,EAAqBtB,EAArBsB,sBAqBxB,OAAKhC,EAKHoB,EAAKa,cAAA,MAAA,CAAApC,UAAW6B,EAAGC,EAAOO,qBAAsBrC,GAAYE,GAAIA,EAAe,YAAAoC,EAAgBC,cAC5FrB,EACDK,EAAAa,cAACI,EAAkB,CACjBL,sBAAuBA,EACvB3B,aAAcA,EACdC,0BAA2BA,EAC3BE,gCAAiCA,EACjCP,KAAMA,EACNC,KAAMA,EACNO,SAAUA,KAbP,IAiBX"}

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

@@ -1,2 +1,2 @@
-var e={avatarGroupContainer:"avatarGroupContainer_7b04a82fcb",avatarContainer:"avatarContainer_6334a472b8"};!function(e){const a="s_id-0d36779f5b9e_3_82_2";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+a))return;const t=document.createElement("style");t.id=a,n.firstChild?n.insertBefore(t,n.firstChild):n.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[a]=e)}(".avatarGroupContainer_7b04a82fcb {\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  position: relative;\n  padding: 0;\n  margin: 0;\n}\n\n.avatarContainer_6334a472b8 {\n  margin-left: calc(-1 * var(--spacing-small));\n}");export{e as default};
+var e={avatarGroupContainer:"avatarGroupContainer_ab35af378b",avatarContainer:"avatarContainer_058dc27832"};!function(e){const a="s_id-0d36779f5b9e_3_83_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+a))return;const t=document.createElement("style");t.id=a,n.firstChild?n.insertBefore(t,n.firstChild):n.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[a]=e)}(".avatarGroupContainer_ab35af378b {\n  display: flex;\n  flex-direction: row;\n  flex-wrap: wrap;\n  position: relative;\n  padding: 0;\n  margin: 0;\n}\n\n.avatarContainer_058dc27832 {\n  margin-left: calc(-1 * var(--spacing-small));\n}");export{e as default};
 //# sourceMappingURL=AvatarGroup.module.scss.js.map

package/dist/src/components/AvatarGroup/AvatarGroupCounter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AvatarGroupCounter.js","sources":["../../../../src/components/AvatarGroup/AvatarGroupCounter.tsx"],"sourcesContent":["import React, { type ReactElement, useCallback, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { type AvatarProps } from \"../Avatar/Avatar\";\nimport Counter from \"../Counter/Counter\";\nimport MenuButton from \"../MenuButton/MenuButton\";\nimport Menu from \"../Menu/Menu/Menu\";\nimport AvatarMenuItem from \"../Menu/MenuItem/AvatarMenuItem\";\nimport AvatarGroupCounterTooltipContainer from \"./AvatarGroupCounterTooltipContainer\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { type AvatarSize, type AvatarType } from \"../Avatar/Avatar.types\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { type AvatarGroupCounterVisualProps } from \"./AvatarGroup.types\";\nimport { type TooltipProps } from \"~~../Tooltip~~/~~Tooltip~~\";\nimport { avatarOnClick } from \"./AvatarGroupHelper\";\nimport styles from \"./AvatarGroupCounter.module.scss\";\nimport { AVATAR_GROUP_COUNTER_AVATAR_SIZE } from \"./AvatarGroupConstants\";\n\nexport interface AvatarGroupCounterProps extends VibeComponentProps {\n /*\n The list of avatars hidden behind the counter.\n /\n counterTooltipAvatars?: ReactElement<AvatarProps>[];\n /\n Props for customizing the counter appearance.\n /\n counterProps?: AvatarGroupCounterVisualProps;\n /\n Props for customizing the counter tooltip.\n /\n counterTooltipCustomProps?: Partial<TooltipProps>;\n /\n If true, the counter tooltip uses a virtualized list for performance optimization.\n /\n counterTooltipIsVirtualizedList?: boolean;\n /\n The size of the counter.\n /\n size?: AvatarSize;\n /\n The type of the avatars in the counter.\n /\n type?: AvatarType;\n /\n The label of the counter for accessibility.\n /\n counterAriaLabel?: string;\n /\n If true, the counter is disabled and non-interactive.\n /\n disabled?: boolean;\n}\n\nconst AvatarGroupCounter: React.FC<AvatarGroupCounterProps> = ({\n counterTooltipAvatars = [],\n counterProps,\n counterTooltipCustomProps,\n counterTooltipIsVirtualizedList = false,\n size = \"medium\",\n type,\n counterAriaLabel,\n disabled\n}: AvatarGroupCounterProps) => {\n const {\n color: counterColor = \"light\",\n count: counterValue = counterTooltipAvatars.length,\n prefix: counterPrefix = \"+\",\n maxDigits: counterMaxDigits = 3,\n ariaLabelItemsName: counterAriaLabelItemsName = \"items\",\n noAnimation,\n dialogContainerSelector,\n tabIndex: counterTabIndex = 0\n } = counterProps \|\| {};\n\n const counterSizeStyle = getStyle(styles, size?.toString());\n const counterColorStyle = styles[counterColor];\n\n const focusPrevPlaceholderRef = useRef(null);\n const focusNextPlaceholderRef = useRef(null);\n const counterContainerRef = useRef(null);\n const counterComponent = useCallback(() => {\n return (\n <Counter\n color={counterColor}\n count={counterValue}\n prefix={counterPrefix}\n maxDigits={counterMaxDigits}\n ariaLabel={counterAriaLabel ? counterAriaLabel : `Tab for more ${counterAriaLabelItemsName}`}\n noAnimation={noAnimation}\n counterClassName={cx({ [styles.disabled]: disabled })}\n size={size === \"xs\" ? \"xs\" : undefined}\n />\n );\n }, [\n counterAriaLabel,\n counterAriaLabelItemsName,\n counterColor,\n counterMaxDigits,\n counterPrefix,\n counterValue,\n disabled,\n noAnimation\n ]);\n\n if (!counterTooltipAvatars.length && !counterValue) {\n return null;\n }\n\n if (disabled) {\n return (\n <div\n ref={counterContainerRef}\n className={cx(styles.counterContainer, styles.disabled, counterSizeStyle, counterColorStyle)}\n >\n {counterComponent()}\n </div>\n );\n }\n\n const areAvatarsClickable = counterTooltipAvatars.some(a => a.props?.onClick);\n if (areAvatarsClickable) {\n return (\n <MenuButton\n component={counterComponent}\n zIndex={1}\n className={cx(styles.counterContainer, counterSizeStyle, counterColorStyle)}\n ariaLabel={counterAriaLabel ? counterAriaLabel : `${counterValue} additional ${counterAriaLabelItemsName}`}\n dialogContainerSelector={dialogContainerSelector}\n >\n <Menu id=\"menu\" size={Menu.sizes.MEDIUM} className={styles.menu} focusItemIndexOnMount={0}>\n {counterTooltipAvatars.map((avatar, index) => {\n return (\n // eslint-disable-next-line react/jsx-key\n <AvatarMenuItem\n menuItemProps={{\n key: avatar.props?.id \|\| String(index),\n title: (avatar.props?.tooltipProps?.content as string) \|\| avatar?.props?.ariaLabel,\n onClick: (event: React.MouseEvent \| React.KeyboardEvent) => avatarOnClick(event, avatar.props)\n }}\n avatarProps={{\n ...avatar.props,\n customSize: AVATAR_GROUP_COUNTER_AVATAR_SIZE,\n ariaLabel: \"\",\n tabIndex: -1\n }}\n />\n );\n })}\n </Menu>\n </MenuButton>\n );\n }\n\n return (\n <AvatarGroupCounterTooltipContainer\n focusPrevPlaceholderRef={focusPrevPlaceholderRef}\n focusNextPlaceholderRef={focusNextPlaceholderRef}\n counterContainerRef={counterContainerRef}\n avatars={counterTooltipAvatars}\n counterTooltipCustomProps={counterTooltipCustomProps}\n counterTooltipIsVirtualizedList={counterTooltipIsVirtualizedList}\n type={type}\n >\n <div tabIndex={-1} ref={focusPrevPlaceholderRef} />\n {/ eslint-disable jsx-a11y/no-noninteractive-tabindex /}\n <div\n tabIndex={counterTabIndex}\n className={cx(styles.counterContainer, counterSizeStyle, counterColorStyle)}\n ref={counterContainerRef}\n >\n {/ eslint-enable jsx-a11y/no-noninteractive-tabindex */}\n {counterComponent()}\n <div tabIndex={-1} ref={focusNextPlaceholderRef} />\n </div>\n </AvatarGroupCounterTooltipContainer>\n );\n};\n\nexport default AvatarGroupCounter;\n"],"names":["AvatarGroupCounter","_ref","_ref$counterTooltipAv","counterTooltipAvatars","counterTooltipCustomProps","_ref$counterTooltipIs","counterTooltipIsVirtualizedList","_ref$size","size","type","counterAriaLabel","disabled","_ref2","counterProps","_ref2$color","color","counterColor","_ref2$count","count","counterValue","length","_ref2$prefix","prefix","counterPrefix","_ref2$maxDigits","maxDigits","counterMaxDigits","_ref2$ariaLabelItemsN","ariaLabelItemsName","counterAriaLabelItemsName","noAnimation","dialogContainerSelector","_ref2$tabIndex","tabIndex","counterTabIndex","counterSizeStyle","getStyle","styles","counterColorStyle","focusPrevPlaceholderRef","useRef","focusNextPlaceholderRef","counterContainerRef","counterComponent","useCallback","React","createElement","Counter","ariaLabel","concat","counterClassName","cx","_defineProperty","undefined","ref","className","counterContainer","some","a","_a","props","onClick","MenuButton","component","zIndex","Menu","id","sizes","MEDIUM","menu","focusItemIndexOnMount","map","avatar","index","AvatarMenuItem","menuItemProps","key","String","title","_c","_b","tooltipProps","content","_d","event","avatarOnClick","avatarProps","customSize","AVATAR_GROUP_COUNTER_AVATAR_SIZE","AvatarGroupCounterTooltipContainer","avatars"],"mappings":"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"}
1	+ {"version":3,"file":"AvatarGroupCounter.js","sources":["../../../../src/components/AvatarGroup/AvatarGroupCounter.tsx"],"sourcesContent":["import React, { type ReactElement, useCallback, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { type AvatarProps } from \"../Avatar/Avatar\";\nimport Counter from \"../Counter/Counter\";\nimport MenuButton from \"../MenuButton/MenuButton\";\nimport Menu from \"../Menu/Menu/Menu\";\nimport AvatarMenuItem from \"../Menu/MenuItem/AvatarMenuItem\";\nimport AvatarGroupCounterTooltipContainer from \"./AvatarGroupCounterTooltipContainer\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { type AvatarSize, type AvatarType } from \"../Avatar/Avatar.types\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { type AvatarGroupCounterVisualProps } from \"./AvatarGroup.types\";\nimport { type TooltipProps } from \"@vibe/tooltip\";\nimport { avatarOnClick } from \"./AvatarGroupHelper\";\nimport styles from \"./AvatarGroupCounter.module.scss\";\nimport { AVATAR_GROUP_COUNTER_AVATAR_SIZE } from \"./AvatarGroupConstants\";\n\nexport interface AvatarGroupCounterProps extends VibeComponentProps {\n /*\n The list of avatars hidden behind the counter.\n /\n counterTooltipAvatars?: ReactElement<AvatarProps>[];\n /\n Props for customizing the counter appearance.\n /\n counterProps?: AvatarGroupCounterVisualProps;\n /\n Props for customizing the counter tooltip.\n /\n counterTooltipCustomProps?: Partial<TooltipProps>;\n /\n If true, the counter tooltip uses a virtualized list for performance optimization.\n /\n counterTooltipIsVirtualizedList?: boolean;\n /\n The size of the counter.\n /\n size?: AvatarSize;\n /\n The type of the avatars in the counter.\n /\n type?: AvatarType;\n /\n The label of the counter for accessibility.\n /\n counterAriaLabel?: string;\n /\n If true, the counter is disabled and non-interactive.\n /\n disabled?: boolean;\n}\n\nconst AvatarGroupCounter: React.FC<AvatarGroupCounterProps> = ({\n counterTooltipAvatars = [],\n counterProps,\n counterTooltipCustomProps,\n counterTooltipIsVirtualizedList = false,\n size = \"medium\",\n type,\n counterAriaLabel,\n disabled\n}: AvatarGroupCounterProps) => {\n const {\n color: counterColor = \"light\",\n count: counterValue = counterTooltipAvatars.length,\n prefix: counterPrefix = \"+\",\n maxDigits: counterMaxDigits = 3,\n ariaLabelItemsName: counterAriaLabelItemsName = \"items\",\n noAnimation,\n dialogContainerSelector,\n tabIndex: counterTabIndex = 0\n } = counterProps \|\| {};\n\n const counterSizeStyle = getStyle(styles, size?.toString());\n const counterColorStyle = styles[counterColor];\n\n const focusPrevPlaceholderRef = useRef(null);\n const focusNextPlaceholderRef = useRef(null);\n const counterContainerRef = useRef(null);\n const counterComponent = useCallback(() => {\n return (\n <Counter\n color={counterColor}\n count={counterValue}\n prefix={counterPrefix}\n maxDigits={counterMaxDigits}\n ariaLabel={counterAriaLabel ? counterAriaLabel : `Tab for more ${counterAriaLabelItemsName}`}\n noAnimation={noAnimation}\n counterClassName={cx({ [styles.disabled]: disabled })}\n size={size === \"xs\" ? \"xs\" : undefined}\n />\n );\n }, [\n counterAriaLabel,\n counterAriaLabelItemsName,\n counterColor,\n counterMaxDigits,\n counterPrefix,\n counterValue,\n disabled,\n noAnimation\n ]);\n\n if (!counterTooltipAvatars.length && !counterValue) {\n return null;\n }\n\n if (disabled) {\n return (\n <div\n ref={counterContainerRef}\n className={cx(styles.counterContainer, styles.disabled, counterSizeStyle, counterColorStyle)}\n >\n {counterComponent()}\n </div>\n );\n }\n\n const areAvatarsClickable = counterTooltipAvatars.some(a => a.props?.onClick);\n if (areAvatarsClickable) {\n return (\n <MenuButton\n component={counterComponent}\n zIndex={1}\n className={cx(styles.counterContainer, counterSizeStyle, counterColorStyle)}\n ariaLabel={counterAriaLabel ? counterAriaLabel : `${counterValue} additional ${counterAriaLabelItemsName}`}\n dialogContainerSelector={dialogContainerSelector}\n >\n <Menu id=\"menu\" size={Menu.sizes.MEDIUM} className={styles.menu} focusItemIndexOnMount={0}>\n {counterTooltipAvatars.map((avatar, index) => {\n return (\n // eslint-disable-next-line react/jsx-key\n <AvatarMenuItem\n menuItemProps={{\n key: avatar.props?.id \|\| String(index),\n title: (avatar.props?.tooltipProps?.content as string) \|\| avatar?.props?.ariaLabel,\n onClick: (event: React.MouseEvent \| React.KeyboardEvent) => avatarOnClick(event, avatar.props)\n }}\n avatarProps={{\n ...avatar.props,\n customSize: AVATAR_GROUP_COUNTER_AVATAR_SIZE,\n ariaLabel: \"\",\n tabIndex: -1\n }}\n />\n );\n })}\n </Menu>\n </MenuButton>\n );\n }\n\n return (\n <AvatarGroupCounterTooltipContainer\n focusPrevPlaceholderRef={focusPrevPlaceholderRef}\n focusNextPlaceholderRef={focusNextPlaceholderRef}\n counterContainerRef={counterContainerRef}\n avatars={counterTooltipAvatars}\n counterTooltipCustomProps={counterTooltipCustomProps}\n counterTooltipIsVirtualizedList={counterTooltipIsVirtualizedList}\n type={type}\n >\n <div tabIndex={-1} ref={focusPrevPlaceholderRef} />\n {/ eslint-disable jsx-a11y/no-noninteractive-tabindex /}\n <div\n tabIndex={counterTabIndex}\n className={cx(styles.counterContainer, counterSizeStyle, counterColorStyle)}\n ref={counterContainerRef}\n >\n {/ eslint-enable jsx-a11y/no-noninteractive-tabindex */}\n {counterComponent()}\n <div tabIndex={-1} ref={focusNextPlaceholderRef} />\n </div>\n </AvatarGroupCounterTooltipContainer>\n );\n};\n\nexport default AvatarGroupCounter;\n"],"names":["AvatarGroupCounter","_ref","_ref$counterTooltipAv","counterTooltipAvatars","counterTooltipCustomProps","_ref$counterTooltipIs","counterTooltipIsVirtualizedList","_ref$size","size","type","counterAriaLabel","disabled","_ref2","counterProps","_ref2$color","color","counterColor","_ref2$count","count","counterValue","length","_ref2$prefix","prefix","counterPrefix","_ref2$maxDigits","maxDigits","counterMaxDigits","_ref2$ariaLabelItemsN","ariaLabelItemsName","counterAriaLabelItemsName","noAnimation","dialogContainerSelector","_ref2$tabIndex","tabIndex","counterTabIndex","counterSizeStyle","getStyle","styles","counterColorStyle","focusPrevPlaceholderRef","useRef","focusNextPlaceholderRef","counterContainerRef","counterComponent","useCallback","React","createElement","Counter","ariaLabel","concat","counterClassName","cx","_defineProperty","undefined","ref","className","counterContainer","some","a","_a","props","onClick","MenuButton","component","zIndex","Menu","id","sizes","MEDIUM","menu","focusItemIndexOnMount","map","avatar","index","AvatarMenuItem","menuItemProps","key","String","title","_c","_b","tooltipProps","content","_d","event","avatarOnClick","avatarProps","customSize","AVATAR_GROUP_COUNTER_AVATAR_SIZE","AvatarGroupCounterTooltipContainer","avatars"],"mappings":"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"}

package/dist/src/components/AvatarGroup/AvatarGroupCounter.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var n={counterContainer:"counterContainer_2e10c64923","focus-visible":"focus-visible_41f808a996",xs:"xs_c6747885f6",small:"small_645343446b",medium:"medium_5c470c2c0d",large:"large_791223a99c",primary:"primary_7c1961db7b",dark:"dark_3c35a4a500",negative:"negative_04264b05ac",light:"light_0b21ba23a9",disabled:"disabled_5f1c2f795a",menu:"menu_764e8b1a61"};!function(n){const e="s_id-7f36163b89a3_3_82_2";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+e))return;const r=document.createElement("style");r.id=e,o.firstChild?o.insertBefore(r,o.firstChild):o.appendChild(r),r.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}("/* stylelint-disable */\n/* stylelint-enable */\n.counterContainer_2e10c64923.counterContainer_2e10c64923 {\n  background: var(--ui-background-color);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  margin-left: calc(-1 * var(--spacing-small));\n  z-index: 1;\n  border: 1px solid var(--primary-background-color);\n}\n.counterContainer_2e10c64923.counterContainer_2e10c64923:focus-visible, .counterContainer_2e10c64923.counterContainer_2e10c64923.focus-visible_41f808a996 { /* stylelint-disable-line selector-class-pattern */\n  outline: none;\n}\n.counterContainer_2e10c64923.counterContainer_2e10c64923:focus-visible:focus-visible, .counterContainer_2e10c64923.counterContainer_2e10c64923:focus-visible.focus-visible_41f808a996, .counterContainer_2e10c64923.counterContainer_2e10c64923.focus-visible_41f808a996:focus-visible, .counterContainer_2e10c64923.counterContainer_2e10c64923.focus-visible_41f808a996.focus-visible_41f808a996 {\n  outline: none;\n  z-index: 11;\n  border-radius: 50%;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.counterContainer_2e10c64923.counterContainer_2e10c64923:focus-visible:focus:not(.focus-visible_41f808a996), .counterContainer_2e10c64923.counterContainer_2e10c64923.focus-visible_41f808a996:focus:not(.focus-visible_41f808a996) {\n  outline: none;\n}\n.counterContainer_2e10c64923.counterContainer_2e10c64923.xs_c6747885f6 {\n  height: 20px;\n  min-width: 20px;\n  border-radius: 10px;\n  padding: 0 1px;\n}\n.counterContainer_2e10c64923.counterContainer_2e10c64923.small_645343446b {\n  height: 28px;\n  min-width: 28px;\n  border-radius: 14px;\n  padding: 0 1px;\n}\n.counterContainer_2e10c64923.counterContainer_2e10c64923.medium_5c470c2c0d {\n  height: 32px;\n  min-width: 32px;\n  border-radius: 16px;\n  padding: 0 2px;\n}\n.counterContainer_2e10c64923.counterContainer_2e10c64923.large_791223a99c {\n  height: 50px;\n  min-width: 50px;\n  border-radius: 25px;\n  padding: 0 var(--spacing-xs);\n}\n.counterContainer_2e10c64923.counterContainer_2e10c64923.primary_7c1961db7b {\n  color: var(--text-color-on-primary);\n  background-color: var(--primary-color);\n}\n.counterContainer_2e10c64923.counterContainer_2e10c64923.dark_3c35a4a500 {\n  color: var(--text-color-on-inverted);\n  background-color: var(--inverted-color-background);\n}\n.counterContainer_2e10c64923.counterContainer_2e10c64923.negative_04264b05ac {\n  color: var(--text-color-on-primary);\n  background-color: var(--negative-color);\n}\n.counterContainer_2e10c64923.counterContainer_2e10c64923.light_0b21ba23a9 {\n  color: var(--primary-text-color);\n  background-color: var(--ui-background-color);\n}\n.counterContainer_2e10c64923.counterContainer_2e10c64923 .disabled_5f1c2f795a, .counterContainer_2e10c64923.counterContainer_2e10c64923.disabled_5f1c2f795a {\n  background-color: var(--disabled-background-color);\n  color: var(--disabled-text-color);\n}\n.menu_764e8b1a61 {\n  max-height: 300px;\n  overflow-y: auto;\n  overflow-x: hidden;\n}\n.menu_764e8b1a61::-webkit-scrollbar {\n  width: 4px;\n  height: 6px;\n}\n.menu_764e8b1a61::-webkit-scrollbar-thumb {\n  background-color: var(--ui-border-color);\n  border-radius: 4px;\n}");export{n as default};
+var n={counterContainer:"counterContainer_fc8963a05d","focus-visible":"focus-visible_e1b181e93a",xs:"xs_7bdcfd389d",small:"small_196911d982",medium:"medium_3424b427cd",large:"large_9be4bd9993",primary:"primary_22f0915d06",dark:"dark_87d9c1cac3",negative:"negative_e7b526ef0d",light:"light_31c144dee6",disabled:"disabled_c4b8f5a933",menu:"menu_6c4b380765"};!function(n){const e="s_id-7f36163b89a3_3_83_0";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+e))return;const r=document.createElement("style");r.id=e,o.firstChild?o.insertBefore(r,o.firstChild):o.appendChild(r),r.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}("/* stylelint-disable */\n/* stylelint-enable */\n.counterContainer_fc8963a05d.counterContainer_fc8963a05d {\n  background: var(--ui-background-color);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  margin-left: calc(-1 * var(--spacing-small));\n  z-index: 1;\n  border: 1px solid var(--primary-background-color);\n}\n.counterContainer_fc8963a05d.counterContainer_fc8963a05d:focus-visible, .counterContainer_fc8963a05d.counterContainer_fc8963a05d.focus-visible_e1b181e93a { /* stylelint-disable-line selector-class-pattern */\n  outline: none;\n}\n.counterContainer_fc8963a05d.counterContainer_fc8963a05d:focus-visible:focus-visible, .counterContainer_fc8963a05d.counterContainer_fc8963a05d:focus-visible.focus-visible_e1b181e93a, .counterContainer_fc8963a05d.counterContainer_fc8963a05d.focus-visible_e1b181e93a:focus-visible, .counterContainer_fc8963a05d.counterContainer_fc8963a05d.focus-visible_e1b181e93a.focus-visible_e1b181e93a {\n  outline: none;\n  z-index: 11;\n  border-radius: 50%;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.counterContainer_fc8963a05d.counterContainer_fc8963a05d:focus-visible:focus:not(.focus-visible_e1b181e93a), .counterContainer_fc8963a05d.counterContainer_fc8963a05d.focus-visible_e1b181e93a:focus:not(.focus-visible_e1b181e93a) {\n  outline: none;\n}\n.counterContainer_fc8963a05d.counterContainer_fc8963a05d.xs_7bdcfd389d {\n  height: 20px;\n  min-width: 20px;\n  border-radius: 10px;\n  padding: 0 1px;\n}\n.counterContainer_fc8963a05d.counterContainer_fc8963a05d.small_196911d982 {\n  height: 28px;\n  min-width: 28px;\n  border-radius: 14px;\n  padding: 0 1px;\n}\n.counterContainer_fc8963a05d.counterContainer_fc8963a05d.medium_3424b427cd {\n  height: 32px;\n  min-width: 32px;\n  border-radius: 16px;\n  padding: 0 2px;\n}\n.counterContainer_fc8963a05d.counterContainer_fc8963a05d.large_9be4bd9993 {\n  height: 50px;\n  min-width: 50px;\n  border-radius: 25px;\n  padding: 0 var(--spacing-xs);\n}\n.counterContainer_fc8963a05d.counterContainer_fc8963a05d.primary_22f0915d06 {\n  color: var(--text-color-on-primary);\n  background-color: var(--primary-color);\n}\n.counterContainer_fc8963a05d.counterContainer_fc8963a05d.dark_87d9c1cac3 {\n  color: var(--text-color-on-inverted);\n  background-color: var(--inverted-color-background);\n}\n.counterContainer_fc8963a05d.counterContainer_fc8963a05d.negative_e7b526ef0d {\n  color: var(--text-color-on-primary);\n  background-color: var(--negative-color);\n}\n.counterContainer_fc8963a05d.counterContainer_fc8963a05d.light_31c144dee6 {\n  color: var(--primary-text-color);\n  background-color: var(--ui-background-color);\n}\n.counterContainer_fc8963a05d.counterContainer_fc8963a05d .disabled_c4b8f5a933, .counterContainer_fc8963a05d.counterContainer_fc8963a05d.disabled_c4b8f5a933 {\n  background-color: var(--disabled-background-color);\n  color: var(--disabled-text-color);\n}\n.menu_6c4b380765 {\n  max-height: 300px;\n  overflow-y: auto;\n  overflow-x: hidden;\n}\n.menu_6c4b380765::-webkit-scrollbar {\n  width: 4px;\n  height: 6px;\n}\n.menu_6c4b380765::-webkit-scrollbar-thumb {\n  background-color: var(--ui-border-color);\n  border-radius: 4px;\n}");export{n as default};
 //# sourceMappingURL=AvatarGroupCounter.module.scss.js.map

package/dist/src/components/AvatarGroup/AvatarGroupCounterTooltipContainer.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{slicedToArray as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import o,{useState as t,useRef as r,useMemo as n,useCallback as i}from"react";import l from"../Tooltip/Tooltip.js";import a from"./AvatarGroupCounterTooltipContent.js";import{useTooltipContentTabNavigation as s}from"./AvatarGroupCounterTooltipHelper.js";import{AVATAR_GROUP_COUNTER_TOOLTIP_SHOW_DELAY as u}from"./AvatarGroupConstants.js";var c=function(c){var p=c.focusPrevPlaceholderRef,f=c.focusNextPlaceholderRef,d=c.counterContainerRef,m=c.children,v=void 0===m?[]:m,T=c.avatars,C=void 0===T?[]:T,h=c.type,g=c.className,P=c.counterTooltipCustomProps,R=c.counterTooltipIsVirtualizedList,b=void 0!==R&&R,j=t(!1),y=e(j,2),A=y[0],N=y[1],V=r(null),x=n((function(){return(null==P?void 0:P.content)||o.createElement(a,{avatars:C,type:h,className:g,isVirtualizedList:b,tooltipContentContainerRef:V})}),[C,g,null==P?void 0:P.content,b,h]);s({counterContainerRef:d,tooltipContentContainerRef:V,focusPrevPlaceholderRef:p,focusNextPlaceholderRef:f,setIsKeyboardTooltipVisible:N,isKeyboardTooltipVisible:A});var E=i((function(){N(!1)}),[]);return(null==C?void 0:C.length)||(null==P?void 0:P.content)?o.createElement(l,Object.assign({open:A,hideDelay:u,showTrigger:["mouseenter"],hideTrigger:["mouseleave"],onTooltipHide:E},P||{},{content:x}),v):o.createElement(o.Fragment,null,v)};export{c as default};
+import{slicedToArray as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import o,{useState as t,useRef as r,useMemo as n,useCallback as i}from"react";import l from"./AvatarGroupCounterTooltipContent.js";import{useTooltipContentTabNavigation as a}from"./AvatarGroupCounterTooltipHelper.js";import{AVATAR_GROUP_COUNTER_TOOLTIP_SHOW_DELAY as s}from"./AvatarGroupConstants.js";import u from"../../../components/tooltip/dist/Tooltip/Tooltip.js";var p=function(p){var c=p.focusPrevPlaceholderRef,d=p.focusNextPlaceholderRef,f=p.counterContainerRef,m=p.children,v=void 0===m?[]:m,T=p.avatars,C=void 0===T?[]:T,h=p.type,g=p.className,P=p.counterTooltipCustomProps,R=p.counterTooltipIsVirtualizedList,b=void 0!==R&&R,j=t(!1),y=e(j,2),A=y[0],N=y[1],V=r(null),x=n((function(){return(null==P?void 0:P.content)||o.createElement(l,{avatars:C,type:h,className:g,isVirtualizedList:b,tooltipContentContainerRef:V})}),[C,g,null==P?void 0:P.content,b,h]);a({counterContainerRef:f,tooltipContentContainerRef:V,focusPrevPlaceholderRef:c,focusNextPlaceholderRef:d,setIsKeyboardTooltipVisible:N,isKeyboardTooltipVisible:A});var E=i((function(){N(!1)}),[]);return(null==C?void 0:C.length)||(null==P?void 0:P.content)?o.createElement(u,Object.assign({open:A,hideDelay:s,showTrigger:["mouseenter"],hideTrigger:["mouseleave"],onTooltipHide:E},P||{},{content:x}),v):o.createElement(o.Fragment,null,v)};export{p as default};
 //# sourceMappingURL=AvatarGroupCounterTooltipContainer.js.map

package/dist/src/components/AvatarGroup/AvatarGroupCounterTooltipContainer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AvatarGroupCounterTooltipContainer.js","sources":["../../../../src/components/AvatarGroup/AvatarGroupCounterTooltipContainer.tsx"],"sourcesContent":["import React, { type ReactElement, type RefObject, useCallback, useMemo, useRef, useState } from \"react\";\nimport Tooltip, { type TooltipProps } from \"~~../Tooltip~~/~~Tooltip~~\";\nimport { type AvatarProps } from \"../Avatar/Avatar\";\nimport AvatarGroupCounterTooltipContent from \"./AvatarGroupCounterTooltipContent\";\nimport { useTooltipContentTabNavigation } from \"./AvatarGroupCounterTooltipHelper\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { type AvatarType } from \"../Avatar/Avatar.types\";\nimport { AVATAR_GROUP_COUNTER_TOOLTIP_SHOW_DELAY } from \"./AvatarGroupConstants\";\n\nexport interface AvatarGroupCounterTooltipContainerProps extends VibeComponentProps {\n /*\n The type of avatars displayed in the tooltip.\n /\n type?: AvatarType;\n /\n The counter element and focus placeholders.\n /\n children?: ReactElement[];\n /\n The list of avatars displayed inside the tooltip.\n /\n avatars?: ReactElement<AvatarProps>[];\n /\n Props passed to the Tooltip component. See full options in the [Tooltip documentation](https://vibe.monday.com/?path=/docs/components-tooltip--docs).\n /\n counterTooltipCustomProps?: Partial<TooltipProps>;\n /\n If true, the tooltip uses a virtualized list for performance optimization.\n /\n counterTooltipIsVirtualizedList?: boolean;\n /\n Ref for the element before the tooltip content, used for keyboard navigation.\n /\n focusPrevPlaceholderRef?: RefObject<HTMLDivElement>;\n /\n Ref for the element after the tooltip content, used for keyboard navigation.\n /\n focusNextPlaceholderRef?: RefObject<HTMLDivElement>;\n /\n Ref for the counter container element.\n */\n counterContainerRef?: RefObject<HTMLDivElement>;\n}\n\nconst AvatarGroupCounterTooltipContainer: React.FC<AvatarGroupCounterTooltipContainerProps> = ({\n focusPrevPlaceholderRef,\n focusNextPlaceholderRef,\n counterContainerRef,\n children = [],\n avatars = [],\n type,\n className,\n counterTooltipCustomProps,\n counterTooltipIsVirtualizedList = false\n}) => {\n const [isKeyboardTooltipVisible, setIsKeyboardTooltipVisible] = useState(false);\n const tooltipContentContainerRef = useRef(null);\n const tooltipContent = useMemo(\n () =>\n counterTooltipCustomProps?.content \|\| (\n <AvatarGroupCounterTooltipContent\n avatars={avatars}\n type={type}\n className={className}\n isVirtualizedList={counterTooltipIsVirtualizedList}\n tooltipContentContainerRef={tooltipContentContainerRef}\n />\n ),\n [avatars, className, counterTooltipCustomProps?.content, counterTooltipIsVirtualizedList, type]\n );\n\n useTooltipContentTabNavigation({\n counterContainerRef,\n tooltipContentContainerRef,\n focusPrevPlaceholderRef,\n focusNextPlaceholderRef,\n setIsKeyboardTooltipVisible,\n isKeyboardTooltipVisible\n });\n\n // Tooltip props\n const onHide = useCallback(() => {\n setIsKeyboardTooltipVisible(false);\n }, []);\n\n if (!avatars?.length && !counterTooltipCustomProps?.content) {\n return <>{children}</>;\n }\n return (\n <Tooltip\n open={isKeyboardTooltipVisible}\n hideDelay={AVATAR_GROUP_COUNTER_TOOLTIP_SHOW_DELAY}\n showTrigger={[\"mouseenter\"]}\n hideTrigger={[\"mouseleave\"]}\n onTooltipHide={onHide}\n {...(counterTooltipCustomProps \|\| {})}\n content={tooltipContent}\n >\n {children}\n </Tooltip>\n );\n};\n\nexport default AvatarGroupCounterTooltipContainer;\n"],"names":["AvatarGroupCounterTooltipContainer","_ref","focusPrevPlaceholderRef","focusNextPlaceholderRef","counterContainerRef","_ref$children","children","_ref$avatars","avatars","type","className","counterTooltipCustomProps","_ref$counterTooltipIs","counterTooltipIsVirtualizedList","_useState","useState","_useState2","_slicedToArray","isKeyboardTooltipVisible","setIsKeyboardTooltipVisible","tooltipContentContainerRef","useRef","tooltipContent","useMemo","content","React","createElement","AvatarGroupCounterTooltipContent","isVirtualizedList","useTooltipContentTabNavigation","onHide","useCallback","length","Tooltip","open","hideDelay","AVATAR_GROUP_COUNTER_TOOLTIP_SHOW_DELAY","showTrigger","hideTrigger","onTooltipHide","Fragment"],"mappings":"~~iaA4CA~~,IAAMA,EAAwF,SAAtDC,GAUnC,IATHC,EAAuBD,EAAvBC,wBACAC,EAAuBF,EAAvBE,wBACAC,EAAmBH,EAAnBG,oBAAmBC,EAAAJ,EACnBK,SAAAA,OAAW,IAAHD,EAAG,GAAEA,EAAAE,EAAAN,EACbO,QAAAA,OAAU,IAAHD,EAAG,GAAEA,EACZE,EAAIR,EAAJQ,KACAC,EAAST,EAATS,UACAC,EAAyBV,EAAzBU,0BAAyBC,EAAAX,EACzBY,gCAAAA,OAAkC,IAAHD,GAAQA,EAEvCE,EAAgEC,GAAS,GAAMC,EAAAC,EAAAH,EAAA,GAAxEI,EAAwBF,EAAA,GAAEG,EAA2BH,EAAA,GACtDI,EAA6BC,EAAO,MACpCC,EAAiBC,GACrB,WAAA,OACEZ,aAAyB,EAAzBA,EAA2Ba,UACzBC,EAAAC,cAACC,EAAgC,CAC/BnB,QAASA,EACTC,KAAMA,EACNC,UAAWA,EACXkB,kBAAmBf,EACnBO,2BAA4BA,GAGlC,GAAA,CAACZ,EAASE,EAAWC,aAAA,EAAAA,EAA2Ba,QAASX,EAAiCJ,IAG5FoB,EAA+B,CAC7BzB,oBAAAA,EACAgB,2BAAAA,EACAlB,wBAAAA,EACAC,wBAAAA,EACAgB,4BAAAA,EACAD,yBAAAA,IAIF,IAAMY,EAASC,GAAY,WACzBZ,GAA4B,EAC7B,GAAE,IAEH,OAAKX,aAAA,EAAAA,EAASwB,UAAWrB,eAAAA,EAA2Ba,SAIlDC,EAACC,cAAAO,iBACCC,KAAMhB,EACNiB,UAAWC,EACXC,YAAa,CAAC,cACdC,YAAa,CAAC,cACdC,cAAeT,GACVnB,GAA6B,CAAA,EAAG,CACrCa,QAASF,IAERhB,GAZImB,EAAAC,cAAAD,EAAAe,SAAA,KAAGlC,EAed"}
1	+ {"version":3,"file":"AvatarGroupCounterTooltipContainer.js","sources":["../../../../src/components/AvatarGroup/AvatarGroupCounterTooltipContainer.tsx"],"sourcesContent":["import React, { type ReactElement, type RefObject, useCallback, useMemo, useRef, useState } from \"react\";\nimport { Tooltip, type TooltipProps } from \"@vibe/tooltip\";\nimport { type AvatarProps } from \"../Avatar/Avatar\";\nimport AvatarGroupCounterTooltipContent from \"./AvatarGroupCounterTooltipContent\";\nimport { useTooltipContentTabNavigation } from \"./AvatarGroupCounterTooltipHelper\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { type AvatarType } from \"../Avatar/Avatar.types\";\nimport { AVATAR_GROUP_COUNTER_TOOLTIP_SHOW_DELAY } from \"./AvatarGroupConstants\";\n\nexport interface AvatarGroupCounterTooltipContainerProps extends VibeComponentProps {\n /*\n The type of avatars displayed in the tooltip.\n /\n type?: AvatarType;\n /\n The counter element and focus placeholders.\n /\n children?: ReactElement[];\n /\n The list of avatars displayed inside the tooltip.\n /\n avatars?: ReactElement<AvatarProps>[];\n /\n Props passed to the Tooltip component. See full options in the [Tooltip documentation](https://vibe.monday.com/?path=/docs/components-tooltip--docs).\n /\n counterTooltipCustomProps?: Partial<TooltipProps>;\n /\n If true, the tooltip uses a virtualized list for performance optimization.\n /\n counterTooltipIsVirtualizedList?: boolean;\n /\n Ref for the element before the tooltip content, used for keyboard navigation.\n /\n focusPrevPlaceholderRef?: RefObject<HTMLDivElement>;\n /\n Ref for the element after the tooltip content, used for keyboard navigation.\n /\n focusNextPlaceholderRef?: RefObject<HTMLDivElement>;\n /\n Ref for the counter container element.\n */\n counterContainerRef?: RefObject<HTMLDivElement>;\n}\n\nconst AvatarGroupCounterTooltipContainer: React.FC<AvatarGroupCounterTooltipContainerProps> = ({\n focusPrevPlaceholderRef,\n focusNextPlaceholderRef,\n counterContainerRef,\n children = [],\n avatars = [],\n type,\n className,\n counterTooltipCustomProps,\n counterTooltipIsVirtualizedList = false\n}) => {\n const [isKeyboardTooltipVisible, setIsKeyboardTooltipVisible] = useState(false);\n const tooltipContentContainerRef = useRef(null);\n const tooltipContent = useMemo(\n () =>\n counterTooltipCustomProps?.content \|\| (\n <AvatarGroupCounterTooltipContent\n avatars={avatars}\n type={type}\n className={className}\n isVirtualizedList={counterTooltipIsVirtualizedList}\n tooltipContentContainerRef={tooltipContentContainerRef}\n />\n ),\n [avatars, className, counterTooltipCustomProps?.content, counterTooltipIsVirtualizedList, type]\n );\n\n useTooltipContentTabNavigation({\n counterContainerRef,\n tooltipContentContainerRef,\n focusPrevPlaceholderRef,\n focusNextPlaceholderRef,\n setIsKeyboardTooltipVisible,\n isKeyboardTooltipVisible\n });\n\n // Tooltip props\n const onHide = useCallback(() => {\n setIsKeyboardTooltipVisible(false);\n }, []);\n\n if (!avatars?.length && !counterTooltipCustomProps?.content) {\n return <>{children}</>;\n }\n return (\n <Tooltip\n open={isKeyboardTooltipVisible}\n hideDelay={AVATAR_GROUP_COUNTER_TOOLTIP_SHOW_DELAY}\n showTrigger={[\"mouseenter\"]}\n hideTrigger={[\"mouseleave\"]}\n onTooltipHide={onHide}\n {...(counterTooltipCustomProps \|\| {})}\n content={tooltipContent}\n >\n {children}\n </Tooltip>\n );\n};\n\nexport default AvatarGroupCounterTooltipContainer;\n"],"names":["AvatarGroupCounterTooltipContainer","_ref","focusPrevPlaceholderRef","focusNextPlaceholderRef","counterContainerRef","_ref$children","children","_ref$avatars","avatars","type","className","counterTooltipCustomProps","_ref$counterTooltipIs","counterTooltipIsVirtualizedList","_useState","useState","_useState2","_slicedToArray","isKeyboardTooltipVisible","setIsKeyboardTooltipVisible","tooltipContentContainerRef","useRef","tooltipContent","useMemo","content","React","createElement","AvatarGroupCounterTooltipContent","isVirtualizedList","useTooltipContentTabNavigation","onHide","useCallback","length","Tooltip","open","hideDelay","AVATAR_GROUP_COUNTER_TOOLTIP_SHOW_DELAY","showTrigger","hideTrigger","onTooltipHide","Fragment"],"mappings":"+bA4CA,IAAMA,EAAwF,SAAtDC,GAUnC,IATHC,EAAuBD,EAAvBC,wBACAC,EAAuBF,EAAvBE,wBACAC,EAAmBH,EAAnBG,oBAAmBC,EAAAJ,EACnBK,SAAAA,OAAW,IAAHD,EAAG,GAAEA,EAAAE,EAAAN,EACbO,QAAAA,OAAU,IAAHD,EAAG,GAAEA,EACZE,EAAIR,EAAJQ,KACAC,EAAST,EAATS,UACAC,EAAyBV,EAAzBU,0BAAyBC,EAAAX,EACzBY,gCAAAA,OAAkC,IAAHD,GAAQA,EAEvCE,EAAgEC,GAAS,GAAMC,EAAAC,EAAAH,EAAA,GAAxEI,EAAwBF,EAAA,GAAEG,EAA2BH,EAAA,GACtDI,EAA6BC,EAAO,MACpCC,EAAiBC,GACrB,WAAA,OACEZ,aAAyB,EAAzBA,EAA2Ba,UACzBC,EAAAC,cAACC,EAAgC,CAC/BnB,QAASA,EACTC,KAAMA,EACNC,UAAWA,EACXkB,kBAAmBf,EACnBO,2BAA4BA,GAGlC,GAAA,CAACZ,EAASE,EAAWC,aAAA,EAAAA,EAA2Ba,QAASX,EAAiCJ,IAG5FoB,EAA+B,CAC7BzB,oBAAAA,EACAgB,2BAAAA,EACAlB,wBAAAA,EACAC,wBAAAA,EACAgB,4BAAAA,EACAD,yBAAAA,IAIF,IAAMY,EAASC,GAAY,WACzBZ,GAA4B,EAC7B,GAAE,IAEH,OAAKX,aAAA,EAAAA,EAASwB,UAAWrB,eAAAA,EAA2Ba,SAIlDC,EAACC,cAAAO,iBACCC,KAAMhB,EACNiB,UAAWC,EACXC,YAAa,CAAC,cACdC,YAAa,CAAC,cACdC,cAAeT,GACVnB,GAA6B,CAAA,EAAG,CACrCa,QAASF,IAERhB,GAZImB,EAAAC,cAAAD,EAAAe,SAAA,KAAGlC,EAed"}