@windrun-huaiin/third-ui 29.2.1 → 30.1.0

package/dist/fuma/fuma-page-genarator.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode, ReactElement } from 'react';
+import { ReactElement } from 'react';
 import type { LLMCopyButtonProps, LLMCopyButton } from './mdx/toc-base';
 export type FumaPageTocRenderMode = 'portable-clerk' | 'fumadocs-clerk' | 'fumadocs-normal';
 interface FumaPageParams {
@@ -8,10 +8,6 @@ interface FumaPageParams {
     mdxSourceDir: string;
     githubBaseUrl?: string;
     copyButtonComponent?: ReactElement<LLMCopyButtonProps, typeof LLMCopyButton>;
-    siteIcon: ReactNode;
-    FallbackPage: React.ComponentType<{
-        siteIcon: ReactNode;
-    }>;
     supportedLocales?: string[];
     showBreadcrumb?: boolean;
     showTableOfContent?: boolean;
@@ -20,7 +16,7 @@ interface FumaPageParams {
     localePrefixAsNeeded?: boolean;
     defaultLocale?: string;
 }
-export declare function createFumaPage({ sourceKey, mdxContentSource, getMDXComponents, mdxSourceDir, githubBaseUrl, copyButtonComponent, siteIcon, FallbackPage, supportedLocales, showBreadcrumb, showTableOfContent, tocRenderMode, showTableOfContentPopover, localePrefixAsNeeded, defaultLocale, }: FumaPageParams): {
+export declare function createFumaPage({ sourceKey, mdxContentSource, getMDXComponents, mdxSourceDir, githubBaseUrl, copyButtonComponent, supportedLocales, showBreadcrumb, showTableOfContent, tocRenderMode, showTableOfContentPopover, localePrefixAsNeeded, defaultLocale, }: FumaPageParams): {
     Page: ({ params }: {
         params: Promise<{
             locale: string;

package/dist/fuma/fuma-page-genarator.js

@@ -6,10 +6,11 @@ var page = require('fumadocs-ui/page');
 var React = require('react');
 var tocFooterWrapper = require('./mdx/toc-footer-wrapper.js');
 var utils = require('@windrun-huaiin/lib/utils');
+var navigation = require('next/navigation');
 var tocClerkPortable = require('./mdx/toc-clerk-portable.js');
 var lib = require('@windrun-huaiin/base-ui/lib');
 
-function createFumaPage({ sourceKey, mdxContentSource, getMDXComponents, mdxSourceDir, githubBaseUrl, copyButtonComponent, siteIcon, FallbackPage, supportedLocales = ['en'], showBreadcrumb = true, showTableOfContent = true, tocRenderMode = 'portable-clerk', showTableOfContentPopover = false, localePrefixAsNeeded = true, defaultLocale = 'en', }) {
+function createFumaPage({ sourceKey, mdxContentSource, getMDXComponents, mdxSourceDir, githubBaseUrl, copyButtonComponent, supportedLocales = ['en'], showBreadcrumb = true, showTableOfContent = true, tocRenderMode = 'portable-clerk', showTableOfContentPopover = false, localePrefixAsNeeded = true, defaultLocale = 'en', }) {
     var _a;
     const isLocalMdDebugEnabled = ((_a = process.env.LOCAL_MD_DEBUG) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === 'true';
     const now = () => (typeof performance !== 'undefined' ? performance.now() : Date.now());
@@ -49,7 +50,7 @@ function createFumaPage({ sourceKey, mdxContentSource, getMDXComponents, mdxSour
                 totalElapsedMs: durationMs(pageStartedAt),
             });
             if (!page$1) {
-                return (jsxRuntime.jsx(page.DocsPage, { full: true, breadcrumb: { enabled: false }, footer: { enabled: false }, tableOfContent: { enabled: false }, tableOfContentPopover: { enabled: false }, className: "max-w-none px-0 py-0", children: jsxRuntime.jsx(FallbackPage, { siteIcon: siteIcon }) }));
+                navigation.notFound();
             }
             const path = githubBaseUrl ? `${mdxSourceDir}/${page$1.path}` : undefined;
             const tocFooterElement = (jsxRuntime.jsx(tocFooterWrapper.TocFooterWrapper, { lastModified: page$1.data.date, copyButtonComponent: copyButtonComponent

package/dist/fuma/fuma-page-genarator.mjs

@@ -4,10 +4,11 @@ import { DocsPage, DocsTitle, DocsDescription, DocsBody } from 'fumadocs-ui/page
 import { cloneElement } from 'react';
 import { TocFooterWrapper } from './mdx/toc-footer-wrapper.mjs';
 import { getAsNeededLocalizedUrl } from '@windrun-huaiin/lib/utils';
+import { notFound } from 'next/navigation';
 import { PortableClerkTOC, PortableClerkTOCTitle } from './mdx/toc-clerk-portable.mjs';
 import { themeSvgIconColor } from '@windrun-huaiin/base-ui/lib';
 
-function createFumaPage({ sourceKey, mdxContentSource, getMDXComponents, mdxSourceDir, githubBaseUrl, copyButtonComponent, siteIcon, FallbackPage, supportedLocales = ['en'], showBreadcrumb = true, showTableOfContent = true, tocRenderMode = 'portable-clerk', showTableOfContentPopover = false, localePrefixAsNeeded = true, defaultLocale = 'en', }) {
+function createFumaPage({ sourceKey, mdxContentSource, getMDXComponents, mdxSourceDir, githubBaseUrl, copyButtonComponent, supportedLocales = ['en'], showBreadcrumb = true, showTableOfContent = true, tocRenderMode = 'portable-clerk', showTableOfContentPopover = false, localePrefixAsNeeded = true, defaultLocale = 'en', }) {
     var _a;
     const isLocalMdDebugEnabled = ((_a = process.env.LOCAL_MD_DEBUG) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === 'true';
     const now = () => (typeof performance !== 'undefined' ? performance.now() : Date.now());
@@ -47,7 +48,7 @@ function createFumaPage({ sourceKey, mdxContentSource, getMDXComponents, mdxSour
                 totalElapsedMs: durationMs(pageStartedAt),
             });
             if (!page) {
-                return (jsx(DocsPage, { full: true, breadcrumb: { enabled: false }, footer: { enabled: false }, tableOfContent: { enabled: false }, tableOfContentPopover: { enabled: false }, className: "max-w-none px-0 py-0", children: jsx(FallbackPage, { siteIcon: siteIcon }) }));
+                notFound();
             }
             const path = githubBaseUrl ? `${mdxSourceDir}/${page.path}` : undefined;
             const tocFooterElement = (jsx(TocFooterWrapper, { lastModified: page.data.date, copyButtonComponent: copyButtonComponent

package/dist/fuma/mdx/cheet-table.d.ts

@@ -0,0 +1,13 @@
+import { type HTMLAttributes, type ReactNode } from 'react';
+export type CheetTableProps = Omit<HTMLAttributes<HTMLDivElement>, 'title'> & {
+    title?: ReactNode;
+    description?: string;
+    copyableColumns?: string[];
+    defaultOpen?: boolean;
+    collapsible?: boolean;
+    striped?: boolean;
+    stickyHeader?: boolean;
+    emptyText?: string;
+    children: ReactNode;
+};
+export declare function CheetTable({ title, description, copyableColumns, defaultOpen, collapsible, striped, stickyHeader, emptyText, className, children, style, ...props }: CheetTableProps): import("react/jsx-runtime").JSX.Element;

package/dist/fuma/mdx/cheet-table.js

@@ -0,0 +1,295 @@
+"use client";
+'use strict';
+
+var tslib = require('tslib');
+var jsxRuntime = require('react/jsx-runtime');
+var icons = require('@windrun-huaiin/base-ui/icons');
+var lib = require('@windrun-huaiin/base-ui/lib');
+var utils = require('@windrun-huaiin/lib/utils');
+var React = require('react');
+var infoTooltip = require('../../main/info-tooltip.js');
+
+const DEFAULT_COLUMN_WIDTH = 180;
+const MIN_COLUMN_WIDTH = 140;
+const CHEET_TABLE_BORDER_COLOR = `color-mix(in srgb, ${lib.themeSvgIconColor} 35%, transparent)`;
+const CHEET_TABLE_BORDER_CLASS = 'border-[color:var(--cheet-table-border-color)]';
+function parseCheetCell(raw) {
+    let value = raw.trim();
+    let force = false;
+    if (value.startsWith('!!')) {
+        force = true;
+        value = value.slice(2).trimStart();
+    }
+    const descriptionIndex = value.indexOf('??');
+    if (descriptionIndex === -1) {
+        return {
+            text: value,
+            force,
+        };
+    }
+    const description = value.slice(descriptionIndex + 2).trim();
+    return {
+        text: value.slice(0, descriptionIndex).trimEnd(),
+        description: description ? description : undefined,
+        force,
+    };
+}
+function normalizeText(value) {
+    return value.replace(/\s+/g, ' ').trim();
+}
+function collectText(node) {
+    if (typeof node === 'string' || typeof node === 'number') {
+        return String(node);
+    }
+    if (Array.isArray(node)) {
+        return node.map(collectText).join('');
+    }
+    if (React.isValidElement(node)) {
+        return collectText(node.props.children);
+    }
+    return '';
+}
+function getElementChildren(element) {
+    return React.Children.toArray(element.props.children);
+}
+function isElementType(node, type) {
+    return React.isValidElement(node) && node.type === type;
+}
+function findFirstElement(node, type) {
+    if (isElementType(node, type)) {
+        return node;
+    }
+    if (Array.isArray(node)) {
+        for (const child of node) {
+            const match = findFirstElement(child, type);
+            if (match) {
+                return match;
+            }
+        }
+    }
+    if (React.isValidElement(node)) {
+        return findFirstElement(node.props.children, type);
+    }
+    return null;
+}
+function collectRowElements(node) {
+    if (isElementType(node, 'tr')) {
+        return [node];
+    }
+    if (Array.isArray(node)) {
+        return node.flatMap(collectRowElements);
+    }
+    if (React.isValidElement(node)) {
+        return collectRowElements(node.props.children);
+    }
+    return [];
+}
+function parseRow(row) {
+    return getElementChildren(row)
+        .filter(React.isValidElement)
+        .map((cell) => {
+        const rawText = normalizeText(collectText(cell.props.children));
+        return Object.assign({ rawText }, parseCheetCell(rawText));
+    });
+}
+function parseCheetTable(children) {
+    var _a;
+    const rows = collectRowElements(children);
+    if (rows.length > 0) {
+        const headerRow = rows[0];
+        const dataRows = rows.slice(1);
+        const headers = parseRow(headerRow);
+        if (headers.length === 0) {
+            return null;
+        }
+        return {
+            headers,
+            rows: dataRows.map(parseRow).filter((row) => row.length > 0),
+        };
+    }
+    const table = findFirstElement(children, 'table');
+    if (!table) {
+        return null;
+    }
+    const thead = findFirstElement(table.props.children, 'thead');
+    const tbody = findFirstElement(table.props.children, 'tbody');
+    const headRows = thead ? collectRowElements(thead.props.children) : [];
+    const bodyRows = tbody ? collectRowElements(tbody.props.children) : [];
+    const fallbackRows = !thead && !tbody ? collectRowElements(table.props.children) : [];
+    const headerRow = (_a = headRows[0]) !== null && _a !== void 0 ? _a : fallbackRows[0];
+    const dataRows = bodyRows.length > 0 ? bodyRows : fallbackRows.slice(1);
+    if (!headerRow) {
+        return null;
+    }
+    const headers = parseRow(headerRow);
+    if (headers.length === 0) {
+        return null;
+    }
+    return {
+        headers,
+        rows: dataRows.map(parseRow).filter((row) => row.length > 0),
+    };
+}
+function parseCheetTableElement(element) {
+    const table = element === null || element === void 0 ? void 0 : element.querySelector('table');
+    if (!table) {
+        return null;
+    }
+    const headRow = table.querySelector('thead tr');
+    const bodyRows = Array.from(table.querySelectorAll('tbody tr'));
+    const fallbackRows = Array.from(table.querySelectorAll('tr'));
+    const headerRow = headRow !== null && headRow !== void 0 ? headRow : fallbackRows[0];
+    const dataRows = bodyRows.length > 0
+        ? bodyRows
+        : fallbackRows.slice(headerRow ? 1 : 0);
+    if (!headerRow) {
+        return null;
+    }
+    const parseDomRow = (row) => Array.from(row.querySelectorAll('th,td')).map((cell) => {
+        var _a;
+        const rawText = normalizeText((_a = cell.textContent) !== null && _a !== void 0 ? _a : '');
+        return Object.assign({ rawText }, parseCheetCell(rawText));
+    });
+    const headers = parseDomRow(headerRow);
+    if (headers.length === 0) {
+        return null;
+    }
+    return {
+        headers,
+        rows: dataRows.map(parseDomRow).filter((row) => row.length > 0),
+    };
+}
+function createCopyableColumnSet(headers, copyableColumns) {
+    const names = copyableColumns !== null && copyableColumns !== void 0 ? copyableColumns : [];
+    return new Set(names.map((name) => {
+        const header = headers.find((item) => item.text === name || item.rawText === name);
+        return header ? header.text : name;
+    }));
+}
+function CheetCellContent({ cell, force, copied, copyable, onCopy, }) {
+    return (jsxRuntime.jsxs("span", { className: "flex min-w-0 items-center gap-0.5", children: [jsxRuntime.jsx("span", { className: utils.cn('block min-w-0 truncate', force && utils.cn('font-semibold', lib.themeIconColor)), children: cell.text }), cell.description ? (jsxRuntime.jsx(infoTooltip.InfoTooltip, { content: cell.description, className: "not-prose -mx-0.5", desktopSide: "bottom" })) : null, copyable ? (jsxRuntime.jsx("button", { type: "button", "aria-label": copied ? 'Copied' : 'Copy cell content', className: utils.cn('not-prose inline-flex size-6 shrink-0 touch-manipulation items-center justify-center rounded text-fd-muted-foreground transition', 'hover:bg-fd-accent hover:text-fd-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 dark:focus-visible:ring-offset-slate-950', copied && lib.themeIconColor, lib.themeRingColor), onClick: (event) => {
+                    event.preventDefault();
+                    event.stopPropagation();
+                    onCopy === null || onCopy === void 0 ? void 0 : onCopy();
+                }, onPointerDown: (event) => {
+                    event.stopPropagation();
+                }, children: copied ? jsxRuntime.jsx(icons.CheckIcon, { className: "size-3.5" }) : jsxRuntime.jsx(icons.CopyIcon, { className: "size-3.5" }) })) : null] }));
+}
+function CheetTable(_a) {
+    var _b;
+    var { title, description, copyableColumns, defaultOpen = true, collapsible = true, striped = true, stickyHeader = false, emptyText = 'No data', className, children, style } = _a, props = tslib.__rest(_a, ["title", "description", "copyableColumns", "defaultOpen", "collapsible", "striped", "stickyHeader", "emptyText", "className", "children", "style"]);
+    const [mounted, setMounted] = React.useState(false);
+    const [model, setModel] = React.useState(null);
+    const [parsed, setParsed] = React.useState(false);
+    const [open, setOpen] = React.useState(defaultOpen);
+    const [copiedCell, setCopiedCell] = React.useState(null);
+    const [columnWidths, setColumnWidths] = React.useState([]);
+    const sourceRef = React.useRef(null);
+    const resizeStartRef = React.useRef(null);
+    const headerCount = (_b = model === null || model === void 0 ? void 0 : model.headers.length) !== null && _b !== void 0 ? _b : 0;
+    const copyableColumnSet = React.useMemo(() => { var _a; return createCopyableColumnSet((_a = model === null || model === void 0 ? void 0 : model.headers) !== null && _a !== void 0 ? _a : [], copyableColumns); }, [copyableColumns, model === null || model === void 0 ? void 0 : model.headers]);
+    React.useEffect(() => {
+        var _a;
+        setMounted(true);
+        setModel((_a = parseCheetTableElement(sourceRef.current)) !== null && _a !== void 0 ? _a : parseCheetTable(children));
+        setParsed(true);
+    }, [children]);
+    React.useEffect(() => {
+        if (headerCount === 0) {
+            setColumnWidths([]);
+            return;
+        }
+        setColumnWidths((current) => Array.from({ length: headerCount }, (_, index) => { var _a; return Math.max((_a = current[index]) !== null && _a !== void 0 ? _a : DEFAULT_COLUMN_WIDTH, MIN_COLUMN_WIDTH); }));
+    }, [headerCount]);
+    React.useEffect(() => {
+        function handlePointerMove(event) {
+            const start = resizeStartRef.current;
+            if (!start) {
+                return;
+            }
+            const nextWidth = Math.max(MIN_COLUMN_WIDTH, start.startWidth + event.clientX - start.startX);
+            setColumnWidths((current) => {
+                const next = [...current];
+                next[start.columnIndex] = nextWidth;
+                return next;
+            });
+        }
+        function handlePointerUp() {
+            resizeStartRef.current = null;
+            document.body.style.removeProperty('cursor');
+            document.body.style.removeProperty('user-select');
+        }
+        window.addEventListener('pointermove', handlePointerMove);
+        window.addEventListener('pointerup', handlePointerUp);
+        return () => {
+            window.removeEventListener('pointermove', handlePointerMove);
+            window.removeEventListener('pointerup', handlePointerUp);
+            document.body.style.removeProperty('cursor');
+            document.body.style.removeProperty('user-select');
+        };
+    }, []);
+    const startResize = (event, columnIndex) => {
+        var _a;
+        event.preventDefault();
+        event.stopPropagation();
+        resizeStartRef.current = {
+            columnIndex,
+            startX: event.clientX,
+            startWidth: (_a = columnWidths[columnIndex]) !== null && _a !== void 0 ? _a : DEFAULT_COLUMN_WIDTH,
+        };
+        document.body.style.cursor = 'col-resize';
+        document.body.style.userSelect = 'none';
+    };
+    const handleCopy = (text, cellId) => tslib.__awaiter(this, void 0, void 0, function* () {
+        if (!text || !navigator.clipboard) {
+            return;
+        }
+        try {
+            yield navigator.clipboard.writeText(text);
+            setCopiedCell(cellId);
+            window.setTimeout(() => setCopiedCell(null), 1200);
+        }
+        catch (_a) {
+            // Keep MDX reading uninterrupted when clipboard permission is unavailable.
+        }
+    });
+    const shellClassName = utils.cn('not-prose my-6 overflow-hidden rounded-lg border bg-fd-card text-fd-card-foreground shadow-sm', CHEET_TABLE_BORDER_CLASS, className);
+    const shellStyle = Object.assign({ '--cheet-table-border-color': CHEET_TABLE_BORDER_COLOR }, style);
+    const titleBar = title || description || collapsible ? (jsxRuntime.jsxs("div", { className: "grid min-w-0 grid-cols-[minmax(0,90%)_minmax(2rem,10%)] items-center bg-fd-muted/35 px-4 py-2", children: [jsxRuntime.jsxs("div", { className: "flex min-w-0 items-center justify-center gap-0.5", children: [title ? (jsxRuntime.jsx("h3", { className: "truncate text-center text-sm font-semibold leading-6 text-fd-foreground", children: title })) : null, description ? (jsxRuntime.jsx(infoTooltip.InfoTooltip, { content: description, className: "not-prose -mx-0.5", desktopSide: "bottom" })) : null] }), collapsible ? (jsxRuntime.jsx("button", { type: "button", className: utils.cn('justify-self-end inline-flex size-8 shrink-0 items-center justify-center rounded-md text-fd-muted-foreground transition', 'hover:text-fd-accent-foreground', 'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 dark:focus-visible:ring-offset-slate-950', open && lib.themeIconColor, lib.themeRingColor), "aria-expanded": open, onClick: () => setOpen((value) => !value), children: open ? jsxRuntime.jsx(icons.EyeIcon, { className: "size-4" }) : jsxRuntime.jsx(icons.EyeOffIcon, { className: "size-4" }) })) : null] })) : null;
+    if (!mounted) {
+        return (jsxRuntime.jsxs("section", Object.assign({ "data-cheet-table": true, className: shellClassName, style: shellStyle }, props, { children: [titleBar, jsxRuntime.jsx("div", { ref: sourceRef, hidden: true, children: children })] })));
+    }
+    if (!model) {
+        return (jsxRuntime.jsxs("section", Object.assign({ "data-cheet-table": true, className: shellClassName, style: shellStyle }, props, { children: [titleBar, jsxRuntime.jsx("div", { ref: sourceRef, hidden: true, children: children }), open && parsed ? (jsxRuntime.jsx("div", { className: "px-4 py-6 text-center text-sm text-fd-muted-foreground", children: emptyText })) : null] })));
+    }
+    const content = model.rows.length > 0 ? (jsxRuntime.jsx("div", { className: "overflow-x-auto", children: jsxRuntime.jsxs("table", { className: "table-fixed border-separate border-spacing-0 text-sm", style: {
+                width: columnWidths.length
+                    ? columnWidths.reduce((total, width) => total + width, 0)
+                    : '100%',
+                minWidth: '100%',
+            }, children: [jsxRuntime.jsx("colgroup", { children: model.headers.map((header, index) => {
+                        var _a;
+                        return (jsxRuntime.jsx("col", { style: {
+                                width: (_a = columnWidths[index]) !== null && _a !== void 0 ? _a : DEFAULT_COLUMN_WIDTH,
+                                minWidth: MIN_COLUMN_WIDTH,
+                            } }, `${header.text}-${index}-col`));
+                    }) }), jsxRuntime.jsx("thead", { className: utils.cn(stickyHeader && 'sticky top-0 z-10'), children: jsxRuntime.jsx("tr", { children: model.headers.map((header, index) => (jsxRuntime.jsxs("th", { className: utils.cn('relative border-t border-b bg-fd-muted/80 px-3 py-2.5 align-middle text-xs font-semibold uppercase tracking-normal text-fd-muted-foreground first:pl-4 last:pr-4', index > 0 && 'border-l', CHEET_TABLE_BORDER_CLASS, 'text-left'), scope: "col", children: [jsxRuntime.jsx(CheetCellContent, { cell: header, force: header.force }), index < model.headers.length - 1 ? (jsxRuntime.jsx("button", { type: "button", "aria-label": "Resize column", className: utils.cn('absolute top-0 right-0 h-full w-2 cursor-col-resize touch-none select-none', 'after:absolute after:top-2 after:right-0 after:bottom-2 after:w-px after:bg-transparent after:transition-colors', 'hover:after:bg-fd-muted-foreground/40'), onPointerDown: (event) => startResize(event, index) })) : null] }, `${header.text}-${index}`))) }) }), jsxRuntime.jsx("tbody", { children: model.rows.map((row, rowIndex) => (jsxRuntime.jsx("tr", { className: utils.cn('transition-colors hover:bg-fd-accent/45', striped && rowIndex % 2 === 1 && 'bg-fd-muted/30'), children: model.headers.map((header, columnIndex) => {
+                            var _a;
+                            const cell = (_a = row[columnIndex]) !== null && _a !== void 0 ? _a : {
+                                rawText: '',
+                                text: '',
+                                force: false,
+                            };
+                            const cellId = `${rowIndex}:${columnIndex}`;
+                            const copyable = copyableColumnSet.has(header.text);
+                            return (jsxRuntime.jsx("td", { className: utils.cn('group px-3 py-2.5 align-top text-fd-foreground first:pl-4 last:pr-4', rowIndex < model.rows.length - 1 && 'border-b', columnIndex > 0 && 'border-l', 'text-left', CHEET_TABLE_BORDER_CLASS), onDoubleClick: (event) => {
+                                    event.preventDefault();
+                                    event.stopPropagation();
+                                }, children: jsxRuntime.jsx(CheetCellContent, { cell: cell, force: header.force || cell.force, copyable: copyable, copied: copiedCell === cellId, onCopy: copyable
+                                        ? () => handleCopy(cell.text, cellId)
+                                        : undefined }) }, cellId));
+                        }) }, rowIndex))) })] }) })) : (jsxRuntime.jsx("div", { className: "px-4 py-6 text-center text-sm text-fd-muted-foreground", children: emptyText }));
+    return (jsxRuntime.jsxs("section", Object.assign({ "data-cheet-table": true, className: shellClassName, style: shellStyle }, props, { children: [titleBar, jsxRuntime.jsx("div", { ref: sourceRef, hidden: true, children: children }), open ? content : null] })));
+}
+
+exports.CheetTable = CheetTable;