@blocklet/pages-kit 0.2.317 → 0.2.319

package/lib/esm/builtin/async/ai-runtime/runtime-components/V0/components/Loading.js

@@ -0,0 +1,144 @@
+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;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import Spinner from '@arcblock/ux/lib/Spinner';
+import { Box, Skeleton } from '@mui/material';
+export default function Loading(props) {
+    const { sx } = props, restProps = __rest(props, ["sx"]);
+    return (_jsx(Box, Object.assign({ sx: Object.assign({ flex: 1, display: 'flex', justifyContent: 'center', alignItems: 'center', position: 'fixed', top: 0, left: 0, width: '100vw', height: '100vh', backgroundColor: 'rgba(255, 255, 255, 0.8)' }, sx) }, restProps, { children: _jsx(Spinner, {}) })));
+}
+export function AIRunningLoading(props) {
+    const { sx } = props, restProps = __rest(props, ["sx"]);
+    const animationTimeList = [
+        {
+            time: 2,
+            width: 60,
+            height: 60,
+            extraProps: {
+                variant: 'circular',
+                sx: {
+                    backgroundColor: 'grey.200',
+                },
+            },
+        },
+        {
+            time: 3,
+            width: 100,
+            height: 20,
+            extraProps: {
+                sx: {
+                    backgroundColor: 'grey.100',
+                },
+            },
+        },
+        {
+            time: 2,
+            width: 250,
+            height: 10,
+            extraProps: {
+                sx: {
+                    backgroundColor: 'grey.200',
+                },
+            },
+        },
+        {
+            time: 4,
+            width: 150,
+            height: 10,
+            extraProps: {
+                sx: {
+                    backgroundColor: 'grey.200',
+                },
+            },
+        },
+        {
+            time: 8,
+            width: '100%',
+            height: '100%',
+            Component: Box,
+            extraProps: {
+                children: [
+                    _jsx(Skeleton, { variant: "rectangular", sx: {
+                            width: 60,
+                            height: 50,
+                            borderRadius: 1,
+                            backgroundColor: 'grey.200',
+                        } }),
+                    _jsx(Skeleton, { variant: "rectangular", sx: {
+                            width: 120,
+                            height: 50,
+                            borderRadius: 1,
+                            backgroundColor: 'grey.200',
+                        } }),
+                    _jsx(Skeleton, { variant: "rectangular", sx: {
+                            width: 180,
+                            height: 50,
+                            borderRadius: 1,
+                            backgroundColor: 'grey.200',
+                        } }),
+                ],
+                sx: {
+                    p: 2,
+                    display: 'flex',
+                    gap: 1.5,
+                    justifyContent: 'space-between',
+                },
+            },
+        },
+        {
+            time: 60,
+            width: 500,
+            height: 150,
+            extraProps: {
+                sx: {
+                    backgroundColor: 'grey.200',
+                },
+            },
+        },
+    ];
+    return (_jsx(Box, Object.assign({ sx: Object.assign({ flex: 1, display: 'inline-flex', justifyContent: 'center', alignItems: 'center', backgroundColor: 'white', flexDirection: 'column', gap: 1.5, '@keyframes loading': {
+                '0%': {
+                    transform: 'translateY(-8px) scaleX(1.3)',
+                    opacity: 0,
+                    height: '100%',
+                },
+                '50%': {
+                    transform: 'translateY(0px)',
+                    opacity: 0.5,
+                    zoom: 1,
+                    height: '100%',
+                },
+                '100%': {
+                    transform: 'translateY(4px)',
+                    opacity: 1,
+                    zoom: 1,
+                    height: '100%',
+                },
+            } }, sx) }, restProps, { children: animationTimeList.map((item, index) => {
+            // 计算 index 之前的累计时间之和，作为动画延迟时间
+            const delay = animationTimeList.slice(0, index).reduce((prev, current) => prev + current.time, 0);
+            const { time, width, height, Component = Skeleton } = item, _a = item.extraProps, _b = _a === void 0 ? {} : _a, { sx } = _b, restSkeletonProps = __rest(_b, ["sx"]);
+            const isLast = index === animationTimeList.length - 1;
+            return (_jsx(Box, { sx: {
+                    animation: `loading ${time}s 1 ${delay}s forwards`,
+                    borderRadius: 1,
+                    overflow: 'hidden',
+                    opacity: 0,
+                    transition: 'all 0.3s',
+                }, children: _jsx(Component
+                // @ts-ignore
+                , Object.assign({ 
+                    // @ts-ignore
+                    variant: "rectangular", sx: Object.assign({ width,
+                        height, animationIterationCount: isLast ? 'infinite' : 1, animationFillMode: isLast ? 'forwards' : 'none' }, sx) }, restSkeletonProps)) }, index));
+        }) })));
+}

