@vibe/core 3.36.0-alpha-94da6.0 → 3.36.0

package/dist/src/components/Tooltip/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\nimport { camelCase, isFunction } from \"lodash-es\";\nimport cx from \"classnames\";\nimport React, { CSSProperties, isValidElement, PureComponent, ReactElement } from \"react\";\nimport { Modifier } from \"react-popper\";\nimport Dialog from \"../Dialog/Dialog\";\nimport { DialogAnimationType, DialogTriggerEvent } from \"../Dialog/Dialog.types\";\nimport { HideShowEvent as HideShowEventEnum, AnimationType as AnimationTypeEnum } from \"../Dialog/DialogConstants\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { TooltipTheme as TooltipThemeEnum, TooltipPositions as TooltipPositionsEnum } from \"./TooltipConstants\";\nimport { ElementContent } from \"../../types/ElementContent\";\nimport { MoveBy } from \"../../types/MoveBy\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport styles from \"./Tooltip.module.scss\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { SubIcon } from \"../../types\";\nimport Icon from \"../Icon/Icon\";\nimport Flex from \"../Flex/Flex\";\nimport { TooltipPositions, TooltipTheme } from \"./Tooltip.types\";\n\nexport type TooltipProps = TooltipBaseProps & (TooltipWithChildrenProps | TooltipWithoutChildrenProps);\n\ninterface TooltipWithoutChildrenProps {\n  /**\n   * When true, the tooltip would be rendered on a Dialog without children\n   * Use case is currently for rendering Tipseen with floating prop\n   */\n  forceRenderWithoutChildren: boolean;\n  children?: ReactElement | Array<ReactElement>;\n}\n\ninterface TooltipWithChildrenProps {\n  forceRenderWithoutChildren?: boolean;\n  children: ReactElement | Array<ReactElement>;\n}\n\n// TODO TS-migration extend DialogProps, once Dialog is migrated to TS\ninterface TooltipBaseProps extends VibeComponentProps {\n  content: ElementContent;\n  style?: CSSProperties;\n  /** Class name for a tooltip's arrow */\n  arrowClassName?: string;\n  /**\n   * How much to move the dialog in relative to children\n   * main is the axis in which the position is aligned to\n   * secondary is the vertical axes to the position\n   */\n  moveBy?: MoveBy;\n  theme?: TooltipTheme;\n  getContainer?: () => HTMLElement;\n  /**\n   * how much delay should the Dialog wait until it should trigger the hide in MS\n   */\n  hideDelay?: number;\n  /**\n   * how much delay should the Dialog wait until it should trigger the show in MS\n   */\n  showDelay?: number;\n  disableDialogSlide?: boolean;\n  animationType?: DialogAnimationType;\n  withoutDialog?: boolean;\n  /**\n   * the container selector in which to append the dialog\n   * for examples: \"body\" , \".my-class\", \"#my-id\"\n   */\n  containerSelector?: string;\n  /**\n   * With which delay tooltip is going to be shown\n   */\n  immediateShowDelay?: number;\n  /**\n   * when false, the arrow of the tooltip is hidden\n   */\n  tip?: boolean;\n  /**\n   * Show the Dialog when the children is mounting\n   */\n  shouldShowOnMount?: boolean;\n  hideWhenReferenceHidden?: boolean;\n  onTooltipHide?: () => void;\n  onTooltipShow?: () => void;\n  /**\n   * PopperJS Modifiers type\n   * https://popper.js.org/docs/v2/modifiers/\n   */\n  modifiers?: Array<Modifier<unknown>>;\n  /**\n   * Where the tooltip should be in reference to the children: Top, Left, Right, Bottom ...\n   */\n  position?: TooltipPositions;\n  /**\n   * an array of hide/show trigger - Tooltip.hideShowTriggers\n   */\n  showTrigger?: DialogTriggerEvent | Array<DialogTriggerEvent>;\n  /**\n   * an array of hide/show trigger - Tooltip.hideShowTriggers\n   */\n  hideTrigger?: DialogTriggerEvent | Array<DialogTriggerEvent>;\n  /**\n   * If true, prevents open Tooltip from closing on mouseEnter and closes Tooltip, when mouse leaves it\n   */\n  showOnDialogEnter?: boolean;\n  /**\n   * A Classname to be added to <span> element which wraps the children\n   */\n  referenceWrapperClassName?: string;\n  /**\n   * Treats keyboard focus/blur events as mouse-enter/mouse-leave events\n   */\n  addKeyboardHideShowTriggersByDefault?: boolean;\n  /**\n   * set the state of the tooltip - open/close - controlled component\n   */\n  open?: boolean;\n  /**\n   * Overwrites z-index of the tooltip\n   */\n  zIndex?: number;\n  /**\n   * The title of the tooltip\n   */\n  title?: string;\n  /**\n   * The image of the tooltip\n   */\n  image?: string;\n  /**\n   * The icon of the tooltip next to the title\n   */\n  icon?: SubIcon;\n  /**\n   * Sets the max width of the Tooltip, defaults to 240px\n   */\n  maxWidth?: number;\n  /**\n   * Sets the text direction of the tooltip: \"ltr\", \"rtl\", or \"auto\"\n   */\n  dir?: \"ltr\" | \"rtl\" | \"auto\";\n}\n// When last tooltip was shown in the last 1.5 second - the next tooltip will be shown immediately\nconst IMMEDIATE_SHOW_THRESHOLD_MS = 1500;\n\n// Shared state across multiple tooltip instances (i.e last tooltip shown time)\nconst globalState: { lastTooltipHideTS: number; openTooltipsCount: number } = {\n  lastTooltipHideTS: null,\n  openTooltipsCount: 0\n};\n\nexport default class Tooltip extends PureComponent<TooltipProps> {\n  wasShown: boolean;\n  static positions = TooltipPositionsEnum;\n  static hideShowTriggers = HideShowEventEnum;\n  static themes = TooltipThemeEnum;\n  static animationTypes = AnimationTypeEnum;\n  static defaultProps = {\n    moveBy: { main: 4, secondary: 0 },\n    theme: \"dark\",\n    position: \"top\",\n    hideDelay: 100,\n    showDelay: 300,\n    disableDialogSlide: true,\n    animationType: AnimationTypeEnum.EXPAND,\n    withoutDialog: false,\n    tip: true,\n    hideWhenReferenceHidden: false,\n    modifiers: new Array<Modifier<unknown>>(),\n    showTrigger: Tooltip.hideShowTriggers.MOUSE_ENTER,\n    hideTrigger: Tooltip.hideShowTriggers.MOUSE_LEAVE,\n    showOnDialogEnter: true,\n    referenceWrapperClassName: \"\",\n    addKeyboardHideShowTriggersByDefault: true,\n    open: false\n  };\n  constructor(props: TooltipProps) {\n    super(props);\n    this.renderTooltipContent = this.renderTooltipContent.bind(this);\n    this.getShowDelay = this.getShowDelay.bind(this);\n    this.onTooltipShow = this.onTooltipShow.bind(this);\n    this.onTooltipHide = this.onTooltipHide.bind(this);\n\n    this.wasShown = false;\n  }\n\n  renderTooltipContent() {\n    const { theme, content, className, style, maxWidth, title, image, icon, dir } = this.props;\n    if (!content) {\n      // don't render empty tooltip\n      return null;\n    }\n    let contentValue;\n    if (isFunction(content)) {\n      contentValue = content();\n    } else if (isValidElement(content)) {\n      contentValue = content;\n    } else if (typeof content === \"string\" && content) {\n      contentValue = content;\n    } else if (Array.isArray(content) && content.length > 0) {\n      // allow array of elements\n      contentValue = content;\n    }\n\n    if (!contentValue) {\n      return null;\n    }\n\n    return (\n      <div\n        style={maxWidth ? ({ ...style, \"--tooltip-max-width\": `${maxWidth}px` } as CSSProperties) : style}\n        className={cx(styles.tooltip, getStyle(styles, camelCase(theme)), className)}\n        dir={dir}\n      >\n        {image && <img className={styles.image} src={image} alt=\"\" />}\n        <div className={cx(styles.content)}>\n          {title && (\n            <Flex gap=\"xs\">\n              {icon && <Icon iconSize=\"20\" icon={icon} />}\n              <div className={styles.title}>{title}</div>\n            </Flex>\n          )}\n          {contentValue}\n        </div>\n      </div>\n    );\n  }\n\n  onTooltipShow() {\n    if (!this.wasShown) {\n      const { onTooltipShow } = this.props;\n      globalState.openTooltipsCount++;\n      this.wasShown = true;\n      onTooltipShow && onTooltipShow();\n    }\n  }\n\n  onTooltipHide() {\n    if (this.wasShown) {\n      const { onTooltipHide } = this.props;\n      globalState.lastTooltipHideTS = Date.now();\n      globalState.openTooltipsCount--;\n      this.wasShown = false;\n      onTooltipHide && onTooltipHide();\n    }\n  }\n\n  getTimeSinceLastTooltip() {\n    if (globalState.openTooltipsCount > 0) {\n      return 0;\n    }\n    return globalState.lastTooltipHideTS ? Date.now() - globalState.lastTooltipHideTS : Infinity;\n  }\n\n  getShowDelay() {\n    const { showDelay, immediateShowDelay } = this.props;\n    const timeSinceLastTooltip = this.getTimeSinceLastTooltip();\n    if ((immediateShowDelay === 0 || immediateShowDelay) && timeSinceLastTooltip < IMMEDIATE_SHOW_THRESHOLD_MS) {\n      // showing the tooltip immediately (without animation)\n      return {\n        showDelay: immediateShowDelay,\n        preventAnimation: true\n      };\n    }\n    return {\n      showDelay,\n      preventAnimation: false\n    };\n  }\n\n  render() {\n    const {\n      withoutDialog,\n      children,\n      forceRenderWithoutChildren,\n      theme,\n      tip,\n      arrowClassName,\n      id,\n      \"data-testid\": dataTestId,\n      position\n    } = this.props;\n\n    if (!children && !forceRenderWithoutChildren) {\n      return null;\n    }\n\n    if (withoutDialog) {\n      return this.renderTooltipContent();\n    }\n\n    const content = this.renderTooltipContent;\n    const dialogProps = {\n      ...this.props,\n      position: position,\n      \"data-testid\": dataTestId || getTestId(ComponentDefaultTestId.TOOLTIP, id),\n      tooltip: tip,\n      content,\n      tooltipClassName: cx(styles.arrow, getStyle(styles, theme), arrowClassName),\n      onDialogDidHide: this.onTooltipHide,\n      onDialogDidShow: this.onTooltipShow,\n      getDynamicShowDelay: this.getShowDelay\n    };\n    return (\n      <Dialog {...dialogProps} animationType=\"expand\">\n        {children}\n      </Dialog>\n    );\n  }\n}\n"],"names":["globalState","lastTooltipHideTS","openTooltipsCount","Tooltip","_PureComponent","props","_this","_classCallCheck","_callSuper","renderTooltipContent","bind","getShowDelay","onTooltipShow","onTooltipHide","wasShown","_inherits","PureComponent","_createClass","key","value","contentValue","_this$props","this","theme","content","className","style","maxWidth","title","image","icon","dir","isFunction","isValidElement","Array","isArray","length","React","Object","assign","concat","cx","styles","tooltip","getStyle","camelCase","createElement","src","alt","Flex","gap","Icon","iconSize","Date","now","Infinity","_this$props2","showDelay","immediateShowDelay","timeSinceLastTooltip","getTimeSinceLastTooltip","preventAnimation","_this$props3","children","tip","arrowClassName","id","dataTestId","position","forceRenderWithoutChildren","withoutDialog","dialogProps","getTestId","ComponentDefaultTestId","TOOLTIP","tooltipClassName","arrow","onDialogDidHide","onDialogDidShow","getDynamicShowDelay","Dialog","animationType","positions","TooltipPositionsEnum","hideShowTriggers","HideShowEventEnum","themes","TooltipThemeEnum","animationTypes","AnimationTypeEnum","defaultProps","moveBy","main","secondary","hideDelay","disableDialogSlide","EXPAND","hideWhenReferenceHidden","modifiers","showTrigger","MOUSE_ENTER","hideTrigger","MOUSE_LEAVE","showOnDialogEnter","referenceWrapperClassName","addKeyboardHideShowTriggersByDefault","open"],"mappings":"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"}
+{"version":3,"file":"Tooltip.js","sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\nimport { camelCase, isFunction } from \"lodash-es\";\nimport cx from \"classnames\";\nimport React, { CSSProperties, isValidElement, PureComponent, ReactElement } from \"react\";\nimport { Modifier } from \"react-popper\";\nimport Dialog from \"../Dialog/Dialog\";\nimport { DialogAnimationType, DialogTriggerEvent } from \"../Dialog/Dialog.types\";\nimport { HideShowEvent as HideShowEventEnum, AnimationType as AnimationTypeEnum } from \"../Dialog/DialogConstants\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { TooltipTheme as TooltipThemeEnum, TooltipPositions as TooltipPositionsEnum } from \"./TooltipConstants\";\nimport { ElementContent } from \"../../types/ElementContent\";\nimport { MoveBy } from \"../../types/MoveBy\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport styles from \"./Tooltip.module.scss\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { SubIcon } from \"../../types\";\nimport Icon from \"../Icon/Icon\";\nimport Flex from \"../Flex/Flex\";\nimport { TooltipPositions, TooltipTheme } from \"./Tooltip.types\";\n\nexport type TooltipProps = TooltipBaseProps & (TooltipWithChildrenProps | TooltipWithoutChildrenProps);\n\ninterface TooltipWithoutChildrenProps {\n  /**\n   * If true, the tooltip will be rendered even if there are no children.\n   */\n  forceRenderWithoutChildren: boolean;\n  /**\n   * The children elements that the tooltip is attached to.\n   */\n  children?: ReactElement | Array<ReactElement>;\n}\n\ninterface TooltipWithChildrenProps {\n  /**\n   * If true, the tooltip will be rendered even if there are no children.\n   */\n  forceRenderWithoutChildren?: boolean;\n  /**\n   * The children elements that the tooltip is attached to.\n   */\n  children: ReactElement | Array<ReactElement>;\n}\n\n// TODO TS-migration extend DialogProps, once Dialog is migrated to TS\ninterface TooltipBaseProps extends VibeComponentProps {\n  /**\n   * The content displayed inside the tooltip.\n   */\n  content: ElementContent;\n  /**\n   * Inline styles applied to the tooltip container.\n   */\n  style?: CSSProperties;\n  /**\n   * Class name applied to the tooltip arrow.\n   */\n  arrowClassName?: string;\n  /**\n   * Offset values for positioning adjustments.\n   */\n  moveBy?: MoveBy;\n  /**\n   * The theme of the tooltip.\n   */\n  theme?: TooltipTheme;\n  /**\n   * Function to get the container where the tooltip should be rendered.\n   */\n  getContainer?: () => HTMLElement;\n  /**\n   * Delay in milliseconds before hiding the tooltip.\n   */\n  hideDelay?: number;\n  /**\n   * Delay in milliseconds before showing the tooltip.\n   */\n  showDelay?: number;\n  /**\n   * If true, disables the slide animation of the tooltip.\n   */\n  disableDialogSlide?: boolean;\n  /**\n   * The animation type used for showing/hiding the tooltip.\n   */\n  animationType?: DialogAnimationType;\n  /**\n   * If true, renders the tooltip without a dialog.\n   */\n  withoutDialog?: boolean;\n  /**\n   * The CSS selector of the container where the tooltip should be rendered.\n   */\n  containerSelector?: string;\n  /**\n   * Delay in milliseconds before showing the tooltip immediately.\n   */\n  immediateShowDelay?: number;\n  /**\n   * If false, hides the arrow of the tooltip.\n   */\n  tip?: boolean;\n  /**\n   * If true, the tooltip is shown when the component mounts.\n   */\n  shouldShowOnMount?: boolean;\n  /**\n   * If true, hides the tooltip when the reference element is hidden.\n   */\n  hideWhenReferenceHidden?: boolean;\n  /**\n   * Callback fired when the tooltip is hidden.\n   */\n  onTooltipHide?: () => void;\n  /**\n   * Callback fired when the tooltip is shown.\n   */\n  onTooltipShow?: () => void;\n  /**\n   * Custom Popper.js modifiers.\n   * https://popper.js.org/docs/v2/modifiers/\n   */\n  modifiers?: Array<Modifier<unknown>>;\n  /**\n   * The placement of the tooltip relative to the reference element.\n   */\n  position?: TooltipPositions;\n  /**\n   * Events that trigger showing the tooltip.\n   */\n  showTrigger?: DialogTriggerEvent | Array<DialogTriggerEvent>;\n  /**\n   * Events that trigger hiding the tooltip.\n   */\n  hideTrigger?: DialogTriggerEvent | Array<DialogTriggerEvent>;\n  /**\n   * If true, prevents closing the tooltip when the mouse enters it.\n   */\n  showOnDialogEnter?: boolean;\n  /**\n   * Class name applied to the reference wrapper element.\n   */\n  referenceWrapperClassName?: string;\n  /**\n   * If true, keyboard focus/blur events behave like mouse enter/leave.\n   */\n  addKeyboardHideShowTriggersByDefault?: boolean;\n  /**\n   * If true, controls the open state of the tooltip.\n   */\n  open?: boolean;\n  /**\n   * The z-index applied to the tooltip.\n   */\n  zIndex?: number;\n  /**\n   * The title of the tooltip.\n   */\n  title?: string;\n  /**\n   * The image displayed inside the tooltip.\n   */\n  image?: string;\n  /**\n   * The icon displayed next to the title.\n   */\n  icon?: SubIcon;\n  /**\n   * The maximum width of the tooltip.\n   */\n  maxWidth?: number;\n  /**\n   * The text direction of the tooltip: \"ltr\", \"rtl\", or \"auto\".\n   */\n  dir?: \"ltr\" | \"rtl\" | \"auto\";\n}\n// When last tooltip was shown in the last 1.5 second - the next tooltip will be shown immediately\nconst IMMEDIATE_SHOW_THRESHOLD_MS = 1500;\n\n// Shared state across multiple tooltip instances (i.e last tooltip shown time)\nconst globalState: { lastTooltipHideTS: number; openTooltipsCount: number } = {\n  lastTooltipHideTS: null,\n  openTooltipsCount: 0\n};\n\nexport default class Tooltip extends PureComponent<TooltipProps> {\n  wasShown: boolean;\n  static positions = TooltipPositionsEnum;\n  static hideShowTriggers = HideShowEventEnum;\n  static themes = TooltipThemeEnum;\n  static animationTypes = AnimationTypeEnum;\n  static defaultProps = {\n    moveBy: { main: 4, secondary: 0 },\n    theme: \"dark\",\n    position: \"top\",\n    hideDelay: 100,\n    showDelay: 300,\n    disableDialogSlide: true,\n    animationType: AnimationTypeEnum.EXPAND,\n    withoutDialog: false,\n    tip: true,\n    hideWhenReferenceHidden: false,\n    modifiers: new Array<Modifier<unknown>>(),\n    showTrigger: Tooltip.hideShowTriggers.MOUSE_ENTER,\n    hideTrigger: Tooltip.hideShowTriggers.MOUSE_LEAVE,\n    showOnDialogEnter: true,\n    referenceWrapperClassName: \"\",\n    addKeyboardHideShowTriggersByDefault: true,\n    open: false\n  };\n  constructor(props: TooltipProps) {\n    super(props);\n    this.renderTooltipContent = this.renderTooltipContent.bind(this);\n    this.getShowDelay = this.getShowDelay.bind(this);\n    this.onTooltipShow = this.onTooltipShow.bind(this);\n    this.onTooltipHide = this.onTooltipHide.bind(this);\n\n    this.wasShown = false;\n  }\n\n  renderTooltipContent() {\n    const { theme, content, className, style, maxWidth, title, image, icon, dir } = this.props;\n    if (!content) {\n      // don't render empty tooltip\n      return null;\n    }\n    let contentValue;\n    if (isFunction(content)) {\n      contentValue = content();\n    } else if (isValidElement(content)) {\n      contentValue = content;\n    } else if (typeof content === \"string\" && content) {\n      contentValue = content;\n    } else if (Array.isArray(content) && content.length > 0) {\n      // allow array of elements\n      contentValue = content;\n    }\n\n    if (!contentValue) {\n      return null;\n    }\n\n    return (\n      <div\n        style={maxWidth ? ({ ...style, \"--tooltip-max-width\": `${maxWidth}px` } as CSSProperties) : style}\n        className={cx(styles.tooltip, getStyle(styles, camelCase(theme)), className)}\n        dir={dir}\n      >\n        {image && <img className={styles.image} src={image} alt=\"\" />}\n        <div className={cx(styles.content)}>\n          {title && (\n            <Flex gap=\"xs\">\n              {icon && <Icon iconSize=\"20\" icon={icon} />}\n              <div className={styles.title}>{title}</div>\n            </Flex>\n          )}\n          {contentValue}\n        </div>\n      </div>\n    );\n  }\n\n  onTooltipShow() {\n    if (!this.wasShown) {\n      const { onTooltipShow } = this.props;\n      globalState.openTooltipsCount++;\n      this.wasShown = true;\n      onTooltipShow && onTooltipShow();\n    }\n  }\n\n  onTooltipHide() {\n    if (this.wasShown) {\n      const { onTooltipHide } = this.props;\n      globalState.lastTooltipHideTS = Date.now();\n      globalState.openTooltipsCount--;\n      this.wasShown = false;\n      onTooltipHide && onTooltipHide();\n    }\n  }\n\n  getTimeSinceLastTooltip() {\n    if (globalState.openTooltipsCount > 0) {\n      return 0;\n    }\n    return globalState.lastTooltipHideTS ? Date.now() - globalState.lastTooltipHideTS : Infinity;\n  }\n\n  getShowDelay() {\n    const { showDelay, immediateShowDelay } = this.props;\n    const timeSinceLastTooltip = this.getTimeSinceLastTooltip();\n    if ((immediateShowDelay === 0 || immediateShowDelay) && timeSinceLastTooltip < IMMEDIATE_SHOW_THRESHOLD_MS) {\n      // showing the tooltip immediately (without animation)\n      return {\n        showDelay: immediateShowDelay,\n        preventAnimation: true\n      };\n    }\n    return {\n      showDelay,\n      preventAnimation: false\n    };\n  }\n\n  render() {\n    const {\n      withoutDialog,\n      children,\n      forceRenderWithoutChildren,\n      theme,\n      tip,\n      arrowClassName,\n      id,\n      \"data-testid\": dataTestId,\n      position\n    } = this.props;\n\n    if (!children && !forceRenderWithoutChildren) {\n      return null;\n    }\n\n    if (withoutDialog) {\n      return this.renderTooltipContent();\n    }\n\n    const content = this.renderTooltipContent;\n    const dialogProps = {\n      ...this.props,\n      position: position,\n      \"data-testid\": dataTestId || getTestId(ComponentDefaultTestId.TOOLTIP, id),\n      tooltip: tip,\n      content,\n      tooltipClassName: cx(styles.arrow, getStyle(styles, theme), arrowClassName),\n      onDialogDidHide: this.onTooltipHide,\n      onDialogDidShow: this.onTooltipShow,\n      getDynamicShowDelay: this.getShowDelay\n    };\n    return (\n      <Dialog {...dialogProps} animationType=\"expand\">\n        {children}\n      </Dialog>\n    );\n  }\n}\n"],"names":["globalState","lastTooltipHideTS","openTooltipsCount","Tooltip","_PureComponent","props","_this","_classCallCheck","_callSuper","renderTooltipContent","bind","getShowDelay","onTooltipShow","onTooltipHide","wasShown","_inherits","PureComponent","_createClass","key","value","contentValue","_this$props","this","theme","content","className","style","maxWidth","title","image","icon","dir","isFunction","isValidElement","Array","isArray","length","React","Object","assign","concat","cx","styles","tooltip","getStyle","camelCase","createElement","src","alt","Flex","gap","Icon","iconSize","Date","now","Infinity","_this$props2","showDelay","immediateShowDelay","timeSinceLastTooltip","getTimeSinceLastTooltip","preventAnimation","_this$props3","children","tip","arrowClassName","id","dataTestId","position","forceRenderWithoutChildren","withoutDialog","dialogProps","getTestId","ComponentDefaultTestId","TOOLTIP","tooltipClassName","arrow","onDialogDidHide","onDialogDidShow","getDynamicShowDelay","Dialog","animationType","positions","TooltipPositionsEnum","hideShowTriggers","HideShowEventEnum","themes","TooltipThemeEnum","animationTypes","AnimationTypeEnum","defaultProps","moveBy","main","secondary","hideDelay","disableDialogSlide","EXPAND","hideWhenReferenceHidden","modifiers","showTrigger","MOUSE_ENTER","hideTrigger","MOUSE_LEAVE","showOnDialogEnter","referenceWrapperClassName","addKeyboardHideShowTriggersByDefault","open"],"mappings":"osBAiLA,IAGMA,EAAwE,CAC5EC,kBAAmB,KACnBC,kBAAmB,GAGAC,WAAQC,GAyB3B,SAAAD,EAAYE,GAAmB,IAAAC,EAOP,OAPOC,OAAAJ,IAC7BG,EAAAE,EAAAL,KAAAA,GAAME,KACDI,qBAAuBH,EAAKG,qBAAqBC,KAAIJ,GAC1DA,EAAKK,aAAeL,EAAKK,aAAaD,KAAIJ,GAC1CA,EAAKM,cAAgBN,EAAKM,cAAcF,KAAIJ,GAC5CA,EAAKO,cAAgBP,EAAKO,cAAcH,KAAIJ,GAE5CA,EAAKQ,UAAW,EAAMR,CACxB,CAAC,OAAAS,EAAAZ,EAjCkCa,GAiClCC,EAAAd,EAAA,CAAA,CAAAe,IAAA,uBAAAC,MAED,WACE,IAKIC,EALJC,EAAgFC,KAAKjB,MAA7EkB,EAAKF,EAALE,MAAOC,EAAOH,EAAPG,QAASC,EAASJ,EAATI,UAAWC,EAAKL,EAALK,MAAOC,EAAQN,EAARM,SAAUC,EAAKP,EAALO,MAAOC,EAAKR,EAALQ,MAAOC,EAAIT,EAAJS,KAAMC,EAAGV,EAAHU,IACxE,OAAKP,GAKDQ,EAAWR,GACbJ,EAAeI,KACNS,EAAeT,IAEI,iBAAZA,GAAwBA,GAE/BU,MAAMC,QAAQX,IAAYA,EAAQY,OAAS,KAHpDhB,EAAeI,GAQZJ,EAKHiB,uBACEX,MAAOC,EAAYW,OAAKC,OAAAD,OAAAC,OAAA,CAAA,EAAAb,IAAO,sBAAqB,GAAAc,OAAKb,EAAQ,QAA2BD,EAC5FD,UAAWgB,EAAGC,EAAOC,QAASC,EAASF,EAAQG,EAAUtB,IAASE,GAClEM,IAAKA,GAEJF,GAASQ,EAAAS,cAAA,MAAA,CAAKrB,UAAWiB,EAAOb,MAAOkB,IAAKlB,EAAOmB,IAAI,KACxDX,EAAAS,cAAA,MAAA,CAAKrB,UAAWgB,EAAGC,EAAOlB,UACvBI,GACCS,EAAAS,cAACG,EAAK,CAAAC,IAAI,MACPpB,GAAQO,EAACS,cAAAK,EAAK,CAAAC,SAAS,KAAKtB,KAAMA,IACnCO,EAAKS,cAAA,MAAA,CAAArB,UAAWiB,EAAOd,OAAQA,IAGlCR,IAjBE,MAfA,IAoCX,GAAC,CAAAF,IAAA,gBAAAC,MAED,WACE,IAAKG,KAAKR,SAAU,CAClB,IAAQF,EAAkBU,KAAKjB,MAAvBO,cACRZ,EAAYE,oBACZoB,KAAKR,UAAW,EAChBF,GAAiBA,GAClB,CACH,GAAC,CAAAM,IAAA,gBAAAC,MAED,WACE,GAAIG,KAAKR,SAAU,CACjB,IAAQD,EAAkBS,KAAKjB,MAAvBQ,cACRb,EAAYC,kBAAoBoD,KAAKC,MACrCtD,EAAYE,oBACZoB,KAAKR,UAAW,EAChBD,GAAiBA,GAClB,CACH,GAAC,CAAAK,IAAA,0BAAAC,MAED,WACE,OAAInB,EAAYE,kBAAoB,EAC3B,EAEFF,EAAYC,kBAAoBoD,KAAKC,MAAQtD,EAAYC,kBAAoBsD,GACtF,GAAC,CAAArC,IAAA,eAAAC,MAED,WACE,IAAAqC,EAA0ClC,KAAKjB,MAAvCoD,EAASD,EAATC,UAAWC,EAAkBF,EAAlBE,mBACbC,EAAuBrC,KAAKsC,0BAClC,OAA4B,IAAvBF,GAA4BA,IAlHD,KAkHwBC,EAE/C,CACLF,UAAWC,EACXG,kBAAkB,GAGf,CACLJ,UAAAA,EACAI,kBAAkB,EAEtB,GAAC,CAAA3C,IAAA,SAAAC,MAED,WACE,IAAA2C,EAUIxC,KAAKjB,MARP0D,EAAQD,EAARC,SAEAxC,EAAKuC,EAALvC,MACAyC,EAAGF,EAAHE,IACAC,EAAcH,EAAdG,eACAC,EAAEJ,EAAFI,GACeC,EAAUL,EAAzB,eACAM,EAAQN,EAARM,SAGF,IAAKL,IATuBD,EAA1BO,2BAUA,OAAO,KAGT,GAfeP,EAAbQ,cAgBA,OAAOhD,KAAKb,uBAGd,IAAMe,EAAUF,KAAKb,qBACf8D,EAAWjC,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EACZjB,KAAKjB,OAAK,CACb+D,SAAUA,EACV,cAAeD,GAAcK,EAAUC,EAAuBC,QAASR,GACvEvB,QAASqB,EACTxC,QAAAA,EACAmD,iBAAkBlC,EAAGC,EAAOkC,MAAOhC,EAASF,EAAQnB,GAAQ0C,GAC5DY,gBAAiBvD,KAAKT,cACtBiE,gBAAiBxD,KAAKV,cACtBmE,oBAAqBzD,KAAKX,eAE5B,OACE0B,EAAAS,cAACkC,EAAM1C,OAAAC,OAAA,CAAA,EAAKgC,EAAW,CAAEU,cAAc,WACpClB,EAGP,IAAC,IA3JM5D,EAAS+E,UAAGC,EACZhF,EAAgBiF,iBAAGC,EACnBlF,EAAMmF,OAAGC,EACTpF,EAAcqF,eAAGC,EACjBtF,EAAAuF,aAAe,CACpBC,OAAQ,CAAEC,KAAM,EAAGC,UAAW,GAC9BtE,MAAO,OACP6C,SAAU,MACV0B,UAAW,IACXrC,UAAW,IACXsC,oBAAoB,EACpBd,cAAeQ,EAAkBO,OACjC1B,eAAe,EACfN,KAAK,EACLiC,yBAAyB,EACzBC,UAAW,GACXC,YAAahG,EAAQiF,iBAAiBgB,YACtCC,YAAalG,EAAQiF,iBAAiBkB,YACtCC,mBAAmB,EACnBC,0BAA2B,GAC3BC,sCAAsC,EACtCC,MAAM"}

