@vibe/core 4.6.0-alpha-8cfcb.0 → 4.6.0-alpha-3c271.0

package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupCounterTooltipHelper.js.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroupCounterTooltipHelper.js","sources":["../../../../../src/components/AvatarGroup/AvatarGroupCounterTooltipHelper.tsx"],"sourcesContent":["import React, { type CSSProperties, type RefObject, useCallback } from \"react\";\nimport useKeyEvent from \"../../hooks/useKeyEvent\";\nimport { Flex } from \"@vibe/layout\";\nimport Avatar, { type AvatarProps } from \"../Avatar/Avatar\";\nimport { ClickableWrapper } from \"@vibe/clickable\";\nimport avatarGroupCounterTooltipContentStyles from \"./AvatarGroupCounterTooltipContent.module.scss\";\nimport useEventListener from \"../../hooks/useEventListener\";\nimport useListenFocusTriggers from \"../../hooks/useListenFocusTriggers\";\nimport { type AvatarType } from \"../Avatar\";\nimport { type ElementContent } from \"../../types\";\nimport { AVATAR_GROUP_COUNTER_AVATAR_SIZE, AVATAR_GROUP_COUNTER_TOOLTIP_SHOW_DELAY } from \"./AvatarGroupConstants\";\nimport { keyCodes } from \"../../constants\";\n\nconst TAB = [keyCodes.TAB];\nconst ESC = [keyCodes.ESCAPE];\n\nexport function useTooltipContentTabNavigation({\n  counterContainerRef = undefined,\n  tooltipContentContainerRef,\n  focusPrevPlaceholderRef,\n  focusNextPlaceholderRef,\n  isKeyboardTooltipVisible,\n  setIsKeyboardTooltipVisible\n}: {\n  counterContainerRef: RefObject<HTMLDivElement>;\n  tooltipContentContainerRef: RefObject<HTMLElement>;\n  focusPrevPlaceholderRef: RefObject<HTMLDivElement>;\n  focusNextPlaceholderRef: RefObject<HTMLDivElement>;\n  isKeyboardTooltipVisible: boolean;\n  setIsKeyboardTooltipVisible: (value: boolean) => void;\n}) {\n  const showKeyboardTooltip = useCallback(() => {\n    if (!isKeyboardTooltipVisible) {\n      // temp hack for display tooltip with delay after timeout because refactoring the tooltip with open mechanism is out of scope\n      setTimeout(() => setIsKeyboardTooltipVisible(true), AVATAR_GROUP_COUNTER_TOOLTIP_SHOW_DELAY);\n    }\n  }, [isKeyboardTooltipVisible, setIsKeyboardTooltipVisible]);\n\n  const hideKeyboardTooltip = useCallback(() => {\n    if (isKeyboardTooltipVisible) setIsKeyboardTooltipVisible(false);\n  }, [isKeyboardTooltipVisible, setIsKeyboardTooltipVisible]);\n\n  // Open tooltip manually when keyboard focusing on counter\n  useListenFocusTriggers({\n    ref: counterContainerRef,\n    onFocusByKeyboard: showKeyboardTooltip\n  });\n\n  useEventListener({\n    eventName: \"blur\",\n    ref: tooltipContentContainerRef,\n    callback: hideKeyboardTooltip\n  });\n\n  //Move focus to content by keyboard\n  useKeyEvent({\n    keys: TAB,\n    ref: counterContainerRef,\n    withoutAnyModifier: true,\n    preventDefault: true,\n    callback: useCallback(() => {\n      if (isKeyboardTooltipVisible) tooltipContentContainerRef?.current && tooltipContentContainerRef.current.focus();\n    }, [isKeyboardTooltipVisible, tooltipContentContainerRef])\n  });\n\n  // Close tooltip by keyboard\n  useKeyEvent({\n    keys: TAB,\n    modifier: useKeyEvent.modifiers.SHIFT,\n    ref: counterContainerRef,\n    callback: hideKeyboardTooltip\n  });\n  useKeyEvent({\n    keys: TAB,\n    ref: tooltipContentContainerRef,\n    withoutAnyModifier: true,\n    callback: useCallback(() => {\n      // We are not preventing default behaviour here and that's why after pressing tab and after moving focus to here\n      // the browser will move the focus to the next element in the focus order.\n      focusNextPlaceholderRef?.current && focusNextPlaceholderRef.current.focus();\n      if (isKeyboardTooltipVisible) setIsKeyboardTooltipVisible(false);\n    }, [focusNextPlaceholderRef, isKeyboardTooltipVisible, setIsKeyboardTooltipVisible])\n  });\n  useKeyEvent({\n    keys: TAB,\n    ref: tooltipContentContainerRef,\n    modifier: useKeyEvent.modifiers.SHIFT,\n    callback: useCallback(() => {\n      // We are not preventing default behaviour here and that's why after pressing tab and after moving focus to here\n      // the browser will move the focus to the next element in the focus order.\n      focusPrevPlaceholderRef?.current && focusPrevPlaceholderRef.current.focus();\n      if (isKeyboardTooltipVisible) setIsKeyboardTooltipVisible(false);\n    }, [focusPrevPlaceholderRef, isKeyboardTooltipVisible, setIsKeyboardTooltipVisible])\n  });\n  useKeyEvent({\n    keys: ESC,\n    ref: tooltipContentContainerRef,\n    callback: useCallback(() => {\n      counterContainerRef?.current && counterContainerRef.current.focus();\n      if (isKeyboardTooltipVisible) setIsKeyboardTooltipVisible(false);\n    }, [counterContainerRef, isKeyboardTooltipVisible, setIsKeyboardTooltipVisible])\n  });\n  useKeyEvent({\n    keys: ESC,\n    ref: counterContainerRef,\n    callback: hideKeyboardTooltip\n  });\n\n  // Close tooltip when moving focus to next element\n  useEventListener({\n    eventName: \"focus\",\n    ref: focusNextPlaceholderRef,\n    callback: hideKeyboardTooltip\n  });\n}\n\nexport const avatarRenderer = (\n  item: { value: AvatarProps & { tooltipContent: ElementContent } },\n  index: number,\n  style: CSSProperties,\n  type: AvatarType,\n  displayAsGrid: boolean\n) => {\n  const avatarProps = item.value;\n  const overrideStyle: CSSProperties = { ...style, width: displayAsGrid ? undefined : \"100%\" };\n  const labelId = `tooltip-item-${index}-label`;\n\n  return (\n    <ClickableWrapper\n      key={index}\n      isClickable={!!avatarProps?.onClick}\n      clickableProps={{ onClick: event => avatarProps.onClick(event, avatarProps.id), tabIndex: -1 }}\n    >\n      <div style={overrideStyle}>\n        <Flex direction=\"row\" gap=\"xs\" aria-labelledby={labelId}>\n          <Avatar\n            {...avatarProps}\n            tooltipProps={undefined}\n            aria-label={\"\"}\n            customSize={AVATAR_GROUP_COUNTER_AVATAR_SIZE}\n            type={type || avatarProps?.type}\n            tabIndex={-1}\n            size=\"small\"\n            className={avatarGroupCounterTooltipContentStyles.tooltipAvatarItemAvatar}\n          />\n          {!displayAsGrid && (\n            <div id={labelId} className={avatarGroupCounterTooltipContentStyles.tooltipAvatarItemTitle}>\n              {avatarProps.tooltipContent}\n            </div>\n          )}\n        </Flex>\n      </div>\n    </ClickableWrapper>\n  );\n};\n"],"names":["TAB","keyCodes","ESC","ESCAPE","useTooltipContentTabNavigation","_ref","_ref$counterContainer","counterContainerRef","undefined","tooltipContentContainerRef","focusPrevPlaceholderRef","focusNextPlaceholderRef","isKeyboardTooltipVisible","setIsKeyboardTooltipVisible","showKeyboardTooltip","useCallback","setTimeout","AVATAR_GROUP_COUNTER_TOOLTIP_SHOW_DELAY","hideKeyboardTooltip","useListenFocusTriggers","ref","onFocusByKeyboard","useEventListener","eventName","callback","useKeyEvent","keys","withoutAnyModifier","preventDefault","current","focus","modifier","modifiers","SHIFT","avatarRenderer","item","index","style","type","displayAsGrid","avatarProps","value","overrideStyle","Object","assign","width","labelId","concat","React","ClickableWrapper","key","isClickable","onClick","clickableProps","event","id","tabIndex","createElement","Flex","direction","gap","Avatar","tooltipProps","customSize","AVATAR_GROUP_COUNTER_AVATAR_SIZE","size","className","avatarGroupCounterTooltipContentStyles","tooltipAvatarItemAvatar","tooltipAvatarItemTitle","tooltipContent"],"mappings":"klBAaA,IAAMA,EAAM,CAACC,EAASD,KAChBE,EAAM,CAACD,EAASE,iBAENC,EAA8BC,GAc7C,IAAAC,EAAAD,EAbCE,oBAAAA,OAAsBC,IAAHF,OAAGE,EAASF,EAC/BG,EAA0BJ,EAA1BI,2BACAC,EAAuBL,EAAvBK,wBACAC,EAAuBN,EAAvBM,wBACAC,EAAwBP,EAAxBO,yBACAC,EAA2BR,EAA3BQ,4BASMC,EAAsBC,GAAY,WACjCH,GAEHI,YAAW,WAAA,OAAMH,GAA4B,EAAK,GAAEI,EAExD,GAAG,CAACL,EAA0BC,IAExBK,EAAsBH,GAAY,WAClCH,GAA0BC,GAA4B,EAC5D,GAAG,CAACD,EAA0BC,IAG9BM,EAAuB,CACrBC,IAAKb,EACLc,kBAAmBP,IAGrBQ,EAAiB,CACfC,UAAW,OACXH,IAAKX,EACLe,SAAUN,IAIZO,EAAY,CACVC,KAAM1B,EACNoB,IAAKb,EACLoB,oBAAoB,EACpBC,gBAAgB,EAChBJ,SAAUT,GAAY,WAChBH,IAA0BH,aAA0B,EAA1BA,EAA4BoB,UAAWpB,EAA2BoB,QAAQC,OAC1G,GAAG,CAAClB,EAA0BH,MAIhCgB,EAAY,CACVC,KAAM1B,EACN+B,SAAUN,EAAYO,UAAUC,MAChCb,IAAKb,EACLiB,SAAUN,IAEZO,EAAY,CACVC,KAAM1B,EACNoB,IAAKX,EACLkB,oBAAoB,EACpBH,SAAUT,GAAY,YAGpBJ,aAAuB,EAAvBA,EAAyBkB,UAAWlB,EAAwBkB,QAAQC,QAChElB,GAA0BC,GAA4B,EAC3D,GAAE,CAACF,EAAyBC,EAA0BC,MAEzDY,EAAY,CACVC,KAAM1B,EACNoB,IAAKX,EACLsB,SAAUN,EAAYO,UAAUC,MAChCT,SAAUT,GAAY,YAGpBL,aAAuB,EAAvBA,EAAyBmB,UAAWnB,EAAwBmB,QAAQC,QAChElB,GAA0BC,GAA4B,EAC3D,GAAE,CAACH,EAAyBE,EAA0BC,MAEzDY,EAAY,CACVC,KAAMxB,EACNkB,IAAKX,EACLe,SAAUT,GAAY,YACpBR,aAAmB,EAAnBA,EAAqBsB,UAAWtB,EAAoBsB,QAAQC,QACxDlB,GAA0BC,GAA4B,EAC3D,GAAE,CAACN,EAAqBK,EAA0BC,MAErDY,EAAY,CACVC,KAAMxB,EACNkB,IAAKb,EACLiB,SAAUN,IAIZI,EAAiB,CACfC,UAAW,QACXH,IAAKT,EACLa,SAAUN,GAEd,CAEagB,IAAAA,EAAiB,SAC5BC,EACAC,EACAC,EACAC,EACAC,GAEA,IAAMC,EAAcL,EAAKM,MACnBC,EAAoCC,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAAP,GAAO,CAAAQ,MAAON,OAAgB/B,EAAY,SAC9EsC,EAAO,gBAAAC,OAAmBX,EAAa,UAE7C,OACEY,gBAACC,EAAgB,CACfC,IAAKd,EACLe,eAAeX,eAAAA,EAAaY,SAC5BC,eAAgB,CAAED,QAAS,SAAAE,GAAK,OAAId,EAAYY,QAAQE,EAAOd,EAAYe,GAAG,EAAEC,UAAW,IAE3FR,EAAKS,cAAA,MAAA,CAAApB,MAAOK,GACVM,EAACS,cAAAC,EAAK,CAAAC,UAAU,MAAMC,IAAI,KAAI,kBAAkBd,GAC9CE,EAAAS,cAACI,EACKlB,OAAAC,OAAA,CAAA,EAAAJ,GACJsB,kBAActD,EACF,aAAA,GACZuD,WAAYC,EACZ1B,KAAMA,IAAQE,aAAW,EAAXA,EAAaF,MAC3BkB,UAAW,EACXS,KAAK,QACLC,UAAWC,EAAuCC,4BAElD7B,GACAS,EAAAS,cAAA,MAAA,CAAKF,GAAIT,EAASoB,UAAWC,EAAuCE,wBACjE7B,EAAY8B,kBAO3B"}
+{"version":3,"file":"AvatarGroupCounterTooltipHelper.js","sources":["../../../../../src/components/AvatarGroup/AvatarGroupCounterTooltipHelper.tsx"],"sourcesContent":["import React, { type CSSProperties, type RefObject, useCallback } from \"react\";\nimport useKeyEvent from \"../../hooks/useKeyEvent\";\nimport { Flex } from \"@vibe/layout\";\nimport { Avatar, type AvatarProps, type AvatarType } from \"@vibe/avatar\";\nimport { ClickableWrapper } from \"@vibe/clickable\";\nimport avatarGroupCounterTooltipContentStyles from \"./AvatarGroupCounterTooltipContent.module.scss\";\nimport useEventListener from \"../../hooks/useEventListener\";\nimport useListenFocusTriggers from \"../../hooks/useListenFocusTriggers\";\nimport { type ElementContent } from \"../../types\";\nimport { AVATAR_GROUP_COUNTER_AVATAR_SIZE, AVATAR_GROUP_COUNTER_TOOLTIP_SHOW_DELAY } from \"./AvatarGroupConstants\";\nimport { keyCodes } from \"../../constants\";\n\nconst TAB = [keyCodes.TAB];\nconst ESC = [keyCodes.ESCAPE];\n\nexport function useTooltipContentTabNavigation({\n  counterContainerRef = undefined,\n  tooltipContentContainerRef,\n  focusPrevPlaceholderRef,\n  focusNextPlaceholderRef,\n  isKeyboardTooltipVisible,\n  setIsKeyboardTooltipVisible\n}: {\n  counterContainerRef: RefObject<HTMLDivElement>;\n  tooltipContentContainerRef: RefObject<HTMLElement>;\n  focusPrevPlaceholderRef: RefObject<HTMLDivElement>;\n  focusNextPlaceholderRef: RefObject<HTMLDivElement>;\n  isKeyboardTooltipVisible: boolean;\n  setIsKeyboardTooltipVisible: (value: boolean) => void;\n}) {\n  const showKeyboardTooltip = useCallback(() => {\n    if (!isKeyboardTooltipVisible) {\n      // temp hack for display tooltip with delay after timeout because refactoring the tooltip with open mechanism is out of scope\n      setTimeout(() => setIsKeyboardTooltipVisible(true), AVATAR_GROUP_COUNTER_TOOLTIP_SHOW_DELAY);\n    }\n  }, [isKeyboardTooltipVisible, setIsKeyboardTooltipVisible]);\n\n  const hideKeyboardTooltip = useCallback(() => {\n    if (isKeyboardTooltipVisible) setIsKeyboardTooltipVisible(false);\n  }, [isKeyboardTooltipVisible, setIsKeyboardTooltipVisible]);\n\n  // Open tooltip manually when keyboard focusing on counter\n  useListenFocusTriggers({\n    ref: counterContainerRef,\n    onFocusByKeyboard: showKeyboardTooltip\n  });\n\n  useEventListener({\n    eventName: \"blur\",\n    ref: tooltipContentContainerRef,\n    callback: hideKeyboardTooltip\n  });\n\n  //Move focus to content by keyboard\n  useKeyEvent({\n    keys: TAB,\n    ref: counterContainerRef,\n    withoutAnyModifier: true,\n    preventDefault: true,\n    callback: useCallback(() => {\n      if (isKeyboardTooltipVisible) tooltipContentContainerRef?.current && tooltipContentContainerRef.current.focus();\n    }, [isKeyboardTooltipVisible, tooltipContentContainerRef])\n  });\n\n  // Close tooltip by keyboard\n  useKeyEvent({\n    keys: TAB,\n    modifier: useKeyEvent.modifiers.SHIFT,\n    ref: counterContainerRef,\n    callback: hideKeyboardTooltip\n  });\n  useKeyEvent({\n    keys: TAB,\n    ref: tooltipContentContainerRef,\n    withoutAnyModifier: true,\n    callback: useCallback(() => {\n      // We are not preventing default behaviour here and that's why after pressing tab and after moving focus to here\n      // the browser will move the focus to the next element in the focus order.\n      focusNextPlaceholderRef?.current && focusNextPlaceholderRef.current.focus();\n      if (isKeyboardTooltipVisible) setIsKeyboardTooltipVisible(false);\n    }, [focusNextPlaceholderRef, isKeyboardTooltipVisible, setIsKeyboardTooltipVisible])\n  });\n  useKeyEvent({\n    keys: TAB,\n    ref: tooltipContentContainerRef,\n    modifier: useKeyEvent.modifiers.SHIFT,\n    callback: useCallback(() => {\n      // We are not preventing default behaviour here and that's why after pressing tab and after moving focus to here\n      // the browser will move the focus to the next element in the focus order.\n      focusPrevPlaceholderRef?.current && focusPrevPlaceholderRef.current.focus();\n      if (isKeyboardTooltipVisible) setIsKeyboardTooltipVisible(false);\n    }, [focusPrevPlaceholderRef, isKeyboardTooltipVisible, setIsKeyboardTooltipVisible])\n  });\n  useKeyEvent({\n    keys: ESC,\n    ref: tooltipContentContainerRef,\n    callback: useCallback(() => {\n      counterContainerRef?.current && counterContainerRef.current.focus();\n      if (isKeyboardTooltipVisible) setIsKeyboardTooltipVisible(false);\n    }, [counterContainerRef, isKeyboardTooltipVisible, setIsKeyboardTooltipVisible])\n  });\n  useKeyEvent({\n    keys: ESC,\n    ref: counterContainerRef,\n    callback: hideKeyboardTooltip\n  });\n\n  // Close tooltip when moving focus to next element\n  useEventListener({\n    eventName: \"focus\",\n    ref: focusNextPlaceholderRef,\n    callback: hideKeyboardTooltip\n  });\n}\n\nexport const avatarRenderer = (\n  item: { value: AvatarProps & { tooltipContent: ElementContent } },\n  index: number,\n  style: CSSProperties,\n  type: AvatarType,\n  displayAsGrid: boolean\n) => {\n  const avatarProps = item.value;\n  const overrideStyle: CSSProperties = { ...style, width: displayAsGrid ? undefined : \"100%\" };\n  const labelId = `tooltip-item-${index}-label`;\n\n  return (\n    <ClickableWrapper\n      key={index}\n      isClickable={!!avatarProps?.onClick}\n      clickableProps={{ onClick: event => avatarProps.onClick(event, avatarProps.id), tabIndex: -1 }}\n    >\n      <div style={overrideStyle}>\n        <Flex direction=\"row\" gap=\"xs\" aria-labelledby={labelId}>\n          <Avatar\n            {...avatarProps}\n            tooltipProps={undefined}\n            aria-label={\"\"}\n            customSize={AVATAR_GROUP_COUNTER_AVATAR_SIZE}\n            type={type || avatarProps?.type}\n            tabIndex={-1}\n            size=\"small\"\n            className={avatarGroupCounterTooltipContentStyles.tooltipAvatarItemAvatar}\n          />\n          {!displayAsGrid && (\n            <div id={labelId} className={avatarGroupCounterTooltipContentStyles.tooltipAvatarItemTitle}>\n              {avatarProps.tooltipContent}\n            </div>\n          )}\n        </Flex>\n      </div>\n    </ClickableWrapper>\n  );\n};\n"],"names":["TAB","keyCodes","ESC","ESCAPE","useTooltipContentTabNavigation","_ref","_ref$counterContainer","counterContainerRef","undefined","tooltipContentContainerRef","focusPrevPlaceholderRef","focusNextPlaceholderRef","isKeyboardTooltipVisible","setIsKeyboardTooltipVisible","showKeyboardTooltip","useCallback","setTimeout","AVATAR_GROUP_COUNTER_TOOLTIP_SHOW_DELAY","hideKeyboardTooltip","useListenFocusTriggers","ref","onFocusByKeyboard","useEventListener","eventName","callback","useKeyEvent","keys","withoutAnyModifier","preventDefault","current","focus","modifier","modifiers","SHIFT","avatarRenderer","item","index","style","type","displayAsGrid","avatarProps","value","overrideStyle","Object","assign","width","labelId","concat","React","ClickableWrapper","key","isClickable","onClick","clickableProps","event","id","tabIndex","createElement","Flex","direction","gap","Avatar","tooltipProps","customSize","AVATAR_GROUP_COUNTER_AVATAR_SIZE","size","className","avatarGroupCounterTooltipContentStyles","tooltipAvatarItemAvatar","tooltipAvatarItemTitle","tooltipContent"],"mappings":"smBAYA,IAAMA,EAAM,CAACC,EAASD,KAChBE,EAAM,CAACD,EAASE,iBAENC,EAA8BC,GAc7C,IAAAC,EAAAD,EAbCE,oBAAAA,OAAsBC,IAAHF,OAAGE,EAASF,EAC/BG,EAA0BJ,EAA1BI,2BACAC,EAAuBL,EAAvBK,wBACAC,EAAuBN,EAAvBM,wBACAC,EAAwBP,EAAxBO,yBACAC,EAA2BR,EAA3BQ,4BASMC,EAAsBC,GAAY,WACjCH,GAEHI,YAAW,WAAA,OAAMH,GAA4B,EAAK,GAAEI,EAExD,GAAG,CAACL,EAA0BC,IAExBK,EAAsBH,GAAY,WAClCH,GAA0BC,GAA4B,EAC5D,GAAG,CAACD,EAA0BC,IAG9BM,EAAuB,CACrBC,IAAKb,EACLc,kBAAmBP,IAGrBQ,EAAiB,CACfC,UAAW,OACXH,IAAKX,EACLe,SAAUN,IAIZO,EAAY,CACVC,KAAM1B,EACNoB,IAAKb,EACLoB,oBAAoB,EACpBC,gBAAgB,EAChBJ,SAAUT,GAAY,WAChBH,IAA0BH,aAA0B,EAA1BA,EAA4BoB,UAAWpB,EAA2BoB,QAAQC,OAC1G,GAAG,CAAClB,EAA0BH,MAIhCgB,EAAY,CACVC,KAAM1B,EACN+B,SAAUN,EAAYO,UAAUC,MAChCb,IAAKb,EACLiB,SAAUN,IAEZO,EAAY,CACVC,KAAM1B,EACNoB,IAAKX,EACLkB,oBAAoB,EACpBH,SAAUT,GAAY,YAGpBJ,aAAuB,EAAvBA,EAAyBkB,UAAWlB,EAAwBkB,QAAQC,QAChElB,GAA0BC,GAA4B,EAC3D,GAAE,CAACF,EAAyBC,EAA0BC,MAEzDY,EAAY,CACVC,KAAM1B,EACNoB,IAAKX,EACLsB,SAAUN,EAAYO,UAAUC,MAChCT,SAAUT,GAAY,YAGpBL,aAAuB,EAAvBA,EAAyBmB,UAAWnB,EAAwBmB,QAAQC,QAChElB,GAA0BC,GAA4B,EAC3D,GAAE,CAACH,EAAyBE,EAA0BC,MAEzDY,EAAY,CACVC,KAAMxB,EACNkB,IAAKX,EACLe,SAAUT,GAAY,YACpBR,aAAmB,EAAnBA,EAAqBsB,UAAWtB,EAAoBsB,QAAQC,QACxDlB,GAA0BC,GAA4B,EAC3D,GAAE,CAACN,EAAqBK,EAA0BC,MAErDY,EAAY,CACVC,KAAMxB,EACNkB,IAAKb,EACLiB,SAAUN,IAIZI,EAAiB,CACfC,UAAW,QACXH,IAAKT,EACLa,SAAUN,GAEd,CAEagB,IAAAA,EAAiB,SAC5BC,EACAC,EACAC,EACAC,EACAC,GAEA,IAAMC,EAAcL,EAAKM,MACnBC,EAAoCC,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAAP,GAAO,CAAAQ,MAAON,OAAgB/B,EAAY,SAC9EsC,EAAO,gBAAAC,OAAmBX,EAAa,UAE7C,OACEY,gBAACC,EAAgB,CACfC,IAAKd,EACLe,eAAeX,eAAAA,EAAaY,SAC5BC,eAAgB,CAAED,QAAS,SAAAE,GAAK,OAAId,EAAYY,QAAQE,EAAOd,EAAYe,GAAG,EAAEC,UAAW,IAE3FR,EAAKS,cAAA,MAAA,CAAApB,MAAOK,GACVM,EAACS,cAAAC,EAAK,CAAAC,UAAU,MAAMC,IAAI,KAAI,kBAAkBd,GAC9CE,EAAAS,cAACI,EACKlB,OAAAC,OAAA,CAAA,EAAAJ,GACJsB,kBAActD,EACF,aAAA,GACZuD,WAAYC,EACZ1B,KAAMA,IAAQE,aAAW,EAAXA,EAAaF,MAC3BkB,UAAW,EACXS,KAAK,QACLC,UAAWC,EAAuCC,4BAElD7B,GACAS,EAAAS,cAAA,MAAA,CAAKF,GAAIT,EAASoB,UAAWC,EAAuCE,wBACjE7B,EAAY8B,kBAO3B"}

