etudes 5.0.0 → 5.2.0

package/components/Video.d.ts

@@ -1,4 +1,4 @@
-import React, { type HTMLAttributes } from 'react';
+import { type HTMLAttributes } from 'react';
 import { type Size } from 'spase';
 export type VideoProps = Omit<HTMLAttributes<HTMLVideoElement>, 'autoPlay' | 'controls' | 'loop' | 'muted' | 'playsInline' | 'poster' | 'onCanPlay' | 'onEnded' | 'onPause' | 'onPlay'> & {
     autoLoop?: boolean;
@@ -18,21 +18,21 @@ export type VideoProps = Omit<HTMLAttributes<HTMLVideoElement>, 'autoPlay' | 'co
     onPlay?: () => void;
     onSizeChange?: (size?: Size) => void;
 };
-export declare const Video: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLVideoElement>, "onCanPlay" | "onEnded" | "onPause" | "onPlay" | "autoPlay" | "controls" | "loop" | "muted" | "playsInline" | "poster"> & {
-    autoLoop?: boolean | undefined;
-    autoPlay?: boolean | undefined;
-    hasControls?: boolean | undefined;
-    isMuted?: boolean | undefined;
-    playsInline?: boolean | undefined;
-    posterSrc?: string | undefined;
+export declare const Video: import("react").ForwardRefExoticComponent<Omit<HTMLAttributes<HTMLVideoElement>, "onCanPlay" | "onEnded" | "onPause" | "onPlay" | "autoPlay" | "controls" | "loop" | "muted" | "playsInline" | "poster"> & {
+    autoLoop?: boolean;
+    autoPlay?: boolean;
+    hasControls?: boolean;
+    isMuted?: boolean;
+    playsInline?: boolean;
+    posterSrc?: string;
     src: string;
-    onCanPlay?: (() => void) | undefined;
-    onEnd?: (() => void) | undefined;
-    onFullscreenChange?: ((isFullscreen: boolean) => void) | undefined;
-    onLoadMetadata?: (() => void) | undefined;
-    onLoadMetadataComplete?: (() => void) | undefined;
-    onLoadMetadataError?: (() => void) | undefined;
-    onPause?: (() => void) | undefined;
-    onPlay?: (() => void) | undefined;
-    onSizeChange?: ((size?: Size) => void) | undefined;
-} & React.RefAttributes<HTMLVideoElement>>;
+    onCanPlay?: () => void;
+    onEnd?: () => void;
+    onFullscreenChange?: (isFullscreen: boolean) => void;
+    onLoadMetadata?: () => void;
+    onLoadMetadataComplete?: () => void;
+    onLoadMetadataError?: () => void;
+    onPause?: () => void;
+    onPlay?: () => void;
+    onSizeChange?: (size?: Size) => void;
+} & import("react").RefAttributes<HTMLVideoElement>>;

package/components/Video.js

@@ -10,29 +10,6 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -46,7 +23,8 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Video = void 0;
-var react_1 = __importStar(require("react"));
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
 var useVideoSize_1 = require("../hooks/useVideoSize");
 exports.Video = (0, react_1.forwardRef)(function (_a, ref) {
     var _b;
@@ -111,8 +89,7 @@ exports.Video = (0, react_1.forwardRef)(function (_a, ref) {
             return;
         videoRef.current.pause();
     };
-    return (react_1.default.createElement("video", __assign({}, props, { ref: ref, "data-component": 'video', autoPlay: autoPlay, controls: hasControls, loop: autoLoop, muted: isMuted, playsInline: playsInline, poster: posterSrc, onCanPlay: canPlayHandler, onEnded: endHandler, onPause: pauseHandler, onPlay: playHandler }),
-        react_1.default.createElement("source", { src: src })));
+    return ((0, jsx_runtime_1.jsx)("video", __assign({}, props, { ref: ref, autoPlay: autoPlay, controls: hasControls, "data-component": 'video', loop: autoLoop, muted: isMuted, playsInline: playsInline, poster: posterSrc, onCanPlay: canPlayHandler, onEnded: endHandler, onPause: pauseHandler, onPlay: playHandler, children: (0, jsx_runtime_1.jsx)("source", { src: src }) })));
 });
 Object.defineProperty(exports.Video, 'displayName', { value: 'Video', writable: false });
 //# sourceMappingURL=Video.js.map

package/components/Video.js.map

@@ -1 +1 @@
-{"version":3,"file":"Video.js","sourceRoot":"/","sources":["components/Video.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { forwardRef, useEffect, useRef, type HTMLAttributes, type ReactEventHandler, type RefObject } from 'react'\nimport { type Size } from 'spase'\nimport { useVideoSize } from '../hooks/useVideoSize'\n\nexport type VideoProps = Omit<HTMLAttributes<HTMLVideoElement>, 'autoPlay' | 'controls' | 'loop' | 'muted' | 'playsInline' | 'poster' | 'onCanPlay' | 'onEnded' | 'onPause' | 'onPlay'> & {\n  autoLoop?: boolean\n  autoPlay?: boolean\n  hasControls?: boolean\n  isMuted?: boolean\n  playsInline?: boolean\n  posterSrc?: string\n  src: string\n  onCanPlay?: () => void\n  onEnd?: () => void\n  onFullscreenChange?: (isFullscreen: boolean) => void\n  onLoadMetadata?: () => void\n  onLoadMetadataComplete?: () => void\n  onLoadMetadataError?: () => void\n  onPause?: () => void\n  onPlay?: () => void\n  onSizeChange?: (size?: Size) => void\n}\n\nexport const Video = forwardRef<HTMLVideoElement, VideoProps>(({\n  autoLoop = true,\n  autoPlay = true,\n  hasControls = false,\n  isMuted = true,\n  playsInline = true,\n  posterSrc,\n  src,\n  onCanPlay,\n  onEnd,\n  onFullscreenChange,\n  onLoadMetadata,\n  onLoadMetadataComplete,\n  onLoadMetadataError,\n  onPause,\n  onPlay,\n  onSizeChange,\n  ...props\n}, ref) => {\n  const localRef = useRef<HTMLVideoElement>(null)\n  const videoRef = ref as RefObject<HTMLVideoElement> ?? localRef\n  const size = useVideoSize({\n    src,\n  }, {\n    onLoadStart: onLoadMetadata,\n    onLoadComplete: onLoadMetadataComplete,\n    onLoadError: onLoadMetadataError,\n  })\n\n  useEffect(() => {\n    if (!videoRef.current) return\n\n    videoRef.current.muted = isMuted\n    videoRef.current.load()\n    videoRef.current.addEventListener('webkitfullscreenchange', fullscreenChangeHandler)\n    videoRef.current.addEventListener('mozfullscreenchange', fullscreenChangeHandler)\n    videoRef.current.addEventListener('fullscreenchange', fullscreenChangeHandler)\n\n    return () => {\n      pause()\n\n      videoRef.current?.removeEventListener('webkitfullscreenchange', fullscreenChangeHandler)\n      videoRef.current?.removeEventListener('mozfullscreenchange', fullscreenChangeHandler)\n      videoRef.current?.removeEventListener('fullscreenchange', fullscreenChangeHandler)\n    }\n  }, [src])\n\n  useEffect(() => {\n    onSizeChange?.(size)\n  }, [size])\n\n  const fullscreenChangeHandler = (event: Event) => {\n    const isFullscreen: boolean | undefined = (document as any).fullScreen || (document as any).mozFullScreen || (document as any).webkitIsFullScreen\n    if (isFullscreen === undefined) return\n    onFullscreenChange?.(isFullscreen)\n  }\n\n  const canPlayHandler: ReactEventHandler<HTMLVideoElement> = event => {\n    if (autoPlay && (videoRef.current?.paused ?? false)) {\n      play()\n    }\n\n    onCanPlay?.()\n  }\n\n  const playHandler: ReactEventHandler<HTMLVideoElement> = event => {\n    onPlay?.()\n  }\n\n  const pauseHandler: ReactEventHandler<HTMLVideoElement> = event => {\n    onPause?.()\n  }\n\n  const endHandler: ReactEventHandler<HTMLVideoElement> = event => {\n    onEnd?.()\n  }\n\n  const play = () => {\n    if (!videoRef.current) return\n    videoRef.current.play()\n  }\n\n  const pause = () => {\n    if (!videoRef.current) return\n    videoRef.current.pause()\n  }\n\n  return (\n    <video\n      {...props}\n      ref={ref}\n      data-component='video'\n      autoPlay={autoPlay}\n      controls={hasControls}\n      loop={autoLoop}\n      muted={isMuted}\n      playsInline={playsInline}\n      poster={posterSrc}\n      onCanPlay={canPlayHandler}\n      onEnded={endHandler}\n      onPause={pauseHandler}\n      onPlay={playHandler}\n    >\n      <source src={src}/>\n    </video>\n  )\n})\n\nObject.defineProperty(Video, 'displayName', { value: 'Video', writable: false })\n"]}
+{"version":3,"file":"Video.js","sourceRoot":"/","sources":["components/Video.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect, useRef, type HTMLAttributes, type ReactEventHandler, type RefObject } from 'react'\nimport { type Size } from 'spase'\nimport { useVideoSize } from '../hooks/useVideoSize'\n\nexport type VideoProps = Omit<HTMLAttributes<HTMLVideoElement>, 'autoPlay' | 'controls' | 'loop' | 'muted' | 'playsInline' | 'poster' | 'onCanPlay' | 'onEnded' | 'onPause' | 'onPlay'> & {\n  autoLoop?: boolean\n  autoPlay?: boolean\n  hasControls?: boolean\n  isMuted?: boolean\n  playsInline?: boolean\n  posterSrc?: string\n  src: string\n  onCanPlay?: () => void\n  onEnd?: () => void\n  onFullscreenChange?: (isFullscreen: boolean) => void\n  onLoadMetadata?: () => void\n  onLoadMetadataComplete?: () => void\n  onLoadMetadataError?: () => void\n  onPause?: () => void\n  onPlay?: () => void\n  onSizeChange?: (size?: Size) => void\n}\n\nexport const Video = forwardRef<HTMLVideoElement, VideoProps>(({\n  autoLoop = true,\n  autoPlay = true,\n  hasControls = false,\n  isMuted = true,\n  playsInline = true,\n  posterSrc,\n  src,\n  onCanPlay,\n  onEnd,\n  onFullscreenChange,\n  onLoadMetadata,\n  onLoadMetadataComplete,\n  onLoadMetadataError,\n  onPause,\n  onPlay,\n  onSizeChange,\n  ...props\n}, ref) => {\n  const localRef = useRef<HTMLVideoElement>(null)\n  const videoRef = ref as RefObject<HTMLVideoElement> ?? localRef\n  const size = useVideoSize({\n    src,\n  }, {\n    onLoadStart: onLoadMetadata,\n    onLoadComplete: onLoadMetadataComplete,\n    onLoadError: onLoadMetadataError,\n  })\n\n  useEffect(() => {\n    if (!videoRef.current) return\n\n    videoRef.current.muted = isMuted\n    videoRef.current.load()\n    videoRef.current.addEventListener('webkitfullscreenchange', fullscreenChangeHandler)\n    videoRef.current.addEventListener('mozfullscreenchange', fullscreenChangeHandler)\n    videoRef.current.addEventListener('fullscreenchange', fullscreenChangeHandler)\n\n    return () => {\n      pause()\n\n      videoRef.current?.removeEventListener('webkitfullscreenchange', fullscreenChangeHandler)\n      videoRef.current?.removeEventListener('mozfullscreenchange', fullscreenChangeHandler)\n      videoRef.current?.removeEventListener('fullscreenchange', fullscreenChangeHandler)\n    }\n  }, [src])\n\n  useEffect(() => {\n    onSizeChange?.(size)\n  }, [size])\n\n  const fullscreenChangeHandler = (event: Event) => {\n    const isFullscreen: boolean | undefined = (document as any).fullScreen || (document as any).mozFullScreen || (document as any).webkitIsFullScreen\n    if (isFullscreen === undefined) return\n    onFullscreenChange?.(isFullscreen)\n  }\n\n  const canPlayHandler: ReactEventHandler<HTMLVideoElement> = event => {\n    if (autoPlay && (videoRef.current?.paused ?? false)) {\n      play()\n    }\n\n    onCanPlay?.()\n  }\n\n  const playHandler: ReactEventHandler<HTMLVideoElement> = event => {\n    onPlay?.()\n  }\n\n  const pauseHandler: ReactEventHandler<HTMLVideoElement> = event => {\n    onPause?.()\n  }\n\n  const endHandler: ReactEventHandler<HTMLVideoElement> = event => {\n    onEnd?.()\n  }\n\n  const play = () => {\n    if (!videoRef.current) return\n    videoRef.current.play()\n  }\n\n  const pause = () => {\n    if (!videoRef.current) return\n    videoRef.current.pause()\n  }\n\n  return (\n    <video\n      {...props}\n      ref={ref}\n      autoPlay={autoPlay}\n      controls={hasControls}\n      data-component='video'\n      loop={autoLoop}\n      muted={isMuted}\n      playsInline={playsInline}\n      poster={posterSrc}\n      onCanPlay={canPlayHandler}\n      onEnded={endHandler}\n      onPause={pauseHandler}\n      onPlay={playHandler}\n    >\n      <source src={src}/>\n    </video>\n  )\n})\n\nObject.defineProperty(Video, 'displayName', { value: 'Video', writable: false })\n"]}

package/components/WithTooltip.d.ts

@@ -1,4 +1,4 @@
-import React, { type HTMLAttributes, type PropsWithChildren } from 'react';
+import { type HTMLAttributes, type PropsWithChildren } from 'react';
 export type WithToolTipProps = Pick<HTMLAttributes<HTMLElement>, 'className' | 'style'> & PropsWithChildren<{
     /**
      * The height of the arrow. The width (longest edge) of the arrow is always
@@ -29,4 +29,4 @@ export type WithToolTipProps = Pick<HTMLAttributes<HTMLElement>, 'className' | '
      */
     threshold?: number;
 }>;
-export declare function WithTooltip({ children, className, style, arrowHeight, backgroundColor, gap, hint, maxTextWidth, threshold, }: WithToolTipProps): React.JSX.Element;
+export declare function WithTooltip({ children, className, style, arrowHeight, backgroundColor, gap, hint, maxTextWidth, threshold, }: WithToolTipProps): import("react/jsx-runtime").JSX.Element;

package/components/WithTooltip.js

@@ -10,36 +10,14 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.WithTooltip = void 0;
+exports.WithTooltip = WithTooltip;
+var jsx_runtime_1 = require("react/jsx-runtime");
 var clsx_1 = __importDefault(require("clsx"));
-var react_1 = __importStar(require("react"));
+var react_1 = require("react");
 var spase_1 = require("spase");
 var useRect_1 = require("../hooks/useRect");
 var useViewportSize_1 = require("../hooks/useViewportSize");
@@ -139,9 +117,8 @@ function WithTooltip(_a) {
             (_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.removeChild(dialogNode);
         };
     }, [rect, viewportSize]);
