@openedx/paragon 22.13.0 → 22.14.0

package/src/Tabs/Tabs.test.jsx

@@ -6,7 +6,7 @@ import userEvent from '@testing-library/user-event';
 import Tabs, { MORE_TAB_TEXT } from '.';
 import Tab from './Tab';
 
-jest.mock('../hooks/useIndexOfLastVisibleChild', () => ({
+jest.mock('../hooks/useIndexOfLastVisibleChildHook', () => ({
   __esModule: true,
   default: () => 0,
 }));

package/src/Tabs/deprecated/Tabs.test.jsx

@@ -37,14 +37,16 @@ describe('<Tabs />', () => {
   });
 
   describe('switches tab selection', () => {
-    it('on click', () => {
+    it('on click', async () => {
+      const user = userEvent.setup();
       const { container } = render(<Tabs {...props} />);
       const tabButtons = container.querySelectorAll('button');
 
-      tabButtons.forEach((node, i) => {
-        userEvent.click(node);
+      for (const [i, node] of tabButtons.entries()) {
+        // eslint-disable-next-line no-await-in-loop
+        await user.click(node);
         tabSelectedAtIndex(i, container);
-      });
+      }
     });
   });
 });

package/src/Tabs/index.jsx

@@ -11,7 +11,7 @@ import BaseTabs from 'react-bootstrap/Tabs';
 import TabsDeprecated from './deprecated';
 import Bubble from '../Bubble';
 import Dropdown from '../Dropdown';
-import useIndexOfLastVisibleChild from '../hooks/useIndexOfLastVisibleChild';
+import useIndexOfLastVisibleChild from '../hooks/useIndexOfLastVisibleChildHook';
 import Tab from './Tab';
 
 export const MORE_TAB_TEXT = 'More...';

package/src/Toast/ToastContainer.scss

@@ -11,7 +11,7 @@
     left: 0;
   }
 
-  @media only screen and (max-width: 768px) {
+  @media only screen and (width <= 768px) {
     bottom: $toast-container-gutter-sm;
     right: $toast-container-gutter-sm;
     left: $toast-container-gutter-sm;

package/src/Toast/index.scss

@@ -42,11 +42,11 @@
     }
   }
 
-  @media only screen and (max-width: 768px) {
+  @media only screen and (width <= 768px) {
     max-width: 100%;
   }
 
-  @media only screen and (min-width: 768px) {
+  @media only screen and (width >= 768px) {
     min-width: $toast-max-width;
     max-width: $toast-max-width;
   }

package/src/Truncate/index.jsx

@@ -3,7 +3,7 @@ import React, {
 } from 'react';
 import PropTypes from 'prop-types';
 import { truncateLines } from './utils';
-import useWindowSize from '../hooks/useWindowSize';
+import useWindowSize from '../hooks/useWindowSizeHook';
 
 const DEFAULT_TRUNCATE_LINES = 1;
 const DEFAULT_TRUNCATE_ELLIPSIS = '...';

package/src/hooks/tests/useToggle.test.tsx

@@ -4,7 +4,7 @@ import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 
 import { useToggle } from '../..';
-import { ToggleHandlers } from '../useToggle';
+import { ToggleHandlers } from '../useToggleHook';
 
 const TOGGLE_IS_ON = 'on';
 const TOGGLE_IS_OFF = 'off';

package/src/hooks/{useArrowKeyNavigation.tsx → useArrowKeyNavigationHook.tsx}

@@ -1,3 +1,7 @@
+// Note: this file was renamed from 'useArrowKeyNavigation.tsx' to 'useArrowKeyNavigationHook.tsx' to fix
+// some bugs in the Gatsby www site, where Webpack was getting the .tsx and .mdx
+// files confused. Renaming this file allows us to keep the URLs of the docs site
+// unchanged.
 import { useRef, useEffect } from 'react';
 
 interface HandleEnterArgs {

package/src/hooks/{useIndexOfLastVisibleChild.tsx → useIndexOfLastVisibleChildHook.tsx}

@@ -1,3 +1,7 @@
+// Note: this file was renamed from 'useIndexOfLastVisibleChild.tsx' to 'useIndexOfLastVisibleChildHook.tsx' to fix
+// some bugs in the Gatsby www site, where Webpack was getting the .tsx and .mdx
+// files confused. Renaming this file allows us to keep the URLs of the docs site
+// unchanged.
 import { useLayoutEffect, useState } from 'react';
 
 /**

package/src/hooks/{useToggle.tsx → useToggleHook.tsx}

@@ -1,3 +1,7 @@
+// Note: this file was renamed from 'useToggle.tsx' to 'useToggleHook.tsx' to fix
+// some bugs in the Gatsby www site, where Webpack was getting the .tsx and .mdx
+// files confused. Renaming this file allows us to keep the URLs of the docs site
+// unchanged.
 import { useState, useCallback } from 'react';
 
 export type Toggler = [

package/src/index.d.ts

@@ -40,11 +40,11 @@ export { default as ModalLayer } from './Modal/ModalLayer';
 export { default as Overlay, OverlayTrigger } from './Overlay';
 export { default as Portal } from './Modal/Portal';
 export { default as Tooltip } from './Tooltip';
-export { default as useWindowSize, type WindowSizeData } from './hooks/useWindowSize';
-export { default as useToggle, type Toggler, type ToggleHandlers } from './hooks/useToggle';
-export { default as useArrowKeyNavigation, type ArrowKeyNavProps } from './hooks/useArrowKeyNavigation';
-export { default as useIndexOfLastVisibleChild } from './hooks/useIndexOfLastVisibleChild';
-export { default as useIsVisible } from './hooks/useIsVisible';
+export { default as useWindowSize, type WindowSizeData } from './hooks/useWindowSizeHook';
+export { default as useToggle, type Toggler, type ToggleHandlers } from './hooks/useToggleHook';
+export { default as useArrowKeyNavigation, type ArrowKeyNavProps } from './hooks/useArrowKeyNavigationHook';
+export { default as useIndexOfLastVisibleChild } from './hooks/useIndexOfLastVisibleChildHook';
+export { default as useIsVisible } from './hooks/useIsVisibleHook';
 
 // // // // // // // // // // // // // // // // // // // // // // // // // // //
 // Things that don't have types

package/src/index.js

@@ -40,11 +40,11 @@ export { default as ModalLayer } from './Modal/ModalLayer';
 export { default as Overlay, OverlayTrigger } from './Overlay';
 export { default as Portal } from './Modal/Portal';
 export { default as Tooltip } from './Tooltip';
-export { default as useWindowSize } from './hooks/useWindowSize';
-export { default as useToggle } from './hooks/useToggle';
-export { default as useArrowKeyNavigation } from './hooks/useArrowKeyNavigation';
-export { default as useIndexOfLastVisibleChild } from './hooks/useIndexOfLastVisibleChild';
-export { default as useIsVisible } from './hooks/useIsVisible';
+export { default as useWindowSize } from './hooks/useWindowSizeHook';
+export { default as useToggle } from './hooks/useToggleHook';
+export { default as useArrowKeyNavigation } from './hooks/useArrowKeyNavigationHook';
+export { default as useIndexOfLastVisibleChild } from './hooks/useIndexOfLastVisibleChildHook';
+export { default as useIsVisible } from './hooks/useIsVisibleHook';
 
 // // // // // // // // // // // // // // // // // // // // // // // // // // //
 // Things that don't have types

package/dist/hooks/useArrowKeyNavigation.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useArrowKeyNavigation.js","names":["useRef","useEffect","handleEnter","_ref","event","currentIndex","activeElement","click","preventDefault","handleArrowKey","_ref2","availableElements","focus","nextElement","key","length","handleEvents","_ref3","ignoredKeys","parentNode","selectors","includes","document","contains","querySelectorAll","Array","from","findIndex","availableElement","useArrowKeyNavigation","props","arguments","undefined","eventHandler","current","addEventListener","removeEventListener"],"sources":["../../src/hooks/useArrowKeyNavigation.tsx"],"sourcesContent":["import { useRef, useEffect } from 'react';\n\ninterface HandleEnterArgs {\n  event: KeyboardEvent;\n  currentIndex: number;\n  activeElement: HTMLElement;\n}\n\nfunction handleEnter({ event, currentIndex, activeElement }: HandleEnterArgs) {\n  if (currentIndex === -1) { return; }\n  activeElement.click();\n  event.preventDefault();\n}\n\ninterface HandleArrowKeyArgs {\n  event: KeyboardEvent;\n  currentIndex: number;\n  availableElements: NodeListOf<HTMLElement>;\n}\n\nfunction handleArrowKey({ event, currentIndex, availableElements }: HandleArrowKeyArgs) {\n  // If the focus isn't in the container, focus on the first thing\n  if (currentIndex === -1) { availableElements[0].focus(); }\n\n  // Move the focus up or down. Wrap around ends of list.\n  let nextElement;\n\n  if (event.key === 'ArrowDown' || event.key === 'ArrowRight') {\n    nextElement = availableElements[(currentIndex + 1) % availableElements.length];\n  }\n  if (event.key === 'ArrowUp' || event.key === 'ArrowLeft') {\n    nextElement = currentIndex - 1 < 0\n      ? availableElements[currentIndex - 1 + availableElements.length]\n      : availableElements[currentIndex - 1];\n  }\n  if (event.key === 'End') {\n    nextElement = availableElements[availableElements.length - 1];\n  }\n  if (event.key === 'Home') {\n    [nextElement] = availableElements;\n  }\n\n  nextElement?.focus();\n  event.preventDefault();\n}\n\ninterface HandleEventsArgs {\n  event: KeyboardEvent;\n  ignoredKeys?: string[];\n  parentNode: HTMLElement | undefined;\n  selectors?: string;\n}\n\n/**\n * Implement arrow key navigation for the given parentNode\n */\nfunction handleEvents({\n  event,\n  ignoredKeys = [],\n  parentNode,\n  selectors = 'a,button,input',\n}: HandleEventsArgs) {\n  if (!parentNode) { return; }\n\n  const { key } = event;\n\n  if (!['ArrowUp', 'ArrowDown', 'ArrowRight', 'ArrowLeft', 'Enter', 'Home', 'End'].includes(key)\n      || ignoredKeys.includes(key)) {\n    return;\n  }\n\n  const { activeElement } = document;\n\n  // If we're not inside the container, don't do anything\n  if (!parentNode.contains(activeElement)) { return; }\n\n  // Get the list of elements we're allowed to scroll through\n  const availableElements = parentNode.querySelectorAll<HTMLElement>(selectors);\n\n  // No elements are available to loop through.\n  if (!availableElements.length) { return; }\n\n  // Which index is currently selected\n  const currentIndex = Array.from(availableElements).findIndex(\n    (availableElement) => availableElement === activeElement,\n  );\n\n  if (key === 'Enter' && activeElement) {\n    handleEnter({ event, currentIndex, activeElement: activeElement as HTMLElement });\n  }\n  handleArrowKey({ event, currentIndex, availableElements });\n}\n\nexport interface ArrowKeyNavProps {\n  /** e.g. 'a,button,input' */\n  selectors?: string;\n  ignoredKeys?: string[];\n}\n\n/**\n * A React hook to enable arrow key navigation on a component.\n */\nexport default function useArrowKeyNavigation(props: ArrowKeyNavProps = {}) {\n  const { selectors, ignoredKeys } = props;\n  const parentNode = useRef<HTMLElement>();\n\n  useEffect(() => {\n    const eventHandler = (event: KeyboardEvent) => {\n      handleEvents({\n        event, ignoredKeys, parentNode: parentNode.current, selectors,\n      });\n    };\n\n    document.addEventListener('keydown', eventHandler);\n\n    return () => document.removeEventListener('keydown', eventHandler);\n  }, [ignoredKeys, selectors]);\n\n  return parentNode;\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/hooks/useIndexOfLastVisibleChild.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useIndexOfLastVisibleChild.js","names":["useLayoutEffect","useState","useIndexOfLastVisibleChild","containerElementRef","overflowElementRef","indexOfLastVisibleChild","setIndexOfLastVisibleChild","undefined","updateLastVisibleChildIndex","childNodesArr","Array","prototype","slice","call","children","nextIndexOfLastVisibleChild","filter","childNode","reduce","acc","index","sumWidth","getBoundingClientRect","width","resizeObserver","ResizeObserver","observe","disconnect"],"sources":["../../src/hooks/useIndexOfLastVisibleChild.tsx"],"sourcesContent":["import { useLayoutEffect, useState } from 'react';\n\n/**\n * This hook will find the index of the last child of a containing element\n * that fits within its bounding rectangle. This is done by summing the widths\n * of the children until they exceed the width of the container.\n *\n * The hook returns the index of the last visible child.\n *\n * @param containerElementRef - container element\n * @param overflowElementRef - overflow element\n */\nconst useIndexOfLastVisibleChild = (\n  containerElementRef: HTMLElement | null,\n  overflowElementRef: HTMLElement | null,\n): number => {\n  const [indexOfLastVisibleChild, setIndexOfLastVisibleChild] = useState(-1);\n\n  useLayoutEffect(() => {\n    if (!containerElementRef) {\n      return undefined;\n    }\n\n    function updateLastVisibleChildIndex() {\n      // Get array of child nodes from NodeList form\n      const childNodesArr = Array.prototype.slice.call(containerElementRef!.children);\n      const { nextIndexOfLastVisibleChild } = childNodesArr\n        // filter out the overflow element\n        .filter(childNode => childNode !== overflowElementRef)\n        // sum the widths to find the last visible element's index\n        .reduce((acc, childNode, index) => {\n          acc.sumWidth += childNode.getBoundingClientRect().width;\n          if (acc.sumWidth <= containerElementRef!.getBoundingClientRect().width) {\n            acc.nextIndexOfLastVisibleChild = index;\n          }\n          return acc;\n        }, {\n          // Include the overflow element's width to begin with. Doing this means\n          // sometimes we'll show a dropdown with one item in it when it would fit,\n          // but allowing this case dramatically simplifies the calculations we need\n          // to do above.\n          sumWidth: overflowElementRef?.getBoundingClientRect().width ?? 0,\n          nextIndexOfLastVisibleChild: -1,\n        });\n\n      setIndexOfLastVisibleChild(nextIndexOfLastVisibleChild);\n    }\n\n    updateLastVisibleChildIndex();\n\n    const resizeObserver = new ResizeObserver(() => updateLastVisibleChildIndex());\n    resizeObserver.observe(containerElementRef);\n    return () => resizeObserver.disconnect();\n  }, [containerElementRef, overflowElementRef]);\n\n  return indexOfLastVisibleChild;\n};\n\nexport default useIndexOfLastVisibleChild;\n"],"mappings":"AAAA,SAASA,eAAe,EAAEC,QAAQ,QAAQ,OAAO;;AAEjD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,0BAA0B,GAAGA,CACjCC,mBAAuC,EACvCC,kBAAsC,KAC3B;EACX,MAAM,CAACC,uBAAuB,EAAEC,0BAA0B,CAAC,GAAGL,QAAQ,CAAC,CAAC,CAAC,CAAC;EAE1ED,eAAe,CAAC,MAAM;IACpB,IAAI,CAACG,mBAAmB,EAAE;MACxB,OAAOI,SAAS;IAClB;IAEA,SAASC,2BAA2BA,CAAA,EAAG;MACrC;MACA,MAAMC,aAAa,GAAGC,KAAK,CAACC,SAAS,CAACC,KAAK,CAACC,IAAI,CAACV,mBAAmB,CAAEW,QAAQ,CAAC;MAC/E,MAAM;QAAEC;MAA4B,CAAC,GAAGN;MACtC;MAAA,CACCO,MAAM,CAACC,SAAS,IAAIA,SAAS,KAAKb,kBAAkB;MACrD;MAAA,CACCc,MAAM,CAAC,CAACC,GAAG,EAAEF,SAAS,EAAEG,KAAK,KAAK;QACjCD,GAAG,CAACE,QAAQ,IAAIJ,SAAS,CAACK,qBAAqB,CAAC,CAAC,CAACC,KAAK;QACvD,IAAIJ,GAAG,CAACE,QAAQ,IAAIlB,mBAAmB,CAAEmB,qBAAqB,CAAC,CAAC,CAACC,KAAK,EAAE;UACtEJ,GAAG,CAACJ,2BAA2B,GAAGK,KAAK;QACzC;QACA,OAAOD,GAAG;MACZ,CAAC,EAAE;QACD;QACA;QACA;QACA;QACAE,QAAQ,EAAEjB,kBAAkB,EAAEkB,qBAAqB,CAAC,CAAC,CAACC,KAAK,IAAI,CAAC;QAChER,2BAA2B,EAAE,CAAC;MAChC,CAAC,CAAC;MAEJT,0BAA0B,CAACS,2BAA2B,CAAC;IACzD;IAEAP,2BAA2B,CAAC,CAAC;IAE7B,MAAMgB,cAAc,GAAG,IAAIC,cAAc,CAAC,MAAMjB,2BAA2B,CAAC,CAAC,CAAC;IAC9EgB,cAAc,CAACE,OAAO,CAACvB,mBAAmB,CAAC;IAC3C,OAAO,MAAMqB,cAAc,CAACG,UAAU,CAAC,CAAC;EAC1C,CAAC,EAAE,CAACxB,mBAAmB,EAAEC,kBAAkB,CAAC,CAAC;EAE7C,OAAOC,uBAAuB;AAChC,CAAC;AAED,eAAeH,0BAA0B","ignoreList":[]}

package/dist/hooks/useIsVisible.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useIsVisible.js","names":["useRef","useState","useEffect","useIsVisible","defaultIsVisible","arguments","length","undefined","sentinelRef","isVisible","setIsVisible","current","observer","IntersectionObserver","entries","forEach","_ref","isIntersecting","observe","disconnect","e","isReferenceError","ReferenceError"],"sources":["../../src/hooks/useIsVisible.tsx"],"sourcesContent":["import React, { useRef, useState, useEffect } from 'react';\n\nconst useIsVisible = (defaultIsVisible = true): [\n  isVisible: boolean,\n  sentinelRef: React.MutableRefObject<HTMLElement | null>,\n] => {\n  const sentinelRef = useRef<HTMLElement | null>(null);\n  const [isVisible, setIsVisible] = useState(defaultIsVisible);\n\n  useEffect(() => {\n    try {\n      if (sentinelRef.current) {\n        const observer = new IntersectionObserver((entries) => {\n          entries.forEach(({ isIntersecting }) => {\n            setIsVisible(isIntersecting);\n          });\n        }, {});\n        observer.observe(sentinelRef.current);\n        return () => {\n          observer.disconnect();\n        };\n      }\n    } catch (e) {\n      const isReferenceError = e instanceof ReferenceError;\n      if (!isReferenceError) {\n        throw e;\n      }\n      // Do nothing if an intersection observer can't be created.\n    }\n    return () => {};\n  }, []);\n\n  return [isVisible, sentinelRef];\n};\n\nexport default useIsVisible;\n"],"mappings":"AAAA,SAAgBA,MAAM,EAAEC,QAAQ,EAAEC,SAAS,QAAQ,OAAO;AAE1D,MAAMC,YAAY,GAAG,SAAAA,CAAA,EAGhB;EAAA,IAHiBC,gBAAgB,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAG,IAAI;EAI3C,MAAMG,WAAW,GAAGR,MAAM,CAAqB,IAAI,CAAC;EACpD,MAAM,CAACS,SAAS,EAAEC,YAAY,CAAC,GAAGT,QAAQ,CAACG,gBAAgB,CAAC;EAE5DF,SAAS,CAAC,MAAM;IACd,IAAI;MACF,IAAIM,WAAW,CAACG,OAAO,EAAE;QACvB,MAAMC,QAAQ,GAAG,IAAIC,oBAAoB,CAAEC,OAAO,IAAK;UACrDA,OAAO,CAACC,OAAO,CAACC,IAAA,IAAwB;YAAA,IAAvB;cAAEC;YAAe,CAAC,GAAAD,IAAA;YACjCN,YAAY,CAACO,cAAc,CAAC;UAC9B,CAAC,CAAC;QACJ,CAAC,EAAE,CAAC,CAAC,CAAC;QACNL,QAAQ,CAACM,OAAO,CAACV,WAAW,CAACG,OAAO,CAAC;QACrC,OAAO,MAAM;UACXC,QAAQ,CAACO,UAAU,CAAC,CAAC;QACvB,CAAC;MACH;IACF,CAAC,CAAC,OAAOC,CAAC,EAAE;MACV,MAAMC,gBAAgB,GAAGD,CAAC,YAAYE,cAAc;MACpD,IAAI,CAACD,gBAAgB,EAAE;QACrB,MAAMD,CAAC;MACT;MACA;IACF;IACA,OAAO,MAAM,CAAC,CAAC;EACjB,CAAC,EAAE,EAAE,CAAC;EAEN,OAAO,CAACX,SAAS,EAAED,WAAW,CAAC;AACjC,CAAC;AAED,eAAeL,YAAY","ignoreList":[]}

package/dist/hooks/useToggle.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useToggle.js","names":["useState","useCallback","useToggle","defaultIsOn","arguments","length","undefined","handlers","handleToggleOn","handleToggleOff","handleToggle","isOn","setIsOn","setOn","setOff","toggle","doToggle"],"sources":["../../src/hooks/useToggle.tsx"],"sourcesContent":["import { useState, useCallback } from 'react';\n\nexport type Toggler = [\n  isOn: boolean,\n  setOn: () => void,\n  setOff: () => void,\n  toggle: () => void,\n];\n\nexport interface ToggleHandlers {\n  handleToggleOn?: () => void;\n  handleToggleOff?: () => void;\n  handleToggle?: (newStatus: boolean) => void;\n}\n\nexport default function useToggle(defaultIsOn = false, handlers: ToggleHandlers = {}): Toggler {\n  const { handleToggleOn, handleToggleOff, handleToggle } = handlers;\n  const [isOn, setIsOn] = useState(defaultIsOn);\n\n  const setOn = useCallback(() => {\n    setIsOn(true);\n    handleToggleOn?.();\n    handleToggle?.(true);\n  }, [handleToggleOn, handleToggle]);\n\n  const setOff = useCallback(() => {\n    setIsOn(false);\n    handleToggleOff?.();\n    handleToggle?.(false);\n  }, [handleToggleOff, handleToggle]);\n\n  const toggle = useCallback(() => {\n    const doToggle = isOn ? setOff : setOn;\n    doToggle();\n  }, [isOn, setOn, setOff]);\n\n  return [isOn, setOn, setOff, toggle];\n}\n"],"mappings":"AAAA,SAASA,QAAQ,EAAEC,WAAW,QAAQ,OAAO;AAe7C,eAAe,SAASC,SAASA,CAAA,EAA8D;EAAA,IAA7DC,WAAW,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAG,KAAK;EAAA,IAAEG,QAAwB,GAAAH,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAG,CAAC,CAAC;EAClF,MAAM;IAAEI,cAAc;IAAEC,eAAe;IAAEC;EAAa,CAAC,GAAGH,QAAQ;EAClE,MAAM,CAACI,IAAI,EAAEC,OAAO,CAAC,GAAGZ,QAAQ,CAACG,WAAW,CAAC;EAE7C,MAAMU,KAAK,GAAGZ,WAAW,CAAC,MAAM;IAC9BW,OAAO,CAAC,IAAI,CAAC;IACbJ,cAAc,GAAG,CAAC;IAClBE,YAAY,GAAG,IAAI,CAAC;EACtB,CAAC,EAAE,CAACF,cAAc,EAAEE,YAAY,CAAC,CAAC;EAElC,MAAMI,MAAM,GAAGb,WAAW,CAAC,MAAM;IAC/BW,OAAO,CAAC,KAAK,CAAC;IACdH,eAAe,GAAG,CAAC;IACnBC,YAAY,GAAG,KAAK,CAAC;EACvB,CAAC,EAAE,CAACD,eAAe,EAAEC,YAAY,CAAC,CAAC;EAEnC,MAAMK,MAAM,GAAGd,WAAW,CAAC,MAAM;IAC/B,MAAMe,QAAQ,GAAGL,IAAI,GAAGG,MAAM,GAAGD,KAAK;IACtCG,QAAQ,CAAC,CAAC;EACZ,CAAC,EAAE,CAACL,IAAI,EAAEE,KAAK,EAAEC,MAAM,CAAC,CAAC;EAEzB,OAAO,CAACH,IAAI,EAAEE,KAAK,EAAEC,MAAM,EAAEC,MAAM,CAAC;AACtC","ignoreList":[]}

package/dist/hooks/useWindowSize.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useWindowSize.js","names":["useState","useLayoutEffect","useWindowSize","windowSize","setWindowSize","width","undefined","height","handleResize","global","innerWidth","innerHeight","addEventListener","removeEventListener"],"sources":["../../src/hooks/useWindowSize.tsx"],"sourcesContent":["import { useState, useLayoutEffect } from 'react';\n\nexport interface WindowSizeData {\n  width: number | undefined;\n  height: number | undefined;\n}\n\nfunction useWindowSize(): WindowSizeData {\n  // Initialize state with undefined width/height so server and client renders match\n  // Learn more here: https://joshwcomeau.com/react/the-perils-of-rehydration/\n  const [windowSize, setWindowSize] = useState<WindowSizeData>({\n    width: undefined,\n    height: undefined,\n  });\n\n  useLayoutEffect(() => {\n    // Handler to call on window resize\n    function handleResize() {\n      // Set window width/height to state\n      setWindowSize({\n        width: global.innerWidth,\n        height: global.innerHeight,\n      });\n    }\n\n    // Add event listener\n    global.addEventListener('resize', handleResize);\n\n    // Call handler right away so state gets updated with initial window size\n    handleResize();\n\n    // Remove event listener on cleanup\n    return () => global.removeEventListener('resize', handleResize);\n  }, []); // Empty array ensures that effect is only run on mount\n\n  return windowSize;\n}\n\nexport default useWindowSize;\n"],"mappings":"AAAA,SAASA,QAAQ,EAAEC,eAAe,QAAQ,OAAO;AAOjD,SAASC,aAAaA,CAAA,EAAmB;EACvC;EACA;EACA,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAGJ,QAAQ,CAAiB;IAC3DK,KAAK,EAAEC,SAAS;IAChBC,MAAM,EAAED;EACV,CAAC,CAAC;EAEFL,eAAe,CAAC,MAAM;IACpB;IACA,SAASO,YAAYA,CAAA,EAAG;MACtB;MACAJ,aAAa,CAAC;QACZC,KAAK,EAAEI,MAAM,CAACC,UAAU;QACxBH,MAAM,EAAEE,MAAM,CAACE;MACjB,CAAC,CAAC;IACJ;;IAEA;IACAF,MAAM,CAACG,gBAAgB,CAAC,QAAQ,EAAEJ,YAAY,CAAC;;IAE/C;IACAA,YAAY,CAAC,CAAC;;IAEd;IACA,OAAO,MAAMC,MAAM,CAACI,mBAAmB,CAAC,QAAQ,EAAEL,YAAY,CAAC;EACjE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;;EAER,OAAOL,UAAU;AACnB;AAEA,eAAeD,aAAa","ignoreList":[]}

package/src/DataTable/tests/utils.js

@@ -1,9 +0,0 @@
-import { act } from 'react-dom/test-utils';
-
-// eslint-disable-next-line import/prefer-default-export
-export const waitForComponentToPaint = async (wrapper) => {
-  await act(async () => {
-    await new Promise(resolve => { setTimeout(resolve); });
-    wrapper.update();
-  });
-};