@accelint/design-toolkit 9.6.0 → 9.8.0

package/dist/components/video/index.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0
@@ -12,7 +12,7 @@
 
 import { VideoProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime184 from "react/jsx-runtime";
+import * as react_jsx_runtime199 from "react/jsx-runtime";
 
 //#region src/components/video/index.d.ts
 
@@ -91,7 +91,7 @@ declare function Video({
   noMutedPref,
   lang,
   ...rest
-}: VideoProps): react_jsx_runtime184.JSX.Element;
+}: VideoProps): react_jsx_runtime199.JSX.Element;
 //#endregion
 export { Video };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/video/index.js

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0
@@ -14,6 +14,7 @@
 'use client';
 
 import { Icon } from "../icon/index.js";
+import { createLoggerDomain } from "../../utils/logger/index.js";
 import { MediaControlsProvider } from "../media-controls/context.js";
 import { MuteButton } from "../media-controls/mute-button.js";
 import { PlayButton } from "../media-controls/play-button.js";
@@ -27,7 +28,6 @@ import "client-only";
 import { useCallback, useEffect, useState } from "react";
 import { clsx } from "@accelint/design-foundation/lib/utils";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { getLogger } from "@accelint/logger/default";
 import { formatError } from "media-chrome/dist/labels/labels.js";
 import { MediaController } from "media-chrome/react";
 import { MediaProvider, useMediaRef, useMediaSelector } from "media-chrome/react/media-store";
@@ -35,12 +35,7 @@ import { Loop, Problem } from "@accelint/icons";
 import styles from "./styles.module.css";
 
 //#region src/components/video/index.tsx
