@blocklet/pages-kit 0.2.285 → 0.2.287

package/lib/cjs/builtin/async/ai-runtime/components/MarkdownRenderer.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 __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+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 locale_1 = require("../../../locale");
+const react_markdown_1 = __importDefault(require("../../react-markdown"));
+const react_syntax_highlighter_1 = __importDefault(require("../../react-syntax-highlighter"));
+const ActionButton_1 = require("./ActionButton");
+const ReactSyntaxHighlighter = react_2.default.lazy(() => (0, react_syntax_highlighter_1.default)().then((m) => ({ default: m.Prism })));
+const Markdown = react_2.default.lazy(() => Promise.all([
+    (0, react_markdown_1.default)(),
+    Promise.resolve().then(() => __importStar(require('https://esm.sh/remark-gfm@4?bundle'))),
+]).then(([{ default: Markdown }, remark]) => ({
+    default: (props) => (0, jsx_runtime_1.jsx)(Markdown, Object.assign({}, props, { remarkPlugins: [remark.default] })),
+})));
+const MarkdownRenderer = (0, material_1.styled)((props) => ((0, jsx_runtime_1.jsx)(Markdown, Object.assign({}, props, { components: {
+        pre: MarkdownPre,
+        code: (_a) => {
+            var { node, inline, className, children } = _a, props = __rest(_a, ["node", "inline", "className", "children"]);
+            if (!children)
+                return null;
+            const match = /language-(\w+)/.exec(className || '');
+            return !inline ? ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: ReactSyntaxHighlighter, language: match === null || match === void 0 ? void 0 : match[1] }, props, { sx: { borderRadius: 1 }, children: String(children).replace(/\n$/, '') }))) : ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: "code", className: className }, props, { children: children })));
+        },
+        table: ({ 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 }) }));
+        },
+    } })))) `
+  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;
+function MarkdownPre({ children }) {
+    const { t } = (0, locale_1.useLocaleContext)();
+    const childrenProps = children === null || children === void 0 ? void 0 : children.props;
+    if (!(childrenProps === null || childrenProps === void 0 ? void 0 : childrenProps.children))
+        return null;
+    const match = /language-(\w+)/.exec(childrenProps.className || '');
+    const language = match === null || match === void 0 ? void 0 : match[1];
+    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)(ActionButton_1.ActionButton, { autoReset: true, tip: t('copyToClipboard'), tipSucceed: t('copied'), 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] }));
+}

package/lib/cjs/builtin/async/ai-runtime/components/MenuButton.js

@@ -0,0 +1,43 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const icons_material_1 = require("@mui/icons-material");
+const material_1 = require("@mui/material");
+const react_1 = require("react");
+function MenuButton({ sx, menus, children }) {
+    const [anchorEl, setAnchorEl] = (0, react_1.useState)(null);
+    const open = Boolean(anchorEl);
+    const handleClick = (event) => {
+        setAnchorEl(event.currentTarget);
+    };
+    const handleClose = () => {
+        setAnchorEl(null);
+    };
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: sx, children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: handleClick, children: children || (0, jsx_runtime_1.jsx)(icons_material_1.MoreHoriz, {}) }), (0, jsx_runtime_1.jsx)(material_1.Menu, { disableScrollLock: true, MenuListProps: {
+                    sx: {
+                        p: 0.5,
+                        '.MuiMenuItem-root': {
+                            minWidth: 120,
+                            fontSize: 14,
+                            lineHeight: 1.5,
+                            fontWeight: 'medium',
+                            borderRadius: 0.5,
+                        },
+                    },
+                }, slotProps: {
+                    paper: {
+                        sx: {
+                            border: 1,
+                            borderColor: 'divider',
+                            boxShadow: '0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)',
+                        },
+                    },
+                }, anchorEl: anchorEl, anchorOrigin: {
+                    vertical: 'bottom',
+                    horizontal: 'right',
+                }, transformOrigin: {
+                    vertical: 'top',
+                    horizontal: 'right',
+                }, open: open, onClick: handleClose, onClose: handleClose, children: typeof menus === 'function' ? menus() : menus })] }));
+}
+exports.default = MenuButton;

package/lib/cjs/builtin/async/ai-runtime/components/PoweredBy.js

@@ -0,0 +1,30 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const locale_1 = require("../../../locale");
+const subscribe_1 = require("../hooks/subscribe");
+function PoweredBy(_a) {
+    var { assistantId } = _a, props = __rest(_a, ["assistantId"]);
+    const { t } = (0, locale_1.useLocaleContext)();
+    const { subscribeLink } = (0, subscribe_1.useSubscribeLink)({ assistantId });
+    return ((0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ py: 0.5 }, props, { children: [subscribeLink && ((0, jsx_runtime_1.jsxs)(material_1.Box, { className: "ai-chat-require-subscribe-footer", sx: {
+                    px: 2,
+                    fontSize: 12,
+                    lineHeight: '20px',
+                    textAlign: 'center',
+                    color: 'rgba(75, 85, 99, 1)',
+                }, children: [t('requireNewSubscriptionFooter'), (0, jsx_runtime_1.jsx)(material_1.Link, { href: subscribeLink, sx: { ml: 0.5 }, children: t('subscribeNow') })] })), (0, jsx_runtime_1.jsx)(material_1.Stack, { className: "ai-chat-powered-by", direction: "row", justifyContent: "center", children: (0, jsx_runtime_1.jsxs)(material_1.Typography, { variant: "caption", sx: { display: 'inline-flex', alignItems: 'center', a: { display: 'inline-flex', alignItems: 'center' } }, children: [(0, jsx_runtime_1.jsxs)(material_1.Typography, { component: "span", fontSize: 12, color: "text.poweredBy", children: [t('poweredBy'), ' '] }), "\u00A0", (0, jsx_runtime_1.jsxs)(material_1.Link, { href: "https://www.arcblock.io", target: "_blank", color: "text.poweredBy", children: [(0, jsx_runtime_1.jsx)(material_1.Box, { component: "img", src: "https://www.arcblock.io/.well-known/service/blocklet/logo", sx: { height: 16, verticalAlign: 'middle', mr: 0.5, borderRadius: 0.5 } }), "ArcBlock"] }), "\u00A0\u00B7\u00A0", (0, jsx_runtime_1.jsxs)(material_1.Link, { href: "https://www.aigne.io", target: "_blank", color: "text.poweredBy", children: [(0, jsx_runtime_1.jsx)(material_1.Box, { component: "img", src: "https://www.aigne.io/.well-known/service/blocklet/logo", sx: { height: 16, verticalAlign: 'middle', mr: 0.5, borderRadius: 0.5 } }), "AIGNE"] })] }) })] })));
+}
+exports.default = PoweredBy;

package/lib/cjs/builtin/async/ai-runtime/components/RuntimeProvider.js

@@ -0,0 +1,16 @@
+"use strict";
+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 = __importDefault(require("react"));
+const locale_1 = require("../../../locale");
+const locales_1 = require("../locales");
+const GlobalLoading_1 = __importDefault(require("./GlobalLoading"));
+const ThemeProvider_1 = __importDefault(require("./ThemeProvider"));
+function RuntimeProvider({ children }) {
+    const { locale } = (0, locale_1.useLocaleContext)();
+    return ((0, jsx_runtime_1.jsx)(locale_1.LocaleProvider, { translations: locales_1.translations, locale: locale, fallbackLocale: "en", children: (0, jsx_runtime_1.jsx)(ThemeProvider_1.default, { children: (0, jsx_runtime_1.jsxs)(react_1.default.Suspense, { children: [(0, jsx_runtime_1.jsx)(GlobalLoading_1.default, { sx: { position: 'fixed', left: 0, top: 0, width: '100%', zIndex: 'snackbar' } }), children] }) }) }));
+}
+exports.default = RuntimeProvider;

package/lib/cjs/builtin/async/ai-runtime/components/ScrollView.js

@@ -0,0 +1,109 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useScrollToBottomModule = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const react_1 = require("react");
+const react_scroll_to_bottom_1 = __importDefault(require("../../react-scroll-to-bottom"));
+const scrollToBottomModuleLoader = {};
+function loadScrollToBottomModule() {
+    var _a;
+    (_a = scrollToBottomModuleLoader.promise) !== null && _a !== void 0 ? _a : (scrollToBottomModuleLoader.promise = (0, react_scroll_to_bottom_1.default)()
+        .then((mod) => {
+        scrollToBottomModuleLoader.mod = mod;
+        return mod;
+    })
+        .catch((error) => {
+        scrollToBottomModuleLoader.error = error;
+        throw error;
+    }));
+    return scrollToBottomModuleLoader;
+}
+function useScrollToBottomModule() {
+    const loader = loadScrollToBottomModule();
+    const [mod, setMod] = (0, react_1.useState)(loader.mod);
+    const [error, setError] = (0, react_1.useState)(loader.error);
+    (0, react_1.useEffect)(() => {
+        (() => __awaiter(this, void 0, void 0, function* () {
+            try {
+                yield loader.promise;
+                if (loader.mod)
+                    setMod(loader.mod);
+                else if (loader.error)
+                    setError(loader.error);
+            }
+            catch (error) {
+                setError(error);
+            }
+        }))();
+    }, []);
+    if (mod)
+        return mod;
+    if (error)
+        throw error;
+    throw loader.promise;
+}
+exports.useScrollToBottomModule = useScrollToBottomModule;
+function ScrollView(_a) {
+    var { children, initialScrollBehavior } = _a, props = __rest(_a, ["children", "initialScrollBehavior"]);
+    const { Composer } = useScrollToBottomModule();
+    return ((0, jsx_runtime_1.jsx)(Composer, { initialScrollBehavior: initialScrollBehavior, children: (0, jsx_runtime_1.jsx)(ScrollViewWithinWindow, Object.assign({}, props, { children: children })) }));
+}
+exports.default = ScrollView;
+function ScrollViewWithinWindow(_a) {
+    var { children, scroller, component } = _a, props = __rest(_a, ["children", "scroller", "component"]);
+    const { setTarget } = useScrollToBottomModule().useInternalContext();
+    const ele = useFakeScrollElementOfWindow();
+    (0, react_1.useEffect)(() => {
+        if (scroller === 'window') {
+            setTarget(ele);
+        }
+    }, [scroller]);
+    if (!component)
+        return children;
+    return ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: component }, props, { ref: !scroller ? setTarget : undefined, children: children })));
+}
+function useFakeScrollElementOfWindow() {
+    return (0, react_1.useMemo)(() => {
+        const e = document.scrollingElement;
+        return new Proxy(e, {
+            get: (_, p) => {
+                if (p === 'offsetHeight')
+                    return window.innerHeight;
+                if (['addEventListener', 'removeEventListener'].includes(p))
+                    return window[p].bind(window);
+                const v = e[p];
+                if (v instanceof Function)
+                    return v.bind(e);
+                return v;
+            },
+            set: (_, p, v) => {
+                e[p] = v;
+                return true;
+            },
+        });
+    }, []);
+}

package/lib/cjs/builtin/async/ai-runtime/components/SocialShare.js

@@ -0,0 +1,102 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SocialShareButtons = exports.SocialShareMenu = void 0;
+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 react_share_1 = require("react-share");
+const locale_1 = require("../../../locale");
+const locales_1 = require("../locales");
+const utils_1 = require("../utils");
+const MenuButton_1 = __importDefault(require("./MenuButton"));
+const getFormattedUrl = (url) => {
+    // remove page & sessionId query params
+    const urlObj = new URL(url);
+    urlObj.searchParams.delete('page');
+    urlObj.searchParams.delete('sessionId');
+    return urlObj.toString();
+};
+function SocialShare(props) {
+    const { type = 'menu' } = props, restProps = __rest(props, ["type"]);
+    const { locale } = (0, locale_1.useLocaleContext)();
+    const renderContent = (0, react_2.useCallback)(() => {
+        // @ts-ignore
+        if (type === 'buttons') {
+            return (0, jsx_runtime_1.jsx)(SocialShareButtons, Object.assign({}, restProps));
+        }
+        return (0, jsx_runtime_1.jsx)(SocialShareMenu, Object.assign({}, restProps));
+    }, [type, restProps]);
+    return ((0, jsx_runtime_1.jsx)(locale_1.LocaleProvider, { translations: locales_1.translations, locale: locale, fallbackLocale: "en", children: renderContent() }));
+}
+exports.default = SocialShare;
+function SocialShareMenu(_a) {
+    var { url = getFormattedUrl(window.location.href), content } = _a, restProps = __rest(_a, ["url", "content"]);
+    const theme = (0, material_1.useTheme)();
+    const { t } = (0, locale_1.useLocaleContext)();
+    const itemIconSx = {
+        width: 22,
+        height: 22,
+        border: 1,
+        borderColor: theme.palette.text.secondary,
+        borderRadius: 0.75,
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+    };
+    const buttonSx = {
+        display: 'flex',
+        alignItems: 'center',
+        gap: 1.5,
+        minWidth: 120,
+        lineHeight: '1!important',
+    };
+    const iconProps = {
+        bgStyle: { fill: '#fff' },
+        iconFillColor: theme.palette.text.secondary,
+        style: {
+            borderRadius: '6px',
+        },
+    };
+    const renderShareIcon = () => {
+        // eslint-disable-next-line react/no-unstable-nested-components
+        return (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: () => (0, jsx_runtime_1.jsx)(react_1.Icon, { icon: "tabler:share" }) }, restProps));
+    };
+    return ((0, jsx_runtime_1.jsx)(MenuButton_1.default, { menus: [
+            (0, jsx_runtime_1.jsx)(material_1.MenuItem, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { component: react_share_1.TwitterShareButton, url: url, title: content, sx: buttonSx, children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: react_share_1.XIcon, sx: itemIconSx, round: true }, iconProps)), (0, jsx_runtime_1.jsx)("span", { children: t('socialShare.shareToX') })] }) }, "shareOnX"),
+            (0, jsx_runtime_1.jsx)(material_1.MenuItem, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { component: react_share_1.TelegramShareButton, url: url, title: content, sx: buttonSx, children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: react_share_1.TelegramIcon, sx: itemIconSx, round: true }, iconProps)), (0, jsx_runtime_1.jsx)("span", { children: t('socialShare.shareToTelegram') })] }) }, "shareOnTelegram"),
+            (0, jsx_runtime_1.jsx)(material_1.MenuItem, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { component: react_share_1.RedditShareButton, url: url, title: content, sx: buttonSx, children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: react_share_1.RedditIcon, sx: itemIconSx, round: true }, iconProps)), (0, jsx_runtime_1.jsx)("span", { children: t('socialShare.shareToReddit') })] }) }, "shareOnReddit"),
+            (0, jsx_runtime_1.jsx)(material_1.MenuItem, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { component: react_share_1.WeiboShareButton, url: url, title: content, sx: buttonSx, children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: react_share_1.WeiboIcon, sx: itemIconSx, round: true }, iconProps)), (0, jsx_runtime_1.jsx)("span", { children: t('socialShare.shareToWeibo') })] }) }, "shareOnWeibo"),
+            (0, jsx_runtime_1.jsx)(material_1.MenuItem, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { component: react_share_1.FacebookShareButton, url: url, sx: buttonSx, children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: react_share_1.FacebookIcon, sx: itemIconSx, round: true }, iconProps)), (0, jsx_runtime_1.jsx)("span", { children: t('socialShare.shareToFacebook') })] }) }, "shareOnFacebook"),
+            (0, jsx_runtime_1.jsx)(material_1.MenuItem, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { component: react_share_1.LinkedinShareButton, url: url, summary: content, sx: buttonSx, children: [(0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: react_share_1.LinkedinIcon, sx: itemIconSx, round: true }, iconProps)), (0, jsx_runtime_1.jsx)("span", { children: t('socialShare.shareToLinkedin') })] }) }, "shareOnLinkedin"),
+            (0, jsx_runtime_1.jsx)(material_1.MenuItem, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { component: "div", sx: buttonSx, onClick: () => {
+                        window.navigator.clipboard.writeText(url);
+                    }, children: [(0, jsx_runtime_1.jsx)(material_1.Box, { sx: itemIconSx, round: true, children: (0, jsx_runtime_1.jsx)(react_1.Icon, Object.assign({ icon: "tabler:link" }, iconProps)) }), (0, jsx_runtime_1.jsx)("span", { children: t('socialShare.copyLink') })] }) }, "copyToClipboard"),
+        ], children: renderShareIcon() }));
+}
+exports.SocialShareMenu = SocialShareMenu;
+function SocialShareButtons(_a) {
+    var { url = getFormattedUrl(window.location.href), content, sx, itemSx, onClick, bgFill, iconFill } = _a, rest = __rest(_a, ["url", "content", "sx", "itemSx", "onClick", "bgFill", "iconFill"]);
+    const mergedSx = (0, utils_1.mergeSx)({ display: 'flex', alignItems: 'center', gap: 0.5, lineHeight: 1 }, sx);
+    const mergedItemSx = (0, utils_1.mergeSx)({ width: { xs: 24, sm: 28 }, height: { xs: 24, sm: 28 }, borderRadius: 1 }, itemSx);
+    const iconProps = {
+        bgStyle: { fill: bgFill || '#bbb' },
+        iconFillColor: iconFill || '#fff',
+    };
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, Object.assign({ sx: mergedSx }, rest, { children: [(0, jsx_runtime_1.jsx)(react_share_1.TwitterShareButton, { url: url, title: content, children: (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: react_share_1.XIcon, sx: mergedItemSx }, iconProps)) }), (0, jsx_runtime_1.jsx)(react_share_1.TelegramShareButton, { url: url, title: content, children: (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: react_share_1.TelegramIcon, sx: mergedItemSx }, iconProps)) }), (0, jsx_runtime_1.jsx)(react_share_1.RedditShareButton, { url: url, title: content, children: (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: react_share_1.RedditIcon, sx: mergedItemSx }, iconProps)) }), (0, jsx_runtime_1.jsx)(react_share_1.WeiboShareButton, { url: url, title: content, children: (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: react_share_1.WeiboIcon, sx: mergedItemSx }, iconProps)) }), (0, jsx_runtime_1.jsx)(react_share_1.FacebookShareButton, { url: url, children: (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: react_share_1.FacebookIcon, sx: mergedItemSx }, iconProps)) }), (0, jsx_runtime_1.jsx)(react_share_1.LinkedinShareButton, { url: url, summary: content, children: (0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ component: react_share_1.LinkedinIcon, sx: mergedItemSx }, iconProps)) })] })));
+}
+exports.SocialShareButtons = SocialShareButtons;

package/lib/cjs/builtin/async/ai-runtime/components/ThemeProvider.js

@@ -0,0 +1,193 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const icons_material_1 = require("@mui/icons-material");
+const material_1 = require("@mui/material");
+const react_1 = require("react");
+function ThemeProvider({ children, template, transparentHeaderBg, }) {
+    const theme = (0, material_1.useTheme)();
+    const colors = {
+        default: {
+            color: undefined,
+            bg: '#ffffff',
+            // primary: '#333843',
+            primary: '#3B82F6',
+        },
+        blue: {
+            color: 'white',
+            bg: 'linear-gradient(180deg, #0D60FF 0%, #E2EDFE 100%)',
+            primary: '#0D60FF',
+        },
+        red: {
+            color: 'white',
+            bg: 'linear-gradient(180deg, #F65F84 0%, #817DE6 100%), linear-gradient(180deg, #9300FF 0%, #D900FF 100%)',
+            primary: '#F65F84',
+        },
+        green: {
+            color: 'white',
+            bg: 'linear-gradient(180deg, #149E8C 0%, #35E77D 100%)',
+            primary: '#149E8C',
+        },
+    };
+    const color = colors[template] || colors.default;
+    const newTheme = (0, react_1.useMemo)(() => {
+        const themeOptions = {
+            components: {
+                MuiSelect: {
+                    defaultProps: { IconComponent: icons_material_1.ArrowDropDownRounded },
+                },
+                MuiTextField: {
+                    variants: [
+                        {
+                            props: {},
+                            style: ({ theme }) => theme.unstable_sx({
+                                '.MuiInputBase-root': {
+                                    fieldset: { borderColor: 'rgba(229, 231, 235, 1)' },
+                                    '&:hover': {
+                                        fieldset: {
+                                            border: 'none',
+                                            boxShadow: `0px 0px 0px 4px ${(0, material_1.alpha)(theme.palette.primary.main, 0.2)}, 0px 0px 0px 1px ${theme.palette.primary.main}`,
+                                        },
+                                    },
+                                    '&.Mui-focused fieldset': {
+                                        border: 'none',
+                                        boxShadow: `0px 0px 0px 4px ${(0, material_1.alpha)(theme.palette.primary.main, 0.2)}, 0px 0px 0px 1px ${theme.palette.primary.main}`,
+                                    },
+                                },
+                            }),
+                        },
+                        {
+                            props: { select: true },
+                            style: (_a) => {
+                                var { theme } = _a, p = __rest(_a, ["theme"]);
+                                const { placeholder } = p;
+                                return theme.unstable_sx({
+                                    '& .MuiSelect-select .notranslate::after': placeholder
+                                        ? {
+                                            content: `"${placeholder}"`,
+                                            opacity: 0.42,
+                                        }
+                                        : {},
+                                    '& .MuiFormLabel-root:not(.MuiInputLabel-shrink) + .MuiInputBase-root > .MuiSelect-select .notranslate::after': {
+                                        opacity: 0,
+                                    },
+                                });
+                            },
+                        },
+                    ],
+                },
+                MuiListItemButton: {
+                    variants: [
+                        {
+                            props: {},
+                            style: ({ theme }) => theme.unstable_sx({
+                                fontSize: 13,
+                                color: '#010714',
+                            }),
+                        },
+                    ],
+                },
+                MuiDialog: {
+                    variants: [
+                        {
+                            props: {},
+                            style: ({ theme }) => theme.unstable_sx({
+                                '.MuiDialogTitle-root': {
+                                    px: 2.5,
+                                    py: 2,
+                                },
+                                '.MuiDialogContent-root': {
+                                    px: 2.5,
+                                    py: 2,
+                                },
+                                '.MuiDialogActions-root': {
+                                    px: 2.5,
+                                    py: 2,
+                                },
+                            }),
+                        },
+                    ],
+                },
+            },
+        };
+        const paletteTheme = (0, material_1.createTheme)({
+            palette: {
+                primary: {
+                    main: color.primary,
+                },
+                secondary: {
+                    main: '#010714',
+                },
+                text: {
+                    secondary: '#98A3B1',
+                    // @ts-ignore
+                    poweredBy: 'rgba(209, 213, 219, 1)',
+                },
+                // @ts-ignore custom `black` color
+                black: {
+                    main: '#010714',
+                },
+            },
+        });
+        return (0, material_1.createTheme)(theme, themeOptions, {
+            palette: {
+                primary: paletteTheme.palette.primary,
+                secondary: paletteTheme.palette.secondary,
+                text: paletteTheme.palette.text,
+                // @ts-ignore
+                black: paletteTheme.palette.black,
+                background: {
+                    default: color.bg,
+                },
+            },
+            shape: {
+                borderRadius: 8,
+            },
+            shadows: [
+                'none',
+                '0px 0px 0px 1px rgba(2, 7, 19, 0.08), 0px 1px 2px -1px rgba(2, 7, 19, 0.08), 0px 2px 4px 0px rgba(2, 7, 19, 0.04)',
+                '0px 0px 0px 1px rgba(2, 7, 19, 0.08), 0px 1px 2px -1px rgba(2, 7, 19, 0.08), 0px 2px 8px 0px rgba(2, 7, 19, 0.10)',
+                ...paletteTheme.shadows.slice(3),
+            ],
+        });
+    }, [theme]);
+    return ((0, jsx_runtime_1.jsxs)(material_1.ThemeProvider, { theme: newTheme, children: [(0, jsx_runtime_1.jsx)(material_1.GlobalStyles, { styles: {
+                    '.page-header': transparentHeaderBg
+                        ? {
+                            backgroundColor: 'transparent !important',
+                            color: color.color,
+                            button: {
+                                color: color.color,
+                            },
+                        }
+                        : {
+                            // with border bottom
+                            borderBottom: '1px solid rgba(229, 231, 235, 1)',
+                        },
+                    body: {
+                        background: 'transparent !important',
+                        '&:before': {
+                            content: '""',
+                            position: 'fixed',
+                            left: 0,
+                            top: 0,
+                            right: 0,
+                            bottom: 0,
+                            background: color.bg,
+                            zIndex: -1,
+                        },
+                    },
+                } }), children] }));
+}
+exports.default = ThemeProvider;