@ahrowe/ui 0.27.0 → 0.29.0

package/dist/esm/common/timer/timer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"timer.mjs","names":[],"sources":["../../../../package/common/timer/timer.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n  type ReactElement,\n} from 'react';\nimport cx from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faPlus, faMinus, faPause, faPlay, faXmark } from '@fortawesome/free-solid-svg-icons';\n\nimport ActionIcon from '../actionIcon';\nimport Button from '../button';\nimport { ButtonSize } from '../button/button.types';\nimport { useComponentDefaults } from '../configProvider';\nimport { DEFAULT_CHIME_DATA_URI } from './timer.chime';\nimport type { TimerHandle, TimerProps, TimerStatus } from './timer.types';\nimport styles from './timer.module.pcss';\n\nconst TICK_MS = 200;\nconst RIPPLE_SPAWN_INTERVAL_MS = 1000;\n\nfunction prefersReducedMotion(): boolean {\n  return typeof window !== 'undefined' && window.matchMedia?.('(prefers-reduced-motion: reduce)').matches === true;\n}\n\nfunction formatTimeDefault(remainingMs: number) {\n  const totalSeconds = Math.ceil(remainingMs / 1000);\n  const hours = Math.floor(totalSeconds / 3600);\n  const minutes = Math.floor((totalSeconds % 3600) / 60);\n  const seconds = totalSeconds % 60;\n  const mm = String(minutes).padStart(2, '0');\n  const ss = String(seconds).padStart(2, '0');\n  return hours > 0 ? `${hours}:${mm}:${ss}` : `${mm}:${ss}`;\n}\n\nconst Timer = forwardRef<TimerHandle, TimerProps>(function Timer(props, ref) {\n  const {\n    durationSeconds,\n    autoStart = true,\n    resetOnDurationChange = true,\n\n    onTick,\n    onComplete,\n    onStart,\n    onPause,\n    onResume,\n    onCancel,\n    onAddTime,\n    onRemoveTime,\n\n    showControls = true,\n    hideAddButton = false,\n    hideRemoveButton = false,\n    hidePauseButton = false,\n    hideCancelButton = false,\n    adjustSeconds = 30,\n    maxSeconds,\n\n    label,\n    formatTime = formatTimeDefault,\n    size = '160px',\n    strokeWidth = 10,\n    counterClockwise = false,\n\n    urgentThreshold = 0.1,\n    urgentMinSeconds = 3,\n    pulseOnUrgent = true,\n    showRunningRipples = false,\n\n    playSoundOnComplete = false,\n    soundUrl,\n    soundVolume = 0.5,\n    notifyOnComplete = false,\n    notificationTitle,\n    notificationBody,\n\n    className,\n    style,\n    classNames,\n    styles: slotStyles,\n    ...rest\n  } = useComponentDefaults('Timer', props);\n\n  const initialMs = durationSeconds * 1000;\n  const [status, setStatusState] = useState<TimerStatus>(autoStart ? 'running' : 'idle');\n  const [remainingMs, setRemainingMsState] = useState(initialMs);\n  const [epoch, setEpoch] = useState(0);\n  const [ripples, setRipples] = useState<number[]>([]);\n\n  const remainingRef = useRef(remainingMs);\n  const statusRef = useRef(status);\n  const totalMsRef = useRef(initialMs);\n  const completedFiredRef = useRef(false);\n  const notifyPermissionRequestedRef = useRef(false);\n  const mountedRef = useRef(false);\n  const rippleIdRef = useRef(0);\n\n  function setRemaining(next: number) {\n    remainingRef.current = next;\n    setRemainingMsState(next);\n  }\n\n  function setStatus(next: TimerStatus) {\n    statusRef.current = next;\n    setStatusState(next);\n  }\n\n  function bumpEpoch() {\n    setEpoch((e) => e + 1);\n  }\n\n  // Ticking effect. Re-derives the remaining time from Date.now() every tick (rather than\n  // accumulating setInterval's own drift), so it stays accurate over long countdowns. Any\n  // external mutation of remainingRef (addTime/removeTime while already running, or a resume)\n  // must bump `epoch` so this effect re-arms and re-captures a fresh start/startRemaining —\n  // without that, a stale `startRemaining` captured before the mutation would silently\n  // overwrite it on the next tick.\n  useEffect(() => {\n    if (status !== 'running') return undefined;\n    const start = Date.now();\n    const startRemaining = remainingRef.current;\n    const id = setInterval(() => {\n      const next = Math.max(0, startRemaining - (Date.now() - start));\n      setRemaining(next);\n      onTick?.(next);\n      if (next <= 0) setStatus('completed');\n    }, TICK_MS);\n    return () => clearInterval(id);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [status, epoch]);\n\n  // Fires onComplete exactly once per completion, plus the opt-in sound/notification.\n  useEffect(() => {\n    if (status === 'completed' && !completedFiredRef.current) {\n      completedFiredRef.current = true;\n      onComplete?.();\n      if (playSoundOnComplete) {\n        try {\n          const audio = new Audio(soundUrl || DEFAULT_CHIME_DATA_URI);\n          audio.volume = soundVolume;\n          // play() can reject (autoplay policy) or, in some environments, return undefined\n          // instead of a Promise — never let a blocked/unsupported playback surface as an error.\n          audio.play()?.catch(() => {});\n        } catch {\n          // Audio unavailable/unsupported — fail silently.\n        }\n      }\n      if (notifyOnComplete && typeof Notification !== 'undefined' && Notification.permission === 'granted') {\n        try {\n          new Notification(notificationTitle ?? 'Timer done', {\n            body: notificationBody ?? (typeof label === 'string' ? label : undefined),\n          });\n        } catch {\n          // Some browsers (e.g. certain mobile Safari versions) throw constructing\n          // Notification outside specific contexts — fail silently, as documented.\n        }\n      }\n    }\n    if (status !== 'completed') completedFiredRef.current = false;\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [status]);\n\n  // durationSeconds prop change: reset (and optionally restart) at the new duration. Skips\n  // the initial mount, since autoStart/initial state already cover that.\n  useEffect(() => {\n    if (!mountedRef.current) {\n      mountedRef.current = true;\n      return;\n    }\n    const nextMs = durationSeconds * 1000;\n    totalMsRef.current = nextMs;\n    setRemaining(nextMs);\n    completedFiredRef.current = false;\n    bumpEpoch();\n    if (resetOnDurationChange) {\n      setStatus(autoStart ? 'running' : 'idle');\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [durationSeconds]);\n\n  // Running-ripple spawner: spawns a new ripple roughly every RIPPLE_SPAWN_INTERVAL_MS while\n  // running, each animating once (via CSS, `forwards`) and removing itself on `onAnimationEnd`.\n  // Pausing (or otherwise leaving `running`) only stops new spawns here — it doesn't touch\n  // `ripples` — so whichever ripples are already mid-flight keep animating to completion\n  // instead of vanishing mid-cycle.\n  useEffect(() => {\n    if (!showRunningRipples || status !== 'running' || prefersReducedMotion()) return undefined;\n    function spawnRipple() {\n      rippleIdRef.current += 1;\n      setRipples((prev) => [...prev, rippleIdRef.current]);\n    }\n    spawnRipple();\n    const id = setInterval(spawnRipple, RIPPLE_SPAWN_INTERVAL_MS);\n    return () => clearInterval(id);\n  }, [showRunningRipples, status]);\n\n  function handleRippleAnimationEnd(id: number) {\n    setRipples((prev) => prev.filter((existingId) => existingId !== id));\n  }\n\n  function requestNotificationPermissionIfNeeded() {\n    if (!notifyOnComplete || notifyPermissionRequestedRef.current) return;\n    if (typeof Notification === 'undefined' || Notification.permission !== 'default') return;\n    notifyPermissionRequestedRef.current = true;\n    Notification.requestPermission().catch(() => {});\n  }\n\n  function start() {\n    requestNotificationPermissionIfNeeded();\n    if (statusRef.current === 'completed' || statusRef.current === 'cancelled') {\n      setRemaining(totalMsRef.current);\n      completedFiredRef.current = false;\n    }\n    bumpEpoch();\n    setStatus('running');\n    onStart?.();\n  }\n\n  function pause() {\n    if (statusRef.current !== 'running') return;\n    setStatus('paused');\n    onPause?.();\n  }\n\n  function resume() {\n    if (statusRef.current !== 'paused') return;\n    bumpEpoch();\n    setStatus('running');\n    onResume?.();\n  }\n\n  function addTime(seconds: number) {\n    const capped = maxSeconds != null ? maxSeconds * 1000 : Infinity;\n    const next = Math.min(remainingRef.current + seconds * 1000, capped);\n    setRemaining(next);\n    bumpEpoch();\n    onAddTime?.(seconds, Math.round(next / 1000));\n    if (statusRef.current === 'completed' && next > 0) {\n      completedFiredRef.current = false;\n      setStatus('running');\n    }\n  }\n\n  function removeTime(seconds: number) {\n    const next = Math.max(0, remainingRef.current - seconds * 1000);\n    setRemaining(next);\n    bumpEpoch();\n    onRemoveTime?.(seconds, Math.round(next / 1000));\n    if (next <= 0 && statusRef.current === 'running') setStatus('completed');\n  }\n\n  function cancel() {\n    setRemaining(totalMsRef.current);\n    setStatus('cancelled');\n    onCancel?.();\n  }\n\n  function reset() {\n    setRemaining(totalMsRef.current);\n    completedFiredRef.current = false;\n    setStatus('idle');\n  }\n\n  useImperativeHandle(ref, () => ({\n    start,\n    pause,\n    resume,\n    addTime,\n    removeTime,\n    cancel,\n    reset,\n    getStatus: () => statusRef.current,\n    getRemainingMs: () => remainingRef.current,\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }));\n\n  const radius = 50 - strokeWidth / 2;\n  const circumference = useMemo(() => 2 * Math.PI * radius, [radius]);\n  const clampedFraction = totalMsRef.current > 0 ? Math.min(1, remainingMs / totalMsRef.current) : 0;\n  const dashOffset = circumference * (1 - clampedFraction);\n  const urgentMs = Math.max(totalMsRef.current * urgentThreshold, urgentMinSeconds * 1000);\n  const isUrgent = status === 'running' && remainingMs <= urgentMs;\n  const isCritical = isUrgent && remainingMs <= Math.min(5000, urgentMs);\n  const isPaused = status === 'paused';\n\n  // The pause button doubles as a play/restart button whenever there's nothing to pause —\n  // idle (autoStart={false}), completed, or cancelled — rather than hiding itself, so there's\n  // always a way to (re)start the countdown from the built-in controls alone.\n  const showAddButton = showControls && !hideAddButton;\n  const showRemoveButton = showControls && !hideRemoveButton;\n  const showPauseButton = showControls && !hidePauseButton;\n  const pauseButtonIcon = status === 'running' ? faPause : faPlay;\n  const pauseButtonTitle = status === 'running' ? 'Pause' : isPaused ? 'Resume' : status === 'idle' ? 'Start' : 'Restart';\n  const handlePauseButtonClick = status === 'running' ? pause : isPaused ? resume : start;\n  const showCancelButton = showControls && !hideCancelButton;\n\n  return (\n    <div\n      {...rest}\n      className={cx(\n        styles.timer,\n        pulseOnUrgent && isUrgent && styles.timerPulsing,\n        isCritical && styles.timerCritical,\n        className,\n        classNames?.root,\n      )}\n      style={{\n        '--timer-size': size,\n        '--timer-stroke-width': `${strokeWidth}px`,\n        ...style,\n        ...slotStyles?.root,\n      } as React.CSSProperties}\n    >\n      <div className={cx(styles.timerRingWrapper, classNames?.ringWrapper)} style={slotStyles?.ringWrapper}>\n        {ripples.length > 0 && (\n          <div className={cx(styles.timerRipples, classNames?.ripples)} style={slotStyles?.ripples}>\n            {ripples.map((id) => (\n              <span\n                key={id}\n                className={cx(styles.timerRipple, classNames?.ripple)}\n                style={slotStyles?.ripple}\n                onAnimationEnd={() => handleRippleAnimationEnd(id)}\n              />\n            ))}\n          </div>\n        )}\n        <svg\n          className={cx(styles.timerRingSvg, classNames?.ringSvg)}\n          viewBox=\"0 0 100 100\"\n          style={slotStyles?.ringSvg}\n        >\n          <circle\n            className={cx(styles.timerRingTrack, classNames?.ringTrack)}\n            cx=\"50\"\n            cy=\"50\"\n            r={radius}\n            style={slotStyles?.ringTrack}\n          />\n          <circle\n            className={cx(styles.timerRingProgress, isUrgent && styles.timerRingProgressUrgent, classNames?.ringProgress)}\n            cx=\"50\"\n            cy=\"50\"\n            r={radius}\n            strokeDasharray={circumference}\n            strokeDashoffset={dashOffset}\n            style={{\n              transition: isPaused ? 'none' : undefined,\n              transform: counterClockwise ? 'rotate(-90deg)' : undefined,\n              ...slotStyles?.ringProgress,\n            }}\n          />\n        </svg>\n        <div className={cx(styles.timerDisplay, classNames?.display)} style={slotStyles?.display}>\n          <span className={cx(styles.timerTime, classNames?.time)} style={slotStyles?.time}>\n            {formatTime(remainingMs)}\n          </span>\n          {label && (\n            <span className={cx(styles.timerLabel, classNames?.label)} style={slotStyles?.label}>\n              {label}\n            </span>\n          )}\n        </div>\n      </div>\n\n      {showControls && (\n        <div className={cx(styles.timerControls, classNames?.controls)} style={slotStyles?.controls}>\n          <div className={styles.timerControlsRow}>\n            {showRemoveButton && (\n              <ActionIcon\n                icon={faMinus}\n                title={`Remove ${adjustSeconds}s`}\n                onClick={() => removeTime(adjustSeconds)}\n                className={cx(styles.timerAdjustButton, classNames?.removeButton)}\n                style={slotStyles?.removeButton}\n              />\n            )}\n            {showPauseButton && (\n              <Button\n                size={ButtonSize.Small}\n                icon={pauseButtonIcon}\n                title={pauseButtonTitle}\n                onClick={handlePauseButtonClick}\n                className={classNames?.pauseButton}\n                style={slotStyles?.pauseButton}\n              />\n            )}\n            {showAddButton && (\n              <ActionIcon\n                icon={faPlus}\n                title={`Add ${adjustSeconds}s`}\n                onClick={() => addTime(adjustSeconds)}\n                className={cx(styles.timerAdjustButton, classNames?.addButton)}\n                style={slotStyles?.addButton}\n              />\n            )}\n          </div>\n          {showCancelButton && (\n            <ActionIcon\n              icon={faXmark}\n              title=\"Cancel timer\"\n              onClick={cancel}\n              className={cx(styles.timerCancelButton, classNames?.cancelButton)}\n              style={slotStyles?.cancelButton}\n            />\n          )}\n        </div>\n      )}\n    </div>\n  );\n});\n\nTimer.displayName = 'Timer';\n\nexport default Timer;\n"],"mappings":"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"}
+{"version":3,"file":"timer.mjs","names":[],"sources":["../../../../package/common/timer/timer.tsx"],"sourcesContent":["import { forwardRef, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';\nimport cx from 'classnames';\nimport { faPlus, faMinus, faPause, faPlay, faXmark } from '@fortawesome/free-solid-svg-icons';\n\nimport ActionIcon from '../actionIcon';\nimport Button from '../button';\nimport { ButtonSize } from '../button/button.types';\nimport { useComponentDefaults } from '../configProvider';\nimport { DEFAULT_CHIME_DATA_URI } from './timer.chime';\nimport type { TimerHandle, TimerProps, TimerStatus } from './timer.types';\nimport styles from './timer.module.pcss';\n\nconst TICK_MS = 200;\nconst RIPPLE_SPAWN_INTERVAL_MS = 1000;\n\nfunction prefersReducedMotion(): boolean {\n  return typeof window !== 'undefined' && window.matchMedia?.('(prefers-reduced-motion: reduce)').matches === true;\n}\n\nfunction formatTimeDefault(remainingMs: number) {\n  const totalSeconds = Math.ceil(remainingMs / 1000);\n  const hours = Math.floor(totalSeconds / 3600);\n  const minutes = Math.floor((totalSeconds % 3600) / 60);\n  const seconds = totalSeconds % 60;\n  const mm = String(minutes).padStart(2, '0');\n  const ss = String(seconds).padStart(2, '0');\n  return hours > 0 ? `${hours}:${mm}:${ss}` : `${mm}:${ss}`;\n}\n\nconst Timer = forwardRef<TimerHandle, TimerProps>(function Timer(props, ref) {\n  const {\n    durationSeconds,\n    autoStart = true,\n    resetOnDurationChange = true,\n\n    onTick,\n    onComplete,\n    onStart,\n    onPause,\n    onResume,\n    onCancel,\n    onAddTime,\n    onRemoveTime,\n\n    showControls = true,\n    hideAddButton = false,\n    hideRemoveButton = false,\n    hidePauseButton = false,\n    hideCancelButton = false,\n    adjustSeconds = 30,\n    maxSeconds,\n\n    label,\n    formatTime = formatTimeDefault,\n    size = '160px',\n    strokeWidth = 10,\n    counterClockwise = false,\n\n    urgentThreshold = 0.1,\n    urgentMinSeconds = 3,\n    pulseOnUrgent = true,\n    showRunningRipples = false,\n\n    playSoundOnComplete = false,\n    soundUrl,\n    soundVolume = 0.5,\n    notifyOnComplete = false,\n    notificationTitle,\n    notificationBody,\n\n    className,\n    style,\n    classNames,\n    styles: slotStyles,\n    ...rest\n  } = useComponentDefaults('Timer', props);\n\n  const initialMs = durationSeconds * 1000;\n  const [status, setStatusState] = useState<TimerStatus>(autoStart ? 'running' : 'idle');\n  const [remainingMs, setRemainingMsState] = useState(initialMs);\n  const [epoch, setEpoch] = useState(0);\n  const [ripples, setRipples] = useState<number[]>([]);\n\n  const remainingRef = useRef(remainingMs);\n  const statusRef = useRef(status);\n  const totalMsRef = useRef(initialMs);\n  const completedFiredRef = useRef(false);\n  const notifyPermissionRequestedRef = useRef(false);\n  const mountedRef = useRef(false);\n  const rippleIdRef = useRef(0);\n\n  function setRemaining(next: number) {\n    remainingRef.current = next;\n    setRemainingMsState(next);\n  }\n\n  function setStatus(next: TimerStatus) {\n    statusRef.current = next;\n    setStatusState(next);\n  }\n\n  function bumpEpoch() {\n    setEpoch((e) => e + 1);\n  }\n\n  // Ticking effect. Re-derives the remaining time from Date.now() every tick (rather than\n  // accumulating setInterval's own drift), so it stays accurate over long countdowns. Any\n  // external mutation of remainingRef (addTime/removeTime while already running, or a resume)\n  // must bump `epoch` so this effect re-arms and re-captures a fresh start/startRemaining —\n  // without that, a stale `startRemaining` captured before the mutation would silently\n  // overwrite it on the next tick.\n  useEffect(() => {\n    if (status !== 'running') return undefined;\n    const start = Date.now();\n    const startRemaining = remainingRef.current;\n    const id = setInterval(() => {\n      const next = Math.max(0, startRemaining - (Date.now() - start));\n      setRemaining(next);\n      onTick?.(next);\n      if (next <= 0) setStatus('completed');\n    }, TICK_MS);\n    return () => clearInterval(id);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [status, epoch]);\n\n  // Fires onComplete exactly once per completion, plus the opt-in sound/notification.\n  useEffect(() => {\n    if (status === 'completed' && !completedFiredRef.current) {\n      completedFiredRef.current = true;\n      onComplete?.();\n      if (playSoundOnComplete) {\n        try {\n          const audio = new Audio(soundUrl || DEFAULT_CHIME_DATA_URI);\n          audio.volume = soundVolume;\n          // play() can reject (autoplay policy) or, in some environments, return undefined\n          // instead of a Promise — never let a blocked/unsupported playback surface as an error.\n          audio.play()?.catch(() => {});\n        } catch {\n          // Audio unavailable/unsupported — fail silently.\n        }\n      }\n      if (notifyOnComplete && typeof Notification !== 'undefined' && Notification.permission === 'granted') {\n        try {\n          new Notification(notificationTitle ?? 'Timer done', {\n            body: notificationBody ?? (typeof label === 'string' ? label : undefined),\n          });\n        } catch {\n          // Some browsers (e.g. certain mobile Safari versions) throw constructing\n          // Notification outside specific contexts — fail silently, as documented.\n        }\n      }\n    }\n    if (status !== 'completed') completedFiredRef.current = false;\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [status]);\n\n  // durationSeconds prop change: reset (and optionally restart) at the new duration. Skips\n  // the initial mount, since autoStart/initial state already cover that.\n  useEffect(() => {\n    if (!mountedRef.current) {\n      mountedRef.current = true;\n      return;\n    }\n    const nextMs = durationSeconds * 1000;\n    totalMsRef.current = nextMs;\n    setRemaining(nextMs);\n    completedFiredRef.current = false;\n    bumpEpoch();\n    if (resetOnDurationChange) {\n      setStatus(autoStart ? 'running' : 'idle');\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [durationSeconds]);\n\n  // Running-ripple spawner: spawns a new ripple roughly every RIPPLE_SPAWN_INTERVAL_MS while\n  // running, each animating once (via CSS, `forwards`) and removing itself on `onAnimationEnd`.\n  // Pausing (or otherwise leaving `running`) only stops new spawns here — it doesn't touch\n  // `ripples` — so whichever ripples are already mid-flight keep animating to completion\n  // instead of vanishing mid-cycle.\n  useEffect(() => {\n    if (!showRunningRipples || status !== 'running' || prefersReducedMotion()) return undefined;\n    function spawnRipple() {\n      rippleIdRef.current += 1;\n      setRipples((prev) => [...prev, rippleIdRef.current]);\n    }\n    spawnRipple();\n    const id = setInterval(spawnRipple, RIPPLE_SPAWN_INTERVAL_MS);\n    return () => clearInterval(id);\n  }, [showRunningRipples, status]);\n\n  function handleRippleAnimationEnd(id: number) {\n    setRipples((prev) => prev.filter((existingId) => existingId !== id));\n  }\n\n  function requestNotificationPermissionIfNeeded() {\n    if (!notifyOnComplete || notifyPermissionRequestedRef.current) return;\n    if (typeof Notification === 'undefined' || Notification.permission !== 'default') return;\n    notifyPermissionRequestedRef.current = true;\n    Notification.requestPermission().catch(() => {});\n  }\n\n  function start() {\n    requestNotificationPermissionIfNeeded();\n    if (statusRef.current === 'completed' || statusRef.current === 'cancelled') {\n      setRemaining(totalMsRef.current);\n      completedFiredRef.current = false;\n    }\n    bumpEpoch();\n    setStatus('running');\n    onStart?.();\n  }\n\n  function pause() {\n    if (statusRef.current !== 'running') return;\n    setStatus('paused');\n    onPause?.();\n  }\n\n  function resume() {\n    if (statusRef.current !== 'paused') return;\n    bumpEpoch();\n    setStatus('running');\n    onResume?.();\n  }\n\n  function addTime(seconds: number) {\n    const capped = maxSeconds != null ? maxSeconds * 1000 : Infinity;\n    const next = Math.min(remainingRef.current + seconds * 1000, capped);\n    setRemaining(next);\n    bumpEpoch();\n    onAddTime?.(seconds, Math.round(next / 1000));\n    if (statusRef.current === 'completed' && next > 0) {\n      completedFiredRef.current = false;\n      setStatus('running');\n    }\n  }\n\n  function removeTime(seconds: number) {\n    const next = Math.max(0, remainingRef.current - seconds * 1000);\n    setRemaining(next);\n    bumpEpoch();\n    onRemoveTime?.(seconds, Math.round(next / 1000));\n    if (next <= 0 && statusRef.current === 'running') setStatus('completed');\n  }\n\n  function cancel() {\n    setRemaining(totalMsRef.current);\n    setStatus('cancelled');\n    onCancel?.();\n  }\n\n  function reset() {\n    setRemaining(totalMsRef.current);\n    completedFiredRef.current = false;\n    setStatus('idle');\n  }\n\n  useImperativeHandle(ref, () => ({\n    start,\n    pause,\n    resume,\n    addTime,\n    removeTime,\n    cancel,\n    reset,\n    getStatus: () => statusRef.current,\n    getRemainingMs: () => remainingRef.current,\n  }));\n\n  const radius = 50 - strokeWidth / 2;\n  const circumference = useMemo(() => 2 * Math.PI * radius, [radius]);\n  const clampedFraction = totalMsRef.current > 0 ? Math.min(1, remainingMs / totalMsRef.current) : 0;\n  const dashOffset = circumference * (1 - clampedFraction);\n  const urgentMs = Math.max(totalMsRef.current * urgentThreshold, urgentMinSeconds * 1000);\n  const isUrgent = status === 'running' && remainingMs <= urgentMs;\n  const isCritical = isUrgent && remainingMs <= Math.min(5000, urgentMs);\n  const isPaused = status === 'paused';\n\n  // The pause button doubles as a play/restart button whenever there's nothing to pause —\n  // idle (autoStart={false}), completed, or cancelled — rather than hiding itself, so there's\n  // always a way to (re)start the countdown from the built-in controls alone.\n  const showAddButton = showControls && !hideAddButton;\n  const showRemoveButton = showControls && !hideRemoveButton;\n  const showPauseButton = showControls && !hidePauseButton;\n  const pauseButtonIcon = status === 'running' ? faPause : faPlay;\n  const pauseButtonTitle =\n    status === 'running' ? 'Pause' : isPaused ? 'Resume' : status === 'idle' ? 'Start' : 'Restart';\n  const handlePauseButtonClick = status === 'running' ? pause : isPaused ? resume : start;\n  const showCancelButton = showControls && !hideCancelButton;\n\n  return (\n    <div\n      {...rest}\n      className={cx(\n        styles.timer,\n        pulseOnUrgent && isUrgent && styles.timerPulsing,\n        isCritical && styles.timerCritical,\n        className,\n        classNames?.root,\n      )}\n      style={\n        {\n          '--timer-size': size,\n          '--timer-stroke-width': `${strokeWidth}px`,\n          ...style,\n          ...slotStyles?.root,\n        } as React.CSSProperties\n      }\n    >\n      <div className={cx(styles.timerRingWrapper, classNames?.ringWrapper)} style={slotStyles?.ringWrapper}>\n        {ripples.length > 0 && (\n          <div className={cx(styles.timerRipples, classNames?.ripples)} style={slotStyles?.ripples}>\n            {ripples.map((id) => (\n              <span\n                key={id}\n                className={cx(styles.timerRipple, classNames?.ripple)}\n                style={slotStyles?.ripple}\n                onAnimationEnd={() => handleRippleAnimationEnd(id)}\n              />\n            ))}\n          </div>\n        )}\n        <svg className={cx(styles.timerRingSvg, classNames?.ringSvg)} viewBox='0 0 100 100' style={slotStyles?.ringSvg}>\n          <circle\n            className={cx(styles.timerRingTrack, classNames?.ringTrack)}\n            cx='50'\n            cy='50'\n            r={radius}\n            style={slotStyles?.ringTrack}\n          />\n          <circle\n            className={cx(\n              styles.timerRingProgress,\n              isUrgent && styles.timerRingProgressUrgent,\n              classNames?.ringProgress,\n            )}\n            cx='50'\n            cy='50'\n            r={radius}\n            strokeDasharray={circumference}\n            strokeDashoffset={dashOffset}\n            style={{\n              transition: isPaused ? 'none' : undefined,\n              transform: counterClockwise ? 'rotate(-90deg)' : undefined,\n              ...slotStyles?.ringProgress,\n            }}\n          />\n        </svg>\n        <div className={cx(styles.timerDisplay, classNames?.display)} style={slotStyles?.display}>\n          <span className={cx(styles.timerTime, classNames?.time)} style={slotStyles?.time}>\n            {formatTime(remainingMs)}\n          </span>\n          {label && (\n            <span className={cx(styles.timerLabel, classNames?.label)} style={slotStyles?.label}>\n              {label}\n            </span>\n          )}\n        </div>\n      </div>\n\n      {showControls && (\n        <div className={cx(styles.timerControls, classNames?.controls)} style={slotStyles?.controls}>\n          <div className={styles.timerControlsRow}>\n            {showRemoveButton && (\n              <ActionIcon\n                icon={faMinus}\n                title={`Remove ${adjustSeconds}s`}\n                onClick={() => removeTime(adjustSeconds)}\n                className={cx(styles.timerAdjustButton, classNames?.removeButton)}\n                style={slotStyles?.removeButton}\n              />\n            )}\n            {showPauseButton && (\n              <Button\n                size={ButtonSize.Small}\n                icon={pauseButtonIcon}\n                title={pauseButtonTitle}\n                onClick={handlePauseButtonClick}\n                className={classNames?.pauseButton}\n                style={slotStyles?.pauseButton}\n              />\n            )}\n            {showAddButton && (\n              <ActionIcon\n                icon={faPlus}\n                title={`Add ${adjustSeconds}s`}\n                onClick={() => addTime(adjustSeconds)}\n                className={cx(styles.timerAdjustButton, classNames?.addButton)}\n                style={slotStyles?.addButton}\n              />\n            )}\n          </div>\n          {showCancelButton && (\n            <ActionIcon\n              icon={faXmark}\n              title='Cancel timer'\n              onClick={cancel}\n              className={cx(styles.timerCancelButton, classNames?.cancelButton)}\n              style={slotStyles?.cancelButton}\n            />\n          )}\n        </div>\n      )}\n    </div>\n  );\n});\n\nTimer.displayName = 'Timer';\n\nexport default Timer;\n"],"mappings":"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"}

