@lobehub/ui 5.33.0 → 5.33.2

package/es/Mermaid/SyntaxMermaid/MermaidSvg.mjs

@@ -1,14 +1,24 @@
 "use client";
+import { openPreview } from "../../Image/viewer/registry.mjs";
+import PreviewOutlet from "../../Image/viewer/PreviewOutlet.mjs";
 import { toStandaloneSvgString } from "./prepareInlineSvg.mjs";
 import { prepareMermaidSvgString } from "./prepareMermaidSvg.mjs";
 import { memo, useCallback, useEffect, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Image } from "antd";
 //#region src/Mermaid/SyntaxMermaid/MermaidSvg.tsx
+const anchorStyle = {
+	height: "100%",
+	insetBlockStart: 0,
+	insetInlineStart: 0,
+	pointerEvents: "none",
+	position: "absolute",
+	visibility: "hidden",
+	width: "100%"
+};
 const MermaidSvg = memo(({ className, ref, style, svg }) => {
 	const containerRef = useRef(null);
+	const anchorRef = useRef(null);
 	const [previewUrl, setPreviewUrl] = useState();
-	const [open, setOpen] = useState(false);
 	useEffect(() => {
 		return () => {
 			if (previewUrl) URL.revokeObjectURL(previewUrl);
@@ -16,33 +26,47 @@ const MermaidSvg = memo(({ className, ref, style, svg }) => {
 	}, [previewUrl]);
 	const handleOpen = useCallback(() => {
 		const element = containerRef.current?.querySelector("svg");
-		if (!element) return;
+		const anchor = anchorRef.current;
+		if (!element || !anchor) return;
 		const standalone = prepareMermaidSvgString(toStandaloneSvgString(element));
+		const url = URL.createObjectURL(new Blob([standalone], { type: "image/svg+xml" }));
 		setPreviewUrl((previous) => {
 			if (previous) URL.revokeObjectURL(previous);
-			return URL.createObjectURL(new Blob([standalone], { type: "image/svg+xml" }));
+			return url;
+		});
+		openPreview({
+			element: anchor,
+			options: {
+				autoZoomThreshold: 2,
+				defaultZoom: "auto",
+				maxScale: 8
+			},
+			src: url
 		});
-		setOpen(true);
 	}, []);
 	return /* @__PURE__ */ jsxs("div", {
 		className,
 		ref,
-		style,
-		children: [/* @__PURE__ */ jsx("div", {
-			dangerouslySetInnerHTML: { __html: svg },
-			ref: containerRef,
-			style: { cursor: "zoom-in" },
-			onClick: handleOpen
-		}), previewUrl && /* @__PURE__ */ jsx(Image, {
-			preview: {
-				onVisibleChange: setOpen,
+		style: {
+			position: "relative",
+			...style
+		},
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				dangerouslySetInnerHTML: { __html: svg },
+				ref: containerRef,
+				style: { cursor: "zoom-in" },
+				onClick: handleOpen
+			}),
+			/* @__PURE__ */ jsx("img", {
+				"aria-hidden": true,
+				alt: "",
+				ref: anchorRef,
 				src: previewUrl,
-				visible: open
-			},
-			src: previewUrl,
-			style: { display: "none" },
-			wrapperStyle: { display: "none" }
-		})]
+				style: anchorStyle
+			}),
+			/* @__PURE__ */ jsx(PreviewOutlet, { elementRef: anchorRef })
+		]
 	});
 });
 MermaidSvg.displayName = "MermaidSvg";

