@blocklet/pages-kit 0.4.115 → 0.4.117

package/lib/cjs/builtin/async/rehype-mermaid.js

@@ -0,0 +1,26 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = () => Promise.resolve().then(() => __importStar(require('rehype-mermaid')));

package/lib/cjs/builtin/markdown/action-button.js

@@ -0,0 +1,41 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = ActionButton;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@iconify/react");
+const material_1 = require("@mui/material");
+const react_2 = require("react");
+const loading_button_1 = __importDefault(require("./loading-button"));
+function ActionButton({ tip, tipSucceed, title, titleSucceed, icon, iconSucceed, autoReset, placement = 'top', ...props }) {
+    const [active, setActive] = (0, react_2.useState)(false);
+    const [error, setError] = (0, react_2.useState)();
+    const timer = (0, react_2.useRef)();
+    const onClose = () => {
+        setError(undefined);
+        if (autoReset) {
+            timer.current = window.setTimeout(() => {
+                setActive(false);
+            }, 3000);
+        }
+    };
+    const onOpen = () => {
+        clearTimeout(timer.current);
+    };
+    const realIcon = active ? iconSucceed : icon;
+    const toolTipTitleText = error ? (0, jsx_runtime_1.jsx)(material_1.Box, { color: "error", children: error.message }) : (active && tipSucceed) || tip;
+    const buttonText = active ? titleSucceed : title;
+    return ((0, jsx_runtime_1.jsx)(material_1.Tooltip, { title: toolTipTitleText, disableInteractive: true, placement: placement, onClose: onClose, onOpen: onOpen, children: (0, jsx_runtime_1.jsx)("span", { children: (0, jsx_runtime_1.jsx)(loading_button_1.default, { startIcon: realIcon && (typeof realIcon === 'string' ? (0, jsx_runtime_1.jsx)(react_1.Icon, { icon: realIcon }) : realIcon), loadingPosition: realIcon ? 'start' : undefined, ...props, onClick: async (e) => {
+                    if (!props.onClick)
+                        return;
+                    try {
+                        await props.onClick(e);
+                        setActive(true);
+                    }
+                    catch (error) {
+                        setError(error);
+                    }
+                }, children: buttonText }) }) }));
+}

package/lib/cjs/builtin/markdown/index.js

@@ -0,0 +1,13 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useMarkdownOptions = exports.MarkdownContext = exports.MarkdownProvider = exports.MarkdownRenderer = void 0;
+const markdown_context_1 = require("./markdown-context");
+Object.defineProperty(exports, "MarkdownContext", { enumerable: true, get: function () { return markdown_context_1.MarkdownContext; } });
+Object.defineProperty(exports, "MarkdownProvider", { enumerable: true, get: function () { return markdown_context_1.MarkdownProvider; } });
+Object.defineProperty(exports, "useMarkdownOptions", { enumerable: true, get: function () { return markdown_context_1.useMarkdownOptions; } });
+const markdown_renderer_1 = __importDefault(require("./markdown-renderer"));
+exports.MarkdownRenderer = markdown_renderer_1.default;
+exports.default = markdown_renderer_1.default;