package/lib/esm/builtin/async/ai-runtime/runtime-components/V0/components/PropertiesSetting.js

@@ -0,0 +1,75 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Alert, Box, Stack, Switch, TextField, Typography } from '@mui/material';
+import { forwardRef, useEffect, useImperativeHandle, useRef } from 'react';
+import { useLocaleContext } from '../../../../../locale';
+import ConfirmDialog from './ConfirmDialog';
+const FieldComponentMap = {
+    number: {
+        Filed: TextField,
+        extraProps: {
+            type: 'number',
+        },
+    },
+    boolean: {
+        Filed: Switch,
+    },
+    json: {
+        Filed: TextField,
+        extraProps: {
+            multiline: true,
+            minRows: 3,
+            maxRows: 5,
+        },
+    },
+    url: {
+        Filed: TextField,
+    },
+    string: {
+        Filed: TextField,
+    },
+};
+const PropertiesSetting = forwardRef((props, ref) => {
+    const { t, locale } = useLocaleContext();
+    const ConfirmDialogRef = useRef();
+    const valuesRef = useRef({});
+    const openParamsRef = useRef({});
+    const open = (params) => {
+        var _a;
+        if (!(ConfirmDialogRef === null || ConfirmDialogRef === void 0 ? void 0 : ConfirmDialogRef.current))
+            return;
+        openParamsRef.current = params;
+        ConfirmDialogRef.current.open({
+            title: t('v0.propertiesSetting'),
+            children: (_jsxs(Box, { children: [_jsx(Alert, { severity: "info", sx: { mb: 2 }, children: t('v0.propertiesSettingTip') }), _jsx(Stack, { spacing: 2, children: (_a = params === null || params === void 0 ? void 0 : params.schema) === null || _a === void 0 ? void 0 : _a.map((item) => {
+                            var _a, _b;
+                            const { id, key, type, locales } = item;
+                            const { Filed, extraProps } = (FieldComponentMap[type] || FieldComponentMap.string);
+                            const currentLocale = (locales === null || locales === void 0 ? void 0 : locales[locale]) || (locales === null || locales === void 0 ? void 0 : locales.en);
+                            return (_jsxs(Box, { children: [_jsx(Typography, { variant: "subtitle2", sx: {
+                                            mb: 0.5,
+                                        }, children: currentLocale === null || currentLocale === void 0 ? void 0 : currentLocale.name }), _jsx(Filed, Object.assign({ fullWidth: true, variant: "outlined", defaultValue: ((_b = (_a = openParamsRef === null || openParamsRef === void 0 ? void 0 : openParamsRef.current) === null || _a === void 0 ? void 0 : _a.defaultValues) === null || _b === void 0 ? void 0 : _b[key]) || (currentLocale === null || currentLocale === void 0 ? void 0 : currentLocale.defaultValue), size: "small", onChange: (e) => {
+                                            // update value
+                                            valuesRef.current = Object.assign(Object.assign({}, valuesRef.current), { [key]: e.target.value });
+                                        } }, extraProps))] }, id));
+                        }) })] })),
+            onConfirm: () => {
+                var _a;
+                (_a = params === null || params === void 0 ? void 0 : params.onSubmit) === null || _a === void 0 ? void 0 : _a.call(params, getValues());
+            },
+            onCancel: () => { },
+        });
+    };
+    const getValues = () => {
+        var _a;
+        return Object.assign(Object.assign({}, (_a = openParamsRef === null || openParamsRef === void 0 ? void 0 : openParamsRef.current) === null || _a === void 0 ? void 0 : _a.defaultValues), valuesRef.current);
+    };
+    useImperativeHandle(ref, () => ({
+        open,
+        getValues,
+    }));
+    useEffect(() => {
+        valuesRef.current = {};
+    }, [locale]);
+    return _jsx(ConfirmDialog, Object.assign({ ref: ConfirmDialogRef }, props));
+});
+export default PropertiesSetting;