package/es/Mermaid/SyntaxMermaid/MermaidSvg.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"MermaidSvg.mjs","names":["AntImage"],"sources":["../../../src/Mermaid/SyntaxMermaid/MermaidSvg.tsx"],"sourcesContent":["'use client';\n\nimport { Image as AntImage } from 'antd';\nimport { memo, type Ref, useCallback, useEffect, useRef, useState } from 'react';\n\nimport { toStandaloneSvgString } from './prepareInlineSvg';\nimport { prepareMermaidSvgString } from './prepareMermaidSvg';\n\ninterface MermaidSvgProps {\n  className?: string;\n  ref?: Ref<HTMLDivElement>;\n  style?: React.CSSProperties;\n  svg: string;\n}\n\nconst MermaidSvg = memo<MermaidSvgProps>(({ className, ref, style, svg }) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const [previewUrl, setPreviewUrl] = useState<string>();\n  const [open, setOpen] = useState(false);\n\n  useEffect(() => {\n    return () => {\n      if (previewUrl) URL.revokeObjectURL(previewUrl);\n    };\n  }, [previewUrl]);\n\n  // The preview copy is only built on demand: it has to bake in the resolved\n  // CSS variables and be XML-well-formed, neither of which the inline copy needs.\n  const handleOpen = useCallback(() => {\n    const element = containerRef.current?.querySelector('svg');\n    if (!element) return;\n\n    const standalone = prepareMermaidSvgString(toStandaloneSvgString(element));\n    setPreviewUrl((previous) => {\n      if (previous) URL.revokeObjectURL(previous);\n      return URL.createObjectURL(new Blob([standalone], { type: 'image/svg+xml' }));\n    });\n    setOpen(true);\n  }, []);\n\n  return (\n    <div className={className} ref={ref} style={style}>\n      <div\n        dangerouslySetInnerHTML={{ __html: svg }}\n        ref={containerRef}\n        style={{ cursor: 'zoom-in' }}\n        onClick={handleOpen}\n      />\n      {previewUrl && (\n        <AntImage\n          preview={{ onVisibleChange: setOpen, src: previewUrl, visible: open }}\n          src={previewUrl}\n          style={{ display: 'none' }}\n          wrapperStyle={{ display: 'none' }}\n        />\n      )}\n    </div>\n  );\n});\n\nMermaidSvg.displayName = 'MermaidSvg';\n\nexport default MermaidSvg;\n"],"mappings":";;;;;;;AAeA,MAAM,aAAa,MAAuB,EAAE,WAAW,KAAK,OAAO,UAAU;CAC3E,MAAM,eAAe,OAAuB,IAAI;CAChD,MAAM,CAAC,YAAY,iBAAiB,SAAiB;CACrD,MAAM,CAAC,MAAM,WAAW,SAAS,KAAK;CAEtC,gBAAgB;EACd,aAAa;GACX,IAAI,YAAY,IAAI,gBAAgB,UAAU;EAChD;CACF,GAAG,CAAC,UAAU,CAAC;CAIf,MAAM,aAAa,kBAAkB;EACnC,MAAM,UAAU,aAAa,SAAS,cAAc,KAAK;EACzD,IAAI,CAAC,SAAS;EAEd,MAAM,aAAa,wBAAwB,sBAAsB,OAAO,CAAC;EACzE,eAAe,aAAa;GAC1B,IAAI,UAAU,IAAI,gBAAgB,QAAQ;GAC1C,OAAO,IAAI,gBAAgB,IAAI,KAAK,CAAC,UAAU,GAAG,EAAE,MAAM,gBAAgB,CAAC,CAAC;EAC9E,CAAC;EACD,QAAQ,IAAI;CACd,GAAG,CAAC,CAAC;CAEL,OACE,qBAAC,OAAD;EAAgB;EAAgB;EAAY;EAA5C,UAAA,CACE,oBAAC,OAAD;GACE,yBAAyB,EAAE,QAAQ,IAAI;GACvC,KAAK;GACL,OAAO,EAAE,QAAQ,UAAU;GAC3B,SAAS;EACV,CAAA,GACA,cACC,oBAACA,OAAD;GACE,SAAS;IAAE,iBAAiB;IAAS,KAAK;IAAY,SAAS;GAAK;GACpE,KAAK;GACL,OAAO,EAAE,SAAS,OAAO;GACzB,cAAc,EAAE,SAAS,OAAO;EACjC,CAAA,CAEA;;AAET,CAAC;AAED,WAAW,cAAc"}
+{"version":3,"file":"MermaidSvg.mjs","names":[],"sources":["../../../src/Mermaid/SyntaxMermaid/MermaidSvg.tsx"],"sourcesContent":["'use client';\n\nimport { memo, type Ref, useCallback, useEffect, useRef, useState } from 'react';\n\nimport { DEFAULT_AUTO_ZOOM_THRESHOLD, DEFAULT_MAX_SCALE } from '@/Image/viewer/geometry';\nimport PreviewOutlet from '@/Image/viewer/PreviewOutlet';\nimport { openPreview } from '@/Image/viewer/registry';\n\nimport { toStandaloneSvgString } from './prepareInlineSvg';\nimport { prepareMermaidSvgString } from './prepareMermaidSvg';\n\ninterface MermaidSvgProps {\n  className?: string;\n  ref?: Ref<HTMLDivElement>;\n  style?: React.CSSProperties;\n  svg: string;\n}\n\n// The viewer flies the image out of the element it was opened from, so the\n// diagram needs a real <img> to measure — hence a hidden anchor tracking the\n// diagram box rather than a display:none preview image.\nconst anchorStyle: React.CSSProperties = {\n  height: '100%',\n  insetBlockStart: 0,\n  insetInlineStart: 0,\n  pointerEvents: 'none',\n  position: 'absolute',\n  visibility: 'hidden',\n  width: '100%',\n};\n\nconst MermaidSvg = memo<MermaidSvgProps>(({ className, ref, style, svg }) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const anchorRef = useRef<HTMLImageElement>(null);\n  const [previewUrl, setPreviewUrl] = useState<string>();\n\n  useEffect(() => {\n    return () => {\n      if (previewUrl) URL.revokeObjectURL(previewUrl);\n    };\n  }, [previewUrl]);\n\n  // The preview copy is only built on demand: it has to bake in the resolved\n  // CSS variables and be XML-well-formed, neither of which the inline copy needs.\n  const handleOpen = useCallback(() => {\n    const element = containerRef.current?.querySelector('svg');\n    const anchor = anchorRef.current;\n    if (!element || !anchor) return;\n\n    const standalone = prepareMermaidSvgString(toStandaloneSvgString(element));\n    const url = URL.createObjectURL(new Blob([standalone], { type: 'image/svg+xml' }));\n    setPreviewUrl((previous) => {\n      if (previous) URL.revokeObjectURL(previous);\n      return url;\n    });\n\n    openPreview({\n      element: anchor,\n      options: {\n        autoZoomThreshold: DEFAULT_AUTO_ZOOM_THRESHOLD,\n        defaultZoom: 'auto',\n        maxScale: DEFAULT_MAX_SCALE,\n      },\n      src: url,\n    });\n  }, []);\n\n  return (\n    <div className={className} ref={ref} style={{ position: 'relative', ...style }}>\n      <div\n        dangerouslySetInnerHTML={{ __html: svg }}\n        ref={containerRef}\n        style={{ cursor: 'zoom-in' }}\n        onClick={handleOpen}\n      />\n      <img aria-hidden alt=\"\" ref={anchorRef} src={previewUrl} style={anchorStyle} />\n      <PreviewOutlet elementRef={anchorRef} />\n    </div>\n  );\n});\n\nMermaidSvg.displayName = 'MermaidSvg';\n\nexport default MermaidSvg;\n"],"mappings":";;;;;;;;AAqBA,MAAM,cAAmC;CACvC,QAAQ;CACR,iBAAiB;CACjB,kBAAkB;CAClB,eAAe;CACf,UAAU;CACV,YAAY;CACZ,OAAO;AACT;AAEA,MAAM,aAAa,MAAuB,EAAE,WAAW,KAAK,OAAO,UAAU;CAC3E,MAAM,eAAe,OAAuB,IAAI;CAChD,MAAM,YAAY,OAAyB,IAAI;CAC/C,MAAM,CAAC,YAAY,iBAAiB,SAAiB;CAErD,gBAAgB;EACd,aAAa;GACX,IAAI,YAAY,IAAI,gBAAgB,UAAU;EAChD;CACF,GAAG,CAAC,UAAU,CAAC;CAIf,MAAM,aAAa,kBAAkB;EACnC,MAAM,UAAU,aAAa,SAAS,cAAc,KAAK;EACzD,MAAM,SAAS,UAAU;EACzB,IAAI,CAAC,WAAW,CAAC,QAAQ;EAEzB,MAAM,aAAa,wBAAwB,sBAAsB,OAAO,CAAC;EACzE,MAAM,MAAM,IAAI,gBAAgB,IAAI,KAAK,CAAC,UAAU,GAAG,EAAE,MAAM,gBAAgB,CAAC,CAAC;EACjF,eAAe,aAAa;GAC1B,IAAI,UAAU,IAAI,gBAAgB,QAAQ;GAC1C,OAAO;EACT,CAAC;EAED,YAAY;GACV,SAAS;GACT,SAAS;IACP,mBAAA;IACA,aAAa;IACb,UAAA;GACF;GACA,KAAK;EACP,CAAC;CACH,GAAG,CAAC,CAAC;CAEL,OACE,qBAAC,OAAD;EAAgB;EAAgB;EAAK,OAAO;GAAE,UAAU;GAAY,GAAG;EAAM;EAA7E,UAAA;GACE,oBAAC,OAAD;IACE,yBAAyB,EAAE,QAAQ,IAAI;IACvC,KAAK;IACL,OAAO,EAAE,QAAQ,UAAU;IAC3B,SAAS;GACV,CAAA;GACD,oBAAC,OAAD;IAAK,eAAA;IAAY,KAAI;IAAG,KAAK;IAAW,KAAK;IAAY,OAAO;GAAc,CAAA;GAC9E,oBAAC,eAAD,EAAe,YAAY,UAAY,CAAA;EACpC;;AAET,CAAC;AAED,WAAW,cAAc"}

package/es/Mermaid/SyntaxMermaid/prepareInlineSvg.mjs

@@ -42,6 +42,8 @@ const toStandaloneSvgString = (element) => {
 		const value = computed.getPropertyValue(name).trim();
 		if (value) clone.style.setProperty(name, value);
 	}
+	const background = computed.getPropertyValue("--bg").trim();
+	if (background) clone.style.setProperty("background", background);
 	const fontFamily = computed.fontFamily;
 	if (fontFamily) clone.style.setProperty("font-family", fontFamily);
 	return new XMLSerializer().serializeToString(clone);

