@elliemae/ds-utilities 3.19.0 → 3.19.1-rc.1

package/dist/cjs/hooks/index.js

@@ -46,6 +46,7 @@ __export(hooks_exports, {
   useIsShowingEllipsis: () => import_useIsShowingEllipsis.useIsShowingEllipsis,
   useMakeMutable: () => import_useMakeMutable.useMakeMutable,
   useMeasure: () => import_use_measure.default,
+  useNativeIntersectionObserver: () => import_useNativeIntersectionObserver.useNativeIntersectionObserver,
   useNativeResizeObserver: () => import_useNativeResizeObserver.useNativeResizeObserver,
   useOnBlurOut: () => import_useOnBlurOut.useOnBlurOut,
   useOnClickOutside: () => import_use_onclickoutside.default,
@@ -55,6 +56,7 @@ __export(hooks_exports, {
   usePrevious: () => import_usePrevious.usePrevious,
   useResizeObserver: () => import_useResizeObserver.useResizeObserver,
   useShouldRecalculate: () => import_useShouldRecalculate.useShouldRecalculate,
+  useTrackElement: () => import_useTrackElement.useTrackElement,
   useWindowScrollerList: () => import_useWindowScrollerList.useWindowScrollerList
 });
 module.exports = __toCommonJS(hooks_exports);
@@ -74,6 +76,7 @@ var import_useHoverHandlersDelay = require("./useHoverHandlersDelay.js");
 var import_useIsMobile = require("./useIsMobile.js");
 var import_useIsShowingEllipsis = require("./useIsShowingEllipsis.js");
 var import_useMakeMutable = require("./useMakeMutable.js");
+var import_useNativeIntersectionObserver = require("./useNativeIntersectionObserver.js");
 var import_useNativeResizeObserver = require("./useNativeResizeObserver.js");
 var import_useOnBlurOut = require("./useOnBlurOut.js");
 var import_useOnElementResize = require("./useOnElementResize.js");
@@ -82,5 +85,6 @@ var import_useOnSpecificFocus = require("./useOnSpecificFocus.js");
 var import_usePrevious = require("./usePrevious.js");
 var import_useResizeObserver = require("./useResizeObserver.js");
 var import_useShouldRecalculate = require("./useShouldRecalculate.js");
+var import_useTrackElement = require("./useTrackElement.js");
 var import_useWindowScrollerList = require("./useWindowScrollerList.js");
 //# sourceMappingURL=index.js.map

package/dist/cjs/hooks/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/hooks/index.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["export { default as useMeasure } from 'use-measure';\nexport { default as useForceUpdate } from 'use-force-update';\nexport { default as useOnClickOutside } from 'use-onclickoutside';\n\nexport { useCallbackAfterRender } from './useCallbackAfterRender.js';\nexport { useCancellableDelayedCallback } from './useCancellableDelayedCallback.js';\nexport { useDerivedStateFromProps } from './useDerivedStateFromProps.js';\nexport { useExecutionTimer } from './useExecutionTimer.js';\nexport { useExpandState } from './useExpandState.js';\nexport { useFocusTrap, UseFocusTrapWithSchema } from './useFocusTrap.js';\nexport { useHeadlessTooltip } from './useHeadlessTooltip.js';\nexport { useHotkeys } from './useHotkeys.js';\nexport { useHoverHandlersDelay } from './useHoverHandlersDelay.js';\nexport { useIsMobile } from './useIsMobile.js';\nexport { useIsShowingEllipsis } from './useIsShowingEllipsis.js';\nexport { useMakeMutable } from './useMakeMutable.js';\nexport { useNativeResizeObserver } from './useNativeResizeObserver.js';\nexport { useOnBlurOut, UseOnBlurOutWithSchema } from './useOnBlurOut.js';\nexport { useOnElementResize } from './useOnElementResize.js';\nexport { useOnFirstFocusIn, UseOnFirstFocusInWithSchema } from './useOnFirstFocusIn.js';\nexport { useOnSpecificFocus, UseOnSpecificFocusWithSchema } from './useOnSpecificFocus.js';\nexport { usePrevious } from './usePrevious.js';\nexport { useResizeObserver } from './useResizeObserver.js';\nexport { useShouldRecalculate } from './useShouldRecalculate.js';\nexport { useWindowScrollerList } from './useWindowScrollerList.js';\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,yBAAsC;AACtC,8BAA0C;AAC1C,gCAA6C;AAE7C,oCAAuC;AACvC,2CAA8C;AAC9C,sCAAyC;AACzC,+BAAkC;AAClC,4BAA+B;AAC/B,0BAAqD;AACrD,gCAAmC;AACnC,wBAA2B;AAC3B,mCAAsC;AACtC,yBAA4B;AAC5B,kCAAqC;AACrC,4BAA+B;AAC/B,qCAAwC;AACxC,0BAAqD;AACrD,gCAAmC;AACnC,+BAA+D;AAC/D,gCAAiE;AACjE,yBAA4B;AAC5B,+BAAkC;AAClC,kCAAqC;AACrC,mCAAsC;",
+  "sourcesContent": ["export { default as useMeasure } from 'use-measure';\nexport { default as useForceUpdate } from 'use-force-update';\nexport { default as useOnClickOutside } from 'use-onclickoutside';\n\nexport { useCallbackAfterRender } from './useCallbackAfterRender.js';\nexport { useCancellableDelayedCallback } from './useCancellableDelayedCallback.js';\nexport { useDerivedStateFromProps } from './useDerivedStateFromProps.js';\nexport { useExecutionTimer } from './useExecutionTimer.js';\nexport { useExpandState } from './useExpandState.js';\nexport { useFocusTrap, UseFocusTrapWithSchema } from './useFocusTrap.js';\nexport { useHeadlessTooltip } from './useHeadlessTooltip.js';\nexport { useHotkeys } from './useHotkeys.js';\nexport { useHoverHandlersDelay } from './useHoverHandlersDelay.js';\nexport { useIsMobile } from './useIsMobile.js';\nexport { useIsShowingEllipsis } from './useIsShowingEllipsis.js';\nexport { useMakeMutable } from './useMakeMutable.js';\nexport { useNativeIntersectionObserver } from './useNativeIntersectionObserver.js';\nexport { useNativeResizeObserver } from './useNativeResizeObserver.js';\nexport { useOnBlurOut, UseOnBlurOutWithSchema } from './useOnBlurOut.js';\nexport { useOnElementResize } from './useOnElementResize.js';\nexport { useOnFirstFocusIn, UseOnFirstFocusInWithSchema } from './useOnFirstFocusIn.js';\nexport { useOnSpecificFocus, UseOnSpecificFocusWithSchema } from './useOnSpecificFocus.js';\nexport { usePrevious } from './usePrevious.js';\nexport { useResizeObserver } from './useResizeObserver.js';\nexport { useShouldRecalculate } from './useShouldRecalculate.js';\nexport { useTrackElement } from './useTrackElement.js';\nexport { useWindowScrollerList } from './useWindowScrollerList.js';\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,yBAAsC;AACtC,8BAA0C;AAC1C,gCAA6C;AAE7C,oCAAuC;AACvC,2CAA8C;AAC9C,sCAAyC;AACzC,+BAAkC;AAClC,4BAA+B;AAC/B,0BAAqD;AACrD,gCAAmC;AACnC,wBAA2B;AAC3B,mCAAsC;AACtC,yBAA4B;AAC5B,kCAAqC;AACrC,4BAA+B;AAC/B,2CAA8C;AAC9C,qCAAwC;AACxC,0BAAqD;AACrD,gCAAmC;AACnC,+BAA+D;AAC/D,gCAAiE;AACjE,yBAA4B;AAC5B,+BAAkC;AAClC,kCAAqC;AACrC,6BAAgC;AAChC,mCAAsC;",
   "names": []
 }

package/dist/cjs/hooks/useNativeIntersectionObserver.js

@@ -0,0 +1,59 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var useNativeIntersectionObserver_exports = {};
+__export(useNativeIntersectionObserver_exports, {
+  useNativeIntersectionObserver: () => useNativeIntersectionObserver
+});
+module.exports = __toCommonJS(useNativeIntersectionObserver_exports);
+var React = __toESM(require("react"));
+var import_react = require("react");
+const useNativeIntersectionObserver = (el, callback) => {
+  const intersectionObserver = (0, import_react.useMemo)(
+    () => new IntersectionObserver((entries) => {
+      const entry = entries[0];
+      const target = entry.target;
+      callback({
+        boundingClientRect: entry.boundingClientRect,
+        intersectionRatio: entry.intersectionRatio,
+        intersectionRect: entry.intersectionRect,
+        isIntersecting: entry.isIntersecting,
+        rootBounds: entry.rootBounds,
+        target,
+        time: entry.time
+      });
+    }),
+    [callback]
+  );
+  (0, import_react.useEffect)(() => {
+    if (el)
+      intersectionObserver.observe(el);
+    return () => intersectionObserver.disconnect();
+  }, [el, intersectionObserver]);
+};
+//# sourceMappingURL=useNativeIntersectionObserver.js.map

package/dist/cjs/hooks/useNativeIntersectionObserver.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/hooks/useNativeIntersectionObserver.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import { useEffect, useMemo } from 'react';\n\n// Custom hook to use the intersection observer api,\n// to observe changes in the position of an **UNIQUE** element\n// Will trigger the callback with the boundingClientRect of the element\n// the intersection ratio, the intersection rect, if it is intersecting\n// and the html element itself, so you can query for extra information\nexport const useNativeIntersectionObserver = <T extends HTMLElement>(\n  el: T | null,\n  callback: (entry: Omit<IntersectionObserverEntry, 'target'> & { target: T }) => void,\n) => {\n  const intersectionObserver = useMemo(\n    () =>\n      new IntersectionObserver((entries) => {\n        const entry = entries[0]; // We will only observe one element\n\n        const target = entry.target as T;\n\n        callback({\n          boundingClientRect: entry.boundingClientRect,\n          intersectionRatio: entry.intersectionRatio,\n          intersectionRect: entry.intersectionRect,\n          isIntersecting: entry.isIntersecting,\n          rootBounds: entry.rootBounds,\n          target,\n          time: entry.time,\n        });\n      }),\n    [callback],\n  );\n\n  useEffect(() => {\n    if (el) intersectionObserver.observe(el);\n    return () => intersectionObserver.disconnect();\n  }, [el, intersectionObserver]);\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAmC;AAO5B,MAAM,gCAAgC,CAC3C,IACA,aACG;AACH,QAAM,2BAAuB;AAAA,IAC3B,MACE,IAAI,qBAAqB,CAAC,YAAY;AACpC,YAAM,QAAQ,QAAQ,CAAC;AAEvB,YAAM,SAAS,MAAM;AAErB,eAAS;AAAA,QACP,oBAAoB,MAAM;AAAA,QAC1B,mBAAmB,MAAM;AAAA,QACzB,kBAAkB,MAAM;AAAA,QACxB,gBAAgB,MAAM;AAAA,QACtB,YAAY,MAAM;AAAA,QAClB;AAAA,QACA,MAAM,MAAM;AAAA,MACd,CAAC;AAAA,IACH,CAAC;AAAA,IACH,CAAC,QAAQ;AAAA,EACX;AAEA,8BAAU,MAAM;AACd,QAAI;AAAI,2BAAqB,QAAQ,EAAE;AACvC,WAAO,MAAM,qBAAqB,WAAW;AAAA,EAC/C,GAAG,CAAC,IAAI,oBAAoB,CAAC;AAC/B;",
+  "names": []
+}

package/dist/cjs/hooks/useTrackElement.js

@@ -0,0 +1,50 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var useTrackElement_exports = {};
+__export(useTrackElement_exports, {
+  useTrackElement: () => useTrackElement
+});
+module.exports = __toCommonJS(useTrackElement_exports);
+var React = __toESM(require("react"));
+var import_react = require("react");
+var import_useNativeIntersectionObserver = require("./useNativeIntersectionObserver.js");
+const useTrackElement = (el, callback) => {
+  const prevPosition = (0, import_react.useRef)({ x: null, y: null });
+  const debouncedCallback = (0, import_react.useCallback)(
+    (entry) => {
+      if (entry.boundingClientRect.x !== prevPosition.current.x || entry.boundingClientRect.y !== prevPosition.current.y) {
+        callback(entry);
+      }
+      prevPosition.current = { x: entry.boundingClientRect.x, y: entry.boundingClientRect.y };
+    },
+    [callback]
+  );
+  (0, import_useNativeIntersectionObserver.useNativeIntersectionObserver)(el, debouncedCallback);
+};
+//# sourceMappingURL=useTrackElement.js.map

package/dist/cjs/hooks/useTrackElement.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/hooks/useTrackElement.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import { useCallback, useRef } from 'react';\nimport { useNativeIntersectionObserver } from './useNativeIntersectionObserver.js';\n\ntype Callback<T extends HTMLElement> = (entry: Omit<IntersectionObserverEntry, 'target'> & { target: T }) => void;\n\n// Uses native intersection observer to trigger the callback when the\n// element is intersecting the viewport and the position of the element\n// is changed\nexport const useTrackElement = <T extends HTMLElement>(el: T | null, callback: Callback<T>) => {\n  const prevPosition = useRef<{ x: number | null; y: number | null }>({ x: null, y: null });\n\n  const debouncedCallback: Callback<T> = useCallback(\n    (entry) => {\n      if (\n        entry.boundingClientRect.x !== prevPosition.current.x ||\n        entry.boundingClientRect.y !== prevPosition.current.y\n      ) {\n        callback(entry);\n      }\n      prevPosition.current = { x: entry.boundingClientRect.x, y: entry.boundingClientRect.y };\n    },\n    [callback],\n  );\n\n  useNativeIntersectionObserver(el, debouncedCallback);\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAoC;AACpC,2CAA8C;AAOvC,MAAM,kBAAkB,CAAwB,IAAc,aAA0B;AAC7F,QAAM,mBAAe,qBAA+C,EAAE,GAAG,MAAM,GAAG,KAAK,CAAC;AAExF,QAAM,wBAAiC;AAAA,IACrC,CAAC,UAAU;AACT,UACE,MAAM,mBAAmB,MAAM,aAAa,QAAQ,KACpD,MAAM,mBAAmB,MAAM,aAAa,QAAQ,GACpD;AACA,iBAAS,KAAK;AAAA,MAChB;AACA,mBAAa,UAAU,EAAE,GAAG,MAAM,mBAAmB,GAAG,GAAG,MAAM,mBAAmB,EAAE;AAAA,IACxF;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,0EAA8B,IAAI,iBAAiB;AACrD;",
+  "names": []
+}

package/dist/cjs/index.js

@@ -126,6 +126,7 @@ __export(src_exports, {
   useIsShowingEllipsis: () => import_hooks.useIsShowingEllipsis,
   useMakeMutable: () => import_hooks.useMakeMutable,
   useMeasure: () => import_hooks.useMeasure,
+  useNativeIntersectionObserver: () => import_hooks.useNativeIntersectionObserver,
   useNativeResizeObserver: () => import_hooks.useNativeResizeObserver,
   useOnBlurOut: () => import_hooks.useOnBlurOut,
   useOnClickOutside: () => import_hooks.useOnClickOutside,
@@ -135,6 +136,7 @@ __export(src_exports, {
   usePrevious: () => import_hooks.usePrevious,
   useResizeObserver: () => import_hooks.useResizeObserver,
   useShouldRecalculate: () => import_hooks.useShouldRecalculate,
+  useTrackElement: () => import_hooks.useTrackElement,
   useWindowScrollerList: () => import_hooks.useWindowScrollerList,
   validDate: () => import_operators.validDate,
   values: () => import_utils.values

package/dist/cjs/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/index.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["export { default as getComponentFromProps } from './getComponentFromProps.js';\nexport { default as onClickHandlerForNonInteractiveElements } from './onClickHandlerForNonInteractiveElements.js';\nexport { capitalize } from './capitalize.js';\nexport { getObjectValuesToArray, getObjectKeysToArray } from './objectUtilities.js';\nexport {\n  checkNotEmpty,\n  checkEmpty,\n  greaterThan,\n  validDate,\n  equal,\n  notEqual,\n  isNull,\n  isNotNull,\n  isIn,\n  isNotIn,\n  greaterThanOrEquals,\n  lessThanOrEquals,\n  startsWith,\n  contains,\n} from './operators.js';\nexport {\n  cx,\n  runAll,\n  hashArray,\n  safeCall,\n  removeUndefinedProperties,\n  isObject,\n  curry,\n  arrayMove,\n  uniq,\n  filter,\n  uniqBy,\n  groupBy,\n  property,\n  get,\n  set,\n  cloneDeep,\n  debounce,\n  findIndex,\n  isEmpty,\n  isString,\n  isEqual,\n  maxBy,\n  meanBy,\n  noop,\n  omit,\n  orderBy,\n  pull,\n  sortBy,\n  sumBy,\n  transform,\n  isFunction,\n  range,\n  parseInt,\n  padStart,\n  isNaN,\n  values,\n  throttle,\n  toggleInObject,\n  toggleInArray,\n  pick,\n  pickBy,\n  differenceBy,\n  differenceWith,\n  addOrRemove,\n  isEqualWith,\n  isBoolean,\n} from './utils.js';\nexport { setRef, mergeRefs, setMultipleRefs, logger } from './system.js';\nexport {\n  useMeasure,\n  useForceUpdate,\n  useOnClickOutside,\n  useExecutionTimer,\n  useExpandState,\n  useHotkeys,\n  useHoverHandlersDelay,\n  useResizeObserver,\n  useShouldRecalculate,\n  useWindowScrollerList,\n  usePrevious,\n  useCancellableDelayedCallback,\n  useDerivedStateFromProps,\n  useOnElementResize,\n  useIsShowingEllipsis,\n  useNativeResizeObserver,\n  useMakeMutable,\n  useCallbackAfterRender,\n  useFocusTrap,\n  UseFocusTrapWithSchema,\n  useIsMobile,\n  useOnBlurOut,\n  UseOnBlurOutWithSchema,\n  useOnFirstFocusIn,\n  UseOnFirstFocusInWithSchema,\n  useOnSpecificFocus,\n  UseOnSpecificFocusWithSchema,\n  useHeadlessTooltip,\n} from './hooks/index.js';\nexport { getVisibleTimeByFormat, addLeadingZeros } from './timeUtils.js';\nexport { compose } from './compose.js';\nexport { DOCUMENT, WINDOW } from './platform.js';\nexport { isDOMTypeElement } from './reactTypesUtility.js';\nexport { isRequired, isGreaterThan, isValidDate } from './validations.js';\nexport { getHighlightedRerendersStyle } from './getHighlightedRerendersStyle.js';\n\nexport { crossTypeSort } from './algorithms/crossTypeSort.js';\nexport { appendComponentIfNotExist } from './addComponentIfNotExists.js';\n// TODO -- REMOVE WHEN READY\nexport * from './deprecated/index.js';\nexport * from './props-helpers/index.js';\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mCAAiD;AACjD,qDAAmE;AACnE,wBAA2B;AAC3B,6BAA6D;AAC7D,uBAeO;AACP,mBA+CO;AACP,oBAA2D;AAC3D,mBA6BO;AACP,uBAAwD;AACxD,qBAAwB;AACxB,sBAAiC;AACjC,+BAAiC;AACjC,yBAAuD;AACvD,0CAA6C;AAE7C,2BAA8B;AAC9B,qCAA0C;AAE1C,wBAAc,kCA7Gd;AA8GA,wBAAc,qCA9Gd;",
+  "sourcesContent": ["export { default as getComponentFromProps } from './getComponentFromProps.js';\nexport { default as onClickHandlerForNonInteractiveElements } from './onClickHandlerForNonInteractiveElements.js';\nexport { capitalize } from './capitalize.js';\nexport { getObjectValuesToArray, getObjectKeysToArray } from './objectUtilities.js';\nexport {\n  checkEmpty,\n  checkNotEmpty,\n  contains,\n  equal,\n  greaterThan,\n  greaterThanOrEquals,\n  isIn,\n  isNotIn,\n  isNotNull,\n  isNull,\n  lessThanOrEquals,\n  notEqual,\n  startsWith,\n  validDate,\n} from './operators.js';\nexport {\n  addOrRemove,\n  arrayMove,\n  cloneDeep,\n  curry,\n  cx,\n  debounce,\n  differenceBy,\n  differenceWith,\n  filter,\n  findIndex,\n  get,\n  groupBy,\n  hashArray,\n  isBoolean,\n  isEmpty,\n  isEqual,\n  isEqualWith,\n  isFunction,\n  isNaN,\n  isObject,\n  isString,\n  maxBy,\n  meanBy,\n  noop,\n  omit,\n  orderBy,\n  padStart,\n  parseInt,\n  pick,\n  pickBy,\n  property,\n  pull,\n  range,\n  removeUndefinedProperties,\n  runAll,\n  safeCall,\n  set,\n  sortBy,\n  sumBy,\n  throttle,\n  toggleInArray,\n  toggleInObject,\n  transform,\n  uniq,\n  uniqBy,\n  values,\n} from './utils.js';\nexport { setRef, mergeRefs, setMultipleRefs, logger } from './system.js';\nexport {\n  useCallbackAfterRender,\n  useCancellableDelayedCallback,\n  useDerivedStateFromProps,\n  useExecutionTimer,\n  useExpandState,\n  useFocusTrap,\n  UseFocusTrapWithSchema,\n  useForceUpdate,\n  useHeadlessTooltip,\n  useHotkeys,\n  useHoverHandlersDelay,\n  useIsMobile,\n  useIsShowingEllipsis,\n  useMakeMutable,\n  useMeasure,\n  useNativeIntersectionObserver,\n  useNativeResizeObserver,\n  useOnBlurOut,\n  UseOnBlurOutWithSchema,\n  useOnClickOutside,\n  useOnElementResize,\n  useOnFirstFocusIn,\n  UseOnFirstFocusInWithSchema,\n  useOnSpecificFocus,\n  UseOnSpecificFocusWithSchema,\n  usePrevious,\n  useResizeObserver,\n  useShouldRecalculate,\n  useTrackElement,\n  useWindowScrollerList,\n} from './hooks/index.js';\nexport { getVisibleTimeByFormat, addLeadingZeros } from './timeUtils.js';\nexport { compose } from './compose.js';\nexport { DOCUMENT, WINDOW } from './platform.js';\nexport { isDOMTypeElement } from './reactTypesUtility.js';\nexport { isRequired, isGreaterThan, isValidDate } from './validations.js';\nexport { getHighlightedRerendersStyle } from './getHighlightedRerendersStyle.js';\n\nexport { crossTypeSort } from './algorithms/crossTypeSort.js';\nexport { appendComponentIfNotExist } from './addComponentIfNotExists.js';\n// TODO -- REMOVE WHEN READY\nexport * from './deprecated/index.js';\nexport * from './props-helpers/index.js';\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mCAAiD;AACjD,qDAAmE;AACnE,wBAA2B;AAC3B,6BAA6D;AAC7D,uBAeO;AACP,mBA+CO;AACP,oBAA2D;AAC3D,mBA+BO;AACP,uBAAwD;AACxD,qBAAwB;AACxB,sBAAiC;AACjC,+BAAiC;AACjC,yBAAuD;AACvD,0CAA6C;AAE7C,2BAA8B;AAC9B,qCAA0C;AAE1C,wBAAc,kCA/Gd;AAgHA,wBAAc,qCAhHd;",
   "names": []
 }

package/dist/cjs/system.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/system.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import type React from 'react';\nimport { isFunction } from './utils.js';\n\ntype AnyRef<T extends HTMLElement> =\n  | React.MutableRefObject<T | null>\n  | ((_ref: T | null) => void)\n  | React.Dispatch<React.SetStateAction<T | null>>\n  | false;\n\nexport const setRef = <T extends HTMLElement>(ref: AnyRef<T>, value: T) => {\n  if (isFunction(ref)) {\n    ref(value);\n  } else if (ref) {\n    ref.current = value;\n  }\n};\n\nexport const mergeRefs = <T extends HTMLElement>(...refs: AnyRef<T>[]) => {\n  const mergeRefsFunc = (node: T | null) => {\n    if (!node) return;\n    refs.forEach((ref) => setRef(ref, node));\n  };\n  return mergeRefsFunc;\n};\n\nexport function setMultipleRefs<T = unknown>(\n  refs: Array<React.RefObject<T> | React.LegacyRef<T>>,\n): React.RefCallback<T> {\n  return (value) => {\n    refs.forEach((ref) => {\n      if (typeof ref === 'function') {\n        ref(value);\n      } else if (ref != null) {\n        (ref as React.MutableRefObject<T | null>).current = value;\n      }\n    });\n  };\n}\n\nexport function logger(...args: unknown[]) {\n  // eslint-disable-next-line no-console\n  console.log(...args);\n}\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAA2B;AAQpB,MAAM,SAAS,CAAwB,KAAgB,UAAa;AACzE,UAAI,yBAAW,GAAG,GAAG;AACnB,QAAI,KAAK;AAAA,EACX,WAAW,KAAK;AACd,QAAI,UAAU;AAAA,EAChB;AACF;AAEO,MAAM,YAAY,IAA2B,SAAsB;AACxE,QAAM,gBAAgB,CAAC,SAAmB;AACxC,QAAI,CAAC;AAAM;AACX,SAAK,QAAQ,CAAC,QAAQ,OAAO,KAAK,IAAI,CAAC;AAAA,EACzC;AACA,SAAO;AACT;AAEO,SAAS,gBACd,MACsB;AACtB,SAAO,CAAC,UAAU;AAChB,SAAK,QAAQ,CAAC,QAAQ;AACpB,UAAI,OAAO,QAAQ,YAAY;AAC7B,YAAI,KAAK;AAAA,MACX,WAAW,OAAO,MAAM;AACtB,QAAC,IAAyC,UAAU;AAAA,MACtD;AAAA,IACF,CAAC;AAAA,EACH;AACF;AAEO,SAAS,UAAU,MAAiB;AAEzC,UAAQ,IAAI,GAAG,IAAI;AACrB;",
+  "sourcesContent": ["import type React from 'react';\nimport { isFunction } from './utils.js';\n\ntype AnyRef<T extends HTMLElement> =\n  | React.MutableRefObject<T | null>\n  | ((_ref: T | null) => void)\n  | React.Dispatch<React.SetStateAction<T | null>>\n  | false\n  | undefined\n  | null;\n\nexport const setRef = <T extends HTMLElement>(ref: AnyRef<T>, value: T) => {\n  if (isFunction(ref)) {\n    ref(value);\n  } else if (ref) {\n    ref.current = value;\n  }\n};\n\nexport const mergeRefs = <T extends HTMLElement>(...refs: AnyRef<T>[]) => {\n  const mergeRefsFunc = (node: T | null) => {\n    if (!node) return;\n    refs.forEach((ref) => setRef(ref, node));\n  };\n  return mergeRefsFunc;\n};\n\nexport function setMultipleRefs<T = unknown>(\n  refs: Array<React.RefObject<T> | React.LegacyRef<T>>,\n): React.RefCallback<T> {\n  return (value) => {\n    refs.forEach((ref) => {\n      if (typeof ref === 'function') {\n        ref(value);\n      } else if (ref != null) {\n        (ref as React.MutableRefObject<T | null>).current = value;\n      }\n    });\n  };\n}\n\nexport function logger(...args: unknown[]) {\n  // eslint-disable-next-line no-console\n  console.log(...args);\n}\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAA2B;AAUpB,MAAM,SAAS,CAAwB,KAAgB,UAAa;AACzE,UAAI,yBAAW,GAAG,GAAG;AACnB,QAAI,KAAK;AAAA,EACX,WAAW,KAAK;AACd,QAAI,UAAU;AAAA,EAChB;AACF;AAEO,MAAM,YAAY,IAA2B,SAAsB;AACxE,QAAM,gBAAgB,CAAC,SAAmB;AACxC,QAAI,CAAC;AAAM;AACX,SAAK,QAAQ,CAAC,QAAQ,OAAO,KAAK,IAAI,CAAC;AAAA,EACzC;AACA,SAAO;AACT;AAEO,SAAS,gBACd,MACsB;AACtB,SAAO,CAAC,UAAU;AAChB,SAAK,QAAQ,CAAC,QAAQ;AACpB,UAAI,OAAO,QAAQ,YAAY;AAC7B,YAAI,KAAK;AAAA,MACX,WAAW,OAAO,MAAM;AACtB,QAAC,IAAyC,UAAU;AAAA,MACtD;AAAA,IACF,CAAC;AAAA,EACH;AACF;AAEO,SAAS,UAAU,MAAiB;AAEzC,UAAQ,IAAI,GAAG,IAAI;AACrB;",
   "names": []
 }

package/dist/esm/hooks/index.js

@@ -14,6 +14,7 @@ import { useHoverHandlersDelay } from "./useHoverHandlersDelay.js";
 import { useIsMobile } from "./useIsMobile.js";
 import { useIsShowingEllipsis } from "./useIsShowingEllipsis.js";
 import { useMakeMutable } from "./useMakeMutable.js";
+import { useNativeIntersectionObserver } from "./useNativeIntersectionObserver.js";
 import { useNativeResizeObserver } from "./useNativeResizeObserver.js";
 import { useOnBlurOut, UseOnBlurOutWithSchema } from "./useOnBlurOut.js";
 import { useOnElementResize } from "./useOnElementResize.js";
@@ -22,6 +23,7 @@ import { useOnSpecificFocus, UseOnSpecificFocusWithSchema } from "./useOnSpecifi
 import { usePrevious } from "./usePrevious.js";
 import { useResizeObserver } from "./useResizeObserver.js";
 import { useShouldRecalculate } from "./useShouldRecalculate.js";
+import { useTrackElement } from "./useTrackElement.js";
 import { useWindowScrollerList } from "./useWindowScrollerList.js";
 export {
   UseFocusTrapWithSchema,
@@ -42,6 +44,7 @@ export {
   useIsShowingEllipsis,
   useMakeMutable,
   default2 as useMeasure,
+  useNativeIntersectionObserver,
   useNativeResizeObserver,
   useOnBlurOut,
   default4 as useOnClickOutside,
@@ -51,6 +54,7 @@ export {
   usePrevious,
   useResizeObserver,
   useShouldRecalculate,
+  useTrackElement,
   useWindowScrollerList
 };
 //# sourceMappingURL=index.js.map

package/dist/esm/hooks/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/hooks/index.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { default as useMeasure } from 'use-measure';\nexport { default as useForceUpdate } from 'use-force-update';\nexport { default as useOnClickOutside } from 'use-onclickoutside';\n\nexport { useCallbackAfterRender } from './useCallbackAfterRender.js';\nexport { useCancellableDelayedCallback } from './useCancellableDelayedCallback.js';\nexport { useDerivedStateFromProps } from './useDerivedStateFromProps.js';\nexport { useExecutionTimer } from './useExecutionTimer.js';\nexport { useExpandState } from './useExpandState.js';\nexport { useFocusTrap, UseFocusTrapWithSchema } from './useFocusTrap.js';\nexport { useHeadlessTooltip } from './useHeadlessTooltip.js';\nexport { useHotkeys } from './useHotkeys.js';\nexport { useHoverHandlersDelay } from './useHoverHandlersDelay.js';\nexport { useIsMobile } from './useIsMobile.js';\nexport { useIsShowingEllipsis } from './useIsShowingEllipsis.js';\nexport { useMakeMutable } from './useMakeMutable.js';\nexport { useNativeResizeObserver } from './useNativeResizeObserver.js';\nexport { useOnBlurOut, UseOnBlurOutWithSchema } from './useOnBlurOut.js';\nexport { useOnElementResize } from './useOnElementResize.js';\nexport { useOnFirstFocusIn, UseOnFirstFocusInWithSchema } from './useOnFirstFocusIn.js';\nexport { useOnSpecificFocus, UseOnSpecificFocusWithSchema } from './useOnSpecificFocus.js';\nexport { usePrevious } from './usePrevious.js';\nexport { useResizeObserver } from './useResizeObserver.js';\nexport { useShouldRecalculate } from './useShouldRecalculate.js';\nexport { useWindowScrollerList } from './useWindowScrollerList.js';\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAoB,WAAXA,gBAA6B;AACtC,SAAoB,WAAXA,gBAAiC;AAC1C,SAAoB,WAAXA,gBAAoC;AAE7C,SAAS,8BAA8B;AACvC,SAAS,qCAAqC;AAC9C,SAAS,gCAAgC;AACzC,SAAS,yBAAyB;AAClC,SAAS,sBAAsB;AAC/B,SAAS,cAAc,8BAA8B;AACrD,SAAS,0BAA0B;AACnC,SAAS,kBAAkB;AAC3B,SAAS,6BAA6B;AACtC,SAAS,mBAAmB;AAC5B,SAAS,4BAA4B;AACrC,SAAS,sBAAsB;AAC/B,SAAS,+BAA+B;AACxC,SAAS,cAAc,8BAA8B;AACrD,SAAS,0BAA0B;AACnC,SAAS,mBAAmB,mCAAmC;AAC/D,SAAS,oBAAoB,oCAAoC;AACjE,SAAS,mBAAmB;AAC5B,SAAS,yBAAyB;AAClC,SAAS,4BAA4B;AACrC,SAAS,6BAA6B;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { default as useMeasure } from 'use-measure';\nexport { default as useForceUpdate } from 'use-force-update';\nexport { default as useOnClickOutside } from 'use-onclickoutside';\n\nexport { useCallbackAfterRender } from './useCallbackAfterRender.js';\nexport { useCancellableDelayedCallback } from './useCancellableDelayedCallback.js';\nexport { useDerivedStateFromProps } from './useDerivedStateFromProps.js';\nexport { useExecutionTimer } from './useExecutionTimer.js';\nexport { useExpandState } from './useExpandState.js';\nexport { useFocusTrap, UseFocusTrapWithSchema } from './useFocusTrap.js';\nexport { useHeadlessTooltip } from './useHeadlessTooltip.js';\nexport { useHotkeys } from './useHotkeys.js';\nexport { useHoverHandlersDelay } from './useHoverHandlersDelay.js';\nexport { useIsMobile } from './useIsMobile.js';\nexport { useIsShowingEllipsis } from './useIsShowingEllipsis.js';\nexport { useMakeMutable } from './useMakeMutable.js';\nexport { useNativeIntersectionObserver } from './useNativeIntersectionObserver.js';\nexport { useNativeResizeObserver } from './useNativeResizeObserver.js';\nexport { useOnBlurOut, UseOnBlurOutWithSchema } from './useOnBlurOut.js';\nexport { useOnElementResize } from './useOnElementResize.js';\nexport { useOnFirstFocusIn, UseOnFirstFocusInWithSchema } from './useOnFirstFocusIn.js';\nexport { useOnSpecificFocus, UseOnSpecificFocusWithSchema } from './useOnSpecificFocus.js';\nexport { usePrevious } from './usePrevious.js';\nexport { useResizeObserver } from './useResizeObserver.js';\nexport { useShouldRecalculate } from './useShouldRecalculate.js';\nexport { useTrackElement } from './useTrackElement.js';\nexport { useWindowScrollerList } from './useWindowScrollerList.js';\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAoB,WAAXA,gBAA6B;AACtC,SAAoB,WAAXA,gBAAiC;AAC1C,SAAoB,WAAXA,gBAAoC;AAE7C,SAAS,8BAA8B;AACvC,SAAS,qCAAqC;AAC9C,SAAS,gCAAgC;AACzC,SAAS,yBAAyB;AAClC,SAAS,sBAAsB;AAC/B,SAAS,cAAc,8BAA8B;AACrD,SAAS,0BAA0B;AACnC,SAAS,kBAAkB;AAC3B,SAAS,6BAA6B;AACtC,SAAS,mBAAmB;AAC5B,SAAS,4BAA4B;AACrC,SAAS,sBAAsB;AAC/B,SAAS,qCAAqC;AAC9C,SAAS,+BAA+B;AACxC,SAAS,cAAc,8BAA8B;AACrD,SAAS,0BAA0B;AACnC,SAAS,mBAAmB,mCAAmC;AAC/D,SAAS,oBAAoB,oCAAoC;AACjE,SAAS,mBAAmB;AAC5B,SAAS,yBAAyB;AAClC,SAAS,4BAA4B;AACrC,SAAS,uBAAuB;AAChC,SAAS,6BAA6B;",
   "names": ["default"]
 }

package/dist/esm/hooks/useNativeIntersectionObserver.js

@@ -0,0 +1,29 @@
+import * as React from "react";
+import { useEffect, useMemo } from "react";
+const useNativeIntersectionObserver = (el, callback) => {
+  const intersectionObserver = useMemo(
+    () => new IntersectionObserver((entries) => {
+      const entry = entries[0];
+      const target = entry.target;
+      callback({
+        boundingClientRect: entry.boundingClientRect,
+        intersectionRatio: entry.intersectionRatio,
+        intersectionRect: entry.intersectionRect,
+        isIntersecting: entry.isIntersecting,
+        rootBounds: entry.rootBounds,
+        target,
+        time: entry.time
+      });
+    }),
+    [callback]
+  );
+  useEffect(() => {
+    if (el)
+      intersectionObserver.observe(el);
+    return () => intersectionObserver.disconnect();
+  }, [el, intersectionObserver]);
+};
+export {
+  useNativeIntersectionObserver
+};
+//# sourceMappingURL=useNativeIntersectionObserver.js.map

package/dist/esm/hooks/useNativeIntersectionObserver.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/hooks/useNativeIntersectionObserver.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useEffect, useMemo } from 'react';\n\n// Custom hook to use the intersection observer api,\n// to observe changes in the position of an **UNIQUE** element\n// Will trigger the callback with the boundingClientRect of the element\n// the intersection ratio, the intersection rect, if it is intersecting\n// and the html element itself, so you can query for extra information\nexport const useNativeIntersectionObserver = <T extends HTMLElement>(\n  el: T | null,\n  callback: (entry: Omit<IntersectionObserverEntry, 'target'> & { target: T }) => void,\n) => {\n  const intersectionObserver = useMemo(\n    () =>\n      new IntersectionObserver((entries) => {\n        const entry = entries[0]; // We will only observe one element\n\n        const target = entry.target as T;\n\n        callback({\n          boundingClientRect: entry.boundingClientRect,\n          intersectionRatio: entry.intersectionRatio,\n          intersectionRect: entry.intersectionRect,\n          isIntersecting: entry.isIntersecting,\n          rootBounds: entry.rootBounds,\n          target,\n          time: entry.time,\n        });\n      }),\n    [callback],\n  );\n\n  useEffect(() => {\n    if (el) intersectionObserver.observe(el);\n    return () => intersectionObserver.disconnect();\n  }, [el, intersectionObserver]);\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,WAAW,eAAe;AAO5B,MAAM,gCAAgC,CAC3C,IACA,aACG;AACH,QAAM,uBAAuB;AAAA,IAC3B,MACE,IAAI,qBAAqB,CAAC,YAAY;AACpC,YAAM,QAAQ,QAAQ,CAAC;AAEvB,YAAM,SAAS,MAAM;AAErB,eAAS;AAAA,QACP,oBAAoB,MAAM;AAAA,QAC1B,mBAAmB,MAAM;AAAA,QACzB,kBAAkB,MAAM;AAAA,QACxB,gBAAgB,MAAM;AAAA,QACtB,YAAY,MAAM;AAAA,QAClB;AAAA,QACA,MAAM,MAAM;AAAA,MACd,CAAC;AAAA,IACH,CAAC;AAAA,IACH,CAAC,QAAQ;AAAA,EACX;AAEA,YAAU,MAAM;AACd,QAAI;AAAI,2BAAqB,QAAQ,EAAE;AACvC,WAAO,MAAM,qBAAqB,WAAW;AAAA,EAC/C,GAAG,CAAC,IAAI,oBAAoB,CAAC;AAC/B;",
+  "names": []
+}

package/dist/esm/hooks/useTrackElement.js

@@ -0,0 +1,20 @@
+import * as React from "react";
+import { useCallback, useRef } from "react";
+import { useNativeIntersectionObserver } from "./useNativeIntersectionObserver.js";
+const useTrackElement = (el, callback) => {
+  const prevPosition = useRef({ x: null, y: null });
+  const debouncedCallback = useCallback(
+    (entry) => {
+      if (entry.boundingClientRect.x !== prevPosition.current.x || entry.boundingClientRect.y !== prevPosition.current.y) {
+        callback(entry);
+      }
+      prevPosition.current = { x: entry.boundingClientRect.x, y: entry.boundingClientRect.y };
+    },
+    [callback]
+  );
+  useNativeIntersectionObserver(el, debouncedCallback);
+};
+export {
+  useTrackElement
+};
+//# sourceMappingURL=useTrackElement.js.map

package/dist/esm/hooks/useTrackElement.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/hooks/useTrackElement.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useCallback, useRef } from 'react';\nimport { useNativeIntersectionObserver } from './useNativeIntersectionObserver.js';\n\ntype Callback<T extends HTMLElement> = (entry: Omit<IntersectionObserverEntry, 'target'> & { target: T }) => void;\n\n// Uses native intersection observer to trigger the callback when the\n// element is intersecting the viewport and the position of the element\n// is changed\nexport const useTrackElement = <T extends HTMLElement>(el: T | null, callback: Callback<T>) => {\n  const prevPosition = useRef<{ x: number | null; y: number | null }>({ x: null, y: null });\n\n  const debouncedCallback: Callback<T> = useCallback(\n    (entry) => {\n      if (\n        entry.boundingClientRect.x !== prevPosition.current.x ||\n        entry.boundingClientRect.y !== prevPosition.current.y\n      ) {\n        callback(entry);\n      }\n      prevPosition.current = { x: entry.boundingClientRect.x, y: entry.boundingClientRect.y };\n    },\n    [callback],\n  );\n\n  useNativeIntersectionObserver(el, debouncedCallback);\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,aAAa,cAAc;AACpC,SAAS,qCAAqC;AAOvC,MAAM,kBAAkB,CAAwB,IAAc,aAA0B;AAC7F,QAAM,eAAe,OAA+C,EAAE,GAAG,MAAM,GAAG,KAAK,CAAC;AAExF,QAAM,oBAAiC;AAAA,IACrC,CAAC,UAAU;AACT,UACE,MAAM,mBAAmB,MAAM,aAAa,QAAQ,KACpD,MAAM,mBAAmB,MAAM,aAAa,QAAQ,GACpD;AACA,iBAAS,KAAK;AAAA,MAChB;AACA,mBAAa,UAAU,EAAE,GAAG,MAAM,mBAAmB,GAAG,GAAG,MAAM,mBAAmB,EAAE;AAAA,IACxF;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,gCAA8B,IAAI,iBAAiB;AACrD;",
+  "names": []
+}

package/dist/esm/index.js

@@ -4,99 +4,101 @@ import { default as default3 } from "./onClickHandlerForNonInteractiveElements.j
 import { capitalize } from "./capitalize.js";
 import { getObjectValuesToArray, getObjectKeysToArray } from "./objectUtilities.js";
 import {
-  checkNotEmpty,
   checkEmpty,
-  greaterThan,
-  validDate,
+  checkNotEmpty,
+  contains,
   equal,
-  notEqual,
-  isNull,
-  isNotNull,
+  greaterThan,
+  greaterThanOrEquals,
   isIn,
   isNotIn,
-  greaterThanOrEquals,
+  isNotNull,
+  isNull,
   lessThanOrEquals,
+  notEqual,
   startsWith,
-  contains
+  validDate
 } from "./operators.js";
 import {
-  cx,
-  runAll,
-  hashArray,
-  safeCall,
-  removeUndefinedProperties,
-  isObject,
-  curry,
+  addOrRemove,
   arrayMove,
-  uniq,
-  filter,
-  uniqBy,
-  groupBy,
-  property,
-  get,
-  set,
   cloneDeep,
+  curry,
+  cx,
   debounce,
+  differenceBy,
+  differenceWith,
+  filter,
   findIndex,
+  get,
+  groupBy,
+  hashArray,
+  isBoolean,
   isEmpty,
-  isString,
   isEqual,
+  isEqualWith,
+  isFunction,
+  isNaN,
+  isObject,
+  isString,
   maxBy,
   meanBy,
   noop,
   omit,
   orderBy,
+  padStart,
+  parseInt,
+  pick,
+  pickBy,
+  property,
   pull,
+  range,
+  removeUndefinedProperties,
+  runAll,
+  safeCall,
+  set,
   sortBy,
   sumBy,
-  transform,
-  isFunction,
-  range,
-  parseInt,
-  padStart,
-  isNaN,
-  values,
   throttle,
-  toggleInObject,
   toggleInArray,
-  pick,
-  pickBy,
-  differenceBy,
-  differenceWith,
-  addOrRemove,
-  isEqualWith,
-  isBoolean
+  toggleInObject,
+  transform,
+  uniq,
+  uniqBy,
+  values
 } from "./utils.js";
 import { setRef, mergeRefs, setMultipleRefs, logger } from "./system.js";
 import {
-  useMeasure,
-  useForceUpdate,
-  useOnClickOutside,
+  useCallbackAfterRender,
+  useCancellableDelayedCallback,
+  useDerivedStateFromProps,
   useExecutionTimer,
   useExpandState,
+  useFocusTrap,
+  UseFocusTrapWithSchema,
+  useForceUpdate,
+  useHeadlessTooltip,
   useHotkeys,
   useHoverHandlersDelay,
-  useResizeObserver,
-  useShouldRecalculate,
-  useWindowScrollerList,
-  usePrevious,
-  useCancellableDelayedCallback,
-  useDerivedStateFromProps,
-  useOnElementResize,
+  useIsMobile,
   useIsShowingEllipsis,
-  useNativeResizeObserver,
   useMakeMutable,
-  useCallbackAfterRender,
-  useFocusTrap,
-  UseFocusTrapWithSchema,
-  useIsMobile,
+  useMeasure,
+  useNativeIntersectionObserver,
+  useNativeResizeObserver,
   useOnBlurOut,
   UseOnBlurOutWithSchema,
+  useOnClickOutside,
+  useOnElementResize,
   useOnFirstFocusIn,
   UseOnFirstFocusInWithSchema,
   useOnSpecificFocus,
   UseOnSpecificFocusWithSchema,
-  useHeadlessTooltip
+  usePrevious,
+  useResizeObserver,
+  useShouldRecalculate,
+  useTrackElement,
+  useWindowScrollerList
 } from "./hooks/index.js";
 import { getVisibleTimeByFormat, addLeadingZeros } from "./timeUtils.js";
 import { compose } from "./compose.js";
@@ -206,6 +208,7 @@ export {
   useIsShowingEllipsis,
   useMakeMutable,
   useMeasure,
+  useNativeIntersectionObserver,
   useNativeResizeObserver,
   useOnBlurOut,
   useOnClickOutside,
@@ -215,6 +218,7 @@ export {
   usePrevious,
   useResizeObserver,
   useShouldRecalculate,
+  useTrackElement,
   useWindowScrollerList,
   validDate,
   values

package/dist/esm/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { default as getComponentFromProps } from './getComponentFromProps.js';\nexport { default as onClickHandlerForNonInteractiveElements } from './onClickHandlerForNonInteractiveElements.js';\nexport { capitalize } from './capitalize.js';\nexport { getObjectValuesToArray, getObjectKeysToArray } from './objectUtilities.js';\nexport {\n  checkNotEmpty,\n  checkEmpty,\n  greaterThan,\n  validDate,\n  equal,\n  notEqual,\n  isNull,\n  isNotNull,\n  isIn,\n  isNotIn,\n  greaterThanOrEquals,\n  lessThanOrEquals,\n  startsWith,\n  contains,\n} from './operators.js';\nexport {\n  cx,\n  runAll,\n  hashArray,\n  safeCall,\n  removeUndefinedProperties,\n  isObject,\n  curry,\n  arrayMove,\n  uniq,\n  filter,\n  uniqBy,\n  groupBy,\n  property,\n  get,\n  set,\n  cloneDeep,\n  debounce,\n  findIndex,\n  isEmpty,\n  isString,\n  isEqual,\n  maxBy,\n  meanBy,\n  noop,\n  omit,\n  orderBy,\n  pull,\n  sortBy,\n  sumBy,\n  transform,\n  isFunction,\n  range,\n  parseInt,\n  padStart,\n  isNaN,\n  values,\n  throttle,\n  toggleInObject,\n  toggleInArray,\n  pick,\n  pickBy,\n  differenceBy,\n  differenceWith,\n  addOrRemove,\n  isEqualWith,\n  isBoolean,\n} from './utils.js';\nexport { setRef, mergeRefs, setMultipleRefs, logger } from './system.js';\nexport {\n  useMeasure,\n  useForceUpdate,\n  useOnClickOutside,\n  useExecutionTimer,\n  useExpandState,\n  useHotkeys,\n  useHoverHandlersDelay,\n  useResizeObserver,\n  useShouldRecalculate,\n  useWindowScrollerList,\n  usePrevious,\n  useCancellableDelayedCallback,\n  useDerivedStateFromProps,\n  useOnElementResize,\n  useIsShowingEllipsis,\n  useNativeResizeObserver,\n  useMakeMutable,\n  useCallbackAfterRender,\n  useFocusTrap,\n  UseFocusTrapWithSchema,\n  useIsMobile,\n  useOnBlurOut,\n  UseOnBlurOutWithSchema,\n  useOnFirstFocusIn,\n  UseOnFirstFocusInWithSchema,\n  useOnSpecificFocus,\n  UseOnSpecificFocusWithSchema,\n  useHeadlessTooltip,\n} from './hooks/index.js';\nexport { getVisibleTimeByFormat, addLeadingZeros } from './timeUtils.js';\nexport { compose } from './compose.js';\nexport { DOCUMENT, WINDOW } from './platform.js';\nexport { isDOMTypeElement } from './reactTypesUtility.js';\nexport { isRequired, isGreaterThan, isValidDate } from './validations.js';\nexport { getHighlightedRerendersStyle } from './getHighlightedRerendersStyle.js';\n\nexport { crossTypeSort } from './algorithms/crossTypeSort.js';\nexport { appendComponentIfNotExist } from './addComponentIfNotExists.js';\n// TODO -- REMOVE WHEN READY\nexport * from './deprecated/index.js';\nexport * from './props-helpers/index.js';\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAoB,WAAXA,gBAAwC;AACjD,SAAoB,WAAXA,gBAA0D;AACnE,SAAS,kBAAkB;AAC3B,SAAS,wBAAwB,4BAA4B;AAC7D;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,QAAQ,WAAW,iBAAiB,cAAc;AAC3D;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,wBAAwB,uBAAuB;AACxD,SAAS,eAAe;AACxB,SAAS,UAAU,cAAc;AACjC,SAAS,wBAAwB;AACjC,SAAS,YAAY,eAAe,mBAAmB;AACvD,SAAS,oCAAoC;AAE7C,SAAS,qBAAqB;AAC9B,SAAS,iCAAiC;AAE1C,cAAc;AACd,cAAc;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { default as getComponentFromProps } from './getComponentFromProps.js';\nexport { default as onClickHandlerForNonInteractiveElements } from './onClickHandlerForNonInteractiveElements.js';\nexport { capitalize } from './capitalize.js';\nexport { getObjectValuesToArray, getObjectKeysToArray } from './objectUtilities.js';\nexport {\n  checkEmpty,\n  checkNotEmpty,\n  contains,\n  equal,\n  greaterThan,\n  greaterThanOrEquals,\n  isIn,\n  isNotIn,\n  isNotNull,\n  isNull,\n  lessThanOrEquals,\n  notEqual,\n  startsWith,\n  validDate,\n} from './operators.js';\nexport {\n  addOrRemove,\n  arrayMove,\n  cloneDeep,\n  curry,\n  cx,\n  debounce,\n  differenceBy,\n  differenceWith,\n  filter,\n  findIndex,\n  get,\n  groupBy,\n  hashArray,\n  isBoolean,\n  isEmpty,\n  isEqual,\n  isEqualWith,\n  isFunction,\n  isNaN,\n  isObject,\n  isString,\n  maxBy,\n  meanBy,\n  noop,\n  omit,\n  orderBy,\n  padStart,\n  parseInt,\n  pick,\n  pickBy,\n  property,\n  pull,\n  range,\n  removeUndefinedProperties,\n  runAll,\n  safeCall,\n  set,\n  sortBy,\n  sumBy,\n  throttle,\n  toggleInArray,\n  toggleInObject,\n  transform,\n  uniq,\n  uniqBy,\n  values,\n} from './utils.js';\nexport { setRef, mergeRefs, setMultipleRefs, logger } from './system.js';\nexport {\n  useCallbackAfterRender,\n  useCancellableDelayedCallback,\n  useDerivedStateFromProps,\n  useExecutionTimer,\n  useExpandState,\n  useFocusTrap,\n  UseFocusTrapWithSchema,\n  useForceUpdate,\n  useHeadlessTooltip,\n  useHotkeys,\n  useHoverHandlersDelay,\n  useIsMobile,\n  useIsShowingEllipsis,\n  useMakeMutable,\n  useMeasure,\n  useNativeIntersectionObserver,\n  useNativeResizeObserver,\n  useOnBlurOut,\n  UseOnBlurOutWithSchema,\n  useOnClickOutside,\n  useOnElementResize,\n  useOnFirstFocusIn,\n  UseOnFirstFocusInWithSchema,\n  useOnSpecificFocus,\n  UseOnSpecificFocusWithSchema,\n  usePrevious,\n  useResizeObserver,\n  useShouldRecalculate,\n  useTrackElement,\n  useWindowScrollerList,\n} from './hooks/index.js';\nexport { getVisibleTimeByFormat, addLeadingZeros } from './timeUtils.js';\nexport { compose } from './compose.js';\nexport { DOCUMENT, WINDOW } from './platform.js';\nexport { isDOMTypeElement } from './reactTypesUtility.js';\nexport { isRequired, isGreaterThan, isValidDate } from './validations.js';\nexport { getHighlightedRerendersStyle } from './getHighlightedRerendersStyle.js';\n\nexport { crossTypeSort } from './algorithms/crossTypeSort.js';\nexport { appendComponentIfNotExist } from './addComponentIfNotExists.js';\n// TODO -- REMOVE WHEN READY\nexport * from './deprecated/index.js';\nexport * from './props-helpers/index.js';\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAoB,WAAXA,gBAAwC;AACjD,SAAoB,WAAXA,gBAA0D;AACnE,SAAS,kBAAkB;AAC3B,SAAS,wBAAwB,4BAA4B;AAC7D;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,QAAQ,WAAW,iBAAiB,cAAc;AAC3D;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,wBAAwB,uBAAuB;AACxD,SAAS,eAAe;AACxB,SAAS,UAAU,cAAc;AACjC,SAAS,wBAAwB;AACjC,SAAS,YAAY,eAAe,mBAAmB;AACvD,SAAS,oCAAoC;AAE7C,SAAS,qBAAqB;AAC9B,SAAS,iCAAiC;AAE1C,cAAc;AACd,cAAc;",
   "names": ["default"]
 }

package/dist/esm/system.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/system.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type React from 'react';\nimport { isFunction } from './utils.js';\n\ntype AnyRef<T extends HTMLElement> =\n  | React.MutableRefObject<T | null>\n  | ((_ref: T | null) => void)\n  | React.Dispatch<React.SetStateAction<T | null>>\n  | false;\n\nexport const setRef = <T extends HTMLElement>(ref: AnyRef<T>, value: T) => {\n  if (isFunction(ref)) {\n    ref(value);\n  } else if (ref) {\n    ref.current = value;\n  }\n};\n\nexport const mergeRefs = <T extends HTMLElement>(...refs: AnyRef<T>[]) => {\n  const mergeRefsFunc = (node: T | null) => {\n    if (!node) return;\n    refs.forEach((ref) => setRef(ref, node));\n  };\n  return mergeRefsFunc;\n};\n\nexport function setMultipleRefs<T = unknown>(\n  refs: Array<React.RefObject<T> | React.LegacyRef<T>>,\n): React.RefCallback<T> {\n  return (value) => {\n    refs.forEach((ref) => {\n      if (typeof ref === 'function') {\n        ref(value);\n      } else if (ref != null) {\n        (ref as React.MutableRefObject<T | null>).current = value;\n      }\n    });\n  };\n}\n\nexport function logger(...args: unknown[]) {\n  // eslint-disable-next-line no-console\n  console.log(...args);\n}\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,kBAAkB;AAQpB,MAAM,SAAS,CAAwB,KAAgB,UAAa;AACzE,MAAI,WAAW,GAAG,GAAG;AACnB,QAAI,KAAK;AAAA,EACX,WAAW,KAAK;AACd,QAAI,UAAU;AAAA,EAChB;AACF;AAEO,MAAM,YAAY,IAA2B,SAAsB;AACxE,QAAM,gBAAgB,CAAC,SAAmB;AACxC,QAAI,CAAC;AAAM;AACX,SAAK,QAAQ,CAAC,QAAQ,OAAO,KAAK,IAAI,CAAC;AAAA,EACzC;AACA,SAAO;AACT;AAEO,SAAS,gBACd,MACsB;AACtB,SAAO,CAAC,UAAU;AAChB,SAAK,QAAQ,CAAC,QAAQ;AACpB,UAAI,OAAO,QAAQ,YAAY;AAC7B,YAAI,KAAK;AAAA,MACX,WAAW,OAAO,MAAM;AACtB,QAAC,IAAyC,UAAU;AAAA,MACtD;AAAA,IACF,CAAC;AAAA,EACH;AACF;AAEO,SAAS,UAAU,MAAiB;AAEzC,UAAQ,IAAI,GAAG,IAAI;AACrB;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type React from 'react';\nimport { isFunction } from './utils.js';\n\ntype AnyRef<T extends HTMLElement> =\n  | React.MutableRefObject<T | null>\n  | ((_ref: T | null) => void)\n  | React.Dispatch<React.SetStateAction<T | null>>\n  | false\n  | undefined\n  | null;\n\nexport const setRef = <T extends HTMLElement>(ref: AnyRef<T>, value: T) => {\n  if (isFunction(ref)) {\n    ref(value);\n  } else if (ref) {\n    ref.current = value;\n  }\n};\n\nexport const mergeRefs = <T extends HTMLElement>(...refs: AnyRef<T>[]) => {\n  const mergeRefsFunc = (node: T | null) => {\n    if (!node) return;\n    refs.forEach((ref) => setRef(ref, node));\n  };\n  return mergeRefsFunc;\n};\n\nexport function setMultipleRefs<T = unknown>(\n  refs: Array<React.RefObject<T> | React.LegacyRef<T>>,\n): React.RefCallback<T> {\n  return (value) => {\n    refs.forEach((ref) => {\n      if (typeof ref === 'function') {\n        ref(value);\n      } else if (ref != null) {\n        (ref as React.MutableRefObject<T | null>).current = value;\n      }\n    });\n  };\n}\n\nexport function logger(...args: unknown[]) {\n  // eslint-disable-next-line no-console\n  console.log(...args);\n}\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,kBAAkB;AAUpB,MAAM,SAAS,CAAwB,KAAgB,UAAa;AACzE,MAAI,WAAW,GAAG,GAAG;AACnB,QAAI,KAAK;AAAA,EACX,WAAW,KAAK;AACd,QAAI,UAAU;AAAA,EAChB;AACF;AAEO,MAAM,YAAY,IAA2B,SAAsB;AACxE,QAAM,gBAAgB,CAAC,SAAmB;AACxC,QAAI,CAAC;AAAM;AACX,SAAK,QAAQ,CAAC,QAAQ,OAAO,KAAK,IAAI,CAAC;AAAA,EACzC;AACA,SAAO;AACT;AAEO,SAAS,gBACd,MACsB;AACtB,SAAO,CAAC,UAAU;AAChB,SAAK,QAAQ,CAAC,QAAQ;AACpB,UAAI,OAAO,QAAQ,YAAY;AAC7B,YAAI,KAAK;AAAA,MACX,WAAW,OAAO,MAAM;AACtB,QAAC,IAAyC,UAAU;AAAA,MACtD;AAAA,IACF,CAAC;AAAA,EACH;AACF;AAEO,SAAS,UAAU,MAAiB;AAEzC,UAAQ,IAAI,GAAG,IAAI;AACrB;",
   "names": []
 }

package/dist/types/hooks/index.d.ts

@@ -13,6 +13,7 @@ export { useHoverHandlersDelay } from './useHoverHandlersDelay.js';
 export { useIsMobile } from './useIsMobile.js';
 export { useIsShowingEllipsis } from './useIsShowingEllipsis.js';
 export { useMakeMutable } from './useMakeMutable.js';
+export { useNativeIntersectionObserver } from './useNativeIntersectionObserver.js';
 export { useNativeResizeObserver } from './useNativeResizeObserver.js';
 export { useOnBlurOut, UseOnBlurOutWithSchema } from './useOnBlurOut.js';
 export { useOnElementResize } from './useOnElementResize.js';
@@ -21,4 +22,5 @@ export { useOnSpecificFocus, UseOnSpecificFocusWithSchema } from './useOnSpecifi
 export { usePrevious } from './usePrevious.js';
 export { useResizeObserver } from './useResizeObserver.js';
 export { useShouldRecalculate } from './useShouldRecalculate.js';
+export { useTrackElement } from './useTrackElement.js';
 export { useWindowScrollerList } from './useWindowScrollerList.js';

package/dist/types/hooks/useNativeIntersectionObserver.d.ts

@@ -0,0 +1,3 @@
+export declare const useNativeIntersectionObserver: <T extends HTMLElement>(el: T | null, callback: (entry: Omit<IntersectionObserverEntry, "target"> & {
+    target: T;
+}) => void) => void;

package/dist/types/hooks/useTrackElement.d.ts

@@ -0,0 +1,5 @@
+type Callback<T extends HTMLElement> = (entry: Omit<IntersectionObserverEntry, 'target'> & {
+    target: T;
+}) => void;
+export declare const useTrackElement: <T extends HTMLElement>(el: T | null, callback: Callback<T>) => void;
+export {};

package/dist/types/index.d.ts

@@ -2,10 +2,10 @@ export { default as getComponentFromProps } from './getComponentFromProps.js';
 export { default as onClickHandlerForNonInteractiveElements } from './onClickHandlerForNonInteractiveElements.js';
 export { capitalize } from './capitalize.js';
 export { getObjectValuesToArray, getObjectKeysToArray } from './objectUtilities.js';
-export { checkNotEmpty, checkEmpty, greaterThan, validDate, equal, notEqual, isNull, isNotNull, isIn, isNotIn, greaterThanOrEquals, lessThanOrEquals, startsWith, contains, } from './operators.js';
-export { cx, runAll, hashArray, safeCall, removeUndefinedProperties, isObject, curry, arrayMove, uniq, filter, uniqBy, groupBy, property, get, set, cloneDeep, debounce, findIndex, isEmpty, isString, isEqual, maxBy, meanBy, noop, omit, orderBy, pull, sortBy, sumBy, transform, isFunction, range, parseInt, padStart, isNaN, values, throttle, toggleInObject, toggleInArray, pick, pickBy, differenceBy, differenceWith, addOrRemove, isEqualWith, isBoolean, } from './utils.js';
+export { checkEmpty, checkNotEmpty, contains, equal, greaterThan, greaterThanOrEquals, isIn, isNotIn, isNotNull, isNull, lessThanOrEquals, notEqual, startsWith, validDate, } from './operators.js';
+export { addOrRemove, arrayMove, cloneDeep, curry, cx, debounce, differenceBy, differenceWith, filter, findIndex, get, groupBy, hashArray, isBoolean, isEmpty, isEqual, isEqualWith, isFunction, isNaN, isObject, isString, maxBy, meanBy, noop, omit, orderBy, padStart, parseInt, pick, pickBy, property, pull, range, removeUndefinedProperties, runAll, safeCall, set, sortBy, sumBy, throttle, toggleInArray, toggleInObject, transform, uniq, uniqBy, values, } from './utils.js';
 export { setRef, mergeRefs, setMultipleRefs, logger } from './system.js';
-export { useMeasure, useForceUpdate, useOnClickOutside, useExecutionTimer, useExpandState, useHotkeys, useHoverHandlersDelay, useResizeObserver, useShouldRecalculate, useWindowScrollerList, usePrevious, useCancellableDelayedCallback, useDerivedStateFromProps, useOnElementResize, useIsShowingEllipsis, useNativeResizeObserver, useMakeMutable, useCallbackAfterRender, useFocusTrap, UseFocusTrapWithSchema, useIsMobile, useOnBlurOut, UseOnBlurOutWithSchema, useOnFirstFocusIn, UseOnFirstFocusInWithSchema, useOnSpecificFocus, UseOnSpecificFocusWithSchema, useHeadlessTooltip, } from './hooks/index.js';
+export { useCallbackAfterRender, useCancellableDelayedCallback, useDerivedStateFromProps, useExecutionTimer, useExpandState, useFocusTrap, UseFocusTrapWithSchema, useForceUpdate, useHeadlessTooltip, useHotkeys, useHoverHandlersDelay, useIsMobile, useIsShowingEllipsis, useMakeMutable, useMeasure, useNativeIntersectionObserver, useNativeResizeObserver, useOnBlurOut, UseOnBlurOutWithSchema, useOnClickOutside, useOnElementResize, useOnFirstFocusIn, UseOnFirstFocusInWithSchema, useOnSpecificFocus, UseOnSpecificFocusWithSchema, usePrevious, useResizeObserver, useShouldRecalculate, useTrackElement, useWindowScrollerList, } from './hooks/index.js';
 export { getVisibleTimeByFormat, addLeadingZeros } from './timeUtils.js';
 export { compose } from './compose.js';
 export { DOCUMENT, WINDOW } from './platform.js';

package/dist/types/system.d.ts

@@ -1,5 +1,5 @@
 import type React from 'react';
-type AnyRef<T extends HTMLElement> = React.MutableRefObject<T | null> | ((_ref: T | null) => void) | React.Dispatch<React.SetStateAction<T | null>> | false;
+type AnyRef<T extends HTMLElement> = React.MutableRefObject<T | null> | ((_ref: T | null) => void) | React.Dispatch<React.SetStateAction<T | null>> | false | undefined | null;
 export declare const setRef: <T extends HTMLElement>(ref: AnyRef<T>, value: T) => void;
 export declare const mergeRefs: <T extends HTMLElement>(...refs: AnyRef<T>[]) => (node: T | null) => void;
 export declare function setMultipleRefs<T = unknown>(refs: Array<React.RefObject<T> | React.LegacyRef<T>>): React.RefCallback<T>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-utilities",
-  "version": "3.19.0",
+  "version": "3.19.1-rc.1",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Utilities",
   "files": [
@@ -159,7 +159,7 @@
     "use-force-update": "~1.0.11",
     "use-measure": "~0.3.0",
     "use-onclickoutside": "~0.4.1",
-    "@elliemae/ds-props-helpers": "3.19.0"
+    "@elliemae/ds-props-helpers": "3.19.1-rc.1"
   },
   "devDependencies": {
     "@testing-library/react": "~12.1.3",