package/dist/src/components/Typography/Typography.js.map

@@ -1 +1 @@
-{"version":3,"file":"Typography.js","sources":["../../../../src/components/Typography/Typography.tsx"],"sourcesContent":["import React, { forwardRef, useRef, HTMLAttributes, useContext } from \"react\";\nimport cx from \"classnames\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport VibeComponent from \"../../types/VibeComponent\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport { ElementContent } from \"../../types\";\nimport { TypographyAlign, TypographyColor } from \"./Typography.types\";\nimport { useEllipsisClass, useTooltipProps } from \"./TypographyHooks\";\nimport Tooltip, { TooltipProps } from \"../Tooltip/Tooltip\";\nimport { TypographyContext } from \"./utils/TypographyContext\";\nimport styles from \"./Typography.module.scss\";\n\nexport interface TypographyProps extends VibeComponentProps, HTMLAttributes<HTMLElement> {\n  /**\n   * The element tag of the text component\n   */\n  element?: string;\n  /**\n   * The textual content\n   */\n  children: ElementContent;\n  color?: TypographyColor;\n  align?: TypographyAlign;\n  /**\n   * When the text is too long, cut the end of the text and display instead of it three dots (...)\n   */\n  ellipsis?: boolean;\n  /**\n   * Use this prop combined with the boolean ellipsis prop for truncate the text and add an ellipsis after a certain number of lines\n   */\n  maxLines?: number;\n  /**\n   * All props are passed to the tooltip displayed when hovering over the text. By default, the tooltip will display when text contains an ellipsis and will show the full text\n   */\n  tooltipProps?: Partial<TooltipProps>;\n  /**\n   * Hide tooltip when hovering the text, by default the tooltip swill display when text contains an ellipsis\n   */\n  withoutTooltip?: boolean;\n}\n\nconst Typography: VibeComponent<TypographyProps, HTMLElement> = forwardRef(\n  (\n    {\n      className,\n      id,\n      children,\n      tooltipProps,\n      \"data-testid\": dataTestId = getTestId(ComponentDefaultTestId.TEXT, id),\n      element = \"span\",\n      color = \"primary\",\n      align = \"start\",\n      ellipsis = true,\n      maxLines = 1,\n      withoutTooltip = false,\n      role,\n      ...htmlAttributes\n    }: TypographyProps,\n    ref\n  ) => {\n    const { overflowTolerance } = useContext(TypographyContext);\n    const componentRef = useRef(null);\n    const mergedRef = useMergeRef(ref, componentRef);\n    const ignoreHeightOverflow = maxLines === 1;\n    const { class: ellipsisClass, style: ellipsisStyle } = useEllipsisClass(ellipsis, maxLines);\n    const overrideTooltipProps = useTooltipProps(\n      componentRef,\n      withoutTooltip,\n      ellipsis,\n      tooltipProps,\n      children,\n      ignoreHeightOverflow,\n      overflowTolerance\n    ) as TooltipProps;\n\n    const overrideAlign = align === \"inherit\" ? \"alignInherit\" : align;\n\n    return (\n      <Tooltip {...overrideTooltipProps}>\n        {React.createElement(\n          element,\n          {\n            id,\n            style: ellipsisStyle,\n            \"data-testid\": dataTestId,\n            className: cx(styles.typography, styles[color], styles[overrideAlign], ellipsisClass, className),\n            ref: mergedRef,\n            role,\n            ...htmlAttributes\n          },\n          children\n        )}\n      </Tooltip>\n    );\n  }\n);\n\nexport default Typography;\n"],"names":["Typography","forwardRef","_a","ref","className","id","children","tooltipProps","_a$dataTestid","dataTestId","getTestId","ComponentDefaultTestId","TEXT","_a$element","element","_a$color","color","_a$align","align","_a$ellipsis","ellipsis","_a$maxLines","maxLines","_a$withoutTooltip","withoutTooltip","role","htmlAttributes","__rest","overflowTolerance","useContext","TypographyContext","componentRef","useRef","mergedRef","useMergeRef","ignoreHeightOverflow","_useEllipsisClass","useEllipsisClass","ellipsisClass","class","ellipsisStyle","style","overrideTooltipProps","useTooltipProps","overrideAlign","React","createElement","Tooltip","Object","assign","cx","styles","typography"],"mappings":"8gBA2CMA,IAAAA,EAA0DC,GAC9D,SACEC,EAeAC,OAdEC,IAAAA,UACAC,IAAAA,GACAC,IAAAA,SACAC,IAAAA,aAAYC,IACZ,eAAeC,OAAaC,IAAHF,EAAGE,EAAUC,EAAuBC,KAAMP,GAAGG,EAAAK,IACtEC,QAAAA,OAAU,IAAHD,EAAG,OAAMA,EAAAE,IAChBC,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EAAAE,IACjBC,MAAAA,OAAQ,IAAHD,EAAG,QAAOA,EAAAE,IACfC,SAAAA,OAAW,IAAHD,GAAOA,EAAAE,IACfC,SAAAA,OAAW,IAAHD,EAAG,EAACA,EAAAE,IACZC,eAAAA,OAAiB,IAAHD,GAAQA,EACtBE,IAAAA,KACGC,EAbLC,EAAAzB,EAAA,CAAA,YAAA,KAAA,WAAA,eAAA,cAAA,UAAA,QAAA,QAAA,WAAA,WAAA,iBAAA,SAiBQ0B,EAAsBC,EAAWC,GAAjCF,kBACFG,EAAeC,EAAO,MACtBC,EAAYC,EAAY/B,EAAK4B,GAC7BI,EAAoC,IAAbb,EAC7Bc,EAAuDC,EAAiBjB,EAAUE,GAAnEgB,EAAaF,EAApBG,MAA6BC,EAAaJ,EAApBK,MACxBC,EAAuBC,EAC3BZ,EACAP,EACAJ,EACAb,EACAD,EACA6B,EACAP,GAGIgB,EAA0B,YAAV1B,EAAsB,eAAiBA,EAE7D,OACE2B,EAACC,cAAAC,EAAYC,OAAAC,OAAA,CAAA,EAAAP,GACVG,EAAMC,cACLhC,EAEEkC,OAAAC,OAAA,CAAA5C,GAAAA,EACAoC,MAAOD,EACP,cAAe/B,EACfL,UAAW8C,EAAGC,EAAOC,WAAYD,EAAOnC,GAAQmC,EAAOP,GAAgBN,EAAelC,GACtFD,IAAK8B,EACLR,KAAAA,GACGC,GAELpB,GAIR"}
+{"version":3,"file":"Typography.js","sources":["../../../../src/components/Typography/Typography.tsx"],"sourcesContent":["import React, { forwardRef, useRef, HTMLAttributes, useContext } from \"react\";\nimport cx from \"classnames\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport VibeComponent from \"../../types/VibeComponent\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport { ElementContent } from \"../../types\";\nimport { TypographyAlign, TypographyColor } from \"./Typography.types\";\nimport { useEllipsisClass, useTooltipProps } from \"./TypographyHooks\";\nimport Tooltip, { TooltipProps } from \"../Tooltip/Tooltip\";\nimport { TypographyContext } from \"./utils/TypographyContext\";\nimport styles from \"./Typography.module.scss\";\n\nexport interface TypographyProps extends VibeComponentProps, HTMLAttributes<HTMLElement> {\n  /**\n   * The HTML element tag used for the text component.\n   */\n  element?: string;\n  /**\n   * The content inside the typography component.\n   */\n  children: ElementContent;\n  /**\n   * The text color.\n   */\n  color?: TypographyColor;\n  /**\n   * The text alignment.\n   */\n  align?: TypographyAlign;\n  /**\n   * If true, truncates overflowing text with an ellipsis.\n   */\n  ellipsis?: boolean;\n  /**\n   * The maximum number of lines before truncating with an ellipsis.\n   */\n  maxLines?: number;\n  /**\n   * Props passed to the tooltip displayed when hovering over the text.\n   */\n  tooltipProps?: Partial<TooltipProps>;\n  /**\n   * If true, disables the tooltip that appears when text is truncated.\n   */\n  withoutTooltip?: boolean;\n}\n\nconst Typography: VibeComponent<TypographyProps, HTMLElement> = forwardRef(\n  (\n    {\n      className,\n      id,\n      children,\n      tooltipProps,\n      \"data-testid\": dataTestId = getTestId(ComponentDefaultTestId.TEXT, id),\n      element = \"span\",\n      color = \"primary\",\n      align = \"start\",\n      ellipsis = true,\n      maxLines = 1,\n      withoutTooltip = false,\n      role,\n      ...htmlAttributes\n    }: TypographyProps,\n    ref\n  ) => {\n    const { overflowTolerance } = useContext(TypographyContext);\n    const componentRef = useRef(null);\n    const mergedRef = useMergeRef(ref, componentRef);\n    const ignoreHeightOverflow = maxLines === 1;\n    const { class: ellipsisClass, style: ellipsisStyle } = useEllipsisClass(ellipsis, maxLines);\n    const overrideTooltipProps = useTooltipProps(\n      componentRef,\n      withoutTooltip,\n      ellipsis,\n      tooltipProps,\n      children,\n      ignoreHeightOverflow,\n      overflowTolerance\n    ) as TooltipProps;\n\n    const overrideAlign = align === \"inherit\" ? \"alignInherit\" : align;\n\n    return (\n      <Tooltip {...overrideTooltipProps}>\n        {React.createElement(\n          element,\n          {\n            id,\n            style: ellipsisStyle,\n            \"data-testid\": dataTestId,\n            className: cx(styles.typography, styles[color], styles[overrideAlign], ellipsisClass, className),\n            ref: mergedRef,\n            role,\n            ...htmlAttributes\n          },\n          children\n        )}\n      </Tooltip>\n    );\n  }\n);\n\nexport default Typography;\n"],"names":["Typography","forwardRef","_a","ref","className","id","children","tooltipProps","_a$dataTestid","dataTestId","getTestId","ComponentDefaultTestId","TEXT","_a$element","element","_a$color","color","_a$align","align","_a$ellipsis","ellipsis","_a$maxLines","maxLines","_a$withoutTooltip","withoutTooltip","role","htmlAttributes","__rest","overflowTolerance","useContext","TypographyContext","componentRef","useRef","mergedRef","useMergeRef","ignoreHeightOverflow","_useEllipsisClass","useEllipsisClass","ellipsisClass","class","ellipsisStyle","style","overrideTooltipProps","useTooltipProps","overrideAlign","React","createElement","Tooltip","Object","assign","cx","styles","typography"],"mappings":"8gBAiDMA,IAAAA,EAA0DC,GAC9D,SACEC,EAeAC,OAdEC,IAAAA,UACAC,IAAAA,GACAC,IAAAA,SACAC,IAAAA,aAAYC,IACZ,eAAeC,OAAaC,IAAHF,EAAGE,EAAUC,EAAuBC,KAAMP,GAAGG,EAAAK,IACtEC,QAAAA,OAAU,IAAHD,EAAG,OAAMA,EAAAE,IAChBC,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EAAAE,IACjBC,MAAAA,OAAQ,IAAHD,EAAG,QAAOA,EAAAE,IACfC,SAAAA,OAAW,IAAHD,GAAOA,EAAAE,IACfC,SAAAA,OAAW,IAAHD,EAAG,EAACA,EAAAE,IACZC,eAAAA,OAAiB,IAAHD,GAAQA,EACtBE,IAAAA,KACGC,EAbLC,EAAAzB,EAAA,CAAA,YAAA,KAAA,WAAA,eAAA,cAAA,UAAA,QAAA,QAAA,WAAA,WAAA,iBAAA,SAiBQ0B,EAAsBC,EAAWC,GAAjCF,kBACFG,EAAeC,EAAO,MACtBC,EAAYC,EAAY/B,EAAK4B,GAC7BI,EAAoC,IAAbb,EAC7Bc,EAAuDC,EAAiBjB,EAAUE,GAAnEgB,EAAaF,EAApBG,MAA6BC,EAAaJ,EAApBK,MACxBC,EAAuBC,EAC3BZ,EACAP,EACAJ,EACAb,EACAD,EACA6B,EACAP,GAGIgB,EAA0B,YAAV1B,EAAsB,eAAiBA,EAE7D,OACE2B,EAACC,cAAAC,EAAYC,OAAAC,OAAA,CAAA,EAAAP,GACVG,EAAMC,cACLhC,EAEEkC,OAAAC,OAAA,CAAA5C,GAAAA,EACAoC,MAAOD,EACP,cAAe/B,EACfL,UAAW8C,EAAGC,EAAOC,WAAYD,EAAOnC,GAAQmC,EAAOP,GAAgBN,EAAelC,GACtFD,IAAK8B,EACLR,KAAAA,GACGC,GAELpB,GAIR"}

