@vibe/core 4.0.0 → 4.0.1-alpha-649fd.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":"snBAaA,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 } 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"}

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

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

@@ -1,2 +1,2 @@
-import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import t,{forwardRef as o,useRef as i,useEffect as r,useMemo as l}from"react";import s from"classnames";import a from"../../hooks/useMergeRef.js";import{getStyle as m}from"../../helpers/typesciptCssModulesHelper.js";import{Text as d}from"@vibe/typography/mockedClassNames";import{useListItemProps as n}from"./hooks/useListItemProps.js";import{Tooltip as p}from"@vibe/tooltip/mockedClassNames";import{renderSideElement as c}from"./utils.js";import v from"./BaseItem.module.scss.js";var h=o((function(o,h){var u=o.className,f=o.id,g=o.component,b=void 0===g?"li":g,y=o.size,j=void 0===y?"medium":y,E=o.selected,P=void 0!==E&&E,k=o.readOnly,z=void 0!==k&&k,N=o.highlighted,C=void 0!==N&&N,O=o.role,x=o.dir,B=void 0===x?"auto":x,H=o.itemRenderer,I=o.itemProps,M=void 0===I?{}:I,R=o.item,S=void 0===R?{}:R,_=i(null),w=a(h,_),F=n({id:f,component:b,size:j,highlighted:C,role:O,itemProps:M});r((function(){var e;null===(e=F.refCallback)||void 0===e||e.call(F,_.current)}),[F]);var L=S.label,q=void 0===L?"":L,A=S.disabled,D=void 0!==A&&A,G=S.startElement,J=S.endElement,K=S.tooltipProps,Q=void 0===K?{}:K,T=l((function(){return s(v.wrapper,e(e(e(e({},v.selected,P),v.disabled,D),v.highlighted,F.highlighted),v.readOnly,z),m(v,F.size),u)}),[P,D,F.highlighted,z,F.size,u]),U="small"===F.size?"text2":"text1",V=F.component;return t.createElement(p,Object.assign({},Q,{content:null==Q?void 0:Q.content,position:"rtl"===B?"right":"left",containerSelector:"body"}),t.createElement(V,Object.assign({id:F.id,ref:w,className:T,role:F.role,"aria-selected":P,"aria-disabled":D||void 0},F.itemProps),H?H(S):t.createElement(t.Fragment,null,G&&c(G,D,U),t.createElement(d,{type:U,color:"inherit",tooltipProps:{containerSelector:"body"}},q),J&&t.createElement("div",{className:v.endElement},c(J,D,U)))))}));export{h as default};
+import{defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import t,{forwardRef as i,useRef as o,useEffect as r,useMemo as l}from"react";import s from"classnames";import{useMergeRef as a,getStyle as m}from"@vibe/shared";import{Text as d}from"@vibe/typography/mockedClassNames";import{useListItemProps as n}from"./hooks/useListItemProps.js";import{Tooltip as c}from"@vibe/tooltip/mockedClassNames";import{renderSideElement as p}from"./utils.js";import v from"./BaseItem.module.scss.js";var h=i((function(i,h){var u=i.className,f=i.id,g=i.component,b=void 0===g?"li":g,y=i.size,E=void 0===y?"medium":y,P=i.selected,j=void 0!==P&&P,z=i.readOnly,N=void 0!==z&&z,k=i.highlighted,O=void 0!==k&&k,x=i.role,C=i.dir,B=void 0===C?"auto":C,I=i.itemRenderer,S=i.itemProps,_=void 0===S?{}:S,w=i.item,F=void 0===w?{}:w,H=o(null),L=a(h,H),R=n({id:f,component:b,size:E,highlighted:O,role:x,itemProps:_});r((function(){var e;null===(e=R.refCallback)||void 0===e||e.call(R,H.current)}),[R]);var q=F.label,A=void 0===q?"":q,D=F.disabled,G=void 0!==D&&D,J=F.startElement,K=F.endElement,M=F.tooltipProps,Q=void 0===M?{}:M,T=l((function(){return s(v.wrapper,e(e(e(e({},v.selected,j),v.disabled,G),v.highlighted,R.highlighted),v.readOnly,N),m(v,R.size),u)}),[j,G,R.highlighted,N,R.size,u]),U="small"===R.size?"text2":"text1",V=R.component;return t.createElement(c,Object.assign({},Q,{content:null==Q?void 0:Q.content,position:"rtl"===B?"right":"left",containerSelector:"body"}),t.createElement(V,Object.assign({id:R.id,ref:L,className:T,role:R.role,"aria-selected":j,"aria-disabled":G||void 0},R.itemProps),I?I(F):t.createElement(t.Fragment,null,J&&p(J,G,U),t.createElement(d,{type:U,color:"inherit",tooltipProps:{containerSelector:"body"}},A),K&&t.createElement("div",{className:v.endElement},p(K,G,U)))))}));export{h as default};
 //# sourceMappingURL=BaseItem.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"BaseItem.js","sources":["../../../../../src/components/BaseItem/BaseItem.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useMemo, useRef } from \"react\";\nimport cx from \"classnames\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { Text, type TextType } from \"@vibe/typography\";\nimport { type BaseItemData, type BaseItemProps } from \"./BaseItem.types\";\nimport { useListItemProps } from \"./hooks/useListItemProps\";\nimport { Tooltip } from \"@vibe/tooltip\";\nimport { renderSideElement } from \"./utils\";\nimport styles from \"./BaseItem.module.scss\";\n\nconst BaseItem = forwardRef(\n  <Item extends Record<string, unknown>>(\n    {\n      className,\n      id,\n      component = \"li\",\n      size = \"medium\",\n      selected = false,\n      readOnly = false,\n      highlighted = false,\n      role,\n      index: _index,\n      dir = \"auto\",\n      itemRenderer,\n      itemProps = {},\n      item = {} as BaseItemData<Item>\n    }: BaseItemProps<Item>,\n    ref: React.Ref<HTMLElement>\n  ) => {\n    const internalRef = useRef<HTMLElement>(null);\n    const mergedRef = useMergeRef(ref, internalRef);\n\n    const listItemProps = useListItemProps({ id, component, size, highlighted, role, itemProps });\n\n    useEffect(() => {\n      listItemProps.refCallback?.(internalRef.current);\n    }, [listItemProps]);\n\n    const { label = \"\", disabled = false, startElement, endElement, tooltipProps = {} } = item;\n\n    const listItemClassNames = useMemo(\n      () =>\n        cx(\n          styles.wrapper,\n          {\n            [styles.selected]: selected,\n            [styles.disabled]: disabled,\n            [styles.highlighted]: listItemProps.highlighted,\n            [styles.readOnly]: readOnly\n          },\n          getStyle(styles, listItemProps.size),\n          className\n        ),\n      [selected, disabled, listItemProps.highlighted, readOnly, listItemProps.size, className]\n    );\n\n    const textVariant: TextType = listItemProps.size === \"small\" ? \"text2\" : \"text1\";\n    const Element = listItemProps.component as React.ElementType;\n\n    return (\n      <Tooltip\n        {...tooltipProps}\n        content={tooltipProps?.content}\n        position={dir === \"rtl\" ? \"right\" : \"left\"}\n        containerSelector=\"body\"\n      >\n        <Element\n          id={listItemProps.id}\n          ref={mergedRef}\n          className={listItemClassNames}\n          role={listItemProps.role}\n          aria-selected={selected}\n          aria-disabled={disabled || undefined}\n          {...listItemProps.itemProps}\n        >\n          {itemRenderer ? (\n            itemRenderer(item)\n          ) : (\n            <>\n              {startElement && renderSideElement(startElement, disabled, textVariant)}\n              <Text type={textVariant} color=\"inherit\" tooltipProps={{ containerSelector: \"body\" }}>\n                {label}\n              </Text>\n              {endElement && (\n                <div className={styles.endElement}>{renderSideElement(endElement, disabled, textVariant)}</div>\n              )}\n            </>\n          )}\n        </Element>\n      </Tooltip>\n    );\n  }\n);\n\nexport default BaseItem as <Item extends Record<string, unknown>>(\n  props: BaseItemProps<Item> & { ref?: React.Ref<HTMLElement> }\n) => React.ReactElement;\n"],"names":["BaseItem","forwardRef","_ref","ref","className","id","_ref$component","component","_ref$size","size","_ref$selected","selected","_ref$readOnly","readOnly","_ref$highlighted","highlighted","role","_ref$dir","dir","itemRenderer","_ref$itemProps","itemProps","_ref$item","item","internalRef","useRef","mergedRef","useMergeRef","listItemProps","useListItemProps","useEffect","_a","refCallback","call","current","_item$label","label","_item$disabled","disabled","startElement","endElement","_item$tooltipProps","tooltipProps","listItemClassNames","useMemo","cx","styles","wrapper","_defineProperty","getStyle","textVariant","Element","React","createElement","Tooltip","Object","assign","content","position","containerSelector","undefined","Fragment","renderSideElement","Text","type","color"],"mappings":"ijBAWMA,IAAAA,EAAWC,GACf,SAAAC,EAgBEC,GACE,IAfAC,EAASF,EAATE,UACAC,EAAEH,EAAFG,GAAEC,EAAAJ,EACFK,UAAAA,OAAY,IAAHD,EAAG,KAAIA,EAAAE,EAAAN,EAChBO,KAAAA,OAAO,IAAHD,EAAG,SAAQA,EAAAE,EAAAR,EACfS,SAAAA,OAAW,IAAHD,GAAQA,EAAAE,EAAAV,EAChBW,SAAAA,OAAW,IAAHD,GAAQA,EAAAE,EAAAZ,EAChBa,YAAAA,OAAc,IAAHD,GAAQA,EACnBE,EAAId,EAAJc,KACKC,EAAAf,EACLgB,IAAAA,OAAM,IAAHD,EAAG,OAAMA,EACZE,EAAYjB,EAAZiB,aAAYC,EAAAlB,EACZmB,UAAAA,OAAS,IAAAD,EAAG,CAAA,EAAEA,EAAAE,EAAApB,EACdqB,KAAAA,OAAI,IAAAD,EAAG,CAAwB,EAAAA,EAI3BE,EAAcC,EAAoB,MAClCC,EAAYC,EAAYxB,EAAKqB,GAE7BI,EAAgBC,EAAiB,CAAExB,GAAAA,EAAIE,UAAAA,EAAWE,KAAAA,EAAMM,YAAAA,EAAaC,KAAAA,EAAMK,UAAAA,IAEjFS,GAAU,iBACiB,QAAzBC,EAAAH,EAAcI,mBAAW,IAAAD,GAAAA,EAAAE,KAAAL,EAAGJ,EAAYU,QAC1C,GAAG,CAACN,IAEJ,IAAAO,EAAsFZ,EAA9Ea,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EAAAE,EAAoEd,EAAlEe,SAAAA,OAAW,IAAHD,GAAQA,EAAEE,EAAgDhB,EAAhDgB,aAAcC,EAAkCjB,EAAlCiB,WAAUC,EAAwBlB,EAAtBmB,aAAAA,OAAY,IAAAD,EAAG,CAAA,EAAEA,EAE3EE,EAAqBC,GACzB,WAAA,OACEC,EACEC,EAAOC,QAAOC,EAAAA,EAAAA,EAAAA,EAAA,CAAA,EAEXF,EAAOnC,SAAWA,GAClBmC,EAAOR,SAAWA,GAClBQ,EAAO/B,YAAca,EAAcb,aACnC+B,EAAOjC,SAAWA,GAErBoC,EAASH,EAAQlB,EAAcnB,MAC/BL,EACD,GACH,CAACO,EAAU2B,EAAUV,EAAcb,YAAaF,EAAUe,EAAcnB,KAAML,IAG1E8C,EAA+C,UAAvBtB,EAAcnB,KAAmB,QAAU,QACnE0C,EAAUvB,EAAcrB,UAE9B,OACE6C,EAAAC,cAACC,EAAOC,OAAAC,OAAA,CAAA,EACFd,EACJ,CAAAe,QAASf,aAAA,EAAAA,EAAce,QACvBC,SAAkB,QAARxC,EAAgB,QAAU,OACpCyC,kBAAkB,SAElBP,EAACC,cAAAF,iBACC9C,GAAIuB,EAAcvB,GAClBF,IAAKuB,EACLtB,UAAWuC,EACX3B,KAAMY,EAAcZ,KAAI,gBACTL,EACA,gBAAA2B,QAAYsB,GACvBhC,EAAcP,WAEjBF,EACCA,EAAaI,GAEb6B,EAAAC,cAAAD,EAAAS,SAAA,KACGtB,GAAgBuB,EAAkBvB,EAAcD,EAAUY,GAC3DE,EAAAC,cAACU,EAAK,CAAAC,KAAMd,EAAae,MAAM,UAAUvB,aAAc,CAAEiB,kBAAmB,SACzEvB,GAEFI,GACCY,EAAAC,cAAA,MAAA,CAAKjD,UAAW0C,EAAON,YAAasB,EAAkBtB,EAAYF,EAAUY,MAO1F"}
+{"version":3,"file":"BaseItem.js","sources":["../../../../../src/components/BaseItem/BaseItem.tsx"],"sourcesContent":["import React, { forwardRef, useEffect, useMemo, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { useMergeRef, getStyle } from \"@vibe/shared\";\n\nimport { Text, type TextType } from \"@vibe/typography\";\nimport { type BaseItemData, type BaseItemProps } from \"./BaseItem.types\";\nimport { useListItemProps } from \"./hooks/useListItemProps\";\nimport { Tooltip } from \"@vibe/tooltip\";\nimport { renderSideElement } from \"./utils\";\nimport styles from \"./BaseItem.module.scss\";\n\nconst BaseItem = forwardRef(\n  <Item extends Record<string, unknown>>(\n    {\n      className,\n      id,\n      component = \"li\",\n      size = \"medium\",\n      selected = false,\n      readOnly = false,\n      highlighted = false,\n      role,\n      index: _index,\n      dir = \"auto\",\n      itemRenderer,\n      itemProps = {},\n      item = {} as BaseItemData<Item>\n    }: BaseItemProps<Item>,\n    ref: React.Ref<HTMLElement>\n  ) => {\n    const internalRef = useRef<HTMLElement>(null);\n    const mergedRef = useMergeRef(ref, internalRef);\n\n    const listItemProps = useListItemProps({ id, component, size, highlighted, role, itemProps });\n\n    useEffect(() => {\n      listItemProps.refCallback?.(internalRef.current);\n    }, [listItemProps]);\n\n    const { label = \"\", disabled = false, startElement, endElement, tooltipProps = {} } = item;\n\n    const listItemClassNames = useMemo(\n      () =>\n        cx(\n          styles.wrapper,\n          {\n            [styles.selected]: selected,\n            [styles.disabled]: disabled,\n            [styles.highlighted]: listItemProps.highlighted,\n            [styles.readOnly]: readOnly\n          },\n          getStyle(styles, listItemProps.size),\n          className\n        ),\n      [selected, disabled, listItemProps.highlighted, readOnly, listItemProps.size, className]\n    );\n\n    const textVariant: TextType = listItemProps.size === \"small\" ? \"text2\" : \"text1\";\n    const Element = listItemProps.component as React.ElementType;\n\n    return (\n      <Tooltip\n        {...tooltipProps}\n        content={tooltipProps?.content}\n        position={dir === \"rtl\" ? \"right\" : \"left\"}\n        containerSelector=\"body\"\n      >\n        <Element\n          id={listItemProps.id}\n          ref={mergedRef}\n          className={listItemClassNames}\n          role={listItemProps.role}\n          aria-selected={selected}\n          aria-disabled={disabled || undefined}\n          {...listItemProps.itemProps}\n        >\n          {itemRenderer ? (\n            itemRenderer(item)\n          ) : (\n            <>\n              {startElement && renderSideElement(startElement, disabled, textVariant)}\n              <Text type={textVariant} color=\"inherit\" tooltipProps={{ containerSelector: \"body\" }}>\n                {label}\n              </Text>\n              {endElement && (\n                <div className={styles.endElement}>{renderSideElement(endElement, disabled, textVariant)}</div>\n              )}\n            </>\n          )}\n        </Element>\n      </Tooltip>\n    );\n  }\n);\n\nexport default BaseItem as <Item extends Record<string, unknown>>(\n  props: BaseItemProps<Item> & { ref?: React.Ref<HTMLElement> }\n) => React.ReactElement;\n"],"names":["BaseItem","forwardRef","_ref","ref","className","id","_ref$component","component","_ref$size","size","_ref$selected","selected","_ref$readOnly","readOnly","_ref$highlighted","highlighted","role","_ref$dir","dir","itemRenderer","_ref$itemProps","itemProps","_ref$item","item","internalRef","useRef","mergedRef","useMergeRef","listItemProps","useListItemProps","useEffect","_a","refCallback","call","current","_item$label","label","_item$disabled","disabled","startElement","endElement","_item$tooltipProps","tooltipProps","listItemClassNames","useMemo","cx","styles","wrapper","_defineProperty","getStyle","textVariant","Element","React","createElement","Tooltip","Object","assign","content","position","containerSelector","undefined","Fragment","renderSideElement","Text","type","color"],"mappings":"0fAWMA,IAAAA,EAAWC,GACf,SAAAC,EAgBEC,GACE,IAfAC,EAASF,EAATE,UACAC,EAAEH,EAAFG,GAAEC,EAAAJ,EACFK,UAAAA,OAAY,IAAHD,EAAG,KAAIA,EAAAE,EAAAN,EAChBO,KAAAA,OAAO,IAAHD,EAAG,SAAQA,EAAAE,EAAAR,EACfS,SAAAA,OAAW,IAAHD,GAAQA,EAAAE,EAAAV,EAChBW,SAAAA,OAAW,IAAHD,GAAQA,EAAAE,EAAAZ,EAChBa,YAAAA,OAAc,IAAHD,GAAQA,EACnBE,EAAId,EAAJc,KACKC,EAAAf,EACLgB,IAAAA,OAAM,IAAHD,EAAG,OAAMA,EACZE,EAAYjB,EAAZiB,aAAYC,EAAAlB,EACZmB,UAAAA,OAAS,IAAAD,EAAG,CAAA,EAAEA,EAAAE,EAAApB,EACdqB,KAAAA,OAAI,IAAAD,EAAG,CAAwB,EAAAA,EAI3BE,EAAcC,EAAoB,MAClCC,EAAYC,EAAYxB,EAAKqB,GAE7BI,EAAgBC,EAAiB,CAAExB,GAAAA,EAAIE,UAAAA,EAAWE,KAAAA,EAAMM,YAAAA,EAAaC,KAAAA,EAAMK,UAAAA,IAEjFS,GAAU,iBACiB,QAAzBC,EAAAH,EAAcI,mBAAW,IAAAD,GAAAA,EAAAE,KAAAL,EAAGJ,EAAYU,QAC1C,GAAG,CAACN,IAEJ,IAAAO,EAAsFZ,EAA9Ea,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EAAAE,EAAoEd,EAAlEe,SAAAA,OAAW,IAAHD,GAAQA,EAAEE,EAAgDhB,EAAhDgB,aAAcC,EAAkCjB,EAAlCiB,WAAUC,EAAwBlB,EAAtBmB,aAAAA,OAAY,IAAAD,EAAG,CAAA,EAAEA,EAE3EE,EAAqBC,GACzB,WAAA,OACEC,EACEC,EAAOC,QAAOC,EAAAA,EAAAA,EAAAA,EAAA,CAAA,EAEXF,EAAOnC,SAAWA,GAClBmC,EAAOR,SAAWA,GAClBQ,EAAO/B,YAAca,EAAcb,aACnC+B,EAAOjC,SAAWA,GAErBoC,EAASH,EAAQlB,EAAcnB,MAC/BL,EACD,GACH,CAACO,EAAU2B,EAAUV,EAAcb,YAAaF,EAAUe,EAAcnB,KAAML,IAG1E8C,EAA+C,UAAvBtB,EAAcnB,KAAmB,QAAU,QACnE0C,EAAUvB,EAAcrB,UAE9B,OACE6C,EAAAC,cAACC,EAAOC,OAAAC,OAAA,CAAA,EACFd,EACJ,CAAAe,QAASf,aAAA,EAAAA,EAAce,QACvBC,SAAkB,QAARxC,EAAgB,QAAU,OACpCyC,kBAAkB,SAElBP,EAACC,cAAAF,iBACC9C,GAAIuB,EAAcvB,GAClBF,IAAKuB,EACLtB,UAAWuC,EACX3B,KAAMY,EAAcZ,KAAI,gBACTL,EACA,gBAAA2B,QAAYsB,GACvBhC,EAAcP,WAEjBF,EACCA,EAAaI,GAEb6B,EAAAC,cAAAD,EAAAS,SAAA,KACGtB,GAAgBuB,EAAkBvB,EAAcD,EAAUY,GAC3DE,EAAAC,cAACU,EAAK,CAAAC,KAAMd,EAAae,MAAM,UAAUvB,aAAc,CAAEiB,kBAAmB,SACzEvB,GAEFI,GACCY,EAAAC,cAAA,MAAA,CAAKjD,UAAW0C,EAAON,YAAasB,EAAkBtB,EAAYF,EAAUY,MAO1F"}

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

@@ -1,2 +1,2 @@
-import{__rest as e}from"../../../_virtual/_tslib.js";import t,{forwardRef as s,useRef as r,useMemo as a}from"react";import i from"classnames";import o from"../../hooks/useMergeRef.js";import n from"../../hooks/ssr/useIsomorphicLayoutEffect.js";import{BaseListItemProvider as d,BaseListProvider as c}from"./context/BaseListContext.js";import{useBaseListFocus as l}from"./hooks/useBaseListFocus.js";import{useBaseListKeyboard as u}from"./hooks/useBaseListKeyboard.js";import{getItemId as m,isListItem as f,getItemComponentType as b,getChildRole as p}from"./utils/baseListUtils.js";import h from"./BaseList.module.scss.js";var v=s((function(s,v){var I=s.className,x=s.id,g=s.as,y=void 0===g?"ul":g,j=s.children,F=s["aria-label"],L=s["aria-describedby"],k=s["aria-controls"],C=s.role,E=void 0===C?"listbox":C,O=s.size,z=void 0===O?"medium":O,B=s.maxHeight,R=s.focusOnMount,M=void 0!==R&&R,N=s.defaultFocusIndex,A=void 0===N?0:N,H=s.onFocusChange,_=s.style,q=s.disabled,D=void 0!==q&&q,K=s["data-testid"],U=e(s,["className","id","as","children","aria-label","aria-describedby","aria-controls","role","size","maxHeight","focusOnMount","defaultFocusIndex","onFocusChange","style","disabled","data-testid"]),V=r(null),w=o(v,V),G=y,J=l({defaultFocusIndex:A,onFocusChange:H,listId:x,disabled:D}),P=J.focusIndex,Q=J.activeDescendantId,S=J.updateFocusedItem,T=J.registerItem,W=J.childrenRefs;u({focusIndex:P,childrenRefs:W,listId:x,updateFocusedItem:S,componentRef:V,disabled:D}),n((function(){M&&V.current&&requestAnimationFrame((function(){var e;null===(e=V.current)||void 0===e||e.focus()}))}),[M]);var X=a((function(){var e=t.Children.toArray(j);return W.current=W.current.slice(0,e.length),e.map((function(e,s){if(!t.isValidElement(e))return e;var r=m(x,s,e.props.id),a=W.current[s],i=null==a||f(a),o=e.props.role||("string"==typeof e.type?void 0:p(E)),n={index:s,id:r,highlighted:P===s&&i,tabIndex:P===s&&i?0:-1,component:b(y),size:z,role:o,refCallback:function(e){W.current[s]=e}};return t.createElement(d,{key:r,value:n},e)}))}),[j,y,P,x,E,z,W]),Y=a((function(){return{activeItemIndex:P,updateFocusedItem:S,registerItem:T,size:z}}),[P,S,T,z]),Z=a((function(){return B?Object.assign(Object.assign({},_),{"--baselist-max-height":"number"==typeof B?"".concat(B,"px"):B}):_}),[B,_]);return t.createElement(c,{value:Y},t.createElement(G,Object.assign({ref:w,id:x,className:i(h.baseList,I),style:Z,"aria-label":F,"aria-describedby":L,"aria-controls":k,"aria-activedescendant":Q,"aria-disabled":D||void 0,role:E,tabIndex:-1,"data-testid":K},U),X))}));export{v as default};
+import{__rest as e}from"../../../_virtual/_tslib.js";import t,{forwardRef as a,useRef as s,useMemo as i}from"react";import r from"classnames";import{useMergeRef as o,useIsomorphicLayoutEffect as n}from"@vibe/shared";import{BaseListItemProvider as d,BaseListProvider as c}from"./context/BaseListContext.js";import{useBaseListFocus as l}from"./hooks/useBaseListFocus.js";import{useBaseListKeyboard as u}from"./hooks/useBaseListKeyboard.js";import{getItemId as m,isListItem as f,getItemComponentType as b,getChildRole as p}from"./utils/baseListUtils.js";import v from"./BaseList.module.scss.js";var h=a((function(a,h){var x=a.className,I=a.id,g=a.as,y=void 0===g?"ul":g,F=a.children,j=a["aria-label"],C=a["aria-describedby"],L=a["aria-controls"],O=a.role,k=void 0===O?"listbox":O,z=a.size,B=void 0===z?"medium":z,E=a.maxHeight,N=a.focusOnMount,R=void 0!==N&&N,A=a.defaultFocusIndex,H=void 0===A?0:A,M=a.onFocusChange,_=a.style,q=a.disabled,D=void 0!==q&&q,K=a["data-testid"],U=e(a,["className","id","as","children","aria-label","aria-describedby","aria-controls","role","size","maxHeight","focusOnMount","defaultFocusIndex","onFocusChange","style","disabled","data-testid"]),V=s(null),w=o(h,V),G=y,J=l({defaultFocusIndex:H,onFocusChange:M,listId:I,disabled:D}),P=J.focusIndex,Q=J.activeDescendantId,S=J.updateFocusedItem,T=J.registerItem,W=J.childrenRefs;u({focusIndex:P,childrenRefs:W,listId:I,updateFocusedItem:S,componentRef:V,disabled:D}),n((function(){R&&V.current&&requestAnimationFrame((function(){var e;null===(e=V.current)||void 0===e||e.focus()}))}),[R]);var X=i((function(){var e=t.Children.toArray(F);return W.current=W.current.slice(0,e.length),e.map((function(e,a){if(!t.isValidElement(e))return e;var s=m(I,a,e.props.id),i=W.current[a],r=null==i||f(i),o=e.props.role||("string"==typeof e.type?void 0:p(k)),n={index:a,id:s,highlighted:P===a&&r,tabIndex:P===a&&r?0:-1,component:b(y),size:B,role:o,refCallback:function(e){W.current[a]=e}};return t.createElement(d,{key:s,value:n},e)}))}),[F,y,P,I,k,B,W]),Y=i((function(){return{activeItemIndex:P,updateFocusedItem:S,registerItem:T,size:B}}),[P,S,T,B]),Z=i((function(){return E?Object.assign(Object.assign({},_),{"--baselist-max-height":"number"==typeof E?"".concat(E,"px"):E}):_}),[E,_]);return t.createElement(c,{value:Y},t.createElement(G,Object.assign({ref:w,id:I,className:r(v.baseList,x),style:Z,"aria-label":j,"aria-describedby":C,"aria-controls":L,"aria-activedescendant":Q,"aria-disabled":D||void 0,role:k,tabIndex:-1,"data-testid":K},U),X))}));export{h as default};
 //# sourceMappingURL=BaseList.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"BaseList.js","sources":["../../../../../src/components/BaseList/BaseList.tsx"],"sourcesContent":["import React, { forwardRef, type ReactElement, useMemo, useRef } from \"react\";\nimport cx from \"classnames\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport useIsomorphicLayoutEffect from \"../../hooks/ssr/useIsomorphicLayoutEffect\";\nimport { type BaseListProps } from \"./BaseList.types\";\nimport {\n  BaseListProvider,\n  BaseListItemProvider,\n  type BaseListContextProps,\n  type BaseListItemContextProps\n} from \"./context/BaseListContext\";\nimport { useBaseListFocus } from \"./hooks/useBaseListFocus\";\nimport { useBaseListKeyboard } from \"./hooks/useBaseListKeyboard\";\nimport { getChildRole, getItemComponentType, getItemId, isListItem } from \"./utils/baseListUtils\";\nimport styles from \"./BaseList.module.scss\";\n\nconst BaseList = forwardRef(\n  (\n    {\n      className,\n      id,\n      as = \"ul\",\n      children,\n      \"aria-label\": ariaLabel,\n      \"aria-describedby\": ariaDescribedBy,\n      \"aria-controls\": ariaControls,\n      role = \"listbox\",\n      size = \"medium\",\n      maxHeight,\n      focusOnMount = false,\n      defaultFocusIndex = 0,\n      onFocusChange,\n      style,\n      disabled = false,\n      \"data-testid\": dataTestId,\n      ...rest\n    }: BaseListProps,\n    ref: React.ForwardedRef<HTMLElement>\n  ) => {\n    const componentRef = useRef<HTMLElement>(null);\n    const mergedRef = useMergeRef(ref, componentRef);\n\n    const Element = as as React.ElementType;\n\n    const { focusIndex, activeDescendantId, updateFocusedItem, registerItem, childrenRefs } = useBaseListFocus({\n      defaultFocusIndex,\n      onFocusChange,\n      listId: id,\n      disabled\n    });\n\n    useBaseListKeyboard({\n      focusIndex,\n      childrenRefs,\n      listId: id,\n      updateFocusedItem,\n      componentRef,\n      disabled\n    });\n\n    useIsomorphicLayoutEffect(() => {\n      if (focusOnMount && componentRef.current) {\n        requestAnimationFrame(() => {\n          componentRef.current?.focus();\n        });\n      }\n    }, [focusOnMount]);\n\n    const enrichedChildren = useMemo(() => {\n      const childArray = React.Children.toArray(children) as ReactElement[];\n      childrenRefs.current = childrenRefs.current.slice(0, childArray.length);\n\n      return childArray.map((child, index) => {\n        if (!React.isValidElement(child)) {\n          return child;\n        }\n\n        const childId = getItemId(id, index, (child.props as { id?: string }).id);\n        const currentRef = childrenRefs.current[index];\n        const isFocusableItem = currentRef === undefined || currentRef === null || isListItem(currentRef);\n        const isDOMElement = typeof child.type === \"string\";\n\n        const existingRole = (child.props as { role?: string }).role;\n        const childRole = existingRole || (!isDOMElement ? getChildRole(role) : undefined);\n\n        const refCallback = (itemRef: HTMLElement | null) => {\n          childrenRefs.current[index] = itemRef;\n        };\n\n        const itemContextValue: BaseListItemContextProps = {\n          index,\n          id: childId,\n          highlighted: focusIndex === index && isFocusableItem,\n          tabIndex: focusIndex === index && isFocusableItem ? 0 : -1,\n          component: getItemComponentType(as),\n          size,\n          role: childRole,\n          refCallback\n        };\n\n        return (\n          <BaseListItemProvider key={childId} value={itemContextValue}>\n            {child}\n          </BaseListItemProvider>\n        );\n      });\n    }, [children, as, focusIndex, id, role, size, childrenRefs]);\n\n    const contextValue: BaseListContextProps = useMemo(\n      () => ({\n        activeItemIndex: focusIndex,\n        updateFocusedItem,\n        registerItem,\n        size\n      }),\n      [focusIndex, updateFocusedItem, registerItem, size]\n    );\n\n    const listStyle = useMemo(\n      () =>\n        maxHeight\n          ? ({\n              ...style,\n              \"--baselist-max-height\": typeof maxHeight === \"number\" ? `${maxHeight}px` : maxHeight\n            } as React.CSSProperties)\n          : style,\n      [maxHeight, style]\n    );\n\n    return (\n      <BaseListProvider value={contextValue}>\n        <Element\n          ref={mergedRef}\n          id={id}\n          className={cx(styles.baseList, className)}\n          style={listStyle}\n          aria-label={ariaLabel}\n          aria-describedby={ariaDescribedBy}\n          aria-controls={ariaControls}\n          aria-activedescendant={activeDescendantId}\n          aria-disabled={disabled || undefined}\n          role={role}\n          tabIndex={-1}\n          data-testid={dataTestId}\n          {...rest}\n        >\n          {enrichedChildren}\n        </Element>\n      </BaseListProvider>\n    );\n  }\n);\n\nexport default BaseList;\n"],"names":["BaseList","forwardRef","_a","ref","className","id","_a$as","as","children","ariaLabel","ariaDescribedBy","ariaControls","_a$role","role","_a$size","size","maxHeight","_a$focusOnMount","focusOnMount","_a$defaultFocusIndex","defaultFocusIndex","onFocusChange","style","_a$disabled","disabled","dataTestId","rest","__rest","componentRef","useRef","mergedRef","useMergeRef","Element","_useBaseListFocus","useBaseListFocus","listId","focusIndex","activeDescendantId","updateFocusedItem","registerItem","childrenRefs","useBaseListKeyboard","useIsomorphicLayoutEffect","current","requestAnimationFrame","focus","enrichedChildren","useMemo","childArray","React","Children","toArray","slice","length","map","child","index","isValidElement","childId","getItemId","props","currentRef","isFocusableItem","isListItem","childRole","type","undefined","getChildRole","itemContextValue","highlighted","tabIndex","component","getItemComponentType","refCallback","itemRef","createElement","BaseListItemProvider","key","value","contextValue","activeItemIndex","listStyle","Object","concat","BaseListProvider","assign","cx","styles","baseList"],"mappings":"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"}
+{"version":3,"file":"BaseList.js","sources":["../../../../../src/components/BaseList/BaseList.tsx"],"sourcesContent":["import React, { forwardRef, type ReactElement, useMemo, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { useMergeRef, useIsomorphicLayoutEffect } from \"@vibe/shared\";\n\nimport { type BaseListProps } from \"./BaseList.types\";\nimport {\n  BaseListProvider,\n  BaseListItemProvider,\n  type BaseListContextProps,\n  type BaseListItemContextProps\n} from \"./context/BaseListContext\";\nimport { useBaseListFocus } from \"./hooks/useBaseListFocus\";\nimport { useBaseListKeyboard } from \"./hooks/useBaseListKeyboard\";\nimport { getChildRole, getItemComponentType, getItemId, isListItem } from \"./utils/baseListUtils\";\nimport styles from \"./BaseList.module.scss\";\n\nconst BaseList = forwardRef(\n  (\n    {\n      className,\n      id,\n      as = \"ul\",\n      children,\n      \"aria-label\": ariaLabel,\n      \"aria-describedby\": ariaDescribedBy,\n      \"aria-controls\": ariaControls,\n      role = \"listbox\",\n      size = \"medium\",\n      maxHeight,\n      focusOnMount = false,\n      defaultFocusIndex = 0,\n      onFocusChange,\n      style,\n      disabled = false,\n      \"data-testid\": dataTestId,\n      ...rest\n    }: BaseListProps,\n    ref: React.ForwardedRef<HTMLElement>\n  ) => {\n    const componentRef = useRef<HTMLElement>(null);\n    const mergedRef = useMergeRef(ref, componentRef);\n\n    const Element = as as React.ElementType;\n\n    const { focusIndex, activeDescendantId, updateFocusedItem, registerItem, childrenRefs } = useBaseListFocus({\n      defaultFocusIndex,\n      onFocusChange,\n      listId: id,\n      disabled\n    });\n\n    useBaseListKeyboard({\n      focusIndex,\n      childrenRefs,\n      listId: id,\n      updateFocusedItem,\n      componentRef,\n      disabled\n    });\n\n    useIsomorphicLayoutEffect(() => {\n      if (focusOnMount && componentRef.current) {\n        requestAnimationFrame(() => {\n          componentRef.current?.focus();\n        });\n      }\n    }, [focusOnMount]);\n\n    const enrichedChildren = useMemo(() => {\n      const childArray = React.Children.toArray(children) as ReactElement[];\n      childrenRefs.current = childrenRefs.current.slice(0, childArray.length);\n\n      return childArray.map((child, index) => {\n        if (!React.isValidElement(child)) {\n          return child;\n        }\n\n        const childId = getItemId(id, index, (child.props as { id?: string }).id);\n        const currentRef = childrenRefs.current[index];\n        const isFocusableItem = currentRef === undefined || currentRef === null || isListItem(currentRef);\n        const isDOMElement = typeof child.type === \"string\";\n\n        const existingRole = (child.props as { role?: string }).role;\n        const childRole = existingRole || (!isDOMElement ? getChildRole(role) : undefined);\n\n        const refCallback = (itemRef: HTMLElement | null) => {\n          childrenRefs.current[index] = itemRef;\n        };\n\n        const itemContextValue: BaseListItemContextProps = {\n          index,\n          id: childId,\n          highlighted: focusIndex === index && isFocusableItem,\n          tabIndex: focusIndex === index && isFocusableItem ? 0 : -1,\n          component: getItemComponentType(as),\n          size,\n          role: childRole,\n          refCallback\n        };\n\n        return (\n          <BaseListItemProvider key={childId} value={itemContextValue}>\n            {child}\n          </BaseListItemProvider>\n        );\n      });\n    }, [children, as, focusIndex, id, role, size, childrenRefs]);\n\n    const contextValue: BaseListContextProps = useMemo(\n      () => ({\n        activeItemIndex: focusIndex,\n        updateFocusedItem,\n        registerItem,\n        size\n      }),\n      [focusIndex, updateFocusedItem, registerItem, size]\n    );\n\n    const listStyle = useMemo(\n      () =>\n        maxHeight\n          ? ({\n              ...style,\n              \"--baselist-max-height\": typeof maxHeight === \"number\" ? `${maxHeight}px` : maxHeight\n            } as React.CSSProperties)\n          : style,\n      [maxHeight, style]\n    );\n\n    return (\n      <BaseListProvider value={contextValue}>\n        <Element\n          ref={mergedRef}\n          id={id}\n          className={cx(styles.baseList, className)}\n          style={listStyle}\n          aria-label={ariaLabel}\n          aria-describedby={ariaDescribedBy}\n          aria-controls={ariaControls}\n          aria-activedescendant={activeDescendantId}\n          aria-disabled={disabled || undefined}\n          role={role}\n          tabIndex={-1}\n          data-testid={dataTestId}\n          {...rest}\n        >\n          {enrichedChildren}\n        </Element>\n      </BaseListProvider>\n    );\n  }\n);\n\nexport default BaseList;\n"],"names":["BaseList","forwardRef","_a","ref","className","id","_a$as","as","children","ariaLabel","ariaDescribedBy","ariaControls","_a$role","role","_a$size","size","maxHeight","_a$focusOnMount","focusOnMount","_a$defaultFocusIndex","defaultFocusIndex","onFocusChange","style","_a$disabled","disabled","dataTestId","rest","__rest","componentRef","useRef","mergedRef","useMergeRef","Element","_useBaseListFocus","useBaseListFocus","listId","focusIndex","activeDescendantId","updateFocusedItem","registerItem","childrenRefs","useBaseListKeyboard","useIsomorphicLayoutEffect","current","requestAnimationFrame","focus","enrichedChildren","useMemo","childArray","React","Children","toArray","slice","length","map","child","index","isValidElement","childId","getItemId","props","currentRef","isFocusableItem","isListItem","childRole","type","undefined","getChildRole","itemContextValue","highlighted","tabIndex","component","getItemComponentType","refCallback","itemRef","createElement","BaseListItemProvider","key","value","contextValue","activeItemIndex","listStyle","Object","concat","BaseListProvider","assign","cx","styles","baseList"],"mappings":"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"}

package/dist/mocked_classnames/src/components/BaseList/context/BaseListContext.js

@@ -1,2 +1,2 @@
-import e,{useContext as r,createContext as t}from"react";import{NOOP as n}from"../../../utils/function-utils.js";var i=t({activeItemIndex:-1,updateFocusedItem:n,registerItem:n,size:"medium"}),u=t(void 0),o=function(r){return e.createElement(i.Provider,{value:r.value},r.children)},c=function(r){return e.createElement(u.Provider,{value:r.value},r.children)},m=function(){return r(i)},a=function(){return r(u)};export{c as BaseListItemProvider,o as BaseListProvider,m as useBaseList,a as useBaseListItem};
+import e,{useContext as r,createContext as t}from"react";import{NOOP as n}from"@vibe/shared";var i=t({activeItemIndex:-1,updateFocusedItem:n,registerItem:n,size:"medium"}),u=t(void 0),o=function(r){return e.createElement(i.Provider,{value:r.value},r.children)},a=function(r){return e.createElement(u.Provider,{value:r.value},r.children)},c=function(){return r(i)},m=function(){return r(u)};export{a as BaseListItemProvider,o as BaseListProvider,c as useBaseList,m as useBaseListItem};
 //# sourceMappingURL=BaseListContext.js.map

package/dist/mocked_classnames/src/components/BaseList/context/BaseListContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseListContext.js","sources":["../../../../../../src/components/BaseList/context/BaseListContext.tsx"],"sourcesContent":["import React, { createContext, useContext, type ReactNode, type AriaRole } from \"react\";\nimport { NOOP } from \"../../../utils/function-utils\";\nimport { type BaseListSizes } from \"../BaseList.types\";\n\nexport interface BaseListItemContextProps {\n  /**\n   * The index of this item in the list.\n   */\n  index: number;\n  /**\n   * The derived ID for this item.\n   */\n  id: string;\n  /**\n   * Whether this item is currently highlighted (has keyboard focus).\n   */\n  highlighted: boolean;\n  /**\n   * The tabIndex for this item (0 if highlighted, -1 otherwise).\n   */\n  tabIndex: number;\n  /**\n   * The HTML element to render as.\n   */\n  component: string;\n  /**\n   * The size of the item.\n   */\n  size: BaseListSizes;\n  /**\n   * The ARIA role for this item.\n   */\n  role: AriaRole | undefined;\n  /**\n   * Callback ref to register the item's DOM element.\n   */\n  refCallback: (element: HTMLElement | null) => void;\n}\n\nexport interface BaseListContextProps {\n  /**\n   * The index of the currently focused/active item.\n   */\n  activeItemIndex: number;\n  /**\n   * Callback to update the focused item by id and index.\n   */\n  updateFocusedItem: (id: string, index: number) => void;\n  /**\n   * Register an item ref for keyboard navigation.\n   */\n  registerItem: (ref: HTMLElement | null, index: number) => void;\n  /**\n   * The size of items in the list.\n   */\n  size?: BaseListSizes;\n}\n\nexport interface BaseListProviderProps {\n  value: BaseListContextProps;\n  children: ReactNode;\n}\n\nexport interface BaseListItemProviderProps {\n  value: BaseListItemContextProps;\n  children: ReactNode;\n}\n\nconst defaultListContextValue: BaseListContextProps = {\n  activeItemIndex: -1,\n  updateFocusedItem: NOOP,\n  registerItem: NOOP,\n  size: \"medium\"\n};\n\nconst BaseListContext = createContext<BaseListContextProps>(defaultListContextValue);\nconst BaseListItemContext = createContext<BaseListItemContextProps | undefined>(undefined);\n\nexport const BaseListProvider = ({ value, children }: BaseListProviderProps) => {\n  return <BaseListContext.Provider value={value}>{children}</BaseListContext.Provider>;\n};\n\nexport const BaseListItemProvider = ({ value, children }: BaseListItemProviderProps) => {\n  return <BaseListItemContext.Provider value={value}>{children}</BaseListItemContext.Provider>;\n};\n\nexport const useBaseList = (): BaseListContextProps => {\n  return useContext(BaseListContext);\n};\n\nexport const useBaseListItem = (): BaseListItemContextProps | undefined => {\n  return useContext(BaseListItemContext);\n};\n"],"names":["BaseListContext","createContext","activeItemIndex","updateFocusedItem","NOOP","registerItem","size","BaseListItemContext","undefined","BaseListProvider","_ref","React","createElement","Provider","value","children","BaseListItemProvider","_ref2","useBaseList","useContext","useBaseListItem"],"mappings":"iHAoEA,IAOMA,EAAkBC,EAP8B,CACpDC,iBAAkB,EAClBC,kBAAmBC,EACnBC,aAAcD,EACdE,KAAM,WAIFC,EAAsBN,OAAoDO,GAEnEC,EAAmB,SAAHC,GAC3B,OAAOC,EAAAC,cAACZ,EAAgBa,SAAQ,CAACC,MADKJ,EAALI,OAAeJ,EAARK,SAE1C,EAEaC,EAAuB,SAAHC,GAC/B,OAAON,EAAAC,cAACL,EAAoBM,SAAQ,CAACC,MADKG,EAALH,OAAeG,EAARF,SAE9C,EAEaG,EAAc,WACzB,OAAOC,EAAWnB,EACpB,EAEaoB,EAAkB,WAC7B,OAAOD,EAAWZ,EACpB"}
+{"version":3,"file":"BaseListContext.js","sources":["../../../../../../src/components/BaseList/context/BaseListContext.tsx"],"sourcesContent":["import React, { createContext, useContext, type ReactNode, type AriaRole } from \"react\";\nimport { NOOP } from \"@vibe/shared\";\nimport { type BaseListSizes } from \"../BaseList.types\";\n\nexport interface BaseListItemContextProps {\n  /**\n   * The index of this item in the list.\n   */\n  index: number;\n  /**\n   * The derived ID for this item.\n   */\n  id: string;\n  /**\n   * Whether this item is currently highlighted (has keyboard focus).\n   */\n  highlighted: boolean;\n  /**\n   * The tabIndex for this item (0 if highlighted, -1 otherwise).\n   */\n  tabIndex: number;\n  /**\n   * The HTML element to render as.\n   */\n  component: string;\n  /**\n   * The size of the item.\n   */\n  size: BaseListSizes;\n  /**\n   * The ARIA role for this item.\n   */\n  role: AriaRole | undefined;\n  /**\n   * Callback ref to register the item's DOM element.\n   */\n  refCallback: (element: HTMLElement | null) => void;\n}\n\nexport interface BaseListContextProps {\n  /**\n   * The index of the currently focused/active item.\n   */\n  activeItemIndex: number;\n  /**\n   * Callback to update the focused item by id and index.\n   */\n  updateFocusedItem: (id: string, index: number) => void;\n  /**\n   * Register an item ref for keyboard navigation.\n   */\n  registerItem: (ref: HTMLElement | null, index: number) => void;\n  /**\n   * The size of items in the list.\n   */\n  size?: BaseListSizes;\n}\n\nexport interface BaseListProviderProps {\n  value: BaseListContextProps;\n  children: ReactNode;\n}\n\nexport interface BaseListItemProviderProps {\n  value: BaseListItemContextProps;\n  children: ReactNode;\n}\n\nconst defaultListContextValue: BaseListContextProps = {\n  activeItemIndex: -1,\n  updateFocusedItem: NOOP,\n  registerItem: NOOP,\n  size: \"medium\"\n};\n\nconst BaseListContext = createContext<BaseListContextProps>(defaultListContextValue);\nconst BaseListItemContext = createContext<BaseListItemContextProps | undefined>(undefined);\n\nexport const BaseListProvider = ({ value, children }: BaseListProviderProps) => {\n  return <BaseListContext.Provider value={value}>{children}</BaseListContext.Provider>;\n};\n\nexport const BaseListItemProvider = ({ value, children }: BaseListItemProviderProps) => {\n  return <BaseListItemContext.Provider value={value}>{children}</BaseListItemContext.Provider>;\n};\n\nexport const useBaseList = (): BaseListContextProps => {\n  return useContext(BaseListContext);\n};\n\nexport const useBaseListItem = (): BaseListItemContextProps | undefined => {\n  return useContext(BaseListItemContext);\n};\n"],"names":["BaseListContext","createContext","activeItemIndex","updateFocusedItem","NOOP","registerItem","size","BaseListItemContext","undefined","BaseListProvider","_ref","React","createElement","Provider","value","children","BaseListItemProvider","_ref2","useBaseList","useContext","useBaseListItem"],"mappings":"6FAoEA,IAOMA,EAAkBC,EAP8B,CACpDC,iBAAkB,EAClBC,kBAAmBC,EACnBC,aAAcD,EACdE,KAAM,WAIFC,EAAsBN,OAAoDO,GAEnEC,EAAmB,SAAHC,GAC3B,OAAOC,EAAAC,cAACZ,EAAgBa,SAAQ,CAACC,MADKJ,EAALI,OAAeJ,EAARK,SAE1C,EAEaC,EAAuB,SAAHC,GAC/B,OAAON,EAAAC,cAACL,EAAoBM,SAAQ,CAACC,MADKG,EAALH,OAAeG,EAARF,SAE9C,EAEaG,EAAc,WACzB,OAAOC,EAAWnB,EACpB,EAEaoB,EAAkB,WAC7B,OAAOD,EAAWZ,EACpB"}

