@veeqo/ui 14.13.1 → 14.14.0

package/dist/components/View/View.js.map

@@ -1 +1 @@
-{"version":3,"file":"View.js","sources":["../../../src/components/View/View.tsx"],"sourcesContent":["import React, { useCallback, CSSProperties } from 'react';\n\nimport { useHover } from '../../hooks';\nimport { colors } from '../../theme/modules/colors';\nimport { sizes } from '../../theme/modules/sizes';\n\nimport { ViewProps, ViewTypes } from './types';\n\nimport { CrossIcon, EditIcon } from '../../icons';\nimport { buildClassnames } from '../../utils/buildClassnames';\nimport { assignCssVars } from '../../utils/assignCssVars';\nimport { Text } from '../Text';\nimport styles from './View.module.scss';\n\nexport interface ClassNamesReturnPayload {\n  delete?: string;\n  options?: string;\n  edit?: string;\n  container?: string;\n  active?: string;\n  counter?: string;\n}\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n  delete: prefix ? `${prefix}-delete` : undefined,\n  options: prefix ? `${prefix}-options` : undefined,\n  edit: prefix ? `${prefix}-edit` : undefined,\n  container: prefix ? `${prefix}-container` : undefined,\n  active: prefix ? `${prefix}-active` : undefined,\n  counter: prefix ? `${prefix}-counter` : undefined,\n});\n\nconst IconStyling = {\n  style: {\n    marginLeft: sizes.xs,\n    padding: sizes.xs,\n    height: sizes.base,\n    width: sizes.base,\n  } as CSSProperties,\n};\n\n/**\n *\n * @deprecated\n *\n * use ViewTab component instead\n *\n */\nexport const View = ({\n  id,\n  iconSlot,\n  name,\n  type,\n  className,\n  colourPalette = colors.secondary.blue,\n  customTextColour,\n  count,\n  active = false,\n  onClick,\n  onDelete,\n  onEdit,\n  e2eClassName,\n}: ViewProps) => {\n  const classNames = generateClassNames(className);\n  const e2eClassNames = generateClassNames(e2eClassName);\n  const [isHovered, handleEnter, handleLeave] = useHover();\n\n  const handleClick = useCallback(() => onClick(id), [id, onClick]);\n  const handleDelete = useCallback(\n    (event) => {\n      event.stopPropagation();\n      if (onDelete) onDelete(id);\n    },\n    [onDelete, id],\n  );\n  const handleEdit = useCallback(\n    (event) => {\n      event.stopPropagation();\n      if (onEdit) onEdit(id);\n    },\n    [onEdit, id],\n  );\n\n  const isDraft = type === ViewTypes.draft;\n  const isSaved = type === ViewTypes.saved;\n  const fill = active ? colors.neutral.ink.dark : colors.neutral.ink.base;\n\n  const contourVars = assignCssVars({\n    colourPaletteBase: colourPalette.base,\n    colourPaletteLightest: colourPalette.lightest,\n    customTextColour,\n  });\n\n  const textColor = customTextColour ?? colors.neutral.ink.dark;\n  const isCounterActive = active || isHovered;\n\n  return (\n    <div\n      className={buildClassnames([\n        styles.container,\n        classNames?.container,\n        e2eClassNames?.container,\n        active ? e2eClassNames?.active : undefined,\n      ])}\n      onClick={handleClick}\n    >\n      <div\n        className={buildClassnames([styles.contour, active ? styles.active : undefined])}\n        style={contourVars}\n        onMouseEnter={handleEnter}\n        onMouseLeave={handleLeave}\n      >\n        {iconSlot && <div className={styles.customIconWrapper}>{iconSlot}</div>}\n        <Text variant=\"bodyBold\" style={{ color: textColor }}>{name}</Text>\n        {count != null && (\n          <Text\n            variant=\"subheadingSmall\"\n            className={buildClassnames([\n              styles.counterContainer,\n              isCounterActive ? styles.counterActive : undefined,\n            ])}\n            style={{\n              ...contourVars,\n              ...(isCounterActive ? { backgroundColor: colourPalette.base } : undefined),\n            }}\n          >\n            <span\n              className={buildClassnames([styles.counterText, e2eClassNames?.counter])}\n              style={isCounterActive ? { color: '#fff' } : undefined}\n            >\n              {count}\n            </span>\n          </Text>\n        )}\n        {isDraft && (\n          <CrossIcon\n            {...IconStyling}\n            color={fill}\n            className={e2eClassNames?.delete}\n            onClick={handleDelete}\n          />\n        )}\n        {isSaved && active && (\n          <EditIcon\n            {...IconStyling}\n            color={fill}\n            className={e2eClassNames?.edit}\n            onClick={handleEdit}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["React"],"mappings":"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"}
+{"version":3,"file":"View.js","sources":["../../../src/components/View/View.tsx"],"sourcesContent":["import React, { useCallback, CSSProperties } from 'react';\n\nimport { useHover } from '../../hooks';\nimport { colors } from '../../theme/modules/colors';\nimport { sizes } from '../../theme/modules/sizes';\n\nimport { ViewProps, ViewTypes } from './types';\n\nimport { CrossIcon, EditIcon } from '../../icons';\nimport { buildClassnames } from '../../utils/buildClassnames';\nimport { assignCssVars } from '../../utils/assignCssVars';\nimport { Text } from '../Text';\nimport styles from './View.module.scss';\n\nexport interface ClassNamesReturnPayload {\n  delete?: string;\n  options?: string;\n  edit?: string;\n  container?: string;\n  active?: string;\n  counter?: string;\n}\n\nconst generateClassNames = (prefix?: string): ClassNamesReturnPayload => ({\n  delete: prefix ? `${prefix}-delete` : undefined,\n  options: prefix ? `${prefix}-options` : undefined,\n  edit: prefix ? `${prefix}-edit` : undefined,\n  container: prefix ? `${prefix}-container` : undefined,\n  active: prefix ? `${prefix}-active` : undefined,\n  counter: prefix ? `${prefix}-counter` : undefined,\n});\n\nconst IconStyling = {\n  style: {\n    marginLeft: sizes.xs,\n    padding: sizes.xs,\n    height: sizes.base,\n    width: sizes.base,\n  } as CSSProperties,\n};\n\n/**\n *\n * @deprecated\n *\n * use ViewTab component instead\n *\n */\nexport const View = ({\n  id,\n  iconSlot,\n  name,\n  type,\n  className,\n  colourPalette = colors.secondary.blue,\n  customTextColour,\n  count,\n  active = false,\n  onClick,\n  onDelete,\n  onEdit,\n  e2eClassName,\n}: ViewProps) => {\n  const classNames = generateClassNames(className);\n  const e2eClassNames = generateClassNames(e2eClassName);\n  const [isHovered, handleEnter, handleLeave] = useHover();\n\n  const handleClick = useCallback(() => onClick(id), [id, onClick]);\n  const handleDelete = useCallback(\n    (event: React.MouseEvent) => {\n      event.stopPropagation();\n      if (onDelete) onDelete(id);\n    },\n    [onDelete, id],\n  );\n  const handleEdit = useCallback(\n    (event: React.MouseEvent) => {\n      event.stopPropagation();\n      if (onEdit) onEdit(id);\n    },\n    [onEdit, id],\n  );\n\n  const isDraft = type === ViewTypes.draft;\n  const isSaved = type === ViewTypes.saved;\n  const fill = active ? colors.neutral.ink.dark : colors.neutral.ink.base;\n\n  const contourVars = assignCssVars({\n    colourPaletteBase: colourPalette.base,\n    colourPaletteLightest: colourPalette.lightest,\n    customTextColour,\n  });\n\n  const textColor = customTextColour ?? colors.neutral.ink.dark;\n  const isCounterActive = active || isHovered;\n\n  return (\n    <div\n      className={buildClassnames([\n        styles.container,\n        classNames?.container,\n        e2eClassNames?.container,\n        active ? e2eClassNames?.active : undefined,\n      ])}\n      onClick={handleClick}\n    >\n      <div\n        className={buildClassnames([styles.contour, active ? styles.active : undefined])}\n        style={contourVars}\n        onMouseEnter={handleEnter}\n        onMouseLeave={handleLeave}\n      >\n        {iconSlot && <div className={styles.customIconWrapper}>{iconSlot}</div>}\n        <Text variant=\"bodyBold\" style={{ color: textColor }}>{name}</Text>\n        {count != null && (\n          <Text\n            variant=\"subheadingSmall\"\n            className={buildClassnames([\n              styles.counterContainer,\n              isCounterActive ? styles.counterActive : undefined,\n            ])}\n            style={{\n              ...contourVars,\n              ...(isCounterActive ? { backgroundColor: colourPalette.base } : undefined),\n            }}\n          >\n            <span\n              className={buildClassnames([styles.counterText, e2eClassNames?.counter])}\n              style={isCounterActive ? { color: '#fff' } : undefined}\n            >\n              {count}\n            </span>\n          </Text>\n        )}\n        {isDraft && (\n          <CrossIcon\n            {...IconStyling}\n            color={fill}\n            className={e2eClassNames?.delete}\n            onClick={handleDelete}\n          />\n        )}\n        {isSaved && active && (\n          <EditIcon\n            {...IconStyling}\n            color={fill}\n            className={e2eClassNames?.edit}\n            onClick={handleEdit}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["React"],"mappings":"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"}

package/dist/components/ViewTab/ViewTab.d.ts

@@ -11,7 +11,7 @@ export declare const ViewTab: React.ForwardRefExoticComponent<Omit<React.ButtonH
     customTextColour?: string | undefined;
     active?: boolean | undefined;
     name: string;
-    iconSlot?: React.ReactElement<any, string | React.JSXElementConstructor<any>> | undefined;
+    iconSlot?: React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | undefined;
     id: string;
     type?: "fixed" | "saved" | "draft" | undefined;
     count?: string | number | null | undefined;

package/dist/components/ViewsContainer/hooks/useSetScrollPosition.cjs

@@ -4,7 +4,7 @@ var React = require('react');
 var utils = require('../utils.cjs');
 
 function usePrevious(value) {
-    const ref = React.useRef();
+    const ref = React.useRef(undefined);
     React.useEffect(() => {
         ref.current = value;
     });

package/dist/components/ViewsContainer/hooks/useSetScrollPosition.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useSetScrollPosition.cjs","sources":["../../../../src/components/ViewsContainer/hooks/useSetScrollPosition.ts"],"sourcesContent":["import {\n  MutableRefObject,\n  ReactNode,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n  Children,\n} from 'react';\nimport { createViewPositionArray, getNextViewPosition, getPrevViewPosition } from '../utils';\n\nfunction usePrevious<T>(value: T): T | undefined {\n  const ref = useRef<T>();\n  useEffect(() => {\n    ref.current = value;\n  });\n  return ref.current;\n}\n\ntype UseSetScrollPositionProps = {\n  containerRef: MutableRefObject<HTMLDivElement>;\n  children: ReactNode;\n  hasMoreViews?: boolean;\n  onFetchMoreViews?: () => void;\n  isLoadingMoreViews?: boolean;\n};\n\nexport const useSetScrollPosition = ({\n  containerRef,\n  children,\n  hasMoreViews = false,\n  onFetchMoreViews,\n  isLoadingMoreViews = false,\n}: UseSetScrollPositionProps) => {\n  const [leftDisabled, setLeftDisabled] = useState(true);\n  const [rightDisabled, setRightDisabled] = useState(false);\n  const [viewStartPositions, setViewStartPositions] = useState<number[]>([]);\n\n  const activeTab = containerRef?.current?.querySelector('[aria-selected = true]');\n  const prevActiveTab = usePrevious(activeTab);\n\n  const handleScroll = useCallback(() => {\n    if (containerRef.current?.scrollLeft > 0) {\n      setLeftDisabled(false);\n    } else {\n      if (document.getElementById('left-arrow') === document.activeElement) {\n        document.getElementById('right-arrow')?.focus();\n      }\n      setLeftDisabled(true);\n    }\n\n    const maxScrollWidth = containerRef.current?.scrollWidth ?? 0;\n    const maxClientWidth = containerRef.current?.clientWidth ?? 0;\n    const maxScrollLeft = maxScrollWidth - maxClientWidth;\n\n    // -10 to prevent javascript assertion errors on floating points\n    if (containerRef.current?.scrollLeft >= maxScrollLeft - 10) {\n      if (document.getElementById('right-arrow') === document.activeElement) {\n        document.getElementById('left-arrow')?.focus();\n      }\n      setRightDisabled(true);\n\n      // Check if we've reached the end and should fetch more data\n      // Only fetches more when not already loading more views and has more views to load\n      if (hasMoreViews && onFetchMoreViews && !isLoadingMoreViews) {\n        onFetchMoreViews();\n      }\n    } else {\n      setRightDisabled(false);\n    }\n  }, [containerRef, onFetchMoreViews, isLoadingMoreViews, hasMoreViews]);\n\n  const handleResize = useCallback(() => {\n    if (!containerRef.current) return;\n    if (containerRef.current.scrollWidth - containerRef.current.getBoundingClientRect().width < 5) {\n      setRightDisabled(true);\n    } else {\n      setRightDisabled(false);\n    }\n  }, [containerRef]);\n\n  const toNextScrollPosition = useCallback(() => {\n    const newPosition = getNextViewPosition(\n      viewStartPositions,\n      containerRef.current.scrollLeft,\n      containerRef.current.clientWidth,\n    );\n\n    containerRef.current.scrollTo({\n      left: newPosition,\n      top: 0,\n      behavior: 'smooth',\n    });\n  }, [containerRef, viewStartPositions]);\n\n  const toPrevScrollPosition = useCallback(() => {\n    const newPosition = getPrevViewPosition(viewStartPositions, containerRef.current.scrollLeft);\n\n    containerRef.current.scrollTo({\n      left: newPosition,\n      top: 0,\n      behavior: 'smooth',\n    });\n  }, [containerRef, viewStartPositions]);\n\n  // Initialize view positions when container first has children\n  useEffect(() => {\n    if (!containerRef?.current?.children?.length || viewStartPositions.length > 0) return;\n\n    setViewStartPositions(createViewPositionArray(containerRef.current));\n  }, [containerRef, viewStartPositions.length]);\n\n  // Handle new item addition - scroll to end and update positions\n  useEffect(() => {\n    if (!containerRef?.current?.children?.length) return;\n\n    const childrenCount = containerRef.current.children.length;\n    const positionsCount = viewStartPositions.length;\n    const totalChildren = Children.count(children);\n\n    const shouldScrollToNewItem =\n      childrenCount !== positionsCount && positionsCount > 0 && positionsCount < totalChildren;\n\n    if (!shouldScrollToNewItem) return;\n\n    containerRef.current.scrollTo({\n      left: containerRef.current.scrollWidth - containerRef.current.clientWidth,\n      top: 0,\n      behavior: 'smooth',\n    });\n\n    // Compute the x position of the new item\n    const lastChildRect =\n      containerRef.current.children[positionsCount - 1]?.getBoundingClientRect();\n    const newPosition = viewStartPositions[positionsCount - 1] + (lastChildRect?.x ?? 0) - 20;\n\n    setViewStartPositions([...viewStartPositions, newPosition]);\n  }, [containerRef, children, viewStartPositions]);\n\n  // Handle active tab changes - scroll to active tab\n  useEffect(() => {\n    if (!containerRef?.current?.children?.length) return;\n    if (activeTab === prevActiveTab || activeTab === null) return;\n    if (containerRef.current.children.length !== viewStartPositions.length) return;\n\n    const index = Array.from(containerRef.current.children).indexOf(activeTab);\n    if (index === -1) return;\n\n    containerRef.current.scrollTo({\n      left: viewStartPositions[index],\n      top: 0,\n      behavior: 'smooth',\n    });\n  }, [activeTab, prevActiveTab, containerRef, viewStartPositions]);\n\n  // Handle fetching more views - recompute positions\n  useEffect(() => {\n    if (!containerRef?.current?.children?.length) return;\n    if (viewStartPositions.length >= containerRef.current.children.length) return;\n\n    const currentScrollLeft = containerRef.current.scrollLeft;\n\n    // Temporarily reset scroll to 0 to get accurate positions\n    containerRef.current.scrollTo({ left: 0, top: 0, behavior: 'auto' });\n\n    // Recompute positions from scroll position 0\n    setViewStartPositions(createViewPositionArray(containerRef.current));\n\n    // Restore the user's scroll position\n    containerRef.current.scrollTo({ left: currentScrollLeft, top: 0, behavior: 'auto' });\n  }, [containerRef, viewStartPositions.length]);\n\n  // Handle window resize and scroll event listeners\n  useEffect(() => {\n    if (!containerRef?.current) return;\n\n    const container = containerRef.current;\n\n    handleResize();\n    window.addEventListener('resize', handleResize);\n    container.addEventListener('scroll', handleScroll);\n\n    // eslint-disable-next-line consistent-return\n    return () => {\n      window.removeEventListener('resize', handleResize);\n      container.removeEventListener('scroll', handleScroll);\n    };\n  }, [containerRef, handleResize, handleScroll]);\n\n  return { rightDisabled, leftDisabled, toNextScrollPosition, toPrevScrollPosition };\n};\n"],"names":["useRef","useEffect","useState","useCallback","getNextViewPosition","getPrevViewPosition","createViewPositionArray","Children"],"mappings":"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"}
+{"version":3,"file":"useSetScrollPosition.cjs","sources":["../../../../src/components/ViewsContainer/hooks/useSetScrollPosition.ts"],"sourcesContent":["import {\n  MutableRefObject,\n  ReactNode,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n  Children,\n} from 'react';\nimport { createViewPositionArray, getNextViewPosition, getPrevViewPosition } from '../utils';\n\nfunction usePrevious<T>(value: T): T | undefined {\n  const ref = useRef<T | undefined>(undefined);\n  useEffect(() => {\n    ref.current = value;\n  });\n  return ref.current;\n}\n\ntype UseSetScrollPositionProps = {\n  containerRef: MutableRefObject<HTMLDivElement>;\n  children: ReactNode;\n  hasMoreViews?: boolean;\n  onFetchMoreViews?: () => void;\n  isLoadingMoreViews?: boolean;\n};\n\nexport const useSetScrollPosition = ({\n  containerRef,\n  children,\n  hasMoreViews = false,\n  onFetchMoreViews,\n  isLoadingMoreViews = false,\n}: UseSetScrollPositionProps) => {\n  const [leftDisabled, setLeftDisabled] = useState(true);\n  const [rightDisabled, setRightDisabled] = useState(false);\n  const [viewStartPositions, setViewStartPositions] = useState<number[]>([]);\n\n  const activeTab = containerRef?.current?.querySelector('[aria-selected = true]');\n  const prevActiveTab = usePrevious(activeTab);\n\n  const handleScroll = useCallback(() => {\n    if (containerRef.current?.scrollLeft > 0) {\n      setLeftDisabled(false);\n    } else {\n      if (document.getElementById('left-arrow') === document.activeElement) {\n        document.getElementById('right-arrow')?.focus();\n      }\n      setLeftDisabled(true);\n    }\n\n    const maxScrollWidth = containerRef.current?.scrollWidth ?? 0;\n    const maxClientWidth = containerRef.current?.clientWidth ?? 0;\n    const maxScrollLeft = maxScrollWidth - maxClientWidth;\n\n    // -10 to prevent javascript assertion errors on floating points\n    if (containerRef.current?.scrollLeft >= maxScrollLeft - 10) {\n      if (document.getElementById('right-arrow') === document.activeElement) {\n        document.getElementById('left-arrow')?.focus();\n      }\n      setRightDisabled(true);\n\n      // Check if we've reached the end and should fetch more data\n      // Only fetches more when not already loading more views and has more views to load\n      if (hasMoreViews && onFetchMoreViews && !isLoadingMoreViews) {\n        onFetchMoreViews();\n      }\n    } else {\n      setRightDisabled(false);\n    }\n  }, [containerRef, onFetchMoreViews, isLoadingMoreViews, hasMoreViews]);\n\n  const handleResize = useCallback(() => {\n    if (!containerRef.current) return;\n    if (containerRef.current.scrollWidth - containerRef.current.getBoundingClientRect().width < 5) {\n      setRightDisabled(true);\n    } else {\n      setRightDisabled(false);\n    }\n  }, [containerRef]);\n\n  const toNextScrollPosition = useCallback(() => {\n    const newPosition = getNextViewPosition(\n      viewStartPositions,\n      containerRef.current.scrollLeft,\n      containerRef.current.clientWidth,\n    );\n\n    containerRef.current.scrollTo({\n      left: newPosition,\n      top: 0,\n      behavior: 'smooth',\n    });\n  }, [containerRef, viewStartPositions]);\n\n  const toPrevScrollPosition = useCallback(() => {\n    const newPosition = getPrevViewPosition(viewStartPositions, containerRef.current.scrollLeft);\n\n    containerRef.current.scrollTo({\n      left: newPosition,\n      top: 0,\n      behavior: 'smooth',\n    });\n  }, [containerRef, viewStartPositions]);\n\n  // Initialize view positions when container first has children\n  useEffect(() => {\n    if (!containerRef?.current?.children?.length || viewStartPositions.length > 0) return;\n\n    setViewStartPositions(createViewPositionArray(containerRef.current));\n  }, [containerRef, viewStartPositions.length]);\n\n  // Handle new item addition - scroll to end and update positions\n  useEffect(() => {\n    if (!containerRef?.current?.children?.length) return;\n\n    const childrenCount = containerRef.current.children.length;\n    const positionsCount = viewStartPositions.length;\n    const totalChildren = Children.count(children);\n\n    const shouldScrollToNewItem =\n      childrenCount !== positionsCount && positionsCount > 0 && positionsCount < totalChildren;\n\n    if (!shouldScrollToNewItem) return;\n\n    containerRef.current.scrollTo({\n      left: containerRef.current.scrollWidth - containerRef.current.clientWidth,\n      top: 0,\n      behavior: 'smooth',\n    });\n\n    // Compute the x position of the new item\n    const lastChildRect =\n      containerRef.current.children[positionsCount - 1]?.getBoundingClientRect();\n    const newPosition = viewStartPositions[positionsCount - 1] + (lastChildRect?.x ?? 0) - 20;\n\n    setViewStartPositions([...viewStartPositions, newPosition]);\n  }, [containerRef, children, viewStartPositions]);\n\n  // Handle active tab changes - scroll to active tab\n  useEffect(() => {\n    if (!containerRef?.current?.children?.length) return;\n    if (activeTab === prevActiveTab || activeTab === null) return;\n    if (containerRef.current.children.length !== viewStartPositions.length) return;\n\n    const index = Array.from(containerRef.current.children).indexOf(activeTab);\n    if (index === -1) return;\n\n    containerRef.current.scrollTo({\n      left: viewStartPositions[index],\n      top: 0,\n      behavior: 'smooth',\n    });\n  }, [activeTab, prevActiveTab, containerRef, viewStartPositions]);\n\n  // Handle fetching more views - recompute positions\n  useEffect(() => {\n    if (!containerRef?.current?.children?.length) return;\n    if (viewStartPositions.length >= containerRef.current.children.length) return;\n\n    const currentScrollLeft = containerRef.current.scrollLeft;\n\n    // Temporarily reset scroll to 0 to get accurate positions\n    containerRef.current.scrollTo({ left: 0, top: 0, behavior: 'auto' });\n\n    // Recompute positions from scroll position 0\n    setViewStartPositions(createViewPositionArray(containerRef.current));\n\n    // Restore the user's scroll position\n    containerRef.current.scrollTo({ left: currentScrollLeft, top: 0, behavior: 'auto' });\n  }, [containerRef, viewStartPositions.length]);\n\n  // Handle window resize and scroll event listeners\n  useEffect(() => {\n    if (!containerRef?.current) return;\n\n    const container = containerRef.current;\n\n    handleResize();\n    window.addEventListener('resize', handleResize);\n    container.addEventListener('scroll', handleScroll);\n\n    // eslint-disable-next-line consistent-return\n    return () => {\n      window.removeEventListener('resize', handleResize);\n      container.removeEventListener('scroll', handleScroll);\n    };\n  }, [containerRef, handleResize, handleScroll]);\n\n  return { rightDisabled, leftDisabled, toNextScrollPosition, toPrevScrollPosition };\n};\n"],"names":["useRef","useEffect","useState","useCallback","getNextViewPosition","getPrevViewPosition","createViewPositionArray","Children"],"mappings":"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"}

package/dist/components/ViewsContainer/hooks/useSetScrollPosition.js

@@ -2,7 +2,7 @@ import { useState, useCallback, useEffect, Children, useRef } from 'react';
 import { getNextViewPosition, getPrevViewPosition, createViewPositionArray } from '../utils.js';
 
 function usePrevious(value) {
-    const ref = useRef();
+    const ref = useRef(undefined);
     useEffect(() => {
         ref.current = value;
     });

package/dist/components/ViewsContainer/hooks/useSetScrollPosition.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSetScrollPosition.js","sources":["../../../../src/components/ViewsContainer/hooks/useSetScrollPosition.ts"],"sourcesContent":["import {\n  MutableRefObject,\n  ReactNode,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n  Children,\n} from 'react';\nimport { createViewPositionArray, getNextViewPosition, getPrevViewPosition } from '../utils';\n\nfunction usePrevious<T>(value: T): T | undefined {\n  const ref = useRef<T>();\n  useEffect(() => {\n    ref.current = value;\n  });\n  return ref.current;\n}\n\ntype UseSetScrollPositionProps = {\n  containerRef: MutableRefObject<HTMLDivElement>;\n  children: ReactNode;\n  hasMoreViews?: boolean;\n  onFetchMoreViews?: () => void;\n  isLoadingMoreViews?: boolean;\n};\n\nexport const useSetScrollPosition = ({\n  containerRef,\n  children,\n  hasMoreViews = false,\n  onFetchMoreViews,\n  isLoadingMoreViews = false,\n}: UseSetScrollPositionProps) => {\n  const [leftDisabled, setLeftDisabled] = useState(true);\n  const [rightDisabled, setRightDisabled] = useState(false);\n  const [viewStartPositions, setViewStartPositions] = useState<number[]>([]);\n\n  const activeTab = containerRef?.current?.querySelector('[aria-selected = true]');\n  const prevActiveTab = usePrevious(activeTab);\n\n  const handleScroll = useCallback(() => {\n    if (containerRef.current?.scrollLeft > 0) {\n      setLeftDisabled(false);\n    } else {\n      if (document.getElementById('left-arrow') === document.activeElement) {\n        document.getElementById('right-arrow')?.focus();\n      }\n      setLeftDisabled(true);\n    }\n\n    const maxScrollWidth = containerRef.current?.scrollWidth ?? 0;\n    const maxClientWidth = containerRef.current?.clientWidth ?? 0;\n    const maxScrollLeft = maxScrollWidth - maxClientWidth;\n\n    // -10 to prevent javascript assertion errors on floating points\n    if (containerRef.current?.scrollLeft >= maxScrollLeft - 10) {\n      if (document.getElementById('right-arrow') === document.activeElement) {\n        document.getElementById('left-arrow')?.focus();\n      }\n      setRightDisabled(true);\n\n      // Check if we've reached the end and should fetch more data\n      // Only fetches more when not already loading more views and has more views to load\n      if (hasMoreViews && onFetchMoreViews && !isLoadingMoreViews) {\n        onFetchMoreViews();\n      }\n    } else {\n      setRightDisabled(false);\n    }\n  }, [containerRef, onFetchMoreViews, isLoadingMoreViews, hasMoreViews]);\n\n  const handleResize = useCallback(() => {\n    if (!containerRef.current) return;\n    if (containerRef.current.scrollWidth - containerRef.current.getBoundingClientRect().width < 5) {\n      setRightDisabled(true);\n    } else {\n      setRightDisabled(false);\n    }\n  }, [containerRef]);\n\n  const toNextScrollPosition = useCallback(() => {\n    const newPosition = getNextViewPosition(\n      viewStartPositions,\n      containerRef.current.scrollLeft,\n      containerRef.current.clientWidth,\n    );\n\n    containerRef.current.scrollTo({\n      left: newPosition,\n      top: 0,\n      behavior: 'smooth',\n    });\n  }, [containerRef, viewStartPositions]);\n\n  const toPrevScrollPosition = useCallback(() => {\n    const newPosition = getPrevViewPosition(viewStartPositions, containerRef.current.scrollLeft);\n\n    containerRef.current.scrollTo({\n      left: newPosition,\n      top: 0,\n      behavior: 'smooth',\n    });\n  }, [containerRef, viewStartPositions]);\n\n  // Initialize view positions when container first has children\n  useEffect(() => {\n    if (!containerRef?.current?.children?.length || viewStartPositions.length > 0) return;\n\n    setViewStartPositions(createViewPositionArray(containerRef.current));\n  }, [containerRef, viewStartPositions.length]);\n\n  // Handle new item addition - scroll to end and update positions\n  useEffect(() => {\n    if (!containerRef?.current?.children?.length) return;\n\n    const childrenCount = containerRef.current.children.length;\n    const positionsCount = viewStartPositions.length;\n    const totalChildren = Children.count(children);\n\n    const shouldScrollToNewItem =\n      childrenCount !== positionsCount && positionsCount > 0 && positionsCount < totalChildren;\n\n    if (!shouldScrollToNewItem) return;\n\n    containerRef.current.scrollTo({\n      left: containerRef.current.scrollWidth - containerRef.current.clientWidth,\n      top: 0,\n      behavior: 'smooth',\n    });\n\n    // Compute the x position of the new item\n    const lastChildRect =\n      containerRef.current.children[positionsCount - 1]?.getBoundingClientRect();\n    const newPosition = viewStartPositions[positionsCount - 1] + (lastChildRect?.x ?? 0) - 20;\n\n    setViewStartPositions([...viewStartPositions, newPosition]);\n  }, [containerRef, children, viewStartPositions]);\n\n  // Handle active tab changes - scroll to active tab\n  useEffect(() => {\n    if (!containerRef?.current?.children?.length) return;\n    if (activeTab === prevActiveTab || activeTab === null) return;\n    if (containerRef.current.children.length !== viewStartPositions.length) return;\n\n    const index = Array.from(containerRef.current.children).indexOf(activeTab);\n    if (index === -1) return;\n\n    containerRef.current.scrollTo({\n      left: viewStartPositions[index],\n      top: 0,\n      behavior: 'smooth',\n    });\n  }, [activeTab, prevActiveTab, containerRef, viewStartPositions]);\n\n  // Handle fetching more views - recompute positions\n  useEffect(() => {\n    if (!containerRef?.current?.children?.length) return;\n    if (viewStartPositions.length >= containerRef.current.children.length) return;\n\n    const currentScrollLeft = containerRef.current.scrollLeft;\n\n    // Temporarily reset scroll to 0 to get accurate positions\n    containerRef.current.scrollTo({ left: 0, top: 0, behavior: 'auto' });\n\n    // Recompute positions from scroll position 0\n    setViewStartPositions(createViewPositionArray(containerRef.current));\n\n    // Restore the user's scroll position\n    containerRef.current.scrollTo({ left: currentScrollLeft, top: 0, behavior: 'auto' });\n  }, [containerRef, viewStartPositions.length]);\n\n  // Handle window resize and scroll event listeners\n  useEffect(() => {\n    if (!containerRef?.current) return;\n\n    const container = containerRef.current;\n\n    handleResize();\n    window.addEventListener('resize', handleResize);\n    container.addEventListener('scroll', handleScroll);\n\n    // eslint-disable-next-line consistent-return\n    return () => {\n      window.removeEventListener('resize', handleResize);\n      container.removeEventListener('scroll', handleScroll);\n    };\n  }, [containerRef, handleResize, handleScroll]);\n\n  return { rightDisabled, leftDisabled, toNextScrollPosition, toPrevScrollPosition };\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useSetScrollPosition.js","sources":["../../../../src/components/ViewsContainer/hooks/useSetScrollPosition.ts"],"sourcesContent":["import {\n  MutableRefObject,\n  ReactNode,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n  Children,\n} from 'react';\nimport { createViewPositionArray, getNextViewPosition, getPrevViewPosition } from '../utils';\n\nfunction usePrevious<T>(value: T): T | undefined {\n  const ref = useRef<T | undefined>(undefined);\n  useEffect(() => {\n    ref.current = value;\n  });\n  return ref.current;\n}\n\ntype UseSetScrollPositionProps = {\n  containerRef: MutableRefObject<HTMLDivElement>;\n  children: ReactNode;\n  hasMoreViews?: boolean;\n  onFetchMoreViews?: () => void;\n  isLoadingMoreViews?: boolean;\n};\n\nexport const useSetScrollPosition = ({\n  containerRef,\n  children,\n  hasMoreViews = false,\n  onFetchMoreViews,\n  isLoadingMoreViews = false,\n}: UseSetScrollPositionProps) => {\n  const [leftDisabled, setLeftDisabled] = useState(true);\n  const [rightDisabled, setRightDisabled] = useState(false);\n  const [viewStartPositions, setViewStartPositions] = useState<number[]>([]);\n\n  const activeTab = containerRef?.current?.querySelector('[aria-selected = true]');\n  const prevActiveTab = usePrevious(activeTab);\n\n  const handleScroll = useCallback(() => {\n    if (containerRef.current?.scrollLeft > 0) {\n      setLeftDisabled(false);\n    } else {\n      if (document.getElementById('left-arrow') === document.activeElement) {\n        document.getElementById('right-arrow')?.focus();\n      }\n      setLeftDisabled(true);\n    }\n\n    const maxScrollWidth = containerRef.current?.scrollWidth ?? 0;\n    const maxClientWidth = containerRef.current?.clientWidth ?? 0;\n    const maxScrollLeft = maxScrollWidth - maxClientWidth;\n\n    // -10 to prevent javascript assertion errors on floating points\n    if (containerRef.current?.scrollLeft >= maxScrollLeft - 10) {\n      if (document.getElementById('right-arrow') === document.activeElement) {\n        document.getElementById('left-arrow')?.focus();\n      }\n      setRightDisabled(true);\n\n      // Check if we've reached the end and should fetch more data\n      // Only fetches more when not already loading more views and has more views to load\n      if (hasMoreViews && onFetchMoreViews && !isLoadingMoreViews) {\n        onFetchMoreViews();\n      }\n    } else {\n      setRightDisabled(false);\n    }\n  }, [containerRef, onFetchMoreViews, isLoadingMoreViews, hasMoreViews]);\n\n  const handleResize = useCallback(() => {\n    if (!containerRef.current) return;\n    if (containerRef.current.scrollWidth - containerRef.current.getBoundingClientRect().width < 5) {\n      setRightDisabled(true);\n    } else {\n      setRightDisabled(false);\n    }\n  }, [containerRef]);\n\n  const toNextScrollPosition = useCallback(() => {\n    const newPosition = getNextViewPosition(\n      viewStartPositions,\n      containerRef.current.scrollLeft,\n      containerRef.current.clientWidth,\n    );\n\n    containerRef.current.scrollTo({\n      left: newPosition,\n      top: 0,\n      behavior: 'smooth',\n    });\n  }, [containerRef, viewStartPositions]);\n\n  const toPrevScrollPosition = useCallback(() => {\n    const newPosition = getPrevViewPosition(viewStartPositions, containerRef.current.scrollLeft);\n\n    containerRef.current.scrollTo({\n      left: newPosition,\n      top: 0,\n      behavior: 'smooth',\n    });\n  }, [containerRef, viewStartPositions]);\n\n  // Initialize view positions when container first has children\n  useEffect(() => {\n    if (!containerRef?.current?.children?.length || viewStartPositions.length > 0) return;\n\n    setViewStartPositions(createViewPositionArray(containerRef.current));\n  }, [containerRef, viewStartPositions.length]);\n\n  // Handle new item addition - scroll to end and update positions\n  useEffect(() => {\n    if (!containerRef?.current?.children?.length) return;\n\n    const childrenCount = containerRef.current.children.length;\n    const positionsCount = viewStartPositions.length;\n    const totalChildren = Children.count(children);\n\n    const shouldScrollToNewItem =\n      childrenCount !== positionsCount && positionsCount > 0 && positionsCount < totalChildren;\n\n    if (!shouldScrollToNewItem) return;\n\n    containerRef.current.scrollTo({\n      left: containerRef.current.scrollWidth - containerRef.current.clientWidth,\n      top: 0,\n      behavior: 'smooth',\n    });\n\n    // Compute the x position of the new item\n    const lastChildRect =\n      containerRef.current.children[positionsCount - 1]?.getBoundingClientRect();\n    const newPosition = viewStartPositions[positionsCount - 1] + (lastChildRect?.x ?? 0) - 20;\n\n    setViewStartPositions([...viewStartPositions, newPosition]);\n  }, [containerRef, children, viewStartPositions]);\n\n  // Handle active tab changes - scroll to active tab\n  useEffect(() => {\n    if (!containerRef?.current?.children?.length) return;\n    if (activeTab === prevActiveTab || activeTab === null) return;\n    if (containerRef.current.children.length !== viewStartPositions.length) return;\n\n    const index = Array.from(containerRef.current.children).indexOf(activeTab);\n    if (index === -1) return;\n\n    containerRef.current.scrollTo({\n      left: viewStartPositions[index],\n      top: 0,\n      behavior: 'smooth',\n    });\n  }, [activeTab, prevActiveTab, containerRef, viewStartPositions]);\n\n  // Handle fetching more views - recompute positions\n  useEffect(() => {\n    if (!containerRef?.current?.children?.length) return;\n    if (viewStartPositions.length >= containerRef.current.children.length) return;\n\n    const currentScrollLeft = containerRef.current.scrollLeft;\n\n    // Temporarily reset scroll to 0 to get accurate positions\n    containerRef.current.scrollTo({ left: 0, top: 0, behavior: 'auto' });\n\n    // Recompute positions from scroll position 0\n    setViewStartPositions(createViewPositionArray(containerRef.current));\n\n    // Restore the user's scroll position\n    containerRef.current.scrollTo({ left: currentScrollLeft, top: 0, behavior: 'auto' });\n  }, [containerRef, viewStartPositions.length]);\n\n  // Handle window resize and scroll event listeners\n  useEffect(() => {\n    if (!containerRef?.current) return;\n\n    const container = containerRef.current;\n\n    handleResize();\n    window.addEventListener('resize', handleResize);\n    container.addEventListener('scroll', handleScroll);\n\n    // eslint-disable-next-line consistent-return\n    return () => {\n      window.removeEventListener('resize', handleResize);\n      container.removeEventListener('scroll', handleScroll);\n    };\n  }, [containerRef, handleResize, handleScroll]);\n\n  return { rightDisabled, leftDisabled, toNextScrollPosition, toPrevScrollPosition };\n};\n"],"names":[],"mappings":"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"}

package/dist/components/WeightInput/WeightInput.cjs

@@ -63,9 +63,6 @@ const WeightInput = withLabels.withLabels((props) => {
     return null;
 });
 WeightInput.displayName = 'WeightInput';
-WeightInput.defaultProps = {
-    weightUnit: 'lb',
-};
 
 exports.WeightInput = WeightInput;
 //# sourceMappingURL=WeightInput.cjs.map

package/dist/components/WeightInput/WeightInput.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"WeightInput.cjs","sources":["../../../src/components/WeightInput/WeightInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { blockInvalidCharacters } from '../../utils/blockInvalidCharacters';\nimport { invalidCharsList } from '../../utils/invalidCharactersNumeric';\n\nimport { Stack, StackProps } from '../Stack';\nimport { InputGroup, InputGroupProps } from '../InputGroup';\nimport { InputAffix, InputAffixProps } from '../InputAffix';\nimport { TextField, TextFieldProps } from '../TextField';\n\nimport { WeightProps, isWeightImperial, isWeightMetric } from './types';\n\ntype ChildComponentProps = {\n  stack: Partial<StackProps>;\n  inputGroup: Partial<InputGroupProps>;\n  textField: Partial<TextFieldProps>;\n  inputAffix: Partial<InputAffixProps>;\n};\n\nconst flexStyle = { flex: 1 };\n\nconst blockInvalidChars = (e: React.KeyboardEvent) => blockInvalidCharacters(e, invalidCharsList);\n\nexport const WeightInput = withLabels<WeightProps>((props) => {\n  const { size = 'base', hasError, disabled, className } = props;\n\n  const compact = size === 'sm';\n\n  const childProps: ChildComponentProps = {\n    stack: {\n      direction: 'horizontal',\n      alignY: 'center',\n      spacing: 'base',\n    },\n    inputGroup: {\n      style: flexStyle,\n    },\n    textField: {\n      type: 'number',\n      placeholder: '0',\n      min: '0',\n      step: 'any',\n      size,\n      disabled,\n      hasError,\n      onKeyDown: blockInvalidChars,\n      style: flexStyle,\n    },\n    inputAffix: {\n      compact,\n    },\n  };\n\n  // If the weight is metric, render grams\n  if (isWeightMetric(props)) {\n    return (\n      <InputGroup {...childProps.inputGroup} className={className}>\n        <TextField\n          {...childProps.textField}\n          name=\"gram\"\n          value={props.gram}\n          aria-label=\"Grams\"\n          onChange={props.handleChangeGram}\n        />\n        <InputAffix {...childProps.inputAffix}>g</InputAffix>\n      </InputGroup>\n    );\n  }\n\n  // If the weight is imperial, render pounds and ounces\n  if (isWeightImperial(props)) {\n    return (\n      <Stack {...childProps.stack} className={className}>\n        <InputGroup {...childProps.inputGroup}>\n          <TextField\n            {...childProps.textField}\n            name=\"pound\"\n            value={props.pound}\n            aria-label=\"Pounds\"\n            onChange={props.handleChangePound}\n          />\n          <InputAffix {...childProps.inputAffix}>lb</InputAffix>\n        </InputGroup>\n        <InputGroup {...childProps.inputGroup}>\n          <TextField\n            {...childProps.textField}\n            name=\"ounce\"\n            value={props.ounce}\n            aria-label=\"Ounces\"\n            onChange={props.handleChangeOunce}\n          />\n          <InputAffix {...childProps.inputAffix}>oz</InputAffix>\n        </InputGroup>\n      </Stack>\n    );\n  }\n\n  // If neither metric nor imperial, return null or handle as needed\n  return null;\n});\n\nWeightInput.displayName = 'WeightInput';\n\nWeightInput.defaultProps = {\n  weightUnit: 'lb',\n};\n"],"names":["blockInvalidCharacters","invalidCharsList","withLabels","isWeightMetric","React","InputGroup","TextField","InputAffix","isWeightImperial","Stack"],"mappings":"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"}
+{"version":3,"file":"WeightInput.cjs","sources":["../../../src/components/WeightInput/WeightInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { blockInvalidCharacters } from '../../utils/blockInvalidCharacters';\nimport { invalidCharsList } from '../../utils/invalidCharactersNumeric';\n\nimport { Stack, StackProps } from '../Stack';\nimport { InputGroup, InputGroupProps } from '../InputGroup';\nimport { InputAffix, InputAffixProps } from '../InputAffix';\nimport { TextField, TextFieldProps } from '../TextField';\n\nimport { WeightProps, isWeightImperial, isWeightMetric } from './types';\n\ntype ChildComponentProps = {\n  stack: Partial<StackProps>;\n  inputGroup: Partial<InputGroupProps>;\n  textField: Partial<TextFieldProps>;\n  inputAffix: Partial<InputAffixProps>;\n};\n\nconst flexStyle = { flex: 1 };\n\nconst blockInvalidChars = (e: React.KeyboardEvent) => blockInvalidCharacters(e, invalidCharsList);\n\nexport const WeightInput = withLabels<WeightProps>((props) => {\n  const { size = 'base', hasError, disabled, className } = props;\n\n  const compact = size === 'sm';\n\n  const childProps: ChildComponentProps = {\n    stack: {\n      direction: 'horizontal',\n      alignY: 'center',\n      spacing: 'base',\n    },\n    inputGroup: {\n      style: flexStyle,\n    },\n    textField: {\n      type: 'number',\n      placeholder: '0',\n      min: '0',\n      step: 'any',\n      size,\n      disabled,\n      hasError,\n      onKeyDown: blockInvalidChars,\n      style: flexStyle,\n    },\n    inputAffix: {\n      compact,\n    },\n  };\n\n  // If the weight is metric, render grams\n  if (isWeightMetric(props)) {\n    return (\n      <InputGroup {...childProps.inputGroup} className={className}>\n        <TextField\n          {...childProps.textField}\n          name=\"gram\"\n          value={props.gram}\n          aria-label=\"Grams\"\n          onChange={props.handleChangeGram}\n        />\n        <InputAffix {...childProps.inputAffix}>g</InputAffix>\n      </InputGroup>\n    );\n  }\n\n  // If the weight is imperial, render pounds and ounces\n  if (isWeightImperial(props)) {\n    return (\n      <Stack {...childProps.stack} className={className}>\n        <InputGroup {...childProps.inputGroup}>\n          <TextField\n            {...childProps.textField}\n            name=\"pound\"\n            value={props.pound}\n            aria-label=\"Pounds\"\n            onChange={props.handleChangePound}\n          />\n          <InputAffix {...childProps.inputAffix}>lb</InputAffix>\n        </InputGroup>\n        <InputGroup {...childProps.inputGroup}>\n          <TextField\n            {...childProps.textField}\n            name=\"ounce\"\n            value={props.ounce}\n            aria-label=\"Ounces\"\n            onChange={props.handleChangeOunce}\n          />\n          <InputAffix {...childProps.inputAffix}>oz</InputAffix>\n        </InputGroup>\n      </Stack>\n    );\n  }\n\n  // If neither metric nor imperial, return null or handle as needed\n  return null;\n});\n\nWeightInput.displayName = 'WeightInput';\n"],"names":["blockInvalidCharacters","invalidCharsList","withLabels","isWeightMetric","React","InputGroup","TextField","InputAffix","isWeightImperial","Stack"],"mappings":"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"}

package/dist/components/WeightInput/WeightInput.js

@@ -57,9 +57,6 @@ const WeightInput = withLabels((props) => {
     return null;
 });
 WeightInput.displayName = 'WeightInput';
-WeightInput.defaultProps = {
-    weightUnit: 'lb',
-};
 
 export { WeightInput };
 //# sourceMappingURL=WeightInput.js.map

package/dist/components/WeightInput/WeightInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"WeightInput.js","sources":["../../../src/components/WeightInput/WeightInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { blockInvalidCharacters } from '../../utils/blockInvalidCharacters';\nimport { invalidCharsList } from '../../utils/invalidCharactersNumeric';\n\nimport { Stack, StackProps } from '../Stack';\nimport { InputGroup, InputGroupProps } from '../InputGroup';\nimport { InputAffix, InputAffixProps } from '../InputAffix';\nimport { TextField, TextFieldProps } from '../TextField';\n\nimport { WeightProps, isWeightImperial, isWeightMetric } from './types';\n\ntype ChildComponentProps = {\n  stack: Partial<StackProps>;\n  inputGroup: Partial<InputGroupProps>;\n  textField: Partial<TextFieldProps>;\n  inputAffix: Partial<InputAffixProps>;\n};\n\nconst flexStyle = { flex: 1 };\n\nconst blockInvalidChars = (e: React.KeyboardEvent) => blockInvalidCharacters(e, invalidCharsList);\n\nexport const WeightInput = withLabels<WeightProps>((props) => {\n  const { size = 'base', hasError, disabled, className } = props;\n\n  const compact = size === 'sm';\n\n  const childProps: ChildComponentProps = {\n    stack: {\n      direction: 'horizontal',\n      alignY: 'center',\n      spacing: 'base',\n    },\n    inputGroup: {\n      style: flexStyle,\n    },\n    textField: {\n      type: 'number',\n      placeholder: '0',\n      min: '0',\n      step: 'any',\n      size,\n      disabled,\n      hasError,\n      onKeyDown: blockInvalidChars,\n      style: flexStyle,\n    },\n    inputAffix: {\n      compact,\n    },\n  };\n\n  // If the weight is metric, render grams\n  if (isWeightMetric(props)) {\n    return (\n      <InputGroup {...childProps.inputGroup} className={className}>\n        <TextField\n          {...childProps.textField}\n          name=\"gram\"\n          value={props.gram}\n          aria-label=\"Grams\"\n          onChange={props.handleChangeGram}\n        />\n        <InputAffix {...childProps.inputAffix}>g</InputAffix>\n      </InputGroup>\n    );\n  }\n\n  // If the weight is imperial, render pounds and ounces\n  if (isWeightImperial(props)) {\n    return (\n      <Stack {...childProps.stack} className={className}>\n        <InputGroup {...childProps.inputGroup}>\n          <TextField\n            {...childProps.textField}\n            name=\"pound\"\n            value={props.pound}\n            aria-label=\"Pounds\"\n            onChange={props.handleChangePound}\n          />\n          <InputAffix {...childProps.inputAffix}>lb</InputAffix>\n        </InputGroup>\n        <InputGroup {...childProps.inputGroup}>\n          <TextField\n            {...childProps.textField}\n            name=\"ounce\"\n            value={props.ounce}\n            aria-label=\"Ounces\"\n            onChange={props.handleChangeOunce}\n          />\n          <InputAffix {...childProps.inputAffix}>oz</InputAffix>\n        </InputGroup>\n      </Stack>\n    );\n  }\n\n  // If neither metric nor imperial, return null or handle as needed\n  return null;\n});\n\nWeightInput.displayName = 'WeightInput';\n\nWeightInput.defaultProps = {\n  weightUnit: 'lb',\n};\n"],"names":["React"],"mappings":"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"}
+{"version":3,"file":"WeightInput.js","sources":["../../../src/components/WeightInput/WeightInput.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { blockInvalidCharacters } from '../../utils/blockInvalidCharacters';\nimport { invalidCharsList } from '../../utils/invalidCharactersNumeric';\n\nimport { Stack, StackProps } from '../Stack';\nimport { InputGroup, InputGroupProps } from '../InputGroup';\nimport { InputAffix, InputAffixProps } from '../InputAffix';\nimport { TextField, TextFieldProps } from '../TextField';\n\nimport { WeightProps, isWeightImperial, isWeightMetric } from './types';\n\ntype ChildComponentProps = {\n  stack: Partial<StackProps>;\n  inputGroup: Partial<InputGroupProps>;\n  textField: Partial<TextFieldProps>;\n  inputAffix: Partial<InputAffixProps>;\n};\n\nconst flexStyle = { flex: 1 };\n\nconst blockInvalidChars = (e: React.KeyboardEvent) => blockInvalidCharacters(e, invalidCharsList);\n\nexport const WeightInput = withLabels<WeightProps>((props) => {\n  const { size = 'base', hasError, disabled, className } = props;\n\n  const compact = size === 'sm';\n\n  const childProps: ChildComponentProps = {\n    stack: {\n      direction: 'horizontal',\n      alignY: 'center',\n      spacing: 'base',\n    },\n    inputGroup: {\n      style: flexStyle,\n    },\n    textField: {\n      type: 'number',\n      placeholder: '0',\n      min: '0',\n      step: 'any',\n      size,\n      disabled,\n      hasError,\n      onKeyDown: blockInvalidChars,\n      style: flexStyle,\n    },\n    inputAffix: {\n      compact,\n    },\n  };\n\n  // If the weight is metric, render grams\n  if (isWeightMetric(props)) {\n    return (\n      <InputGroup {...childProps.inputGroup} className={className}>\n        <TextField\n          {...childProps.textField}\n          name=\"gram\"\n          value={props.gram}\n          aria-label=\"Grams\"\n          onChange={props.handleChangeGram}\n        />\n        <InputAffix {...childProps.inputAffix}>g</InputAffix>\n      </InputGroup>\n    );\n  }\n\n  // If the weight is imperial, render pounds and ounces\n  if (isWeightImperial(props)) {\n    return (\n      <Stack {...childProps.stack} className={className}>\n        <InputGroup {...childProps.inputGroup}>\n          <TextField\n            {...childProps.textField}\n            name=\"pound\"\n            value={props.pound}\n            aria-label=\"Pounds\"\n            onChange={props.handleChangePound}\n          />\n          <InputAffix {...childProps.inputAffix}>lb</InputAffix>\n        </InputGroup>\n        <InputGroup {...childProps.inputGroup}>\n          <TextField\n            {...childProps.textField}\n            name=\"ounce\"\n            value={props.ounce}\n            aria-label=\"Ounces\"\n            onChange={props.handleChangeOunce}\n          />\n          <InputAffix {...childProps.inputAffix}>oz</InputAffix>\n        </InputGroup>\n      </Stack>\n    );\n  }\n\n  // If neither metric nor imperial, return null or handle as needed\n  return null;\n});\n\nWeightInput.displayName = 'WeightInput';\n"],"names":["React"],"mappings":";;;;;;;;;;AAoBA,MAAM,SAAS,GAAG,EAAE,IAAI,EAAE,CAAC,EAAE;AAE7B,MAAM,iBAAiB,GAAG,CAAC,CAAsB,KAAK,sBAAsB,CAAC,CAAC,EAAE,gBAAgB,CAAC;MAEpF,WAAW,GAAG,UAAU,CAAc,CAAC,KAAK,KAAI;AAC3D,IAAA,MAAM,EAAE,IAAI,GAAG,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK;AAE9D,IAAA,MAAM,OAAO,GAAG,IAAI,KAAK,IAAI;AAE7B,IAAA,MAAM,UAAU,GAAwB;AACtC,QAAA,KAAK,EAAE;AACL,YAAA,SAAS,EAAE,YAAY;AACvB,YAAA,MAAM,EAAE,QAAQ;AAChB,YAAA,OAAO,EAAE,MAAM;AAChB,SAAA;AACD,QAAA,UAAU,EAAE;AACV,YAAA,KAAK,EAAE,SAAS;AACjB,SAAA;AACD,QAAA,SAAS,EAAE;AACT,YAAA,IAAI,EAAE,QAAQ;AACd,YAAA,WAAW,EAAE,GAAG;AAChB,YAAA,GAAG,EAAE,GAAG;AACR,YAAA,IAAI,EAAE,KAAK;YACX,IAAI;YACJ,QAAQ;YACR,QAAQ;AACR,YAAA,SAAS,EAAE,iBAAiB;AAC5B,YAAA,KAAK,EAAE,SAAS;AACjB,SAAA;AACD,QAAA,UAAU,EAAE;YACV,OAAO;AACR,SAAA;KACF;;AAGD,IAAA,IAAI,cAAc,CAAC,KAAK,CAAC,EAAE;QACzB,QACEA,cAAA,CAAA,aAAA,CAAC,UAAU,EAAA,EAAA,GAAK,UAAU,CAAC,UAAU,EAAE,SAAS,EAAE,SAAS,EAAA;YACzDA,cAAA,CAAA,aAAA,CAAC,SAAS,OACJ,UAAU,CAAC,SAAS,EACxB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,KAAK,CAAC,IAAI,EAAA,YAAA,EACN,OAAO,EAClB,QAAQ,EAAE,KAAK,CAAC,gBAAgB,EAAA,CAChC;YACFA,cAAA,CAAA,aAAA,CAAC,UAAU,OAAK,UAAU,CAAC,UAAU,EAAA,EAAA,GAAA,CAAgB,CAC1C;AAEhB,IAAA;;AAGD,IAAA,IAAI,gBAAgB,CAAC,KAAK,CAAC,EAAE;QAC3B,QACEA,cAAA,CAAA,aAAA,CAAC,KAAK,EAAA,EAAA,GAAK,UAAU,CAAC,KAAK,EAAE,SAAS,EAAE,SAAS,EAAA;AAC/C,YAAAA,cAAA,CAAA,aAAA,CAAC,UAAU,EAAA,EAAA,GAAK,UAAU,CAAC,UAAU,EAAA;gBACnCA,cAAA,CAAA,aAAA,CAAC,SAAS,OACJ,UAAU,CAAC,SAAS,EACxB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,KAAK,CAAC,KAAK,EAAA,YAAA,EACP,QAAQ,EACnB,QAAQ,EAAE,KAAK,CAAC,iBAAiB,EAAA,CACjC;AACF,gBAAAA,cAAA,CAAA,aAAA,CAAC,UAAU,EAAA,EAAA,GAAK,UAAU,CAAC,UAAU,SAAiB,CAC3C;AACb,YAAAA,cAAA,CAAA,aAAA,CAAC,UAAU,EAAA,EAAA,GAAK,UAAU,CAAC,UAAU,EAAA;gBACnCA,cAAA,CAAA,aAAA,CAAC,SAAS,OACJ,UAAU,CAAC,SAAS,EACxB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,KAAK,CAAC,KAAK,EAAA,YAAA,EACP,QAAQ,EACnB,QAAQ,EAAE,KAAK,CAAC,iBAAiB,EAAA,CACjC;gBACFA,cAAA,CAAA,aAAA,CAAC,UAAU,OAAK,UAAU,CAAC,UAAU,EAAA,EAAA,IAAA,CAAiB,CAC3C,CACP;AAEX,IAAA;;AAGD,IAAA,OAAO,IAAI;AACb,CAAC;AAED,WAAW,CAAC,WAAW,GAAG,aAAa;;;;"}

package/dist/hoc/withTokens/withTokens.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"withTokens.cjs","sources":["../../../src/hoc/withTokens/withTokens.tsx"],"sourcesContent":["import React, { ComponentType, forwardRef, ElementRef } from 'react';\nimport { ThemeType } from '../../components/TokenProvider/TokenProvider';\nimport { TokenProvider } from '../../components/TokenProvider';\n\nexport type WithTokensProps = {\n  theme?: ThemeType;\n};\n\n/**\n * HOC that adds an optional `theme` prop to a component.\n * When a theme is provided (via prop or `defaultTheme`), wraps the component\n * in a `TokenProvider`. Otherwise renders the component directly, allowing it\n * to inherit tokens from a parent `TokenProvider`. Forwards refs to the wrapped component.\n *\n * @param Component - The component to wrap\n * @param defaultTheme - Optional default theme applied when no `theme` prop is passed\n */\nexport const withTokens = <C extends ComponentType<any>>(\n  Component: C,\n  defaultTheme?: ThemeType,\n) => {\n  type P = React.ComponentPropsWithoutRef<C>;\n  type R = ElementRef<C>;\n\n  const ComponentWithTokens = forwardRef<R, P & WithTokensProps>(\n    ({ theme = defaultTheme, ...props }, ref) => {\n      const Comp = Component as ComponentType<any>;\n\n      if (theme) {\n        return (\n          <TokenProvider theme={theme}>\n            <Comp ref={ref} {...props} />\n          </TokenProvider>\n        );\n      }\n\n      return <Comp ref={ref} {...props} />;\n    },\n  );\n\n  ComponentWithTokens.displayName = `withTokens(${Component.displayName || Component.name || 'Component'})`;\n\n  return ComponentWithTokens;\n};\n"],"names":["forwardRef","React","TokenProvider"],"mappings":";;;;;;;;;AAQA;;;;;;;;AAQG;MACU,UAAU,GAAG,CACxB,SAAY,EACZ,YAAwB,KACtB;AAIF,IAAA,MAAM,mBAAmB,GAAGA,gBAAU,CACpC,CAAC,EAAE,KAAK,GAAG,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;QAC1C,MAAM,IAAI,GAAG,SAA+B;AAE5C,QAAA,IAAI,KAAK,EAAE;AACT,YAAA,QACEC,sBAAA,CAAA,aAAA,CAACC,2BAAa,EAAA,EAAC,KAAK,EAAE,KAAK,EAAA;gBACzBD,sBAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,GAAG,EAAE,GAAG,KAAM,KAAK,EAAA,CAAI,CACf;AAEnB,QAAA;QAED,OAAOA,sBAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,GAAG,EAAE,GAAG,EAAA,GAAM,KAAK,EAAA,CAAI;AACtC,IAAA,CAAC,CACF;AAED,IAAA,mBAAmB,CAAC,WAAW,GAAG,CAAA,WAAA,EAAc,SAAS,CAAC,WAAW,IAAI,SAAS,CAAC,IAAI,IAAI,WAAW,GAAG;AAEzG,IAAA,OAAO,mBAAmB;AAC5B;;;;"}
+{"version":3,"file":"withTokens.cjs","sources":["../../../src/hoc/withTokens/withTokens.tsx"],"sourcesContent":["import React, { ComponentType, forwardRef, ElementRef } from 'react';\nimport { ThemeType } from '../../components/TokenProvider/TokenProvider';\nimport { TokenProvider } from '../../components/TokenProvider';\n\nexport type WithTokensProps = {\n  theme?: ThemeType;\n};\n\n/**\n * HOC that adds an optional `theme` prop to a component.\n * When a theme is provided (via prop or `defaultTheme`), wraps the component\n * in a `TokenProvider`. Otherwise renders the component directly, allowing it\n * to inherit tokens from a parent `TokenProvider`. Forwards refs to the wrapped component.\n *\n * @param Component - The component to wrap\n * @param defaultTheme - Optional default theme applied when no `theme` prop is passed\n */\nexport const withTokens = <C extends ComponentType<any>>(\n  Component: C,\n  defaultTheme?: ThemeType,\n) => {\n  type P = React.ComponentPropsWithoutRef<C>;\n  // @ts-expect-error ElementRef<C> constraint fails with React 19 types but emits correct declarations for consumers\n  type R = ElementRef<C>;\n\n  const ComponentWithTokens = forwardRef<R, P & WithTokensProps>(\n    ({ theme = defaultTheme, ...props }, ref) => {\n      const Comp = Component as ComponentType<any>;\n\n      if (theme) {\n        return (\n          <TokenProvider theme={theme}>\n            <Comp ref={ref} {...props} />\n          </TokenProvider>\n        );\n      }\n\n      return <Comp ref={ref} {...props} />;\n    },\n  );\n\n  ComponentWithTokens.displayName = `withTokens(${Component.displayName || Component.name || 'Component'})`;\n\n  return ComponentWithTokens;\n};\n"],"names":["forwardRef","React","TokenProvider"],"mappings":";;;;;;;;;AAQA;;;;;;;;AAQG;MACU,UAAU,GAAG,CACxB,SAAY,EACZ,YAAwB,KACtB;AAKF,IAAA,MAAM,mBAAmB,GAAGA,gBAAU,CACpC,CAAC,EAAE,KAAK,GAAG,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;QAC1C,MAAM,IAAI,GAAG,SAA+B;AAE5C,QAAA,IAAI,KAAK,EAAE;AACT,YAAA,QACEC,sBAAA,CAAA,aAAA,CAACC,2BAAa,EAAA,EAAC,KAAK,EAAE,KAAK,EAAA;gBACzBD,sBAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,GAAG,EAAE,GAAG,KAAM,KAAK,EAAA,CAAI,CACf;AAEnB,QAAA;QAED,OAAOA,sBAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,GAAG,EAAE,GAAG,EAAA,GAAM,KAAK,EAAA,CAAI;AACtC,IAAA,CAAC,CACF;AAED,IAAA,mBAAmB,CAAC,WAAW,GAAG,CAAA,WAAA,EAAc,SAAS,CAAC,WAAW,IAAI,SAAS,CAAC,IAAI,IAAI,WAAW,GAAG;AAEzG,IAAA,OAAO,mBAAmB;AAC5B;;;;"}

package/dist/hoc/withTokens/withTokens.js.map

@@ -1 +1 @@
-{"version":3,"file":"withTokens.js","sources":["../../../src/hoc/withTokens/withTokens.tsx"],"sourcesContent":["import React, { ComponentType, forwardRef, ElementRef } from 'react';\nimport { ThemeType } from '../../components/TokenProvider/TokenProvider';\nimport { TokenProvider } from '../../components/TokenProvider';\n\nexport type WithTokensProps = {\n  theme?: ThemeType;\n};\n\n/**\n * HOC that adds an optional `theme` prop to a component.\n * When a theme is provided (via prop or `defaultTheme`), wraps the component\n * in a `TokenProvider`. Otherwise renders the component directly, allowing it\n * to inherit tokens from a parent `TokenProvider`. Forwards refs to the wrapped component.\n *\n * @param Component - The component to wrap\n * @param defaultTheme - Optional default theme applied when no `theme` prop is passed\n */\nexport const withTokens = <C extends ComponentType<any>>(\n  Component: C,\n  defaultTheme?: ThemeType,\n) => {\n  type P = React.ComponentPropsWithoutRef<C>;\n  type R = ElementRef<C>;\n\n  const ComponentWithTokens = forwardRef<R, P & WithTokensProps>(\n    ({ theme = defaultTheme, ...props }, ref) => {\n      const Comp = Component as ComponentType<any>;\n\n      if (theme) {\n        return (\n          <TokenProvider theme={theme}>\n            <Comp ref={ref} {...props} />\n          </TokenProvider>\n        );\n      }\n\n      return <Comp ref={ref} {...props} />;\n    },\n  );\n\n  ComponentWithTokens.displayName = `withTokens(${Component.displayName || Component.name || 'Component'})`;\n\n  return ComponentWithTokens;\n};\n"],"names":["React"],"mappings":";;;AAQA;;;;;;;;AAQG;MACU,UAAU,GAAG,CACxB,SAAY,EACZ,YAAwB,KACtB;AAIF,IAAA,MAAM,mBAAmB,GAAG,UAAU,CACpC,CAAC,EAAE,KAAK,GAAG,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;QAC1C,MAAM,IAAI,GAAG,SAA+B;AAE5C,QAAA,IAAI,KAAK,EAAE;AACT,YAAA,QACEA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,EAAC,KAAK,EAAE,KAAK,EAAA;gBACzBA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,GAAG,EAAE,GAAG,KAAM,KAAK,EAAA,CAAI,CACf;AAEnB,QAAA;QAED,OAAOA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,GAAG,EAAE,GAAG,EAAA,GAAM,KAAK,EAAA,CAAI;AACtC,IAAA,CAAC,CACF;AAED,IAAA,mBAAmB,CAAC,WAAW,GAAG,CAAA,WAAA,EAAc,SAAS,CAAC,WAAW,IAAI,SAAS,CAAC,IAAI,IAAI,WAAW,GAAG;AAEzG,IAAA,OAAO,mBAAmB;AAC5B;;;;"}
+{"version":3,"file":"withTokens.js","sources":["../../../src/hoc/withTokens/withTokens.tsx"],"sourcesContent":["import React, { ComponentType, forwardRef, ElementRef } from 'react';\nimport { ThemeType } from '../../components/TokenProvider/TokenProvider';\nimport { TokenProvider } from '../../components/TokenProvider';\n\nexport type WithTokensProps = {\n  theme?: ThemeType;\n};\n\n/**\n * HOC that adds an optional `theme` prop to a component.\n * When a theme is provided (via prop or `defaultTheme`), wraps the component\n * in a `TokenProvider`. Otherwise renders the component directly, allowing it\n * to inherit tokens from a parent `TokenProvider`. Forwards refs to the wrapped component.\n *\n * @param Component - The component to wrap\n * @param defaultTheme - Optional default theme applied when no `theme` prop is passed\n */\nexport const withTokens = <C extends ComponentType<any>>(\n  Component: C,\n  defaultTheme?: ThemeType,\n) => {\n  type P = React.ComponentPropsWithoutRef<C>;\n  // @ts-expect-error ElementRef<C> constraint fails with React 19 types but emits correct declarations for consumers\n  type R = ElementRef<C>;\n\n  const ComponentWithTokens = forwardRef<R, P & WithTokensProps>(\n    ({ theme = defaultTheme, ...props }, ref) => {\n      const Comp = Component as ComponentType<any>;\n\n      if (theme) {\n        return (\n          <TokenProvider theme={theme}>\n            <Comp ref={ref} {...props} />\n          </TokenProvider>\n        );\n      }\n\n      return <Comp ref={ref} {...props} />;\n    },\n  );\n\n  ComponentWithTokens.displayName = `withTokens(${Component.displayName || Component.name || 'Component'})`;\n\n  return ComponentWithTokens;\n};\n"],"names":["React"],"mappings":";;;AAQA;;;;;;;;AAQG;MACU,UAAU,GAAG,CACxB,SAAY,EACZ,YAAwB,KACtB;AAKF,IAAA,MAAM,mBAAmB,GAAG,UAAU,CACpC,CAAC,EAAE,KAAK,GAAG,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAI;QAC1C,MAAM,IAAI,GAAG,SAA+B;AAE5C,QAAA,IAAI,KAAK,EAAE;AACT,YAAA,QACEA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,EAAC,KAAK,EAAE,KAAK,EAAA;gBACzBA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,GAAG,EAAE,GAAG,KAAM,KAAK,EAAA,CAAI,CACf;AAEnB,QAAA;QAED,OAAOA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,GAAG,EAAE,GAAG,EAAA,GAAM,KAAK,EAAA,CAAI;AACtC,IAAA,CAAC,CACF;AAED,IAAA,mBAAmB,CAAC,WAAW,GAAG,CAAA,WAAA,EAAc,SAAS,CAAC,WAAW,IAAI,SAAS,CAAC,IAAI,IAAI,WAAW,GAAG;AAEzG,IAAA,OAAO,mBAAmB;AAC5B;;;;"}

package/dist/hooks/useClickOutside.d.ts

@@ -2,4 +2,4 @@
 /**
  * Close a menu or modal by clicking out of it
  */
-export declare const useClickOutside: (isOpen: boolean, onClose: () => void) => import("react").MutableRefObject<null>;
+export declare const useClickOutside: (isOpen: boolean, onClose: () => void) => import("react").RefObject<null>;

package/dist/hooks/useDragToScroll.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useDragToScroll.cjs","sources":["../../src/hooks/useDragToScroll.ts"],"sourcesContent":["import { useEffect, RefObject } from 'react';\n\ntype UseDragToScrollProps = {\n  targetRef: RefObject<HTMLElement>;\n  ignoreClassName?: string;\n};\n\n/**\n * Hook which allows the user to scroll horizontally by dragging on a given target element.\n * @param targetRef - The ref of the element to scroll.\n * @param ignoreClassName - The className of any elements which should be excluded from the dragging behaviour.\n */\nexport function useDragToScroll({ targetRef, ignoreClassName }: UseDragToScrollProps) {\n  useEffect(() => {\n    if (!targetRef.current) return;\n\n    let isDragging = false;\n    const scrollTarget = targetRef.current;\n    const position = {\n      left: 0,\n      x: 0,\n    };\n\n    const mouseMoveHandler = (e: MouseEvent) => {\n      if (!scrollTarget) return;\n      const dx = e.clientX - position.x;\n      scrollTarget.scrollLeft = position.left - dx;\n      if (!isDragging) {\n        scrollTarget.style.cursor = 'grabbing';\n        scrollTarget.style.userSelect = 'none';\n      }\n      isDragging = true;\n    };\n\n    const mouseUpHandler = () => {\n      document.removeEventListener('mousemove', mouseMoveHandler);\n      document.removeEventListener('mouseup', mouseUpHandler);\n      isDragging = false;\n      if (!scrollTarget) return;\n      scrollTarget.style.removeProperty('cursor');\n      scrollTarget.style.removeProperty('user-select');\n    };\n\n    const mouseDownHandler = (e: MouseEvent) => {\n      if (!scrollTarget) return;\n      /** NOTE: prevents table scroll when resizing columns,\n       * unable to use event.stopPropogation as event is a react Synthetic event which treats the event as the same, as they are on the same node, is discussed here\n       * https://dev.to/dvnrsn/why-isn-t-event-stoppropagation-working-1bnm.\n       */\n      if (\n        ignoreClassName &&\n        e.target instanceof HTMLElement &&\n        e.target?.classList?.contains?.(ignoreClassName)\n      ) {\n        return;\n      }\n\n      position.left = scrollTarget.scrollLeft;\n      position.x = e.clientX;\n      document.addEventListener('mousemove', mouseMoveHandler);\n      document.addEventListener('mouseup', mouseUpHandler);\n    };\n\n    scrollTarget.addEventListener('mousedown', mouseDownHandler);\n\n    /* eslint-disable-next-line consistent-return */\n    return () => scrollTarget?.removeEventListener('mousedown', mouseDownHandler);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [targetRef.current]);\n}\n"],"names":["useEffect"],"mappings":";;;;AAOA;;;;AAIG;SACa,eAAe,CAAC,EAAE,SAAS,EAAE,eAAe,EAAwB,EAAA;IAClFA,eAAS,CAAC,MAAK;QACb,IAAI,CAAC,SAAS,CAAC,OAAO;YAAE;QAExB,IAAI,UAAU,GAAG,KAAK;AACtB,QAAA,MAAM,YAAY,GAAG,SAAS,CAAC,OAAO;AACtC,QAAA,MAAM,QAAQ,GAAG;AACf,YAAA,IAAI,EAAE,CAAC;AACP,YAAA,CAAC,EAAE,CAAC;SACL;AAED,QAAA,MAAM,gBAAgB,GAAG,CAAC,CAAa,KAAI;AACzC,YAAA,IAAI,CAAC,YAAY;gBAAE;YACnB,MAAM,EAAE,GAAG,CAAC,CAAC,OAAO,GAAG,QAAQ,CAAC,CAAC;YACjC,YAAY,CAAC,UAAU,GAAG,QAAQ,CAAC,IAAI,GAAG,EAAE;YAC5C,IAAI,CAAC,UAAU,EAAE;AACf,gBAAA,YAAY,CAAC,KAAK,CAAC,MAAM,GAAG,UAAU;AACtC,gBAAA,YAAY,CAAC,KAAK,CAAC,UAAU,GAAG,MAAM;AACvC,YAAA;YACD,UAAU,GAAG,IAAI;AACnB,QAAA,CAAC;QAED,MAAM,cAAc,GAAG,MAAK;AAC1B,YAAA,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,CAAC;AAC3D,YAAA,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,cAAc,CAAC;YACvD,UAAU,GAAG,KAAK;AAClB,YAAA,IAAI,CAAC,YAAY;gBAAE;AACnB,YAAA,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC;AAC3C,YAAA,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC;AAClD,QAAA,CAAC;AAED,QAAA,MAAM,gBAAgB,GAAG,CAAC,CAAa,KAAI;;AACzC,YAAA,IAAI,CAAC,YAAY;gBAAE;AACnB;;;AAGG;AACH,YAAA,IACE,eAAe;gBACf,CAAC,CAAC,MAAM,YAAY,WAAW;AAC/B,iBAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAC,CAAC,MAAM,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,SAAS,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,EAAA,EAAG,eAAe,CAAC,CAAA,EAChD;gBACA;AACD,YAAA;AAED,YAAA,QAAQ,CAAC,IAAI,GAAG,YAAY,CAAC,UAAU;AACvC,YAAA,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO;AACtB,YAAA,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,gBAAgB,CAAC;AACxD,YAAA,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,cAAc,CAAC;AACtD,QAAA,CAAC;AAED,QAAA,YAAY,CAAC,gBAAgB,CAAC,WAAW,EAAE,gBAAgB,CAAC;;AAG5D,QAAA,OAAO,MAAM,YAAY,aAAZ,YAAY,KAAA,MAAA,GAAA,MAAA,GAAZ,YAAY,CAAE,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,CAAC;;AAE/E,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;AACzB;;;;"}
+{"version":3,"file":"useDragToScroll.cjs","sources":["../../src/hooks/useDragToScroll.ts"],"sourcesContent":["import { useEffect, RefObject } from 'react';\n\ntype UseDragToScrollProps = {\n  targetRef: RefObject<HTMLElement | null>;\n  ignoreClassName?: string;\n};\n\n/**\n * Hook which allows the user to scroll horizontally by dragging on a given target element.\n * @param targetRef - The ref of the element to scroll.\n * @param ignoreClassName - The className of any elements which should be excluded from the dragging behaviour.\n */\nexport function useDragToScroll({ targetRef, ignoreClassName }: UseDragToScrollProps) {\n  useEffect(() => {\n    if (!targetRef.current) return;\n\n    let isDragging = false;\n    const scrollTarget = targetRef.current;\n    const position = {\n      left: 0,\n      x: 0,\n    };\n\n    const mouseMoveHandler = (e: MouseEvent) => {\n      if (!scrollTarget) return;\n      const dx = e.clientX - position.x;\n      scrollTarget.scrollLeft = position.left - dx;\n      if (!isDragging) {\n        scrollTarget.style.cursor = 'grabbing';\n        scrollTarget.style.userSelect = 'none';\n      }\n      isDragging = true;\n    };\n\n    const mouseUpHandler = () => {\n      document.removeEventListener('mousemove', mouseMoveHandler);\n      document.removeEventListener('mouseup', mouseUpHandler);\n      isDragging = false;\n      if (!scrollTarget) return;\n      scrollTarget.style.removeProperty('cursor');\n      scrollTarget.style.removeProperty('user-select');\n    };\n\n    const mouseDownHandler = (e: MouseEvent) => {\n      if (!scrollTarget) return;\n      /** NOTE: prevents table scroll when resizing columns,\n       * unable to use event.stopPropogation as event is a react Synthetic event which treats the event as the same, as they are on the same node, is discussed here\n       * https://dev.to/dvnrsn/why-isn-t-event-stoppropagation-working-1bnm.\n       */\n      if (\n        ignoreClassName &&\n        e.target instanceof HTMLElement &&\n        e.target?.classList?.contains?.(ignoreClassName)\n      ) {\n        return;\n      }\n\n      position.left = scrollTarget.scrollLeft;\n      position.x = e.clientX;\n      document.addEventListener('mousemove', mouseMoveHandler);\n      document.addEventListener('mouseup', mouseUpHandler);\n    };\n\n    scrollTarget.addEventListener('mousedown', mouseDownHandler);\n\n    /* eslint-disable-next-line consistent-return */\n    return () => scrollTarget?.removeEventListener('mousedown', mouseDownHandler);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [targetRef.current]);\n}\n"],"names":["useEffect"],"mappings":";;;;AAOA;;;;AAIG;SACa,eAAe,CAAC,EAAE,SAAS,EAAE,eAAe,EAAwB,EAAA;IAClFA,eAAS,CAAC,MAAK;QACb,IAAI,CAAC,SAAS,CAAC,OAAO;YAAE;QAExB,IAAI,UAAU,GAAG,KAAK;AACtB,QAAA,MAAM,YAAY,GAAG,SAAS,CAAC,OAAO;AACtC,QAAA,MAAM,QAAQ,GAAG;AACf,YAAA,IAAI,EAAE,CAAC;AACP,YAAA,CAAC,EAAE,CAAC;SACL;AAED,QAAA,MAAM,gBAAgB,GAAG,CAAC,CAAa,KAAI;AACzC,YAAA,IAAI,CAAC,YAAY;gBAAE;YACnB,MAAM,EAAE,GAAG,CAAC,CAAC,OAAO,GAAG,QAAQ,CAAC,CAAC;YACjC,YAAY,CAAC,UAAU,GAAG,QAAQ,CAAC,IAAI,GAAG,EAAE;YAC5C,IAAI,CAAC,UAAU,EAAE;AACf,gBAAA,YAAY,CAAC,KAAK,CAAC,MAAM,GAAG,UAAU;AACtC,gBAAA,YAAY,CAAC,KAAK,CAAC,UAAU,GAAG,MAAM;AACvC,YAAA;YACD,UAAU,GAAG,IAAI;AACnB,QAAA,CAAC;QAED,MAAM,cAAc,GAAG,MAAK;AAC1B,YAAA,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,CAAC;AAC3D,YAAA,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,cAAc,CAAC;YACvD,UAAU,GAAG,KAAK;AAClB,YAAA,IAAI,CAAC,YAAY;gBAAE;AACnB,YAAA,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC;AAC3C,YAAA,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC;AAClD,QAAA,CAAC;AAED,QAAA,MAAM,gBAAgB,GAAG,CAAC,CAAa,KAAI;;AACzC,YAAA,IAAI,CAAC,YAAY;gBAAE;AACnB;;;AAGG;AACH,YAAA,IACE,eAAe;gBACf,CAAC,CAAC,MAAM,YAAY,WAAW;AAC/B,iBAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAC,CAAC,MAAM,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,SAAS,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,EAAA,EAAG,eAAe,CAAC,CAAA,EAChD;gBACA;AACD,YAAA;AAED,YAAA,QAAQ,CAAC,IAAI,GAAG,YAAY,CAAC,UAAU;AACvC,YAAA,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO;AACtB,YAAA,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,gBAAgB,CAAC;AACxD,YAAA,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,cAAc,CAAC;AACtD,QAAA,CAAC;AAED,QAAA,YAAY,CAAC,gBAAgB,CAAC,WAAW,EAAE,gBAAgB,CAAC;;AAG5D,QAAA,OAAO,MAAM,YAAY,aAAZ,YAAY,KAAA,MAAA,GAAA,MAAA,GAAZ,YAAY,CAAE,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,CAAC;;AAE/E,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;AACzB;;;;"}

package/dist/hooks/useDragToScroll.d.ts

@@ -1,6 +1,6 @@
 import { RefObject } from 'react';
 type UseDragToScrollProps = {
-    targetRef: RefObject<HTMLElement>;
+    targetRef: RefObject<HTMLElement | null>;
     ignoreClassName?: string;
 };
 /**

package/dist/hooks/useDragToScroll.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDragToScroll.js","sources":["../../src/hooks/useDragToScroll.ts"],"sourcesContent":["import { useEffect, RefObject } from 'react';\n\ntype UseDragToScrollProps = {\n  targetRef: RefObject<HTMLElement>;\n  ignoreClassName?: string;\n};\n\n/**\n * Hook which allows the user to scroll horizontally by dragging on a given target element.\n * @param targetRef - The ref of the element to scroll.\n * @param ignoreClassName - The className of any elements which should be excluded from the dragging behaviour.\n */\nexport function useDragToScroll({ targetRef, ignoreClassName }: UseDragToScrollProps) {\n  useEffect(() => {\n    if (!targetRef.current) return;\n\n    let isDragging = false;\n    const scrollTarget = targetRef.current;\n    const position = {\n      left: 0,\n      x: 0,\n    };\n\n    const mouseMoveHandler = (e: MouseEvent) => {\n      if (!scrollTarget) return;\n      const dx = e.clientX - position.x;\n      scrollTarget.scrollLeft = position.left - dx;\n      if (!isDragging) {\n        scrollTarget.style.cursor = 'grabbing';\n        scrollTarget.style.userSelect = 'none';\n      }\n      isDragging = true;\n    };\n\n    const mouseUpHandler = () => {\n      document.removeEventListener('mousemove', mouseMoveHandler);\n      document.removeEventListener('mouseup', mouseUpHandler);\n      isDragging = false;\n      if (!scrollTarget) return;\n      scrollTarget.style.removeProperty('cursor');\n      scrollTarget.style.removeProperty('user-select');\n    };\n\n    const mouseDownHandler = (e: MouseEvent) => {\n      if (!scrollTarget) return;\n      /** NOTE: prevents table scroll when resizing columns,\n       * unable to use event.stopPropogation as event is a react Synthetic event which treats the event as the same, as they are on the same node, is discussed here\n       * https://dev.to/dvnrsn/why-isn-t-event-stoppropagation-working-1bnm.\n       */\n      if (\n        ignoreClassName &&\n        e.target instanceof HTMLElement &&\n        e.target?.classList?.contains?.(ignoreClassName)\n      ) {\n        return;\n      }\n\n      position.left = scrollTarget.scrollLeft;\n      position.x = e.clientX;\n      document.addEventListener('mousemove', mouseMoveHandler);\n      document.addEventListener('mouseup', mouseUpHandler);\n    };\n\n    scrollTarget.addEventListener('mousedown', mouseDownHandler);\n\n    /* eslint-disable-next-line consistent-return */\n    return () => scrollTarget?.removeEventListener('mousedown', mouseDownHandler);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [targetRef.current]);\n}\n"],"names":[],"mappings":";;AAOA;;;;AAIG;SACa,eAAe,CAAC,EAAE,SAAS,EAAE,eAAe,EAAwB,EAAA;IAClF,SAAS,CAAC,MAAK;QACb,IAAI,CAAC,SAAS,CAAC,OAAO;YAAE;QAExB,IAAI,UAAU,GAAG,KAAK;AACtB,QAAA,MAAM,YAAY,GAAG,SAAS,CAAC,OAAO;AACtC,QAAA,MAAM,QAAQ,GAAG;AACf,YAAA,IAAI,EAAE,CAAC;AACP,YAAA,CAAC,EAAE,CAAC;SACL;AAED,QAAA,MAAM,gBAAgB,GAAG,CAAC,CAAa,KAAI;AACzC,YAAA,IAAI,CAAC,YAAY;gBAAE;YACnB,MAAM,EAAE,GAAG,CAAC,CAAC,OAAO,GAAG,QAAQ,CAAC,CAAC;YACjC,YAAY,CAAC,UAAU,GAAG,QAAQ,CAAC,IAAI,GAAG,EAAE;YAC5C,IAAI,CAAC,UAAU,EAAE;AACf,gBAAA,YAAY,CAAC,KAAK,CAAC,MAAM,GAAG,UAAU;AACtC,gBAAA,YAAY,CAAC,KAAK,CAAC,UAAU,GAAG,MAAM;AACvC,YAAA;YACD,UAAU,GAAG,IAAI;AACnB,QAAA,CAAC;QAED,MAAM,cAAc,GAAG,MAAK;AAC1B,YAAA,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,CAAC;AAC3D,YAAA,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,cAAc,CAAC;YACvD,UAAU,GAAG,KAAK;AAClB,YAAA,IAAI,CAAC,YAAY;gBAAE;AACnB,YAAA,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC;AAC3C,YAAA,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC;AAClD,QAAA,CAAC;AAED,QAAA,MAAM,gBAAgB,GAAG,CAAC,CAAa,KAAI;;AACzC,YAAA,IAAI,CAAC,YAAY;gBAAE;AACnB;;;AAGG;AACH,YAAA,IACE,eAAe;gBACf,CAAC,CAAC,MAAM,YAAY,WAAW;AAC/B,iBAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAC,CAAC,MAAM,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,SAAS,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,EAAA,EAAG,eAAe,CAAC,CAAA,EAChD;gBACA;AACD,YAAA;AAED,YAAA,QAAQ,CAAC,IAAI,GAAG,YAAY,CAAC,UAAU;AACvC,YAAA,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO;AACtB,YAAA,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,gBAAgB,CAAC;AACxD,YAAA,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,cAAc,CAAC;AACtD,QAAA,CAAC;AAED,QAAA,YAAY,CAAC,gBAAgB,CAAC,WAAW,EAAE,gBAAgB,CAAC;;AAG5D,QAAA,OAAO,MAAM,YAAY,aAAZ,YAAY,KAAA,MAAA,GAAA,MAAA,GAAZ,YAAY,CAAE,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,CAAC;;AAE/E,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;AACzB;;;;"}
+{"version":3,"file":"useDragToScroll.js","sources":["../../src/hooks/useDragToScroll.ts"],"sourcesContent":["import { useEffect, RefObject } from 'react';\n\ntype UseDragToScrollProps = {\n  targetRef: RefObject<HTMLElement | null>;\n  ignoreClassName?: string;\n};\n\n/**\n * Hook which allows the user to scroll horizontally by dragging on a given target element.\n * @param targetRef - The ref of the element to scroll.\n * @param ignoreClassName - The className of any elements which should be excluded from the dragging behaviour.\n */\nexport function useDragToScroll({ targetRef, ignoreClassName }: UseDragToScrollProps) {\n  useEffect(() => {\n    if (!targetRef.current) return;\n\n    let isDragging = false;\n    const scrollTarget = targetRef.current;\n    const position = {\n      left: 0,\n      x: 0,\n    };\n\n    const mouseMoveHandler = (e: MouseEvent) => {\n      if (!scrollTarget) return;\n      const dx = e.clientX - position.x;\n      scrollTarget.scrollLeft = position.left - dx;\n      if (!isDragging) {\n        scrollTarget.style.cursor = 'grabbing';\n        scrollTarget.style.userSelect = 'none';\n      }\n      isDragging = true;\n    };\n\n    const mouseUpHandler = () => {\n      document.removeEventListener('mousemove', mouseMoveHandler);\n      document.removeEventListener('mouseup', mouseUpHandler);\n      isDragging = false;\n      if (!scrollTarget) return;\n      scrollTarget.style.removeProperty('cursor');\n      scrollTarget.style.removeProperty('user-select');\n    };\n\n    const mouseDownHandler = (e: MouseEvent) => {\n      if (!scrollTarget) return;\n      /** NOTE: prevents table scroll when resizing columns,\n       * unable to use event.stopPropogation as event is a react Synthetic event which treats the event as the same, as they are on the same node, is discussed here\n       * https://dev.to/dvnrsn/why-isn-t-event-stoppropagation-working-1bnm.\n       */\n      if (\n        ignoreClassName &&\n        e.target instanceof HTMLElement &&\n        e.target?.classList?.contains?.(ignoreClassName)\n      ) {\n        return;\n      }\n\n      position.left = scrollTarget.scrollLeft;\n      position.x = e.clientX;\n      document.addEventListener('mousemove', mouseMoveHandler);\n      document.addEventListener('mouseup', mouseUpHandler);\n    };\n\n    scrollTarget.addEventListener('mousedown', mouseDownHandler);\n\n    /* eslint-disable-next-line consistent-return */\n    return () => scrollTarget?.removeEventListener('mousedown', mouseDownHandler);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [targetRef.current]);\n}\n"],"names":[],"mappings":";;AAOA;;;;AAIG;SACa,eAAe,CAAC,EAAE,SAAS,EAAE,eAAe,EAAwB,EAAA;IAClF,SAAS,CAAC,MAAK;QACb,IAAI,CAAC,SAAS,CAAC,OAAO;YAAE;QAExB,IAAI,UAAU,GAAG,KAAK;AACtB,QAAA,MAAM,YAAY,GAAG,SAAS,CAAC,OAAO;AACtC,QAAA,MAAM,QAAQ,GAAG;AACf,YAAA,IAAI,EAAE,CAAC;AACP,YAAA,CAAC,EAAE,CAAC;SACL;AAED,QAAA,MAAM,gBAAgB,GAAG,CAAC,CAAa,KAAI;AACzC,YAAA,IAAI,CAAC,YAAY;gBAAE;YACnB,MAAM,EAAE,GAAG,CAAC,CAAC,OAAO,GAAG,QAAQ,CAAC,CAAC;YACjC,YAAY,CAAC,UAAU,GAAG,QAAQ,CAAC,IAAI,GAAG,EAAE;YAC5C,IAAI,CAAC,UAAU,EAAE;AACf,gBAAA,YAAY,CAAC,KAAK,CAAC,MAAM,GAAG,UAAU;AACtC,gBAAA,YAAY,CAAC,KAAK,CAAC,UAAU,GAAG,MAAM;AACvC,YAAA;YACD,UAAU,GAAG,IAAI;AACnB,QAAA,CAAC;QAED,MAAM,cAAc,GAAG,MAAK;AAC1B,YAAA,QAAQ,CAAC,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,CAAC;AAC3D,YAAA,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,cAAc,CAAC;YACvD,UAAU,GAAG,KAAK;AAClB,YAAA,IAAI,CAAC,YAAY;gBAAE;AACnB,YAAA,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC;AAC3C,YAAA,YAAY,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC;AAClD,QAAA,CAAC;AAED,QAAA,MAAM,gBAAgB,GAAG,CAAC,CAAa,KAAI;;AACzC,YAAA,IAAI,CAAC,YAAY;gBAAE;AACnB;;;AAGG;AACH,YAAA,IACE,eAAe;gBACf,CAAC,CAAC,MAAM,YAAY,WAAW;AAC/B,iBAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAC,CAAC,MAAM,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,SAAS,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAA,IAAA,CAAA,EAAA,EAAG,eAAe,CAAC,CAAA,EAChD;gBACA;AACD,YAAA;AAED,YAAA,QAAQ,CAAC,IAAI,GAAG,YAAY,CAAC,UAAU;AACvC,YAAA,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,OAAO;AACtB,YAAA,QAAQ,CAAC,gBAAgB,CAAC,WAAW,EAAE,gBAAgB,CAAC;AACxD,YAAA,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,cAAc,CAAC;AACtD,QAAA,CAAC;AAED,QAAA,YAAY,CAAC,gBAAgB,CAAC,WAAW,EAAE,gBAAgB,CAAC;;AAG5D,QAAA,OAAO,MAAM,YAAY,aAAZ,YAAY,KAAA,MAAA,GAAA,MAAA,GAAZ,YAAY,CAAE,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,CAAC;;AAE/E,IAAA,CAAC,EAAE,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;AACzB;;;;"}

package/dist/hooks/useIntersectionObserver.cjs

@@ -14,11 +14,11 @@ var throttle__default = /*#__PURE__*/_interopDefaultCompat(throttle);
  * @param throttleMs (Optional) the number of ms to throttle the observer callback.
  */
 const useIntersectionObserver = ({ targetRef, intersectionHandler, throttleMs, }) => {
-    const intersectionHandlerRef = React.useRef();
+    const intersectionHandlerRef = React.useRef(null);
     intersectionHandlerRef.current = intersectionHandler;
-    const intersectionObserverRef = React.useRef();
-    const isIntersectingRef = React.useRef();
-    const currentTargetRef = React.useRef();
+    const intersectionObserverRef = React.useRef(null);
+    const isIntersectingRef = React.useRef(null);
+    const currentTargetRef = React.useRef(null);
     React.useEffect(() => {
         const observerCallback = (entries) => {
             const [entry] = entries;

package/dist/hooks/useIntersectionObserver.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useIntersectionObserver.cjs","sources":["../../src/hooks/useIntersectionObserver.ts"],"sourcesContent":["import { RefObject, useEffect, useRef } from 'react';\n\nimport throttle from 'lodash.throttle';\n\ntype IntersectionHandler = (intersecting: boolean) => void;\n\ntype UseIntersectionObserverProps = {\n  targetRef: RefObject<HTMLElement | null>;\n  intersectionHandler: IntersectionHandler;\n  throttleMs?: number;\n};\n\n/**\n * Hook which sets up an `IntersectionObserver` for a given element, and fires a callback when an intersection occurs.\n * @param targetRef The element to observe.\n * @param intersectionHandler The callback to invoke when an intersection occurs.\n * @param throttleMs (Optional) the number of ms to throttle the observer callback.\n */\nexport const useIntersectionObserver = ({\n  targetRef,\n  intersectionHandler,\n  throttleMs,\n}: UseIntersectionObserverProps) => {\n  const intersectionHandlerRef = useRef<IntersectionHandler>();\n  intersectionHandlerRef.current = intersectionHandler;\n\n  const intersectionObserverRef = useRef<IntersectionObserver>();\n  const isIntersectingRef = useRef<boolean>();\n\n  const currentTargetRef = useRef();\n\n  useEffect(() => {\n    const observerCallback = (entries: IntersectionObserverEntry[]) => {\n      const [entry] = entries;\n      const { isIntersecting } = entry;\n\n      if (isIntersectingRef.current && isIntersectingRef.current === isIntersecting) {\n        return;\n      }\n\n      isIntersectingRef.current = isIntersecting;\n\n      if (intersectionHandlerRef.current) {\n        intersectionHandlerRef.current(isIntersecting);\n      }\n    };\n\n    intersectionObserverRef.current = new IntersectionObserver(\n      throttleMs ? throttle(observerCallback, throttleMs) : observerCallback,\n    );\n\n    return () => {\n      if (intersectionObserverRef.current) {\n        intersectionObserverRef.current.disconnect();\n      }\n    };\n  }, [throttleMs]);\n\n  useEffect(() => {\n    if (intersectionObserverRef.current) {\n      if (\n        targetRef.current &&\n        currentTargetRef.current &&\n        targetRef.current === currentTargetRef.current\n      ) {\n        return;\n      }\n\n      intersectionObserverRef.current.disconnect();\n\n      if (targetRef.current) {\n        intersectionObserverRef.current.observe(targetRef.current);\n      }\n    }\n  });\n};\n"],"names":["useRef","useEffect","throttle"],"mappings":";;;;;;;;;AAYA;;;;;AAKG;AACI,MAAM,uBAAuB,GAAG,CAAC,EACtC,SAAS,EACT,mBAAmB,EACnB,UAAU,GACmB,KAAI;AACjC,IAAA,MAAM,sBAAsB,GAAGA,YAAM,EAAuB;AAC5D,IAAA,sBAAsB,CAAC,OAAO,GAAG,mBAAmB;AAEpD,IAAA,MAAM,uBAAuB,GAAGA,YAAM,EAAwB;AAC9D,IAAA,MAAM,iBAAiB,GAAGA,YAAM,EAAW;AAE3C,IAAA,MAAM,gBAAgB,GAAGA,YAAM,EAAE;IAEjCC,eAAS,CAAC,MAAK;AACb,QAAA,MAAM,gBAAgB,GAAG,CAAC,OAAoC,KAAI;AAChE,YAAA,MAAM,CAAC,KAAK,CAAC,GAAG,OAAO;AACvB,YAAA,MAAM,EAAE,cAAc,EAAE,GAAG,KAAK;YAEhC,IAAI,iBAAiB,CAAC,OAAO,IAAI,iBAAiB,CAAC,OAAO,KAAK,cAAc,EAAE;gBAC7E;AACD,YAAA;AAED,YAAA,iBAAiB,CAAC,OAAO,GAAG,cAAc;YAE1C,IAAI,sBAAsB,CAAC,OAAO,EAAE;AAClC,gBAAA,sBAAsB,CAAC,OAAO,CAAC,cAAc,CAAC;AAC/C,YAAA;AACH,QAAA,CAAC;QAED,uBAAuB,CAAC,OAAO,GAAG,IAAI,oBAAoB,CACxD,UAAU,GAAGC,yBAAQ,CAAC,gBAAgB,EAAE,UAAU,CAAC,GAAG,gBAAgB,CACvE;AAED,QAAA,OAAO,MAAK;YACV,IAAI,uBAAuB,CAAC,OAAO,EAAE;AACnC,gBAAA,uBAAuB,CAAC,OAAO,CAAC,UAAU,EAAE;AAC7C,YAAA;AACH,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;IAEhBD,eAAS,CAAC,MAAK;QACb,IAAI,uBAAuB,CAAC,OAAO,EAAE;YACnC,IACE,SAAS,CAAC,OAAO;AACjB,gBAAA,gBAAgB,CAAC,OAAO;AACxB,gBAAA,SAAS,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO,EAC9C;gBACA;AACD,YAAA;AAED,YAAA,uBAAuB,CAAC,OAAO,CAAC,UAAU,EAAE;YAE5C,IAAI,SAAS,CAAC,OAAO,EAAE;gBACrB,uBAAuB,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,OAAO,CAAC;AAC3D,YAAA;AACF,QAAA;AACH,IAAA,CAAC,CAAC;AACJ;;;;"}
+{"version":3,"file":"useIntersectionObserver.cjs","sources":["../../src/hooks/useIntersectionObserver.ts"],"sourcesContent":["import { RefObject, useEffect, useRef } from 'react';\n\nimport throttle from 'lodash.throttle';\n\ntype IntersectionHandler = (intersecting: boolean) => void;\n\ntype UseIntersectionObserverProps = {\n  targetRef: RefObject<HTMLElement | null>;\n  intersectionHandler: IntersectionHandler;\n  throttleMs?: number;\n};\n\n/**\n * Hook which sets up an `IntersectionObserver` for a given element, and fires a callback when an intersection occurs.\n * @param targetRef The element to observe.\n * @param intersectionHandler The callback to invoke when an intersection occurs.\n * @param throttleMs (Optional) the number of ms to throttle the observer callback.\n */\nexport const useIntersectionObserver = ({\n  targetRef,\n  intersectionHandler,\n  throttleMs,\n}: UseIntersectionObserverProps) => {\n  const intersectionHandlerRef = useRef<IntersectionHandler | null>(null);\n  intersectionHandlerRef.current = intersectionHandler;\n\n  const intersectionObserverRef = useRef<IntersectionObserver | null>(null);\n  const isIntersectingRef = useRef<boolean | null>(null);\n\n  const currentTargetRef = useRef(null);\n\n  useEffect(() => {\n    const observerCallback = (entries: IntersectionObserverEntry[]) => {\n      const [entry] = entries;\n      const { isIntersecting } = entry;\n\n      if (isIntersectingRef.current && isIntersectingRef.current === isIntersecting) {\n        return;\n      }\n\n      isIntersectingRef.current = isIntersecting;\n\n      if (intersectionHandlerRef.current) {\n        intersectionHandlerRef.current(isIntersecting);\n      }\n    };\n\n    intersectionObserverRef.current = new IntersectionObserver(\n      throttleMs ? throttle(observerCallback, throttleMs) : observerCallback,\n    );\n\n    return () => {\n      if (intersectionObserverRef.current) {\n        intersectionObserverRef.current.disconnect();\n      }\n    };\n  }, [throttleMs]);\n\n  useEffect(() => {\n    if (intersectionObserverRef.current) {\n      if (\n        targetRef.current &&\n        currentTargetRef.current &&\n        targetRef.current === currentTargetRef.current\n      ) {\n        return;\n      }\n\n      intersectionObserverRef.current.disconnect();\n\n      if (targetRef.current) {\n        intersectionObserverRef.current.observe(targetRef.current);\n      }\n    }\n  });\n};\n"],"names":["useRef","useEffect","throttle"],"mappings":";;;;;;;;;AAYA;;;;;AAKG;AACI,MAAM,uBAAuB,GAAG,CAAC,EACtC,SAAS,EACT,mBAAmB,EACnB,UAAU,GACmB,KAAI;AACjC,IAAA,MAAM,sBAAsB,GAAGA,YAAM,CAA6B,IAAI,CAAC;AACvE,IAAA,sBAAsB,CAAC,OAAO,GAAG,mBAAmB;AAEpD,IAAA,MAAM,uBAAuB,GAAGA,YAAM,CAA8B,IAAI,CAAC;AACzE,IAAA,MAAM,iBAAiB,GAAGA,YAAM,CAAiB,IAAI,CAAC;AAEtD,IAAA,MAAM,gBAAgB,GAAGA,YAAM,CAAC,IAAI,CAAC;IAErCC,eAAS,CAAC,MAAK;AACb,QAAA,MAAM,gBAAgB,GAAG,CAAC,OAAoC,KAAI;AAChE,YAAA,MAAM,CAAC,KAAK,CAAC,GAAG,OAAO;AACvB,YAAA,MAAM,EAAE,cAAc,EAAE,GAAG,KAAK;YAEhC,IAAI,iBAAiB,CAAC,OAAO,IAAI,iBAAiB,CAAC,OAAO,KAAK,cAAc,EAAE;gBAC7E;AACD,YAAA;AAED,YAAA,iBAAiB,CAAC,OAAO,GAAG,cAAc;YAE1C,IAAI,sBAAsB,CAAC,OAAO,EAAE;AAClC,gBAAA,sBAAsB,CAAC,OAAO,CAAC,cAAc,CAAC;AAC/C,YAAA;AACH,QAAA,CAAC;QAED,uBAAuB,CAAC,OAAO,GAAG,IAAI,oBAAoB,CACxD,UAAU,GAAGC,yBAAQ,CAAC,gBAAgB,EAAE,UAAU,CAAC,GAAG,gBAAgB,CACvE;AAED,QAAA,OAAO,MAAK;YACV,IAAI,uBAAuB,CAAC,OAAO,EAAE;AACnC,gBAAA,uBAAuB,CAAC,OAAO,CAAC,UAAU,EAAE;AAC7C,YAAA;AACH,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;IAEhBD,eAAS,CAAC,MAAK;QACb,IAAI,uBAAuB,CAAC,OAAO,EAAE;YACnC,IACE,SAAS,CAAC,OAAO;AACjB,gBAAA,gBAAgB,CAAC,OAAO;AACxB,gBAAA,SAAS,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO,EAC9C;gBACA;AACD,YAAA;AAED,YAAA,uBAAuB,CAAC,OAAO,CAAC,UAAU,EAAE;YAE5C,IAAI,SAAS,CAAC,OAAO,EAAE;gBACrB,uBAAuB,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,OAAO,CAAC;AAC3D,YAAA;AACF,QAAA;AACH,IAAA,CAAC,CAAC;AACJ;;;;"}

package/dist/hooks/useIntersectionObserver.js

@@ -8,11 +8,11 @@ import throttle from 'lodash.throttle';
  * @param throttleMs (Optional) the number of ms to throttle the observer callback.
  */
 const useIntersectionObserver = ({ targetRef, intersectionHandler, throttleMs, }) => {
-    const intersectionHandlerRef = useRef();
+    const intersectionHandlerRef = useRef(null);
     intersectionHandlerRef.current = intersectionHandler;
-    const intersectionObserverRef = useRef();
-    const isIntersectingRef = useRef();
-    const currentTargetRef = useRef();
+    const intersectionObserverRef = useRef(null);
+    const isIntersectingRef = useRef(null);
+    const currentTargetRef = useRef(null);
     useEffect(() => {
         const observerCallback = (entries) => {
             const [entry] = entries;

package/dist/hooks/useIntersectionObserver.js.map

@@ -1 +1 @@
-{"version":3,"file":"useIntersectionObserver.js","sources":["../../src/hooks/useIntersectionObserver.ts"],"sourcesContent":["import { RefObject, useEffect, useRef } from 'react';\n\nimport throttle from 'lodash.throttle';\n\ntype IntersectionHandler = (intersecting: boolean) => void;\n\ntype UseIntersectionObserverProps = {\n  targetRef: RefObject<HTMLElement | null>;\n  intersectionHandler: IntersectionHandler;\n  throttleMs?: number;\n};\n\n/**\n * Hook which sets up an `IntersectionObserver` for a given element, and fires a callback when an intersection occurs.\n * @param targetRef The element to observe.\n * @param intersectionHandler The callback to invoke when an intersection occurs.\n * @param throttleMs (Optional) the number of ms to throttle the observer callback.\n */\nexport const useIntersectionObserver = ({\n  targetRef,\n  intersectionHandler,\n  throttleMs,\n}: UseIntersectionObserverProps) => {\n  const intersectionHandlerRef = useRef<IntersectionHandler>();\n  intersectionHandlerRef.current = intersectionHandler;\n\n  const intersectionObserverRef = useRef<IntersectionObserver>();\n  const isIntersectingRef = useRef<boolean>();\n\n  const currentTargetRef = useRef();\n\n  useEffect(() => {\n    const observerCallback = (entries: IntersectionObserverEntry[]) => {\n      const [entry] = entries;\n      const { isIntersecting } = entry;\n\n      if (isIntersectingRef.current && isIntersectingRef.current === isIntersecting) {\n        return;\n      }\n\n      isIntersectingRef.current = isIntersecting;\n\n      if (intersectionHandlerRef.current) {\n        intersectionHandlerRef.current(isIntersecting);\n      }\n    };\n\n    intersectionObserverRef.current = new IntersectionObserver(\n      throttleMs ? throttle(observerCallback, throttleMs) : observerCallback,\n    );\n\n    return () => {\n      if (intersectionObserverRef.current) {\n        intersectionObserverRef.current.disconnect();\n      }\n    };\n  }, [throttleMs]);\n\n  useEffect(() => {\n    if (intersectionObserverRef.current) {\n      if (\n        targetRef.current &&\n        currentTargetRef.current &&\n        targetRef.current === currentTargetRef.current\n      ) {\n        return;\n      }\n\n      intersectionObserverRef.current.disconnect();\n\n      if (targetRef.current) {\n        intersectionObserverRef.current.observe(targetRef.current);\n      }\n    }\n  });\n};\n"],"names":[],"mappings":";;;AAYA;;;;;AAKG;AACI,MAAM,uBAAuB,GAAG,CAAC,EACtC,SAAS,EACT,mBAAmB,EACnB,UAAU,GACmB,KAAI;AACjC,IAAA,MAAM,sBAAsB,GAAG,MAAM,EAAuB;AAC5D,IAAA,sBAAsB,CAAC,OAAO,GAAG,mBAAmB;AAEpD,IAAA,MAAM,uBAAuB,GAAG,MAAM,EAAwB;AAC9D,IAAA,MAAM,iBAAiB,GAAG,MAAM,EAAW;AAE3C,IAAA,MAAM,gBAAgB,GAAG,MAAM,EAAE;IAEjC,SAAS,CAAC,MAAK;AACb,QAAA,MAAM,gBAAgB,GAAG,CAAC,OAAoC,KAAI;AAChE,YAAA,MAAM,CAAC,KAAK,CAAC,GAAG,OAAO;AACvB,YAAA,MAAM,EAAE,cAAc,EAAE,GAAG,KAAK;YAEhC,IAAI,iBAAiB,CAAC,OAAO,IAAI,iBAAiB,CAAC,OAAO,KAAK,cAAc,EAAE;gBAC7E;AACD,YAAA;AAED,YAAA,iBAAiB,CAAC,OAAO,GAAG,cAAc;YAE1C,IAAI,sBAAsB,CAAC,OAAO,EAAE;AAClC,gBAAA,sBAAsB,CAAC,OAAO,CAAC,cAAc,CAAC;AAC/C,YAAA;AACH,QAAA,CAAC;QAED,uBAAuB,CAAC,OAAO,GAAG,IAAI,oBAAoB,CACxD,UAAU,GAAG,QAAQ,CAAC,gBAAgB,EAAE,UAAU,CAAC,GAAG,gBAAgB,CACvE;AAED,QAAA,OAAO,MAAK;YACV,IAAI,uBAAuB,CAAC,OAAO,EAAE;AACnC,gBAAA,uBAAuB,CAAC,OAAO,CAAC,UAAU,EAAE;AAC7C,YAAA;AACH,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;IAEhB,SAAS,CAAC,MAAK;QACb,IAAI,uBAAuB,CAAC,OAAO,EAAE;YACnC,IACE,SAAS,CAAC,OAAO;AACjB,gBAAA,gBAAgB,CAAC,OAAO;AACxB,gBAAA,SAAS,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO,EAC9C;gBACA;AACD,YAAA;AAED,YAAA,uBAAuB,CAAC,OAAO,CAAC,UAAU,EAAE;YAE5C,IAAI,SAAS,CAAC,OAAO,EAAE;gBACrB,uBAAuB,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,OAAO,CAAC;AAC3D,YAAA;AACF,QAAA;AACH,IAAA,CAAC,CAAC;AACJ;;;;"}
+{"version":3,"file":"useIntersectionObserver.js","sources":["../../src/hooks/useIntersectionObserver.ts"],"sourcesContent":["import { RefObject, useEffect, useRef } from 'react';\n\nimport throttle from 'lodash.throttle';\n\ntype IntersectionHandler = (intersecting: boolean) => void;\n\ntype UseIntersectionObserverProps = {\n  targetRef: RefObject<HTMLElement | null>;\n  intersectionHandler: IntersectionHandler;\n  throttleMs?: number;\n};\n\n/**\n * Hook which sets up an `IntersectionObserver` for a given element, and fires a callback when an intersection occurs.\n * @param targetRef The element to observe.\n * @param intersectionHandler The callback to invoke when an intersection occurs.\n * @param throttleMs (Optional) the number of ms to throttle the observer callback.\n */\nexport const useIntersectionObserver = ({\n  targetRef,\n  intersectionHandler,\n  throttleMs,\n}: UseIntersectionObserverProps) => {\n  const intersectionHandlerRef = useRef<IntersectionHandler | null>(null);\n  intersectionHandlerRef.current = intersectionHandler;\n\n  const intersectionObserverRef = useRef<IntersectionObserver | null>(null);\n  const isIntersectingRef = useRef<boolean | null>(null);\n\n  const currentTargetRef = useRef(null);\n\n  useEffect(() => {\n    const observerCallback = (entries: IntersectionObserverEntry[]) => {\n      const [entry] = entries;\n      const { isIntersecting } = entry;\n\n      if (isIntersectingRef.current && isIntersectingRef.current === isIntersecting) {\n        return;\n      }\n\n      isIntersectingRef.current = isIntersecting;\n\n      if (intersectionHandlerRef.current) {\n        intersectionHandlerRef.current(isIntersecting);\n      }\n    };\n\n    intersectionObserverRef.current = new IntersectionObserver(\n      throttleMs ? throttle(observerCallback, throttleMs) : observerCallback,\n    );\n\n    return () => {\n      if (intersectionObserverRef.current) {\n        intersectionObserverRef.current.disconnect();\n      }\n    };\n  }, [throttleMs]);\n\n  useEffect(() => {\n    if (intersectionObserverRef.current) {\n      if (\n        targetRef.current &&\n        currentTargetRef.current &&\n        targetRef.current === currentTargetRef.current\n      ) {\n        return;\n      }\n\n      intersectionObserverRef.current.disconnect();\n\n      if (targetRef.current) {\n        intersectionObserverRef.current.observe(targetRef.current);\n      }\n    }\n  });\n};\n"],"names":[],"mappings":";;;AAYA;;;;;AAKG;AACI,MAAM,uBAAuB,GAAG,CAAC,EACtC,SAAS,EACT,mBAAmB,EACnB,UAAU,GACmB,KAAI;AACjC,IAAA,MAAM,sBAAsB,GAAG,MAAM,CAA6B,IAAI,CAAC;AACvE,IAAA,sBAAsB,CAAC,OAAO,GAAG,mBAAmB;AAEpD,IAAA,MAAM,uBAAuB,GAAG,MAAM,CAA8B,IAAI,CAAC;AACzE,IAAA,MAAM,iBAAiB,GAAG,MAAM,CAAiB,IAAI,CAAC;AAEtD,IAAA,MAAM,gBAAgB,GAAG,MAAM,CAAC,IAAI,CAAC;IAErC,SAAS,CAAC,MAAK;AACb,QAAA,MAAM,gBAAgB,GAAG,CAAC,OAAoC,KAAI;AAChE,YAAA,MAAM,CAAC,KAAK,CAAC,GAAG,OAAO;AACvB,YAAA,MAAM,EAAE,cAAc,EAAE,GAAG,KAAK;YAEhC,IAAI,iBAAiB,CAAC,OAAO,IAAI,iBAAiB,CAAC,OAAO,KAAK,cAAc,EAAE;gBAC7E;AACD,YAAA;AAED,YAAA,iBAAiB,CAAC,OAAO,GAAG,cAAc;YAE1C,IAAI,sBAAsB,CAAC,OAAO,EAAE;AAClC,gBAAA,sBAAsB,CAAC,OAAO,CAAC,cAAc,CAAC;AAC/C,YAAA;AACH,QAAA,CAAC;QAED,uBAAuB,CAAC,OAAO,GAAG,IAAI,oBAAoB,CACxD,UAAU,GAAG,QAAQ,CAAC,gBAAgB,EAAE,UAAU,CAAC,GAAG,gBAAgB,CACvE;AAED,QAAA,OAAO,MAAK;YACV,IAAI,uBAAuB,CAAC,OAAO,EAAE;AACnC,gBAAA,uBAAuB,CAAC,OAAO,CAAC,UAAU,EAAE;AAC7C,YAAA;AACH,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;IAEhB,SAAS,CAAC,MAAK;QACb,IAAI,uBAAuB,CAAC,OAAO,EAAE;YACnC,IACE,SAAS,CAAC,OAAO;AACjB,gBAAA,gBAAgB,CAAC,OAAO;AACxB,gBAAA,SAAS,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO,EAC9C;gBACA;AACD,YAAA;AAED,YAAA,uBAAuB,CAAC,OAAO,CAAC,UAAU,EAAE;YAE5C,IAAI,SAAS,CAAC,OAAO,EAAE;gBACrB,uBAAuB,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,OAAO,CAAC;AAC3D,YAAA;AACF,QAAA;AACH,IAAA,CAAC,CAAC;AACJ;;;;"}

package/dist/hooks/useResizeObserver.cjs

@@ -17,9 +17,9 @@ const useResizeObserver = ({ targetRef, resizeHandler, throttleMs, }) => {
     // Use a ref to store the resizeHandler to avoid re-rendering when the callback changes.
     const resizeHandlerRef = React.useRef(undefined);
     resizeHandlerRef.current = resizeHandler;
-    const resizeObserverRef = React.useRef();
+    const resizeObserverRef = React.useRef(null);
     const previousSizeRef = React.useRef(undefined);
-    const currentTargetRef = React.useRef();
+    const currentTargetRef = React.useRef(null);
     // Setup the resize observer when the hook is mounted.
     React.useEffect(() => {
         const observerCallback = (entries) => {

package/dist/hooks/useResizeObserver.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useResizeObserver.cjs","sources":["../../src/hooks/useResizeObserver.ts"],"sourcesContent":["import { RefObject, useEffect, useRef } from 'react';\n\nimport throttle from 'lodash.throttle';\n\ntype ResizeHandler = (size: { width: number; height: number }) => void;\n\ntype UseResizeObserverCustomProps = {\n  targetRef: RefObject<HTMLElement | null>;\n  resizeHandler: ResizeHandler;\n  throttleMs?: number;\n};\n\n/**\n * Hook which sets up a `ResizeObserver` for a given element, and fires a callback when the element is resized.\n * @param targetRef The element to observe.\n * @param resizeHandler The callback to invoke when the element is resized.\n * @param throttleMs (Optional) the number of ms to throttle the observer callback.\n */\nexport const useResizeObserver = ({\n  targetRef,\n  resizeHandler,\n  throttleMs,\n}: UseResizeObserverCustomProps) => {\n  // Use a ref to store the resizeHandler to avoid re-rendering when the callback changes.\n  const resizeHandlerRef = useRef<ResizeHandler | undefined>(undefined);\n  resizeHandlerRef.current = resizeHandler;\n\n  const resizeObserverRef = useRef<ResizeObserver>();\n  const previousSizeRef = useRef<{ width: number; height: number } | undefined>(undefined);\n\n  const currentTargetRef = useRef<HTMLElement>();\n\n  // Setup the resize observer when the hook is mounted.\n  useEffect(() => {\n    const observerCallback = (entries: ResizeObserverEntry[]) => {\n      // We'll only ever be monitoring one element, so we'll only have one entry.\n      const entry = entries[0];\n\n      const { inlineSize: width, blockSize: height } = entry.contentBoxSize[0];\n\n      // Avoid unecessary callbacks by checking to see if the dimensions have actually changed.\n      if (\n        previousSizeRef.current &&\n        previousSizeRef.current.width === width &&\n        previousSizeRef.current.height === height\n      ) {\n        return;\n      }\n\n      previousSizeRef.current = { width, height };\n\n      if (resizeHandlerRef.current) {\n        resizeHandlerRef.current({ width, height });\n      }\n    };\n\n    resizeObserverRef.current = new ResizeObserver(\n      throttleMs ? throttle(observerCallback, throttleMs) : observerCallback,\n    );\n\n    // Cleanup the resizer observer on unmount\n    return () => {\n      if (resizeObserverRef.current) {\n        resizeObserverRef.current.disconnect();\n      }\n    };\n  }, [throttleMs]);\n\n  // Ensure we're always observing the latest element referenced in 'ref'.\n  useEffect(() => {\n    if (resizeObserverRef.current) {\n      // Check to see if the ref has actually changed. If it hasn't we can skip resetting the ResizeObserver.\n      if (\n        targetRef?.current &&\n        currentTargetRef.current &&\n        targetRef.current === currentTargetRef.current\n      ) {\n        return;\n      }\n\n      resizeObserverRef.current.disconnect();\n\n      if (targetRef?.current) {\n        resizeObserverRef.current.observe(targetRef.current);\n        currentTargetRef.current = targetRef.current;\n      }\n    }\n  });\n};\n"],"names":["useRef","useEffect","throttle"],"mappings":";;;;;;;;;AAYA;;;;;AAKG;AACI,MAAM,iBAAiB,GAAG,CAAC,EAChC,SAAS,EACT,aAAa,EACb,UAAU,GACmB,KAAI;;AAEjC,IAAA,MAAM,gBAAgB,GAAGA,YAAM,CAA4B,SAAS,CAAC;AACrE,IAAA,gBAAgB,CAAC,OAAO,GAAG,aAAa;AAExC,IAAA,MAAM,iBAAiB,GAAGA,YAAM,EAAkB;AAClD,IAAA,MAAM,eAAe,GAAGA,YAAM,CAAgD,SAAS,CAAC;AAExF,IAAA,MAAM,gBAAgB,GAAGA,YAAM,EAAe;;IAG9CC,eAAS,CAAC,MAAK;AACb,QAAA,MAAM,gBAAgB,GAAG,CAAC,OAA8B,KAAI;;AAE1D,YAAA,MAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC;AAExB,YAAA,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC;;YAGxE,IACE,eAAe,CAAC,OAAO;AACvB,gBAAA,eAAe,CAAC,OAAO,CAAC,KAAK,KAAK,KAAK;AACvC,gBAAA,eAAe,CAAC,OAAO,CAAC,MAAM,KAAK,MAAM,EACzC;gBACA;AACD,YAAA;YAED,eAAe,CAAC,OAAO,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE;YAE3C,IAAI,gBAAgB,CAAC,OAAO,EAAE;gBAC5B,gBAAgB,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC;AAC5C,YAAA;AACH,QAAA,CAAC;QAED,iBAAiB,CAAC,OAAO,GAAG,IAAI,cAAc,CAC5C,UAAU,GAAGC,yBAAQ,CAAC,gBAAgB,EAAE,UAAU,CAAC,GAAG,gBAAgB,CACvE;;AAGD,QAAA,OAAO,MAAK;YACV,IAAI,iBAAiB,CAAC,OAAO,EAAE;AAC7B,gBAAA,iBAAiB,CAAC,OAAO,CAAC,UAAU,EAAE;AACvC,YAAA;AACH,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;;IAGhBD,eAAS,CAAC,MAAK;QACb,IAAI,iBAAiB,CAAC,OAAO,EAAE;;AAE7B,YAAA,IACE,CAAA,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,OAAO;AAClB,gBAAA,gBAAgB,CAAC,OAAO;AACxB,gBAAA,SAAS,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO,EAC9C;gBACA;AACD,YAAA;AAED,YAAA,iBAAiB,CAAC,OAAO,CAAC,UAAU,EAAE;AAEtC,YAAA,IAAI,SAAS,KAAA,IAAA,IAAT,SAAS,uBAAT,SAAS,CAAE,OAAO,EAAE;gBACtB,iBAAiB,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,OAAO,CAAC;AACpD,gBAAA,gBAAgB,CAAC,OAAO,GAAG,SAAS,CAAC,OAAO;AAC7C,YAAA;AACF,QAAA;AACH,IAAA,CAAC,CAAC;AACJ;;;;"}
+{"version":3,"file":"useResizeObserver.cjs","sources":["../../src/hooks/useResizeObserver.ts"],"sourcesContent":["import { RefObject, useEffect, useRef } from 'react';\n\nimport throttle from 'lodash.throttle';\n\ntype ResizeHandler = (size: { width: number; height: number }) => void;\n\ntype UseResizeObserverCustomProps = {\n  targetRef: RefObject<HTMLElement | null>;\n  resizeHandler: ResizeHandler;\n  throttleMs?: number;\n};\n\n/**\n * Hook which sets up a `ResizeObserver` for a given element, and fires a callback when the element is resized.\n * @param targetRef The element to observe.\n * @param resizeHandler The callback to invoke when the element is resized.\n * @param throttleMs (Optional) the number of ms to throttle the observer callback.\n */\nexport const useResizeObserver = ({\n  targetRef,\n  resizeHandler,\n  throttleMs,\n}: UseResizeObserverCustomProps) => {\n  // Use a ref to store the resizeHandler to avoid re-rendering when the callback changes.\n  const resizeHandlerRef = useRef<ResizeHandler | undefined>(undefined);\n  resizeHandlerRef.current = resizeHandler;\n\n  const resizeObserverRef = useRef<ResizeObserver | null>(null);\n  const previousSizeRef = useRef<{ width: number; height: number } | undefined>(undefined);\n\n  const currentTargetRef = useRef<HTMLElement | null>(null);\n\n  // Setup the resize observer when the hook is mounted.\n  useEffect(() => {\n    const observerCallback = (entries: ResizeObserverEntry[]) => {\n      // We'll only ever be monitoring one element, so we'll only have one entry.\n      const entry = entries[0];\n\n      const { inlineSize: width, blockSize: height } = entry.contentBoxSize[0];\n\n      // Avoid unecessary callbacks by checking to see if the dimensions have actually changed.\n      if (\n        previousSizeRef.current &&\n        previousSizeRef.current.width === width &&\n        previousSizeRef.current.height === height\n      ) {\n        return;\n      }\n\n      previousSizeRef.current = { width, height };\n\n      if (resizeHandlerRef.current) {\n        resizeHandlerRef.current({ width, height });\n      }\n    };\n\n    resizeObserverRef.current = new ResizeObserver(\n      throttleMs ? throttle(observerCallback, throttleMs) : observerCallback,\n    );\n\n    // Cleanup the resizer observer on unmount\n    return () => {\n      if (resizeObserverRef.current) {\n        resizeObserverRef.current.disconnect();\n      }\n    };\n  }, [throttleMs]);\n\n  // Ensure we're always observing the latest element referenced in 'ref'.\n  useEffect(() => {\n    if (resizeObserverRef.current) {\n      // Check to see if the ref has actually changed. If it hasn't we can skip resetting the ResizeObserver.\n      if (\n        targetRef?.current &&\n        currentTargetRef.current &&\n        targetRef.current === currentTargetRef.current\n      ) {\n        return;\n      }\n\n      resizeObserverRef.current.disconnect();\n\n      if (targetRef?.current) {\n        resizeObserverRef.current.observe(targetRef.current);\n        currentTargetRef.current = targetRef.current;\n      }\n    }\n  });\n};\n"],"names":["useRef","useEffect","throttle"],"mappings":";;;;;;;;;AAYA;;;;;AAKG;AACI,MAAM,iBAAiB,GAAG,CAAC,EAChC,SAAS,EACT,aAAa,EACb,UAAU,GACmB,KAAI;;AAEjC,IAAA,MAAM,gBAAgB,GAAGA,YAAM,CAA4B,SAAS,CAAC;AACrE,IAAA,gBAAgB,CAAC,OAAO,GAAG,aAAa;AAExC,IAAA,MAAM,iBAAiB,GAAGA,YAAM,CAAwB,IAAI,CAAC;AAC7D,IAAA,MAAM,eAAe,GAAGA,YAAM,CAAgD,SAAS,CAAC;AAExF,IAAA,MAAM,gBAAgB,GAAGA,YAAM,CAAqB,IAAI,CAAC;;IAGzDC,eAAS,CAAC,MAAK;AACb,QAAA,MAAM,gBAAgB,GAAG,CAAC,OAA8B,KAAI;;AAE1D,YAAA,MAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC;AAExB,YAAA,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC;;YAGxE,IACE,eAAe,CAAC,OAAO;AACvB,gBAAA,eAAe,CAAC,OAAO,CAAC,KAAK,KAAK,KAAK;AACvC,gBAAA,eAAe,CAAC,OAAO,CAAC,MAAM,KAAK,MAAM,EACzC;gBACA;AACD,YAAA;YAED,eAAe,CAAC,OAAO,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE;YAE3C,IAAI,gBAAgB,CAAC,OAAO,EAAE;gBAC5B,gBAAgB,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC;AAC5C,YAAA;AACH,QAAA,CAAC;QAED,iBAAiB,CAAC,OAAO,GAAG,IAAI,cAAc,CAC5C,UAAU,GAAGC,yBAAQ,CAAC,gBAAgB,EAAE,UAAU,CAAC,GAAG,gBAAgB,CACvE;;AAGD,QAAA,OAAO,MAAK;YACV,IAAI,iBAAiB,CAAC,OAAO,EAAE;AAC7B,gBAAA,iBAAiB,CAAC,OAAO,CAAC,UAAU,EAAE;AACvC,YAAA;AACH,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;;IAGhBD,eAAS,CAAC,MAAK;QACb,IAAI,iBAAiB,CAAC,OAAO,EAAE;;AAE7B,YAAA,IACE,CAAA,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,OAAO;AAClB,gBAAA,gBAAgB,CAAC,OAAO;AACxB,gBAAA,SAAS,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO,EAC9C;gBACA;AACD,YAAA;AAED,YAAA,iBAAiB,CAAC,OAAO,CAAC,UAAU,EAAE;AAEtC,YAAA,IAAI,SAAS,KAAA,IAAA,IAAT,SAAS,uBAAT,SAAS,CAAE,OAAO,EAAE;gBACtB,iBAAiB,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,OAAO,CAAC;AACpD,gBAAA,gBAAgB,CAAC,OAAO,GAAG,SAAS,CAAC,OAAO;AAC7C,YAAA;AACF,QAAA;AACH,IAAA,CAAC,CAAC;AACJ;;;;"}

package/dist/hooks/useResizeObserver.js

@@ -11,9 +11,9 @@ const useResizeObserver = ({ targetRef, resizeHandler, throttleMs, }) => {
     // Use a ref to store the resizeHandler to avoid re-rendering when the callback changes.
     const resizeHandlerRef = useRef(undefined);
     resizeHandlerRef.current = resizeHandler;
-    const resizeObserverRef = useRef();
+    const resizeObserverRef = useRef(null);
     const previousSizeRef = useRef(undefined);
-    const currentTargetRef = useRef();
+    const currentTargetRef = useRef(null);
     // Setup the resize observer when the hook is mounted.
     useEffect(() => {
         const observerCallback = (entries) => {

package/dist/hooks/useResizeObserver.js.map

@@ -1 +1 @@
-{"version":3,"file":"useResizeObserver.js","sources":["../../src/hooks/useResizeObserver.ts"],"sourcesContent":["import { RefObject, useEffect, useRef } from 'react';\n\nimport throttle from 'lodash.throttle';\n\ntype ResizeHandler = (size: { width: number; height: number }) => void;\n\ntype UseResizeObserverCustomProps = {\n  targetRef: RefObject<HTMLElement | null>;\n  resizeHandler: ResizeHandler;\n  throttleMs?: number;\n};\n\n/**\n * Hook which sets up a `ResizeObserver` for a given element, and fires a callback when the element is resized.\n * @param targetRef The element to observe.\n * @param resizeHandler The callback to invoke when the element is resized.\n * @param throttleMs (Optional) the number of ms to throttle the observer callback.\n */\nexport const useResizeObserver = ({\n  targetRef,\n  resizeHandler,\n  throttleMs,\n}: UseResizeObserverCustomProps) => {\n  // Use a ref to store the resizeHandler to avoid re-rendering when the callback changes.\n  const resizeHandlerRef = useRef<ResizeHandler | undefined>(undefined);\n  resizeHandlerRef.current = resizeHandler;\n\n  const resizeObserverRef = useRef<ResizeObserver>();\n  const previousSizeRef = useRef<{ width: number; height: number } | undefined>(undefined);\n\n  const currentTargetRef = useRef<HTMLElement>();\n\n  // Setup the resize observer when the hook is mounted.\n  useEffect(() => {\n    const observerCallback = (entries: ResizeObserverEntry[]) => {\n      // We'll only ever be monitoring one element, so we'll only have one entry.\n      const entry = entries[0];\n\n      const { inlineSize: width, blockSize: height } = entry.contentBoxSize[0];\n\n      // Avoid unecessary callbacks by checking to see if the dimensions have actually changed.\n      if (\n        previousSizeRef.current &&\n        previousSizeRef.current.width === width &&\n        previousSizeRef.current.height === height\n      ) {\n        return;\n      }\n\n      previousSizeRef.current = { width, height };\n\n      if (resizeHandlerRef.current) {\n        resizeHandlerRef.current({ width, height });\n      }\n    };\n\n    resizeObserverRef.current = new ResizeObserver(\n      throttleMs ? throttle(observerCallback, throttleMs) : observerCallback,\n    );\n\n    // Cleanup the resizer observer on unmount\n    return () => {\n      if (resizeObserverRef.current) {\n        resizeObserverRef.current.disconnect();\n      }\n    };\n  }, [throttleMs]);\n\n  // Ensure we're always observing the latest element referenced in 'ref'.\n  useEffect(() => {\n    if (resizeObserverRef.current) {\n      // Check to see if the ref has actually changed. If it hasn't we can skip resetting the ResizeObserver.\n      if (\n        targetRef?.current &&\n        currentTargetRef.current &&\n        targetRef.current === currentTargetRef.current\n      ) {\n        return;\n      }\n\n      resizeObserverRef.current.disconnect();\n\n      if (targetRef?.current) {\n        resizeObserverRef.current.observe(targetRef.current);\n        currentTargetRef.current = targetRef.current;\n      }\n    }\n  });\n};\n"],"names":[],"mappings":";;;AAYA;;;;;AAKG;AACI,MAAM,iBAAiB,GAAG,CAAC,EAChC,SAAS,EACT,aAAa,EACb,UAAU,GACmB,KAAI;;AAEjC,IAAA,MAAM,gBAAgB,GAAG,MAAM,CAA4B,SAAS,CAAC;AACrE,IAAA,gBAAgB,CAAC,OAAO,GAAG,aAAa;AAExC,IAAA,MAAM,iBAAiB,GAAG,MAAM,EAAkB;AAClD,IAAA,MAAM,eAAe,GAAG,MAAM,CAAgD,SAAS,CAAC;AAExF,IAAA,MAAM,gBAAgB,GAAG,MAAM,EAAe;;IAG9C,SAAS,CAAC,MAAK;AACb,QAAA,MAAM,gBAAgB,GAAG,CAAC,OAA8B,KAAI;;AAE1D,YAAA,MAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC;AAExB,YAAA,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC;;YAGxE,IACE,eAAe,CAAC,OAAO;AACvB,gBAAA,eAAe,CAAC,OAAO,CAAC,KAAK,KAAK,KAAK;AACvC,gBAAA,eAAe,CAAC,OAAO,CAAC,MAAM,KAAK,MAAM,EACzC;gBACA;AACD,YAAA;YAED,eAAe,CAAC,OAAO,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE;YAE3C,IAAI,gBAAgB,CAAC,OAAO,EAAE;gBAC5B,gBAAgB,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC;AAC5C,YAAA;AACH,QAAA,CAAC;QAED,iBAAiB,CAAC,OAAO,GAAG,IAAI,cAAc,CAC5C,UAAU,GAAG,QAAQ,CAAC,gBAAgB,EAAE,UAAU,CAAC,GAAG,gBAAgB,CACvE;;AAGD,QAAA,OAAO,MAAK;YACV,IAAI,iBAAiB,CAAC,OAAO,EAAE;AAC7B,gBAAA,iBAAiB,CAAC,OAAO,CAAC,UAAU,EAAE;AACvC,YAAA;AACH,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;;IAGhB,SAAS,CAAC,MAAK;QACb,IAAI,iBAAiB,CAAC,OAAO,EAAE;;AAE7B,YAAA,IACE,CAAA,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,OAAO;AAClB,gBAAA,gBAAgB,CAAC,OAAO;AACxB,gBAAA,SAAS,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO,EAC9C;gBACA;AACD,YAAA;AAED,YAAA,iBAAiB,CAAC,OAAO,CAAC,UAAU,EAAE;AAEtC,YAAA,IAAI,SAAS,KAAA,IAAA,IAAT,SAAS,uBAAT,SAAS,CAAE,OAAO,EAAE;gBACtB,iBAAiB,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,OAAO,CAAC;AACpD,gBAAA,gBAAgB,CAAC,OAAO,GAAG,SAAS,CAAC,OAAO;AAC7C,YAAA;AACF,QAAA;AACH,IAAA,CAAC,CAAC;AACJ;;;;"}
+{"version":3,"file":"useResizeObserver.js","sources":["../../src/hooks/useResizeObserver.ts"],"sourcesContent":["import { RefObject, useEffect, useRef } from 'react';\n\nimport throttle from 'lodash.throttle';\n\ntype ResizeHandler = (size: { width: number; height: number }) => void;\n\ntype UseResizeObserverCustomProps = {\n  targetRef: RefObject<HTMLElement | null>;\n  resizeHandler: ResizeHandler;\n  throttleMs?: number;\n};\n\n/**\n * Hook which sets up a `ResizeObserver` for a given element, and fires a callback when the element is resized.\n * @param targetRef The element to observe.\n * @param resizeHandler The callback to invoke when the element is resized.\n * @param throttleMs (Optional) the number of ms to throttle the observer callback.\n */\nexport const useResizeObserver = ({\n  targetRef,\n  resizeHandler,\n  throttleMs,\n}: UseResizeObserverCustomProps) => {\n  // Use a ref to store the resizeHandler to avoid re-rendering when the callback changes.\n  const resizeHandlerRef = useRef<ResizeHandler | undefined>(undefined);\n  resizeHandlerRef.current = resizeHandler;\n\n  const resizeObserverRef = useRef<ResizeObserver | null>(null);\n  const previousSizeRef = useRef<{ width: number; height: number } | undefined>(undefined);\n\n  const currentTargetRef = useRef<HTMLElement | null>(null);\n\n  // Setup the resize observer when the hook is mounted.\n  useEffect(() => {\n    const observerCallback = (entries: ResizeObserverEntry[]) => {\n      // We'll only ever be monitoring one element, so we'll only have one entry.\n      const entry = entries[0];\n\n      const { inlineSize: width, blockSize: height } = entry.contentBoxSize[0];\n\n      // Avoid unecessary callbacks by checking to see if the dimensions have actually changed.\n      if (\n        previousSizeRef.current &&\n        previousSizeRef.current.width === width &&\n        previousSizeRef.current.height === height\n      ) {\n        return;\n      }\n\n      previousSizeRef.current = { width, height };\n\n      if (resizeHandlerRef.current) {\n        resizeHandlerRef.current({ width, height });\n      }\n    };\n\n    resizeObserverRef.current = new ResizeObserver(\n      throttleMs ? throttle(observerCallback, throttleMs) : observerCallback,\n    );\n\n    // Cleanup the resizer observer on unmount\n    return () => {\n      if (resizeObserverRef.current) {\n        resizeObserverRef.current.disconnect();\n      }\n    };\n  }, [throttleMs]);\n\n  // Ensure we're always observing the latest element referenced in 'ref'.\n  useEffect(() => {\n    if (resizeObserverRef.current) {\n      // Check to see if the ref has actually changed. If it hasn't we can skip resetting the ResizeObserver.\n      if (\n        targetRef?.current &&\n        currentTargetRef.current &&\n        targetRef.current === currentTargetRef.current\n      ) {\n        return;\n      }\n\n      resizeObserverRef.current.disconnect();\n\n      if (targetRef?.current) {\n        resizeObserverRef.current.observe(targetRef.current);\n        currentTargetRef.current = targetRef.current;\n      }\n    }\n  });\n};\n"],"names":[],"mappings":";;;AAYA;;;;;AAKG;AACI,MAAM,iBAAiB,GAAG,CAAC,EAChC,SAAS,EACT,aAAa,EACb,UAAU,GACmB,KAAI;;AAEjC,IAAA,MAAM,gBAAgB,GAAG,MAAM,CAA4B,SAAS,CAAC;AACrE,IAAA,gBAAgB,CAAC,OAAO,GAAG,aAAa;AAExC,IAAA,MAAM,iBAAiB,GAAG,MAAM,CAAwB,IAAI,CAAC;AAC7D,IAAA,MAAM,eAAe,GAAG,MAAM,CAAgD,SAAS,CAAC;AAExF,IAAA,MAAM,gBAAgB,GAAG,MAAM,CAAqB,IAAI,CAAC;;IAGzD,SAAS,CAAC,MAAK;AACb,QAAA,MAAM,gBAAgB,GAAG,CAAC,OAA8B,KAAI;;AAE1D,YAAA,MAAM,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC;AAExB,YAAA,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC;;YAGxE,IACE,eAAe,CAAC,OAAO;AACvB,gBAAA,eAAe,CAAC,OAAO,CAAC,KAAK,KAAK,KAAK;AACvC,gBAAA,eAAe,CAAC,OAAO,CAAC,MAAM,KAAK,MAAM,EACzC;gBACA;AACD,YAAA;YAED,eAAe,CAAC,OAAO,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE;YAE3C,IAAI,gBAAgB,CAAC,OAAO,EAAE;gBAC5B,gBAAgB,CAAC,OAAO,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC;AAC5C,YAAA;AACH,QAAA,CAAC;QAED,iBAAiB,CAAC,OAAO,GAAG,IAAI,cAAc,CAC5C,UAAU,GAAG,QAAQ,CAAC,gBAAgB,EAAE,UAAU,CAAC,GAAG,gBAAgB,CACvE;;AAGD,QAAA,OAAO,MAAK;YACV,IAAI,iBAAiB,CAAC,OAAO,EAAE;AAC7B,gBAAA,iBAAiB,CAAC,OAAO,CAAC,UAAU,EAAE;AACvC,YAAA;AACH,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;;IAGhB,SAAS,CAAC,MAAK;QACb,IAAI,iBAAiB,CAAC,OAAO,EAAE;;AAE7B,YAAA,IACE,CAAA,SAAS,KAAA,IAAA,IAAT,SAAS,KAAA,MAAA,GAAA,MAAA,GAAT,SAAS,CAAE,OAAO;AAClB,gBAAA,gBAAgB,CAAC,OAAO;AACxB,gBAAA,SAAS,CAAC,OAAO,KAAK,gBAAgB,CAAC,OAAO,EAC9C;gBACA;AACD,YAAA;AAED,YAAA,iBAAiB,CAAC,OAAO,CAAC,UAAU,EAAE;AAEtC,YAAA,IAAI,SAAS,KAAA,IAAA,IAAT,SAAS,uBAAT,SAAS,CAAE,OAAO,EAAE;gBACtB,iBAAiB,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,CAAC,OAAO,CAAC;AACpD,gBAAA,gBAAgB,CAAC,OAAO,GAAG,SAAS,CAAC,OAAO;AAC7C,YAAA;AACF,QAAA;AACH,IAAA,CAAC,CAAC;AACJ;;;;"}