-    return (react_1.default.createElement(ExtractChild_1.ExtractChild, { ref: rootRef, onMouseEnter: mouseEnterHandler, onMouseLeave: mouseLeaveHandler }, children));
+    return ((0, jsx_runtime_1.jsx)(ExtractChild_1.ExtractChild, { ref: rootRef, onMouseEnter: mouseEnterHandler, onMouseLeave: mouseLeaveHandler, children: children }));
 }
-exports.WithTooltip = WithTooltip;
 function makeDisplacementStyle(alignment, arrowHeight, gap) {
     switch (alignment) {
         case 'tl': return {

package/components/WithTooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"WithTooltip.js","sourceRoot":"/","sources":["components/WithTooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["import clsx from 'clsx'\nimport React, { useEffect, useRef, type CSSProperties, type HTMLAttributes, type MouseEvent, type PropsWithChildren } from 'react'\nimport { Rect, Size } from 'spase'\nimport { useRect } from '../hooks/useRect'\nimport { useViewportSize } from '../hooks/useViewportSize'\nimport { ExtractChild } from '../operators/ExtractChild'\nimport { asStyleDict, styles } from '../utils'\n\ntype Alignment = 'tl' | 'tc' | 'tr' | 'cl' | 'cr' | 'bl' | 'bc' | 'br'\n\nexport type WithToolTipProps = Pick<HTMLAttributes<HTMLElement>, 'className' | 'style'> & PropsWithChildren<{\n  /**\n   * The height of the arrow. The width (longest edge) of the arrow is always\n   * twice its height.\n   */\n  arrowHeight?: number\n\n  /**\n   * Color of the dialog background, same format as a CSS color string (i.e.\n   * '#000').\n   */\n  backgroundColor?: string\n\n  /**\n   * The hint string to display in the tooltip.\n   */\n  hint: string\n\n  /**\n   * The gap (in pixels) between the target element and the tooltip, defaults to\n   * zero.\n   */\n  gap?: number\n\n  /**\n   * The maximum width (in pixels) of the hint text.\n   */\n  maxTextWidth?: number\n\n  /**\n   * The minimum space (in pixels) between the target element and the edge of\n   * the window required to trigger an alignment change, defaults to `100px`.\n   */\n  threshold?: number\n}>\n\nexport function WithTooltip({\n  children,\n  className,\n  style,\n  arrowHeight = 8,\n  backgroundColor = '#000',\n  gap = 5,\n  hint,\n  maxTextWidth = 200,\n  threshold = 100,\n}: WithToolTipProps) {\n  const createDialog = () => {\n    const dialog = document.createElement('div')\n    const dialogStyle = styles(style, fixedStyles.dialog)\n    dialog.className = clsx(className)\n    dialog.setAttribute('data-component', 'tool-tip')\n    Object.keys(dialogStyle).forEach(rule => (dialog.style as any)[rule] = (dialogStyle as any)[rule])\n\n    const arrow = document.createElement('div')\n    Object.keys(fixedStyles.arrow).forEach(rule => (arrow.style as any)[rule] = (fixedStyles.arrow as any)[rule])\n\n    const content = document.createElement('div')\n    content.innerText = hint\n    Object.keys(fixedStyles.content).forEach(rule => (content.style as any)[rule] = (fixedStyles.content as any)[rule])\n\n    dialog.appendChild(arrow)\n    dialog.appendChild(content)\n\n    return dialog\n  }\n\n  const computeAlignment = () => {\n    if (!rootRef.current) return 'bc'\n\n    const vrect = Rect.fromViewport()\n    const irect = Rect.intersecting(rootRef.current)\n\n    if (irect) {\n      const leftBound = irect.left - vrect.left < threshold\n      const rightBound = vrect.right - irect.right < threshold\n      const topBound = irect.top - vrect.top < threshold\n      const bottomBound = vrect.bottom - irect.bottom < threshold\n\n      if (leftBound && topBound) return 'br'\n      if (leftBound && bottomBound) return 'tr'\n      if (rightBound && topBound) return 'bl'\n      if (rightBound && bottomBound) return 'tl'\n      if (leftBound) return 'cr'\n      if (rightBound) return 'cl'\n      if (bottomBound) return 'tc'\n    }\n\n    return 'bc'\n  }\n\n  const computeTextSize = () => {\n    if (!dialogRef.current) return new Size()\n\n    const computedStyle = window.getComputedStyle(dialogRef.current)\n    const div = document.createElement('div')\n    div.innerText = hint\n    div.style.fontFamily = computedStyle.getPropertyValue('font-family')\n    div.style.fontSize = computedStyle.getPropertyValue('font-size')\n    div.style.fontStyle = computedStyle.getPropertyValue('font-style')\n    div.style.fontVariant = computedStyle.getPropertyValue('font-variant')\n    div.style.fontWeight = computedStyle.getPropertyValue('font-weight')\n    div.style.left = '0'\n    div.style.position = 'absolute'\n    div.style.top = '0'\n    div.style.visibility = 'hidden'\n    div.style.whiteSpace = 'pre'\n\n    document.body.appendChild(div)\n\n    // Add 1px as buffer to mitigate precision discrepancies.\n    const width = div.clientWidth + 1\n    const height = div.clientHeight + 1\n\n    document.body.removeChild(div)\n\n    return new Size([width, height])\n  }\n\n  const mouseEnterHandler = (event: MouseEvent) => {\n    if (!dialogRef.current) return\n    dialogRef.current.style.opacity = '1'\n  }\n\n  const mouseLeaveHandler = (event: MouseEvent) => {\n    if (!dialogRef.current) return\n    dialogRef.current.style.opacity = '0'\n  }\n\n  const rootRef = useRef<HTMLElement>(null)\n  const dialogRef = useRef<HTMLDivElement>()\n  const rect = useRect(rootRef)\n  const viewportSize = useViewportSize()\n  const alignment = computeAlignment()\n  const textSize = computeTextSize()\n  const fixedStyles = getFixedStyles({ rect, arrowHeight, alignment, backgroundColor, maxTextWidth, textSize, gap })\n\n  useEffect(() => {\n    const dialogNode = createDialog()\n    rootRef.current?.appendChild(dialogNode)\n\n    dialogRef.current = dialogNode\n\n    return () => {\n      rootRef.current?.removeChild(dialogNode)\n    }\n  }, [rect, viewportSize])\n\n  return (\n    <ExtractChild\n      ref={rootRef}\n      onMouseEnter={mouseEnterHandler}\n      onMouseLeave={mouseLeaveHandler}\n    >\n      {children}\n    </ExtractChild>\n  )\n}\n\nfunction makeDisplacementStyle(alignment: Alignment, arrowHeight: number, gap: number): CSSProperties {\n  switch (alignment) {\n    case 'tl': return {\n      top: `${-arrowHeight}px`,\n      left: `calc(50% + ${arrowHeight * 2.5}px)`,\n    }\n    case 'tc': return {\n      top: `${-arrowHeight}px`,\n      left: '50%',\n    }\n    case 'tr': return {\n      top: `${-arrowHeight}px`,\n      right: `calc(50% + ${arrowHeight * 2.5}px)`,\n    }\n    case 'cl': return {\n      top: '50%',\n      left: `${-arrowHeight}px`,\n    }\n    case 'cr': return {\n      top: '50%',\n      right: `${-arrowHeight}px`,\n    }\n    case 'bl': return {\n      bottom: `${-arrowHeight}px`,\n      left: `calc(50% + ${arrowHeight * 2.5}px)`,\n    }\n    case 'bc': return {\n      bottom: `${-arrowHeight}px`,\n      left: '50%',\n    }\n    case 'br': return {\n      bottom: `${-arrowHeight}px`,\n      right: `calc(50% + ${arrowHeight * 2.5}px)`,\n    }\n    default: return {\n\n    }\n  }\n}\n\nfunction makeContentPositionStyle(alignment: Alignment, arrowHeight: number, gap: number): CSSProperties {\n  switch (alignment) {\n    case 'tl': return {\n      transform: `translate3d(calc(-100% - ${gap}px), calc(-100% - ${gap}px), 0)`,\n    }\n    case 'tc': return {\n      transform: `translate3d(-50%, calc(-100% - ${gap}px), 0)`,\n    }\n    case 'tr': return {\n      transform: `translate3d(calc(100% + ${gap}px), calc(-100% - ${gap}px), 0)`,\n    }\n    case 'cl': return {\n      transform: `translate3d(calc(-100% - ${gap}px), -50%, 0)`,\n    }\n    case 'cr': return {\n      transform: `translate3d(calc(100% + ${gap}px), -50%, 0)`,\n    }\n    case 'bl': return {\n      transform: `translate3d(calc(-100% - ${gap}px), calc(100% + ${gap}px), 0)`,\n    }\n    case 'bc': return {\n      transform: `translate3d(-50%, calc(100% + ${gap}px), 0)`,\n    }\n    case 'br': return {\n      transform: `translate3d(calc(100% + ${gap}px), calc(100% + ${gap}px), 0)`,\n    }\n    default: return {\n\n    }\n  }\n}\n\nfunction makeArrowPositionStyle(alignment: Alignment, arrowHeight: number, gap: number, color: string): CSSProperties {\n  switch (alignment) {\n    case 'tl': return {\n      borderColor: `${color} transparent transparent transparent`,\n      transform: `translate3d(calc(0% - ${gap}px - ${arrowHeight * 3}px), calc(0% - ${gap}px), 0)`,\n    }\n    case 'tc': return {\n      borderColor: `${color} transparent transparent transparent`,\n      transform: `translate3d(-50%, calc(0% - ${gap}px), 0)`,\n    }\n    case 'tr': return {\n      borderColor: `${color} transparent transparent transparent`,\n      transform: `translate3d(calc(100% + ${gap}px + ${arrowHeight}px), calc(0% - ${gap}px), 0)`,\n    }\n    case 'cl': return {\n      borderColor: `transparent transparent transparent ${color}`,\n      transform: `translate3d(calc(0% - ${gap}px), -50%, 0)`,\n    }\n    case 'cr': return {\n      borderColor: `transparent ${color} transparent transparent`,\n      transform: `translate3d(calc(0% + ${gap}px), -50%, 0)`,\n    }\n    case 'bl': return {\n      borderColor: `transparent transparent ${color} transparent`,\n      transform: `translate3d(calc(0% - ${gap}px - ${arrowHeight * 3}px), calc(0% + ${gap}px), 0)`,\n    }\n    case 'bc': return {\n      borderColor: `transparent transparent ${color} transparent`,\n      transform: `translate3d(-50%, calc(0% + ${gap}px), 0)`,\n    }\n    case 'br': return {\n      borderColor: `transparent transparent ${color} transparent`,\n      transform: `translate3d(calc(100% + ${gap}px + ${arrowHeight}px), calc(0% + ${gap}px), 0)`,\n    }\n    default: return {\n\n    }\n  }\n}\n\nfunction getFixedStyles({ rect = new Rect(), arrowHeight = 0, alignment = 'tl' as Alignment, backgroundColor = '', maxTextWidth = 0, textSize = new Size(), gap = 0 }) {\n  return asStyleDict({\n    dialog: {\n      background: 'none',\n      boxSizing: 'border-box',\n      height: `${rect.size.height}px`,\n      left: '0',\n      margin: '0',\n      opacity: '0',\n      position: 'absolute',\n      top: '0',\n      width: `${rect.size.width}px`,\n      zIndex: '10000',\n    },\n    arrow: {\n      borderStyle: 'solid',\n      borderWidth: `${arrowHeight}px`,\n      height: '0',\n      pointerEvents: 'none',\n      position: 'absolute',\n      width: '0',\n      ...makeDisplacementStyle(alignment, arrowHeight, gap),\n      ...makeArrowPositionStyle(alignment, arrowHeight, gap, backgroundColor),\n    },\n    content: {\n      background: backgroundColor,\n      boxSizing: 'content-box',\n      color: 'inherit',\n      fontFamily: 'inherit',\n      fontSize: 'inherit',\n      fontWeight: 'inherit',\n      letterSpacing: 'inherit',\n      lineHeight: 'inherit',\n      maxWidth: `${maxTextWidth}px`,\n      overflow: 'hidden',\n      padding: 'inherit',\n      pointerEvents: 'none',\n      position: 'absolute',\n      textAlign: 'inherit',\n      transition: 'inherit',\n      width: textSize.width > 0 ? `${textSize.width}px` : 'auto',\n      ...makeDisplacementStyle(alignment, arrowHeight, gap),\n      ...makeContentPositionStyle(alignment, arrowHeight, gap),\n    },\n  })\n}\n"]}
+{"version":3,"file":"WithTooltip.js","sourceRoot":"/","sources":["components/WithTooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["import clsx from 'clsx'\nimport { useEffect, useRef, type CSSProperties, type HTMLAttributes, type MouseEvent, type PropsWithChildren } from 'react'\nimport { Rect, Size } from 'spase'\nimport { useRect } from '../hooks/useRect'\nimport { useViewportSize } from '../hooks/useViewportSize'\nimport { ExtractChild } from '../operators/ExtractChild'\nimport { asStyleDict, styles } from '../utils'\n\ntype Alignment = 'tl' | 'tc' | 'tr' | 'cl' | 'cr' | 'bl' | 'bc' | 'br'\n\nexport type WithToolTipProps = Pick<HTMLAttributes<HTMLElement>, 'className' | 'style'> & PropsWithChildren<{\n  /**\n   * The height of the arrow. The width (longest edge) of the arrow is always\n   * twice its height.\n   */\n  arrowHeight?: number\n\n  /**\n   * Color of the dialog background, same format as a CSS color string (i.e.\n   * '#000').\n   */\n  backgroundColor?: string\n\n  /**\n   * The hint string to display in the tooltip.\n   */\n  hint: string\n\n  /**\n   * The gap (in pixels) between the target element and the tooltip, defaults to\n   * zero.\n   */\n  gap?: number\n\n  /**\n   * The maximum width (in pixels) of the hint text.\n   */\n  maxTextWidth?: number\n\n  /**\n   * The minimum space (in pixels) between the target element and the edge of\n   * the window required to trigger an alignment change, defaults to `100px`.\n   */\n  threshold?: number\n}>\n\nexport function WithTooltip({\n  children,\n  className,\n  style,\n  arrowHeight = 8,\n  backgroundColor = '#000',\n  gap = 5,\n  hint,\n  maxTextWidth = 200,\n  threshold = 100,\n}: WithToolTipProps) {\n  const createDialog = () => {\n    const dialog = document.createElement('div')\n    const dialogStyle = styles(style, fixedStyles.dialog)\n    dialog.className = clsx(className)\n    dialog.setAttribute('data-component', 'tool-tip')\n    Object.keys(dialogStyle).forEach(rule => (dialog.style as any)[rule] = (dialogStyle as any)[rule])\n\n    const arrow = document.createElement('div')\n    Object.keys(fixedStyles.arrow).forEach(rule => (arrow.style as any)[rule] = (fixedStyles.arrow as any)[rule])\n\n    const content = document.createElement('div')\n    content.innerText = hint\n    Object.keys(fixedStyles.content).forEach(rule => (content.style as any)[rule] = (fixedStyles.content as any)[rule])\n\n    dialog.appendChild(arrow)\n    dialog.appendChild(content)\n\n    return dialog\n  }\n\n  const computeAlignment = () => {\n    if (!rootRef.current) return 'bc'\n\n    const vrect = Rect.fromViewport()\n    const irect = Rect.intersecting(rootRef.current)\n\n    if (irect) {\n      const leftBound = irect.left - vrect.left < threshold\n      const rightBound = vrect.right - irect.right < threshold\n      const topBound = irect.top - vrect.top < threshold\n      const bottomBound = vrect.bottom - irect.bottom < threshold\n\n      if (leftBound && topBound) return 'br'\n      if (leftBound && bottomBound) return 'tr'\n      if (rightBound && topBound) return 'bl'\n      if (rightBound && bottomBound) return 'tl'\n      if (leftBound) return 'cr'\n      if (rightBound) return 'cl'\n      if (bottomBound) return 'tc'\n    }\n\n    return 'bc'\n  }\n\n  const computeTextSize = () => {\n    if (!dialogRef.current) return new Size()\n\n    const computedStyle = window.getComputedStyle(dialogRef.current)\n    const div = document.createElement('div')\n    div.innerText = hint\n    div.style.fontFamily = computedStyle.getPropertyValue('font-family')\n    div.style.fontSize = computedStyle.getPropertyValue('font-size')\n    div.style.fontStyle = computedStyle.getPropertyValue('font-style')\n    div.style.fontVariant = computedStyle.getPropertyValue('font-variant')\n    div.style.fontWeight = computedStyle.getPropertyValue('font-weight')\n    div.style.left = '0'\n    div.style.position = 'absolute'\n    div.style.top = '0'\n    div.style.visibility = 'hidden'\n    div.style.whiteSpace = 'pre'\n\n    document.body.appendChild(div)\n\n    // Add 1px as buffer to mitigate precision discrepancies.\n    const width = div.clientWidth + 1\n    const height = div.clientHeight + 1\n\n    document.body.removeChild(div)\n\n    return new Size([width, height])\n  }\n\n  const mouseEnterHandler = (event: MouseEvent) => {\n    if (!dialogRef.current) return\n    dialogRef.current.style.opacity = '1'\n  }\n\n  const mouseLeaveHandler = (event: MouseEvent) => {\n    if (!dialogRef.current) return\n    dialogRef.current.style.opacity = '0'\n  }\n\n  const rootRef = useRef<HTMLElement>(null)\n  const dialogRef = useRef<HTMLDivElement>()\n  const rect = useRect(rootRef)\n  const viewportSize = useViewportSize()\n  const alignment = computeAlignment()\n  const textSize = computeTextSize()\n  const fixedStyles = getFixedStyles({ rect, arrowHeight, alignment, backgroundColor, maxTextWidth, textSize, gap })\n\n  useEffect(() => {\n    const dialogNode = createDialog()\n    rootRef.current?.appendChild(dialogNode)\n\n    dialogRef.current = dialogNode\n\n    return () => {\n      rootRef.current?.removeChild(dialogNode)\n    }\n  }, [rect, viewportSize])\n\n  return (\n    <ExtractChild\n      ref={rootRef}\n      onMouseEnter={mouseEnterHandler}\n      onMouseLeave={mouseLeaveHandler}\n    >\n      {children}\n    </ExtractChild>\n  )\n}\n\nfunction makeDisplacementStyle(alignment: Alignment, arrowHeight: number, gap: number): CSSProperties {\n  switch (alignment) {\n    case 'tl': return {\n      top: `${-arrowHeight}px`,\n      left: `calc(50% + ${arrowHeight * 2.5}px)`,\n    }\n    case 'tc': return {\n      top: `${-arrowHeight}px`,\n      left: '50%',\n    }\n    case 'tr': return {\n      top: `${-arrowHeight}px`,\n      right: `calc(50% + ${arrowHeight * 2.5}px)`,\n    }\n    case 'cl': return {\n      top: '50%',\n      left: `${-arrowHeight}px`,\n    }\n    case 'cr': return {\n      top: '50%',\n      right: `${-arrowHeight}px`,\n    }\n    case 'bl': return {\n      bottom: `${-arrowHeight}px`,\n      left: `calc(50% + ${arrowHeight * 2.5}px)`,\n    }\n    case 'bc': return {\n      bottom: `${-arrowHeight}px`,\n      left: '50%',\n    }\n    case 'br': return {\n      bottom: `${-arrowHeight}px`,\n      right: `calc(50% + ${arrowHeight * 2.5}px)`,\n    }\n    default: return {\n\n    }\n  }\n}\n\nfunction makeContentPositionStyle(alignment: Alignment, arrowHeight: number, gap: number): CSSProperties {\n  switch (alignment) {\n    case 'tl': return {\n      transform: `translate3d(calc(-100% - ${gap}px), calc(-100% - ${gap}px), 0)`,\n    }\n    case 'tc': return {\n      transform: `translate3d(-50%, calc(-100% - ${gap}px), 0)`,\n    }\n    case 'tr': return {\n      transform: `translate3d(calc(100% + ${gap}px), calc(-100% - ${gap}px), 0)`,\n    }\n    case 'cl': return {\n      transform: `translate3d(calc(-100% - ${gap}px), -50%, 0)`,\n    }\n    case 'cr': return {\n      transform: `translate3d(calc(100% + ${gap}px), -50%, 0)`,\n    }\n    case 'bl': return {\n      transform: `translate3d(calc(-100% - ${gap}px), calc(100% + ${gap}px), 0)`,\n    }\n    case 'bc': return {\n      transform: `translate3d(-50%, calc(100% + ${gap}px), 0)`,\n    }\n    case 'br': return {\n      transform: `translate3d(calc(100% + ${gap}px), calc(100% + ${gap}px), 0)`,\n    }\n    default: return {\n\n    }\n  }\n}\n\nfunction makeArrowPositionStyle(alignment: Alignment, arrowHeight: number, gap: number, color: string): CSSProperties {\n  switch (alignment) {\n    case 'tl': return {\n      borderColor: `${color} transparent transparent transparent`,\n      transform: `translate3d(calc(0% - ${gap}px - ${arrowHeight * 3}px), calc(0% - ${gap}px), 0)`,\n    }\n    case 'tc': return {\n      borderColor: `${color} transparent transparent transparent`,\n      transform: `translate3d(-50%, calc(0% - ${gap}px), 0)`,\n    }\n    case 'tr': return {\n      borderColor: `${color} transparent transparent transparent`,\n      transform: `translate3d(calc(100% + ${gap}px + ${arrowHeight}px), calc(0% - ${gap}px), 0)`,\n    }\n    case 'cl': return {\n      borderColor: `transparent transparent transparent ${color}`,\n      transform: `translate3d(calc(0% - ${gap}px), -50%, 0)`,\n    }\n    case 'cr': return {\n      borderColor: `transparent ${color} transparent transparent`,\n      transform: `translate3d(calc(0% + ${gap}px), -50%, 0)`,\n    }\n    case 'bl': return {\n      borderColor: `transparent transparent ${color} transparent`,\n      transform: `translate3d(calc(0% - ${gap}px - ${arrowHeight * 3}px), calc(0% + ${gap}px), 0)`,\n    }\n    case 'bc': return {\n      borderColor: `transparent transparent ${color} transparent`,\n      transform: `translate3d(-50%, calc(0% + ${gap}px), 0)`,\n    }\n    case 'br': return {\n      borderColor: `transparent transparent ${color} transparent`,\n      transform: `translate3d(calc(100% + ${gap}px + ${arrowHeight}px), calc(0% + ${gap}px), 0)`,\n    }\n    default: return {\n\n    }\n  }\n}\n\nfunction getFixedStyles({ rect = new Rect(), arrowHeight = 0, alignment = 'tl' as Alignment, backgroundColor = '', maxTextWidth = 0, textSize = new Size(), gap = 0 }) {\n  return asStyleDict({\n    dialog: {\n      background: 'none',\n      boxSizing: 'border-box',\n      height: `${rect.size.height}px`,\n      left: '0',\n      margin: '0',\n      opacity: '0',\n      position: 'absolute',\n      top: '0',\n      width: `${rect.size.width}px`,\n      zIndex: '10000',\n    },\n    arrow: {\n      borderStyle: 'solid',\n      borderWidth: `${arrowHeight}px`,\n      height: '0',\n      pointerEvents: 'none',\n      position: 'absolute',\n      width: '0',\n      ...makeDisplacementStyle(alignment, arrowHeight, gap),\n      ...makeArrowPositionStyle(alignment, arrowHeight, gap, backgroundColor),\n    },\n    content: {\n      background: backgroundColor,\n      boxSizing: 'content-box',\n      color: 'inherit',\n      fontFamily: 'inherit',\n      fontSize: 'inherit',\n      fontWeight: 'inherit',\n      letterSpacing: 'inherit',\n      lineHeight: 'inherit',\n      maxWidth: `${maxTextWidth}px`,\n      overflow: 'hidden',\n      padding: 'inherit',\n      pointerEvents: 'none',\n      position: 'absolute',\n      textAlign: 'inherit',\n      transition: 'inherit',\n      width: textSize.width > 0 ? `${textSize.width}px` : 'auto',\n      ...makeDisplacementStyle(alignment, arrowHeight, gap),\n      ...makeContentPositionStyle(alignment, arrowHeight, gap),\n    },\n  })\n}\n"]}

package/hooks/useClickOutsideEffect.js

@@ -25,7 +25,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useClickOutsideEffect = void 0;
+exports.useClickOutsideEffect = useClickOutsideEffect;
 var react_1 = require("react");
 function useClickOutsideEffect(targetRef, handler, deps) {
     if (deps === void 0) { deps = []; }
@@ -54,5 +54,4 @@ function useClickOutsideEffect(targetRef, handler, deps) {
         };
     }, __spreadArray([], __read(deps), false));
 }
-exports.useClickOutsideEffect = useClickOutsideEffect;
 //# sourceMappingURL=useClickOutsideEffect.js.map

package/hooks/useClickOutsideEffect.js.map

@@ -1 +1 @@
-{"version":3,"file":"useClickOutsideEffect.js","sourceRoot":"/","sources":["hooks/useClickOutsideEffect.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+BAAsE;AAEtE,SAAgB,qBAAqB,CAAC,SAAiC,EAAE,OAAmB,EAAE,IAAyB;IAAzB,qBAAA,EAAA,SAAyB;IACrH,IAAA,iBAAS,EAAC;QACR,IAAM,mBAAmB,GAAG,UAAC,KAAiB;YAC5C,IAAI,CAAC,CAAC,KAAK,CAAC,MAAM,YAAY,IAAI,CAAC;gBAAE,OAAM;YAE3C,IAAI,SAAS,GAAG,IAAI,CAAA;YACpB,IAAI,IAAI,GAAG,KAAK,CAAC,MAAM,CAAA;YAEvB,OAAO,IAAI,EAAE,CAAC;gBACZ,IAAI,IAAI,KAAK,SAAS,CAAC,OAAO,EAAE,CAAC;oBAC/B,SAAS,GAAG,KAAK,CAAA;oBACjB,MAAK;gBACP,CAAC;gBAED,IAAI,CAAC,IAAI,CAAC,UAAU;oBAAE,MAAK;gBAE3B,IAAI,GAAG,IAAI,CAAC,UAAU,CAAA;YACxB,CAAC;YAED,IAAI,CAAC,SAAS;gBAAE,OAAM;YAEtB,OAAO,EAAE,CAAA;QACX,CAAC,CAAA;QAED,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,mBAAmB,EAAE,IAAI,CAAC,CAAA;QAE3D,OAAO;YACL,MAAM,CAAC,mBAAmB,CAAC,OAAO,EAAE,mBAAmB,EAAE,IAAI,CAAC,CAAA;QAChE,CAAC,CAAA;IACH,CAAC,2BAAM,IAAI,UAAE,CAAA;AACf,CAAC;AA9BD,sDA8BC","sourcesContent":["import { useEffect, type DependencyList, type RefObject } from 'react'\n\nexport function useClickOutsideEffect(targetRef: RefObject<HTMLElement>, handler: () => void, deps: DependencyList = []) {\n  useEffect(() => {\n    const clickOutsideHandler = (event: MouseEvent) => {\n      if (!(event.target instanceof Node)) return\n\n      let isOutside = true\n      let node = event.target\n\n      while (node) {\n        if (node === targetRef.current) {\n          isOutside = false\n          break\n        }\n\n        if (!node.parentNode) break\n\n        node = node.parentNode\n      }\n\n      if (!isOutside) return\n\n      handler()\n    }\n\n    window.addEventListener('click', clickOutsideHandler, true)\n\n    return () => {\n      window.removeEventListener('click', clickOutsideHandler, true)\n    }\n  }, [...deps])\n}\n"]}
+{"version":3,"file":"useClickOutsideEffect.js","sourceRoot":"/","sources":["hooks/useClickOutsideEffect.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,sDA8BC;AAhCD,+BAAsE;AAEtE,SAAgB,qBAAqB,CAAC,SAAiC,EAAE,OAAmB,EAAE,IAAyB;IAAzB,qBAAA,EAAA,SAAyB;IACrH,IAAA,iBAAS,EAAC;QACR,IAAM,mBAAmB,GAAG,UAAC,KAAiB;YAC5C,IAAI,CAAC,CAAC,KAAK,CAAC,MAAM,YAAY,IAAI,CAAC;gBAAE,OAAM;YAE3C,IAAI,SAAS,GAAG,IAAI,CAAA;YACpB,IAAI,IAAI,GAAG,KAAK,CAAC,MAAM,CAAA;YAEvB,OAAO,IAAI,EAAE,CAAC;gBACZ,IAAI,IAAI,KAAK,SAAS,CAAC,OAAO,EAAE,CAAC;oBAC/B,SAAS,GAAG,KAAK,CAAA;oBACjB,MAAK;gBACP,CAAC;gBAED,IAAI,CAAC,IAAI,CAAC,UAAU;oBAAE,MAAK;gBAE3B,IAAI,GAAG,IAAI,CAAC,UAAU,CAAA;YACxB,CAAC;YAED,IAAI,CAAC,SAAS;gBAAE,OAAM;YAEtB,OAAO,EAAE,CAAA;QACX,CAAC,CAAA;QAED,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,mBAAmB,EAAE,IAAI,CAAC,CAAA;QAE3D,OAAO;YACL,MAAM,CAAC,mBAAmB,CAAC,OAAO,EAAE,mBAAmB,EAAE,IAAI,CAAC,CAAA;QAChE,CAAC,CAAA;IACH,CAAC,2BAAM,IAAI,UAAE,CAAA;AACf,CAAC","sourcesContent":["import { useEffect, type DependencyList, type RefObject } from 'react'\n\nexport function useClickOutsideEffect(targetRef: RefObject<HTMLElement>, handler: () => void, deps: DependencyList = []) {\n  useEffect(() => {\n    const clickOutsideHandler = (event: MouseEvent) => {\n      if (!(event.target instanceof Node)) return\n\n      let isOutside = true\n      let node = event.target\n\n      while (node) {\n        if (node === targetRef.current) {\n          isOutside = false\n          break\n        }\n\n        if (!node.parentNode) break\n\n        node = node.parentNode\n      }\n\n      if (!isOutside) return\n\n      handler()\n    }\n\n    window.addEventListener('click', clickOutsideHandler, true)\n\n    return () => {\n      window.removeEventListener('click', clickOutsideHandler, true)\n    }\n  }, [...deps])\n}\n"]}

package/hooks/useDragEffect.js

@@ -25,7 +25,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useDragEffect = void 0;
+exports.useDragEffect = useDragEffect;
 var react_1 = require("react");
 var spase_1 = require("spase");
 /**
@@ -95,5 +95,4 @@ function useDragEffect(targetRef, _a, deps) {
         };
     }, __spreadArray([element, isEnabled], __read(deps), false));
 }
-exports.useDragEffect = useDragEffect;
 //# sourceMappingURL=useDragEffect.js.map

package/hooks/useDragEffect.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDragEffect.js","sourceRoot":"/","sources":["hooks/useDragEffect.ts"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useRef, type DependencyList, type RefObject } from 'react'\nimport { Point } from 'spase'\n\ntype Options = {\n  /**\n   * Specifies whether this effect is enabled.\n   */\n  isEnabled?: boolean\n\n  /**\n   * Specifies whether the cursor icon should update.\n   */\n  updatesCursor?: boolean\n\n  /**\n   * Handler invoked when dragging starts.\n   *\n   * @param startPosition The element that was dragged.\n   */\n  onDragStart?: (startPosition: Point) => void\n\n  /**\n   * Handler invoked when dragging.\n   *\n   * @param displacement The displacement (in pixels) since the last emitted\n   *                     drag move event.\n   * @param startPosition The position (in pixels) where the drag started.\n   */\n  onDragMove?: (displacement: Point, startPosition: Point) => void\n\n  /**\n   * Handler invoked when dragging ends.\n   *\n   * @param endPosition The position (in pixels) where the drag ended.\n   * @param displacement The displacement (in pixels) since the last emitted\n   *                     drag move event.\n   * @param startPosition The position (in pixels) where the drag started.\n   */\n  onDragEnd?: (displacement: Point, startPosition: Point, endPosition: Point) => void\n}\n\n/**\n * Hook for adding effectful dragging interaction to an element.\n *\n * @param targetRef The reference to the target element to add drag interaction\n *                  to.\n * @param options Additional options which include options for\n *                `module:interactjs.draggable`.\n * @param deps Dependencies that trigger this effect.\n *\n * @returns The states created for this effect.\n */\nexport function useDragEffect(targetRef: RefObject<HTMLElement>, {\n  isEnabled = true,\n  updatesCursor = true,\n  onDragStart,\n  onDragMove,\n  onDragEnd,\n}: Options, deps: DependencyList = []) {\n  const element = targetRef.current\n  const startPositionRef = useRef<Point>()\n  const dragPositionRef = useRef<Point>()\n\n  if (updatesCursor && element) element.style.cursor = 'grab'\n\n  useEffect(() => {\n    if (!element || !isEnabled) return\n\n    const mouseDownHandler = (event: MouseEvent) => {\n      event.preventDefault()\n\n      const position = new Point([event.clientX, event.clientY])\n\n      startPositionRef.current = position\n      dragPositionRef.current = position\n\n      element.addEventListener('mousemove', mouseMoveHandler)\n      element.addEventListener('mouseup', mouseUpHandler, { capture: true })\n      element.addEventListener('mouseleave', mouseUpHandler)\n\n      if (updatesCursor) element.style.cursor = 'grabbing'\n\n      onDragStart?.(position)\n    }\n\n    const mouseMoveHandler = (event: MouseEvent) => {\n      if (!startPositionRef.current) return\n\n      const position = new Point([event.clientX, event.clientY])\n      const displacement = (dragPositionRef.current ?? startPositionRef.current).subtract(position)\n\n      dragPositionRef.current = position\n\n      onDragMove?.(displacement, startPositionRef.current)\n    }\n\n    const mouseUpHandler = (event: MouseEvent) => {\n      if (!startPositionRef.current) return\n\n      const position = new Point([event.clientX, event.clientY])\n      const displacement = (dragPositionRef.current ?? startPositionRef.current).subtract(position)\n\n      onDragEnd?.(position, displacement, startPositionRef.current)\n\n      startPositionRef.current = undefined\n      dragPositionRef.current = undefined\n\n      element.removeEventListener('mousemove', mouseMoveHandler)\n      element.removeEventListener('mouseup', mouseUpHandler, { capture: true })\n      element.removeEventListener('mouseleave', mouseUpHandler)\n\n      if (updatesCursor) element.style.cursor = 'grab'\n    }\n\n    element.addEventListener('mousedown', mouseDownHandler)\n\n    return () => {\n      element.removeEventListener('mousedown', mouseDownHandler)\n      element.removeEventListener('mousemove', mouseMoveHandler)\n      element.removeEventListener('mouseup', mouseUpHandler, { capture: true })\n      element.removeEventListener('mouseleave', mouseUpHandler)\n    }\n  }, [element, isEnabled, ...deps])\n}\n"]}
+{"version":3,"file":"useDragEffect.js","sourceRoot":"/","sources":["hooks/useDragEffect.ts"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useRef, type DependencyList, type RefObject } from 'react'\nimport { Point } from 'spase'\n\ntype Options = {\n  /**\n   * Specifies whether this effect is enabled.\n   */\n  isEnabled?: boolean\n\n  /**\n   * Specifies whether the cursor icon should update.\n   */\n  updatesCursor?: boolean\n\n  /**\n   * Handler invoked when dragging starts.\n   *\n   * @param startPosition The element that was dragged.\n   */\n  onDragStart?: (startPosition: Point) => void\n\n  /**\n   * Handler invoked when dragging.\n   *\n   * @param displacement The displacement (in pixels) since the last emitted\n   *                     drag move event.\n   * @param startPosition The position (in pixels) where the drag started.\n   */\n  onDragMove?: (displacement: Point, startPosition: Point) => void\n\n  /**\n   * Handler invoked when dragging ends.\n   *\n   * @param endPosition The position (in pixels) where the drag ended.\n   * @param displacement The displacement (in pixels) since the last emitted\n   *                     drag move event.\n   * @param startPosition The position (in pixels) where the drag started.\n   */\n  onDragEnd?: (displacement: Point, startPosition: Point, endPosition: Point) => void\n}\n\n/**\n * Hook for adding effectful dragging interaction to an element.\n *\n * @param targetRef The reference to the target element to add drag interaction\n *                  to.\n * @param options Additional options which include options for\n *                `module:interactjs.draggable`.\n * @param deps Dependencies that trigger this effect.\n *\n * @returns The states created for this effect.\n */\nexport function useDragEffect(targetRef: RefObject<HTMLElement>, {\n  isEnabled = true,\n  updatesCursor = true,\n  onDragStart,\n  onDragMove,\n  onDragEnd,\n}: Options, deps: DependencyList = []) {\n  const element = targetRef.current\n  const startPositionRef = useRef<Point>()\n  const dragPositionRef = useRef<Point>()\n\n  if (updatesCursor && element) element.style.cursor = 'grab'\n\n  useEffect(() => {\n    if (!element || !isEnabled) return\n\n    const mouseDownHandler = (event: MouseEvent) => {\n      event.preventDefault()\n\n      const position = new Point([event.clientX, event.clientY])\n\n      startPositionRef.current = position\n      dragPositionRef.current = position\n\n      element.addEventListener('mousemove', mouseMoveHandler)\n      element.addEventListener('mouseup', mouseUpHandler, { capture: true })\n      element.addEventListener('mouseleave', mouseUpHandler)\n\n      if (updatesCursor) element.style.cursor = 'grabbing'\n\n      onDragStart?.(position)\n    }\n\n    const mouseMoveHandler = (event: MouseEvent) => {\n      if (!startPositionRef.current) return\n\n      const position = new Point([event.clientX, event.clientY])\n      const displacement = (dragPositionRef.current ?? startPositionRef.current).subtract(position)\n\n      dragPositionRef.current = position\n\n      onDragMove?.(displacement, startPositionRef.current)\n    }\n\n    const mouseUpHandler = (event: MouseEvent) => {\n      if (!startPositionRef.current) return\n\n      const position = new Point([event.clientX, event.clientY])\n      const displacement = (dragPositionRef.current ?? startPositionRef.current).subtract(position)\n\n      onDragEnd?.(position, displacement, startPositionRef.current)\n\n      startPositionRef.current = undefined\n      dragPositionRef.current = undefined\n\n      element.removeEventListener('mousemove', mouseMoveHandler)\n      element.removeEventListener('mouseup', mouseUpHandler, { capture: true })\n      element.removeEventListener('mouseleave', mouseUpHandler)\n\n      if (updatesCursor) element.style.cursor = 'grab'\n    }\n\n    element.addEventListener('mousedown', mouseDownHandler)\n\n    return () => {\n      element.removeEventListener('mousedown', mouseDownHandler)\n      element.removeEventListener('mousemove', mouseMoveHandler)\n      element.removeEventListener('mouseup', mouseUpHandler, { capture: true })\n      element.removeEventListener('mouseleave', mouseUpHandler)\n    }\n  }, [element, isEnabled, ...deps])\n}\n"]}

package/hooks/useDragValueEffect.js

@@ -50,7 +50,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useDragValueEffect = void 0;
+exports.useDragValueEffect = useDragValueEffect;
 var react_1 = __importDefault(require("fast-deep-equal/react"));
 var interactjs_1 = __importDefault(require("interactjs"));
 var react_2 = require("react");
@@ -132,5 +132,4 @@ function useDragValueEffect(targetRef, _a, deps) {
         value: [value, setValue],
     };
 }
-exports.useDragValueEffect = useDragValueEffect;
 //# sourceMappingURL=useDragValueEffect.js.map

package/hooks/useDragValueEffect.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDragValueEffect.js","sourceRoot":"/","sources":["hooks/useDragValueEffect.ts"],"names":[],"mappings":"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","sourcesContent":["import isDeepEqual from 'fast-deep-equal/react'\nimport interact from 'interactjs'\nimport { useEffect, useRef, useState, type DependencyList, type Dispatch, type RefObject, type SetStateAction } from 'react'\n\ntype ReturnedStates<T> = {\n  isDragging: [boolean, Dispatch<SetStateAction<boolean>>]\n  isReleasing: [boolean, Dispatch<SetStateAction<boolean>>]\n  value: [T, Dispatch<SetStateAction<T>>]\n}\n\ntype InteractDraggableOptions = Parameters<Interact.Interactable['draggable']>[0]\n\ntype Options<T> = Omit<InteractDraggableOptions, 'onstart' | 'onmove' | 'onend'> & {\n  /**\n   * The initial associated value of this hook.\n   */\n  initialValue: T\n\n  /**\n   * A function that transforms the drag move delta values to the associated\n   * value of this hook.\n   *\n   * @param currentValue The current associated value.\n   * @param dx The displacement on the x-axis (in pixels) since the last emitted\n   *           drag move event.\n   * @param dy The displacement on the y-axis (in pixels) since the last emitted\n   *           drag move event.\n   *\n   * @returns The transformed value.\n   */\n  transform: (currentValue: T, dx: number, dy: number) => T\n\n  /**\n   * Handler invoked when dragging starts.\n   */\n  onDragStart?: () => void\n\n  /**\n   * Handler invoked when dragging.\n   *\n   * @param dx The displacement on the x-axis (in pixels) since the last emitted\n   *           drag move event.\n   * @param dy The displacement on the y-axis (in pixels) since the last emitted\n   *           drag move event.\n   */\n  onDragMove?: (dx: number, dy: number) => void\n\n  /**\n   * Handler invoked when dragging ends.\n   */\n  onDragEnd?: () => void\n}\n\n/**\n * Hook for adding effectful dragging interaction to an element.\n *\n * @param targetRef The reference to the target element to add drag interaction\n *                  to.\n * @param options Additional options which include options for\n *                `module:interactjs.draggable`.\n * @param deps Dependencies that trigger this effect.\n *\n * @returns The states created for this effect.\n */\nexport function useDragValueEffect<T = [number, number]>(targetRef: RefObject<HTMLElement>, {\n  initialValue,\n  transform,\n  onDragStart,\n  onDragMove,\n  onDragEnd,\n  ...options\n}: Options<T>, deps?: DependencyList): ReturnedStates<T> {\n  /**\n   * Sets the current associated value reference. This reference object is equal\n   * to the `value` state but differs slightly in how they are set. Because\n   * states are asynchronous by nature, this reference object is used to cache\n   * time-sensitive value changes while drag event happens.\n   *\n   * @param value The value to set the associated value to.\n   *\n   * @returns `true` if the value was set, `false` otherwise.\n   */\n  const setValueRef = (value: T): boolean => {\n    if (isDeepEqual(valueRef.current, value)) return false\n    valueRef.current = value\n\n    return true\n  }\n\n  const valueRef = useRef<T>(initialValue)\n  const [hasDragged, setHasDragged] = useState<boolean>(false)\n  const [isDragging, setIsDragging] = useState<boolean>(false)\n  const [isReleasing, setIsReleasing] = useState<boolean>(false)\n  const [value, setValue] = useState(initialValue)\n\n  useEffect(() => {\n    if (targetRef.current) {\n      // Do not consume states in these listeners as they will remain their\n      // initial values within the scope of the listeners.\n      interact(targetRef.current).draggable({\n        inertia: true,\n        ...options,\n        onstart: () => {\n          setHasDragged(true)\n          setIsDragging(true)\n          setIsReleasing(false)\n          onDragStart?.()\n        },\n        onmove: ({ dx, dy }) => {\n          const newValue = transform(valueRef.current, dx, dy)\n\n          if (setValueRef(newValue)) {\n            setValue(newValue)\n          }\n\n          setIsDragging(true)\n          setIsReleasing(false)\n          onDragMove?.(dx, dy)\n        },\n        onend: () => {\n          setIsDragging(false)\n          setIsReleasing(true)\n          onDragEnd?.()\n        },\n      })\n    }\n\n    return () => {\n      if (targetRef.current) {\n        interact(targetRef.current).unset()\n      }\n    }\n  }, [...deps ?? []])\n\n  useEffect(() => {\n    if (hasDragged) return\n    setValue(initialValue)\n  }, [initialValue])\n\n  useEffect(() => {\n    setValueRef(value)\n  }, [value])\n\n  return {\n    isDragging: [isDragging, setIsDragging],\n    isReleasing: [isReleasing, setIsReleasing],\n    value: [value, setValue],\n  }\n}\n"]}
+{"version":3,"file":"useDragValueEffect.js","sourceRoot":"/","sources":["hooks/useDragValueEffect.ts"],"names":[],"mappings":"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","sourcesContent":["import isDeepEqual from 'fast-deep-equal/react'\nimport interact from 'interactjs'\nimport { useEffect, useRef, useState, type DependencyList, type Dispatch, type RefObject, type SetStateAction } from 'react'\n\ntype ReturnedStates<T> = {\n  isDragging: [boolean, Dispatch<SetStateAction<boolean>>]\n  isReleasing: [boolean, Dispatch<SetStateAction<boolean>>]\n  value: [T, Dispatch<SetStateAction<T>>]\n}\n\ntype InteractDraggableOptions = Parameters<Interact.Interactable['draggable']>[0]\n\ntype Options<T> = Omit<InteractDraggableOptions, 'onstart' | 'onmove' | 'onend'> & {\n  /**\n   * The initial associated value of this hook.\n   */\n  initialValue: T\n\n  /**\n   * A function that transforms the drag move delta values to the associated\n   * value of this hook.\n   *\n   * @param currentValue The current associated value.\n   * @param dx The displacement on the x-axis (in pixels) since the last emitted\n   *           drag move event.\n   * @param dy The displacement on the y-axis (in pixels) since the last emitted\n   *           drag move event.\n   *\n   * @returns The transformed value.\n   */\n  transform: (currentValue: T, dx: number, dy: number) => T\n\n  /**\n   * Handler invoked when dragging starts.\n   */\n  onDragStart?: () => void\n\n  /**\n   * Handler invoked when dragging.\n   *\n   * @param dx The displacement on the x-axis (in pixels) since the last emitted\n   *           drag move event.\n   * @param dy The displacement on the y-axis (in pixels) since the last emitted\n   *           drag move event.\n   */\n  onDragMove?: (dx: number, dy: number) => void\n\n  /**\n   * Handler invoked when dragging ends.\n   */\n  onDragEnd?: () => void\n}\n\n/**\n * Hook for adding effectful dragging interaction to an element.\n *\n * @param targetRef The reference to the target element to add drag interaction\n *                  to.\n * @param options Additional options which include options for\n *                `module:interactjs.draggable`.\n * @param deps Dependencies that trigger this effect.\n *\n * @returns The states created for this effect.\n */\nexport function useDragValueEffect<T = [number, number]>(targetRef: RefObject<HTMLElement>, {\n  initialValue,\n  transform,\n  onDragStart,\n  onDragMove,\n  onDragEnd,\n  ...options\n}: Options<T>, deps?: DependencyList): ReturnedStates<T> {\n  /**\n   * Sets the current associated value reference. This reference object is equal\n   * to the `value` state but differs slightly in how they are set. Because\n   * states are asynchronous by nature, this reference object is used to cache\n   * time-sensitive value changes while drag event happens.\n   *\n   * @param value The value to set the associated value to.\n   *\n   * @returns `true` if the value was set, `false` otherwise.\n   */\n  const setValueRef = (value: T): boolean => {\n    if (isDeepEqual(valueRef.current, value)) return false\n    valueRef.current = value\n\n    return true\n  }\n\n  const valueRef = useRef<T>(initialValue)\n  const [hasDragged, setHasDragged] = useState<boolean>(false)\n  const [isDragging, setIsDragging] = useState<boolean>(false)\n  const [isReleasing, setIsReleasing] = useState<boolean>(false)\n  const [value, setValue] = useState(initialValue)\n\n  useEffect(() => {\n    if (targetRef.current) {\n      // Do not consume states in these listeners as they will remain their\n      // initial values within the scope of the listeners.\n      interact(targetRef.current).draggable({\n        inertia: true,\n        ...options,\n        onstart: () => {\n          setHasDragged(true)\n          setIsDragging(true)\n          setIsReleasing(false)\n          onDragStart?.()\n        },\n        onmove: ({ dx, dy }) => {\n          const newValue = transform(valueRef.current, dx, dy)\n\n          if (setValueRef(newValue)) {\n            setValue(newValue)\n          }\n\n          setIsDragging(true)\n          setIsReleasing(false)\n          onDragMove?.(dx, dy)\n        },\n        onend: () => {\n          setIsDragging(false)\n          setIsReleasing(true)\n          onDragEnd?.()\n        },\n      })\n    }\n\n    return () => {\n      if (targetRef.current) {\n        interact(targetRef.current).unset()\n      }\n    }\n  }, [...deps ?? []])\n\n  useEffect(() => {\n    if (hasDragged) return\n    setValue(initialValue)\n  }, [initialValue])\n\n  useEffect(() => {\n    setValueRef(value)\n  }, [value])\n\n  return {\n    isDragging: [isDragging, setIsDragging],\n    isReleasing: [isReleasing, setIsReleasing],\n    value: [value, setValue],\n  }\n}\n"]}

package/hooks/useImageSize.js

@@ -16,7 +16,7 @@ var __read = (this && this.__read) || function (o, n) {
     return ar;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useImageSize = void 0;
+exports.useImageSize = useImageSize;
 var react_1 = require("react");
 var spase_1 = require("spase");
 var useLoadImageEffect_1 = require("./useLoadImageEffect");
@@ -54,7 +54,6 @@ function useImageSize(_a, _b) {
     });
     return imageSize;
 }
-exports.useImageSize = useImageSize;
 function getSize(element) {
     if (!element)
         return undefined;

package/hooks/useImageSize.js.map

@@ -1 +1 @@
-{"version":3,"file":"useImageSize.js","sourceRoot":"/","sources":["hooks/useImageSize.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,+BAAgC;AAChC,+BAA4B;AAC5B,2DAAwH;AAYxH;;;;;;;;GAQG;AACH,SAAgB,YAAY,CAAC,EAA8B,EAAE,EAA4F;QAA1H,GAAG,SAAA,EAAE,MAAM,YAAA,EAAE,KAAK,WAAA;QAAY,qBAA0F,EAAE,KAAA,EAA1F,iCAAgC,EAAhC,yBAAyB,mBAAG,IAAI,KAAA,EAAE,WAAW,iBAAA,EAAE,cAAc,oBAAA,EAAE,WAAW,iBAAA;IACvI,IAAM,UAAU,GAAG,UAAC,OAAyB;QAC3C,IAAI,CAAC,yBAAyB;YAAE,YAAY,CAAC,SAAS,CAAC,CAAA;QAEvD,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAG,OAAO,CAAC,CAAA;IACxB,CAAC,CAAA;IAED,IAAM,kBAAkB,GAAG,UAAC,OAAyB;QACnD,YAAY,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAA;QAE9B,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAG,OAAO,CAAC,CAAA;IAC3B,CAAC,CAAA;IAED,IAAM,eAAe,GAAG,UAAC,OAAyB;QAChD,IAAI,CAAC,yBAAyB;YAAE,YAAY,CAAC,SAAS,CAAC,CAAA;QAEvD,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAG,OAAO,CAAC,CAAA;IACxB,CAAC,CAAA;IAEK,IAAA,KAAA,OAA4B,IAAA,gBAAQ,GAAoB,IAAA,EAAvD,SAAS,QAAA,EAAE,YAAY,QAAgC,CAAA;IAE9D,IAAA,uCAAkB,EAAC,EAAE,GAAG,KAAA,EAAE,MAAM,QAAA,EAAE,KAAK,OAAA,EAAE,EAAE;QACzC,WAAW,EAAE,UAAA,CAAC,IAAI,OAAA,UAAU,CAAC,CAAC,CAAC,EAAb,CAAa;QAC/B,cAAc,EAAE,UAAA,CAAC,IAAI,OAAA,kBAAkB,CAAC,CAAC,CAAC,EAArB,CAAqB;QAC1C,WAAW,EAAE,UAAA,CAAC,IAAI,OAAA,eAAe,CAAC,CAAC,CAAC,EAAlB,CAAkB;KACrC,CAAC,CAAA;IAEF,OAAO,SAAS,CAAA;AAClB,CAAC;AA5BD,oCA4BC;AAED,SAAS,OAAO,CAAC,OAA0B;IACzC,IAAI,CAAC,OAAO;QAAE,OAAO,SAAS,CAAA;IAC9B,IAAI,OAAO,OAAO,CAAC,KAAK,KAAK,QAAQ;QAAE,OAAO,SAAS,CAAA;IACvD,IAAI,OAAO,OAAO,CAAC,MAAM,KAAK,QAAQ;QAAE,OAAO,SAAS,CAAA;IAExD,OAAO,IAAI,YAAI,CAAC,CAAC,OAAO,CAAC,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC,CAAA;AAClD,CAAC","sourcesContent":["import { useState } from 'react'\nimport { Size } from 'spase'\nimport { useLoadImageEffect, type UseLoadImageEffectOptions, type UseLoadImageEffectParams } from './useLoadImageEffect'\n\ntype Params = UseLoadImageEffectParams\n\ntype Options = UseLoadImageEffectOptions & {\n  /**\n   * If `false`, the size will be reset to `undefined` when the image begins\n   * loading or when an error occurs. Defaults to `true`.\n   */\n  preservesSizeBetweenLoads?: boolean\n}\n\n/**\n * Hook for retrieving the size of an image.\n *\n * @param params See {@link Params}.\n * @param options See {@link Options}.\n *\n * @returns The actual size of the image if loading was successful, `undefined`\n *          otherwise.\n */\nexport function useImageSize({ src, srcSet, sizes }: Params, { preservesSizeBetweenLoads = true, onLoadStart, onLoadComplete, onLoadError }: Options = {}): Size | undefined {\n  const handleLoad = (element: HTMLImageElement) => {\n    if (!preservesSizeBetweenLoads) setImageSize(undefined)\n\n    onLoadStart?.(element)\n  }\n\n  const handleLoadComplete = (element: HTMLImageElement) => {\n    setImageSize(getSize(element))\n\n    onLoadComplete?.(element)\n  }\n\n  const handleLoadError = (element: HTMLImageElement) => {\n    if (!preservesSizeBetweenLoads) setImageSize(undefined)\n\n    onLoadError?.(element)\n  }\n\n  const [imageSize, setImageSize] = useState<Size | undefined>()\n\n  useLoadImageEffect({ src, srcSet, sizes }, {\n    onLoadStart: t => handleLoad(t),\n    onLoadComplete: t => handleLoadComplete(t),\n    onLoadError: t => handleLoadError(t),\n  })\n\n  return imageSize\n}\n\nfunction getSize(element?: HTMLImageElement): Size | undefined {\n  if (!element) return undefined\n  if (typeof element.width !== 'number') return undefined\n  if (typeof element.height !== 'number') return undefined\n\n  return new Size([element.width, element.height])\n}\n"]}
+{"version":3,"file":"useImageSize.js","sourceRoot":"/","sources":["hooks/useImageSize.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAuBA,oCA4BC;AAnDD,+BAAgC;AAChC,+BAA4B;AAC5B,2DAAwH;AAYxH;;;;;;;;GAQG;AACH,SAAgB,YAAY,CAAC,EAA8B,EAAE,EAA4F;QAA1H,GAAG,SAAA,EAAE,MAAM,YAAA,EAAE,KAAK,WAAA;QAAY,qBAA0F,EAAE,KAAA,EAA1F,iCAAgC,EAAhC,yBAAyB,mBAAG,IAAI,KAAA,EAAE,WAAW,iBAAA,EAAE,cAAc,oBAAA,EAAE,WAAW,iBAAA;IACvI,IAAM,UAAU,GAAG,UAAC,OAAyB;QAC3C,IAAI,CAAC,yBAAyB;YAAE,YAAY,CAAC,SAAS,CAAC,CAAA;QAEvD,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAG,OAAO,CAAC,CAAA;IACxB,CAAC,CAAA;IAED,IAAM,kBAAkB,GAAG,UAAC,OAAyB;QACnD,YAAY,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAA;QAE9B,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAG,OAAO,CAAC,CAAA;IAC3B,CAAC,CAAA;IAED,IAAM,eAAe,GAAG,UAAC,OAAyB;QAChD,IAAI,CAAC,yBAAyB;YAAE,YAAY,CAAC,SAAS,CAAC,CAAA;QAEvD,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAG,OAAO,CAAC,CAAA;IACxB,CAAC,CAAA;IAEK,IAAA,KAAA,OAA4B,IAAA,gBAAQ,GAAoB,IAAA,EAAvD,SAAS,QAAA,EAAE,YAAY,QAAgC,CAAA;IAE9D,IAAA,uCAAkB,EAAC,EAAE,GAAG,KAAA,EAAE,MAAM,QAAA,EAAE,KAAK,OAAA,EAAE,EAAE;QACzC,WAAW,EAAE,UAAA,CAAC,IAAI,OAAA,UAAU,CAAC,CAAC,CAAC,EAAb,CAAa;QAC/B,cAAc,EAAE,UAAA,CAAC,IAAI,OAAA,kBAAkB,CAAC,CAAC,CAAC,EAArB,CAAqB;QAC1C,WAAW,EAAE,UAAA,CAAC,IAAI,OAAA,eAAe,CAAC,CAAC,CAAC,EAAlB,CAAkB;KACrC,CAAC,CAAA;IAEF,OAAO,SAAS,CAAA;AAClB,CAAC;AAED,SAAS,OAAO,CAAC,OAA0B;IACzC,IAAI,CAAC,OAAO;QAAE,OAAO,SAAS,CAAA;IAC9B,IAAI,OAAO,OAAO,CAAC,KAAK,KAAK,QAAQ;QAAE,OAAO,SAAS,CAAA;IACvD,IAAI,OAAO,OAAO,CAAC,MAAM,KAAK,QAAQ;QAAE,OAAO,SAAS,CAAA;IAExD,OAAO,IAAI,YAAI,CAAC,CAAC,OAAO,CAAC,KAAK,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC,CAAA;AAClD,CAAC","sourcesContent":["import { useState } from 'react'\nimport { Size } from 'spase'\nimport { useLoadImageEffect, type UseLoadImageEffectOptions, type UseLoadImageEffectParams } from './useLoadImageEffect'\n\ntype Params = UseLoadImageEffectParams\n\ntype Options = UseLoadImageEffectOptions & {\n  /**\n   * If `false`, the size will be reset to `undefined` when the image begins\n   * loading or when an error occurs. Defaults to `true`.\n   */\n  preservesSizeBetweenLoads?: boolean\n}\n\n/**\n * Hook for retrieving the size of an image.\n *\n * @param params See {@link Params}.\n * @param options See {@link Options}.\n *\n * @returns The actual size of the image if loading was successful, `undefined`\n *          otherwise.\n */\nexport function useImageSize({ src, srcSet, sizes }: Params, { preservesSizeBetweenLoads = true, onLoadStart, onLoadComplete, onLoadError }: Options = {}): Size | undefined {\n  const handleLoad = (element: HTMLImageElement) => {\n    if (!preservesSizeBetweenLoads) setImageSize(undefined)\n\n    onLoadStart?.(element)\n  }\n\n  const handleLoadComplete = (element: HTMLImageElement) => {\n    setImageSize(getSize(element))\n\n    onLoadComplete?.(element)\n  }\n\n  const handleLoadError = (element: HTMLImageElement) => {\n    if (!preservesSizeBetweenLoads) setImageSize(undefined)\n\n    onLoadError?.(element)\n  }\n\n  const [imageSize, setImageSize] = useState<Size | undefined>()\n\n  useLoadImageEffect({ src, srcSet, sizes }, {\n    onLoadStart: t => handleLoad(t),\n    onLoadComplete: t => handleLoadComplete(t),\n    onLoadError: t => handleLoadError(t),\n  })\n\n  return imageSize\n}\n\nfunction getSize(element?: HTMLImageElement): Size | undefined {\n  if (!element) return undefined\n  if (typeof element.width !== 'number') return undefined\n  if (typeof element.height !== 'number') return undefined\n\n  return new Size([element.width, element.height])\n}\n"]}

package/hooks/useInterval.js

@@ -25,7 +25,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useInterval = void 0;
+exports.useInterval = useInterval;
 var react_1 = require("react");
 /**
  * Hoook for invoking a method repeatedly on every set interval.
@@ -52,5 +52,4 @@ function useInterval(handler, interval, _a, deps) {
         return function () { return clearInterval(timer); };
     }, __spreadArray([interval], __read(deps), false));
 }
-exports.useInterval = useInterval;
 //# sourceMappingURL=useInterval.js.map

package/hooks/useInterval.js.map

@@ -1 +1 @@
-{"version":3,"file":"useInterval.js","sourceRoot":"/","sources":["hooks/useInterval.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+BAA8D;AAU9D;;;;;;;GAOG;AACH,SAAgB,WAAW,CAAC,OAAmB,EAAE,QAAiB,EAAE,EAA+C,EAAE,IAAyB;QAA1E,qBAA6C,EAAE,KAAA,EAA7C,6BAA6B,EAA7B,qBAAqB,mBAAG,KAAK,KAAA;IAAkB,qBAAA,EAAA,SAAyB;IAC5I,IAAM,UAAU,GAAG,IAAA,cAAM,GAAgB,CAAA;IAEzC,IAAA,iBAAS,EAAC;QACR,UAAU,CAAC,OAAO,GAAG,OAAO,CAAA;IAC9B,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAA;IAEb,IAAA,iBAAS,EAAC;;QACR,IAAI,QAAQ,KAAK,SAAS,IAAI,QAAQ,IAAI,CAAC;YAAE,OAAM;QAEnD,IAAI,qBAAqB,KAAK,IAAI;YAAE,MAAA,UAAU,CAAC,OAAO,0DAAI,CAAA;QAC1D,IAAM,KAAK,GAAG,MAAM,CAAC,WAAW,CAAC,sBAAM,OAAA,MAAA,UAAU,CAAC,OAAO,0DAAI,CAAA,EAAA,EAAE,QAAQ,CAAC,CAAA;QAExE,OAAO,cAAM,OAAA,aAAa,CAAC,KAAK,CAAC,EAApB,CAAoB,CAAA;IACnC,CAAC,iBAAG,QAAQ,UAAK,IAAI,UAAE,CAAA;AACzB,CAAC;AAfD,kCAeC","sourcesContent":["import { useEffect, useRef, type DependencyList } from 'react'\n\ntype Options = {\n  /**\n   * Specifies if the handler should be invoked initially (as opposed to waiting\n   * for the specified interval for the initial invocation).\n   */\n  shouldInvokeInitially?: boolean\n}\n\n/**\n * Hoook for invoking a method repeatedly on every set interval.\n *\n * @param handler The method to invoke on every interval.\n * @param interval Time (in milliseconds) between each invocation.\n * @param options See {@link Options}.\n * @param deps Dependencies that trigger this effect.\n */\nexport function useInterval(handler: () => void, interval?: number, { shouldInvokeInitially = false }: Options = {}, deps: DependencyList = []) {\n  const handlerRef = useRef<(() => void)>()\n\n  useEffect(() => {\n    handlerRef.current = handler\n  }, [handler])\n\n  useEffect(() => {\n    if (interval === undefined || interval <= 0) return\n\n    if (shouldInvokeInitially === true) handlerRef.current?.()\n    const timer = window.setInterval(() => handlerRef.current?.(), interval)\n\n    return () => clearInterval(timer)\n  }, [interval, ...deps])\n}\n"]}
+{"version":3,"file":"useInterval.js","sourceRoot":"/","sources":["hooks/useInterval.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,kCAeC;AAjCD,+BAA8D;AAU9D;;;;;;;GAOG;AACH,SAAgB,WAAW,CAAC,OAAmB,EAAE,QAAiB,EAAE,EAA+C,EAAE,IAAyB;QAA1E,qBAA6C,EAAE,KAAA,EAA7C,6BAA6B,EAA7B,qBAAqB,mBAAG,KAAK,KAAA;IAAkB,qBAAA,EAAA,SAAyB;IAC5I,IAAM,UAAU,GAAG,IAAA,cAAM,GAAgB,CAAA;IAEzC,IAAA,iBAAS,EAAC;QACR,UAAU,CAAC,OAAO,GAAG,OAAO,CAAA;IAC9B,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAA;IAEb,IAAA,iBAAS,EAAC;;QACR,IAAI,QAAQ,KAAK,SAAS,IAAI,QAAQ,IAAI,CAAC;YAAE,OAAM;QAEnD,IAAI,qBAAqB,KAAK,IAAI;YAAE,MAAA,UAAU,CAAC,OAAO,0DAAI,CAAA;QAC1D,IAAM,KAAK,GAAG,MAAM,CAAC,WAAW,CAAC,sBAAM,OAAA,MAAA,UAAU,CAAC,OAAO,0DAAI,CAAA,EAAA,EAAE,QAAQ,CAAC,CAAA;QAExE,OAAO,cAAM,OAAA,aAAa,CAAC,KAAK,CAAC,EAApB,CAAoB,CAAA;IACnC,CAAC,iBAAG,QAAQ,UAAK,IAAI,UAAE,CAAA;AACzB,CAAC","sourcesContent":["import { useEffect, useRef, type DependencyList } from 'react'\n\ntype Options = {\n  /**\n   * Specifies if the handler should be invoked initially (as opposed to waiting\n   * for the specified interval for the initial invocation).\n   */\n  shouldInvokeInitially?: boolean\n}\n\n/**\n * Hoook for invoking a method repeatedly on every set interval.\n *\n * @param handler The method to invoke on every interval.\n * @param interval Time (in milliseconds) between each invocation.\n * @param options See {@link Options}.\n * @param deps Dependencies that trigger this effect.\n */\nexport function useInterval(handler: () => void, interval?: number, { shouldInvokeInitially = false }: Options = {}, deps: DependencyList = []) {\n  const handlerRef = useRef<(() => void)>()\n\n  useEffect(() => {\n    handlerRef.current = handler\n  }, [handler])\n\n  useEffect(() => {\n    if (interval === undefined || interval <= 0) return\n\n    if (shouldInvokeInitially === true) handlerRef.current?.()\n    const timer = window.setInterval(() => handlerRef.current?.(), interval)\n\n    return () => clearInterval(timer)\n  }, [interval, ...deps])\n}\n"]}

package/hooks/useLoadImageEffect.js

@@ -25,7 +25,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useLoadImageEffect = void 0;
+exports.useLoadImageEffect = useLoadImageEffect;
 var react_1 = require("react");
 /**
  * Hook for preloading an image.
@@ -66,5 +66,4 @@ function useLoadImageEffect(_a, _b, deps) {
         };
     }, __spreadArray([src, srcSet, sizes], __read(deps), false));
 }
-exports.useLoadImageEffect = useLoadImageEffect;
 //# sourceMappingURL=useLoadImageEffect.js.map

package/hooks/useLoadImageEffect.js.map

@@ -1 +1 @@
-{"version":3,"file":"useLoadImageEffect.js","sourceRoot":"/","sources":["hooks/useLoadImageEffect.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+BAA8D;AA0C9D;;;;;;GAMG;AACH,SAAgB,kBAAkB,CAAC,EAAgD,EAAE,EAA4E,EAAE,IAAyB;QAAvJ,GAAG,SAAA,EAAE,MAAM,YAAA,EAAE,KAAK,WAAA;QAA8B,qBAA0E,EAAE,KAAA,EAA1E,WAAW,iBAAA,EAAE,cAAc,oBAAA,EAAE,WAAW,iBAAA;IAAoC,qBAAA,EAAA,SAAyB;IAC1L,IAAM,wBAAwB,GAAG,UAAC,KAAY;QAC5C,IAAM,OAAO,GAAG,KAAK,CAAC,aAAiC,CAAA;QAEvD,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAG,OAAO,CAAC,CAAA;IAC3B,CAAC,CAAA;IAED,IAAM,qBAAqB,GAAG,UAAC,KAAY;QACzC,IAAM,OAAO,GAAG,KAAK,CAAC,aAAiC,CAAA;QAEvD,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAG,OAAO,CAAC,CAAA;IACxB,CAAC,CAAA;IAED,IAAM,QAAQ,GAAG,IAAA,cAAM,EAA+B,SAAS,CAAC,CAAA;IAEhE,IAAA,iBAAS,EAAC;QACR,QAAQ,CAAC,OAAO,GAAG,IAAI,KAAK,EAAE,CAAA;QAC9B,IAAI,GAAG;YAAE,QAAQ,CAAC,OAAO,CAAC,GAAG,GAAG,GAAG,CAAA;QACnC,IAAI,MAAM;YAAE,QAAQ,CAAC,OAAO,CAAC,MAAM,GAAG,MAAM,CAAA;QAC5C,IAAI,KAAK;YAAE,QAAQ,CAAC,OAAO,CAAC,KAAK,GAAG,KAAK,CAAA;QAEzC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAG,QAAQ,CAAC,OAAO,CAAC,CAAA;QAE/B,QAAQ,CAAC,OAAO,CAAC,gBAAgB,CAAC,MAAM,EAAE,wBAAwB,CAAC,CAAA;QACnE,QAAQ,CAAC,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,qBAAqB,CAAC,CAAA;QAEjE,OAAO;;YACL,MAAA,QAAQ,CAAC,OAAO,0CAAE,mBAAmB,CAAC,MAAM,EAAE,wBAAwB,CAAC,CAAA;YACvE,MAAA,QAAQ,CAAC,OAAO,0CAAE,mBAAmB,CAAC,OAAO,EAAE,qBAAqB,CAAC,CAAA;YACrE,QAAQ,CAAC,OAAO,GAAG,SAAS,CAAA;QAC9B,CAAC,CAAA;IACH,CAAC,iBAAG,GAAG,EAAE,MAAM,EAAE,KAAK,UAAK,IAAI,UAAE,CAAA;AACnC,CAAC;AAhCD,gDAgCC","sourcesContent":["import { useEffect, useRef, type DependencyList } from 'react'\n\nexport type UseLoadImageEffectParams = {\n  /**\n   * `src` attribute of the image.\n   */\n  src?: string\n\n  /**\n   * `srcset` attribute of the image.\n   */\n  srcSet?: string\n\n  /**\n   * `sizes` attribute of the image.\n   */\n  sizes?: string\n}\n\nexport type UseLoadImageEffectOptions = {\n  /**\n   * Handler invoked when the image starts loading.\n   *\n   * @param element The target image element.\n   */\n  onLoadStart?: (element: HTMLImageElement) => void\n\n  /**\n   * Handler invoked when the image is done loading.\n   *\n   * @param element The target image element.\n   */\n  onLoadComplete?: (element: HTMLImageElement) => void\n\n  /**\n   * Handler invoked when there is an error loading the image.\n   *\n   * @param element The target image element.\n   */\n  onLoadError?: (element: HTMLImageElement) => void\n}\n\n/**\n * Hook for preloading an image.\n *\n * @param params See {@link UseLoadImageEffectParams}.\n * @param options See {@link UseLoadImageEffectOptions}.\n * @param deps Additional dependencies.\n */\nexport function useLoadImageEffect({ src, srcSet, sizes }: UseLoadImageEffectParams, { onLoadStart, onLoadComplete, onLoadError }: UseLoadImageEffectOptions = {}, deps: DependencyList = []) {\n  const imageLoadCompleteHandler = (event: Event) => {\n    const element = event.currentTarget as HTMLImageElement\n\n    onLoadComplete?.(element)\n  }\n\n  const imageLoadErrorHandler = (event: Event) => {\n    const element = event.currentTarget as HTMLImageElement\n\n    onLoadError?.(element)\n  }\n\n  const imageRef = useRef<HTMLImageElement | undefined>(undefined)\n\n  useEffect(() => {\n    imageRef.current = new Image()\n    if (src) imageRef.current.src = src\n    if (srcSet) imageRef.current.srcset = srcSet\n    if (sizes) imageRef.current.sizes = sizes\n\n    onLoadStart?.(imageRef.current)\n\n    imageRef.current.addEventListener('load', imageLoadCompleteHandler)\n    imageRef.current.addEventListener('error', imageLoadErrorHandler)\n\n    return () => {\n      imageRef.current?.removeEventListener('load', imageLoadCompleteHandler)\n      imageRef.current?.removeEventListener('error', imageLoadErrorHandler)\n      imageRef.current = undefined\n    }\n  }, [src, srcSet, sizes, ...deps])\n}\n"]}
+{"version":3,"file":"useLoadImageEffect.js","sourceRoot":"/","sources":["hooks/useLoadImageEffect.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAiDA,gDAgCC;AAjFD,+BAA8D;AA0C9D;;;;;;GAMG;AACH,SAAgB,kBAAkB,CAAC,EAAgD,EAAE,EAA4E,EAAE,IAAyB;QAAvJ,GAAG,SAAA,EAAE,MAAM,YAAA,EAAE,KAAK,WAAA;QAA8B,qBAA0E,EAAE,KAAA,EAA1E,WAAW,iBAAA,EAAE,cAAc,oBAAA,EAAE,WAAW,iBAAA;IAAoC,qBAAA,EAAA,SAAyB;IAC1L,IAAM,wBAAwB,GAAG,UAAC,KAAY;QAC5C,IAAM,OAAO,GAAG,KAAK,CAAC,aAAiC,CAAA;QAEvD,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAG,OAAO,CAAC,CAAA;IAC3B,CAAC,CAAA;IAED,IAAM,qBAAqB,GAAG,UAAC,KAAY;QACzC,IAAM,OAAO,GAAG,KAAK,CAAC,aAAiC,CAAA;QAEvD,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAG,OAAO,CAAC,CAAA;IACxB,CAAC,CAAA;IAED,IAAM,QAAQ,GAAG,IAAA,cAAM,EAA+B,SAAS,CAAC,CAAA;IAEhE,IAAA,iBAAS,EAAC;QACR,QAAQ,CAAC,OAAO,GAAG,IAAI,KAAK,EAAE,CAAA;QAC9B,IAAI,GAAG;YAAE,QAAQ,CAAC,OAAO,CAAC,GAAG,GAAG,GAAG,CAAA;QACnC,IAAI,MAAM;YAAE,QAAQ,CAAC,OAAO,CAAC,MAAM,GAAG,MAAM,CAAA;QAC5C,IAAI,KAAK;YAAE,QAAQ,CAAC,OAAO,CAAC,KAAK,GAAG,KAAK,CAAA;QAEzC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAG,QAAQ,CAAC,OAAO,CAAC,CAAA;QAE/B,QAAQ,CAAC,OAAO,CAAC,gBAAgB,CAAC,MAAM,EAAE,wBAAwB,CAAC,CAAA;QACnE,QAAQ,CAAC,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,qBAAqB,CAAC,CAAA;QAEjE,OAAO;;YACL,MAAA,QAAQ,CAAC,OAAO,0CAAE,mBAAmB,CAAC,MAAM,EAAE,wBAAwB,CAAC,CAAA;YACvE,MAAA,QAAQ,CAAC,OAAO,0CAAE,mBAAmB,CAAC,OAAO,EAAE,qBAAqB,CAAC,CAAA;YACrE,QAAQ,CAAC,OAAO,GAAG,SAAS,CAAA;QAC9B,CAAC,CAAA;IACH,CAAC,iBAAG,GAAG,EAAE,MAAM,EAAE,KAAK,UAAK,IAAI,UAAE,CAAA;AACnC,CAAC","sourcesContent":["import { useEffect, useRef, type DependencyList } from 'react'\n\nexport type UseLoadImageEffectParams = {\n  /**\n   * `src` attribute of the image.\n   */\n  src?: string\n\n  /**\n   * `srcset` attribute of the image.\n   */\n  srcSet?: string\n\n  /**\n   * `sizes` attribute of the image.\n   */\n  sizes?: string\n}\n\nexport type UseLoadImageEffectOptions = {\n  /**\n   * Handler invoked when the image starts loading.\n   *\n   * @param element The target image element.\n   */\n  onLoadStart?: (element: HTMLImageElement) => void\n\n  /**\n   * Handler invoked when the image is done loading.\n   *\n   * @param element The target image element.\n   */\n  onLoadComplete?: (element: HTMLImageElement) => void\n\n  /**\n   * Handler invoked when there is an error loading the image.\n   *\n   * @param element The target image element.\n   */\n  onLoadError?: (element: HTMLImageElement) => void\n}\n\n/**\n * Hook for preloading an image.\n *\n * @param params See {@link UseLoadImageEffectParams}.\n * @param options See {@link UseLoadImageEffectOptions}.\n * @param deps Additional dependencies.\n */\nexport function useLoadImageEffect({ src, srcSet, sizes }: UseLoadImageEffectParams, { onLoadStart, onLoadComplete, onLoadError }: UseLoadImageEffectOptions = {}, deps: DependencyList = []) {\n  const imageLoadCompleteHandler = (event: Event) => {\n    const element = event.currentTarget as HTMLImageElement\n\n    onLoadComplete?.(element)\n  }\n\n  const imageLoadErrorHandler = (event: Event) => {\n    const element = event.currentTarget as HTMLImageElement\n\n    onLoadError?.(element)\n  }\n\n  const imageRef = useRef<HTMLImageElement | undefined>(undefined)\n\n  useEffect(() => {\n    imageRef.current = new Image()\n    if (src) imageRef.current.src = src\n    if (srcSet) imageRef.current.srcset = srcSet\n    if (sizes) imageRef.current.sizes = sizes\n\n    onLoadStart?.(imageRef.current)\n\n    imageRef.current.addEventListener('load', imageLoadCompleteHandler)\n    imageRef.current.addEventListener('error', imageLoadErrorHandler)\n\n    return () => {\n      imageRef.current?.removeEventListener('load', imageLoadCompleteHandler)\n      imageRef.current?.removeEventListener('error', imageLoadErrorHandler)\n      imageRef.current = undefined\n    }\n  }, [src, srcSet, sizes, ...deps])\n}\n"]}

package/hooks/useLoadVideoMetadataEffect.js

@@ -25,7 +25,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useLoadVideoMetadataEffect = void 0;
+exports.useLoadVideoMetadataEffect = useLoadVideoMetadataEffect;
 var react_1 = require("react");
 /**
  * Hook for retrieving the size of a video.
@@ -62,5 +62,4 @@ function useLoadVideoMetadataEffect(_a, _b, deps) {
         };
     }, __spreadArray([src], __read(deps), false));
 }
-exports.useLoadVideoMetadataEffect = useLoadVideoMetadataEffect;
 //# sourceMappingURL=useLoadVideoMetadataEffect.js.map

package/hooks/useLoadVideoMetadataEffect.js.map

@@ -1 +1 @@
-{"version":3,"file":"useLoadVideoMetadataEffect.js","sourceRoot":"/","sources":["hooks/useLoadVideoMetadataEffect.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+BAA8D;AAgC9D;;;;;;GAMG;AACH,SAAgB,0BAA0B,CAAC,EAAyC,EAAE,EAAoF,EAAE,IAAyB;QAAxJ,GAAG,SAAA;QAAsC,qBAAkF,EAAE,KAAA,EAAlF,WAAW,iBAAA,EAAE,cAAc,oBAAA,EAAE,WAAW,iBAAA;IAA4C,qBAAA,EAAA,SAAyB;IACnM,IAAM,mBAAmB,GAAG,UAAC,KAAY;QACvC,IAAM,OAAO,GAAG,KAAK,CAAC,aAAiC,CAAA;QAEvD,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAG,OAAO,CAAC,CAAA;IAC3B,CAAC,CAAA;IAED,IAAM,gBAAgB,GAAG,UAAC,KAAY;QACpC,IAAM,OAAO,GAAG,KAAK,CAAC,aAAiC,CAAA;QAEvD,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAG,OAAO,CAAC,CAAA;IACxB,CAAC,CAAA;IAED,IAAM,GAAG,GAAG,IAAA,cAAM,EAA+B,SAAS,CAAC,CAAA;IAE3D,IAAA,iBAAS,EAAC;QACR,GAAG,CAAC,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAA;QAC7C,IAAI,GAAG;YAAE,GAAG,CAAC,OAAO,CAAC,GAAG,GAAG,GAAG,CAAA;QAC9B,GAAG,CAAC,OAAO,CAAC,gBAAgB,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,CAAA;QACnE,GAAG,CAAC,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,gBAAgB,CAAC,CAAA;QAEvD,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAG,GAAG,CAAC,OAAO,CAAC,CAAA;QAE1B,OAAO;;YACL,MAAA,GAAG,CAAC,OAAO,0CAAE,mBAAmB,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,CAAA;YACvE,MAAA,GAAG,CAAC,OAAO,0CAAE,mBAAmB,CAAC,OAAO,EAAE,gBAAgB,CAAC,CAAA;YAC3D,GAAG,CAAC,OAAO,GAAG,SAAS,CAAA;QACzB,CAAC,CAAA;IACH,CAAC,iBAAG,GAAG,UAAK,IAAI,UAAE,CAAA;AACpB,CAAC;AA7BD,gEA6BC","sourcesContent":["import { useEffect, useRef, type DependencyList } from 'react'\n\nexport type UseLoadVideoMetadataEffectParams = {\n  /**\n   * `src` attribute of the video.\n   */\n  src?: string\n}\n\nexport type UseLoadVideoMetadataEffectOptions = {\n  /**\n   * Handler invoked when the video metadata starts loading.\n   *\n   * @param element The target video element.\n   */\n  onLoadStart?: (element: HTMLVideoElement) => void\n\n  /**\n   * Handler invoked when the video is done loading its metadata.\n   *\n   * @param element The target video element.\n   */\n  onLoadComplete?: (element: HTMLVideoElement) => void\n\n  /**\n   * Handler invoked when there is an error loading the video metadata.\n   *\n   * @param element The target video element.\n   */\n  onLoadError?: (element: HTMLVideoElement) => void\n}\n\n/**\n * Hook for retrieving the size of a video.\n *\n * @param params See {@link UseLoadVideoMetadataEffectParams}.\n * @param options See {@link UseLoadVideoMetadataEffectOptions}.\n * @param deps Additional dependencies.\n */\nexport function useLoadVideoMetadataEffect({ src }: UseLoadVideoMetadataEffectParams, { onLoadStart, onLoadComplete, onLoadError }: UseLoadVideoMetadataEffectOptions = {}, deps: DependencyList = []) {\n  const loadCompleteHandler = (event: Event) => {\n    const element = event.currentTarget as HTMLVideoElement\n\n    onLoadComplete?.(element)\n  }\n\n  const loadErrorHandler = (event: Event) => {\n    const element = event.currentTarget as HTMLVideoElement\n\n    onLoadError?.(element)\n  }\n\n  const ref = useRef<HTMLVideoElement | undefined>(undefined)\n\n  useEffect(() => {\n    ref.current = document.createElement('video')\n    if (src) ref.current.src = src\n    ref.current.addEventListener('loadedmetadata', loadCompleteHandler)\n    ref.current.addEventListener('error', loadErrorHandler)\n\n    onLoadStart?.(ref.current)\n\n    return () => {\n      ref.current?.removeEventListener('loadedmetadata', loadCompleteHandler)\n      ref.current?.removeEventListener('error', loadErrorHandler)\n      ref.current = undefined\n    }\n  }, [src, ...deps])\n}\n"]}
+{"version":3,"file":"useLoadVideoMetadataEffect.js","sourceRoot":"/","sources":["hooks/useLoadVideoMetadataEffect.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAuCA,gEA6BC;AApED,+BAA8D;AAgC9D;;;;;;GAMG;AACH,SAAgB,0BAA0B,CAAC,EAAyC,EAAE,EAAoF,EAAE,IAAyB;QAAxJ,GAAG,SAAA;QAAsC,qBAAkF,EAAE,KAAA,EAAlF,WAAW,iBAAA,EAAE,cAAc,oBAAA,EAAE,WAAW,iBAAA;IAA4C,qBAAA,EAAA,SAAyB;IACnM,IAAM,mBAAmB,GAAG,UAAC,KAAY;QACvC,IAAM,OAAO,GAAG,KAAK,CAAC,aAAiC,CAAA;QAEvD,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAG,OAAO,CAAC,CAAA;IAC3B,CAAC,CAAA;IAED,IAAM,gBAAgB,GAAG,UAAC,KAAY;QACpC,IAAM,OAAO,GAAG,KAAK,CAAC,aAAiC,CAAA;QAEvD,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAG,OAAO,CAAC,CAAA;IACxB,CAAC,CAAA;IAED,IAAM,GAAG,GAAG,IAAA,cAAM,EAA+B,SAAS,CAAC,CAAA;IAE3D,IAAA,iBAAS,EAAC;QACR,GAAG,CAAC,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAA;QAC7C,IAAI,GAAG;YAAE,GAAG,CAAC,OAAO,CAAC,GAAG,GAAG,GAAG,CAAA;QAC9B,GAAG,CAAC,OAAO,CAAC,gBAAgB,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,CAAA;QACnE,GAAG,CAAC,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,gBAAgB,CAAC,CAAA;QAEvD,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAG,GAAG,CAAC,OAAO,CAAC,CAAA;QAE1B,OAAO;;YACL,MAAA,GAAG,CAAC,OAAO,0CAAE,mBAAmB,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,CAAA;YACvE,MAAA,GAAG,CAAC,OAAO,0CAAE,mBAAmB,CAAC,OAAO,EAAE,gBAAgB,CAAC,CAAA;YAC3D,GAAG,CAAC,OAAO,GAAG,SAAS,CAAA;QACzB,CAAC,CAAA;IACH,CAAC,iBAAG,GAAG,UAAK,IAAI,UAAE,CAAA;AACpB,CAAC","sourcesContent":["import { useEffect, useRef, type DependencyList } from 'react'\n\nexport type UseLoadVideoMetadataEffectParams = {\n  /**\n   * `src` attribute of the video.\n   */\n  src?: string\n}\n\nexport type UseLoadVideoMetadataEffectOptions = {\n  /**\n   * Handler invoked when the video metadata starts loading.\n   *\n   * @param element The target video element.\n   */\n  onLoadStart?: (element: HTMLVideoElement) => void\n\n  /**\n   * Handler invoked when the video is done loading its metadata.\n   *\n   * @param element The target video element.\n   */\n  onLoadComplete?: (element: HTMLVideoElement) => void\n\n  /**\n   * Handler invoked when there is an error loading the video metadata.\n   *\n   * @param element The target video element.\n   */\n  onLoadError?: (element: HTMLVideoElement) => void\n}\n\n/**\n * Hook for retrieving the size of a video.\n *\n * @param params See {@link UseLoadVideoMetadataEffectParams}.\n * @param options See {@link UseLoadVideoMetadataEffectOptions}.\n * @param deps Additional dependencies.\n */\nexport function useLoadVideoMetadataEffect({ src }: UseLoadVideoMetadataEffectParams, { onLoadStart, onLoadComplete, onLoadError }: UseLoadVideoMetadataEffectOptions = {}, deps: DependencyList = []) {\n  const loadCompleteHandler = (event: Event) => {\n    const element = event.currentTarget as HTMLVideoElement\n\n    onLoadComplete?.(element)\n  }\n\n  const loadErrorHandler = (event: Event) => {\n    const element = event.currentTarget as HTMLVideoElement\n\n    onLoadError?.(element)\n  }\n\n  const ref = useRef<HTMLVideoElement | undefined>(undefined)\n\n  useEffect(() => {\n    ref.current = document.createElement('video')\n    if (src) ref.current.src = src\n    ref.current.addEventListener('loadedmetadata', loadCompleteHandler)\n    ref.current.addEventListener('error', loadErrorHandler)\n\n    onLoadStart?.(ref.current)\n\n    return () => {\n      ref.current?.removeEventListener('loadedmetadata', loadCompleteHandler)\n      ref.current?.removeEventListener('error', loadErrorHandler)\n      ref.current = undefined\n    }\n  }, [src, ...deps])\n}\n"]}

package/hooks/useMounted.js

@@ -16,7 +16,7 @@ var __read = (this && this.__read) || function (o, n) {
     return ar;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useMounted = void 0;
+exports.useMounted = useMounted;
 var react_1 = require("react");
 function useMounted() {
     var _a = __read((0, react_1.useState)(false), 2), isMounted = _a[0], setIsMounted = _a[1];
@@ -28,5 +28,4 @@ function useMounted() {
     }, []);
     return isMounted;
 }
-exports.useMounted = useMounted;
 //# sourceMappingURL=useMounted.js.map

package/hooks/useMounted.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMounted.js","sourceRoot":"/","sources":["hooks/useMounted.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAAA,+BAA2C;AAE3C,SAAgB,UAAU;IAClB,IAAA,KAAA,OAA4B,IAAA,gBAAQ,EAAC,KAAK,CAAC,IAAA,EAA1C,SAAS,QAAA,EAAE,YAAY,QAAmB,CAAA;IAEjD,IAAA,iBAAS,EAAC;QACR,YAAY,CAAC,IAAI,CAAC,CAAA;QAElB,OAAO;YACL,YAAY,CAAC,KAAK,CAAC,CAAA;QACrB,CAAC,CAAA;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,OAAO,SAAS,CAAA;AAClB,CAAC;AAZD,gCAYC","sourcesContent":["import { useEffect, useState } from 'react'\n\nexport function useMounted() {\n  const [isMounted, setIsMounted] = useState(false)\n\n  useEffect(() => {\n    setIsMounted(true)\n\n    return () => {\n      setIsMounted(false)\n    }\n  }, [])\n\n  return isMounted\n}\n"]}
+{"version":3,"file":"useMounted.js","sourceRoot":"/","sources":["hooks/useMounted.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAEA,gCAYC;AAdD,+BAA2C;AAE3C,SAAgB,UAAU;IAClB,IAAA,KAAA,OAA4B,IAAA,gBAAQ,EAAC,KAAK,CAAC,IAAA,EAA1C,SAAS,QAAA,EAAE,YAAY,QAAmB,CAAA;IAEjD,IAAA,iBAAS,EAAC;QACR,YAAY,CAAC,IAAI,CAAC,CAAA;QAElB,OAAO;YACL,YAAY,CAAC,KAAK,CAAC,CAAA;QACrB,CAAC,CAAA;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,OAAO,SAAS,CAAA;AAClB,CAAC","sourcesContent":["import { useEffect, useState } from 'react'\n\nexport function useMounted() {\n  const [isMounted, setIsMounted] = useState(false)\n\n  useEffect(() => {\n    setIsMounted(true)\n\n    return () => {\n      setIsMounted(false)\n    }\n  }, [])\n\n  return isMounted\n}\n"]}

package/hooks/usePrevious.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.usePrevious = void 0;
+exports.usePrevious = usePrevious;
 var react_1 = require("react");
 /**
  * Returns the previous value of a value.
@@ -16,5 +16,4 @@ function usePrevious(value, _a) {
     }, [sanitizeDependency(value)]);
     return ref.current;
 }
-exports.usePrevious = usePrevious;
 //# sourceMappingURL=usePrevious.js.map