@blocklet/pages-kit 0.2.291 → 0.2.293

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

@@ -0,0 +1,109 @@
+"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 types_1 = require("@blocklet/ai-runtime/types");
+const material_1 = require("@mui/material");
+const react_1 = require("react");
+const react_wrap_balancer_1 = __importStar(require("react-wrap-balancer"));
+const CustomComponentRenderer_1 = __importDefault(require("../../../../../../../components/CustomComponentRenderer"));
+const common_1 = require("../../../common");
+const ScrollView_1 = __importStar(require("../../../ScrollView"));
+const CurrentAgent_1 = __importStar(require("../../contexts/CurrentAgent"));
+const CurrentMessage_1 = __importStar(require("../../contexts/CurrentMessage"));
+const runtime_1 = require("../../state/runtime");
+function SimpleChat({ primaryColor }) {
+    const inheritedTheme = (0, material_1.useTheme)();
+    const theme = (0, react_1.useMemo)(() => {
+        let { primary } = inheritedTheme.palette;
+        try {
+            if (primaryColor) {
+                primary = inheritedTheme.palette.augmentColor({ color: { main: primaryColor } });
+            }
+        }
+        catch (error) {
+            console.error('augment primary color error', { error });
+        }
+        return (0, material_1.createTheme)(inheritedTheme, {
+            palette: { primary },
+            shape: {
+                borderRadius: 8,
+            },
+        });
+    }, [inheritedTheme, primaryColor]);
+    return ((0, jsx_runtime_1.jsx)(material_1.ThemeProvider, { theme: theme, children: (0, jsx_runtime_1.jsx)(ScrollView_1.default, { scroller: "window", initialScrollBehavior: "auto", children: (0, jsx_runtime_1.jsx)(SimpleChatView, {}) }) }));
+}
+exports.default = SimpleChat;
+function SimpleChatView() {
+    var _a;
+    const { agent, appearancePage, sessionState } = (0, runtime_1.useRuntimeState)();
+    const scrollToBottom = (0, ScrollView_1.useScrollToBottomModule)().useScrollToBottom();
+    (0, react_1.useEffect)(() => {
+        if (sessionState.running)
+            scrollToBottom();
+    }, [scrollToBottom, sessionState.running]);
+    const children = (0, react_1.useMemo)(() => {
+        var _a, _b;
+        return (_b = (_a = agent.outputVariables) === null || _a === void 0 ? void 0 : _a.find((i) => i.name === types_1.RuntimeOutputVariable.children)) === null || _b === void 0 ? void 0 : _b.initialValue;
+    }, [agent]);
+    return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { flexGrow: 1, maxWidth: "md", width: "100%", mx: "auto", px: { xs: 2, sm: 3 }, children: [(0, jsx_runtime_1.jsx)(material_1.Stack, { gap: 2, mt: 8, mb: 4, children: (0, jsx_runtime_1.jsxs)(react_wrap_balancer_1.Provider, { children: [(appearancePage === null || appearancePage === void 0 ? void 0 : appearancePage.name) && ((0, jsx_runtime_1.jsx)(material_1.Typography, { component: "h5", fontSize: 30, fontWeight: 700, textAlign: "center", children: (0, jsx_runtime_1.jsx)(react_wrap_balancer_1.default, { children: appearancePage.name }) })), (appearancePage === null || appearancePage === void 0 ? void 0 : appearancePage.description) && ((0, jsx_runtime_1.jsx)(material_1.Typography, { textAlign: "center", children: (0, jsx_runtime_1.jsx)(react_wrap_balancer_1.default, { children: appearancePage.description }) }))] }) }), (0, jsx_runtime_1.jsx)(material_1.Stack, { children: (0, jsx_runtime_1.jsx)(OutputView, {}) }), (0, jsx_runtime_1.jsx)(material_1.Box, { flexGrow: 1, minHeight: 200 }), (0, jsx_runtime_1.jsx)(material_1.Stack, { sx: { position: 'sticky', bottom: 0, py: 1, bgcolor: 'background.paper', zIndex: 10 }, children: (_a = children === null || children === void 0 ? void 0 : children.agents) === null || _a === void 0 ? void 0 : _a.map((i) => ((0, jsx_runtime_1.jsx)(CurrentAgent_1.default, { agentId: i.id, children: (0, jsx_runtime_1.jsx)(AgentInputRender, {}) }, i.id))) })] }));
+}
+function AgentInputRender() {
+    var _a, _b;
+    const { agent } = (0, CurrentAgent_1.useCurrentAgent)();
+    const input = (_b = (_a = agent.outputVariables) === null || _a === void 0 ? void 0 : _a.find((i) => i.name === types_1.RuntimeOutputVariable.appearanceInput)) === null || _b === void 0 ? void 0 : _b.initialValue;
+    if (!(input === null || input === void 0 ? void 0 : input.componentId))
+        return null;
+    return ((0, jsx_runtime_1.jsx)(material_1.Stack, { children: (0, jsx_runtime_1.jsx)(CustomComponentRenderer_1.default, { componentId: input.componentId, properties: input.componentProps }) }));
+}
+function OutputView() {
+    var _a, _b;
+    const { sessionState } = (0, runtime_1.useRuntimeState)();
+    const lastMessage = (_a = sessionState.messages) === null || _a === void 0 ? void 0 : _a.slice(-1)[0];
+    return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: 2, children: [(_b = sessionState.messages) === null || _b === void 0 ? void 0 : _b.map((message) => ((0, jsx_runtime_1.jsx)(material_1.Stack, { children: (0, jsx_runtime_1.jsx)(CurrentAgent_1.default, { agentId: message.assistantId, children: (0, jsx_runtime_1.jsx)(CurrentMessage_1.default, { message: message, children: (0, jsx_runtime_1.jsx)(react_1.Suspense, { children: (0, jsx_runtime_1.jsx)(OutputItemView, {}) }) }) }) }))), lastMessage && ((0, jsx_runtime_1.jsx)(CurrentAgent_1.default, { agentId: lastMessage.assistantId, children: (0, jsx_runtime_1.jsx)(CurrentMessage_1.default, { message: lastMessage, children: (0, jsx_runtime_1.jsx)(SuggestedQuestionsView, {}) }) }))] }));
+}
+function OutputItemView() {
+    var _a, _b;
+    const { agent } = (0, CurrentAgent_1.useCurrentAgent)();
+    const input = (_b = (_a = agent.outputVariables) === null || _a === void 0 ? void 0 : _a.find((i) => i.name === types_1.RuntimeOutputVariable.appearanceOutput)) === null || _b === void 0 ? void 0 : _b.initialValue;
+    if (!(input === null || input === void 0 ? void 0 : input.componentId))
+        return null;
+    return (0, jsx_runtime_1.jsx)(CustomComponentRenderer_1.default, { componentId: input.componentId, properties: input.componentProps });
+}
+function SuggestedQuestionsView() {
+    const { execute } = (0, runtime_1.useRuntimeState)();
+    const { aid } = (0, CurrentAgent_1.useCurrentAgent)();
+    const { message } = (0, CurrentMessage_1.useCurrentMessage)();
+    const suggestedQuestions = (0, react_1.useMemo)(() => {
+        var _a, _b, _c;
+        return (_c = (_b = (_a = message === null || message === void 0 ? void 0 : message.result) === null || _a === void 0 ? void 0 : _a.objects) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.data[types_1.RuntimeOutputVariable.suggestedQuestions];
+    }, [message]);
+    return ((0, jsx_runtime_1.jsx)(material_1.Box, { ml: 6.5, mr: 2.5, children: (suggestedQuestions === null || suggestedQuestions === void 0 ? void 0 : suggestedQuestions.length) ? ((0, jsx_runtime_1.jsx)(common_1.MessageSuggestedQuestions, { dataSource: suggestedQuestions, onClick: (item) => {
+                execute({ aid, parameters: Object.assign(Object.assign({}, message.parameters), { question: item.question }) });
+            } })) : null }));
+}

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

@@ -0,0 +1,17 @@
+"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 material_1 = require("@mui/material");
+const common_1 = require("../../../common");
+const MarkdownRenderer_1 = __importDefault(require("../../../MarkdownRenderer"));
+const CurrentMessage_1 = require("../../contexts/CurrentMessage");
+function BaseOutputs() {
+    var _a, _b;
+    const { message } = (0, CurrentMessage_1.useCurrentMessage)();
+    const objects = (_a = message.result) === null || _a === void 0 ? void 0 : _a.objects;
+    return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: 2, boxShadow: 1, borderRadius: 1, p: 2, children: [(0, jsx_runtime_1.jsx)(MarkdownRenderer_1.default, { children: (_b = message.result) === null || _b === void 0 ? void 0 : _b.content }), objects === null || objects === void 0 ? void 0 : objects.map((item) => (0, jsx_runtime_1.jsx)(common_1.MessageMetadataRenderer, { object: item.data }))] }));
+}
+exports.default = BaseOutputs;

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

