@12-apps/ui 5.0.0 → 5.0.1

package/dist/utility/Overflow.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/utility/Portal.js

@@ -0,0 +1,37 @@
+import "../chunk-PZ5AY32C.js";
+
+// src/components/utility/Portal/Portal.tsx
+import { useEffect, useRef } from "react";
+import { createPortal } from "react-dom";
+import { Fragment, jsx } from "react/jsx-runtime";
+var Portal = ({
+  children,
+  container,
+  disablePortal = false
+}) => {
+  const defaultContainer = useRef(null);
+  useEffect(() => {
+    if (!container && !disablePortal) {
+      if (!defaultContainer.current) {
+        defaultContainer.current = document.createElement("div");
+        defaultContainer.current.setAttribute("data-portal-container", "true");
+        document.body.appendChild(defaultContainer.current);
+      }
+    }
+    return () => {
+      if (defaultContainer.current && document.body.contains(defaultContainer.current)) {
+        document.body.removeChild(defaultContainer.current);
+        defaultContainer.current = null;
+      }
+    };
+  }, [container, disablePortal]);
+  if (disablePortal) {
+    return /* @__PURE__ */ jsx(Fragment, { children });
+  }
+  const targetContainer = container || defaultContainer.current || document.body;
+  return createPortal(children, targetContainer);
+};
+export {
+  Portal
+};
+//# sourceMappingURL=Portal.js.map

