@chamn/render 0.0.9 → 0.0.11
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/commonComponent/index.d.ts +12 -0
- package/dist/const/index.d.ts +2 -0
- package/dist/core/ReactErrorBoundary.d.ts +26 -0
- package/dist/core/adapter.d.ts +64 -0
- package/dist/core/adapterReact.d.ts +108 -0
- package/dist/core/designReactRender.d.ts +47 -0
- package/dist/core/refManager.d.ts +7 -0
- package/dist/core/render.d.ts +32 -0
- package/dist/core/storeManager.d.ts +11 -0
- package/dist/core/type.d.ts +9 -0
- package/dist/{index.cjs.js → index.js} +2 -2
- package/dist/index.js.map +1 -0
- package/dist/{index.es.js → index.mjs} +94 -83
- package/dist/index.mjs.map +1 -0
- package/dist/index.umd.js +1 -1
- package/dist/index.umd.js.map +1 -1
- package/dist/util/assetsLoader.d.ts +15 -0
- package/dist/util/index.d.ts +20 -0
- package/package.json +14 -9
- package/.eslintignore +0 -1
- package/.eslintrc.js +0 -30
- package/.prettierrc.json +0 -7
- package/CHANGELOG.md +0 -40
- package/__tests__/demo.test.ts +0 -3
- package/build.config.ts +0 -20
- package/dist/index.cjs.js.map +0 -1
- package/dist/index.es.js.map +0 -1
- package/index.html +0 -16
- package/jest.config.js +0 -196
- package/public/vite.svg +0 -1
- package/src/_dev_/components.tsx +0 -12
- package/src/_dev_/dev.tsx +0 -12
- package/src/_dev_/index.css +0 -13
- package/src/_dev_/page/DesignerRenderDemo.tsx +0 -65
- package/src/_dev_/page/RenderDemo.tsx +0 -60
- package/src/_dev_/router.tsx +0 -15
- package/src/commonComponent/index.tsx +0 -184
- package/src/const/index.ts +0 -5
- package/src/core/ReactErrorBoundary.ts +0 -91
- package/src/core/adapter.ts +0 -133
- package/src/core/adapterReact.ts +0 -734
- package/src/core/designReactRender.ts +0 -325
- package/src/core/refManager.ts +0 -18
- package/src/core/render.ts +0 -123
- package/src/core/storeManager.ts +0 -57
- package/src/core/type.ts +0 -10
- package/src/util/assetsLoader.ts +0 -73
- package/src/util/index.ts +0 -164
- package/src/vite-env.d.ts +0 -1
- package/stats.html +0 -6177
- package/tsconfig.json +0 -26
- /package/{src/index.ts → dist/index.d.ts} +0 -0
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export declare const InnerComponent: {
|
|
3
|
+
CContainer: ({ children, $$attributes, afterMount, beforeDestroy, ...props }: any) => React.DetailedReactHTMLElement<any, HTMLElement>;
|
|
4
|
+
CVideo: ({ children, $$attributes, ...props }: any) => React.DetailedReactHTMLElement<any, HTMLElement>;
|
|
5
|
+
CAudio: ({ children, $$attributes, ...props }: any) => React.DetailedReactHTMLElement<any, HTMLElement>;
|
|
6
|
+
CBlock: ({ children, width, height, $$attributes, ...props }: any) => React.DetailedReactHTMLElement<any, HTMLElement>;
|
|
7
|
+
CImage: ({ children, $$attributes, ...props }: any) => React.DetailedReactHTMLElement<any, HTMLElement>;
|
|
8
|
+
CText: ({ children, $$attributes, content, ...props }: any) => React.DetailedReactHTMLElement<any, HTMLElement>;
|
|
9
|
+
CCanvas: ({ children, $$attributes, ...props }: any) => React.DetailedReactHTMLElement<any, HTMLElement>;
|
|
10
|
+
CNativeTag: ({ children, $$attributes, htmlTag, ...props }: any) => React.DetailedReactHTMLElement<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>;
|
|
11
|
+
RootContainer: ({ children }: any) => any;
|
|
12
|
+
};
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { CNode, CRootNode } from '@chamn/model';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
type Props = {
|
|
4
|
+
node: CNode | CRootNode;
|
|
5
|
+
targetComponent: any;
|
|
6
|
+
onError?: (error: React.ErrorInfo) => void;
|
|
7
|
+
children?: React.ReactNode | React.ReactNode[];
|
|
8
|
+
};
|
|
9
|
+
declare class ErrorBoundary extends React.Component<Props, {
|
|
10
|
+
error: any;
|
|
11
|
+
hasError: boolean;
|
|
12
|
+
}> {
|
|
13
|
+
constructor(props: Props);
|
|
14
|
+
static getDerivedStateFromError(error: any): {
|
|
15
|
+
hasError: boolean;
|
|
16
|
+
error: any;
|
|
17
|
+
};
|
|
18
|
+
componentDidCatch(_: Error, errorInfo: React.ErrorInfo): void;
|
|
19
|
+
onDoubleClick: () => void;
|
|
20
|
+
render(): string | number | boolean | React.ReactElement<any, string | React.JSXElementConstructor<any>> | React.ReactFragment | React.CElement<{
|
|
21
|
+
onlyRenderChild: boolean;
|
|
22
|
+
}, React.Component<{
|
|
23
|
+
onlyRenderChild: boolean;
|
|
24
|
+
}, any, any>> | null | undefined;
|
|
25
|
+
}
|
|
26
|
+
export default ErrorBoundary;
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import { CPage, CNode, CRootNode } from '@chamn/model';
|
|
2
|
+
import { ReactInstance } from 'react';
|
|
3
|
+
import { RefManager } from './refManager';
|
|
4
|
+
import { RenderInstance } from './type';
|
|
5
|
+
export type ContextType = {
|
|
6
|
+
params?: Record<any, any>;
|
|
7
|
+
globalState?: Record<any, any>;
|
|
8
|
+
updateGlobalState?: (newState: any) => void;
|
|
9
|
+
staticState?: Record<string | number, any>;
|
|
10
|
+
state?: Record<any, any>;
|
|
11
|
+
updateState?: (newState: any) => void;
|
|
12
|
+
refs?: RefManager;
|
|
13
|
+
loopData?: Record<any, any>;
|
|
14
|
+
stateManager?: Record<string, any>;
|
|
15
|
+
methods?: Record<string, (...arg: any) => any>;
|
|
16
|
+
thirdLibs?: Record<string, any>;
|
|
17
|
+
};
|
|
18
|
+
export type RuntimeRenderHelper = {
|
|
19
|
+
renderComponent: (node: CNode | CRootNode, options: {
|
|
20
|
+
$$context: ContextType;
|
|
21
|
+
idx?: number;
|
|
22
|
+
}) => any;
|
|
23
|
+
};
|
|
24
|
+
export type ComponentsType = Record<any, any>;
|
|
25
|
+
export type AdapterOptionType = {
|
|
26
|
+
libs: Record<string, any>;
|
|
27
|
+
components: ComponentsType;
|
|
28
|
+
$$context: ContextType;
|
|
29
|
+
onGetRef?: (ref: React.RefObject<React.ReactInstance>, nodeMode: CNode | CRootNode, instance: RenderInstance) => void;
|
|
30
|
+
onGetComponent?: (component: (...args: any) => any, currentNode: CNode | CRootNode) => void;
|
|
31
|
+
onComponentMount?: (instance: ReactInstance, node: CNode | CRootNode) => void;
|
|
32
|
+
onComponentDestroy?: (instance: ReactInstance, node: CNode | CRootNode) => void;
|
|
33
|
+
processNodeConfigHook?: (config: {
|
|
34
|
+
condition: boolean;
|
|
35
|
+
props: Record<string, any>;
|
|
36
|
+
}, node: CNode) => {
|
|
37
|
+
condition: boolean;
|
|
38
|
+
props: Record<string, any>;
|
|
39
|
+
};
|
|
40
|
+
renderMode?: 'design' | 'normal';
|
|
41
|
+
};
|
|
42
|
+
export interface AdapterType {
|
|
43
|
+
renderMode?: AdapterOptionType['renderMode'];
|
|
44
|
+
customPageRootRender?: (pageModel: CPage, options: AdapterOptionType) => any;
|
|
45
|
+
pageRender: (pageModel: CPage, options: AdapterOptionType) => any;
|
|
46
|
+
convertModelToComponent: (originalComponent: any, nodeModal: CNode | CRootNode, options: {
|
|
47
|
+
pageModel: CPage;
|
|
48
|
+
idx?: number;
|
|
49
|
+
} & AdapterOptionType) => any;
|
|
50
|
+
render: (originalComponent: any, props?: Record<any, any>, ...children: any[]) => any;
|
|
51
|
+
getComponent: (currentNode: CNode | CRootNode, components: ComponentsType) => void;
|
|
52
|
+
getContext: (data: Record<any, any>, ctx: ContextType | null) => ContextType;
|
|
53
|
+
getUtils: () => void;
|
|
54
|
+
getDataLink: () => void;
|
|
55
|
+
createDataLink: () => void;
|
|
56
|
+
transformProps: (originalProps: Record<any, any>, options: {
|
|
57
|
+
$$context: Record<any, any>;
|
|
58
|
+
}) => Record<any, any>;
|
|
59
|
+
transformData: () => void;
|
|
60
|
+
transformGlobalData: () => void;
|
|
61
|
+
errorCatch: () => void;
|
|
62
|
+
clear: () => void;
|
|
63
|
+
}
|
|
64
|
+
export declare const getAdapter: (defineAdapter: Partial<AdapterType>) => AdapterType;
|
|
@@ -0,0 +1,108 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { CNode, CPage, CRootNode } from '@chamn/model';
|
|
3
|
+
import { AdapterOptionType, ContextType } from './adapter';
|
|
4
|
+
import { StoreApi } from 'zustand/vanilla';
|
|
5
|
+
import { StoreManager } from './storeManager';
|
|
6
|
+
export declare class DefineReactAdapter {
|
|
7
|
+
renderMode: AdapterOptionType['renderMode'];
|
|
8
|
+
components: AdapterOptionType['components'];
|
|
9
|
+
storeManager: StoreManager;
|
|
10
|
+
runtimeComponentCache: Map<any, any>;
|
|
11
|
+
onGetRef?: AdapterOptionType['onGetRef'];
|
|
12
|
+
onGetComponent: AdapterOptionType['onGetComponent'];
|
|
13
|
+
onComponentMount: AdapterOptionType['onComponentMount'];
|
|
14
|
+
onComponentDestroy: AdapterOptionType['onComponentDestroy'];
|
|
15
|
+
processNodeConfigHook?: AdapterOptionType['processNodeConfigHook'];
|
|
16
|
+
getComponent(currentNode: CNode | CRootNode): any;
|
|
17
|
+
getContext(data?: ContextType, ctx?: ContextType | null): ContextType;
|
|
18
|
+
pageRender(pageModel: CPage, { components, onGetRef, $$context, onGetComponent, onComponentMount, onComponentDestroy, renderMode, processNodeConfigHook, }: AdapterOptionType): string | React.ReactElement<any, string | React.JSXElementConstructor<any>>;
|
|
19
|
+
transformProps(originalProps: Record<string, any> | undefined, { $$context: parentContext, }: {
|
|
20
|
+
$$context: ContextType;
|
|
21
|
+
}): Record<string, any>;
|
|
22
|
+
collectSpecialProps(originalProps: Record<string, unknown> | undefined, isValidate: (val: unknown) => boolean): {
|
|
23
|
+
keyPath: string[];
|
|
24
|
+
val: any;
|
|
25
|
+
}[];
|
|
26
|
+
convertModelToComponent(originalComponent: any, nodeModel: CNode | CRootNode): {
|
|
27
|
+
new (props: {
|
|
28
|
+
$$context: ContextType;
|
|
29
|
+
$$nodeModel: CNode | CRootNode;
|
|
30
|
+
}): {
|
|
31
|
+
_CONDITION: boolean;
|
|
32
|
+
_DESIGN_BOX: boolean;
|
|
33
|
+
_NODE_MODEL: CNode | CRootNode;
|
|
34
|
+
_NODE_ID: string;
|
|
35
|
+
UNIQUE_ID: string;
|
|
36
|
+
targetComponentRef: React.MutableRefObject<any>;
|
|
37
|
+
listenerHandle: (() => void)[];
|
|
38
|
+
storeState: StoreApi<any>;
|
|
39
|
+
staticState: Record<string, any>;
|
|
40
|
+
storeListenDisposeLint: (() => void)[];
|
|
41
|
+
domHeader: HTMLHeadElement | undefined;
|
|
42
|
+
mediaStyleDomMap: Record<string, HTMLStyleElement>;
|
|
43
|
+
updateState: (newState: any) => void;
|
|
44
|
+
connectStore(): void;
|
|
45
|
+
getStyleDomById: (id: string) => HTMLStyleElement;
|
|
46
|
+
addMediaCSS: () => void;
|
|
47
|
+
removeMediaCSS: () => void;
|
|
48
|
+
componentDidMount(): void;
|
|
49
|
+
rebuildNode: () => void;
|
|
50
|
+
componentWillUnmount(): void;
|
|
51
|
+
render(): React.ReactNode;
|
|
52
|
+
context: unknown;
|
|
53
|
+
setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<{
|
|
54
|
+
$$context: ContextType;
|
|
55
|
+
$$nodeModel: CNode | CRootNode;
|
|
56
|
+
}>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
|
|
57
|
+
forceUpdate(callback?: (() => void) | undefined): void;
|
|
58
|
+
readonly props: Readonly<{
|
|
59
|
+
$$context: ContextType;
|
|
60
|
+
$$nodeModel: CNode | CRootNode;
|
|
61
|
+
}>;
|
|
62
|
+
state: Readonly<{}>;
|
|
63
|
+
refs: {
|
|
64
|
+
[key: string]: React.ReactInstance;
|
|
65
|
+
};
|
|
66
|
+
shouldComponentUpdate?(nextProps: Readonly<{
|
|
67
|
+
$$context: ContextType;
|
|
68
|
+
$$nodeModel: CNode | CRootNode;
|
|
69
|
+
}>, nextState: Readonly<{}>, nextContext: any): boolean;
|
|
70
|
+
componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
|
|
71
|
+
getSnapshotBeforeUpdate?(prevProps: Readonly<{
|
|
72
|
+
$$context: ContextType;
|
|
73
|
+
$$nodeModel: CNode | CRootNode;
|
|
74
|
+
}>, prevState: Readonly<{}>): any;
|
|
75
|
+
componentDidUpdate?(prevProps: Readonly<{
|
|
76
|
+
$$context: ContextType;
|
|
77
|
+
$$nodeModel: CNode | CRootNode;
|
|
78
|
+
}>, prevState: Readonly<{}>, snapshot?: any): void;
|
|
79
|
+
componentWillMount?(): void;
|
|
80
|
+
UNSAFE_componentWillMount?(): void;
|
|
81
|
+
componentWillReceiveProps?(nextProps: Readonly<{
|
|
82
|
+
$$context: ContextType;
|
|
83
|
+
$$nodeModel: CNode | CRootNode;
|
|
84
|
+
}>, nextContext: any): void;
|
|
85
|
+
UNSAFE_componentWillReceiveProps?(nextProps: Readonly<{
|
|
86
|
+
$$context: ContextType;
|
|
87
|
+
$$nodeModel: CNode | CRootNode;
|
|
88
|
+
}>, nextContext: any): void;
|
|
89
|
+
componentWillUpdate?(nextProps: Readonly<{
|
|
90
|
+
$$context: ContextType;
|
|
91
|
+
$$nodeModel: CNode | CRootNode;
|
|
92
|
+
}>, nextState: Readonly<{}>, nextContext: any): void;
|
|
93
|
+
UNSAFE_componentWillUpdate?(nextProps: Readonly<{
|
|
94
|
+
$$context: ContextType;
|
|
95
|
+
$$nodeModel: CNode | CRootNode;
|
|
96
|
+
}>, nextState: Readonly<{}>, nextContext: any): void;
|
|
97
|
+
};
|
|
98
|
+
__CP_TYPE__: string;
|
|
99
|
+
contextType?: React.Context<any> | undefined;
|
|
100
|
+
};
|
|
101
|
+
buildComponent(node: CNode | CRootNode | string, { $$context, }: {
|
|
102
|
+
$$context: ContextType;
|
|
103
|
+
idx?: number;
|
|
104
|
+
}): string | React.ReactElement<any, string | React.JSXElementConstructor<any>> | undefined;
|
|
105
|
+
render(originalComponent: React.ComponentClass<any> | React.FunctionComponent | string, props?: Record<any, any>, ...children: React.ReactNode[]): string | React.ReactElement<any, string | React.JSXElementConstructor<any>>;
|
|
106
|
+
clear(): void;
|
|
107
|
+
}
|
|
108
|
+
export declare const ReactAdapter: import("./adapter").AdapterType;
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { CNode, CPage, CPageDataType, CRootNode } from '@chamn/model';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { RenderPropsType, Render, UseRenderReturnType } from './render';
|
|
4
|
+
import { RenderInstance } from './type';
|
|
5
|
+
export declare class ComponentInstanceManager {
|
|
6
|
+
private instanceMap;
|
|
7
|
+
get(id: string): RenderInstance[] | undefined;
|
|
8
|
+
add(id: string, handle: any): void;
|
|
9
|
+
remove(id: string, val?: any): void;
|
|
10
|
+
destroy(): void;
|
|
11
|
+
}
|
|
12
|
+
export type DesignRenderProp = Omit<RenderPropsType, 'ref' | 'render'> & {
|
|
13
|
+
ref?: React.MutableRefObject<DesignRender | null>;
|
|
14
|
+
render?: UseDesignRenderReturnType;
|
|
15
|
+
onMount?: (instance: DesignRender) => void;
|
|
16
|
+
dropPlaceholder?: React.ComponentClass<{
|
|
17
|
+
node: CNode | CRootNode;
|
|
18
|
+
}> | React.FunctionComponent<{
|
|
19
|
+
node: CNode | CRootNode;
|
|
20
|
+
}> | string;
|
|
21
|
+
};
|
|
22
|
+
export declare const DefaultDropPlaceholder: React.FC<{
|
|
23
|
+
node: CNode | CRootNode;
|
|
24
|
+
}>;
|
|
25
|
+
export declare class DesignRender extends React.Component<DesignRenderProp> {
|
|
26
|
+
instanceManager: ComponentInstanceManager;
|
|
27
|
+
renderRef: React.MutableRefObject<Render | null>;
|
|
28
|
+
dropPlaceholder: Required<DesignRenderProp>['dropPlaceholder'];
|
|
29
|
+
constructor(props: DesignRenderProp);
|
|
30
|
+
componentDidMount(): void;
|
|
31
|
+
getPageModel(): CPage | undefined;
|
|
32
|
+
onGetComponent: (comp: any, node: CNode | CRootNode) => React.ForwardRefExoticComponent<Omit<any, "ref"> & React.RefAttributes<unknown>>;
|
|
33
|
+
rerender(newPage?: CPageDataType | CPage): void | undefined;
|
|
34
|
+
getInstancesById(id: string, uniqueId?: string): RenderInstance[];
|
|
35
|
+
getInstanceByDom(el: HTMLHtmlElement | Element): RenderInstance | null;
|
|
36
|
+
getDomsById(id: string, selector?: string): HTMLElement[];
|
|
37
|
+
getDomRectById(id: string, selector?: string): DOMRect[];
|
|
38
|
+
render(): React.CElement<RenderPropsType, Render>;
|
|
39
|
+
}
|
|
40
|
+
export type UseDesignRenderReturnType = Pick<UseRenderReturnType, 'rerender'> & {
|
|
41
|
+
ref: React.MutableRefObject<DesignRender | null>;
|
|
42
|
+
getInstancesById: (id: string, uid?: string) => RenderInstance[];
|
|
43
|
+
getInstanceByDom: (dom: HTMLHtmlElement | Element) => RenderInstance | null;
|
|
44
|
+
getDomsById: (id: string, selector?: string) => HTMLElement[];
|
|
45
|
+
getDomRectById: (id: string, selector?: string) => DOMRect | DOMRect[];
|
|
46
|
+
};
|
|
47
|
+
export declare const useDesignRender: () => UseDesignRenderReturnType;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { CPage, CPageDataType } from '@chamn/model';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { AdapterOptionType, AdapterType } from './adapter';
|
|
4
|
+
import { RefManager } from './refManager';
|
|
5
|
+
import { RenderInstance } from './type';
|
|
6
|
+
export type RenderPropsType = {
|
|
7
|
+
page?: CPageDataType;
|
|
8
|
+
pageModel?: CPage;
|
|
9
|
+
adapter: AdapterType;
|
|
10
|
+
render?: UseRenderReturnType;
|
|
11
|
+
ref?: React.MutableRefObject<Render | null>;
|
|
12
|
+
renderMode?: 'design' | 'normal';
|
|
13
|
+
} & Partial<AdapterOptionType>;
|
|
14
|
+
export declare class Render extends React.Component<RenderPropsType, {
|
|
15
|
+
pageModel: CPage;
|
|
16
|
+
}> {
|
|
17
|
+
refManager: RefManager;
|
|
18
|
+
dynamicComponentInstanceMap: Map<string, RenderInstance>;
|
|
19
|
+
constructor(props: RenderPropsType);
|
|
20
|
+
getPageModel(): CPage;
|
|
21
|
+
componentDidMount(): void;
|
|
22
|
+
componentWillUnmount(): void;
|
|
23
|
+
onGetRef: AdapterOptionType['onGetRef'];
|
|
24
|
+
render(): any;
|
|
25
|
+
rerender: (newPage?: CPageDataType | CPage) => void;
|
|
26
|
+
}
|
|
27
|
+
export type UseRenderReturnType = {
|
|
28
|
+
ref: React.MutableRefObject<Render | null>;
|
|
29
|
+
rerender: (newPage: CPageDataType) => void;
|
|
30
|
+
};
|
|
31
|
+
export declare const useRender: () => UseRenderReturnType;
|
|
32
|
+
export * from './type';
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { StateCreator, StoreApi } from 'zustand/vanilla';
|
|
2
|
+
export declare class StoreManager {
|
|
3
|
+
storeMap: Map<string, StoreApi<any>>;
|
|
4
|
+
addStore(storeName: string, storeState: StateCreator<any>): StoreApi<any>;
|
|
5
|
+
setStore(storeName: string, store: StoreApi<any>): void;
|
|
6
|
+
removeStore(storeName: string): void;
|
|
7
|
+
getStore(storeName: string): StoreApi<any> | undefined;
|
|
8
|
+
connect<T extends Record<any, any> = any>(name: string, cb: (newState: T) => void): () => void;
|
|
9
|
+
getStateSnapshot(): Record<string, any>;
|
|
10
|
+
destroy(): void;
|
|
11
|
+
}
|