@@ -0,0 +1,87 @@
+"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 types_1 = require("@blocklet/ai-runtime/types");
+const material_1 = require("@mui/material");
+const react_1 = require("react");
+const react_wrap_balancer_1 = __importStar(require("react-wrap-balancer"));
+const CustomComponentRenderer_1 = __importDefault(require("../../../../../../../components/CustomComponentRenderer"));
+const CurrentAgent_1 = __importStar(require("../../contexts/CurrentAgent"));
+const CurrentMessage_1 = __importDefault(require("../../contexts/CurrentMessage"));
+const runtime_1 = require("../../state/runtime");
+function SimplePage({ resultTitle, primaryColor }) {
+    var _a;
+    const { agent, appearancePage } = (0, runtime_1.useRuntimeState)();
+    const children = (0, react_1.useMemo)(() => {
+        var _a, _b;
+        return (_b = (_a = agent.outputVariables) === null || _a === void 0 ? void 0 : _a.find((i) => i.name === types_1.RuntimeOutputVariable.children)) === null || _b === void 0 ? void 0 : _b.initialValue;
+    }, [agent]);
+    const inheritedTheme = (0, material_1.useTheme)();
+    const theme = (0, react_1.useMemo)(() => {
+        let { primary } = inheritedTheme.palette;
+        try {
+            if (primaryColor) {
+                primary = inheritedTheme.palette.augmentColor({ color: { main: primaryColor } });
+            }
+        }
+        catch (error) {
+            console.error('augment primary color error', { error });
+        }
+        return (0, material_1.createTheme)(inheritedTheme, {
+            palette: { primary },
+            shape: {
+                borderRadius: 8,
+            },
+        });
+    }, [inheritedTheme, primaryColor]);
+    return ((0, jsx_runtime_1.jsx)(material_1.ThemeProvider, { theme: theme, children: (0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: 2, maxWidth: "md", width: "100%", mx: "auto", px: { xs: 2, sm: 3 }, children: [(0, jsx_runtime_1.jsx)(material_1.Stack, { gap: 2, mt: 8, mb: 4, children: (0, jsx_runtime_1.jsxs)(react_wrap_balancer_1.Provider, { children: [(appearancePage === null || appearancePage === void 0 ? void 0 : appearancePage.name) && ((0, jsx_runtime_1.jsx)(material_1.Typography, { component: "h5", fontSize: 30, fontWeight: 700, textAlign: "center", children: (0, jsx_runtime_1.jsx)(react_wrap_balancer_1.default, { children: appearancePage.name }) })), (appearancePage === null || appearancePage === void 0 ? void 0 : appearancePage.description) && ((0, jsx_runtime_1.jsx)(material_1.Typography, { textAlign: "center", children: (0, jsx_runtime_1.jsx)(react_wrap_balancer_1.default, { children: appearancePage.description }) }))] }) }), (0, jsx_runtime_1.jsx)(material_1.Stack, { children: (_a = children === null || children === void 0 ? void 0 : children.agents) === null || _a === void 0 ? void 0 : _a.map((i) => ((0, jsx_runtime_1.jsx)(CurrentAgent_1.default, { agentId: i.id, children: (0, jsx_runtime_1.jsx)(AgentInputRender, {}) }, i.id))) }), (0, jsx_runtime_1.jsx)(material_1.Stack, { children: (0, jsx_runtime_1.jsx)(OutputView, { resultTitle: resultTitle }) })] }) }));
+}
+exports.default = SimplePage;
+function AgentInputRender() {
+    var _a, _b;
+    const { agent } = (0, CurrentAgent_1.useCurrentAgent)();
+    const input = (_b = (_a = agent.outputVariables) === null || _a === void 0 ? void 0 : _a.find((i) => i.name === types_1.RuntimeOutputVariable.appearanceInput)) === null || _b === void 0 ? void 0 : _b.initialValue;
+    if (!(input === null || input === void 0 ? void 0 : input.componentId))
+        return null;
+    return ((0, jsx_runtime_1.jsx)(material_1.Stack, { children: (0, jsx_runtime_1.jsx)(CustomComponentRenderer_1.default, { componentId: input.componentId, properties: input.componentProps }) }));
+}
+function OutputView({ resultTitle }) {
+    var _a;
+    const { sessionState } = (0, runtime_1.useRuntimeState)();
+    const lastMessage = (_a = sessionState.messages) === null || _a === void 0 ? void 0 : _a.slice(-1)[0];
+    return ((0, jsx_runtime_1.jsx)(material_1.Stack, { gap: 2, children: lastMessage && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Stack, { children: resultTitle && ((0, jsx_runtime_1.jsx)(material_1.Typography, { component: "h5", fontSize: 36, fontWeight: 700, textAlign: "center", children: (0, jsx_runtime_1.jsx)(react_wrap_balancer_1.default, { children: resultTitle }) })) }), (0, jsx_runtime_1.jsx)(material_1.Stack, { children: (0, jsx_runtime_1.jsx)(CurrentAgent_1.default, { agentId: lastMessage.assistantId, children: (0, jsx_runtime_1.jsx)(CurrentMessage_1.default, { message: lastMessage, children: (0, jsx_runtime_1.jsx)(react_1.Suspense, { children: (0, jsx_runtime_1.jsx)(OutputItemView, {}) }) }) }) })] })) }));
+}
+function OutputItemView() {
+    var _a, _b;
+    const { agent } = (0, CurrentAgent_1.useCurrentAgent)();
+    const input = (_b = (_a = agent.outputVariables) === null || _a === void 0 ? void 0 : _a.find((i) => i.name === types_1.RuntimeOutputVariable.appearanceOutput)) === null || _b === void 0 ? void 0 : _b.initialValue;
+    if (!(input === null || input === void 0 ? void 0 : input.componentId))
+        return null;
+    return (0, jsx_runtime_1.jsx)(CustomComponentRenderer_1.default, { componentId: input.componentId, properties: input.componentProps });
+}

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

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCurrentAgent = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const utils_1 = require("../../../utils");
+const assistant_1 = require("../state/assistant");
+const runtime_1 = require("../state/runtime");
+const context = (0, react_1.createContext)(undefined);
+function CurrentAgentProvider({ agentId, children }) {
+    const { aid } = (0, runtime_1.useRuntimeState)();
+    const state = (0, react_1.useMemo)(() => ({
+        aid: (0, utils_1.stringifyIdentity)(Object.assign(Object.assign({}, (0, utils_1.parseIdentity)(aid, { rejectWhenError: true })), { assistantId: agentId })),
+    }), [aid, agentId]);
+    return (0, jsx_runtime_1.jsx)(context.Provider, { value: state, children: children });
+}
+exports.default = CurrentAgentProvider;
+function useCurrentAgent() {
+    const { working } = (0, runtime_1.useRuntimeState)();
+    const current = (0, react_1.useContext)(context);
+    if (!current) {
+        throw new Error('No such current agent state. You should use `useCurrentAgent` within the `CurrentAgentProvider`');
+    }
+    const [agent] = (0, assistant_1.useAssistantState)({ aid: current.aid, working });
+    return Object.assign(Object.assign({}, current), { agent });
+}
+exports.useCurrentAgent = useCurrentAgent;

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

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCurrentMessage = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const context = (0, react_1.createContext)(undefined);
+function CurrentMessageProvider({ message, children }) {
+    const state = (0, react_1.useMemo)(() => ({ message }), [message]);
+    return (0, jsx_runtime_1.jsx)(context.Provider, { value: state, children: children });
+}
+exports.default = CurrentMessageProvider;
+function useCurrentMessage() {
+    const current = (0, react_1.useContext)(context);
+    if (!current) {
+        throw new Error('No such message state. You should use `useCurrentMessage` within the `CurrentMessageProvider`');
+    }
+    return current;
+}
+exports.useCurrentMessage = useCurrentMessage;

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