package/dist/utility/Portal.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/utility/Portal/Portal.tsx"],"sourcesContent":["import React, { useEffect, useRef } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport type { PortalProps } from './Portal.types';\n\nexport const Portal: React.FC<PortalProps> = ({\n  children,\n  container,\n  disablePortal = false,\n}) => {\n  const defaultContainer = useRef<HTMLDivElement | null>(null);\n\n  useEffect(() => {\n    if (!container && !disablePortal) {\n      // Create a default container if none is provided\n      if (!defaultContainer.current) {\n        defaultContainer.current = document.createElement('div');\n        defaultContainer.current.setAttribute('data-portal-container', 'true');\n        document.body.appendChild(defaultContainer.current);\n      }\n    }\n\n    return () => {\n      // Cleanup: remove the default container when component unmounts\n      if (defaultContainer.current && document.body.contains(defaultContainer.current)) {\n        document.body.removeChild(defaultContainer.current);\n        defaultContainer.current = null;\n      }\n    };\n  }, [container, disablePortal]);\n\n  if (disablePortal) {\n    return <>{children}</>;\n  }\n\n  const targetContainer = container || defaultContainer.current || document.body;\n\n  return createPortal(children, targetContainer);\n};"],"mappings":";;;AAAA,SAAgB,WAAW,cAAc;AACzC,SAAS,oBAAoB;AA+BlB;AA3BJ,IAAM,SAAgC,CAAC;AAAA,EAC5C;AAAA,EACA;AAAA,EACA,gBAAgB;AAClB,MAAM;AACJ,QAAM,mBAAmB,OAA8B,IAAI;AAE3D,YAAU,MAAM;AACd,QAAI,CAAC,aAAa,CAAC,eAAe;AAEhC,UAAI,CAAC,iBAAiB,SAAS;AAC7B,yBAAiB,UAAU,SAAS,cAAc,KAAK;AACvD,yBAAiB,QAAQ,aAAa,yBAAyB,MAAM;AACrE,iBAAS,KAAK,YAAY,iBAAiB,OAAO;AAAA,MACpD;AAAA,IACF;AAEA,WAAO,MAAM;AAEX,UAAI,iBAAiB,WAAW,SAAS,KAAK,SAAS,iBAAiB,OAAO,GAAG;AAChF,iBAAS,KAAK,YAAY,iBAAiB,OAAO;AAClD,yBAAiB,UAAU;AAAA,MAC7B;AAAA,IACF;AAAA,EACF,GAAG,CAAC,WAAW,aAAa,CAAC;AAE7B,MAAI,eAAe;AACjB,WAAO,gCAAG,UAAS;AAAA,EACrB;AAEA,QAAM,kBAAkB,aAAa,iBAAiB,WAAW,SAAS;AAE1E,SAAO,aAAa,UAAU,eAAe;AAC/C;","names":[]}

package/dist/utility/Transition.js

@@ -0,0 +1,76 @@
+import "../chunk-PZ5AY32C.js";
+
+// src/components/utility/Transition/Transition.tsx
+import {
+  Collapse,
+  Fade,
+  Grow,
+  Slide,
+  useTheme,
+  Zoom
+} from "@mui/material";
+
+// src/components/utility/Transition/Transition.helpers.ts
+var transitionDuration = (theme, variant, duration) => {
+  if (typeof duration === "number" || typeof duration === "object") return duration;
+  switch (variant) {
+    case "slide":
+      return theme.transitions.duration.enteringScreen;
+    case "fade":
+    case "scale":
+    case "grow":
+    case "zoom":
+      return theme.transitions.duration.shorter;
+    default:
+      return theme.transitions.duration.standard;
+  }
+};
+var transitionEasing = (theme, variant, easing) => {
+  if (typeof easing === "string" || typeof easing === "object") return easing;
+  return variant === "slide" ? theme.transitions.easing.easeOut : theme.transitions.easing.easeInOut;
+};
+
+// src/components/utility/Transition/Transition.tsx
+import { jsx } from "react/jsx-runtime";
+var Transition = ({
+  children,
+  variant = "fade",
+  direction = "up",
+  duration,
+  delay = 0,
+  easing,
+  in: inProp,
+  ...props
+}) => {
+  const theme = useTheme();
+  const transitionProps = {
+    in: inProp,
+    timeout: transitionDuration(theme, variant, duration),
+    easing: transitionEasing(theme, variant, easing),
+    unmountOnExit: true,
+    style: {
+      transitionDelay: `${delay}ms`
+    },
+    ...props
+  };
+  const content = /* @__PURE__ */ jsx("div", { "data-testid": "transition-element", children: /* @__PURE__ */ jsx("div", { "data-testid": "transition-content", children }) });
+  switch (variant) {
+    case "fade":
+      return /* @__PURE__ */ jsx(Fade, { ...transitionProps, "data-testid": "transition-wrapper", children: content });
+    case "slide":
+      return /* @__PURE__ */ jsx(Slide, { direction, ...transitionProps, "data-testid": "transition-wrapper", children: content });
+    case "scale":
+    case "grow":
+      return /* @__PURE__ */ jsx(Grow, { ...transitionProps, "data-testid": "transition-wrapper", children: content });
+    case "collapse":
+      return /* @__PURE__ */ jsx(Collapse, { ...transitionProps, "data-testid": "transition-wrapper", children: content });
+    case "zoom":
+      return /* @__PURE__ */ jsx(Zoom, { ...transitionProps, "data-testid": "transition-wrapper", children: content });
+    default:
+      return /* @__PURE__ */ jsx(Fade, { ...transitionProps, "data-testid": "transition-wrapper", children: content });
+  }
+};
+export {
+  Transition
+};
+//# sourceMappingURL=Transition.js.map

package/dist/utility/Transition.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/utility/Transition/Transition.tsx","../../src/components/utility/Transition/Transition.helpers.ts"],"sourcesContent":["import {\n  Collapse,\n  Fade,\n  Grow,\n  Slide,\n  useTheme,\n  Zoom,\n} from '@mui/material';\nimport React from 'react';\n\nimport { transitionDuration, transitionEasing } from './Transition.helpers';\nimport type { CustomTransitionProps } from './Transition.types';\n\nexport const Transition: React.FC<CustomTransitionProps> = ({\n  children,\n  variant = 'fade',\n  direction = 'up',\n  duration,\n  delay = 0,\n  easing,\n  in: inProp,\n  ...props\n}) => {\n  const theme = useTheme();\n\n  const transitionProps = {\n    in: inProp,\n    timeout: transitionDuration(theme, variant, duration),\n    easing: transitionEasing(theme, variant, easing),\n    unmountOnExit: true,\n    style: {\n      transitionDelay: `${delay}ms`,\n    },\n    ...props,\n  };\n\n  // Every variant wraps the same three-deep structure; only the MUI transition\n  // component differs.\n  const content = (\n    <div data-testid=\"transition-element\">\n      <div data-testid=\"transition-content\">{children}</div>\n    </div>\n  );\n\n  switch (variant) {\n    case 'fade':\n      return (\n        <Fade {...transitionProps} data-testid=\"transition-wrapper\">\n          {content}\n        </Fade>\n      );\n\n    case 'slide':\n      return (\n        <Slide direction={direction} {...transitionProps} data-testid=\"transition-wrapper\">\n          {content}\n        </Slide>\n      );\n\n    case 'scale':\n    case 'grow':\n      return (\n        <Grow {...transitionProps} data-testid=\"transition-wrapper\">\n          {content}\n        </Grow>\n      );\n\n    case 'collapse':\n      return (\n        <Collapse {...transitionProps} data-testid=\"transition-wrapper\">\n          {content}\n        </Collapse>\n      );\n\n    case 'zoom':\n      return (\n        <Zoom {...transitionProps} data-testid=\"transition-wrapper\">\n          {content}\n        </Zoom>\n      );\n\n    default:\n      return (\n        <Fade {...transitionProps} data-testid=\"transition-wrapper\">\n          {content}\n        </Fade>\n      );\n  }\n};","import type { Theme } from '@mui/material';\n\nimport type { CustomTransitionProps, TransitionVariant } from './Transition.types';\n\ntype Duration = NonNullable<CustomTransitionProps['duration']>;\ntype Easing = NonNullable<CustomTransitionProps['easing']>;\n\n/** An explicit `duration` wins in either form; otherwise the variant picks one. */\nexport const transitionDuration = (\n  theme: Theme,\n  variant: TransitionVariant,\n  duration?: Duration,\n): Duration => {\n  if (typeof duration === 'number' || typeof duration === 'object') return duration;\n\n  switch (variant) {\n    case 'slide':\n      return theme.transitions.duration.enteringScreen;\n    case 'fade':\n    case 'scale':\n    case 'grow':\n    case 'zoom':\n      return theme.transitions.duration.shorter;\n    default:\n      return theme.transitions.duration.standard;\n  }\n};\n\n/** As above: an explicit `easing` wins, otherwise the variant picks one. */\nexport const transitionEasing = (\n  theme: Theme,\n  variant: TransitionVariant,\n  easing?: Easing,\n): Easing => {\n  if (typeof easing === 'string' || typeof easing === 'object') return easing;\n\n  return variant === 'slide'\n    ? theme.transitions.easing.easeOut\n    : theme.transitions.easing.easeInOut;\n};\n"],"mappings":";;;AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;;;ACCA,IAAM,qBAAqB,CAChC,OACA,SACA,aACa;AACb,MAAI,OAAO,aAAa,YAAY,OAAO,aAAa,SAAU,QAAO;AAEzE,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,aAAO,MAAM,YAAY,SAAS;AAAA,IACpC,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AACH,aAAO,MAAM,YAAY,SAAS;AAAA,IACpC;AACE,aAAO,MAAM,YAAY,SAAS;AAAA,EACtC;AACF;AAGO,IAAM,mBAAmB,CAC9B,OACA,SACA,WACW;AACX,MAAI,OAAO,WAAW,YAAY,OAAO,WAAW,SAAU,QAAO;AAErE,SAAO,YAAY,UACf,MAAM,YAAY,OAAO,UACzB,MAAM,YAAY,OAAO;AAC/B;;;ADCM;AA3BC,IAAM,aAA8C,CAAC;AAAA,EAC1D;AAAA,EACA,UAAU;AAAA,EACV,YAAY;AAAA,EACZ;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA,IAAI;AAAA,EACJ,GAAG;AACL,MAAM;AACJ,QAAM,QAAQ,SAAS;AAEvB,QAAM,kBAAkB;AAAA,IACtB,IAAI;AAAA,IACJ,SAAS,mBAAmB,OAAO,SAAS,QAAQ;AAAA,IACpD,QAAQ,iBAAiB,OAAO,SAAS,MAAM;AAAA,IAC/C,eAAe;AAAA,IACf,OAAO;AAAA,MACL,iBAAiB,GAAG,KAAK;AAAA,IAC3B;AAAA,IACA,GAAG;AAAA,EACL;AAIA,QAAM,UACJ,oBAAC,SAAI,eAAY,sBACf,8BAAC,SAAI,eAAY,sBAAsB,UAAS,GAClD;AAGF,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,aACE,oBAAC,QAAM,GAAG,iBAAiB,eAAY,sBACpC,mBACH;AAAA,IAGJ,KAAK;AACH,aACE,oBAAC,SAAM,WAAuB,GAAG,iBAAiB,eAAY,sBAC3D,mBACH;AAAA,IAGJ,KAAK;AAAA,IACL,KAAK;AACH,aACE,oBAAC,QAAM,GAAG,iBAAiB,eAAY,sBACpC,mBACH;AAAA,IAGJ,KAAK;AACH,aACE,oBAAC,YAAU,GAAG,iBAAiB,eAAY,sBACxC,mBACH;AAAA,IAGJ,KAAK;AACH,aACE,oBAAC,QAAM,GAAG,iBAAiB,eAAY,sBACpC,mBACH;AAAA,IAGJ;AACE,aACE,oBAAC,QAAM,GAAG,iBAAiB,eAAY,sBACpC,mBACH;AAAA,EAEN;AACF;","names":[]}

package/dist/utility/VirtualList.js

@@ -0,0 +1,333 @@
+import "../chunk-PZ5AY32C.js";
+
+// src/components/utility/VirtualList/VirtualList.tsx
+import { Box } from "@mui/material";
+import { useRef as useRef2 } from "react";
+
+// src/components/utility/VirtualList/VirtualList.hooks.ts
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+var scrollOffsets = (event) => {
+  const target = event.currentTarget || event.target;
+  const element = target;
+  return { top: element.scrollTop, left: element.scrollLeft };
+};
+var useExternalScrollListener = (scrollContainerRef, handleScroll) => {
+  useEffect(() => {
+    if (!scrollContainerRef?.current) return;
+    const element = scrollContainerRef.current;
+    const scrollHandler = (e) => handleScroll(e);
+    element.addEventListener("scroll", scrollHandler);
+    return () => element.removeEventListener("scroll", scrollHandler);
+  }, [scrollContainerRef, handleScroll]);
+};
+var useScrollTop = (scrollContainerRef, report) => {
+  const [scrollTop, setScrollTop] = useState(0);
+  const handleScroll = useCallback(
+    (event) => {
+      const { top, left } = scrollOffsets(event);
+      setScrollTop(top);
+      report(top, left);
+    },
+    [report]
+  );
+  useExternalScrollListener(scrollContainerRef, handleScroll);
+  return { scrollTop, handleScroll };
+};
+var useItemHeight = ({
+  items,
+  variant,
+  itemHeight,
+  estimatedItemHeight
+}) => {
+  const measured = useRef(/* @__PURE__ */ new Map());
+  return useCallback(
+    (index) => {
+      if (variant !== "variable") {
+        return itemHeight;
+      }
+      return items[index]?.height || measured.current.get(index) || estimatedItemHeight;
+    },
+    [variant, itemHeight, estimatedItemHeight, items]
+  );
+};
+var useTotalHeight = (items, variant, itemHeight, getItemHeight) => useMemo(() => {
+  if (variant === "fixed") {
+    return items.length * itemHeight;
+  }
+  let sum = 0;
+  for (let i = 0; i < items.length; i++) {
+    sum += getItemHeight(i);
+  }
+  return sum;
+}, [items.length, variant, itemHeight, getItemHeight]);
+var variableRange = ({ count, scrollTop, height, overscan, getItemHeight }) => {
+  let accumulated = 0;
+  let startIndex = 0;
+  let endIndex = count - 1;
+  for (let i = 0; i < count; i++) {
+    if (accumulated + getItemHeight(i) > scrollTop) {
+      startIndex = Math.max(0, i - overscan);
+      break;
+    }
+    accumulated += getItemHeight(i);
+  }
+  accumulated = 0;
+  for (let i = 0; i <= startIndex; i++) {
+    accumulated += getItemHeight(i);
+  }
+  for (let i = startIndex; i < count; i++) {
+    if (accumulated > scrollTop + height) {
+      endIndex = Math.min(count - 1, i + overscan);
+      break;
+    }
+    accumulated += getItemHeight(i);
+  }
+  return { startIndex, endIndex };
+};
+var fixedRange = ({ count, scrollTop, height, overscan, itemHeight }) => ({
+  startIndex: Math.max(0, Math.floor(scrollTop / itemHeight) - overscan),
+  endIndex: Math.min(count - 1, Math.ceil((scrollTop + height) / itemHeight) + overscan)
+});
+var useItemOffset = (variant, itemHeight, getItemHeight) => useCallback(
+  (index) => {
+    if (variant === "fixed") {
+      return index * itemHeight;
+    }
+    let offset = 0;
+    for (let i = 0; i < index; i++) {
+      offset += getItemHeight(i);
+    }
+    return offset;
+  },
+  [variant, itemHeight, getItemHeight]
+);
+var useVirtualList = ({
+  items,
+  variant,
+  height,
+  itemHeight,
+  estimatedItemHeight,
+  overscan,
+  onScroll,
+  scrollContainerRef
+}) => {
+  const getItemHeight = useItemHeight({ items, variant, itemHeight, estimatedItemHeight });
+  const getItemOffset = useItemOffset(variant, itemHeight, getItemHeight);
+  const totalHeight = useTotalHeight(items, variant, itemHeight, getItemHeight);
+  const report = useCallback((top) => onScroll?.(top), [onScroll]);
+  const { scrollTop, handleScroll } = useScrollTop(scrollContainerRef, report);
+  const visibleItems = useMemo(() => {
+    const args = { count: items.length, scrollTop, height, overscan, itemHeight, getItemHeight };
+    const { startIndex, endIndex } = variant === "fixed" ? fixedRange(args) : variableRange(args);
+    const result = [];
+    for (let i = startIndex; i <= endIndex; i++) {
+      const item = items[i];
+      if (!item) continue;
+      result.push({
+        item,
+        index: i,
+        style: {
+          position: "absolute",
+          top: getItemOffset(i),
+          left: 0,
+          width: "100%",
+          height: getItemHeight(i)
+        }
+      });
+    }
+    return result;
+  }, [items, scrollTop, height, overscan, variant, itemHeight, getItemOffset, getItemHeight]);
+  return { totalHeight, visibleItems, handleScroll };
+};
+var useColumnWidth = (columnWidth, width, columnCount, gap) => useMemo(() => {
+  if (columnWidth) return columnWidth;
+  const containerWidth = typeof width === "number" ? width : 300;
+  return (containerWidth - (columnCount - 1) * gap) / columnCount;
+}, [columnWidth, width, columnCount, gap]);
+var useVirtualGrid = ({
+  items,
+  height,
+  width,
+  columnCount,
+  rowHeight,
+  columnWidth,
+  gap,
+  overscan,
+  onScroll,
+  scrollContainerRef
+}) => {
+  const rowCount = Math.ceil(items.length / columnCount);
+  const totalHeight = rowCount * (rowHeight + gap) - gap;
+  const computedColumnWidth = useColumnWidth(columnWidth, width, columnCount, gap);
+  const report = useCallback(
+    (top, left) => onScroll?.(top, left),
+    [onScroll]
+  );
+  const { scrollTop, handleScroll } = useScrollTop(scrollContainerRef, report);
+  const visibleItems = useMemo(() => {
+    const pitch = rowHeight + gap;
+    const startRow = Math.max(0, Math.floor(scrollTop / pitch) - overscan);
+    const endRow = Math.min(rowCount - 1, Math.ceil((scrollTop + height) / pitch) + overscan);
+    const firstIndex = startRow * columnCount;
+    const lastIndex = Math.min((endRow + 1) * columnCount - 1, items.length - 1);
+    const result = [];
+    for (let index = firstIndex; index <= lastIndex; index++) {
+      const item = items[index];
+      if (!item) continue;
+      const rowIndex = Math.floor(index / columnCount);
+      const columnIndex = index % columnCount;
+      result.push({
+        item,
+        index,
+        columnIndex,
+        rowIndex,
+        style: {
+          position: "absolute",
+          top: rowIndex * pitch,
+          left: columnIndex * (computedColumnWidth + gap),
+          width: computedColumnWidth,
+          height: rowHeight
+        }
+      });
+    }
+    return result;
+  }, [items, scrollTop, height, overscan, rowCount, columnCount, rowHeight, gap, computedColumnWidth]);
+  return { totalHeight, visibleItems, handleScroll };
+};
+
+// src/components/utility/VirtualList/VirtualList.tsx
+import { jsx } from "react/jsx-runtime";
+var VirtualContainer = ({
+  children,
+  role,
+  totalHeight,
+  height,
+  width,
+  disableInternalScroll,
+  onScroll,
+  className,
+  style,
+  dataTestId,
+  ariaLabel
+}) => {
+  const internalContainerRef = useRef2(null);
+  const identity = {
+    className,
+    "data-testid": dataTestId,
+    role,
+    "aria-label": ariaLabel
+  };
+  if (disableInternalScroll) {
+    return /* @__PURE__ */ jsx(Box, { ...identity, sx: { height: totalHeight, width, position: "relative", ...style }, children });
+  }
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      ref: internalContainerRef,
+      ...identity,
+      sx: { height, width, overflow: "auto", position: "relative", ...style },
+      onScroll,
+      children: /* @__PURE__ */ jsx(Box, { sx: { height: totalHeight, position: "relative" }, children })
+    }
+  );
+};
+var VirtualList = ({
+  items,
+  variant = "fixed",
+  height,
+  width = "100%",
+  itemHeight = 40,
+  estimatedItemHeight = 40,
+  overscan = 5,
+  renderItem,
+  onScroll,
+  className,
+  style,
+  "data-testid": dataTestId,
+  "aria-label": ariaLabel,
+  scrollContainerRef,
+  disableInternalScroll = false
+}) => {
+  const { totalHeight, visibleItems, handleScroll } = useVirtualList({
+    items,
+    variant,
+    height,
+    itemHeight,
+    estimatedItemHeight,
+    overscan,
+    onScroll,
+    scrollContainerRef
+  });
+  return /* @__PURE__ */ jsx(
+    VirtualContainer,
+    {
+      role: "list",
+      totalHeight,
+      height,
+      width,
+      disableInternalScroll,
+      onScroll: handleScroll,
+      className,
+      style,
+      dataTestId,
+      ariaLabel,
+      children: visibleItems.map(
+        ({ item, index, style: itemStyle }) => renderItem({ item, index, style: itemStyle })
+      )
+    }
+  );
+};
+var VirtualGrid = ({
+  items,
+  height,
+  width = "100%",
+  columnCount,
+  rowHeight,
+  columnWidth,
+  gap = 0,
+  overscan = 5,
+  renderItem,
+  onScroll,
+  className,
+  style,
+  "data-testid": dataTestId,
+  "aria-label": ariaLabel,
+  scrollContainerRef,
+  disableInternalScroll = false
+}) => {
+  const { totalHeight, visibleItems, handleScroll } = useVirtualGrid({
+    items,
+    height,
+    width,
+    columnCount,
+    rowHeight,
+    columnWidth,
+    gap,
+    overscan,
+    onScroll,
+    scrollContainerRef
+  });
+  return /* @__PURE__ */ jsx(
+    VirtualContainer,
+    {
+      role: "grid",
+      totalHeight,
+      height,
+      width,
+      disableInternalScroll,
+      onScroll: handleScroll,
+      className,
+      style,
+      dataTestId,
+      ariaLabel,
+      children: visibleItems.map(
+        ({ item, index, columnIndex, rowIndex, style: itemStyle }) => renderItem({ item, index, columnIndex, rowIndex, style: itemStyle })
+      )
+    }
+  );
+};
+export {
+  VirtualGrid,
+  VirtualList
+};
+//# sourceMappingURL=VirtualList.js.map

package/dist/utility/VirtualList.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/utility/VirtualList/VirtualList.tsx","../../src/components/utility/VirtualList/VirtualList.hooks.ts"],"sourcesContent":["import { Box } from '@mui/material';\nimport React, { useRef } from 'react';\n\nimport { useVirtualGrid, useVirtualList } from './VirtualList.hooks';\nimport type { VirtualGridProps, VirtualListProps } from './VirtualList.types';\n\ninterface ContainerProps {\n  children: React.ReactNode;\n  role: 'list' | 'grid';\n  totalHeight: number;\n  height: number;\n  width: number | string;\n  disableInternalScroll: boolean;\n  onScroll: (event: React.UIEvent<HTMLDivElement>) => void;\n  className?: string;\n  style?: React.CSSProperties;\n  dataTestId?: string;\n  ariaLabel?: string;\n}\n\n/**\n * Two shapes, shared by the list and the grid: when the caller owns the scroll\n * container we render only the full-height content, so their element does the\n * scrolling; otherwise we render our own viewport around it.\n */\nconst VirtualContainer: React.FC<ContainerProps> = ({\n  children,\n  role,\n  totalHeight,\n  height,\n  width,\n  disableInternalScroll,\n  onScroll,\n  className,\n  style,\n  dataTestId,\n  ariaLabel,\n}) => {\n  const internalContainerRef = useRef<HTMLDivElement>(null);\n  const identity = {\n    className,\n    'data-testid': dataTestId,\n    role,\n    'aria-label': ariaLabel,\n  };\n\n  if (disableInternalScroll) {\n    return (\n      <Box {...identity} sx={{ height: totalHeight, width, position: 'relative', ...style }}>\n        {children}\n      </Box>\n    );\n  }\n\n  return (\n    <Box\n      ref={internalContainerRef}\n      {...identity}\n      sx={{ height, width, overflow: 'auto', position: 'relative', ...style }}\n      onScroll={onScroll}\n    >\n      <Box sx={{ height: totalHeight, position: 'relative' }}>{children}</Box>\n    </Box>\n  );\n};\n\nexport const VirtualList: React.FC<VirtualListProps> = ({\n  items,\n  variant = 'fixed',\n  height,\n  width = '100%',\n  itemHeight = 40,\n  estimatedItemHeight = 40,\n  overscan = 5,\n  renderItem,\n  onScroll,\n  className,\n  style,\n  'data-testid': dataTestId,\n  'aria-label': ariaLabel,\n  scrollContainerRef,\n  disableInternalScroll = false,\n}) => {\n  const { totalHeight, visibleItems, handleScroll } = useVirtualList({\n    items,\n    variant,\n    height,\n    itemHeight,\n    estimatedItemHeight,\n    overscan,\n    onScroll,\n    scrollContainerRef,\n  });\n\n  return (\n    <VirtualContainer\n      role=\"list\"\n      totalHeight={totalHeight}\n      height={height}\n      width={width}\n      disableInternalScroll={disableInternalScroll}\n      onScroll={handleScroll}\n      className={className}\n      style={style}\n      dataTestId={dataTestId}\n      ariaLabel={ariaLabel}\n    >\n      {visibleItems.map(({ item, index, style: itemStyle }) =>\n        renderItem({ item, index, style: itemStyle }),\n      )}\n    </VirtualContainer>\n  );\n};\n\nexport const VirtualGrid: React.FC<VirtualGridProps> = ({\n  items,\n  height,\n  width = '100%',\n  columnCount,\n  rowHeight,\n  columnWidth,\n  gap = 0,\n  overscan = 5,\n  renderItem,\n  onScroll,\n  className,\n  style,\n  'data-testid': dataTestId,\n  'aria-label': ariaLabel,\n  scrollContainerRef,\n  disableInternalScroll = false,\n}) => {\n  const { totalHeight, visibleItems, handleScroll } = useVirtualGrid({\n    items,\n    height,\n    width,\n    columnCount,\n    rowHeight,\n    columnWidth,\n    gap,\n    overscan,\n    onScroll,\n    scrollContainerRef,\n  });\n\n  return (\n    <VirtualContainer\n      role=\"grid\"\n      totalHeight={totalHeight}\n      height={height}\n      width={width}\n      disableInternalScroll={disableInternalScroll}\n      onScroll={handleScroll}\n      className={className}\n      style={style}\n      dataTestId={dataTestId}\n      ariaLabel={ariaLabel}\n    >\n      {visibleItems.map(({ item, index, columnIndex, rowIndex, style: itemStyle }) =>\n        renderItem({ item, index, columnIndex, rowIndex, style: itemStyle }),\n      )}\n    </VirtualContainer>\n  );\n};\n","import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\nimport type { VirtualGridProps, VirtualListProps } from './VirtualList.types';\n\ntype ScrollEvent = React.UIEvent<HTMLDivElement> | Event;\ntype ListItems = VirtualListProps['items'];\ntype ListVariant = NonNullable<VirtualListProps['variant']>;\ntype ItemHeight = (index: number) => number;\n\n// Handles both React synthetic events and native DOM events, since the same\n// handler serves an internal onScroll and an external container's listener.\nconst scrollOffsets = (event: ScrollEvent) => {\n  const target = (event as React.UIEvent<HTMLDivElement>).currentTarget || (event as Event).target;\n  const element = target as HTMLElement;\n  return { top: element.scrollTop, left: element.scrollLeft };\n};\n\n/**\n * When the caller owns the scroll container, the component cannot attach\n * `onScroll` through JSX and has to subscribe to that element directly.\n */\nconst useExternalScrollListener = (\n  scrollContainerRef: VirtualListProps['scrollContainerRef'],\n  handleScroll: (event: Event) => void,\n) => {\n  useEffect(() => {\n    if (!scrollContainerRef?.current) return;\n\n    const element = scrollContainerRef.current;\n    const scrollHandler = (e: Event) => handleScroll(e);\n\n    element.addEventListener('scroll', scrollHandler);\n    return () => element.removeEventListener('scroll', scrollHandler);\n  }, [scrollContainerRef, handleScroll]);\n};\n\n/**\n * Tracks the scroll offset whether it arrives through our own `onScroll` or\n * through a container the caller owns, and hands both offsets to `report` so a\n * grid can pass on the horizontal one too.\n */\nconst useScrollTop = (\n  scrollContainerRef: VirtualListProps['scrollContainerRef'],\n  report: (top: number, left: number) => void,\n) => {\n  const [scrollTop, setScrollTop] = useState(0);\n\n  const handleScroll = useCallback(\n    (event: ScrollEvent) => {\n      const { top, left } = scrollOffsets(event);\n      setScrollTop(top);\n      report(top, left);\n    },\n    [report],\n  );\n\n  useExternalScrollListener(scrollContainerRef, handleScroll);\n\n  return { scrollTop, handleScroll };\n};\n\ninterface HeightArgs {\n  items: ListItems;\n  variant: ListVariant;\n  itemHeight: number;\n  estimatedItemHeight: number;\n}\n\n/**\n * Fixed lists know every height up front. Variable ones prefer the item's own\n * declared height, fall back to a measurement taken on a previous render, and\n * only then guess.\n */\nconst useItemHeight = ({\n  items,\n  variant,\n  itemHeight,\n  estimatedItemHeight,\n}: HeightArgs): ItemHeight => {\n  const measured = useRef<Map<number, number>>(new Map());\n\n  return useCallback(\n    (index: number): number => {\n      if (variant !== 'variable') {\n        return itemHeight;\n      }\n\n      return items[index]?.height || measured.current.get(index) || estimatedItemHeight;\n    },\n    [variant, itemHeight, estimatedItemHeight, items],\n  );\n};\n\nconst useTotalHeight = (\n  items: ListItems,\n  variant: ListVariant,\n  itemHeight: number,\n  getItemHeight: ItemHeight,\n) =>\n  useMemo(() => {\n    if (variant === 'fixed') {\n      return items.length * itemHeight;\n    }\n\n    let sum = 0;\n    for (let i = 0; i < items.length; i++) {\n      sum += getItemHeight(i);\n    }\n    return sum;\n  }, [items.length, variant, itemHeight, getItemHeight]);\n\ninterface RangeArgs {\n  count: number;\n  scrollTop: number;\n  height: number;\n  overscan: number;\n  itemHeight: number;\n  getItemHeight: ItemHeight;\n}\n\n// Walks forward accumulating heights until it passes the viewport's top edge, then\n// its bottom edge. Linear in the number of items, which is why fixed lists take\n// the arithmetic shortcut instead.\nconst variableRange = ({ count, scrollTop, height, overscan, getItemHeight }: RangeArgs) => {\n  let accumulated = 0;\n  let startIndex = 0;\n  let endIndex = count - 1;\n\n  for (let i = 0; i < count; i++) {\n    if (accumulated + getItemHeight(i) > scrollTop) {\n      startIndex = Math.max(0, i - overscan);\n      break;\n    }\n    accumulated += getItemHeight(i);\n  }\n\n  accumulated = 0;\n  for (let i = 0; i <= startIndex; i++) {\n    accumulated += getItemHeight(i);\n  }\n\n  for (let i = startIndex; i < count; i++) {\n    if (accumulated > scrollTop + height) {\n      endIndex = Math.min(count - 1, i + overscan);\n      break;\n    }\n    accumulated += getItemHeight(i);\n  }\n\n  return { startIndex, endIndex };\n};\n\nconst fixedRange = ({ count, scrollTop, height, overscan, itemHeight }: RangeArgs) => ({\n  startIndex: Math.max(0, Math.floor(scrollTop / itemHeight) - overscan),\n  endIndex: Math.min(count - 1, Math.ceil((scrollTop + height) / itemHeight) + overscan),\n});\n\nconst useItemOffset = (\n  variant: ListVariant,\n  itemHeight: number,\n  getItemHeight: ItemHeight,\n): ItemHeight =>\n  useCallback(\n    (index: number): number => {\n      if (variant === 'fixed') {\n        return index * itemHeight;\n      }\n\n      let offset = 0;\n      for (let i = 0; i < index; i++) {\n        offset += getItemHeight(i);\n      }\n      return offset;\n    },\n    [variant, itemHeight, getItemHeight],\n  );\n\ninterface ListArgs {\n  items: ListItems;\n  variant: ListVariant;\n  height: number;\n  itemHeight: number;\n  estimatedItemHeight: number;\n  overscan: number;\n  onScroll: VirtualListProps['onScroll'];\n  scrollContainerRef: VirtualListProps['scrollContainerRef'];\n}\n\nexport const useVirtualList = ({\n  items,\n  variant,\n  height,\n  itemHeight,\n  estimatedItemHeight,\n  overscan,\n  onScroll,\n  scrollContainerRef,\n}: ListArgs) => {\n  const getItemHeight = useItemHeight({ items, variant, itemHeight, estimatedItemHeight });\n  const getItemOffset = useItemOffset(variant, itemHeight, getItemHeight);\n  const totalHeight = useTotalHeight(items, variant, itemHeight, getItemHeight);\n\n  const report = useCallback((top: number) => onScroll?.(top), [onScroll]);\n  const { scrollTop, handleScroll } = useScrollTop(scrollContainerRef, report);\n\n  const visibleItems = useMemo(() => {\n    const args = { count: items.length, scrollTop, height, overscan, itemHeight, getItemHeight };\n    const { startIndex, endIndex } = variant === 'fixed' ? fixedRange(args) : variableRange(args);\n    const result = [];\n\n    for (let i = startIndex; i <= endIndex; i++) {\n      const item = items[i];\n      if (!item) continue;\n\n      result.push({\n        item,\n        index: i,\n        style: {\n          position: 'absolute' as const,\n          top: getItemOffset(i),\n          left: 0,\n          width: '100%',\n          height: getItemHeight(i),\n        },\n      });\n    }\n\n    return result;\n  }, [items, scrollTop, height, overscan, variant, itemHeight, getItemOffset, getItemHeight]);\n\n  return { totalHeight, visibleItems, handleScroll };\n};\n\ninterface GridArgs {\n  items: VirtualGridProps['items'];\n  height: number;\n  width: number | string;\n  columnCount: number;\n  rowHeight: number;\n  columnWidth?: number;\n  gap: number;\n  overscan: number;\n  onScroll: VirtualGridProps['onScroll'];\n  scrollContainerRef: VirtualGridProps['scrollContainerRef'];\n}\n\nconst useColumnWidth = (\n  columnWidth: number | undefined,\n  width: number | string,\n  columnCount: number,\n  gap: number,\n) =>\n  useMemo(() => {\n    if (columnWidth) return columnWidth;\n\n    const containerWidth = typeof width === 'number' ? width : 300; // fallback\n    return (containerWidth - (columnCount - 1) * gap) / columnCount;\n  }, [columnWidth, width, columnCount, gap]);\n\nexport const useVirtualGrid = ({\n  items,\n  height,\n  width,\n  columnCount,\n  rowHeight,\n  columnWidth,\n  gap,\n  overscan,\n  onScroll,\n  scrollContainerRef,\n}: GridArgs) => {\n  const rowCount = Math.ceil(items.length / columnCount);\n  const totalHeight = rowCount * (rowHeight + gap) - gap;\n  const computedColumnWidth = useColumnWidth(columnWidth, width, columnCount, gap);\n\n  const report = useCallback(\n    (top: number, left: number) => onScroll?.(top, left),\n    [onScroll],\n  );\n  const { scrollTop, handleScroll } = useScrollTop(scrollContainerRef, report);\n\n  const visibleItems = useMemo(() => {\n    const pitch = rowHeight + gap;\n    const startRow = Math.max(0, Math.floor(scrollTop / pitch) - overscan);\n    const endRow = Math.min(rowCount - 1, Math.ceil((scrollTop + height) / pitch) + overscan);\n\n    // Rows are contiguous in `items`, so the visible block is one index range\n    // rather than a row loop wrapping a column loop.\n    const firstIndex = startRow * columnCount;\n    const lastIndex = Math.min((endRow + 1) * columnCount - 1, items.length - 1);\n    const result = [];\n\n    for (let index = firstIndex; index <= lastIndex; index++) {\n      const item = items[index];\n      if (!item) continue;\n\n      const rowIndex = Math.floor(index / columnCount);\n      const columnIndex = index % columnCount;\n\n      result.push({\n        item,\n        index,\n        columnIndex,\n        rowIndex,\n        style: {\n          position: 'absolute' as const,\n          top: rowIndex * pitch,\n          left: columnIndex * (computedColumnWidth + gap),\n          width: computedColumnWidth,\n          height: rowHeight,\n        },\n      });\n    }\n\n    return result;\n  }, [items, scrollTop, height, overscan, rowCount, columnCount, rowHeight, gap, computedColumnWidth]);\n\n  return { totalHeight, visibleItems, handleScroll };\n};\n"],"mappings":"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","names":["useRef","useRef"]}