-const logger = getLogger({
-	enabled: true,
-	level: "error",
-	prefix: "[Video]",
-	pretty: true
-});
+const logger = createLoggerDomain("[Video]");
 const selectMediaLoading = (state) => state.mediaLoading;
 const selectMediaDuration = (state) => state.mediaDuration;
 /**
@@ -88,7 +83,7 @@ function VideoInner({ src, poster, children, classNames, autoPlay, loop, muted,
 	}, [onTimeUpdate]);
 	const handleError = useCallback((e) => {
 		const mediaError = e.currentTarget.error;
-		logger.withContext({ src }).withError(mediaError).error("Failed to load video");
+		logger.withMetadata({ src }).withError(mediaError).error("Failed to load video");
 		setErrorMessage((mediaError && formatError(mediaError)?.message) ?? "Unable to load video file");
 		if (mediaError) onError?.(mediaError);
 	}, [src, onError]);

package/dist/components/video/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/video/index.tsx"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { Loop, Problem } from '@accelint/icons';\nimport { getLogger } from '@accelint/logger/default';\nimport { formatError } from 'media-chrome/dist/labels/labels.js';\nimport { MediaController } from 'media-chrome/react';\nimport {\n  MediaProvider,\n  useMediaRef,\n  useMediaSelector,\n} from 'media-chrome/react/media-store';\nimport type { MediaState } from 'media-chrome/react/media-store';\nimport { useCallback, useEffect, useState } from 'react';\nimport { Icon } from '../icon';\nimport { FullscreenButton } from '../media-controls/fullscreen-button';\nimport { MediaControlsProvider } from '../media-controls/context';\nimport { MuteButton } from '../media-controls/mute-button';\nimport { PlayButton } from '../media-controls/play-button';\nimport { PlaybackRateButton } from '../media-controls/playback-rate';\nimport { SeekButton } from '../media-controls/seek-button';\nimport { TimeDisplay } from '../media-controls/time-display';\nimport { TimeRange } from '../media-controls/time-range';\nimport { VolumeSlider } from '../media-controls/volume-slider';\nimport styles from './styles.module.css';\nimport type { VideoProps } from './types';\n\nconst logger = getLogger({\n  enabled: true,\n  level: 'error',\n  prefix: '[Video]',\n  pretty: true,\n});\n\nconst selectMediaLoading = (state: MediaState) => state.mediaLoading;\nconst selectMediaDuration = (state: MediaState) => state.mediaDuration;\n\n/**\n * Internal component that renders within MediaProvider context.\n *\n * This component is separated from the main Video component to allow use of\n * media-chrome hooks (useMediaRef) that require MediaProvider context.\n * The outer Video component wraps everything in MediaProvider, then VideoInner\n * handles the actual video element and controls rendering.\n *\n * @param props - The component props.\n * @param props.src - Video source URL.\n * @param props.poster - Poster image URL displayed before playback.\n * @param props.classNames - Class names for sub-elements.\n * @param props.children - Custom controls (replaces default layout).\n * @param props.autoPlay - Whether to autoplay the video.\n * @param props.loop - Whether to loop the video.\n * @param props.muted - Whether the video starts muted.\n * @param props.preload - Video preload strategy.\n * @param props.crossOrigin - CORS setting for the video element.\n * @param props.isDisabled - Whether to disable all video controls.\n * @param props.onEnded - Callback when video ends.\n * @param props.onTimeUpdate - Callback when playback time updates.\n * @param props.onError - Callback when an error occurs.\n * @param props.playbackRates - Custom playback rate options.\n * @returns The video element with controls.\n */\nfunction VideoInner({\n  src,\n  poster,\n  children,\n  classNames,\n  autoPlay,\n  loop,\n  muted,\n  preload = 'metadata',\n  crossOrigin,\n  isDisabled: isDisabledProp,\n  onEnded,\n  onTimeUpdate,\n  onError,\n  playbackRates,\n}: VideoProps) {\n  const mediaRef = useMediaRef();\n  const [errorMessage, setErrorMessage] = useState<string>('');\n\n  // biome-ignore lint/correctness/useExhaustiveDependencies: src is intentionally used as a trigger to reset error state when video source changes\n  useEffect(() => {\n    setErrorMessage('');\n  }, [src]);\n\n  const mediaLoading = useMediaSelector(selectMediaLoading);\n  const mediaDuration = useMediaSelector(selectMediaDuration);\n  const isMetadataLoaded =\n    mediaDuration !== null && mediaDuration !== undefined && mediaDuration > 0;\n  const hasError = errorMessage !== '';\n  const showLoading = !hasError && (mediaLoading || !isMetadataLoaded);\n  const isDisabled = isDisabledProp === true || hasError;\n\n  const handleEnded = useCallback(() => {\n    onEnded?.();\n  }, [onEnded]);\n\n  const handleTimeUpdate = useCallback(\n    (e: React.SyntheticEvent<HTMLVideoElement>) => {\n      onTimeUpdate?.(e.currentTarget.currentTime);\n    },\n    [onTimeUpdate],\n  );\n\n  const handleError = useCallback(\n    (e: React.SyntheticEvent<HTMLVideoElement>) => {\n      const mediaError = e.currentTarget.error;\n      logger\n        .withContext({ src })\n        .withError(mediaError)\n        .error('Failed to load video');\n      setErrorMessage(\n        (mediaError && formatError(mediaError)?.message) ??\n          'Unable to load video file',\n      );\n      if (mediaError) {\n        onError?.(mediaError);\n      }\n    },\n    [src, onError],\n  );\n\n  return (\n    <>\n      <video\n        ref={mediaRef}\n        slot='media'\n        className={clsx(styles.video, classNames?.video)}\n        data-testid='video-element'\n        autoPlay={autoPlay}\n        loop={loop}\n        muted={muted}\n        preload={preload}\n        crossOrigin={crossOrigin}\n        poster={poster}\n        playsInline\n        onEnded={handleEnded}\n        onTimeUpdate={handleTimeUpdate}\n        onError={handleError}\n      >\n        <source src={src} />\n      </video>\n\n      {showLoading && (\n        <output className={styles.loadingOverlay} aria-label='Loading video'>\n          <Icon size='medium' className={styles.loadingSpinner}>\n            <Loop />\n          </Icon>\n        </output>\n      )}\n\n      {errorMessage && (\n        <div className={styles.errorOverlay} role='alert'>\n          <Icon size='medium'>\n            <Problem />\n          </Icon>\n          <span className={styles.errorText}>{errorMessage}</span>\n        </div>\n      )}\n\n      <MediaControlsProvider isDisabled={isDisabled}>\n        {/* noautohide tells MediaController (web component) to keep this element visible */}\n        {children ?? (\n          // @ts-expect-error noautohide is a valid attribute for media-chrome's MediaController but not recognized by React typings\n          <div className={styles.controlsOverlay} noautohide=''>\n            <div className={clsx(styles.controls, classNames?.mediaControls)}>\n              <div className={clsx(styles.timeRow, classNames?.timeRow)}>\n                <TimeDisplay mode='current' />\n                <TimeRange />\n                <TimeDisplay mode='duration' />\n              </div>\n\n              <div\n                className={clsx(styles.controlsRow, classNames?.controlsRow)}\n              >\n                <div className={styles.leftGroup}>\n                  <div className={styles.volumeGroup}>\n                    <MuteButton />\n                    <VolumeSlider />\n                  </div>\n                </div>\n                <div className={styles.playbackGroup}>\n                  <SeekButton direction='backward' />\n                  <PlayButton />\n                  <SeekButton direction='forward' />\n                </div>\n                <div className={styles.rightGroup}>\n                  <PlaybackRateButton rates={playbackRates} />\n                  <FullscreenButton />\n                </div>\n              </div>\n            </div>\n          </div>\n        )}\n      </MediaControlsProvider>\n    </>\n  );\n}\n\n/**\n * A complete video player component.\n *\n * Combines an HTML video element with MediaControls to provide a fully-featured\n * video player with play/pause, seek, volume control, playback rate adjustment,\n * and fullscreen support.\n *\n * Uses media-chrome under the hood for state management and MediaController\n * for the accessible media chrome elements.\n *\n * @param props - The component props.\n * @param props.src - Video source URL. Must be accessible to the browser - if loading\n *   from a different origin, ensure the server sends appropriate CORS headers\n *   (Access-Control-Allow-Origin) or use the crossOrigin prop.\n * @param props.poster - Poster image URL displayed before playback starts.\n * @param props.classNames - Class names for sub-elements.\n * @param props.isDisabled - Disable all video controls.\n * @param props.crossOrigin - CORS setting ('anonymous' | 'use-credentials'). Required when\n *   loading video from a different origin that requires credentials.\n * @param props.playbackRates - Array of playback speed multipliers (default: [1, 2, 3]).\n *   Only positive finite numbers are accepted; invalid values are filtered out.\n * @param props.children - Custom controls to render instead of the default layout.\n * @param props.onEnded - Callback invoked when video playback finishes.\n * @param props.onTimeUpdate - Callback invoked during playback with current time in seconds.\n * @param props.onError - Callback invoked when video fails to load or encounters an error.\n * @param props.noHotkeys - Disable all keyboard shortcuts for media control.\n * @param props.hotkeys - Custom keyboard shortcuts configuration for media control.\n * @param props.noVolumePref - Disable automatic saving/restoring of volume preference.\n * @param props.noMutedPref - Disable automatic saving/restoring of muted state preference.\n * @param props.lang - Language code for localized media control labels.\n * @returns The rendered video player component.\n *\n * @example\n * ```tsx\n * // Basic usage\n * <Video src=\"video.mp4\" />\n * ```\n *\n * @example\n * ```tsx\n * // With poster image\n * <Video\n *   src=\"video.mp4\"\n *   poster=\"thumbnail.jpg\"\n * />\n * ```\n *\n * @example\n * ```tsx\n * // With event callbacks\n * <Video\n *   src=\"video.mp4\"\n *   onEnded={() => console.log('Ended')}\n *   onTimeUpdate={(time) => console.log('Current time:', time)}\n * />\n * ```\n *\n * @example\n * ```tsx\n * // Custom controls layout\n * <Video src=\"video.mp4\">\n *   <PlayButton />\n *   <TimeRange />\n * </Video>\n * ```\n */\nexport function Video({\n  classNames,\n  isDisabled,\n  noHotkeys,\n  hotkeys,\n  noVolumePref,\n  noMutedPref,\n  lang,\n  ...rest\n}: VideoProps) {\n  return (\n    <MediaProvider>\n      <MediaController\n        className={clsx('group/video', styles.container, classNames?.container)}\n        data-disabled={isDisabled || undefined}\n        noHotkeys={noHotkeys}\n        hotkeys={hotkeys}\n        noVolumePref={noVolumePref}\n        noMutedPref={noMutedPref}\n        lang={lang}\n      >\n        <VideoInner {...rest} classNames={classNames} isDisabled={isDisabled} />\n      </MediaController>\n    </MediaProvider>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/video/index.tsx"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { clsx } from '@accelint/design-foundation/lib/utils';\nimport { Loop, Problem } from '@accelint/icons';\nimport { formatError } from 'media-chrome/dist/labels/labels.js';\nimport { MediaController } from 'media-chrome/react';\nimport {\n  MediaProvider,\n  useMediaRef,\n  useMediaSelector,\n} from 'media-chrome/react/media-store';\nimport { useCallback, useEffect, useState } from 'react';\nimport { createLoggerDomain } from '@/utils/logger';\nimport { Icon } from '../icon';\nimport { MediaControlsProvider } from '../media-controls/context';\nimport { FullscreenButton } from '../media-controls/fullscreen-button';\nimport { MuteButton } from '../media-controls/mute-button';\nimport { PlayButton } from '../media-controls/play-button';\nimport { PlaybackRateButton } from '../media-controls/playback-rate';\nimport { SeekButton } from '../media-controls/seek-button';\nimport { TimeDisplay } from '../media-controls/time-display';\nimport { TimeRange } from '../media-controls/time-range';\nimport { VolumeSlider } from '../media-controls/volume-slider';\nimport styles from './styles.module.css';\nimport type { MediaState } from 'media-chrome/react/media-store';\nimport type { VideoProps } from './types';\n\nconst logger = createLoggerDomain('[Video]');\n\nconst selectMediaLoading = (state: MediaState) => state.mediaLoading;\nconst selectMediaDuration = (state: MediaState) => state.mediaDuration;\n\n/**\n * Internal component that renders within MediaProvider context.\n *\n * This component is separated from the main Video component to allow use of\n * media-chrome hooks (useMediaRef) that require MediaProvider context.\n * The outer Video component wraps everything in MediaProvider, then VideoInner\n * handles the actual video element and controls rendering.\n *\n * @param props - The component props.\n * @param props.src - Video source URL.\n * @param props.poster - Poster image URL displayed before playback.\n * @param props.classNames - Class names for sub-elements.\n * @param props.children - Custom controls (replaces default layout).\n * @param props.autoPlay - Whether to autoplay the video.\n * @param props.loop - Whether to loop the video.\n * @param props.muted - Whether the video starts muted.\n * @param props.preload - Video preload strategy.\n * @param props.crossOrigin - CORS setting for the video element.\n * @param props.isDisabled - Whether to disable all video controls.\n * @param props.onEnded - Callback when video ends.\n * @param props.onTimeUpdate - Callback when playback time updates.\n * @param props.onError - Callback when an error occurs.\n * @param props.playbackRates - Custom playback rate options.\n * @returns The video element with controls.\n */\nfunction VideoInner({\n  src,\n  poster,\n  children,\n  classNames,\n  autoPlay,\n  loop,\n  muted,\n  preload = 'metadata',\n  crossOrigin,\n  isDisabled: isDisabledProp,\n  onEnded,\n  onTimeUpdate,\n  onError,\n  playbackRates,\n}: VideoProps) {\n  const mediaRef = useMediaRef();\n  const [errorMessage, setErrorMessage] = useState<string>('');\n\n  // biome-ignore lint/correctness/useExhaustiveDependencies: src is intentionally used as a trigger to reset error state when video source changes\n  useEffect(() => {\n    setErrorMessage('');\n  }, [src]);\n\n  const mediaLoading = useMediaSelector(selectMediaLoading);\n  const mediaDuration = useMediaSelector(selectMediaDuration);\n  const isMetadataLoaded =\n    mediaDuration !== null && mediaDuration !== undefined && mediaDuration > 0;\n  const hasError = errorMessage !== '';\n  const showLoading = !hasError && (mediaLoading || !isMetadataLoaded);\n  const isDisabled = isDisabledProp === true || hasError;\n\n  const handleEnded = useCallback(() => {\n    onEnded?.();\n  }, [onEnded]);\n\n  const handleTimeUpdate = useCallback(\n    (e: React.SyntheticEvent<HTMLVideoElement>) => {\n      onTimeUpdate?.(e.currentTarget.currentTime);\n    },\n    [onTimeUpdate],\n  );\n\n  const handleError = useCallback(\n    (e: React.SyntheticEvent<HTMLVideoElement>) => {\n      // FIXME: this is currently always null\n      const mediaError = e.currentTarget.error;\n\n      logger\n        .withMetadata({ src })\n        .withError(mediaError)\n        .error('Failed to load video');\n      setErrorMessage(\n        (mediaError && formatError(mediaError)?.message) ??\n          'Unable to load video file',\n      );\n      if (mediaError) {\n        onError?.(mediaError);\n      }\n    },\n    [src, onError],\n  );\n\n  return (\n    <>\n      <video\n        ref={mediaRef}\n        slot='media'\n        className={clsx(styles.video, classNames?.video)}\n        data-testid='video-element'\n        autoPlay={autoPlay}\n        loop={loop}\n        muted={muted}\n        preload={preload}\n        crossOrigin={crossOrigin}\n        poster={poster}\n        playsInline\n        onEnded={handleEnded}\n        onTimeUpdate={handleTimeUpdate}\n        onError={handleError}\n      >\n        <source src={src} />\n      </video>\n\n      {showLoading && (\n        <output className={styles.loadingOverlay} aria-label='Loading video'>\n          <Icon size='medium' className={styles.loadingSpinner}>\n            <Loop />\n          </Icon>\n        </output>\n      )}\n\n      {errorMessage && (\n        <div className={styles.errorOverlay} role='alert'>\n          <Icon size='medium'>\n            <Problem />\n          </Icon>\n          <span className={styles.errorText}>{errorMessage}</span>\n        </div>\n      )}\n\n      <MediaControlsProvider isDisabled={isDisabled}>\n        {/* noautohide tells MediaController (web component) to keep this element visible */}\n        {children ?? (\n          // @ts-expect-error noautohide is a valid attribute for media-chrome's MediaController but not recognized by React typings\n          <div className={styles.controlsOverlay} noautohide=''>\n            <div className={clsx(styles.controls, classNames?.mediaControls)}>\n              <div className={clsx(styles.timeRow, classNames?.timeRow)}>\n                <TimeDisplay mode='current' />\n                <TimeRange />\n                <TimeDisplay mode='duration' />\n              </div>\n\n              <div\n                className={clsx(styles.controlsRow, classNames?.controlsRow)}\n              >\n                <div className={styles.leftGroup}>\n                  <div className={styles.volumeGroup}>\n                    <MuteButton />\n                    <VolumeSlider />\n                  </div>\n                </div>\n                <div className={styles.playbackGroup}>\n                  <SeekButton direction='backward' />\n                  <PlayButton />\n                  <SeekButton direction='forward' />\n                </div>\n                <div className={styles.rightGroup}>\n                  <PlaybackRateButton rates={playbackRates} />\n                  <FullscreenButton />\n                </div>\n              </div>\n            </div>\n          </div>\n        )}\n      </MediaControlsProvider>\n    </>\n  );\n}\n\n/**\n * A complete video player component.\n *\n * Combines an HTML video element with MediaControls to provide a fully-featured\n * video player with play/pause, seek, volume control, playback rate adjustment,\n * and fullscreen support.\n *\n * Uses media-chrome under the hood for state management and MediaController\n * for the accessible media chrome elements.\n *\n * @param props - The component props.\n * @param props.src - Video source URL. Must be accessible to the browser - if loading\n *   from a different origin, ensure the server sends appropriate CORS headers\n *   (Access-Control-Allow-Origin) or use the crossOrigin prop.\n * @param props.poster - Poster image URL displayed before playback starts.\n * @param props.classNames - Class names for sub-elements.\n * @param props.isDisabled - Disable all video controls.\n * @param props.crossOrigin - CORS setting ('anonymous' | 'use-credentials'). Required when\n *   loading video from a different origin that requires credentials.\n * @param props.playbackRates - Array of playback speed multipliers (default: [1, 2, 3]).\n *   Only positive finite numbers are accepted; invalid values are filtered out.\n * @param props.children - Custom controls to render instead of the default layout.\n * @param props.onEnded - Callback invoked when video playback finishes.\n * @param props.onTimeUpdate - Callback invoked during playback with current time in seconds.\n * @param props.onError - Callback invoked when video fails to load or encounters an error.\n * @param props.noHotkeys - Disable all keyboard shortcuts for media control.\n * @param props.hotkeys - Custom keyboard shortcuts configuration for media control.\n * @param props.noVolumePref - Disable automatic saving/restoring of volume preference.\n * @param props.noMutedPref - Disable automatic saving/restoring of muted state preference.\n * @param props.lang - Language code for localized media control labels.\n * @returns The rendered video player component.\n *\n * @example\n * ```tsx\n * // Basic usage\n * <Video src=\"video.mp4\" />\n * ```\n *\n * @example\n * ```tsx\n * // With poster image\n * <Video\n *   src=\"video.mp4\"\n *   poster=\"thumbnail.jpg\"\n * />\n * ```\n *\n * @example\n * ```tsx\n * // With event callbacks\n * <Video\n *   src=\"video.mp4\"\n *   onEnded={() => console.log('Ended')}\n *   onTimeUpdate={(time) => console.log('Current time:', time)}\n * />\n * ```\n *\n * @example\n * ```tsx\n * // Custom controls layout\n * <Video src=\"video.mp4\">\n *   <PlayButton />\n *   <TimeRange />\n * </Video>\n * ```\n */\nexport function Video({\n  classNames,\n  isDisabled,\n  noHotkeys,\n  hotkeys,\n  noVolumePref,\n  noMutedPref,\n  lang,\n  ...rest\n}: VideoProps) {\n  return (\n    <MediaProvider>\n      <MediaController\n        className={clsx('group/video', styles.container, classNames?.container)}\n        data-disabled={isDisabled || undefined}\n        noHotkeys={noHotkeys}\n        hotkeys={hotkeys}\n        noVolumePref={noVolumePref}\n        noMutedPref={noMutedPref}\n        lang={lang}\n      >\n        <VideoInner {...rest} classNames={classNames} isDisabled={isDisabled} />\n      </MediaController>\n    </MediaProvider>\n  );\n}\n"],"mappings":"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"}

package/dist/components/video/types.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0

package/dist/components/video/types.js

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0

package/dist/components/view-stack/context.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0
@@ -12,12 +12,12 @@
 
 import { ViewStackContextValue } from "./types.js";
 import "client-only";
-import * as react46 from "react";
+import * as react52 from "react";
 import { UniqueId } from "@accelint/core";
 
 //#region src/components/view-stack/context.d.ts
 /** Context for sharing state across ViewStack components */
-declare const ViewStackContext: react46.Context<ViewStackContextValue>;
+declare const ViewStackContext: react52.Context<ViewStackContextValue>;
 /** Event handlers for ViewStack events */
 declare const ViewStackEventHandlers: {
   readonly back: (stack: UniqueId) => void;

package/dist/components/view-stack/context.js

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0

package/dist/components/view-stack/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","names":[],"sources":["../../../src/components/view-stack/context.tsx"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport { Broadcast } from '@accelint/bus';\nimport { useEmit } from '@accelint/bus/react';\nimport type { UniqueId } from '@accelint/core';\nimport 'client-only';\nimport { createContext } from 'react';\nimport { ViewStackEventTypes } from './events';\nimport type { ViewStackContextValue, ViewStackEvent } from './types';\n\nconst bus = Broadcast.getInstance<ViewStackEvent>();\n\n/** Context for sharing state across ViewStack components */\nexport const ViewStackContext = createContext<ViewStackContextValue>({\n  parent: null,\n  stack: [],\n  view: null,\n  register: () => undefined,\n  unregister: () => undefined,\n});\n\n/** Event handlers for ViewStack events */\nexport const ViewStackEventHandlers = {\n  back: (stack: UniqueId) => bus.emit(ViewStackEventTypes.back, { stack }),\n  clear: (stack: UniqueId) => bus.emit(ViewStackEventTypes.clear, { stack }),\n  push: (view: UniqueId) => bus.emit(ViewStackEventTypes.push, { view }),\n  reset: (stack: UniqueId) => bus.emit(ViewStackEventTypes.reset, { stack }),\n} as const;\n\n/**\n * Hook for programmatic ViewStack control from anywhere in the application\n *\n * @example\n * ```tsx\n * function MyComponent() {\n *   const viewStack = useViewStackEmit();\n *\n *   return (\n *     <Button onPress={() => viewStack.push('view-id')}>\n *       Navigate to View\n *     </Button>\n *   );\n * }\n * ```\n *\n * @returns Object with emit functions for back, clear, push, and reset actions.\n */\nexport function useViewStackEmit() {\n  const emitBack = useEmit<ViewStackEvent>(ViewStackEventTypes.back);\n  const emitClear = useEmit<ViewStackEvent>(ViewStackEventTypes.clear);\n  const emitPush = useEmit<ViewStackEvent>(ViewStackEventTypes.push);\n  const emitReset = useEmit<ViewStackEvent>(ViewStackEventTypes.reset);\n\n  return {\n    back: (stack: UniqueId) => emitBack({ stack }),\n    clear: (stack: UniqueId) => emitClear({ stack }),\n    push: (view: UniqueId) => emitPush({ view }),\n    reset: (stack: UniqueId) => emitReset({ stack }),\n  } as const;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAqBA,MAAM,MAAM,UAAU,aAA6B;;AAGnD,MAAa,mBAAmB,cAAqC;CACnE,QAAQ;CACR,OAAO,EAAE;CACT,MAAM;CACN,gBAAgB;CAChB,kBAAkB;CACnB,CAAC;;AAGF,MAAa,yBAAyB;CACpC,OAAO,UAAoB,IAAI,KAAK,oBAAoB,MAAM,EAAE,OAAO,CAAC;CACxE,QAAQ,UAAoB,IAAI,KAAK,oBAAoB,OAAO,EAAE,OAAO,CAAC;CAC1E,OAAO,SAAmB,IAAI,KAAK,oBAAoB,MAAM,EAAE,MAAM,CAAC;CACtE,QAAQ,UAAoB,IAAI,KAAK,oBAAoB,OAAO,EAAE,OAAO,CAAC;CAC3E;;;;;;;;;;;;;;;;;;;AAoBD,SAAgB,mBAAmB;CACjC,MAAM,WAAW,QAAwB,oBAAoB,KAAK;CAClE,MAAM,YAAY,QAAwB,oBAAoB,MAAM;CACpE,MAAM,WAAW,QAAwB,oBAAoB,KAAK;CAClE,MAAM,YAAY,QAAwB,oBAAoB,MAAM;AAEpE,QAAO;EACL,OAAO,UAAoB,SAAS,EAAE,OAAO,CAAC;EAC9C,QAAQ,UAAoB,UAAU,EAAE,OAAO,CAAC;EAChD,OAAO,SAAmB,SAAS,EAAE,MAAM,CAAC;EAC5C,QAAQ,UAAoB,UAAU,EAAE,OAAO,CAAC;EACjD"}
+{"version":3,"file":"context.js","names":[],"sources":["../../../src/components/view-stack/context.tsx"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport { Broadcast } from '@accelint/bus';\nimport { useEmit } from '@accelint/bus/react';\nimport type { UniqueId } from '@accelint/core';\nimport 'client-only';\nimport { createContext } from 'react';\nimport { ViewStackEventTypes } from './events';\nimport type { ViewStackContextValue, ViewStackEvent } from './types';\n\nconst bus = Broadcast.getInstance<ViewStackEvent>();\n\n/** Context for sharing state across ViewStack components */\nexport const ViewStackContext = createContext<ViewStackContextValue>({\n  parent: null,\n  stack: [],\n  view: null,\n  register: () => undefined,\n  unregister: () => undefined,\n});\n\n/** Event handlers for ViewStack events */\nexport const ViewStackEventHandlers = {\n  back: (stack: UniqueId) => bus.emit(ViewStackEventTypes.back, { stack }),\n  clear: (stack: UniqueId) => bus.emit(ViewStackEventTypes.clear, { stack }),\n  push: (view: UniqueId) => bus.emit(ViewStackEventTypes.push, { view }),\n  reset: (stack: UniqueId) => bus.emit(ViewStackEventTypes.reset, { stack }),\n} as const;\n\n/**\n * Hook for programmatic ViewStack control from anywhere in the application\n *\n * @example\n * ```tsx\n * function MyComponent() {\n *   const viewStack = useViewStackEmit();\n *\n *   return (\n *     <Button onPress={() => viewStack.push('view-id')}>\n *       Navigate to View\n *     </Button>\n *   );\n * }\n * ```\n *\n * @returns Object with emit functions for back, clear, push, and reset actions.\n */\nexport function useViewStackEmit() {\n  const emitBack = useEmit<ViewStackEvent>(ViewStackEventTypes.back);\n  const emitClear = useEmit<ViewStackEvent>(ViewStackEventTypes.clear);\n  const emitPush = useEmit<ViewStackEvent>(ViewStackEventTypes.push);\n  const emitReset = useEmit<ViewStackEvent>(ViewStackEventTypes.reset);\n\n  return {\n    back: (stack: UniqueId) => emitBack({ stack }),\n    clear: (stack: UniqueId) => emitClear({ stack }),\n    push: (view: UniqueId) => emitPush({ view }),\n    reset: (stack: UniqueId) => emitReset({ stack }),\n  } as const;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAqBA,MAAM,MAAM,UAAU,aAA6B;;AAGnD,MAAa,mBAAmB,cAAqC;CACnE,QAAQ;CACR,OAAO,EAAE;CACT,MAAM;CACN,gBAAgB;CAChB,kBAAkB;CACnB,CAAC;;AAGF,MAAa,yBAAyB;CACpC,OAAO,UAAoB,IAAI,KAAK,oBAAoB,MAAM,EAAE,OAAO,CAAC;CACxE,QAAQ,UAAoB,IAAI,KAAK,oBAAoB,OAAO,EAAE,OAAO,CAAC;CAC1E,OAAO,SAAmB,IAAI,KAAK,oBAAoB,MAAM,EAAE,MAAM,CAAC;CACtE,QAAQ,UAAoB,IAAI,KAAK,oBAAoB,OAAO,EAAE,OAAO,CAAC;CAC3E;;;;;;;;;;;;;;;;;;;AAoBD,SAAgB,mBAAmB;CACjC,MAAM,WAAW,QAAwB,oBAAoB,KAAK;CAClE,MAAM,YAAY,QAAwB,oBAAoB,MAAM;CACpE,MAAM,WAAW,QAAwB,oBAAoB,KAAK;CAClE,MAAM,YAAY,QAAwB,oBAAoB,MAAM;AAEpE,QAAO;EACL,OAAO,UAAoB,SAAS,EAAE,OAAO,CAAC;EAC9C,QAAQ,UAAoB,UAAU,EAAE,OAAO,CAAC;EAChD,OAAO,SAAmB,SAAS,EAAE,MAAM,CAAC;EAC5C,QAAQ,UAAoB,UAAU,EAAE,OAAO,CAAC;EACjD"}

package/dist/components/view-stack/events.js

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0

package/dist/components/view-stack/events.js.map

@@ -1 +1 @@
-{"version":3,"file":"events.js","names":[],"sources":["../../../src/components/view-stack/events.ts"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/** Namespace prefix for ViewStack events. */\nexport const ViewStackEventNamespace = 'ViewStack';\n\n/** Event type constants for ViewStack navigation actions. */\nexport const ViewStackEventTypes = {\n  back: `${ViewStackEventNamespace}:back`,\n  clear: `${ViewStackEventNamespace}:clear`,\n  reset: `${ViewStackEventNamespace}:reset`,\n  push: `${ViewStackEventNamespace}:push`,\n} as const;\n"],"mappings":";;;;;;;;;;;;;;;AAaA,MAAa,0BAA0B;;AAGvC,MAAa,sBAAsB;CACjC,MAAM,GAAG,wBAAwB;CACjC,OAAO,GAAG,wBAAwB;CAClC,OAAO,GAAG,wBAAwB;CAClC,MAAM,GAAG,wBAAwB;CAClC"}
+{"version":3,"file":"events.js","names":[],"sources":["../../../src/components/view-stack/events.ts"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/** Namespace prefix for ViewStack events. */\nexport const ViewStackEventNamespace = 'ViewStack';\n\n/** Event type constants for ViewStack navigation actions. */\nexport const ViewStackEventTypes = {\n  back: `${ViewStackEventNamespace}:back`,\n  clear: `${ViewStackEventNamespace}:clear`,\n  reset: `${ViewStackEventNamespace}:reset`,\n  push: `${ViewStackEventNamespace}:push`,\n} as const;\n"],"mappings":";;;;;;;;;;;;;;;AAaA,MAAa,0BAA0B;;AAGvC,MAAa,sBAAsB;CACjC,MAAM,GAAG,wBAAwB;CACjC,OAAO,GAAG,wBAAwB;CAClC,OAAO,GAAG,wBAAwB;CAClC,MAAM,GAAG,wBAAwB;CAClC"}

package/dist/components/view-stack/index.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0
@@ -12,7 +12,7 @@
 
 import { ViewStackProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime183 from "react/jsx-runtime";
+import * as react_jsx_runtime196 from "react/jsx-runtime";
 
 //#region src/components/view-stack/index.d.ts
 
@@ -47,7 +47,7 @@ declare function ViewStack({
   children,
   defaultView,
   onChange
-}: ViewStackProps): react_jsx_runtime183.JSX.Element;
+}: ViewStackProps): react_jsx_runtime196.JSX.Element;
 //#endregion
 export { ViewStack };
 //# sourceMappingURL=index.d.ts.map

package/dist/components/view-stack/index.js

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0

package/dist/components/view-stack/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["view"],"sources":["../../../src/components/view-stack/index.tsx"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport { useOn } from '@accelint/bus/react';\nimport { isUUID, type UniqueId } from '@accelint/core';\nimport 'client-only';\nimport { useCallback, useRef, useState } from 'react';\nimport { ViewStackContext } from './context';\nimport { ViewStackEventTypes } from './events';\nimport type {\n  ViewStackBackEvent,\n  ViewStackClearEvent,\n  ViewStackProps,\n  ViewStackPushEvent,\n  ViewStackResetEvent,\n} from './types';\n\n/**\n * ViewStack - Stack-based navigation for managing multiple views\n *\n * Supports push, pop, clear, and reset operations with global event system.\n *\n * @param props - {@link ViewStackProps}\n * @param props.id - Unique identifier for the stack.\n * @param props.children - ViewStackView components.\n * @param props.defaultView - Default view to display when the stack is initialized.\n * @param props.onChange - Callback when the active view changes.\n * @returns The rendered ViewStack component.\n *\n * @example\n * ```tsx\n * const ids = { stack: uuid(), a: uuid(), b: uuid() };\n *\n * <ViewStack id={ids.stack} defaultView={ids.a}>\n *   <ViewStackView id={ids.a}>\n *     <ViewStackTrigger for={ids.b}><Button>Go to B</Button></ViewStackTrigger>\n *   </ViewStackView>\n *   <ViewStackView id={ids.b}>\n *     <ViewStackTrigger for=\"back\"><Button>Back</Button></ViewStackTrigger>\n *   </ViewStackView>\n * </ViewStack>\n * ```\n */\nexport function ViewStack({\n  id,\n  children,\n  defaultView,\n  onChange,\n}: ViewStackProps) {\n  if (!isUUID(id)) {\n    throw new Error(`ViewStack's id must be a UniqueId`);\n  }\n\n  const views = useRef(new Set<UniqueId>());\n  const [stack, setStack] = useState<UniqueId[]>(\n    defaultView ? [defaultView] : [],\n  );\n  const view = stack.at(-1) ?? null;\n\n  const handleBack = useCallback(\n    (data: ViewStackBackEvent) => {\n      if (id === data?.payload?.stack) {\n        const next = stack.slice(0, -1);\n\n        if (!next.length && defaultView) {\n          next.push(defaultView);\n        }\n\n        setStack(next);\n        onChange?.(next.at(-1) ?? null);\n      }\n    },\n    [id, defaultView, onChange, stack],\n  );\n\n  const handleClear = useCallback(\n    (data: ViewStackClearEvent) => {\n      if (id === data?.payload?.stack) {\n        setStack([]);\n        onChange?.(null);\n      }\n    },\n    [id, onChange],\n  );\n\n  const handlePush = useCallback(\n    (data: ViewStackPushEvent) => {\n      if (views.current.has(data?.payload?.view)) {\n        setStack((prev) => [...prev, data?.payload?.view]);\n        onChange?.(data?.payload?.view);\n      }\n    },\n    [onChange],\n  );\n\n  const handleReset = useCallback(\n    (data: ViewStackResetEvent) => {\n      if (id === data?.payload?.stack) {\n        setStack(defaultView ? [defaultView] : []);\n        onChange?.(defaultView ?? null);\n      }\n    },\n    [id, defaultView, onChange],\n  );\n  useOn(ViewStackEventTypes.back, handleBack);\n  useOn(ViewStackEventTypes.clear, handleClear);\n  useOn(ViewStackEventTypes.push, handlePush);\n  useOn(ViewStackEventTypes.reset, handleReset);\n\n  return (\n    <ViewStackContext.Provider\n      value={{\n        parent: id,\n        stack,\n        view,\n        register: (view: UniqueId) => views.current.add(view),\n        unregister: (view: UniqueId) => views.current.delete(view),\n      }}\n    >\n      {children}\n    </ViewStackContext.Provider>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqDA,SAAgB,UAAU,EACxB,IACA,UACA,aACA,YACiB;AACjB,KAAI,CAAC,OAAO,GAAG,CACb,OAAM,IAAI,MAAM,oCAAoC;CAGtD,MAAM,QAAQ,uBAAO,IAAI,KAAe,CAAC;CACzC,MAAM,CAAC,OAAO,YAAY,SACxB,cAAc,CAAC,YAAY,GAAG,EAAE,CACjC;CACD,MAAM,OAAO,MAAM,GAAG,GAAG,IAAI;CAE7B,MAAM,aAAa,aAChB,SAA6B;AAC5B,MAAI,OAAO,MAAM,SAAS,OAAO;GAC/B,MAAM,OAAO,MAAM,MAAM,GAAG,GAAG;AAE/B,OAAI,CAAC,KAAK,UAAU,YAClB,MAAK,KAAK,YAAY;AAGxB,YAAS,KAAK;AACd,cAAW,KAAK,GAAG,GAAG,IAAI,KAAK;;IAGnC;EAAC;EAAI;EAAa;EAAU;EAAM,CACnC;CAED,MAAM,cAAc,aACjB,SAA8B;AAC7B,MAAI,OAAO,MAAM,SAAS,OAAO;AAC/B,YAAS,EAAE,CAAC;AACZ,cAAW,KAAK;;IAGpB,CAAC,IAAI,SAAS,CACf;CAED,MAAM,aAAa,aAChB,SAA6B;AAC5B,MAAI,MAAM,QAAQ,IAAI,MAAM,SAAS,KAAK,EAAE;AAC1C,aAAU,SAAS,CAAC,GAAG,MAAM,MAAM,SAAS,KAAK,CAAC;AAClD,cAAW,MAAM,SAAS,KAAK;;IAGnC,CAAC,SAAS,CACX;CAED,MAAM,cAAc,aACjB,SAA8B;AAC7B,MAAI,OAAO,MAAM,SAAS,OAAO;AAC/B,YAAS,cAAc,CAAC,YAAY,GAAG,EAAE,CAAC;AAC1C,cAAW,eAAe,KAAK;;IAGnC;EAAC;EAAI;EAAa;EAAS,CAC5B;AACD,OAAM,oBAAoB,MAAM,WAAW;AAC3C,OAAM,oBAAoB,OAAO,YAAY;AAC7C,OAAM,oBAAoB,MAAM,WAAW;AAC3C,OAAM,oBAAoB,OAAO,YAAY;AAE7C,QACE,oBAAC,iBAAiB;EAChB,OAAO;GACL,QAAQ;GACR;GACA;GACA,WAAW,WAAmB,MAAM,QAAQ,IAAIA,OAAK;GACrD,aAAa,WAAmB,MAAM,QAAQ,OAAOA,OAAK;GAC3D;EAEA;GACyB"}
+{"version":3,"file":"index.js","names":["view"],"sources":["../../../src/components/view-stack/index.tsx"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport { useOn } from '@accelint/bus/react';\nimport { isUUID, type UniqueId } from '@accelint/core';\nimport 'client-only';\nimport { useCallback, useRef, useState } from 'react';\nimport { ViewStackContext } from './context';\nimport { ViewStackEventTypes } from './events';\nimport type {\n  ViewStackBackEvent,\n  ViewStackClearEvent,\n  ViewStackProps,\n  ViewStackPushEvent,\n  ViewStackResetEvent,\n} from './types';\n\n/**\n * ViewStack - Stack-based navigation for managing multiple views\n *\n * Supports push, pop, clear, and reset operations with global event system.\n *\n * @param props - {@link ViewStackProps}\n * @param props.id - Unique identifier for the stack.\n * @param props.children - ViewStackView components.\n * @param props.defaultView - Default view to display when the stack is initialized.\n * @param props.onChange - Callback when the active view changes.\n * @returns The rendered ViewStack component.\n *\n * @example\n * ```tsx\n * const ids = { stack: uuid(), a: uuid(), b: uuid() };\n *\n * <ViewStack id={ids.stack} defaultView={ids.a}>\n *   <ViewStackView id={ids.a}>\n *     <ViewStackTrigger for={ids.b}><Button>Go to B</Button></ViewStackTrigger>\n *   </ViewStackView>\n *   <ViewStackView id={ids.b}>\n *     <ViewStackTrigger for=\"back\"><Button>Back</Button></ViewStackTrigger>\n *   </ViewStackView>\n * </ViewStack>\n * ```\n */\nexport function ViewStack({\n  id,\n  children,\n  defaultView,\n  onChange,\n}: ViewStackProps) {\n  if (!isUUID(id)) {\n    throw new Error(`ViewStack's id must be a UniqueId`);\n  }\n\n  const views = useRef(new Set<UniqueId>());\n  const [stack, setStack] = useState<UniqueId[]>(\n    defaultView ? [defaultView] : [],\n  );\n  const view = stack.at(-1) ?? null;\n\n  const handleBack = useCallback(\n    (data: ViewStackBackEvent) => {\n      if (id === data?.payload?.stack) {\n        const next = stack.slice(0, -1);\n\n        if (!next.length && defaultView) {\n          next.push(defaultView);\n        }\n\n        setStack(next);\n        onChange?.(next.at(-1) ?? null);\n      }\n    },\n    [id, defaultView, onChange, stack],\n  );\n\n  const handleClear = useCallback(\n    (data: ViewStackClearEvent) => {\n      if (id === data?.payload?.stack) {\n        setStack([]);\n        onChange?.(null);\n      }\n    },\n    [id, onChange],\n  );\n\n  const handlePush = useCallback(\n    (data: ViewStackPushEvent) => {\n      if (views.current.has(data?.payload?.view)) {\n        setStack((prev) => [...prev, data?.payload?.view]);\n        onChange?.(data?.payload?.view);\n      }\n    },\n    [onChange],\n  );\n\n  const handleReset = useCallback(\n    (data: ViewStackResetEvent) => {\n      if (id === data?.payload?.stack) {\n        setStack(defaultView ? [defaultView] : []);\n        onChange?.(defaultView ?? null);\n      }\n    },\n    [id, defaultView, onChange],\n  );\n  useOn(ViewStackEventTypes.back, handleBack);\n  useOn(ViewStackEventTypes.clear, handleClear);\n  useOn(ViewStackEventTypes.push, handlePush);\n  useOn(ViewStackEventTypes.reset, handleReset);\n\n  return (\n    <ViewStackContext.Provider\n      value={{\n        parent: id,\n        stack,\n        view,\n        register: (view: UniqueId) => views.current.add(view),\n        unregister: (view: UniqueId) => views.current.delete(view),\n      }}\n    >\n      {children}\n    </ViewStackContext.Provider>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqDA,SAAgB,UAAU,EACxB,IACA,UACA,aACA,YACiB;AACjB,KAAI,CAAC,OAAO,GAAG,CACb,OAAM,IAAI,MAAM,oCAAoC;CAGtD,MAAM,QAAQ,uBAAO,IAAI,KAAe,CAAC;CACzC,MAAM,CAAC,OAAO,YAAY,SACxB,cAAc,CAAC,YAAY,GAAG,EAAE,CACjC;CACD,MAAM,OAAO,MAAM,GAAG,GAAG,IAAI;CAE7B,MAAM,aAAa,aAChB,SAA6B;AAC5B,MAAI,OAAO,MAAM,SAAS,OAAO;GAC/B,MAAM,OAAO,MAAM,MAAM,GAAG,GAAG;AAE/B,OAAI,CAAC,KAAK,UAAU,YAClB,MAAK,KAAK,YAAY;AAGxB,YAAS,KAAK;AACd,cAAW,KAAK,GAAG,GAAG,IAAI,KAAK;;IAGnC;EAAC;EAAI;EAAa;EAAU;EAAM,CACnC;CAED,MAAM,cAAc,aACjB,SAA8B;AAC7B,MAAI,OAAO,MAAM,SAAS,OAAO;AAC/B,YAAS,EAAE,CAAC;AACZ,cAAW,KAAK;;IAGpB,CAAC,IAAI,SAAS,CACf;CAED,MAAM,aAAa,aAChB,SAA6B;AAC5B,MAAI,MAAM,QAAQ,IAAI,MAAM,SAAS,KAAK,EAAE;AAC1C,aAAU,SAAS,CAAC,GAAG,MAAM,MAAM,SAAS,KAAK,CAAC;AAClD,cAAW,MAAM,SAAS,KAAK;;IAGnC,CAAC,SAAS,CACX;CAED,MAAM,cAAc,aACjB,SAA8B;AAC7B,MAAI,OAAO,MAAM,SAAS,OAAO;AAC/B,YAAS,cAAc,CAAC,YAAY,GAAG,EAAE,CAAC;AAC1C,cAAW,eAAe,KAAK;;IAGnC;EAAC;EAAI;EAAa;EAAS,CAC5B;AACD,OAAM,oBAAoB,MAAM,WAAW;AAC3C,OAAM,oBAAoB,OAAO,YAAY;AAC7C,OAAM,oBAAoB,MAAM,WAAW;AAC3C,OAAM,oBAAoB,OAAO,YAAY;AAE7C,QACE,oBAAC,iBAAiB;EAChB,OAAO;GACL,QAAQ;GACR;GACA;GACA,WAAW,WAAmB,MAAM,QAAQ,IAAIA,OAAK;GACrD,aAAa,WAAmB,MAAM,QAAQ,OAAOA,OAAK;GAC3D;EAEA;GACyB"}

package/dist/components/view-stack/trigger.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0
@@ -12,7 +12,7 @@
 
 import { ViewStackTriggerProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime185 from "react/jsx-runtime";
+import * as react_jsx_runtime197 from "react/jsx-runtime";
 
 //#region src/components/view-stack/trigger.d.ts
 
@@ -45,7 +45,7 @@ import * as react_jsx_runtime185 from "react/jsx-runtime";
 declare function ViewStackTrigger({
   children,
   for: types
-}: ViewStackTriggerProps): react_jsx_runtime185.JSX.Element;
+}: ViewStackTriggerProps): react_jsx_runtime197.JSX.Element;
 //#endregion
 export { ViewStackTrigger };
 //# sourceMappingURL=trigger.d.ts.map

package/dist/components/view-stack/trigger.js

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0

package/dist/components/view-stack/trigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"trigger.js","names":[],"sources":["../../../src/components/view-stack/trigger.tsx"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { isUUID, type UniqueId } from '@accelint/core';\nimport { useContext } from 'react';\nimport { Pressable } from 'react-aria-components';\nimport { useViewStackEmit, ViewStackContext } from './context';\nimport type { ViewStackTriggerProps } from './types';\n\n/**\n * ViewStackTrigger - Pressable element that triggers ViewStack navigation actions\n *\n * @example\n * ```tsx\n * <ViewStack id=\"main-stack\">\n *   <ViewStackView id=\"home\">\n *     <h1>Home</h1>\n *     <ViewStackTrigger for=\"settings-view-id\">\n *       <Button>Go to Settings</Button>\n *     </ViewStackTrigger>\n *   </ViewStackView>\n *   <ViewStackView id=\"settings-view-id\">\n *     <h1>Settings</h1>\n *     <ViewStackTrigger for=\"back:main-stack\">\n *       <Button>Back</Button>\n *     </ViewStackTrigger>\n *   </ViewStackView>\n * </ViewStack>\n * ```\n *\n * @param props - {@link ViewStackTriggerProps}\n * @param props.children - Pressable children content.\n * @param props.for - Navigation action(s) to trigger on press.\n * @returns The rendered ViewStackTrigger component.\n */\nexport function ViewStackTrigger({\n  children,\n  for: types,\n}: ViewStackTriggerProps) {\n  const { parent } = useContext(ViewStackContext);\n  const viewStackEmit = useViewStackEmit();\n\n  function handlePress() {\n    for (const type of Array.isArray(types) ? types : [types]) {\n      let [event, id] = (isUUID(type) ? ['push', type] : type.split(':')) as [\n        'back' | 'clear' | 'reset' | 'push',\n        UniqueId | undefined | null,\n      ];\n\n      id ??= parent;\n\n      if (!id) {\n        continue;\n      }\n\n      viewStackEmit[event](id);\n    }\n  }\n\n  return <Pressable onPress={handlePress}>{children}</Pressable>;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CA,SAAgB,iBAAiB,EAC/B,UACA,KAAK,SACmB;CACxB,MAAM,EAAE,WAAW,WAAW,iBAAiB;CAC/C,MAAM,gBAAgB,kBAAkB;CAExC,SAAS,cAAc;AACrB,OAAK,MAAM,QAAQ,MAAM,QAAQ,MAAM,GAAG,QAAQ,CAAC,MAAM,EAAE;GACzD,IAAI,CAAC,OAAO,MAAO,OAAO,KAAK,GAAG,CAAC,QAAQ,KAAK,GAAG,KAAK,MAAM,IAAI;AAKlE,UAAO;AAEP,OAAI,CAAC,GACH;AAGF,iBAAc,OAAO,GAAG;;;AAI5B,QAAO,oBAAC;EAAU,SAAS;EAAc;GAAqB"}
+{"version":3,"file":"trigger.js","names":[],"sources":["../../../src/components/view-stack/trigger.tsx"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport 'client-only';\nimport { isUUID, type UniqueId } from '@accelint/core';\nimport { useContext } from 'react';\nimport { Pressable } from 'react-aria-components';\nimport { useViewStackEmit, ViewStackContext } from './context';\nimport type { ViewStackTriggerProps } from './types';\n\n/**\n * ViewStackTrigger - Pressable element that triggers ViewStack navigation actions\n *\n * @example\n * ```tsx\n * <ViewStack id=\"main-stack\">\n *   <ViewStackView id=\"home\">\n *     <h1>Home</h1>\n *     <ViewStackTrigger for=\"settings-view-id\">\n *       <Button>Go to Settings</Button>\n *     </ViewStackTrigger>\n *   </ViewStackView>\n *   <ViewStackView id=\"settings-view-id\">\n *     <h1>Settings</h1>\n *     <ViewStackTrigger for=\"back:main-stack\">\n *       <Button>Back</Button>\n *     </ViewStackTrigger>\n *   </ViewStackView>\n * </ViewStack>\n * ```\n *\n * @param props - {@link ViewStackTriggerProps}\n * @param props.children - Pressable children content.\n * @param props.for - Navigation action(s) to trigger on press.\n * @returns The rendered ViewStackTrigger component.\n */\nexport function ViewStackTrigger({\n  children,\n  for: types,\n}: ViewStackTriggerProps) {\n  const { parent } = useContext(ViewStackContext);\n  const viewStackEmit = useViewStackEmit();\n\n  function handlePress() {\n    for (const type of Array.isArray(types) ? types : [types]) {\n      let [event, id] = (isUUID(type) ? ['push', type] : type.split(':')) as [\n        'back' | 'clear' | 'reset' | 'push',\n        UniqueId | undefined | null,\n      ];\n\n      id ??= parent;\n\n      if (!id) {\n        continue;\n      }\n\n      viewStackEmit[event](id);\n    }\n  }\n\n  return <Pressable onPress={handlePress}>{children}</Pressable>;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CA,SAAgB,iBAAiB,EAC/B,UACA,KAAK,SACmB;CACxB,MAAM,EAAE,WAAW,WAAW,iBAAiB;CAC/C,MAAM,gBAAgB,kBAAkB;CAExC,SAAS,cAAc;AACrB,OAAK,MAAM,QAAQ,MAAM,QAAQ,MAAM,GAAG,QAAQ,CAAC,MAAM,EAAE;GACzD,IAAI,CAAC,OAAO,MAAO,OAAO,KAAK,GAAG,CAAC,QAAQ,KAAK,GAAG,KAAK,MAAM,IAAI;AAKlE,UAAO;AAEP,OAAI,CAAC,GACH;AAGF,iBAAc,OAAO,GAAG;;;AAI5B,QAAO,oBAAC;EAAU,SAAS;EAAc;GAAqB"}

package/dist/components/view-stack/types.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0

package/dist/components/view-stack/types.js

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0

package/dist/components/view-stack/view.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0
@@ -12,7 +12,7 @@
 
 import { ViewStackViewProps } from "./types.js";
 import "client-only";
-import * as react_jsx_runtime186 from "react/jsx-runtime";
+import * as react_jsx_runtime198 from "react/jsx-runtime";
 
 //#region src/components/view-stack/view.d.ts
 
@@ -43,7 +43,7 @@ import * as react_jsx_runtime186 from "react/jsx-runtime";
 declare function ViewStackView({
   id,
   children
-}: ViewStackViewProps): react_jsx_runtime186.JSX.Element | null;
+}: ViewStackViewProps): react_jsx_runtime198.JSX.Element | null;
 //#endregion
 export { ViewStackView };
 //# sourceMappingURL=view.d.ts.map

package/dist/components/view-stack/view.js

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0

package/dist/components/view-stack/view.js.map

@@ -1 +1 @@
-{"version":3,"file":"view.js","names":[],"sources":["../../../src/components/view-stack/view.tsx"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport { isUUID } from '@accelint/core';\nimport 'client-only';\nimport { Fragment, useContext, useEffect } from 'react';\nimport { ViewStackContext } from './context';\nimport type { ViewStackViewProps } from './types';\n\n/**\n * ViewStackView - Individual view in a ViewStack\n *\n * Represents a single view that can be pushed onto the ViewStack\n *\n * @example\n * ```tsx\n * <ViewStack id=\"app-stack\">\n *   <ViewStackView id=\"home-view\">\n *     <h1>Home Screen</h1>\n *     <p>Welcome to the app</p>\n *   </ViewStackView>\n *   <ViewStackView id=\"details-view\">\n *     <h1>Details Screen</h1>\n *     <p>Detailed information</p>\n *   </ViewStackView>\n * </ViewStack>\n * ```\n *\n * @param props - {@link ViewStackViewProps}\n * @param props.id - Unique identifier for the view.\n * @param props.children - View content to render when active.\n * @returns The rendered view content if active, or null.\n */\nexport function ViewStackView({ id, children }: ViewStackViewProps) {\n  const { parent, view, register, unregister } = useContext(ViewStackContext);\n\n  if (!parent) {\n    throw new Error('ViewStackView must be implemented within a ViewStack');\n  }\n\n  if (!isUUID(id)) {\n    throw new Error(`ViewStackView's id must be a UniqueId`);\n  }\n\n  useEffect(() => {\n    register(id);\n\n    return () => unregister(id);\n  }, [register, unregister, id]);\n\n  return view === id ? <Fragment key={id}>{children}</Fragment> : null;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2CA,SAAgB,cAAc,EAAE,IAAI,YAAgC;CAClE,MAAM,EAAE,QAAQ,MAAM,UAAU,eAAe,WAAW,iBAAiB;AAE3E,KAAI,CAAC,OACH,OAAM,IAAI,MAAM,uDAAuD;AAGzE,KAAI,CAAC,OAAO,GAAG,CACb,OAAM,IAAI,MAAM,wCAAwC;AAG1D,iBAAgB;AACd,WAAS,GAAG;AAEZ,eAAa,WAAW,GAAG;IAC1B;EAAC;EAAU;EAAY;EAAG,CAAC;AAE9B,QAAO,SAAS,KAAK,oBAAC,YAAmB,YAAL,GAAyB,GAAG"}
+{"version":3,"file":"view.js","names":[],"sources":["../../../src/components/view-stack/view.tsx"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n'use client';\n\nimport { isUUID } from '@accelint/core';\nimport 'client-only';\nimport { Fragment, useContext, useEffect } from 'react';\nimport { ViewStackContext } from './context';\nimport type { ViewStackViewProps } from './types';\n\n/**\n * ViewStackView - Individual view in a ViewStack\n *\n * Represents a single view that can be pushed onto the ViewStack\n *\n * @example\n * ```tsx\n * <ViewStack id=\"app-stack\">\n *   <ViewStackView id=\"home-view\">\n *     <h1>Home Screen</h1>\n *     <p>Welcome to the app</p>\n *   </ViewStackView>\n *   <ViewStackView id=\"details-view\">\n *     <h1>Details Screen</h1>\n *     <p>Detailed information</p>\n *   </ViewStackView>\n * </ViewStack>\n * ```\n *\n * @param props - {@link ViewStackViewProps}\n * @param props.id - Unique identifier for the view.\n * @param props.children - View content to render when active.\n * @returns The rendered view content if active, or null.\n */\nexport function ViewStackView({ id, children }: ViewStackViewProps) {\n  const { parent, view, register, unregister } = useContext(ViewStackContext);\n\n  if (!parent) {\n    throw new Error('ViewStackView must be implemented within a ViewStack');\n  }\n\n  if (!isUUID(id)) {\n    throw new Error(`ViewStackView's id must be a UniqueId`);\n  }\n\n  useEffect(() => {\n    register(id);\n\n    return () => unregister(id);\n  }, [register, unregister, id]);\n\n  return view === id ? <Fragment key={id}>{children}</Fragment> : null;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2CA,SAAgB,cAAc,EAAE,IAAI,YAAgC;CAClE,MAAM,EAAE,QAAQ,MAAM,UAAU,eAAe,WAAW,iBAAiB;AAE3E,KAAI,CAAC,OACH,OAAM,IAAI,MAAM,uDAAuD;AAGzE,KAAI,CAAC,OAAO,GAAG,CACb,OAAM,IAAI,MAAM,wCAAwC;AAG1D,iBAAgB;AACd,WAAS,GAAG;AAEZ,eAAa,WAAW,GAAG;IAC1B;EAAC;EAAU;EAAY;EAAG,CAAC;AAE9B,QAAO,SAAS,KAAK,oBAAC,YAAmB,YAAL,GAAyB,GAAG"}

package/dist/hooks/coordinate-field/index.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0

package/dist/hooks/coordinate-field/index.js

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0

package/dist/hooks/coordinate-field/use-coordinate-copy.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0

package/dist/hooks/coordinate-field/use-coordinate-copy.js

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0
@@ -11,17 +11,12 @@
  */
 
 
+import { createLoggerDomain } from "../../utils/logger/index.js";
 import { getAllCoordinateFormats } from "../../components/coordinate-field/coordinate-utils.js";
 import { useState } from "react";
-import { getLogger } from "@accelint/logger";
 
 //#region src/hooks/coordinate-field/use-coordinate-copy.ts
-const logger = getLogger({
-	enabled: process.env.NODE_ENV !== "production",
-	level: "debug",
-	prefix: "[CoordinateField]",
-	pretty: true
-});
+const logger = createLoggerDomain("[CoordinateField]");
 const COPY_FEEDBACK_DURATION_MS = 2e3;
 /**
 * Handles copying coordinates to clipboard with format conversion and visual feedback
@@ -84,7 +79,7 @@ function useCoordinateCopy({ currentValue, validationErrors, isDisabled, registe
 				setCopiedFormat(null);
 			}, COPY_FEEDBACK_DURATION_MS));
 		} catch (err) {
-			logger.withError(err).warn("Fallback copy to clipboard failed");
+			logger.withError(err).error("Fallback copy to clipboard failed");
 		}
 		document.body.removeChild(textArea);
 	};

package/dist/hooks/coordinate-field/use-coordinate-copy.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-coordinate-copy.js","names":[],"sources":["../../../src/hooks/coordinate-field/use-coordinate-copy.ts"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { getLogger } from '@accelint/logger';\nimport { useState } from 'react';\n\nconst logger = getLogger({\n  enabled: process.env.NODE_ENV !== 'production',\n  level: 'debug',\n  prefix: '[CoordinateField]',\n  pretty: true,\n});\n\nimport { getAllCoordinateFormats } from '../../components/coordinate-field/coordinate-utils';\nimport type {\n  CoordinateSystem,\n  CoordinateValue,\n} from '../../components/coordinate-field/types';\nimport type { UseTimeoutCleanupResult } from './use-timeout-cleanup';\n\nconst COPY_FEEDBACK_DURATION_MS = 2000;\n\n/** Options for the useCoordinateCopy hook */\nexport interface UseCoordinateCopyOptions {\n  /** Current coordinate value to copy (null if empty) */\n  currentValue: CoordinateValue | null;\n  /** Array of validation error messages */\n  validationErrors: string[];\n  /** Whether copying is disabled */\n  isDisabled: boolean;\n  /** Function to register timeouts for cleanup */\n  registerTimeout: UseTimeoutCleanupResult['registerTimeout'];\n}\n\n/** Return value from the useCoordinateCopy hook */\nexport interface UseCoordinateCopyResult {\n  /** Currently copied format (for visual feedback) or null */\n  copiedFormat: CoordinateSystem | null;\n  /** Copy coordinate in specified format to clipboard */\n  handleCopyFormat: (formatToCopy: CoordinateSystem) => Promise<void>;\n  /** Whether copy format buttons should be enabled */\n  isFormatButtonEnabled: boolean;\n}\n\n/**\n * Handles copying coordinates to clipboard with format conversion and visual feedback\n *\n * @example\n * ```tsx\n * function CoordinateField() {\n *   const { registerTimeout } = useTimeoutCleanup();\n *   const [value, setValue] = useState<CoordinateValue | null>(null);\n *   const [errors, setErrors] = useState<string[]>([]);\n *\n *   const { copiedFormat, handleCopyFormat, isFormatButtonEnabled } = useCoordinateCopy({\n *     currentValue: value,\n *     validationErrors: errors,\n *     isDisabled: false,\n *     registerTimeout,\n *   });\n *\n *   return (\n *     <Button\n *       onPress={() => handleCopyFormat('dd')}\n *       isDisabled={!isFormatButtonEnabled}\n *     >\n *       {copiedFormat === 'dd' ? <Check /> : <Copy />}\n *     </Button>\n *   );\n * }\n * ```\n *\n * @param options - {@link UseCoordinateCopyOptions}\n * @param options.currentValue - Current coordinate value to copy (null if empty).\n * @param options.validationErrors - Array of validation error messages.\n * @param options.isDisabled - Whether copying is disabled.\n * @param options.registerTimeout - Function to register timeouts for cleanup.\n * @returns {@link UseCoordinateCopyResult} Copy utilities and feedback state.\n */\nexport function useCoordinateCopy({\n  currentValue,\n  validationErrors,\n  isDisabled,\n  registerTimeout,\n}: UseCoordinateCopyOptions): UseCoordinateCopyResult {\n  const [copiedFormat, setCopiedFormat] = useState<CoordinateSystem | null>(\n    null,\n  );\n\n  /**\n   * Fallback clipboard copy for browsers that don't support navigator.clipboard API.\n   * Creates a temporary textarea, copies text using document.execCommand('copy'),\n   * and provides visual feedback by setting copiedFormat state for 2 seconds.\n   *\n   * @param text - The coordinate string to copy to clipboard\n   * @param formatToCopy - The coordinate format being copied (for UI feedback)\n   */\n  const fallbackCopyToClipboard = (\n    text: string,\n    formatToCopy: CoordinateSystem,\n  ) => {\n    // Create temporary textarea for copy operation\n    const textArea = document.createElement('textarea');\n    textArea.value = text;\n    // Position off-screen so it's not visible to user\n    textArea.style.position = 'fixed';\n    textArea.style.left = '-999999px';\n    textArea.style.top = '-999999px';\n    document.body.appendChild(textArea);\n    textArea.focus();\n    textArea.select();\n\n    try {\n      document.execCommand('copy');\n\n      // Set copied format to show Check icon in UI\n      setCopiedFormat(formatToCopy);\n\n      // Reset to null after 2 seconds to return to Copy icon\n      registerTimeout(\n        setTimeout(() => {\n          setCopiedFormat(null);\n        }, COPY_FEEDBACK_DURATION_MS),\n      );\n    } catch (err) {\n      logger.withError(err).warn('Fallback copy to clipboard failed');\n    }\n\n    // Clean up temporary textarea\n    document.body.removeChild(textArea);\n  };\n\n  /**\n   * Handles copying a coordinate in the specified format to the clipboard.\n   * Uses modern clipboard API (navigator.clipboard.writeText) with fallback\n   * to document.execCommand for older browsers.\n   *\n   * Sets copiedFormat state to show visual feedback (Check icon) for 2 seconds.\n   *\n   * @param formatToCopy - The coordinate format to copy (dd, ddm, dms, mgrs, utm)\n   */\n  const handleCopyFormat = async (formatToCopy: CoordinateSystem) => {\n    if (!currentValue) {\n      return;\n    }\n\n    const allFormats = getAllCoordinateFormats(currentValue);\n    const formatResult = allFormats[formatToCopy];\n\n    if (!formatResult.isValid) {\n      return;\n    }\n\n    try {\n      // Modern clipboard API - copy and show feedback\n      await navigator.clipboard.writeText(formatResult.value);\n\n      // Set copied format to show Check icon in UI\n      setCopiedFormat(formatToCopy);\n\n      // Reset to null after 2 seconds to return to Copy icon\n      registerTimeout(\n        setTimeout(() => {\n          setCopiedFormat(null);\n        }, COPY_FEEDBACK_DURATION_MS),\n      );\n    } catch (_err) {\n      // Fall back to document.execCommand for older browsers\n      fallbackCopyToClipboard(formatResult.value, formatToCopy);\n    }\n  };\n\n  const isFormatButtonEnabled =\n    currentValue !== null && validationErrors.length === 0 && !isDisabled;\n\n  return {\n    copiedFormat,\n    handleCopyFormat,\n    isFormatButtonEnabled,\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAeA,MAAM,SAAS,UAAU;CACvB,SAAS,QAAQ,IAAI,aAAa;CAClC,OAAO;CACP,QAAQ;CACR,QAAQ;CACT,CAAC;AASF,MAAM,4BAA4B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2DlC,SAAgB,kBAAkB,EAChC,cACA,kBACA,YACA,mBACoD;CACpD,MAAM,CAAC,cAAc,mBAAmB,SACtC,KACD;;;;;;;;;CAUD,MAAM,2BACJ,MACA,iBACG;EAEH,MAAM,WAAW,SAAS,cAAc,WAAW;AACnD,WAAS,QAAQ;AAEjB,WAAS,MAAM,WAAW;AAC1B,WAAS,MAAM,OAAO;AACtB,WAAS,MAAM,MAAM;AACrB,WAAS,KAAK,YAAY,SAAS;AACnC,WAAS,OAAO;AAChB,WAAS,QAAQ;AAEjB,MAAI;AACF,YAAS,YAAY,OAAO;AAG5B,mBAAgB,aAAa;AAG7B,mBACE,iBAAiB;AACf,oBAAgB,KAAK;MACpB,0BAA0B,CAC9B;WACM,KAAK;AACZ,UAAO,UAAU,IAAI,CAAC,KAAK,oCAAoC;;AAIjE,WAAS,KAAK,YAAY,SAAS;;;;;;;;;;;CAYrC,MAAM,mBAAmB,OAAO,iBAAmC;AACjE,MAAI,CAAC,aACH;EAIF,MAAM,eADa,wBAAwB,aAAa,CACxB;AAEhC,MAAI,CAAC,aAAa,QAChB;AAGF,MAAI;AAEF,SAAM,UAAU,UAAU,UAAU,aAAa,MAAM;AAGvD,mBAAgB,aAAa;AAG7B,mBACE,iBAAiB;AACf,oBAAgB,KAAK;MACpB,0BAA0B,CAC9B;WACM,MAAM;AAEb,2BAAwB,aAAa,OAAO,aAAa;;;AAO7D,QAAO;EACL;EACA;EACA,uBALA,iBAAiB,QAAQ,iBAAiB,WAAW,KAAK,CAAC;EAM5D"}
+{"version":3,"file":"use-coordinate-copy.js","names":[],"sources":["../../../src/hooks/coordinate-field/use-coordinate-copy.ts"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport { useState } from 'react';\nimport { createLoggerDomain } from '@/utils/logger';\n\nconst logger = createLoggerDomain('[CoordinateField]');\n\nimport { getAllCoordinateFormats } from '../../components/coordinate-field/coordinate-utils';\nimport type {\n  CoordinateSystem,\n  CoordinateValue,\n} from '../../components/coordinate-field/types';\nimport type { UseTimeoutCleanupResult } from './use-timeout-cleanup';\n\nconst COPY_FEEDBACK_DURATION_MS = 2000;\n\n/** Options for the useCoordinateCopy hook */\nexport interface UseCoordinateCopyOptions {\n  /** Current coordinate value to copy (null if empty) */\n  currentValue: CoordinateValue | null;\n  /** Array of validation error messages */\n  validationErrors: string[];\n  /** Whether copying is disabled */\n  isDisabled: boolean;\n  /** Function to register timeouts for cleanup */\n  registerTimeout: UseTimeoutCleanupResult['registerTimeout'];\n}\n\n/** Return value from the useCoordinateCopy hook */\nexport interface UseCoordinateCopyResult {\n  /** Currently copied format (for visual feedback) or null */\n  copiedFormat: CoordinateSystem | null;\n  /** Copy coordinate in specified format to clipboard */\n  handleCopyFormat: (formatToCopy: CoordinateSystem) => Promise<void>;\n  /** Whether copy format buttons should be enabled */\n  isFormatButtonEnabled: boolean;\n}\n\n/**\n * Handles copying coordinates to clipboard with format conversion and visual feedback\n *\n * @example\n * ```tsx\n * function CoordinateField() {\n *   const { registerTimeout } = useTimeoutCleanup();\n *   const [value, setValue] = useState<CoordinateValue | null>(null);\n *   const [errors, setErrors] = useState<string[]>([]);\n *\n *   const { copiedFormat, handleCopyFormat, isFormatButtonEnabled } = useCoordinateCopy({\n *     currentValue: value,\n *     validationErrors: errors,\n *     isDisabled: false,\n *     registerTimeout,\n *   });\n *\n *   return (\n *     <Button\n *       onPress={() => handleCopyFormat('dd')}\n *       isDisabled={!isFormatButtonEnabled}\n *     >\n *       {copiedFormat === 'dd' ? <Check /> : <Copy />}\n *     </Button>\n *   );\n * }\n * ```\n *\n * @param options - {@link UseCoordinateCopyOptions}\n * @param options.currentValue - Current coordinate value to copy (null if empty).\n * @param options.validationErrors - Array of validation error messages.\n * @param options.isDisabled - Whether copying is disabled.\n * @param options.registerTimeout - Function to register timeouts for cleanup.\n * @returns {@link UseCoordinateCopyResult} Copy utilities and feedback state.\n */\nexport function useCoordinateCopy({\n  currentValue,\n  validationErrors,\n  isDisabled,\n  registerTimeout,\n}: UseCoordinateCopyOptions): UseCoordinateCopyResult {\n  const [copiedFormat, setCopiedFormat] = useState<CoordinateSystem | null>(\n    null,\n  );\n\n  /**\n   * Fallback clipboard copy for browsers that don't support navigator.clipboard API.\n   * Creates a temporary textarea, copies text using document.execCommand('copy'),\n   * and provides visual feedback by setting copiedFormat state for 2 seconds.\n   *\n   * @param text - The coordinate string to copy to clipboard\n   * @param formatToCopy - The coordinate format being copied (for UI feedback)\n   */\n  const fallbackCopyToClipboard = (\n    text: string,\n    formatToCopy: CoordinateSystem,\n  ) => {\n    // Create temporary textarea for copy operation\n    const textArea = document.createElement('textarea');\n    textArea.value = text;\n    // Position off-screen so it's not visible to user\n    textArea.style.position = 'fixed';\n    textArea.style.left = '-999999px';\n    textArea.style.top = '-999999px';\n    document.body.appendChild(textArea);\n    textArea.focus();\n    textArea.select();\n\n    try {\n      document.execCommand('copy');\n\n      // Set copied format to show Check icon in UI\n      setCopiedFormat(formatToCopy);\n\n      // Reset to null after 2 seconds to return to Copy icon\n      registerTimeout(\n        setTimeout(() => {\n          setCopiedFormat(null);\n        }, COPY_FEEDBACK_DURATION_MS),\n      );\n    } catch (err) {\n      logger.withError(err).error('Fallback copy to clipboard failed');\n    }\n\n    // Clean up temporary textarea\n    document.body.removeChild(textArea);\n  };\n\n  /**\n   * Handles copying a coordinate in the specified format to the clipboard.\n   * Uses modern clipboard API (navigator.clipboard.writeText) with fallback\n   * to document.execCommand for older browsers.\n   *\n   * Sets copiedFormat state to show visual feedback (Check icon) for 2 seconds.\n   *\n   * @param formatToCopy - The coordinate format to copy (dd, ddm, dms, mgrs, utm)\n   */\n  const handleCopyFormat = async (formatToCopy: CoordinateSystem) => {\n    if (!currentValue) {\n      return;\n    }\n\n    const allFormats = getAllCoordinateFormats(currentValue);\n    const formatResult = allFormats[formatToCopy];\n\n    if (!formatResult.isValid) {\n      return;\n    }\n\n    try {\n      // Modern clipboard API - copy and show feedback\n      await navigator.clipboard.writeText(formatResult.value);\n\n      // Set copied format to show Check icon in UI\n      setCopiedFormat(formatToCopy);\n\n      // Reset to null after 2 seconds to return to Copy icon\n      registerTimeout(\n        setTimeout(() => {\n          setCopiedFormat(null);\n        }, COPY_FEEDBACK_DURATION_MS),\n      );\n    } catch (_err) {\n      // Fall back to document.execCommand for older browsers\n      fallbackCopyToClipboard(formatResult.value, formatToCopy);\n    }\n  };\n\n  const isFormatButtonEnabled =\n    currentValue !== null && validationErrors.length === 0 && !isDisabled;\n\n  return {\n    copiedFormat,\n    handleCopyFormat,\n    isFormatButtonEnabled,\n  };\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAeA,MAAM,SAAS,mBAAmB,oBAAoB;AAStD,MAAM,4BAA4B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2DlC,SAAgB,kBAAkB,EAChC,cACA,kBACA,YACA,mBACoD;CACpD,MAAM,CAAC,cAAc,mBAAmB,SACtC,KACD;;;;;;;;;CAUD,MAAM,2BACJ,MACA,iBACG;EAEH,MAAM,WAAW,SAAS,cAAc,WAAW;AACnD,WAAS,QAAQ;AAEjB,WAAS,MAAM,WAAW;AAC1B,WAAS,MAAM,OAAO;AACtB,WAAS,MAAM,MAAM;AACrB,WAAS,KAAK,YAAY,SAAS;AACnC,WAAS,OAAO;AAChB,WAAS,QAAQ;AAEjB,MAAI;AACF,YAAS,YAAY,OAAO;AAG5B,mBAAgB,aAAa;AAG7B,mBACE,iBAAiB;AACf,oBAAgB,KAAK;MACpB,0BAA0B,CAC9B;WACM,KAAK;AACZ,UAAO,UAAU,IAAI,CAAC,MAAM,oCAAoC;;AAIlE,WAAS,KAAK,YAAY,SAAS;;;;;;;;;;;CAYrC,MAAM,mBAAmB,OAAO,iBAAmC;AACjE,MAAI,CAAC,aACH;EAIF,MAAM,eADa,wBAAwB,aAAa,CACxB;AAEhC,MAAI,CAAC,aAAa,QAChB;AAGF,MAAI;AAEF,SAAM,UAAU,UAAU,UAAU,aAAa,MAAM;AAGvD,mBAAgB,aAAa;AAG7B,mBACE,iBAAiB;AACf,oBAAgB,KAAK;MACpB,0BAA0B,CAC9B;WACM,MAAM;AAEb,2BAAwB,aAAa,OAAO,aAAa;;;AAO7D,QAAO;EACL;EACA;EACA,uBALA,iBAAiB,QAAQ,iBAAiB,WAAW,KAAK,CAAC;EAM5D"}

package/dist/hooks/coordinate-field/use-coordinate-field-state.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0

package/dist/hooks/coordinate-field/use-coordinate-field-state.js

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0

package/dist/hooks/coordinate-field/use-coordinate-field-state.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-coordinate-field-state.js","names":[],"sources":["../../../src/hooks/coordinate-field/use-coordinate-field-state.ts"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  type Dispatch,\n  type SetStateAction,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport {\n  areAllSegmentsFilled,\n  convertDDToDisplaySegments,\n  convertDisplaySegmentsToDD,\n  validateCoordinateSegments,\n} from '../../components/coordinate-field/coordinate-utils';\nimport { getSegmentConfigs } from '../../components/coordinate-field/segment-configs';\nimport type {\n  CoordinateSystem,\n  CoordinateValue,\n  SegmentConfig,\n} from '../../components/coordinate-field/types';\n\n/** Options for the useCoordinateFieldState hook */\nexport interface UseCoordinateFieldStateOptions {\n  /** Controlled coordinate value */\n  value?: CoordinateValue | null;\n  /** Default value for uncontrolled mode */\n  defaultValue?: CoordinateValue;\n  /** Coordinate format system (dd, ddm, dms, mgrs, utm) */\n  format: CoordinateSystem;\n  /** Callback when coordinate value changes */\n  onChange?:\n    | Dispatch<SetStateAction<CoordinateValue | null>>\n    | ((value: CoordinateValue | null) => void);\n  /** Callback for validation errors */\n  onError?: (message: string, context?: Record<string, unknown>) => void;\n  /** Register timeouts for cleanup on unmount */\n  registerTimeout?: (timeoutId: NodeJS.Timeout) => void;\n}\n\n/** Return value from the useCoordinateFieldState hook */\nexport interface UseCoordinateFieldStateResult {\n  /** Current coordinate value (null if incomplete/invalid) */\n  currentValue: CoordinateValue | null;\n  /** Array of display values for each segment */\n  segmentValues: string[];\n  /** Array of validation error messages */\n  validationErrors: string[];\n  /** All segment configurations including literals */\n  segmentConfigs: SegmentConfig[];\n  /** Only editable segment configurations */\n  editableSegmentConfigs: SegmentConfig[];\n  /** Handle change of a single segment */\n  handleSegmentChange: (index: number, newValue: string) => void;\n  /** Set all segment values at once */\n  setSegmentValues: (values: string[]) => void;\n  /** Set validation errors */\n  setValidationErrors: (errors: string[]) => void;\n  /** First validation error or null */\n  effectiveErrorMessage: string | null;\n  /** Apply a pasted coordinate value */\n  applyPastedCoordinate: (pastedValue: CoordinateValue) => void;\n  /** Immediately run pending validation */\n  flushPendingValidation: () => void;\n}\n\n/**\n * Manages coordinate segment values, validation, and format conversion\n *\n * @example\n * ```tsx\n * function CoordinateInputs() {\n *   const [value, setValue] = useState<CoordinateValue | null>(null);\n *   const { registerTimeout } = useTimeoutCleanup();\n *\n *   const {\n *     currentValue,\n *     segmentValues,\n *     validationErrors,\n *     editableSegmentConfigs,\n *     handleSegmentChange,\n *   } = useCoordinateFieldState({\n *     value,\n *     format: 'ddm',\n *     onChange: setValue,\n *     onError: (msg) => console.error(msg),\n *     registerTimeout,\n *   });\n *\n *   return (\n *     <div>\n *       {editableSegmentConfigs.map((config, i) => (\n *         <input\n *           key={i}\n *           value={segmentValues[i]}\n *           onChange={(e) => handleSegmentChange(i, e.target.value)}\n *           placeholder={config.placeholder}\n *         />\n *       ))}\n *       {validationErrors.map((error, i) => (\n *         <span key={i}>{error}</span>\n *       ))}\n *     </div>\n *   );\n * }\n * ```\n *\n * @param options - {@link UseCoordinateFieldStateOptions}\n * @param options.value - Controlled coordinate value.\n * @param options.defaultValue - Default value for uncontrolled mode.\n * @param options.format - Coordinate format system (dd, ddm, dms, mgrs, utm).\n * @param options.onChange - Callback when coordinate value changes.\n * @param options.onError - Callback for validation errors.\n * @param options.registerTimeout - Register timeouts for cleanup on unmount.\n * @returns {@link UseCoordinateFieldStateResult} Segment state, validation, and change handlers.\n */\nexport function useCoordinateFieldState({\n  value,\n  defaultValue,\n  format,\n  onChange,\n  onError,\n  registerTimeout,\n}: UseCoordinateFieldStateOptions): UseCoordinateFieldStateResult {\n  const [internalValue, setInternalValue] = useState<CoordinateValue | null>(\n    defaultValue || null,\n  );\n  const [validationErrors, setValidationErrors] = useState<string[]>([]);\n  const validationTimeoutRef = useRef<NodeJS.Timeout | null>(null);\n\n  const currentValue = value !== undefined ? value : internalValue;\n\n  const clearValidationTimeout = () => {\n    if (validationTimeoutRef.current) {\n      clearTimeout(validationTimeoutRef.current);\n      validationTimeoutRef.current = null;\n    }\n  };\n\n  const handleChange = (newValue: CoordinateValue | null) => {\n    if (value === undefined) {\n      setInternalValue(newValue);\n    }\n    onChange?.(newValue);\n  };\n\n  const segmentConfigs = useMemo(() => getSegmentConfigs(format), [format]);\n\n  const editableSegmentConfigs = useMemo(\n    () => segmentConfigs.flat().filter((config) => config.type !== 'literal'),\n    [segmentConfigs],\n  );\n\n  const [segmentValues, setSegmentValues] = useState<string[]>(() => {\n    const initialValue = value !== undefined ? value : defaultValue;\n    if (!initialValue) {\n      return new Array(editableSegmentConfigs.length).fill('');\n    }\n\n    const segments = convertDDToDisplaySegments(initialValue, format);\n    if (!segments) {\n      return new Array(editableSegmentConfigs.length).fill('');\n    }\n\n    return segments;\n  });\n\n  const convertValueToSegmentsOrClear = useCallback(\n    (valueToConvert: CoordinateValue | null) => {\n      // Clear any pending validation when value changes\n      clearValidationTimeout();\n\n      const segments = valueToConvert\n        ? convertDDToDisplaySegments(valueToConvert, format)\n        : null;\n\n      setSegmentValues(\n        segments || new Array(editableSegmentConfigs.length).fill(''),\n      );\n      setValidationErrors([]);\n    },\n    [format, editableSegmentConfigs.length],\n  );\n\n  const prevFormatRef = useRef(format);\n\n  useEffect(() => {\n    if (prevFormatRef.current !== format) {\n      prevFormatRef.current = format;\n      const valueToConvert = value !== undefined ? value : internalValue;\n      convertValueToSegmentsOrClear(valueToConvert);\n    }\n  }, [format, value, internalValue, convertValueToSegmentsOrClear]);\n\n  useEffect(() => {\n    if (value !== undefined) {\n      convertValueToSegmentsOrClear(value);\n    }\n  }, [value, convertValueToSegmentsOrClear]);\n\n  /**\n   * Validates segment values and updates the coordinate state\n   *\n   * When validation fails, calls onError with \"Invalid coordinate value\" message\n   * and context containing the detailed validation errors from @accelint/geo.\n   *\n   * @param updatedValues - Array of segment values to validate\n   */\n  const validateAndUpdateCoordinate = (updatedValues: string[]) => {\n    const errors = validateCoordinateSegments(updatedValues, format);\n\n    if (errors.length > 0) {\n      setValidationErrors(errors);\n      onError?.('Invalid coordinate value', {\n        errors,\n        format,\n        segments: updatedValues,\n      });\n      handleChange(null);\n      return;\n    }\n\n    const ddValue = convertDisplaySegmentsToDD(updatedValues, format);\n    if (!ddValue) {\n      const errorMsg = 'Invalid coordinate value';\n      setValidationErrors([errorMsg]);\n      onError?.(errorMsg, { format, segments: updatedValues });\n      handleChange(null);\n      return;\n    }\n\n    setValidationErrors([]);\n    handleChange(ddValue);\n  };\n\n  const handleSegmentChange = (index: number, newValue: string) => {\n    const updatedValues = [...segmentValues];\n    updatedValues[index] = newValue;\n    setSegmentValues(updatedValues);\n\n    if (areAllSegmentsFilled(updatedValues)) {\n      // Clear any pending validation timeout\n      clearValidationTimeout();\n\n      // Debounce validation by 400ms when all segments are full\n      const timeoutId = setTimeout(() => {\n        validateAndUpdateCoordinate(updatedValues);\n        validationTimeoutRef.current = null;\n      }, 400);\n\n      validationTimeoutRef.current = timeoutId;\n      registerTimeout?.(timeoutId);\n    } else {\n      // Clear any pending validation when segments become incomplete\n      clearValidationTimeout();\n      setValidationErrors([]);\n      if (currentValue !== null) {\n        handleChange(null);\n      }\n    }\n  };\n\n  const applyPastedCoordinate = (pastedValue: CoordinateValue) => {\n    // Clear any pending validation when applying pasted coordinate\n    clearValidationTimeout();\n\n    const segments = convertDDToDisplaySegments(pastedValue, format);\n\n    if (segments) {\n      setSegmentValues(segments);\n      setValidationErrors([]);\n      handleChange(pastedValue);\n    }\n  };\n\n  const flushPendingValidation = () => {\n    if (validationTimeoutRef.current) {\n      clearValidationTimeout();\n\n      // Immediately validate if all segments are filled\n      if (areAllSegmentsFilled(segmentValues)) {\n        validateAndUpdateCoordinate(segmentValues);\n      }\n    }\n  };\n\n  const effectiveErrorMessage = useMemo(\n    () => validationErrors[0] || null,\n    [validationErrors],\n  );\n\n  return {\n    currentValue,\n    segmentValues,\n    validationErrors,\n    segmentConfigs,\n    editableSegmentConfigs,\n    handleSegmentChange,\n    setSegmentValues,\n    setValidationErrors,\n    effectiveErrorMessage,\n    applyPastedCoordinate,\n    flushPendingValidation,\n  };\n}\n"],"mappings":"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"}
+{"version":3,"file":"use-coordinate-field-state.js","names":[],"sources":["../../../src/hooks/coordinate-field/use-coordinate-field-state.ts"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  type Dispatch,\n  type SetStateAction,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport {\n  areAllSegmentsFilled,\n  convertDDToDisplaySegments,\n  convertDisplaySegmentsToDD,\n  validateCoordinateSegments,\n} from '../../components/coordinate-field/coordinate-utils';\nimport { getSegmentConfigs } from '../../components/coordinate-field/segment-configs';\nimport type {\n  CoordinateSystem,\n  CoordinateValue,\n  SegmentConfig,\n} from '../../components/coordinate-field/types';\n\n/** Options for the useCoordinateFieldState hook */\nexport interface UseCoordinateFieldStateOptions {\n  /** Controlled coordinate value */\n  value?: CoordinateValue | null;\n  /** Default value for uncontrolled mode */\n  defaultValue?: CoordinateValue;\n  /** Coordinate format system (dd, ddm, dms, mgrs, utm) */\n  format: CoordinateSystem;\n  /** Callback when coordinate value changes */\n  onChange?:\n    | Dispatch<SetStateAction<CoordinateValue | null>>\n    | ((value: CoordinateValue | null) => void);\n  /** Callback for validation errors */\n  onError?: (message: string, context?: Record<string, unknown>) => void;\n  /** Register timeouts for cleanup on unmount */\n  registerTimeout?: (timeoutId: NodeJS.Timeout) => void;\n}\n\n/** Return value from the useCoordinateFieldState hook */\nexport interface UseCoordinateFieldStateResult {\n  /** Current coordinate value (null if incomplete/invalid) */\n  currentValue: CoordinateValue | null;\n  /** Array of display values for each segment */\n  segmentValues: string[];\n  /** Array of validation error messages */\n  validationErrors: string[];\n  /** All segment configurations including literals */\n  segmentConfigs: SegmentConfig[];\n  /** Only editable segment configurations */\n  editableSegmentConfigs: SegmentConfig[];\n  /** Handle change of a single segment */\n  handleSegmentChange: (index: number, newValue: string) => void;\n  /** Set all segment values at once */\n  setSegmentValues: (values: string[]) => void;\n  /** Set validation errors */\n  setValidationErrors: (errors: string[]) => void;\n  /** First validation error or null */\n  effectiveErrorMessage: string | null;\n  /** Apply a pasted coordinate value */\n  applyPastedCoordinate: (pastedValue: CoordinateValue) => void;\n  /** Immediately run pending validation */\n  flushPendingValidation: () => void;\n}\n\n/**\n * Manages coordinate segment values, validation, and format conversion\n *\n * @example\n * ```tsx\n * function CoordinateInputs() {\n *   const [value, setValue] = useState<CoordinateValue | null>(null);\n *   const { registerTimeout } = useTimeoutCleanup();\n *\n *   const {\n *     currentValue,\n *     segmentValues,\n *     validationErrors,\n *     editableSegmentConfigs,\n *     handleSegmentChange,\n *   } = useCoordinateFieldState({\n *     value,\n *     format: 'ddm',\n *     onChange: setValue,\n *     onError: (msg) => console.error(msg),\n *     registerTimeout,\n *   });\n *\n *   return (\n *     <div>\n *       {editableSegmentConfigs.map((config, i) => (\n *         <input\n *           key={i}\n *           value={segmentValues[i]}\n *           onChange={(e) => handleSegmentChange(i, e.target.value)}\n *           placeholder={config.placeholder}\n *         />\n *       ))}\n *       {validationErrors.map((error, i) => (\n *         <span key={i}>{error}</span>\n *       ))}\n *     </div>\n *   );\n * }\n * ```\n *\n * @param options - {@link UseCoordinateFieldStateOptions}\n * @param options.value - Controlled coordinate value.\n * @param options.defaultValue - Default value for uncontrolled mode.\n * @param options.format - Coordinate format system (dd, ddm, dms, mgrs, utm).\n * @param options.onChange - Callback when coordinate value changes.\n * @param options.onError - Callback for validation errors.\n * @param options.registerTimeout - Register timeouts for cleanup on unmount.\n * @returns {@link UseCoordinateFieldStateResult} Segment state, validation, and change handlers.\n */\nexport function useCoordinateFieldState({\n  value,\n  defaultValue,\n  format,\n  onChange,\n  onError,\n  registerTimeout,\n}: UseCoordinateFieldStateOptions): UseCoordinateFieldStateResult {\n  const [internalValue, setInternalValue] = useState<CoordinateValue | null>(\n    defaultValue || null,\n  );\n  const [validationErrors, setValidationErrors] = useState<string[]>([]);\n  const validationTimeoutRef = useRef<NodeJS.Timeout | null>(null);\n\n  const currentValue = value !== undefined ? value : internalValue;\n\n  const clearValidationTimeout = () => {\n    if (validationTimeoutRef.current) {\n      clearTimeout(validationTimeoutRef.current);\n      validationTimeoutRef.current = null;\n    }\n  };\n\n  const handleChange = (newValue: CoordinateValue | null) => {\n    if (value === undefined) {\n      setInternalValue(newValue);\n    }\n    onChange?.(newValue);\n  };\n\n  const segmentConfigs = useMemo(() => getSegmentConfigs(format), [format]);\n\n  const editableSegmentConfigs = useMemo(\n    () => segmentConfigs.flat().filter((config) => config.type !== 'literal'),\n    [segmentConfigs],\n  );\n\n  const [segmentValues, setSegmentValues] = useState<string[]>(() => {\n    const initialValue = value !== undefined ? value : defaultValue;\n    if (!initialValue) {\n      return new Array(editableSegmentConfigs.length).fill('');\n    }\n\n    const segments = convertDDToDisplaySegments(initialValue, format);\n    if (!segments) {\n      return new Array(editableSegmentConfigs.length).fill('');\n    }\n\n    return segments;\n  });\n\n  const convertValueToSegmentsOrClear = useCallback(\n    (valueToConvert: CoordinateValue | null) => {\n      // Clear any pending validation when value changes\n      clearValidationTimeout();\n\n      const segments = valueToConvert\n        ? convertDDToDisplaySegments(valueToConvert, format)\n        : null;\n\n      setSegmentValues(\n        segments || new Array(editableSegmentConfigs.length).fill(''),\n      );\n      setValidationErrors([]);\n    },\n    [format, editableSegmentConfigs.length],\n  );\n\n  const prevFormatRef = useRef(format);\n\n  useEffect(() => {\n    if (prevFormatRef.current !== format) {\n      prevFormatRef.current = format;\n      const valueToConvert = value !== undefined ? value : internalValue;\n      convertValueToSegmentsOrClear(valueToConvert);\n    }\n  }, [format, value, internalValue, convertValueToSegmentsOrClear]);\n\n  useEffect(() => {\n    if (value !== undefined) {\n      convertValueToSegmentsOrClear(value);\n    }\n  }, [value, convertValueToSegmentsOrClear]);\n\n  /**\n   * Validates segment values and updates the coordinate state\n   *\n   * When validation fails, calls onError with \"Invalid coordinate value\" message\n   * and context containing the detailed validation errors from @accelint/geo.\n   *\n   * @param updatedValues - Array of segment values to validate\n   */\n  const validateAndUpdateCoordinate = (updatedValues: string[]) => {\n    const errors = validateCoordinateSegments(updatedValues, format);\n\n    if (errors.length > 0) {\n      setValidationErrors(errors);\n      onError?.('Invalid coordinate value', {\n        errors,\n        format,\n        segments: updatedValues,\n      });\n      handleChange(null);\n      return;\n    }\n\n    const ddValue = convertDisplaySegmentsToDD(updatedValues, format);\n    if (!ddValue) {\n      const errorMsg = 'Invalid coordinate value';\n      setValidationErrors([errorMsg]);\n      onError?.(errorMsg, { format, segments: updatedValues });\n      handleChange(null);\n      return;\n    }\n\n    setValidationErrors([]);\n    handleChange(ddValue);\n  };\n\n  const handleSegmentChange = (index: number, newValue: string) => {\n    const updatedValues = [...segmentValues];\n    updatedValues[index] = newValue;\n    setSegmentValues(updatedValues);\n\n    if (areAllSegmentsFilled(updatedValues)) {\n      // Clear any pending validation timeout\n      clearValidationTimeout();\n\n      // Debounce validation by 400ms when all segments are full\n      const timeoutId = setTimeout(() => {\n        validateAndUpdateCoordinate(updatedValues);\n        validationTimeoutRef.current = null;\n      }, 400);\n\n      validationTimeoutRef.current = timeoutId;\n      registerTimeout?.(timeoutId);\n    } else {\n      // Clear any pending validation when segments become incomplete\n      clearValidationTimeout();\n      setValidationErrors([]);\n      if (currentValue !== null) {\n        handleChange(null);\n      }\n    }\n  };\n\n  const applyPastedCoordinate = (pastedValue: CoordinateValue) => {\n    // Clear any pending validation when applying pasted coordinate\n    clearValidationTimeout();\n\n    const segments = convertDDToDisplaySegments(pastedValue, format);\n\n    if (segments) {\n      setSegmentValues(segments);\n      setValidationErrors([]);\n      handleChange(pastedValue);\n    }\n  };\n\n  const flushPendingValidation = () => {\n    if (validationTimeoutRef.current) {\n      clearValidationTimeout();\n\n      // Immediately validate if all segments are filled\n      if (areAllSegmentsFilled(segmentValues)) {\n        validateAndUpdateCoordinate(segmentValues);\n      }\n    }\n  };\n\n  const effectiveErrorMessage = useMemo(\n    () => validationErrors[0] || null,\n    [validationErrors],\n  );\n\n  return {\n    currentValue,\n    segmentValues,\n    validationErrors,\n    segmentConfigs,\n    editableSegmentConfigs,\n    handleSegmentChange,\n    setSegmentValues,\n    setValidationErrors,\n    effectiveErrorMessage,\n    applyPastedCoordinate,\n    flushPendingValidation,\n  };\n}\n"],"mappings":"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"}

package/dist/hooks/coordinate-field/use-coordinate-field.d.ts

@@ -1,5 +1,5 @@
 /*
- * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.
  * This file is licensed to you under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License. You may obtain a copy
  * of the License at https://www.apache.org/licenses/LICENSE-2.0