@@ -0,0 +1,42 @@
+"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 types_1 = require("@blocklet/ai-runtime/types");
+const material_1 = require("@mui/material");
+const react_1 = require("react");
+const react_helmet_1 = require("react-helmet");
+const CustomComponentRenderer_1 = __importDefault(require("../../../../../components/CustomComponentRenderer"));
+const ux_1 = require("../../../../arcblock/ux");
+const header_1 = require("../../../../page/header");
+const RuntimeProvider_1 = __importDefault(require("../RuntimeProvider"));
+const runtime_1 = require("./state/runtime");
+function Runtime() {
+    var _a, _b;
+    const { agent, appearancePage, sessionState } = (0, runtime_1.useRuntimeState)();
+    (0, react_1.useEffect)(() => {
+        header_1.useHeaderState.setState((state) => {
+            var _a;
+            const logo = (_a = appearancePage === null || appearancePage === void 0 ? void 0 : appearancePage.logo) === null || _a === void 0 ? void 0 : _a.url;
+            state.logo = logo && (0, jsx_runtime_1.jsx)(material_1.Box, { component: ux_1.Avatar, src: logo, did: blocklet === null || blocklet === void 0 ? void 0 : blocklet.appId, borderRadius: 1, size: 44 });
+            state.brand = appearancePage === null || appearancePage === void 0 ? void 0 : appearancePage.name;
+        });
+        return () => {
+            header_1.useHeaderState.setState((state) => {
+                state.logo = undefined;
+                state.brand = undefined;
+            });
+        };
+    }, [appearancePage]);
+    (0, react_1.useEffect)(() => {
+        sessionState.load();
+    }, []);
+    const appearance = (_b = (_a = agent.outputVariables) === null || _a === void 0 ? void 0 : _a.find((i) => i.name === types_1.RuntimeOutputVariable.appearancePage)) === null || _b === void 0 ? void 0 : _b.initialValue;
+    const componentId = appearance === null || appearance === void 0 ? void 0 : appearance.componentId;
+    if (!componentId)
+        throw new Error('Missing output `appearance`');
+    return ((0, jsx_runtime_1.jsxs)(RuntimeProvider_1.default, { children: [appearancePage && ((0, jsx_runtime_1.jsxs)(react_helmet_1.Helmet, { children: [appearancePage.name && (0, jsx_runtime_1.jsx)("title", { children: appearancePage.name }), appearancePage.description && (0, jsx_runtime_1.jsx)("meta", { name: "description", content: appearancePage.description })] })), (0, jsx_runtime_1.jsx)(CustomComponentRenderer_1.default, { componentId: componentId, properties: appearance.componentProps })] }));
+}
+exports.default = Runtime;

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