package/dist/mocked_classnames/src/components/AvatarGroup/AvatarGroupHelper.js.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroupHelper.js","sources":["../../../../../src/components/AvatarGroup/AvatarGroupHelper.ts"],"sourcesContent":["import type React from \"react\";\nimport { type AvatarProps } from \"../Avatar/Avatar\";\n\nexport const avatarOnClick = (event: React.MouseEvent | React.KeyboardEvent, avatarProps: AvatarProps) => {\n  avatarProps?.onClick?.(event, avatarProps.id);\n};\n"],"names":["avatarOnClick","event","avatarProps","_a","onClick","call","id"],"mappings":"AAGO,IAAMA,EAAgB,SAACC,EAA+CC,SACpD,QAAvBC,EAAAD,aAAW,EAAXA,EAAaE,eAAU,IAAAD,GAAAA,EAAAE,KAAAH,EAAAD,EAAOC,EAAYI,GAC5C"}
+{"version":3,"file":"AvatarGroupHelper.js","sources":["../../../../../src/components/AvatarGroup/AvatarGroupHelper.ts"],"sourcesContent":["import type React from \"react\";\nimport { type AvatarProps } from \"@vibe/avatar\";\n\nexport const avatarOnClick = (event: React.MouseEvent | React.KeyboardEvent, avatarProps: AvatarProps) => {\n  avatarProps?.onClick?.(event, avatarProps.id);\n};\n"],"names":["avatarOnClick","event","avatarProps","_a","onClick","call","id"],"mappings":"AAGO,IAAMA,EAAgB,SAACC,EAA+CC,SACpD,QAAvBC,EAAAD,aAAW,EAAXA,EAAaE,eAAU,IAAAD,GAAAA,EAAAE,KAAAH,EAAAD,EAAOC,EAAYI,GAC5C"}

package/dist/mocked_classnames/src/components/Badge/Badge.js

@@ -1,2 +1,2 @@
-import{__rest as t}from"../../../_virtual/_tslib.js";import e,{forwardRef as r,useRef as a}from"react";import o from"classnames";import{camelCase as i}from"es-toolkit";import{useMergeRef as s,getStyle as n}from"@vibe/shared";import{getTestId as m}from"../../tests/testIds.js";import{ComponentVibeId as c,ComponentDefaultTestId as d}from"../../tests/constants.js";import l from"./Indicator/Indicator.js";import p from"../Counter/Counter.js";import f from"./Badge.module.scss.js";var v=r((function(r,v){var u=r.type,g=void 0===u?"indicator":u,j=r.anchor,b=void 0===j?"top-end":j,E=r.alignment,h=void 0===E?"rectangular":E,N=r.className,B=r.id,I=r["data-testid"],y=r.children,A=t(r,["type","anchor","alignment","className","id","data-testid","children"]),C=a(null),D=s(v,C),G=o(f.badge,n(f,i(b)),n(f,h)),O=A.color||"indicator"===g?"notification":"negative";return e.createElement("div",{ref:D,className:o(f.badgeWrapper,N),id:B,"data-vibe":c.BADGE},y,e.createElement("div",{className:G,"data-testid":I||m(d.BADGE,B)},"indicator"===g?e.createElement(l,Object.assign({color:O},A)):"counter"===g&&e.createElement(p,Object.assign({color:O},A))))}));export{v as default};
+import{__rest as t}from"../../../_virtual/_tslib.js";import e,{forwardRef as a,useRef as r}from"react";import o from"classnames";import{camelCase as i}from"es-toolkit";import{useMergeRef as s,getStyle as m}from"@vibe/shared";import{getTestId as n}from"../../tests/testIds.js";import{ComponentVibeId as c,ComponentDefaultTestId as d}from"../../tests/constants.js";import l from"./Indicator/Indicator.js";import{Counter as p}from"@vibe/counter/mockedClassNames";import f from"./Badge.module.scss.js";var v=a((function(a,v){var g=a.type,u=void 0===g?"indicator":g,b=a.anchor,j=void 0===b?"top-end":b,E=a.alignment,h=void 0===E?"rectangular":E,N=a.className,B=a.id,I=a["data-testid"],k=a.children,y=t(a,["type","anchor","alignment","className","id","data-testid","children"]),A=r(null),D=s(v,A),G=o(f.badge,m(f,i(j)),m(f,h)),O=y.color||"indicator"===u?"notification":"negative";return e.createElement("div",{ref:D,className:o(f.badgeWrapper,N),id:B,"data-vibe":c.BADGE},k,e.createElement("div",{className:G,"data-testid":I||n(d.BADGE,B)},"indicator"===u?e.createElement(l,Object.assign({color:O},y)):"counter"===u&&e.createElement(p,Object.assign({color:O},y))))}));export{v as default};
 //# sourceMappingURL=Badge.js.map

package/dist/mocked_classnames/src/components/Badge/Badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.js","sources":["../../../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import React, { forwardRef, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { camelCase } from \"es-toolkit\";\nimport { useMergeRef, getStyle } from \"@vibe/shared\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport { type BadgeAlignments, type BadgeAnchor, type BadgeType } from \"./Badge.types\";\nimport Indicator, { type IndicatorProps } from \"./Indicator/Indicator\";\nimport Counter, { type CounterProps } from \"../Counter/Counter\";\n\nimport { type IndicatorColor } from \"./Indicator/Indicator.types\";\nimport { type CounterColor } from \"../Counter/Counter.types\";\nimport styles from \"./Badge.module.scss\";\nimport { type VibeComponentProps } from \"../../types\";\n\nexport interface BadgeBaseProps extends VibeComponentProps {\n  /**\n   * The position of the badge relative to its parent.\n   */\n  anchor?: BadgeAnchor;\n  /**\n   * The alignment style of the badge.\n   */\n  alignment?: BadgeAlignments;\n  /**\n   * The content the badge is attached to.\n   */\n  children: React.ReactNode;\n}\n\ninterface CounterBadgeProps extends CounterProps {\n  /**\n   * The type of badge, set to `\"counter\"` for numeric values.\n   */\n  type: Extract<BadgeType, \"counter\">;\n}\n\ninterface IndicatorBadgeProps extends IndicatorProps {\n  /**\n   * The type of badge, set to `\"indicator\"` for a simple dot.\n   */\n  type?: Extract<BadgeType, \"indicator\">;\n}\n\nexport type BadgeProps = BadgeBaseProps & (CounterBadgeProps | IndicatorBadgeProps);\n\nconst Badge = forwardRef(\n  (\n    {\n      type = \"indicator\",\n      anchor = \"top-end\",\n      alignment = \"rectangular\",\n      className,\n      id,\n      \"data-testid\": dataTestId,\n      children,\n      ...badgeProps\n    }: BadgeProps,\n    ref: React.ForwardedRef<HTMLElement>\n  ) => {\n    const componentRef = useRef(null);\n    const mergedRef = useMergeRef(ref, componentRef);\n    const badgeClassNames = cx(\n      styles.badge,\n      getStyle(styles, camelCase(anchor as unknown as string)),\n      getStyle(styles, alignment)\n    );\n\n    const color = badgeProps.color || type === \"indicator\" ? \"notification\" : \"negative\";\n\n    return (\n      <div ref={mergedRef} className={cx(styles.badgeWrapper, className)} id={id} data-vibe={ComponentVibeId.BADGE}>\n        {children}\n        <div className={badgeClassNames} data-testid={dataTestId || getTestId(ComponentDefaultTestId.BADGE, id)}>\n          {type === \"indicator\" ? (\n            <Indicator color={color as IndicatorColor} {...(badgeProps as IndicatorBadgeProps)} />\n          ) : (\n            type === \"counter\" && <Counter color={color as CounterColor} {...(badgeProps as CounterBadgeProps)} />\n          )}\n        </div>\n      </div>\n    );\n  }\n);\n\nexport default Badge;\n"],"names":["Badge","forwardRef","_a","ref","type","_a$type","_a$anchor","anchor","_a$alignment","alignment","className","id","dataTestId","children","badgeProps","__rest","componentRef","useRef","mergedRef","useMergeRef","badgeClassNames","cx","styles","badge","getStyle","camelCase","color","React","badgeWrapper","ComponentVibeId","BADGE","createElement","getTestId","ComponentDefaultTestId","Indicator","Object","assign","Counter"],"mappings":"8dA8CMA,IAAAA,EAAQC,GACZ,SACEC,EAUAC,SAHUD,EANRE,KAAAA,OAAO,IAAHC,EAAG,YAAWA,EAAAC,EAMVJ,EALRK,OAAAA,OAAS,IAAHD,EAAG,UAASA,EAAAE,EAKVN,EAJRO,UAAAA,OAAY,IAAHD,EAAG,cAAaA,EACzBE,EAGQR,EAHRQ,UACAC,EAEQT,EAFRS,GACeC,EACPV,EADR,eACAW,EAAQX,EAARW,SACGC,EARLC,EAAAb,EAAA,CAAA,OAAA,SAAA,YAAA,YAAA,KAAA,cAAA,aAYMc,EAAeC,EAAO,MACtBC,EAAYC,EAAYhB,EAAKa,GAC7BI,EAAkBC,EACtBC,EAAOC,MACPC,EAASF,EAAQG,EAAUlB,IAC3BiB,EAASF,EAAQb,IAGbiB,EAAQZ,EAAWY,OAAkB,cAATtB,EAAuB,eAAiB,WAE1E,OACEuB,uBAAKxB,IAAKe,EAAWR,UAAWW,EAAGC,EAAOM,aAAclB,GAAYC,GAAIA,EAAE,YAAakB,EAAgBC,OACpGjB,EACDc,EAAKI,cAAA,MAAA,CAAArB,UAAWU,EAA8B,cAAAR,GAAcoB,EAAUC,EAAuBH,MAAOnB,IACxF,cAATP,EACCuB,EAACI,cAAAG,EAAUC,OAAAC,OAAA,CAAAV,MAAOA,GAA8BZ,IAEvC,YAATV,GAAsBuB,gBAACU,EAAOF,OAAAC,OAAA,CAACV,MAAOA,GAA4BZ,KAK5E"}
+{"version":3,"file":"Badge.js","sources":["../../../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import React, { forwardRef, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { camelCase } from \"es-toolkit\";\nimport { useMergeRef, getStyle } from \"@vibe/shared\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport { type BadgeAlignments, type BadgeAnchor, type BadgeType } from \"./Badge.types\";\nimport Indicator, { type IndicatorProps } from \"./Indicator/Indicator\";\nimport { Counter, type CounterProps, type CounterColor } from \"@vibe/counter\";\n\nimport { type IndicatorColor } from \"./Indicator/Indicator.types\";\nimport styles from \"./Badge.module.scss\";\nimport { type VibeComponentProps } from \"../../types\";\n\nexport interface BadgeBaseProps extends VibeComponentProps {\n  /**\n   * The position of the badge relative to its parent.\n   */\n  anchor?: BadgeAnchor;\n  /**\n   * The alignment style of the badge.\n   */\n  alignment?: BadgeAlignments;\n  /**\n   * The content the badge is attached to.\n   */\n  children: React.ReactNode;\n}\n\ninterface CounterBadgeProps extends CounterProps {\n  /**\n   * The type of badge, set to `\"counter\"` for numeric values.\n   */\n  type: Extract<BadgeType, \"counter\">;\n}\n\ninterface IndicatorBadgeProps extends IndicatorProps {\n  /**\n   * The type of badge, set to `\"indicator\"` for a simple dot.\n   */\n  type?: Extract<BadgeType, \"indicator\">;\n}\n\nexport type BadgeProps = BadgeBaseProps & (CounterBadgeProps | IndicatorBadgeProps);\n\nconst Badge = forwardRef(\n  (\n    {\n      type = \"indicator\",\n      anchor = \"top-end\",\n      alignment = \"rectangular\",\n      className,\n      id,\n      \"data-testid\": dataTestId,\n      children,\n      ...badgeProps\n    }: BadgeProps,\n    ref: React.ForwardedRef<HTMLElement>\n  ) => {\n    const componentRef = useRef(null);\n    const mergedRef = useMergeRef(ref, componentRef);\n    const badgeClassNames = cx(\n      styles.badge,\n      getStyle(styles, camelCase(anchor as unknown as string)),\n      getStyle(styles, alignment)\n    );\n\n    const color = badgeProps.color || type === \"indicator\" ? \"notification\" : \"negative\";\n\n    return (\n      <div ref={mergedRef} className={cx(styles.badgeWrapper, className)} id={id} data-vibe={ComponentVibeId.BADGE}>\n        {children}\n        <div className={badgeClassNames} data-testid={dataTestId || getTestId(ComponentDefaultTestId.BADGE, id)}>\n          {type === \"indicator\" ? (\n            <Indicator color={color as IndicatorColor} {...(badgeProps as IndicatorBadgeProps)} />\n          ) : (\n            type === \"counter\" && <Counter color={color as CounterColor} {...(badgeProps as CounterBadgeProps)} />\n          )}\n        </div>\n      </div>\n    );\n  }\n);\n\nexport default Badge;\n"],"names":["Badge","forwardRef","_a","ref","type","_a$type","_a$anchor","anchor","_a$alignment","alignment","className","id","dataTestId","children","badgeProps","__rest","componentRef","useRef","mergedRef","useMergeRef","badgeClassNames","cx","styles","badge","getStyle","camelCase","color","React","badgeWrapper","ComponentVibeId","BADGE","createElement","getTestId","ComponentDefaultTestId","Indicator","Object","assign","Counter"],"mappings":"kfA6CMA,IAAAA,EAAQC,GACZ,SACEC,EAUAC,SAHUD,EANRE,KAAAA,OAAO,IAAHC,EAAG,YAAWA,EAAAC,EAMVJ,EALRK,OAAAA,OAAS,IAAHD,EAAG,UAASA,EAAAE,EAKVN,EAJRO,UAAAA,OAAY,IAAHD,EAAG,cAAaA,EACzBE,EAGQR,EAHRQ,UACAC,EAEQT,EAFRS,GACeC,EACPV,EADR,eACAW,EAAQX,EAARW,SACGC,EARLC,EAAAb,EAAA,CAAA,OAAA,SAAA,YAAA,YAAA,KAAA,cAAA,aAYMc,EAAeC,EAAO,MACtBC,EAAYC,EAAYhB,EAAKa,GAC7BI,EAAkBC,EACtBC,EAAOC,MACPC,EAASF,EAAQG,EAAUlB,IAC3BiB,EAASF,EAAQb,IAGbiB,EAAQZ,EAAWY,OAAkB,cAATtB,EAAuB,eAAiB,WAE1E,OACEuB,uBAAKxB,IAAKe,EAAWR,UAAWW,EAAGC,EAAOM,aAAclB,GAAYC,GAAIA,EAAE,YAAakB,EAAgBC,OACpGjB,EACDc,EAAKI,cAAA,MAAA,CAAArB,UAAWU,EAA8B,cAAAR,GAAcoB,EAAUC,EAAuBH,MAAOnB,IACxF,cAATP,EACCuB,EAACI,cAAAG,EAAUC,OAAAC,OAAA,CAAAV,MAAOA,GAA8BZ,IAEvC,YAATV,GAAsBuB,gBAACU,EAAOF,OAAAC,OAAA,CAACV,MAAOA,GAA4BZ,KAK5E"}

package/dist/mocked_classnames/src/components/Badge/Badge.module.scss.js