package/lib/esm/builtin/async/ai-runtime/runtime-components/V0/components/UserQuestion.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import ClickToCopy from '@arcblock/ux/lib/ClickToCopy';
+import { Box, Typography } from '@mui/material';
+import { Avatar } from '../../../../../arcblock/ux';
+import { useLocaleContext } from '../../../../../locale';
+import { useSessionContext } from '../../../../../session';
+import { getLineClamp } from '../utils';
+export default function UserQuestion({ question }) {
+    var _a;
+    const { session: authSession } = useSessionContext();
+    const { user } = authSession;
+    const { locale } = useLocaleContext();
+    return (_jsxs(Box, { sx: {
+            display: 'flex',
+            alignItems: 'center',
+            gap: 1,
+        }, children: [((_a = authSession === null || authSession === void 0 ? void 0 : authSession.user) === null || _a === void 0 ? void 0 : _a.did) && (_jsx(Box, { sx: {
+                    width: 30,
+                    height: 30,
+                }, children: _jsx(Avatar, { size: 30, did: user === null || user === void 0 ? void 0 : user.did, variant: "circle", shape: "circle", src: user === null || user === void 0 ? void 0 : user.avatar }) })), _jsx(Box, { sx: {
+                    padding: '6px 8px',
+                    borderRadius: 1,
+                    //   borderTopLeftRadius: 0,
+                    backgroundColor: 'grey.200',
+                }, children: _jsx(ClickToCopy, { locale: locale, unstyled: true, children: _jsx(Typography, { sx: Object.assign({ fontWeight: 500, fontSize: 13, maxWidth: 300, color: 'textColor' }, getLineClamp(1)), children: question }) }) })] }));
+}

package/lib/esm/builtin/async/ai-runtime/runtime-components/V0/contexts/V0Runtime.js

@@ -0,0 +1,49 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext, useMemo, useState } from 'react';
+const context = createContext(undefined);
+let cancelAutoScrollTimer;
+export function V0RuntimeProvider({ children }) {
+    const [currentMessageTaskId, setCurrentMessageTaskId] = useState();
+    const [propertiesValueMap, setPropertiesValueMap] = useState({});
+    const state = useMemo(() => ({
+        setCurrentMessageTaskId: (taskId) => {
+            setCurrentMessageTaskId(taskId);
+            // auto scroll to the task
+            if (taskId) {
+                const scrollIntoView = () => {
+                    const el = document.getElementById(taskId);
+                    if (el) {
+                        el.scrollIntoView({ behavior: 'smooth' });
+                        // is first time to scroll
+                        if (!currentMessageTaskId) {
+                            const observer = new MutationObserver(() => {
+                                if (cancelAutoScrollTimer)
+                                    clearTimeout(cancelAutoScrollTimer);
+                                el === null || el === void 0 ? void 0 : el.scrollIntoView({ behavior: 'smooth' });
+                                cancelAutoScrollTimer = setTimeout(() => {
+                                    observer.disconnect();
+                                    cancelAutoScrollTimer = null;
+                                }, 1000);
+                            });
+                            observer.observe(el.parentElement, { attributes: true, childList: true, subtree: true });
+                        }
+                    }
+                };
+                setTimeout(scrollIntoView, 300);
+            }
+        },
+        currentMessageTaskId,
+        propertiesValueMap,
+        setPropertiesValueMap: (valueMap) => {
+            setPropertiesValueMap(Object.assign(Object.assign({}, propertiesValueMap), valueMap));
+        },
+    }), [setCurrentMessageTaskId, currentMessageTaskId, propertiesValueMap, setPropertiesValueMap]);
+    return _jsx(context.Provider, { value: state, children: children });
+}
+export function useV0RuntimeContext() {
+    const current = useContext(context);
+    if (!current) {
+        throw new Error('No such message state. You should use `V0RuntimeProvider` within the `CurrentMessageProvider`');
+    }
+    return current;
+}

