opin-ui 0.0.1

package/dist/components/accordion.js

@@ -0,0 +1,68 @@
+"use client";
+import { cn } from "../utils/cn.js";
+import { buttonVariants } from "./ui/button.js";
+import { useCopyButton } from "../utils/use-copy-button.js";
+import { mergeRefs } from "../utils/merge-refs.js";
+import { Accordion as Accordion$1, AccordionContent, AccordionHeader, AccordionItem, AccordionTrigger } from "./ui/accordion.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Check, LinkIcon } from "lucide-react";
+import { useEffect, useRef, useState } from "react";
+import { useTranslations } from "@fuma-translate/react";
+//#region src/components/accordion.tsx
+function Accordions({ type = "single", ref, className, defaultValue, ...props }) {
+	const rootRef = useRef(null);
+	const composedRef = mergeRefs(ref, rootRef);
+	const [value, setValue] = useState(() => type === "single" ? defaultValue ?? "" : defaultValue ?? []);
+	useEffect(() => {
+		const id = window.location.hash.substring(1);
+		const element = rootRef.current;
+		if (!element || id.length === 0) return;
+		const selected = document.getElementById(id);
+		if (!selected || !element.contains(selected)) return;
+		const value = selected.getAttribute("data-accordion-value");
+		if (value) setValue((prev) => typeof prev === "string" ? value : [value, ...prev]);
+	}, []);
+	return /* @__PURE__ */ jsx(Accordion$1, {
+		type,
+		ref: composedRef,
+		value,
+		onValueChange: setValue,
+		collapsible: type === "single" ? true : void 0,
+		className: cn("overflow-hidden rounded-3xl bg-fd-card", className),
+		...props
+	});
+}
+function Accordion({ title, id, value = String(title), children, ...props }) {
+	return /* @__PURE__ */ jsxs(AccordionItem, {
+		value,
+		...props,
+		children: [/* @__PURE__ */ jsxs(AccordionHeader, {
+			id,
+			"data-accordion-value": value,
+			children: [/* @__PURE__ */ jsx(AccordionTrigger, { children: title }), id ? /* @__PURE__ */ jsx(CopyButton, { id }) : null]
+		}), /* @__PURE__ */ jsx(AccordionContent, { children: /* @__PURE__ */ jsx("div", {
+			className: "px-3 pb-3 text-[0.9375rem] prose-no-margin",
+			children
+		}) })]
+	});
+}
+function CopyButton({ id }) {
+	const t = useTranslations({ note: "accordion" });
+	const [checked, onClick] = useCopyButton(() => {
+		const url = new URL(window.location.href);
+		url.hash = id;
+		return navigator.clipboard.writeText(url.toString());
+	});
+	return /* @__PURE__ */ jsx("button", {
+		type: "button",
+		"aria-label": t("Copy Link", { note: "aria-label" }),
+		className: cn(buttonVariants({
+			color: "ghost",
+			className: "text-fd-muted-foreground me-2"
+		})),
+		onClick,
+		children: checked ? /* @__PURE__ */ jsx(Check, { className: "size-3.5" }) : /* @__PURE__ */ jsx(LinkIcon, { className: "size-3.5" })
+	});
+}
+//#endregion
+export { Accordion, Accordions };

package/dist/components/banner.d.ts

@@ -0,0 +1,33 @@
+import { HTMLAttributes } from "react";
+
+//#region src/components/banner.d.ts
+type BannerVariant = 'rainbow' | 'normal';
+declare function Banner({
+  id,
+  variant,
+  changeLayout,
+  height,
+  rainbowColors,
+  ...props
+}: HTMLAttributes<HTMLDivElement> & {
+  /**
+   * @defaultValue 3rem
+   */
+  height?: string;
+  /**
+   * @defaultValue 'normal'
+   */
+  variant?: BannerVariant;
+  /**
+   * For rainbow variant only, customize the colors
+   */
+  rainbowColors?: string[];
+  /**
+   * Change Fumadocs layout styles
+   *
+   * @defaultValue true
+   */
+  changeLayout?: boolean;
+}): import("react").JSX.Element | null;
+//#endregion
+export { Banner };