@@ -1,2 +1,2 @@
-var n={badgeWrapper:"badgeWrapper",badge:"badge",outside:"outside",topEnd:"topEnd",rectangular:"rectangular",circular:"circular",topStart:"topStart",bottomEnd:"bottomEnd",bottomStart:"bottomStart"};!function(n){const t="s_id-06f338dd08c3_4_5_3";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+t))return;const a=document.createElement("style");a.id=t,e.firstChild?e.insertBefore(a,e.firstChild):e.appendChild(a),a.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=n)}(".badgeWrapper {\n  position: relative;\n}\n.badgeWrapper .badge {\n  z-index: 1;\n  position: absolute;\n  border-radius: 16px;\n}\n.badgeWrapper .badge:not(.outside) {\n  border: 2px solid;\n  border-color: var(--primary-background-color);\n}\n.badgeWrapper .badge.topEnd.rectangular {\n  top: 0;\n  inset-inline-end: 0;\n  translate: 50% -50%;\n}\n.badgeWrapper .badge.topEnd.outside {\n  top: 0;\n  inset-inline-end: -2px;\n  translate: 100% 0;\n}\n.badgeWrapper .badge.topEnd.circular {\n  top: 15%;\n  inset-inline-end: 15%;\n  translate: 50% -50%;\n}\n.badgeWrapper .badge.topStart.rectangular {\n  top: 0;\n  inset-inline-start: 0;\n  translate: -50% -50%;\n}\n.badgeWrapper .badge.topStart.outside {\n  top: 0;\n  inset-inline-start: -2px;\n  translate: -100% 0;\n}\n.badgeWrapper .badge.topStart.circular {\n  top: 15%;\n  inset-inline-start: 15%;\n  translate: -50% -50%;\n}\n.badgeWrapper .badge.bottomEnd.rectangular {\n  bottom: 0;\n  inset-inline-end: 0;\n  translate: 50% 50%;\n}\n.badgeWrapper .badge.bottomEnd.outside {\n  bottom: 0;\n  inset-inline-end: -2px;\n  translate: 100% 0;\n}\n.badgeWrapper .badge.bottomEnd.circular {\n  bottom: 15%;\n  inset-inline-end: 15%;\n  translate: 50% 50%;\n}\n.badgeWrapper .badge.bottomStart.rectangular {\n  bottom: 0;\n  inset-inline-start: 0;\n  translate: -50% 50%;\n}\n.badgeWrapper .badge.bottomStart.outside {\n  bottom: 0;\n  inset-inline-start: -2px;\n  translate: -100% 0;\n}\n.badgeWrapper .badge.bottomStart.circular {\n  bottom: 15%;\n  inset-inline-start: 15%;\n  translate: -50% 50%;\n}");export{n as default};
+var n={badgeWrapper:"badgeWrapper",badge:"badge",outside:"outside",topEnd:"topEnd",rectangular:"rectangular",circular:"circular",topStart:"topStart",bottomEnd:"bottomEnd",bottomStart:"bottomStart"};!function(n){const t="s_id-06f338dd08c3_4_5_10";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+t))return;const a=document.createElement("style");a.id=t,e.firstChild?e.insertBefore(a,e.firstChild):e.appendChild(a),a.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=n)}(".badgeWrapper {\n  position: relative;\n}\n.badgeWrapper .badge {\n  z-index: 1;\n  position: absolute;\n  border-radius: 16px;\n}\n.badgeWrapper .badge:not(.outside) {\n  border: 2px solid;\n  border-color: var(--primary-background-color);\n}\n.badgeWrapper .badge.topEnd.rectangular {\n  top: 0;\n  inset-inline-end: 0;\n  translate: 50% -50%;\n}\n.badgeWrapper .badge.topEnd.outside {\n  top: 0;\n  inset-inline-end: -2px;\n  translate: 100% 0;\n}\n.badgeWrapper .badge.topEnd.circular {\n  top: 15%;\n  inset-inline-end: 15%;\n  translate: 50% -50%;\n}\n.badgeWrapper .badge.topStart.rectangular {\n  top: 0;\n  inset-inline-start: 0;\n  translate: -50% -50%;\n}\n.badgeWrapper .badge.topStart.outside {\n  top: 0;\n  inset-inline-start: -2px;\n  translate: -100% 0;\n}\n.badgeWrapper .badge.topStart.circular {\n  top: 15%;\n  inset-inline-start: 15%;\n  translate: -50% -50%;\n}\n.badgeWrapper .badge.bottomEnd.rectangular {\n  bottom: 0;\n  inset-inline-end: 0;\n  translate: 50% 50%;\n}\n.badgeWrapper .badge.bottomEnd.outside {\n  bottom: 0;\n  inset-inline-end: -2px;\n  translate: 100% 0;\n}\n.badgeWrapper .badge.bottomEnd.circular {\n  bottom: 15%;\n  inset-inline-end: 15%;\n  translate: 50% 50%;\n}\n.badgeWrapper .badge.bottomStart.rectangular {\n  bottom: 0;\n  inset-inline-start: 0;\n  translate: -50% 50%;\n}\n.badgeWrapper .badge.bottomStart.outside {\n  bottom: 0;\n  inset-inline-start: -2px;\n  translate: -100% 0;\n}\n.badgeWrapper .badge.bottomStart.circular {\n  bottom: 15%;\n  inset-inline-start: 15%;\n  translate: -50% 50%;\n}");export{n as default};
 //# sourceMappingURL=Badge.module.scss.js.map

package/dist/mocked_classnames/src/components/Badge/Indicator/Indicator.module.scss.js

@@ -1,2 +1,2 @@
-var e={indicator:"indicator",primary:"primary",notification:"notification"};!function(e){const i="s_id-d6448d74722f_4_5_3";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+i))return;const t=document.createElement("style");t.id=i,n.firstChild?n.insertBefore(t,n.firstChild):n.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[i]=e)}(".indicator {\n  width: 8px;\n  height: 8px;\n  border-radius: 50%;\n}\n.indicator.primary {\n  background-color: var(--primary-color);\n}\n.indicator.notification {\n  background-color: var(--negative-color);\n}");export{e as default};
+var e={indicator:"indicator",primary:"primary",notification:"notification"};!function(e){const i="s_id-d6448d74722f_4_5_10";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+i))return;const t=document.createElement("style");t.id=i,n.firstChild?n.insertBefore(t,n.firstChild):n.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[i]=e)}(".indicator {\n  width: 8px;\n  height: 8px;\n  border-radius: 50%;\n}\n.indicator.primary {\n  background-color: var(--primary-color);\n}\n.indicator.notification {\n  background-color: var(--negative-color);\n}");export{e as default};
 //# sourceMappingURL=Indicator.module.scss.js.map

package/dist/mocked_classnames/src/components/BaseItem/BaseItem.module.scss.js

@@ -1,2 +1,2 @@
-var e={wrapper:"wrapper","focus-visible":"focus-visible",highlighted:"highlighted",disabled:"disabled",readOnly:"readOnly",small:"small",medium:"medium",large:"large",avatar:"avatar",icon:"icon",indent:"indent",endElement:"endElement",selectedCheck:"selectedCheck"};!function(e){const n="s_id-88c43575e1d9_4_5_3";if("undefined"!=typeof document){const r=document.head||document.getElementsByTagName("head")[0];if(r.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,r.firstChild?r.insertBefore(a,r.firstChild):r.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable selector-class-pattern */\n.wrapper {\n  display: flex;\n  align-items: center;\n  gap: var(--space-4);\n  border-radius: 6px;\n  color: var(--primary-text-color);\n  cursor: pointer;\n}\n.wrapper:focus-visible, .wrapper.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5) inset, 0 0 0 1px var(--primary-hover-color) inset;\n}\n.wrapper:focus:not(.focus-visible) {\n  outline: none;\n}\n.wrapper.highlighted, .wrapper:hover:not(.disabled):not(.readOnly) {\n  background-color: var(--primary-background-hover-color);\n}\n.wrapper.disabled {\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n}\n.wrapper.readOnly {\n  cursor: default;\n}\n.wrapper.small {\n  padding: 6px var(--space-8);\n}\n.wrapper.medium {\n  padding: 9px 12px;\n}\n.wrapper.large {\n  padding: 13px 12px;\n}\n.wrapper .avatar,\n.wrapper .icon {\n  flex-shrink: 0;\n}\n.wrapper .indent {\n  width: 20px;\n}\n.wrapper .endElement {\n  padding-inline-start: var(--space-8);\n  margin-inline-start: auto;\n  display: flex;\n  align-items: center;\n  gap: var(--space-4);\n}\n.wrapper .selectedCheck {\n  flex-shrink: 0;\n  color: var(--icon-color);\n}");export{e as default};
+var e={wrapper:"wrapper","focus-visible":"focus-visible",highlighted:"highlighted",disabled:"disabled",readOnly:"readOnly",small:"small",medium:"medium",large:"large",avatar:"avatar",icon:"icon",indent:"indent",endElement:"endElement",selectedCheck:"selectedCheck"};!function(e){const n="s_id-88c43575e1d9_4_5_10";if("undefined"!=typeof document){const r=document.head||document.getElementsByTagName("head")[0];if(r.querySelector("#"+n))return;const a=document.createElement("style");a.id=n,r.firstChild?r.insertBefore(a,r.firstChild):r.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable selector-class-pattern */\n.wrapper {\n  display: flex;\n  align-items: center;\n  gap: var(--space-4);\n  border-radius: 6px;\n  color: var(--primary-text-color);\n  cursor: pointer;\n}\n.wrapper:focus-visible, .wrapper.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5) inset, 0 0 0 1px var(--primary-hover-color) inset;\n}\n.wrapper:focus:not(.focus-visible) {\n  outline: none;\n}\n.wrapper.highlighted, .wrapper:hover:not(.disabled):not(.readOnly) {\n  background-color: var(--primary-background-hover-color);\n}\n.wrapper.disabled {\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n}\n.wrapper.readOnly {\n  cursor: default;\n}\n.wrapper.small {\n  padding: 6px var(--space-8);\n}\n.wrapper.medium {\n  padding: 9px 12px;\n}\n.wrapper.large {\n  padding: 13px 12px;\n}\n.wrapper .avatar,\n.wrapper .icon {\n  flex-shrink: 0;\n}\n.wrapper .indent {\n  width: 20px;\n}\n.wrapper .endElement {\n  padding-inline-start: var(--space-8);\n  margin-inline-start: auto;\n  display: flex;\n  align-items: center;\n  gap: var(--space-4);\n}\n.wrapper .selectedCheck {\n  flex-shrink: 0;\n  color: var(--icon-color);\n}");export{e as default};
 //# sourceMappingURL=BaseItem.module.scss.js.map

package/dist/mocked_classnames/src/components/BaseItem/utils.js

@@ -1,2 +1,2 @@
-import{Text as e}from"@vibe/typography/mockedClassNames";import a from"react";import r from"../Avatar/Avatar.js";import t from"./BaseItem.module.scss.js";import{Icon as s}from"@vibe/icon/mockedClassNames";function c(c,m,o){switch(c.type){case"avatar":return a.createElement(r,{className:t.avatar,src:c.value,withoutBorder:!0,square:c.square,type:"img",customSize:20,disabled:m});case"icon":return a.createElement(s,{className:t.icon,icon:c.value,size:20});case"indent":return a.createElement("div",{className:t.indent});case"suffix":return a.createElement(e,{type:o,color:"secondary",style:{maxWidth:"112px"}},c.value);case"custom":return c.render()}}export{c as renderSideElement};
+import{Text as e}from"@vibe/typography/mockedClassNames";import a from"react";import{Avatar as r}from"@vibe/avatar/mockedClassNames";import t from"./BaseItem.module.scss.js";import{Icon as s}from"@vibe/icon/mockedClassNames";function m(m,c,o){switch(m.type){case"avatar":return a.createElement(r,{className:t.avatar,src:m.value,withoutBorder:!0,square:m.square,type:"img",customSize:20,disabled:c});case"icon":return a.createElement(s,{className:t.icon,icon:m.value,size:20});case"indent":return a.createElement("div",{className:t.indent});case"suffix":return a.createElement(e,{type:o,color:"secondary",style:{maxWidth:"112px"}},m.value);case"custom":return m.render()}}export{m as renderSideElement};
 //# sourceMappingURL=utils.js.map

package/dist/mocked_classnames/src/components/BaseItem/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../../../../../src/components/BaseItem/utils.tsx"],"sourcesContent":["import { type EndElement, type StartElement } from \"./BaseItem.types\";\nimport { Text, type TextType } from \"@vibe/typography\";\nimport React from \"react\";\nimport Avatar from \"../Avatar/Avatar\";\nimport styles from \"./BaseItem.module.scss\";\nimport { Icon } from \"@vibe/icon\";\n\nexport function renderSideElement(\n  element: StartElement | EndElement,\n  disabled: boolean,\n  textVariant: TextType\n): React.ReactNode {\n  switch (element.type) {\n    case \"avatar\":\n      return (\n        <Avatar\n          className={styles.avatar}\n          src={element.value}\n          withoutBorder\n          square={element.square}\n          type=\"img\"\n          customSize={20}\n          disabled={disabled}\n        />\n      );\n\n    case \"icon\":\n      return <Icon className={styles.icon} icon={element.value} size={20} />;\n\n    case \"indent\":\n      return <div className={styles.indent} />;\n\n    case \"suffix\":\n      return (\n        <Text type={textVariant} color=\"secondary\" style={{ maxWidth: \"112px\" }}>\n          {element.value}\n        </Text>\n      );\n\n    case \"custom\":\n      return element.render();\n  }\n}\n"],"names":["renderSideElement","element","disabled","textVariant","type","React","createElement","Avatar","className","styles","avatar","src","value","withoutBorder","square","customSize","Icon","icon","size","indent","Text","color","style","maxWidth","render"],"mappings":"sNAOgBA,EACdC,EACAC,EACAC,GAEA,OAAQF,EAAQG,MACd,IAAK,SACH,OACEC,EAACC,cAAAC,EACC,CAAAC,UAAWC,EAAOC,OAClBC,IAAKV,EAAQW,MACbC,eAAa,EACbC,OAAQb,EAAQa,OAChBV,KAAK,MACLW,WAAY,GACZb,SAAUA,IAIhB,IAAK,OACH,OAAOG,gBAACW,EAAI,CAACR,UAAWC,EAAOQ,KAAMA,KAAMhB,EAAQW,MAAOM,KAAM,KAElE,IAAK,SACH,OAAOb,uBAAKG,UAAWC,EAAOU,SAEhC,IAAK,SACH,OACEd,EAACC,cAAAc,EAAK,CAAAhB,KAAMD,EAAakB,MAAM,YAAYC,MAAO,CAAEC,SAAU,UAC3DtB,EAAQW,OAIf,IAAK,SACH,OAAOX,EAAQuB,SAErB"}
+{"version":3,"file":"utils.js","sources":["../../../../../src/components/BaseItem/utils.tsx"],"sourcesContent":["import { type EndElement, type StartElement } from \"./BaseItem.types\";\nimport { Text, type TextType } from \"@vibe/typography\";\nimport React from \"react\";\nimport { Avatar } from \"@vibe/avatar\";\nimport styles from \"./BaseItem.module.scss\";\nimport { Icon } from \"@vibe/icon\";\n\nexport function renderSideElement(\n  element: StartElement | EndElement,\n  disabled: boolean,\n  textVariant: TextType\n): React.ReactNode {\n  switch (element.type) {\n    case \"avatar\":\n      return (\n        <Avatar\n          className={styles.avatar}\n          src={element.value}\n          withoutBorder\n          square={element.square}\n          type=\"img\"\n          customSize={20}\n          disabled={disabled}\n        />\n      );\n\n    case \"icon\":\n      return <Icon className={styles.icon} icon={element.value} size={20} />;\n\n    case \"indent\":\n      return <div className={styles.indent} />;\n\n    case \"suffix\":\n      return (\n        <Text type={textVariant} color=\"secondary\" style={{ maxWidth: \"112px\" }}>\n          {element.value}\n        </Text>\n      );\n\n    case \"custom\":\n      return element.render();\n  }\n}\n"],"names":["renderSideElement","element","disabled","textVariant","type","React","createElement","Avatar","className","styles","avatar","src","value","withoutBorder","square","customSize","Icon","icon","size","indent","Text","color","style","maxWidth","render"],"mappings":"0OAOgBA,EACdC,EACAC,EACAC,GAEA,OAAQF,EAAQG,MACd,IAAK,SACH,OACEC,EAACC,cAAAC,EACC,CAAAC,UAAWC,EAAOC,OAClBC,IAAKV,EAAQW,MACbC,eAAa,EACbC,OAAQb,EAAQa,OAChBV,KAAK,MACLW,WAAY,GACZb,SAAUA,IAIhB,IAAK,OACH,OAAOG,gBAACW,EAAI,CAACR,UAAWC,EAAOQ,KAAMA,KAAMhB,EAAQW,MAAOM,KAAM,KAElE,IAAK,SACH,OAAOb,uBAAKG,UAAWC,EAAOU,SAEhC,IAAK,SACH,OACEd,EAACC,cAAAc,EAAK,CAAAhB,KAAMD,EAAakB,MAAM,YAAYC,MAAO,CAAEC,SAAU,UAC3DtB,EAAQW,OAIf,IAAK,SACH,OAAOX,EAAQuB,SAErB"}

package/dist/mocked_classnames/src/components/BaseList/BaseList.module.scss.js

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

package/dist/mocked_classnames/src/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbContent/BreadcrumbContent.module.scss.js