package/dist/src/components/VirtualizedGrid/VirtualizedGrid.js.map

@@ -1 +1 @@
-{"version":3,"file":"VirtualizedGrid.js","sources":["../../../../src/components/VirtualizedGrid/VirtualizedGrid.tsx"],"sourcesContent":["import React, { CSSProperties, forwardRef, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport cx from \"classnames\";\nimport {\n  GridChildComponentProps,\n  GridOnScrollProps,\n  ScrollDirection,\n  VariableSizeGrid as Grid,\n  GridOnItemsRenderedProps\n} from \"react-window\";\nimport AutoSizer from \"react-virtualized-auto-sizer\";\nimport {\n  getNormalizedItems,\n  getOnItemsRenderedData,\n  isLayoutDirectionScrollbarVisible\n} from \"../../services/virtualized-service\";\nimport usePrevious from \"../../hooks/usePrevious\";\nimport useThrottledCallback from \"../../hooks/useThrottledCallback\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport VibeComponentProps from \"src/types/VibeComponentProps\";\nimport { VibeComponent } from \"../../types\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport styles from \"./VirtualizedGrid.module.scss\";\nimport { VirtualizedGridItemType as ItemType } from \"./VirtualizedGrid.types\";\n\nexport interface VirtualizedGridProps extends VibeComponentProps {\n  /**\n   * A list of items to be rendered\n   * {\n   *      item: ItemType,\n   *     index: number,\n   *     style: CSSProperties\n   * }[]\n   */\n  items: ItemType[];\n  /**\n   * item render function\n   * returns `JSX.Element`\n   */\n  itemRenderer: (item: ItemType, index: number, style: CSSProperties) => ItemType | GridChildComponentProps<ItemType>;\n  /**\n   * in order to calculate the number of rows to render in the grid, the component needs the height of the row\n   * return `number`\n   */\n  getRowHeight: () => number;\n  /**\n   * in order to calculate the number of columns to render in the grid, the component needs the width of the column\n   * return `number`\n   */\n  getColumnWidth: () => number;\n  /**\n   * returns Id of an items\n   * returns `string`\n   */\n  getItemId?: (item: ItemType, index: number) => string;\n  /**\n   * index of the item to scroll to\n   */\n  scrollToId?: number;\n  onScroll?: (horizontalScrollDirection: ScrollDirection, scrollTop: number, scrollUpdateWasRequested: boolean) => void;\n  /**\n   * callback to be called when the scroll is finished\n   */\n  onScrollToFinished?: () => void;\n  /**\n   * a callback that is being called when the items are rendered\n   */\n  onItemsRendered?: ({\n    firstItemId,\n    secondItemId,\n    lastItemId,\n    centerItemId,\n    firstItemOffsetEnd,\n    currentOffsetTop\n  }: {\n    firstItemId: string;\n    secondItemId: string;\n    lastItemId: string;\n    centerItemId: string;\n    firstItemOffsetEnd: number;\n    currentOffsetTop: number;\n  }) => void;\n  onItemsRenderedThrottleMs?: number;\n  /**\n   * when the grid size changes\n   */\n  onSizeUpdate?: (width: number, height: number) => void;\n  onVerticalScrollbarVisiblityChange?: (value: boolean) => void;\n  /**\n   * class name to add to the component scrollable container\n   */\n  scrollableClassName?: string;\n}\n\nconst VirtualizedGrid: VibeComponent<VirtualizedGridProps> = forwardRef(\n  (\n    {\n      className,\n      id,\n      items = [],\n      itemRenderer = (item: ItemType, _index: number, _style: CSSProperties) => item,\n      getRowHeight = () => 50,\n      getColumnWidth = () => 100,\n      getItemId = (item: ItemType, _index: number) => item.id,\n      onScroll,\n      scrollToId = null,\n      onScrollToFinished = NOOP,\n      onItemsRendered = null,\n      onItemsRenderedThrottleMs = 200,\n      onSizeUpdate = NOOP,\n      onVerticalScrollbarVisiblityChange = null,\n      scrollableClassName,\n      \"data-testid\": dataTestId\n    }: VirtualizedGridProps,\n    ref\n  ) => {\n    // states\n    const [gridHeight, setGridHeight] = useState(0);\n    const [gridWidth, setGridWidth] = useState(0);\n\n    // prevs\n    const prevScrollToId = usePrevious(scrollToId);\n\n    // Refs\n    const componentRef = useRef(null);\n    const isVerticalScrollbarVisibleRef = useRef(null);\n    const gridRef = useRef(null);\n    const scrollTopRef = useRef(0);\n    const animationDataRef = useRef({\n      scrollOffsetInitial: 0,\n      scrollOffsetFinal: 0,\n      animationStartTime: 0\n    });\n    const mergedRef = useMergeRef(ref, componentRef);\n\n    const animationData = animationDataRef.current;\n\n    // Callbacks\n    const heightGetter = useCallback(\n      (item: ItemType) => {\n        const height = getRowHeight();\n        if (!height || Number.isNaN(height)) {\n          console.error(\"Couldn't get height for item: \", item);\n        }\n        return height;\n      },\n      [getRowHeight]\n    );\n\n    const idGetter = useCallback(\n      (item: ItemType, index: number) => {\n        const itemId = getItemId(item, index);\n        if (itemId === undefined) {\n          console.error(\"Couldn't get id for item: \", item);\n        }\n        return itemId;\n      },\n      [getItemId]\n    );\n\n    // Memos\n    // Creates object of itemId => { item, index, height, offsetTop}\n    const normalizedItems = useMemo(() => {\n      return getNormalizedItems(items, idGetter, heightGetter);\n    }, [items, idGetter, heightGetter]);\n\n    const calcColumnCount = useMemo(() => {\n      return Math.min(items.length, Math.floor(gridWidth / getColumnWidth()));\n    }, [items, gridWidth, getColumnWidth]);\n\n    const calcRowCount = useMemo(() => {\n      return calcColumnCount > 0 ? Math.ceil(items.length / calcColumnCount) : 0;\n    }, [items, calcColumnCount]);\n\n    const scrollToColumnIndex = useMemo(() => {\n      return scrollToId % calcColumnCount;\n    }, [scrollToId, calcColumnCount]);\n\n    const scrollToRowIndex = useMemo(() => {\n      return Math.floor(scrollToId / calcColumnCount);\n    }, [scrollToId, calcColumnCount]);\n\n    // Callbacks\n    const onScrollCB = useCallback(\n      ({ horizontalScrollDirection, scrollTop, scrollUpdateWasRequested }: GridOnScrollProps) => {\n        scrollTopRef.current = scrollTop;\n        if (!scrollUpdateWasRequested) {\n          animationData.scrollOffsetInitial = scrollTop;\n        }\n        onScroll && onScroll(horizontalScrollDirection, scrollTop, scrollUpdateWasRequested);\n      },\n      [onScroll, scrollTopRef, animationData]\n    );\n\n    const cellRenderer = useCallback(\n      ({ columnIndex, rowIndex, style }: { columnIndex: number; rowIndex: number; style: CSSProperties }) => {\n        const index = rowIndex * calcColumnCount + columnIndex;\n        const item = items[index];\n        return itemRenderer(item, index, style);\n      },\n      [items, itemRenderer, calcColumnCount]\n    );\n\n    const updateGridSize = useCallback(\n      (width: number, height: number) => {\n        if (height !== gridHeight || width !== gridWidth) {\n          setTimeout(() => {\n            setGridHeight(height);\n            setGridWidth(width);\n            onSizeUpdate(width, height);\n          }, 0);\n        }\n      },\n      [gridHeight, gridWidth, onSizeUpdate]\n    );\n\n    const onItemsRenderedCB = useThrottledCallback(\n      ({ visibleRowStartIndex, visibleRowStopIndex }: GridOnItemsRenderedProps) => {\n        if (!onItemsRendered) return;\n        const data = getOnItemsRenderedData(\n          items,\n          normalizedItems,\n          idGetter,\n          visibleRowStartIndex,\n          visibleRowStopIndex,\n          gridHeight,\n          scrollTopRef.current\n        );\n        onItemsRendered(data);\n      },\n      { wait: onItemsRenderedThrottleMs, trailing: true },\n      [onItemsRendered, items, normalizedItems, idGetter, gridHeight]\n    );\n\n    // Effects\n    useEffect(() => {\n      // scroll to specific item\n      if (scrollToId && prevScrollToId !== scrollToId) {\n        gridRef.current.scrollToItem({\n          align: \"center\",\n          columnIndex: scrollToColumnIndex,\n          rowIndex: scrollToRowIndex\n        });\n        onScrollToFinished();\n      }\n    }, [scrollToId, prevScrollToId, gridRef, scrollToColumnIndex, scrollToRowIndex, onScrollToFinished]);\n\n    useEffect(() => {\n      // recalculate row heights\n      if (gridRef.current) {\n        gridRef.current.resetAfterIndices({ columnIndex: 0, rowIndex: 0 });\n      }\n    }, [normalizedItems]);\n\n    useEffect(() => {\n      // update vertical scrollbar visibility\n      if (onVerticalScrollbarVisiblityChange) {\n        const isVisible = isLayoutDirectionScrollbarVisible(items, normalizedItems, idGetter, gridHeight);\n        if (isVerticalScrollbarVisibleRef.current !== isVisible) {\n          isVerticalScrollbarVisibleRef.current = isVisible;\n          onVerticalScrollbarVisiblityChange(isVisible);\n        }\n      }\n    }, [onVerticalScrollbarVisiblityChange, items, normalizedItems, gridHeight, idGetter]);\n\n    return (\n      <div\n        ref={mergedRef}\n        className={cx(styles.virtualizedGridWrapper, className)}\n        id={id}\n        data-testid={dataTestId || getTestId(ComponentDefaultTestId.VIRTUALIZED_GRID, id)}\n      >\n        <AutoSizer>\n          {({ height, width }: { height: number; width: number }) => {\n            updateGridSize(width, height);\n            return (\n              <Grid\n                ref={gridRef}\n                height={height}\n                width={width}\n                columnWidth={getColumnWidth}\n                columnCount={calcColumnCount}\n                rowHeight={getRowHeight}\n                rowCount={calcRowCount}\n                onScroll={onScrollCB}\n                onItemsRendered={onItemsRenderedCB}\n                className={scrollableClassName}\n              >\n                {cellRenderer as unknown as VibeComponent<GridChildComponentProps>}\n              </Grid>\n            );\n          }}\n        </AutoSizer>\n      </div>\n    );\n  }\n);\n\nexport default VirtualizedGrid;\n"],"names":["VirtualizedGrid","forwardRef","_ref","ref","className","id","_ref$items","items","_ref$itemRenderer","itemRenderer","item","_index","_style","_ref$getRowHeight","getRowHeight","_ref$getColumnWidth","getColumnWidth","_ref$getItemId","getItemId","onScroll","_ref$scrollToId","scrollToId","_ref$onScrollToFinish","onScrollToFinished","NOOP","_ref$onItemsRendered","onItemsRendered","_ref$onItemsRenderedT","onItemsRenderedThrottleMs","_ref$onSizeUpdate","onSizeUpdate","_ref$onVerticalScroll","onVerticalScrollbarVisiblityChange","scrollableClassName","dataTestId","_useState","useState","_useState2","_slicedToArray","gridHeight","setGridHeight","_useState3","_useState4","gridWidth","setGridWidth","prevScrollToId","usePrevious","componentRef","useRef","isVerticalScrollbarVisibleRef","gridRef","scrollTopRef","animationDataRef","scrollOffsetInitial","scrollOffsetFinal","animationStartTime","mergedRef","useMergeRef","animationData","current","heightGetter","useCallback","height","Number","isNaN","console","error","idGetter","index","itemId","undefined","normalizedItems","useMemo","getNormalizedItems","calcColumnCount","Math","min","length","floor","calcRowCount","ceil","scrollToColumnIndex","scrollToRowIndex","onScrollCB","_ref2","horizontalScrollDirection","scrollTop","scrollUpdateWasRequested","cellRenderer","_ref3","rowIndex","columnIndex","style","updateGridSize","width","setTimeout","onItemsRenderedCB","useThrottledCallback","_ref4","data","getOnItemsRenderedData","visibleRowStartIndex","visibleRowStopIndex","wait","trailing","useEffect","scrollToItem","align","resetAfterIndices","isVisible","isLayoutDirectionScrollbarVisible","React","createElement","cx","styles","virtualizedGridWrapper","getTestId","ComponentDefaultTestId","VIRTUALIZED_GRID","AutoSizer","_ref5","Grid","columnWidth","columnCount","rowHeight","rowCount"],"mappings":"iwBA8FMA,IAAAA,EAAuDC,GAC3D,SAAAC,EAmBEC,GACE,IAlBAC,EAASF,EAATE,UACAC,EAAEH,EAAFG,GAAEC,EAAAJ,EACFK,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EAAAE,EAAAN,EACVO,aAAAA,OAAe,IAAHD,EAAG,SAACE,EAAgBC,EAAgBC,GAAqB,OAAKF,CAAI,EAAAF,EAAAK,EAAAX,EAC9EY,aAAAA,OAAe,IAAHD,EAAG,WAAA,OAAM,EAAE,EAAAA,EAAAE,EAAAb,EACvBc,eAAAA,OAAiB,IAAHD,EAAG,WAAA,OAAM,GAAG,EAAAA,EAAAE,EAAAf,EAC1BgB,UAAAA,OAAS,IAAAD,EAAG,SAACP,EAAgBC,GAAc,OAAKD,EAAKL,EAAE,EAAAY,EACvDE,EAAQjB,EAARiB,SAAQC,EAAAlB,EACRmB,WAAAA,OAAa,IAAHD,EAAG,KAAIA,EAAAE,EAAApB,EACjBqB,mBAAAA,OAAqBC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAvB,EACzBwB,gBAAAA,OAAkB,IAAHD,EAAG,KAAIA,EAAAE,EAAAzB,EACtB0B,0BAAAA,OAA4B,IAAHD,EAAG,IAAGA,EAAAE,EAAA3B,EAC/B4B,aAAAA,OAAeN,IAAHK,EAAGL,EAAIK,EAAAE,EAAA7B,EACnB8B,mCAAAA,OAAqC,IAAHD,EAAG,KAAIA,EACzCE,EAAmB/B,EAAnB+B,oBACeC,EAAUhC,EAAzB,eAKFiC,EAAoCC,EAAS,GAAEC,EAAAC,EAAAH,EAAA,GAAxCI,EAAUF,EAAA,GAAEG,EAAaH,EAAA,GAChCI,EAAkCL,EAAS,GAAEM,GAAAJ,EAAAG,EAAA,GAAtCE,GAASD,GAAA,GAAEE,GAAYF,GAAA,GAGxBG,GAAiBC,EAAYzB,GAG7B0B,GAAeC,EAAO,MACtBC,GAAgCD,EAAO,MACvCE,GAAUF,EAAO,MACjBG,GAAeH,EAAO,GACtBI,GAAmBJ,EAAO,CAC9BK,oBAAqB,EACrBC,kBAAmB,EACnBC,mBAAoB,IAEhBC,GAAYC,EAAYtD,EAAK4C,IAE7BW,GAAgBN,GAAiBO,QAGjCC,GAAeC,GACnB,SAACnD,GACC,IAAMoD,EAAShD,IAIf,OAHKgD,IAAUC,OAAOC,MAAMF,IAC1BG,QAAQC,MAAM,iCAAkCxD,GAE3CoD,CACT,GACA,CAAChD,IAGGqD,GAAWN,GACf,SAACnD,EAAgB0D,GACf,IAAMC,EAASnD,EAAUR,EAAM0D,GAI/B,YAHeE,IAAXD,GACFJ,QAAQC,MAAM,6BAA8BxD,GAEvC2D,CACT,GACA,CAACnD,IAKGqD,GAAkBC,GAAQ,WAC9B,OAAOC,EAAmBlE,EAAO4D,GAAUP,GAC5C,GAAE,CAACrD,EAAO4D,GAAUP,KAEfc,GAAkBF,GAAQ,WAC9B,OAAOG,KAAKC,IAAIrE,EAAMsE,OAAQF,KAAKG,MAAMnC,GAAY3B,KACtD,GAAE,CAACT,EAAOoC,GAAW3B,IAEhB+D,GAAeP,GAAQ,WAC3B,OAAOE,GAAkB,EAAIC,KAAKK,KAAKzE,EAAMsE,OAASH,IAAmB,CAC3E,GAAG,CAACnE,EAAOmE,KAELO,GAAsBT,GAAQ,WAClC,OAAOnD,EAAaqD,EACtB,GAAG,CAACrD,EAAYqD,KAEVQ,GAAmBV,GAAQ,WAC/B,OAAOG,KAAKG,MAAMzD,EAAaqD,GACjC,GAAG,CAACrD,EAAYqD,KAGVS,GAAatB,GACjB,SAAAuB,GAA0F,IAAvFC,EAAyBD,EAAzBC,0BAA2BC,EAASF,EAATE,UAAWC,EAAwBH,EAAxBG,yBACvCpC,GAAaQ,QAAU2B,EAClBC,IACH7B,GAAcL,oBAAsBiC,GAEtCnE,GAAYA,EAASkE,EAA2BC,EAAWC,EAC5D,GACD,CAACpE,EAAUgC,GAAcO,KAGrB8B,GAAe3B,GACnB,SAAA4B,GAAsG,IAC9FrB,EADgBqB,EAARC,SACWhB,GADbe,EAAXE,YAGD,OAAOlF,EADMF,EAAM6D,GACOA,EAHGqB,EAALG,MAIzB,GACD,CAACrF,EAAOE,EAAciE,KAGlBmB,GAAiBhC,GACrB,SAACiC,EAAehC,GACVA,IAAWvB,GAAcuD,IAAUnD,IACrCoD,YAAW,WACTvD,EAAcsB,GACdlB,GAAakD,GACbhE,EAAagE,EAAOhC,EACrB,GAAE,EAEN,GACD,CAACvB,EAAYI,GAAWb,IAGpBkE,GAAoBC,GACxB,SAAAC,GACE,GAAKxE,EAAL,CACA,IAAMyE,EAAOC,EACX7F,EACAgE,GACAJ,GALmB+B,EAApBG,qBAAyCH,EAAnBI,oBAQrB/D,EACAY,GAAaQ,SAEfjC,EAAgByE,EAVM,CAWxB,GACA,CAAEI,KAAM3E,EAA2B4E,UAAU,GAC7C,CAAC9E,EAAiBnB,EAAOgE,GAAiBJ,GAAU5B,IAkCtD,OA9BAkE,GAAU,WAEJpF,GAAcwB,KAAmBxB,IACnC6B,GAAQS,QAAQ+C,aAAa,CAC3BC,MAAO,SACPhB,YAAaV,GACbS,SAAUR,KAEZ3D,IAEJ,GAAG,CAACF,EAAYwB,GAAgBK,GAAS+B,GAAqBC,GAAkB3D,IAEhFkF,GAAU,WAEJvD,GAAQS,SACVT,GAAQS,QAAQiD,kBAAkB,CAAEjB,YAAa,EAAGD,SAAU,GAElE,GAAG,CAACnB,KAEJkC,GAAU,WAER,GAAIzE,EAAoC,CACtC,IAAM6E,EAAYC,EAAkCvG,EAAOgE,GAAiBJ,GAAU5B,GAClFU,GAA8BU,UAAYkD,IAC5C5D,GAA8BU,QAAUkD,EACxC7E,EAAmC6E,GAEtC,CACH,GAAG,CAAC7E,EAAoCzB,EAAOgE,GAAiBhC,EAAY4B,KAG1E4C,EAAAC,cAAA,MAAA,CACE7G,IAAKqD,GACLpD,UAAW6G,EAAGC,EAAOC,uBAAwB/G,GAC7CC,GAAIA,EAAE,cACO6B,GAAckF,EAAUC,EAAuBC,iBAAkBjH,IAE9E0G,EAACC,cAAAO,QACE,SAAAC,GAAyD,IAAtD1D,EAAM0D,EAAN1D,OAAQgC,EAAK0B,EAAL1B,MAEV,OADAD,GAAeC,EAAOhC,GAEpBiD,gBAACU,EAAI,CACHtH,IAAK+C,GACLY,OAAQA,EACRgC,MAAOA,EACP4B,YAAa1G,EACb2G,YAAajD,GACbkD,UAAW9G,EACX+G,SAAU9C,GACV5D,SAAUgE,GACVzD,gBAAiBsE,GACjB5F,UAAW6B,GAEVuD,GAGN,IAIT"}
+{"version":3,"file":"VirtualizedGrid.js","sources":["../../../../src/components/VirtualizedGrid/VirtualizedGrid.tsx"],"sourcesContent":["import React, { CSSProperties, forwardRef, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport cx from \"classnames\";\nimport {\n  GridChildComponentProps,\n  GridOnScrollProps,\n  ScrollDirection,\n  VariableSizeGrid as Grid,\n  GridOnItemsRenderedProps\n} from \"react-window\";\nimport AutoSizer from \"react-virtualized-auto-sizer\";\nimport {\n  getNormalizedItems,\n  getOnItemsRenderedData,\n  isLayoutDirectionScrollbarVisible\n} from \"../../services/virtualized-service\";\nimport usePrevious from \"../../hooks/usePrevious\";\nimport useThrottledCallback from \"../../hooks/useThrottledCallback\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport VibeComponentProps from \"src/types/VibeComponentProps\";\nimport { VibeComponent } from \"../../types\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport styles from \"./VirtualizedGrid.module.scss\";\nimport { VirtualizedGridItemType as ItemType } from \"./VirtualizedGrid.types\";\n\nexport interface VirtualizedGridProps extends VibeComponentProps {\n  /**\n   * The list of items to be rendered in the grid.\n   */\n  items: ItemType[];\n  /**\n   * Function that renders each item in the grid.\n   */\n  itemRenderer: (item: ItemType, index: number, style: CSSProperties) => ItemType | GridChildComponentProps<ItemType>;\n  /**\n   * Function that returns the row height.\n   */\n  getRowHeight: () => number;\n  /**\n   * Function that returns the column width.\n   */\n  getColumnWidth: () => number;\n  /**\n   * Function that returns the unique ID of an item.\n   */\n  getItemId?: (item: ItemType, index: number) => string;\n  /**\n   * The index of the item to scroll to.\n   */\n  scrollToId?: number;\n  /**\n   * Callback fired when the grid is scrolled.\n   */\n  onScroll?: (horizontalScrollDirection: ScrollDirection, scrollTop: number, scrollUpdateWasRequested: boolean) => void;\n  /**\n   * Callback fired when scrolling has finished.\n   */\n  onScrollToFinished?: () => void;\n  /**\n   * Callback fired when items are rendered in the grid.\n   */\n  onItemsRendered?: ({\n    firstItemId,\n    secondItemId,\n    lastItemId,\n    centerItemId,\n    firstItemOffsetEnd,\n    currentOffsetTop\n  }: {\n    firstItemId: string;\n    secondItemId: string;\n    lastItemId: string;\n    centerItemId: string;\n    firstItemOffsetEnd: number;\n    currentOffsetTop: number;\n  }) => void;\n  /**\n   * The delay (in ms) for throttling the `onItemsRendered` callback.\n   */\n  onItemsRenderedThrottleMs?: number;\n  /**\n   * Callback fired when the grid size is updated.\n   */\n  onSizeUpdate?: (width: number, height: number) => void;\n  /**\n   * Callback fired when the vertical scrollbar visibility changes.\n   */\n  onVerticalScrollbarVisiblityChange?: (value: boolean) => void;\n  /**\n   * Class name applied to the scrollable container.\n   */\n  scrollableClassName?: string;\n}\n\nconst VirtualizedGrid: VibeComponent<VirtualizedGridProps> = forwardRef(\n  (\n    {\n      className,\n      id,\n      items = [],\n      itemRenderer = (item: ItemType, _index: number, _style: CSSProperties) => item,\n      getRowHeight = () => 50,\n      getColumnWidth = () => 100,\n      getItemId = (item: ItemType, _index: number) => item.id,\n      onScroll,\n      scrollToId = null,\n      onScrollToFinished = NOOP,\n      onItemsRendered = null,\n      onItemsRenderedThrottleMs = 200,\n      onSizeUpdate = NOOP,\n      onVerticalScrollbarVisiblityChange = null,\n      scrollableClassName,\n      \"data-testid\": dataTestId\n    }: VirtualizedGridProps,\n    ref\n  ) => {\n    // states\n    const [gridHeight, setGridHeight] = useState(0);\n    const [gridWidth, setGridWidth] = useState(0);\n\n    // prevs\n    const prevScrollToId = usePrevious(scrollToId);\n\n    // Refs\n    const componentRef = useRef(null);\n    const isVerticalScrollbarVisibleRef = useRef(null);\n    const gridRef = useRef(null);\n    const scrollTopRef = useRef(0);\n    const animationDataRef = useRef({\n      scrollOffsetInitial: 0,\n      scrollOffsetFinal: 0,\n      animationStartTime: 0\n    });\n    const mergedRef = useMergeRef(ref, componentRef);\n\n    const animationData = animationDataRef.current;\n\n    // Callbacks\n    const heightGetter = useCallback(\n      (item: ItemType) => {\n        const height = getRowHeight();\n        if (!height || Number.isNaN(height)) {\n          console.error(\"Couldn't get height for item: \", item);\n        }\n        return height;\n      },\n      [getRowHeight]\n    );\n\n    const idGetter = useCallback(\n      (item: ItemType, index: number) => {\n        const itemId = getItemId(item, index);\n        if (itemId === undefined) {\n          console.error(\"Couldn't get id for item: \", item);\n        }\n        return itemId;\n      },\n      [getItemId]\n    );\n\n    // Memos\n    // Creates object of itemId => { item, index, height, offsetTop}\n    const normalizedItems = useMemo(() => {\n      return getNormalizedItems(items, idGetter, heightGetter);\n    }, [items, idGetter, heightGetter]);\n\n    const calcColumnCount = useMemo(() => {\n      return Math.min(items.length, Math.floor(gridWidth / getColumnWidth()));\n    }, [items, gridWidth, getColumnWidth]);\n\n    const calcRowCount = useMemo(() => {\n      return calcColumnCount > 0 ? Math.ceil(items.length / calcColumnCount) : 0;\n    }, [items, calcColumnCount]);\n\n    const scrollToColumnIndex = useMemo(() => {\n      return scrollToId % calcColumnCount;\n    }, [scrollToId, calcColumnCount]);\n\n    const scrollToRowIndex = useMemo(() => {\n      return Math.floor(scrollToId / calcColumnCount);\n    }, [scrollToId, calcColumnCount]);\n\n    // Callbacks\n    const onScrollCB = useCallback(\n      ({ horizontalScrollDirection, scrollTop, scrollUpdateWasRequested }: GridOnScrollProps) => {\n        scrollTopRef.current = scrollTop;\n        if (!scrollUpdateWasRequested) {\n          animationData.scrollOffsetInitial = scrollTop;\n        }\n        onScroll && onScroll(horizontalScrollDirection, scrollTop, scrollUpdateWasRequested);\n      },\n      [onScroll, scrollTopRef, animationData]\n    );\n\n    const cellRenderer = useCallback(\n      ({ columnIndex, rowIndex, style }: { columnIndex: number; rowIndex: number; style: CSSProperties }) => {\n        const index = rowIndex * calcColumnCount + columnIndex;\n        const item = items[index];\n        return itemRenderer(item, index, style);\n      },\n      [items, itemRenderer, calcColumnCount]\n    );\n\n    const updateGridSize = useCallback(\n      (width: number, height: number) => {\n        if (height !== gridHeight || width !== gridWidth) {\n          setTimeout(() => {\n            setGridHeight(height);\n            setGridWidth(width);\n            onSizeUpdate(width, height);\n          }, 0);\n        }\n      },\n      [gridHeight, gridWidth, onSizeUpdate]\n    );\n\n    const onItemsRenderedCB = useThrottledCallback(\n      ({ visibleRowStartIndex, visibleRowStopIndex }: GridOnItemsRenderedProps) => {\n        if (!onItemsRendered) return;\n        const data = getOnItemsRenderedData(\n          items,\n          normalizedItems,\n          idGetter,\n          visibleRowStartIndex,\n          visibleRowStopIndex,\n          gridHeight,\n          scrollTopRef.current\n        );\n        onItemsRendered(data);\n      },\n      { wait: onItemsRenderedThrottleMs, trailing: true },\n      [onItemsRendered, items, normalizedItems, idGetter, gridHeight]\n    );\n\n    // Effects\n    useEffect(() => {\n      // scroll to specific item\n      if (scrollToId && prevScrollToId !== scrollToId) {\n        gridRef.current.scrollToItem({\n          align: \"center\",\n          columnIndex: scrollToColumnIndex,\n          rowIndex: scrollToRowIndex\n        });\n        onScrollToFinished();\n      }\n    }, [scrollToId, prevScrollToId, gridRef, scrollToColumnIndex, scrollToRowIndex, onScrollToFinished]);\n\n    useEffect(() => {\n      // recalculate row heights\n      if (gridRef.current) {\n        gridRef.current.resetAfterIndices({ columnIndex: 0, rowIndex: 0 });\n      }\n    }, [normalizedItems]);\n\n    useEffect(() => {\n      // update vertical scrollbar visibility\n      if (onVerticalScrollbarVisiblityChange) {\n        const isVisible = isLayoutDirectionScrollbarVisible(items, normalizedItems, idGetter, gridHeight);\n        if (isVerticalScrollbarVisibleRef.current !== isVisible) {\n          isVerticalScrollbarVisibleRef.current = isVisible;\n          onVerticalScrollbarVisiblityChange(isVisible);\n        }\n      }\n    }, [onVerticalScrollbarVisiblityChange, items, normalizedItems, gridHeight, idGetter]);\n\n    return (\n      <div\n        ref={mergedRef}\n        className={cx(styles.virtualizedGridWrapper, className)}\n        id={id}\n        data-testid={dataTestId || getTestId(ComponentDefaultTestId.VIRTUALIZED_GRID, id)}\n      >\n        <AutoSizer>\n          {({ height, width }: { height: number; width: number }) => {\n            updateGridSize(width, height);\n            return (\n              <Grid\n                ref={gridRef}\n                height={height}\n                width={width}\n                columnWidth={getColumnWidth}\n                columnCount={calcColumnCount}\n                rowHeight={getRowHeight}\n                rowCount={calcRowCount}\n                onScroll={onScrollCB}\n                onItemsRendered={onItemsRenderedCB}\n                className={scrollableClassName}\n              >\n                {cellRenderer as unknown as VibeComponent<GridChildComponentProps>}\n              </Grid>\n            );\n          }}\n        </AutoSizer>\n      </div>\n    );\n  }\n);\n\nexport default VirtualizedGrid;\n"],"names":["VirtualizedGrid","forwardRef","_ref","ref","className","id","_ref$items","items","_ref$itemRenderer","itemRenderer","item","_index","_style","_ref$getRowHeight","getRowHeight","_ref$getColumnWidth","getColumnWidth","_ref$getItemId","getItemId","onScroll","_ref$scrollToId","scrollToId","_ref$onScrollToFinish","onScrollToFinished","NOOP","_ref$onItemsRendered","onItemsRendered","_ref$onItemsRenderedT","onItemsRenderedThrottleMs","_ref$onSizeUpdate","onSizeUpdate","_ref$onVerticalScroll","onVerticalScrollbarVisiblityChange","scrollableClassName","dataTestId","_useState","useState","_useState2","_slicedToArray","gridHeight","setGridHeight","_useState3","_useState4","gridWidth","setGridWidth","prevScrollToId","usePrevious","componentRef","useRef","isVerticalScrollbarVisibleRef","gridRef","scrollTopRef","animationDataRef","scrollOffsetInitial","scrollOffsetFinal","animationStartTime","mergedRef","useMergeRef","animationData","current","heightGetter","useCallback","height","Number","isNaN","console","error","idGetter","index","itemId","undefined","normalizedItems","useMemo","getNormalizedItems","calcColumnCount","Math","min","length","floor","calcRowCount","ceil","scrollToColumnIndex","scrollToRowIndex","onScrollCB","_ref2","horizontalScrollDirection","scrollTop","scrollUpdateWasRequested","cellRenderer","_ref3","rowIndex","columnIndex","style","updateGridSize","width","setTimeout","onItemsRenderedCB","useThrottledCallback","_ref4","data","getOnItemsRenderedData","visibleRowStartIndex","visibleRowStopIndex","wait","trailing","useEffect","scrollToItem","align","resetAfterIndices","isVisible","isLayoutDirectionScrollbarVisible","React","createElement","cx","styles","virtualizedGridWrapper","getTestId","ComponentDefaultTestId","VIRTUALIZED_GRID","AutoSizer","_ref5","Grid","columnWidth","columnCount","rowHeight","rowCount"],"mappings":"iwBA8FMA,IAAAA,EAAuDC,GAC3D,SAAAC,EAmBEC,GACE,IAlBAC,EAASF,EAATE,UACAC,EAAEH,EAAFG,GAAEC,EAAAJ,EACFK,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EAAAE,EAAAN,EACVO,aAAAA,OAAe,IAAHD,EAAG,SAACE,EAAgBC,EAAgBC,GAAqB,OAAKF,CAAI,EAAAF,EAAAK,EAAAX,EAC9EY,aAAAA,OAAe,IAAHD,EAAG,WAAA,OAAM,EAAE,EAAAA,EAAAE,EAAAb,EACvBc,eAAAA,OAAiB,IAAHD,EAAG,WAAA,OAAM,GAAG,EAAAA,EAAAE,EAAAf,EAC1BgB,UAAAA,OAAS,IAAAD,EAAG,SAACP,EAAgBC,GAAc,OAAKD,EAAKL,EAAE,EAAAY,EACvDE,EAAQjB,EAARiB,SAAQC,EAAAlB,EACRmB,WAAAA,OAAa,IAAHD,EAAG,KAAIA,EAAAE,EAAApB,EACjBqB,mBAAAA,OAAqBC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAvB,EACzBwB,gBAAAA,OAAkB,IAAHD,EAAG,KAAIA,EAAAE,EAAAzB,EACtB0B,0BAAAA,OAA4B,IAAHD,EAAG,IAAGA,EAAAE,EAAA3B,EAC/B4B,aAAAA,OAAeN,IAAHK,EAAGL,EAAIK,EAAAE,EAAA7B,EACnB8B,mCAAAA,OAAqC,IAAHD,EAAG,KAAIA,EACzCE,EAAmB/B,EAAnB+B,oBACeC,EAAUhC,EAAzB,eAKFiC,EAAoCC,EAAS,GAAEC,EAAAC,EAAAH,EAAA,GAAxCI,EAAUF,EAAA,GAAEG,EAAaH,EAAA,GAChCI,EAAkCL,EAAS,GAAEM,GAAAJ,EAAAG,EAAA,GAAtCE,GAASD,GAAA,GAAEE,GAAYF,GAAA,GAGxBG,GAAiBC,EAAYzB,GAG7B0B,GAAeC,EAAO,MACtBC,GAAgCD,EAAO,MACvCE,GAAUF,EAAO,MACjBG,GAAeH,EAAO,GACtBI,GAAmBJ,EAAO,CAC9BK,oBAAqB,EACrBC,kBAAmB,EACnBC,mBAAoB,IAEhBC,GAAYC,EAAYtD,EAAK4C,IAE7BW,GAAgBN,GAAiBO,QAGjCC,GAAeC,GACnB,SAACnD,GACC,IAAMoD,EAAShD,IAIf,OAHKgD,IAAUC,OAAOC,MAAMF,IAC1BG,QAAQC,MAAM,iCAAkCxD,GAE3CoD,CACT,GACA,CAAChD,IAGGqD,GAAWN,GACf,SAACnD,EAAgB0D,GACf,IAAMC,EAASnD,EAAUR,EAAM0D,GAI/B,YAHeE,IAAXD,GACFJ,QAAQC,MAAM,6BAA8BxD,GAEvC2D,CACT,GACA,CAACnD,IAKGqD,GAAkBC,GAAQ,WAC9B,OAAOC,EAAmBlE,EAAO4D,GAAUP,GAC5C,GAAE,CAACrD,EAAO4D,GAAUP,KAEfc,GAAkBF,GAAQ,WAC9B,OAAOG,KAAKC,IAAIrE,EAAMsE,OAAQF,KAAKG,MAAMnC,GAAY3B,KACtD,GAAE,CAACT,EAAOoC,GAAW3B,IAEhB+D,GAAeP,GAAQ,WAC3B,OAAOE,GAAkB,EAAIC,KAAKK,KAAKzE,EAAMsE,OAASH,IAAmB,CAC3E,GAAG,CAACnE,EAAOmE,KAELO,GAAsBT,GAAQ,WAClC,OAAOnD,EAAaqD,EACtB,GAAG,CAACrD,EAAYqD,KAEVQ,GAAmBV,GAAQ,WAC/B,OAAOG,KAAKG,MAAMzD,EAAaqD,GACjC,GAAG,CAACrD,EAAYqD,KAGVS,GAAatB,GACjB,SAAAuB,GAA0F,IAAvFC,EAAyBD,EAAzBC,0BAA2BC,EAASF,EAATE,UAAWC,EAAwBH,EAAxBG,yBACvCpC,GAAaQ,QAAU2B,EAClBC,IACH7B,GAAcL,oBAAsBiC,GAEtCnE,GAAYA,EAASkE,EAA2BC,EAAWC,EAC5D,GACD,CAACpE,EAAUgC,GAAcO,KAGrB8B,GAAe3B,GACnB,SAAA4B,GAAsG,IAC9FrB,EADgBqB,EAARC,SACWhB,GADbe,EAAXE,YAGD,OAAOlF,EADMF,EAAM6D,GACOA,EAHGqB,EAALG,MAIzB,GACD,CAACrF,EAAOE,EAAciE,KAGlBmB,GAAiBhC,GACrB,SAACiC,EAAehC,GACVA,IAAWvB,GAAcuD,IAAUnD,IACrCoD,YAAW,WACTvD,EAAcsB,GACdlB,GAAakD,GACbhE,EAAagE,EAAOhC,EACrB,GAAE,EAEN,GACD,CAACvB,EAAYI,GAAWb,IAGpBkE,GAAoBC,GACxB,SAAAC,GACE,GAAKxE,EAAL,CACA,IAAMyE,EAAOC,EACX7F,EACAgE,GACAJ,GALmB+B,EAApBG,qBAAyCH,EAAnBI,oBAQrB/D,EACAY,GAAaQ,SAEfjC,EAAgByE,EAVM,CAWxB,GACA,CAAEI,KAAM3E,EAA2B4E,UAAU,GAC7C,CAAC9E,EAAiBnB,EAAOgE,GAAiBJ,GAAU5B,IAkCtD,OA9BAkE,GAAU,WAEJpF,GAAcwB,KAAmBxB,IACnC6B,GAAQS,QAAQ+C,aAAa,CAC3BC,MAAO,SACPhB,YAAaV,GACbS,SAAUR,KAEZ3D,IAEJ,GAAG,CAACF,EAAYwB,GAAgBK,GAAS+B,GAAqBC,GAAkB3D,IAEhFkF,GAAU,WAEJvD,GAAQS,SACVT,GAAQS,QAAQiD,kBAAkB,CAAEjB,YAAa,EAAGD,SAAU,GAElE,GAAG,CAACnB,KAEJkC,GAAU,WAER,GAAIzE,EAAoC,CACtC,IAAM6E,EAAYC,EAAkCvG,EAAOgE,GAAiBJ,GAAU5B,GAClFU,GAA8BU,UAAYkD,IAC5C5D,GAA8BU,QAAUkD,EACxC7E,EAAmC6E,GAEtC,CACH,GAAG,CAAC7E,EAAoCzB,EAAOgE,GAAiBhC,EAAY4B,KAG1E4C,EAAAC,cAAA,MAAA,CACE7G,IAAKqD,GACLpD,UAAW6G,EAAGC,EAAOC,uBAAwB/G,GAC7CC,GAAIA,EAAE,cACO6B,GAAckF,EAAUC,EAAuBC,iBAAkBjH,IAE9E0G,EAACC,cAAAO,QACE,SAAAC,GAAyD,IAAtD1D,EAAM0D,EAAN1D,OAAQgC,EAAK0B,EAAL1B,MAEV,OADAD,GAAeC,EAAOhC,GAEpBiD,gBAACU,EAAI,CACHtH,IAAK+C,GACLY,OAAQA,EACRgC,MAAOA,EACP4B,YAAa1G,EACb2G,YAAajD,GACbkD,UAAW9G,EACX+G,SAAU9C,GACV5D,SAAUgE,GACVzD,gBAAiBsE,GACjB5F,UAAW6B,GAEVuD,GAGN,IAIT"}