package/dist/components/banner.js

@@ -0,0 +1,85 @@
+"use client";
+import { cn } from "../utils/cn.js";
+import { buttonVariants } from "./ui/button.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { X } from "lucide-react";
+import { useEffect, useState } from "react";
+import { useTranslations } from "@fuma-translate/react";
+//#region src/components/banner.tsx
+function Banner({ id, variant = "normal", changeLayout = true, height = "3rem", rainbowColors = [
+	"rgba(0,149,255,0.56)",
+	"rgba(231,77,255,0.77)",
+	"rgba(255,0,0,0.73)",
+	"rgba(131,255,166,0.66)"
+], ...props }) {
+	const t = useTranslations({ note: "banner" });
+	const [open, setOpen] = useState(true);
+	const globalKey = id ? `nd-banner-${encodeBase32(id)}` : null;
+	useEffect(() => {
+		if (globalKey && localStorage.getItem(globalKey) === "true") setOpen(false);
+	}, [globalKey]);
+	function onClose() {
+		setOpen(false);
+		if (globalKey) localStorage.setItem(globalKey, "true");
+	}
+	if (!open) return null;
+	return /* @__PURE__ */ jsxs("div", {
+		id,
+		...props,
+		className: cn("sticky top-0 z-40 flex flex-row items-center justify-center px-4 text-center text-sm font-medium", variant === "normal" && "bg-fd-secondary", variant === "rainbow" && "bg-fd-background", !open && "hidden", props.className),
+		style: { height },
+		children: [
+			changeLayout && open ? /* @__PURE__ */ jsx("style", { children: globalKey ? `:root:not(.${globalKey}) { --fd-banner-height: ${height}; }` : `:root { --fd-banner-height: ${height}; }` }) : null,
+			globalKey ? /* @__PURE__ */ jsx("style", { children: `.${globalKey} #${id} { display: none; }` }) : null,
+			globalKey ? /* @__PURE__ */ jsx("script", { dangerouslySetInnerHTML: { __html: `if (localStorage.getItem('${globalKey}') === 'true') document.documentElement.classList.add('${globalKey}');` } }) : null,
+			variant === "rainbow" ? flow({ colors: rainbowColors }) : null,
+			props.children,
+			id ? /* @__PURE__ */ jsx("button", {
+				type: "button",
+				"aria-label": t("Close Banner", { note: "aria-label" }),
+				onClick: onClose,
+				className: cn(buttonVariants({
+					color: "ghost",
+					className: "absolute inset-e-2 top-1/2 -translate-y-1/2 text-fd-muted-foreground/50",
+					size: "icon-sm"
+				})),
+				children: /* @__PURE__ */ jsx(X, {})
+			}) : null
+		]
+	});
+}
+const maskImage = "linear-gradient(to bottom,white,transparent), radial-gradient(circle at top center, white, transparent)";
+function flow({ colors }) {
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
+		className: "absolute inset-0 -z-1",
+		style: {
+			maskImage,
+			maskComposite: "intersect",
+			animation: "fd-moving-banner 20s linear infinite",
+			backgroundImage: `repeating-linear-gradient(70deg, ${[...colors, colors[0]].map((color, i) => `${color} ${i * 50 / colors.length}%`).join(", ")})`,
+			backgroundSize: "200% 100%",
+			filter: "saturate(2)"
+		}
+	}), /* @__PURE__ */ jsx("style", { children: `@keyframes fd-moving-banner {
+            from { background-position: 0% 0;  }
+            to { background-position: 100% 0;  }
+         }` })] });
+}
+function encodeBase32(str) {
+	const alphabet = "abcdefghijklmnopqrstuvwxyz234567";
+	let encoded = "";
+	let buffer = 0;
+	let bitsLeft = 0;
+	for (let i = 0; i < str.length; i++) {
+		buffer = buffer << 8 | str.charCodeAt(i);
+		bitsLeft += 8;
+		while (bitsLeft >= 5) {
+			bitsLeft -= 5;
+			encoded += alphabet[buffer >> bitsLeft & 31];
+		}
+	}
+	if (bitsLeft > 0) encoded += alphabet[buffer << 5 - bitsLeft & 31];
+	return encoded;
+}
+//#endregion
+export { Banner };