@@ -1,2 +1,2 @@
-var n={breadcrumbContent:"breadcrumbContent",withoutText:"withoutText",breadcrumbText:"breadcrumbText",breadcrumbIcon:"breadcrumbIcon",clickable:"clickable",current:"current",disabled:"disabled",notClickable:"notClickable"};!function(n){const e="s_id-6512392a70ad_4_5_3";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const r=document.createElement("style");r.id=e,t.firstChild?t.insertBefore(r,t.firstChild):t.appendChild(r),r.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable selector-class-pattern */\n.breadcrumbContent {\n  font: var(--font-text2-normal);\n  color: var(--secondary-text-color);\n  display: inline-flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  padding: 0 2px;\n  overflow: hidden;\n  text-decoration: none;\n}\n.breadcrumbContent.withoutText {\n  padding: 4px;\n}\n\na.breadcrumbContent:hover {\n  color: var(--secondary-text-color);\n  text-decoration: none;\n}\n\n.breadcrumbContent .breadcrumbText {\n  color: inherit;\n  margin: 0 4px;\n  line-height: 22px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.breadcrumbContent .breadcrumbIcon {\n  height: 14px;\n  width: 14px;\n  flex-shrink: 0;\n}\n\n.breadcrumbContent:focus {\n  outline: none;\n}\n\n.breadcrumbContent.clickable {\n  cursor: pointer;\n}\n\n.breadcrumbContent.clickable:hover,\n.breadcrumbContent:focus-within {\n  background-color: var(--primary-background-hover-color);\n  border-radius: 4px;\n}\n\n.breadcrumbContent.current {\n  color: var(--primary-text-color);\n  font-weight: 500;\n}\n\n.breadcrumbContent.disabled {\n  border-color: var(--disabled-background-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.breadcrumbContent.disabled:hover {\n  background-color: transparent;\n}\n\n.breadcrumbContent.notClickable {\n  pointer-events: none;\n}");export{n as default};
+var n={breadcrumbContent:"breadcrumbContent",withoutText:"withoutText",breadcrumbText:"breadcrumbText",breadcrumbIcon:"breadcrumbIcon",clickable:"clickable",current:"current",disabled:"disabled",notClickable:"notClickable"};!function(n){const e="s_id-6512392a70ad_4_5_10";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const r=document.createElement("style");r.id=e,t.firstChild?t.insertBefore(r,t.firstChild):t.appendChild(r),r.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable selector-class-pattern */\n.breadcrumbContent {\n  font: var(--font-text2-normal);\n  color: var(--secondary-text-color);\n  display: inline-flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  padding: 0 2px;\n  overflow: hidden;\n  text-decoration: none;\n}\n.breadcrumbContent.withoutText {\n  padding: 4px;\n}\n\na.breadcrumbContent:hover {\n  color: var(--secondary-text-color);\n  text-decoration: none;\n}\n\n.breadcrumbContent .breadcrumbText {\n  color: inherit;\n  margin: 0 4px;\n  line-height: 22px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.breadcrumbContent .breadcrumbIcon {\n  height: 14px;\n  width: 14px;\n  flex-shrink: 0;\n}\n\n.breadcrumbContent:focus {\n  outline: none;\n}\n\n.breadcrumbContent.clickable {\n  cursor: pointer;\n}\n\n.breadcrumbContent.clickable:hover,\n.breadcrumbContent:focus-within {\n  background-color: var(--primary-background-hover-color);\n  border-radius: 4px;\n}\n\n.breadcrumbContent.current {\n  color: var(--primary-text-color);\n  font-weight: 500;\n}\n\n.breadcrumbContent.disabled {\n  border-color: var(--disabled-background-color);\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n  pointer-events: none;\n}\n.breadcrumbContent.disabled:hover {\n  background-color: transparent;\n}\n\n.breadcrumbContent.notClickable {\n  pointer-events: none;\n}");export{n as default};
 //# sourceMappingURL=BreadcrumbContent.module.scss.js.map

package/dist/mocked_classnames/src/components/BreadcrumbsBar/BreadcrumbItem/BreadcrumbItem.module.scss.js

@@ -1,2 +1,2 @@
-var e={breadcrumbItemWrapper:"breadcrumbItemWrapper",disabled:"disabled"};!function(e){const t="s_id-03f482333e23_4_5_3";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,d.firstChild?d.insertBefore(n,d.firstChild):d.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".breadcrumbItemWrapper {\n  display: inline-flex;\n  overflow: hidden;\n  list-style-type: none;\n  cursor: default;\n}\n\n.breadcrumbItemWrapper.disabled {\n  cursor: not-allowed;\n}");export{e as default};
+var e={breadcrumbItemWrapper:"breadcrumbItemWrapper",disabled:"disabled"};!function(e){const t="s_id-03f482333e23_4_5_10";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,d.firstChild?d.insertBefore(n,d.firstChild):d.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".breadcrumbItemWrapper {\n  display: inline-flex;\n  overflow: hidden;\n  list-style-type: none;\n  cursor: default;\n}\n\n.breadcrumbItemWrapper.disabled {\n  cursor: not-allowed;\n}");export{e as default};
 //# sourceMappingURL=BreadcrumbItem.module.scss.js.map

package/dist/mocked_classnames/src/components/BreadcrumbsBar/BreadcrumbMenu/BreadcrumbsMenu.module.scss.js

@@ -1,2 +1,2 @@
-var e={breadcrumbMenuWrapper:"breadcrumbMenuWrapper"};!function(e){const n="s_id-fc5ae89c4b65_4_5_3";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".breadcrumbMenuWrapper {\n  display: inline-flex;\n  overflow: hidden;\n  list-style-type: none;\n  cursor: default;\n}");export{e as default};
+var e={breadcrumbMenuWrapper:"breadcrumbMenuWrapper"};!function(e){const n="s_id-fc5ae89c4b65_4_5_10";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".breadcrumbMenuWrapper {\n  display: inline-flex;\n  overflow: hidden;\n  list-style-type: none;\n  cursor: default;\n}");export{e as default};
 //# sourceMappingURL=BreadcrumbsMenu.module.scss.js.map

package/dist/mocked_classnames/src/components/BreadcrumbsBar/BreadcrumbsBar.module.scss.js

@@ -1,2 +1,2 @@
-var e={breadcrumbsBar:"breadcrumbsBar",separatorIcon:"separatorIcon"};!function(e){const n="s_id-24567fd55d40_4_5_3";if("undefined"!=typeof document){const r=document.head||document.getElementsByTagName("head")[0];if(r.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,r.firstChild?r.insertBefore(t,r.firstChild):r.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".breadcrumbsBar ol {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  white-space: nowrap;\n}\n\n.breadcrumbsBar ol .separatorIcon {\n  color: var(--secondary-text-color);\n  flex-shrink: 0;\n}");export{e as default};
+var e={breadcrumbsBar:"breadcrumbsBar",separatorIcon:"separatorIcon"};!function(e){const n="s_id-24567fd55d40_4_5_10";if("undefined"!=typeof document){const r=document.head||document.getElementsByTagName("head")[0];if(r.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,r.firstChild?r.insertBefore(t,r.firstChild):r.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".breadcrumbsBar ol {\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  white-space: nowrap;\n}\n\n.breadcrumbsBar ol .separatorIcon {\n  color: var(--secondary-text-color);\n  flex-shrink: 0;\n}");export{e as default};
 //# sourceMappingURL=BreadcrumbsBar.module.scss.js.map

package/dist/mocked_classnames/src/components/Chips/Chips.js

@@ -1,2 +1,2 @@
-import{slicedToArray as e,defineProperty as t}from"../../../_virtual/_rollupPluginBabelHelpers.js";import o,{forwardRef as i,useRef as a,useState as r,useCallback as s,useLayoutEffect as l,useMemo as n}from"react";import c from"classnames";import{Icon as d}from"@vibe/icon/mockedClassNames";import{useMergeRef as m}from"@vibe/shared";import{CloseSmall as u}from"@vibe/icons";import{getCSSVar as v}from"../../services/themes.js";import{getElementColor as f}from"../../types/Colors.js";import p from"../Avatar/Avatar.js";import{IconButton as b}from"@vibe/icon-button/mockedClassNames";import{Text as g}from"@vibe/typography/mockedClassNames";import{getTestId as y,ComponentDefaultTestId as h}from"../../tests/testIds.js";import C from"../../hooks/useSetFocus/index.js";import{useClickableProps as N}from"@vibe/clickable/mockedClassNames";import k from"./Chips.module.scss.js";import{ComponentVibeId as j}from"../../tests/constants.js";var w=i((function(i,w){var x,E=i.className,S=i.avatarClassName,A=i.iconClassName,O=i.id,M=i.label,T=void 0===M?"":M,z=i.leftIcon,B=void 0===z?null:z,I=i.rightIcon,L=void 0===I?null:I,P=i.leftAvatar,R=void 0===P?null:P,H=i.rightAvatar,D=void 0===H?null:H,F=i.disabled,_=void 0!==F&&F,U=i.variant,q=void 0===U?"default":U,G=i.readOnly,J=void 0!==G&&G,K=i.pressed,Q=void 0!==K&&K,V=i.size,W=void 0===V?"medium":V,X=i.allowTextSelection,Y=void 0!==X&&X,Z=i.color,$=void 0===Z?"primary":Z,ee=i.iconSize,te=i.onDelete,oe=void 0===te?function(e,t){}:te,ie=i.onMouseDown,ae=i.onClick,re=i.noAnimation,se=void 0===re||re,le=i.ariaLabel,ne=i.ariaHasPopup,ce=void 0!==ne&&ne,de=i.disableClickableBehavior,me=void 0!==de&&de,ue=i.leftAvatarType,ve=void 0===ue?"img":ue,fe=i.rightAvatarType,pe=void 0===fe?"img":fe,be=i.showBorder,ge=void 0!==be&&be,ye=i.leftRenderer,he=i.rightRenderer,Ce=i.closeButtonAriaLabel,Ne=void 0===Ce?"Remove":Ce,ke=i.noMargin,je=void 0!==ke&&ke,we=i["data-testid"]||y(h.CHIP,O),xe="filterable"===q,Ee=!xe&&(J||"readOnly"===q),Se="small"===W,Ae=xe?"primary":$,Oe=le||"string"==typeof T&&T||"",Me=null!=ee?ee:Se?14:18,Te=Se?14:18,ze=!Ee&&!_&&!xe,Be=!Ee&&(!me&&(!!ae||!!ie)||xe),Ie=a(null),Le=a(null),Pe=r(!1),Re=e(Pe,2),He=Re[0],De=Re[1],Fe=s((function(){Ee||De(!0)}),[Ee]),_e=s((function(){return De(!1)}),[]),Ue=C({ref:Le}).isFocused,qe=m(w,Le);l((function(){if(ze&&Le.current){var e=Le.current;e.style.width="",e.style.width="".concat(e.getBoundingClientRect().width,"px")}}),[ze,T,W,B,L,R,D,ye,he]);var Ge=!!(B||R||ye),Je=!!(L||D||he),Ke=c(k.chips,E,(t(t(t(t(t(t(t(t(t(t(x={},k.disabled,_),k.noAnimation,se),k.withUserSelect,Y),k.border,ge),k.noMargin,je),k.small,Se),k.readOnly,Ee),k.defaultCursor,Ee),k.filterable,xe),k.pressed,xe&&Q),t(t(t(x,k.withClose,ze),k.withLeftIcon,Ge),k.withRightIcon,Je))),Qe=c(k.clickable,Ke,t(t({},k.disabled,_),k.disableTextSelection,!Y)),Ve=n((function(){if(!xe)return{backgroundColor:_?v("disabled-background-color"):!Ee&&Be&&(He||Ue)?f(Ae,!0,!0):f(Ae,!0)}}),[_,Be,He,Ue,Ae,xe,Ee]),We=s((function(e){e.stopPropagation(),oe&&oe(O,e)}),[O,oe]),Xe=s((function(e){Ee||_||void 0!==ae&&e.target!==Ie.current&&(e.preventDefault(),ae(e))}),[ae,Ee,_]),Ye=s((function(e){Ee||_||null==ie||ie(e)}),[ie,Ee,_]),Ze=N({onClick:Xe,onMouseDown:Ye,disabled:_||Ee,id:O,"data-testid":we,ariaLabel:Oe,ariaHidden:!1,ariaHasPopup:ce,ariaExpanded:!1},qe),$e=Be?Object.assign(Object.assign(Object.assign({},Ze),{ref:qe,className:Qe,style:Ve,onMouseEnter:Fe,onMouseLeave:_e}),xe?{"aria-pressed":Q}:{}):{className:Ke,"aria-label":Oe,style:Ve,ref:qe,onClick:Ee?void 0:Xe,onMouseDown:Ee?void 0:Ye,id:O,"data-testid":we,onMouseEnter:Fe,onMouseLeave:_e},et="text"===ve?{text:R}:{src:R},tt="text"===ve?{text:D}:{src:D};return o.createElement("div",Object.assign({},$e,{"data-vibe":j.CHIPS,"data-variant":xe?"filterable":Ee?"readOnly":"default"}),R?o.createElement(p,Object.assign({withoutBorder:!0,className:c(k.avatar,k.left,S),customSize:Te,type:ve,key:O},et)):null,B?o.createElement(d,{className:c(k.icon,k.left,A),iconType:"font",icon:B,iconSize:Me,ignoreFocusStyle:!0}):null,ye&&o.createElement("div",{className:c(k.customRenderer,k.left)},ye),o.createElement(g,{type:Se?"text3":"text2",className:k.label},T),L?o.createElement(d,{className:c(k.icon,k.right,A),iconType:"font",icon:L,iconSize:Me,ignoreFocusStyle:!0}):null,D?o.createElement(p,Object.assign({withoutBorder:!0,className:c(k.avatar,k.right,S),customSize:Te,type:pe,key:O},tt)):null,he&&o.createElement("div",{className:c(k.customRenderer,k.right)},he),ze&&o.createElement(b,{size:"xxs",color:"on-primary-color",className:c(k.icon,k.close),ariaLabel:Ne,hideTooltip:!0,icon:u,onClick:We,"data-testid":"".concat(we,"-close"),ref:Ie}))}));export{w as default};
+import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import t,{forwardRef as i,useRef as a,useLayoutEffect as o,useMemo as r,useCallback as l}from"react";import{camelCase as s}from"es-toolkit";import n from"classnames";import{Icon as c}from"@vibe/icon/mockedClassNames";import{useMergeRef as d,getStyle as m}from"@vibe/shared";import{CloseSmall as v}from"@vibe/icons";import{isSemanticElementColor as u,getElementColor as f}from"../../types/Colors.js";import{Avatar as p}from"@vibe/avatar/mockedClassNames";import{IconButton as b}from"@vibe/icon-button/mockedClassNames";import{Text as g}from"@vibe/typography/mockedClassNames";import{getTestId as h,ComponentDefaultTestId as y}from"../../tests/testIds.js";import{useClickableProps as C}from"@vibe/clickable/mockedClassNames";import N from"./Chips.module.scss.js";import{ComponentVibeId as k}from"../../tests/constants.js";var w=i((function(i,w){var x,j=i.className,S=i.avatarClassName,E=i.iconClassName,O=i.id,z=i.label,A=void 0===z?"":z,B=i.leftIcon,I=void 0===B?null:B,P=i.rightIcon,R=void 0===P?null:P,T=i.leftAvatar,H=void 0===T?null:T,D=i.rightAvatar,M=void 0===D?null:D,L=i.disabled,F=void 0!==L&&L,_=i.variant,U=void 0===_?"default":_,q=i.readOnly,G=void 0!==q&&q,J=i.pressed,K=void 0!==J&&J,Q=i.size,V=void 0===Q?"medium":Q,W=i.allowTextSelection,X=void 0!==W&&W,Y=i.color,Z=void 0===Y?"primary":Y,$=i.iconSize,ee=i.onDelete,te=void 0===ee?function(e,t){}:ee,ie=i.onMouseDown,ae=i.onClick,oe=i.noAnimation,re=void 0===oe||oe,le=i.ariaLabel,se=i.ariaHasPopup,ne=void 0!==se&&se,ce=i.disableClickableBehavior,de=void 0!==ce&&ce,me=i.leftAvatarType,ve=void 0===me?"img":me,ue=i.rightAvatarType,fe=void 0===ue?"img":ue,pe=i.showBorder,be=void 0!==pe&&pe,ge=i.leftRenderer,he=i.rightRenderer,ye=i.closeButtonAriaLabel,Ce=void 0===ye?"Remove":ye,Ne=i.noMargin,ke=void 0!==Ne&&Ne,we=i["data-testid"]||h(y.CHIP,O),xe="filterable"===U,je=!xe&&(G||"readOnly"===U),Se="small"===V,Ee=xe?"primary":Z,Oe=le||"string"==typeof A&&A||"",ze=null!=$?$:Se?14:18,Ae=Se?14:18,Be=!je&&!F&&!xe,Ie=!je&&(!de&&(!!ae||!!ie)||xe),Pe=a(null),Re=a(null),Te=d(w,Re);o((function(){if(Be&&Re.current){var e=Re.current;e.style.width="",e.style.width="".concat(e.getBoundingClientRect().width,"px")}}),[Be,A,V,I,R,H,M,ge,he]);var He=!!(I||H||ge),De=!!(R||M||he),Me=!xe&&u(Ee)?m(N,s("color-"+Ee)):void 0,Le=n(N.chips,j,Me,(e(e(e(e(e(e(e(e(e(e(x={},N.disabled,F),N.noAnimation,re),N.withUserSelect,X),N.border,be),N.noMargin,ke),N.small,Se),N.readOnly,je),N.defaultCursor,je),N.filterable,xe),N.pressed,xe&&K),e(e(e(x,N.withClose,Be),N.withLeftIcon,He),N.withRightIcon,De))),Fe=n(N.clickable,Le,e(e({},N.disabled,F),N.disableTextSelection,!X)),_e=r((function(){if(!(xe||F||Me))return{"--chips-surface":f(Ee,!0)}}),[F,Ee,xe,Me]),Ue=l((function(e){e.stopPropagation(),te&&te(O,e)}),[O,te]),qe=l((function(e){je||F||void 0!==ae&&e.target!==Pe.current&&(e.preventDefault(),ae(e))}),[ae,je,F]),Ge=l((function(e){je||F||null==ie||ie(e)}),[ie,je,F]),Je=C({onClick:qe,onMouseDown:Ge,disabled:F||je,id:O,"data-testid":we,ariaLabel:Oe,ariaHidden:!1,ariaHasPopup:ne,ariaExpanded:!1},Te),Ke=Ie?Object.assign(Object.assign(Object.assign({},Je),{ref:Te,className:Fe,style:_e}),xe?{"aria-pressed":K}:{}):{className:Le,"aria-label":Oe,style:_e,ref:Te,onClick:je?void 0:qe,onMouseDown:je?void 0:Ge,id:O,"data-testid":we},Qe="text"===ve?{text:H}:{src:H},Ve="text"===ve?{text:M}:{src:M};return t.createElement("div",Object.assign({},Ke,{"data-vibe":k.CHIPS,"data-variant":xe?"filterable":je?"readOnly":"default"}),H?t.createElement(p,Object.assign({withoutBorder:!0,className:n(N.avatar,N.left,S),customSize:Ae,type:ve,key:O},Qe)):null,I?t.createElement(c,{className:n(N.icon,N.left,E),iconType:"font",icon:I,iconSize:ze,ignoreFocusStyle:!0}):null,ge&&t.createElement("div",{className:n(N.customRenderer,N.left)},ge),t.createElement(g,{type:Se?"text3":"text2",color:"inherit",className:N.label},A),R?t.createElement(c,{className:n(N.icon,N.right,E),iconType:"font",icon:R,iconSize:ze,ignoreFocusStyle:!0}):null,M?t.createElement(p,Object.assign({withoutBorder:!0,className:n(N.avatar,N.right,S),customSize:Ae,type:fe,key:O},Ve)):null,he&&t.createElement("div",{className:n(N.customRenderer,N.right)},he),Be&&t.createElement(b,{size:"xxs",className:n(N.icon,N.close),"aria-label":Ce,hideTooltip:!0,icon:v,onClick:Ue,"data-testid":"".concat(we,"-close"),ref:Pe}))}));export{w as default};
 //# sourceMappingURL=Chips.js.map

package/dist/mocked_classnames/src/components/Chips/Chips.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chips.js","sources":["../../../../../src/components/Chips/Chips.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useLayoutEffect, useMemo, useRef, useState } from \"react\";\nimport cx from \"classnames\";\nimport { Icon } from \"@vibe/icon\";\nimport { useMergeRef } from \"@vibe/shared\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport { getCSSVar } from \"../../services/themes\";\nimport { type ElementAllowedColor, getElementColor } from \"../../types/Colors\";\nimport Avatar from \"../Avatar/Avatar\";\nimport { IconButton } from \"@vibe/icon-button\";\nimport { Text } from \"@vibe/typography\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { type AvatarType } from \"../Avatar\";\nimport { type ElementContent, type VibeComponentProps } from \"../../types\";\nimport { type SubIcon } from \"@vibe/icon\";\nimport useSetFocus from \"../../hooks/useSetFocus\";\nimport { useClickableProps } from \"@vibe/clickable\";\nimport styles from \"./Chips.module.scss\";\nimport { ComponentVibeId } from \"../../tests/constants\";\nimport { type ChipsVariant, type ChipsSize } from \"./Chips.types\";\n\nconst CHIPS_AVATAR_SIZE = 18;\nconst CHIPS_AVATAR_SIZE_SMALL = 14;\n\nexport interface ChipsProps extends VibeComponentProps {\n  /**\n   * The text or content displayed inside the chip.\n   */\n  label?: ElementContent;\n  /**\n   * Visual and behavioral variant of the chip.\n   * - `default` — standard chip (colors, optional remove / click)\n   * - `readOnly` — display only; no interaction\n   * - `filterable` — primary theme only; default / hover / pressed states\n   */\n  variant?: ChipsVariant;\n  /**\n   * If true, the chip is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * If true, the chip is read-only and cannot be deleted or interacted with.\n   * Prefer `variant=\"readOnly\"` for new usage.\n   */\n  readOnly?: boolean;\n  /**\n   * When `variant=\"filterable\"`, shows the pressed (selected) state.\n   */\n  pressed?: boolean;\n  /**\n   * The size of the chip.\n   * - `medium` — default (24px height)\n   * - `small` — 20px height, 12px text\n   */\n  size?: ChipsSize;\n  /**\n   * A React element displayed on the right side.\n   */\n  rightRenderer?: ElementContent;\n  /**\n   * A React element displayed on the left side.\n   */\n  leftRenderer?: ElementContent;\n  /**\n   * Icon displayed on the right side.\n   */\n  rightIcon?: SubIcon;\n  /**\n   * Icon displayed on the left side.\n   */\n  leftIcon?: SubIcon;\n  /**\n   * Image URL or text for an avatar displayed on the right.\n   */\n  rightAvatar?: string;\n  /**\n   * The type of avatar displayed on the right.\n   */\n  rightAvatarType?: AvatarType;\n  /**\n   * Image URL or text for an avatar displayed on the left.\n   */\n  leftAvatar?: string;\n  /**\n   * The type of avatar displayed on the left.\n   */\n  leftAvatarType?: AvatarType;\n  /**\n   * Class name applied to left or right icons.\n   */\n  iconClassName?: string;\n  /**\n   * Class name applied to left or right avatars.\n   */\n  avatarClassName?: string;\n  /**\n   * The background color of the chip.\n   * Ignored when `variant=\"filterable\"` (always primary).\n   */\n  color?: Exclude<ElementAllowedColor, \"dark_indigo\" | \"blackish\">;\n  /**\n   * The size of the icons inside the chip.\n   */\n  iconSize?: number | string;\n  /**\n   * Callback fired when the chip is deleted.\n   */\n  onDelete?: (id: string, event: React.MouseEvent<HTMLSpanElement>) => void;\n  /**\n   * If true, disables the chip's entry animation.\n   */\n  noAnimation?: boolean;\n  /**\n   * If true, allows the user to select text inside the chip.\n   */\n  allowTextSelection?: boolean;\n  /**\n   * Callback fired when the mouse button is pressed on the chip.\n   */\n  onMouseDown?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n  /**\n   * Callback fired when the chip is clicked.\n   */\n  onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n  /**\n   * The label of the chip for accessibility.\n   */\n  ariaLabel?: string;\n  /**\n   * If true, indicates that the chip has a popup.\n   */\n  ariaHasPopup?: boolean;\n  /**\n   * If true, disables all click behaviors.\n   */\n  disableClickableBehavior?: boolean;\n  /**\n   * If true, displays a border around the chip.\n   */\n  showBorder?: boolean;\n  /**\n   * The label for the close button.\n   */\n  closeButtonAriaLabel?: string;\n  /**\n   * If true, removes the default margin from the chip.\n   */\n  noMargin?: boolean;\n}\n\nconst Chips = forwardRef(\n  (\n    {\n      className,\n      avatarClassName,\n      iconClassName,\n      id,\n      label = \"\",\n      leftIcon = null,\n      rightIcon = null,\n      leftAvatar = null,\n      rightAvatar = null,\n      disabled = false,\n      variant = \"default\",\n      readOnly = false,\n      pressed = false,\n      size = \"medium\",\n      allowTextSelection = false,\n      color = \"primary\",\n      iconSize,\n      onDelete = (_id: string, _e: React.MouseEvent<HTMLSpanElement>) => {},\n      onMouseDown,\n      onClick,\n      noAnimation = true,\n      ariaLabel,\n      ariaHasPopup = false,\n      \"data-testid\": dataTestId,\n      disableClickableBehavior = false,\n      leftAvatarType = \"img\",\n      rightAvatarType = \"img\",\n      showBorder = false,\n      leftRenderer,\n      rightRenderer,\n      closeButtonAriaLabel = \"Remove\",\n      noMargin = false\n    }: ChipsProps,\n    ref: React.ForwardedRef<HTMLDivElement>\n  ) => {\n    const componentDataTestId = dataTestId || getTestId(ComponentDefaultTestId.CHIP, id);\n    const isFilterable = variant === \"filterable\";\n    const isReadOnly = !isFilterable && (readOnly || variant === \"readOnly\");\n    const isSmall = size === \"small\";\n    const resolvedColor = isFilterable ? \"primary\" : color;\n    const overrideAriaLabel = ariaLabel || (typeof label === \"string\" && label) || \"\";\n    const resolvedIconSize = iconSize ?? (isSmall ? 14 : 18);\n    const resolvedAvatarSize = isSmall ? CHIPS_AVATAR_SIZE_SMALL : CHIPS_AVATAR_SIZE;\n\n    const hasCloseButton = !isReadOnly && !disabled && !isFilterable;\n    const hasClickableWrapper =\n      !isReadOnly && ((!disableClickableBehavior && (!!onClick || !!onMouseDown)) || isFilterable);\n\n    const iconButtonRef = useRef(null);\n    const componentRef = useRef(null);\n\n    const [isHovered, setIsHovered] = useState(false);\n    const handleMouseEnter = useCallback(() => {\n      if (!isReadOnly) setIsHovered(true);\n    }, [isReadOnly]);\n    const handleMouseLeave = useCallback(() => setIsHovered(false), []);\n    const { isFocused } = useSetFocus({ ref: componentRef });\n\n    const mergedRef = useMergeRef<HTMLDivElement>(ref, componentRef);\n\n    // Lock resting width (close is absolutely positioned) so hover padding truncates label instead of growing the chip\n    useLayoutEffect(() => {\n      if (!hasCloseButton || !componentRef.current) return;\n      const el = componentRef.current;\n      el.style.width = \"\";\n      el.style.width = `${el.getBoundingClientRect().width}px`;\n    }, [hasCloseButton, label, size, leftIcon, rightIcon, leftAvatar, rightAvatar, leftRenderer, rightRenderer]);\n\n    const hasLeftIcon = Boolean(leftIcon || leftAvatar || leftRenderer);\n    const hasRightIcon = Boolean(rightIcon || rightAvatar || rightRenderer);\n\n    const overrideClassName = cx(styles.chips, className, {\n      [styles.disabled]: disabled,\n      [styles.noAnimation]: noAnimation,\n      [styles.withUserSelect]: allowTextSelection,\n      [styles.border]: showBorder,\n      [styles.noMargin]: noMargin,\n      [styles.small]: isSmall,\n      [styles.readOnly]: isReadOnly,\n      [styles.defaultCursor]: isReadOnly,\n      [styles.filterable]: isFilterable,\n      [styles.pressed]: isFilterable && pressed,\n      [styles.withClose]: hasCloseButton,\n      [styles.withLeftIcon]: hasLeftIcon,\n      [styles.withRightIcon]: hasRightIcon\n    });\n    const clickableClassName = cx(styles.clickable, overrideClassName, {\n      [styles.disabled]: disabled,\n      [styles.disableTextSelection]: !allowTextSelection\n    });\n\n    const backgroundColorStyle = useMemo(() => {\n      if (isFilterable) {\n        return undefined;\n      }\n      let cssVar;\n      if (disabled) {\n        cssVar = getCSSVar(\"disabled-background-color\");\n      } else if (!isReadOnly && hasClickableWrapper && (isHovered || isFocused)) {\n        cssVar = getElementColor(resolvedColor, true, true);\n      } else {\n        cssVar = getElementColor(resolvedColor, true);\n      }\n      return { backgroundColor: cssVar };\n    }, [disabled, hasClickableWrapper, isHovered, isFocused, resolvedColor, isFilterable, isReadOnly]);\n\n    const onDeleteCallback = useCallback(\n      (e: React.MouseEvent<HTMLSpanElement, MouseEvent>) => {\n        e.stopPropagation();\n        if (onDelete) {\n          onDelete(id, e);\n        }\n      },\n      [id, onDelete]\n    );\n\n    const onClickCallback = useCallback(\n      (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n        if (isReadOnly || disabled) {\n          return;\n        }\n        if (onClick !== undefined && (e.target as HTMLElement) !== iconButtonRef.current) {\n          e.preventDefault();\n          onClick(e);\n        }\n      },\n      [onClick, isReadOnly, disabled]\n    );\n\n    const onMouseDownCallback = useCallback(\n      (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n        if (isReadOnly || disabled) {\n          return;\n        }\n        onMouseDown?.(e);\n      },\n      [onMouseDown, isReadOnly, disabled]\n    );\n\n    const clickableProps = useClickableProps(\n      {\n        onClick: onClickCallback,\n        onMouseDown: onMouseDownCallback,\n        disabled: disabled || isReadOnly,\n        id,\n        \"data-testid\": componentDataTestId,\n        ariaLabel: overrideAriaLabel,\n        ariaHidden: false,\n        ariaHasPopup,\n        ariaExpanded: false\n      },\n      mergedRef\n    );\n    const wrapperProps = hasClickableWrapper\n      ? {\n          ...clickableProps,\n          ref: mergedRef,\n          className: clickableClassName,\n          style: backgroundColorStyle,\n          onMouseEnter: handleMouseEnter,\n          onMouseLeave: handleMouseLeave,\n          ...(isFilterable ? { \"aria-pressed\": pressed } : {})\n        }\n      : {\n          className: overrideClassName,\n          \"aria-label\": overrideAriaLabel,\n          style: backgroundColorStyle,\n          ref: mergedRef,\n          onClick: isReadOnly ? undefined : onClickCallback,\n          onMouseDown: isReadOnly ? undefined : onMouseDownCallback,\n          id: id,\n          \"data-testid\": componentDataTestId,\n          onMouseEnter: handleMouseEnter,\n          onMouseLeave: handleMouseLeave\n        };\n\n    const leftAvatarProps = leftAvatarType === \"text\" ? { text: leftAvatar } : { src: leftAvatar };\n    const rightAvatarProps = leftAvatarType === \"text\" ? { text: rightAvatar } : { src: rightAvatar };\n\n    return (\n      <div\n        {...wrapperProps}\n        data-vibe={ComponentVibeId.CHIPS}\n        data-variant={isFilterable ? \"filterable\" : isReadOnly ? \"readOnly\" : \"default\"}\n      >\n        {leftAvatar ? (\n          <Avatar\n            withoutBorder\n            className={cx(styles.avatar, styles.left, avatarClassName)}\n            customSize={resolvedAvatarSize}\n            type={leftAvatarType}\n            key={id}\n            {...leftAvatarProps}\n          />\n        ) : null}\n        {leftIcon ? (\n          <Icon\n            className={cx(styles.icon, styles.left, iconClassName)}\n            iconType=\"font\"\n            icon={leftIcon}\n            iconSize={resolvedIconSize}\n            ignoreFocusStyle\n          />\n        ) : null}\n        {leftRenderer && <div className={cx(styles.customRenderer, styles.left)}>{leftRenderer}</div>}\n        <Text type={isSmall ? \"text3\" : \"text2\"} className={styles.label}>\n          {label}\n        </Text>\n        {rightIcon ? (\n          <Icon\n            className={cx(styles.icon, styles.right, iconClassName)}\n            iconType=\"font\"\n            icon={rightIcon}\n            iconSize={resolvedIconSize}\n            ignoreFocusStyle\n          />\n        ) : null}\n        {rightAvatar ? (\n          <Avatar\n            withoutBorder\n            className={cx(styles.avatar, styles.right, avatarClassName)}\n            customSize={resolvedAvatarSize}\n            type={rightAvatarType}\n            key={id}\n            {...rightAvatarProps}\n          />\n        ) : null}\n        {rightRenderer && <div className={cx(styles.customRenderer, styles.right)}>{rightRenderer}</div>}\n        {hasCloseButton && (\n          <IconButton\n            size=\"xxs\"\n            color=\"on-primary-color\"\n            className={cx(styles.icon, styles.close)}\n            ariaLabel={closeButtonAriaLabel}\n            hideTooltip\n            icon={CloseSmall}\n            onClick={onDeleteCallback}\n            data-testid={`${componentDataTestId}-close`}\n            ref={iconButtonRef}\n          />\n        )}\n      </div>\n    );\n  }\n);\n\nexport default Chips;\n"],"names":["Chips","forwardRef","_ref","ref","_cx","className","avatarClassName","iconClassName","id","_ref$label","label","_ref$leftIcon","leftIcon","_ref$rightIcon","rightIcon","_ref$leftAvatar","leftAvatar","_ref$rightAvatar","rightAvatar","_ref$disabled","disabled","_ref$variant","variant","_ref$readOnly","readOnly","_ref$pressed","pressed","_ref$size","size","_ref$allowTextSelecti","allowTextSelection","_ref$color","color","iconSize","_ref$onDelete","onDelete","_id","_e","onMouseDown","onClick","_ref$noAnimation","noAnimation","ariaLabel","_ref$ariaHasPopup","ariaHasPopup","_ref$disableClickable","disableClickableBehavior","_ref$leftAvatarType","leftAvatarType","_ref$rightAvatarType","rightAvatarType","_ref$showBorder","showBorder","leftRenderer","rightRenderer","_ref$closeButtonAriaL","closeButtonAriaLabel","_ref$noMargin","noMargin","componentDataTestId","getTestId","ComponentDefaultTestId","CHIP","isFilterable","isReadOnly","isSmall","resolvedColor","overrideAriaLabel","resolvedIconSize","resolvedAvatarSize","hasCloseButton","hasClickableWrapper","iconButtonRef","useRef","componentRef","_useState","useState","_useState2","_slicedToArray","isHovered","setIsHovered","handleMouseEnter","useCallback","handleMouseLeave","isFocused","useSetFocus","mergedRef","useMergeRef","useLayoutEffect","current","el","style","width","concat","getBoundingClientRect","hasLeftIcon","hasRightIcon","overrideClassName","cx","styles","chips","_defineProperty","withUserSelect","border","small","defaultCursor","filterable","withClose","withLeftIcon","withRightIcon","clickableClassName","clickable","disableTextSelection","backgroundColorStyle","useMemo","backgroundColor","getCSSVar","getElementColor","onDeleteCallback","e","stopPropagation","onClickCallback","undefined","target","preventDefault","onMouseDownCallback","clickableProps","useClickableProps","ariaHidden","ariaExpanded","wrapperProps","onMouseEnter","onMouseLeave","leftAvatarProps","text","src","rightAvatarProps","React","createElement","Object","assign","ComponentVibeId","CHIPS","Avatar","withoutBorder","avatar","left","customSize","type","key","Icon","icon","iconType","ignoreFocusStyle","customRenderer","Text","right","IconButton","close","hideTooltip","CloseSmall"],"mappings":"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"}
+{"version":3,"file":"Chips.js","sources":["../../../../../src/components/Chips/Chips.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useLayoutEffect, useMemo, useRef } from \"react\";\nimport { camelCase } from \"es-toolkit\";\nimport cx from \"classnames\";\nimport { Icon } from \"@vibe/icon\";\nimport { getStyle, useMergeRef } from \"@vibe/shared\";\nimport { CloseSmall } from \"@vibe/icons\";\nimport { type ElementAllowedColor, getElementColor, isSemanticElementColor } from \"../../types/Colors\";\nimport { Avatar, type AvatarType } from \"@vibe/avatar\";\nimport { IconButton } from \"@vibe/icon-button\";\nimport { Text } from \"@vibe/typography\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { type ElementContent, type VibeComponentProps } from \"../../types\";\nimport { type SubIcon } from \"@vibe/icon\";\nimport { useClickableProps } from \"@vibe/clickable\";\nimport styles from \"./Chips.module.scss\";\nimport { ComponentVibeId } from \"../../tests/constants\";\nimport { type ChipsVariant, type ChipsSize } from \"./Chips.types\";\n\nconst CHIPS_AVATAR_SIZE = 18;\nconst CHIPS_AVATAR_SIZE_SMALL = 14;\n\nexport interface ChipsProps extends VibeComponentProps {\n  /**\n   * The text or content displayed inside the chip.\n   */\n  label?: ElementContent;\n  /**\n   * Visual and behavioral variant of the chip.\n   * - `default` — standard chip (colors, optional remove / click)\n   * - `readOnly` — display only; no interaction\n   * - `filterable` — primary theme only; default / hover / pressed states\n   */\n  variant?: ChipsVariant;\n  /**\n   * If true, the chip is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * If true, the chip is read-only and cannot be deleted or interacted with.\n   * Prefer `variant=\"readOnly\"` for new usage.\n   */\n  readOnly?: boolean;\n  /**\n   * When `variant=\"filterable\"`, shows the pressed (selected) state.\n   */\n  pressed?: boolean;\n  /**\n   * The size of the chip.\n   * - `medium` — default (24px height)\n   * - `small` — 20px height, 12px text\n   */\n  size?: ChipsSize;\n  /**\n   * A React element displayed on the right side.\n   */\n  rightRenderer?: ElementContent;\n  /**\n   * A React element displayed on the left side.\n   */\n  leftRenderer?: ElementContent;\n  /**\n   * Icon displayed on the right side.\n   */\n  rightIcon?: SubIcon;\n  /**\n   * Icon displayed on the left side.\n   */\n  leftIcon?: SubIcon;\n  /**\n   * Image URL or text for an avatar displayed on the right.\n   */\n  rightAvatar?: string;\n  /**\n   * The type of avatar displayed on the right.\n   */\n  rightAvatarType?: AvatarType;\n  /**\n   * Image URL or text for an avatar displayed on the left.\n   */\n  leftAvatar?: string;\n  /**\n   * The type of avatar displayed on the left.\n   */\n  leftAvatarType?: AvatarType;\n  /**\n   * Class name applied to left or right icons.\n   */\n  iconClassName?: string;\n  /**\n   * Class name applied to left or right avatars.\n   */\n  avatarClassName?: string;\n  /**\n   * The background color of the chip.\n   * Ignored when `variant=\"filterable\"` (always primary).\n   */\n  color?: Exclude<ElementAllowedColor, \"dark_indigo\" | \"blackish\">;\n  /**\n   * The size of the icons inside the chip.\n   */\n  iconSize?: number | string;\n  /**\n   * Callback fired when the chip is deleted.\n   */\n  onDelete?: (id: string, event: React.MouseEvent<HTMLSpanElement>) => void;\n  /**\n   * If true, disables the chip's entry animation.\n   */\n  noAnimation?: boolean;\n  /**\n   * If true, allows the user to select text inside the chip.\n   */\n  allowTextSelection?: boolean;\n  /**\n   * Callback fired when the mouse button is pressed on the chip.\n   */\n  onMouseDown?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n  /**\n   * Callback fired when the chip is clicked.\n   */\n  onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n  /**\n   * The label of the chip for accessibility.\n   */\n  ariaLabel?: string;\n  /**\n   * If true, indicates that the chip has a popup.\n   */\n  ariaHasPopup?: boolean;\n  /**\n   * If true, disables all click behaviors.\n   */\n  disableClickableBehavior?: boolean;\n  /**\n   * If true, displays a border around the chip.\n   */\n  showBorder?: boolean;\n  /**\n   * The label for the close button.\n   */\n  closeButtonAriaLabel?: string;\n  /**\n   * If true, removes the default margin from the chip.\n   */\n  noMargin?: boolean;\n}\n\nconst Chips = forwardRef(\n  (\n    {\n      className,\n      avatarClassName,\n      iconClassName,\n      id,\n      label = \"\",\n      leftIcon = null,\n      rightIcon = null,\n      leftAvatar = null,\n      rightAvatar = null,\n      disabled = false,\n      variant = \"default\",\n      readOnly = false,\n      pressed = false,\n      size = \"medium\",\n      allowTextSelection = false,\n      color = \"primary\",\n      iconSize,\n      onDelete = (_id: string, _e: React.MouseEvent<HTMLSpanElement>) => {},\n      onMouseDown,\n      onClick,\n      noAnimation = true,\n      ariaLabel,\n      ariaHasPopup = false,\n      \"data-testid\": dataTestId,\n      disableClickableBehavior = false,\n      leftAvatarType = \"img\",\n      rightAvatarType = \"img\",\n      showBorder = false,\n      leftRenderer,\n      rightRenderer,\n      closeButtonAriaLabel = \"Remove\",\n      noMargin = false\n    }: ChipsProps,\n    ref: React.ForwardedRef<HTMLDivElement>\n  ) => {\n    const componentDataTestId = dataTestId || getTestId(ComponentDefaultTestId.CHIP, id);\n    const isFilterable = variant === \"filterable\";\n    const isReadOnly = !isFilterable && (readOnly || variant === \"readOnly\");\n    const isSmall = size === \"small\";\n    const resolvedColor = isFilterable ? \"primary\" : color;\n    const overrideAriaLabel = ariaLabel || (typeof label === \"string\" && label) || \"\";\n    const resolvedIconSize = iconSize ?? (isSmall ? 14 : 18);\n    const resolvedAvatarSize = isSmall ? CHIPS_AVATAR_SIZE_SMALL : CHIPS_AVATAR_SIZE;\n\n    const hasCloseButton = !isReadOnly && !disabled && !isFilterable;\n    const hasClickableWrapper =\n      !isReadOnly && ((!disableClickableBehavior && (!!onClick || !!onMouseDown)) || isFilterable);\n\n    const iconButtonRef = useRef(null);\n    const componentRef = useRef(null);\n\n    const mergedRef = useMergeRef<HTMLDivElement>(ref, componentRef);\n\n    // Lock resting width (close is absolutely positioned) so hover padding truncates label instead of growing the chip\n    useLayoutEffect(() => {\n      if (!hasCloseButton || !componentRef.current) return;\n      const el = componentRef.current;\n      el.style.width = \"\";\n      el.style.width = `${el.getBoundingClientRect().width}px`;\n    }, [hasCloseButton, label, size, leftIcon, rightIcon, leftAvatar, rightAvatar, leftRenderer, rightRenderer]);\n\n    const hasLeftIcon = Boolean(leftIcon || leftAvatar || leftRenderer);\n    const hasRightIcon = Boolean(rightIcon || rightAvatar || rightRenderer);\n\n    // Semantic colors are styled by class (same `color-*` pattern as Label), so the fill\n    // lives in CSS and consumers can override it without !important. `filterable` owns its\n    // own fill, so it opts out.\n    const semanticColorClassName =\n      !isFilterable && isSemanticElementColor(resolvedColor)\n        ? getStyle(styles, camelCase(\"color-\" + resolvedColor))\n        : undefined;\n\n    const overrideClassName = cx(styles.chips, className, semanticColorClassName, {\n      [styles.disabled]: disabled,\n      [styles.noAnimation]: noAnimation,\n      [styles.withUserSelect]: allowTextSelection,\n      [styles.border]: showBorder,\n      [styles.noMargin]: noMargin,\n      [styles.small]: isSmall,\n      [styles.readOnly]: isReadOnly,\n      [styles.defaultCursor]: isReadOnly,\n      [styles.filterable]: isFilterable,\n      [styles.pressed]: isFilterable && pressed,\n      [styles.withClose]: hasCloseButton,\n      [styles.withLeftIcon]: hasLeftIcon,\n      [styles.withRightIcon]: hasRightIcon\n    });\n    const clickableClassName = cx(styles.clickable, overrideClassName, {\n      [styles.disabled]: disabled,\n      [styles.disableTextSelection]: !allowTextSelection\n    });\n\n    /**\n     * Content colors (there are ~40) can't reasonably each get a class, so they pass their\n     * palette in as custom properties and CSS applies them. That keeps `background-color`\n     * out of the inline style, so hover is a plain `:hover` rule rather than React state,\n     * and consumers can restyle a chip with ordinary specificity.\n     */\n    const contentColorStyle = useMemo(() => {\n      if (isFilterable || disabled || semanticColorClassName) {\n        return undefined;\n      }\n      // No --chips-surface-hover: content colors have no `--color-*-selected-hover` token,\n      // so getElementColor ignores the hover palette for them. The CSS falls back to the\n      // resting fill, which is what the previous JS hover branch also produced.\n      return { \"--chips-surface\": getElementColor(resolvedColor, true) } as React.CSSProperties;\n    }, [disabled, resolvedColor, isFilterable, semanticColorClassName]);\n\n    const onDeleteCallback = useCallback(\n      (e: React.MouseEvent<HTMLSpanElement, MouseEvent>) => {\n        e.stopPropagation();\n        if (onDelete) {\n          onDelete(id, e);\n        }\n      },\n      [id, onDelete]\n    );\n\n    const onClickCallback = useCallback(\n      (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n        if (isReadOnly || disabled) {\n          return;\n        }\n        if (onClick !== undefined && (e.target as HTMLElement) !== iconButtonRef.current) {\n          e.preventDefault();\n          onClick(e);\n        }\n      },\n      [onClick, isReadOnly, disabled]\n    );\n\n    const onMouseDownCallback = useCallback(\n      (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n        if (isReadOnly || disabled) {\n          return;\n        }\n        onMouseDown?.(e);\n      },\n      [onMouseDown, isReadOnly, disabled]\n    );\n\n    const clickableProps = useClickableProps(\n      {\n        onClick: onClickCallback,\n        onMouseDown: onMouseDownCallback,\n        disabled: disabled || isReadOnly,\n        id,\n        \"data-testid\": componentDataTestId,\n        ariaLabel: overrideAriaLabel,\n        ariaHidden: false,\n        ariaHasPopup,\n        ariaExpanded: false\n      },\n      mergedRef\n    );\n    const wrapperProps = hasClickableWrapper\n      ? {\n          ...clickableProps,\n          ref: mergedRef,\n          className: clickableClassName,\n          style: contentColorStyle,\n          ...(isFilterable ? { \"aria-pressed\": pressed } : {})\n        }\n      : {\n          className: overrideClassName,\n          \"aria-label\": overrideAriaLabel,\n          style: contentColorStyle,\n          ref: mergedRef,\n          onClick: isReadOnly ? undefined : onClickCallback,\n          onMouseDown: isReadOnly ? undefined : onMouseDownCallback,\n          id: id,\n          \"data-testid\": componentDataTestId\n        };\n\n    const leftAvatarProps = leftAvatarType === \"text\" ? { text: leftAvatar } : { src: leftAvatar };\n    const rightAvatarProps = leftAvatarType === \"text\" ? { text: rightAvatar } : { src: rightAvatar };\n\n    return (\n      <div\n        {...wrapperProps}\n        data-vibe={ComponentVibeId.CHIPS}\n        data-variant={isFilterable ? \"filterable\" : isReadOnly ? \"readOnly\" : \"default\"}\n      >\n        {leftAvatar ? (\n          <Avatar\n            withoutBorder\n            className={cx(styles.avatar, styles.left, avatarClassName)}\n            customSize={resolvedAvatarSize}\n            type={leftAvatarType}\n            key={id}\n            {...leftAvatarProps}\n          />\n        ) : null}\n        {leftIcon ? (\n          <Icon\n            className={cx(styles.icon, styles.left, iconClassName)}\n            iconType=\"font\"\n            icon={leftIcon}\n            iconSize={resolvedIconSize}\n            ignoreFocusStyle\n          />\n        ) : null}\n        {leftRenderer && <div className={cx(styles.customRenderer, styles.left)}>{leftRenderer}</div>}\n        {/* `inherit` so the label follows the chip's colour (--text-on-surface-* for semantic\n            colors, set inline on the root). Text's default would pin --primary-text-color and\n            leave the label out of step with the icons, which use currentColor. */}\n        <Text type={isSmall ? \"text3\" : \"text2\"} color=\"inherit\" className={styles.label}>\n          {label}\n        </Text>\n        {rightIcon ? (\n          <Icon\n            className={cx(styles.icon, styles.right, iconClassName)}\n            iconType=\"font\"\n            icon={rightIcon}\n            iconSize={resolvedIconSize}\n            ignoreFocusStyle\n          />\n        ) : null}\n        {rightAvatar ? (\n          <Avatar\n            withoutBorder\n            className={cx(styles.avatar, styles.right, avatarClassName)}\n            customSize={resolvedAvatarSize}\n            type={rightAvatarType}\n            key={id}\n            {...rightAvatarProps}\n          />\n        ) : null}\n        {rightRenderer && <div className={cx(styles.customRenderer, styles.right)}>{rightRenderer}</div>}\n        {hasCloseButton && (\n          <IconButton\n            size=\"xxs\"\n            className={cx(styles.icon, styles.close)}\n            aria-label={closeButtonAriaLabel}\n            hideTooltip\n            icon={CloseSmall}\n            onClick={onDeleteCallback}\n            data-testid={`${componentDataTestId}-close`}\n            ref={iconButtonRef}\n          />\n        )}\n      </div>\n    );\n  }\n);\n\nexport default Chips;\n"],"names":["Chips","forwardRef","_ref","ref","_cx","className","avatarClassName","iconClassName","id","_ref$label","label","_ref$leftIcon","leftIcon","_ref$rightIcon","rightIcon","_ref$leftAvatar","leftAvatar","_ref$rightAvatar","rightAvatar","_ref$disabled","disabled","_ref$variant","variant","_ref$readOnly","readOnly","_ref$pressed","pressed","_ref$size","size","_ref$allowTextSelecti","allowTextSelection","_ref$color","color","iconSize","_ref$onDelete","onDelete","_id","_e","onMouseDown","onClick","_ref$noAnimation","noAnimation","ariaLabel","_ref$ariaHasPopup","ariaHasPopup","_ref$disableClickable","disableClickableBehavior","_ref$leftAvatarType","leftAvatarType","_ref$rightAvatarType","rightAvatarType","_ref$showBorder","showBorder","leftRenderer","rightRenderer","_ref$closeButtonAriaL","closeButtonAriaLabel","_ref$noMargin","noMargin","componentDataTestId","getTestId","ComponentDefaultTestId","CHIP","isFilterable","isReadOnly","isSmall","resolvedColor","overrideAriaLabel","resolvedIconSize","resolvedAvatarSize","hasCloseButton","hasClickableWrapper","iconButtonRef","useRef","componentRef","mergedRef","useMergeRef","useLayoutEffect","current","el","style","width","concat","getBoundingClientRect","hasLeftIcon","hasRightIcon","semanticColorClassName","isSemanticElementColor","getStyle","styles","camelCase","undefined","overrideClassName","cx","chips","_defineProperty","withUserSelect","border","small","defaultCursor","filterable","withClose","withLeftIcon","withRightIcon","clickableClassName","clickable","disableTextSelection","contentColorStyle","useMemo","getElementColor","onDeleteCallback","useCallback","e","stopPropagation","onClickCallback","target","preventDefault","onMouseDownCallback","clickableProps","useClickableProps","ariaHidden","ariaExpanded","wrapperProps","Object","assign","leftAvatarProps","text","src","rightAvatarProps","React","createElement","ComponentVibeId","CHIPS","Avatar","withoutBorder","avatar","left","customSize","type","key","Icon","icon","iconType","ignoreFocusStyle","customRenderer","Text","right","IconButton","close","hideTooltip","CloseSmall"],"mappings":"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"}

package/dist/mocked_classnames/src/components/Chips/Chips.module.scss.js

@@ -1,2 +1,2 @@
-var n={chips:"chips","chips-pop-in-emphasized":"chips-pop-in-emphasized",border:"border",withUserSelect:"withUserSelect",noMargin:"noMargin",withLeftIcon:"withLeftIcon",withRightIcon:"withRightIcon",withClose:"withClose",label:"label",icon:"icon",close:"close",small:"small",avatar:"avatar",customRenderer:"customRenderer",noAnimation:"noAnimation",left:"left",right:"right",disabled:"disabled",defaultCursor:"defaultCursor",readOnly:"readOnly",filterable:"filterable",pressed:"pressed",clickable:"clickable","focus-visible":"focus-visible",disableTextSelection:"disableTextSelection"};!function(n){const e="s_id-ed3055b733bb_4_5_3";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+e))return;const o=document.createElement("style");o.id=e,i.firstChild?i.insertBefore(o,i.firstChild):i.appendChild(o),o.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable */\n/* stylelint-enable */\n.chips {\n  display: inline-flex;\n  overflow: hidden;\n  height: 24px;\n  border-radius: var(--border-radius-full);\n  padding: 0 8px;\n  align-items: center;\n  justify-content: center;\n  margin: var(--chips-margin, 0 var(--spacing-xs));\n  user-select: none;\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  color: var(--primary-text-color);\n  animation: chips-pop-in-emphasized var(--motion-productive-medium) var(--motion-timing-emphasize);\n  /* Medium: 8px default; 4px on sides that have an icon */\n}\n.chips.border {\n  border: 1px solid var(--primary-background-color);\n}\n.chips.withUserSelect {\n  user-select: text;\n  cursor: text;\n}\n.chips.noMargin {\n  margin: 0;\n}\n.chips.withLeftIcon {\n  padding-inline-start: 4px;\n}\n.chips.withRightIcon {\n  padding-inline-end: 4px;\n}\n.chips.withClose {\n  position: relative;\n  box-sizing: border-box;\n}\n.chips.withClose .label {\n  min-width: 0;\n  flex: 1 1 auto;\n}\n.chips.withClose .icon.close {\n  position: absolute;\n  inset-inline-end: 4px;\n  top: 50%;\n  transform: translateY(-50%);\n  margin: 0;\n  opacity: 0;\n  pointer-events: none;\n  z-index: 1;\n}\n.chips.withClose:hover, .chips.withClose:focus-within {\n  /* Keep overall width stable; carve space for the close control inside the chip */\n  padding-inline-end: 26px;\n}\n.chips.withClose:hover .icon.close, .chips.withClose:focus-within .icon.close {\n  opacity: 1;\n  pointer-events: auto;\n}\n.chips.withClose.small:hover, .chips.withClose.small:focus-within {\n  padding-inline-end: 22px;\n}\n.chips.small {\n  height: 20px;\n  /* Small: 4px default; 2px on sides that have an icon */\n  padding: 0 4px;\n}\n.chips.small.withLeftIcon {\n  padding-inline-start: 2px;\n}\n.chips.small.withRightIcon {\n  padding-inline-end: 2px;\n}\n.chips.small .icon,\n.chips.small .avatar,\n.chips.small .customRenderer {\n  min-width: 14px;\n}\n.chips .label {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.chips.noAnimation {\n  animation: none;\n}\n.chips .icon,\n.chips .avatar,\n.chips .customRenderer {\n  min-width: 18px;\n}\n.chips .icon.left,\n.chips .avatar.left,\n.chips .customRenderer.left {\n  margin-right: var(--spacing-xs);\n}\n.chips .icon.right,\n.chips .avatar.right,\n.chips .customRenderer.right {\n  margin-left: var(--spacing-xs);\n}\n.chips .icon.close,\n.chips .avatar.close,\n.chips .customRenderer.close {\n  margin-left: var(--spacing-xs);\n  color: var(--primary-text-color);\n}\n.chips .icon {\n  color: currentColor;\n}\n.chips.disabled .icon {\n  color: var(--disabled-text-color);\n}\n.chips.disabled .label {\n  color: var(--disabled-text-color);\n}\n.chips.defaultCursor {\n  cursor: default;\n}\n.chips.readOnly {\n  cursor: default;\n}\n.chips.filterable {\n  background-color: var(--ui-background-color);\n  color: var(--primary-text-color);\n  cursor: pointer;\n}\n.chips.filterable .icon,\n.chips.filterable .label {\n  color: currentColor;\n}\n.chips.filterable:hover:not(.disabled):not(.pressed), .chips.filterable:active:not(.disabled):not(.pressed) {\n  background-color: var(--ui-background-hover-color);\n  color: var(--primary-text-color);\n}\n.chips.filterable.pressed:not(.disabled) {\n  background-color: var(--primary-color);\n  color: var(--text-color-on-inverted);\n}\n.chips.filterable.pressed:not(.disabled) .icon,\n.chips.filterable.pressed:not(.disabled) .label,\n.chips.filterable.pressed:not(.disabled) .close {\n  color: currentColor;\n}\n.chips.filterable.disabled {\n  background-color: var(--disabled-background-color);\n  cursor: not-allowed;\n}\n.chips.clickable {\n  cursor: pointer;\n}\n.chips.clickable:focus-visible, .chips.clickable.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.chips.clickable:focus:not(.focus-visible) {\n  outline: none;\n}\n.chips.clickable.disabled {\n  cursor: default;\n}\n.chips.clickable.disableTextSelection {\n  -webkit-touch-callout: none; /* iOS Safari */ /* Safari */ /* Konqueror HTML */ /* Old versions of Firefox */ /* Internet Explorer/Edge */\n  user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */\n}\n\n@keyframes chips-pop-in-emphasized {\n  0% {\n    transform: scale(0.3);\n    opacity: 0;\n  }\n  70% {\n    opacity: 1;\n  }\n  100% {\n    transform: scale(1);\n  }\n}");export{n as default};
+var n={chips:"chips","chips-pop-in-emphasized":"chips-pop-in-emphasized",clickable:"clickable",border:"border",withUserSelect:"withUserSelect",noMargin:"noMargin",withLeftIcon:"withLeftIcon",withRightIcon:"withRightIcon",withClose:"withClose",label:"label",icon:"icon",close:"close",small:"small",avatar:"avatar",customRenderer:"customRenderer",noAnimation:"noAnimation",left:"left",right:"right",colorPrimary:"colorPrimary",colorPositive:"colorPositive",colorNegative:"colorNegative",colorWarning:"colorWarning",colorInfo:"colorInfo",colorNeutral:"colorNeutral",disabled:"disabled",defaultCursor:"defaultCursor",readOnly:"readOnly",filterable:"filterable",pressed:"pressed","focus-visible":"focus-visible",disableTextSelection:"disableTextSelection"};!function(n){const e="s_id-887c93e25950_4_5_10";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+e))return;const i=document.createElement("style");i.id=e,o.firstChild?o.insertBefore(i,o.firstChild):o.appendChild(i),i.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable selector-class-pattern */\n/* stylelint-disable */\n/* stylelint-enable */\n.chips {\n  display: inline-flex;\n  overflow: hidden;\n  height: 24px;\n  border-radius: var(--border-radius-full);\n  padding: 0 8px;\n  align-items: center;\n  justify-content: center;\n  margin: var(--chips-margin, 0 var(--spacing-xs));\n  user-select: none;\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  color: var(--primary-text-color);\n  /* The fill comes from --chips-surface: semantic colors set it via the color-* classes\n     below, content colors pass it in as an inline custom property. Keeping\n     `background-color` itself in CSS means hover is a plain :hover rule (no React state)\n     and consumers can override the fill without !important. */\n  background-color: var(--chips-surface);\n  animation: chips-pop-in-emphasized var(--motion-productive-medium) var(--motion-timing-emphasize);\n  /* Medium: 8px default; 4px on sides that have an icon */\n  /* Icons and the close IconButton track the chip's colour, which for semantic colors\n     is --text-on-surface-* (set inline on the root). This beats IconButton's own\n     `.kindTertiary { color: --primary-text-color }` on specificity. */\n  /* Semantic colors: surface + its paired text, same `color-*` class pattern Label uses.\n     Hover keeps the existing *-color-selected-hover tokens. */\n  /* After the color-* classes so it wins the tie on equal specificity. */\n}\n.chips.clickable:hover, .chips.clickable:focus-within {\n  background-color: var(--chips-surface-hover, var(--chips-surface));\n}\n.chips.border {\n  border: 1px solid var(--primary-background-color);\n}\n.chips.withUserSelect {\n  user-select: text;\n  cursor: text;\n}\n.chips.noMargin {\n  margin: 0;\n}\n.chips.withLeftIcon {\n  padding-inline-start: 4px;\n}\n.chips.withRightIcon {\n  padding-inline-end: 4px;\n}\n.chips.withClose {\n  position: relative;\n  box-sizing: border-box;\n}\n.chips.withClose .label {\n  min-width: 0;\n  flex: 1 1 auto;\n}\n.chips.withClose .icon.close {\n  position: absolute;\n  inset-inline-end: 4px;\n  top: 50%;\n  transform: translateY(-50%);\n  margin: 0;\n  opacity: 0;\n  pointer-events: none;\n  z-index: 1;\n}\n.chips.withClose:hover, .chips.withClose:focus-within {\n  /* Keep overall width stable; carve space for the close control inside the chip */\n  padding-inline-end: 26px;\n}\n.chips.withClose:hover .icon.close, .chips.withClose:focus-within .icon.close {\n  opacity: 1;\n  pointer-events: auto;\n}\n.chips.withClose.small:hover, .chips.withClose.small:focus-within {\n  padding-inline-end: 22px;\n}\n.chips.small {\n  height: 20px;\n  /* Small: 4px default; 2px on sides that have an icon */\n  padding: 0 4px;\n}\n.chips.small.withLeftIcon {\n  padding-inline-start: 2px;\n}\n.chips.small.withRightIcon {\n  padding-inline-end: 2px;\n}\n.chips.small .icon,\n.chips.small .avatar,\n.chips.small .customRenderer {\n  min-width: 14px;\n}\n.chips .label {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.chips.noAnimation {\n  animation: none;\n}\n.chips .icon,\n.chips .avatar,\n.chips .customRenderer {\n  min-width: 18px;\n}\n.chips .icon.left,\n.chips .avatar.left,\n.chips .customRenderer.left {\n  margin-right: var(--spacing-xs);\n}\n.chips .icon.right,\n.chips .avatar.right,\n.chips .customRenderer.right {\n  margin-left: var(--spacing-xs);\n}\n.chips .icon.close,\n.chips .avatar.close,\n.chips .customRenderer.close {\n  margin-left: var(--spacing-xs);\n}\n.chips .icon {\n  color: currentColor;\n}\n.chips.colorPrimary {\n  --chips-surface: var(--surface-primary);\n  --chips-surface-hover: var(--ui-background-hover-color);\n  color: var(--text-on-surface-primary);\n}\n.chips.colorPositive {\n  --chips-surface: var(--surface-positive);\n  --chips-surface-hover: var(--positive-color-selected-hover);\n  color: var(--text-on-surface-positive);\n}\n.chips.colorNegative {\n  --chips-surface: var(--surface-negative);\n  --chips-surface-hover: var(--negative-color-selected-hover);\n  color: var(--text-on-surface-negative);\n}\n.chips.colorWarning {\n  --chips-surface: var(--surface-warning);\n  --chips-surface-hover: var(--warning-color-selected-hover);\n  color: var(--text-on-surface-warning);\n}\n.chips.colorInfo {\n  --chips-surface: var(--surface-info);\n  --chips-surface-hover: var(--info-color-selected-hover);\n  color: var(--text-on-surface-info);\n}\n.chips.colorNeutral {\n  --chips-surface: var(--surface-neutral);\n  --chips-surface-hover: var(--ui-background-hover-color);\n  color: var(--text-on-surface-neutral);\n}\n.chips.disabled {\n  --chips-surface: var(--disabled-background-color);\n  --chips-surface-hover: var(--disabled-background-color);\n}\n.chips.disabled .icon {\n  color: var(--disabled-text-color);\n}\n.chips.disabled .label {\n  color: var(--disabled-text-color);\n}\n.chips.defaultCursor {\n  cursor: default;\n}\n.chips.readOnly {\n  cursor: default;\n}\n.chips.filterable {\n  background-color: var(--ui-background-color);\n  color: var(--primary-text-color);\n  cursor: pointer;\n}\n.chips.filterable .icon,\n.chips.filterable .label {\n  color: currentColor;\n}\n.chips.filterable:hover:not(.disabled):not(.pressed), .chips.filterable:active:not(.disabled):not(.pressed) {\n  background-color: var(--ui-background-hover-color);\n  color: var(--primary-text-color);\n}\n.chips.filterable.pressed:not(.disabled) {\n  background-color: var(--primary-color);\n  color: var(--text-color-on-inverted);\n}\n.chips.filterable.pressed:not(.disabled) .icon,\n.chips.filterable.pressed:not(.disabled) .label,\n.chips.filterable.pressed:not(.disabled) .close {\n  color: currentColor;\n}\n.chips.filterable.disabled {\n  background-color: var(--disabled-background-color);\n  cursor: not-allowed;\n}\n.chips.clickable {\n  cursor: pointer;\n}\n.chips.clickable:focus-visible, .chips.clickable.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.chips.clickable:focus:not(.focus-visible) {\n  outline: none;\n}\n.chips.clickable.disabled {\n  cursor: default;\n}\n.chips.clickable.disableTextSelection {\n  -webkit-touch-callout: none; /* iOS Safari */ /* Safari */ /* Konqueror HTML */ /* Old versions of Firefox */ /* Internet Explorer/Edge */\n  user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */\n}\n\n@keyframes chips-pop-in-emphasized {\n  0% {\n    transform: scale(0.3);\n    opacity: 0;\n  }\n  70% {\n    opacity: 1;\n  }\n  100% {\n    transform: scale(1);\n  }\n}");export{n as default};
 //# sourceMappingURL=Chips.module.scss.js.map

package/dist/mocked_classnames/src/components/ColorPicker/ColorPicker.module.scss.js

@@ -1,2 +1,2 @@
-var e={colorPicker:"colorPicker",colorPickerDialogContent:"colorPickerDialogContent"};!function(e){const t="s_id-ffacbf9b6446_4_5_3";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".colorPicker.colorPickerDialogContent {\n  z-index: 1;\n  padding: 12px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}");export{e as default};
+var e={colorPicker:"colorPicker",colorPickerDialogContent:"colorPickerDialogContent"};!function(e){const t="s_id-ffacbf9b6446_4_5_10";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)}(".colorPicker.colorPickerDialogContent {\n  z-index: 1;\n  padding: 12px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}");export{e as default};
 //# sourceMappingURL=ColorPicker.module.scss.js.map

package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerContent/ColorPickerClearButton.module.scss.js

@@ -1,2 +1,2 @@
-var e={clearColorIcon:"clearColorIcon",clearColorButton:"clearColorButton"};!function(e){const n="s_id-745441469971_4_5_3";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,o.firstChild?o.insertBefore(t,o.firstChild):o.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".clearColorIcon {\n  margin-inline-end: var(--space-8);\n}\n\n.clearColorButton {\n  margin-top: var(--space-8);\n}");export{e as default};
+var e={clearColorIcon:"clearColorIcon",clearColorButton:"clearColorButton"};!function(e){const n="s_id-745441469971_4_5_10";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,o.firstChild?o.insertBefore(t,o.firstChild):o.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".clearColorIcon {\n  margin-inline-end: var(--space-8);\n}\n\n.clearColorButton {\n  margin-top: var(--space-8);\n}");export{e as default};
 //# sourceMappingURL=ColorPickerClearButton.module.scss.js.map

package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerContent/ColorPickerColorsGrid.module.scss.js

@@ -1,2 +1,2 @@
-var e={colorsGrid:"colorsGrid"};!function(e){const n="s_id-0a5f0eb78ee4_4_5_3";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".colorsGrid {\n  padding: 0;\n  outline: none;\n  display: flex;\n  flex-wrap: wrap;\n}");export{e as default};
+var e={colorsGrid:"colorsGrid"};!function(e){const n="s_id-0a5f0eb78ee4_4_5_10";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const d=document.createElement("style");d.id=n,t.firstChild?t.insertBefore(d,t.firstChild):t.appendChild(d),d.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".colorsGrid {\n  padding: 0;\n  outline: none;\n  display: flex;\n  flex-wrap: wrap;\n}");export{e as default};
 //# sourceMappingURL=ColorPickerColorsGrid.module.scss.js.map

package/dist/mocked_classnames/src/components/ColorPicker/components/ColorPickerItemComponent/ColorPickerItemComponent.module.scss.js

@@ -1,2 +1,2 @@
-var e={itemWrapper:"itemWrapper",circle:"circle",feedbackIndicator:"feedbackIndicator",active:"active",selectedColor:"selectedColor",colorItem:"colorItem",colorIndicatorWrapper:"colorIndicatorWrapper",colorItemSizeSmall:"colorItemSizeSmall",colorItemSizeMedium:"colorItemSizeMedium",colorItemSizeLarge:"colorItemSizeLarge",colorItemTextMode:"colorItemTextMode",colorIconWhite:"colorIconWhite"};!function(e){const r="s_id-4f41e3ef6859_4_5_3";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+r))return;const o=document.createElement("style");o.id=r,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=e)}('.itemWrapper.circle {\n  --border-radius-multiplier: 99999;\n}\n\n/* stylelint-disable scss/operator-no-unspaced */\n.itemWrapper {\n  --border-radius-multiplier: 1;\n  margin: 4px;\n  display: flex;\n  list-style-type: none;\n  position: relative;\n}\n\n.itemWrapper .feedbackIndicator {\n  position: absolute;\n  inset: 0;\n  pointer-events: none;\n}\n\n.itemWrapper:focus,\n.itemWrapper:focus-visible,\n.itemWrapper.active {\n  outline: none;\n}\n\n.itemWrapper:focus .feedbackIndicator:before,\n.itemWrapper:focus-visible .feedbackIndicator:before,\n.itemWrapper.active .feedbackIndicator:before {\n  content: " ";\n  position: absolute;\n  border-radius: calc(7px * var(--border-radius-multiplier, 1));\n  inset: -4px;\n  border: 4px solid;\n  border-color: var(--primary-selected-color);\n  pointer-events: none;\n}\n\n.itemWrapper:focus .feedbackIndicator:after,\n.itemWrapper:focus-visible .feedbackIndicator:after,\n.itemWrapper.active .feedbackIndicator:after {\n  content: " ";\n  position: absolute;\n  border-radius: calc(7px * var(--border-radius-multiplier, 1));\n  inset: -1px;\n  border: 1px solid;\n  border-color: var(--primary-color);\n  pointer-events: none;\n}\n\n/* active elements have no "hover feedback" */\n.itemWrapper:hover:not(.active):not(.selectedColor) .feedbackIndicator {\n  content: " ";\n  position: absolute;\n  border-radius: calc(8px * var(--border-radius-multiplier, 1));\n  inset: -4px;\n  border: 4px solid;\n  border-color: var(--primary-background-hover-color);\n  pointer-events: none;\n}\n\n.itemWrapper .colorItem {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border: 2px solid transparent;\n  border-radius: calc(4px * var(--border-radius-multiplier, 1));\n  cursor: pointer;\n}\n\n.itemWrapper .colorItem .colorIndicatorWrapper {\n  display: flex;\n}\n\n.itemWrapper .colorItem.colorItemSizeSmall {\n  width: 24px;\n  height: 24px;\n}\n\n.itemWrapper .colorItem.colorItemSizeMedium {\n  width: 32px;\n  height: 32px;\n}\n\n.itemWrapper .colorItem.colorItemSizeLarge {\n  width: 40px;\n  height: 40px;\n}\n\n.itemWrapper.selectedColor {\n  position: relative;\n}\n\n.itemWrapper.selectedColor:before {\n  content: " ";\n  position: absolute;\n  border-radius: calc(7px * var(--border-radius-multiplier, 1));\n  inset: -4px;\n  border: 2px solid;\n  border-color: var(--primary-color);\n  pointer-events: none;\n}\n\n.itemWrapper.selectedColor .feedbackIndicator:before {\n  /* hide the outer border from the "active" feedback indicator */\n  display: none;\n}\n\n.itemWrapper .colorItemTextMode:hover {\n  background-color: var(--primary-background-hover-color) !important;\n}\n\n.itemWrapper .colorIconWhite {\n  color: var(--color-snow_white);\n}');export{e as default};
+var e={itemWrapper:"itemWrapper",circle:"circle",feedbackIndicator:"feedbackIndicator",active:"active",selectedColor:"selectedColor",colorItem:"colorItem",colorIndicatorWrapper:"colorIndicatorWrapper",colorItemSizeSmall:"colorItemSizeSmall",colorItemSizeMedium:"colorItemSizeMedium",colorItemSizeLarge:"colorItemSizeLarge",colorItemTextMode:"colorItemTextMode",colorIconWhite:"colorIconWhite"};!function(e){const r="s_id-4f41e3ef6859_4_5_10";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+r))return;const o=document.createElement("style");o.id=r,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=e)}('.itemWrapper.circle {\n  --border-radius-multiplier: 99999;\n}\n\n/* stylelint-disable scss/operator-no-unspaced */\n.itemWrapper {\n  --border-radius-multiplier: 1;\n  margin: 4px;\n  display: flex;\n  list-style-type: none;\n  position: relative;\n}\n\n.itemWrapper .feedbackIndicator {\n  position: absolute;\n  inset: 0;\n  pointer-events: none;\n}\n\n.itemWrapper:focus,\n.itemWrapper:focus-visible,\n.itemWrapper.active {\n  outline: none;\n}\n\n.itemWrapper:focus .feedbackIndicator:before,\n.itemWrapper:focus-visible .feedbackIndicator:before,\n.itemWrapper.active .feedbackIndicator:before {\n  content: " ";\n  position: absolute;\n  border-radius: calc(7px * var(--border-radius-multiplier, 1));\n  inset: -4px;\n  border: 4px solid;\n  border-color: var(--primary-selected-color);\n  pointer-events: none;\n}\n\n.itemWrapper:focus .feedbackIndicator:after,\n.itemWrapper:focus-visible .feedbackIndicator:after,\n.itemWrapper.active .feedbackIndicator:after {\n  content: " ";\n  position: absolute;\n  border-radius: calc(7px * var(--border-radius-multiplier, 1));\n  inset: -1px;\n  border: 1px solid;\n  border-color: var(--primary-color);\n  pointer-events: none;\n}\n\n/* active elements have no "hover feedback" */\n.itemWrapper:hover:not(.active):not(.selectedColor) .feedbackIndicator {\n  content: " ";\n  position: absolute;\n  border-radius: calc(8px * var(--border-radius-multiplier, 1));\n  inset: -4px;\n  border: 4px solid;\n  border-color: var(--primary-background-hover-color);\n  pointer-events: none;\n}\n\n.itemWrapper .colorItem {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  border: 2px solid transparent;\n  border-radius: calc(4px * var(--border-radius-multiplier, 1));\n  cursor: pointer;\n}\n\n.itemWrapper .colorItem .colorIndicatorWrapper {\n  display: flex;\n}\n\n.itemWrapper .colorItem.colorItemSizeSmall {\n  width: 24px;\n  height: 24px;\n}\n\n.itemWrapper .colorItem.colorItemSizeMedium {\n  width: 32px;\n  height: 32px;\n}\n\n.itemWrapper .colorItem.colorItemSizeLarge {\n  width: 40px;\n  height: 40px;\n}\n\n.itemWrapper.selectedColor {\n  position: relative;\n}\n\n.itemWrapper.selectedColor:before {\n  content: " ";\n  position: absolute;\n  border-radius: calc(7px * var(--border-radius-multiplier, 1));\n  inset: -4px;\n  border: 2px solid;\n  border-color: var(--primary-color);\n  pointer-events: none;\n}\n\n.itemWrapper.selectedColor .feedbackIndicator:before {\n  /* hide the outer border from the "active" feedback indicator */\n  display: none;\n}\n\n.itemWrapper .colorItemTextMode:hover {\n  background-color: var(--primary-background-hover-color) !important;\n}\n\n.itemWrapper .colorIconWhite {\n  color: var(--color-snow_white);\n}');export{e as default};
 //# sourceMappingURL=ColorPickerItemComponent.module.scss.js.map