@@ -0,0 +1,61 @@
+"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());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAssistantState = exports.createAssistantState = void 0;
+const zustand_1 = require("zustand");
+const immer_1 = require("zustand/middleware/immer");
+const assistant_1 = require("../../../api/assistant");
+const STATES = {};
+const createAssistantState = ({ aid, working, assistant, }) => {
+    var _a;
+    const key = working ? `${aid}-working` : aid;
+    (_a = STATES[key]) !== null && _a !== void 0 ? _a : (STATES[key] = (0, zustand_1.create)()((0, immer_1.immer)((set) => ({
+        assistant,
+        load: () => __awaiter(void 0, void 0, void 0, function* () {
+            set((state) => {
+                state.loading = true;
+            });
+            try {
+                const assistant = yield (0, assistant_1.getAssistant)({ assistantId: aid, working });
+                set((state) => {
+                    state.assistant = assistant;
+                });
+            }
+            catch (error) {
+                console.error(error);
+                set((state) => {
+                    state.error = error;
+                });
+            }
+            finally {
+                set((state) => {
+                    state.loading = false;
+                });
+            }
+        }),
+    }))));
+    return STATES[key];
+};
+exports.createAssistantState = createAssistantState;
+const LOADING_TASKS = {};
+function useAssistantState({ aid, working }) {
+    var _a;
+    const state = (0, exports.createAssistantState)({ aid, working })();
+    if (!state.assistant) {
+        if (state.error)
+            throw state.error;
+        const key = working ? `${aid}-working` : aid;
+        (_a = LOADING_TASKS[key]) !== null && _a !== void 0 ? _a : (LOADING_TASKS[key] = state.load());
+        throw LOADING_TASKS[key];
+    }
+    return [state.assistant, state];
+}
+exports.useAssistantState = useAssistantState;

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