package/dist/components/callout.d.ts

@@ -0,0 +1,41 @@
+import { ComponentProps, ReactNode } from "react";
+
+//#region src/components/callout.d.ts
+type CalloutType = 'info' | 'warn' | 'error' | 'success' | 'warning' | 'idea';
+declare function Callout({
+  children,
+  title,
+  ...props
+}: {
+  title?: ReactNode;
+} & Omit<CalloutContainerProps, 'title'>): import("react").JSX.Element;
+interface CalloutContainerProps extends ComponentProps<'div'> {
+  /**
+   * @defaultValue info
+   */
+  type?: CalloutType;
+  /**
+   * Force an icon
+   */
+  icon?: ReactNode;
+}
+declare function CalloutContainer({
+  type: inputType,
+  icon,
+  children,
+  className,
+  style,
+  ...props
+}: CalloutContainerProps): import("react").JSX.Element;
+declare function CalloutTitle({
+  children,
+  className,
+  ...props
+}: ComponentProps<'p'>): import("react").JSX.Element;
+declare function CalloutDescription({
+  children,
+  className,
+  ...props
+}: ComponentProps<'p'>): import("react").JSX.Element;
+//#endregion
+export { Callout, CalloutContainer, CalloutContainerProps, CalloutDescription, CalloutTitle, CalloutType };

package/dist/components/callout.js

@@ -0,0 +1,53 @@
+import { cn } from "../utils/cn.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { CircleCheck, CircleX, Info, Lightbulb, TriangleAlert } from "lucide-react";
+//#region src/components/callout.tsx
+const iconClass = "size-5 -me-0.5 fill-(--callout-color) text-fd-card";
+function Callout({ children, title, ...props }) {
+	return /* @__PURE__ */ jsxs(CalloutContainer, {
+		...props,
+		children: [title && /* @__PURE__ */ jsx(CalloutTitle, { children: title }), /* @__PURE__ */ jsx(CalloutDescription, { children })]
+	});
+}
+function resolveAlias(type) {
+	if (type === "warn") return "warning";
+	if (type === "tip") return "info";
+	return type;
+}
+function CalloutContainer({ type: inputType = "info", icon, children, className, style, ...props }) {
+	const type = resolveAlias(inputType);
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("flex gap-2 my-4 rounded-3xl bg-fd-card p-3 ps-2 text-sm text-fd-card-foreground", className),
+		style: {
+			"--callout-color": `var(--color-fd-${type}, var(--color-fd-muted))`,
+			...style
+		},
+		...props,
+		children: [icon ?? {
+			info: /* @__PURE__ */ jsx(Info, { className: iconClass }),
+			warning: /* @__PURE__ */ jsx(TriangleAlert, { className: iconClass }),
+			error: /* @__PURE__ */ jsx(CircleX, { className: iconClass }),
+			success: /* @__PURE__ */ jsx(CircleCheck, { className: iconClass }),
+			idea: /* @__PURE__ */ jsx(Lightbulb, { className: "size-5 -me-0.5 fill-(--callout-color) text-(--callout-color)" })
+		}[type], /* @__PURE__ */ jsx("div", {
+			className: "flex flex-col gap-2 min-w-0 flex-1",
+			children
+		})]
+	});
+}
+function CalloutTitle({ children, className, ...props }) {
+	return /* @__PURE__ */ jsx("p", {
+		className: cn("font-medium my-0!", className),
+		...props,
+		children
+	});
+}
+function CalloutDescription({ children, className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("text-fd-muted-foreground prose-no-margin empty:hidden", className),
+		...props,
+		children
+	});
+}
+//#endregion
+export { Callout, CalloutContainer, CalloutDescription, CalloutTitle };