package/dist/mocked_classnames/src/components/Combobox/Combobox.module.scss.js

@@ -1,2 +1,2 @@
-var o={combobox:"combobox",stickyCategory:"stickyCategory",comboboxCategory:"comboboxCategory",sizeSmall:"sizeSmall",sizeMedium:"sizeMedium",sizeLarge:"sizeLarge",empty:"empty",comboboxSearchWrapper:"comboboxSearchWrapper",comboboxNoResults:"comboboxNoResults",comboboxMessageWrapper:"comboboxMessageWrapper",comboboxMessage:"comboboxMessage",addNewButton:"addNewButton",buttonLabel:"buttonLabel",comboboxList:"comboboxList"};!function(o){const e="s_id-5bf292a5a8b0_4_5_3";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+e))return;const t=document.createElement("style");t.id=e,n.firstChild?n.insertBefore(t,n.firstChild):n.appendChild(t),t.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=o)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable selector-class-pattern */\n.combobox {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  margin-bottom: var(--space-8);\n}\n\n.combobox.stickyCategory .comboboxCategory {\n  z-index: 10;\n  background-color: var(--secondary-background-color);\n}\n\n/* Relative to Search height */\n.combobox.stickyCategory.sizeSmall .comboboxCategory {\n  top: 32px;\n}\n\n.combobox.stickyCategory.sizeMedium .comboboxCategory {\n  top: 40px;\n}\n\n.combobox.stickyCategory.sizeLarge .comboboxCategory {\n  top: 48px;\n}\n\n.combobox.empty {\n  max-height: 200px;\n  margin-bottom: 0;\n}\n\n.comboboxSearchWrapper {\n  position: sticky;\n  top: 0;\n  z-index: 12;\n}\n\n.comboboxNoResults {\n  margin-top: var(--space-8);\n  flex: 1 1 auto;\n  height: calc(100% - 20px);\n  overflow: hidden;\n  position: relative;\n  padding: 0 16px;\n  display: flex;\n  flex-direction: column;\n}\n\n.comboboxNoResults .comboboxMessageWrapper {\n  flex: 1 0 auto;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.comboboxNoResults .comboboxMessageWrapper .comboboxMessage {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.comboboxNoResults .addNewButton {\n  flex: 0 0 auto;\n  width: 100% !important;\n  margin-bottom: 8px;\n}\n\n.comboboxNoResults .addNewButton .buttonLabel {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.comboboxList {\n  display: flex;\n  flex-direction: column;\n  flex: 1 1 auto;\n  padding: 0 4px;\n  overflow: hidden;\n}");export{o as default};
+var o={combobox:"combobox",stickyCategory:"stickyCategory",comboboxCategory:"comboboxCategory",sizeSmall:"sizeSmall",sizeMedium:"sizeMedium",sizeLarge:"sizeLarge",empty:"empty",comboboxSearchWrapper:"comboboxSearchWrapper",comboboxNoResults:"comboboxNoResults",comboboxMessageWrapper:"comboboxMessageWrapper",comboboxMessage:"comboboxMessage",addNewButton:"addNewButton",buttonLabel:"buttonLabel",comboboxList:"comboboxList"};!function(o){const e="s_id-5bf292a5a8b0_4_5_10";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+e))return;const t=document.createElement("style");t.id=e,n.firstChild?n.insertBefore(t,n.firstChild):n.appendChild(t),t.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=o)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable selector-class-pattern */\n.combobox {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  margin-bottom: var(--space-8);\n}\n\n.combobox.stickyCategory .comboboxCategory {\n  z-index: 10;\n  background-color: var(--secondary-background-color);\n}\n\n/* Relative to Search height */\n.combobox.stickyCategory.sizeSmall .comboboxCategory {\n  top: 32px;\n}\n\n.combobox.stickyCategory.sizeMedium .comboboxCategory {\n  top: 40px;\n}\n\n.combobox.stickyCategory.sizeLarge .comboboxCategory {\n  top: 48px;\n}\n\n.combobox.empty {\n  max-height: 200px;\n  margin-bottom: 0;\n}\n\n.comboboxSearchWrapper {\n  position: sticky;\n  top: 0;\n  z-index: 12;\n}\n\n.comboboxNoResults {\n  margin-top: var(--space-8);\n  flex: 1 1 auto;\n  height: calc(100% - 20px);\n  overflow: hidden;\n  position: relative;\n  padding: 0 16px;\n  display: flex;\n  flex-direction: column;\n}\n\n.comboboxNoResults .comboboxMessageWrapper {\n  flex: 1 0 auto;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.comboboxNoResults .comboboxMessageWrapper .comboboxMessage {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.comboboxNoResults .addNewButton {\n  flex: 0 0 auto;\n  width: 100% !important;\n  margin-bottom: 8px;\n}\n\n.comboboxNoResults .addNewButton .buttonLabel {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.comboboxList {\n  display: flex;\n  flex-direction: column;\n  flex: 1 1 auto;\n  padding: 0 4px;\n  overflow: hidden;\n}");export{o as default};
 //# sourceMappingURL=Combobox.module.scss.js.map

package/dist/mocked_classnames/src/components/Combobox/ComboboxHelpers/ComboboxHelpers.js

@@ -1,2 +1,2 @@
-import{defineProperty as e}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import{__rest as t}from"../../../../_virtual/_tslib.js";import o,{useMemo as i}from"react";import n from"classnames";import r from"../components/ComboboxOption/ComboboxOption.js";import s from"../components/ComboboxCategory/ComboboxCategory.js";import a from"../../Divider/Divider.js";import{COMBOBOX_DIVIDER_ITEM as c,COMBOBOX_CATEGORY_ITEM as l,COMBOBOX_OPTION_ITEM as m}from"../components/ComboboxConstants.js";import d from"../../../hooks/useActiveDescendantListFocus/index.js";import{getOptionsByCategories as u}from"../ComboboxService.js";import p from"../components/ComboboxItems/ComboboxItems.module.scss.js";import g from"./ComboboxHelpers.module.scss.js";var h=17,v=32;function f(t){var o=t.categories,r=t.options,s=t.filterValue,a=t.withCategoriesDivider,c=t.optionLineHeight;return i((function(){var t=[],i=[],l=new Map;if(o){var m=u(r,o,s),d=0;Object.keys(m).forEach((function(r,s){var u=a&&0!==s;u&&t.push(I({categoryId:r}));var g=m[r].length>0,h=0===s,v=b({categoryId:r,categoryData:o[r],withDivider:u,className:n(e(e(e({},p.categoryWithOptions,g),p.categoryWithoutOptions,!g),p.firstCategory,h))});t.push(v),l.set(r,v),m[r].forEach((function(e){var o=C({height:c,option:e,index:d,categoryId:v.id});l.set(o.id,o),t.push(o),i.push(e),d++}))}))}else i=r,t=r.map((function(e,t){return C({height:c,option:e,index:t})}));return{items:t,itemsMap:l,selectableItems:i}}),[o,r,s,a,c])}function y(e){var t=e.defaultVisualFocusFirstIndex,o=e.inputRef,n=e.onClick,r=e.isChildSelectable,s=e.options,a=e.getOptionId,c=i((function(){return s.map((function(e,t){return a(null==e?void 0:e.id,t)}))}),[a,s]),l=d({defaultVisualFocusFirstIndex:t,focusedElementRef:o,focusedElementRole:d.roles.COMBOBOX,itemsIds:c,onItemClick:n,isItemSelectable:r,isIgnoreSpaceAsItemSelection:!0});return{visualFocusItemIndex:l.visualFocusItemIndex,visualFocusItemId:l.visualFocusItemId,onOptionClick:n}}function I(e){return{type:c,height:h,id:"".concat(e.categoryId,"-divider")}}function b(e){return{height:v,type:l,category:e.categoryData,id:e.categoryId,withDivider:e.withDivider,className:e.className}}function C(e){var t=e.option,o=e.index;return{type:m,height:e.height,belongToCategory:!0,index:o,option:t,id:t.id||""+o,optionRenderer:e.optionRenderer,isActive:e.isActive,optionLineHeight:e.optionLineHeight,shouldScrollToSelectedItem:e.shouldScrollToSelectedItem,categoryId:e.categoryId}}function x(e){var i,r,s=e.item,a=e.style,d=e.optionEvents,u=e.optionRenderData,p=e.isVirtualized,h=e.stickyCategories,v=s.type,f=t(s,["type"]);switch(v){case c:r=O({id:f.id,height:f.height});break;case l:r=k({id:f.id,category:f.category,className:f.className}),h&&!p&&(i=g.sticky);break;case m:r=j(Object.assign(Object.assign(Object.assign({},f),d),u))}return o.createElement("div",{key:f.id,className:n(g.comboboxItemContainer,i),style:a},r)}function O(e){return o.createElement("div",{className:g.dividerContainer,style:{height:e.height}},o.createElement(a,{className:g.divider,key:e.id}))}function k(e){return o.createElement(s,{key:e.id,category:e.category,className:e.className})}function j(e){var t=e.index,i=e.onOptionEnter;return o.createElement(r,{className:e.className,index:t,key:e.id,option:e.option,optionRenderer:e.optionRenderer,scrollRef:e.scrollRef,isActive:e.activeItemIndex===t,visualFocus:t===e.visualFocusItemIndex,onOptionClick:e.onOptionClick,onOptionHover:i,onOptionLeave:e.onOptionLeave,onOptionEnter:i,optionLineHeight:e.optionLineHeight,shouldScrollWhenActive:e.shouldScrollToSelectedItem})}export{k as categoryItemRenderer,x as comboboxItemRenderer,b as createCategoryItemObject,I as createDividerItemObject,C as createOptionItemObject,O as dividerItemRenderer,j as optionItemRenderer,f as useItemsData,y as useKeyboardNavigation};
+import{defineProperty as e}from"../../../../_virtual/_rollupPluginBabelHelpers.js";import{__rest as t}from"../../../../_virtual/_tslib.js";import o,{useMemo as i}from"react";import n from"classnames";import r from"../components/ComboboxOption/ComboboxOption.js";import s from"../components/ComboboxCategory/ComboboxCategory.js";import{Divider as a}from"@vibe/divider/mockedClassNames";import{COMBOBOX_DIVIDER_ITEM as c,COMBOBOX_CATEGORY_ITEM as l,COMBOBOX_OPTION_ITEM as m}from"../components/ComboboxConstants.js";import d from"../../../hooks/useActiveDescendantListFocus/index.js";import{getOptionsByCategories as u}from"../ComboboxService.js";import p from"../components/ComboboxItems/ComboboxItems.module.scss.js";import g from"./ComboboxHelpers.module.scss.js";var h=17,v=32;function f(t){var o=t.categories,r=t.options,s=t.filterValue,a=t.withCategoriesDivider,c=t.optionLineHeight;return i((function(){var t=[],i=[],l=new Map;if(o){var m=u(r,o,s),d=0;Object.keys(m).forEach((function(r,s){var u=a&&0!==s;u&&t.push(I({categoryId:r}));var g=m[r].length>0,h=0===s,v=b({categoryId:r,categoryData:o[r],withDivider:u,className:n(e(e(e({},p.categoryWithOptions,g),p.categoryWithoutOptions,!g),p.firstCategory,h))});t.push(v),l.set(r,v),m[r].forEach((function(e){var o=C({height:c,option:e,index:d,categoryId:v.id});l.set(o.id,o),t.push(o),i.push(e),d++}))}))}else i=r,t=r.map((function(e,t){return C({height:c,option:e,index:t})}));return{items:t,itemsMap:l,selectableItems:i}}),[o,r,s,a,c])}function y(e){var t=e.defaultVisualFocusFirstIndex,o=e.inputRef,n=e.onClick,r=e.isChildSelectable,s=e.options,a=e.getOptionId,c=i((function(){return s.map((function(e,t){return a(null==e?void 0:e.id,t)}))}),[a,s]),l=d({defaultVisualFocusFirstIndex:t,focusedElementRef:o,focusedElementRole:d.roles.COMBOBOX,itemsIds:c,onItemClick:n,isItemSelectable:r,isIgnoreSpaceAsItemSelection:!0});return{visualFocusItemIndex:l.visualFocusItemIndex,visualFocusItemId:l.visualFocusItemId,onOptionClick:n}}function I(e){return{type:c,height:h,id:"".concat(e.categoryId,"-divider")}}function b(e){return{height:v,type:l,category:e.categoryData,id:e.categoryId,withDivider:e.withDivider,className:e.className}}function C(e){var t=e.option,o=e.index;return{type:m,height:e.height,belongToCategory:!0,index:o,option:t,id:t.id||""+o,optionRenderer:e.optionRenderer,isActive:e.isActive,optionLineHeight:e.optionLineHeight,shouldScrollToSelectedItem:e.shouldScrollToSelectedItem,categoryId:e.categoryId}}function x(e){var i,r,s=e.item,a=e.style,d=e.optionEvents,u=e.optionRenderData,p=e.isVirtualized,h=e.stickyCategories,v=s.type,f=t(s,["type"]);switch(v){case c:r=O({id:f.id,height:f.height});break;case l:r=k({id:f.id,category:f.category,className:f.className}),h&&!p&&(i=g.sticky);break;case m:r=j(Object.assign(Object.assign(Object.assign({},f),d),u))}return o.createElement("div",{key:f.id,className:n(g.comboboxItemContainer,i),style:a},r)}function O(e){return o.createElement("div",{className:g.dividerContainer,style:{height:e.height}},o.createElement(a,{className:g.divider,key:e.id}))}function k(e){return o.createElement(s,{key:e.id,category:e.category,className:e.className})}function j(e){var t=e.index,i=e.onOptionEnter;return o.createElement(r,{className:e.className,index:t,key:e.id,option:e.option,optionRenderer:e.optionRenderer,scrollRef:e.scrollRef,isActive:e.activeItemIndex===t,visualFocus:t===e.visualFocusItemIndex,onOptionClick:e.onOptionClick,onOptionHover:i,onOptionLeave:e.onOptionLeave,onOptionEnter:i,optionLineHeight:e.optionLineHeight,shouldScrollWhenActive:e.shouldScrollToSelectedItem})}export{k as categoryItemRenderer,x as comboboxItemRenderer,b as createCategoryItemObject,I as createDividerItemObject,C as createOptionItemObject,O as dividerItemRenderer,j as optionItemRenderer,f as useItemsData,y as useKeyboardNavigation};
 //# sourceMappingURL=ComboboxHelpers.js.map

package/dist/mocked_classnames/src/components/Combobox/ComboboxHelpers/ComboboxHelpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxHelpers.js","sources":["../../../../../../src/components/Combobox/ComboboxHelpers/ComboboxHelpers.tsx"],"sourcesContent":["import React, { type CSSProperties, type MutableRefObject, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport ComboboxOption from \"../components/ComboboxOption/ComboboxOption\";\nimport ComboboxCategory from \"../components/ComboboxCategory/ComboboxCategory\";\nimport Divider from \"../../Divider/Divider\";\nimport {\n  COMBOBOX_DIVIDER_ITEM,\n  COMBOBOX_CATEGORY_ITEM,\n  COMBOBOX_OPTION_ITEM,\n  type IComboboxCategory,\n  type IComboboxOption,\n  type IComboboxCategoryMap,\n  type IComboboxItem,\n  type IOptionItemRendererArgs,\n  type IComboboxOptionEvents\n} from \"../components/ComboboxConstants\";\nimport useActiveDescendantListFocus from \"../../../hooks/useActiveDescendantListFocus\";\nimport { getOptionsByCategories } from \"../ComboboxService\";\nimport comboboxItemsStyles from \"../components/ComboboxItems/ComboboxItems.module.scss\";\nimport styles from \"./ComboboxHelpers.module.scss\";\n\nconst DIVIDER_HEIGHT = 17;\nconst CATEGORY_HEIGHT = 32;\n\nexport function useItemsData({\n  categories,\n  options,\n  filterValue,\n  withCategoriesDivider,\n  optionLineHeight\n}: {\n  categories: IComboboxCategoryMap;\n  options: IComboboxOption[];\n  filterValue: string;\n  withCategoriesDivider: boolean;\n  optionLineHeight: number;\n}) {\n  return useMemo(() => {\n    let items: IComboboxItem[] = [];\n    let selectableItems: IComboboxOption[] = [];\n    const itemsMap = new Map();\n\n    if (categories) {\n      const optionsByCategories = getOptionsByCategories(options, categories, filterValue);\n      let optionIndex = 0;\n      Object.keys(optionsByCategories).forEach((categoryId, categoryIndex) => {\n        const withDivider = withCategoriesDivider && categoryIndex !== 0;\n        if (withDivider) {\n          items.push(createDividerItemObject({ categoryId }));\n        }\n\n        const isCategoryWithOptions = optionsByCategories[categoryId].length > 0;\n        const isFirstCategory = categoryIndex === 0;\n\n        const categoryObject = createCategoryItemObject({\n          categoryId,\n          categoryData: categories[categoryId],\n          withDivider,\n          className: cx({\n            [comboboxItemsStyles.categoryWithOptions]: isCategoryWithOptions,\n            [comboboxItemsStyles.categoryWithoutOptions]: !isCategoryWithOptions,\n            [comboboxItemsStyles.firstCategory]: isFirstCategory\n          })\n        });\n\n        // save category object in both items array and categories map\n        items.push(categoryObject);\n        itemsMap.set(categoryId, categoryObject);\n\n        optionsByCategories[categoryId].forEach((option: IComboboxOption) => {\n          const itemObject = createOptionItemObject({\n            height: optionLineHeight,\n            option,\n            index: optionIndex,\n            categoryId: categoryObject.id\n          });\n\n          itemsMap.set(itemObject.id, itemObject);\n          items.push(itemObject);\n          selectableItems.push(option);\n          optionIndex++;\n        });\n      });\n    } else {\n      selectableItems = options;\n      items = options.map((option, index) => {\n        return createOptionItemObject({\n          height: optionLineHeight,\n          option,\n          index\n        });\n      });\n    }\n    return { items, itemsMap, selectableItems };\n  }, [categories, options, filterValue, withCategoriesDivider, optionLineHeight]);\n}\n\nexport function useKeyboardNavigation({\n  defaultVisualFocusFirstIndex,\n  inputRef,\n  onClick,\n  isChildSelectable,\n  options,\n  getOptionId\n}: {\n  defaultVisualFocusFirstIndex?: boolean;\n  inputRef: MutableRefObject<HTMLElement>;\n  onClick: (event: React.KeyboardEvent | React.MouseEvent, index: number) => void;\n  isChildSelectable: (index: number) => boolean;\n  options: IComboboxOption[];\n  getOptionId: (optionId: string, index: number) => string;\n}) {\n  const filteredOptionsIds = useMemo(\n    () => options.map((option: IComboboxOption, index: number) => getOptionId(option?.id, index)),\n    [getOptionId, options]\n  );\n\n  const { visualFocusItemIndex, visualFocusItemId } = useActiveDescendantListFocus({\n    defaultVisualFocusFirstIndex,\n    focusedElementRef: inputRef,\n    focusedElementRole: useActiveDescendantListFocus.roles.COMBOBOX,\n    itemsIds: filteredOptionsIds,\n    onItemClick: onClick,\n    isItemSelectable: isChildSelectable,\n    isIgnoreSpaceAsItemSelection: true\n  });\n\n  return { visualFocusItemIndex, visualFocusItemId, onOptionClick: onClick };\n}\nexport function createDividerItemObject({ categoryId }: { categoryId: string }): IComboboxItem {\n  return { type: COMBOBOX_DIVIDER_ITEM, height: DIVIDER_HEIGHT, id: `${categoryId}-divider` };\n}\n\nexport function createCategoryItemObject({\n  withDivider,\n  categoryId,\n  categoryData,\n  className\n}: {\n  withDivider: boolean;\n  categoryId: string;\n  categoryData: IComboboxCategory;\n  className: string;\n}): IComboboxItem {\n  return {\n    height: CATEGORY_HEIGHT,\n    type: COMBOBOX_CATEGORY_ITEM,\n    category: categoryData,\n    id: categoryId,\n    withDivider,\n    className\n  };\n}\n\nexport function createOptionItemObject({\n  option,\n  height,\n  index,\n  optionRenderer,\n  isActive,\n  optionLineHeight,\n  shouldScrollToSelectedItem,\n  categoryId\n}: {\n  option?: IComboboxOption;\n  height?: number;\n  index?: number;\n  optionRenderer?: (option: IComboboxOption) => JSX.Element;\n  isActive?: boolean;\n  optionLineHeight?: number;\n  shouldScrollToSelectedItem?: boolean;\n  categoryId?: string;\n}): IComboboxItem {\n  return {\n    type: COMBOBOX_OPTION_ITEM,\n    height,\n    belongToCategory: true,\n    index,\n    option,\n    id: option.id || index.toString(),\n    optionRenderer,\n    isActive,\n    optionLineHeight,\n    shouldScrollToSelectedItem,\n    categoryId\n  };\n}\n\nexport function comboboxItemRenderer({\n  item,\n  style,\n  optionEvents,\n  optionRenderData,\n  isVirtualized,\n  stickyCategories\n}: {\n  item: IComboboxItem;\n  style: CSSProperties;\n  optionEvents: IComboboxOptionEvents;\n  optionRenderData: any;\n  isVirtualized: boolean;\n  stickyCategories?: boolean;\n}) {\n  const { type, ...otherArgs } = item;\n  let customClassNames;\n  let innerElement;\n  switch (type) {\n    case COMBOBOX_DIVIDER_ITEM: {\n      innerElement = dividerItemRenderer({ id: otherArgs.id, height: otherArgs.height });\n      break;\n    }\n    case COMBOBOX_CATEGORY_ITEM: {\n      innerElement = categoryItemRenderer({\n        id: otherArgs.id,\n        category: otherArgs.category,\n        className: otherArgs.className\n      });\n      if (stickyCategories && !isVirtualized) {\n        customClassNames = styles.sticky;\n      }\n      break;\n    }\n    case COMBOBOX_OPTION_ITEM: {\n      innerElement = optionItemRenderer({\n        ...otherArgs,\n        ...optionEvents,\n        ...optionRenderData\n      });\n      break;\n    }\n  }\n\n  return (\n    <div key={otherArgs.id} className={cx(styles.comboboxItemContainer, customClassNames)} style={style}>\n      {innerElement}\n    </div>\n  );\n}\n\nexport function dividerItemRenderer({ id, height }: { id: string; height: number }) {\n  return (\n    <div className={styles.dividerContainer} style={{ height: height }}>\n      <Divider className={styles.divider} key={id} />\n    </div>\n  );\n}\n\nexport function categoryItemRenderer({\n  id,\n  category,\n  className\n}: {\n  id: string;\n  category: IComboboxCategory;\n  className: string;\n}) {\n  return <ComboboxCategory key={id} category={category} className={className} />;\n}\n\nexport function optionItemRenderer({\n  id,\n  index,\n  option,\n  className,\n  onOptionClick,\n  onOptionEnter,\n  onOptionLeave,\n  optionLineHeight,\n  optionRenderer,\n  scrollRef,\n  shouldScrollToSelectedItem,\n  activeItemIndex,\n  visualFocusItemIndex\n}: IOptionItemRendererArgs) {\n  return (\n    <ComboboxOption\n      className={className}\n      index={index}\n      key={id}\n      option={option}\n      optionRenderer={optionRenderer}\n      scrollRef={scrollRef}\n      isActive={activeItemIndex === index}\n      visualFocus={index === visualFocusItemIndex}\n      onOptionClick={onOptionClick}\n      onOptionHover={onOptionEnter}\n      onOptionLeave={onOptionLeave}\n      onOptionEnter={onOptionEnter}\n      optionLineHeight={optionLineHeight}\n      shouldScrollWhenActive={shouldScrollToSelectedItem}\n    />\n  );\n}\n"],"names":["DIVIDER_HEIGHT","CATEGORY_HEIGHT","useItemsData","_ref","categories","options","filterValue","withCategoriesDivider","optionLineHeight","useMemo","items","selectableItems","itemsMap","Map","optionsByCategories","getOptionsByCategories","optionIndex","Object","keys","forEach","categoryId","categoryIndex","withDivider","push","createDividerItemObject","isCategoryWithOptions","length","isFirstCategory","categoryObject","createCategoryItemObject","categoryData","className","cx","_defineProperty","comboboxItemsStyles","categoryWithOptions","categoryWithoutOptions","firstCategory","set","option","itemObject","createOptionItemObject","height","index","id","map","useKeyboardNavigation","_ref2","defaultVisualFocusFirstIndex","inputRef","onClick","isChildSelectable","getOptionId","filteredOptionsIds","_useActiveDescendantL","useActiveDescendantListFocus","focusedElementRef","focusedElementRole","roles","COMBOBOX","itemsIds","onItemClick","isItemSelectable","isIgnoreSpaceAsItemSelection","visualFocusItemIndex","visualFocusItemId","onOptionClick","_ref3","type","COMBOBOX_DIVIDER_ITEM","concat","_ref4","COMBOBOX_CATEGORY_ITEM","category","_ref5","COMBOBOX_OPTION_ITEM","belongToCategory","optionRenderer","isActive","shouldScrollToSelectedItem","comboboxItemRenderer","_ref6","customClassNames","innerElement","item","style","optionEvents","optionRenderData","isVirtualized","stickyCategories","otherArgs","__rest","dividerItemRenderer","categoryItemRenderer","styles","sticky","optionItemRenderer","assign","React","createElement","key","comboboxItemContainer","_ref7","dividerContainer","Divider","divider","_ref8","ComboboxCategory","_ref9","onOptionEnter","ComboboxOption","scrollRef","activeItemIndex","visualFocus","onOptionHover","onOptionLeave","shouldScrollWhenActive"],"mappings":"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"}
+{"version":3,"file":"ComboboxHelpers.js","sources":["../../../../../../src/components/Combobox/ComboboxHelpers/ComboboxHelpers.tsx"],"sourcesContent":["import React, { type CSSProperties, type MutableRefObject, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport ComboboxOption from \"../components/ComboboxOption/ComboboxOption\";\nimport ComboboxCategory from \"../components/ComboboxCategory/ComboboxCategory\";\nimport { Divider } from \"@vibe/divider\";\nimport {\n  COMBOBOX_DIVIDER_ITEM,\n  COMBOBOX_CATEGORY_ITEM,\n  COMBOBOX_OPTION_ITEM,\n  type IComboboxCategory,\n  type IComboboxOption,\n  type IComboboxCategoryMap,\n  type IComboboxItem,\n  type IOptionItemRendererArgs,\n  type IComboboxOptionEvents\n} from \"../components/ComboboxConstants\";\nimport useActiveDescendantListFocus from \"../../../hooks/useActiveDescendantListFocus\";\nimport { getOptionsByCategories } from \"../ComboboxService\";\nimport comboboxItemsStyles from \"../components/ComboboxItems/ComboboxItems.module.scss\";\nimport styles from \"./ComboboxHelpers.module.scss\";\n\nconst DIVIDER_HEIGHT = 17;\nconst CATEGORY_HEIGHT = 32;\n\nexport function useItemsData({\n  categories,\n  options,\n  filterValue,\n  withCategoriesDivider,\n  optionLineHeight\n}: {\n  categories: IComboboxCategoryMap;\n  options: IComboboxOption[];\n  filterValue: string;\n  withCategoriesDivider: boolean;\n  optionLineHeight: number;\n}) {\n  return useMemo(() => {\n    let items: IComboboxItem[] = [];\n    let selectableItems: IComboboxOption[] = [];\n    const itemsMap = new Map();\n\n    if (categories) {\n      const optionsByCategories = getOptionsByCategories(options, categories, filterValue);\n      let optionIndex = 0;\n      Object.keys(optionsByCategories).forEach((categoryId, categoryIndex) => {\n        const withDivider = withCategoriesDivider && categoryIndex !== 0;\n        if (withDivider) {\n          items.push(createDividerItemObject({ categoryId }));\n        }\n\n        const isCategoryWithOptions = optionsByCategories[categoryId].length > 0;\n        const isFirstCategory = categoryIndex === 0;\n\n        const categoryObject = createCategoryItemObject({\n          categoryId,\n          categoryData: categories[categoryId],\n          withDivider,\n          className: cx({\n            [comboboxItemsStyles.categoryWithOptions]: isCategoryWithOptions,\n            [comboboxItemsStyles.categoryWithoutOptions]: !isCategoryWithOptions,\n            [comboboxItemsStyles.firstCategory]: isFirstCategory\n          })\n        });\n\n        // save category object in both items array and categories map\n        items.push(categoryObject);\n        itemsMap.set(categoryId, categoryObject);\n\n        optionsByCategories[categoryId].forEach((option: IComboboxOption) => {\n          const itemObject = createOptionItemObject({\n            height: optionLineHeight,\n            option,\n            index: optionIndex,\n            categoryId: categoryObject.id\n          });\n\n          itemsMap.set(itemObject.id, itemObject);\n          items.push(itemObject);\n          selectableItems.push(option);\n          optionIndex++;\n        });\n      });\n    } else {\n      selectableItems = options;\n      items = options.map((option, index) => {\n        return createOptionItemObject({\n          height: optionLineHeight,\n          option,\n          index\n        });\n      });\n    }\n    return { items, itemsMap, selectableItems };\n  }, [categories, options, filterValue, withCategoriesDivider, optionLineHeight]);\n}\n\nexport function useKeyboardNavigation({\n  defaultVisualFocusFirstIndex,\n  inputRef,\n  onClick,\n  isChildSelectable,\n  options,\n  getOptionId\n}: {\n  defaultVisualFocusFirstIndex?: boolean;\n  inputRef: MutableRefObject<HTMLElement>;\n  onClick: (event: React.KeyboardEvent | React.MouseEvent, index: number) => void;\n  isChildSelectable: (index: number) => boolean;\n  options: IComboboxOption[];\n  getOptionId: (optionId: string, index: number) => string;\n}) {\n  const filteredOptionsIds = useMemo(\n    () => options.map((option: IComboboxOption, index: number) => getOptionId(option?.id, index)),\n    [getOptionId, options]\n  );\n\n  const { visualFocusItemIndex, visualFocusItemId } = useActiveDescendantListFocus({\n    defaultVisualFocusFirstIndex,\n    focusedElementRef: inputRef,\n    focusedElementRole: useActiveDescendantListFocus.roles.COMBOBOX,\n    itemsIds: filteredOptionsIds,\n    onItemClick: onClick,\n    isItemSelectable: isChildSelectable,\n    isIgnoreSpaceAsItemSelection: true\n  });\n\n  return { visualFocusItemIndex, visualFocusItemId, onOptionClick: onClick };\n}\nexport function createDividerItemObject({ categoryId }: { categoryId: string }): IComboboxItem {\n  return { type: COMBOBOX_DIVIDER_ITEM, height: DIVIDER_HEIGHT, id: `${categoryId}-divider` };\n}\n\nexport function createCategoryItemObject({\n  withDivider,\n  categoryId,\n  categoryData,\n  className\n}: {\n  withDivider: boolean;\n  categoryId: string;\n  categoryData: IComboboxCategory;\n  className: string;\n}): IComboboxItem {\n  return {\n    height: CATEGORY_HEIGHT,\n    type: COMBOBOX_CATEGORY_ITEM,\n    category: categoryData,\n    id: categoryId,\n    withDivider,\n    className\n  };\n}\n\nexport function createOptionItemObject({\n  option,\n  height,\n  index,\n  optionRenderer,\n  isActive,\n  optionLineHeight,\n  shouldScrollToSelectedItem,\n  categoryId\n}: {\n  option?: IComboboxOption;\n  height?: number;\n  index?: number;\n  optionRenderer?: (option: IComboboxOption) => JSX.Element;\n  isActive?: boolean;\n  optionLineHeight?: number;\n  shouldScrollToSelectedItem?: boolean;\n  categoryId?: string;\n}): IComboboxItem {\n  return {\n    type: COMBOBOX_OPTION_ITEM,\n    height,\n    belongToCategory: true,\n    index,\n    option,\n    id: option.id || index.toString(),\n    optionRenderer,\n    isActive,\n    optionLineHeight,\n    shouldScrollToSelectedItem,\n    categoryId\n  };\n}\n\nexport function comboboxItemRenderer({\n  item,\n  style,\n  optionEvents,\n  optionRenderData,\n  isVirtualized,\n  stickyCategories\n}: {\n  item: IComboboxItem;\n  style: CSSProperties;\n  optionEvents: IComboboxOptionEvents;\n  optionRenderData: any;\n  isVirtualized: boolean;\n  stickyCategories?: boolean;\n}) {\n  const { type, ...otherArgs } = item;\n  let customClassNames;\n  let innerElement;\n  switch (type) {\n    case COMBOBOX_DIVIDER_ITEM: {\n      innerElement = dividerItemRenderer({ id: otherArgs.id, height: otherArgs.height });\n      break;\n    }\n    case COMBOBOX_CATEGORY_ITEM: {\n      innerElement = categoryItemRenderer({\n        id: otherArgs.id,\n        category: otherArgs.category,\n        className: otherArgs.className\n      });\n      if (stickyCategories && !isVirtualized) {\n        customClassNames = styles.sticky;\n      }\n      break;\n    }\n    case COMBOBOX_OPTION_ITEM: {\n      innerElement = optionItemRenderer({\n        ...otherArgs,\n        ...optionEvents,\n        ...optionRenderData\n      });\n      break;\n    }\n  }\n\n  return (\n    <div key={otherArgs.id} className={cx(styles.comboboxItemContainer, customClassNames)} style={style}>\n      {innerElement}\n    </div>\n  );\n}\n\nexport function dividerItemRenderer({ id, height }: { id: string; height: number }) {\n  return (\n    <div className={styles.dividerContainer} style={{ height: height }}>\n      <Divider className={styles.divider} key={id} />\n    </div>\n  );\n}\n\nexport function categoryItemRenderer({\n  id,\n  category,\n  className\n}: {\n  id: string;\n  category: IComboboxCategory;\n  className: string;\n}) {\n  return <ComboboxCategory key={id} category={category} className={className} />;\n}\n\nexport function optionItemRenderer({\n  id,\n  index,\n  option,\n  className,\n  onOptionClick,\n  onOptionEnter,\n  onOptionLeave,\n  optionLineHeight,\n  optionRenderer,\n  scrollRef,\n  shouldScrollToSelectedItem,\n  activeItemIndex,\n  visualFocusItemIndex\n}: IOptionItemRendererArgs) {\n  return (\n    <ComboboxOption\n      className={className}\n      index={index}\n      key={id}\n      option={option}\n      optionRenderer={optionRenderer}\n      scrollRef={scrollRef}\n      isActive={activeItemIndex === index}\n      visualFocus={index === visualFocusItemIndex}\n      onOptionClick={onOptionClick}\n      onOptionHover={onOptionEnter}\n      onOptionLeave={onOptionLeave}\n      onOptionEnter={onOptionEnter}\n      optionLineHeight={optionLineHeight}\n      shouldScrollWhenActive={shouldScrollToSelectedItem}\n    />\n  );\n}\n"],"names":["DIVIDER_HEIGHT","CATEGORY_HEIGHT","useItemsData","_ref","categories","options","filterValue","withCategoriesDivider","optionLineHeight","useMemo","items","selectableItems","itemsMap","Map","optionsByCategories","getOptionsByCategories","optionIndex","Object","keys","forEach","categoryId","categoryIndex","withDivider","push","createDividerItemObject","isCategoryWithOptions","length","isFirstCategory","categoryObject","createCategoryItemObject","categoryData","className","cx","_defineProperty","comboboxItemsStyles","categoryWithOptions","categoryWithoutOptions","firstCategory","set","option","itemObject","createOptionItemObject","height","index","id","map","useKeyboardNavigation","_ref2","defaultVisualFocusFirstIndex","inputRef","onClick","isChildSelectable","getOptionId","filteredOptionsIds","_useActiveDescendantL","useActiveDescendantListFocus","focusedElementRef","focusedElementRole","roles","COMBOBOX","itemsIds","onItemClick","isItemSelectable","isIgnoreSpaceAsItemSelection","visualFocusItemIndex","visualFocusItemId","onOptionClick","_ref3","type","COMBOBOX_DIVIDER_ITEM","concat","_ref4","COMBOBOX_CATEGORY_ITEM","category","_ref5","COMBOBOX_OPTION_ITEM","belongToCategory","optionRenderer","isActive","shouldScrollToSelectedItem","comboboxItemRenderer","_ref6","customClassNames","innerElement","item","style","optionEvents","optionRenderData","isVirtualized","stickyCategories","otherArgs","__rest","dividerItemRenderer","categoryItemRenderer","styles","sticky","optionItemRenderer","assign","React","createElement","key","comboboxItemContainer","_ref7","dividerContainer","Divider","divider","_ref8","ComboboxCategory","_ref9","onOptionEnter","ComboboxOption","scrollRef","activeItemIndex","visualFocus","onOptionHover","onOptionLeave","shouldScrollWhenActive"],"mappings":"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"}

package/dist/mocked_classnames/src/components/Combobox/ComboboxHelpers/ComboboxHelpers.module.scss.js

@@ -1,2 +1,2 @@
-var e={comboboxItemContainer:"comboboxItemContainer",dividerContainer:"dividerContainer",divider:"divider",sticky:"sticky"};!function(e){const n="s_id-cfec7f62c06c_4_5_3";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,i.firstChild?i.insertBefore(t,i.firstChild):i.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".comboboxItemContainer {\n  display: flex;\n  flex: auto;\n  width: 100%;\n  background-color: var(--secondary-background-color);\n}\n\n.dividerContainer {\n  position: relative;\n  width: 95%;\n}\n\n.divider {\n  position: absolute;\n  width: calc(100% + 16px);\n  margin-inline-start: -12px;\n}\n\n.sticky {\n  position: sticky;\n  top: 0;\n  z-index: 20;\n}");export{e as default};
+var e={comboboxItemContainer:"comboboxItemContainer",dividerContainer:"dividerContainer",divider:"divider",sticky:"sticky"};!function(e){const n="s_id-cfec7f62c06c_4_5_10";if("undefined"!=typeof document){const i=document.head||document.getElementsByTagName("head")[0];if(i.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,i.firstChild?i.insertBefore(t,i.firstChild):i.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}(".comboboxItemContainer {\n  display: flex;\n  flex: auto;\n  width: 100%;\n  background-color: var(--secondary-background-color);\n}\n\n.dividerContainer {\n  position: relative;\n  width: 95%;\n}\n\n.divider {\n  position: absolute;\n  width: calc(100% + 16px);\n  margin-inline-start: -12px;\n}\n\n.sticky {\n  position: sticky;\n  top: 0;\n  z-index: 20;\n}");export{e as default};
 //# sourceMappingURL=ComboboxHelpers.module.scss.js.map