@@ -0,0 +1,56 @@
+"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());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useRuntimeState = void 0;
+const types_1 = require("@blocklet/ai-runtime/types");
+const react_1 = require("react");
+const react_router_dom_1 = require("react-router-dom");
+const session_1 = require("../../../../../session");
+const error_1 = require("../../../error");
+const assistant_1 = require("./assistant");
+const session_2 = require("./session");
+function useRuntimeState() {
+    var _a;
+    const [query] = (0, react_router_dom_1.useSearchParams)();
+    const aid = query.get('aid');
+    if (!aid)
+        throw new error_1.CustomError(404, 'Missing required query parameters `aid`');
+    const working = query.get('working') === 'true';
+    const [agent] = (0, assistant_1.useAssistantState)({ aid, working });
+    const sessionState = (0, session_2.createSessionState)({ aid })();
+    const { session: authSession } = (0, session_1.useSessionContext)();
+    // reset state after logged out
+    (0, react_1.useEffect)(() => {
+        var _a;
+        if (!((_a = authSession.user) === null || _a === void 0 ? void 0 : _a.did)) {
+            sessionState.reset();
+        }
+    }, [(_a = authSession.user) === null || _a === void 0 ? void 0 : _a.did]);
+    const login = (0, react_1.useCallback)(() => __awaiter(this, void 0, void 0, function* () {
+        yield new Promise((resolve) => {
+            authSession.login(() => resolve());
+        });
+        yield Promise.all([sessionState.load()]);
+    }), [aid, authSession, sessionState]);
+    const execute = (0, react_1.useCallback)((args) => __awaiter(this, void 0, void 0, function* () {
+        if (!authSession.user) {
+            yield login();
+        }
+        return sessionState.execute(Object.assign(Object.assign({}, args), { working }));
+    }), [authSession.user, login, sessionState]);
+    const appearancePage = (0, react_1.useMemo)(() => {
+        var _a, _b;
+        const initialValue = (_b = (_a = agent.outputVariables) === null || _a === void 0 ? void 0 : _a.find((i) => i.name === types_1.RuntimeOutputVariable.appearancePage)) === null || _b === void 0 ? void 0 : _b.initialValue;
+        return initialValue;
+    }, [agent]);
+    return { aid, working, agent, appearancePage, sessionState, execute };
+}
+exports.useRuntimeState = useRuntimeState;

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