package/dist/components/card.d.ts

@@ -0,0 +1,19 @@
+import { HTMLAttributes, ReactNode } from "react";
+
+//#region src/components/card.d.ts
+declare function Cards(props: HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;
+type CardProps = Omit<HTMLAttributes<HTMLElement>, 'title'> & {
+  icon?: ReactNode;
+  title: ReactNode;
+  description?: ReactNode;
+  href?: string;
+  external?: boolean;
+};
+declare function Card({
+  icon,
+  title,
+  description,
+  ...props
+}: CardProps): import("react").JSX.Element;
+//#endregion
+export { Card, CardProps, Cards };

package/dist/components/card.js

@@ -0,0 +1,38 @@
+import { cn } from "../utils/cn.js";
+import Link from "fumadocs-core/link";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/card.tsx
+function Cards(props) {
+	return /* @__PURE__ */ jsx("div", {
+		...props,
+		className: cn("grid grid-cols-2 gap-3 @container", props.className),
+		children: props.children
+	});
+}
+function Card({ icon, title, description, ...props }) {
+	return /* @__PURE__ */ jsxs(props.href ? Link : "div", {
+		...props,
+		"data-card": true,
+		className: cn("block rounded-3xl bg-fd-card p-4 text-fd-card-foreground transition-colors @max-lg:col-span-full", props.href && "hover:bg-fd-accent/80", props.className),
+		children: [
+			icon ? /* @__PURE__ */ jsx("div", {
+				className: "not-prose mb-2 w-fit rounded-lg bg-fd-muted p-1.5 text-fd-muted-foreground [&_svg]:size-4",
+				children: icon
+			}) : null,
+			/* @__PURE__ */ jsx("h3", {
+				className: "not-prose mb-1 text-sm font-medium",
+				children: title
+			}),
+			description ? /* @__PURE__ */ jsx("p", {
+				className: "my-0! text-sm text-fd-muted-foreground",
+				children: description
+			}) : null,
+			/* @__PURE__ */ jsx("div", {
+				className: "text-sm text-fd-muted-foreground prose-no-margin empty:hidden",
+				children: props.children
+			})
+		]
+	});
+}
+//#endregion
+export { Card, Cards };

package/dist/components/codeblock.d.ts

@@ -0,0 +1,61 @@
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "./ui/tabs.js";
+import { ComponentProps, HTMLAttributes, ReactNode } from "react";
+
+//#region src/components/codeblock.d.ts
+interface CodeBlockProps extends ComponentProps<'figure'> {
+  /**
+   * Icon of code block
+   *
+   * When passed as a string, it assumes the value is the HTML of icon
+   */
+  icon?: ReactNode;
+  /**
+   * Allow to copy code with copy button
+   *
+   * @defaultValue true
+   */
+  allowCopy?: boolean;
+  /**
+   * Keep original background color generated by Shiki or Rehype Code
+   *
+   * @defaultValue false
+   */
+  keepBackground?: boolean;
+  viewportProps?: HTMLAttributes<HTMLElement>;
+  /**
+   * show line numbers
+   */
+  'data-line-numbers'?: boolean;
+  /**
+   * @defaultValue 1
+   */
+  'data-line-numbers-start'?: number;
+  Actions?: (props: {
+    className?: string;
+    children?: ReactNode;
+  }) => ReactNode;
+}
+declare function Pre(props: ComponentProps<'pre'>): import("react").JSX.Element;
+declare function CodeBlock({
+  ref,
+  title,
+  allowCopy,
+  keepBackground,
+  icon,
+  viewportProps,
+  children,
+  Actions,
+  ...props
+}: CodeBlockProps): import("react").JSX.Element;
+declare function CodeBlockTabs({
+  ref,
+  ...props
+}: ComponentProps<typeof Tabs>): import("react").JSX.Element;
+declare function CodeBlockTabsList(props: ComponentProps<typeof TabsList>): import("react").JSX.Element;
+declare function CodeBlockTabsTrigger({
+  children,
+  ...props
+}: ComponentProps<typeof TabsTrigger>): import("react").JSX.Element;
+declare function CodeBlockTab(props: ComponentProps<typeof TabsContent>): import("react").JSX.Element;
+//#endregion
+export { CodeBlock, CodeBlockProps, CodeBlockTab, CodeBlockTabs, CodeBlockTabsList, CodeBlockTabsTrigger, Pre };

package/dist/components/codeblock.js

@@ -0,0 +1,173 @@
+"use client";
+import { cn } from "../utils/cn.js";
+import { buttonVariants } from "./ui/button.js";
+import { useCopyButton } from "../utils/use-copy-button.js";
+import { mergeRefs } from "../utils/merge-refs.js";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "./ui/tabs.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { createContext, use, useMemo, useRef } from "react";
+import { useTranslations } from "@fuma-translate/react";
+//#region src/components/codeblock.tsx
+const TabsContext = createContext(null);
+function Pre(props) {
+	return /* @__PURE__ */ jsx("pre", {
+		...props,
+		className: cn("min-w-full w-max *:flex *:flex-col", props.className),
+		children: props.children
+	});
+}
+function CodeBlock({ ref, title, allowCopy = true, keepBackground = false, icon, viewportProps = {}, children, Actions = (props) => /* @__PURE__ */ jsx("div", {
+	...props,
+	className: cn("empty:hidden", props.className)
+}), ...props }) {
+	const inTab = use(TabsContext) !== null;
+	const areaRef = useRef(null);
+	return /* @__PURE__ */ jsxs("figure", {
+		ref,
+		dir: "ltr",
+		...props,
+		tabIndex: -1,
+		className: cn(inTab ? "bg-fd-secondary -mx-px -mb-px last:rounded-b-3xl" : "my-4 bg-fd-card rounded-3xl", keepBackground && "bg-(--shiki-light-bg) dark:bg-(--shiki-dark-bg)", "shiki relative not-prose overflow-hidden text-sm", props.className),
+		children: [title ? /* @__PURE__ */ jsxs("div", {
+			className: "flex text-fd-muted-foreground items-center gap-2 h-9.5 bg-fd-muted/40 px-4",
+			children: [
+				typeof icon === "string" ? /* @__PURE__ */ jsx("div", {
+					className: "[&_svg]:size-3.5",
+					dangerouslySetInnerHTML: { __html: icon }
+				}) : icon,
+				/* @__PURE__ */ jsx("figcaption", {
+					className: "flex-1 truncate",
+					children: title
+				}),
+				Actions({
+					className: "-me-2",
+					children: allowCopy && /* @__PURE__ */ jsx(CopyButton, { containerRef: areaRef })
+				})
+			]
+		}) : Actions({
+			className: "absolute top-3 right-2 z-2 backdrop-blur-lg rounded-xl text-fd-muted-foreground",
+			children: allowCopy && /* @__PURE__ */ jsx(CopyButton, { containerRef: areaRef })
+		}), /* @__PURE__ */ jsx("div", {
+			ref: areaRef,
+			...viewportProps,
+			role: "region",
+			tabIndex: 0,
+			className: cn("text-[0.8125rem] py-3.5 overflow-auto max-h-[600px] fd-scroll-container focus-visible:outline-none focus-visible:bg-fd-accent/5", viewportProps.className),
+			style: {
+				"--padding-right": !title ? "calc(var(--spacing) * 8)" : void 0,
+				counterSet: props["data-line-numbers"] ? `line ${Number(props["data-line-numbers-start"] ?? 1) - 1}` : void 0,
+				...viewportProps.style
+			},
+			children
+		})]
+	});
+}
+function CopyIcon() {
+	return /* @__PURE__ */ jsxs("svg", {
+		viewBox: "0 0 24 24",
+		fill: "none",
+		xmlns: "http://www.w3.org/2000/svg",
+		children: [/* @__PURE__ */ jsx("path", {
+			d: "M16 12.9V17.1C16 20.6 14.6 22 11.1 22H6.9C3.4 22 2 20.6 2 17.1V12.9C2 9.4 3.4 8 6.9 8H11.1C14.6 8 16 9.4 16 12.9Z",
+			stroke: "currentColor",
+			strokeWidth: "1.5",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		}), /* @__PURE__ */ jsx("path", {
+			d: "M22 6.9V11.1C22 14.6 20.6 16 17.1 16H16V12.9C16 9.4 14.6 8 11.1 8H8V6.9C8 3.4 9.4 2 12.9 2H17.1C20.6 2 22 3.4 22 6.9Z",
+			stroke: "currentColor",
+			strokeWidth: "1.5",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})]
+	});
+}
+function CopiedIcon() {
+	return /* @__PURE__ */ jsxs("svg", {
+		viewBox: "0 0 24 24",
+		fill: "none",
+		xmlns: "http://www.w3.org/2000/svg",
+		children: [
+			/* @__PURE__ */ jsx("path", {
+				d: "M22 11.1V6.9C22 3.4 20.6 2 17.1 2H12.9C9.4 2 8 3.4 8 6.9V8H11.1C14.6 8 16 9.4 16 12.9V16H17.1C20.6 16 22 14.6 22 11.1Z",
+				stroke: "currentColor",
+				strokeWidth: "1.5",
+				strokeLinecap: "round",
+				strokeLinejoin: "round"
+			}),
+			/* @__PURE__ */ jsx("path", {
+				d: "M16 17.1V12.9C16 9.4 14.6 8 11.1 8H6.9C3.4 8 2 9.4 2 12.9V17.1C2 20.6 3.4 22 6.9 22H11.1C14.6 22 16 20.6 16 17.1Z",
+				stroke: "currentColor",
+				strokeWidth: "1.5",
+				strokeLinecap: "round",
+				strokeLinejoin: "round"
+			}),
+			/* @__PURE__ */ jsx("path", {
+				d: "M6.08008 15L8.03008 16.95L11.9201 13.05",
+				stroke: "currentColor",
+				strokeWidth: "1.5",
+				strokeLinecap: "round",
+				strokeLinejoin: "round"
+			})
+		]
+	});
+}
+function CopyButton({ className, containerRef, ...props }) {
+	const t = useTranslations({ note: "code block" });
+	const [checked, onClick] = useCopyButton(() => {
+		const pre = containerRef.current?.getElementsByTagName("pre").item(0);
+		if (!pre) return;
+		const clone = pre.cloneNode(true);
+		clone.querySelectorAll(".nd-copy-ignore").forEach((node) => {
+			node.replaceWith("\n");
+		});
+		navigator.clipboard.writeText(clone.textContent ?? "");
+	});
+	return /* @__PURE__ */ jsx("button", {
+		type: "button",
+		"data-checked": checked || void 0,
+		className: cn(buttonVariants({
+			className: "hover:text-fd-accent-foreground data-checked:text-fd-accent-foreground",
+			size: "icon-xs"
+		}), className),
+		"aria-label": checked ? t("Copied Text", { note: "aria-label" }) : t("Copy Text", { note: "aria-label" }),
+		onClick,
+		...props,
+		children: checked ? /* @__PURE__ */ jsx(CopiedIcon, {}) : /* @__PURE__ */ jsx(CopyIcon, {})
+	});
+}
+function CodeBlockTabs({ ref, ...props }) {
+	const containerRef = useRef(null);
+	const nested = use(TabsContext) !== null;
+	return /* @__PURE__ */ jsx(Tabs, {
+		ref: mergeRefs(containerRef, ref),
+		...props,
+		className: cn("bg-fd-card rounded-3xl", !nested && "my-4", props.className),
+		children: /* @__PURE__ */ jsx(TabsContext, {
+			value: useMemo(() => ({
+				containerRef,
+				nested
+			}), [nested]),
+			children: props.children
+		})
+	});
+}
+function CodeBlockTabsList(props) {
+	return /* @__PURE__ */ jsx(TabsList, {
+		...props,
+		className: cn("flex flex-row px-2 overflow-x-auto text-fd-muted-foreground", props.className),
+		children: props.children
+	});
+}
+function CodeBlockTabsTrigger({ children, ...props }) {
+	return /* @__PURE__ */ jsxs(TabsTrigger, {
+		...props,
+		className: cn("relative group inline-flex text-sm font-medium text-nowrap items-center transition-colors gap-2 px-2 py-1.5 hover:text-fd-accent-foreground data-[state=active]:text-fd-primary [&_svg]:size-3.5", props.className),
+		children: [/* @__PURE__ */ jsx("div", { className: "absolute inset-x-2 bottom-0 h-px group-data-[state=active]:bg-fd-primary" }), children]
+	});
+}
+function CodeBlockTab(props) {
+	return /* @__PURE__ */ jsx(TabsContent, { ...props });
+}
+//#endregion
+export { CodeBlock, CodeBlockTab, CodeBlockTabs, CodeBlockTabsList, CodeBlockTabsTrigger, Pre };

package/dist/components/codeblock.rsc.d.ts

@@ -0,0 +1,20 @@
+import { CodeBlockProps } from "./codeblock.js";
+import { HighlightOptions } from "fumadocs-core/highlight";
+
+//#region src/components/codeblock.rsc.d.ts
+type ServerCodeBlockProps = HighlightOptions & {
+  code: string;
+  /**
+   * Extra props for the underlying `<CodeBlock />` component.
+   *
+   * Ignored if you defined your own `pre` component in `components`.
+   */
+  codeblock?: CodeBlockProps;
+};
+declare function ServerCodeBlock({
+  code,
+  codeblock,
+  ...options
+}: ServerCodeBlockProps): Promise<import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | (string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined)>;
+//#endregion
+export { ServerCodeBlock, ServerCodeBlockProps };

package/dist/components/codeblock.rsc.js

@@ -0,0 +1,22 @@
+import { cn } from "../utils/cn.js";
+import { CodeBlock, Pre } from "./codeblock.js";
+import { jsx } from "react/jsx-runtime";
+import { highlight } from "fumadocs-core/highlight";
+//#region src/components/codeblock.rsc.tsx
+async function ServerCodeBlock({ code, codeblock, ...options }) {
+	return await highlight(code, {
+		defaultColor: false,
+		...options,
+		components: {
+			pre: (props) => /* @__PURE__ */ jsx(CodeBlock, {
+				...props,
+				...codeblock,
+				className: cn("my-0", props.className, codeblock?.className),
+				children: /* @__PURE__ */ jsx(Pre, { children: props.children })
+			}),
+			...options.components
+		}
+	});
+}
+//#endregion
+export { ServerCodeBlock };

package/dist/components/dialog/search-algolia.d.ts

@@ -0,0 +1,36 @@
+import { SearchLink, SharedProps, TagItem } from "../../contexts/search.js";
+import { ReactNode } from "react";
+import { AlgoliaOptions } from "fumadocs-core/search/client";
+
+//#region src/components/dialog/search-algolia.d.ts
+interface AlgoliaSearchDialogProps extends SharedProps {
+  searchOptions: AlgoliaOptions;
+  links?: SearchLink[];
+  footer?: ReactNode;
+  defaultTag?: string;
+  tags?: TagItem[];
+  /**
+   * Add the "Powered by Algolia" label, this is useful for free tier users
+   *
+   * @defaultValue false
+   */
+  showAlgolia?: boolean;
+  /**
+   * Allow to clear tag filters
+   *
+   * @defaultValue false
+   */
+  allowClear?: boolean;
+}
+declare function AlgoliaSearchDialog({
+  searchOptions,
+  tags,
+  defaultTag,
+  showAlgolia,
+  allowClear,
+  links,
+  footer,
+  ...props
+}: AlgoliaSearchDialogProps): import("react").JSX.Element;
+//#endregion
+export { AlgoliaSearchDialogProps, AlgoliaSearchDialog as default };