package/lib/esm/builtin/async/ai-runtime/runtime-components/V0/utils.js

@@ -0,0 +1,9 @@
+export const getLineClamp = (count) => {
+    return {
+        display: '-webkit-box',
+        WebkitLineClamp: count,
+        WebkitBoxOrient: 'vertical',
+        overflow: 'hidden',
+        textOverflow: 'ellipsis',
+    };
+};

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

@@ -46,7 +46,14 @@ export const createSessionState = ({ aid }) => {
                 state.currentSessionId = undefined;
             });
         },
-        load: () => __awaiter(void 0, void 0, void 0, function* () {
+        reload: () => __awaiter(void 0, void 0, void 0, function* () {
+            const { load, reset } = get();
+            reset();
+            yield load({
+                autoSetCurrentSessionId: false,
+            });
+        }),
+        load: (...args_1) => __awaiter(void 0, [...args_1], void 0, function* ({ autoSetCurrentSessionId = true } = {}) {
             const { loading, loaded } = get();
             if (!loading && !loaded) {
                 set((state) => {
@@ -57,8 +64,10 @@ export const createSessionState = ({ aid }) => {
                     set((state) => {
                         var _a;
                         state.sessions = sessions;
-                        state.currentSessionId = (_a = sessions[0]) === null || _a === void 0 ? void 0 : _a.id;
                         state.sessionMap = Object.fromEntries(sessions.map((i) => [i.id, { session: i }]));
+                        if (autoSetCurrentSessionId) {
+                            state.currentSessionId = (_a = sessions[0]) === null || _a === void 0 ? void 0 : _a.id;
+                        }
                     });
                 }
                 catch (error) {
@@ -128,8 +137,8 @@ export const createSessionState = ({ aid }) => {
                 state.currentSessionId = sessionId;
             });
         },
-        createSession: () => __awaiter(void 0, void 0, void 0, function* () {
-            const { created, sessions } = yield createSession({ aid });
+        createSession: (...args_2) => __awaiter(void 0, [...args_2], void 0, function* ({ name } = {}) {
+            const { created, sessions } = yield createSession({ aid, name });
             set((state) => {
                 state.sessions = sessions;
                 state.currentSessionId = created.id;
@@ -143,19 +152,22 @@ export const createSessionState = ({ aid }) => {
             });
             return created;
         }),
-        deleteSession: (...args_1) => __awaiter(void 0, [...args_1], void 0, function* (args = {}) {
+        deleteSession: (...args_3) => __awaiter(void 0, [...args_3], void 0, function* (args = {}) {
+            var _a;
             const sessionId = args.sessionId || get().currentSessionId;
+            const autoSetCurrentSessionId = (_a = args.autoSetCurrentSessionId) !== null && _a !== void 0 ? _a : true;
             if (!sessionId)
                 return;
             const { sessions } = yield deleteSession({ sessionId });
             set((state) => {
                 var _a;
                 state.sessions = sessions;
-                if (!sessions.some((i) => i.id === state.currentSessionId))
-                    state.currentSessionId = (_a = sessions[0]) === null || _a === void 0 ? void 0 : _a.id;
+                if (!sessions.some((i) => i.id === state.currentSessionId)) {
+                    state.currentSessionId = autoSetCurrentSessionId ? (_a = sessions[0]) === null || _a === void 0 ? void 0 : _a.id : undefined;
+                }
             });
         }),
-        clearSession: (...args_2) => __awaiter(void 0, [...args_2], void 0, function* (args = {}) {
+        clearSession: (...args_4) => __awaiter(void 0, [...args_4], void 0, function* (args = {}) {
             const sessionId = args.sessionId || get().currentSessionId;
             if (!sessionId)
                 return;
@@ -170,9 +182,10 @@ export const createSessionState = ({ aid }) => {
                 s.messageLoading = undefined;
             });
         }),
-        loadMoreMessages: (...args_3) => __awaiter(void 0, [...args_3], void 0, function* (args = {}) {
-            var _a, _b;
+        loadMoreMessages: (...args_5) => __awaiter(void 0, [...args_5], void 0, function* (args = {}) {
+            var _b, _c;
             const sessionId = args.sessionId || get().currentSessionId;
+            const limit = args.limit || GET_MESSAGES_LIMIT;
             if (!sessionId)
                 return;
             set((state) => {
@@ -189,9 +202,9 @@ export const createSessionState = ({ aid }) => {
             try {
                 const result = yield getMessages({
                     sessionId: s.session.id,
-                    before: (_b = (_a = s.messages) === null || _a === void 0 ? void 0 : _a.slice(-1)[0]) === null || _b === void 0 ? void 0 : _b.id,
+                    before: (_c = (_b = s.messages) === null || _b === void 0 ? void 0 : _b.slice(-1)[0]) === null || _c === void 0 ? void 0 : _c.id,
                     orderDirection: GET_MESSAGES_ORDER_DIRECTION,
-                    limit: GET_MESSAGES_LIMIT,
+                    limit,
                 });
                 set((state) => {
                     var _a, _b;
@@ -199,7 +212,7 @@ export const createSessionState = ({ aid }) => {
                     if (!s)
                         return;
                     s.messages = ((_b = s.messages) !== null && _b !== void 0 ? _b : []).concat(result.messages.toReversed());
-                    s.noMoreMessage = result.messages.length < GET_MESSAGES_LIMIT;
+                    s.noMoreMessage = result.messages.length < limit;
                 });
             }
             finally {
@@ -212,9 +225,25 @@ export const createSessionState = ({ aid }) => {
                 });
             }
         }),
-        execute: (_c) => __awaiter(void 0, void 0, void 0, function* () {
-            var _d, e_1, _e, _f;
-            var { aid, working, parameters, onResponseStart } = _c, args = __rest(_c, ["aid", "working", "parameters", "onResponseStart"]);
+        loadLatestMessagesForAllSessions: () => __awaiter(void 0, void 0, void 0, function* () {
+            const { sessions, sessionMap } = get();
+            // sessions 按顺序分为每 n 个为一组，每次请求一组请求
+            const groupSize = 12;
+            for (let i = 0; i < sessions.length; i += groupSize) {
+                const group = sessions.slice(i, i + groupSize);
+                // eslint-disable-next-line no-await-in-loop
+                yield Promise.all(group.map((_d) => __awaiter(void 0, [_d], void 0, function* ({ id: sessionId }) {
+                    var _e, _f;
+                    // if messages is empty, load latest message
+                    if (!((_f = (_e = sessionMap === null || sessionMap === void 0 ? void 0 : sessionMap[sessionId]) === null || _e === void 0 ? void 0 : _e.messages) === null || _f === void 0 ? void 0 : _f.length)) {
+                        yield get().loadMoreMessages({ sessionId, limit: 1 });
+                    }
+                })));
+            }
+        }),
+        execute: (_g) => __awaiter(void 0, void 0, void 0, function* () {
+            var _h, e_1, _j, _k;
+            var { aid, working, parameters, onResponseStart } = _g, args = __rest(_g, ["aid", "working", "parameters", "onResponseStart"]);
             const sessionId = args.sessionId || get().currentSessionId || (yield get().createSession()).id;
             const identity = parseIdentity(aid, { rejectWhenError: true });
             let message;
@@ -235,10 +264,10 @@ export const createSessionState = ({ aid }) => {
                 });
                 let responseStarted = false;
                 try {
-                    for (var _g = true, stream_1 = __asyncValues(stream), stream_1_1; stream_1_1 = yield stream_1.next(), _d = stream_1_1.done, !_d; _g = true) {
-                        _f = stream_1_1.value;
-                        _g = false;
-                        const value = _f;
+                    for (var _l = true, stream_1 = __asyncValues(stream), stream_1_1; stream_1_1 = yield stream_1.next(), _h = stream_1_1.done, !_h; _l = true) {
+                        _k = stream_1_1.value;
+                        _l = false;
+                        const value = _k;
                         if (!responseStarted) {
                             responseStarted = true;
                             onResponseStart === null || onResponseStart === void 0 ? void 0 : onResponseStart();
@@ -305,7 +334,7 @@ export const createSessionState = ({ aid }) => {
                 catch (e_1_1) { e_1 = { error: e_1_1 }; }
                 finally {
                     try {
-                        if (!_g && !_d && (_e = stream_1.return)) yield _e.call(stream_1);
+                        if (!_l && !_h && (_j = stream_1.return)) yield _j.call(stream_1);
                     }
                     finally { if (e_1) throw e_1.error; }
                 }
@@ -336,12 +365,12 @@ export const createSessionState = ({ aid }) => {
         }),
     }))));
 };
-export function useAutoLoadSessionState() {
+export function useAutoLoadSessionState(...args) {
     const { aid } = useRuntimeContext();
     const state = useMemo(() => createSessionState({ aid }), [aid]);
     const currentSessionId = state((s) => s.currentSessionId);
     useEffect(() => {
-        state.getState().load();
+        state.getState().load(...args);
     }, [state, currentSessionId]);
 }
 export function useSessionState(selector) {

package/lib/esm/components/CustomComponentRenderer/state.js

@@ -150,10 +150,17 @@ function usePreloadComponent({ instanceId, componentId, properties, locale, dev
     return null;
 }
 function useTranspileComponent({ componentId, locale, properties, dev: { defaultLocale, components } = {}, }) {
-    const [{ error, Component }, setComponent] = useState({});
+    const [{ error, Component, propertiesFromCode }, setComponent] = useState({});
     const component = mergeComponent({
         componentId,
-        getComponent: (componentId) => { var _a; return (_a = components === null || components === void 0 ? void 0 : components[componentId]) === null || _a === void 0 ? void 0 : _a.data; },
+        getComponent: (componentId) => {
+            var _a, _b, _c, _d;
+            // setting properties from code if it's not set from components props
+            if (propertiesFromCode && !((_b = (_a = components === null || components === void 0 ? void 0 : components[componentId]) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.properties)) {
+                return Object.assign(Object.assign({}, (_c = components === null || components === void 0 ? void 0 : components[componentId]) === null || _c === void 0 ? void 0 : _c.data), { properties: propertiesFromCode });
+            }
+            return (_d = components === null || components === void 0 ? void 0 : components[componentId]) === null || _d === void 0 ? void 0 : _d.data;
+        },
         locale,
         defaultLocale,
         properties,
@@ -163,7 +170,18 @@ function useTranspileComponent({ componentId, locale, properties, dev: { default
         if (script) {
             transpileAndLoadScript(script)
                 .then((m) => {
-                setComponent({ Component: m.default });
+                let propertiesFromCode;
+                // get properties from code
+                if (typeof (m === null || m === void 0 ? void 0 : m.PROPERTIES_SCHEMA) === 'object' && (m === null || m === void 0 ? void 0 : m.PROPERTIES_SCHEMA.length)) {
+                    propertiesFromCode = {};
+                    m.PROPERTIES_SCHEMA.forEach((data, index) => {
+                        propertiesFromCode[data.id] = {
+                            index,
+                            data,
+                        };
+                    });
+                }
+                setComponent({ Component: m.default, propertiesFromCode });
             })
                 .catch((error) => {
                 setComponent({ error });
@@ -176,7 +194,7 @@ function useTranspileComponent({ componentId, locale, properties, dev: { default
         props: component === null || component === void 0 ? void 0 : component.properties,
     };
 }
-function transpileAndLoadScript(script) {
+export function transpileAndLoadScript(script) {
     return __awaiter(this, void 0, void 0, function* () {
         const [ts, { createBuiltinModuleTransformer }] = yield Promise.all([
             import('typescript'),