@jinmi/ui 0.0.0-stage → 6.0.1

package/es/HtmlPreview/type.d.mts

@@ -0,0 +1,114 @@
+import { DivProps } from "../types/index.mjs";
+import { ActionIconProps } from "../base-ui/ActionIcon/type.mjs";
+import "../base-ui/ActionIcon/index.mjs";
+import { CSSProperties, ReactNode, Ref } from "react";
+//#region src/HtmlPreview/type.d.ts
+type HtmlPreviewMode = 'preview' | 'source';
+/**
+ * How to handle the preview while content is still streaming (`animated`):
+ *
+ * - `'defer'` — keep the iframe unmounted until the content stabilizes
+ *   (`</html>` arrives or `animated` flips to false). Safest for
+ *   script-heavy demos (p5.js, three.js) where `setup()` must run exactly
+ *   once.
+ * - `'live'` — mount the iframe immediately and update `srcDoc` as tokens
+ *   arrive. Feels responsive for pure-markup content but reboots scripts
+ *   on every chunk.
+ * - `'auto'` (default) — `defer` if a `<script>` tag is present, otherwise
+ *   `live`.
+ */
+type HtmlPreviewStreamingMode = 'defer' | 'live' | 'auto';
+interface HtmlPreviewIframeProps {
+  /**
+   * When `true` the iframe stays mounted as a "shell" and content arrives
+   * via postMessage + DOM morph — used during streaming so we can fade
+   * new nodes in without reloading. When `false` the iframe loads the
+   * user's HTML directly as `srcDoc`, which lets the browser's native
+   * HTML pipeline handle `<script src>` tags (Tailwind / Chart.js /
+   * p5.js style CDN integrations work the way they would on a normal
+   * page).
+   */
+  animated?: boolean;
+  background?: string;
+  className?: string;
+  content: string;
+  defaultHeight?: number;
+  ref?: Ref<HTMLIFrameElement>;
+  sandbox?: string;
+  style?: CSSProperties;
+  title?: string;
+}
+interface HtmlPreviewProps extends Omit<DivProps, 'onCopy'> {
+  actionIconSize?: ActionIconProps['size'];
+  actionsRender?: (props: {
+    actionIconSize: ActionIconProps['size'];
+    content: string;
+    getContent: () => string;
+    mode: HtmlPreviewMode;
+    originalNode: ReactNode;
+    setMode: (mode: HtmlPreviewMode) => void;
+  }) => ReactNode;
+  /**
+   * When `true`, the component treats the content as a still-streaming document
+   * and only renders the source view. The iframe mounts once streaming ends
+   * (either `animated` flips to `false` or `</html>` appears in the content).
+   *
+   * This avoids re-booting iframes (and the scripts inside them) on every
+   * token.
+   */
+  animated?: boolean;
+  bodyRender?: (props: {
+    content: string;
+    mode: HtmlPreviewMode;
+    originalNode: ReactNode;
+  }) => ReactNode;
+  children: string;
+  classNames?: {
+    content?: string;
+    header?: string;
+    iframe?: string;
+  };
+  copyable?: boolean;
+  /**
+   * Accepted for API compatibility with the rest of the Pre family. Has no
+   * effect — the body is always rendered.
+   */
+  defaultExpand?: boolean;
+  defaultHeight?: number;
+  defaultMode?: HtmlPreviewMode;
+  downloadable?: boolean;
+  fileName?: string;
+  /**
+   * Accepted for API compatibility with the rest of the Pre family. The
+   * toolbar is always inline, so this flag is a no-op.
+   */
+  fullFeatured?: boolean;
+  language?: string;
+  /**
+   * Fires when the user clicks the expand button. Receives the full HTML.
+   * Hosts typically open a portal/drawer/modal here.
+   */
+  onExpand?: (content: string) => void;
+  /**
+   * Override the iframe's `sandbox` attribute. **Strongly discouraged** —
+   * the default omits `allow-same-origin` and other privileges on purpose
+   * (see `const.ts` for rationale). If you override it, you take
+   * responsibility for the security boundary.
+   */
+  sandbox?: string;
+  shadow?: boolean;
+  /** Accepted for API compatibility — the inline toolbar has no language tag. */
+  showLanguage?: boolean;
+  /** @see {@link HtmlPreviewStreamingMode} */
+  streamingMode?: HtmlPreviewStreamingMode;
+  styles?: {
+    content?: CSSProperties;
+    header?: CSSProperties;
+    iframe?: CSSProperties;
+  };
+  theme?: 'light' | 'dark';
+  variant?: 'filled' | 'outlined' | 'borderless';
+}
+//#endregion
+export { HtmlPreviewIframeProps, HtmlPreviewMode, HtmlPreviewProps, HtmlPreviewStreamingMode };
+//# sourceMappingURL=type.d.mts.map

package/es/Icon/Icon.d.mts

@@ -0,0 +1,6 @@
+import { IconProps } from "./type.mjs";
+//#region src/Icon/Icon.d.ts
+declare const Icon: import("react").NamedExoticComponent<IconProps>;
+//#endregion
+export { Icon as default };
+//# sourceMappingURL=Icon.d.mts.map

package/es/Icon/Icon.mjs