package/lib/cjs/builtin/markdown/loading-button.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const lab_1 = require("@mui/lab");
+const react_1 = require("react");
+const LoadingButton = (0, react_1.forwardRef)(({ onClick, ...props }, ref) => {
+    const [loading, setLoading] = (0, react_1.useState)(false);
+    const handleClick = (0, react_1.useCallback)(async (e) => {
+        try {
+            setLoading(true);
+            await onClick?.(e);
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [onClick]);
+    return (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, { ref: ref, ...props, loading: props.loading || loading, onClick: handleClick });
+});
+exports.default = LoadingButton;

package/lib/cjs/builtin/markdown/markdown-context.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useMarkdownOptions = exports.MarkdownContext = void 0;
+exports.MarkdownProvider = MarkdownProvider;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const defaultOptions = {
+    codeOptions: {
+        showActionButton: true,
+    },
+};
+exports.MarkdownContext = (0, react_1.createContext)(defaultOptions);
+const useMarkdownOptions = () => (0, react_1.useContext)(exports.MarkdownContext);
+exports.useMarkdownOptions = useMarkdownOptions;
+function MarkdownProvider({ children, options = defaultOptions }) {
+    return (0, jsx_runtime_1.jsx)(exports.MarkdownContext.Provider, { value: options, children: children });
+}

package/lib/cjs/builtin/markdown/markdown-renderer.js

@@ -0,0 +1,156 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@iconify/react");
+const material_1 = require("@mui/material");
+const react_2 = __importDefault(require("react"));
+const react_markdown_1 = require("react-markdown");
+const rehype_mermaid_1 = __importDefault(require("rehype-mermaid"));
+const remark_gfm_1 = __importDefault(require("remark-gfm"));
+const action_button_1 = __importDefault(require("./action-button"));
+const markdown_context_1 = require("./markdown-context");
+const ReactSyntaxHighlighter = react_2.default.lazy(() => Promise.resolve().then(() => __importStar(require('react-syntax-highlighter'))).then((m) => ({ default: m.Prism })));
+const matchLanguage = (className) => {
+    const match = /language-(\w+)/.exec(className || '');
+    return match?.[1];
+};
+function MarkdownCode({ node, inline, className, children, ...props }) {
+    const { codeOptions } = (0, markdown_context_1.useMarkdownOptions)();
+    if (!children)
+        return null;
+    const language = matchLanguage(className);
+    return !inline ? ((0, jsx_runtime_1.jsx)(material_1.Box, { component: ReactSyntaxHighlighter, language: language, style: codeOptions?.theme, showLineNumbers: true, ...props, sx: { borderRadius: 1 }, children: String(children).replace(/\n$/, '') })) : ((0, jsx_runtime_1.jsx)(material_1.Box, { component: "code", className: className, ...props, children: children }));
+}
+function MarkdownTable({ className, children }) {
+    return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: { overflow: 'auto', my: 1 }, children: (0, jsx_runtime_1.jsx)("table", { className: className, children: children }) }));
+}
+function MarkdownPre({ children }) {
+    const { codeOptions } = (0, markdown_context_1.useMarkdownOptions)();
+    const childrenProps = children?.props;
+    if (!childrenProps?.children)
+        return null;
+    const language = matchLanguage(childrenProps.className);
+    const showActionButton = codeOptions?.showActionButton !== false;
+    if (!showActionButton) {
+        return children;
+    }
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { component: "div", sx: {
+            fontSize: 14,
+            borderRadius: 1,
+            bgcolor: 'rgb(245, 242, 240)',
+            '> pre': { mt: '0 !important' },
+        }, children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", alignItems: "center", p: 0.5, pl: 1.5, borderBottom: 1, borderColor: "grey.200", children: [(0, jsx_runtime_1.jsx)(material_1.Box, { children: language }), (0, jsx_runtime_1.jsx)(material_1.Box, { flex: 1 }), (0, jsx_runtime_1.jsx)(action_button_1.default, { autoReset: true, title: (0, jsx_runtime_1.jsx)(react_1.Icon, { icon: "tabler:copy" }), titleSucceed: (0, jsx_runtime_1.jsx)(react_1.Icon, { icon: "tabler:copy-check" }), sx: { minWidth: 32, minHeight: 32, p: 0, fontSize: 18 }, onClick: () => {
+                            window.navigator.clipboard.writeText(childrenProps.children);
+                        } })] }), children] }));
+}
+function MarkdownRenderer(props) {
+    const { codeOptions = { showActionButton: true }, ...rest } = props;
+    const options = {
+        codeOptions,
+    };
+    return ((0, jsx_runtime_1.jsx)(StyledBox, { children: (0, jsx_runtime_1.jsx)(markdown_context_1.MarkdownProvider, { options: options, children: (0, jsx_runtime_1.jsx)(react_markdown_1.MarkdownHooks, { ...rest, remarkPlugins: [remark_gfm_1.default], rehypePlugins: [rehype_mermaid_1.default], components: {
+                    pre: MarkdownPre,
+                    code: MarkdownCode,
+                    table: MarkdownTable,
+                } }) }) }));
+}
+const StyledBox = (0, material_1.styled)(material_1.Box) `
+  width: 100%;
+  overflow: hidden;
+  word-break: break-word;
+
+  > * {
+    &:first-child /* emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason */ {
+      margin-top: 0;
+    }
+    &:last-child /* emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason */ {
+      margin-bottom: 0;
+    }
+  }
+
+  pre {
+    overflow: auto;
+  }
+
+  li {
+    margin: 0;
+    padding: 0;
+  }
+
+  li p {
+    display: inline-block;
+    vertical-align: top;
+    margin: 0;
+    padding: 0;
+  }
+
+  table {
+    border-collapse: collapse;
+    white-space: nowrap;
+
+    th,
+    td {
+      border: 1px solid grey;
+      padding: 4px 8px;
+    }
+  }
+
+  a {
+    color: ${({ theme }) => theme.palette.primary.main};
+
+    :hover {
+      text-decoration: underline;
+    }
+  }
+
+  &.writing > *:last-child {
+    &:after {
+      content: '';
+      display: inline-block;
+      vertical-align: middle;
+      height: 1.2em;
+      margin-top: -0.2em;
+      margin-left: 0.1em;
+      border-right: 0.2em solid orange;
+      border-radius: 10px;
+      animation: blink-caret 0.75s step-end infinite;
+
+      @keyframes blink-caret {
+        from,
+        to {
+          border-color: transparent;
+        }
+        50% {
+          border-color: ${({ theme }) => theme.palette.secondary.main};
+        }
+      }
+    }
+  }
+`;
+exports.default = MarkdownRenderer;