@blocklet/pages-kit 0.2.363 → 0.2.365

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

@@ -11,8 +11,8 @@ const locale_1 = require("../../../locale");
 const use_agent_admin_1 = require("../hooks/use-agent-admin");
 const runtime_1 = require("../state/runtime");
 const AgentSettingsDialog_1 = require("./AgentSettings/AgentSettingsDialog");
-function AgentErrorBoundary() {
-    return (0, jsx_runtime_1.jsx)(react_error_boundary_1.ErrorBoundary, { FallbackComponent: AgentErrorView });
+function AgentErrorBoundary({ children }) {
+    return (0, jsx_runtime_1.jsx)(react_error_boundary_1.ErrorBoundary, { FallbackComponent: AgentErrorView, children: children });
 }
 function AgentErrorView({ error }) {
     if (error.type === 'MissingSecretError') {

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

@@ -10,15 +10,20 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ComponentPreferencesProvider = ComponentPreferencesProvider;
+exports.default = ComponentPreferencesProvider;
 exports.useComponentPreferences = useComponentPreferences;
 const jsx_runtime_1 = require("react/jsx-runtime");
+const omitBy_1 = __importDefault(require("lodash/omitBy"));
 const react_1 = require("react");
 const componentPreferencesContext = (0, react_1.createContext)(undefined);
 function ComponentPreferencesProvider(_a) {
     var { children } = _a, preferences = __rest(_a, ["children"]);
-    const value = (0, react_1.useMemo)(() => (Object.assign({}, preferences)), Object.values(preferences));
+    const inherited = useComponentPreferences();
+    const value = (0, react_1.useMemo)(() => (Object.assign(Object.assign({}, inherited), (0, omitBy_1.default)(preferences, (i) => i === undefined || i === null))), [inherited, Object.values(preferences)]);
     return (0, jsx_runtime_1.jsx)(componentPreferencesContext.Provider, { value: value, children: children });
 }
 function useComponentPreferences() {

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

@@ -17,7 +17,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.MarkdownView = exports.GoogleSearchSourcesView = exports.GoogleSearchRelatedQuestionsView = exports.ImagesView = exports.OpeningQuestionsView = exports.ShareView = exports.ReferencedLinksView = exports.SuggestedQuestionsView = exports.PhotoGalleryItem = exports.ChatOutput = exports.SimpleOutput = exports.AutoForm = exports.PhotoGallery = exports.SimpleChat = exports.SimplePage = exports.ChatBotButton = exports.Runtime = exports.CurrentMessageProvider = exports.CurrentAgentProvider = void 0;
+exports.MarkdownView = exports.GoogleSearchSourcesView = exports.GoogleSearchRelatedQuestionsView = exports.ImagesView = exports.OpeningQuestionsView = exports.ShareView = exports.ReferencedLinksView = exports.SuggestedQuestionsView = exports.PhotoGalleryItem = exports.ChatOutput = exports.SimpleOutput = exports.AutoForm = exports.PhotoGallery = exports.SimpleChat = exports.SimplePage = exports.ChatBotButton = exports.Runtime = exports.CurrentMessageProvider = exports.CurrentAgentProvider = exports.ComponentPreferencesProvider = void 0;
+__exportStar(require("./contexts/ComponentPreferences"), exports);
+var ComponentPreferences_1 = require("./contexts/ComponentPreferences");
+Object.defineProperty(exports, "ComponentPreferencesProvider", { enumerable: true, get: function () { return __importDefault(ComponentPreferences_1).default; } });
 __exportStar(require("./contexts/CurrentAgent"), exports);
 var CurrentAgent_1 = require("./contexts/CurrentAgent");
 Object.defineProperty(exports, "CurrentAgentProvider", { enumerable: true, get: function () { return __importDefault(CurrentAgent_1).default; } });

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

@@ -23,11 +23,13 @@ const react_hook_form_1 = require("react-hook-form");
 const locale_1 = require("../../../../locale");
 const AgentInputField_1 = __importDefault(require("../../components/AgentInputField"));
 const LoadingButton_1 = __importDefault(require("../../components/LoadingButton"));
+const ComponentPreferences_1 = require("../../contexts/ComponentPreferences");
 const CurrentAgent_1 = require("../../contexts/CurrentAgent");
 const runtime_1 = require("../../state/runtime");
 const session_1 = require("../../state/session");
 const agent_inputs_1 = require("../../utils/agent-inputs");
 function AutoForm({ submitText, inlineLabel, autoFillLastForm = true, submitInQuestionField, chatMode, }) {
+    const preferences = (0, ComponentPreferences_1.useComponentPreferences)();
     const submitRef = (0, react_1.useRef)(null);
     const { t } = (0, locale_1.useLocaleContext)();
     const { aid, agent } = (0, CurrentAgent_1.useCurrentAgent)();
@@ -35,13 +37,20 @@ function AutoForm({ submitText, inlineLabel, autoFillLastForm = true, submitInQu
     const running = (0, session_1.useCurrentSessionState)((s) => s === null || s === void 0 ? void 0 : s.running);
     const parameters = (0, react_1.useMemo)(() => {
         var _a;
-        return (_a = agent.parameters) === null || _a === void 0 ? void 0 : _a.filter(agent_inputs_1.isValidInput).map((i) => {
+        return (_a = agent.parameters) === null || _a === void 0 ? void 0 : _a.filter((i) => { var _a; return (0, agent_inputs_1.isValidInput)(i) && !((_a = preferences === null || preferences === void 0 ? void 0 : preferences.hideInputFields) === null || _a === void 0 ? void 0 : _a.includes(i.key)); }).map((i) => {
             var _a;
             return (Object.assign(Object.assign({}, i), { label: ((_a = i.label) === null || _a === void 0 ? void 0 : _a.trim()) || undefined }));
         });
     }, [agent.parameters]);
     const defaultForm = useInitialFormValues();
     const form = (0, react_hook_form_1.useForm)({ defaultValues: defaultForm });
+    const submitDisabled = !form.formState.isValid;
+    (0, react_1.useEffect)(() => {
+        var _a, _b;
+        if ((preferences === null || preferences === void 0 ? void 0 : preferences.autoGenerate) && !form.formState.submitCount) {
+            (_b = (_a = submitRef.current) === null || _a === void 0 ? void 0 : _a.form) === null || _b === void 0 ? void 0 : _b.requestSubmit();
+        }
+    }, [defaultForm, preferences === null || preferences === void 0 ? void 0 : preferences.autoGenerate]);
     (0, react_1.useEffect)(() => {
         if (autoFillLastForm && !form.formState.isSubmitted && !form.formState.isSubmitting) {
             form.reset(chatMode ? (0, omit_1.default)(defaultForm, 'question') : defaultForm);
@@ -61,8 +70,10 @@ function AutoForm({ submitText, inlineLabel, autoFillLastForm = true, submitInQu
     });
     return ((0, jsx_runtime_1.jsxs)(Form, { component: "form", className: (0, css_1.cx)('form', `label-position-${inlineLabel ? 'start' : 'top'}`), onSubmit: form.handleSubmit(onSubmit), children: [parameters === null || parameters === void 0 ? void 0 : parameters.map((parameter, index) => {
                 const { key, required } = parameter !== null && parameter !== void 0 ? parameter : {};
+                if (!key)
+                    return null;
                 return ((0, jsx_runtime_1.jsx)(material_1.Box, { children: (0, jsx_runtime_1.jsx)(react_hook_form_1.Controller, { control: form.control, name: key, rules: {
-                            required,
+                            required: required || key === 'question',
                             min: parameter.type === 'number' && typeof parameter.min === 'number'
                                 ? { value: parameter.min, message: '' }
                                 : undefined,
@@ -79,13 +90,14 @@ function AutoForm({ submitText, inlineLabel, autoFillLastForm = true, submitInQu
                             var _a;
                             return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { className: "form-item", children: [parameter.label && (0, jsx_runtime_1.jsx)(material_1.FormLabel, { children: parameter.label }), (0, jsx_runtime_1.jsx)(AgentInputField_1.default, { inputRef: field.ref, autoFocus: index === 0, size: "small", hiddenLabel: true, fullWidth: true, label: undefined, parameter: parameter, maxRows: !(parameter === null || parameter === void 0 ? void 0 : parameter.type) || (parameter === null || parameter === void 0 ? void 0 : parameter.type) === 'string' ? 5 : undefined, value: field.value || '', onChange: (value) => field.onChange({ target: { value } }), error: Boolean(fieldState.error), helperText: ((_a = fieldState.error) === null || _a === void 0 ? void 0 : _a.message) || (parameter === null || parameter === void 0 ? void 0 : parameter.helper), InputProps: parameter.key === 'question' && submitInQuestionField
                                             ? {
-                                                endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, { position: "end", sx: { py: 3, mr: -0.75, alignSelf: 'flex-end' }, children: (0, jsx_runtime_1.jsx)(LoadingButton_1.default, { ref: submitRef, type: "submit", variant: "contained", loading: running, sx: { borderRadius: 1.5 }, children: submitText }) })),
+                                                endAdornment: ((0, jsx_runtime_1.jsx)(material_1.InputAdornment, { position: "end", sx: { py: 3, mr: -0.75, alignSelf: 'flex-end' }, children: (0, jsx_runtime_1.jsx)(LoadingButton_1.default, { ref: submitRef, type: "submit", variant: "contained", loading: running, disabled: submitDisabled, sx: { borderRadius: 1.5 }, children: submitText }) })),
                                             }
                                             : undefined })] }));
                         } }) }, parameter.id));
-            }), !(submitInQuestionField && (parameters === null || parameters === void 0 ? void 0 : parameters.some((i) => i.key === 'question'))) && ((0, jsx_runtime_1.jsx)(LoadingButton_1.default, { ref: submitRef, type: "submit", variant: "contained", loading: running, sx: { height: 40 }, children: submitText || t('generate') }))] }));
+            }), !(submitInQuestionField && (parameters === null || parameters === void 0 ? void 0 : parameters.some((i) => i.key === 'question'))) && ((0, jsx_runtime_1.jsx)(LoadingButton_1.default, { ref: submitRef, type: "submit", variant: "contained", loading: running, disabled: submitDisabled, sx: { height: 40 }, children: submitText || t('generate') }))] }));
 }
 function useInitialFormValues() {
+    const preferences = (0, ComponentPreferences_1.useComponentPreferences)();
     const { agent } = (0, CurrentAgent_1.useCurrentAgent)();
     const lastMessage = (0, session_1.useCurrentSessionState)((s) => { var _a; return (_a = s === null || s === void 0 ? void 0 : s.messages) === null || _a === void 0 ? void 0 : _a.at(-1); });
     const [lastInputs, setLastInputs] = (0, react_1.useState)();
@@ -98,11 +110,13 @@ function useInitialFormValues() {
     }, [lastMessage]);
     return (0, react_1.useMemo)(() => {
         var _a, _b;
+        if (preferences === null || preferences === void 0 ? void 0 : preferences.initialInputValues)
+            return preferences.initialInputValues;
         if (lastInputs) {
             return lastInputs;
         }
         return Object.fromEntries((_b = (_a = agent.parameters) === null || _a === void 0 ? void 0 : _a.map((parameter) => [parameter.key, parameter.defaultValue])) !== null && _b !== void 0 ? _b : []);
-    }, [lastInputs, agent]);
+    }, [lastInputs, agent, preferences === null || preferences === void 0 ? void 0 : preferences.initialInputValues]);
 }
 const Form = (0, material_1.styled)(material_1.Stack)(({ theme }) => theme.unstable_sx({
     gap: 2,

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

@@ -44,7 +44,7 @@ const react_1 = require("react");
 const CustomComponentRenderer_1 = __importDefault(require("../../../../../components/CustomComponentRenderer"));
 const session_1 = require("../../../../session");
 const asset_1 = require("../../api/asset");
-const AgentErrorBoundary_1 = require("../../components/AgentErrorBoundary");
+const AgentErrorBoundary_1 = __importStar(require("../../components/AgentErrorBoundary"));
 const UserInfo_1 = __importDefault(require("../../components/UserInfo"));
 const ComponentPreferences_1 = require("../../contexts/ComponentPreferences");
 const CurrentAgent_1 = __importDefault(require("../../contexts/CurrentAgent"));
@@ -63,8 +63,8 @@ const MessageView = (0, react_1.memo)(({ message }) => {
     const { hideAgentAvatar, hideUserInputs } = (_b = (0, ComponentPreferences_1.useComponentPreferences)()) !== null && _b !== void 0 ? _b : {};
     if (!(appearanceOutput === null || appearanceOutput === void 0 ? void 0 : appearanceOutput.componentId))
         return null;
-    const agentMessage = ((0, jsx_runtime_1.jsx)(MessageBodyContainer, { messageRole: "assistant", children: (0, jsx_runtime_1.jsx)(CustomComponentRenderer_1.default, { componentId: appearanceOutput.componentId, properties: appearanceOutput.componentProperties, fallbackRender: AgentErrorBoundary_1.AgentErrorView }, message.id) }));
-    return ((0, jsx_runtime_1.jsx)(CurrentAgent_1.default, { agentId: message.agentId, children: (0, jsx_runtime_1.jsx)(CurrentMessage_1.default, { message: message, children: (0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: 2, children: [!hideUserInputs && ((0, jsx_runtime_1.jsx)(material_1.Box, { children: (0, jsx_runtime_1.jsx)(UserInfo_1.default, { name: (_c = authSession.user) === null || _c === void 0 ? void 0 : _c.fullName, did: (_d = authSession.user) === null || _d === void 0 ? void 0 : _d.did, avatar: (0, asset_1.getAssetUrl)({ filename: (_e = authSession.user) === null || _e === void 0 ? void 0 : _e.avatar, preset: 'avatar' }), time: message.createdAt, reverse: true, alignItems: "flex-start", UserNameProps: { sx: { color: hasBg ? 'white' : undefined } }, children: (0, jsx_runtime_1.jsx)(material_1.Stack, { sx: { alignItems: 'flex-end' }, children: (0, jsx_runtime_1.jsx)(MessageBodyContainer, { messageRole: "user", children: (0, jsx_runtime_1.jsx)(UserMessageView_1.default, {}) }) }) }) })), (0, jsx_runtime_1.jsx)(material_1.Box, { children: !hideAgentAvatar ? ((0, jsx_runtime_1.jsx)(UserInfo_1.default, { name: profile.name, did: (_f = globalThis.blocklet) === null || _f === void 0 ? void 0 : _f.appId, avatar: (0, asset_1.getAssetUrl)({ blockletDid, aid, filename: profile.avatar, preset: 'avatar' }), time: message.createdAt, alignItems: "flex-start", UserNameProps: { sx: { color: hasBg ? 'white' : undefined } }, children: agentMessage })) : (agentMessage) })] }) }) }));
+    const agentMessage = ((0, jsx_runtime_1.jsx)(MessageBodyContainer, { messageRole: "assistant", children: (0, jsx_runtime_1.jsx)(react_1.Suspense, { children: (0, jsx_runtime_1.jsx)(CustomComponentRenderer_1.default, { componentId: appearanceOutput.componentId, properties: appearanceOutput.componentProperties, fallbackRender: AgentErrorBoundary_1.AgentErrorView }, message.id) }) }));
+    return ((0, jsx_runtime_1.jsx)(CurrentAgent_1.default, { agentId: message.agentId, children: (0, jsx_runtime_1.jsx)(CurrentMessage_1.default, { message: message, children: (0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: 2, children: [!hideUserInputs && ((0, jsx_runtime_1.jsx)(material_1.Box, { children: (0, jsx_runtime_1.jsx)(UserInfo_1.default, { name: (_c = authSession.user) === null || _c === void 0 ? void 0 : _c.fullName, did: (_d = authSession.user) === null || _d === void 0 ? void 0 : _d.did, avatar: (0, asset_1.getAssetUrl)({ filename: (_e = authSession.user) === null || _e === void 0 ? void 0 : _e.avatar, preset: 'avatar' }), time: message.createdAt, reverse: true, alignItems: "flex-start", UserNameProps: { sx: { color: hasBg ? 'white' : undefined } }, children: (0, jsx_runtime_1.jsx)(material_1.Stack, { sx: { alignItems: 'flex-end' }, children: (0, jsx_runtime_1.jsx)(MessageBodyContainer, { messageRole: "user", children: (0, jsx_runtime_1.jsx)(AgentErrorBoundary_1.default, { children: (0, jsx_runtime_1.jsx)(react_1.Suspense, { children: (0, jsx_runtime_1.jsx)(UserMessageView_1.default, {}) }) }) }) }) }) })), (0, jsx_runtime_1.jsx)(material_1.Box, { children: !hideAgentAvatar ? ((0, jsx_runtime_1.jsx)(UserInfo_1.default, { name: profile.name, did: (_f = globalThis.blocklet) === null || _f === void 0 ? void 0 : _f.appId, avatar: (0, asset_1.getAssetUrl)({ blockletDid, aid, filename: profile.avatar, preset: 'avatar' }), time: message.createdAt, alignItems: "flex-start", UserNameProps: { sx: { color: hasBg ? 'white' : undefined } }, children: agentMessage })) : (agentMessage) })] }) }) }));
 });
 exports.default = MessageView;
 function MessageBodyContainer(_a) {

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

@@ -1,4 +1,27 @@
 "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)
@@ -23,7 +46,7 @@ const SimpleHeader_1 = __importDefault(require("../../components/Header/SimpleHe
 const SimpleLayout_1 = __importDefault(require("../../components/Layout/SimpleLayout"));
 const ScrollView_1 = __importDefault(require("../../components/ScrollView"));
 const ActiveAgent_1 = require("../../contexts/ActiveAgent");
-const ComponentPreferences_1 = require("../../contexts/ComponentPreferences");
+const ComponentPreferences_1 = __importStar(require("../../contexts/ComponentPreferences"));
 const CurrentAgent_1 = __importDefault(require("../../contexts/CurrentAgent"));
 const session_1 = require("../../state/session");
 const BackgroundImage_1 = __importDefault(require("./BackgroundImage"));
@@ -32,7 +55,7 @@ const MessagesView_1 = __importDefault(require("./MessagesView"));
 function SimpleChat(_a) {
     var { scrollViewProps = { scroll: 'window', initialScrollBehavior: 'auto' } } = _a, preferences = __rest(_a, ["scrollViewProps"]);
     (0, session_1.useAutoLoadSessionState)();
-    return ((0, jsx_runtime_1.jsx)(ComponentPreferences_1.ComponentPreferencesProvider, Object.assign({}, preferences, { children: (0, jsx_runtime_1.jsxs)(ScrollView_1.default, Object.assign({}, scrollViewProps, { children: [(0, jsx_runtime_1.jsx)(BackgroundImage_1.default, {}), (0, jsx_runtime_1.jsx)(SimpleChatView, {})] })) })));
+    return ((0, jsx_runtime_1.jsx)(ComponentPreferences_1.default, Object.assign({}, preferences, { children: (0, jsx_runtime_1.jsxs)(ScrollView_1.default, Object.assign({}, scrollViewProps, { children: [(0, jsx_runtime_1.jsx)(BackgroundImage_1.default, {}), (0, jsx_runtime_1.jsx)(SimpleChatView, {})] })) })));
 }
 function SimpleChatView() {
     var _a;

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

@@ -9,7 +9,9 @@ const types_1 = require("@blocklet/ai-runtime/types");
 const material_1 = require("@mui/material");
 const react_1 = require("react");
 const CustomComponentRenderer_1 = __importDefault(require("../../../../../components/CustomComponentRenderer"));
+const AgentErrorBoundary_1 = __importDefault(require("../../components/AgentErrorBoundary"));
 const constants_1 = require("../../constants");
+const ComponentPreferences_1 = require("../../contexts/ComponentPreferences");
 const CurrentAgent_1 = require("../../contexts/CurrentAgent");
 const CurrentMessage_1 = require("../../contexts/CurrentMessage");
 const ignoredOutputs = new Set([
@@ -20,6 +22,8 @@ const ignoredOutputs = new Set([
     types_1.RuntimeOutputVariable.openingMessage,
 ]);
 function SimpleOutput() {
+    const preferences = (0, ComponentPreferences_1.useComponentPreferences)();
+    const CustomComponentActionsComponent = preferences === null || preferences === void 0 ? void 0 : preferences.customOutputActionsComponent;
     const { message } = (0, CurrentMessage_1.useCurrentMessage)();
     if (message.error)
         throw message.error;
@@ -33,12 +37,12 @@ function SimpleOutput() {
     }, [agent.outputVariables]);
     if (!(outputs === null || outputs === void 0 ? void 0 : outputs.length))
         return null;
-    return ((0, jsx_runtime_1.jsx)(material_1.Stack, { gap: 2, children: outputs.map((output) => {
-            var _a, _b, _c, _d, _e, _f, _g, _h;
-            const value = output.name === types_1.RuntimeOutputVariable.text
-                ? ((_a = message.outputs) === null || _a === void 0 ? void 0 : _a.content) ||
-                    ((_d = (_c = (_b = message.outputs) === null || _b === void 0 ? void 0 : _b.objects) === null || _c === void 0 ? void 0 : _c.find((i) => i === null || i === void 0 ? void 0 : i[types_1.RuntimeOutputVariable.text])) === null || _d === void 0 ? void 0 : _d[types_1.RuntimeOutputVariable.text])
-                : (_g = (_f = (_e = message.outputs) === null || _e === void 0 ? void 0 : _e.objects) === null || _f === void 0 ? void 0 : _f[0]) === null || _g === void 0 ? void 0 : _g[output.name];
-            return ((0, jsx_runtime_1.jsx)(CustomComponentRenderer_1.default, { instanceId: output.id, componentId: output.appearance.componentId, properties: output.appearance.componentProperties, props: Object.assign({ output, outputValue: value, writing: output.name === types_1.RuntimeOutputVariable.text && message.loading }, (((_h = output === null || output === void 0 ? void 0 : output.appearance) === null || _h === void 0 ? void 0 : _h.componentProps) || {})) }, output.id));
-        }) }));
+    return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: 2, children: [outputs.map((output) => {
+                var _a, _b, _c, _d, _e, _f, _g, _h;
+                const value = output.name === types_1.RuntimeOutputVariable.text
+                    ? ((_a = message.outputs) === null || _a === void 0 ? void 0 : _a.content) ||
+                        ((_d = (_c = (_b = message.outputs) === null || _b === void 0 ? void 0 : _b.objects) === null || _c === void 0 ? void 0 : _c.find((i) => i === null || i === void 0 ? void 0 : i[types_1.RuntimeOutputVariable.text])) === null || _d === void 0 ? void 0 : _d[types_1.RuntimeOutputVariable.text])
+                    : (_g = (_f = (_e = message.outputs) === null || _e === void 0 ? void 0 : _e.objects) === null || _f === void 0 ? void 0 : _f[0]) === null || _g === void 0 ? void 0 : _g[output.name];
+                return ((0, jsx_runtime_1.jsx)(CustomComponentRenderer_1.default, { instanceId: output.id, componentId: output.appearance.componentId, properties: output.appearance.componentProperties, props: Object.assign({ output, outputValue: value, writing: output.name === types_1.RuntimeOutputVariable.text && message.loading }, (((_h = output === null || output === void 0 ? void 0 : output.appearance) === null || _h === void 0 ? void 0 : _h.componentProps) || {})) }, output.id));
+            }), CustomComponentActionsComponent && ((0, jsx_runtime_1.jsx)(AgentErrorBoundary_1.default, { children: (0, jsx_runtime_1.jsx)(react_1.Suspense, { children: (0, jsx_runtime_1.jsx)(CustomComponentActionsComponent, {}) }) }))] }));
 }

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

@@ -24,14 +24,16 @@ const AgentErrorBoundary_1 = require("../../components/AgentErrorBoundary");
 const SimpleHeader_1 = __importDefault(require("../../components/Header/SimpleHeader"));
 const SimpleLayout_1 = __importDefault(require("../../components/Layout/SimpleLayout"));
 const ActiveAgent_1 = require("../../contexts/ActiveAgent");
+const ComponentPreferences_1 = __importDefault(require("../../contexts/ComponentPreferences"));
 const CurrentAgent_1 = __importDefault(require("../../contexts/CurrentAgent"));
 const CurrentMessage_1 = __importDefault(require("../../contexts/CurrentMessage"));
 const use_appearances_1 = __importDefault(require("../../hooks/use-appearances"));
 const session_1 = require("../../state/session");
-function SimplePage({ resultTitle }) {
+function SimplePage(_a) {
+    var { resultTitle } = _a, preferences = __rest(_a, ["resultTitle"]);
     const { activeAgentId } = (0, ActiveAgent_1.useActiveAgent)();
     (0, session_1.useAutoLoadSessionState)();
-    return ((0, jsx_runtime_1.jsxs)(SimpleLayout_1.default, { pb: 4, children: [(0, jsx_runtime_1.jsx)(SimpleHeader_1.default, {}), (0, jsx_runtime_1.jsx)(CurrentAgent_1.default, { agentId: activeAgentId, children: (0, jsx_runtime_1.jsx)(AgentInputRender, { className: "aigne-inputs aigne-simple-page-inputs" }) }), (0, jsx_runtime_1.jsx)(OutputView, { className: "aigne-outputs aigne-simple-page-outputs", resultTitle: resultTitle })] }));
+    return ((0, jsx_runtime_1.jsx)(ComponentPreferences_1.default, Object.assign({}, preferences, { children: (0, jsx_runtime_1.jsxs)(SimpleLayout_1.default, { pb: 4, children: [(0, jsx_runtime_1.jsx)(SimpleHeader_1.default, {}), (0, jsx_runtime_1.jsx)(CurrentAgent_1.default, { agentId: activeAgentId, children: (0, jsx_runtime_1.jsx)(AgentInputRender, { className: "aigne-inputs aigne-simple-page-inputs" }) }), (0, jsx_runtime_1.jsx)(OutputView, { className: "aigne-outputs aigne-simple-page-outputs", resultTitle: resultTitle })] }) })));
 }
 function AgentInputRender(_a) {
     var props = __rest(_a, []);