@@ -0,0 +1,36 @@
+"use client";
+import { useIconContext } from "./components/IconProvider.mjs";
+import { calcSize } from "./components/utils.mjs";
+import { variants } from "./style.mjs";
+import { isValidElement, memo, useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+import { cx } from "antd-style";
+//#region src/Icon/Icon.tsx
+const Icon = memo(({ icon, size: iconSize, color, fill = "transparent", className, focusable, spin, fillRule, fillOpacity, ref, ...rest }) => {
+	const { color: colorConfig, fill: fillConfig, fillOpacity: fillOpacityConfig, fillRule: fillRuleConfig, focusable: focusableConfig, className: classNameConfig, size: sizeConfig, ...restConfig } = useIconContext();
+	const { size, strokeWidth } = useMemo(() => calcSize(iconSize || sizeConfig), [iconSize, sizeConfig]);
+	const SvgIcon = icon;
+	return /* @__PURE__ */ jsx("span", {
+		className: cx(variants({ spin }), classNameConfig, className),
+		role: "img",
+		...restConfig,
+		...rest,
+		children: icon && (isValidElement(icon) ? icon : /* @__PURE__ */ jsx(SvgIcon, {
+			color: color || colorConfig,
+			fill: fill || fillConfig,
+			fillOpacity: fillOpacity || fillOpacityConfig,
+			fillRule: fillRule || fillRuleConfig,
+			focusable: focusable || focusableConfig,
+			height: size,
+			ref,
+			size,
+			strokeWidth,
+			width: size
+		}))
+	});
+});
+Icon.displayName = "Icon";
+//#endregion
+export { Icon as default };
+
+//# sourceMappingURL=Icon.mjs.map

package/es/Icon/Icon.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.mjs","names":[],"sources":["../../src/Icon/Icon.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { cx } from 'antd-style';\r\nimport type { LucideIcon } from 'lucide-react';\r\nimport { isValidElement, memo, useMemo } from 'react';\r\n\r\nimport { useIconContext } from './components/IconProvider';\r\nimport { calcSize } from './components/utils';\r\nimport { variants } from './style';\r\nimport type { IconProps } from './type';\r\n\r\nconst Icon = memo<IconProps>(\r\n  ({\r\n    icon,\r\n    size: iconSize,\r\n    color,\r\n    fill = 'transparent',\r\n    className,\r\n    focusable,\r\n    spin,\r\n    fillRule,\r\n    fillOpacity,\r\n    ref,\r\n    ...rest\r\n  }) => {\r\n    const {\r\n      color: colorConfig,\r\n      fill: fillConfig,\r\n      fillOpacity: fillOpacityConfig,\r\n      fillRule: fillRuleConfig,\r\n      focusable: focusableConfig,\r\n      className: classNameConfig,\r\n      size: sizeConfig,\r\n      ...restConfig\r\n    } = useIconContext();\r\n\r\n    const { size, strokeWidth } = useMemo(\r\n      () => calcSize(iconSize || sizeConfig),\r\n      [iconSize, sizeConfig],\r\n    );\r\n\r\n    const SvgIcon = icon as LucideIcon;\r\n\r\n    return (\r\n      <span\r\n        className={cx(variants({ spin }), classNameConfig, className)}\r\n        role=\"img\"\r\n        {...restConfig}\r\n        {...rest}\r\n      >\r\n        {icon &&\r\n          (isValidElement(icon) ? (\r\n            icon\r\n          ) : (\r\n            <SvgIcon\r\n              color={color || colorConfig}\r\n              fill={fill || fillConfig}\r\n              fillOpacity={fillOpacity || fillOpacityConfig}\r\n              fillRule={fillRule || fillRuleConfig}\r\n              focusable={focusable || focusableConfig}\r\n              height={size}\r\n              ref={ref}\r\n              size={size}\r\n              strokeWidth={strokeWidth}\r\n              width={size}\r\n            />\r\n          ))}\r\n      </span>\r\n    );\r\n  },\r\n);\r\n\r\nIcon.displayName = 'Icon';\r\n\r\nexport default Icon;\r\n"],"mappings":";;;;;;;;AAWA,MAAM,OAAO,MACV,EACC,MACA,MAAM,UACN,OACA,OAAO,eACP,WACA,WACA,MACA,UACA,aACA,KACA,GAAG,WACC;CACJ,MAAM,EACJ,OAAO,aACP,MAAM,YACN,aAAa,mBACb,UAAU,gBACV,WAAW,iBACX,WAAW,iBACX,MAAM,YACN,GAAG,eACD,eAAe;CAEnB,MAAM,EAAE,MAAM,gBAAgB,cACtB,SAAS,YAAY,UAAU,GACrC,CAAC,UAAU,UAAU,CACvB;CAEA,MAAM,UAAU;CAEhB,OACE,oBAAC,QAAD;EACE,WAAW,GAAG,SAAS,EAAE,KAAK,CAAC,GAAG,iBAAiB,SAAS;EAC5D,MAAK;EACL,GAAI;EACJ,GAAI;EAEH,UAAA,SACE,eAAe,IAAI,IAClB,OAEA,oBAAC,SAAD;GACE,OAAO,SAAS;GAChB,MAAM,QAAQ;GACd,aAAa,eAAe;GAC5B,UAAU,YAAY;GACtB,WAAW,aAAa;GACxB,QAAQ;GACH;GACC;GACO;GACb,OAAO;EACR,CAAA;CAED,CAAA;AAEV,CACF;AAEA,KAAK,cAAc"}

package/es/Icon/components/IconProvider.d.mts

@@ -0,0 +1,13 @@
+import { IconProps } from "../type.mjs";
+import { ReactNode } from "react";
+//#region src/Icon/components/IconProvider.d.ts
+type IconContentConfig = Omit<IconProps, 'icon' | 'ref'>;
+declare const IconContext: import("react").Context<IconContentConfig>;
+declare const IconProvider: import("react").NamedExoticComponent<{
+  children: ReactNode;
+  config?: IconContentConfig;
+}>;
+declare const useIconContext: () => IconContentConfig;
+//#endregion
+export { IconContentConfig, IconContext, IconProvider, useIconContext };
+//# sourceMappingURL=IconProvider.d.mts.map

package/es/Icon/components/IconProvider.mjs

@@ -0,0 +1,18 @@
+"use client";
+import { createContext, memo, use } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/Icon/components/IconProvider.tsx
+const IconContext = createContext({});
+const IconProvider = memo(({ children, config = {} }) => {
+	return /* @__PURE__ */ jsx(IconContext, {
+		value: config,
+		children
+	});
+});
+const useIconContext = () => {
+	return use(IconContext);
+};
+//#endregion
+export { IconContext, IconProvider, useIconContext };
+
+//# sourceMappingURL=IconProvider.mjs.map

package/es/Icon/components/IconProvider.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconProvider.mjs","names":[],"sources":["../../../src/Icon/components/IconProvider.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { createContext, memo, type ReactNode, use } from 'react';\r\n\r\nimport { type IconProps } from '../type';\r\n\r\nexport type IconContentConfig = Omit<IconProps, 'icon' | 'ref'>;\r\n\r\nexport const IconContext = createContext<IconContentConfig>({});\r\n\r\nexport const IconProvider = memo<{ children: ReactNode; config?: IconContentConfig }>(\r\n  ({ children, config = {} }) => {\r\n    return <IconContext value={config}>{children}</IconContext>;\r\n  },\r\n);\r\n\r\nexport const useIconContext = () => {\r\n  return use(IconContext);\r\n};\r\n"],"mappings":";;;;AAQA,MAAa,cAAc,cAAiC,CAAC,CAAC;AAE9D,MAAa,eAAe,MACzB,EAAE,UAAU,SAAS,CAAC,QAAQ;CAC7B,OAAO,oBAAC,aAAD;EAAa,OAAO;EAAS;CAAsB,CAAA;AAC5D,CACF;AAEA,MAAa,uBAAuB;CAClC,OAAO,IAAI,WAAW;AACxB"}

package/es/Icon/components/utils.mjs

@@ -0,0 +1,36 @@
+import { isNumber } from "es-toolkit/compat";
+//#region src/Icon/components/utils.ts
+const calcSize = (iconSize) => {
+	if (isNumber(iconSize)) return { size: iconSize };
+	let size;
+	let strokeWidth;
+	switch (iconSize) {
+		case "large":
+			size = 24;
+			strokeWidth = 2;
+			break;
+		case "middle":
+			size = 20;
+			strokeWidth = 2;
+			break;
+		case "small":
+			size = 14;
+			strokeWidth = 2;
+			break;
+		default: if (iconSize) {
+			size = iconSize?.size || 24;
+			strokeWidth = iconSize?.strokeWidth || 2;
+		} else {
+			size = "1em";
+			strokeWidth = 2;
+		}
+	}
+	return {
+		size,
+		strokeWidth
+	};
+};
+//#endregion
+export { calcSize };
+
+//# sourceMappingURL=utils.mjs.map

package/es/Icon/components/utils.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.mjs","names":[],"sources":["../../../src/Icon/components/utils.ts"],"sourcesContent":["import { isNumber } from 'es-toolkit/compat';\r\n\r\nimport type { IconSize } from '../type';\r\n\r\nexport const calcSize = (iconSize?: IconSize) => {\r\n  if (isNumber(iconSize)) {\r\n    return { size: iconSize };\r\n  }\r\n\r\n  let size: number | string;\r\n  let strokeWidth: number | string;\r\n\r\n  switch (iconSize) {\r\n    case 'large': {\r\n      size = 24;\r\n      strokeWidth = 2;\r\n      break;\r\n    }\r\n    case 'middle': {\r\n      size = 20;\r\n      strokeWidth = 2;\r\n      break;\r\n    }\r\n    case 'small': {\r\n      size = 14;\r\n      strokeWidth = 2;\r\n      break;\r\n    }\r\n    default: {\r\n      if (iconSize) {\r\n        size = iconSize?.size || 24;\r\n        strokeWidth = iconSize?.strokeWidth || 2;\r\n      } else {\r\n        size = '1em';\r\n        strokeWidth = 2;\r\n      }\r\n      break;\r\n    }\r\n  }\r\n  return { size, strokeWidth };\r\n};\r\n"],"mappings":";;AAIA,MAAa,YAAY,aAAwB;CAC/C,IAAI,SAAS,QAAQ,GACnB,OAAO,EAAE,MAAM,SAAS;CAG1B,IAAI;CACJ,IAAI;CAEJ,QAAQ,UAAR;EACE,KAAK;GACH,OAAO;GACP,cAAc;GACd;EAEF,KAAK;GACH,OAAO;GACP,cAAc;GACd;EAEF,KAAK;GACH,OAAO;GACP,cAAc;GACd;EAEF,SACE,IAAI,UAAU;GACZ,OAAO,UAAU,QAAQ;GACzB,cAAc,UAAU,eAAe;EACzC,OAAO;GACL,OAAO;GACP,cAAc;EAChB;CAGJ;CACA,OAAO;EAAE;EAAM;CAAY;AAC7B"}

package/es/Icon/index.d.mts

@@ -0,0 +1,4 @@
+import { IconProps, IconSize, IconSizeConfig, IconSizeType, LucideIconProps } from "./type.mjs";
+import { IconContentConfig, IconContext, IconProvider, useIconContext } from "./components/IconProvider.mjs";
+import Icon from "./Icon.mjs";
+export { IconContentConfig, IconContext, type IconProps, IconProvider, type IconSize, type IconSizeConfig, type IconSizeType, type LucideIconProps, Icon as default, useIconContext };

package/es/Icon/index.d.ts

@@ -0,0 +1 @@
+export * from './index.d.mts';

package/es/Icon/index.js

@@ -0,0 +1 @@
+export * from './index.mjs';

package/es/Icon/index.mjs

@@ -0,0 +1,3 @@
+import { IconContext, IconProvider, useIconContext } from "./components/IconProvider.mjs";
+import Icon from "./Icon.mjs";
+export { IconContext, IconProvider, Icon as default, useIconContext };

package/es/Icon/style.mjs

@@ -0,0 +1,27 @@
+import { createStaticStyles, keyframes } from "antd-style";
+import { cva } from "class-variance-authority";
+//#region src/Icon/style.ts
+const spin = keyframes`
+  0% {
+    rotate: 0deg;
+  }
+  100% {
+    rotate: 360deg;
+  }
+`;
+const styles = createStaticStyles(({ css }) => {
+	return { spin: css`
+      animation: ${spin} 1s linear infinite;
+    ` };
+});
+const variants = cva("anticon", {
+	defaultVariants: { spin: false },
+	variants: { spin: {
+		false: null,
+		true: styles.spin
+	} }
+});
+//#endregion
+export { styles, variants };
+
+//# sourceMappingURL=style.mjs.map

package/es/Icon/style.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.mjs","names":[],"sources":["../../src/Icon/style.ts"],"sourcesContent":["import { createStaticStyles, keyframes } from 'antd-style';\r\nimport { cva } from 'class-variance-authority';\r\n\r\nconst spin = keyframes`\r\n  0% {\r\n    rotate: 0deg;\r\n  }\r\n  100% {\r\n    rotate: 360deg;\r\n  }\r\n`;\r\n\r\nexport const styles = createStaticStyles(({ css }) => {\r\n  return {\r\n    spin: css`\r\n      animation: ${spin} 1s linear infinite;\r\n    `,\r\n  };\r\n});\r\n\r\nexport const variants = cva('anticon', {\r\n  defaultVariants: {\r\n    spin: false,\r\n  },\r\n\r\n  variants: {\r\n    spin: {\r\n      false: null,\r\n      true: styles.spin,\r\n    },\r\n  },\r\n});\r\n"],"mappings":";;;AAGA,MAAM,OAAO,SAAS;;;;;;;;AAStB,MAAa,SAAS,oBAAoB,EAAE,UAAU;CACpD,OAAO,EACL,MAAM,GAAG;mBACM,KAAK;MAEtB;AACF,CAAC;AAED,MAAa,WAAW,IAAI,WAAW;CACrC,iBAAiB,EACf,MAAM,MACR;CAEA,UAAU,EACR,MAAM;EACJ,OAAO;EACP,MAAM,OAAO;CACf,EACF;AACF,CAAC"}

package/es/Icon/type.d.mts

@@ -0,0 +1,19 @@
+import { SpanProps } from "../types/index.mjs";
+import { FC, ReactNode, Ref } from "react";
+import { LucideIcon, LucideProps } from "lucide-react";
+//#region src/Icon/type.d.ts
+interface IconSizeConfig extends Pick<LucideProps, 'strokeWidth' | 'absoluteStrokeWidth'> {
+  size?: number | string;
+}
+type IconSizeType = 'large' | 'middle' | 'small';
+type IconSize = number | IconSizeType | IconSizeConfig;
+type LucideIconProps = Pick<LucideProps, 'fill' | 'fillRule' | 'fillOpacity' | 'color' | 'focusable'>;
+interface IconProps extends Omit<SpanProps, 'children'>, LucideIconProps {
+  icon: LucideIcon | FC<any> | ReactNode;
+  ref?: Ref<SVGSVGElement>;
+  size?: IconSize;
+  spin?: boolean;
+}
+//#endregion
+export { IconProps, IconSize, IconSizeConfig, IconSizeType, LucideIconProps };
+//# sourceMappingURL=type.d.mts.map

package/es/Image/Image.mjs

@@ -0,0 +1,163 @@
+"use client";
+import FlexBasic_default from "../Flex/FlexBasic.mjs";
+import Skeleton from "../base-ui/Skeleton/index.mjs";
+import { usePreviewGroupContext } from "./PreviewGroup.mjs";
+import { FALLBACK_DARK, FALLBACK_LIGHT, styles, variants } from "./style.mjs";
+import { openPreview } from "./viewer/registry.mjs";
+import PreviewOutlet from "./viewer/PreviewOutlet.mjs";
+import { memo, useCallback, useEffect, useId, useMemo, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx, useThemeMode } from "antd-style";
+//#region src/Image/Image.tsx
+const resolvePreview = (groupPreview, imagePreview) => {
+	if (imagePreview === false) return false;
+	if (imagePreview === void 0 && groupPreview === false) return false;
+	const groupOptions = typeof groupPreview === "object" ? groupPreview : void 0;
+	const imageOptions = typeof imagePreview === "object" ? imagePreview : void 0;
+	return {
+		...groupOptions,
+		...imageOptions
+	};
+};
+const Image = memo(({ ref, style, preview, isLoading, maxHeight = "100%", maxWidth = "100%", minHeight, minWidth, actions, className, alwaysShowActions, variant = "filled", objectFit = "cover", classNames, styles: customStyles, onClick, onError, onPointerDown, width, height, size, src, alt, loading = "lazy", ...rest }) => {
+	const { isDarkMode } = useThemeMode();
+	const [hasError, setHasError] = useState(false);
+	const lastSrcRef = useRef(src);
+	const imgRef = useRef(null);
+	const preOpenFocusRef = useRef(null);
+	const id = useId();
+	const group = usePreviewGroupContext();
+	if (lastSrcRef.current !== src) {
+		lastSrcRef.current = src;
+		if (hasError) setHasError(false);
+	}
+	const resolvedWidth = width ?? size;
+	const resolvedHeight = height ?? size;
+	const resolvedPreview = resolvePreview(group?.preview, preview);
+	const previewEnabled = resolvedPreview !== false;
+	const resolvedOptions = useMemo(() => previewEnabled ? {
+		autoZoomThreshold: 2,
+		defaultZoom: "auto",
+		maxScale: 8,
+		...resolvedPreview
+	} : void 0, [previewEnabled, resolvedPreview]);
+	const previewSrc = resolvedOptions?.src;
+	useEffect(() => {
+		if (!group) return;
+		return group.register({
+			getElement: () => imgRef.current,
+			id,
+			options: resolvedOptions,
+			previewSrc,
+			src: src ?? ""
+		});
+	}, [
+		group,
+		id,
+		src,
+		previewSrc,
+		resolvedOptions
+	]);
+	const handleError = useCallback((event) => {
+		setHasError(true);
+		onError?.(event);
+	}, [onError]);
+	const handlePointerDown = useCallback((event) => {
+		onPointerDown?.(event);
+		const active = document.activeElement;
+		preOpenFocusRef.current = active instanceof HTMLElement && active !== document.body && active !== document.documentElement ? active : null;
+	}, [onPointerDown]);
+	const handleClick = useCallback((event) => {
+		onClick?.(event);
+		if (!previewEnabled || !imgRef.current || !resolvedOptions) return;
+		const clickedEntry = {
+			element: imgRef.current,
+			options: resolvedOptions,
+			previewSrc,
+			src: imgRef.current.currentSrc || imgRef.current.src
+		};
+		const openerFocusElement = preOpenFocusRef.current;
+		if (!group) {
+			openPreview(clickedEntry, void 0, 0, openerFocusElement);
+			return;
+		}
+		const galleryEntries = [];
+		let clickedIndex = -1;
+		for (const groupEntry of group.getEntries()) {
+			const element = groupEntry.getElement();
+			if (!element || !groupEntry.options) continue;
+			if (element === imgRef.current) clickedIndex = galleryEntries.length;
+			galleryEntries.push({
+				element,
+				options: groupEntry.options,
+				previewSrc: groupEntry.previewSrc,
+				src: element.currentSrc || element.src
+			});
+		}
+		openPreview(clickedEntry, galleryEntries, clickedIndex >= 0 ? clickedIndex : 0, openerFocusElement);
+	}, [
+		onClick,
+		previewEnabled,
+		resolvedOptions,
+		previewSrc,
+		group
+	]);
+	const actionsClassName = alwaysShowActions ? styles.actionsVisible : styles.actionsHidden;
+	if (isLoading) return /* @__PURE__ */ jsx("div", {
+		onClick,
+		children: /* @__PURE__ */ jsx(Skeleton, {
+			height: resolvedHeight,
+			style: {
+				maxHeight,
+				maxWidth,
+				minHeight,
+				minWidth
+			},
+			width: resolvedWidth
+		})
+	});
+	return /* @__PURE__ */ jsxs(FlexBasic_default, {
+		className: cx(variants({ variant }), className),
+		ref,
+		style,
+		children: [
+			actions && /* @__PURE__ */ jsx("div", {
+				className: cx(actionsClassName, alwaysShowActions ? "" : "actions-hidden"),
+				children: actions
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: cx(styles.wrapper, classNames?.wrapper),
+				style: customStyles?.wrapper,
+				children: /* @__PURE__ */ jsx("img", {
+					alt,
+					className: cx(styles.image, previewEnabled && styles.previewable, classNames?.image),
+					height: resolvedHeight,
+					loading,
+					ref: imgRef,
+					src: hasError ? isDarkMode ? FALLBACK_DARK : FALLBACK_LIGHT : src,
+					width: resolvedWidth,
+					style: {
+						height: resolvedHeight,
+						maxHeight,
+						maxWidth,
+						minHeight,
+						minWidth,
+						objectFit,
+						width: resolvedWidth,
+						...customStyles?.image
+					},
+					onClick: handleClick,
+					onError: handleError,
+					onPointerDown: handlePointerDown,
+					...rest
+				})
+			}),
+			previewEnabled && /* @__PURE__ */ jsx(PreviewOutlet, { elementRef: imgRef })
+		]
+	});
+});
+Image.displayName = "Image";
+//#endregion
+export { Image as default };
+
+//# sourceMappingURL=Image.mjs.map

package/es/Image/Image.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Image.mjs","names":["Flexbox"],"sources":["../../src/Image/Image.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { cx, useThemeMode } from 'antd-style';\r\nimport {\r\n  memo,\r\n  type MouseEvent,\r\n  type PointerEvent,\r\n  type SyntheticEvent,\r\n  useCallback,\r\n  useEffect,\r\n  useId,\r\n  useMemo,\r\n  useRef,\r\n  useState,\r\n} from 'react';\r\n\r\nimport Skeleton from '@/base-ui/Skeleton';\r\nimport { Flexbox } from '@/Flex';\r\n\r\nimport { usePreviewGroupContext } from './PreviewGroup';\r\nimport { FALLBACK_DARK, FALLBACK_LIGHT, styles, variants } from './style';\r\nimport type { ImagePreviewOptions, ImageProps } from './type';\r\nimport { DEFAULT_AUTO_ZOOM_THRESHOLD, DEFAULT_MAX_SCALE } from './viewer/geometry';\r\nimport PreviewOutlet from './viewer/PreviewOutlet';\r\nimport { openPreview, type PreviewEntry } from './viewer/registry';\r\n\r\nconst resolvePreview = (\r\n  groupPreview: boolean | ImagePreviewOptions | undefined,\r\n  imagePreview: boolean | ImagePreviewOptions | undefined,\r\n): ImagePreviewOptions | false => {\r\n  if (imagePreview === false) return false;\r\n  if (imagePreview === undefined && groupPreview === false) return false;\r\n\r\n  const groupOptions = typeof groupPreview === 'object' ? groupPreview : undefined;\r\n  const imageOptions = typeof imagePreview === 'object' ? imagePreview : undefined;\r\n\r\n  return { ...groupOptions, ...imageOptions };\r\n};\r\n\r\nconst Image = memo<ImageProps>(\r\n  ({\r\n    ref,\r\n    style,\r\n    preview,\r\n    isLoading,\r\n    maxHeight = '100%',\r\n    maxWidth = '100%',\r\n    minHeight,\r\n    minWidth,\r\n    actions,\r\n    className,\r\n    alwaysShowActions,\r\n    variant = 'filled',\r\n    objectFit = 'cover',\r\n    classNames,\r\n    styles: customStyles,\r\n    onClick,\r\n    onError,\r\n    onPointerDown,\r\n    width,\r\n    height,\r\n    size,\r\n    src,\r\n    alt,\r\n    loading = 'lazy',\r\n    ...rest\r\n  }) => {\r\n    const { isDarkMode } = useThemeMode();\r\n    const [hasError, setHasError] = useState(false);\r\n    const lastSrcRef = useRef(src);\r\n    const imgRef = useRef<HTMLImageElement>(null);\r\n    const preOpenFocusRef = useRef<HTMLElement | null>(null);\r\n    const id = useId();\r\n    const group = usePreviewGroupContext();\r\n\r\n    if (lastSrcRef.current !== src) {\r\n      lastSrcRef.current = src;\r\n      if (hasError) setHasError(false);\r\n    }\r\n\r\n    const resolvedWidth = width ?? size;\r\n    const resolvedHeight = height ?? size;\r\n\r\n    const resolvedPreview = resolvePreview(group?.preview, preview);\r\n    const previewEnabled = resolvedPreview !== false;\r\n    const resolvedOptions = useMemo(\r\n      () =>\r\n        previewEnabled\r\n          ? {\r\n              autoZoomThreshold: DEFAULT_AUTO_ZOOM_THRESHOLD,\r\n              defaultZoom: 'auto' as const,\r\n              maxScale: DEFAULT_MAX_SCALE,\r\n              ...resolvedPreview,\r\n            }\r\n          : undefined,\r\n      [previewEnabled, resolvedPreview],\r\n    );\r\n    const previewSrc = resolvedOptions?.src;\r\n\r\n    useEffect(() => {\r\n      if (!group) return;\r\n      return group.register({\r\n        getElement: () => imgRef.current,\r\n        id,\r\n        options: resolvedOptions,\r\n        previewSrc,\r\n        src: src ?? '',\r\n      });\r\n    }, [group, id, src, previewSrc, resolvedOptions]);\r\n\r\n    const handleError = useCallback(\r\n      (event: SyntheticEvent<HTMLImageElement>) => {\r\n        setHasError(true);\r\n        onError?.(event);\r\n      },\r\n      [onError],\r\n    );\r\n\r\n    const handlePointerDown = useCallback(\r\n      (event: PointerEvent<HTMLImageElement>) => {\r\n        onPointerDown?.(event);\r\n        const active = document.activeElement;\r\n        preOpenFocusRef.current =\r\n          active instanceof HTMLElement &&\r\n          active !== document.body &&\r\n          active !== document.documentElement\r\n            ? active\r\n            : null;\r\n      },\r\n      [onPointerDown],\r\n    );\r\n\r\n    const handleClick = useCallback(\r\n      (event: MouseEvent<HTMLImageElement>) => {\r\n        onClick?.(event);\r\n        if (!previewEnabled || !imgRef.current || !resolvedOptions) return;\r\n        const clickedEntry: PreviewEntry = {\r\n          element: imgRef.current,\r\n          options: resolvedOptions,\r\n          previewSrc,\r\n          src: imgRef.current.currentSrc || imgRef.current.src,\r\n        };\r\n        const openerFocusElement = preOpenFocusRef.current;\r\n\r\n        if (!group) {\r\n          openPreview(clickedEntry, undefined, 0, openerFocusElement);\r\n          return;\r\n        }\r\n\r\n        const galleryEntries: PreviewEntry[] = [];\r\n        let clickedIndex = -1;\r\n        for (const groupEntry of group.getEntries()) {\r\n          const element = groupEntry.getElement();\r\n          if (!element || !groupEntry.options) continue;\r\n          if (element === imgRef.current) clickedIndex = galleryEntries.length;\r\n          galleryEntries.push({\r\n            element,\r\n            options: groupEntry.options,\r\n            previewSrc: groupEntry.previewSrc,\r\n            src: element.currentSrc || element.src,\r\n          });\r\n        }\r\n        openPreview(\r\n          clickedEntry,\r\n          galleryEntries,\r\n          clickedIndex >= 0 ? clickedIndex : 0,\r\n          openerFocusElement,\r\n        );\r\n      },\r\n      [onClick, previewEnabled, resolvedOptions, previewSrc, group],\r\n    );\r\n\r\n    const actionsClassName = alwaysShowActions ? styles.actionsVisible : styles.actionsHidden;\r\n\r\n    if (isLoading)\r\n      return (\r\n        <div onClick={onClick}>\r\n          <Skeleton\r\n            height={resolvedHeight}\r\n            style={{ maxHeight, maxWidth, minHeight, minWidth }}\r\n            width={resolvedWidth}\r\n          />\r\n        </div>\r\n      );\r\n\r\n    return (\r\n      <Flexbox className={cx(variants({ variant }), className)} ref={ref} style={style}>\r\n        {actions && (\r\n          <div className={cx(actionsClassName, alwaysShowActions ? '' : 'actions-hidden')}>\r\n            {actions}\r\n          </div>\r\n        )}\r\n        <div className={cx(styles.wrapper, classNames?.wrapper)} style={customStyles?.wrapper}>\r\n          <img\r\n            alt={alt}\r\n            className={cx(styles.image, previewEnabled && styles.previewable, classNames?.image)}\r\n            height={resolvedHeight}\r\n            loading={loading}\r\n            ref={imgRef}\r\n            src={hasError ? (isDarkMode ? FALLBACK_DARK : FALLBACK_LIGHT) : src}\r\n            width={resolvedWidth}\r\n            style={{\r\n              height: resolvedHeight,\r\n              maxHeight,\r\n              maxWidth,\r\n              minHeight,\r\n              minWidth,\r\n              objectFit,\r\n              width: resolvedWidth,\r\n              ...customStyles?.image,\r\n            }}\r\n            onClick={handleClick}\r\n            onError={handleError}\r\n            onPointerDown={handlePointerDown}\r\n            {...rest}\r\n          />\r\n        </div>\r\n        {previewEnabled && <PreviewOutlet elementRef={imgRef} />}\r\n      </Flexbox>\r\n    );\r\n  },\r\n);\r\n\r\nImage.displayName = 'Image';\r\n\r\nexport default Image;\r\n"],"mappings":"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"}

package/es/Image/PreviewGroup.d.mts

@@ -0,0 +1,7 @@
+import { PreviewGroupProps } from "./type.mjs";
+import "./viewer/registry.mjs";
+//#region src/Image/PreviewGroup.d.ts
+declare const PreviewGroup: import("react").NamedExoticComponent<PreviewGroupProps>;
+//#endregion
+export { PreviewGroup as default };
+//# sourceMappingURL=PreviewGroup.d.mts.map

package/es/Image/PreviewGroup.mjs

@@ -0,0 +1,44 @@
+"use client";
+import { createContext, memo, use, useCallback, useMemo, useRef } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/Image/PreviewGroup.tsx
+const PreviewGroupContext = createContext(null);
+const usePreviewGroupContext = () => use(PreviewGroupContext);
+const compareEntries = (a, b) => {
+	const elementA = a.getElement();
+	const elementB = b.getElement();
+	if (!elementA || !elementB) return 0;
+	const position = elementA.compareDocumentPosition(elementB);
+	if (position & Node.DOCUMENT_POSITION_FOLLOWING) return -1;
+	if (position & Node.DOCUMENT_POSITION_PRECEDING) return 1;
+	return 0;
+};
+const PreviewGroup = memo(({ children, enable = true, preview }) => {
+	const entriesRef = useRef(/* @__PURE__ */ new Map());
+	const register = useCallback((entry) => {
+		entriesRef.current.set(entry.id, entry);
+		return () => {
+			entriesRef.current.delete(entry.id);
+		};
+	}, []);
+	const getEntries = useCallback(() => [...entriesRef.current.values()].sort(compareEntries), []);
+	const value = useMemo(() => ({
+		getEntries,
+		preview,
+		register
+	}), [
+		getEntries,
+		preview,
+		register
+	]);
+	if (!enable) return children;
+	return /* @__PURE__ */ jsx(PreviewGroupContext, {
+		value,
+		children
+	});
+});
+PreviewGroup.displayName = "PreviewGroup";
+//#endregion
+export { PreviewGroup as default, usePreviewGroupContext };
+
+//# sourceMappingURL=PreviewGroup.mjs.map

package/es/Image/PreviewGroup.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PreviewGroup.mjs","names":[],"sources":["../../src/Image/PreviewGroup.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { createContext, memo, use, useCallback, useMemo, useRef } from 'react';\r\n\r\nimport type { ImagePreviewOptions, PreviewGroupProps } from './type';\r\nimport type { ResolvedPreviewOptions } from './viewer/registry';\r\n\r\nexport interface PreviewGroupEntry {\r\n  getElement: () => HTMLImageElement | null;\r\n  id: string;\r\n  options?: ResolvedPreviewOptions;\r\n  previewSrc?: string;\r\n  src: string;\r\n}\r\n\r\ninterface PreviewGroupContextValue {\r\n  getEntries: () => PreviewGroupEntry[];\r\n  preview?: boolean | ImagePreviewOptions;\r\n  register: (entry: PreviewGroupEntry) => () => void;\r\n}\r\n\r\nconst PreviewGroupContext = createContext<PreviewGroupContextValue | null>(null);\r\n\r\nexport const usePreviewGroupContext = () => use(PreviewGroupContext);\r\n\r\nconst compareEntries = (a: PreviewGroupEntry, b: PreviewGroupEntry) => {\r\n  const elementA = a.getElement();\r\n  const elementB = b.getElement();\r\n  if (!elementA || !elementB) return 0;\r\n  const position = elementA.compareDocumentPosition(elementB);\r\n  if (position & Node.DOCUMENT_POSITION_FOLLOWING) return -1;\r\n  if (position & Node.DOCUMENT_POSITION_PRECEDING) return 1;\r\n  return 0;\r\n};\r\n\r\nconst PreviewGroup = memo<PreviewGroupProps>(({ children, enable = true, preview }) => {\r\n  const entriesRef = useRef(new Map<string, PreviewGroupEntry>());\r\n\r\n  const register = useCallback((entry: PreviewGroupEntry) => {\r\n    entriesRef.current.set(entry.id, entry);\r\n    return () => {\r\n      entriesRef.current.delete(entry.id);\r\n    };\r\n  }, []);\r\n\r\n  const getEntries = useCallback(() => [...entriesRef.current.values()].sort(compareEntries), []);\r\n\r\n  const value = useMemo<PreviewGroupContextValue>(\r\n    () => ({ getEntries, preview, register }),\r\n    [getEntries, preview, register],\r\n  );\r\n\r\n  if (!enable) return children;\r\n\r\n  return <PreviewGroupContext value={value}>{children}</PreviewGroupContext>;\r\n});\r\n\r\nPreviewGroup.displayName = 'PreviewGroup';\r\n\r\nexport default PreviewGroup;\r\n"],"mappings":";;;;AAqBA,MAAM,sBAAsB,cAA+C,IAAI;AAE/E,MAAa,+BAA+B,IAAI,mBAAmB;AAEnE,MAAM,kBAAkB,GAAsB,MAAyB;CACrE,MAAM,WAAW,EAAE,WAAW;CAC9B,MAAM,WAAW,EAAE,WAAW;CAC9B,IAAI,CAAC,YAAY,CAAC,UAAU,OAAO;CACnC,MAAM,WAAW,SAAS,wBAAwB,QAAQ;CAC1D,IAAI,WAAW,KAAK,6BAA6B,OAAO;CACxD,IAAI,WAAW,KAAK,6BAA6B,OAAO;CACxD,OAAO;AACT;AAEA,MAAM,eAAe,MAAyB,EAAE,UAAU,SAAS,MAAM,cAAc;CACrF,MAAM,aAAa,uBAAO,IAAI,IAA+B,CAAC;CAE9D,MAAM,WAAW,aAAa,UAA6B;EACzD,WAAW,QAAQ,IAAI,MAAM,IAAI,KAAK;EACtC,aAAa;GACX,WAAW,QAAQ,OAAO,MAAM,EAAE;EACpC;CACF,GAAG,CAAC,CAAC;CAEL,MAAM,aAAa,kBAAkB,CAAC,GAAG,WAAW,QAAQ,OAAO,CAAC,CAAC,CAAC,KAAK,cAAc,GAAG,CAAC,CAAC;CAE9F,MAAM,QAAQ,eACL;EAAE;EAAY;EAAS;CAAS,IACvC;EAAC;EAAY;EAAS;CAAQ,CAChC;CAEA,IAAI,CAAC,QAAQ,OAAO;CAEpB,OAAO,oBAAC,qBAAD;EAA4B;EAAQ;CAA8B,CAAA;AAC3E,CAAC;AAED,aAAa,cAAc"}

package/es/Image/index.d.mts

@@ -0,0 +1,13 @@
+import { ImagePreviewOptions, ImageProps, PreviewGroupProps } from "./type.mjs";
+import PreviewGroup from "./PreviewGroup.mjs";
+import { UseImagePreviewResult, useImagePreview } from "./useImagePreview.mjs";
+import { ReactNode } from "react";
+//#region src/Image/index.d.ts
+interface IImage {
+  (props: ImageProps): ReactNode;
+  PreviewGroup: typeof PreviewGroup;
+}
+declare const Image: IImage;
+//#endregion
+export { IImage, type ImagePreviewOptions, type ImageProps, PreviewGroup, type PreviewGroupProps, type UseImagePreviewResult, Image as default, useImagePreview };
+//# sourceMappingURL=index.d.mts.map

package/es/Image/index.d.ts

@@ -0,0 +1 @@
+export * from './index.d.mts';

package/es/Image/index.js

@@ -0,0 +1 @@
+export * from './index.mjs';

package/es/Image/index.mjs

@@ -0,0 +1,10 @@
+import PreviewGroup from "./PreviewGroup.mjs";
+import Image$1 from "./Image.mjs";
+import { useImagePreview } from "./useImagePreview.mjs";
+//#region src/Image/index.ts
+const Image = Image$1;
+Image.PreviewGroup = PreviewGroup;
+//#endregion
+export { PreviewGroup, Image as default, useImagePreview };
+
+//# sourceMappingURL=index.mjs.map

package/es/Image/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","names":["ImageParent"],"sources":["../../src/Image/index.ts"],"sourcesContent":["import type { ReactNode } from 'react';\r\n\r\nimport ImageParent from './Image';\r\nimport PreviewGroup from './PreviewGroup';\r\nimport type { ImageProps } from './type';\r\n\r\nexport interface IImage {\r\n  (props: ImageProps): ReactNode;\r\n  PreviewGroup: typeof PreviewGroup;\r\n}\r\n\r\nconst Image = ImageParent as unknown as IImage;\r\nImage.PreviewGroup = PreviewGroup;\r\n\r\nexport default Image;\r\nexport { default as PreviewGroup } from './PreviewGroup';\r\nexport type * from './type';\r\nexport { useImagePreview, type UseImagePreviewResult } from './useImagePreview';\r\n"],"mappings":";;;;AAWA,MAAM,QAAQA;AACd,MAAM,eAAe"}