package/dist/esm/common/timer/timer.module.mjs

@@ -1,2 +1,2 @@
-var e={timer:`timer_cqe3R`,"timer-ringWrapper":`timer-ringWrapper_OydlE`,timerRingWrapper:`timer-ringWrapper_OydlE`,"timer-ringSvg":`timer-ringSvg_qsV1X`,timerRingSvg:`timer-ringSvg_qsV1X`,"timer-ripples":`timer-ripples_2Slkv`,timerRipples:`timer-ripples_2Slkv`,"timer-ripple":`timer-ripple_TLdSx`,timerRipple:`timer-ripple_TLdSx`,timerRippleHalo:`timerRippleHalo_oEcXJ`,"timer-ringTrack":`timer-ringTrack_pGGs1`,timerRingTrack:`timer-ringTrack_pGGs1`,"timer-ringProgress":`timer-ringProgress_LL8uQ`,timerRingProgress:`timer-ringProgress_LL8uQ`,"timer-ringProgress-urgent":`timer-ringProgress-urgent_MwwU2`,timerRingProgressUrgent:`timer-ringProgress-urgent_MwwU2`,"timer-display":`timer-display_es2IX`,timerDisplay:`timer-display_es2IX`,"timer-time":`timer-time_oMZ5O`,timerTime:`timer-time_oMZ5O`,"timer-label":`timer-label_GknS-`,timerLabel:`timer-label_GknS-`,"timer-controls":`timer-controls_LHM4q`,timerControls:`timer-controls_LHM4q`,"timer-controlsRow":`timer-controlsRow_42JyZ`,timerControlsRow:`timer-controlsRow_42JyZ`,"timer-adjustButton":`timer-adjustButton_QMxrI`,timerAdjustButton:`timer-adjustButton_QMxrI`,"timer-cancelButton":`timer-cancelButton_ObL4-`,timerCancelButton:`timer-cancelButton_ObL4-`,"timer-pulsing":`timer-pulsing_795m4`,timerPulsing:`timer-pulsing_795m4`,timerHeartbeat:`timerHeartbeat_N40Zt`,"timer-critical":`timer-critical_q-JzB`,timerCritical:`timer-critical_q-JzB`};export{e as default};
+var e=`timer_cqe3R`,t=`timer-ringWrapper_OydlE`,n=`timer-ringSvg_qsV1X`,r=`timer-ripples_2Slkv`,i=`timer-ripple_TLdSx`,a=`timerRippleHalo_oEcXJ`,o=`timer-ringTrack_pGGs1`,s=`timer-ringProgress_LL8uQ`,c=`timer-ringProgress-urgent_MwwU2`,l=`timer-display_es2IX`,u=`timer-time_oMZ5O`,d=`timer-label_GknS-`,f=`timer-controls_LHM4q`,p=`timer-controlsRow_42JyZ`,m=`timer-adjustButton_QMxrI`,h=`timer-cancelButton_ObL4-`,g=`timer-pulsing_795m4`,_=`timerHeartbeat_N40Zt`,v=`timer-critical_q-JzB`,y={timer:e,"timer-ringWrapper":`timer-ringWrapper_OydlE`,timerRingWrapper:t,"timer-ringSvg":`timer-ringSvg_qsV1X`,timerRingSvg:n,"timer-ripples":`timer-ripples_2Slkv`,timerRipples:r,"timer-ripple":`timer-ripple_TLdSx`,timerRipple:i,timerRippleHalo:a,"timer-ringTrack":`timer-ringTrack_pGGs1`,timerRingTrack:o,"timer-ringProgress":`timer-ringProgress_LL8uQ`,timerRingProgress:s,"timer-ringProgress-urgent":`timer-ringProgress-urgent_MwwU2`,timerRingProgressUrgent:c,"timer-display":`timer-display_es2IX`,timerDisplay:l,"timer-time":`timer-time_oMZ5O`,timerTime:u,"timer-label":`timer-label_GknS-`,timerLabel:d,"timer-controls":`timer-controls_LHM4q`,timerControls:f,"timer-controlsRow":`timer-controlsRow_42JyZ`,timerControlsRow:p,"timer-adjustButton":`timer-adjustButton_QMxrI`,timerAdjustButton:m,"timer-cancelButton":`timer-cancelButton_ObL4-`,timerCancelButton:h,"timer-pulsing":`timer-pulsing_795m4`,timerPulsing:g,timerHeartbeat:_,"timer-critical":`timer-critical_q-JzB`,timerCritical:v};export{y as default,e as timer,m as timerAdjustButton,h as timerCancelButton,f as timerControls,p as timerControlsRow,v as timerCritical,l as timerDisplay,_ as timerHeartbeat,d as timerLabel,g as timerPulsing,s as timerRingProgress,c as timerRingProgressUrgent,n as timerRingSvg,o as timerRingTrack,t as timerRingWrapper,i as timerRipple,a as timerRippleHalo,r as timerRipples,u as timerTime};
 //# sourceMappingURL=timer.module.mjs.map