package/dist/mocked_classnames/src/components/BaseList/hooks/useBaseListKeyboard.js

@@ -1,2 +1,2 @@
-import{useCallback as e}from"react";import r from"../../../hooks/useKeyEvent/index.js";import{keyCodes as t}from"../../../constants/keyCodes.js";import{findLastFocusableIndex as a,findFirstFocusableIndex as n,findAdjacentFocusableIndex as o,getItemId as i,isFocusableListItem as f}from"../utils/baseListUtils.js";var s=[t.UP_ARROW,t.DOWN_ARROW,t.HOME,t.END,t.PAGE_UP,t.PAGE_DOWN],u=function(u){var v=u.focusIndex,c=u.childrenRefs,d=u.listId,l=u.updateFocusedItem,p=u.componentRef,m=u.disabled,D=e((function(e){if(!m){var r,s=c.current;switch(e.key){case t.UP_ARROW:e.preventDefault(),r=o(s,v,"prev");break;case t.DOWN_ARROW:e.preventDefault(),r=o(s,v,"next");break;case t.HOME:e.preventDefault(),-1===(r=n(s))&&(r=void 0);break;case t.END:e.preventDefault(),-1===(r=a(s))&&(r=void 0);break;case t.PAGE_UP:e.preventDefault(),r=function(e,r){for(var t=Math.max(0,r-10);r>t;t++)if(f(e[t]))return t;var a=n(e);return-1!==a?a:void 0}(s,v);break;case t.PAGE_DOWN:e.preventDefault(),r=function(e,r){for(var t=Math.min(e.length-1,r+10);t>r;t--)if(f(e[t]))return t;var n=a(e);return-1!==n?n:void 0}(s,v);break;default:return}if(void 0!==r){var u=s[r];if(u){var p=i(d,r,u.id);l(p,r),u.focus()}}}}),[v,c,d,l,m]);r({keys:s,callback:D,ref:p})};export{u as useBaseListKeyboard};
+import{useCallback as e}from"react";import{useKeyEvent as r}from"@vibe/shared";import{keyCodes as t}from"../../../constants/keyCodes.js";import{findLastFocusableIndex as a,findFirstFocusableIndex as n,findAdjacentFocusableIndex as i,getItemId as f,isFocusableListItem as o}from"../utils/baseListUtils.js";var s=[t.UP_ARROW,t.DOWN_ARROW,t.HOME,t.END,t.PAGE_UP,t.PAGE_DOWN],u=function(u){var v=u.focusIndex,c=u.childrenRefs,d=u.listId,l=u.updateFocusedItem,p=u.componentRef,m=u.disabled,D=e((function(e){if(!m){var r,s=c.current;switch(e.key){case t.UP_ARROW:e.preventDefault(),r=i(s,v,"prev");break;case t.DOWN_ARROW:e.preventDefault(),r=i(s,v,"next");break;case t.HOME:e.preventDefault(),-1===(r=n(s))&&(r=void 0);break;case t.END:e.preventDefault(),-1===(r=a(s))&&(r=void 0);break;case t.PAGE_UP:e.preventDefault(),r=function(e,r){for(var t=Math.max(0,r-10);r>t;t++)if(o(e[t]))return t;var a=n(e);return-1!==a?a:void 0}(s,v);break;case t.PAGE_DOWN:e.preventDefault(),r=function(e,r){for(var t=Math.min(e.length-1,r+10);t>r;t--)if(o(e[t]))return t;var n=a(e);return-1!==n?n:void 0}(s,v);break;default:return}if(void 0!==r){var u=s[r];if(u){var p=f(d,r,u.id);l(p,r),u.focus()}}}}),[v,c,d,l,m]);r({keys:s,callback:D,ref:p})};export{u as useBaseListKeyboard};
 //# sourceMappingURL=useBaseListKeyboard.js.map