package/es/Mermaid/SyntaxMermaid/prepareInlineSvg.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"prepareInlineSvg.mjs","names":[],"sources":["../../../src/Mermaid/SyntaxMermaid/prepareInlineSvg.ts"],"sourcesContent":["/**\n * Root custom properties beautiful-mermaid reads; everything else in its\n * stylesheet is derived from these via color-mix().\n */\nexport const MERMAID_ROOT_VARS = [\n  '--bg',\n  '--fg',\n  '--line',\n  '--accent',\n  '--muted',\n  '--surface',\n  '--border',\n];\n\nconst styleBlockPattern = /<style>([\\s\\S]*?)<\\/style>/;\n\nconst scopeCssSelectors = (css: string, scope: string): string =>\n  css.replaceAll(/(^|})([^{}@]+)\\{/g, (_match, tail: string, selectors: string) => {\n    const scoped = selectors\n      .split(',')\n      .map((selector) => selector.trim())\n      .filter(Boolean)\n      // The generated sheet targets `svg` for the root itself, not a descendant\n      .map((selector) => (selector === 'svg' ? scope : `${scope} ${selector}`))\n      .join(', ');\n\n    return `${tail}\\n${scoped} {`;\n  });\n\n/**\n * A <style> element inside inline SVG applies to the whole document, so the\n * generated rules must be scoped to this diagram before being injected. The\n * font @import is dropped because inline rendering would actually issue the\n * Google Fonts request that an <img>-loaded SVG silently blocks, and the bare\n * `text` rule is dropped so page CSS can supply the theme font instead.\n */\nexport const prepareInlineMermaidSvg = (svg: string, scopeId: string): string => {\n  if (!svg) return svg;\n\n  const withId = svg.replace(/<svg\\b/, `<svg id=\"${scopeId}\"`);\n\n  return withId.replace(styleBlockPattern, (_match, css: string) => {\n    const withoutImports = css.replaceAll(/@import[^;]*;/g, '');\n    const withoutFontRule = withoutImports.replaceAll(/(^|})\\s*text\\s*\\{[^{}]*\\}/g, '$1');\n\n    return `<style>${scopeCssSelectors(withoutFontRule, `#${scopeId}`)}</style>`;\n  });\n};\n\n/**\n * Inline SVG resolves `var(--ant-*)` from the page, but a Blob-loaded copy is an\n * isolated document with no access to them, so the root variables are baked in\n * as literal values before serializing for preview or download.\n */\nexport const toStandaloneSvgString = (element: SVGElement): string => {\n  const clone = element.cloneNode(true) as SVGElement;\n  const computed = globalThis.getComputedStyle(element);\n\n  for (const name of MERMAID_ROOT_VARS) {\n    const value = computed.getPropertyValue(name).trim();\n    if (value) clone.style.setProperty(name, value);\n  }\n\n  const fontFamily = computed.fontFamily;\n  if (fontFamily) clone.style.setProperty('font-family', fontFamily);\n\n  return new XMLSerializer().serializeToString(clone);\n};\n"],"mappings":";;;;;AAIA,MAAa,oBAAoB;CAC/B;CACA;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,MAAM,oBAAoB;AAE1B,MAAM,qBAAqB,KAAa,UACtC,IAAI,WAAW,sBAAsB,QAAQ,MAAc,cAAsB;CAS/E,OAAO,GAAG,KAAK,IARA,UACZ,MAAM,GAAG,CAAC,CACV,KAAK,aAAa,SAAS,KAAK,CAAC,CAAC,CAClC,OAAO,OAAO,CAAC,CAEf,KAAK,aAAc,aAAa,QAAQ,QAAQ,GAAG,MAAM,GAAG,UAAW,CAAC,CACxE,KAAK,IAEgB,EAAE;AAC5B,CAAC;;;;;;;;AASH,MAAa,2BAA2B,KAAa,YAA4B;CAC/E,IAAI,CAAC,KAAK,OAAO;CAIjB,OAFe,IAAI,QAAQ,UAAU,YAAY,QAAQ,EAE7C,CAAC,CAAC,QAAQ,oBAAoB,QAAQ,QAAgB;EAEhE,MAAM,kBADiB,IAAI,WAAW,kBAAkB,EACnB,CAAC,CAAC,WAAW,8BAA8B,IAAI;EAEpF,OAAO,UAAU,kBAAkB,iBAAiB,IAAI,SAAS,EAAE;CACrE,CAAC;AACH;;;;;;AAOA,MAAa,yBAAyB,YAAgC;CACpE,MAAM,QAAQ,QAAQ,UAAU,IAAI;CACpC,MAAM,WAAW,WAAW,iBAAiB,OAAO;CAEpD,KAAK,MAAM,QAAQ,mBAAmB;EACpC,MAAM,QAAQ,SAAS,iBAAiB,IAAI,CAAC,CAAC,KAAK;EACnD,IAAI,OAAO,MAAM,MAAM,YAAY,MAAM,KAAK;CAChD;CAEA,MAAM,aAAa,SAAS;CAC5B,IAAI,YAAY,MAAM,MAAM,YAAY,eAAe,UAAU;CAEjE,OAAO,IAAI,cAAc,CAAC,CAAC,kBAAkB,KAAK;AACpD"}
+{"version":3,"file":"prepareInlineSvg.mjs","names":[],"sources":["../../../src/Mermaid/SyntaxMermaid/prepareInlineSvg.ts"],"sourcesContent":["/**\n * Root custom properties beautiful-mermaid reads; everything else in its\n * stylesheet is derived from these via color-mix().\n */\nexport const MERMAID_ROOT_VARS = [\n  '--bg',\n  '--fg',\n  '--line',\n  '--accent',\n  '--muted',\n  '--surface',\n  '--border',\n];\n\nconst styleBlockPattern = /<style>([\\s\\S]*?)<\\/style>/;\n\nconst scopeCssSelectors = (css: string, scope: string): string =>\n  css.replaceAll(/(^|})([^{}@]+)\\{/g, (_match, tail: string, selectors: string) => {\n    const scoped = selectors\n      .split(',')\n      .map((selector) => selector.trim())\n      .filter(Boolean)\n      // The generated sheet targets `svg` for the root itself, not a descendant\n      .map((selector) => (selector === 'svg' ? scope : `${scope} ${selector}`))\n      .join(', ');\n\n    return `${tail}\\n${scoped} {`;\n  });\n\n/**\n * A <style> element inside inline SVG applies to the whole document, so the\n * generated rules must be scoped to this diagram before being injected. The\n * font @import is dropped because inline rendering would actually issue the\n * Google Fonts request that an <img>-loaded SVG silently blocks, and the bare\n * `text` rule is dropped so page CSS can supply the theme font instead.\n */\nexport const prepareInlineMermaidSvg = (svg: string, scopeId: string): string => {\n  if (!svg) return svg;\n\n  const withId = svg.replace(/<svg\\b/, `<svg id=\"${scopeId}\"`);\n\n  return withId.replace(styleBlockPattern, (_match, css: string) => {\n    const withoutImports = css.replaceAll(/@import[^;]*;/g, '');\n    const withoutFontRule = withoutImports.replaceAll(/(^|})\\s*text\\s*\\{[^{}]*\\}/g, '$1');\n\n    return `<style>${scopeCssSelectors(withoutFontRule, `#${scopeId}`)}</style>`;\n  });\n};\n\n/**\n * Inline SVG resolves `var(--ant-*)` from the page, but a Blob-loaded copy is an\n * isolated document with no access to them, so the root variables are baked in\n * as literal values before serializing for preview or download.\n */\nexport const toStandaloneSvgString = (element: SVGElement): string => {\n  const clone = element.cloneNode(true) as SVGElement;\n  const computed = globalThis.getComputedStyle(element);\n\n  for (const name of MERMAID_ROOT_VARS) {\n    const value = computed.getPropertyValue(name).trim();\n    if (value) clone.style.setProperty(name, value);\n  }\n\n  // The diagram is rendered transparent so it inherits the page surface, but a\n  // standalone copy has nothing behind it: without an explicit fill the viewer\n  // scrim (and whatever it lets through) shows straight through the diagram.\n  const background = computed.getPropertyValue('--bg').trim();\n  if (background) clone.style.setProperty('background', background);\n\n  const fontFamily = computed.fontFamily;\n  if (fontFamily) clone.style.setProperty('font-family', fontFamily);\n\n  return new XMLSerializer().serializeToString(clone);\n};\n"],"mappings":";;;;;AAIA,MAAa,oBAAoB;CAC/B;CACA;CACA;CACA;CACA;CACA;CACA;AACF;AAEA,MAAM,oBAAoB;AAE1B,MAAM,qBAAqB,KAAa,UACtC,IAAI,WAAW,sBAAsB,QAAQ,MAAc,cAAsB;CAS/E,OAAO,GAAG,KAAK,IARA,UACZ,MAAM,GAAG,CAAC,CACV,KAAK,aAAa,SAAS,KAAK,CAAC,CAAC,CAClC,OAAO,OAAO,CAAC,CAEf,KAAK,aAAc,aAAa,QAAQ,QAAQ,GAAG,MAAM,GAAG,UAAW,CAAC,CACxE,KAAK,IAEgB,EAAE;AAC5B,CAAC;;;;;;;;AASH,MAAa,2BAA2B,KAAa,YAA4B;CAC/E,IAAI,CAAC,KAAK,OAAO;CAIjB,OAFe,IAAI,QAAQ,UAAU,YAAY,QAAQ,EAE7C,CAAC,CAAC,QAAQ,oBAAoB,QAAQ,QAAgB;EAEhE,MAAM,kBADiB,IAAI,WAAW,kBAAkB,EACnB,CAAC,CAAC,WAAW,8BAA8B,IAAI;EAEpF,OAAO,UAAU,kBAAkB,iBAAiB,IAAI,SAAS,EAAE;CACrE,CAAC;AACH;;;;;;AAOA,MAAa,yBAAyB,YAAgC;CACpE,MAAM,QAAQ,QAAQ,UAAU,IAAI;CACpC,MAAM,WAAW,WAAW,iBAAiB,OAAO;CAEpD,KAAK,MAAM,QAAQ,mBAAmB;EACpC,MAAM,QAAQ,SAAS,iBAAiB,IAAI,CAAC,CAAC,KAAK;EACnD,IAAI,OAAO,MAAM,MAAM,YAAY,MAAM,KAAK;CAChD;CAKA,MAAM,aAAa,SAAS,iBAAiB,MAAM,CAAC,CAAC,KAAK;CAC1D,IAAI,YAAY,MAAM,MAAM,YAAY,cAAc,UAAU;CAEhE,MAAM,aAAa,SAAS;CAC5B,IAAI,YAAY,MAAM,MAAM,YAAY,eAAe,UAAU;CAEjE,OAAO,IAAI,cAAc,CAAC,CAAC,kBAAkB,KAAK;AACpD"}

