@fumadocs/base-ui 16.7.12 → 16.7.14

package/dist/node_modules/.pnpm/react-medium-image-zoom@5.4.3_react-dom@19.2.5_react@19.2.5__react@19.2.5/node_modules/react-medium-image-zoom/dist/utils.js

@@ -0,0 +1,372 @@
+//#region ../../node_modules/.pnpm/react-medium-image-zoom@5.4.3_react-dom@19.2.5_react@19.2.5__react@19.2.5/node_modules/react-medium-image-zoom/dist/utils.js
+function isElement(el) {
+	if (typeof Element === "undefined") return false;
+	return el instanceof Element;
+}
+const testElType = (type, el) => isElement(el) && el.tagName.toUpperCase() === type;
+const testDiv = (el) => testElType("DIV", el) || testElType("SPAN", el);
+const testImg = (el) => testElType("IMG", el);
+const testImgLoaded = (el) => el.complete && el.naturalHeight !== 0;
+const testSvg = (el) => testElType("SVG", el);
+const getScaleToWindow = ({ height, offset, width }) => Math.min((window.innerWidth - offset * 2) / width, (window.innerHeight - offset * 2) / height);
+const getScaleToWindowMax = ({ containerHeight, containerWidth, offset, targetHeight, targetWidth }) => {
+	const scale = getScaleToWindow({
+		height: targetHeight,
+		offset,
+		width: targetWidth
+	});
+	const ratio = targetWidth > targetHeight ? targetWidth / containerWidth : targetHeight / containerHeight;
+	return scale > 1 ? ratio : scale * ratio;
+};
+const getScale = ({ containerHeight, containerWidth, hasScalableSrc, offset, targetHeight, targetWidth }) => {
+	if (containerHeight === 0 || containerWidth === 0) return 1;
+	return !hasScalableSrc && targetHeight !== 0 && targetWidth !== 0 ? getScaleToWindowMax({
+		containerHeight,
+		containerWidth,
+		offset,
+		targetHeight,
+		targetWidth
+	}) : getScaleToWindow({
+		height: containerHeight,
+		offset,
+		width: containerWidth
+	});
+};
+const URL_REGEX = /url(?:\(['"]?)(?<url>.*?)(?:['"]?\))/;
+const getImgSrc = (imgEl) => {
+	if (imgEl !== null) {
+		if (testImg(imgEl)) return imgEl.currentSrc === "" ? void 0 : imgEl.currentSrc;
+		else if (testDiv(imgEl)) {
+			const { backgroundImage: bgImg } = window.getComputedStyle(imgEl);
+			if (bgImg !== "") return URL_REGEX.exec(bgImg)?.[1];
+		}
+	}
+};
+const getImgAlt = (imgEl) => {
+	if (imgEl !== null) if (testImg(imgEl)) return imgEl.alt;
+	else return imgEl.getAttribute("aria-label") ?? void 0;
+};
+const getImgRegularStyle = ({ containerHeight, containerLeft, containerTop, containerWidth, hasScalableSrc, offset, targetHeight, targetWidth }) => {
+	const scale = getScale({
+		containerHeight,
+		containerWidth,
+		hasScalableSrc,
+		offset,
+		targetHeight,
+		targetWidth
+	});
+	return {
+		top: containerTop,
+		left: containerLeft,
+		width: containerWidth * scale,
+		height: containerHeight * scale,
+		transform: `translate(0,0) scale(${1 / scale})`
+	};
+};
+const parsePosition = ({ position, relativeNum }) => {
+	const positionNum = parseFloat(position);
+	return position.endsWith("%") ? relativeNum * positionNum / 100 : positionNum;
+};
+const getImgObjectFitStyle = ({ containerHeight, containerLeft, containerTop, containerWidth, hasScalableSrc, objectFit: objectFitParam, objectPosition, offset, targetHeight, targetWidth }) => {
+	let resolvedObjectFit = objectFitParam;
+	if (resolvedObjectFit === "scale-down") if (targetWidth <= containerWidth && targetHeight <= containerHeight) resolvedObjectFit = "none";
+	else resolvedObjectFit = "contain";
+	if (resolvedObjectFit === "cover" || resolvedObjectFit === "contain") {
+		const widthRatio = containerWidth / targetWidth;
+		const heightRatio = containerHeight / targetHeight;
+		const ratio = resolvedObjectFit === "cover" ? Math.max(widthRatio, heightRatio) : Math.min(widthRatio, heightRatio);
+		const [posLeft = "50%", posTop = "50%"] = objectPosition.split(" ");
+		const posX = parsePosition({
+			position: posLeft,
+			relativeNum: containerWidth - targetWidth * ratio
+		});
+		const posY = parsePosition({
+			position: posTop,
+			relativeNum: containerHeight - targetHeight * ratio
+		});
+		const scale = getScale({
+			containerHeight: targetHeight * ratio,
+			containerWidth: targetWidth * ratio,
+			hasScalableSrc,
+			offset,
+			targetHeight,
+			targetWidth
+		});
+		return {
+			top: containerTop + posY,
+			left: containerLeft + posX,
+			width: targetWidth * ratio * scale,
+			height: targetHeight * ratio * scale,
+			transform: `translate(0,0) scale(${1 / scale})`
+		};
+	} else if (resolvedObjectFit === "none") {
+		const [posLeft = "50%", posTop = "50%"] = objectPosition.split(" ");
+		const posX = parsePosition({
+			position: posLeft,
+			relativeNum: containerWidth - targetWidth
+		});
+		const posY = parsePosition({
+			position: posTop,
+			relativeNum: containerHeight - targetHeight
+		});
+		const scale = getScale({
+			containerHeight: targetHeight,
+			containerWidth: targetWidth,
+			hasScalableSrc,
+			offset,
+			targetHeight,
+			targetWidth
+		});
+		return {
+			top: containerTop + posY,
+			left: containerLeft + posX,
+			width: targetWidth * scale,
+			height: targetHeight * scale,
+			transform: `translate(0,0) scale(${1 / scale})`
+		};
+	} else if (resolvedObjectFit === "fill") {
+		const widthRatio = containerWidth / targetWidth;
+		const heightRatio = containerHeight / targetHeight;
+		const ratio = Math.max(widthRatio, heightRatio);
+		const scale = getScale({
+			containerHeight: targetHeight * ratio,
+			containerWidth: targetWidth * ratio,
+			hasScalableSrc,
+			offset,
+			targetHeight,
+			targetWidth
+		});
+		return {
+			width: containerWidth * scale,
+			height: containerHeight * scale,
+			transform: `translate(0,0) scale(${1 / scale})`
+		};
+	} else return {};
+};
+const getDivImgStyle = ({ backgroundPosition, backgroundSize, containerHeight, containerLeft, containerTop, containerWidth, hasScalableSrc, offset, targetHeight, targetWidth }) => {
+	if (backgroundSize === "cover" || backgroundSize === "contain") {
+		const widthRatio = containerWidth / targetWidth;
+		const heightRatio = containerHeight / targetHeight;
+		const ratio = backgroundSize === "cover" ? Math.max(widthRatio, heightRatio) : Math.min(widthRatio, heightRatio);
+		const [posLeft = "50%", posTop = "50%"] = backgroundPosition.split(" ");
+		const posX = parsePosition({
+			position: posLeft,
+			relativeNum: containerWidth - targetWidth * ratio
+		});
+		const posY = parsePosition({
+			position: posTop,
+			relativeNum: containerHeight - targetHeight * ratio
+		});
+		const scale = getScale({
+			containerHeight: targetHeight * ratio,
+			containerWidth: targetWidth * ratio,
+			hasScalableSrc,
+			offset,
+			targetHeight,
+			targetWidth
+		});
+		return {
+			top: containerTop + posY,
+			left: containerLeft + posX,
+			width: targetWidth * ratio * scale,
+			height: targetHeight * ratio * scale,
+			transform: `translate(0,0) scale(${1 / scale})`
+		};
+	} else if (backgroundSize === "auto") {
+		const [posLeft = "50%", posTop = "50%"] = backgroundPosition.split(" ");
+		const posX = parsePosition({
+			position: posLeft,
+			relativeNum: containerWidth - targetWidth
+		});
+		const posY = parsePosition({
+			position: posTop,
+			relativeNum: containerHeight - targetHeight
+		});
+		const scale = getScale({
+			containerHeight: targetHeight,
+			containerWidth: targetWidth,
+			hasScalableSrc,
+			offset,
+			targetHeight,
+			targetWidth
+		});
+		return {
+			top: containerTop + posY,
+			left: containerLeft + posX,
+			width: targetWidth * scale,
+			height: targetHeight * scale,
+			transform: `translate(0,0) scale(${1 / scale})`
+		};
+	} else {
+		const [sizeW = "50%", sizeH = "50%"] = backgroundSize.split(" ");
+		const sizeWidth = parsePosition({
+			position: sizeW,
+			relativeNum: containerWidth
+		});
+		const sizeHeight = parsePosition({
+			position: sizeH,
+			relativeNum: containerHeight
+		});
+		const widthRatio = sizeWidth / targetWidth;
+		const heightRatio = sizeHeight / targetHeight;
+		const ratio = Math.min(widthRatio, heightRatio);
+		const [posLeft = "50%", posTop = "50%"] = backgroundPosition.split(" ");
+		const posX = parsePosition({
+			position: posLeft,
+			relativeNum: containerWidth - targetWidth * ratio
+		});
+		const posY = parsePosition({
+			position: posTop,
+			relativeNum: containerHeight - targetHeight * ratio
+		});
+		const scale = getScale({
+			containerHeight: targetHeight * ratio,
+			containerWidth: targetWidth * ratio,
+			hasScalableSrc,
+			offset,
+			targetHeight,
+			targetWidth
+		});
+		return {
+			top: containerTop + posY,
+			left: containerLeft + posX,
+			width: targetWidth * ratio * scale,
+			height: targetHeight * ratio * scale,
+			transform: `translate(0,0) scale(${1 / scale})`
+		};
+	}
+};
+const SRC_SVG_REGEX = /\.svg$/i;
+const getStyleModalImg = ({ hasZoomImg, imgSrc, isSvg, isZoomed, loadedImgEl, offset, shouldRefresh, targetEl }) => {
+	const hasScalableSrc = isSvg || imgSrc?.slice(0, 18) === "data:image/svg+xml" || hasZoomImg || imgSrc !== void 0 && SRC_SVG_REGEX.test(imgSrc);
+	const imgRect = targetEl.getBoundingClientRect();
+	const targetElComputedStyle = window.getComputedStyle(targetEl);
+	const isDivImg = loadedImgEl != null && testDiv(targetEl);
+	const isImgObjectFit = loadedImgEl != null && !isDivImg;
+	const targetHeight = loadedImgEl != null && loadedImgEl.naturalHeight !== 0 ? loadedImgEl.naturalHeight : imgRect.height;
+	const targetWidth = loadedImgEl != null && loadedImgEl.naturalWidth !== 0 ? loadedImgEl.naturalWidth : imgRect.width;
+	const styleImgRegular = getImgRegularStyle({
+		containerHeight: imgRect.height,
+		containerLeft: imgRect.left,
+		containerTop: imgRect.top,
+		containerWidth: imgRect.width,
+		hasScalableSrc,
+		offset,
+		targetHeight,
+		targetWidth
+	});
+	const styleImgObjectFit = isImgObjectFit ? getImgObjectFitStyle({
+		containerHeight: imgRect.height,
+		containerLeft: imgRect.left,
+		containerTop: imgRect.top,
+		containerWidth: imgRect.width,
+		hasScalableSrc,
+		objectFit: targetElComputedStyle.objectFit,
+		objectPosition: targetElComputedStyle.objectPosition,
+		offset,
+		targetHeight,
+		targetWidth
+	}) : void 0;
+	const styleDivImg = isDivImg ? getDivImgStyle({
+		backgroundPosition: targetElComputedStyle.backgroundPosition,
+		backgroundSize: targetElComputedStyle.backgroundSize,
+		containerHeight: imgRect.height,
+		containerLeft: imgRect.left,
+		containerTop: imgRect.top,
+		containerWidth: imgRect.width,
+		hasScalableSrc,
+		offset,
+		targetHeight,
+		targetWidth
+	}) : void 0;
+	const style = {
+		...styleImgRegular,
+		...styleImgObjectFit,
+		...styleDivImg
+	};
+	if (isZoomed) {
+		const viewportX = window.innerWidth / 2;
+		const viewportY = window.innerHeight / 2;
+		const childCenterX = parseFloat(String(style.left ?? 0)) + parseFloat(String(style.width ?? 0)) / 2;
+		const childCenterY = parseFloat(String(style.top ?? 0)) + parseFloat(String(style.height ?? 0)) / 2;
+		const translateX = viewportX - childCenterX;
+		const translateY = viewportY - childCenterY;
+		if (shouldRefresh) style.transitionDuration = "0.01ms";
+		style.transform = `translate(${translateX}px,${translateY}px) scale(1)`;
+	}
+	return style;
+};
+const getStyleGhost = (imgEl) => {
+	if (imgEl == null) return {};
+	if (testSvg(imgEl)) {
+		const { parentElement: parentEl } = imgEl;
+		const rect = imgEl.getBoundingClientRect();
+		if (parentEl == null) return {
+			height: rect.height,
+			left: rect.left,
+			width: rect.width,
+			top: rect.top
+		};
+		else {
+			const parentRect = parentEl.getBoundingClientRect();
+			return {
+				height: rect.height,
+				left: parentRect.left - rect.left,
+				top: parentRect.top - rect.top,
+				width: rect.width
+			};
+		}
+	} else return {
+		height: imgEl.offsetHeight,
+		left: imgEl.offsetLeft,
+		width: imgEl.offsetWidth,
+		top: imgEl.offsetTop
+	};
+};
+const adjustSvgIDs = (svgEl) => {
+	const newIdSuffix = "-zoom";
+	const attrs = [
+		"clip-path",
+		"fill",
+		"mask",
+		"marker-start",
+		"marker-mid",
+		"marker-end"
+	];
+	const idMap = /* @__PURE__ */ new Map();
+	if (svgEl.hasAttribute("id")) {
+		const { id: oldId } = svgEl;
+		const newId = oldId + newIdSuffix;
+		idMap.set(oldId, newId);
+		const svgNode = svgEl;
+		svgNode.id = newId;
+	}
+	svgEl.querySelectorAll("[id]").forEach((el) => {
+		const { id: oldId } = el;
+		const newId = oldId + newIdSuffix;
+		idMap.set(oldId, newId);
+		const node = el;
+		node.id = newId;
+	});
+	idMap.forEach((newId, oldId) => {
+		const urlOldID = `url(#${oldId})`;
+		const urlNewID = `url(#${newId})`;
+		const attrsQuery = attrs.map((attr) => `[${attr}="${urlOldID}"]`).join(", ");
+		svgEl.querySelectorAll(attrsQuery).forEach((usedEl) => {
+			attrs.forEach((attr) => {
+				if (usedEl.getAttribute(attr) === urlOldID) usedEl.setAttribute(attr, urlNewID);
+			});
+		});
+	});
+	svgEl.querySelectorAll("style").forEach((styleEl) => {
+		idMap.forEach((newId, oldId) => {
+			const { textContent } = styleEl;
+			if (textContent !== "") {
+				const styleNode = styleEl;
+				styleNode.textContent = textContent.replaceAll(`#${oldId}`, `#${newId}`);
+			}
+		});
+	});
+};
+//#endregion
+export { adjustSvgIDs, getImgAlt, getImgSrc, getStyleGhost, getStyleModalImg, testDiv, testImg, testImgLoaded, testSvg };

package/dist/style.css

@@ -747,20 +747,6 @@
     :where(thead th code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
       color: inherit;
     }
-    :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
-      font-size: 0.875em;
-      line-height: 1.7142857;
-      width: 100%;
-      table-layout: auto;
-      margin-top: 2em;
-      margin-bottom: 2em;
-      border-collapse: separate;
-      border-spacing: 0;
-      background: var(--color-fd-card);
-      border-radius: var(--radius-lg);
-      border: 1px solid var(--color-fd-border);
-      overflow: hidden;
-    }
     :where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
       color: var(--tw-prose-headings);
       font-weight: 600;
@@ -819,6 +805,20 @@
     :where(.prose > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
       margin-bottom: 0;
     }
+    :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
+      font-size: 0.875em;
+      line-height: 1.7142857;
+      width: 100%;
+      table-layout: auto;
+      margin-top: 2em;
+      margin-bottom: 2em;
+      border-collapse: separate;
+      border-spacing: 0;
+      background: var(--color-fd-card);
+      border-radius: var(--radius-lg);
+      border: 1px solid var(--color-fd-border);
+      overflow: hidden;
+    }
     :where(th):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
       text-align: start;
       padding: calc(var(--spacing) * 2.5);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fumadocs/base-ui",
-  "version": "16.7.12",
+  "version": "16.7.14",
   "description": "The Base UI version of Fumadocs UI",
   "keywords": [
     "Docs",
@@ -11,8 +11,8 @@
   "author": "Fuma Nama",
   "repository": "github:fuma-nama/fumadocs",
   "files": [
-    "css/*",
-    "dist/*"
+    "css",
+    "dist"
   ],
   "type": "module",
   "exports": {
@@ -118,32 +118,32 @@
   "dependencies": {
     "@base-ui/react": "^1.3.0",
     "class-variance-authority": "^0.7.1",
-    "fuma-cli": "^0.0.3",
-    "lucide-react": "^1.7.0",
+    "lucide-react": "^1.8.0",
     "motion": "^12.38.0",
     "next-themes": "^0.4.6",
-    "react-medium-image-zoom": "^5.4.3",
     "react-remove-scroll": "^2.7.2",
     "rehype-raw": "^7.0.0",
     "scroll-into-view-if-needed": "^3.1.0",
     "tailwind-merge": "^3.5.0",
     "unist-util-visit": "^5.1.0",
-    "@fumadocs/tailwind": "0.0.3"
+    "@fumadocs/tailwind": "0.0.5"
   },
   "devDependencies": {
     "@tailwindcss/cli": "^4.2.2",
     "@tsdown/css": "^0.21.6",
     "@types/hast": "^3.0.4",
     "@types/mdx": "^2.0.13",
-    "@types/node": "^25.5.2",
+    "@types/node": "^25.6.0",
     "@types/react": "^19.2.14",
     "@types/react-dom": "^19.2.3",
+    "fuma-cli": "^0.0.5",
+    "react-medium-image-zoom": "^5.4.3",
     "shiki": "^4.0.2",
     "tailwindcss": "^4.2.2",
     "tsdown": "0.21.7",
     "unified": "^11.0.5",
-    "@fumadocs/cli": "1.3.5",
-    "fumadocs-core": "16.7.12",
+    "@fumadocs/cli": "1.3.7",
+    "fumadocs-core": "16.7.14",
     "tsconfig": "0.0.0"
   },
   "peerDependencies": {
@@ -154,7 +154,7 @@
     "react": "^19.2.0",
     "react-dom": "^19.2.0",
     "shiki": "*",
-    "fumadocs-core": "16.7.12"
+    "fumadocs-core": "16.7.14"
   },
   "peerDependenciesMeta": {
     "shiki": {
@@ -173,6 +173,9 @@
       "optional": true
     }
   },
+  "inlinedDependencies": {
+    "react-medium-image-zoom": "5.4.3"
+  },
   "scripts": {
     "build": "pnpm build:layout && pnpm build:tailwind",
     "build:layout": "tsdown --config-loader unrun",