package/dist/src/components/VirtualizedList/VirtualizedList.js.map

@@ -1 +1 @@
-{"version":3,"file":"VirtualizedList.js","sources":["../../../../src/components/VirtualizedList/VirtualizedList.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, {\n  CSSProperties,\n  ForwardedRef,\n  forwardRef,\n  LegacyRef,\n  ReactElement,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState\n} from \"react\";\nimport { noop as NOOP } from \"lodash-es\";\nimport {\n  ScrollDirection,\n  VariableSizeList as List,\n  ListOnItemsRenderedProps,\n  ListChildComponentProps,\n  VariableSizeList\n} from \"react-window\";\nimport AutoSizer from \"react-virtualized-auto-sizer\";\nimport usePrevious from \"../../hooks/usePrevious\";\nimport useThrottledCallback from \"../../hooks/useThrottledCallback\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport {\n  easeInOutQuint,\n  getMaxOffset,\n  getNormalizedItems,\n  getOnItemsRenderedData,\n  isLayoutDirectionScrollbarVisible\n} from \"../../services/virtualized-service\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport VibeComponentProps from \"src/types/VibeComponentProps\";\nimport VibeComponent from \"../../types/VibeComponent\";\nimport styles from \"./VirtualizedList.module.scss\";\nimport { VirtualizedListItem, VirtualizedListLayout, VirtualizedListScrollDirection } from \"./VirtualizedList.types\";\n\nexport interface VirtualizedListProps extends VibeComponentProps {\n  /**\n   * class name to add to the component scrollable container\n   */\n  scrollableClassName?: string;\n  /**\n   * Layout/orientation of the list.\n   * Acceptable values are:\n   * - \"vertical\" (default) - Up/down scrolling.\n   * - \"horizontal\" - Left/right scrolling.\n   */\n  layout?: VirtualizedListLayout;\n  /**\n   * A list of items to be rendered\n   */\n  items: VirtualizedListItem[];\n  /**\n   * Will return the element which represent an item in the virtualized list.\n   * Returns `JSX.Element`\n   * @param item - item data\n   * @param _index - item index\n   * @param style - item style, must be injected to the item element wrapper for correct presentation of the item\n   */\n  itemRenderer: (item: VirtualizedListItem, index: number, style: CSSProperties) => ReactElement | JSX.Element;\n  /**\n   * Deprecated - use getItemSize\n   * in order to calculate the number of items to render, the component needs the height of the items\n   * return `number`\n   */\n  getItemHeight?: (item: VirtualizedListItem, index: number) => number;\n  /**\n   * in order to calculate the number of items to render, the component needs the width/height of the items (according to layout)\n   * return `number`\n   */\n  getItemSize?: (item: VirtualizedListItem, index: number) => number;\n  /**\n   * returns Id of an items\n   * returns `string`\n   */\n  getItemId?: (item: VirtualizedListItem, index: number) => string;\n  /**\n   * callback to be called when the scroll is finished\n   */\n  onScrollToFinished?: () => void;\n  /**\n   * number of items to render (below/above the fold)\n   */\n  overscanCount?: number;\n  /**\n   * the speed of the scroll (in ms)\n   */\n  scrollDuration?: number;\n  /**\n   * a callback that is being called when the items are rendered\n   */\n  onItemsRendered?: ({\n    firstItemId,\n    secondItemId,\n    lastItemId,\n    centerItemId,\n    firstItemOffsetEnd,\n    currentOffsetTop\n  }: {\n    firstItemId: string;\n    secondItemId: string;\n    lastItemId: string;\n    centerItemId: string;\n    firstItemOffsetEnd: number;\n    currentOffsetTop: number;\n  }) => void;\n  onItemsRenderedThrottleMs?: number;\n  /**\n   * when the list size changes - `=> (width, height)`\n   */\n  onSizeUpdate?: (width: number, height: number) => void;\n  /**\n   * Deprecated - use onLayoutDirectionScrollbarVisibilityChange\n   */\n  onVerticalScrollbarVisiblityChange?: (value: boolean) => void;\n  /**\n   * Callback - called when the vertical/horizontal (depends on layout) scrollbar visibility changed\n   */\n  onLayoutDirectionScrollbarVisibilityChange?: (value: boolean) => void;\n  role?: string;\n  ariaLabel?: string;\n  /** Custom style to pass to the component */\n  style?: CSSProperties;\n  /**\n   * index of the item to scroll to\n   */\n  scrollToId?: string;\n  virtualListRef?: ForwardedRef<HTMLElement>;\n  onScroll?: (\n    horizontalScrollDirection: VirtualizedListScrollDirection,\n    scrollTop: number,\n    scrollUpdateWasRequested: boolean\n  ) => void;\n}\n\nconst VirtualizedList: VibeComponent<VirtualizedListProps> = forwardRef(\n  (\n    {\n      className,\n      id,\n      items = [],\n      itemRenderer = (item: VirtualizedListItem, _index: number, _style: CSSProperties) => item as ReactElement,\n      getItemHeight = (item: VirtualizedListItem, _index: number) => item.height,\n      getItemSize = null, // must be null for backward compatibility\n      layout = \"vertical\",\n      onScroll,\n      overscanCount = 0,\n      getItemId = (item: VirtualizedListItem, _index: number) => item.id,\n      scrollToId,\n      scrollDuration = 200,\n      onScrollToFinished = NOOP,\n      onItemsRendered,\n      onItemsRenderedThrottleMs = 200,\n      onSizeUpdate = NOOP,\n      onVerticalScrollbarVisiblityChange = null,\n      onLayoutDirectionScrollbarVisibilityChange = null,\n      virtualListRef,\n      scrollableClassName,\n      role,\n      ariaLabel,\n      style,\n      \"data-testid\": dataTestId\n    }: VirtualizedListProps,\n    ref\n  ) => {\n    // states\n    const [listHeight, setListHeight] = useState(0);\n    const [listWidth, setListWidth] = useState(0);\n\n    const isVerticalList = layout !== \"horizontal\";\n    const listSizeByLayout = useMemo(() => {\n      return isVerticalList ? listHeight : listWidth;\n    }, [isVerticalList, listHeight, listWidth]);\n\n    // prevs\n    const prevScrollToId = usePrevious(scrollToId);\n\n    // Refs\n    const componentRef = useRef(null);\n    const isVerticalScrollbarVisibleRef = useRef(null);\n    const listRef = useRef(null);\n    const scrollTopRef = useRef(0);\n    const animationDataRef = useRef({\n      initialized: false,\n      scrollOffsetInitial: 0,\n      scrollOffsetFinal: 0,\n      animationStartTime: 0\n    });\n    const mergedRef = useMergeRef(ref, componentRef);\n    const mergedListRef = useMergeRef(virtualListRef, listRef);\n\n    const animationData = animationDataRef.current;\n    if (!animationData.initialized) {\n      animationData.initialized = true;\n      animationData.scrollOffsetInitial = 0;\n      animationData.scrollOffsetFinal = 0;\n      animationData.animationStartTime = 0;\n    }\n\n    // Callbacks\n    const sizeGetter = useCallback(\n      (item: VirtualizedListItem, index: number) => {\n        const getSize = getItemSize || getItemHeight;\n        const height = getSize(item, index);\n        if (height === undefined) {\n          console.error(\"Couldn't get height for item: \", item);\n        }\n        return height;\n      },\n      [getItemHeight, getItemSize]\n    );\n\n    const idGetter = useCallback(\n      (item: VirtualizedListItem, index: number) => {\n        const itemId = getItemId(item, index);\n        if (itemId === undefined) {\n          console.error(\"Couldn't get id for item: \", item);\n        }\n        return itemId;\n      },\n      [getItemId]\n    );\n\n    // Memos\n    // Creates object of itemId => { item, index, size, offsetTop}\n    const normalizedItems = useMemo(() => {\n      return getNormalizedItems(items, idGetter, sizeGetter);\n    }, [items, idGetter, sizeGetter]);\n\n    const maxListOffset = useMemo(() => {\n      return getMaxOffset(listSizeByLayout, normalizedItems);\n    }, [listSizeByLayout, normalizedItems]);\n\n    // Callbacks\n    const onScrollCB = useCallback(\n      ({\n        scrollDirection,\n        scrollOffset,\n        scrollUpdateWasRequested\n      }: {\n        scrollDirection: ScrollDirection;\n        scrollOffset: number;\n        scrollUpdateWasRequested: boolean;\n      }) => {\n        scrollTopRef.current = scrollOffset;\n        if (!scrollUpdateWasRequested) {\n          animationData.scrollOffsetInitial = scrollOffset;\n        }\n        onScroll && onScroll(scrollDirection, scrollOffset, scrollUpdateWasRequested);\n      },\n      [onScroll, scrollTopRef, animationData]\n    );\n\n    const animateScroll = useCallback(() => {\n      requestAnimationFrame(() => {\n        const now = performance.now();\n        const ellapsed = now - animationData.animationStartTime;\n        const scrollDelta = animationData.scrollOffsetFinal - animationData.scrollOffsetInitial;\n        const easedTime = easeInOutQuint(Math.min(1, ellapsed / scrollDuration));\n        const scrollOffset = animationData.scrollOffsetInitial + scrollDelta * easedTime;\n        const finalOffsetValue = Math.min(maxListOffset, scrollOffset);\n        scrollTopRef.current = finalOffsetValue;\n        listRef.current?.scrollTo(finalOffsetValue);\n\n        if (ellapsed < scrollDuration) {\n          animateScroll();\n        } else {\n          animationData.animationStartTime = undefined;\n          onScrollToFinished && onScrollToFinished();\n        }\n      });\n    }, [scrollDuration, animationData, listRef, maxListOffset, onScrollToFinished]);\n\n    const startScrollAnimation = useCallback(\n      (item: VirtualizedListItem) => {\n        const { offsetTop } = item;\n\n        if (animationData.animationStartTime) {\n          // animation already in progress\n          animationData.scrollOffsetFinal = offsetTop;\n          return;\n        }\n\n        // Update the initial scroll offset with the current scroll position for react 18 batching behavior\n        if (listRef.current?.state?.scrollOffset !== null) {\n          animationData.scrollOffsetInitial = listRef.current?.state?.scrollOffset;\n        }\n\n        if (animationData.scrollOffsetInitial === offsetTop) {\n          // offset already equals to item offset\n          onScrollToFinished && onScrollToFinished();\n          return;\n        }\n\n        animationData.scrollOffsetFinal = offsetTop;\n        animationData.animationStartTime = performance.now();\n        animateScroll();\n      },\n      [animationData, animateScroll, onScrollToFinished]\n    );\n\n    const rowRenderer = useCallback(\n      ({ index, style }: { index: number; style: CSSProperties }) => {\n        const item = items[index];\n        return itemRenderer(item, index, style);\n      },\n      [items, itemRenderer]\n    );\n\n    const calcItemSize = useCallback(\n      (index: number) => {\n        const item = items[index];\n        return sizeGetter(item, index);\n      },\n      [items, sizeGetter]\n    );\n\n    const updateListSize = useCallback(\n      (width: number, height: number) => {\n        if (height !== listHeight || width !== listWidth) {\n          setTimeout(() => {\n            setListHeight(height);\n            setListWidth(width);\n            onSizeUpdate(width, height);\n          }, 0);\n        }\n      },\n      [listHeight, listWidth, onSizeUpdate]\n    );\n\n    const onItemsRenderedCB = useThrottledCallback(\n      ({ visibleStartIndex, visibleStopIndex }: ListOnItemsRenderedProps) => {\n        if (!onItemsRendered) return;\n        const data = getOnItemsRenderedData(\n          items,\n          normalizedItems,\n          idGetter,\n          visibleStartIndex,\n          visibleStopIndex,\n          listSizeByLayout,\n          scrollTopRef.current\n        );\n        onItemsRendered(data);\n      },\n      { wait: onItemsRenderedThrottleMs, trailing: true },\n      [onItemsRendered, items, normalizedItems, idGetter, listSizeByLayout]\n    );\n\n    // Effects\n    useEffect(() => {\n      // scroll to specific item\n      if (scrollToId && prevScrollToId !== scrollToId) {\n        const hasScrollbar = isLayoutDirectionScrollbarVisible(items, normalizedItems, idGetter, listSizeByLayout);\n        const item = normalizedItems[scrollToId as keyof typeof normalizedItems];\n        hasScrollbar && item && startScrollAnimation(item);\n      }\n    }, [prevScrollToId, scrollToId, startScrollAnimation, normalizedItems, items, idGetter, listSizeByLayout]);\n\n    useEffect(() => {\n      // recalculate row heights\n      if (listRef.current) {\n        listRef.current.resetAfterIndex(0);\n      }\n    }, [normalizedItems]);\n\n    useEffect(() => {\n      // update vertical scrollbar visibility\n      const callback = onLayoutDirectionScrollbarVisibilityChange || onVerticalScrollbarVisiblityChange;\n      if (callback) {\n        const isVisible = isLayoutDirectionScrollbarVisible(items, normalizedItems, idGetter, listSizeByLayout);\n        if (isVerticalScrollbarVisibleRef.current !== isVisible) {\n          isVerticalScrollbarVisibleRef.current = isVisible;\n          callback(isVisible);\n        }\n      }\n    }, [\n      onLayoutDirectionScrollbarVisibilityChange,\n      onVerticalScrollbarVisiblityChange,\n      items,\n      normalizedItems,\n      listSizeByLayout,\n      idGetter\n    ]);\n\n    return (\n      <div\n        ref={mergedRef}\n        className={cx(styles.virtualizedListWrapper, className)}\n        id={id}\n        role={role}\n        aria-label={ariaLabel}\n        data-testid={dataTestId || getTestId(ComponentDefaultTestId.VIRTUALIZED_LIST, id)}\n        style={style}\n      >\n        <AutoSizer>\n          {({ height, width }: { height: number; width: number }) => {\n            updateListSize(width, height);\n            return (\n              <List\n                ref={mergedListRef as unknown as LegacyRef<VariableSizeList<unknown>>}\n                height={height}\n                width={width}\n                itemCount={items.length}\n                itemSize={calcItemSize}\n                onScroll={onScrollCB}\n                layout={layout}\n                overscanCount={overscanCount}\n                onItemsRendered={onItemsRenderedCB}\n                className={scrollableClassName}\n              >\n                {rowRenderer as VibeComponent<ListChildComponentProps>}\n              </List>\n            );\n          }}\n        </AutoSizer>\n      </div>\n    );\n  }\n);\n\nexport default VirtualizedList;\n"],"names":["VirtualizedList","forwardRef","_ref","ref","className","id","_ref$items","items","_ref$itemRenderer","itemRenderer","item","_index","_style","_ref$getItemHeight","getItemHeight","height","_ref$getItemSize","getItemSize","_ref$layout","layout","onScroll","_ref$overscanCount","overscanCount","_ref$getItemId","getItemId","scrollToId","_ref$scrollDuration","scrollDuration","_ref$onScrollToFinish","onScrollToFinished","NOOP","onItemsRendered","_ref$onItemsRenderedT","onItemsRenderedThrottleMs","_ref$onSizeUpdate","onSizeUpdate","_ref$onVerticalScroll","onVerticalScrollbarVisiblityChange","_ref$onLayoutDirectio","onLayoutDirectionScrollbarVisibilityChange","virtualListRef","scrollableClassName","role","ariaLabel","style","dataTestId","_useState","useState","_useState2","_slicedToArray","listHeight","setListHeight","_useState3","_useState4","listWidth","setListWidth","isVerticalList","listSizeByLayout","useMemo","prevScrollToId","usePrevious","componentRef","useRef","isVerticalScrollbarVisibleRef","listRef","scrollTopRef","animationDataRef","initialized","scrollOffsetInitial","scrollOffsetFinal","animationStartTime","mergedRef","useMergeRef","mergedListRef","animationData","current","sizeGetter","useCallback","index","undefined","console","error","idGetter","itemId","normalizedItems","getNormalizedItems","maxListOffset","getMaxOffset","onScrollCB","_ref2","scrollDirection","scrollOffset","scrollUpdateWasRequested","animateScroll","requestAnimationFrame","ellapsed","performance","now","scrollDelta","easedTime","easeInOutQuint","Math","min","finalOffsetValue","_a","scrollTo","startScrollAnimation","offsetTop","_b","state","_d","_c","rowRenderer","_ref3","calcItemSize","updateListSize","width","setTimeout","onItemsRenderedCB","useThrottledCallback","_ref4","data","getOnItemsRenderedData","visibleStartIndex","visibleStopIndex","wait","trailing","useEffect","hasScrollbar","isLayoutDirectionScrollbarVisible","resetAfterIndex","callback","isVisible","React","createElement","cx","styles","virtualizedListWrapper","getTestId","ComponentDefaultTestId","VIRTUALIZED_LIST","AutoSizer","_ref5","List","itemCount","length","itemSize"],"mappings":"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"}
+{"version":3,"file":"VirtualizedList.js","sources":["../../../../src/components/VirtualizedList/VirtualizedList.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, {\n  CSSProperties,\n  ForwardedRef,\n  forwardRef,\n  LegacyRef,\n  ReactElement,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState\n} from \"react\";\nimport { noop as NOOP } from \"lodash-es\";\nimport {\n  ScrollDirection,\n  VariableSizeList as List,\n  ListOnItemsRenderedProps,\n  ListChildComponentProps,\n  VariableSizeList\n} from \"react-window\";\nimport AutoSizer from \"react-virtualized-auto-sizer\";\nimport usePrevious from \"../../hooks/usePrevious\";\nimport useThrottledCallback from \"../../hooks/useThrottledCallback\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport {\n  easeInOutQuint,\n  getMaxOffset,\n  getNormalizedItems,\n  getOnItemsRenderedData,\n  isLayoutDirectionScrollbarVisible\n} from \"../../services/virtualized-service\";\nimport { getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport VibeComponentProps from \"src/types/VibeComponentProps\";\nimport VibeComponent from \"../../types/VibeComponent\";\nimport styles from \"./VirtualizedList.module.scss\";\nimport { VirtualizedListItem, VirtualizedListLayout, VirtualizedListScrollDirection } from \"./VirtualizedList.types\";\n\nexport interface VirtualizedListProps extends VibeComponentProps {\n  /**\n   * Class name applied to the scrollable container.\n   */\n  scrollableClassName?: string;\n  /**\n   * The orientation of the list.\n   */\n  layout?: VirtualizedListLayout;\n  /**\n   * The list of items to be rendered.\n   */\n  items: VirtualizedListItem[];\n  /**\n   * Function to render each item in the list.\n   */\n  itemRenderer: (item: VirtualizedListItem, index: number, style: CSSProperties) => ReactElement | JSX.Element;\n  /**\n   * @deprecated - use `getItemSize`.\n   */\n  getItemHeight?: (item: VirtualizedListItem, index: number) => number;\n  /**\n   * Function to get the size (height/width) of each item, based on layout.\n   */\n  getItemSize?: (item: VirtualizedListItem, index: number) => number;\n  /**\n   * Function to get the unique ID of an item.\n   */\n  getItemId?: (item: VirtualizedListItem, index: number) => string;\n  /**\n   * Callback fired when the scroll animation is finished.\n   */\n  onScrollToFinished?: () => void;\n  /**\n   * Number of items to render above and below the visible portion.\n   */\n  overscanCount?: number;\n  /**\n   * The duration of the scroll animation in milliseconds.\n   */\n  scrollDuration?: number;\n  /**\n   * Callback fired when items are rendered.\n   */\n  onItemsRendered?: ({\n    firstItemId,\n    secondItemId,\n    lastItemId,\n    centerItemId,\n    firstItemOffsetEnd,\n    currentOffsetTop\n  }: {\n    firstItemId: string;\n    secondItemId: string;\n    lastItemId: string;\n    centerItemId: string;\n    firstItemOffsetEnd: number;\n    currentOffsetTop: number;\n  }) => void;\n  /**\n   * The delay (in ms) for throttling the `onItemsRendered` callback.\n   */\n  onItemsRenderedThrottleMs?: number;\n  /**\n   * Callback fired when the list size changes.\n   */\n  onSizeUpdate?: (width: number, height: number) => void;\n  /**\n   * @deprecated - use `onLayoutDirectionScrollbarVisibilityChange`.\n   */\n  onVerticalScrollbarVisiblityChange?: (value: boolean) => void;\n  /**\n   * Callback fired when the vertical or horizontal scrollbar visibility changes.\n   */\n  onLayoutDirectionScrollbarVisibilityChange?: (value: boolean) => void;\n  /**\n   * The ARIA role attribute applied to the list.\n   */\n  role?: string;\n  /**\n   * The ARIA label for the list.\n   */\n  ariaLabel?: string;\n  /**\n   * Custom inline styles applied to the list.\n   */\n  style?: CSSProperties;\n  /**\n   * The ID of the item to scroll to.\n   */\n  scrollToId?: string;\n  /**\n   * Reference to the virtualized list component.\n   */\n  virtualListRef?: ForwardedRef<HTMLElement>;\n  /**\n   * Callback fired when the list is scrolled.\n   */\n  onScroll?: (\n    horizontalScrollDirection: VirtualizedListScrollDirection,\n    scrollTop: number,\n    scrollUpdateWasRequested: boolean\n  ) => void;\n}\n\nconst VirtualizedList: VibeComponent<VirtualizedListProps> = forwardRef(\n  (\n    {\n      className,\n      id,\n      items = [],\n      itemRenderer = (item: VirtualizedListItem, _index: number, _style: CSSProperties) => item as ReactElement,\n      getItemHeight = (item: VirtualizedListItem, _index: number) => item.height,\n      getItemSize = null, // must be null for backward compatibility\n      layout = \"vertical\",\n      onScroll,\n      overscanCount = 0,\n      getItemId = (item: VirtualizedListItem, _index: number) => item.id,\n      scrollToId,\n      scrollDuration = 200,\n      onScrollToFinished = NOOP,\n      onItemsRendered,\n      onItemsRenderedThrottleMs = 200,\n      onSizeUpdate = NOOP,\n      onVerticalScrollbarVisiblityChange = null,\n      onLayoutDirectionScrollbarVisibilityChange = null,\n      virtualListRef,\n      scrollableClassName,\n      role,\n      ariaLabel,\n      style,\n      \"data-testid\": dataTestId\n    }: VirtualizedListProps,\n    ref\n  ) => {\n    // states\n    const [listHeight, setListHeight] = useState(0);\n    const [listWidth, setListWidth] = useState(0);\n\n    const isVerticalList = layout !== \"horizontal\";\n    const listSizeByLayout = useMemo(() => {\n      return isVerticalList ? listHeight : listWidth;\n    }, [isVerticalList, listHeight, listWidth]);\n\n    // prevs\n    const prevScrollToId = usePrevious(scrollToId);\n\n    // Refs\n    const componentRef = useRef(null);\n    const isVerticalScrollbarVisibleRef = useRef(null);\n    const listRef = useRef(null);\n    const scrollTopRef = useRef(0);\n    const animationDataRef = useRef({\n      initialized: false,\n      scrollOffsetInitial: 0,\n      scrollOffsetFinal: 0,\n      animationStartTime: 0\n    });\n    const mergedRef = useMergeRef(ref, componentRef);\n    const mergedListRef = useMergeRef(virtualListRef, listRef);\n\n    const animationData = animationDataRef.current;\n    if (!animationData.initialized) {\n      animationData.initialized = true;\n      animationData.scrollOffsetInitial = 0;\n      animationData.scrollOffsetFinal = 0;\n      animationData.animationStartTime = 0;\n    }\n\n    // Callbacks\n    const sizeGetter = useCallback(\n      (item: VirtualizedListItem, index: number) => {\n        const getSize = getItemSize || getItemHeight;\n        const height = getSize(item, index);\n        if (height === undefined) {\n          console.error(\"Couldn't get height for item: \", item);\n        }\n        return height;\n      },\n      [getItemHeight, getItemSize]\n    );\n\n    const idGetter = useCallback(\n      (item: VirtualizedListItem, index: number) => {\n        const itemId = getItemId(item, index);\n        if (itemId === undefined) {\n          console.error(\"Couldn't get id for item: \", item);\n        }\n        return itemId;\n      },\n      [getItemId]\n    );\n\n    // Memos\n    // Creates object of itemId => { item, index, size, offsetTop}\n    const normalizedItems = useMemo(() => {\n      return getNormalizedItems(items, idGetter, sizeGetter);\n    }, [items, idGetter, sizeGetter]);\n\n    const maxListOffset = useMemo(() => {\n      return getMaxOffset(listSizeByLayout, normalizedItems);\n    }, [listSizeByLayout, normalizedItems]);\n\n    // Callbacks\n    const onScrollCB = useCallback(\n      ({\n        scrollDirection,\n        scrollOffset,\n        scrollUpdateWasRequested\n      }: {\n        scrollDirection: ScrollDirection;\n        scrollOffset: number;\n        scrollUpdateWasRequested: boolean;\n      }) => {\n        scrollTopRef.current = scrollOffset;\n        if (!scrollUpdateWasRequested) {\n          animationData.scrollOffsetInitial = scrollOffset;\n        }\n        onScroll && onScroll(scrollDirection, scrollOffset, scrollUpdateWasRequested);\n      },\n      [onScroll, scrollTopRef, animationData]\n    );\n\n    const animateScroll = useCallback(() => {\n      requestAnimationFrame(() => {\n        const now = performance.now();\n        const ellapsed = now - animationData.animationStartTime;\n        const scrollDelta = animationData.scrollOffsetFinal - animationData.scrollOffsetInitial;\n        const easedTime = easeInOutQuint(Math.min(1, ellapsed / scrollDuration));\n        const scrollOffset = animationData.scrollOffsetInitial + scrollDelta * easedTime;\n        const finalOffsetValue = Math.min(maxListOffset, scrollOffset);\n        scrollTopRef.current = finalOffsetValue;\n        listRef.current?.scrollTo(finalOffsetValue);\n\n        if (ellapsed < scrollDuration) {\n          animateScroll();\n        } else {\n          animationData.animationStartTime = undefined;\n          onScrollToFinished && onScrollToFinished();\n        }\n      });\n    }, [scrollDuration, animationData, listRef, maxListOffset, onScrollToFinished]);\n\n    const startScrollAnimation = useCallback(\n      (item: VirtualizedListItem) => {\n        const { offsetTop } = item;\n\n        if (animationData.animationStartTime) {\n          // animation already in progress\n          animationData.scrollOffsetFinal = offsetTop;\n          return;\n        }\n\n        // Update the initial scroll offset with the current scroll position for react 18 batching behavior\n        if (listRef.current?.state?.scrollOffset !== null) {\n          animationData.scrollOffsetInitial = listRef.current?.state?.scrollOffset;\n        }\n\n        if (animationData.scrollOffsetInitial === offsetTop) {\n          // offset already equals to item offset\n          onScrollToFinished && onScrollToFinished();\n          return;\n        }\n\n        animationData.scrollOffsetFinal = offsetTop;\n        animationData.animationStartTime = performance.now();\n        animateScroll();\n      },\n      [animationData, animateScroll, onScrollToFinished]\n    );\n\n    const rowRenderer = useCallback(\n      ({ index, style }: { index: number; style: CSSProperties }) => {\n        const item = items[index];\n        return itemRenderer(item, index, style);\n      },\n      [items, itemRenderer]\n    );\n\n    const calcItemSize = useCallback(\n      (index: number) => {\n        const item = items[index];\n        return sizeGetter(item, index);\n      },\n      [items, sizeGetter]\n    );\n\n    const updateListSize = useCallback(\n      (width: number, height: number) => {\n        if (height !== listHeight || width !== listWidth) {\n          setTimeout(() => {\n            setListHeight(height);\n            setListWidth(width);\n            onSizeUpdate(width, height);\n          }, 0);\n        }\n      },\n      [listHeight, listWidth, onSizeUpdate]\n    );\n\n    const onItemsRenderedCB = useThrottledCallback(\n      ({ visibleStartIndex, visibleStopIndex }: ListOnItemsRenderedProps) => {\n        if (!onItemsRendered) return;\n        const data = getOnItemsRenderedData(\n          items,\n          normalizedItems,\n          idGetter,\n          visibleStartIndex,\n          visibleStopIndex,\n          listSizeByLayout,\n          scrollTopRef.current\n        );\n        onItemsRendered(data);\n      },\n      { wait: onItemsRenderedThrottleMs, trailing: true },\n      [onItemsRendered, items, normalizedItems, idGetter, listSizeByLayout]\n    );\n\n    // Effects\n    useEffect(() => {\n      // scroll to specific item\n      if (scrollToId && prevScrollToId !== scrollToId) {\n        const hasScrollbar = isLayoutDirectionScrollbarVisible(items, normalizedItems, idGetter, listSizeByLayout);\n        const item = normalizedItems[scrollToId as keyof typeof normalizedItems];\n        hasScrollbar && item && startScrollAnimation(item);\n      }\n    }, [prevScrollToId, scrollToId, startScrollAnimation, normalizedItems, items, idGetter, listSizeByLayout]);\n\n    useEffect(() => {\n      // recalculate row heights\n      if (listRef.current) {\n        listRef.current.resetAfterIndex(0);\n      }\n    }, [normalizedItems]);\n\n    useEffect(() => {\n      // update vertical scrollbar visibility\n      const callback = onLayoutDirectionScrollbarVisibilityChange || onVerticalScrollbarVisiblityChange;\n      if (callback) {\n        const isVisible = isLayoutDirectionScrollbarVisible(items, normalizedItems, idGetter, listSizeByLayout);\n        if (isVerticalScrollbarVisibleRef.current !== isVisible) {\n          isVerticalScrollbarVisibleRef.current = isVisible;\n          callback(isVisible);\n        }\n      }\n    }, [\n      onLayoutDirectionScrollbarVisibilityChange,\n      onVerticalScrollbarVisiblityChange,\n      items,\n      normalizedItems,\n      listSizeByLayout,\n      idGetter\n    ]);\n\n    return (\n      <div\n        ref={mergedRef}\n        className={cx(styles.virtualizedListWrapper, className)}\n        id={id}\n        role={role}\n        aria-label={ariaLabel}\n        data-testid={dataTestId || getTestId(ComponentDefaultTestId.VIRTUALIZED_LIST, id)}\n        style={style}\n      >\n        <AutoSizer>\n          {({ height, width }: { height: number; width: number }) => {\n            updateListSize(width, height);\n            return (\n              <List\n                ref={mergedListRef as unknown as LegacyRef<VariableSizeList<unknown>>}\n                height={height}\n                width={width}\n                itemCount={items.length}\n                itemSize={calcItemSize}\n                onScroll={onScrollCB}\n                layout={layout}\n                overscanCount={overscanCount}\n                onItemsRendered={onItemsRenderedCB}\n                className={scrollableClassName}\n              >\n                {rowRenderer as VibeComponent<ListChildComponentProps>}\n              </List>\n            );\n          }}\n        </AutoSizer>\n      </div>\n    );\n  }\n);\n\nexport default VirtualizedList;\n"],"names":["VirtualizedList","forwardRef","_ref","ref","className","id","_ref$items","items","_ref$itemRenderer","itemRenderer","item","_index","_style","_ref$getItemHeight","getItemHeight","height","_ref$getItemSize","getItemSize","_ref$layout","layout","onScroll","_ref$overscanCount","overscanCount","_ref$getItemId","getItemId","scrollToId","_ref$scrollDuration","scrollDuration","_ref$onScrollToFinish","onScrollToFinished","NOOP","onItemsRendered","_ref$onItemsRenderedT","onItemsRenderedThrottleMs","_ref$onSizeUpdate","onSizeUpdate","_ref$onVerticalScroll","onVerticalScrollbarVisiblityChange","_ref$onLayoutDirectio","onLayoutDirectionScrollbarVisibilityChange","virtualListRef","scrollableClassName","role","ariaLabel","style","dataTestId","_useState","useState","_useState2","_slicedToArray","listHeight","setListHeight","_useState3","_useState4","listWidth","setListWidth","isVerticalList","listSizeByLayout","useMemo","prevScrollToId","usePrevious","componentRef","useRef","isVerticalScrollbarVisibleRef","listRef","scrollTopRef","animationDataRef","initialized","scrollOffsetInitial","scrollOffsetFinal","animationStartTime","mergedRef","useMergeRef","mergedListRef","animationData","current","sizeGetter","useCallback","index","undefined","console","error","idGetter","itemId","normalizedItems","getNormalizedItems","maxListOffset","getMaxOffset","onScrollCB","_ref2","scrollDirection","scrollOffset","scrollUpdateWasRequested","animateScroll","requestAnimationFrame","ellapsed","performance","now","scrollDelta","easedTime","easeInOutQuint","Math","min","finalOffsetValue","_a","scrollTo","startScrollAnimation","offsetTop","_b","state","_d","_c","rowRenderer","_ref3","calcItemSize","updateListSize","width","setTimeout","onItemsRenderedCB","useThrottledCallback","_ref4","data","getOnItemsRenderedData","visibleStartIndex","visibleStopIndex","wait","trailing","useEffect","hasScrollbar","isLayoutDirectionScrollbarVisible","resetAfterIndex","callback","isVisible","React","createElement","cx","styles","virtualizedListWrapper","getTestId","ComponentDefaultTestId","VIRTUALIZED_LIST","AutoSizer","_ref5","List","itemCount","length","itemSize"],"mappings":"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"}