package/es/base-ui/ActionIcon/ActionIcon.mjs

@@ -81,7 +81,7 @@ const ActionIcon = memo(({ active, className, classNames, color, danger, disable
 		children: node
 	});
 });
-ActionIcon.displayName = "ActionIcon";
+ActionIcon.displayName = "BaseActionIcon";
 //#endregion
 export { ActionIcon as default };
 

package/es/base-ui/ActionIcon/ActionIcon.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ActionIcon.mjs","names":[],"sources":["../../../src/base-ui/ActionIcon/ActionIcon.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport type { MouseEvent, Ref } from 'react';\nimport { memo, useMemo } from 'react';\n\nimport type { ButtonProps } from '@/base-ui/Button';\nimport Button from '@/base-ui/Button';\nimport Tooltip from '@/base-ui/Tooltip';\nimport Icon from '@/Icon';\n\nimport { variants } from './style';\nimport { type ActionIconProps } from './type';\nimport { calcSize } from './utils';\n\nconst resolveButtonType = (variant: ActionIconProps['variant']) => {\n  if (variant === 'filled') return 'fill' as const;\n  if (variant === 'outlined') return 'default' as const;\n  return 'text' as const;\n};\n\nconst resolveButtonSize = (size: ActionIconProps['size']) => {\n  if (size === 'small') return 'small' as const;\n  if (size === 'large') return 'large' as const;\n  return 'middle' as const;\n};\n\nconst ActionIcon = memo<ActionIconProps>(\n  ({\n    active,\n    className,\n    classNames,\n    color,\n    danger,\n    disabled,\n    fill,\n    fillOpacity,\n    fillRule,\n    focusable,\n    glass,\n    icon,\n    loading,\n    onClick,\n    ref,\n    shadow,\n    size = 'middle',\n    spin: iconSpinning,\n    style,\n    styles,\n    title,\n    tooltipProps,\n    variant = 'borderless',\n    ...rest\n  }) => {\n    const { blockSize, borderRadius } = useMemo(() => calcSize(size), [size]);\n    const popupTriggerAria = rest as {\n      'aria-expanded'?: unknown;\n      'aria-haspopup'?: unknown;\n      'aria-label'?: string;\n    };\n    const isPopupTrigger =\n      popupTriggerAria['aria-haspopup'] !== undefined ||\n      popupTriggerAria['aria-expanded'] !== undefined;\n    const popupTriggerLabel =\n      popupTriggerAria['aria-label'] ??\n      (isPopupTrigger && typeof title === 'string' ? title : undefined);\n\n    const handleClick: ButtonProps['onClick'] = (event) => {\n      onClick?.(event as unknown as MouseEvent<HTMLDivElement>);\n    };\n\n    const iconNode = icon ? (\n      <Icon\n        className={classNames?.icon}\n        color={color}\n        fill={fill}\n        fillOpacity={fillOpacity}\n        fillRule={fillRule}\n        focusable={focusable}\n        icon={icon}\n        size={size}\n        spin={iconSpinning}\n        style={{ pointerEvents: 'none', ...styles?.icon }}\n      />\n    ) : undefined;\n\n    const node = (\n      <Button\n        {...(rest as unknown as ButtonProps)}\n        aria-label={popupTriggerLabel}\n        className={cx(variants({ active, glass, shadow }), classNames?.root, className)}\n        danger={danger}\n        disabled={disabled}\n        htmlType=\"button\"\n        icon={iconNode}\n        loading={loading}\n        ref={ref as unknown as Ref<HTMLButtonElement>}\n        size={resolveButtonSize(size)}\n        tabIndex={disabled ? -1 : 0}\n        type={resolveButtonType(variant)}\n        style={{\n          borderRadius,\n          height: blockSize,\n          width: blockSize,\n          ...styles?.root,\n          ...style,\n        }}\n        onClick={handleClick}\n      />\n    );\n\n    if (!title) return node;\n\n    return (\n      <Tooltip\n        title={title}\n        {...tooltipProps}\n        styles={{\n          ...tooltipProps?.styles,\n          container: { pointerEvents: 'none', ...tooltipProps?.styles?.container },\n        }}\n      >\n        {node}\n      </Tooltip>\n    );\n  },\n);\n\nActionIcon.displayName = 'ActionIcon';\n\nexport default ActionIcon;\n"],"mappings":";;;;;;;;;;AAeA,MAAM,qBAAqB,YAAwC;CACjE,IAAI,YAAY,UAAU,OAAO;CACjC,IAAI,YAAY,YAAY,OAAO;CACnC,OAAO;AACT;AAEA,MAAM,qBAAqB,SAAkC;CAC3D,IAAI,SAAS,SAAS,OAAO;CAC7B,IAAI,SAAS,SAAS,OAAO;CAC7B,OAAO;AACT;AAEA,MAAM,aAAa,MAChB,EACC,QACA,WACA,YACA,OACA,QACA,UACA,MACA,aACA,UACA,WACA,OACA,MACA,SACA,SACA,KACA,QACA,OAAO,UACP,MAAM,cACN,OACA,QACA,OACA,cACA,UAAU,cACV,GAAG,WACC;CACJ,MAAM,EAAE,WAAW,iBAAiB,cAAc,SAAS,IAAI,GAAG,CAAC,IAAI,CAAC;CACxE,MAAM,mBAAmB;CAKzB,MAAM,iBACJ,iBAAiB,qBAAqB,KAAA,KACtC,iBAAiB,qBAAqB,KAAA;CACxC,MAAM,oBACJ,iBAAiB,kBAChB,kBAAkB,OAAO,UAAU,WAAW,QAAQ,KAAA;CAEzD,MAAM,eAAuC,UAAU;EACrD,UAAU,KAA8C;CAC1D;CAEA,MAAM,WAAW,OACf,oBAAC,MAAD;EACE,WAAW,YAAY;EAChB;EACD;EACO;EACH;EACC;EACL;EACA;EACN,MAAM;EACN,OAAO;GAAE,eAAe;GAAQ,GAAG,QAAQ;EAAK;CACjD,CAAA,IACC,KAAA;CAEJ,MAAM,OACJ,oBAAC,QAAD;EACE,GAAK;EACL,cAAY;EACZ,WAAW,GAAG,SAAS;GAAE;GAAQ;GAAO;EAAO,CAAC,GAAG,YAAY,MAAM,SAAS;EACtE;EACE;EACV,UAAS;EACT,MAAM;EACG;EACJ;EACL,MAAM,kBAAkB,IAAI;EAC5B,UAAU,WAAW,KAAK;EAC1B,MAAM,kBAAkB,OAAO;EAC/B,OAAO;GACL;GACA,QAAQ;GACR,OAAO;GACP,GAAG,QAAQ;GACX,GAAG;EACL;EACA,SAAS;CACV,CAAA;CAGH,IAAI,CAAC,OAAO,OAAO;CAEnB,OACE,oBAAC,SAAD;EACS;EACP,GAAI;EACJ,QAAQ;GACN,GAAG,cAAc;GACjB,WAAW;IAAE,eAAe;IAAQ,GAAG,cAAc,QAAQ;GAAU;EACzE;EAEC,UAAA;CACM,CAAA;AAEb,CACF;AAEA,WAAW,cAAc"}
+{"version":3,"file":"ActionIcon.mjs","names":[],"sources":["../../../src/base-ui/ActionIcon/ActionIcon.tsx"],"sourcesContent":["'use client';\n\nimport { cx } from 'antd-style';\nimport type { MouseEvent, Ref } from 'react';\nimport { memo, useMemo } from 'react';\n\nimport type { ButtonProps } from '@/base-ui/Button';\nimport Button from '@/base-ui/Button';\nimport Tooltip from '@/base-ui/Tooltip';\nimport Icon from '@/Icon';\n\nimport { variants } from './style';\nimport { type ActionIconProps } from './type';\nimport { calcSize } from './utils';\n\nconst resolveButtonType = (variant: ActionIconProps['variant']) => {\n  if (variant === 'filled') return 'fill' as const;\n  if (variant === 'outlined') return 'default' as const;\n  return 'text' as const;\n};\n\nconst resolveButtonSize = (size: ActionIconProps['size']) => {\n  if (size === 'small') return 'small' as const;\n  if (size === 'large') return 'large' as const;\n  return 'middle' as const;\n};\n\nconst ActionIcon = memo<ActionIconProps>(\n  ({\n    active,\n    className,\n    classNames,\n    color,\n    danger,\n    disabled,\n    fill,\n    fillOpacity,\n    fillRule,\n    focusable,\n    glass,\n    icon,\n    loading,\n    onClick,\n    ref,\n    shadow,\n    size = 'middle',\n    spin: iconSpinning,\n    style,\n    styles,\n    title,\n    tooltipProps,\n    variant = 'borderless',\n    ...rest\n  }) => {\n    const { blockSize, borderRadius } = useMemo(() => calcSize(size), [size]);\n    const popupTriggerAria = rest as {\n      'aria-expanded'?: unknown;\n      'aria-haspopup'?: unknown;\n      'aria-label'?: string;\n    };\n    const isPopupTrigger =\n      popupTriggerAria['aria-haspopup'] !== undefined ||\n      popupTriggerAria['aria-expanded'] !== undefined;\n    const popupTriggerLabel =\n      popupTriggerAria['aria-label'] ??\n      (isPopupTrigger && typeof title === 'string' ? title : undefined);\n\n    const handleClick: ButtonProps['onClick'] = (event) => {\n      onClick?.(event as unknown as MouseEvent<HTMLDivElement>);\n    };\n\n    const iconNode = icon ? (\n      <Icon\n        className={classNames?.icon}\n        color={color}\n        fill={fill}\n        fillOpacity={fillOpacity}\n        fillRule={fillRule}\n        focusable={focusable}\n        icon={icon}\n        size={size}\n        spin={iconSpinning}\n        style={{ pointerEvents: 'none', ...styles?.icon }}\n      />\n    ) : undefined;\n\n    const node = (\n      <Button\n        {...(rest as unknown as ButtonProps)}\n        aria-label={popupTriggerLabel}\n        className={cx(variants({ active, glass, shadow }), classNames?.root, className)}\n        danger={danger}\n        disabled={disabled}\n        htmlType=\"button\"\n        icon={iconNode}\n        loading={loading}\n        ref={ref as unknown as Ref<HTMLButtonElement>}\n        size={resolveButtonSize(size)}\n        tabIndex={disabled ? -1 : 0}\n        type={resolveButtonType(variant)}\n        style={{\n          borderRadius,\n          height: blockSize,\n          width: blockSize,\n          ...styles?.root,\n          ...style,\n        }}\n        onClick={handleClick}\n      />\n    );\n\n    if (!title) return node;\n\n    return (\n      <Tooltip\n        title={title}\n        {...tooltipProps}\n        styles={{\n          ...tooltipProps?.styles,\n          container: { pointerEvents: 'none', ...tooltipProps?.styles?.container },\n        }}\n      >\n        {node}\n      </Tooltip>\n    );\n  },\n);\n\nActionIcon.displayName = 'BaseActionIcon';\n\nexport default ActionIcon;\n"],"mappings":";;;;;;;;;;AAeA,MAAM,qBAAqB,YAAwC;CACjE,IAAI,YAAY,UAAU,OAAO;CACjC,IAAI,YAAY,YAAY,OAAO;CACnC,OAAO;AACT;AAEA,MAAM,qBAAqB,SAAkC;CAC3D,IAAI,SAAS,SAAS,OAAO;CAC7B,IAAI,SAAS,SAAS,OAAO;CAC7B,OAAO;AACT;AAEA,MAAM,aAAa,MAChB,EACC,QACA,WACA,YACA,OACA,QACA,UACA,MACA,aACA,UACA,WACA,OACA,MACA,SACA,SACA,KACA,QACA,OAAO,UACP,MAAM,cACN,OACA,QACA,OACA,cACA,UAAU,cACV,GAAG,WACC;CACJ,MAAM,EAAE,WAAW,iBAAiB,cAAc,SAAS,IAAI,GAAG,CAAC,IAAI,CAAC;CACxE,MAAM,mBAAmB;CAKzB,MAAM,iBACJ,iBAAiB,qBAAqB,KAAA,KACtC,iBAAiB,qBAAqB,KAAA;CACxC,MAAM,oBACJ,iBAAiB,kBAChB,kBAAkB,OAAO,UAAU,WAAW,QAAQ,KAAA;CAEzD,MAAM,eAAuC,UAAU;EACrD,UAAU,KAA8C;CAC1D;CAEA,MAAM,WAAW,OACf,oBAAC,MAAD;EACE,WAAW,YAAY;EAChB;EACD;EACO;EACH;EACC;EACL;EACA;EACN,MAAM;EACN,OAAO;GAAE,eAAe;GAAQ,GAAG,QAAQ;EAAK;CACjD,CAAA,IACC,KAAA;CAEJ,MAAM,OACJ,oBAAC,QAAD;EACE,GAAK;EACL,cAAY;EACZ,WAAW,GAAG,SAAS;GAAE;GAAQ;GAAO;EAAO,CAAC,GAAG,YAAY,MAAM,SAAS;EACtE;EACE;EACV,UAAS;EACT,MAAM;EACG;EACJ;EACL,MAAM,kBAAkB,IAAI;EAC5B,UAAU,WAAW,KAAK;EAC1B,MAAM,kBAAkB,OAAO;EAC/B,OAAO;GACL;GACA,QAAQ;GACR,OAAO;GACP,GAAG,QAAQ;GACX,GAAG;EACL;EACA,SAAS;CACV,CAAA;CAGH,IAAI,CAAC,OAAO,OAAO;CAEnB,OACE,oBAAC,SAAD;EACS;EACP,GAAI;EACJ,QAAQ;GACN,GAAG,cAAc;GACjB,WAAW;IAAE,eAAe;IAAQ,GAAG,cAAc,QAAQ;GAAU;EACzE;EAEC,UAAA;CACM,CAAA;AAEb,CACF;AAEA,WAAW,cAAc"}

package/es/base-ui/Input/style.d.mts

@@ -24,7 +24,7 @@ declare const styles: {
 declare const rootVariants: (props?: ({
   shadow?: boolean | null | undefined;
   size?: "large" | "middle" | "small" | null | undefined;
-  variant?: "filled" | "borderless" | "outlined" | null | undefined;
+  variant?: "filled" | "outlined" | "borderless" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 //#endregion
 export { rootVariants, styles };

package/es/hooks/useNativeButton.mjs

@@ -12,6 +12,7 @@ const NATIVE_BUTTON_MAP = {
 	Alert: false,
 	Avatar: false,
 	AvatarGroup: false,
+	BaseActionIcon: true,
 	BaseButton: true,
 	Block: false,
 	BottomGradientButton: true,

package/es/hooks/useNativeButton.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useNativeButton.mjs","names":[],"sources":["../../src/hooks/useNativeButton.ts"],"sourcesContent":["import { isValidElement, type ReactElement, type ReactNode, useMemo } from 'react';\n\nexport interface UseNativeButtonOptions {\n  /**\n   * The children element that will be used as the trigger\n   */\n  children: ReactNode;\n  /**\n   * User-provided nativeButton prop\n   */\n  nativeButton?: boolean;\n  /**\n   * Additional nativeButton from trigger props (for DropdownMenu)\n   */\n  triggerNativeButton?: boolean;\n}\n\nexport interface UseNativeButtonResult {\n  /**\n   * Whether the trigger element is a native button\n   */\n  isNativeButtonTriggerElement: boolean;\n  /**\n   * The resolved nativeButton value to pass to Base UI components\n   */\n  resolvedNativeButton: boolean | undefined;\n}\n\n/**\n * Map of component displayNames to their nativeButton values.\n * Components that render native <button> elements should be true,\n * components that render non-button elements should be false.\n */\nconst NATIVE_BUTTON_MAP: Record<string, boolean> = {\n  A: false,\n  ActionIcon: false,\n  ActionIconGroup: false,\n  Alert: false,\n  Avatar: false,\n  AvatarGroup: false,\n  BaseButton: true,\n  Block: false,\n  BottomGradientButton: true,\n  Burger: false,\n  Button: true,\n  Center: false,\n  Checkbox: false,\n  CheckboxGroup: false,\n  Collapse: false,\n  ColorSwatches: false,\n  CopyButton: false,\n  DownloadButton: false,\n  EditableText: false,\n  Empty: false,\n  FileTypeIcon: false,\n  Flexbox: false,\n  FluentEmoji: false,\n  GradientButton: true,\n  Highlighter: false,\n  Hotkey: false,\n  Icon: false,\n  Image: false,\n  Img: false,\n  Input: false,\n  InputNumber: false,\n  InputPassword: false,\n  List: false,\n  ListItem: false,\n  Select: false,\n  Switch: false,\n  Markdown: false,\n  MaterialFileTypeIcon: false,\n  Segmented: false,\n  Skeleton: false,\n  SkeletonAvatar: false,\n  SkeletonBlock: false,\n  SkeletonButton: false,\n  SkeletonParagraph: false,\n  SkeletonTags: false,\n  SkeletonTitle: false,\n  Snippet: false,\n  Tag: false,\n  Text: false,\n  TextArea: false,\n  ThemeSwitch: false,\n  Video: false,\n};\n\n/**\n * Get the displayName of a React component from an element.\n * Handles function components, forwardRef, memo, etc.\n */\nfunction getComponentDisplayName(element: ReactElement): string | undefined {\n  const type = element.type;\n\n  if (typeof type === 'string') return undefined;\n\n  if (typeof type === 'function') {\n    return (type as any).displayName || type.name;\n  }\n\n  if (typeof type === 'object' && type !== null) {\n    // Handle forwardRef, memo, etc.\n    const displayName =\n      (type as any).displayName ||\n      (type as any).render?.displayName ||\n      (type as any).render?.name ||\n      (type as any).type?.displayName ||\n      (type as any).type?.name;\n    return displayName;\n  }\n\n  return undefined;\n}\n\n/**\n * Hook to resolve nativeButton prop for Base UI trigger components.\n *\n * When using `render`, Base UI expects the rendered element to be a native <button> by default.\n * If we can infer it's not, we opt out to avoid warnings (users can still override via `nativeButton`).\n */\nexport function useNativeButton({\n  children,\n  nativeButton,\n  triggerNativeButton,\n}: UseNativeButtonOptions): UseNativeButtonResult {\n  const isNativeButtonTriggerElement = useMemo(() => {\n    if (!isValidElement(children)) return false;\n    return typeof children.type === 'string' && children.type === 'button';\n  }, [children]);\n\n  const resolvedNativeButton = useMemo(() => {\n    // User-provided nativeButton takes highest priority\n    if (nativeButton !== undefined) return nativeButton;\n    // Trigger props nativeButton (for DropdownMenu) takes second priority\n    if (triggerNativeButton !== undefined) return triggerNativeButton;\n    // If it's a native button element, return true\n    if (isNativeButtonTriggerElement) return true;\n    // If children is not a valid element, let Base UI decide\n    if (!isValidElement(children)) return undefined;\n    // If it's a string type but not a button (e.g., 'div'), return false\n    if (typeof children.type === 'string') return false;\n\n    // Check if it's a known component from the library\n    const displayName = getComponentDisplayName(children);\n    if (displayName && displayName in NATIVE_BUTTON_MAP) {\n      return NATIVE_BUTTON_MAP[displayName];\n    }\n\n    // For unknown React components, default to false to avoid warnings\n    // since most custom components don't render native buttons\n    return false;\n  }, [children, isNativeButtonTriggerElement, nativeButton, triggerNativeButton]);\n\n  return {\n    isNativeButtonTriggerElement,\n    resolvedNativeButton,\n  };\n}\n"],"mappings":";;;;;;;AAiCA,MAAM,oBAA6C;CACjD,GAAG;CACH,YAAY;CACZ,iBAAiB;CACjB,OAAO;CACP,QAAQ;CACR,aAAa;CACb,YAAY;CACZ,OAAO;CACP,sBAAsB;CACtB,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,UAAU;CACV,eAAe;CACf,UAAU;CACV,eAAe;CACf,YAAY;CACZ,gBAAgB;CAChB,cAAc;CACd,OAAO;CACP,cAAc;CACd,SAAS;CACT,aAAa;CACb,gBAAgB;CAChB,aAAa;CACb,QAAQ;CACR,MAAM;CACN,OAAO;CACP,KAAK;CACL,OAAO;CACP,aAAa;CACb,eAAe;CACf,MAAM;CACN,UAAU;CACV,QAAQ;CACR,QAAQ;CACR,UAAU;CACV,sBAAsB;CACtB,WAAW;CACX,UAAU;CACV,gBAAgB;CAChB,eAAe;CACf,gBAAgB;CAChB,mBAAmB;CACnB,cAAc;CACd,eAAe;CACf,SAAS;CACT,KAAK;CACL,MAAM;CACN,UAAU;CACV,aAAa;CACb,OAAO;AACT;;;;;AAMA,SAAS,wBAAwB,SAA2C;CAC1E,MAAM,OAAO,QAAQ;CAErB,IAAI,OAAO,SAAS,UAAU,OAAO,KAAA;CAErC,IAAI,OAAO,SAAS,YAClB,OAAQ,KAAa,eAAe,KAAK;CAG3C,IAAI,OAAO,SAAS,YAAY,SAAS,MAQvC,OALG,KAAa,eACb,KAAa,QAAQ,eACrB,KAAa,QAAQ,QACrB,KAAa,MAAM,eACnB,KAAa,MAAM;AAK1B;;;;;;;AAQA,SAAgB,gBAAgB,EAC9B,UACA,cACA,uBACgD;CAChD,MAAM,+BAA+B,cAAc;EACjD,IAAI,CAAC,eAAe,QAAQ,GAAG,OAAO;EACtC,OAAO,OAAO,SAAS,SAAS,YAAY,SAAS,SAAS;CAChE,GAAG,CAAC,QAAQ,CAAC;CAyBb,OAAO;EACL;EACA,sBAzB2B,cAAc;GAEzC,IAAI,iBAAiB,KAAA,GAAW,OAAO;GAEvC,IAAI,wBAAwB,KAAA,GAAW,OAAO;GAE9C,IAAI,8BAA8B,OAAO;GAEzC,IAAI,CAAC,eAAe,QAAQ,GAAG,OAAO,KAAA;GAEtC,IAAI,OAAO,SAAS,SAAS,UAAU,OAAO;GAG9C,MAAM,cAAc,wBAAwB,QAAQ;GACpD,IAAI,eAAe,eAAe,mBAChC,OAAO,kBAAkB;GAK3B,OAAO;EACT,GAAG;GAAC;GAAU;GAA8B;GAAc;EAAmB,CAIxD;CACrB;AACF"}
+{"version":3,"file":"useNativeButton.mjs","names":[],"sources":["../../src/hooks/useNativeButton.ts"],"sourcesContent":["import { isValidElement, type ReactElement, type ReactNode, useMemo } from 'react';\n\nexport interface UseNativeButtonOptions {\n  /**\n   * The children element that will be used as the trigger\n   */\n  children: ReactNode;\n  /**\n   * User-provided nativeButton prop\n   */\n  nativeButton?: boolean;\n  /**\n   * Additional nativeButton from trigger props (for DropdownMenu)\n   */\n  triggerNativeButton?: boolean;\n}\n\nexport interface UseNativeButtonResult {\n  /**\n   * Whether the trigger element is a native button\n   */\n  isNativeButtonTriggerElement: boolean;\n  /**\n   * The resolved nativeButton value to pass to Base UI components\n   */\n  resolvedNativeButton: boolean | undefined;\n}\n\n/**\n * Map of component displayNames to their nativeButton values.\n * Components that render native <button> elements should be true,\n * components that render non-button elements should be false.\n */\nconst NATIVE_BUTTON_MAP: Record<string, boolean> = {\n  A: false,\n  ActionIcon: false,\n  ActionIconGroup: false,\n  Alert: false,\n  Avatar: false,\n  AvatarGroup: false,\n  BaseActionIcon: true,\n  BaseButton: true,\n  Block: false,\n  BottomGradientButton: true,\n  Burger: false,\n  Button: true,\n  Center: false,\n  Checkbox: false,\n  CheckboxGroup: false,\n  Collapse: false,\n  ColorSwatches: false,\n  CopyButton: false,\n  DownloadButton: false,\n  EditableText: false,\n  Empty: false,\n  FileTypeIcon: false,\n  Flexbox: false,\n  FluentEmoji: false,\n  GradientButton: true,\n  Highlighter: false,\n  Hotkey: false,\n  Icon: false,\n  Image: false,\n  Img: false,\n  Input: false,\n  InputNumber: false,\n  InputPassword: false,\n  List: false,\n  ListItem: false,\n  Select: false,\n  Switch: false,\n  Markdown: false,\n  MaterialFileTypeIcon: false,\n  Segmented: false,\n  Skeleton: false,\n  SkeletonAvatar: false,\n  SkeletonBlock: false,\n  SkeletonButton: false,\n  SkeletonParagraph: false,\n  SkeletonTags: false,\n  SkeletonTitle: false,\n  Snippet: false,\n  Tag: false,\n  Text: false,\n  TextArea: false,\n  ThemeSwitch: false,\n  Video: false,\n};\n\n/**\n * Get the displayName of a React component from an element.\n * Handles function components, forwardRef, memo, etc.\n */\nfunction getComponentDisplayName(element: ReactElement): string | undefined {\n  const type = element.type;\n\n  if (typeof type === 'string') return undefined;\n\n  if (typeof type === 'function') {\n    return (type as any).displayName || type.name;\n  }\n\n  if (typeof type === 'object' && type !== null) {\n    // Handle forwardRef, memo, etc.\n    const displayName =\n      (type as any).displayName ||\n      (type as any).render?.displayName ||\n      (type as any).render?.name ||\n      (type as any).type?.displayName ||\n      (type as any).type?.name;\n    return displayName;\n  }\n\n  return undefined;\n}\n\n/**\n * Hook to resolve nativeButton prop for Base UI trigger components.\n *\n * When using `render`, Base UI expects the rendered element to be a native <button> by default.\n * If we can infer it's not, we opt out to avoid warnings (users can still override via `nativeButton`).\n */\nexport function useNativeButton({\n  children,\n  nativeButton,\n  triggerNativeButton,\n}: UseNativeButtonOptions): UseNativeButtonResult {\n  const isNativeButtonTriggerElement = useMemo(() => {\n    if (!isValidElement(children)) return false;\n    return typeof children.type === 'string' && children.type === 'button';\n  }, [children]);\n\n  const resolvedNativeButton = useMemo(() => {\n    // User-provided nativeButton takes highest priority\n    if (nativeButton !== undefined) return nativeButton;\n    // Trigger props nativeButton (for DropdownMenu) takes second priority\n    if (triggerNativeButton !== undefined) return triggerNativeButton;\n    // If it's a native button element, return true\n    if (isNativeButtonTriggerElement) return true;\n    // If children is not a valid element, let Base UI decide\n    if (!isValidElement(children)) return undefined;\n    // If it's a string type but not a button (e.g., 'div'), return false\n    if (typeof children.type === 'string') return false;\n\n    // Check if it's a known component from the library\n    const displayName = getComponentDisplayName(children);\n    if (displayName && displayName in NATIVE_BUTTON_MAP) {\n      return NATIVE_BUTTON_MAP[displayName];\n    }\n\n    // For unknown React components, default to false to avoid warnings\n    // since most custom components don't render native buttons\n    return false;\n  }, [children, isNativeButtonTriggerElement, nativeButton, triggerNativeButton]);\n\n  return {\n    isNativeButtonTriggerElement,\n    resolvedNativeButton,\n  };\n}\n"],"mappings":";;;;;;;AAiCA,MAAM,oBAA6C;CACjD,GAAG;CACH,YAAY;CACZ,iBAAiB;CACjB,OAAO;CACP,QAAQ;CACR,aAAa;CACb,gBAAgB;CAChB,YAAY;CACZ,OAAO;CACP,sBAAsB;CACtB,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,UAAU;CACV,eAAe;CACf,UAAU;CACV,eAAe;CACf,YAAY;CACZ,gBAAgB;CAChB,cAAc;CACd,OAAO;CACP,cAAc;CACd,SAAS;CACT,aAAa;CACb,gBAAgB;CAChB,aAAa;CACb,QAAQ;CACR,MAAM;CACN,OAAO;CACP,KAAK;CACL,OAAO;CACP,aAAa;CACb,eAAe;CACf,MAAM;CACN,UAAU;CACV,QAAQ;CACR,QAAQ;CACR,UAAU;CACV,sBAAsB;CACtB,WAAW;CACX,UAAU;CACV,gBAAgB;CAChB,eAAe;CACf,gBAAgB;CAChB,mBAAmB;CACnB,cAAc;CACd,eAAe;CACf,SAAS;CACT,KAAK;CACL,MAAM;CACN,UAAU;CACV,aAAa;CACb,OAAO;AACT;;;;;AAMA,SAAS,wBAAwB,SAA2C;CAC1E,MAAM,OAAO,QAAQ;CAErB,IAAI,OAAO,SAAS,UAAU,OAAO,KAAA;CAErC,IAAI,OAAO,SAAS,YAClB,OAAQ,KAAa,eAAe,KAAK;CAG3C,IAAI,OAAO,SAAS,YAAY,SAAS,MAQvC,OALG,KAAa,eACb,KAAa,QAAQ,eACrB,KAAa,QAAQ,QACrB,KAAa,MAAM,eACnB,KAAa,MAAM;AAK1B;;;;;;;AAQA,SAAgB,gBAAgB,EAC9B,UACA,cACA,uBACgD;CAChD,MAAM,+BAA+B,cAAc;EACjD,IAAI,CAAC,eAAe,QAAQ,GAAG,OAAO;EACtC,OAAO,OAAO,SAAS,SAAS,YAAY,SAAS,SAAS;CAChE,GAAG,CAAC,QAAQ,CAAC;CAyBb,OAAO;EACL;EACA,sBAzB2B,cAAc;GAEzC,IAAI,iBAAiB,KAAA,GAAW,OAAO;GAEvC,IAAI,wBAAwB,KAAA,GAAW,OAAO;GAE9C,IAAI,8BAA8B,OAAO;GAEzC,IAAI,CAAC,eAAe,QAAQ,GAAG,OAAO,KAAA;GAEtC,IAAI,OAAO,SAAS,SAAS,UAAU,OAAO;GAG9C,MAAM,cAAc,wBAAwB,QAAQ;GACpD,IAAI,eAAe,eAAe,mBAChC,OAAO,kBAAkB;GAK3B,OAAO;EACT,GAAG;GAAC;GAAU;GAA8B;GAAc;EAAmB,CAIxD;CACrB;AACF"}

package/es/static-css/baseline.mjs

@@ -14,7 +14,6 @@ const lobeUiAntdBaseline = [
 	"dropdown",
 	"empty",
 	"form",
-	"image",
 	"input",
 	"input-number",
 	"input-textarea",

package/es/static-css/baseline.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"baseline.mjs","names":[],"sources":["../../src/static-css/baseline.ts"],"sourcesContent":["import type { AntdProbeName } from './registry';\n\n// The antd components @lobehub/ui internals can render. Kept in sync with the\n// source tree by baseline.test.ts — a failure there means this list must change.\nexport const lobeUiAntdBaseline: AntdProbeName[] = [\n  'alert',\n  'anchor',\n  'app',\n  'auto-complete',\n  'avatar',\n  'button',\n  'collapse',\n  'color-picker',\n  'date-picker',\n  'divider',\n  'drawer',\n  'dropdown',\n  'empty',\n  'form',\n  'image',\n  'input',\n  'input-number',\n  'input-textarea',\n  'menu',\n  'modal',\n  'popover',\n  'progress',\n  'segmented',\n  'select',\n  'skeleton',\n  'slider',\n  'space',\n  'tabs',\n  'tag',\n  'tag-preset',\n  'tag-status',\n  'upload',\n];\n"],"mappings":";AAIA,MAAa,qBAAsC;CACjD;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF"}
+{"version":3,"file":"baseline.mjs","names":[],"sources":["../../src/static-css/baseline.ts"],"sourcesContent":["import type { AntdProbeName } from './registry';\n\n// The antd components @lobehub/ui internals can render. Kept in sync with the\n// source tree by baseline.test.ts — a failure there means this list must change.\nexport const lobeUiAntdBaseline: AntdProbeName[] = [\n  'alert',\n  'anchor',\n  'app',\n  'auto-complete',\n  'avatar',\n  'button',\n  'collapse',\n  'color-picker',\n  'date-picker',\n  'divider',\n  'drawer',\n  'dropdown',\n  'empty',\n  'form',\n  'input',\n  'input-number',\n  'input-textarea',\n  'menu',\n  'modal',\n  'popover',\n  'progress',\n  'segmented',\n  'select',\n  'skeleton',\n  'slider',\n  'space',\n  'tabs',\n  'tag',\n  'tag-preset',\n  'tag-status',\n  'upload',\n];\n"],"mappings":";AAIA,MAAa,qBAAsC;CACjD;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/ui",
-  "version": "5.33.0",
+  "version": "5.33.2",
   "description": "Lobe UI is an open-source UI component library for building AIGC web apps",
   "keywords": [
     "lobehub",