package/dist/mocked_classnames/src/components/BaseList/hooks/useBaseListKeyboard.js.map

@@ -1 +1 @@
-{"version":3,"file":"useBaseListKeyboard.js","sources":["../../../../../../src/components/BaseList/hooks/useBaseListKeyboard.ts"],"sourcesContent":["import { useCallback } from \"react\";\nimport useKeyEvent from \"../../../hooks/useKeyEvent\";\nimport { keyCodes } from \"../../../constants/keyCodes\";\nimport {\n  findAdjacentFocusableIndex,\n  findFirstFocusableIndex,\n  findLastFocusableIndex,\n  getItemId,\n  isFocusableListItem\n} from \"../utils/baseListUtils\";\n\nexport interface UseBaseListKeyboardProps {\n  /**\n   * The index of the currently focused item.\n   */\n  focusIndex: number;\n  /**\n   * Ref array containing all item DOM elements.\n   */\n  childrenRefs: React.MutableRefObject<(HTMLElement | null)[]>;\n  /**\n   * The unique identifier for the list.\n   */\n  listId: string | undefined;\n  /**\n   * Callback to update the focused item.\n   */\n  updateFocusedItem: (itemId: string, index: number) => void;\n  /**\n   * Ref to the list container element.\n   */\n  componentRef: React.RefObject<HTMLElement>;\n  /**\n   * If true, disables keyboard navigation.\n   */\n  disabled: boolean;\n}\n\nconst NAVIGATION_KEYS: string[] = [\n  keyCodes.UP_ARROW,\n  keyCodes.DOWN_ARROW,\n  keyCodes.HOME,\n  keyCodes.END,\n  keyCodes.PAGE_UP,\n  keyCodes.PAGE_DOWN\n];\n\nconst PAGE_JUMP_SIZE = 10;\n\nconst findPageUpIndex = (refs: (HTMLElement | null)[], currentIndex: number): number | undefined => {\n  const targetIndex = Math.max(0, currentIndex - PAGE_JUMP_SIZE);\n\n  for (let i = targetIndex; i < currentIndex; i++) {\n    if (isFocusableListItem(refs[i])) {\n      return i;\n    }\n  }\n\n  const firstFocusableIndex = findFirstFocusableIndex(refs);\n  return firstFocusableIndex !== -1 ? firstFocusableIndex : undefined;\n};\n\nconst findPageDownIndex = (refs: (HTMLElement | null)[], currentIndex: number): number | undefined => {\n  const targetIndex = Math.min(refs.length - 1, currentIndex + PAGE_JUMP_SIZE);\n\n  for (let i = targetIndex; i > currentIndex; i--) {\n    if (isFocusableListItem(refs[i])) {\n      return i;\n    }\n  }\n\n  const lastFocusableIndex = findLastFocusableIndex(refs);\n  return lastFocusableIndex !== -1 ? lastFocusableIndex : undefined;\n};\n\nexport const useBaseListKeyboard = ({\n  focusIndex,\n  childrenRefs,\n  listId,\n  updateFocusedItem,\n  componentRef,\n  disabled\n}: UseBaseListKeyboardProps): void => {\n  const onKeyDown = useCallback(\n    (event: KeyboardEvent) => {\n      if (disabled) return;\n\n      const { key } = event;\n      const refs = childrenRefs.current;\n      let newFocusIndex: number | undefined;\n\n      switch (key) {\n        case keyCodes.UP_ARROW:\n          event.preventDefault();\n          newFocusIndex = findAdjacentFocusableIndex(refs, focusIndex, \"prev\");\n          break;\n\n        case keyCodes.DOWN_ARROW:\n          event.preventDefault();\n          newFocusIndex = findAdjacentFocusableIndex(refs, focusIndex, \"next\");\n          break;\n\n        case keyCodes.HOME:\n          event.preventDefault();\n          newFocusIndex = findFirstFocusableIndex(refs);\n          if (newFocusIndex === -1) newFocusIndex = undefined;\n          break;\n\n        case keyCodes.END:\n          event.preventDefault();\n          newFocusIndex = findLastFocusableIndex(refs);\n          if (newFocusIndex === -1) newFocusIndex = undefined;\n          break;\n\n        case keyCodes.PAGE_UP:\n          event.preventDefault();\n          newFocusIndex = findPageUpIndex(refs, focusIndex);\n          break;\n\n        case keyCodes.PAGE_DOWN:\n          event.preventDefault();\n          newFocusIndex = findPageDownIndex(refs, focusIndex);\n          break;\n\n        default:\n          return;\n      }\n\n      if (newFocusIndex !== undefined) {\n        const element = refs[newFocusIndex];\n        if (element) {\n          const itemId = getItemId(listId, newFocusIndex, element.id);\n          updateFocusedItem(itemId, newFocusIndex);\n          element.focus();\n        }\n      }\n    },\n    [focusIndex, childrenRefs, listId, updateFocusedItem, disabled]\n  );\n\n  useKeyEvent({\n    keys: NAVIGATION_KEYS,\n    callback: onKeyDown,\n    ref: componentRef\n  });\n};\n"],"names":["NAVIGATION_KEYS","keyCodes","UP_ARROW","DOWN_ARROW","HOME","END","PAGE_UP","PAGE_DOWN","useBaseListKeyboard","_ref","focusIndex","childrenRefs","listId","updateFocusedItem","componentRef","disabled","onKeyDown","useCallback","event","newFocusIndex","refs","current","key","preventDefault","findAdjacentFocusableIndex","findFirstFocusableIndex","undefined","findLastFocusableIndex","currentIndex","i","Math","max","isFocusableListItem","firstFocusableIndex","findPageUpIndex","min","length","lastFocusableIndex","findPageDownIndex","element","itemId","getItemId","id","focus","useKeyEvent","keys","callback","ref"],"mappings":"yTAsCA,IAAMA,EAA4B,CAChCC,EAASC,SACTD,EAASE,WACTF,EAASG,KACTH,EAASI,IACTJ,EAASK,QACTL,EAASM,WA+BEC,EAAsB,SAAHC,GAOK,IANnCC,EAAUD,EAAVC,WACAC,EAAYF,EAAZE,aACAC,EAAMH,EAANG,OACAC,EAAiBJ,EAAjBI,kBACAC,EAAYL,EAAZK,aACAC,EAAQN,EAARM,SAEMC,EAAYC,GAChB,SAACC,GACC,IAAIH,EAAJ,CAEA,IAEII,EADEC,EAAOT,EAAaU,QAG1B,OAJgBH,EAARI,KAKN,KAAKrB,EAASC,SACZgB,EAAMK,iBACNJ,EAAgBK,EAA2BJ,EAAMV,EAAY,QAC7D,MAEF,KAAKT,EAASE,WACZe,EAAMK,iBACNJ,EAAgBK,EAA2BJ,EAAMV,EAAY,QAC7D,MAEF,KAAKT,EAASG,KACZc,EAAMK,kBAEiB,KADvBJ,EAAgBM,EAAwBL,MACdD,OAAgBO,GAC1C,MAEF,KAAKzB,EAASI,IACZa,EAAMK,kBAEiB,KADvBJ,EAAgBQ,EAAuBP,MACbD,OAAgBO,GAC1C,MAEF,KAAKzB,EAASK,QACZY,EAAMK,iBACNJ,EAnEc,SAACC,EAA8BQ,GAGrD,IAFA,IAESC,EAFWC,KAAKC,IAAI,EAAGH,EAHX,IAKSA,EAAJC,EAAkBA,IAC1C,GAAIG,EAAoBZ,EAAKS,IAC3B,OAAOA,EAIX,IAAMI,EAAsBR,EAAwBL,GACpD,OAAgC,IAAzBa,EAA6BA,OAAsBP,CAC5D,CAwD0BQ,CAAgBd,EAAMV,GACtC,MAEF,KAAKT,EAASM,UACZW,EAAMK,iBACNJ,EA3DgB,SAACC,EAA8BQ,GAGvD,IAFA,IAESC,EAFWC,KAAKK,IAAIf,EAAKgB,OAAS,EAAGR,EAhBzB,IAkBKC,EAAID,EAAcC,IAC1C,GAAIG,EAAoBZ,EAAKS,IAC3B,OAAOA,EAIX,IAAMQ,EAAqBV,EAAuBP,GAClD,OAA+B,IAAxBiB,EAA4BA,OAAqBX,CAC1D,CAgD0BY,CAAkBlB,EAAMV,GACxC,MAEF,QACE,OAGJ,QAAsBgB,IAAlBP,EAA6B,CAC/B,IAAMoB,EAAUnB,EAAKD,GACrB,GAAIoB,EAAS,CACX,IAAMC,EAASC,EAAU7B,EAAQO,EAAeoB,EAAQG,IACxD7B,EAAkB2B,EAAQrB,GAC1BoB,EAAQI,OACV,CACF,CAlDc,CAmDhB,GACA,CAACjC,EAAYC,EAAcC,EAAQC,EAAmBE,IAGxD6B,EAAY,CACVC,KAAM7C,EACN8C,SAAU9B,EACV+B,IAAKjC,GAET"}
+{"version":3,"file":"useBaseListKeyboard.js","sources":["../../../../../../src/components/BaseList/hooks/useBaseListKeyboard.ts"],"sourcesContent":["import { useCallback } from \"react\";\nimport useKeyEvent from \"../../../hooks/useKeyEvent\";\nimport { keyCodes } from \"../../../constants/keyCodes\";\nimport {\n  findAdjacentFocusableIndex,\n  findFirstFocusableIndex,\n  findLastFocusableIndex,\n  getItemId,\n  isFocusableListItem\n} from \"../utils/baseListUtils\";\n\nexport interface UseBaseListKeyboardProps {\n  /**\n   * The index of the currently focused item.\n   */\n  focusIndex: number;\n  /**\n   * Ref array containing all item DOM elements.\n   */\n  childrenRefs: React.MutableRefObject<(HTMLElement | null)[]>;\n  /**\n   * The unique identifier for the list.\n   */\n  listId: string | undefined;\n  /**\n   * Callback to update the focused item.\n   */\n  updateFocusedItem: (itemId: string, index: number) => void;\n  /**\n   * Ref to the list container element.\n   */\n  componentRef: React.RefObject<HTMLElement>;\n  /**\n   * If true, disables keyboard navigation.\n   */\n  disabled: boolean;\n}\n\nconst NAVIGATION_KEYS: string[] = [\n  keyCodes.UP_ARROW,\n  keyCodes.DOWN_ARROW,\n  keyCodes.HOME,\n  keyCodes.END,\n  keyCodes.PAGE_UP,\n  keyCodes.PAGE_DOWN\n];\n\nconst PAGE_JUMP_SIZE = 10;\n\nconst findPageUpIndex = (refs: (HTMLElement | null)[], currentIndex: number): number | undefined => {\n  const targetIndex = Math.max(0, currentIndex - PAGE_JUMP_SIZE);\n\n  for (let i = targetIndex; i < currentIndex; i++) {\n    if (isFocusableListItem(refs[i])) {\n      return i;\n    }\n  }\n\n  const firstFocusableIndex = findFirstFocusableIndex(refs);\n  return firstFocusableIndex !== -1 ? firstFocusableIndex : undefined;\n};\n\nconst findPageDownIndex = (refs: (HTMLElement | null)[], currentIndex: number): number | undefined => {\n  const targetIndex = Math.min(refs.length - 1, currentIndex + PAGE_JUMP_SIZE);\n\n  for (let i = targetIndex; i > currentIndex; i--) {\n    if (isFocusableListItem(refs[i])) {\n      return i;\n    }\n  }\n\n  const lastFocusableIndex = findLastFocusableIndex(refs);\n  return lastFocusableIndex !== -1 ? lastFocusableIndex : undefined;\n};\n\nexport const useBaseListKeyboard = ({\n  focusIndex,\n  childrenRefs,\n  listId,\n  updateFocusedItem,\n  componentRef,\n  disabled\n}: UseBaseListKeyboardProps): void => {\n  const onKeyDown = useCallback(\n    (event: KeyboardEvent) => {\n      if (disabled) return;\n\n      const { key } = event;\n      const refs = childrenRefs.current;\n      let newFocusIndex: number | undefined;\n\n      switch (key) {\n        case keyCodes.UP_ARROW:\n          event.preventDefault();\n          newFocusIndex = findAdjacentFocusableIndex(refs, focusIndex, \"prev\");\n          break;\n\n        case keyCodes.DOWN_ARROW:\n          event.preventDefault();\n          newFocusIndex = findAdjacentFocusableIndex(refs, focusIndex, \"next\");\n          break;\n\n        case keyCodes.HOME:\n          event.preventDefault();\n          newFocusIndex = findFirstFocusableIndex(refs);\n          if (newFocusIndex === -1) newFocusIndex = undefined;\n          break;\n\n        case keyCodes.END:\n          event.preventDefault();\n          newFocusIndex = findLastFocusableIndex(refs);\n          if (newFocusIndex === -1) newFocusIndex = undefined;\n          break;\n\n        case keyCodes.PAGE_UP:\n          event.preventDefault();\n          newFocusIndex = findPageUpIndex(refs, focusIndex);\n          break;\n\n        case keyCodes.PAGE_DOWN:\n          event.preventDefault();\n          newFocusIndex = findPageDownIndex(refs, focusIndex);\n          break;\n\n        default:\n          return;\n      }\n\n      if (newFocusIndex !== undefined) {\n        const element = refs[newFocusIndex];\n        if (element) {\n          const itemId = getItemId(listId, newFocusIndex, element.id);\n          updateFocusedItem(itemId, newFocusIndex);\n          element.focus();\n        }\n      }\n    },\n    [focusIndex, childrenRefs, listId, updateFocusedItem, disabled]\n  );\n\n  useKeyEvent({\n    keys: NAVIGATION_KEYS,\n    callback: onKeyDown,\n    ref: componentRef\n  });\n};\n"],"names":["NAVIGATION_KEYS","keyCodes","UP_ARROW","DOWN_ARROW","HOME","END","PAGE_UP","PAGE_DOWN","useBaseListKeyboard","_ref","focusIndex","childrenRefs","listId","updateFocusedItem","componentRef","disabled","onKeyDown","useCallback","event","newFocusIndex","refs","current","key","preventDefault","findAdjacentFocusableIndex","findFirstFocusableIndex","undefined","findLastFocusableIndex","currentIndex","i","Math","max","isFocusableListItem","firstFocusableIndex","findPageUpIndex","min","length","lastFocusableIndex","findPageDownIndex","element","itemId","getItemId","id","focus","useKeyEvent","keys","callback","ref"],"mappings":"iTAsCA,IAAMA,EAA4B,CAChCC,EAASC,SACTD,EAASE,WACTF,EAASG,KACTH,EAASI,IACTJ,EAASK,QACTL,EAASM,WA+BEC,EAAsB,SAAHC,GAOK,IANnCC,EAAUD,EAAVC,WACAC,EAAYF,EAAZE,aACAC,EAAMH,EAANG,OACAC,EAAiBJ,EAAjBI,kBACAC,EAAYL,EAAZK,aACAC,EAAQN,EAARM,SAEMC,EAAYC,GAChB,SAACC,GACC,IAAIH,EAAJ,CAEA,IAEII,EADEC,EAAOT,EAAaU,QAG1B,OAJgBH,EAARI,KAKN,KAAKrB,EAASC,SACZgB,EAAMK,iBACNJ,EAAgBK,EAA2BJ,EAAMV,EAAY,QAC7D,MAEF,KAAKT,EAASE,WACZe,EAAMK,iBACNJ,EAAgBK,EAA2BJ,EAAMV,EAAY,QAC7D,MAEF,KAAKT,EAASG,KACZc,EAAMK,kBAEiB,KADvBJ,EAAgBM,EAAwBL,MACdD,OAAgBO,GAC1C,MAEF,KAAKzB,EAASI,IACZa,EAAMK,kBAEiB,KADvBJ,EAAgBQ,EAAuBP,MACbD,OAAgBO,GAC1C,MAEF,KAAKzB,EAASK,QACZY,EAAMK,iBACNJ,EAnEc,SAACC,EAA8BQ,GAGrD,IAFA,IAESC,EAFWC,KAAKC,IAAI,EAAGH,EAHX,IAKSA,EAAJC,EAAkBA,IAC1C,GAAIG,EAAoBZ,EAAKS,IAC3B,OAAOA,EAIX,IAAMI,EAAsBR,EAAwBL,GACpD,OAAgC,IAAzBa,EAA6BA,OAAsBP,CAC5D,CAwD0BQ,CAAgBd,EAAMV,GACtC,MAEF,KAAKT,EAASM,UACZW,EAAMK,iBACNJ,EA3DgB,SAACC,EAA8BQ,GAGvD,IAFA,IAESC,EAFWC,KAAKK,IAAIf,EAAKgB,OAAS,EAAGR,EAhBzB,IAkBKC,EAAID,EAAcC,IAC1C,GAAIG,EAAoBZ,EAAKS,IAC3B,OAAOA,EAIX,IAAMQ,EAAqBV,EAAuBP,GAClD,OAA+B,IAAxBiB,EAA4BA,OAAqBX,CAC1D,CAgD0BY,CAAkBlB,EAAMV,GACxC,MAEF,QACE,OAGJ,QAAsBgB,IAAlBP,EAA6B,CAC/B,IAAMoB,EAAUnB,EAAKD,GACrB,GAAIoB,EAAS,CACX,IAAMC,EAASC,EAAU7B,EAAQO,EAAeoB,EAAQG,IACxD7B,EAAkB2B,EAAQrB,GAC1BoB,EAAQI,OACV,CACF,CAlDc,CAmDhB,GACA,CAACjC,EAAYC,EAAcC,EAAQC,EAAmBE,IAGxD6B,EAAY,CACVC,KAAM7C,EACN8C,SAAU9B,EACV+B,IAAKjC,GAET"}

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

