@blocklet/pages-kit 0.2.319 → 0.2.321

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

@@ -14,13 +14,13 @@ export default function UserQuestion({ question }) {
             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: {
+        }, children: [((_a = authSession === null || authSession === void 0 ? void 0 : authSession.user) === null || _a === void 0 ? void 0 : _a.did) && (_jsx(Box, { className: "user", 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',
+                }, 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, { className: "question", sx: {
+                    padding: '6px 12px',
                     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 }) }) })] }));
+                }, children: _jsx(ClickToCopy, { locale: locale, unstyled: true, children: _jsx(Typography, { sx: Object.assign({ fontWeight: 500, fontSize: 13, maxWidth: 300, color: 'textColor', textAlign: 'left' }, getLineClamp(1)), children: question }) }) })] }));
 }

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

@@ -1,10 +1,12 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+import { useMediaQuery } from '@mui/material';
 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 isMobile = useMediaQuery((theme) => theme.breakpoints.down('sm'));
     const state = useMemo(() => ({
         setCurrentMessageTaskId: (taskId) => {
             setCurrentMessageTaskId(taskId);
@@ -37,7 +39,8 @@ export function V0RuntimeProvider({ children }) {
         setPropertiesValueMap: (valueMap) => {
             setPropertiesValueMap(Object.assign(Object.assign({}, propertiesValueMap), valueMap));
         },
-    }), [setCurrentMessageTaskId, currentMessageTaskId, propertiesValueMap, setPropertiesValueMap]);
+        isMobile,
+    }), [setCurrentMessageTaskId, currentMessageTaskId, propertiesValueMap, setPropertiesValueMap, isMobile]);
     return _jsx(context.Provider, { value: state, children: children });
 }
 export function useV0RuntimeContext() {

package/lib/esm/builtin/iconify/react.js

@@ -1 +1,7 @@
-export { Icon } from '@iconify/react';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Icon as IconifyIcon } from '@iconify/react';
+import { Box } from '@mui/material';
+export function Icon(props) {
+    return _jsx(Box, Object.assign({ component: IconifyIcon }, props));
+}
+export default Icon;

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

@@ -0,0 +1,36 @@
+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 React, { useMemo } from 'react';
+import { getComponentMountPoint, joinURL } from '../../builtin/utils';
+export default function BlockletReactComponentRenderer(_a) {
+    var props = __rest(_a, []);
+    const url = useMemo(() => {
+        var _a, _b, _c, _d;
+        const did = (_b = (_a = props.properties) === null || _a === void 0 ? void 0 : _a.blockletDid) === null || _b === void 0 ? void 0 : _b.value;
+        const path = (_d = (_c = props.properties) === null || _c === void 0 ? void 0 : _c.componentPath) === null || _d === void 0 ? void 0 : _d.value;
+        if (!did || !path)
+            return null;
+        return joinURL(window.location.origin, getComponentMountPoint(did), path);
+    }, [props.properties]);
+    if (!url) {
+        throw new Error('Missing required properties `blockletDid` or `componentPath`');
+    }
+    const C = loadComponent(url);
+    return _jsx(C, Object.assign({}, props.props));
+}
+const COMPONENTS_CACHE = {};
+function loadComponent(url) {
+    var _a;
+    (_a = COMPONENTS_CACHE[url]) !== null && _a !== void 0 ? _a : (COMPONENTS_CACHE[url] = React.lazy(() => import(url)));
+    return COMPONENTS_CACHE[url];
+}

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

@@ -13,6 +13,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Alert, Box } from '@mui/material';
 import { ErrorBoundary } from 'react-error-boundary';
 import { RenderNestedComponent } from '../../utils/property';
+import BlockletReactComponentRenderer from './BlockletReactComponentRenderer';
 import { DevProvider, useDev } from './DevProvider';
 import { useComponent } from './state';
 export * from './state';
@@ -21,8 +22,12 @@ export default function CustomComponentRenderer(_a) {
     var _b;
     var { dev } = _a, props = __rest(_a, ["dev"]);
     const inheritedDev = useDev();
-    return (_jsx(ErrorBoundary, { fallbackRender: ErrorView, resetKeys: [Date.now()], children: _jsx(DevProvider, { dev: dev !== null && dev !== void 0 ? dev : inheritedDev, children: _jsx(ComponentRenderer, Object.assign({}, props, { instanceId: (_b = props.instanceId) !== null && _b !== void 0 ? _b : props.componentId })) }) }));
+    const BuiltinComponent = BuiltinComponents[props.componentId];
+    return (_jsx(ErrorBoundary, { fallbackRender: ErrorView, resetKeys: [Date.now()], children: _jsx(DevProvider, { dev: dev !== null && dev !== void 0 ? dev : inheritedDev, children: BuiltinComponent ? (_jsx(BuiltinComponent, Object.assign({}, props))) : (_jsx(ComponentRenderer, Object.assign({}, props, { instanceId: (_b = props.instanceId) !== null && _b !== void 0 ? _b : props.componentId }))) }) }));
 }
+const BuiltinComponents = {
+    'blocklet-react-component': BlockletReactComponentRenderer,
+};
 function ErrorView({ error }) {
     return (_jsx(Box, { children: _jsx(Alert, { severity: "error", children: error.message }) }));
 }

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

@@ -18,6 +18,7 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
+import set from 'lodash/set';
 import { useDeferredValue, useEffect, useRef, useState } from 'react';
 import { create } from 'zustand';
 import { immer } from 'zustand/middleware/immer';
@@ -175,6 +176,16 @@ function useTranspileComponent({ componentId, locale, properties, dev: { default
                 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) => {
+                        var _a, _b, _c;
+                        // @ts-ignore
+                        (_c = (_b = (_a = window === null || window === void 0 ? void 0 : window.blocklet) === null || _a === void 0 ? void 0 : _a.languages) === null || _b === void 0 ? void 0 : _b.forEach) === null || _c === void 0 ? void 0 : _c.call(_b, (item) => {
+                            var _a, _b;
+                            const { code: localKey } = item;
+                            if (!((_a = data === null || data === void 0 ? void 0 : data.locales) === null || _a === void 0 ? void 0 : _a[localKey])) {
+                                // fallback to en
+                                set(data, `locales.${localKey}`, (_b = data.locales) === null || _b === void 0 ? void 0 : _b.en);
+                            }
+                        });
                         propertiesFromCode[data.id] = {
                             index,
                             data,