@blocklet/pages-kit-inner-components 0.4.125 → 0.4.127

package/lib/es/chunks/state-DNndJ33Y.js

@@ -0,0 +1,456 @@
+import { jsx as L } from "react/jsx-runtime";
+import { Box as z, Alert as K } from "@mui/material";
+import { joinURL as b, withQuery as q } from "ufo";
+import { createAxios as Q } from "@blocklet/js-sdk";
+import X from "lodash/isEmpty";
+import * as Y from "yaml";
+import { useLocaleContext as Z } from "@arcblock/ux/lib/Locale/context";
+import H, { getYjsDoc as ee } from "@syncedstore/core";
+import { useSyncedStore as te } from "@syncedstore/react";
+import { useLocalStorageState as ne } from "ahooks";
+import { produce as C } from "immer";
+import oe from "js-cookie";
+import N from "lodash/debounce";
+import { customAlphabet as re } from "nanoid";
+import { createContext as se, useState as E, useRef as ie, useMemo as v, useCallback as k, useEffect as O, useContext as ce } from "react";
+import { useParams as ae, useNavigate as de } from "react-router-dom";
+import { IndexeddbPersistence as le } from "y-indexeddb";
+import { WebsocketProvider as me } from "y-websocket";
+import { UndoManager as fe } from "yjs";
+import "@blocklet/pages-kit/types";
+const Ve = (t) => {
+  const n = blocklet == null ? void 0 : blocklet.componentMountPoints.find((a) => a.name === t);
+  return n ? n.mountPoint : "/";
+};
+function ue() {
+  const { pathname: t } = window.location, n = t.match(/\/admin\/(maker|previewer)\/([^/]+)/), a = n == null ? void 0 : n[2], u = window.__PROJECT_ID__;
+  if (!a && !u)
+    throw new Error("Unable to get projectId from pathname");
+  return a || u;
+}
+function We(t) {
+  return `${t}:pages:version`;
+}
+function ze(t, n) {
+  return n === "yaml" ? X(t) ? "" : Y.stringify(t, { indent: 2 }) : n === "json" ? JSON.parse(JSON.stringify(t || {})) : n === "array" ? JSON.parse(JSON.stringify(t || [])) : t;
+}
+function Ke({ error: t }) {
+  return /* @__PURE__ */ L(z, { children: /* @__PURE__ */ L(K, { severity: "error", children: t.message }) });
+}
+var U;
+const R = ((U = window.blocklet) == null ? void 0 : U.prefix) || "/", J = Q({
+  timeout: 200 * 1e3
+}), pe = window.location.protocol === "https:" ? "wss" : "ws", qe = (t) => b(`${pe}://${window.location.hostname}`, R, `api/${t}/ws/pages`), we = "z8ia1mAXo8ZE7ytGF36L5uBf9kD2kenhqFGp9";
+var F;
+(F = blocklet == null ? void 0 : blocklet.componentMountPoints.find((t) => t.did === we)) != null && F.mountPoint || b(R, "/image-bin");
+function Qe(t) {
+  return t && !/^(https?:\/\/|\/)/.test(t) ? window.location.origin + b(R, "uploads", t) : t;
+}
+const Se = window.innerWidth <= 750;
+function Xe(t, n, a) {
+  if (!t || /\.gif/.test(t)) return t;
+  const u = (Se ? n / 1.5 : n) * (a === "quality" ? 1.5 : 1);
+  return Pe(t, { imageFilter: "resize", w: u, f: "webp" });
+}
+function Pe(t, n) {
+  return !t || !n ? t : q(t, n);
+}
+async function Ie(t) {
+  return J.get(`/api/projects/${t}`).then((n) => n.data);
+}
+async function he(t) {
+  return J.post(`/api/projects/${t.id}/update`, t).then((n) => n.data);
+}
+const ye = 500, A = re("abcdefghijklmnopqrstuvwxyz0123456789", 16), B = se(null);
+function Ye({
+  url: t,
+  name: n,
+  children: a,
+  waitingSynced: u
+}) {
+  const [I, S] = E(!1), { locale: h } = Z(), p = V(), e = `${p}:MakerLocalState`, o = `${p}:${n}`, [r, s] = ne(e, {
+    defaultValue: {},
+    listenStorageChange: !0
+  }), i = ie(r);
+  i.current = r;
+  const c = v(
+    () => H({
+      pages: {},
+      pageIds: [],
+      routes: {},
+      routeIds: [],
+      components: {},
+      supportedLocales: [],
+      config: {},
+      resources: {}
+    }),
+    []
+  ), d = v(() => ee(c), [c]);
+  v(() => new le(o, d), [o, d]);
+  const w = v(
+    () => new me(t, o, d, {
+      params: { token: oe.get("login_token") },
+      resyncInterval: 5 * 60 * 1e3
+    }),
+    [t, o, d]
+  ), g = k(() => {
+    w && (w.disconnect(), w.connect());
+  }, [w]), y = v(
+    () => new fe(
+      [d.getArray("pageIds"), d.getMap("pages"), d.getArray("supportedLocales"), d.getMap("config")],
+      { doc: d }
+    ),
+    [d]
+  ), [j, x] = E(null), [$, T] = E(!1), [_, G] = E(void 0), D = k(async () => {
+    if (p) {
+      T(!0);
+      try {
+        const l = await Ie(p);
+        x(l);
+      } catch (l) {
+        console.error("Failed to fetch project:", l);
+      } finally {
+        T(!1);
+      }
+    }
+  }, [p]), M = k(
+    async (l, m) => {
+      var P;
+      if (G(void 0), !!p) {
+        m != null && m.optimisticUpdate && j && x((f) => ({
+          ...f,
+          ...l
+        }));
+        try {
+          const f = await he({
+            ...l
+          });
+          x(f);
+        } catch (f) {
+          console.error("Failed to update project:", f), m != null && m.optimisticUpdate && x(j), G((P = f == null ? void 0 : f.response) == null ? void 0 : P.data);
+        }
+      }
+    },
+    [p, j]
+  );
+  O(() => {
+    p && D();
+  }, [p, D]);
+  const W = v(
+    () => ({
+      doc: d,
+      state: c,
+      localState: {
+        ...r,
+        // always use the locale from the context
+        currentLocale: h
+      },
+      setLocalState: (l) => s(typeof l == "function" ? (m) => l(m ?? {}) : l),
+      undoManager: y,
+      projectState: {
+        project: j,
+        isLoadingProject: $,
+        error: _
+      },
+      updateProject: M,
+      forceSync: g
+    }),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [
+      d,
+      c,
+      JSON.stringify(r),
+      // resolve the problem of react warning
+      s,
+      y,
+      j,
+      $,
+      M,
+      _,
+      h,
+      g
+    ]
+  );
+  return O(() => {
+    y.on("stack-item-added", ({ stackItem: l }) => {
+      const { currentPageId: m, currentLocale: P, pages: f } = i.current;
+      l.meta.set("localState", { currentPageId: m, currentLocale: P, pages: f });
+    }), y.on("stack-item-popped", ({ stackItem: l }) => {
+      const m = l.meta.get("localState");
+      m && s((P) => ({ ...P, ...m }));
+    });
+  }, [y, s]), O(() => {
+    w.awareness.setLocalState(r);
+  }, [w, r]), O(() => {
+    w.once("synced", () => S(!0));
+    const l = () => {
+      s((f) => ({
+        ...f,
+        networkStatus: void 0
+      }));
+    }, m = () => {
+      s((f) => ({
+        ...f,
+        networkStatus: "offline"
+      }));
+    }, P = N(({ status: f }) => {
+      f === "connected" ? l() : f === "disconnected" && m();
+    }, ye);
+    return w.on("status", P), window.addEventListener("online", l), window.addEventListener("offline", m), () => {
+      w.off("status", P), window.removeEventListener("online", l), window.removeEventListener("offline", m);
+    };
+  }, [w, s]), u && !I ? null : /* @__PURE__ */ L(B.Provider, { value: W, children: a });
+}
+const ve = () => {
+  const t = ce(B);
+  if (!t)
+    throw new Error("Context is null");
+  const n = te(t.state), { setLocalState: a, localState: u } = t, I = de(), S = V(), h = v(
+    () => ({
+      setCurrentSectionId: (e, o) => {
+        var r, s;
+        e === u.currentPageId && o === ((s = (r = u.pages) == null ? void 0 : r[e]) == null ? void 0 : s.currentSectionId) || (I(b("/admin/maker", S ?? "", "pages", e)), a(
+          (i) => C(i, (c) => {
+            var d;
+            c.currentPageId = e, c.currentComponentId = void 0, c.customComponentPreviewerProperties = {}, o !== void 0 && (c.pages ?? (c.pages = {}), (d = c.pages)[e] ?? (d[e] = {}), c.pages[e].currentSectionId = o ?? void 0), o ? window.sessionStorage.setItem("iframe_show_id", `"${o}"`) : window.sessionStorage.removeItem("iframe_show_id");
+          })
+        ));
+      },
+      setCurrentComponentId: (e) => {
+        e !== u.currentComponentId && (I(b("/admin/maker", S ?? "", "components", e)), a(
+          (o) => C(o, (r) => {
+            r.currentComponentId = e, r.customComponentPreviewerProperties = {};
+          })
+        ));
+      },
+      setCurrentRouteId: (e) => {
+        a(
+          (o) => C(o, (r) => {
+            r.currentRouteId = e;
+          })
+        );
+      },
+      setCustomComponentPreviewerProperties: (() => {
+        const e = {}, o = N(() => {
+          a(
+            (r) => C(r, (s) => {
+              s.customComponentPreviewerProperties = {
+                ...s == null ? void 0 : s.customComponentPreviewerProperties,
+                ...e
+              }, Object.keys(e).forEach((i) => delete e[i]);
+            })
+          );
+        }, 5);
+        return (r) => {
+          Object.assign(e, r), o();
+        };
+      })(),
+      setRouteGenerateProcess: (e) => {
+        a(
+          (o) => C(o, (r) => {
+            e ? r.routeGenerateProcess = {
+              ...r.routeGenerateProcess,
+              ...e
+            } : r.routeGenerateProcess = {};
+          })
+        );
+      },
+      resetRouteGenerateProcess: () => {
+        a(
+          (e) => C(e, (o) => {
+            o.routeGenerateProcess = {
+              progress: "complete"
+            };
+          })
+        );
+      }
+    }),
+    [a, I, S]
+  ), p = v(
+    () => ({
+      addPage: (e, o) => {
+        var i, c, d, w, g, y;
+        const r = (e == null ? void 0 : e.id) ?? A(), s = {
+          ...e,
+          id: r,
+          createdAt: (e == null ? void 0 : e.createdAt) ?? (/* @__PURE__ */ new Date()).toISOString(),
+          updatedAt: (e == null ? void 0 : e.updatedAt) ?? (/* @__PURE__ */ new Date()).toISOString(),
+          publishedAt: (/* @__PURE__ */ new Date(0)).toISOString(),
+          slug: (e == null ? void 0 : e.slug) ?? `/${r}`,
+          sections: (e == null ? void 0 : e.sections) ?? {},
+          sectionIds: (e == null ? void 0 : e.sectionIds) ?? [],
+          isPublic: (e == null ? void 0 : e.isPublic) ?? !0,
+          templateConfig: (e == null ? void 0 : e.templateConfig) ?? {
+            isTemplate: ((i = e == null ? void 0 : e.templateConfig) == null ? void 0 : i.isTemplate) ?? !0,
+            displayTemplateId: ((c = e == null ? void 0 : e.templateConfig) == null ? void 0 : c.displayTemplateId) ?? void 0,
+            dataSourceIds: ((d = e == null ? void 0 : e.templateConfig) == null ? void 0 : d.dataSourceIds) ?? void 0,
+            dataSourceParameters: ((w = e == null ? void 0 : e.templateConfig) == null ? void 0 : w.dataSourceParameters) ?? {},
+            enabledGenerate: ((g = e == null ? void 0 : e.templateConfig) == null ? void 0 : g.enabledGenerate) ?? !1,
+            agentId: ((y = e == null ? void 0 : e.templateConfig) == null ? void 0 : y.agentId) ?? void 0
+          }
+        };
+        return t.doc.transact(() => {
+          n.pages[s.id] = s, n.pageIds.splice(o ?? n.pageIds.length, 0, s.id);
+        }), s;
+      },
+      addRoute: (e, o) => {
+        const r = (e == null ? void 0 : e.id) ?? A(), s = {
+          ...e,
+          id: r,
+          createdAt: (e == null ? void 0 : e.createdAt) ?? (/* @__PURE__ */ new Date()).toISOString(),
+          updatedAt: (e == null ? void 0 : e.updatedAt) ?? (/* @__PURE__ */ new Date()).toISOString(),
+          publishedAt: (/* @__PURE__ */ new Date(0)).toISOString(),
+          path: (e == null ? void 0 : e.path) ?? `/${r}`,
+          handler: (e == null ? void 0 : e.handler) ?? "Pages Kit",
+          isPublic: (e == null ? void 0 : e.isPublic) ?? !0,
+          params: (e == null ? void 0 : e.params) ?? [],
+          enabledGenerate: (e == null ? void 0 : e.enabledGenerate) ?? !1,
+          displayTemplateId: (e == null ? void 0 : e.displayTemplateId) ?? void 0,
+          dataSource: (e == null ? void 0 : e.dataSource) ?? {}
+        };
+        return t.doc.transact(() => {
+          n.routes ?? (n.routes = {}), n.routeIds ?? (n.routeIds = []), n.routes[s.id] = s, n.routeIds.splice(o ?? n.routeIds.length, 0, s.id);
+        }), s;
+      },
+      deleteRoute: (e) => {
+        var r;
+        if (!e)
+          return;
+        const o = (r = n.routeIds) == null ? void 0 : r.indexOf(e);
+        o !== void 0 && o !== -1 && t.doc.transact(() => {
+          var s, i;
+          (s = n.routeIds) == null || s.splice(o, 1), (i = n.routes) == null || delete i[e];
+        });
+      },
+      deletePage: (e) => {
+        const o = n.pageIds.indexOf(e);
+        o !== -1 && t.doc.transact(() => {
+          n.pageIds.splice(o, 1), delete n.pages[e];
+        });
+      },
+      movePage: (e, o) => {
+        const { pageIds: r } = n, s = r.indexOf(e);
+        s >= 0 && r.splice(o, 0, ...r.splice(s, 1));
+      },
+      addSection: (e, o, r) => {
+        const s = n.pages[e];
+        if (!s)
+          throw new Error(`Page ${e} is not exists`);
+        const i = {
+          ...o,
+          id: o.id ?? A(),
+          isTemplateSection: o.isTemplateSection ?? !0,
+          llmConfig: o.llmConfig ?? {}
+        };
+        return t.doc.transact(() => {
+          s.sections[i.id] = i, s.sectionIds.splice(r ?? s.sectionIds.length, 0, i.id);
+        }), i;
+      },
+      deleteSection: (e, o) => {
+        const r = n.pages[e];
+        if (!r)
+          throw new Error(`Page ${e} is not exists`);
+        const s = r.sectionIds.indexOf(o);
+        s !== -1 && t.doc.transact(() => {
+          r.sectionIds.splice(s, 1), delete r.sections[o];
+        });
+      },
+      toggleSectionVisibility: (e, o, r) => {
+        const s = n.pages[e];
+        if (!s)
+          throw new Error(`Page ${e} is not exists`);
+        const i = s.sections[o];
+        i && (i.visibility = r);
+      },
+      moveSection: (e, o, r) => {
+        const s = n.pages[e];
+        if (!s)
+          throw new Error(`Page ${e} is not exists`);
+        const { sectionIds: i } = s, c = i.indexOf(o);
+        c >= 0 && i.splice(r, 0, ...i.splice(c, 1));
+      }
+    }),
+    [n, t.doc]
+  );
+  return {
+    ...t,
+    state: n,
+    actions: p,
+    localActions: h,
+    get currentPage() {
+      const {
+        localState: { currentPageId: e }
+      } = t;
+      return e ? n.pages[e] : void 0;
+    },
+    get currentSection() {
+      var s, i, c;
+      const {
+        localState: { currentPageId: e, ...o }
+      } = t;
+      if (!e)
+        return;
+      const r = (i = (s = o.pages) == null ? void 0 : s[e]) == null ? void 0 : i.currentSectionId;
+      if (r)
+        return (c = n.pages[e]) == null ? void 0 : c.sections[r];
+    },
+    get currentRoute() {
+      var o;
+      const {
+        localState: { currentRouteId: e }
+      } = t;
+      return e ? (o = n.routes) == null ? void 0 : o[e] : void 0;
+    }
+  };
+}, V = () => {
+  const { projectId: t } = ae();
+  return t ?? ue() ?? "";
+};
+function Ce(t) {
+  var u, I;
+  const { resources: n } = t;
+  if (!n.components)
+    return {};
+  const a = {};
+  return (I = (u = window == null ? void 0 : window.blocklet) == null ? void 0 : u.componentMountPoints) == null || I.forEach((S) => {
+    a[S.did] = S;
+  }), Object.fromEntries(
+    Object.entries(n.components).map(([S, { blockletId: h, component: p }]) => {
+      var e;
+      return [
+        S,
+        { data: p, blockletId: h, blockletTitle: ((e = a[h]) == null ? void 0 : e.title) || h }
+      ];
+    })
+  );
+}
+function ge(t) {
+  const { components: n } = t;
+  return n || {};
+}
+function je(t) {
+  return {
+    ...Ce(t),
+    ...ge(t)
+  };
+}
+const Ze = () => je(ve().state);
+export {
+  Ke as E,
+  Ye as S,
+  qe as a,
+  ve as b,
+  We as c,
+  je as d,
+  Xe as e,
+  Ze as f,
+  Qe as g,
+  J as h,
+  Ve as i,
+  ge as j,
+  Ce as k,
+  ue as l,
+  A as n,
+  ze as t,
+  V as u
+};