@@ -0,0 +1,213 @@
+"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 __asyncValues = (this && this.__asyncValues) || function (o) {
+    if (!Symbol.asyncIterator) throw new TypeError("Symbol.asyncIterator is not defined.");
+    var m = o[Symbol.asyncIterator], i;
+    return m ? m.call(o) : (o = typeof __values === "function" ? __values(o) : o[Symbol.iterator](), i = {}, verb("next"), verb("throw"), verb("return"), i[Symbol.asyncIterator] = function () { return this; }, i);
+    function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }
+    function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createSessionState = void 0;
+const zustand_1 = require("zustand");
+const immer_1 = require("zustand/middleware/immer");
+const message_1 = require("../../../api/message");
+const session_1 = require("../../../api/session");
+const utils_1 = require("../../../utils");
+const STATES = {};
+const GET_MESSAGES_LIMIT = 100;
+const GET_MESSAGES_ORDER_DIRECTION = 'desc';
+const createSessionState = ({ aid }) => {
+    var _a;
+    (_a = STATES[aid]) !== null && _a !== void 0 ? _a : (STATES[aid] = (0, zustand_1.create)()((0, immer_1.immer)((set, get) => ({
+        reset: () => {
+            set((state) => {
+                state.loading = undefined;
+                state.loaded = undefined;
+                state.running = undefined;
+                state.session = undefined;
+                state.messages = undefined;
+                state.noMoreMessage = undefined;
+                state.messageLoading = undefined;
+                state.error = undefined;
+            });
+        },
+        load: () => __awaiter(void 0, void 0, void 0, function* () {
+            var _b;
+            set((state) => {
+                state.loading = true;
+            });
+            try {
+                const { sessions } = yield (0, session_1.getSessions)((0, utils_1.parseIdentity)(aid, { rejectWhenError: true }));
+                const session = (_b = sessions[0]) !== null && _b !== void 0 ? _b : (yield (0, session_1.createSession)({ assistantId: aid })).created;
+                const { messages } = yield (0, message_1.getMessages)({
+                    sessionId: session.id,
+                    orderDirection: GET_MESSAGES_ORDER_DIRECTION,
+                    limit: GET_MESSAGES_LIMIT,
+                });
+                set((state) => {
+                    state.session = session;
+                    state.messages = messages.toReversed();
+                    state.noMoreMessage = messages.length < GET_MESSAGES_LIMIT;
+                });
+            }
+            catch (error) {
+                set((state) => {
+                    state.error = error;
+                });
+                throw error;
+            }
+            finally {
+                set((state) => {
+                    state.loaded = true;
+                    state.loading = false;
+                });
+            }
+        }),
+        loadMoreMessages: () => __awaiter(void 0, void 0, void 0, function* () {
+            var _c;
+            set((state) => {
+                state.messageLoading = true;
+            });
+            const { session, messages } = get();
+            if (!session)
+                return;
+            try {
+                const result = yield (0, message_1.getMessages)({
+                    sessionId: session.id,
+                    before: (_c = messages === null || messages === void 0 ? void 0 : messages.slice(-1)[0]) === null || _c === void 0 ? void 0 : _c.id,
+                    orderDirection: GET_MESSAGES_ORDER_DIRECTION,
+                    limit: GET_MESSAGES_LIMIT,
+                });
+                set((state) => {
+                    var _a;
+                    state.messages = ((_a = state.messages) !== null && _a !== void 0 ? _a : []).concat(result.messages.toReversed());
+                    state.noMoreMessage = result.messages.length < GET_MESSAGES_LIMIT;
+                });
+            }
+            finally {
+                set((state) => {
+                    state.messageLoading = false;
+                });
+            }
+        }),
+        execute: (_d) => __awaiter(void 0, [_d], void 0, function* ({ aid, working, parameters, onResponseStart, }) {
+            var _e, e_1, _f, _g;
+            let { session } = get();
+            if (!session) {
+                yield get().load();
+                session = get().session;
+            }
+            if (!session)
+                throw new Error('This session is not initialized');
+            const { id: sessionId } = session;
+            const identity = (0, utils_1.parseIdentity)(aid, { rejectWhenError: true });
+            let message;
+            set((state) => {
+                state.running = true;
+                state.error = undefined;
+            });
+            try {
+                const stream = (0, session_1.runAssistant)({
+                    sessionId,
+                    identity,
+                    working,
+                    parameters: Object.assign(Object.assign({}, parameters), { $clientTime: new Date().toISOString() }),
+                });
+                let responseStarted = false;
+                try {
+                    for (var _h = true, stream_1 = __asyncValues(stream), stream_1_1; stream_1_1 = yield stream_1.next(), _e = stream_1_1.done, !_e; _h = true) {
+                        _g = stream_1_1.value;
+                        _h = false;
+                        const value = _g;
+                        if (!responseStarted) {
+                            responseStarted = true;
+                            onResponseStart === null || onResponseStart === void 0 ? void 0 : onResponseStart();
+                        }
+                        if ((value === null || value === void 0 ? void 0 : value.type) === 'CHUNK') {
+                            if (!message) {
+                                message = {
+                                    taskId: value.taskId,
+                                    assistantId: identity.assistantId,
+                                    sessionId,
+                                    parameters,
+                                    createdAt: new Date().toISOString(),
+                                    updatedAt: new Date().toISOString(),
+                                    loading: true,
+                                };
+                                set((state) => {
+                                    var _a;
+                                    (_a = state.messages) !== null && _a !== void 0 ? _a : (state.messages = []);
+                                    state.messages.push(message);
+                                });
+                            }
+                            if (message.taskId === value.taskId) {
+                                requestAnimationFrame(() => {
+                                    set((state) => {
+                                        var _a, _b, _c, _d, _e, _f;
+                                        var _g;
+                                        const msg = (_a = state.messages) === null || _a === void 0 ? void 0 : _a.findLast((i) => i.taskId === message.taskId);
+                                        if (!msg)
+                                            return;
+                                        (_b = msg.result) !== null && _b !== void 0 ? _b : (msg.result = {});
+                                        msg.result.content = (msg.result.content || '') + (value.delta.content || '');
+                                        if ((_d = (_c = value.delta) === null || _c === void 0 ? void 0 : _c.images) === null || _d === void 0 ? void 0 : _d.length) {
+                                            msg.result.images = ((_e = msg.result.images) !== null && _e !== void 0 ? _e : []).concat(value.delta.images);
+                                        }
+                                        if (value.delta.object) {
+                                            (_f = (_g = msg.result).objects) !== null && _f !== void 0 ? _f : (_g.objects = []);
+                                            msg.result.objects.push({ taskId: value.taskId, data: value.delta.object });
+                                        }
+                                    });
+                                });
+                            }
+                        }
+                        if ((value === null || value === void 0 ? void 0 : value.type) === 'ERROR') {
+                            set((state) => {
+                                var _a;
+                                const msg = (_a = state.messages) === null || _a === void 0 ? void 0 : _a.findLast((i) => i.taskId === message.taskId);
+                                if (msg)
+                                    msg.error = value.error;
+                                else
+                                    throw new Error(value.error.message);
+                            });
+                        }
+                    }
+                }
+                catch (e_1_1) { e_1 = { error: e_1_1 }; }
+                finally {
+                    try {
+                        if (!_h && !_e && (_f = stream_1.return)) yield _f.call(stream_1);
+                    }
+                    finally { if (e_1) throw e_1.error; }
+                }
+            }
+            catch (error) {
+                set((state) => {
+                    state.error = error;
+                });
+            }
+            finally {
+                set((state) => {
+                    var _a;
+                    state.running = false;
+                    if (message) {
+                        const msg = (_a = state.messages) === null || _a === void 0 ? void 0 : _a.findLast((i) => i.taskId === message.taskId);
+                        if (msg)
+                            msg.loading = false;
+                    }
+                });
+            }
+        }),
+    }))));
+    return STATES[aid];
+};
+exports.createSessionState = createSessionState;

package/lib/cjs/builtin/async/ai-runtime/components/runtime/utils/map-right.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function mapRight(array, fn) {
+    const result = new Array(array.length);
+    for (let i = array.length - 1; i >= 0; i--) {
+        result.push(fn(array[i], i, array));
+    }
+    return result;
+}
+exports.default = mapRight;