@rxdrag/website-studio 0.0.6 → 0.0.8

package/dist/components/StudioRoot/contexts.d.ts

@@ -2,7 +2,7 @@ import { ListResult } from "@rxdrag/entify-hooks";
 import { FrontComponent, Page, Template, Theme, WebsiteFrame } from "@rxdrag/rxcms-models";
 import React from "react";
 export type StudioContextProps = {
-    websiteId?: string;
+    websiteId?: string | null;
     templates?: Template[];
     components?: FrontComponent[];
     pages?: ListResult<Page>;

package/dist/generator/classes/WebsiteGenerator.d.ts

@@ -5,7 +5,8 @@ import { StudioContextProps } from "../../components/StudioRoot";
 export declare class WebsiteGenerator {
     protected studioProps: StudioContextProps;
     protected materials: IMaterial[];
-    constructor(studioProps: StudioContextProps, materials: IMaterial[]);
+    protected endpoint: string | undefined;
+    constructor(studioProps: StudioContextProps, materials: IMaterial[], endpoint: string | undefined);
     getComponents(): import("@rxdrag/rxcms-models").FrontComponent[];
     getPages(): Page[] | undefined;
     get404Page(): Page | undefined;

package/dist/generator/templates/vars.d.ts

@@ -1,3 +1,4 @@
+export declare const TAILWIND_CONFIG = "#tailwindConfig#";
 export declare const FRAME_CONTENT = "#frameContent#";
 export declare const FRAME_IMPORTS = "#frameImports#";
 export declare const FRAME_404 = "#frame404#";
@@ -8,6 +9,7 @@ export declare const APP_NAME = "#appName#";
 export declare const APP_VERSION = "#appVersion#";
 export declare const APP_PPACKAGES = "#appPackages#";
 export declare const WEBSITE_ID = "#websiteId#";
+export declare const ENTIFY_SERVER_URL = "#entifyServerUrl#";
 export declare const LOADER_FUNCTION = "#loader#";
 export declare const USE_LOADER_DATA = "#useLoaderData#";
 export declare const rxcmsModelsVersion = "0.3.36";

package/dist/index.mjs

@@ -4,18 +4,18 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K;
+var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F;
 import * as React from "react";
 import React__default, { createContext, useContext, useMemo, memo, Fragment, useCallback, useState, useEffect, forwardRef as forwardRef$1, useRef, useImperativeHandle, isValidElement, cloneElement } from "react";
 import { useFilterMeta, useDesignerEngine, ComponentDesignersRoot, useComponentDesigners, useNode, Designer, useDocument, useDocumentChangedState, useCurrentNode, useGetNode, useChangeNodeMeta, useNodeMeta, useUndo, useRedo, useLanguage, useSetters, useResourceNode, useActiveIdState, useActions, useCurrentTree, useSelectedNodeIds, ComponentTreeWidget, useSelect, DocumentRoot } from "@rxdrag/react-core-pro";
 import { RXID_ATTR_NAME, TOOLBAR_HEIGHT, CanvasScrollEvent, CanvasResizeEvent, numbToPx, getMaxZIndex, HistoryableActionType, MARGIN_DECORATOR_NAME, LINE_DECORTOR_NAME, LineDecorator, MarginDecorator, IFrameCanvasImpl, KeyboardDriver, DragDropDriver, DragOverDriver, MouseClickDriver, MouseMoveDriver, MouseOverOutDriver, CanvasResizeDriver, CanvasScrollDriver, MouseUpDriver, ContainerImpl } from "@rxdrag/core-pro";
 import { TextNodeName } from "@rxdrag/schema-pro";
 import { propSetters, Input, Textarea, ImageSelect, TargetSetter, DeviceBreakpoints, DeviceContext } from "@rxdrag/schema-setters";
-import { createSchema as createSchema$1, staticMaterials, attachmentNameResource, XAttachmentIconMaterial, attachmentLinkResource, websiteSettingsContactResource, websiteSettingsAvatarResource, websiteSettingsAddressResource, webisteSettingsEmailResource, webisteSettingsTelResource, webisteSettingsFaxResource, webisteSettingMobileResource, userNameResource, userAvatarResource, userPositionResource, userProfileResource, userEmailResource, userTelResource, userMobileResource, userLinkedInResource, userTwitterResource, userFacebookResource, userInstagramResource, userLinkResource, productCategoryNameResource, productCategoryMediaResource, productCategoryDescriptionResource, productCategoryCreatedAtResource, productCategoryUpdatedAtResource, productCategoryProductsResource, proudctCategoryLinkResource, postCategoryNameResource, postCategoryDescriptionResource, postCategoryCreatedAtResource, postCategoryUpdatedAtResource, postCategoryPostsResource, postCategoryLinkResource, productTitleResource, productShortTitleResource, productCoverResource, productMediasResource, productDescriptionResource, productFeaturesResource, productContentResource, productContent2Resource, productContent3Resource, productPublishedAtResource, productCreatedAtResource, productUpdatedAtResource, productAssociationCategoryResource, productAttachmentsResource, productRelatedResource, productLinkResource, postCoverResource, postAuthorResource, postTitleResource, postDescriptionResource, postContentResource, postPublishedAtResource, postCreatedAtResource, postUpdatedAtResource, postAssociationCategoryResource, postOutlineResource, postLinkResource, productResource, productListResource, postResource, postListResource, productCategoryResource, productCategoryListResource, postCategoryResource, postCategoryListResource, searchListResource, featuredProductsResource, latestPostsResource, XPaginationMaterial, XPaginationPrevButtonMaterial, XPaginationNextButtonMaterial, XPaginationPagesMaterial, XPaginationPageIndexMaterial, XPaginationTotalMaterial, pageTitleResource, XBreadcrumbsMaterial, xHeading1Resource, xHeading2Resource, xHeading3Resource, xHeading4Resource, XParagraphMaterial, XDateMaterial, ImgMaterial, XIconMaterial, XMenuMaterial, XModalMaterial, XModalCloseMaterial, RouteLinkMaterial, XSearchMaterial, XShareMaterial, XToTopMaterial, XAnimationNumberMaterial, XSectionMaterial, XBoxMaterial, xRowName, xColName, XPageOutletMaterial, XTabsMaterial, XTabsNavTitleMaterial, XTabPanelMaterial, XFormMaterial, XFormEmailMaterial, XFormNameMaterial, XFormCompanyMaterial, XFormTelMaterial, XFormMessageMaterial, XSubmitMaterial, AMaterial, creatHtmlMaterial } from "@rxdrag/website-materials";
+import { createSchema as createSchema$1, staticMaterials, attachmentNameResource, XAttachmentIconMaterial, attachmentLinkResource, websiteSettingsContactResource, websiteSettingsAvatarResource, websiteSettingsAddressResource, webisteSettingsEmailResource, webisteSettingsTelResource, webisteSettingsFaxResource, webisteSettingMobileResource, userNameResource, userAvatarResource, userPositionResource, userProfileResource, userEmailResource, userTelResource, userMobileResource, userLinkedInResource, userTwitterResource, userFacebookResource, userInstagramResource, userLinkResource, productCategoryNameResource, productCategoryMediaResource, productCategoryDescriptionResource, productCategoryCreatedAtResource, productCategoryUpdatedAtResource, productCategoryProductsResource, proudctCategoryLinkResource, postCategoryNameResource, postCategoryDescriptionResource, postCategoryCreatedAtResource, postCategoryUpdatedAtResource, postCategoryPostsResource, postCategoryLinkResource, productTitleResource, productShortTitleResource, productCoverResource, productMediasResource, productDescriptionResource, productFeaturesResource, productContentResource, productContent2Resource, productContent3Resource, productPublishedAtResource, productCreatedAtResource, productUpdatedAtResource, productAssociationCategoryResource, productAttachmentsResource, productRelatedResource, productLinkResource, postCoverResource, postAuthorResource, postTitleResource, postDescriptionResource, postContentResource, postPublishedAtResource, postCreatedAtResource, postUpdatedAtResource, postAssociationCategoryResource, postOutlineResource, postLinkResource, productResource, productListResource, postResource, postListResource, productCategoryResource, productCategoryListResource, postCategoryResource, postCategoryListResource, searchListResource, featuredProductsResource, latestPostsResource, XPaginationMaterial, XPaginationPrevButtonMaterial, XPaginationNextButtonMaterial, XPaginationPagesMaterial, XPaginationPageIndexMaterial, XPaginationTotalMaterial, pageTitleResource, XBreadcrumbsMaterial, xHeading1Resource, xHeading2Resource, xHeading3Resource, xHeading4Resource, XParagraphMaterial, XDateMaterial, ImgMaterial, XIconMaterial, XMenuMaterial, XModalMaterial, XModalCloseMaterial, RouteLinkMaterial, XSearchMaterial, XShareMaterial, XToTopMaterial, XAnimationNumberMaterial, XSectionMaterial, XBoxMaterial, xRowName, xColName, XPageOutletMaterial, XTabsMaterial, XTabsNavTitleMaterial, XTabPanelMaterial, XFormMaterial, formEmailResource, formNameResource, formCompanyResource, formTelResource, formMessageResource, XSubmitMaterial, AMaterial, creatHtmlMaterial } from "@rxdrag/website-materials";
 import { ThemeQueryOptions, ThemeFields, WebsiteFrameQueryOptions, WebsiteFrameFields, TemplateQueryOptions, TemplateFields, TemplateCategoryFields, PageQueryOptions, PageFields, PageAssciations, MediaQueryOptions, FrontComponentQueryOptions, FrontComponentFields, ComponentCategoryFields, MediaFields, WebsiteSettingsFields, ProductCategoryAssciations, ProductCategoryFields, ProductFields, PostFields, PostAssciations, UserFields, UserAssciations, ComponentType, FrontComponentEntityName, TemplateEntityName, mediaToInput, templateToInput, TemplateCategoryQueryOptions, frontComponentToInput, ComponentCategoryQueryOptions, ExtendFieldType, PageEntityName, PageType, pageToInput, ComponentCategoryEntityName, componentCategoryToInput, TemplateCategoryEntityName, templateCategoryToInput, MediaType, ProductAssciations, PostCategoryAssciations } from "@rxdrag/rxcms-models";
 import { GlobalLoading, EntityEditModal, EntitySelectField, EditingPopoverScope, useRemoveRow, useEditRow, EntityListScope, EntityRowScope, useListData, QueryListScope, useNewRow, useIsLoading, NewButton } from "@rxdrag/rxcms-models-ui";
 import { useOneTheme, useOneWebsiteFrame, useTemplateList, usePageList, useFrontComponentList, useUpsertOnePage, useUpsertOneWebsiteFrame, useUpsertOneTheme, useDeletePageById, useDeleteWebsiteFrameById } from "@rxdrag/rxcms-model-hooks";
-import { OrderBy, useCreateEntityClient } from "@rxdrag/entify-hooks";
+import { OrderBy, useCreateEntityClient, useEntifyEndpoint } from "@rxdrag/entify-hooks";
 import { RecoilRoot, atom, selector, useRecoilValue, useRecoilState, useSetRecoilState } from "recoil";
 import { cn, Switch, Button as Button$1, Popover, PopoverTrigger, PopoverContent, Input as Input$1, Divider, Tabs, Tab, Autocomplete, AutocompleteItem, Accordion, AccordionItem, Select, SelectItem, Dropdown, DropdownTrigger, DropdownMenu, DropdownItem, Textarea as Textarea$1, Badge, Image, Tooltip, CircularProgress } from "@nextui-org/react";
 import { motion, LazyMotion, domAnimation, AnimatePresence, m } from "framer-motion";
@@ -1546,6 +1546,7 @@ function StudioRoot(props) {
   const loading = isLoading || componentsLoading || themeLoading || pagesLoading || frameLoading;
   const studioData = useMemo(() => {
     return {
+      websiteId,
       theme,
       frame,
       templates: themplatesData == null ? void 0 : themplatesData.items,
@@ -1553,7 +1554,7 @@ function StudioRoot(props) {
       pages: pagesData,
       loading
     };
-  }, [componentsData == null ? void 0 : componentsData.items, frame, loading, pagesData, theme, themplatesData == null ? void 0 : themplatesData.items]);
+  }, [componentsData == null ? void 0 : componentsData.items, frame, loading, pagesData, theme, themplatesData == null ? void 0 : themplatesData.items, websiteId]);
   return /* @__PURE__ */ jsxRuntimeExports.jsx(RecoilRoot, { children: /* @__PURE__ */ jsxRuntimeExports.jsxs(StudioContext.Provider, { value: studioData, children: [
     children,
     /* @__PURE__ */ jsxRuntimeExports.jsx(GlobalLoading, { loading })
@@ -12415,27 +12416,27 @@ const resourceTreeNodes = [
       },
       {
         title: "邮箱",
-        resource: (_C = XFormEmailMaterial.resource) == null ? void 0 : _C.name
+        resource: formEmailResource
       },
       {
         title: "姓名",
-        resource: (_D = XFormNameMaterial.resource) == null ? void 0 : _D.name
+        resource: formNameResource
       },
       {
         title: "公司",
-        resource: (_E = XFormCompanyMaterial.resource) == null ? void 0 : _E.name
+        resource: formCompanyResource
       },
       {
         title: "电话",
-        resource: (_F = XFormTelMaterial.resource) == null ? void 0 : _F.name
+        resource: formTelResource
       },
       {
         title: "内容",
-        resource: (_G = XFormMessageMaterial.resource) == null ? void 0 : _G.name
+        resource: formMessageResource
       },
       {
         title: "提交",
-        resource: (_H = XSubmitMaterial.resource) == null ? void 0 : _H.name
+        resource: (_C = XSubmitMaterial.resource) == null ? void 0 : _C.name
       }
     ]
   },
@@ -12452,15 +12453,15 @@ const resourceTreeNodes = [
     children: [
       {
         title: "a",
-        resource: (_I = AMaterial.resource) == null ? void 0 : _I.name
+        resource: (_D = AMaterial.resource) == null ? void 0 : _D.name
       },
       {
         title: "div",
-        resource: (_J = creatHtmlMaterial("div").resource) == null ? void 0 : _J.name
+        resource: (_E = creatHtmlMaterial("div").resource) == null ? void 0 : _E.name
       },
       {
         title: "span",
-        resource: (_K = creatHtmlMaterial("span").resource) == null ? void 0 : _K.name
+        resource: (_F = creatHtmlMaterial("span").resource) == null ? void 0 : _F.name
       },
       {
         title: "button"
@@ -15412,6 +15413,7 @@ const MenuContent = memo((props) => {
     }
   );
 });
+const TAILWIND_CONFIG = "#tailwindConfig#";
 const FRAME_CONTENT = "#frameContent#";
 const FRAME_IMPORTS = "#frameImports#";
 const FRAME_404 = "#frame404#";
@@ -15420,6 +15422,7 @@ const APP_NAME = "#appName#";
 const APP_VERSION = "#appVersion#";
 const APP_PPACKAGES = "#appPackages#";
 const WEBSITE_ID = "#websiteId#";
+const ENTIFY_SERVER_URL = "#entifyServerUrl#";
 const LOADER_FUNCTION = "#loader#";
 const USE_LOADER_DATA = "#useLoaderData#";
 const rxcmsModelsVersion = "0.3.36";
@@ -15427,8 +15430,11 @@ const entifyHooksVersion = "0.2.30";
 const modelRemixLibVersion = "0.1.47";
 const envTemplate = {
   name: ".env",
-  content: `VITE_SERVER_URL = http://139.129.23.194:4000/graphql
-VITE_WEBSITE_ID = ${WEBSITE_ID}
+  content: `ENTIFY_SERVER_URL = ${ENTIFY_SERVER_URL}
+WEBSITE_ID = ${WEBSITE_ID}
+ENTIFY_GUEST_TOKEN = "17bD#4!fG8^2wS*0z"
+#系统token，用于数据导入
+ENTIFY_SYSTEM_TOKEN="eyJhb3in87ds#5kdfjg"
 `
 };
 const eslintrcTemplate = {
@@ -15577,6 +15583,7 @@ ${APP_PPACKAGES}
   "devDependencies": {
     "@remix-run/dev": "^2.9.1",
     "@tailwindcss/forms": "^0.5.7",
+    "@tailwindcss/typography": "^0.5.13",
     "@types/cookie": "^0.6.0",
     "@types/lodash-es": "^4.17.12",
     "@types/react": "^18.2.20",
@@ -15636,16 +15643,17 @@ const remixEnvTemplate = {
 const tailwindConfigTemplate = {
   name: "tailwind.config.ts",
   content: `import type { Config } from 'tailwindcss'
+import plugin from 'tailwindcss/plugin'
+import { colors } from 'tailwindcss/defaultTheme'
 
 export default {
   darkMode: 'class',
-  content: ["./app/**/*.{js,jsx,ts,tsx}"],
-  theme: {
-    extend: {},
-  },
-  plugins: [
-    require('@tailwindcss/forms'),
+  //这个地方要注意，子项目必须包含路径，否则会渲染不出class
+  content: [
+    "./app/**/*.{js,jsx,ts,tsx}",
+    'node_modules/@rxdrag/website-components/**/*.{js,ts,jsx,tsx}',
   ],
+  ${TAILWIND_CONFIG}
 } satisfies Config
 
 
@@ -16210,6 +16218,9 @@ ${spacesStr}</${componentName}>`;
     if ((xData.type === XDataType.Field || xData.type === XDataType.HasMany || xData.type === XDataType.HasOne) && xData.field) {
       return ` value={datas?.["${xData.scope}"]?.${xData.field}}`;
     }
+    if (xData.type === XDataType.Query) {
+      return ` value={datas?.["${xData.scope}"]?.items}`;
+    }
     return "";
   }
   slotsToTsxProps(slots, spaces = 0) {
@@ -16248,11 +16259,16 @@ ${spacesStr}}`).join("\n" + spacesStr);
 }
 const rootTemplate = {
   name: "root.tsx",
-  content: `import type { LoaderFunctionArgs } from "~/deploy/remix-run-node";
+  content: `import type { LinksFunction, LoaderFunctionArgs } from "~/deploy/remix-run-node";
 import { entify } from "@rxdrag/model-remix-lib";
 import { useAppInit, XDataScope, HtmlDocument } from "@rxdrag/website-components";
-import "./tailwind.css";
 ${FRAME_IMPORTS}
+import styles from "./tailwind.css"
+
+export const links: LinksFunction = () => [
+  { rel: "stylesheet", href: styles },
+  // ... 其他样式链接
+];
 
 ${LOADER_FUNCTION}
 
@@ -16707,9 +16723,10 @@ const deployRemixRunNodeTemplate = {
   `
 };
 class WebsiteGenerator {
-  constructor(studioProps, materials) {
+  constructor(studioProps, materials, endpoint) {
     this.studioProps = studioProps;
     this.materials = materials;
+    this.endpoint = endpoint;
   }
   getComponents() {
     return this.studioProps.components || [];
@@ -16730,19 +16747,26 @@ class WebsiteGenerator {
     return this.studioProps.frame;
   }
   async generate() {
-    var _a2, _b2, _c2;
+    var _a2, _b2, _c2, _d2, _e2;
     const zip = new JSZip();
     const pages = this.getPages();
     const frame = this.getFrame();
     const comsStore = new TemplatesStore(this.getComponents(), this.materials);
-    zip.file(envTemplate.name, envTemplate.content.replace(WEBSITE_ID, this.studioProps.websiteId || ""));
+    zip.file(
+      envTemplate.name,
+      envTemplate.content.replace(WEBSITE_ID, this.studioProps.websiteId || "").replace(ENTIFY_SERVER_URL, this.endpoint || "")
+    );
     zip.file(eslintrcTemplate.name, eslintrcTemplate.content);
     zip.file(gitignoreTemplate.name, gitignoreTemplate.content);
     zip.file(postcssTemplate.name, postcssTemplate.content);
     zip.file(readmeTemplate.name, readmeTemplate.content);
     zip.file(remixConfigTemplate.name, remixConfigTemplate.content);
     zip.file(remixEnvTemplate.name, remixEnvTemplate.content);
-    zip.file(tailwindConfigTemplate.name, tailwindConfigTemplate.content);
+    const tailwindConfigStr = ((_b2 = (_a2 = this.studioProps.theme) == null ? void 0 : _a2.tailwindConfig) == null ? void 0 : _b2.trim()) || "{}";
+    zip.file(
+      tailwindConfigTemplate.name,
+      tailwindConfigTemplate.content.replace(TAILWIND_CONFIG, tailwindConfigStr.substring(1, tailwindConfigStr.length - 2) || "")
+    );
     zip.file(tsConfigTemplate.name, tsConfigTemplate.content);
     const appFolder = zip.folder("app");
     const usedMaterials = [];
@@ -16757,7 +16781,10 @@ class WebsiteGenerator {
       );
       usedMaterials.push(...frameCoder.getUsedMaterials());
       appFolder.file(frameCoder.getFileName(), frameCoder.getFileCode());
-      appFolder.file(tailwindCssTemplate.name, tailwindCssTemplate.content.replace(CSS_CONTENT, ((_a2 = this.studioProps.theme) == null ? void 0 : _a2.css) || ""));
+      appFolder.file(
+        tailwindCssTemplate.name,
+        tailwindCssTemplate.content.replace(CSS_CONTENT, ((_c2 = this.studioProps.theme) == null ? void 0 : _c2.css) || "")
+      );
       const deplyFolder = appFolder.folder("deploy");
       if (deplyFolder) {
         deplyFolder.file(deployEnvTemplate.name, deployEnvTemplate.content);
@@ -16768,7 +16795,7 @@ class WebsiteGenerator {
       if (routesFolder) {
         routesFolder.file(slugTemplate.name, slugTemplate.content);
         for (const page of pages || []) {
-          if ((_c2 = (_b2 = page.content) == null ? void 0 : _b2.elements) == null ? void 0 : _c2.length) {
+          if ((_e2 = (_d2 = page.content) == null ? void 0 : _d2.elements) == null ? void 0 : _e2.length) {
             const pageCoder = new PageCoder(comsStore, page);
             routesFolder.file(pageCoder.getFileName(), pageCoder.getFileCode());
             usedMaterials.push(...pageCoder.getUsedMaterials());
@@ -16851,13 +16878,15 @@ function useExportWebsite() {
   const save = useSave();
   const contextValue = useStudioContext();
   const materials = useAllMaterials();
+  const endpoint = useEntifyEndpoint();
   const exportWebsite = useCallback(async () => {
     try {
       if (nopClient && website) {
         setExporting(true);
         const generator = new WebsiteGenerator(
           contextValue,
-          materials
+          materials,
+          endpoint || ""
         );
         const zip = await generator.generate();
         const content = await zip.generateAsync({ type: "blob" });
@@ -16869,7 +16898,7 @@ function useExportWebsite() {
     } finally {
       setExporting(false);
     }
-  }, [contextValue, materials, nopClient, save, setError, website]);
+  }, [contextValue, endpoint, materials, nopClient, save, setError, website]);
   return { exportWebsite, exporting };
 }
 const Toolbar = memo(() => {