package/lib/es/components.js

@@ -7,7 +7,7 @@ import "lru-cache";
 import "node-fetch";
 import "ufo";
 import "crypto";
-import { c as _, G as E, d as i, e as d, j as l, k as N, m as O, h as P, g as c, f as g } from "./chunks/site-state-BHfXVFkY.js";
+import { c as _, G as E, d as i, e as d, j as l, k as N, m as O, h as P, g as c, f as g } from "./chunks/site-state-BLNi12iP.js";
 export {
   _ as CUSTOM_COMPONENT_CACHE_DURATION_IN_SECONDS,
   E as GET_SERVER_SIDE_PROPS_TIMEOUT_IN_SECONDS,

package/lib/es/home.js

@@ -1,5 +1,5 @@
 import "react/jsx-runtime";
-import "./chunks/state-DCRhzAYq.js";
+import "./chunks/state-DNndJ33Y.js";
 import "@arcblock/ux/lib/Locale/context";
 import "@arcblock/ux/lib/Result";
 import "@blocklet/pages-kit/builtin/page/header";
@@ -20,8 +20,8 @@ import "react-helmet";
 import "react-router-dom";
 import "react-use";
 import "ufo";
-import "./chunks/array-CUVFSUuJ.js";
-import { a as B, P as D, d as R, c as S, b as W, T as j, H as k } from "./chunks/home-DIJ8xaUb.js";
+import "./chunks/array-CWudJ_mc.js";
+import { a as B, P as D, d as R, c as S, b as W, T as j, H as k } from "./chunks/home-D5UawjLT.js";
 export {
   B as HomeView,
   D as PageRoutes,

package/lib/es/locales.js

@@ -118,6 +118,21 @@ const t = e({
     },
     export: "Export",
     noPreviewAvailable: "No preview available",
+    routePreview: {
+      loading: "Loading...",
+      generatingPageStructure: "Generating page content structure...",
+      generatingSectionContent: "Generating section content...",
+      routePreview: "Route Preview",
+      noDisplayTemplate: "This route has no display template",
+      templateNotFound: "Display template not found",
+      noSectionsAvailable: "No sections available",
+      optimizeContent: "Optimize Content",
+      optimizeContentButton: "Use AI to optimize content",
+      sectionRule: "Section Rule",
+      sectionRulePlaceholder: "Enter your section rule or instructions for AI generation",
+      confirmOptimize: "Confirm",
+      cancelOptimize: "Cancel"
+    },
     pages: {
       addPage: "Create Page",
       createResource: "Create Resource",
@@ -283,6 +298,9 @@ const t = e({
       deleteRouteTitle: "Delete Route",
       deleteRouteConfirm: "Are you sure you want to delete this route? This action cannot be undone.",
       routeDeleted: "Route deleted successfully"
+    },
+    datasource: {
+      autoSaveSuccess: "Auto save success"
     }
   },
   error: {
@@ -564,6 +582,21 @@ const t = e({
     },
     export: "导出",
     noPreviewAvailable: "无可用预览",
+    routePreview: {
+      loading: "加载中...",
+      generatingPageStructure: "正在生成页面内容结构...",
+      generatingSectionContent: "正在生成卡片内容...",
+      routePreview: "路由预览",
+      noDisplayTemplate: "该路由没有显示模板",
+      templateNotFound: "未找到显示模板",
+      noSectionsAvailable: "没有可用内容",
+      optimizeContent: "内容优化",
+      optimizeContentButton: "使用 AI 优化内容",
+      sectionRule: "卡片规则",
+      sectionRulePlaceholder: "输入卡片规则",
+      confirmOptimize: "确认",
+      cancelOptimize: "取消"
+    },
     pages: {
       addPage: "创建页面",
       createResource: "创建资源",
@@ -693,9 +726,9 @@ const t = e({
       isTemplate: "作为模版页面使用",
       isTemplateSection: "模板动态卡片",
       templateDescription: "卡片描述，使用 AIGNE 生成页面内容时，会根据卡片描述生成卡片内容",
-      templateSectionNameRequired: "模板区块需要设置名称，以便在使用动态模板时为区块设置对应的值",
-      templateSectionNameHelper: "区块名称用于标识模板中的区块，请使用有意义且唯一的名称，以便后续为区块设置内容",
-      templateSectionNameDuplicated: "模板区块名称在页面中必须唯一，当前名称已被其他模板区块使用",
+      templateSectionNameRequired: "模板卡片需要设置名称，以便在使用动态模板时为卡片设置对应的值",
+      templateSectionNameHelper: "卡片名称用于标识模板中的卡片，请使用有意义且唯一的名称，以便后续为卡片设置内容",
+      templateSectionNameDuplicated: "模板卡片名称在页面中必须唯一，当前名称已被其他模板卡片使用",
       propertyNotFound: "修改参数失败，原因：组件不存在 `{key}` 属性",
       configDetailedDescription: "配置详细描述",
       llmConfigTitle: "LLM 配置详情",
@@ -738,6 +771,9 @@ const t = e({
         landing: "落地页模板",
         form: "表单模板"
       }
+    },
+    datasource: {
+      autoSaveSuccess: "自动保存成功"
     }
   },
   error: {
@@ -900,7 +936,7 @@ const t = e({
   style: {
     title: "公共样式"
   }
-}), r = { en: t, zh: a };
+}), n = { en: t, zh: a };
 export {
-  r as translations
+  n as translations
 };