package/dist/src/hooks/useKeyEvent/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/hooks/useKeyEvent/index.ts"],"sourcesContent":["import { RefObject, useCallback, useRef } from \"react\";\nimport useEventListener from \"../useEventListener\";\nimport { GenericEventCallback } from \"../../types/events\";\nimport { isClient } from \"../../utils/ssr-utils\";\n\nconst CTRL_OR_META = \"ctrlOrMetaKey\";\n\nenum Modifier {\n  ALT = \"altKey\",\n  META = \"metaKey\",\n  CTRL = \"ctrlKey\",\n  SHIFT = \"shiftKey\",\n  CTRL_OR_META = \"ctrlOrMetaKey\"\n}\n\nconst checkModifierInEvent = (event: KeyboardEvent, modifier: Modifier) => {\n  if (modifier === Modifier.CTRL_OR_META) {\n    return event.ctrlKey || event.metaKey;\n  }\n\n  return event[modifier];\n};\nconst checkWithoutModifierInEvent = (event: KeyboardEvent) => {\n  return !Object.values(useKeyEvent.modifiers).some((m: Modifier) => {\n    if (m !== CTRL_OR_META) {\n      return !!event[m];\n    }\n  });\n};\n\nexport interface UseKeyEventArgs {\n  keys: KeyboardEvent[\"key\"][];\n  // TODO: [breaking] change to keyboard event\n  callback: GenericEventCallback;\n  modifier?: Modifier;\n  keyEventName?: string;\n  withoutAnyModifier?: boolean;\n  ref?: RefObject<HTMLElement | Document>;\n  ignoreDocumentFallback?: boolean;\n  capture?: boolean;\n  preventDefault?: boolean;\n  stopPropagation?: boolean;\n}\n\nexport default function useKeyEvent({\n  keys = [],\n  callback,\n  modifier,\n  withoutAnyModifier,\n  ref,\n  ignoreDocumentFallback = false,\n  capture = false,\n  preventDefault = false,\n  stopPropagation = false,\n  keyEventName = \"keydown\" // need keydown and not keyup to prevent scrolling with prevent default, for example during menu keyboard navigation\n}: UseKeyEventArgs) {\n  const documentRef = useRef(isClient() ? document.body : null);\n  const onKeyUpPress = useCallback(\n    (event: KeyboardEvent) => {\n      const { key } = event;\n      if (!keys.includes(key)) {\n        return;\n      }\n      if (modifier && !checkModifierInEvent(event, modifier)) {\n        return;\n      }\n      if (withoutAnyModifier && !checkWithoutModifierInEvent(event)) {\n        return;\n      }\n\n      if (preventDefault) {\n        event.preventDefault();\n      }\n\n      if (stopPropagation) {\n        event.stopPropagation();\n      }\n\n      callback(event);\n    },\n    [keys, modifier, withoutAnyModifier, preventDefault, stopPropagation, callback]\n  );\n\n  let listenerRef;\n\n  if (ref) {\n    listenerRef = ref;\n  } else if (ignoreDocumentFallback) {\n    listenerRef = null;\n  } else {\n    listenerRef = documentRef;\n  }\n\n  useEventListener({\n    eventName: keyEventName,\n    callback: onKeyUpPress,\n    ref: listenerRef,\n    capture\n  });\n}\n\nuseKeyEvent.modifiers = Modifier;\n"],"names":["Modifier","useKeyEvent","_ref","_ref$keys","keys","callback","modifier","withoutAnyModifier","ref","_ref$ignoreDocumentFa","ignoreDocumentFallback","_ref$capture","capture","_ref$preventDefault","preventDefault","_ref$stopPropagation","stopPropagation","_ref$keyEventName","keyEventName","documentRef","useRef","isClient","document","body","onKeyUpPress","useCallback","event","includes","key","CTRL_OR_META","ctrlKey","metaKey","checkModifierInEvent","Object","values","modifiers","some","m","checkWithoutModifierInEvent","useEventListener","eventName"],"mappings":"gJAKA,IAEKA,GAAL,SAAKA,GACHA,EAAA,IAAA,SACAA,EAAA,KAAA,UACAA,EAAA,KAAA,UACAA,EAAA,MAAA,WACAA,EAAA,aAAA,eACD,CAND,CAAKA,IAAAA,EAMJ,CAAA,IA+Ba,SAAUC,EAAWC,GAWjB,IAAAC,EAAAD,EAVhBE,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EACTE,EAAQH,EAARG,SACAC,EAAQJ,EAARI,SACAC,EAAkBL,EAAlBK,mBACAC,EAAGN,EAAHM,IAAGC,EAAAP,EACHQ,uBAAAA,OAAyB,IAAHD,GAAQA,EAAAE,EAAAT,EAC9BU,QAAAA,OAAU,IAAHD,GAAQA,EAAAE,EAAAX,EACfY,eAAAA,OAAiB,IAAHD,GAAQA,EAAAE,EAAAb,EACtBc,gBAAAA,OAAkB,IAAHD,GAAQA,EAAAE,EAAAf,EACvBgB,aAAAA,OAAe,IAAHD,EAAG,UAASA,EAElBE,EAAcC,EAAOC,IAAaC,SAASC,KAAO,MAClDC,EAAeC,GACnB,SAACC,GAEMtB,EAAKuB,SADMD,EAARE,OAIJtB,IAhDmB,SAACoB,EAAsBpB,GAClD,OAAIA,IAAaN,EAAS6B,aACjBH,EAAMI,SAAWJ,EAAMK,QAGzBL,EAAMpB,EACf,CA0CuB0B,CAAqBN,EAAOpB,IAGzCC,IA5C0B,SAACmB,GACnC,OAAQO,OAAOC,OAAOjC,EAAYkC,WAAWC,MAAK,SAACC,GACjD,GAnBiB,kBAmBbA,EACF,QAASX,EAAMW,EAEnB,GACF,CAsCiCC,CAA4BZ,KAInDZ,GACFY,EAAMZ,iBAGJE,GACFU,EAAMV,kBAGRX,EAASqB,IACX,GACA,CAACtB,EAAME,EAAUC,EAAoBO,EAAgBE,EAAiBX,IAaxEkC,EAAiB,CACfC,UAAWtB,EACXb,SAAUmB,EACVhB,IAXEA,IAEOE,EACK,KAEAS,GAOdP,QAAAA,GAEJ,CAEAX,EAAYkC,UAAYnC"}
+{"version":3,"file":"index.js","sources":["../../../../src/hooks/useKeyEvent/index.ts"],"sourcesContent":["import { RefObject, useCallback, useRef } from \"react\";\nimport useEventListener from \"../useEventListener\";\nimport { GenericEventCallback } from \"../../types/events\";\nimport { isClient } from \"../../utils/ssr-utils\";\n\nconst CTRL_OR_META = \"ctrlOrMetaKey\";\n\nenum Modifier {\n  ALT = \"altKey\",\n  META = \"metaKey\",\n  CTRL = \"ctrlKey\",\n  SHIFT = \"shiftKey\",\n  CTRL_OR_META = \"ctrlOrMetaKey\"\n}\n\nconst checkModifierInEvent = (event: KeyboardEvent, modifier: Modifier) => {\n  if (modifier === Modifier.CTRL_OR_META) {\n    return event.ctrlKey || event.metaKey;\n  }\n\n  return event[modifier];\n};\nconst checkWithoutModifierInEvent = (event: KeyboardEvent) => {\n  return !Object.values(useKeyEvent.modifiers).some((m: Modifier) => {\n    if (m !== CTRL_OR_META) {\n      return !!event[m];\n    }\n  });\n};\n\nexport interface UseKeyEventArgs {\n  /**\n   * The list of keys that should trigger the event.\n   */\n  keys: KeyboardEvent[\"key\"][];\n  // TODO: [breaking] change to keyboard event\n  /**\n   * Callback fired when a specified key is pressed.\n   */\n  callback: GenericEventCallback;\n  /**\n   * Modifier key that must be pressed along with the specified key.\n   */\n  modifier?: Modifier;\n  /**\n   * The keyboard event type to listen for (e.g., \"keydown\", \"keyup\").\n   */\n  keyEventName?: string;\n  /**\n   * If true, ensures no modifier keys are pressed when handling the event.\n   */\n  withoutAnyModifier?: boolean;\n  /**\n   * The element reference to listen for key events on.\n   */\n  ref?: RefObject<HTMLElement | Document>;\n  /**\n   * If true, prevents fallback to listening on the document when no ref is provided.\n   */\n  ignoreDocumentFallback?: boolean;\n  /**\n   * If true, uses capture phase instead of bubbling phase for event listening.\n   */\n  capture?: boolean;\n  /**\n   * If true, calls `preventDefault` on the key event.\n   */\n  preventDefault?: boolean;\n  /**\n   * If true, calls `stopPropagation` on the key event.\n   */\n  stopPropagation?: boolean;\n}\n\nexport default function useKeyEvent({\n  keys = [],\n  callback,\n  modifier,\n  withoutAnyModifier,\n  ref,\n  ignoreDocumentFallback = false,\n  capture = false,\n  preventDefault = false,\n  stopPropagation = false,\n  keyEventName = \"keydown\" // need keydown and not keyup to prevent scrolling with prevent default, for example during menu keyboard navigation\n}: UseKeyEventArgs) {\n  const documentRef = useRef(isClient() ? document.body : null);\n  const onKeyUpPress = useCallback(\n    (event: KeyboardEvent) => {\n      const { key } = event;\n      if (!keys.includes(key)) {\n        return;\n      }\n      if (modifier && !checkModifierInEvent(event, modifier)) {\n        return;\n      }\n      if (withoutAnyModifier && !checkWithoutModifierInEvent(event)) {\n        return;\n      }\n\n      if (preventDefault) {\n        event.preventDefault();\n      }\n\n      if (stopPropagation) {\n        event.stopPropagation();\n      }\n\n      callback(event);\n    },\n    [keys, modifier, withoutAnyModifier, preventDefault, stopPropagation, callback]\n  );\n\n  let listenerRef;\n\n  if (ref) {\n    listenerRef = ref;\n  } else if (ignoreDocumentFallback) {\n    listenerRef = null;\n  } else {\n    listenerRef = documentRef;\n  }\n\n  useEventListener({\n    eventName: keyEventName,\n    callback: onKeyUpPress,\n    ref: listenerRef,\n    capture\n  });\n}\n\nuseKeyEvent.modifiers = Modifier;\n"],"names":["Modifier","useKeyEvent","_ref","_ref$keys","keys","callback","modifier","withoutAnyModifier","ref","_ref$ignoreDocumentFa","ignoreDocumentFallback","_ref$capture","capture","_ref$preventDefault","preventDefault","_ref$stopPropagation","stopPropagation","_ref$keyEventName","keyEventName","documentRef","useRef","isClient","document","body","onKeyUpPress","useCallback","event","includes","key","CTRL_OR_META","ctrlKey","metaKey","checkModifierInEvent","Object","values","modifiers","some","m","checkWithoutModifierInEvent","useEventListener","eventName"],"mappings":"gJAKA,IAEKA,GAAL,SAAKA,GACHA,EAAA,IAAA,SACAA,EAAA,KAAA,UACAA,EAAA,KAAA,UACAA,EAAA,MAAA,WACAA,EAAA,aAAA,eACD,CAND,CAAKA,IAAAA,EAMJ,CAAA,IA6Da,SAAUC,EAAWC,GAWjB,IAAAC,EAAAD,EAVhBE,KAAAA,OAAO,IAAHD,EAAG,GAAEA,EACTE,EAAQH,EAARG,SACAC,EAAQJ,EAARI,SACAC,EAAkBL,EAAlBK,mBACAC,EAAGN,EAAHM,IAAGC,EAAAP,EACHQ,uBAAAA,OAAyB,IAAHD,GAAQA,EAAAE,EAAAT,EAC9BU,QAAAA,OAAU,IAAHD,GAAQA,EAAAE,EAAAX,EACfY,eAAAA,OAAiB,IAAHD,GAAQA,EAAAE,EAAAb,EACtBc,gBAAAA,OAAkB,IAAHD,GAAQA,EAAAE,EAAAf,EACvBgB,aAAAA,OAAe,IAAHD,EAAG,UAASA,EAElBE,EAAcC,EAAOC,IAAaC,SAASC,KAAO,MAClDC,EAAeC,GACnB,SAACC,GAEMtB,EAAKuB,SADMD,EAARE,OAIJtB,IA9EmB,SAACoB,EAAsBpB,GAClD,OAAIA,IAAaN,EAAS6B,aACjBH,EAAMI,SAAWJ,EAAMK,QAGzBL,EAAMpB,EACf,CAwEuB0B,CAAqBN,EAAOpB,IAGzCC,IA1E0B,SAACmB,GACnC,OAAQO,OAAOC,OAAOjC,EAAYkC,WAAWC,MAAK,SAACC,GACjD,GAnBiB,kBAmBbA,EACF,QAASX,EAAMW,EAEnB,GACF,CAoEiCC,CAA4BZ,KAInDZ,GACFY,EAAMZ,iBAGJE,GACFU,EAAMV,kBAGRX,EAASqB,IACX,GACA,CAACtB,EAAME,EAAUC,EAAoBO,EAAgBE,EAAiBX,IAaxEkC,EAAiB,CACfC,UAAWtB,EACXb,SAAUmB,EACVhB,IAXEA,IAEOE,EACK,KAEAS,GAOdP,QAAAA,GAEJ,CAEAX,EAAYkC,UAAYnC"}

