@12-apps/ui 5.0.0 → 5.1.0

package/dist/utility/InstallPrompt.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/utility/InstallPrompt/InstallPrompt.tsx","../../src/components/utility/InstallPrompt/InstallPrompt.styles.ts","../../src/components/utility/InstallPrompt/usePwaInstall.ts","../../src/components/utility/InstallPrompt/InstallPrompt.earlyCapture.ts","../../src/components/utility/InstallPrompt/InstallPrompt.helpers.ts"],"sourcesContent":["import Close from '@mui/icons-material/Close';\nimport InstallMobile from '@mui/icons-material/InstallMobile';\nimport IosShare from '@mui/icons-material/IosShare';\nimport { Box, Button, IconButton, Typography } from '@mui/material';\nimport { styled } from '@mui/material';\nimport React from 'react';\n\nimport { installPromptStyles } from './InstallPrompt.styles';\nimport type { InstallPlatform, InstallPromptProps } from './InstallPrompt.types';\nimport { usePwaInstall } from './usePwaInstall';\n\nconst StyledInstallPrompt = styled(Box)(({ theme }) => installPromptStyles(theme));\n\nconst testIdFor = (base: string | undefined, suffix: string) =>\n  base ? `${base}-${suffix}` : `install-prompt-${suffix}`;\n\n/**\n * The iOS branch renders instructions rather than a button, because Safari\n * exposes no API to open its own Add to Home Screen sheet. A button here would\n * be a control that does nothing when pressed.\n */\nconst IosInstructions: React.FC<{\n  instructions?: React.ReactNode;\n  dataTestId?: string;\n}> = ({ instructions, dataTestId }) => (\n  <Typography\n    className=\"install-prompt-description\"\n    variant=\"body2\"\n    component=\"div\"\n    data-testid={testIdFor(dataTestId, 'ios-instructions')}\n    sx={{ display: 'flex', alignItems: 'center', gap: 0.5, flexWrap: 'wrap' }}\n  >\n    {instructions ?? (\n      <>\n        Tap <IosShare fontSize=\"small\" aria-label=\"Share\" /> then &quot;Add to Home Screen&quot;\n      </>\n    )}\n  </Typography>\n);\n\nconst InstallPromptBody: React.FC<{\n  icon?: React.ReactNode;\n  title: string;\n  description?: string;\n  iosInstructions?: React.ReactNode;\n  platform: InstallPlatform;\n  dataTestId?: string;\n}> = ({ icon, title, description, iosInstructions, platform, dataTestId }) => (\n  <>\n    <Box className=\"install-prompt-icon\" aria-hidden=\"true\">\n      {icon ?? <InstallMobile />}\n    </Box>\n\n    <Box className=\"install-prompt-content\">\n      <Typography\n        className=\"install-prompt-title\"\n        variant=\"subtitle2\"\n        component=\"div\"\n        data-testid={testIdFor(dataTestId, 'title')}\n      >\n        {title}\n      </Typography>\n\n      {description && (\n        <Typography\n          className=\"install-prompt-description\"\n          variant=\"body2\"\n          component=\"div\"\n          data-testid={testIdFor(dataTestId, 'description')}\n        >\n          {description}\n        </Typography>\n      )}\n\n      {platform === 'ios' && (\n        <IosInstructions instructions={iosInstructions} dataTestId={dataTestId} />\n      )}\n    </Box>\n  </>\n);\n\nconst InstallPromptActions: React.FC<{\n  platform: InstallPlatform;\n  installLabel: string;\n  dismissLabel: string;\n  onInstallClick: () => void;\n  onDismissClick: () => void;\n  dataTestId?: string;\n}> = ({ platform, installLabel, dismissLabel, onInstallClick, onDismissClick, dataTestId }) => (\n  <Box className=\"install-prompt-actions\">\n    {platform === 'prompt' && (\n      <Button\n        size=\"small\"\n        variant=\"contained\"\n        onClick={onInstallClick}\n        data-testid={testIdFor(dataTestId, 'install')}\n      >\n        {installLabel}\n      </Button>\n    )}\n\n    <IconButton\n      size=\"small\"\n      onClick={onDismissClick}\n      aria-label={dismissLabel}\n      data-testid={testIdFor(dataTestId, 'dismiss')}\n    >\n      <Close fontSize=\"small\" />\n    </IconButton>\n  </Box>\n);\n\n/**\n * A dismissible invitation to install the app, rendered only when the browser\n * is actually able to install it and the user has not recently said no.\n *\n * Returns `null` in every other case — already installed, dismissed, or a\n * browser with no install route at all — so it is safe to mount unconditionally\n * in a layout rather than gating it at the call site.\n *\n * The copy defaults to English and every string is a prop: this package stays\n * locale-neutral and the consuming app supplies its own wording.\n */\nexport const InstallPrompt = React.forwardRef<HTMLDivElement, InstallPromptProps>(\n  (\n    {\n      title = 'Install this app',\n      description,\n      installLabel = 'Install',\n      iosInstructions,\n      dismissLabel = 'Dismiss install prompt',\n      icon,\n      onInstall,\n      onDismiss,\n      storageKey,\n      dismissForDays,\n      className,\n      'data-testid': dataTestId = 'install-prompt',\n      ...props\n    },\n    ref,\n  ) => {\n    const { canInstall, platform, promptInstall, dismiss } = usePwaInstall({\n      storageKey,\n      dismissForDays,\n    });\n\n    const handleInstall = React.useCallback(() => {\n      void promptInstall().then((outcome) => onInstall?.(outcome));\n    }, [promptInstall, onInstall]);\n\n    const handleDismiss = React.useCallback(() => {\n      dismiss();\n      onDismiss?.();\n    }, [dismiss, onDismiss]);\n\n    if (!canInstall) {\n      return null;\n    }\n\n    return (\n      <StyledInstallPrompt\n        ref={ref}\n        className={className}\n        role=\"region\"\n        aria-label={title}\n        data-testid={dataTestId}\n        {...props}\n      >\n        <InstallPromptBody\n          icon={icon}\n          title={title}\n          description={description}\n          iosInstructions={iosInstructions}\n          platform={platform}\n          dataTestId={dataTestId}\n        />\n\n        <InstallPromptActions\n          platform={platform}\n          installLabel={installLabel}\n          dismissLabel={dismissLabel}\n          onInstallClick={handleInstall}\n          onDismissClick={handleDismiss}\n          dataTestId={dataTestId}\n        />\n      </StyledInstallPrompt>\n    );\n  },\n);\n\nInstallPrompt.displayName = 'InstallPrompt';\n","import { alpha } from '@mui/material';\nimport type { CSSObject, Theme } from '@mui/material';\n\nexport const installPromptStyles = (theme: Theme): CSSObject => ({\n  display: 'flex',\n  alignItems: 'flex-start',\n  gap: theme.spacing(1.5),\n  padding: theme.spacing(1.5, 2),\n  borderRadius: theme.spacing(1),\n  backgroundColor: alpha(theme.palette.primary.main, 0.08),\n  border: `1px solid ${alpha(theme.palette.primary.main, 0.2)}`,\n\n  '.install-prompt-icon': {\n    flexShrink: 0,\n    marginTop: theme.spacing(0.25),\n    display: 'flex',\n    color: theme.palette.primary.main,\n  },\n\n  '.install-prompt-content': {\n    flex: 1,\n    minWidth: 0,\n  },\n\n  '.install-prompt-title': {\n    fontWeight: 600,\n  },\n\n  '.install-prompt-description': {\n    opacity: 0.9,\n  },\n\n  '.install-prompt-actions': {\n    display: 'flex',\n    flexShrink: 0,\n    alignItems: 'center',\n    gap: theme.spacing(1),\n  },\n\n  // The actions drop to their own full-width row on a phone, where this\n  // component does most of its work.\n  [theme.breakpoints.down('sm')]: {\n    flexWrap: 'wrap',\n\n    '.install-prompt-actions': {\n      width: '100%',\n      marginTop: theme.spacing(1),\n    },\n  },\n});\n","import { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { PWA_INSTALL_AVAILABLE_EVENT, readPwaInstallStash } from './InstallPrompt.earlyCapture';\nimport {\n  DEFAULT_DISMISS_DAYS,\n  DEFAULT_STORAGE_KEY,\n  isDismissalActive,\n  isStandaloneDisplay,\n  readDismissedAt,\n  resolveInstallPlatform,\n  writeDismissedAt,\n} from './InstallPrompt.helpers';\nimport type {\n  BeforeInstallPromptEvent,\n  InstallOutcome,\n  InstallPlatform,\n  PwaInstallState,\n  UsePwaInstallOptions,\n} from './InstallPrompt.types';\n\n/**\n * Headless PWA install machinery.\n *\n * A manifest and a service worker make a site installABLE; they do not make it\n * install. Chromium announces its willingness by firing `beforeinstallprompt`\n * and then does nothing further on its own beyond a small address-bar icon most\n * users never notice. Unless a page calls `preventDefault()` on that event and\n * keeps it, the handle is gone and the app can never ask.\n *\n * That is the whole reason this hook exists. It captures the event, tracks the\n * three states that should suppress an install invitation (already installed,\n * recently dismissed, browser cannot install), and hands back a\n * gesture-callable `promptInstall`.\n *\n * Every environment probe runs in an effect rather than in a state initialiser:\n * touching `window` during render breaks SSR and desynchronises hydration, so\n * the first paint deliberately reports `canInstall: false` and corrects itself\n * on mount.\n */\n\n/** Tracks whether the page is running as an installed app. */\nconst useInstalledState = (onInstalled?: () => void) => {\n  const [isInstalled, setIsInstalled] = useState(false);\n\n  // Held in a ref, and refreshed in its own effect rather than during render, so\n  // that a caller passing an inline callback does not re-subscribe the listener\n  // on every render.\n  const onInstalledRef = useRef(onInstalled);\n  useEffect(() => {\n    onInstalledRef.current = onInstalled;\n  }, [onInstalled]);\n\n  useEffect(() => {\n    // `appinstalled` can also land before the app mounts, so the stash is\n    // consulted for the same reason the deferred event is.\n    setIsInstalled(isStandaloneDisplay() || readPwaInstallStash()?.installedAt != null);\n\n    const markInstalled = () => {\n      setIsInstalled(true);\n      onInstalledRef.current?.();\n    };\n\n    window.addEventListener('appinstalled', markInstalled);\n    return () => window.removeEventListener('appinstalled', markInstalled);\n  }, []);\n\n  return isInstalled;\n};\n\n/**\n * Holds the deferred `beforeinstallprompt` event.\n *\n * The stash written by `capturePwaInstallEvent` is the PRIMARY source, not a\n * fallback. Chromium fires the event once, during initial page load; a\n * listener attached in an effect runs after hydration and, when the component\n * is code-split, after a download that may not happen until a later route. In\n * a real browser it essentially never catches the event, and the event is not\n * reissued on request — so a hook that relies on its own listener reports\n * \"cannot install\" forever on the one platform that can.\n *\n * The live listeners below therefore cover only the narrow case they can\n * actually serve: a browser re-evaluating installability while the app is\n * already running, and a host that never wired the capture at all.\n */\nconst useDeferredPrompt = () => {\n  const deferredRef = useRef<BeforeInstallPromptEvent | null>(null);\n  const [promptReady, setPromptReady] = useState(false);\n\n  useEffect(() => {\n    const hold = (event: BeforeInstallPromptEvent) => {\n      deferredRef.current = event;\n      setPromptReady(true);\n    };\n\n    // Whatever fired before this component existed.\n    const held = readPwaInstallStash()?.event;\n    if (held) hold(held);\n\n    // The capture rang the bell after mount: adopt what it is holding.\n    const adopt = () => {\n      const fresh = readPwaInstallStash()?.event;\n      if (fresh) hold(fresh);\n    };\n\n    const capture = (event: Event) => {\n      // Without preventDefault the browser owns the event and the handle dies\n      // with it. The capture has normally done this already; repeating it is\n      // harmless and keeps the hook correct on a host that skipped wiring.\n      event.preventDefault();\n      hold(event as BeforeInstallPromptEvent);\n    };\n\n    window.addEventListener(PWA_INSTALL_AVAILABLE_EVENT, adopt);\n    window.addEventListener('beforeinstallprompt', capture);\n    return () => {\n      window.removeEventListener(PWA_INSTALL_AVAILABLE_EVENT, adopt);\n      window.removeEventListener('beforeinstallprompt', capture);\n    };\n  }, []);\n\n  const clearPrompt = useCallback(() => {\n    deferredRef.current = null;\n    setPromptReady(false);\n  }, []);\n\n  return { deferredRef, promptReady, clearPrompt };\n};\n\n/** Reads and writes the \"don't ask again for a while\" record. */\nconst useDismissal = (storageKey: string, dismissForDays: number) => {\n  const [dismissed, setDismissed] = useState(false);\n\n  useEffect(() => {\n    const dismissedAt = readDismissedAt(storageKey);\n    setDismissed(isDismissalActive(dismissedAt, dismissForDays, Date.now()));\n  }, [storageKey, dismissForDays]);\n\n  const persistDismissal = useCallback(() => {\n    writeDismissedAt(storageKey, Date.now());\n    setDismissed(true);\n  }, [storageKey]);\n\n  return { dismissed, persistDismissal };\n};\n\n/** Resolves the install route once the deferred-prompt state is known. */\nconst useInstallPlatform = (promptReady: boolean): InstallPlatform => {\n  const [platform, setPlatform] = useState<InstallPlatform>('unsupported');\n\n  useEffect(() => {\n    setPlatform(resolveInstallPlatform(promptReady));\n  }, [promptReady]);\n\n  return platform;\n};\n\nexport const usePwaInstall = (options: UsePwaInstallOptions = {}): PwaInstallState => {\n  const {\n    storageKey = DEFAULT_STORAGE_KEY,\n    dismissForDays = DEFAULT_DISMISS_DAYS,\n    onInstalled,\n  } = options;\n\n  const isInstalled = useInstalledState(onInstalled);\n  const { deferredRef, promptReady, clearPrompt } = useDeferredPrompt();\n  const { dismissed, persistDismissal } = useDismissal(storageKey, dismissForDays);\n  const platform = useInstallPlatform(promptReady);\n\n  const promptInstall = useCallback(async (): Promise<InstallOutcome> => {\n    const deferred = deferredRef.current;\n    if (!deferred) return 'unavailable';\n\n    await deferred.prompt();\n    const { outcome } = await deferred.userChoice;\n\n    // Single-use handle: spent whichever way the user answered. Chromium emits a\n    // fresh event if the app is still installable, so holding this one would\n    // only mean calling prompt() twice on a dead event.\n    clearPrompt();\n\n    // Declining the browser's own dialog is a real \"no\" — record it, or the\n    // affordance reappears on the next render and badgers the user.\n    if (outcome === 'dismissed') persistDismissal();\n\n    return outcome;\n  }, [deferredRef, clearPrompt, persistDismissal]);\n\n  // iOS has no event to wait for, so its affordance is gated on the platform\n  // probe alone; everywhere else a live captured prompt is the prerequisite.\n  const canInstall = !isInstalled && !dismissed && (platform === 'ios' || promptReady);\n\n  return {\n    canInstall,\n    platform,\n    isInstalled,\n    promptInstall,\n    dismiss: persistDismissal,\n  };\n};\n","import type { BeforeInstallPromptEvent, PwaInstallStash } from './InstallPrompt.types';\n\n/**\n * Holds `beforeinstallprompt` from before the app exists.\n *\n * `usePwaInstall` cannot attach its own listener early enough, and no React\n * hook can. Chromium fires the event once, during initial page load, the\n * moment it has a manifest and a registered worker — which in a real app is\n * before hydration, and often before the chunk containing the component has\n * even been downloaded. A listener registered in an effect is not late by\n * milliseconds; it can be late by entire navigations. Nothing calls\n * `preventDefault()` in time, the browser keeps the event, and the page can\n * never ask again.\n *\n * So the capture has to live outside React, and the host has to install it as\n * the very first thing the document does. Two supported ways, in order of\n * reliability:\n *\n * 1. An inline `<script>` in `<head>`, which beats a deferred module bundle:\n *\n *        <script>\n *          window.addEventListener('beforeinstallprompt', function (e) {\n *            e.preventDefault();\n *            var s = (window.__pwaInstall = window.__pwaInstall || {});\n *            s.event = e; s.firedAt = Date.now();\n *            window.dispatchEvent(new Event('pwa-install-available'));\n *          });\n *        </script>\n *\n * 2. `capturePwaInstallEvent()` as the first statement of the entry module,\n *    before `createRoot`. Simpler to wire and correct in most apps, but a\n *    module is still deferred, so a very early event can outrun it.\n *\n * Both write the same shape, so the hook does not care which was used.\n */\n\n/** Property on `window` holding the captured event. Shared with the inline snippet. */\nexport const PWA_INSTALL_STASH_KEY = '__pwaInstall';\n\n/** Fired after a capture, so an app already running can adopt the event. */\nexport const PWA_INSTALL_AVAILABLE_EVENT = 'pwa-install-available';\n\ntype StashHost = Window & { [PWA_INSTALL_STASH_KEY]?: PwaInstallStash };\n\n/** The stash, or `null` when no capture ever ran (SSR, or a host that skipped wiring). */\nexport const readPwaInstallStash = (): PwaInstallStash | null => {\n  if (typeof window === 'undefined') return null;\n  return (window as StashHost)[PWA_INSTALL_STASH_KEY] ?? null;\n};\n\nconst ensureStash = (): PwaInstallStash => {\n  const host = window as StashHost;\n  host[PWA_INSTALL_STASH_KEY] ??= { event: null, firedAt: null, installedAt: null };\n  return host[PWA_INSTALL_STASH_KEY];\n};\n\n/**\n * The teardown for the capture currently running, so `resetPwaInstallStash`\n * can unwind completely. Held here rather than on the stash because it must\n * survive the stash being deleted, and because it must never be serialised\n * into the diagnostic payload.\n */\nlet activeTeardown: (() => void) | null = null;\n\n/**\n * Starts capturing. Returns a teardown, and is safe to call twice — a second\n * call is a no-op rather than a duplicate listener, so a host that wires both\n * the inline snippet and this function does not double-handle the event.\n */\nexport const capturePwaInstallEvent = (): (() => void) => {\n  if (typeof window === 'undefined') return () => undefined;\n\n  const stash = ensureStash();\n  if (stash.capturing === true) return () => undefined;\n  stash.capturing = true;\n\n  const onBeforeInstall = (event: Event): void => {\n    // The line the whole component depends on. Without it the browser owns the\n    // event, shows at most its own mini-infobar, and discards the handle.\n    event.preventDefault();\n    stash.event = event as BeforeInstallPromptEvent;\n    stash.firedAt = Date.now();\n    window.dispatchEvent(new Event(PWA_INSTALL_AVAILABLE_EVENT));\n  };\n\n  const onInstalled = (): void => {\n    stash.installedAt = Date.now();\n    stash.event = null;\n  };\n\n  window.addEventListener('beforeinstallprompt', onBeforeInstall);\n  window.addEventListener('appinstalled', onInstalled);\n\n  const teardown = () => {\n    window.removeEventListener('beforeinstallprompt', onBeforeInstall);\n    window.removeEventListener('appinstalled', onInstalled);\n    stash.capturing = false;\n    if (activeTeardown === teardown) activeTeardown = null;\n  };\n\n  activeTeardown = teardown;\n  return teardown;\n};\n\n/**\n * Returns the page to its pre-capture state: listeners removed, stash gone.\n *\n * Exists for tests and stories, which need a clean page per case. It unwinds\n * the listeners as well as the data, because a leaked capture from a previous\n * case would go on suppressing events that the next case expects to observe.\n */\nexport const resetPwaInstallStash = (): void => {\n  if (typeof window === 'undefined') return;\n  activeTeardown?.();\n  activeTeardown = null;\n  delete (window as StashHost)[PWA_INSTALL_STASH_KEY];\n};\n","import type { InstallPlatform } from './InstallPrompt.types';\n\n/**\n * Pure environment probes and dismissal storage for `usePwaInstall`.\n *\n * Everything here is a plain function taking its clock and its storage from the\n * caller where that matters, so the hook's behaviour is testable without\n * faking timers or a browser.\n */\n\nexport const DEFAULT_STORAGE_KEY = 'pwa-install-dismissed';\nexport const DEFAULT_DISMISS_DAYS = 30;\n\nconst MS_PER_DAY = 86_400_000;\nconst STANDALONE_QUERY = '(display-mode: standalone)';\n\n/** iOS Safari predates `display-mode` and exposes this instead. */\ninterface IosNavigator extends Navigator {\n  standalone?: boolean;\n}\n\n/** Guard for SSR and for jsdom runs where `matchMedia` is not implemented. */\nconst hasWindow = (): boolean => typeof window !== 'undefined';\n\n/**\n * True when the page is already running as an installed app.\n *\n * Both checks are needed: `display-mode: standalone` is the standard signal,\n * but iOS never implemented it for home-screen launches and reports\n * `navigator.standalone` instead. Miss the iOS branch and the installed app\n * nags its own users to install it again.\n */\nexport const isStandaloneDisplay = (): boolean => {\n  if (!hasWindow()) return false;\n  if ((window.navigator as IosNavigator).standalone === true) return true;\n  return window.matchMedia?.(STANDALONE_QUERY).matches === true;\n};\n\n/**\n * True for Safari on iOS/iPadOS — the one browser that can install but cannot\n * be asked programmatically.\n *\n * Two traps handled here. iPadOS 13+ reports a Macintosh user agent, so the\n * touch-point count is what separates an iPad from a desktop; and Chrome,\n * Firefox and Edge on iOS are Safari underneath but offer no Add to Home\n * Screen at all, so telling their users to tap Share is a dead end.\n *\n * Kept parameterised so the agent table can be tested without reassigning\n * `navigator`, which leaks across test files when it is not restored.\n */\nexport const isIosSafariAgent = (userAgent: string, maxTouchPoints: number): boolean => {\n  const isIosDevice =\n    /iPad|iPhone|iPod/.test(userAgent) ||\n    (userAgent.includes('Macintosh') && maxTouchPoints > 1);\n\n  if (!isIosDevice) return false;\n\n  return !/CriOS|FxiOS|EdgiOS|OPiOS/.test(userAgent);\n};\n\n/** `isIosSafariAgent` against the live browser. Internal — callers use `resolveInstallPlatform`. */\nconst isIosSafari = (): boolean => {\n  if (!hasWindow()) return false;\n\n  const { userAgent, maxTouchPoints } = window.navigator;\n  return isIosSafariAgent(userAgent, maxTouchPoints);\n};\n\n/**\n * Reads the stored dismissal timestamp.\n *\n * Storage access is wrapped because it THROWS rather than returning null in\n * Safari private mode and wherever cookies are blocked — an uncaught throw\n * here would take down the storefront on the very browsers this component\n * exists to serve.\n */\nexport const readDismissedAt = (storageKey: string): number | null => {\n  if (!hasWindow()) return null;\n\n  try {\n    const raw = window.localStorage.getItem(storageKey);\n    if (!raw) return null;\n\n    const parsed = Number.parseInt(raw, 10);\n    return Number.isFinite(parsed) ? parsed : null;\n  } catch {\n    return null;\n  }\n};\n\n/** Persists a dismissal. Silently a no-op when storage is unavailable. */\nexport const writeDismissedAt = (storageKey: string, at: number): void => {\n  if (!hasWindow()) return;\n\n  try {\n    window.localStorage.setItem(storageKey, String(at));\n  } catch {\n    // Storage blocked — the dismissal lasts for this page view only.\n  }\n};\n\n/**\n * Whether a stored dismissal still suppresses the prompt.\n *\n * `dismissForDays: 0` means forever. A timestamp in the future (a device whose\n * clock was wound back) is treated as active rather than expired, so a bad\n * clock cannot turn into a prompt on every page view.\n */\nexport const isDismissalActive = (\n  dismissedAt: number | null,\n  dismissForDays: number,\n  now: number,\n): boolean => {\n  if (dismissedAt === null) return false;\n  if (dismissForDays <= 0) return true;\n\n  return now - dismissedAt < dismissForDays * MS_PER_DAY;\n};\n\n/** Resolves which install route this browser offers. */\nexport const resolveInstallPlatform = (hasDeferredPrompt: boolean): InstallPlatform => {\n  if (hasDeferredPrompt) return 'prompt';\n  return isIosSafari() ? 'ios' : 'unsupported';\n};\n"],"mappings":"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","names":[]}

package/dist/utility/Overflow.js

@@ -0,0 +1,10 @@
+import {
+  splitToFit,
+  useMeasuredWidth
+} from "../chunk-5YQGQUZL.js";
+import "../chunk-PZ5AY32C.js";
+export {
+  splitToFit,
+  useMeasuredWidth
+};
+//# sourceMappingURL=Overflow.js.map

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"]}