package/dist/esm/common/timer/timer.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"timer.module.mjs","names":[],"sources":["../../../../package/common/timer/timer.module.pcss"],"sourcesContent":[".timer {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 16px;\n  width: fit-content;\n\n  &-ringWrapper {\n    position: relative;\n    width: var(--timer-size, 160px);\n    height: var(--timer-size, 160px);\n    transform-origin: center;\n  }\n\n  &-ringSvg {\n    position: relative;\n    width: 100%;\n    height: 100%;\n    overflow: visible;\n  }\n\n  &-ripples {\n    position: absolute;\n    inset: 0;\n    pointer-events: none;\n  }\n\n  &-ripple {\n    position: absolute;\n    inset: 0;\n    border-radius: 50%;\n    border: 2px solid var(--timer-ripple-color, var(--timer-progress-color, var(--primary-color)));\n    opacity: 0;\n    transform: scale(0.94);\n    /* One-shot per spawned instance (see the ripple spawner in timer.tsx), not an infinite\n       loop — so pausing simply stops new spawns while already-mid-flight ripples keep\n       animating to completion via `forwards` instead of vanishing mid-cycle. */\n    animation: timerRippleHalo 3s ease-out forwards;\n  }\n\n  &-ringTrack {\n    fill: none;\n    stroke: var(--timer-track-color, var(--background-accent-light));\n    stroke-width: var(--timer-stroke-width, 10px);\n  }\n\n  &-ringProgress {\n    fill: none;\n    stroke: var(--timer-progress-color, var(--primary-color));\n    stroke-width: var(--timer-stroke-width, 10px);\n    stroke-linecap: round;\n    /* Single combined transform, not split across an SVG `transform` attribute on this element\n       plus a separate CSS transform on an ancestor — that split combination, together with an\n       actively-transitioning stroke-dashoffset, is a known trigger for SVG dash-rendering glitches\n       in some engines (the visible arc appearing to jump/drift independent of the actual\n       dashoffset value). scaleX(-1) mirrors so the depleting boundary sweeps clockwise (matching\n       a clock face) instead of the counter-clockwise direction a <circle>'s implicit path winds\n       by default; rotate(-90deg) moves the fixed anchor from 3 o'clock to 12 o'clock. Both applied\n       around the circle's own center, which coincides with the viewBox center here. `counterClockwise`\n       overrides this inline (timer.tsx) by dropping the scaleX(-1), keeping just the rotate — that\n       default winding direction is exactly counter-clockwise, so no mirroring is needed for it. */\n    transform: scaleX(-1) rotate(-90deg);\n    transform-origin: 50% 50%;\n    /* Matches (slightly exceeds) the JS tick interval (TICK_MS in timer.tsx) so the ring\n       tracks the real remaining time closely instead of perpetually chasing a target that's\n       always a full second stale — a much longer transition here reads as sluggish since the\n       rendered ring never catches up to the true value while ticking continues. */\n    transition:\n      stroke-dashoffset 220ms linear,\n      stroke 0.3s ease;\n\n    &-urgent {\n      stroke: var(--timer-urgent-color, var(--error-color));\n    }\n  }\n\n  &-display {\n    position: absolute;\n    inset: 0;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n    padding: 0 12px;\n  }\n\n  &-time {\n    font-size: 1.4em;\n    font-weight: 600;\n    font-variant-numeric: tabular-nums;\n    color: var(--timer-text-color, var(--text-color));\n  }\n\n  &-label {\n    margin-top: 4px;\n    font-size: 0.8em;\n    color: var(--timer-label-color, var(--text-dark));\n  }\n\n  &-controls {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 8px;\n  }\n\n  &-controlsRow {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n  }\n\n  &-adjustButton {\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  &-cancelButton {\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n    opacity: 0.6;\n\n    &:hover {\n      opacity: 1;\n    }\n  }\n\n  &-pulsing &-ringWrapper {\n    animation: timerHeartbeat 1s ease-in-out infinite;\n  }\n\n  &-critical &-ringWrapper {\n    animation-duration: 0.6s;\n  }\n}\n\n@keyframes timerHeartbeat {\n  0%,\n  100% {\n    transform: scale(1);\n  }\n\n  50% {\n    transform: scale(1.045);\n  }\n}\n\n@keyframes timerRippleHalo {\n  0% {\n    transform: scale(0.94);\n    opacity: 0.5;\n  }\n\n  100% {\n    transform: scale(1.35);\n    opacity: 0;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .timer-ringProgress {\n    transition: stroke 0.3s ease;\n  }\n\n  .timer-pulsing .timer-ringWrapper {\n    animation: none;\n  }\n\n  .timer-ripple {\n    animation: none;\n    opacity: 0;\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"timer.module.mjs","names":[],"sources":["../../../../package/common/timer/timer.module.pcss"],"sourcesContent":[".timer {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: 16px;\n  width: fit-content;\n\n  &-ringWrapper {\n    position: relative;\n    width: var(--timer-size, 160px);\n    height: var(--timer-size, 160px);\n    transform-origin: center;\n  }\n\n  &-ringSvg {\n    position: relative;\n    width: 100%;\n    height: 100%;\n    overflow: visible;\n  }\n\n  &-ripples {\n    position: absolute;\n    inset: 0;\n    pointer-events: none;\n  }\n\n  &-ripple {\n    position: absolute;\n    inset: 0;\n    border-radius: 50%;\n    border: 2px solid var(--timer-ripple-color, var(--timer-progress-color, var(--primary-color)));\n    opacity: 0;\n    transform: scale(0.94);\n\n    /* One-shot per spawned instance (see the ripple spawner in timer.tsx), not an infinite\n       loop — so pausing simply stops new spawns while already-mid-flight ripples keep\n       animating to completion via `forwards` instead of vanishing mid-cycle. */\n    animation: timerRippleHalo 3s ease-out forwards;\n  }\n\n  &-ringTrack {\n    fill: none;\n    stroke: var(--timer-track-color, var(--background-accent-light));\n    stroke-width: var(--timer-stroke-width, 10px);\n  }\n\n  &-ringProgress {\n    fill: none;\n    stroke: var(--timer-progress-color, var(--primary-color));\n    stroke-width: var(--timer-stroke-width, 10px);\n    stroke-linecap: round;\n\n    /* Single combined transform, not split across an SVG `transform` attribute on this element\n       plus a separate CSS transform on an ancestor — that split combination, together with an\n       actively-transitioning stroke-dashoffset, is a known trigger for SVG dash-rendering glitches\n       in some engines (the visible arc appearing to jump/drift independent of the actual\n       dashoffset value). scaleX(-1) mirrors so the depleting boundary sweeps clockwise (matching\n       a clock face) instead of the counter-clockwise direction a <circle>'s implicit path winds\n       by default; rotate(-90deg) moves the fixed anchor from 3 o'clock to 12 o'clock. Both applied\n       around the circle's own center, which coincides with the viewBox center here. `counterClockwise`\n       overrides this inline (timer.tsx) by dropping the scaleX(-1), keeping just the rotate — that\n       default winding direction is exactly counter-clockwise, so no mirroring is needed for it. */\n    transform: scaleX(-1) rotate(-90deg);\n    transform-origin: 50% 50%;\n\n    /* Matches (slightly exceeds) the JS tick interval (TICK_MS in timer.tsx) so the ring\n       tracks the real remaining time closely instead of perpetually chasing a target that's\n       always a full second stale — a much longer transition here reads as sluggish since the\n       rendered ring never catches up to the true value while ticking continues. */\n    transition:\n      stroke-dashoffset 220ms linear,\n      stroke 0.3s ease;\n\n    &-urgent {\n      stroke: var(--timer-urgent-color, var(--error-color));\n    }\n  }\n\n  &-display {\n    position: absolute;\n    inset: 0;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    text-align: center;\n    padding: 0 12px;\n  }\n\n  &-time {\n    font-size: 1.4em;\n    font-weight: 600;\n    font-variant-numeric: tabular-nums;\n    color: var(--timer-text-color, var(--text-color));\n  }\n\n  &-label {\n    margin-top: 4px;\n    font-size: 0.8em;\n    color: var(--timer-label-color, var(--text-dark));\n  }\n\n  &-controls {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 8px;\n  }\n\n  &-controlsRow {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n  }\n\n  &-adjustButton {\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  &-cancelButton {\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n    opacity: 0.6;\n\n    &:hover {\n      opacity: 1;\n    }\n  }\n\n  &-pulsing &-ringWrapper {\n    animation: timerHeartbeat 1s ease-in-out infinite;\n  }\n\n  &-critical &-ringWrapper {\n    animation-duration: 0.6s;\n  }\n}\n\n@keyframes timerHeartbeat {\n  0%,\n  100% {\n    transform: scale(1);\n  }\n\n  50% {\n    transform: scale(1.045);\n  }\n}\n\n@keyframes timerRippleHalo {\n  0% {\n    transform: scale(0.94);\n    opacity: 0.5;\n  }\n\n  100% {\n    transform: scale(1.35);\n    opacity: 0;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .timer-ringProgress {\n    transition: stroke 0.3s ease;\n  }\n\n  .timer-pulsing .timer-ringWrapper {\n    animation: none;\n  }\n\n  .timer-ripple {\n    animation: none;\n    opacity: 0;\n  }\n}\n"],"mappings":""}

package/dist/esm/common/toast/toast.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"toast.mjs","names":[],"sources":["../../../../package/common/toast/toast.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport cx from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport {\n  faCircleInfo,\n  faCircleCheck,\n  faCircleXmark,\n  faTriangleExclamation,\n  faBell,\n  faXmark,\n} from '@fortawesome/free-solid-svg-icons';\n\nimport styles from './toast.module.pcss';\nimport type { ToastItem } from './toast.types';\nimport ActionIcon from '../actionIcon';\nimport { useSwipeDismiss } from '../hooks/useSwipeDismiss';\n\ninterface ToastProps {\n  item: ToastItem;\n  isBottom: boolean;\n  onDismiss: (id: string) => void;\n}\n\nconst typeIcons = {\n  info: faCircleInfo,\n  success: faCircleCheck,\n  error: faCircleXmark,\n  warn: faTriangleExclamation,\n  default: faBell,\n};\n\nfunction Toast({ item, isBottom, onDismiss }: ToastProps) {\n  const { id, content, options, dismissing } = item;\n  const { duration, showRemainingTime, showCloseButton, pauseOnHover, type, classNames, styles: slotStyles } = options;\n\n  const [hovered, setHovered] = useState(false);\n  const [focused, setFocused] = useState(false);\n\n  const [swiped, setSwiped] = useState(false);\n  const { ref: swipeRef, isDragging } = useSwipeDismiss<HTMLDivElement>({\n    onDismiss: () => {\n      setSwiped(true);\n      onDismiss(id);\n    },\n  });\n\n  const paused = (pauseOnHover && (hovered || focused)) || isDragging;\n\n  // Remaining time is carried across pause/resume cycles so the timer continues\n  // where it left off instead of restarting on every hover.\n  const remainingRef = useRef(duration);\n\n  useEffect(() => {\n    if (duration === 0 || paused) return;\n    const start = Date.now();\n    const timer = setTimeout(() => onDismiss(id), remainingRef.current);\n    return () => {\n      clearTimeout(timer);\n      remainingRef.current -= Date.now() - start;\n    };\n  }, [id, duration, onDismiss, paused]);\n\n  return (\n    <div\n      ref={swipeRef}\n      className={cx(\n        styles.toast,\n        isBottom ? styles.toastBottom : null,\n        styles[`toast-${type}`],\n        dismissing && !swiped && styles.toastDismissing,\n        paused && styles.toastPaused,\n        classNames?.root,\n      )}\n      style={slotStyles?.root}\n      onMouseEnter={pauseOnHover ? () => setHovered(true) : undefined}\n      onMouseLeave={pauseOnHover ? () => setHovered(false) : undefined}\n      onFocus={pauseOnHover ? () => setFocused(true) : undefined}\n      onBlur={pauseOnHover ? () => setFocused(false) : undefined}\n    >\n      <FontAwesomeIcon\n        icon={typeIcons[type]}\n        className={cx(styles.toastIcon, classNames?.icon)}\n        style={slotStyles?.icon as React.CSSProperties & Record<`--fa-font-${string}`, string>}\n      />\n\n      <div className={cx(styles.toastContent, classNames?.content)} style={slotStyles?.content}>\n        {content}\n      </div>\n\n      {showCloseButton && (\n        <ActionIcon\n          icon={faXmark}\n          onClick={() => onDismiss(id)}\n          className={cx(styles.toastCloseButton, classNames?.closeButton)}\n          style={slotStyles?.closeButton}\n          aria-label=\"Close\"\n        />\n      )}\n\n      {showRemainingTime && duration > 0 && (\n        <div\n          className={cx(styles.toastProgressBar, classNames?.progressBar)}\n          style={{ '--toast-duration': `${duration}ms`, ...slotStyles?.progressBar } as React.CSSProperties}\n        />\n      )}\n    </div>\n  );\n}\n\nexport default Toast;\n"],"mappings":"ifAuBA,IAAM,EAAY,CAChB,KAAM,EACN,QAAS,EACT,MAAO,EACP,KAAM,EACN,QAAS,CACX,EAEA,SAAS,EAAM,CAAE,OAAM,WAAU,aAAyB,CACxD,GAAM,CAAE,KAAI,UAAS,UAAS,cAAe,EACvC,CAAE,WAAU,oBAAmB,kBAAiB,eAAc,OAAM,aAAY,OAAQ,GAAe,EAEvG,CAAC,EAAS,GAAc,EAAS,EAAK,EACtC,CAAC,EAAS,GAAc,EAAS,EAAK,EAEtC,CAAC,EAAQ,GAAa,EAAS,EAAK,EACpC,CAAE,IAAK,EAAU,cAAe,EAAgC,CACpE,cAAiB,CACf,EAAU,EAAI,EACd,EAAU,CAAE,CACd,CACF,CAAC,EAEK,EAAU,IAAiB,GAAW,IAAa,EAInD,EAAe,EAAO,CAAQ,EAYpC,OAVA,MAAgB,CACd,GAAI,IAAa,GAAK,EAAQ,OAC9B,IAAM,EAAQ,KAAK,IAAI,EACjB,EAAQ,eAAiB,EAAU,CAAE,EAAG,EAAa,OAAO,EAClE,UAAa,CACX,aAAa,CAAK,EAClB,EAAa,SAAW,KAAK,IAAI,EAAI,CACvC,CACF,EAAG,CAAC,EAAI,EAAU,EAAW,CAAM,CAAC,EAGlC,EAAC,MAAD,CACE,IAAK,EACL,UAAW,EACT,EAAO,MACP,EAAW,EAAO,YAAc,KAChC,EAAO,SAAS,KAChB,GAAc,CAAC,GAAU,EAAO,gBAChC,GAAU,EAAO,YACjB,GAAY,IACd,EACA,MAAO,GAAY,KACnB,aAAc,MAAqB,EAAW,EAAI,EAAI,IAAA,GACtD,aAAc,MAAqB,EAAW,EAAK,EAAI,IAAA,GACvD,QAAS,MAAqB,EAAW,EAAI,EAAI,IAAA,GACjD,OAAQ,MAAqB,EAAW,EAAK,EAAI,IAAA,YAdnD,CAgBE,EAAC,EAAD,CACE,KAAM,EAAU,GAChB,UAAW,EAAG,EAAO,UAAW,GAAY,IAAI,EAChD,MAAO,GAAY,IACpB,CAAA,EAED,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,aAAc,GAAY,OAAO,EAAG,MAAO,GAAY,iBAC9E,CACE,CAAA,EAEJ,GACC,EAAC,EAAD,CACE,KAAM,EACN,YAAe,EAAU,CAAE,EAC3B,UAAW,EAAG,EAAO,iBAAkB,GAAY,WAAW,EAC9D,MAAO,GAAY,YACnB,aAAW,OACZ,CAAA,EAGF,GAAqB,EAAW,GAC/B,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,iBAAkB,GAAY,WAAW,EAC9D,MAAO,CAAE,mBAAoB,GAAG,EAAS,IAAK,GAAG,GAAY,WAAY,CAC1E,CAAA,CAEA,GAET"}
+{"version":3,"file":"toast.mjs","names":[],"sources":["../../../../package/common/toast/toast.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport cx from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport {\n  faCircleInfo,\n  faCircleCheck,\n  faCircleXmark,\n  faTriangleExclamation,\n  faBell,\n  faXmark,\n} from '@fortawesome/free-solid-svg-icons';\n\nimport styles from './toast.module.pcss';\nimport type { ToastItem } from './toast.types';\nimport ActionIcon from '../actionIcon';\nimport { useSwipeDismiss } from '../hooks/useSwipeDismiss';\n\ninterface ToastProps {\n  item: ToastItem;\n  isBottom: boolean;\n  onDismiss: (id: string) => void;\n}\n\nconst typeIcons = {\n  info: faCircleInfo,\n  success: faCircleCheck,\n  error: faCircleXmark,\n  warn: faTriangleExclamation,\n  default: faBell,\n};\n\nfunction Toast({ item, isBottom, onDismiss }: ToastProps) {\n  const { id, content, options, dismissing } = item;\n  const { duration, showRemainingTime, showCloseButton, pauseOnHover, type, classNames, styles: slotStyles } = options;\n\n  const [hovered, setHovered] = useState(false);\n  const [focused, setFocused] = useState(false);\n\n  const [swiped, setSwiped] = useState(false);\n  const { ref: swipeRef, isDragging } = useSwipeDismiss<HTMLDivElement>({\n    onDismiss: () => {\n      setSwiped(true);\n      onDismiss(id);\n    },\n  });\n\n  const paused = (pauseOnHover && (hovered || focused)) || isDragging;\n\n  // Remaining time is carried across pause/resume cycles so the timer continues\n  // where it left off instead of restarting on every hover.\n  const remainingRef = useRef(duration);\n\n  useEffect(() => {\n    if (duration === 0 || paused) return;\n    const start = Date.now();\n    const timer = setTimeout(() => onDismiss(id), remainingRef.current);\n    return () => {\n      clearTimeout(timer);\n      remainingRef.current -= Date.now() - start;\n    };\n  }, [id, duration, onDismiss, paused]);\n\n  return (\n    <div\n      ref={swipeRef}\n      className={cx(\n        styles.toast,\n        isBottom ? styles.toastBottom : null,\n        styles[`toast-${type}`],\n        dismissing && !swiped && styles.toastDismissing,\n        paused && styles.toastPaused,\n        classNames?.root,\n      )}\n      style={slotStyles?.root}\n      onMouseEnter={pauseOnHover ? () => setHovered(true) : undefined}\n      onMouseLeave={pauseOnHover ? () => setHovered(false) : undefined}\n      onFocus={pauseOnHover ? () => setFocused(true) : undefined}\n      onBlur={pauseOnHover ? () => setFocused(false) : undefined}\n    >\n      <FontAwesomeIcon\n        icon={typeIcons[type]}\n        className={cx(styles.toastIcon, classNames?.icon)}\n        style={slotStyles?.icon as React.CSSProperties & Record<`--fa-font-${string}`, string>}\n      />\n\n      <div className={cx(styles.toastContent, classNames?.content)} style={slotStyles?.content}>\n        {content}\n      </div>\n\n      {showCloseButton && (\n        <ActionIcon\n          icon={faXmark}\n          onClick={() => onDismiss(id)}\n          className={cx(styles.toastCloseButton, classNames?.closeButton)}\n          style={slotStyles?.closeButton}\n          aria-label='Close'\n        />\n      )}\n\n      {showRemainingTime && duration > 0 && (\n        <div\n          className={cx(styles.toastProgressBar, classNames?.progressBar)}\n          style={{ '--toast-duration': `${duration}ms`, ...slotStyles?.progressBar } as React.CSSProperties}\n        />\n      )}\n    </div>\n  );\n}\n\nexport default Toast;\n"],"mappings":"ifAuBA,IAAM,EAAY,CAChB,KAAM,EACN,QAAS,EACT,MAAO,EACP,KAAM,EACN,QAAS,CACX,EAEA,SAAS,EAAM,CAAE,OAAM,WAAU,aAAyB,CACxD,GAAM,CAAE,KAAI,UAAS,UAAS,cAAe,EACvC,CAAE,WAAU,oBAAmB,kBAAiB,eAAc,OAAM,aAAY,OAAQ,GAAe,EAEvG,CAAC,EAAS,GAAc,EAAS,EAAK,EACtC,CAAC,EAAS,GAAc,EAAS,EAAK,EAEtC,CAAC,EAAQ,GAAa,EAAS,EAAK,EACpC,CAAE,IAAK,EAAU,cAAe,EAAgC,CACpE,cAAiB,CACf,EAAU,EAAI,EACd,EAAU,CAAE,CACd,CACF,CAAC,EAEK,EAAU,IAAiB,GAAW,IAAa,EAInD,EAAe,EAAO,CAAQ,EAYpC,OAVA,MAAgB,CACd,GAAI,IAAa,GAAK,EAAQ,OAC9B,IAAM,EAAQ,KAAK,IAAI,EACjB,EAAQ,eAAiB,EAAU,CAAE,EAAG,EAAa,OAAO,EAClE,UAAa,CACX,aAAa,CAAK,EAClB,EAAa,SAAW,KAAK,IAAI,EAAI,CACvC,CACF,EAAG,CAAC,EAAI,EAAU,EAAW,CAAM,CAAC,EAGlC,EAAC,MAAD,CACE,IAAK,EACL,UAAW,EACT,EAAO,MACP,EAAW,EAAO,YAAc,KAChC,EAAO,SAAS,KAChB,GAAc,CAAC,GAAU,EAAO,gBAChC,GAAU,EAAO,YACjB,GAAY,IACd,EACA,MAAO,GAAY,KACnB,aAAc,MAAqB,EAAW,EAAI,EAAI,IAAA,GACtD,aAAc,MAAqB,EAAW,EAAK,EAAI,IAAA,GACvD,QAAS,MAAqB,EAAW,EAAI,EAAI,IAAA,GACjD,OAAQ,MAAqB,EAAW,EAAK,EAAI,IAAA,GAdnD,SAAA,CAgBE,EAAC,EAAD,CACE,KAAM,EAAU,GAChB,UAAW,EAAG,EAAO,UAAW,GAAY,IAAI,EAChD,MAAO,GAAY,IACpB,CAAA,EAED,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,aAAc,GAAY,OAAO,EAAG,MAAO,GAAY,QAC9E,SAAA,CACE,CAAA,EAEJ,GACC,EAAC,EAAD,CACE,KAAM,EACN,YAAe,EAAU,CAAE,EAC3B,UAAW,EAAG,EAAO,iBAAkB,GAAY,WAAW,EAC9D,MAAO,GAAY,YACnB,aAAW,OACZ,CAAA,EAGF,GAAqB,EAAW,GAC/B,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,iBAAkB,GAAY,WAAW,EAC9D,MAAO,CAAE,mBAAoB,GAAG,EAAS,IAAK,GAAG,GAAY,WAAY,CAC1E,CAAA,CAEA,GAET"}

package/dist/esm/common/toast/toast.module.mjs

@@ -1,2 +1,2 @@
-var e={container:`container_krdsW`,"container-top-left":`container-top-left_zfDTO`,containerTopLeft:`container-top-left_zfDTO`,"container-top-center":`container-top-center_CUIGc`,containerTopCenter:`container-top-center_CUIGc`,"container-top-right":`container-top-right_sB0KU`,containerTopRight:`container-top-right_sB0KU`,"container-bottom-left":`container-bottom-left_toJdF`,containerBottomLeft:`container-bottom-left_toJdF`,"container-bottom-center":`container-bottom-center_Bkf9m`,containerBottomCenter:`container-bottom-center_Bkf9m`,"container-bottom-right":`container-bottom-right_oRSMc`,containerBottomRight:`container-bottom-right_oRSMc`,toast:`toast_qBi4o`,toastSlideDown:`toastSlideDown_4lKWq`,"toast-bottom":`toast-bottom_X8ZIe`,toastBottom:`toast-bottom_X8ZIe`,toastSlideUp:`toastSlideUp_SGR5X`,"toast-dismissing":`toast-dismissing_xKmB-`,toastDismissing:`toast-dismissing_xKmB-`,toastFadeOut:`toastFadeOut_cvHYp`,"toast-paused":`toast-paused_NPmT4`,toastPaused:`toast-paused_NPmT4`,toastProgressBar:`toastProgressBar_6vBs6`,"toast-info":`toast-info_RlLli`,toastInfo:`toast-info_RlLli`,toastIcon:`toastIcon_xU1nA`,"toast-success":`toast-success_I1g1B`,toastSuccess:`toast-success_I1g1B`,"toast-error":`toast-error_MloFO`,toastError:`toast-error_MloFO`,"toast-warn":`toast-warn_pP6HB`,toastWarn:`toast-warn_pP6HB`,"toast-default":`toast-default_RTt2L`,toastDefault:`toast-default_RTt2L`,toastContent:`toastContent_gvyIv`,toastCloseButton:`toastCloseButton_n-YST`,toastShrink:`toastShrink_h89HS`};export{e as default};
+var e=`container_krdsW`,t=`container-top-left_zfDTO`,n=`container-top-center_CUIGc`,r=`container-top-right_sB0KU`,i=`container-bottom-left_toJdF`,a=`container-bottom-center_Bkf9m`,o=`container-bottom-right_oRSMc`,s=`toast_qBi4o`,c=`toastSlideDown_4lKWq`,l=`toast-bottom_X8ZIe`,u=`toastSlideUp_SGR5X`,d=`toast-dismissing_xKmB-`,f=`toastFadeOut_cvHYp`,p=`toast-paused_NPmT4`,m=`toastProgressBar_6vBs6`,h=`toast-info_RlLli`,g=`toastIcon_xU1nA`,_=`toast-success_I1g1B`,v=`toast-error_MloFO`,y=`toast-warn_pP6HB`,b=`toast-default_RTt2L`,x=`toastContent_gvyIv`,S=`toastCloseButton_n-YST`,C=`toastShrink_h89HS`,w={container:e,"container-top-left":`container-top-left_zfDTO`,containerTopLeft:t,"container-top-center":`container-top-center_CUIGc`,containerTopCenter:n,"container-top-right":`container-top-right_sB0KU`,containerTopRight:r,"container-bottom-left":`container-bottom-left_toJdF`,containerBottomLeft:i,"container-bottom-center":`container-bottom-center_Bkf9m`,containerBottomCenter:a,"container-bottom-right":`container-bottom-right_oRSMc`,containerBottomRight:o,toast:s,toastSlideDown:c,"toast-bottom":`toast-bottom_X8ZIe`,toastBottom:l,toastSlideUp:u,"toast-dismissing":`toast-dismissing_xKmB-`,toastDismissing:d,toastFadeOut:f,"toast-paused":`toast-paused_NPmT4`,toastPaused:p,toastProgressBar:m,"toast-info":`toast-info_RlLli`,toastInfo:h,toastIcon:g,"toast-success":`toast-success_I1g1B`,toastSuccess:_,"toast-error":`toast-error_MloFO`,toastError:v,"toast-warn":`toast-warn_pP6HB`,toastWarn:y,"toast-default":`toast-default_RTt2L`,toastDefault:b,toastContent:x,toastCloseButton:S,toastShrink:C};export{e as container,a as containerBottomCenter,i as containerBottomLeft,o as containerBottomRight,n as containerTopCenter,t as containerTopLeft,r as containerTopRight,w as default,s as toast,l as toastBottom,S as toastCloseButton,x as toastContent,b as toastDefault,d as toastDismissing,v as toastError,f as toastFadeOut,g as toastIcon,h as toastInfo,p as toastPaused,m as toastProgressBar,C as toastShrink,c as toastSlideDown,u as toastSlideUp,_ as toastSuccess,y as toastWarn};
 //# sourceMappingURL=toast.module.mjs.map

package/dist/esm/common/toast/toast.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"toast.module.mjs","names":[],"sources":["../../../../package/common/toast/toast.module.pcss"],"sourcesContent":[".container {\n  position: fixed;\n  z-index: 9999;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  pointer-events: none;\n  padding: 16px;\n  box-sizing: border-box;\n\n  &-top-left {\n    top: 0;\n    left: 0;\n    align-items: flex-start;\n  }\n\n  &-top-center {\n    top: 0;\n    left: 50%;\n    transform: translateX(-50%);\n    align-items: center;\n  }\n\n  &-top-right {\n    top: 0;\n    right: 0;\n    align-items: flex-end;\n  }\n\n  &-bottom-left {\n    bottom: 0;\n    left: 0;\n    align-items: flex-start;\n    flex-direction: column-reverse;\n  }\n\n  &-bottom-center {\n    bottom: 0;\n    left: 50%;\n    transform: translateX(-50%);\n    align-items: center;\n    flex-direction: column-reverse;\n  }\n\n  &-bottom-right {\n    bottom: 0;\n    right: 0;\n    align-items: flex-end;\n    flex-direction: column-reverse;\n  }\n}\n\n.toast {\n  pointer-events: all;\n  display: flex;\n  align-items: flex-start;\n  gap: 10px;\n  padding: 12px 14px;\n  border-radius: var(--default-border-radius);\n  background: var(--background-modal);\n  color: var(--text-color);\n  font-family: var(--default-font);\n  box-shadow: var(--card-shadow);\n  min-width: 240px;\n  max-width: 380px;\n  box-sizing: border-box;\n  position: relative;\n  /* Tells the browser vertical panning is native (so the page can still scroll behind the toast)\n     while horizontal movement is left for useSwipeDismiss's own pointer handling to decide. */\n  touch-action: pan-y;\n  overflow: hidden;\n  animation: toastSlideDown 0.25s ease forwards;\n\n  &-bottom {\n    animation: toastSlideUp 0.25s ease forwards;\n  }\n\n  &-dismissing {\n    animation: toastFadeOut 0.2s ease forwards;\n  }\n\n  &-paused .toastProgressBar {\n    animation-play-state: paused;\n  }\n\n  &-info {\n    border-left: 3px solid var(--info-color, #3b82f6);\n\n    .toastIcon {\n      color: var(--info-color, #3b82f6);\n    }\n  }\n\n  &-success {\n    border-left: 3px solid var(--success-color);\n\n    .toastIcon {\n      color: var(--success-color);\n    }\n  }\n\n  &-error {\n    border-left: 3px solid var(--error-color, #ef4444);\n\n    .toastIcon {\n      color: var(--error-color, #ef4444);\n    }\n  }\n\n  &-warn {\n    border-left: 3px solid var(--warn-color);\n\n    .toastIcon {\n      color: var(--warn-color);\n    }\n  }\n\n  &-default {\n    border-left: 3px solid var(--primary-color);\n\n    .toastIcon {\n      color: var(--primary-color);\n    }\n  }\n}\n\n.toastIcon {\n  flex-shrink: 0;\n  margin-top: 1px;\n  font-size: 15px;\n}\n\n.toastContent {\n  flex: 1;\n  font-size: 14px;\n  line-height: 1.4;\n}\n\n.toastCloseButton {\n  flex-shrink: 0;\n  background: none;\n  border: none;\n  cursor: pointer;\n  -webkit-tap-highlight-color: transparent;\n  padding: 0;\n  color: var(--text-dark);\n  font-size: 13px;\n  opacity: 0.6;\n  transition: opacity 0.15s;\n  margin-top: 1px;\n\n  &:hover {\n    opacity: 1;\n  }\n}\n\n.toastProgressBar {\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  height: 3px;\n  width: 100%;\n  background: currentColor;\n  opacity: 0.35;\n  transform-origin: left;\n  animation: toastShrink var(--toast-duration) linear forwards;\n}\n\n@keyframes toastSlideDown {\n  from {\n    opacity: 0;\n    transform: translateY(-12px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes toastSlideUp {\n  from {\n    opacity: 0;\n    transform: translateY(12px);\n  }\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes toastFadeOut {\n  from {\n    opacity: 1;\n    transform: scale(1);\n  }\n  to {\n    opacity: 0;\n    transform: scale(0.92);\n  }\n}\n\n@keyframes toastShrink {\n  from {\n    transform: scaleX(1);\n  }\n  to {\n    transform: scaleX(0);\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"toast.module.mjs","names":[],"sources":["../../../../package/common/toast/toast.module.pcss"],"sourcesContent":[".container {\n  position: fixed;\n  z-index: 9999;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  pointer-events: none;\n  padding: 16px;\n  box-sizing: border-box;\n\n  &-top-left {\n    top: 0;\n    left: 0;\n    align-items: flex-start;\n  }\n\n  &-top-center {\n    top: 0;\n    left: 50%;\n    transform: translateX(-50%);\n    align-items: center;\n  }\n\n  &-top-right {\n    top: 0;\n    right: 0;\n    align-items: flex-end;\n  }\n\n  &-bottom-left {\n    bottom: 0;\n    left: 0;\n    align-items: flex-start;\n    flex-direction: column-reverse;\n  }\n\n  &-bottom-center {\n    bottom: 0;\n    left: 50%;\n    transform: translateX(-50%);\n    align-items: center;\n    flex-direction: column-reverse;\n  }\n\n  &-bottom-right {\n    bottom: 0;\n    right: 0;\n    align-items: flex-end;\n    flex-direction: column-reverse;\n  }\n}\n\n.toast {\n  pointer-events: all;\n  display: flex;\n  align-items: flex-start;\n  gap: 10px;\n  padding: 12px 14px;\n  border-radius: var(--default-border-radius);\n  background: var(--background-modal);\n  color: var(--text-color);\n  font-family: var(--default-font);\n  box-shadow: var(--card-shadow);\n  min-width: 240px;\n  max-width: 380px;\n  box-sizing: border-box;\n  position: relative;\n\n  /* Tells the browser vertical panning is native (so the page can still scroll behind the toast)\n     while horizontal movement is left for useSwipeDismiss's own pointer handling to decide. */\n  touch-action: pan-y;\n  overflow: hidden;\n  animation: toastSlideDown 0.25s ease forwards;\n\n  &-bottom {\n    animation: toastSlideUp 0.25s ease forwards;\n  }\n\n  &-dismissing {\n    animation: toastFadeOut 0.2s ease forwards;\n  }\n\n  &-paused .toastProgressBar {\n    animation-play-state: paused;\n  }\n\n  &-info {\n    border-left: 3px solid var(--info-color, #3b82f6);\n\n    .toastIcon {\n      color: var(--info-color, #3b82f6);\n    }\n  }\n\n  &-success {\n    border-left: 3px solid var(--success-color);\n\n    .toastIcon {\n      color: var(--success-color);\n    }\n  }\n\n  &-error {\n    border-left: 3px solid var(--error-color, #ef4444);\n\n    .toastIcon {\n      color: var(--error-color, #ef4444);\n    }\n  }\n\n  &-warn {\n    border-left: 3px solid var(--warn-color);\n\n    .toastIcon {\n      color: var(--warn-color);\n    }\n  }\n\n  &-default {\n    border-left: 3px solid var(--primary-color);\n\n    .toastIcon {\n      color: var(--primary-color);\n    }\n  }\n}\n\n.toastIcon {\n  flex-shrink: 0;\n  margin-top: 1px;\n  font-size: 15px;\n}\n\n.toastContent {\n  flex: 1;\n  font-size: 14px;\n  line-height: 1.4;\n}\n\n.toastCloseButton {\n  flex-shrink: 0;\n  background: none;\n  border: none;\n  cursor: pointer;\n  -webkit-tap-highlight-color: transparent;\n  padding: 0;\n  color: var(--text-dark);\n  font-size: 13px;\n  opacity: 0.6;\n  transition: opacity 0.15s;\n  margin-top: 1px;\n\n  &:hover {\n    opacity: 1;\n  }\n}\n\n.toastProgressBar {\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  height: 3px;\n  width: 100%;\n  background: currentcolor;\n  opacity: 0.35;\n  transform-origin: left;\n  animation: toastShrink var(--toast-duration) linear forwards;\n}\n\n@keyframes toastSlideDown {\n  from {\n    opacity: 0;\n    transform: translateY(-12px);\n  }\n\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes toastSlideUp {\n  from {\n    opacity: 0;\n    transform: translateY(12px);\n  }\n\n  to {\n    opacity: 1;\n    transform: translateY(0);\n  }\n}\n\n@keyframes toastFadeOut {\n  from {\n    opacity: 1;\n    transform: scale(1);\n  }\n\n  to {\n    opacity: 0;\n    transform: scale(0.92);\n  }\n}\n\n@keyframes toastShrink {\n  from {\n    transform: scaleX(1);\n  }\n\n  to {\n    transform: scaleX(0);\n  }\n}\n"],"mappings":""}

package/dist/esm/common/toast/toastProvider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"toastProvider.mjs","names":[],"sources":["../../../../package/common/toast/toastProvider.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef, useState } from 'react';\nimport cx from 'classnames';\nimport BodyEnd from 'components/common/bodyEnd';\n\nimport styles from './toast.module.pcss';\nimport Toast from './toast';\nimport { _registerToastHandler, _unregisterToastHandler } from './toastService';\nimport type { ToastContextConfig, ToastItem, ToastOptions, ResolvedToastOptions, ToastPosition } from './toast.types';\nimport type { ReactNode } from 'react';\n\nconst DEFAULTS: Required<ToastContextConfig> = {\n  position: 'top-right',\n  duration: 4000,\n  showRemainingTime: true,\n  showCloseButton: true,\n  allowStacking: true,\n  pauseOnHover: true,\n};\n\nconst DISMISS_ANIMATION_MS = 220;\n\nfunction positionToClass(position: ToastPosition): string {\n  return styles[`container-${position}`];\n}\n\ninterface ToastProviderProps extends ToastContextConfig {\n  children: ReactNode;\n}\n\nfunction ToastProvider({\n  children,\n  position = DEFAULTS.position,\n  duration = DEFAULTS.duration,\n  showRemainingTime = DEFAULTS.showRemainingTime,\n  showCloseButton = DEFAULTS.showCloseButton,\n  allowStacking = DEFAULTS.allowStacking,\n  pauseOnHover = DEFAULTS.pauseOnHover,\n}: ToastProviderProps) {\n  const [toasts, setToasts] = useState<ToastItem[]>([]);\n  const counterRef = useRef(0);\n\n  const dismiss = useCallback((id: string) => {\n    setToasts((prev) =>\n      prev.map((t) => (t.id === id ? { ...t, dismissing: true } : t)),\n    );\n    setTimeout(() => {\n      setToasts((prev) => prev.filter((t) => t.id !== id));\n    }, DISMISS_ANIMATION_MS);\n  }, []);\n\n  const addToast = useCallback(\n    (content: ReactNode, options?: ToastOptions) => {\n      const resolved: ResolvedToastOptions = {\n        position: options?.position ?? position,\n        duration: options?.duration ?? duration,\n        showRemainingTime: options?.showRemainingTime ?? showRemainingTime,\n        showCloseButton: options?.showCloseButton ?? showCloseButton,\n        pauseOnHover: options?.pauseOnHover ?? pauseOnHover,\n        type: options?.type ?? 'default',\n        classNames: options?.classNames,\n        styles: options?.styles,\n      };\n\n      counterRef.current += 1;\n      const id = `toast-${counterRef.current}`;\n      const newToast: ToastItem = { id, content, options: resolved, dismissing: false };\n\n      setToasts((prev) => {\n        if (!allowStacking && prev.length > 0) {\n          // Mark all existing as dismissing, then replace\n          setTimeout(() => {\n            setToasts([newToast]);\n          }, DISMISS_ANIMATION_MS);\n          return prev.map((t) => ({ ...t, dismissing: true }));\n        }\n        return [...prev, newToast];\n      });\n    },\n    [position, duration, showRemainingTime, showCloseButton, allowStacking, pauseOnHover],\n  );\n\n  useEffect(() => {\n    _registerToastHandler(addToast);\n    return () => _unregisterToastHandler();\n  }, [addToast]);\n\n  // Group toasts by position so per-toast position overrides work correctly\n  const byPosition = toasts.reduce<Record<string, ToastItem[]>>((acc, t) => {\n    const pos = t.options.position;\n    if (!acc[pos]) acc[pos] = [];\n    acc[pos].push(t);\n    return acc;\n  }, {});\n\n  return (\n    <>\n      {children}\n      <BodyEnd>\n        {Object.entries(byPosition).map(([pos, items]) => (\n          <div\n            key={pos}\n            className={cx(styles.container, positionToClass(pos as typeof position))}\n          >\n            {items.map((item) => (\n              <Toast\n                key={item.id}\n                item={item}\n                isBottom={pos.startsWith('bottom')}\n                onDismiss={dismiss}\n              />\n            ))}\n          </div>\n        ))}\n      </BodyEnd>\n    </>\n  );\n}\n\nexport default ToastProvider;\nexport type { ToastProviderProps };\n"],"mappings":"kWAUA,IAAM,EAAyC,CAC7C,SAAU,YACV,SAAU,IACV,kBAAmB,GACnB,gBAAiB,GACjB,cAAe,GACf,aAAc,EAChB,EAEM,EAAuB,IAE7B,SAAS,EAAgB,EAAiC,CACxD,OAAO,EAAO,aAAa,IAC7B,CAMA,SAAS,EAAc,CACrB,WACA,WAAW,EAAS,SACpB,WAAW,EAAS,SACpB,oBAAoB,EAAS,kBAC7B,kBAAkB,EAAS,gBAC3B,gBAAgB,EAAS,cACzB,eAAe,EAAS,cACH,CACrB,GAAM,CAAC,EAAQ,GAAa,EAAsB,CAAC,CAAC,EAC9C,EAAa,EAAO,CAAC,EAErB,EAAU,EAAa,GAAe,CAC1C,EAAW,GACT,EAAK,IAAK,GAAO,EAAE,KAAO,EAAK,CAAE,GAAG,EAAG,WAAY,EAAK,EAAI,CAAE,CAChE,EACA,eAAiB,CACf,EAAW,GAAS,EAAK,OAAQ,GAAM,EAAE,KAAO,CAAE,CAAC,CACrD,EAAG,CAAoB,CACzB,EAAG,CAAC,CAAC,EAEC,EAAW,GACd,EAAoB,IAA2B,CAC9C,IAAM,EAAiC,CACrC,SAAU,GAAS,UAAY,EAC/B,SAAU,GAAS,UAAY,EAC/B,kBAAmB,GAAS,mBAAqB,EACjD,gBAAiB,GAAS,iBAAmB,EAC7C,aAAc,GAAS,cAAgB,EACvC,KAAM,GAAS,MAAQ,UACvB,WAAY,GAAS,WACrB,OAAQ,GAAS,MACnB,EAEA,EAAW,SAAW,EAEtB,IAAM,EAAsB,CAAE,GAAA,SADV,EAAW,UACG,UAAS,QAAS,EAAU,WAAY,EAAM,EAEhF,EAAW,GACL,CAAC,GAAiB,EAAK,OAAS,GAElC,eAAiB,CACf,EAAU,CAAC,CAAQ,CAAC,CACtB,EAAG,CAAoB,EAChB,EAAK,IAAK,IAAO,CAAE,GAAG,EAAG,WAAY,EAAK,EAAE,GAE9C,CAAC,GAAG,EAAM,CAAQ,CAC1B,CACH,EACA,CAAC,EAAU,EAAU,EAAmB,EAAiB,EAAe,CAAY,CACtF,EAEA,OACE,EAAsB,CAAQ,MACjB,EAAwB,GACpC,CAAC,CAAQ,CAAC,EAGb,IAAM,EAAa,EAAO,QAAqC,EAAK,IAAM,CACxE,IAAM,EAAM,EAAE,QAAQ,SAGtB,OAFK,EAAI,KAAM,EAAI,GAAO,CAAC,GAC3B,EAAI,GAAK,KAAK,CAAC,EACR,CACT,EAAG,CAAC,CAAC,EAEL,OACE,EAAA,EAAA,CAAA,SAAA,CACG,EACD,EAAC,EAAD,CAAA,SACG,OAAO,QAAQ,CAAU,EAAE,KAAK,CAAC,EAAK,KACrC,EAAC,MAAD,CAEE,UAAW,EAAG,EAAO,UAAW,EAAgB,CAAsB,CAAC,WAEtE,EAAM,IAAK,GACV,EAAC,EAAD,CAEQ,OACN,SAAU,EAAI,WAAW,QAAQ,EACjC,UAAW,CACZ,EAJM,EAAK,EAIX,CACF,CACE,EAXE,CAWF,CACN,CACM,CAAA,CACT,CAAA,CAAA,CAEN"}
+{"version":3,"file":"toastProvider.mjs","names":[],"sources":["../../../../package/common/toast/toastProvider.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef, useState } from 'react';\nimport cx from 'classnames';\nimport BodyEnd from 'components/common/bodyEnd';\n\nimport styles from './toast.module.pcss';\nimport Toast from './toast';\nimport { _registerToastHandler, _unregisterToastHandler } from './toastService';\nimport type { ToastContextConfig, ToastItem, ToastOptions, ResolvedToastOptions, ToastPosition } from './toast.types';\nimport type { ReactNode } from 'react';\n\nconst DEFAULTS: Required<ToastContextConfig> = {\n  position: 'top-right',\n  duration: 4000,\n  showRemainingTime: true,\n  showCloseButton: true,\n  allowStacking: true,\n  pauseOnHover: true,\n};\n\nconst DISMISS_ANIMATION_MS = 220;\n\nfunction positionToClass(position: ToastPosition): string {\n  return styles[`container-${position}`];\n}\n\ninterface ToastProviderProps extends ToastContextConfig {\n  children: ReactNode;\n}\n\nfunction ToastProvider({\n  children,\n  position = DEFAULTS.position,\n  duration = DEFAULTS.duration,\n  showRemainingTime = DEFAULTS.showRemainingTime,\n  showCloseButton = DEFAULTS.showCloseButton,\n  allowStacking = DEFAULTS.allowStacking,\n  pauseOnHover = DEFAULTS.pauseOnHover,\n}: ToastProviderProps) {\n  const [toasts, setToasts] = useState<ToastItem[]>([]);\n  const counterRef = useRef(0);\n\n  const dismiss = useCallback((id: string) => {\n    setToasts((prev) => prev.map((t) => (t.id === id ? { ...t, dismissing: true } : t)));\n    setTimeout(() => {\n      setToasts((prev) => prev.filter((t) => t.id !== id));\n    }, DISMISS_ANIMATION_MS);\n  }, []);\n\n  const addToast = useCallback(\n    (content: ReactNode, options?: ToastOptions) => {\n      const resolved: ResolvedToastOptions = {\n        position: options?.position ?? position,\n        duration: options?.duration ?? duration,\n        showRemainingTime: options?.showRemainingTime ?? showRemainingTime,\n        showCloseButton: options?.showCloseButton ?? showCloseButton,\n        pauseOnHover: options?.pauseOnHover ?? pauseOnHover,\n        type: options?.type ?? 'default',\n        classNames: options?.classNames,\n        styles: options?.styles,\n      };\n\n      counterRef.current += 1;\n      const id = `toast-${counterRef.current}`;\n      const newToast: ToastItem = { id, content, options: resolved, dismissing: false };\n\n      setToasts((prev) => {\n        if (!allowStacking && prev.length > 0) {\n          // Mark all existing as dismissing, then replace\n          setTimeout(() => {\n            setToasts([newToast]);\n          }, DISMISS_ANIMATION_MS);\n          return prev.map((t) => ({ ...t, dismissing: true }));\n        }\n        return [...prev, newToast];\n      });\n    },\n    [position, duration, showRemainingTime, showCloseButton, allowStacking, pauseOnHover],\n  );\n\n  useEffect(() => {\n    _registerToastHandler(addToast);\n    return () => _unregisterToastHandler();\n  }, [addToast]);\n\n  // Group toasts by position so per-toast position overrides work correctly\n  const byPosition = toasts.reduce<Record<string, ToastItem[]>>((acc, t) => {\n    const pos = t.options.position;\n    if (!acc[pos]) acc[pos] = [];\n    acc[pos].push(t);\n    return acc;\n  }, {});\n\n  return (\n    <>\n      {children}\n      <BodyEnd>\n        {Object.entries(byPosition).map(([pos, items]) => (\n          <div key={pos} className={cx(styles.container, positionToClass(pos as typeof position))}>\n            {items.map((item) => (\n              <Toast key={item.id} item={item} isBottom={pos.startsWith('bottom')} onDismiss={dismiss} />\n            ))}\n          </div>\n        ))}\n      </BodyEnd>\n    </>\n  );\n}\n\nexport default ToastProvider;\nexport type { ToastProviderProps };\n"],"mappings":"kWAUA,IAAM,EAAyC,CAC7C,SAAU,YACV,SAAU,IACV,kBAAmB,GACnB,gBAAiB,GACjB,cAAe,GACf,aAAc,EAChB,EAEM,EAAuB,IAE7B,SAAS,EAAgB,EAAiC,CACxD,OAAO,EAAO,aAAa,IAC7B,CAMA,SAAS,EAAc,CACrB,WACA,WAAW,EAAS,SACpB,WAAW,EAAS,SACpB,oBAAoB,EAAS,kBAC7B,kBAAkB,EAAS,gBAC3B,gBAAgB,EAAS,cACzB,eAAe,EAAS,cACH,CACrB,GAAM,CAAC,EAAQ,GAAa,EAAsB,CAAC,CAAC,EAC9C,EAAa,EAAO,CAAC,EAErB,EAAU,EAAa,GAAe,CAC1C,EAAW,GAAS,EAAK,IAAK,GAAO,EAAE,KAAO,EAAK,CAAE,GAAG,EAAG,WAAY,EAAK,EAAI,CAAE,CAAC,EACnF,eAAiB,CACf,EAAW,GAAS,EAAK,OAAQ,GAAM,EAAE,KAAO,CAAE,CAAC,CACrD,EAAG,CAAoB,CACzB,EAAG,CAAC,CAAC,EAEC,EAAW,GACd,EAAoB,IAA2B,CAC9C,IAAM,EAAiC,CACrC,SAAU,GAAS,UAAY,EAC/B,SAAU,GAAS,UAAY,EAC/B,kBAAmB,GAAS,mBAAqB,EACjD,gBAAiB,GAAS,iBAAmB,EAC7C,aAAc,GAAS,cAAgB,EACvC,KAAM,GAAS,MAAQ,UACvB,WAAY,GAAS,WACrB,OAAQ,GAAS,MACnB,EAEA,EAAW,SAAW,EAEtB,IAAM,EAAsB,CAAE,GAAA,SADV,EAAW,UACG,UAAS,QAAS,EAAU,WAAY,EAAM,EAEhF,EAAW,GACL,CAAC,GAAiB,EAAK,OAAS,GAElC,eAAiB,CACf,EAAU,CAAC,CAAQ,CAAC,CACtB,EAAG,CAAoB,EAChB,EAAK,IAAK,IAAO,CAAE,GAAG,EAAG,WAAY,EAAK,EAAE,GAE9C,CAAC,GAAG,EAAM,CAAQ,CAC1B,CACH,EACA,CAAC,EAAU,EAAU,EAAmB,EAAiB,EAAe,CAAY,CACtF,EAEA,OACE,EAAsB,CAAQ,MACjB,EAAwB,GACpC,CAAC,CAAQ,CAAC,EAGb,IAAM,EAAa,EAAO,QAAqC,EAAK,IAAM,CACxE,IAAM,EAAM,EAAE,QAAQ,SAGtB,OAFK,EAAI,KAAM,EAAI,GAAO,CAAC,GAC3B,EAAI,EAAI,CAAC,KAAK,CAAC,EACR,CACT,EAAG,CAAC,CAAC,EAEL,OACE,EAAA,EAAA,CAAA,SAAA,CACG,EACD,EAAC,EAAD,CAAA,SACG,OAAO,QAAQ,CAAU,CAAC,CAAC,KAAK,CAAC,EAAK,KACrC,EAAC,MAAD,CAAe,UAAW,EAAG,EAAO,UAAW,EAAgB,CAAsB,CAAC,EACnF,SAAA,EAAM,IAAK,GACV,EAAC,EAAD,CAA2B,OAAM,SAAU,EAAI,WAAW,QAAQ,EAAG,UAAW,CAAU,EAA9E,EAAK,EAAyE,CAC3F,CACE,EAJK,CAIL,CACN,CACM,CAAA,CACT,CAAA,CAAA,CAEN"}

package/dist/esm/common/tooltip/tooltip.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.mjs","names":[],"sources":["../../../../package/common/tooltip/tooltip.tsx"],"sourcesContent":["import React, { useLayoutEffect, useRef, useState } from 'react';\nimport cx from 'classnames';\nimport BodyEnd from 'components/common/bodyEnd';\nimport { useFloatingPosition } from '../floatingMenu/useFloatingPosition';\nimport styles from './tooltip.module.pcss';\nimport type { TooltipProps } from './tooltip.types';\n\nexport default function Tooltip({\n  variant,\n  message = '',\n  isVisible = true,\n  tooltipPosition,\n  onClick,\n}: TooltipProps) {\n  const [detailsHovered, setDetailsHovered] = useState(false);\n\n  const sentinelRef = useRef<HTMLSpanElement>(null);\n  const detailsRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useRef<HTMLElement | null>(null);\n  const anchorRef = useRef<HTMLDivElement>(null);\n  const panelRef = useRef<HTMLDivElement>(null);\n  const [triggerWidth, setTriggerWidth] = useState(10);\n\n  const shown = variant === 'details' ? detailsHovered : isVisible;\n\n  useLayoutEffect(() => {\n    triggerRef.current = variant === 'details' ? detailsRef.current : (sentinelRef.current?.parentElement ?? null);\n  });\n\n  useLayoutEffect(() => {\n    if (shown) {\n      const rect = triggerRef.current?.getBoundingClientRect();\n      setTriggerWidth(rect?.width ?? 10);\n    }\n  }, [shown]);\n\n  useFloatingPosition({\n    isOpen: shown,\n    triggerRef,\n    anchorRef,\n    panelRef,\n    flipClassName: styles.tooltipAnchorFlip,\n    placement: 'top',\n  });\n\n  const bubble = shown && (\n    <BodyEnd>\n      <div\n        ref={anchorRef}\n        className={styles.tooltipAnchor}\n        style={{ width: `${triggerWidth}px`, '--tooltip-trigger-width': `${triggerWidth}px` } as React.CSSProperties}\n      >\n        <div\n          ref={panelRef}\n          className={cx(variant === 'error' ? styles.tooltipError : styles.tooltipBubble, tooltipPosition)}\n          onClick={onClick}\n        >\n          {message}\n        </div>\n      </div>\n    </BodyEnd>\n  );\n\n  if (variant === 'details') {\n    return (\n      <div ref={detailsRef} className={styles.tooltipDetails}>\n        <span\n          className={styles.tooltipDetailsIcon}\n          onMouseEnter={() => setDetailsHovered(true)}\n          onMouseLeave={() => setDetailsHovered(false)}\n        >\n          ?\n        </span>\n        {bubble}\n      </div>\n    );\n  }\n\n  if (variant === 'info' || variant === 'error') {\n    return (\n      <>\n        <span ref={sentinelRef} style={{ display: 'none' }} />\n        {bubble}\n      </>\n    );\n  }\n\n  return null;\n}\n"],"mappings":"oTAOA,SAAwB,EAAQ,CAC9B,UACA,UAAU,GACV,YAAY,GACZ,kBACA,WACe,CACf,GAAM,CAAC,EAAgB,GAAqB,EAAS,EAAK,EAEpD,EAAc,EAAwB,IAAI,EAC1C,EAAa,EAAuB,IAAI,EACxC,EAAa,EAA2B,IAAI,EAC5C,EAAY,EAAuB,IAAI,EACvC,EAAW,EAAuB,IAAI,EACtC,CAAC,EAAc,GAAmB,EAAS,EAAE,EAE7C,EAAQ,IAAY,UAAY,EAAiB,EAEvD,MAAsB,CACpB,EAAW,QAAU,IAAY,UAAY,EAAW,QAAW,EAAY,SAAS,eAAiB,IAC3G,CAAC,EAED,MAAsB,CACpB,GAAI,EAAO,CACT,IAAM,EAAO,EAAW,SAAS,sBAAsB,EACvD,EAAgB,GAAM,OAAS,EAAE,CACnC,CACF,EAAG,CAAC,CAAK,CAAC,EAEV,EAAoB,CAClB,OAAQ,EACR,aACA,YACA,WACA,cAAe,EAAO,kBACtB,UAAW,KACb,CAAC,EAED,IAAM,EAAS,GACb,EAAC,EAAD,CAAA,SACE,EAAC,MAAD,CACE,IAAK,EACL,UAAW,EAAO,cAClB,MAAO,CAAE,MAAO,GAAG,EAAa,IAAK,0BAA2B,GAAG,EAAa,GAAI,WAEpF,EAAC,MAAD,CACE,IAAK,EACL,UAAW,EAAG,IAAY,QAAU,EAAO,aAAe,EAAO,cAAe,CAAe,EACtF,mBAER,CACE,CAAA,CACF,CAAA,CACE,CAAA,EA2BX,OAxBI,IAAY,UAEZ,EAAC,MAAD,CAAK,IAAK,EAAY,UAAW,EAAO,wBAAxC,CACE,EAAC,OAAD,CACE,UAAW,EAAO,mBAClB,iBAAoB,EAAkB,EAAI,EAC1C,iBAAoB,EAAkB,EAAK,WAC5C,GAEK,CAAA,EACL,CACE,IAIL,IAAY,QAAU,IAAY,QAElC,EAAA,EAAA,CAAA,SAAA,CACE,EAAC,OAAD,CAAM,IAAK,EAAa,MAAO,CAAE,QAAS,MAAO,CAAI,CAAA,EACpD,CACD,CAAA,CAAA,EAIC,IACT"}
+{"version":3,"file":"tooltip.mjs","names":[],"sources":["../../../../package/common/tooltip/tooltip.tsx"],"sourcesContent":["import React, { useLayoutEffect, useRef, useState } from 'react';\nimport cx from 'classnames';\nimport BodyEnd from 'components/common/bodyEnd';\nimport { useFloatingPosition } from '../floatingMenu/useFloatingPosition';\nimport styles from './tooltip.module.pcss';\nimport type { TooltipProps } from './tooltip.types';\n\nexport default function Tooltip({ variant, message = '', isVisible = true, tooltipPosition, onClick }: TooltipProps) {\n  const [detailsHovered, setDetailsHovered] = useState(false);\n\n  const sentinelRef = useRef<HTMLSpanElement>(null);\n  const detailsRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useRef<HTMLElement | null>(null);\n  const anchorRef = useRef<HTMLDivElement>(null);\n  const panelRef = useRef<HTMLDivElement>(null);\n  const [triggerWidth, setTriggerWidth] = useState(10);\n\n  const shown = variant === 'details' ? detailsHovered : isVisible;\n\n  useLayoutEffect(() => {\n    triggerRef.current = variant === 'details' ? detailsRef.current : (sentinelRef.current?.parentElement ?? null);\n  });\n\n  useLayoutEffect(() => {\n    if (shown) {\n      const rect = triggerRef.current?.getBoundingClientRect();\n      setTriggerWidth(rect?.width ?? 10);\n    }\n  }, [shown]);\n\n  useFloatingPosition({\n    isOpen: shown,\n    triggerRef,\n    anchorRef,\n    panelRef,\n    flipClassName: styles.tooltipAnchorFlip,\n    placement: 'top',\n  });\n\n  const bubble = shown && (\n    <BodyEnd>\n      <div\n        ref={anchorRef}\n        className={styles.tooltipAnchor}\n        style={{ width: `${triggerWidth}px`, '--tooltip-trigger-width': `${triggerWidth}px` } as React.CSSProperties}\n      >\n        <div\n          ref={panelRef}\n          className={cx(variant === 'error' ? styles.tooltipError : styles.tooltipBubble, tooltipPosition)}\n          onClick={onClick}\n        >\n          {message}\n        </div>\n      </div>\n    </BodyEnd>\n  );\n\n  if (variant === 'details') {\n    return (\n      <div ref={detailsRef} className={styles.tooltipDetails}>\n        <span\n          className={styles.tooltipDetailsIcon}\n          onMouseEnter={() => setDetailsHovered(true)}\n          onMouseLeave={() => setDetailsHovered(false)}\n        >\n          ?\n        </span>\n        {bubble}\n      </div>\n    );\n  }\n\n  if (variant === 'info' || variant === 'error') {\n    return (\n      <>\n        <span ref={sentinelRef} style={{ display: 'none' }} />\n        {bubble}\n      </>\n    );\n  }\n\n  return null;\n}\n"],"mappings":"oTAOA,SAAwB,EAAQ,CAAE,UAAS,UAAU,GAAI,YAAY,GAAM,kBAAiB,WAAyB,CACnH,GAAM,CAAC,EAAgB,GAAqB,EAAS,EAAK,EAEpD,EAAc,EAAwB,IAAI,EAC1C,EAAa,EAAuB,IAAI,EACxC,EAAa,EAA2B,IAAI,EAC5C,EAAY,EAAuB,IAAI,EACvC,EAAW,EAAuB,IAAI,EACtC,CAAC,EAAc,GAAmB,EAAS,EAAE,EAE7C,EAAQ,IAAY,UAAY,EAAiB,EAEvD,MAAsB,CACpB,EAAW,QAAU,IAAY,UAAY,EAAW,QAAW,EAAY,SAAS,eAAiB,IAC3G,CAAC,EAED,MAAsB,CACpB,GAAI,EAAO,CACT,IAAM,EAAO,EAAW,SAAS,sBAAsB,EACvD,EAAgB,GAAM,OAAS,EAAE,CACnC,CACF,EAAG,CAAC,CAAK,CAAC,EAEV,EAAoB,CAClB,OAAQ,EACR,aACA,YACA,WACA,cAAe,EAAO,kBACtB,UAAW,KACb,CAAC,EAED,IAAM,EAAS,GACb,EAAC,EAAD,CAAA,SACE,EAAC,MAAD,CACE,IAAK,EACL,UAAW,EAAO,cAClB,MAAO,CAAE,MAAO,GAAG,EAAa,IAAK,0BAA2B,GAAG,EAAa,GAAI,EAEpF,SAAA,EAAC,MAAD,CACE,IAAK,EACL,UAAW,EAAG,IAAY,QAAU,EAAO,aAAe,EAAO,cAAe,CAAe,EACtF,UAER,SAAA,CACE,CAAA,CACF,CAAA,CACE,CAAA,EA2BX,OAxBI,IAAY,UAEZ,EAAC,MAAD,CAAK,IAAK,EAAY,UAAW,EAAO,eAAxC,SAAA,CACE,EAAC,OAAD,CACE,UAAW,EAAO,mBAClB,iBAAoB,EAAkB,EAAI,EAC1C,iBAAoB,EAAkB,EAAK,EAC5C,SAAA,GAEK,CAAA,EACL,CACE,IAIL,IAAY,QAAU,IAAY,QAElC,EAAA,EAAA,CAAA,SAAA,CACE,EAAC,OAAD,CAAM,IAAK,EAAa,MAAO,CAAE,QAAS,MAAO,CAAI,CAAA,EACpD,CACD,CAAA,CAAA,EAIC,IACT"}

package/dist/esm/common/tooltip/tooltip.module.mjs

@@ -1,2 +1,2 @@
-var e={tooltipAnchor:`tooltipAnchor_Ew7Xk`,tooltipBubble:`tooltipBubble_uyev0`,"tooltip-anchor-flip":`tooltip-anchor-flip_qlJyz`,tooltipAnchorFlip:`tooltip-anchor-flip_qlJyz`,tooltipDetails:`tooltipDetails_R7N16`,"tooltipDetails-icon":`tooltipDetails-icon_rsjns`,tooltipDetailsIcon:`tooltipDetails-icon_rsjns`,tooltipError:`tooltipError_gUBut`};export{e as default};
+var e=`tooltipAnchor_Ew7Xk`,t=`tooltipBubble_uyev0`,n=`tooltip-anchor-flip_qlJyz`,r=`tooltipDetails_R7N16`,i=`tooltipDetails-icon_rsjns`,a=`tooltipError_gUBut`,o={tooltipAnchor:e,tooltipBubble:t,"tooltip-anchor-flip":`tooltip-anchor-flip_qlJyz`,tooltipAnchorFlip:n,tooltipDetails:r,"tooltipDetails-icon":`tooltipDetails-icon_rsjns`,tooltipDetailsIcon:i,tooltipError:a};export{o as default,e as tooltipAnchor,n as tooltipAnchorFlip,t as tooltipBubble,r as tooltipDetails,i as tooltipDetailsIcon,a as tooltipError};
 //# sourceMappingURL=tooltip.module.mjs.map

package/dist/esm/common/tooltip/tooltip.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.module.mjs","names":[],"sources":["../../../../package/common/tooltip/tooltip.module.pcss"],"sourcesContent":["\n.tooltipAnchor {\n  position: fixed;\n  z-index: 10;\n}\n\n.tooltipBubble {\n  position: absolute;\n  bottom: 0;\n  margin-bottom: 6px;\n  left: 0;\n  border-radius: 3px;\n  width: max-content;\n  max-width: 200px;\n  font-size: 12px;\n  background-color: #454953;\n  padding: 6px 9px;\n  color: white;\n  pointer-events: none;\n\n  .tooltip-anchor-flip & {\n    bottom: auto;\n    top: 0;\n    margin-bottom: 0;\n    margin-top: 6px;\n  }\n\n  &:after {\n    content: '';\n    position: absolute;\n    top: 100%;\n    left: calc(var(--tooltip-trigger-width, 10px) / 2 - 5px);\n    border-width: 5px;\n    border-style: solid;\n    border-color: #454953 transparent transparent transparent;\n  }\n\n  .tooltip-anchor-flip &:after {\n    top: auto;\n    bottom: 100%;\n    border-color: transparent transparent #454953 transparent;\n  }\n}\n\n.tooltipDetails {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n\n  &-icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 16px;\n    height: 16px;\n    border-radius: 50%;\n    font-size: 11px;\n    font-weight: 700;\n    background-color: #454953;\n    color: white;\n    cursor: default;\n    user-select: none;\n  }\n}\n\n.tooltipError {\n  position: absolute;\n  bottom: 0;\n  margin-bottom: 6px;\n  right: 0;\n  width: max-content;\n  border-radius: 3px;\n  background-color: var(--error-lighter);\n  color: var(--red);\n  font-size: 10px;\n  padding: 6px 9px;\n\n  .tooltip-anchor-flip & {\n    bottom: auto;\n    top: 0;\n    margin-bottom: 0;\n    margin-top: 6px;\n  }\n\n  &:after {\n    content: '';\n    position: absolute;\n    top: 100%;\n    right: 12px;\n    border-width: 5px;\n    border-style: solid;\n    border-color: var(--error-border-color) transparent transparent transparent;\n  }\n\n  .tooltip-anchor-flip &:after {\n    top: auto;\n    bottom: 100%;\n    border-color: transparent transparent var(--error-border-color) transparent;\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"tooltip.module.mjs","names":[],"sources":["../../../../package/common/tooltip/tooltip.module.pcss"],"sourcesContent":[".tooltipAnchor {\n  position: fixed;\n  z-index: 10;\n}\n\n.tooltipBubble {\n  position: absolute;\n  bottom: 0;\n  margin-bottom: 6px;\n  left: 0;\n  border-radius: 3px;\n  width: max-content;\n  max-width: 200px;\n  font-size: 12px;\n  background-color: #454953;\n  padding: 6px 9px;\n  color: white;\n  pointer-events: none;\n\n  .tooltip-anchor-flip & {\n    bottom: auto;\n    top: 0;\n    margin-bottom: 0;\n    margin-top: 6px;\n  }\n\n  &::after {\n    content: '';\n    position: absolute;\n    top: 100%;\n    left: calc(var(--tooltip-trigger-width, 10px) / 2 - 5px);\n    border-width: 5px;\n    border-style: solid;\n    border-color: #454953 transparent transparent;\n  }\n\n  .tooltip-anchor-flip &::after {\n    top: auto;\n    bottom: 100%;\n    border-color: transparent transparent #454953;\n  }\n}\n\n.tooltipDetails {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n\n  &-icon {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 16px;\n    height: 16px;\n    border-radius: 50%;\n    font-size: 11px;\n    font-weight: 700;\n    background-color: #454953;\n    color: white;\n    cursor: default;\n    user-select: none;\n  }\n}\n\n.tooltipError {\n  position: absolute;\n  bottom: 0;\n  margin-bottom: 6px;\n  right: 0;\n  width: max-content;\n  border-radius: 3px;\n  background-color: var(--error-lighter);\n  color: var(--red);\n  font-size: 10px;\n  padding: 6px 9px;\n\n  .tooltip-anchor-flip & {\n    bottom: auto;\n    top: 0;\n    margin-bottom: 0;\n    margin-top: 6px;\n  }\n\n  &::after {\n    content: '';\n    position: absolute;\n    top: 100%;\n    right: 12px;\n    border-width: 5px;\n    border-style: solid;\n    border-color: var(--error-border-color) transparent transparent transparent;\n  }\n\n  .tooltip-anchor-flip &::after {\n    top: auto;\n    bottom: 100%;\n    border-color: transparent transparent var(--error-border-color) transparent;\n  }\n}\n"],"mappings":""}

package/dist/esm/common/tree/flattenTree.mjs

@@ -0,0 +1,2 @@
+function e(t,n,r=0,i=null){return t.flatMap((a,o)=>{let s=a.children!==void 0,c=s&&n.includes(a.key),l={node:a,level:r,parentKey:i,isBranch:s,isExpanded:c,setSize:t.length,posInSet:o+1};return!c||!a.children?.length?[l]:[l,...e(a.children,n,r+1,a.key)]})}export{e as flattenTree};
+//# sourceMappingURL=flattenTree.mjs.map

package/dist/esm/common/tree/flattenTree.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"flattenTree.mjs","names":[],"sources":["../../../../package/common/tree/flattenTree.ts"],"sourcesContent":["import type { FlatTreeNode, TreeNode, TreeValue } from './tree.types';\n\n/** The visible nodes in render order. Flat, not nested, deliberately: see docs/Tree.md. */\nexport function flattenTree(\n  nodes: TreeNode[],\n  expandedKeys: TreeValue[],\n  level = 0,\n  parentKey: TreeValue | null = null,\n): FlatTreeNode[] {\n  return nodes.flatMap((node, index) => {\n    const isBranch = node.children !== undefined;\n    const isExpanded = isBranch && expandedKeys.includes(node.key);\n    const self: FlatTreeNode = {\n      node,\n      level,\n      parentKey,\n      isBranch,\n      isExpanded,\n      setSize: nodes.length,\n      posInSet: index + 1,\n    };\n    if (!isExpanded || !node.children?.length) return [self];\n    return [self, ...flattenTree(node.children, expandedKeys, level + 1, node.key)];\n  });\n}\n"],"mappings":"AAGA,SAAgB,EACd,EACA,EACA,EAAQ,EACR,EAA8B,KACd,CAChB,OAAO,EAAM,SAAS,EAAM,IAAU,CACpC,IAAM,EAAW,EAAK,WAAa,IAAA,GAC7B,EAAa,GAAY,EAAa,SAAS,EAAK,GAAG,EACvD,EAAqB,CACzB,OACA,QACA,YACA,WACA,aACA,QAAS,EAAM,OACf,SAAU,EAAQ,CACpB,EAEA,MADI,CAAC,GAAc,CAAC,EAAK,UAAU,OAAe,CAAC,CAAI,EAChD,CAAC,EAAM,GAAG,EAAY,EAAK,SAAU,EAAc,EAAQ,EAAG,EAAK,GAAG,CAAC,CAChF,CAAC,CACH"}

package/dist/esm/common/tree/tree.mjs

@@ -0,0 +1,2 @@
+import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import{renderIcon as t}from"../utils/renderIcon.mjs";import n from"../virtualList/virtualList.mjs";import{flattenTree as r}from"./flattenTree.mjs";import i from"./tree.module.mjs";import{useEffect as a,useRef as o,useState as s}from"react";import c from"classnames";import{faChevronRight as l}from"@fortawesome/free-solid-svg-icons";import{jsx as u,jsxs as d}from"react/jsx-runtime";var f=[];function p(p){let{nodes:m,expandedKeys:h,defaultExpandedKeys:g=f,onExpandedChange:_=()=>{},selectedKey:v,defaultSelectedKey:y,onSelect:b=()=>{},expandOnSelect:x=!0,indent:S=20,toggleIcon:C=l,height:w,estimatedRowHeight:T=32,emptyLabel:ee=`Nothing here`,disabled:E=!1,"aria-label":D=`Tree`,className:O,style:k,classNames:A,styles:j,...M}=e(`Tree`,p),N=o(new Map),P=o(null),F=o(null),I=w!==void 0,L=h!==void 0,[R,z]=s(g),B=L?h:R,V=v!==void 0,[H,U]=s(y??null),W=V?v:H,G=r(m,B),K=Math.max(0,G.findIndex(e=>e.node.key===W)),q=G[K]?.node.key;function J(e){L||z(e),_(e)}function Y(e){J(B.includes(e)?B.filter(t=>t!==e):[...B,e])}function X(e){E||e.node.disabled||(V||U(e.node.key),b(e.node.key,e.node),x&&e.isBranch&&Y(e.node.key))}function Z(e){let t=G[e]?.node.key;if(t===void 0)return;let n=N.current.get(t);if(n){n.focus();return}F.current=t,P.current?.scrollToIndex(e,{align:`center`})}a(()=>{let e=F.current;if(e===null)return;let t=N.current.get(e);t&&(t.focus(),F.current=null)});function Q(e,t,n){if(!E)switch(e.key){case`ArrowDown`:e.preventDefault(),Z(Math.min(n+1,G.length-1));break;case`ArrowUp`:e.preventDefault(),Z(Math.max(n-1,0));break;case`ArrowRight`:if(e.preventDefault(),!t.isBranch)break;t.isExpanded?Z(n+1):Y(t.node.key);break;case`ArrowLeft`:{if(e.preventDefault(),t.isBranch&&t.isExpanded){Y(t.node.key);break}let n=G.findIndex(e=>e.node.key===t.parentKey);n>=0&&Z(n);break}case`Home`:e.preventDefault(),Z(0);break;case`End`:e.preventDefault(),Z(G.length-1);break;case`Enter`:case` `:e.preventDefault(),X(t)}}function $(e,n){let{node:r,level:a,isBranch:o,isExpanded:s}=e,l=r.key===W,f=E||r.disabled;return d(`div`,{ref:e=>{e?N.current.set(r.key,e):N.current.delete(r.key)},role:`treeitem`,"aria-level":a+1,"aria-setsize":e.setSize,"aria-posinset":e.posInSet,"aria-expanded":o?s:void 0,"aria-selected":l,"aria-disabled":f||void 0,tabIndex:r.key===q&&!f?0:-1,className:c(i.treeNode,l&&i.treeNodeSelected,f&&i.treeNodeDisabled,A?.node),style:{paddingLeft:a*S,...j?.node},onClick:()=>X(e),onKeyDown:t=>Q(t,e,n),children:[u(`span`,{className:c(i.treeToggle,s&&i.treeToggleOpen,!o&&i.treeToggleHidden,A?.toggle),style:j?.toggle,"aria-hidden":`true`,onClick:e=>{e.stopPropagation(),!f&&o&&Y(r.key)},children:o&&t(C)}),r.icon&&t(r.icon,{className:c(i.treeIcon,A?.icon),style:j?.icon}),u(`span`,{className:c(i.treeLabel,A?.label),style:j?.label,children:r.label})]},r.key)}return u(`div`,{...M,role:`tree`,"aria-label":D,"aria-disabled":E||void 0,tabIndex:I&&!E?0:void 0,onFocus:e=>{e.target===e.currentTarget&&Z(K)},className:c(i.tree,E&&i.treeDisabled,A?.root,O),style:{...k,...j?.root},children:G.length===0?u(`div`,{className:c(i.treeEmpty,A?.empty),style:j?.empty,children:ee}):I?u(n,{ref:P,items:G,height:w,estimatedRowHeight:T,getItemKey:e=>e.node.key,getItemDepth:e=>e.level,ariaRoles:{container:`none`,row:`none`},renderRow:$}):G.map($)})}export{p as default};
+//# sourceMappingURL=tree.mjs.map

package/dist/esm/common/tree/tree.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tree.mjs","names":[],"sources":["../../../../package/common/tree/tree.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport type { ReactElement } from 'react';\nimport cx from 'classnames';\nimport { faChevronRight } from '@fortawesome/free-solid-svg-icons';\n\nimport VirtualList from 'components/common/virtualList';\nimport type { VirtualListHandle } from 'components/common/virtualList';\nimport { useComponentDefaults } from '../configProvider';\nimport { renderIcon } from '../utils/renderIcon';\nimport { flattenTree } from './flattenTree';\nimport type { FlatTreeNode, TreeProps, TreeValue } from './tree.types';\n\nimport styles from './tree.module.pcss';\n\nconst EMPTY_KEYS: TreeValue[] = [];\n\nfunction Tree(props: TreeProps): ReactElement {\n  const {\n    nodes,\n    expandedKeys: controlledExpanded,\n    defaultExpandedKeys = EMPTY_KEYS,\n    onExpandedChange = () => {},\n    selectedKey: controlledSelected,\n    defaultSelectedKey,\n    onSelect = () => {},\n    expandOnSelect = true,\n    indent = 20,\n    toggleIcon = faChevronRight,\n    height,\n    estimatedRowHeight = 32,\n    emptyLabel = 'Nothing here',\n    disabled = false,\n    'aria-label': ariaLabel = 'Tree',\n    className,\n    style,\n    classNames,\n    styles: slotStyles,\n    ...rest\n  } = useComponentDefaults('Tree', props);\n\n  const nodeRefs = useRef(new Map<TreeValue, HTMLDivElement>());\n  const listRef = useRef<VirtualListHandle>(null);\n  const pendingFocusRef = useRef<TreeValue | null>(null);\n  const isWindowed = height !== undefined;\n\n  const isExpandedControlled = controlledExpanded !== undefined;\n  const [internalExpanded, setInternalExpanded] = useState<TreeValue[]>(defaultExpandedKeys);\n  const expandedKeys = isExpandedControlled ? controlledExpanded : internalExpanded;\n\n  const isSelectedControlled = controlledSelected !== undefined;\n  const [internalSelected, setInternalSelected] = useState<TreeValue | null>(defaultSelectedKey ?? null);\n  const selectedKey = isSelectedControlled ? controlledSelected : internalSelected;\n\n  const visible = flattenTree(nodes, expandedKeys);\n\n  // Windowed, the tab stop sits on the container instead of this row: a roving tabindex on a row\n  // scrolled out of the window would leave the tree with no tab stop at all.\n  const activeIndex = Math.max(\n    0,\n    visible.findIndex((entry) => entry.node.key === selectedKey),\n  );\n  const activeKey = visible[activeIndex]?.node.key;\n\n  function setExpanded(next: TreeValue[]) {\n    if (!isExpandedControlled) setInternalExpanded(next);\n    onExpandedChange(next);\n  }\n\n  function toggle(key: TreeValue) {\n    setExpanded(expandedKeys.includes(key) ? expandedKeys.filter((k) => k !== key) : [...expandedKeys, key]);\n  }\n\n  function select(entry: FlatTreeNode) {\n    if (disabled || entry.node.disabled) return;\n    if (!isSelectedControlled) setInternalSelected(entry.node.key);\n    onSelect(entry.node.key, entry.node);\n    if (expandOnSelect && entry.isBranch) toggle(entry.node.key);\n  }\n\n  function focusAt(index: number) {\n    const key = visible[index]?.node.key;\n    if (key === undefined) return;\n\n    const element = nodeRefs.current.get(key);\n    if (element) {\n      element.focus();\n      return;\n    }\n\n    // Outside the window, so it has to be scrolled in before it exists to receive focus.\n    pendingFocusRef.current = key;\n    listRef.current?.scrollToIndex(index, { align: 'center' });\n  }\n\n  useEffect(() => {\n    const key = pendingFocusRef.current;\n    if (key === null) return;\n    const element = nodeRefs.current.get(key);\n    if (element) {\n      element.focus();\n      pendingFocusRef.current = null;\n    }\n  });\n\n  function handleKeyDown(event: React.KeyboardEvent<HTMLDivElement>, entry: FlatTreeNode, index: number) {\n    if (disabled) return;\n\n    switch (event.key) {\n      case 'ArrowDown':\n        event.preventDefault();\n        focusAt(Math.min(index + 1, visible.length - 1));\n        break;\n      case 'ArrowUp':\n        event.preventDefault();\n        focusAt(Math.max(index - 1, 0));\n        break;\n      case 'ArrowRight':\n        event.preventDefault();\n        if (!entry.isBranch) break;\n        if (entry.isExpanded) focusAt(index + 1);\n        else toggle(entry.node.key);\n        break;\n      case 'ArrowLeft': {\n        event.preventDefault();\n        if (entry.isBranch && entry.isExpanded) {\n          toggle(entry.node.key);\n          break;\n        }\n        const parentIndex = visible.findIndex((e) => e.node.key === entry.parentKey);\n        if (parentIndex >= 0) focusAt(parentIndex);\n        break;\n      }\n      case 'Home':\n        event.preventDefault();\n        focusAt(0);\n        break;\n      case 'End':\n        event.preventDefault();\n        focusAt(visible.length - 1);\n        break;\n      case 'Enter':\n      case ' ':\n        event.preventDefault();\n        select(entry);\n        break;\n      default:\n        break;\n    }\n  }\n\n  function renderNode(entry: FlatTreeNode, index: number) {\n    const { node, level, isBranch, isExpanded } = entry;\n    const isSelected = node.key === selectedKey;\n    const isDisabled = disabled || node.disabled;\n\n    return (\n      <div\n        key={node.key}\n        ref={(el) => {\n          if (el) nodeRefs.current.set(node.key, el);\n          else nodeRefs.current.delete(node.key);\n        }}\n        role='treeitem'\n        aria-level={level + 1}\n        aria-setsize={entry.setSize}\n        aria-posinset={entry.posInSet}\n        aria-expanded={isBranch ? isExpanded : undefined}\n        aria-selected={isSelected}\n        aria-disabled={isDisabled || undefined}\n        tabIndex={node.key === activeKey && !isDisabled ? 0 : -1}\n        className={cx(\n          styles.treeNode,\n          isSelected && styles.treeNodeSelected,\n          isDisabled && styles.treeNodeDisabled,\n          classNames?.node,\n        )}\n        style={{ paddingLeft: level * indent, ...slotStyles?.node }}\n        onClick={() => select(entry)}\n        onKeyDown={(event) => handleKeyDown(event, entry, index)}\n      >\n        <span\n          className={cx(\n            styles.treeToggle,\n            isExpanded && styles.treeToggleOpen,\n            !isBranch && styles.treeToggleHidden,\n            classNames?.toggle,\n          )}\n          style={slotStyles?.toggle}\n          aria-hidden='true'\n          onClick={(event) => {\n            event.stopPropagation();\n            if (!isDisabled && isBranch) toggle(node.key);\n          }}\n        >\n          {isBranch && renderIcon(toggleIcon)}\n        </span>\n\n        {node.icon &&\n          renderIcon(node.icon, {\n            className: cx(styles.treeIcon, classNames?.icon),\n            style: slotStyles?.icon,\n          })}\n\n        <span className={cx(styles.treeLabel, classNames?.label)} style={slotStyles?.label}>\n          {node.label}\n        </span>\n      </div>\n    );\n  }\n\n  return (\n    <div\n      {...rest}\n      role='tree'\n      aria-label={ariaLabel}\n      aria-disabled={disabled || undefined}\n      tabIndex={isWindowed && !disabled ? 0 : undefined}\n      onFocus={(event) => {\n        if (event.target === event.currentTarget) focusAt(activeIndex);\n      }}\n      className={cx(styles.tree, disabled && styles.treeDisabled, classNames?.root, className)}\n      style={{ ...style, ...slotStyles?.root }}\n    >\n      {visible.length === 0 ? (\n        <div className={cx(styles.treeEmpty, classNames?.empty)} style={slotStyles?.empty}>\n          {emptyLabel}\n        </div>\n      ) : isWindowed ? (\n        <VirtualList\n          ref={listRef}\n          items={visible}\n          height={height}\n          estimatedRowHeight={estimatedRowHeight}\n          getItemKey={(entry) => entry.node.key}\n          getItemDepth={(entry) => entry.level}\n          ariaRoles={{ container: 'none', row: 'none' }}\n          renderRow={renderNode}\n        />\n      ) : (\n        visible.map(renderNode)\n      )}\n    </div>\n  );\n}\n\nexport default Tree;\n"],"mappings":"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"}

package/dist/esm/common/tree/tree.module.mjs

@@ -0,0 +1,2 @@
+var e=`tree_bHT4K`,t=`tree-disabled_bIFfs`,n=`tree-node_XUWMs`,r=`tree-node-selected_j05ku`,i=`tree-node-disabled_FMox6`,a=`tree-toggle_hmqtx`,o=`tree-toggle-open_gTfYS`,s=`tree-toggle-hidden_nYrlV`,c=`tree-icon_0dxsy`,l=`tree-label_BOShA`,u=`tree-empty_Eb3vv`,d={tree:e,"tree-disabled":`tree-disabled_bIFfs`,treeDisabled:t,"tree-node":`tree-node_XUWMs`,treeNode:n,"tree-node-selected":`tree-node-selected_j05ku`,treeNodeSelected:r,"tree-node-disabled":`tree-node-disabled_FMox6`,treeNodeDisabled:i,"tree-toggle":`tree-toggle_hmqtx`,treeToggle:a,"tree-toggle-open":`tree-toggle-open_gTfYS`,treeToggleOpen:o,"tree-toggle-hidden":`tree-toggle-hidden_nYrlV`,treeToggleHidden:s,"tree-icon":`tree-icon_0dxsy`,treeIcon:c,"tree-label":`tree-label_BOShA`,treeLabel:l,"tree-empty":`tree-empty_Eb3vv`,treeEmpty:u};export{d as default,e as tree,t as treeDisabled,u as treeEmpty,c as treeIcon,l as treeLabel,n as treeNode,i as treeNodeDisabled,r as treeNodeSelected,a as treeToggle,s as treeToggleHidden,o as treeToggleOpen};
+//# sourceMappingURL=tree.module.mjs.map

package/dist/esm/common/tree/tree.module.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tree.module.mjs","names":[],"sources":["../../../../package/common/tree/tree.module.pcss"],"sourcesContent":[".tree {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  color: var(--text-color);\n\n  &-disabled {\n    opacity: 0.5;\n  }\n\n  &-node {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    box-sizing: border-box;\n    min-height: var(--tree-node-height, 32px);\n    padding-right: 8px;\n    border-radius: var(--default-border-radius);\n    cursor: pointer;\n    -webkit-tap-highlight-color: transparent;\n    user-select: none;\n\n    &:hover {\n      background: var(--background-accent);\n    }\n\n    &:focus-visible {\n      outline: var(--focus-border-color, var(--primary-color)) solid 2px;\n      outline-offset: -2px;\n    }\n\n    &-selected {\n      background: var(--tree-selected-background, var(--primary-color));\n      color: var(--tree-selected-color, var(--text-on-primary));\n\n      &:hover {\n        background: var(--tree-selected-background, var(--primary-color));\n      }\n\n      &:focus-visible {\n        outline-color: var(--tree-selected-color, var(--text-on-primary));\n      }\n    }\n\n    &-disabled {\n      opacity: 0.5;\n      cursor: default;\n\n      &:hover {\n        background: transparent;\n      }\n    }\n  }\n\n  &-toggle {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    flex: none;\n    width: 1.25em;\n    height: 1.25em;\n    font-size: 0.8em;\n    border-radius: 50%;\n    transition: transform 0.15s;\n\n    &-open {\n      transform: rotate(90deg);\n    }\n\n    /* Kept in the layout rather than removed, so leaf labels line up with their siblings'. */\n    &-hidden {\n      visibility: hidden;\n    }\n  }\n\n  &-icon {\n    flex: none;\n    width: 1em;\n  }\n\n  &-label {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  &-empty {\n    padding: 12px 8px;\n    color: var(--text-dark);\n  }\n}\n"],"mappings":""}

package/dist/esm/common/utils/renderIcon.mjs

@@ -1,2 +1,2 @@
-import{FontAwesomeIcon as e}from"@fortawesome/react-fontawesome";import{jsx as t}from"react/jsx-runtime";function n(e){return typeof e==`object`&&!!e&&`prefix`in e&&`iconName`in e&&`icon`in e}function r(r,i={}){let{className:a,style:o}=i;return r==null?null:n(r)?t(e,{icon:r,className:a,style:o}):a||o?t(`span`,{className:a,style:o,children:r}):r}export{r as renderIcon};
+import{FontAwesomeIcon as e}from"@fortawesome/react-fontawesome";import{jsx as t}from"react/jsx-runtime";function n(e){return typeof e==`object`&&!!e&&`prefix`in e&&`iconName`in e&&`icon`in e}function r(r,i={}){let{className:a,style:o}=i;return r==null?null:n(r)?t(e,{icon:r,className:a,style:o}):a||o?t(`span`,{className:a,style:o,children:r}):r}export{n as isIconDefinition,r as renderIcon};
 //# sourceMappingURL=renderIcon.mjs.map

package/dist/esm/common/utils/renderIcon.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"renderIcon.mjs","names":[],"sources":["../../../../package/common/utils/renderIcon.tsx"],"sourcesContent":["import type { CSSProperties, ReactNode } from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport type { IconDefinition } from '@fortawesome/fontawesome-svg-core';\n\nimport type { IconContent } from '../types/icon.types';\n\n/** FontAwesome's own `style` type — `CSSProperties` plus its `--fa-*` variables. */\ntype FaStyle = CSSProperties & Record<`--fa-font-${string}`, string>;\n\ninterface RenderIconOptions {\n  /** Class applied to the rendered icon (or to the wrapper span for a custom element). */\n  className?: string;\n  /** Inline style applied to the rendered icon (or to the wrapper span for a custom element). */\n  style?: CSSProperties;\n}\n\n/**\n * Narrows an `IconContent` to a FontAwesome `IconDefinition`.\n *\n * Both halves of the union are plain objects (a React element is one too), so\n * they can only be told apart structurally: an icon definition always carries\n * `prefix`, `iconName` and the `icon` tuple.\n */\nexport function isIconDefinition(icon: IconContent | null | undefined): icon is IconDefinition {\n  return (\n    typeof icon === 'object' &&\n    icon !== null &&\n    'prefix' in icon &&\n    'iconName' in icon &&\n    'icon' in icon\n  );\n}\n\n/**\n * Renders an `icon` prop that may be either a FontAwesome `IconDefinition` or an\n * arbitrary React element.\n *\n * A definition goes through `FontAwesomeIcon`; an element is returned untouched\n * unless a `className`/`style` was given, in which case it is wrapped in a\n * `<span>` carrying them so component and consumer slot styling still lands\n * somewhere. Note that a custom element is not sized by FontAwesome's `1em`\n * geometry — size it yourself if the surrounding layout expects a square icon.\n */\nexport function renderIcon(icon: IconContent | null | undefined, options: RenderIconOptions = {}): ReactNode {\n  const { className, style } = options;\n\n  if (icon === null || icon === undefined) return null;\n\n  if (isIconDefinition(icon)) {\n    return <FontAwesomeIcon icon={icon} className={className} style={style as FaStyle} />;\n  }\n\n  if (className || style) {\n    return <span className={className} style={style}>{icon}</span>;\n  }\n\n  return icon;\n}\n"],"mappings":"yGAuBA,SAAgB,EAAiB,EAA8D,CAC7F,OACE,OAAO,GAAS,YAChB,GACA,WAAY,GACZ,aAAc,GACd,SAAU,CAEd,CAYA,SAAgB,EAAW,EAAsC,EAA6B,CAAC,EAAc,CAC3G,GAAM,CAAE,YAAW,SAAU,EAY7B,OAVI,GAAS,KAAmC,KAE5C,EAAiB,CAAI,EAChB,EAAC,EAAD,CAAuB,OAAiB,YAAkB,OAAmB,CAAA,EAGlF,GAAa,EACR,EAAC,OAAD,CAAiB,YAAkB,iBAAQ,CAAW,CAAA,EAGxD,CACT"}
+{"version":3,"file":"renderIcon.mjs","names":[],"sources":["../../../../package/common/utils/renderIcon.tsx"],"sourcesContent":["import type { CSSProperties, ReactNode } from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport type { IconDefinition } from '@fortawesome/fontawesome-svg-core';\n\nimport type { IconContent } from '../types/icon.types';\n\n/** FontAwesome's own `style` type — `CSSProperties` plus its `--fa-*` variables. */\ntype FaStyle = CSSProperties & Record<`--fa-font-${string}`, string>;\n\ninterface RenderIconOptions {\n  /** Class applied to the rendered icon (or to the wrapper span for a custom element). */\n  className?: string;\n  /** Inline style applied to the rendered icon (or to the wrapper span for a custom element). */\n  style?: CSSProperties;\n}\n\n/**\n * Narrows an `IconContent` to a FontAwesome `IconDefinition`.\n *\n * Both halves of the union are plain objects (a React element is one too), so\n * they can only be told apart structurally: an icon definition always carries\n * `prefix`, `iconName` and the `icon` tuple.\n */\nexport function isIconDefinition(icon: IconContent | null | undefined): icon is IconDefinition {\n  return typeof icon === 'object' && icon !== null && 'prefix' in icon && 'iconName' in icon && 'icon' in icon;\n}\n\n/**\n * Renders an `icon` prop that may be either a FontAwesome `IconDefinition` or an\n * arbitrary React element.\n *\n * A definition goes through `FontAwesomeIcon`; an element is returned untouched\n * unless a `className`/`style` was given, in which case it is wrapped in a\n * `<span>` carrying them so component and consumer slot styling still lands\n * somewhere. Note that a custom element is not sized by FontAwesome's `1em`\n * geometry — size it yourself if the surrounding layout expects a square icon.\n */\nexport function renderIcon(icon: IconContent | null | undefined, options: RenderIconOptions = {}): ReactNode {\n  const { className, style } = options;\n\n  if (icon === null || icon === undefined) return null;\n\n  if (isIconDefinition(icon)) {\n    return <FontAwesomeIcon icon={icon} className={className} style={style as FaStyle} />;\n  }\n\n  if (className || style) {\n    return (\n      <span className={className} style={style}>\n        {icon}\n      </span>\n    );\n  }\n\n  return icon;\n}\n"],"mappings":"yGAuBA,SAAgB,EAAiB,EAA8D,CAC7F,OAAO,OAAO,GAAS,YAAY,GAAiB,WAAY,GAAQ,aAAc,GAAQ,SAAU,CAC1G,CAYA,SAAgB,EAAW,EAAsC,EAA6B,CAAC,EAAc,CAC3G,GAAM,CAAE,YAAW,SAAU,EAgB7B,OAdI,GAAS,KAAmC,KAE5C,EAAiB,CAAI,EAChB,EAAC,EAAD,CAAuB,OAAiB,YAAkB,OAAmB,CAAA,EAGlF,GAAa,EAEb,EAAC,OAAD,CAAiB,YAAkB,QAChC,SAAA,CACG,CAAA,EAIH,CACT"}

package/dist/esm/common/virtualList/useColumns.mjs

@@ -1,2 +1,2 @@
-import{COLUMN_STORAGE_PREFIX as e,buildColumnTemplate as t,isColumnInitiallyVisible as n,loadPersistedColumns as r}from"./virtualList.utils.mjs";import{useCallback as i,useEffect as a,useLayoutEffect as o,useRef as s,useState as c}from"react";function l({columns:l,items:u,multiSelect:d,visibleColumnKeys:f,onVisibleColumnsChange:p,persistColumnsKey:m,showColumnToggle:h,rootRef:g,startIndex:_,endIndex:v,containerHeight:y,containerWidth:b}){let x=f!==void 0,[S,C]=c(!1),[w,T]=c({}),[E,D]=c(()=>{let e=r(m);return new Set((l??[]).filter(t=>n(t,e)).map(e=>e.key))}),O=s(new Set((l??[]).map(e=>e.key)));a(()=>{if(x)return;let e=l??[],t=new Set(e.map(e=>e.key)),i=O.current,a=t.size===i.size;if(a){for(let e of t)if(!i.has(e)){a=!1;break}}if(a)return;O.current=t;let o=r(m);D(t=>{let r=new Set;for(let a of e)i.has(a.key)?t.has(a.key)&&r.add(a.key):n(a,o)&&r.add(a.key);return r})},[l,x,m]),a(()=>{if(x||!m||typeof window>`u`)return;let t=l??[];if(!(t.length===0||E.size===0))try{window.localStorage.setItem(e+m,JSON.stringify({visible:[...E],known:t.map(e=>e.key)}))}catch{}},[E,l,x,m]);let k=x?new Set(f):E,A=(l??[]).filter(e=>e.lockVisible).map(e=>e.key),j=A.some(e=>!k.has(e))?new Set([...k,...A]):k,M=!!l?.length,N=M?l.filter(e=>j.has(e.key)):[],P=M?l.filter(e=>!e.defaultHidden&&!j.has(e.key)).length:0,F=M?`${d&&M?`40px `:``}${t(N,w)}`:void 0,I=h!==!1&&M&&l.some(e=>!e.hideFromToggle),L=N.filter(e=>e.width.type===`fit`),R=L.length>0,z=L.map(e=>e.key).join(`|`),[B,V]=c({key:z,items:u});(B.key!==z||B.items!==u)&&(V({key:z,items:u}),Object.keys(w).length>0&&T({}));let H=i(()=>{let e=g.current;if(!e)return;let t=new Map;e.querySelectorAll(`[data-fit-key]`).forEach(e=>{let n=e,r=n.getAttribute(`data-fit-key`);if(!r)return;let i=n.scrollWidth>n.clientWidth,a=n.scrollWidth;if(i||n.firstElementChild){let e=getComputedStyle(n),t=parseFloat(e.paddingLeft)||0,r=parseFloat(e.paddingRight)||0;if(i&&(a+=r),n.firstElementChild&&!i&&n.scrollWidth<=t+r+1){let e=1/0,i=-1/0;if(n.querySelectorAll(`*`).forEach(t=>{let n=t.getBoundingClientRect();n.left<e&&(e=n.left),n.right>i&&(i=n.right)}),i>e){let n=Math.ceil(i-e)+t+r;n>a&&(a=n)}}}a>(t.get(r)??0)&&t.set(r,a)}),t.size!==0&&T(n=>{let r=!1,i={...n};for(let[a,o]of t){if(o<=0)continue;let t=Math.min(Math.ceil(o),e.clientWidth);t>(n[a]??0)&&(i[a]=t,r=!0)}return r?i:n})},[g]),[U]=c(()=>typeof ResizeObserver>`u`?null:new ResizeObserver(()=>H())),W=s(new Set);a(()=>()=>{U?.disconnect(),W.current.clear()},[U]),o(()=>{if(!R)return;let e=g.current;if(!e||(H(),!U))return;let t=new Set(e.querySelectorAll(`[data-fit-key]`)),n=W.current;for(let e of n)t.has(e)||(U.unobserve(e),n.delete(e));for(let e of t)n.has(e)||(U.observe(e),n.add(e))},[R,z,w,_,v,y,b,u,H,U]),a(()=>{if(!R)return;let e=0,t=requestAnimationFrame(()=>{H(),e=requestAnimationFrame(()=>H())});return()=>{cancelAnimationFrame(t),cancelAnimationFrame(e)}},[R,z,u,H]);let G=i(()=>T({}),[]);function K(e){if(l?.find(t=>t.key===e)?.lockVisible)return;let t=new Set(j);if(t.has(e)){if(t.size<=1)return;t.delete(e)}else t.add(e);let n=[...t];x||D(t),p?.(n)}return{hasColumns:M,visibleColumns:N,columnTemplate:F,shouldShowToggle:I,effectiveVisible:j,manuallyHiddenCount:P,toggleOpen:S,setToggleOpen:C,handleToggleColumn:K,recalculateColumns:G}}export{l as useColumns};
+import{COLUMN_STORAGE_PREFIX as e,buildColumnTemplate as t,isColumnInitiallyVisible as n,loadPersistedColumns as r}from"./virtualList.utils.mjs";import{useCallback as i,useEffect as a,useLayoutEffect as o,useRef as s,useState as c}from"react";function l({columns:l,items:u,multiSelect:d,visibleColumnKeys:f,onVisibleColumnsChange:p,persistColumnsKey:m,showColumnToggle:h,rootRef:g,startIndex:_,endIndex:v,containerHeight:y,containerWidth:b}){let x=f!==void 0,[S,C]=c(!1),[w,T]=c({}),[E,D]=c(()=>{let e=r(m);return new Set((l??[]).filter(t=>n(t,e)).map(e=>e.key))}),O=s(new Set((l??[]).map(e=>e.key)));a(()=>{if(x)return;let e=l??[],t=new Set(e.map(e=>e.key)),i=O.current,a=t.size===i.size;if(a){for(let e of t)if(!i.has(e)){a=!1;break}}if(a)return;O.current=t;let o=r(m);D(t=>{let r=new Set;for(let a of e)i.has(a.key)?t.has(a.key)&&r.add(a.key):n(a,o)&&r.add(a.key);return r})},[l,x,m]),a(()=>{if(x||!m||typeof window>`u`)return;let t=l??[];if(t.length!==0&&E.size!==0)try{window.localStorage.setItem(e+m,JSON.stringify({visible:[...E],known:t.map(e=>e.key)}))}catch{}},[E,l,x,m]);let k=x?new Set(f):E,A=(l??[]).filter(e=>e.lockVisible).map(e=>e.key),j=A.some(e=>!k.has(e))?new Set([...k,...A]):k,M=!!l?.length,N=M?l.filter(e=>j.has(e.key)):[],P=M?l.filter(e=>!e.defaultHidden&&!j.has(e.key)).length:0,F=M?`${d&&M?`40px `:``}${t(N,w)}`:void 0,I=h!==!1&&M&&l.some(e=>!e.hideFromToggle),L=N.filter(e=>e.width.type===`fit`),R=L.length>0,z=L.map(e=>e.key).join(`|`),[B,V]=c({key:z,items:u});(B.key!==z||B.items!==u)&&(V({key:z,items:u}),Object.keys(w).length>0&&T({}));let H=i(()=>{let e=g.current;if(!e)return;let t=new Map;e.querySelectorAll(`[data-fit-key]`).forEach(e=>{let n=e,r=n.getAttribute(`data-fit-key`);if(!r)return;let i=n.scrollWidth>n.clientWidth,a=n.scrollWidth;if(i||n.firstElementChild){let e=getComputedStyle(n),t=parseFloat(e.paddingLeft)||0,r=parseFloat(e.paddingRight)||0;if(i&&(a+=r),n.firstElementChild&&!i&&n.scrollWidth<=t+r+1){let e=1/0,i=-1/0;if(n.querySelectorAll(`*`).forEach(t=>{let n=t.getBoundingClientRect();n.left<e&&(e=n.left),n.right>i&&(i=n.right)}),i>e){let n=Math.ceil(i-e)+t+r;n>a&&(a=n)}}}a>(t.get(r)??0)&&t.set(r,a)}),t.size!==0&&T(n=>{let r=!1,i={...n};for(let[a,o]of t){if(o<=0)continue;let t=Math.min(Math.ceil(o),e.clientWidth);t>(n[a]??0)&&(i[a]=t,r=!0)}return r?i:n})},[g]),[U]=c(()=>typeof ResizeObserver>`u`?null:new ResizeObserver(()=>H())),W=s(new Set);a(()=>()=>{U?.disconnect(),W.current.clear()},[U]),o(()=>{if(!R)return;let e=g.current;if(!e||(H(),!U))return;let t=new Set(e.querySelectorAll(`[data-fit-key]`)),n=W.current;for(let e of n)t.has(e)||(U.unobserve(e),n.delete(e));for(let e of t)n.has(e)||(U.observe(e),n.add(e))},[g,R,z,w,_,v,y,b,u,H,U]),a(()=>{if(!R)return;let e=0,t=requestAnimationFrame(()=>{H(),e=requestAnimationFrame(()=>H())});return()=>{cancelAnimationFrame(t),cancelAnimationFrame(e)}},[R,z,u,H]);let G=i(()=>T({}),[]);function K(e){if(l?.find(t=>t.key===e)?.lockVisible)return;let t=new Set(j);if(t.has(e)){if(t.size<=1)return;t.delete(e)}else t.add(e);let n=[...t];x||D(t),p?.(n)}return{hasColumns:M,visibleColumns:N,columnTemplate:F,shouldShowToggle:I,effectiveVisible:j,manuallyHiddenCount:P,toggleOpen:S,setToggleOpen:C,handleToggleColumn:K,recalculateColumns:G}}export{l as useColumns};
 //# sourceMappingURL=useColumns.mjs.map

package/dist/esm/common/virtualList/useColumns.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useColumns.mjs","names":[],"sources":["../../../../package/common/virtualList/useColumns.ts"],"sourcesContent":["import React, { useState, useRef, useEffect, useLayoutEffect, useCallback } from 'react';\n\nimport {\n  buildColumnTemplate,\n  loadPersistedColumns,\n  isColumnInitiallyVisible,\n  COLUMN_STORAGE_PREFIX,\n  type PersistedColumns,\n} from './virtualList.utils';\nimport type { VirtualListColumn } from './virtualList.types';\n\ninterface UseColumnsArgs<T> {\n  columns?: VirtualListColumn<T>[];\n  items: T[];\n  multiSelect: boolean;\n  visibleColumnKeys?: string[];\n  onVisibleColumnsChange?: (keys: string[]) => void;\n  persistColumnsKey?: string;\n  showColumnToggle?: boolean;\n  rootRef: React.RefObject<HTMLDivElement | null>;\n  /** Visible-window bounds — re-measure `fit` columns as new cells scroll in. */\n  startIndex: number;\n  endIndex: number;\n  containerHeight: number;\n  /** Re-measure `fit` columns when the container width settles (e.g. after a route transition). */\n  containerWidth: number;\n}\n\ninterface UseColumnsResult<T> {\n  hasColumns: boolean;\n  visibleColumns: VirtualListColumn<T>[];\n  columnTemplate: string | undefined;\n  shouldShowToggle: boolean;\n  effectiveVisible: Set<string>;\n  /** How many default-visible columns the user has hidden (excludes defaultHidden). */\n  manuallyHiddenCount: number;\n  toggleOpen: boolean;\n  setToggleOpen: React.Dispatch<React.SetStateAction<boolean>>;\n  handleToggleColumn: (key: string) => void;\n  /** Imperative escape hatch: drop fit-column pins so they re-measure on the\n   *  next layout. For out-of-band content changes that don't flow through a new\n   *  `items` array or `columns` set (which reset automatically). */\n  recalculateColumns: () => void;\n}\n\n/**\n * Table-mode column logic: visibility (controlled or uncontrolled, with\n * localStorage persistence and runtime reconciliation), the toggle popover, and\n * `fit`-column width measurement that pins one shared px track across the header\n * and every row grid so they stay aligned.\n */\nexport function useColumns<T>({\n  columns,\n  items,\n  multiSelect,\n  visibleColumnKeys,\n  onVisibleColumnsChange,\n  persistColumnsKey,\n  showColumnToggle,\n  rootRef,\n  startIndex,\n  endIndex,\n  containerHeight,\n  containerWidth,\n}: UseColumnsArgs<T>): UseColumnsResult<T> {\n  const isControlled = visibleColumnKeys !== undefined;\n  const [toggleOpen, setToggleOpen] = useState(false);\n  // Measured px widths for `fit` columns, keyed by column key. Pinning these\n  // into the shared column template keeps the header and rows aligned (a raw\n  // `fit-content` track resolves per-grid and drifts). See the effects below.\n  const [fitWidths, setFitWidths] = useState<Record<string, number>>({});\n\n  const [internalVisibleKeys, setInternalVisibleKeys] = useState<Set<string>>(() => {\n    const persisted = loadPersistedColumns(persistColumnsKey);\n    return new Set((columns ?? []).filter((c) => isColumnInitiallyVisible(c, persisted)).map((c) => c.key));\n  });\n  // The set of column keys the internal visibility state was last reconciled\n  // against. The lazy initializer above only runs at mount, so without this a\n  // list that mounts in list mode (no columns) and later switches to table mode\n  // would keep an empty visible set and render no columns.\n  const knownColumnKeysRef = useRef<Set<string>>(new Set((columns ?? []).map((c) => c.key)));\n\n  // Re-derive internal visibility when the column set changes at runtime: new\n  // columns get their saved/default visibility, removed columns drop out, and\n  // existing columns keep whatever the user toggled them to. This is also what\n  // applies persisted settings when a list switches from list mode to table\n  // mode (columns absent at mount, supplied later).\n  useEffect(() => {\n    if (isControlled) return;\n    const cols = columns ?? [];\n    const currentKeys = new Set(cols.map((c) => c.key));\n    const known = knownColumnKeysRef.current;\n    let identical = currentKeys.size === known.size;\n    if (identical) for (const k of currentKeys) if (!known.has(k)) { identical = false; break; }\n    if (identical) return;\n    knownColumnKeysRef.current = currentKeys;\n    const persisted = loadPersistedColumns(persistColumnsKey);\n    setInternalVisibleKeys((prev) => {\n      const next = new Set<string>();\n      for (const c of cols) {\n        if (known.has(c.key)) {\n          if (prev.has(c.key)) next.add(c.key); // preserve the current-session choice\n        } else if (isColumnInitiallyVisible(c, persisted)) {\n          next.add(c.key); // newly-added column: saved setting, else defaultHidden\n        }\n      }\n      return next;\n    });\n  }, [columns, isControlled, persistColumnsKey]);\n\n  // Persist visibility whenever it changes (uncontrolled mode only). Skip while\n  // there are no columns, or the transient empty state during a list→table\n  // switch before the reconcile effect above has filled in the visible set —\n  // writing then would clobber the saved config with an empty set.\n  useEffect(() => {\n    if (isControlled || !persistColumnsKey || typeof window === 'undefined') return;\n    const cols = columns ?? [];\n    if (cols.length === 0 || internalVisibleKeys.size === 0) return;\n    try {\n      window.localStorage.setItem(\n        COLUMN_STORAGE_PREFIX + persistColumnsKey,\n        JSON.stringify({ visible: [...internalVisibleKeys], known: cols.map((c) => c.key) } satisfies PersistedColumns),\n      );\n    } catch {\n      // Storage full or unavailable — non-fatal, just don't persist.\n    }\n  }, [internalVisibleKeys, columns, isControlled, persistColumnsKey]);\n\n  // Locked columns can never be hidden — force them into the visible set even if\n  // a controlled `visibleColumnKeys` or persisted state omits them. Only clone\n  // (rather than mutate the state Set) when a locked key is actually missing;\n  // in uncontrolled mode they're already present via isColumnInitiallyVisible.\n  const baseVisible: Set<string> = isControlled ? new Set(visibleColumnKeys) : internalVisibleKeys;\n  const lockedKeys = (columns ?? []).filter((c) => c.lockVisible).map((c) => c.key);\n  const effectiveVisible: Set<string> = lockedKeys.some((k) => !baseVisible.has(k))\n    ? new Set([...baseVisible, ...lockedKeys])\n    : baseVisible;\n\n  const hasColumns = !!columns?.length;\n  const visibleColumns = hasColumns ? columns!.filter((c) => effectiveVisible.has(c.key)) : [];\n  // A column counts as \"manually hidden\" only if it's default-visible yet\n  // currently hidden — a defaultHidden column being hidden is its default\n  // state, not a user choice, so it never contributes to the chip.\n  const manuallyHiddenCount = hasColumns\n    ? columns!.filter((c) => !c.defaultHidden && !effectiveVisible.has(c.key)).length\n    : 0;\n  const selectPrefix = multiSelect && hasColumns ? '40px ' : '';\n  const columnTemplate = hasColumns ? `${selectPrefix}${buildColumnTemplate(visibleColumns, fitWidths)}` : undefined;\n  // Hide the gear entirely when nothing is left to toggle (every column opts out).\n  const shouldShowToggle = showColumnToggle !== false && hasColumns && columns!.some((c) => !c.hideFromToggle);\n\n  // ── `fit` column width measurement ──────────────────────────────────────────\n  const fitColumns = visibleColumns.filter((c) => c.width.type === 'fit');\n  const hasFit = fitColumns.length > 0;\n  const fitColKey = fitColumns.map((c) => c.key).join('|');\n\n  // Drop the measured pins when the data or the fit-column set changes, so the\n  // measure effect below re-reads the true intrinsic width on the next pass —\n  // this is what lets a column shrink (during scroll the effect only grows it,\n  // to avoid jitter). Resetting state during render is React's recommended\n  // pattern for \"reset on prop change\" and avoids a cascading effect render.\n  const [fitReset, setFitReset] = useState<{ key: string; items: T[] }>({ key: fitColKey, items });\n  if (fitReset.key !== fitColKey || fitReset.items !== items) {\n    setFitReset({ key: fitColKey, items });\n    if (Object.keys(fitWidths).length > 0) setFitWidths({});\n  }\n\n  // Measure every fit cell currently in the DOM (header + visible rows), keyed\n  // by its `data-fit-key`, and grow each column's pin to the widest. Reading the\n  // key off the DOM (rather than closing over `fitColumns`) keeps this a stable\n  // callback the ResizeObserver below can reuse. `scrollWidth` reports the true\n  // content width even when the cell is pinned narrower than its content, so a\n  // later pass always recovers a column first measured while it was still empty\n  // (e.g. an actions cell whose buttons mount a tick after the row commits — its\n  // empty width is just the padding, ~24px, which \"only grow\" can't undo).\n  const measureFitWidths = useCallback(() => {\n    const root = rootRef.current;\n    if (!root) return;\n    const maxByKey = new Map<string, number>();\n    root.querySelectorAll('[data-fit-key]').forEach((node) => {\n      const el = node as HTMLElement;\n      const key = el.getAttribute('data-fit-key');\n      if (!key) return;\n      const overflowing = el.scrollWidth > el.clientWidth;\n      let w = el.scrollWidth;\n      // Only resolve computed padding when we actually need it — the overflow\n      // fix-up, or the collapse check below — so the hot scroll path stays cheap\n      // for plain in-flow cells.\n      if (overflowing || el.firstElementChild) {\n        const cs = getComputedStyle(el);\n        const padLeft = parseFloat(cs.paddingLeft) || 0;\n        const padRight = parseFloat(cs.paddingRight) || 0;\n        // scrollWidth includes the left padding but drops the right padding when\n        // the content overflows — add it back.\n        if (overflowing) w += padRight;\n        // Collapsed-content case (FontAwesome icons etc.): element children are\n        // present, yet scrollWidth is only the cell's padding because their boxes\n        // overflow via `overflow: visible` and carry no intrinsic width, so they\n        // don't count toward scrollWidth (and, when right-aligned, overflow to the\n        // *left* into negative offsets). ONLY then walk the descendants for their\n        // true span — once a real width pins, the cell is no longer collapsed, so\n        // this stops running on every scroll frame.\n        if (el.firstElementChild && !overflowing && el.scrollWidth <= padLeft + padRight + 1) {\n          let minLeft = Infinity;\n          let maxRight = -Infinity;\n          el.querySelectorAll('*').forEach((d) => {\n            const r = d.getBoundingClientRect();\n            if (r.left < minLeft) minLeft = r.left;\n            if (r.right > maxRight) maxRight = r.right;\n          });\n          if (maxRight > minLeft) {\n            const span = Math.ceil(maxRight - minLeft) + padLeft + padRight;\n            if (span > w) w = span;\n          }\n        }\n      }\n      if (w > (maxByKey.get(key) ?? 0)) maxByKey.set(key, w);\n    });\n    if (maxByKey.size === 0) return;\n    setFitWidths((prev) => {\n      let changed = false;\n      const next = { ...prev };\n      for (const [key, max] of maxByKey) {\n        if (max <= 0) continue;\n        // Cap at the viewport width so one oversized cell can't blow out layout.\n        const pinned = Math.min(Math.ceil(max), root.clientWidth);\n        if (pinned > (prev[key] ?? 0)) { next[key] = pinned; changed = true; }\n      }\n      return changed ? next : prev;\n    });\n  }, [rootRef]);\n\n  // One ResizeObserver shared across all fit cells. It re-measures whenever a\n  // cell's box changes — crucially when content first appears after mount (which\n  // changes the cell's height even while its width is pinned), so a too-early or\n  // empty-cell measure self-corrects instead of sticking. Its initial callback\n  // also fires once after layout settles, covering route transitions and other\n  // post-mount layout shifts without depending on font/rAF timing.\n  const [fitObserver] = useState<ResizeObserver | null>(() =>\n    typeof ResizeObserver === 'undefined' ? null : new ResizeObserver(() => measureFitWidths()),\n  );\n  const observedRef = useRef<Set<Element>>(new Set());\n  useEffect(() => () => { fitObserver?.disconnect(); observedRef.current.clear(); }, [fitObserver]);\n\n  // Measure synchronously (before paint, so a wider row scrolling in never shows\n  // a clipped frame), then *diff* the observed set rather than re-observing every\n  // cell. Re-observing fires a redundant ResizeObserver callback per node, and\n  // `startIndex`/`endIndex` change every scroll frame — so observing only the\n  // cells that entered (and dropping the ones that left) keeps stable, already\n  // pinned cells from generating any observer traffic while scrolling. A newly\n  // entered cell still fires exactly once, which is when we want to measure it.\n  useLayoutEffect(() => {\n    if (!hasFit) return;\n    const root = rootRef.current;\n    if (!root) return;\n    measureFitWidths();\n    if (!fitObserver) return;\n    const current = new Set<Element>(root.querySelectorAll('[data-fit-key]'));\n    const observed = observedRef.current;\n    for (const el of observed) if (!current.has(el)) { fitObserver.unobserve(el); observed.delete(el); }\n    for (const el of current) if (!observed.has(el)) { fitObserver.observe(el); observed.add(el); }\n  }, [hasFit, fitColKey, fitWidths, startIndex, endIndex, containerHeight, containerWidth, items, measureFitWidths, fitObserver]);\n\n  // Cheap insurance: re-measure on the next two frames after mount / data /\n  // fit-column changes, in case the icons (or the injected FontAwesome sizing\n  // CSS) resolve a frame after the first synchronous pass. Safe and scoped —\n  // measureFitWidths only ever grows a pin, and this runs on mount / data change\n  // (not every scroll frame), so it keeps the diff-observe perf win.\n  useEffect(() => {\n    if (!hasFit) return;\n    let raf2 = 0;\n    const raf1 = requestAnimationFrame(() => {\n      measureFitWidths();\n      raf2 = requestAnimationFrame(() => measureFitWidths());\n    });\n    return () => { cancelAnimationFrame(raf1); cancelAnimationFrame(raf2); };\n  }, [hasFit, fitColKey, items, measureFitWidths]);\n\n  // Force a fresh fit-column measure regardless of current pins. Always installs\n  // a new empty object so the measure layout effect re-runs even when nothing\n  // was pinned (e.g. content changed while the column was still fit-content).\n  const recalculateColumns = useCallback(() => setFitWidths({}), []);\n\n  function handleToggleColumn(key: string) {\n    // Locked columns can't be toggled off.\n    if (columns?.find((c) => c.key === key)?.lockVisible) return;\n    const next = new Set(effectiveVisible);\n    if (next.has(key)) {\n      if (next.size <= 1) return;\n      next.delete(key);\n    } else {\n      next.add(key);\n    }\n    const nextArray = [...next];\n    if (!isControlled) setInternalVisibleKeys(next);\n    onVisibleColumnsChange?.(nextArray);\n  }\n\n  return {\n    hasColumns,\n    visibleColumns,\n    columnTemplate,\n    shouldShowToggle,\n    effectiveVisible,\n    manuallyHiddenCount,\n    toggleOpen,\n    setToggleOpen,\n    handleToggleColumn,\n    recalculateColumns,\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"useColumns.mjs","names":[],"sources":["../../../../package/common/virtualList/useColumns.ts"],"sourcesContent":["import React, { useState, useRef, useEffect, useLayoutEffect, useCallback } from 'react';\n\nimport {\n  buildColumnTemplate,\n  loadPersistedColumns,\n  isColumnInitiallyVisible,\n  COLUMN_STORAGE_PREFIX,\n  type PersistedColumns,\n} from './virtualList.utils';\nimport type { VirtualListColumn } from './virtualList.types';\n\ninterface UseColumnsArgs<T> {\n  columns?: VirtualListColumn<T>[];\n  items: T[];\n  multiSelect: boolean;\n  visibleColumnKeys?: string[];\n  onVisibleColumnsChange?: (keys: string[]) => void;\n  persistColumnsKey?: string;\n  showColumnToggle?: boolean;\n  rootRef: React.RefObject<HTMLDivElement | null>;\n  /** Visible-window bounds — re-measure `fit` columns as new cells scroll in. */\n  startIndex: number;\n  endIndex: number;\n  containerHeight: number;\n  /** Re-measure `fit` columns when the container width settles (e.g. after a route transition). */\n  containerWidth: number;\n}\n\ninterface UseColumnsResult<T> {\n  hasColumns: boolean;\n  visibleColumns: VirtualListColumn<T>[];\n  columnTemplate: string | undefined;\n  shouldShowToggle: boolean;\n  effectiveVisible: Set<string>;\n  /** How many default-visible columns the user has hidden (excludes defaultHidden). */\n  manuallyHiddenCount: number;\n  toggleOpen: boolean;\n  setToggleOpen: React.Dispatch<React.SetStateAction<boolean>>;\n  handleToggleColumn: (key: string) => void;\n  /** Imperative escape hatch: drop fit-column pins so they re-measure on the\n   *  next layout. For out-of-band content changes that don't flow through a new\n   *  `items` array or `columns` set (which reset automatically). */\n  recalculateColumns: () => void;\n}\n\n/**\n * Table-mode column logic: visibility (controlled or uncontrolled, with\n * localStorage persistence and runtime reconciliation), the toggle popover, and\n * `fit`-column width measurement that pins one shared px track across the header\n * and every row grid so they stay aligned.\n */\nexport function useColumns<T>({\n  columns,\n  items,\n  multiSelect,\n  visibleColumnKeys,\n  onVisibleColumnsChange,\n  persistColumnsKey,\n  showColumnToggle,\n  rootRef,\n  startIndex,\n  endIndex,\n  containerHeight,\n  containerWidth,\n}: UseColumnsArgs<T>): UseColumnsResult<T> {\n  const isControlled = visibleColumnKeys !== undefined;\n  const [toggleOpen, setToggleOpen] = useState(false);\n  // Measured px widths for `fit` columns, keyed by column key. Pinning these\n  // into the shared column template keeps the header and rows aligned (a raw\n  // `fit-content` track resolves per-grid and drifts). See the effects below.\n  const [fitWidths, setFitWidths] = useState<Record<string, number>>({});\n\n  const [internalVisibleKeys, setInternalVisibleKeys] = useState<Set<string>>(() => {\n    const persisted = loadPersistedColumns(persistColumnsKey);\n    return new Set((columns ?? []).filter((c) => isColumnInitiallyVisible(c, persisted)).map((c) => c.key));\n  });\n  // The set of column keys the internal visibility state was last reconciled\n  // against. The lazy initializer above only runs at mount, so without this a\n  // list that mounts in list mode (no columns) and later switches to table mode\n  // would keep an empty visible set and render no columns.\n  const knownColumnKeysRef = useRef<Set<string>>(new Set((columns ?? []).map((c) => c.key)));\n\n  // Re-derive internal visibility when the column set changes at runtime: new\n  // columns get their saved/default visibility, removed columns drop out, and\n  // existing columns keep whatever the user toggled them to. This is also what\n  // applies persisted settings when a list switches from list mode to table\n  // mode (columns absent at mount, supplied later).\n  useEffect(() => {\n    if (isControlled) return;\n    const cols = columns ?? [];\n    const currentKeys = new Set(cols.map((c) => c.key));\n    const known = knownColumnKeysRef.current;\n    let identical = currentKeys.size === known.size;\n    if (identical)\n      for (const k of currentKeys)\n        if (!known.has(k)) {\n          identical = false;\n          break;\n        }\n    if (identical) return;\n    knownColumnKeysRef.current = currentKeys;\n    const persisted = loadPersistedColumns(persistColumnsKey);\n    setInternalVisibleKeys((prev) => {\n      const next = new Set<string>();\n      for (const c of cols) {\n        if (known.has(c.key)) {\n          if (prev.has(c.key)) next.add(c.key); // preserve the current-session choice\n        } else if (isColumnInitiallyVisible(c, persisted)) {\n          next.add(c.key); // newly-added column: saved setting, else defaultHidden\n        }\n      }\n      return next;\n    });\n  }, [columns, isControlled, persistColumnsKey]);\n\n  // Persist visibility whenever it changes (uncontrolled mode only). Skip while\n  // there are no columns, or the transient empty state during a list→table\n  // switch before the reconcile effect above has filled in the visible set —\n  // writing then would clobber the saved config with an empty set.\n  useEffect(() => {\n    if (isControlled || !persistColumnsKey || typeof window === 'undefined') return;\n    const cols = columns ?? [];\n    if (cols.length === 0 || internalVisibleKeys.size === 0) return;\n    try {\n      window.localStorage.setItem(\n        COLUMN_STORAGE_PREFIX + persistColumnsKey,\n        JSON.stringify({ visible: [...internalVisibleKeys], known: cols.map((c) => c.key) } satisfies PersistedColumns),\n      );\n    } catch {\n      // Storage full or unavailable — non-fatal, just don't persist.\n    }\n  }, [internalVisibleKeys, columns, isControlled, persistColumnsKey]);\n\n  // Locked columns can never be hidden — force them into the visible set even if\n  // a controlled `visibleColumnKeys` or persisted state omits them. Only clone\n  // (rather than mutate the state Set) when a locked key is actually missing;\n  // in uncontrolled mode they're already present via isColumnInitiallyVisible.\n  const baseVisible: Set<string> = isControlled ? new Set(visibleColumnKeys) : internalVisibleKeys;\n  const lockedKeys = (columns ?? []).filter((c) => c.lockVisible).map((c) => c.key);\n  const effectiveVisible: Set<string> = lockedKeys.some((k) => !baseVisible.has(k))\n    ? new Set([...baseVisible, ...lockedKeys])\n    : baseVisible;\n\n  const hasColumns = !!columns?.length;\n  const visibleColumns = hasColumns ? columns!.filter((c) => effectiveVisible.has(c.key)) : [];\n  // A column counts as \"manually hidden\" only if it's default-visible yet\n  // currently hidden — a defaultHidden column being hidden is its default\n  // state, not a user choice, so it never contributes to the chip.\n  const manuallyHiddenCount = hasColumns\n    ? columns!.filter((c) => !c.defaultHidden && !effectiveVisible.has(c.key)).length\n    : 0;\n  const selectPrefix = multiSelect && hasColumns ? '40px ' : '';\n  const columnTemplate = hasColumns ? `${selectPrefix}${buildColumnTemplate(visibleColumns, fitWidths)}` : undefined;\n  // Hide the gear entirely when nothing is left to toggle (every column opts out).\n  const shouldShowToggle = showColumnToggle !== false && hasColumns && columns!.some((c) => !c.hideFromToggle);\n\n  // ── `fit` column width measurement ──────────────────────────────────────────\n  const fitColumns = visibleColumns.filter((c) => c.width.type === 'fit');\n  const hasFit = fitColumns.length > 0;\n  const fitColKey = fitColumns.map((c) => c.key).join('|');\n\n  // Drop the measured pins when the data or the fit-column set changes, so the\n  // measure effect below re-reads the true intrinsic width on the next pass —\n  // this is what lets a column shrink (during scroll the effect only grows it,\n  // to avoid jitter). Resetting state during render is React's recommended\n  // pattern for \"reset on prop change\" and avoids a cascading effect render.\n  const [fitReset, setFitReset] = useState<{ key: string; items: T[] }>({ key: fitColKey, items });\n  if (fitReset.key !== fitColKey || fitReset.items !== items) {\n    setFitReset({ key: fitColKey, items });\n    if (Object.keys(fitWidths).length > 0) setFitWidths({});\n  }\n\n  // Measure every fit cell currently in the DOM (header + visible rows), keyed\n  // by its `data-fit-key`, and grow each column's pin to the widest. Reading the\n  // key off the DOM (rather than closing over `fitColumns`) keeps this a stable\n  // callback the ResizeObserver below can reuse. `scrollWidth` reports the true\n  // content width even when the cell is pinned narrower than its content, so a\n  // later pass always recovers a column first measured while it was still empty\n  // (e.g. an actions cell whose buttons mount a tick after the row commits — its\n  // empty width is just the padding, ~24px, which \"only grow\" can't undo).\n  const measureFitWidths = useCallback(() => {\n    const root = rootRef.current;\n    if (!root) return;\n    const maxByKey = new Map<string, number>();\n    root.querySelectorAll('[data-fit-key]').forEach((node) => {\n      const el = node as HTMLElement;\n      const key = el.getAttribute('data-fit-key');\n      if (!key) return;\n      const overflowing = el.scrollWidth > el.clientWidth;\n      let w = el.scrollWidth;\n      // Only resolve computed padding when we actually need it — the overflow\n      // fix-up, or the collapse check below — so the hot scroll path stays cheap\n      // for plain in-flow cells.\n      if (overflowing || el.firstElementChild) {\n        const cs = getComputedStyle(el);\n        const padLeft = parseFloat(cs.paddingLeft) || 0;\n        const padRight = parseFloat(cs.paddingRight) || 0;\n        // scrollWidth includes the left padding but drops the right padding when\n        // the content overflows — add it back.\n        if (overflowing) w += padRight;\n        // Collapsed-content case (FontAwesome icons etc.): element children are\n        // present, yet scrollWidth is only the cell's padding because their boxes\n        // overflow via `overflow: visible` and carry no intrinsic width, so they\n        // don't count toward scrollWidth (and, when right-aligned, overflow to the\n        // *left* into negative offsets). ONLY then walk the descendants for their\n        // true span — once a real width pins, the cell is no longer collapsed, so\n        // this stops running on every scroll frame.\n        if (el.firstElementChild && !overflowing && el.scrollWidth <= padLeft + padRight + 1) {\n          let minLeft = Infinity;\n          let maxRight = -Infinity;\n          el.querySelectorAll('*').forEach((d) => {\n            const r = d.getBoundingClientRect();\n            if (r.left < minLeft) minLeft = r.left;\n            if (r.right > maxRight) maxRight = r.right;\n          });\n          if (maxRight > minLeft) {\n            const span = Math.ceil(maxRight - minLeft) + padLeft + padRight;\n            if (span > w) w = span;\n          }\n        }\n      }\n      if (w > (maxByKey.get(key) ?? 0)) maxByKey.set(key, w);\n    });\n    if (maxByKey.size === 0) return;\n    setFitWidths((prev) => {\n      let changed = false;\n      const next = { ...prev };\n      for (const [key, max] of maxByKey) {\n        if (max <= 0) continue;\n        // Cap at the viewport width so one oversized cell can't blow out layout.\n        const pinned = Math.min(Math.ceil(max), root.clientWidth);\n        if (pinned > (prev[key] ?? 0)) {\n          next[key] = pinned;\n          changed = true;\n        }\n      }\n      return changed ? next : prev;\n    });\n  }, [rootRef]);\n\n  // One ResizeObserver shared across all fit cells. It re-measures whenever a\n  // cell's box changes — crucially when content first appears after mount (which\n  // changes the cell's height even while its width is pinned), so a too-early or\n  // empty-cell measure self-corrects instead of sticking. Its initial callback\n  // also fires once after layout settles, covering route transitions and other\n  // post-mount layout shifts without depending on font/rAF timing.\n  const [fitObserver] = useState<ResizeObserver | null>(() =>\n    typeof ResizeObserver === 'undefined' ? null : new ResizeObserver(() => measureFitWidths()),\n  );\n  const observedRef = useRef<Set<Element>>(new Set());\n  useEffect(\n    () => () => {\n      fitObserver?.disconnect();\n      observedRef.current.clear();\n    },\n    [fitObserver],\n  );\n\n  // Measure synchronously (before paint, so a wider row scrolling in never shows\n  // a clipped frame), then *diff* the observed set rather than re-observing every\n  // cell. Re-observing fires a redundant ResizeObserver callback per node, and\n  // `startIndex`/`endIndex` change every scroll frame — so observing only the\n  // cells that entered (and dropping the ones that left) keeps stable, already\n  // pinned cells from generating any observer traffic while scrolling. A newly\n  // entered cell still fires exactly once, which is when we want to measure it.\n  useLayoutEffect(() => {\n    if (!hasFit) return;\n    const root = rootRef.current;\n    if (!root) return;\n    measureFitWidths();\n    if (!fitObserver) return;\n    const current = new Set<Element>(root.querySelectorAll('[data-fit-key]'));\n    const observed = observedRef.current;\n    for (const el of observed)\n      if (!current.has(el)) {\n        fitObserver.unobserve(el);\n        observed.delete(el);\n      }\n    for (const el of current)\n      if (!observed.has(el)) {\n        fitObserver.observe(el);\n        observed.add(el);\n      }\n  }, [\n    rootRef,\n    hasFit,\n    fitColKey,\n    fitWidths,\n    startIndex,\n    endIndex,\n    containerHeight,\n    containerWidth,\n    items,\n    measureFitWidths,\n    fitObserver,\n  ]);\n\n  // Cheap insurance: re-measure on the next two frames after mount / data /\n  // fit-column changes, in case the icons (or the injected FontAwesome sizing\n  // CSS) resolve a frame after the first synchronous pass. Safe and scoped —\n  // measureFitWidths only ever grows a pin, and this runs on mount / data change\n  // (not every scroll frame), so it keeps the diff-observe perf win.\n  useEffect(() => {\n    if (!hasFit) return;\n    let raf2 = 0;\n    const raf1 = requestAnimationFrame(() => {\n      measureFitWidths();\n      raf2 = requestAnimationFrame(() => measureFitWidths());\n    });\n    return () => {\n      cancelAnimationFrame(raf1);\n      cancelAnimationFrame(raf2);\n    };\n  }, [hasFit, fitColKey, items, measureFitWidths]);\n\n  // Force a fresh fit-column measure regardless of current pins. Always installs\n  // a new empty object so the measure layout effect re-runs even when nothing\n  // was pinned (e.g. content changed while the column was still fit-content).\n  const recalculateColumns = useCallback(() => setFitWidths({}), []);\n\n  function handleToggleColumn(key: string) {\n    // Locked columns can't be toggled off.\n    if (columns?.find((c) => c.key === key)?.lockVisible) return;\n    const next = new Set(effectiveVisible);\n    if (next.has(key)) {\n      if (next.size <= 1) return;\n      next.delete(key);\n    } else {\n      next.add(key);\n    }\n    const nextArray = [...next];\n    if (!isControlled) setInternalVisibleKeys(next);\n    onVisibleColumnsChange?.(nextArray);\n  }\n\n  return {\n    hasColumns,\n    visibleColumns,\n    columnTemplate,\n    shouldShowToggle,\n    effectiveVisible,\n    manuallyHiddenCount,\n    toggleOpen,\n    setToggleOpen,\n    handleToggleColumn,\n    recalculateColumns,\n  };\n}\n"],"mappings":"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"}

package/dist/esm/common/virtualList/useRowDrag.mjs

@@ -1,2 +1,2 @@
-import e from"./virtualList.module.mjs";import{lastDescendantIndex as t,resolveReorderTarget as n,resolveTreeDropTarget as r}from"./virtualList.utils.mjs";import{useCallback as i,useEffect as a,useLayoutEffect as o,useRef as s,useState as c}from"react";function l({reorderable:l,treeReorder:u,onReorder:d,onTreeDrop:f,longPressDelay:ee,dragHandle:p,treeIndentPx:m,keys:h,depths:g,isGroupAt:_,rootRef:v,keysRef:y}){let b=s(null),[x,S]=c(null),[C,w]=c(null),T=s(null),E=s(d),D=s(f),O=s(u),k=s(g),A=s(_),j=s(!0),M=s(null),[N,te]=c(null),P=s(null),F=s(!1),I=s(null),L=s(0),R=s(0),z=s(null),B=s(!1),V=s(null),H=s(0),U=s(0),W=s(0),[G]=c(()=>typeof window<`u`&&typeof window.matchMedia==`function`?window.matchMedia(`(pointer: coarse)`).matches:!1);o(()=>{E.current=d,D.current=f,O.current=u,k.current=g,T.current=C,A.current=_});function K(e){G||M.current!==e&&(M.current=e,te(e))}function ne(e,t){t.buttons===0&&K(t.target.closest(`[data-drag-handle]`)?e:null)}function re(e){e.buttons===0&&K(null)}function ie(e,t){if(t.button!==0)return;let n=!!t.target.closest(`[data-drag-handle]`);j.current=n,n&&K(e)}function ae(e,t){if(p&&!j.current){t.preventDefault();return}b.current=e,S(e),u&&w(null)}function oe(e,n,i){let a=b.current;if(a==null)return null;let o=h.indexOf(a);if(o!==-1&&e>=o&&e<=t(o,g))return null;let s=r(n,i.top,i.height,_(e));return{key:h[e],position:s}}function se(e,t){t.preventDefault();let n=t.currentTarget.getBoundingClientRect(),r=oe(e,t.clientY,n);w(e=>e?.key===r?.key&&e?.position===r?.position?e:r)}function ce(){let e=b.current,t=T.current;e!=null&&t&&t.key!==e&&f?.(e,t)}function le(e){e.preventDefault(),ce(),w(null),b.current=null,S(null),K(null)}function ue(){w(null),b.current=null,S(null),K(null)}function de(e,t){t.preventDefault();let r=b.current;if(r==null)return;let i=h.indexOf(r),a=t.currentTarget.getBoundingClientRect(),o=n(i,e,t.clientY,a.top,a.height);o!=null&&d?.(i,o)}function fe(){b.current=null,S(null),K(null)}let q=i(e=>{let i=b.current,a=v.current;if(i==null||!a)return;let o=V.current?R.current-H.current+W.current/2:R.current,s=document.elementFromPoint(e,o),c=s&&a.contains(s)?s.closest(`[data-index]`):null;if(!c)return;let l=Number(c.dataset.index);if(Number.isNaN(l))return;let u=y.current.indexOf(i),d=c.getBoundingClientRect();if(O.current){let e=y.current,n=k.current;if(u!==-1&&l>=u&&l<=t(u,n)){w(null);return}let i=r(o,d.top,d.height,A.current(l)),a={key:e[l],position:i};w(e=>e?.key===a.key&&e?.position===a.position?e:a);return}let f=n(u,l,o,d.top,d.height);f!=null&&E.current?.(u,f)},[v,y]),J=i(()=>{let e=V.current;e&&(e.style.transform=`translate(${U.current}px, ${R.current-H.current}px)`)},[]),Y=i(()=>{let e=v.current;if(!e||!F.current){z.current=null;return}let t=e.getBoundingClientRect(),n=L.current,r=R.current,i=0;n>=t.left&&n<=t.right&&r>=t.top&&r<=t.bottom&&(r<t.top+48?i=-Math.min(18,Math.ceil((t.top+48-r)/3)):r>t.bottom-48&&(i=Math.min(18,Math.ceil((r-(t.bottom-48))/3)))),i!==0&&(e.scrollTop+=i,q(n)),z.current=requestAnimationFrame(Y)},[q,v]),X=i(()=>{if(P.current!=null&&(clearTimeout(P.current),P.current=null),window.removeEventListener(`touchmove`,Z),window.removeEventListener(`touchend`,X),window.removeEventListener(`touchcancel`,X),z.current!=null&&(cancelAnimationFrame(z.current),z.current=null),V.current&&=(V.current.remove(),null),document.body.style.touchAction=``,document.body.style.overscrollBehavior=``,F.current&&(B.current=!0,setTimeout(()=>{B.current=!1},350),O.current)){let e=b.current,t=T.current;e!=null&&t&&t.key!==e&&D.current?.(e,t)}w(null),F.current=!1,I.current=null,b.current=null,S(null)},[]),Z=i(e=>{let t=e.touches[0];if(t){if(L.current=t.clientX,R.current=t.clientY,!F.current){let e=I.current;e!=null&&Math.abs(t.clientY-e)>10&&P.current!=null&&(clearTimeout(P.current),P.current=null);return}e.cancelable&&e.preventDefault(),J(),q(t.clientX)}},[q,J]);function pe(e,t){if(!l&&!u||p&&!t.target.closest(`[data-drag-handle]`)||P.current!=null||F.current)return;let n=t.touches[0];n&&(I.current=n.clientY,L.current=n.clientX,R.current=n.clientY,window.addEventListener(`touchmove`,Z,{passive:!1}),window.addEventListener(`touchend`,X),window.addEventListener(`touchcancel`,X),P.current=window.setTimeout(()=>{P.current=null,F.current=!0,b.current=e,S(e),navigator.vibrate?.(10),document.body.style.touchAction=`none`,document.body.style.overscrollBehavior=`none`,me(e),z.current??=requestAnimationFrame(Y)},ee))}function me(t){let n=v.current;if(!n)return;let r=y.current.indexOf(t),i=n.querySelector(`[data-index="${r}"]`);if(!i)return;let a=i.getBoundingClientRect();H.current=R.current-a.top,U.current=a.left,W.current=a.height;let o=i.cloneNode(!0);o.removeAttribute(`data-index`),o.setAttribute(`data-drag-clone`,`true`),o.setAttribute(`aria-hidden`,`true`),o.classList.add(e.virtualListDragClone),Object.assign(o.style,{position:`fixed`,left:`0`,top:`0`,width:`${a.width}px`,height:`${a.height}px`,margin:`0`,opacity:`1`,pointerEvents:`none`,zIndex:`3`,background:`var(--background)`,boxShadow:`var(--card-shadow)`,borderRadius:`var(--default-border-radius)`}),n.appendChild(o),V.current=o,J()}a(()=>X,[X]);let Q=l||u,$=Q&&!G;function he(e,t){let n=u&&C?.key===t?C.position:void 0;return{reorderable:Q&&!p,mouseDragEnabled:$,draggable:$&&(!p||t===N)||void 0,isDragging:Q&&t===x,onMouseDown:Q&&p?e=>ie(t,e):void 0,onMouseOver:Q&&p?e=>ne(t,e):void 0,onMouseLeave:Q&&p?re:void 0,onDragStart:Q?e=>ae(t,e):void 0,onDragOver:u?t=>se(e,t):l?t=>de(e,t):void 0,onDragEnd:u?ue:l?fe:void 0,onDrop:u?le:void 0,onTouchStart:Q?e=>pe(t,e):void 0,dropPosition:n,dropIndentPx:n?(g[e]??0)*m:void 0}}function ge(){return B.current?(B.current=!1,!0):!1}return{draggingKey:x,dragEnabled:Q,getRowDragProps:he,consumeSuppressedClick:ge}}export{l as useRowDrag};
+import e from"./virtualList.module.mjs";import{lastDescendantIndex as t,resolveReorderTarget as n,resolveTreeDropTarget as r}from"./virtualList.utils.mjs";import{useCallback as i,useEffect as a,useLayoutEffect as o,useRef as s,useState as c}from"react";function l({reorderable:l,treeReorder:u,onReorder:d,onTreeDrop:f,longPressDelay:ee,dragHandle:p,treeIndentPx:m,keys:h,depths:g,isGroupAt:_,rootRef:v,keysRef:y}){let b=s(null),[x,S]=c(null),[C,w]=c(null),T=s(null),E=s(d),D=s(f),O=s(u),k=s(g),A=s(_),j=s(!0),M=s(null),[N,te]=c(null),P=s(null),F=s(!1),I=s(null),L=s(0),R=s(0),z=s(null),B=s(!1),V=s(null),H=s(0),U=s(0),W=s(0),[G]=c(()=>typeof window<`u`&&typeof window.matchMedia==`function`&&window.matchMedia(`(pointer: coarse)`).matches);o(()=>{E.current=d,D.current=f,O.current=u,k.current=g,T.current=C,A.current=_});function K(e){G||M.current!==e&&(M.current=e,te(e))}function ne(e,t){t.buttons===0&&K(t.target.closest(`[data-drag-handle]`)?e:null)}function re(e){e.buttons===0&&K(null)}function ie(e,t){if(t.button!==0)return;let n=!!t.target.closest(`[data-drag-handle]`);j.current=n,n&&K(e)}function ae(e,t){if(p&&!j.current){t.preventDefault();return}b.current=e,S(e),u&&w(null)}function oe(e,n,i){let a=b.current;if(a==null)return null;let o=h.indexOf(a);if(o!==-1&&e>=o&&e<=t(o,g))return null;let s=r(n,i.top,i.height,_(e));return{key:h[e],position:s}}function se(e,t){t.preventDefault();let n=t.currentTarget.getBoundingClientRect(),r=oe(e,t.clientY,n);w(e=>e?.key===r?.key&&e?.position===r?.position?e:r)}function ce(){let e=b.current,t=T.current;e!=null&&t&&t.key!==e&&f?.(e,t)}function le(e){e.preventDefault(),ce(),w(null),b.current=null,S(null),K(null)}function ue(){w(null),b.current=null,S(null),K(null)}function de(e,t){t.preventDefault();let r=b.current;if(r==null)return;let i=h.indexOf(r),a=t.currentTarget.getBoundingClientRect(),o=n(i,e,t.clientY,a.top,a.height);o!=null&&d?.(i,o)}function fe(){b.current=null,S(null),K(null)}let q=i(e=>{let i=b.current,a=v.current;if(i==null||!a)return;let o=V.current?R.current-H.current+W.current/2:R.current,s=document.elementFromPoint(e,o),c=s&&a.contains(s)?s.closest(`[data-index]`):null;if(!c)return;let l=Number(c.dataset.index);if(Number.isNaN(l))return;let u=y.current.indexOf(i),d=c.getBoundingClientRect();if(O.current){let e=y.current,n=k.current;if(u!==-1&&l>=u&&l<=t(u,n)){w(null);return}let i=r(o,d.top,d.height,A.current(l)),a={key:e[l],position:i};w(e=>e?.key===a.key&&e?.position===a.position?e:a);return}let f=n(u,l,o,d.top,d.height);f!=null&&E.current?.(u,f)},[v,y]),J=i(()=>{let e=V.current;e&&(e.style.transform=`translate(${U.current}px, ${R.current-H.current}px)`)},[]),Y=i(()=>{let e=v.current;if(!e||!F.current){z.current=null;return}let t=e.getBoundingClientRect(),n=L.current,r=R.current,i=0;n>=t.left&&n<=t.right&&r>=t.top&&r<=t.bottom&&(r<t.top+48?i=-Math.min(18,Math.ceil((t.top+48-r)/3)):r>t.bottom-48&&(i=Math.min(18,Math.ceil((r-(t.bottom-48))/3)))),i!==0&&(e.scrollTop+=i,q(n)),z.current=requestAnimationFrame(Y)},[q,v]),X=i(()=>{if(P.current!=null&&(clearTimeout(P.current),P.current=null),window.removeEventListener(`touchmove`,Z),window.removeEventListener(`touchend`,X),window.removeEventListener(`touchcancel`,X),z.current!=null&&(cancelAnimationFrame(z.current),z.current=null),V.current&&=(V.current.remove(),null),document.body.style.touchAction=``,document.body.style.overscrollBehavior=``,F.current&&(B.current=!0,setTimeout(()=>{B.current=!1},350),O.current)){let e=b.current,t=T.current;e!=null&&t&&t.key!==e&&D.current?.(e,t)}w(null),F.current=!1,I.current=null,b.current=null,S(null)},[]),Z=i(e=>{let t=e.touches[0];if(t){if(L.current=t.clientX,R.current=t.clientY,!F.current){let e=I.current;e!=null&&Math.abs(t.clientY-e)>10&&P.current!=null&&(clearTimeout(P.current),P.current=null);return}e.cancelable&&e.preventDefault(),J(),q(t.clientX)}},[q,J]);function pe(e,t){if(!l&&!u||p&&!t.target.closest(`[data-drag-handle]`)||P.current!=null||F.current)return;let n=t.touches[0];n&&(I.current=n.clientY,L.current=n.clientX,R.current=n.clientY,window.addEventListener(`touchmove`,Z,{passive:!1}),window.addEventListener(`touchend`,X),window.addEventListener(`touchcancel`,X),P.current=window.setTimeout(()=>{P.current=null,F.current=!0,b.current=e,S(e),navigator.vibrate?.(10),document.body.style.touchAction=`none`,document.body.style.overscrollBehavior=`none`,me(e),z.current??=requestAnimationFrame(Y)},ee))}function me(t){let n=v.current;if(!n)return;let r=y.current.indexOf(t),i=n.querySelector(`[data-index="${r}"]`);if(!i)return;let a=i.getBoundingClientRect();H.current=R.current-a.top,U.current=a.left,W.current=a.height;let o=i.cloneNode(!0);o.removeAttribute(`data-index`),o.setAttribute(`data-drag-clone`,`true`),o.setAttribute(`aria-hidden`,`true`),o.classList.add(e.virtualListDragClone),Object.assign(o.style,{position:`fixed`,left:`0`,top:`0`,width:`${a.width}px`,height:`${a.height}px`,margin:`0`,opacity:`1`,pointerEvents:`none`,zIndex:`3`,background:`var(--background)`,boxShadow:`var(--card-shadow)`,borderRadius:`var(--default-border-radius)`}),n.appendChild(o),V.current=o,J()}a(()=>X,[X]);let Q=l||u,$=Q&&!G;function he(e,t){let n=u&&C?.key===t?C.position:void 0;return{reorderable:Q&&!p,mouseDragEnabled:$,draggable:$&&(!p||t===N)||void 0,isDragging:Q&&t===x,onMouseDown:Q&&p?e=>ie(t,e):void 0,onMouseOver:Q&&p?e=>ne(t,e):void 0,onMouseLeave:Q&&p?re:void 0,onDragStart:Q?e=>ae(t,e):void 0,onDragOver:u?t=>se(e,t):l?t=>de(e,t):void 0,onDragEnd:u?ue:l?fe:void 0,onDrop:u?le:void 0,onTouchStart:Q?e=>pe(t,e):void 0,dropPosition:n,dropIndentPx:n?(g[e]??0)*m:void 0}}function ge(){return B.current?(B.current=!1,!0):!1}return{draggingKey:x,dragEnabled:Q,getRowDragProps:he,consumeSuppressedClick:ge}}export{l as useRowDrag};
 //# sourceMappingURL=useRowDrag.mjs.map