@rxdrag/website-studio 0.0.3 → 0.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/EditorScope/useAllMaterials.d.ts +1 -0
- package/dist/generator/classes/ComponentsStore.d.ts +2 -2
- package/dist/generator/classes/WebsiteGenerator.d.ts +2 -2
- package/dist/generator/templates/vars.d.ts +3 -3
- package/dist/index.mjs +50 -39
- package/dist/index.mjs.map +1 -1
- package/package.json +20 -20
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function useAllMaterials(): import("@rxdrag/react-core-pro").IMaterial[];
|
|
@@ -3,9 +3,9 @@ import { ComponentCoder } from "./ComponentCoder";
|
|
|
3
3
|
import { IMaterial } from "@rxdrag/react-core-pro";
|
|
4
4
|
export declare class TemplatesStore {
|
|
5
5
|
protected components: FrontComponent[];
|
|
6
|
-
|
|
6
|
+
materials: IMaterial[];
|
|
7
7
|
coders: ComponentCoder[];
|
|
8
|
-
constructor(components: FrontComponent[],
|
|
8
|
+
constructor(components: FrontComponent[], materials: IMaterial[]);
|
|
9
9
|
getComponentCoders(): ComponentCoder[];
|
|
10
10
|
getComponentCoder(name: string): ComponentCoder | undefined;
|
|
11
11
|
}
|
|
@@ -4,8 +4,8 @@ import { IMaterial } from "@rxdrag/react-core-pro";
|
|
|
4
4
|
import { StudioContextProps } from "../../components/StudioRoot";
|
|
5
5
|
export declare class WebsiteGenerator {
|
|
6
6
|
protected studioProps: StudioContextProps;
|
|
7
|
-
protected materials:
|
|
8
|
-
constructor(studioProps: StudioContextProps, materials:
|
|
7
|
+
protected materials: IMaterial[];
|
|
8
|
+
constructor(studioProps: StudioContextProps, materials: IMaterial[]);
|
|
9
9
|
getComponents(): import("@rxdrag/rxcms-models").FrontComponent[];
|
|
10
10
|
getPages(): Page[] | undefined;
|
|
11
11
|
get404Page(): Page | undefined;
|
|
@@ -9,6 +9,6 @@ export declare const APP_PPACKAGES = "#appPackages#";
|
|
|
9
9
|
export declare const WEBSITE_ID = "#websiteId#";
|
|
10
10
|
export declare const LOADER_FUNCTION = "#loader#";
|
|
11
11
|
export declare const USE_LOADER_DATA = "#useLoaderData#";
|
|
12
|
-
export declare const rxcmsModelsVersion = "0.3.
|
|
13
|
-
export declare const entifyHooksVersion = "0.2.
|
|
14
|
-
export declare const modelRemixLibVersion = "0.1.
|
|
12
|
+
export declare const rxcmsModelsVersion = "0.3.36";
|
|
13
|
+
export declare const entifyHooksVersion = "0.2.30";
|
|
14
|
+
export declare const modelRemixLibVersion = "0.1.47";
|
package/dist/index.mjs
CHANGED
|
@@ -10,6 +10,8 @@ import React__default, { createContext, useContext, useMemo, memo, Fragment, use
|
|
|
10
10
|
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";
|
|
11
11
|
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";
|
|
12
12
|
import { TextNodeName } from "@rxdrag/schema-pro";
|
|
13
|
+
import { propSetters, Input, Textarea, ImageSelect, TargetSetter, DeviceBreakpoints, DeviceContext } from "@rxdrag/schema-setters";
|
|
14
|
+
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";
|
|
13
15
|
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";
|
|
14
16
|
import { GlobalLoading, EntityEditModal, EntitySelectField, EditingPopoverScope, useRemoveRow, useEditRow, EntityListScope, EntityRowScope, useListData, QueryListScope, useNewRow, useIsLoading, NewButton } from "@rxdrag/rxcms-models-ui";
|
|
15
17
|
import { useOneTheme, useOneWebsiteFrame, useTemplateList, usePageList, useFrontComponentList, useUpsertOnePage, useUpsertOneWebsiteFrame, useUpsertOneTheme, useDeletePageById, useDeleteWebsiteFrameById } from "@rxdrag/rxcms-model-hooks";
|
|
@@ -21,9 +23,7 @@ import { isHTMLElement, makeRxId, isStr } from "@rxdrag/shared";
|
|
|
21
23
|
import { faker } from "@faker-js/faker";
|
|
22
24
|
import { XDataType, XDataScope, PRODUCT_COVER, PAGE_BREADCRUMBS, PAGE_TITLE, TriggerType } from "@rxdrag/website-components";
|
|
23
25
|
import { merge, keys, uniqueId, isObject, isArray, isString, uniqBy } from "lodash-es";
|
|
24
|
-
import { Input, Textarea, ImageSelect, TargetSetter, propSetters, DeviceBreakpoints, DeviceContext } from "@rxdrag/schema-setters";
|
|
25
26
|
import { ColorPicker, StyledTooltip, Modal, ModalContent, ModalHeader, ModalBody, WarningIcon, ModalFooter, SettingsIcon, AddIcon, Drawer, ModalClose, PinIcon, CloseIcon, LeafNode, GroupNode, SearchIcon, TreeView, PredefinedColorPicker, FrameIcon, HomeIcon, RemoveIcon, MenuIcon } from "@rxdrag/rxcms-common";
|
|
26
|
-
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";
|
|
27
27
|
import { Icon } from "@iconify/react";
|
|
28
28
|
import { useUpsertEntityWithIndicator, globalErrorState } from "@rxdrag/rxcms-entify-wrapper";
|
|
29
29
|
import { InputField, Form, TextareaField } from "@rxdrag/fieldy-nextui";
|
|
@@ -1352,6 +1352,27 @@ class ContentEditorImpl {
|
|
|
1352
1352
|
const ContentEditor = (engine) => {
|
|
1353
1353
|
return new ContentEditorImpl(engine);
|
|
1354
1354
|
};
|
|
1355
|
+
const studioSetters = {
|
|
1356
|
+
...propSetters,
|
|
1357
|
+
Fragment: React__default.Fragment
|
|
1358
|
+
// TabList,
|
|
1359
|
+
// Tab,
|
|
1360
|
+
// TabPanel,
|
|
1361
|
+
// Stack,
|
|
1362
|
+
// FormControl,
|
|
1363
|
+
// FormLabel: FormLabel,
|
|
1364
|
+
// Autocomplete: Autocomplete,
|
|
1365
|
+
// Input: toControlled(Input, 'value', ''),
|
|
1366
|
+
// Textarea: toControlled(Textarea, 'value', ''),
|
|
1367
|
+
//Select,
|
|
1368
|
+
//Option: Option,
|
|
1369
|
+
//Switch: Switch,
|
|
1370
|
+
//IconPicker,
|
|
1371
|
+
//ToggleButtonGroup,
|
|
1372
|
+
// Button,
|
|
1373
|
+
// IconButton,
|
|
1374
|
+
// SlotSwitch,
|
|
1375
|
+
};
|
|
1355
1376
|
const StudioContext = createContext({});
|
|
1356
1377
|
function useStudioContext() {
|
|
1357
1378
|
return useContext(StudioContext);
|
|
@@ -3284,33 +3305,16 @@ function useCustomizedMaterials() {
|
|
|
3284
3305
|
}, [components]);
|
|
3285
3306
|
return materials;
|
|
3286
3307
|
}
|
|
3287
|
-
|
|
3288
|
-
...propSetters,
|
|
3289
|
-
Fragment: React__default.Fragment
|
|
3290
|
-
// TabList,
|
|
3291
|
-
// Tab,
|
|
3292
|
-
// TabPanel,
|
|
3293
|
-
// Stack,
|
|
3294
|
-
// FormControl,
|
|
3295
|
-
// FormLabel: FormLabel,
|
|
3296
|
-
// Autocomplete: Autocomplete,
|
|
3297
|
-
// Input: toControlled(Input, 'value', ''),
|
|
3298
|
-
// Textarea: toControlled(Textarea, 'value', ''),
|
|
3299
|
-
//Select,
|
|
3300
|
-
//Option: Option,
|
|
3301
|
-
//Switch: Switch,
|
|
3302
|
-
//IconPicker,
|
|
3303
|
-
//ToggleButtonGroup,
|
|
3304
|
-
// Button,
|
|
3305
|
-
// IconButton,
|
|
3306
|
-
// SlotSwitch,
|
|
3307
|
-
};
|
|
3308
|
-
function EditorScope(props) {
|
|
3309
|
-
const { children, resources, ...rest } = props;
|
|
3308
|
+
function useAllMaterials() {
|
|
3310
3309
|
const customMaterials = useCustomizedMaterials();
|
|
3311
3310
|
const materials = useMemo(() => {
|
|
3312
3311
|
return staticMaterials.concat(customMaterials || []);
|
|
3313
3312
|
}, [customMaterials]);
|
|
3313
|
+
return materials;
|
|
3314
|
+
}
|
|
3315
|
+
function EditorScope(props) {
|
|
3316
|
+
const { children, resources, ...rest } = props;
|
|
3317
|
+
const materials = useAllMaterials();
|
|
3314
3318
|
const plugins = useMemo(() => {
|
|
3315
3319
|
return [ContentEditor];
|
|
3316
3320
|
}, []);
|
|
@@ -15417,9 +15421,9 @@ const APP_PPACKAGES = "#appPackages#";
|
|
|
15417
15421
|
const WEBSITE_ID = "#websiteId#";
|
|
15418
15422
|
const LOADER_FUNCTION = "#loader#";
|
|
15419
15423
|
const USE_LOADER_DATA = "#useLoaderData#";
|
|
15420
|
-
const rxcmsModelsVersion = "0.3.
|
|
15421
|
-
const entifyHooksVersion = "0.2.
|
|
15422
|
-
const modelRemixLibVersion = "0.1.
|
|
15424
|
+
const rxcmsModelsVersion = "0.3.36";
|
|
15425
|
+
const entifyHooksVersion = "0.2.30";
|
|
15426
|
+
const modelRemixLibVersion = "0.1.47";
|
|
15423
15427
|
const envTemplate = {
|
|
15424
15428
|
name: ".env",
|
|
15425
15429
|
content: `VITE_SERVER_URL = http://139.129.23.194:4000/graphql
|
|
@@ -15990,13 +15994,16 @@ class Coder {
|
|
|
15990
15994
|
getMaterialsFromElements(elements, usedMaterials) {
|
|
15991
15995
|
var _a2;
|
|
15992
15996
|
for (const element of elements) {
|
|
15993
|
-
const maretial = (_a2 = this.comsStore.
|
|
15994
|
-
if (maretial) {
|
|
15997
|
+
const maretial = (_a2 = this.comsStore.materials) == null ? void 0 : _a2.find((material) => material.componentName === element.componentName);
|
|
15998
|
+
if (maretial && !usedMaterials.find((material) => material.componentName === maretial.componentName)) {
|
|
15995
15999
|
usedMaterials.push(maretial);
|
|
15996
16000
|
}
|
|
15997
16001
|
if (element.children) {
|
|
15998
16002
|
this.getMaterialsFromElements(element.children, usedMaterials);
|
|
15999
16003
|
}
|
|
16004
|
+
if (element.slots) {
|
|
16005
|
+
this.getMaterialsFromElements(Object.values(element.slots).filter(Boolean), usedMaterials);
|
|
16006
|
+
}
|
|
16000
16007
|
}
|
|
16001
16008
|
}
|
|
16002
16009
|
getXDataSchemas() {
|
|
@@ -16015,6 +16022,9 @@ class Coder {
|
|
|
16015
16022
|
if (element.children) {
|
|
16016
16023
|
this.getXSchemas(element.children, xSchemas);
|
|
16017
16024
|
}
|
|
16025
|
+
if (element.slots) {
|
|
16026
|
+
this.getXSchemas(Object.values(element.slots).filter(Boolean), xSchemas);
|
|
16027
|
+
}
|
|
16018
16028
|
}
|
|
16019
16029
|
if (element.componentName.startsWith(CUSTOMIZED_COMPONENT_NAME_PREFIX)) {
|
|
16020
16030
|
const componentCoder = this.comsStore.getComponentCoder((_a2 = element.props) == null ? void 0 : _a2.name);
|
|
@@ -16035,6 +16045,9 @@ class Coder {
|
|
|
16035
16045
|
components.push((_a2 = element.props) == null ? void 0 : _a2.name);
|
|
16036
16046
|
}
|
|
16037
16047
|
this.getCustomzedComponentsFromElements(element.children, components);
|
|
16048
|
+
if (element.slots) {
|
|
16049
|
+
this.getCustomzedComponentsFromElements(Object.values(element.slots).filter(Boolean), components);
|
|
16050
|
+
}
|
|
16038
16051
|
}
|
|
16039
16052
|
}
|
|
16040
16053
|
getImportsCode() {
|
|
@@ -16249,9 +16262,7 @@ const rootTemplate = {
|
|
|
16249
16262
|
name: "root.tsx",
|
|
16250
16263
|
content: `import type { LoaderFunctionArgs } from "~/deploy/remix-run-node";
|
|
16251
16264
|
import { entify } from "@rxdrag/model-remix-lib";
|
|
16252
|
-
import
|
|
16253
|
-
import { useAppInit, toViewModel, XDataScope, HtmlDocument } from "@rxdrag/website-components";
|
|
16254
|
-
import { Page404 } from "./components/Page404";
|
|
16265
|
+
import { useAppInit, XDataScope, HtmlDocument } from "@rxdrag/website-components";
|
|
16255
16266
|
import "./tailwind.css";
|
|
16256
16267
|
import './frontend.css'
|
|
16257
16268
|
${FRAME_IMPORTS}
|
|
@@ -16324,7 +16335,7 @@ class FrameCoder extends Coder {
|
|
|
16324
16335
|
return `export const loader = async (args: LoaderFunctionArgs) => {
|
|
16325
16336
|
//为了兼容cloudflare,把环境变量抽离到一个函数
|
|
16326
16337
|
const envVariables = getEnvVariables(args)
|
|
16327
|
-
const productCategories = await entify.queryProductCategories(
|
|
16338
|
+
const productCategories = await entify.queryProductCategories(envVariables);
|
|
16328
16339
|
const webSiteSettings = await entify.queryWebSiteSettings(envVariables);
|
|
16329
16340
|
const datas: TDatas = {
|
|
16330
16341
|
[XDataScope.WebsiteSettings]: webSiteSettings,
|
|
@@ -16426,10 +16437,10 @@ class ComponentCoder extends Coder {
|
|
|
16426
16437
|
}
|
|
16427
16438
|
}
|
|
16428
16439
|
class TemplatesStore {
|
|
16429
|
-
constructor(components,
|
|
16440
|
+
constructor(components, materials) {
|
|
16430
16441
|
__publicField(this, "coders", []);
|
|
16431
16442
|
this.components = components;
|
|
16432
|
-
this.
|
|
16443
|
+
this.materials = materials;
|
|
16433
16444
|
this.coders = this.components.map((component) => new ComponentCoder(this, component));
|
|
16434
16445
|
}
|
|
16435
16446
|
getComponentCoders() {
|
|
@@ -16844,14 +16855,14 @@ function useExportWebsite() {
|
|
|
16844
16855
|
const website = useWebsite();
|
|
16845
16856
|
const save = useSave();
|
|
16846
16857
|
const contextValue = useStudioContext();
|
|
16847
|
-
const
|
|
16858
|
+
const materials = useAllMaterials();
|
|
16848
16859
|
const exportWebsite = useCallback(async () => {
|
|
16849
16860
|
try {
|
|
16850
16861
|
if (nopClient && website) {
|
|
16851
16862
|
setExporting(true);
|
|
16852
16863
|
const generator = new WebsiteGenerator(
|
|
16853
16864
|
contextValue,
|
|
16854
|
-
|
|
16865
|
+
materials
|
|
16855
16866
|
);
|
|
16856
16867
|
const zip = await generator.generate();
|
|
16857
16868
|
const content = await zip.generateAsync({ type: "blob" });
|
|
@@ -16863,7 +16874,7 @@ function useExportWebsite() {
|
|
|
16863
16874
|
} finally {
|
|
16864
16875
|
setExporting(false);
|
|
16865
16876
|
}
|
|
16866
|
-
}, [contextValue,
|
|
16877
|
+
}, [contextValue, materials, nopClient, save, setError, website]);
|
|
16867
16878
|
return { exportWebsite, exporting };
|
|
16868
16879
|
}
|
|
16869
16880
|
const Toolbar = memo(() => {
|