package/dist/src/hooks/useSwitch/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/hooks/useSwitch/index.ts"],"sourcesContent":["import { ChangeEvent, useCallback, useEffect, useState } from \"react\";\n\nenum SwitchRole {\n  CHECKBOX = \"checkbox\",\n  BUTTON = \"button\"\n}\n\nexport interface UseSwitchProps {\n  isChecked?: boolean;\n  defaultChecked?: boolean;\n  onChange?: (value: boolean, event?: ChangeEvent<HTMLInputElement> | unknown) => void;\n  isDisabled?: boolean;\n}\n\nexport default function useSwitch({ isChecked, defaultChecked, onChange, isDisabled }: UseSwitchProps = {}) {\n  // if isChecked is empty, set defaultChecked value (default false value)\n  const overrideCheckedInitial = isChecked ?? !!defaultChecked;\n  const [overrideChecked, setOverrideChecked] = useState(overrideCheckedInitial);\n\n  const overrideOnChange = useCallback(\n    (event?: ChangeEvent<HTMLInputElement> | unknown) => {\n      if (isDisabled) {\n        return;\n      }\n      const newChecked = !overrideChecked;\n      if (isChecked === undefined) {\n        setOverrideChecked(newChecked);\n      }\n      if (event && typeof event === \"object\" && \"target\" in event) {\n        onChange?.(newChecked, event);\n      } else {\n        onChange?.(newChecked);\n      }\n    },\n    [isChecked, isDisabled, onChange, overrideChecked]\n  );\n\n  useEffect(() => {\n    if (isChecked !== undefined) {\n      setOverrideChecked(isChecked);\n    }\n  }, [isChecked]);\n\n  return { isChecked: overrideChecked, onChange: overrideOnChange };\n}\n\nuseSwitch.switchRole = SwitchRole;\n"],"names":["SwitchRole","useSwitch","_ref","arguments","length","undefined","isChecked","onChange","isDisabled","_useState","useState","defaultChecked","_useState2","_slicedToArray","overrideChecked","setOverrideChecked","overrideOnChange","useCallback","event","newChecked","_typeof","useEffect","switchRole"],"mappings":"4JAEA,IAAKA,EAYmB,SAAAC,IAAkF,IAAAC,EAAAC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAF,CAAE,EAAtEG,EAASJ,EAATI,UAA2BC,EAAQL,EAARK,SAAUC,EAAUN,EAAVM,WAGvEC,EAA8CC,EADfJ,QAAAA,IAF4BJ,EAAdS,gBAGiCC,EAAAC,EAAAJ,EAAA,GAAvEK,EAAeF,EAAA,GAAEG,EAAkBH,EAAA,GAEpCI,EAAmBC,GACvB,SAACC,GACC,IAAIV,EAAJ,CAGA,IAAMW,GAAcL,OACFT,IAAdC,GACFS,EAAmBI,GAEjBD,GAA0B,WAAjBE,EAAOF,IAAsB,WAAYA,EACpDX,SAAAA,EAAWY,EAAYD,GAEvBX,SAAAA,EAAWY,EARZ,CAUF,GACD,CAACb,EAAWE,EAAYD,EAAUO,IASpC,OANAO,GAAU,gBACUhB,IAAdC,GACFS,EAAmBT,EAEvB,GAAG,CAACA,IAEG,CAAEA,UAAWQ,EAAiBP,SAAUS,EACjD,EA1CA,SAAKhB,GACHA,EAAA,SAAA,WACAA,EAAA,OAAA,QACD,CAHD,CAAKA,IAAAA,EAGJ,CAAA,IAyCDC,EAAUqB,WAAatB"}
+{"version":3,"file":"index.js","sources":["../../../../src/hooks/useSwitch/index.ts"],"sourcesContent":["import { ChangeEvent, useCallback, useEffect, useState } from \"react\";\n\nenum SwitchRole {\n  CHECKBOX = \"checkbox\",\n  BUTTON = \"button\"\n}\n\nexport interface UseSwitchProps {\n  /**\n   * If true, controls the checked state of the switch.\n   */\n  isChecked?: boolean;\n  /**\n   * The initial checked state when uncontrolled.\n   */\n  defaultChecked?: boolean;\n  /**\n   * Callback fired when the switch state changes.\n   */\n  onChange?: (value: boolean, event?: ChangeEvent<HTMLInputElement> | unknown) => void;\n  /**\n   * If true, disables interaction with the switch.\n   */\n  isDisabled?: boolean;\n}\n\nexport default function useSwitch({ isChecked, defaultChecked, onChange, isDisabled }: UseSwitchProps = {}) {\n  // if isChecked is empty, set defaultChecked value (default false value)\n  const overrideCheckedInitial = isChecked ?? !!defaultChecked;\n  const [overrideChecked, setOverrideChecked] = useState(overrideCheckedInitial);\n\n  const overrideOnChange = useCallback(\n    (event?: ChangeEvent<HTMLInputElement> | unknown) => {\n      if (isDisabled) {\n        return;\n      }\n      const newChecked = !overrideChecked;\n      if (isChecked === undefined) {\n        setOverrideChecked(newChecked);\n      }\n      if (event && typeof event === \"object\" && \"target\" in event) {\n        onChange?.(newChecked, event);\n      } else {\n        onChange?.(newChecked);\n      }\n    },\n    [isChecked, isDisabled, onChange, overrideChecked]\n  );\n\n  useEffect(() => {\n    if (isChecked !== undefined) {\n      setOverrideChecked(isChecked);\n    }\n  }, [isChecked]);\n\n  return { isChecked: overrideChecked, onChange: overrideOnChange };\n}\n\nuseSwitch.switchRole = SwitchRole;\n"],"names":["SwitchRole","useSwitch","_ref","arguments","length","undefined","isChecked","onChange","isDisabled","_useState","useState","defaultChecked","_useState2","_slicedToArray","overrideChecked","setOverrideChecked","overrideOnChange","useCallback","event","newChecked","_typeof","useEffect","switchRole"],"mappings":"4JAEA,IAAKA,EAwBmB,SAAAC,IAAkF,IAAAC,EAAAC,UAAAC,OAAA,QAAAC,IAAAF,UAAA,GAAAA,UAAA,GAAF,CAAE,EAAtEG,EAASJ,EAATI,UAA2BC,EAAQL,EAARK,SAAUC,EAAUN,EAAVM,WAGvEC,EAA8CC,EADfJ,QAAAA,IAF4BJ,EAAdS,gBAGiCC,EAAAC,EAAAJ,EAAA,GAAvEK,EAAeF,EAAA,GAAEG,EAAkBH,EAAA,GAEpCI,EAAmBC,GACvB,SAACC,GACC,IAAIV,EAAJ,CAGA,IAAMW,GAAcL,OACFT,IAAdC,GACFS,EAAmBI,GAEjBD,GAA0B,WAAjBE,EAAOF,IAAsB,WAAYA,EACpDX,SAAAA,EAAWY,EAAYD,GAEvBX,SAAAA,EAAWY,EARZ,CAUF,GACD,CAACb,EAAWE,EAAYD,EAAUO,IASpC,OANAO,GAAU,gBACUhB,IAAdC,GACFS,EAAmBT,EAEvB,GAAG,CAACA,IAEG,CAAEA,UAAWQ,EAAiBP,SAAUS,EACjD,EAtDA,SAAKhB,GACHA,EAAA,SAAA,WACAA,EAAA,OAAA,QACD,CAHD,CAAKA,IAAAA,EAGJ,CAAA,IAqDDC,EAAUqB,WAAatB"}

package/dist/types/VibeComponentProps.d.ts

@@ -1,5 +1,14 @@
 export default interface VibeComponentProps {
+    /**
+     * A CSS class name to apply to the component.
+     */
     className?: string;
+    /**
+     * A unique identifier for testing purposes.
+     */
     "data-testid"?: string;
+    /**
+     * An HTML id attribute for the component.
+     */
     id?: string;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vibe/core",
-  "version": "3.36.0-alpha-94da6.0",
+  "version": "3.36.0",
   "description": "Official monday.com UI resources for application development in React.js",
   "repository": {
     "type": "git",
@@ -83,6 +83,7 @@
   },
   "dependencies": {
     "@popperjs/core": "2.11.6",
+    "@rollup/plugin-replace": "^6.0.2",
     "@vibe/icons": "1.6.0",
     "a11y-dialog": "^7.5.2",
     "body-scroll-lock": "^4.0.0-beta.0",
@@ -280,5 +281,5 @@
       "gzip": true
     }
   ],
-  "gitHead": "0bef321d77e0dff4c035e6cc6e6e9f6ed99791c9"
+  "gitHead": "e8aa96089abb58ead369543a9e819545dc22e1bb"
 }