@@ -1,2 +1,2 @@
-import{slicedToArray as t,defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import o,{forwardRef as i,useRef as r,useState as l,useCallback as a,useMemo as n,useEffect as s}from"react";import{camelCase as d}from"es-toolkit";import u from"classnames";import{getStyle as p}from"../../helpers/typesciptCssModulesHelper.js";import c from"../../hooks/usePrevious/index.js";import m from"../../hooks/useMergeRef.js";import{ButtonWrapper as f}from"./ButtonWrapper.js";import{getTestId as v}from"../../tests/testIds.js";import{ComponentDefaultTestId as b,ComponentVibeId as h}from"../../tests/constants.js";import y from"./ButtonGroup.module.scss.js";var B=i((function(i,B){var C=i.className,k=i.options,T=i.name,g=void 0===T?"":T,j=i.disabled,N=void 0!==j&&j,x=i.value,P=void 0===x?"":x,M=i.onSelect,O=i.size,U=void 0===O?"small":O,D=i.kind,S=void 0===D?"secondary":D,W=i.groupAriaLabel,E=void 0===W?"":W,G=i.tooltipPosition,H=i.tooltipHideDelay,I=i.tooltipShowDelay,_=i.tooltipContainerSelector,A=i.tooltipMoveBy,R=i.blurOnMouseUp,w=void 0===R||R,z=i.id,F=i["data-testid"],L=i.fullWidth,q=void 0!==L&&L,J=r(),K=m(B,J),Q=l(P),V=t(Q,2),X=V[0],Y=V[1],Z=c(P),$=a((function(t){N||t.disabled||(Y(t.value),M&&M(t.value,g))}),[M,N,g]),tt=function(t){return(null==t?void 0:t.value)===X},et=n((function(){return k.find((function(t){return tt(t)}))}),[k,X]),ot=n((function(){return k.map((function(t,i){var r=tt(t),l=0===i,a=i===k.length-1,n=tt(k[i+1]);return o.createElement(f,{key:t.value,size:U,onClick:function(){return $(t)},rightIcon:t.icon,leftIcon:t.leftIcon,active:r,rightFlat:i!==k.length-1,leftFlat:0!==i,kind:"tertiary",preventClickAnimation:!0,"aria-label":t["aria-label"],tooltipContent:t.tooltipContent,tooltipPosition:G,tooltipHideDelay:H,tooltipShowDelay:I,tooltipContainerSelector:_,tooltipMoveBy:A,blurOnMouseUp:w,fullWidth:q,className:u(y.button,y.optionText,e(e(e(e(e(e({},y.selected,r),y.disabled,N),y.buttonDisabled,t.disabled),y.fullWidth,q),y.startBorder,l),y.endBorder,a||!n)),activeButtonClassName:y.activeButton},t.text)}))}),[k,X,U,G,H,I,_,A,w,N,q,$]);return s((function(){P!==Z&&P!==X&&Y(P)}),[P,Z,X,Y]),o.createElement("div",{className:u(y.buttonGroup,C,p(y,d("kind-"+S)),e({},y.disabled,N)),id:z,"data-testid":F||v(b.BUTTON_GROUP,z),"data-vibe":h.BUTTON_GROUP,ref:K},o.createElement("div",{role:"group","aria-label":E,className:u(y.buttonsContainer,e({},y.fullWidth,q)),"aria-disabled":N},ot),et&&et.subText&&o.createElement("div",{className:u(y.subTextContainer)},et.subText))}));export{B as default};
+import{slicedToArray as t,defineProperty as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import o,{forwardRef as i,useRef as l,useState as r,useCallback as a,useMemo as n,useEffect as s}from"react";import{camelCase as d}from"es-toolkit";import u from"classnames";import{useMergeRef as p,getStyle as c}from"@vibe/shared";import m from"../../hooks/usePrevious/index.js";import{ButtonWrapper as f}from"./ButtonWrapper.js";import{getTestId as v}from"../../tests/testIds.js";import{ComponentDefaultTestId as b,ComponentVibeId as h}from"../../tests/constants.js";import y from"./ButtonGroup.module.scss.js";var B=i((function(i,B){var C=i.className,T=i.options,k=i.name,N=void 0===k?"":k,g=i.disabled,x=void 0!==g&&g,P=i.value,j=void 0===P?"":P,O=i.onSelect,U=i.size,D=void 0===U?"small":U,S=i.kind,W=void 0===S?"secondary":S,E=i.groupAriaLabel,G=void 0===E?"":E,I=i.tooltipPosition,M=i.tooltipHideDelay,_=i.tooltipShowDelay,A=i.tooltipContainerSelector,H=i.tooltipMoveBy,w=i.blurOnMouseUp,z=void 0===w||w,F=i.id,R=i["data-testid"],L=i.fullWidth,q=void 0!==L&&L,J=l(),K=p(B,J),Q=r(j),V=t(Q,2),X=V[0],Y=V[1],Z=m(j),$=a((function(t){x||t.disabled||(Y(t.value),O&&O(t.value,N))}),[O,x,N]),tt=function(t){return(null==t?void 0:t.value)===X},et=n((function(){return T.find((function(t){return tt(t)}))}),[T,X]),ot=n((function(){return T.map((function(t,i){var l=tt(t),r=0===i,a=i===T.length-1,n=tt(T[i+1]);return o.createElement(f,{key:t.value,size:D,onClick:function(){return $(t)},rightIcon:t.icon,leftIcon:t.leftIcon,active:l,rightFlat:i!==T.length-1,leftFlat:0!==i,kind:"tertiary",preventClickAnimation:!0,"aria-label":t["aria-label"],tooltipContent:t.tooltipContent,tooltipPosition:I,tooltipHideDelay:M,tooltipShowDelay:_,tooltipContainerSelector:A,tooltipMoveBy:H,blurOnMouseUp:z,fullWidth:q,className:u(y.button,y.optionText,e(e(e(e(e(e({},y.selected,l),y.disabled,x),y.buttonDisabled,t.disabled),y.fullWidth,q),y.startBorder,r),y.endBorder,a||!n)),activeButtonClassName:y.activeButton},t.text)}))}),[T,X,D,I,M,_,A,H,z,x,q,$]);return s((function(){j!==Z&&j!==X&&Y(j)}),[j,Z,X,Y]),o.createElement("div",{className:u(y.buttonGroup,C,c(y,d("kind-"+W)),e({},y.disabled,x)),id:F,"data-testid":R||v(b.BUTTON_GROUP,F),"data-vibe":h.BUTTON_GROUP,ref:K},o.createElement("div",{role:"group","aria-label":G,className:u(y.buttonsContainer,e({},y.fullWidth,q)),"aria-disabled":x},ot),et&&et.subText&&o.createElement("div",{className:u(y.subTextContainer)},et.subText))}));export{B as default};
 //# sourceMappingURL=ButtonGroup.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"ButtonGroup.js","sources":["../../../../../src/components/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { camelCase } from \"es-toolkit\";\nimport cx from \"classnames\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport usePrevious from \"../../hooks/usePrevious\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { type SubIcon } from \"@vibe/icon\";\nimport { type ButtonValue } from \"./ButtonGroupConstants\";\nimport { ButtonWrapper } from \"./ButtonWrapper\";\nimport { type ButtonType, type ButtonSize } from \"@vibe/button\";\nimport { type VibeComponentProps } from \"../../types\";\nimport { type MoveBy } from \"../../types/MoveBy\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport styles from \"./ButtonGroup.module.scss\";\nimport { type TooltipPositions } from \"@vibe/tooltip\";\n\ntype ButtonGroupOption = {\n  icon?: SubIcon;\n  leftIcon?: SubIcon;\n  \"aria-label\"?: string;\n  subText?: string;\n  value: ButtonValue;\n  text: string;\n  disabled?: boolean;\n  tooltipContent?: string;\n};\n\nexport interface ButtonGroupProps extends VibeComponentProps {\n  /**\n   * The list of button options.\n   */\n  options: Array<ButtonGroupOption>;\n  /**\n   * The currently selected button value.\n   */\n  value?: ButtonValue;\n  /**\n   * Callback fired when a button is selected.\n   */\n  onSelect?: (value: ButtonValue, name: string) => void;\n  /**\n   * The size of the buttons.\n   */\n  size?: ButtonSize;\n  /**\n   * The style variant of the buttons.\n   */\n  kind?: Extract<ButtonType, \"secondary\" | \"tertiary\">;\n  /**\n   * The name of the button group.\n   */\n  name?: string;\n  /**\n   * If true, disables all buttons in the group.\n   */\n  disabled?: boolean;\n  /**\n   * The label of the button group for accessibility.\n   */\n  groupAriaLabel?: string;\n  /**\n   * The position of the tooltip relative to the button.\n   */\n  tooltipPosition?: TooltipPositions;\n  /**\n   * The delay in milliseconds before the tooltip hides.\n   */\n  tooltipHideDelay?: number;\n  /**\n   * The delay in milliseconds before the tooltip shows.\n   */\n  tooltipShowDelay?: number;\n  /**\n   * CSS selector for the tooltip container.\n   */\n  tooltipContainerSelector?: string;\n  /**\n   * Adjusts the tooltip position.\n   */\n  tooltipMoveBy?: MoveBy;\n  /**\n   * The content inside the button group.\n   */\n  children?: React.ReactNode;\n  /**\n   * If true, makes the button group take the full width of its container.\n   */\n  fullWidth?: boolean;\n  /**\n   * If true, removes focus from the button after clicking.\n   */\n  blurOnMouseUp?: boolean;\n}\n\nconst ButtonGroup = forwardRef(\n  (\n    {\n      className,\n      options,\n      name = \"\",\n      disabled = false,\n      value = \"\",\n      onSelect,\n      size = \"small\",\n      kind = \"secondary\",\n      groupAriaLabel = \"\",\n      tooltipPosition,\n      tooltipHideDelay,\n      tooltipShowDelay,\n      tooltipContainerSelector,\n      tooltipMoveBy,\n      blurOnMouseUp = true,\n      id,\n      \"data-testid\": dataTestId,\n      fullWidth = false\n    }: ButtonGroupProps,\n    ref: React.ForwardedRef<HTMLDivElement>\n  ) => {\n    const inputRef = useRef();\n    const mergedRef = useMergeRef(ref, inputRef);\n\n    const [valueState, setValueState] = useState(value);\n    const prevValue = usePrevious(value);\n\n    const onClick = useCallback(\n      (option: ButtonGroupOption) => {\n        const isDisabled = disabled || option.disabled;\n        if (!isDisabled) {\n          setValueState(option.value);\n          if (onSelect) {\n            onSelect(option.value, name);\n          }\n        }\n      },\n      [onSelect, disabled, name]\n    );\n\n    const isOptionActive = (option?: ButtonGroupOption) => option?.value === valueState;\n\n    const selectedOption = useMemo(() => {\n      return options.find(option => isOptionActive(option));\n    }, [options, valueState]);\n\n    const Buttons = useMemo(() => {\n      return options.map((option, index) => {\n        const isSelected = isOptionActive(option);\n        const isFirst = index === 0;\n        const isLast = index === options.length - 1;\n        const isNextOptionActive = isOptionActive(options[index + 1]);\n\n        return (\n          <ButtonWrapper\n            key={option.value}\n            size={size}\n            onClick={() => onClick(option)}\n            rightIcon={option.icon}\n            leftIcon={option.leftIcon}\n            active={isSelected}\n            rightFlat={index !== options.length - 1}\n            leftFlat={index !== 0}\n            kind=\"tertiary\"\n            preventClickAnimation\n            aria-label={option[\"aria-label\"]}\n            tooltipContent={option.tooltipContent}\n            tooltipPosition={tooltipPosition}\n            tooltipHideDelay={tooltipHideDelay}\n            tooltipShowDelay={tooltipShowDelay}\n            tooltipContainerSelector={tooltipContainerSelector}\n            tooltipMoveBy={tooltipMoveBy}\n            blurOnMouseUp={blurOnMouseUp}\n            fullWidth={fullWidth}\n            className={cx(styles.button, styles.optionText, {\n              [styles.selected]: isSelected,\n              [styles.disabled]: disabled,\n              [styles.buttonDisabled]: option.disabled,\n              [styles.fullWidth]: fullWidth,\n              [styles.startBorder]: isFirst,\n              [styles.endBorder]: isLast || !isNextOptionActive\n            })}\n            activeButtonClassName={styles.activeButton}\n          >\n            {option.text}\n          </ButtonWrapper>\n        );\n      });\n    }, [\n      options,\n      valueState,\n      size,\n      tooltipPosition,\n      tooltipHideDelay,\n      tooltipShowDelay,\n      tooltipContainerSelector,\n      tooltipMoveBy,\n      blurOnMouseUp,\n      disabled,\n      fullWidth,\n      onClick\n    ]);\n\n    // Effects\n    useEffect(() => {\n      // Update value if changed from props\n      if (value !== prevValue && value !== valueState) {\n        setValueState(value);\n      }\n    }, [value, prevValue, valueState, setValueState]);\n\n    return (\n      <div\n        className={cx(styles.buttonGroup, className, getStyle(styles, camelCase(\"kind-\" + kind)), {\n          [styles.disabled]: disabled\n        })}\n        id={id}\n        data-testid={dataTestId || getTestId(ComponentDefaultTestId.BUTTON_GROUP, id)}\n        data-vibe={ComponentVibeId.BUTTON_GROUP}\n        ref={mergedRef}\n      >\n        <div\n          role=\"group\"\n          aria-label={groupAriaLabel}\n          className={cx(styles.buttonsContainer, { [styles.fullWidth]: fullWidth })}\n          aria-disabled={disabled}\n        >\n          {Buttons}\n        </div>\n        {selectedOption && selectedOption.subText && (\n          <div className={cx(styles.subTextContainer)}>{selectedOption.subText}</div>\n        )}\n      </div>\n    );\n  }\n);\n\nexport default ButtonGroup;\n"],"names":["ButtonGroup","forwardRef","_ref","ref","className","options","_ref$name","name","_ref$disabled","disabled","_ref$value","value","onSelect","_ref$size","size","_ref$kind","kind","_ref$groupAriaLabel","groupAriaLabel","tooltipPosition","tooltipHideDelay","tooltipShowDelay","tooltipContainerSelector","tooltipMoveBy","_ref$blurOnMouseUp","blurOnMouseUp","id","dataTestId","_ref$fullWidth","fullWidth","inputRef","useRef","mergedRef","useMergeRef","_useState","useState","_useState2","_slicedToArray","valueState","setValueState","prevValue","usePrevious","onClick","useCallback","option","isOptionActive","selectedOption","useMemo","find","Buttons","map","index","isSelected","isFirst","isLast","length","isNextOptionActive","React","createElement","ButtonWrapper","key","rightIcon","icon","leftIcon","active","rightFlat","leftFlat","preventClickAnimation","tooltipContent","cx","styles","button","optionText","_defineProperty","selected","buttonDisabled","startBorder","endBorder","activeButtonClassName","activeButton","text","useEffect","buttonGroup","getStyle","camelCase","getTestId","ComponentDefaultTestId","BUTTON_GROUP","ComponentVibeId","role","buttonsContainer","subText","subTextContainer"],"mappings":"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"}
+{"version":3,"file":"ButtonGroup.js","sources":["../../../../../src/components/ButtonGroup/ButtonGroup.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { camelCase } from \"es-toolkit\";\nimport cx from \"classnames\";\nimport { getStyle, useMergeRef } from \"@vibe/shared\";\nimport usePrevious from \"../../hooks/usePrevious\";\n\nimport { type SubIcon } from \"@vibe/icon\";\nimport { type ButtonValue } from \"./ButtonGroupConstants\";\nimport { ButtonWrapper } from \"./ButtonWrapper\";\nimport { type ButtonType, type ButtonSize } from \"@vibe/button\";\nimport { type VibeComponentProps } from \"../../types\";\nimport { type MoveBy } from \"../../types/MoveBy\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport styles from \"./ButtonGroup.module.scss\";\nimport { type TooltipPositions } from \"@vibe/tooltip\";\n\ntype ButtonGroupOption = {\n  icon?: SubIcon;\n  leftIcon?: SubIcon;\n  \"aria-label\"?: string;\n  subText?: string;\n  value: ButtonValue;\n  text: string;\n  disabled?: boolean;\n  tooltipContent?: string;\n};\n\nexport interface ButtonGroupProps extends VibeComponentProps {\n  /**\n   * The list of button options.\n   */\n  options: Array<ButtonGroupOption>;\n  /**\n   * The currently selected button value.\n   */\n  value?: ButtonValue;\n  /**\n   * Callback fired when a button is selected.\n   */\n  onSelect?: (value: ButtonValue, name: string) => void;\n  /**\n   * The size of the buttons.\n   */\n  size?: ButtonSize;\n  /**\n   * The style variant of the buttons.\n   */\n  kind?: Extract<ButtonType, \"secondary\" | \"tertiary\">;\n  /**\n   * The name of the button group.\n   */\n  name?: string;\n  /**\n   * If true, disables all buttons in the group.\n   */\n  disabled?: boolean;\n  /**\n   * The label of the button group for accessibility.\n   */\n  groupAriaLabel?: string;\n  /**\n   * The position of the tooltip relative to the button.\n   */\n  tooltipPosition?: TooltipPositions;\n  /**\n   * The delay in milliseconds before the tooltip hides.\n   */\n  tooltipHideDelay?: number;\n  /**\n   * The delay in milliseconds before the tooltip shows.\n   */\n  tooltipShowDelay?: number;\n  /**\n   * CSS selector for the tooltip container.\n   */\n  tooltipContainerSelector?: string;\n  /**\n   * Adjusts the tooltip position.\n   */\n  tooltipMoveBy?: MoveBy;\n  /**\n   * The content inside the button group.\n   */\n  children?: React.ReactNode;\n  /**\n   * If true, makes the button group take the full width of its container.\n   */\n  fullWidth?: boolean;\n  /**\n   * If true, removes focus from the button after clicking.\n   */\n  blurOnMouseUp?: boolean;\n}\n\nconst ButtonGroup = forwardRef(\n  (\n    {\n      className,\n      options,\n      name = \"\",\n      disabled = false,\n      value = \"\",\n      onSelect,\n      size = \"small\",\n      kind = \"secondary\",\n      groupAriaLabel = \"\",\n      tooltipPosition,\n      tooltipHideDelay,\n      tooltipShowDelay,\n      tooltipContainerSelector,\n      tooltipMoveBy,\n      blurOnMouseUp = true,\n      id,\n      \"data-testid\": dataTestId,\n      fullWidth = false\n    }: ButtonGroupProps,\n    ref: React.ForwardedRef<HTMLDivElement>\n  ) => {\n    const inputRef = useRef();\n    const mergedRef = useMergeRef(ref, inputRef);\n\n    const [valueState, setValueState] = useState(value);\n    const prevValue = usePrevious(value);\n\n    const onClick = useCallback(\n      (option: ButtonGroupOption) => {\n        const isDisabled = disabled || option.disabled;\n        if (!isDisabled) {\n          setValueState(option.value);\n          if (onSelect) {\n            onSelect(option.value, name);\n          }\n        }\n      },\n      [onSelect, disabled, name]\n    );\n\n    const isOptionActive = (option?: ButtonGroupOption) => option?.value === valueState;\n\n    const selectedOption = useMemo(() => {\n      return options.find(option => isOptionActive(option));\n    }, [options, valueState]);\n\n    const Buttons = useMemo(() => {\n      return options.map((option, index) => {\n        const isSelected = isOptionActive(option);\n        const isFirst = index === 0;\n        const isLast = index === options.length - 1;\n        const isNextOptionActive = isOptionActive(options[index + 1]);\n\n        return (\n          <ButtonWrapper\n            key={option.value}\n            size={size}\n            onClick={() => onClick(option)}\n            rightIcon={option.icon}\n            leftIcon={option.leftIcon}\n            active={isSelected}\n            rightFlat={index !== options.length - 1}\n            leftFlat={index !== 0}\n            kind=\"tertiary\"\n            preventClickAnimation\n            aria-label={option[\"aria-label\"]}\n            tooltipContent={option.tooltipContent}\n            tooltipPosition={tooltipPosition}\n            tooltipHideDelay={tooltipHideDelay}\n            tooltipShowDelay={tooltipShowDelay}\n            tooltipContainerSelector={tooltipContainerSelector}\n            tooltipMoveBy={tooltipMoveBy}\n            blurOnMouseUp={blurOnMouseUp}\n            fullWidth={fullWidth}\n            className={cx(styles.button, styles.optionText, {\n              [styles.selected]: isSelected,\n              [styles.disabled]: disabled,\n              [styles.buttonDisabled]: option.disabled,\n              [styles.fullWidth]: fullWidth,\n              [styles.startBorder]: isFirst,\n              [styles.endBorder]: isLast || !isNextOptionActive\n            })}\n            activeButtonClassName={styles.activeButton}\n          >\n            {option.text}\n          </ButtonWrapper>\n        );\n      });\n    }, [\n      options,\n      valueState,\n      size,\n      tooltipPosition,\n      tooltipHideDelay,\n      tooltipShowDelay,\n      tooltipContainerSelector,\n      tooltipMoveBy,\n      blurOnMouseUp,\n      disabled,\n      fullWidth,\n      onClick\n    ]);\n\n    // Effects\n    useEffect(() => {\n      // Update value if changed from props\n      if (value !== prevValue && value !== valueState) {\n        setValueState(value);\n      }\n    }, [value, prevValue, valueState, setValueState]);\n\n    return (\n      <div\n        className={cx(styles.buttonGroup, className, getStyle(styles, camelCase(\"kind-\" + kind)), {\n          [styles.disabled]: disabled\n        })}\n        id={id}\n        data-testid={dataTestId || getTestId(ComponentDefaultTestId.BUTTON_GROUP, id)}\n        data-vibe={ComponentVibeId.BUTTON_GROUP}\n        ref={mergedRef}\n      >\n        <div\n          role=\"group\"\n          aria-label={groupAriaLabel}\n          className={cx(styles.buttonsContainer, { [styles.fullWidth]: fullWidth })}\n          aria-disabled={disabled}\n        >\n          {Buttons}\n        </div>\n        {selectedOption && selectedOption.subText && (\n          <div className={cx(styles.subTextContainer)}>{selectedOption.subText}</div>\n        )}\n      </div>\n    );\n  }\n);\n\nexport default ButtonGroup;\n"],"names":["ButtonGroup","forwardRef","_ref","ref","className","options","_ref$name","name","_ref$disabled","disabled","_ref$value","value","onSelect","_ref$size","size","_ref$kind","kind","_ref$groupAriaLabel","groupAriaLabel","tooltipPosition","tooltipHideDelay","tooltipShowDelay","tooltipContainerSelector","tooltipMoveBy","_ref$blurOnMouseUp","blurOnMouseUp","id","dataTestId","_ref$fullWidth","fullWidth","inputRef","useRef","mergedRef","useMergeRef","_useState","useState","_useState2","_slicedToArray","valueState","setValueState","prevValue","usePrevious","onClick","useCallback","option","isOptionActive","selectedOption","useMemo","find","Buttons","map","index","isSelected","isFirst","isLast","length","isNextOptionActive","React","createElement","ButtonWrapper","key","rightIcon","icon","leftIcon","active","rightFlat","leftFlat","preventClickAnimation","tooltipContent","cx","styles","button","optionText","_defineProperty","selected","buttonDisabled","startBorder","endBorder","activeButtonClassName","activeButton","text","useEffect","buttonGroup","getStyle","camelCase","getTestId","ComponentDefaultTestId","BUTTON_GROUP","ComponentVibeId","role","buttonsContainer","subText","subTextContainer"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-import e,{forwardRef as a,useRef as t,useCallback as o,useEffect as l,useMemo as n}from"react";import i from"classnames";import{isNil as r,noop as s}from"es-toolkit";import{Icon as c}from"@vibe/icon/mockedClassNames";import{Remove as m,Check as d}from"@vibe/icons";import{useSupportFirefoxLabelClick as u}from"./hooks/useSupportFirefoxLabelClick.js";import p from"../../hooks/useMergeRef.js";import{getTestId as C}from"../../tests/testIds.js";import{ComponentDefaultTestId as b,ComponentVibeId as f}from"../../tests/constants.js";import{Text as v}from"@vibe/typography/mockedClassNames";import k from"./Checkbox.module.scss.js";var h=a((function(a,h){var E=a.className,y=a.checkboxClassName,x=a.labelClassName,N=a["aria-label"],B=a.label,K=a["aria-labelledby"],g=a.onChange,F=void 0===g?s:g,H=a.checked,O=a.autoFocus,X=a.indeterminate,w=void 0!==X&&X,I=a.disabled,L=void 0!==I&&I,j=a.defaultChecked,A=a.tabIndex,M=a.value,_=void 0===M?"":M,D=a.name,S=void 0===D?"":D,U=a.id,q=a.separateLabel,z=void 0!==q&&q,R=a["data-testid"],T=t(null),G=p(h,T),J=o((function(e){var a=e.currentTarget;window.requestAnimationFrame((function(){window.requestAnimationFrame((function(){a.blur()}))}))}),[]),P=j;r(P)&&r(H)&&(P=!1),l((function(){T.current&&(T.current.indeterminate=w)}),[T,w]);var Q=u({inputRef:T}).onClickCapture,V=n((function(){return N||("string"==typeof B?B:"")}),[N,B]),W=o((function(e){var a;" "===e.key&&(e.preventDefault(),null===(a=T.current)||void 0===a||a.click())}),[T]),Y=L?void 0:null!=A?A:0;return z?e.createElement("div",{className:i(k.wrapper,E),"data-testid":R||C(b.CHECKBOX,U),"data-vibe":f.CHECKBOX},e.createElement("input",{ref:G,id:U,className:k.input,value:_,name:S,type:"checkbox",autoFocus:O,onChange:F,defaultChecked:P,disabled:L,"aria-label":V,"aria-labelledby":K,checked:H,tabIndex:-1}),e.createElement("label",{htmlFor:U,className:i(k.checkbox,y),"data-testid":C(b.CHECKBOX_CHECKBOX,U),tabIndex:Y,onMouseUp:J,onKeyDown:W,onClickCapture:Q},e.createElement(c,{className:k.icon,type:"svg",icon:w?m:d,ignoreFocusStyle:!0,"aria-hidden":!0,size:"16"})),!1===B?null:e.createElement("label",{htmlFor:U,className:i(k.label,x),"data-testid":C(b.CHECKBOX_LABEL,U),onMouseUp:J,onClickCapture:Q},e.createElement(v,{element:"span",type:"text2"},B))):e.createElement("label",{className:i(k.wrapper,E),tabIndex:Y,onMouseUp:J,onKeyDown:W,"data-testid":R||C(b.CHECKBOX,U),htmlFor:U,onClickCapture:Q,"data-vibe":f.CHECKBOX},e.createElement("input",{ref:G,id:U,className:k.input,value:_,name:S,type:"checkbox",autoFocus:O,onChange:F,defaultChecked:P,disabled:L,"aria-label":V,"aria-labelledby":K,checked:H,tabIndex:-1}),e.createElement("div",{className:i(k.checkbox,y),"data-testid":C(b.CHECKBOX_CHECKBOX,U)},e.createElement(c,{className:k.icon,type:"svg",icon:w?m:d,ignoreFocusStyle:!0,"aria-hidden":!0,size:"16"})),!1===B?null:e.createElement(v,{element:"span",type:"text2",className:i(k.label,x),"data-testid":C(b.CHECKBOX_LABEL,U)},B))}));export{h as default};
+import e,{forwardRef as a,useRef as t,useCallback as o,useEffect as l,useMemo as n}from"react";import i from"classnames";import{isNil as r,noop as s}from"es-toolkit";import{Icon as c}from"@vibe/icon/mockedClassNames";import{Remove as d,Check as m}from"@vibe/icons";import{useSupportFirefoxLabelClick as u}from"./hooks/useSupportFirefoxLabelClick.js";import{useMergeRef as p}from"@vibe/shared";import{getTestId as C}from"../../tests/testIds.js";import{ComponentDefaultTestId as b,ComponentVibeId as f}from"../../tests/constants.js";import{Text as v}from"@vibe/typography/mockedClassNames";import h from"./Checkbox.module.scss.js";var k=a((function(a,k){var E=a.className,y=a.checkboxClassName,x=a.labelClassName,N=a["aria-label"],B=a.label,K=a["aria-labelledby"],F=a.onChange,g=void 0===F?s:F,H=a.checked,O=a.autoFocus,X=a.indeterminate,w=void 0!==X&&X,I=a.disabled,L=void 0!==I&&I,j=a.defaultChecked,A=a.tabIndex,_=a.value,D=void 0===_?"":_,M=a.name,S=void 0===M?"":M,U=a.id,q=a.separateLabel,z=void 0!==q&&q,R=a["data-testid"],T=t(null),G=p(k,T),J=o((function(e){var a=e.currentTarget;window.requestAnimationFrame((function(){window.requestAnimationFrame((function(){a.blur()}))}))}),[]),P=j;r(P)&&r(H)&&(P=!1),l((function(){T.current&&(T.current.indeterminate=w)}),[T,w]);var Q=u({inputRef:T}).onClickCapture,V=n((function(){return N||("string"==typeof B?B:"")}),[N,B]),W=o((function(e){var a;" "===e.key&&(e.preventDefault(),null===(a=T.current)||void 0===a||a.click())}),[T]),Y=L?void 0:null!=A?A:0;return z?e.createElement("div",{className:i(h.wrapper,E),"data-testid":R||C(b.CHECKBOX,U),"data-vibe":f.CHECKBOX},e.createElement("input",{ref:G,id:U,className:h.input,value:D,name:S,type:"checkbox",autoFocus:O,onChange:g,defaultChecked:P,disabled:L,"aria-label":V,"aria-labelledby":K,checked:H,tabIndex:-1}),e.createElement("label",{htmlFor:U,className:i(h.checkbox,y),"data-testid":C(b.CHECKBOX_CHECKBOX,U),tabIndex:Y,onMouseUp:J,onKeyDown:W,onClickCapture:Q},e.createElement(c,{className:h.icon,type:"svg",icon:w?d:m,ignoreFocusStyle:!0,"aria-hidden":!0,size:"16"})),!1===B?null:e.createElement("label",{htmlFor:U,className:i(h.label,x),"data-testid":C(b.CHECKBOX_LABEL,U),onMouseUp:J,onClickCapture:Q},e.createElement(v,{element:"span",type:"text2"},B))):e.createElement("label",{className:i(h.wrapper,E),tabIndex:Y,onMouseUp:J,onKeyDown:W,"data-testid":R||C(b.CHECKBOX,U),htmlFor:U,onClickCapture:Q,"data-vibe":f.CHECKBOX},e.createElement("input",{ref:G,id:U,className:h.input,value:D,name:S,type:"checkbox",autoFocus:O,onChange:g,defaultChecked:P,disabled:L,"aria-label":V,"aria-labelledby":K,checked:H,tabIndex:-1}),e.createElement("div",{className:i(h.checkbox,y),"data-testid":C(b.CHECKBOX_CHECKBOX,U)},e.createElement(c,{className:h.icon,type:"svg",icon:w?d:m,ignoreFocusStyle:!0,"aria-hidden":!0,size:"16"})),!1===B?null:e.createElement(v,{element:"span",type:"text2",className:i(h.label,x),"data-testid":C(b.CHECKBOX_LABEL,U)},B))}));export{k as default};
 //# sourceMappingURL=Checkbox.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sources":["../../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { isNil, noop as NOOP } from \"es-toolkit\";\nimport { Icon } from \"@vibe/icon\";\nimport { Check, Remove } from \"@vibe/icons\";\nimport { useSupportFirefoxLabelClick } from \"./hooks/useSupportFirefoxLabelClick\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { type VibeComponentProps } from \"../../types\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport { Text } from \"@vibe/typography\";\nimport styles from \"./Checkbox.module.scss\";\n\nexport interface CheckBoxProps extends VibeComponentProps {\n  /**\n   * Class name applied to the checkbox element.\n   */\n  checkboxClassName?: string;\n  /**\n   * Class name applied to the label element.\n   */\n  labelClassName?: string;\n  /**\n   * The label of the checkbox for accessibility.\n   */\n  \"aria-label\"?: string;\n  /**\n   * The content displayed next to the checkbox.\n   */\n  label?: React.ReactNode | Array<React.ReactNode>;\n  /**\n   * The ID of an element describing the checkbox.\n   */\n  \"aria-labelledby\"?: string;\n  /**\n   * Callback fired when the checkbox value changes.\n   */\n  onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;\n  /**\n   * If true, controls the checked state of the checkbox.\n   */\n  checked?: boolean;\n  /**\n   * If true, displays an indeterminate state.\n   */\n  indeterminate?: boolean;\n  /**\n   * If true, the checkbox automatically receives focus.\n   */\n  autoFocus?: boolean;\n  /**\n   * If true, the checkbox is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * The initial checked state of the checkbox.\n   */\n  defaultChecked?: boolean;\n  /**\n   * The value submitted with the form when checked.\n   */\n  value?: string;\n  /**\n   * The name of the checkbox, used for form submission.\n   */\n  name?: string;\n  /**\n   * The tab order of the checkbox.\n   */\n  tabIndex?: number;\n  /**\n   * If true, uses separate labels with htmlFor/id association instead of wrapping the input.\n   * If using this the id prop is required for it to function correctly.\n   */\n  separateLabel?: boolean;\n}\n\nconst Checkbox = forwardRef(\n  (\n    {\n      className,\n      checkboxClassName,\n      labelClassName,\n      \"aria-label\": ariaLabel,\n      label,\n      \"aria-labelledby\": ariaLabelledBy,\n      onChange = NOOP,\n      checked,\n      autoFocus,\n      indeterminate = false,\n      disabled = false,\n      defaultChecked,\n      tabIndex,\n      value = \"\",\n      name = \"\",\n      id,\n      separateLabel = false,\n      \"data-testid\": dataTestId\n    }: CheckBoxProps,\n    ref: React.ForwardedRef<HTMLInputElement>\n  ) => {\n    const inputRef = useRef<HTMLInputElement>(null);\n    const mergedInputRef = useMergeRef(ref, inputRef);\n\n    const onMouseUpCallback = useCallback((e: React.MouseEvent<HTMLElement>) => {\n      const target = e.currentTarget;\n      window.requestAnimationFrame(() => {\n        window.requestAnimationFrame(() => {\n          target.blur();\n        });\n      });\n    }, []);\n\n    let overrideDefaultChecked = defaultChecked;\n\n    // If component did not receive default checked and checked props, choose default checked as\n    // default behavior (handle isChecked logic inside input) and set default value\n    if (isNil(overrideDefaultChecked) && isNil(checked)) {\n      overrideDefaultChecked = false;\n    }\n\n    useEffect(() => {\n      if (inputRef.current) {\n        inputRef.current.indeterminate = indeterminate;\n      }\n    }, [inputRef, indeterminate]);\n\n    const { onClickCapture: onClickCaptureLabel } = useSupportFirefoxLabelClick({ inputRef });\n\n    const finalAriaLabel = useMemo(() => {\n      if (ariaLabel) return ariaLabel;\n      if (typeof label === \"string\") return label;\n      return \"\";\n    }, [ariaLabel, label]);\n\n    const onKeyDownCallback = useCallback(\n      (e: React.KeyboardEvent) => {\n        if (e.key === \" \") {\n          e.preventDefault();\n          inputRef.current?.click();\n        }\n      },\n      [inputRef]\n    );\n\n    const wrapperTabIndex = disabled ? undefined : tabIndex ?? 0;\n\n    if (separateLabel) {\n      return (\n        <div\n          className={cx(styles.wrapper, className)}\n          data-testid={dataTestId || getTestId(ComponentDefaultTestId.CHECKBOX, id)}\n          data-vibe={ComponentVibeId.CHECKBOX}\n        >\n          <input\n            ref={mergedInputRef}\n            id={id}\n            className={styles.input}\n            value={value}\n            name={name}\n            type=\"checkbox\"\n            autoFocus={autoFocus}\n            onChange={onChange}\n            defaultChecked={overrideDefaultChecked}\n            disabled={disabled}\n            aria-label={finalAriaLabel}\n            aria-labelledby={ariaLabelledBy}\n            checked={checked}\n            tabIndex={-1}\n          />\n          {/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */}\n          <label\n            htmlFor={id}\n            className={cx(styles.checkbox, checkboxClassName)}\n            data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_CHECKBOX, id)}\n            tabIndex={wrapperTabIndex}\n            onMouseUp={onMouseUpCallback}\n            onKeyDown={onKeyDownCallback}\n            onClickCapture={onClickCaptureLabel}\n          >\n            <Icon\n              className={styles.icon}\n              type=\"svg\"\n              icon={indeterminate ? Remove : Check}\n              ignoreFocusStyle\n              aria-hidden={true}\n              size=\"16\"\n            />\n          </label>\n          {label === false ? null : (\n            // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n            <label\n              htmlFor={id}\n              className={cx(styles.label, labelClassName)}\n              data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_LABEL, id)}\n              onMouseUp={onMouseUpCallback}\n              onClickCapture={onClickCaptureLabel}\n            >\n              <Text element=\"span\" type=\"text2\">\n                {label}\n              </Text>\n            </label>\n          )}\n        </div>\n      );\n    }\n\n    return (\n      // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n      <label\n        className={cx(styles.wrapper, className)}\n        tabIndex={wrapperTabIndex}\n        onMouseUp={onMouseUpCallback}\n        onKeyDown={onKeyDownCallback}\n        data-testid={dataTestId || getTestId(ComponentDefaultTestId.CHECKBOX, id)}\n        htmlFor={id}\n        onClickCapture={onClickCaptureLabel}\n        data-vibe={ComponentVibeId.CHECKBOX}\n      >\n        <input\n          ref={mergedInputRef}\n          id={id}\n          className={styles.input}\n          value={value}\n          name={name}\n          type=\"checkbox\"\n          autoFocus={autoFocus}\n          onChange={onChange}\n          defaultChecked={overrideDefaultChecked}\n          disabled={disabled}\n          aria-label={finalAriaLabel}\n          aria-labelledby={ariaLabelledBy}\n          checked={checked}\n          tabIndex={-1}\n        />\n        <div\n          className={cx(styles.checkbox, checkboxClassName)}\n          data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_CHECKBOX, id)}\n        >\n          <Icon\n            className={styles.icon}\n            type=\"svg\"\n            icon={indeterminate ? Remove : Check}\n            ignoreFocusStyle\n            aria-hidden={true}\n            size=\"16\"\n          />\n        </div>\n        {label === false ? null : (\n          <Text\n            element=\"span\"\n            type=\"text2\"\n            className={cx(styles.label, labelClassName)}\n            data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_LABEL, id)}\n          >\n            {label}\n          </Text>\n        )}\n      </label>\n    );\n  }\n);\n\nexport default Checkbox;\n"],"names":["Checkbox","forwardRef","_ref","ref","className","checkboxClassName","labelClassName","ariaLabel","label","ariaLabelledBy","_ref$onChange","onChange","NOOP","checked","autoFocus","_ref$indeterminate","indeterminate","_ref$disabled","disabled","defaultChecked","tabIndex","_ref$value","value","_ref$name","name","id","_ref$separateLabel","separateLabel","dataTestId","inputRef","useRef","mergedInputRef","useMergeRef","onMouseUpCallback","useCallback","e","target","currentTarget","window","requestAnimationFrame","blur","overrideDefaultChecked","isNil","useEffect","current","onClickCaptureLabel","useSupportFirefoxLabelClick","onClickCapture","finalAriaLabel","useMemo","onKeyDownCallback","key","preventDefault","_a","click","wrapperTabIndex","undefined","React","createElement","cx","styles","wrapper","getTestId","ComponentDefaultTestId","CHECKBOX","ComponentVibeId","input","type","htmlFor","checkbox","CHECKBOX_CHECKBOX","onMouseUp","onKeyDown","Icon","icon","Remove","Check","ignoreFocusStyle","size","CHECKBOX_LABEL","Text","element"],"mappings":"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"}
+{"version":3,"file":"Checkbox.js","sources":["../../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import React, { forwardRef, useCallback, useEffect, useMemo, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { isNil, noop as NOOP } from \"es-toolkit\";\nimport { Icon } from \"@vibe/icon\";\nimport { Check, Remove } from \"@vibe/icons\";\nimport { useSupportFirefoxLabelClick } from \"./hooks/useSupportFirefoxLabelClick\";\nimport { useMergeRef } from \"@vibe/shared\";\nimport { type VibeComponentProps } from \"../../types\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId, ComponentVibeId } from \"../../tests/constants\";\nimport { Text } from \"@vibe/typography\";\nimport styles from \"./Checkbox.module.scss\";\n\nexport interface CheckBoxProps extends VibeComponentProps {\n  /**\n   * Class name applied to the checkbox element.\n   */\n  checkboxClassName?: string;\n  /**\n   * Class name applied to the label element.\n   */\n  labelClassName?: string;\n  /**\n   * The label of the checkbox for accessibility.\n   */\n  \"aria-label\"?: string;\n  /**\n   * The content displayed next to the checkbox.\n   */\n  label?: React.ReactNode | Array<React.ReactNode>;\n  /**\n   * The ID of an element describing the checkbox.\n   */\n  \"aria-labelledby\"?: string;\n  /**\n   * Callback fired when the checkbox value changes.\n   */\n  onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;\n  /**\n   * If true, controls the checked state of the checkbox.\n   */\n  checked?: boolean;\n  /**\n   * If true, displays an indeterminate state.\n   */\n  indeterminate?: boolean;\n  /**\n   * If true, the checkbox automatically receives focus.\n   */\n  autoFocus?: boolean;\n  /**\n   * If true, the checkbox is disabled.\n   */\n  disabled?: boolean;\n  /**\n   * The initial checked state of the checkbox.\n   */\n  defaultChecked?: boolean;\n  /**\n   * The value submitted with the form when checked.\n   */\n  value?: string;\n  /**\n   * The name of the checkbox, used for form submission.\n   */\n  name?: string;\n  /**\n   * The tab order of the checkbox.\n   */\n  tabIndex?: number;\n  /**\n   * If true, uses separate labels with htmlFor/id association instead of wrapping the input.\n   * If using this the id prop is required for it to function correctly.\n   */\n  separateLabel?: boolean;\n}\n\nconst Checkbox = forwardRef(\n  (\n    {\n      className,\n      checkboxClassName,\n      labelClassName,\n      \"aria-label\": ariaLabel,\n      label,\n      \"aria-labelledby\": ariaLabelledBy,\n      onChange = NOOP,\n      checked,\n      autoFocus,\n      indeterminate = false,\n      disabled = false,\n      defaultChecked,\n      tabIndex,\n      value = \"\",\n      name = \"\",\n      id,\n      separateLabel = false,\n      \"data-testid\": dataTestId\n    }: CheckBoxProps,\n    ref: React.ForwardedRef<HTMLInputElement>\n  ) => {\n    const inputRef = useRef<HTMLInputElement>(null);\n    const mergedInputRef = useMergeRef(ref, inputRef);\n\n    const onMouseUpCallback = useCallback((e: React.MouseEvent<HTMLElement>) => {\n      const target = e.currentTarget;\n      window.requestAnimationFrame(() => {\n        window.requestAnimationFrame(() => {\n          target.blur();\n        });\n      });\n    }, []);\n\n    let overrideDefaultChecked = defaultChecked;\n\n    // If component did not receive default checked and checked props, choose default checked as\n    // default behavior (handle isChecked logic inside input) and set default value\n    if (isNil(overrideDefaultChecked) && isNil(checked)) {\n      overrideDefaultChecked = false;\n    }\n\n    useEffect(() => {\n      if (inputRef.current) {\n        inputRef.current.indeterminate = indeterminate;\n      }\n    }, [inputRef, indeterminate]);\n\n    const { onClickCapture: onClickCaptureLabel } = useSupportFirefoxLabelClick({ inputRef });\n\n    const finalAriaLabel = useMemo(() => {\n      if (ariaLabel) return ariaLabel;\n      if (typeof label === \"string\") return label;\n      return \"\";\n    }, [ariaLabel, label]);\n\n    const onKeyDownCallback = useCallback(\n      (e: React.KeyboardEvent) => {\n        if (e.key === \" \") {\n          e.preventDefault();\n          inputRef.current?.click();\n        }\n      },\n      [inputRef]\n    );\n\n    const wrapperTabIndex = disabled ? undefined : tabIndex ?? 0;\n\n    if (separateLabel) {\n      return (\n        <div\n          className={cx(styles.wrapper, className)}\n          data-testid={dataTestId || getTestId(ComponentDefaultTestId.CHECKBOX, id)}\n          data-vibe={ComponentVibeId.CHECKBOX}\n        >\n          <input\n            ref={mergedInputRef}\n            id={id}\n            className={styles.input}\n            value={value}\n            name={name}\n            type=\"checkbox\"\n            autoFocus={autoFocus}\n            onChange={onChange}\n            defaultChecked={overrideDefaultChecked}\n            disabled={disabled}\n            aria-label={finalAriaLabel}\n            aria-labelledby={ariaLabelledBy}\n            checked={checked}\n            tabIndex={-1}\n          />\n          {/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */}\n          <label\n            htmlFor={id}\n            className={cx(styles.checkbox, checkboxClassName)}\n            data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_CHECKBOX, id)}\n            tabIndex={wrapperTabIndex}\n            onMouseUp={onMouseUpCallback}\n            onKeyDown={onKeyDownCallback}\n            onClickCapture={onClickCaptureLabel}\n          >\n            <Icon\n              className={styles.icon}\n              type=\"svg\"\n              icon={indeterminate ? Remove : Check}\n              ignoreFocusStyle\n              aria-hidden={true}\n              size=\"16\"\n            />\n          </label>\n          {label === false ? null : (\n            // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n            <label\n              htmlFor={id}\n              className={cx(styles.label, labelClassName)}\n              data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_LABEL, id)}\n              onMouseUp={onMouseUpCallback}\n              onClickCapture={onClickCaptureLabel}\n            >\n              <Text element=\"span\" type=\"text2\">\n                {label}\n              </Text>\n            </label>\n          )}\n        </div>\n      );\n    }\n\n    return (\n      // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n      <label\n        className={cx(styles.wrapper, className)}\n        tabIndex={wrapperTabIndex}\n        onMouseUp={onMouseUpCallback}\n        onKeyDown={onKeyDownCallback}\n        data-testid={dataTestId || getTestId(ComponentDefaultTestId.CHECKBOX, id)}\n        htmlFor={id}\n        onClickCapture={onClickCaptureLabel}\n        data-vibe={ComponentVibeId.CHECKBOX}\n      >\n        <input\n          ref={mergedInputRef}\n          id={id}\n          className={styles.input}\n          value={value}\n          name={name}\n          type=\"checkbox\"\n          autoFocus={autoFocus}\n          onChange={onChange}\n          defaultChecked={overrideDefaultChecked}\n          disabled={disabled}\n          aria-label={finalAriaLabel}\n          aria-labelledby={ariaLabelledBy}\n          checked={checked}\n          tabIndex={-1}\n        />\n        <div\n          className={cx(styles.checkbox, checkboxClassName)}\n          data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_CHECKBOX, id)}\n        >\n          <Icon\n            className={styles.icon}\n            type=\"svg\"\n            icon={indeterminate ? Remove : Check}\n            ignoreFocusStyle\n            aria-hidden={true}\n            size=\"16\"\n          />\n        </div>\n        {label === false ? null : (\n          <Text\n            element=\"span\"\n            type=\"text2\"\n            className={cx(styles.label, labelClassName)}\n            data-testid={getTestId(ComponentDefaultTestId.CHECKBOX_LABEL, id)}\n          >\n            {label}\n          </Text>\n        )}\n      </label>\n    );\n  }\n);\n\nexport default Checkbox;\n"],"names":["Checkbox","forwardRef","_ref","ref","className","checkboxClassName","labelClassName","ariaLabel","label","ariaLabelledBy","_ref$onChange","onChange","NOOP","checked","autoFocus","_ref$indeterminate","indeterminate","_ref$disabled","disabled","defaultChecked","tabIndex","_ref$value","value","_ref$name","name","id","_ref$separateLabel","separateLabel","dataTestId","inputRef","useRef","mergedInputRef","useMergeRef","onMouseUpCallback","useCallback","e","target","currentTarget","window","requestAnimationFrame","blur","overrideDefaultChecked","isNil","useEffect","current","onClickCaptureLabel","useSupportFirefoxLabelClick","onClickCapture","finalAriaLabel","useMemo","onKeyDownCallback","key","preventDefault","_a","click","wrapperTabIndex","undefined","React","createElement","cx","styles","wrapper","getTestId","ComponentDefaultTestId","CHECKBOX","ComponentVibeId","input","type","htmlFor","checkbox","CHECKBOX_CHECKBOX","onMouseUp","onKeyDown","Icon","icon","Remove","Check","ignoreFocusStyle","size","CHECKBOX_LABEL","Text","element"],"mappings":"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"}

package/dist/mocked_classnames/src/components/Checkbox/hooks/useSupportFirefoxLabelClick.js

@@ -1,2 +1,2 @@
-import{useRef as e,useCallback as t}from"react";import{isFirefox as r}from"../../../utils/user-agent-utils.js";function n(n){var u=n.inputRef,i=e(!1);return{onClickCapture:t((function(e){var t;if(!i.current&&e.shiftKey&&r()&&(null===(t=null==u?void 0:u.current)||void 0===t?void 0:t.dispatchEvent)){e.preventDefault();var n=new MouseEvent("click",{shiftKey:!0,bubbles:!0,cancelable:!0});i.current=!0,u.current.dispatchEvent(n)}else i.current&&(i.current=!1)}),[i,u])}}export{n as useSupportFirefoxLabelClick};
+import{useRef as e,useCallback as r}from"react";import{isFirefox as t}from"@vibe/shared";function n(n){var c=n.inputRef,i=e(!1);return{onClickCapture:r((function(e){var r;if(!i.current&&e.shiftKey&&t()&&(null===(r=null==c?void 0:c.current)||void 0===r?void 0:r.dispatchEvent)){e.preventDefault();var n=new MouseEvent("click",{shiftKey:!0,bubbles:!0,cancelable:!0});i.current=!0,c.current.dispatchEvent(n)}else i.current&&(i.current=!1)}),[i,c])}}export{n as useSupportFirefoxLabelClick};
 //# sourceMappingURL=useSupportFirefoxLabelClick.js.map

package/dist/mocked_classnames/src/components/Checkbox/hooks/useSupportFirefoxLabelClick.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSupportFirefoxLabelClick.js","sources":["../../../../../../src/components/Checkbox/hooks/useSupportFirefoxLabelClick.tsx"],"sourcesContent":["import type React from \"react\";\nimport { useCallback, useRef } from \"react\";\nimport { isFirefox } from \"../../../utils/user-agent-utils\";\n\nexport function useSupportFirefoxLabelClick({ inputRef }: { inputRef: React.RefObject<HTMLInputElement> }) {\n  // The purpose of this variable is to make sure that the captured event is a checkbox's label click event and not a manual event\n  // that we actually created in this hook.\n  // We handle the custom event create state as ref because this variable should not be depend on the component renders\n  // and it should be unique per checkbox.\n  const customEventCreated = useRef(false);\n\n  // fix for known bug firefox bug: firefox does not support checking or unchecking checkbox by its label when shift pressed\n  const onClickCapture = useCallback(\n    (e: React.MouseEvent) => {\n      // We would like to dispatch a manual event to click on the input only for cases where there is a bug in supporting this capability -\n      // firefox browsers when the shift key is pressed.\n      // In addition we make sure here that the captured event is not a manually generated event created by this code because we want to prevent\n      // an infinite loop in recursion here.\n      if (!customEventCreated.current && e.shiftKey && isFirefox() && inputRef?.current?.dispatchEvent) {\n        e.preventDefault();\n        const manualClickEvent = new MouseEvent(\"click\", {\n          shiftKey: true,\n          // After dispatch this event we will want it to be captured by all the relevant event listeners which registered to this checkbox input.\n          bubbles: true,\n          cancelable: true\n        });\n\n        customEventCreated.current = true;\n        inputRef.current.dispatchEvent(manualClickEvent);\n      } else if (customEventCreated.current) {\n        customEventCreated.current = false;\n      }\n    },\n    [customEventCreated, inputRef]\n  );\n\n  return { onClickCapture };\n}\n"],"names":["useSupportFirefoxLabelClick","_ref","inputRef","customEventCreated","useRef","onClickCapture","useCallback","e","current","shiftKey","isFirefox","_a","dispatchEvent","preventDefault","manualClickEvent","MouseEvent","bubbles","cancelable"],"mappings":"+GAIgB,SAAAA,EAA2BC,GAA8D,IAA3DC,EAAQD,EAARC,SAKtCC,EAAqBC,GAAO,GA2BlC,MAAO,CAAEC,eAxBcC,GACrB,SAACC,SAKC,IAAKJ,EAAmBK,SAAWD,EAAEE,UAAYC,MAAkC,UAAnBR,aAAQ,EAARA,EAAUM,eAAS,IAAAG,OAAA,EAAAA,EAAAC,eAAe,CAChGL,EAAEM,iBACF,IAAMC,EAAmB,IAAIC,WAAW,QAAS,CAC/CN,UAAU,EAEVO,SAAS,EACTC,YAAY,IAGdd,EAAmBK,SAAU,EAC7BN,EAASM,QAAQI,cAAcE,EACjC,MAAWX,EAAmBK,UAC5BL,EAAmBK,SAAU,EAEjC,GACA,CAACL,EAAoBD,IAIzB"}
+{"version":3,"file":"useSupportFirefoxLabelClick.js","sources":["../../../../../../src/components/Checkbox/hooks/useSupportFirefoxLabelClick.tsx"],"sourcesContent":["import type React from \"react\";\nimport { useCallback, useRef } from \"react\";\nimport { isFirefox } from \"@vibe/shared\";\n\nexport function useSupportFirefoxLabelClick({ inputRef }: { inputRef: React.RefObject<HTMLInputElement> }) {\n  // The purpose of this variable is to make sure that the captured event is a checkbox's label click event and not a manual event\n  // that we actually created in this hook.\n  // We handle the custom event create state as ref because this variable should not be depend on the component renders\n  // and it should be unique per checkbox.\n  const customEventCreated = useRef(false);\n\n  // fix for known bug firefox bug: firefox does not support checking or unchecking checkbox by its label when shift pressed\n  const onClickCapture = useCallback(\n    (e: React.MouseEvent) => {\n      // We would like to dispatch a manual event to click on the input only for cases where there is a bug in supporting this capability -\n      // firefox browsers when the shift key is pressed.\n      // In addition we make sure here that the captured event is not a manually generated event created by this code because we want to prevent\n      // an infinite loop in recursion here.\n      if (!customEventCreated.current && e.shiftKey && isFirefox() && inputRef?.current?.dispatchEvent) {\n        e.preventDefault();\n        const manualClickEvent = new MouseEvent(\"click\", {\n          shiftKey: true,\n          // After dispatch this event we will want it to be captured by all the relevant event listeners which registered to this checkbox input.\n          bubbles: true,\n          cancelable: true\n        });\n\n        customEventCreated.current = true;\n        inputRef.current.dispatchEvent(manualClickEvent);\n      } else if (customEventCreated.current) {\n        customEventCreated.current = false;\n      }\n    },\n    [customEventCreated, inputRef]\n  );\n\n  return { onClickCapture };\n}\n"],"names":["useSupportFirefoxLabelClick","_ref","inputRef","customEventCreated","useRef","onClickCapture","useCallback","e","current","shiftKey","isFirefox","_a","dispatchEvent","preventDefault","manualClickEvent","MouseEvent","bubbles","cancelable"],"mappings":"yFAIgB,SAAAA,EAA2BC,GAA8D,IAA3DC,EAAQD,EAARC,SAKtCC,EAAqBC,GAAO,GA2BlC,MAAO,CAAEC,eAxBcC,GACrB,SAACC,SAKC,IAAKJ,EAAmBK,SAAWD,EAAEE,UAAYC,MAAkC,UAAnBR,aAAQ,EAARA,EAAUM,eAAS,IAAAG,OAAA,EAAAA,EAAAC,eAAe,CAChGL,EAAEM,iBACF,IAAMC,EAAmB,IAAIC,WAAW,QAAS,CAC/CN,UAAU,EAEVO,SAAS,EACTC,YAAY,IAGdd,EAAmBK,SAAU,EAC7BN,EAASM,QAAQI,cAAcE,EACjC,MAAWX,EAAmBK,UAC5BL,EAAmBK,SAAU,EAEjC,GACA,CAACL,EAAoBD,IAIzB"}

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

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