@snack-kit/core 0.1.0

package/dist/interface.d.ts

@@ -0,0 +1,416 @@
+import React from 'react';
+import Snack from './class/snack';
+import SnackVue from './class/snackVue';
+import { SnackSetting } from './class/snackSetting';
+import { SnackVueSetting } from './class/snackVueSetting';
+import { I18nData } from './utils/i18n';
+export interface ImportModules {
+    [type: string]: {
+        [name: string]: Snack | SnackVue | SnackSetting | SnackVueSetting;
+    };
+}
+export interface CoreConfig {
+    /**
+     * 是否 runtime 模式
+     */
+    runtime?: boolean;
+    /**
+     * runtime 模块名称映射对象
+     */
+    runtimeMapping?: {
+        [name: string]: string;
+    };
+    /**
+     * snack 服务端地址
+     */
+    service?: string;
+    /**
+     * snack模块 加载路径，默认 service + modPath
+     */
+    modUrl?: string;
+    /**
+     * snack模块 请求路径
+     */
+    modPath?: string;
+    /**
+     * 单独指定 cnd 请求域名地址，默认为 service + cdnPath
+     */
+    cdnUrl?: string;
+    /**
+     * cdn 请求路径
+     */
+    cdnPath?: string;
+    /**
+     * 设计器页面路径
+     */
+    pageUrl?: string;
+    /**
+     * 设计器页面路径
+     */
+    pagePath?: string;
+    /**
+     * 静态资源cdn路径
+     */
+    staticUrl?: string;
+    /**
+     * 引用包导入
+     */
+    importMaps?: {
+        [name: string]: any;
+    };
+    /**
+     * 导入sanck class，加载时候优先从该列表内查询
+     */
+    importModules?: ImportModules;
+    /**
+     * 基础模块分类名称
+     */
+    basicsType?: string;
+    /**
+     * FormAttr全局默认值配置，当组件内部缺少参数时，采用该定义数值
+     */
+    defaultFormAttr?: SnackFormAttribute;
+    /**
+     * i18n国际化数据复写
+     */
+    i18n?: I18nData;
+    /**
+     * 国际化语言Mapping转换关系
+     * 例，当国际化语言为zh时，取值时则以zh_CN:
+     * { "zh" : "zh_CN" }
+     */
+    localeMapping?: {
+        [locale: string]: string;
+    };
+    /**
+     * 默认国际化语言
+     * 当localeMapping或传入语言为找到时，则使用该语言
+     */
+    localeDefault?: string;
+    /**
+     * 消息提示对象由外部传入，用于evalJs使用
+     */
+    message?: {
+        [key: string]: any;
+    };
+    /**
+     * argv 环境变量对象
+     */
+    argv?: Record<string, string | boolean | number | null | undefined | any>;
+}
+export interface LoadModuleConfig extends CoreConfig {
+    /**
+     * 所需加载的模块列表，单个加载可以为对象
+     */
+    module: Array<ModuleConfig> | ModuleConfig;
+    /**
+     * Require 配置参数
+     */
+    config?: RequireConfig;
+}
+/**
+ * 通过模块名称加载模块方法配置
+ */
+export interface ModuleConfig {
+    /**
+     * 模块名称
+     */
+    name: string;
+    /**
+     * 模块分类，snack.json type属性
+     */
+    type?: string;
+    /**
+     * 是否同时加载setting模块
+     */
+    setting?: boolean;
+    /**
+     * 引用包导入
+     */
+    importMaps?: {
+        [name: string]: any;
+    };
+    /**
+     * Require 配置参数
+     */
+    config?: RequireConfig;
+}
+/**
+ * 通过模块URL加载模块方法配置
+ */
+export interface LoadModuleURLConfig {
+    /**
+     * snack 模块绝对路径
+     */
+    urls: string | Array<string>;
+    /**
+     * 模块cdn库地址
+     */
+    cdnUrl: string;
+    /**
+     * 静态资源cdn地址
+     */
+    staticUrl?: string;
+    /**
+     * 引用包导入
+     */
+    importMaps?: {
+        [name: string]: any;
+    };
+    /**
+     * Require 配置参数
+     */
+    config?: RequireConfig;
+}
+/**
+ * 放置容器下级对象
+ */
+export interface DropChildrenItem<P = any, D = any, M = any, S = any> {
+    /**
+     * 父级模块
+     */
+    parent?: P;
+    /**
+     * Drag 容器snack实例
+     */
+    D: D;
+    /**
+     * Drag 容器组件实例
+     */
+    DFC: React.FunctionComponent | null;
+    /**
+     * 主模块 snack实例
+     */
+    M: M;
+    /**
+     * 主模块 组件实例
+     */
+    MFC: React.FunctionComponent | null;
+    /**
+     * 设置模块 snack实例
+     */
+    S?: S;
+    /**
+     * 设置模块 组件实例
+     */
+    SFC?: React.FunctionComponent | null;
+}
+export interface LoadConfig {
+    /**
+     * snack 模块请求地址
+     */
+    url: string;
+    /**
+     * require 请求配置
+     */
+    config?: RequireConfig;
+    /**
+     * 引用包导入
+     */
+    importMaps?: {
+        [name: string]: any;
+    };
+}
+export interface RequireConfig {
+    /**
+     * 超时等待时间，默认 50s
+     */
+    waitSeconds?: string;
+    /**
+     * cdn 路径，默认'./'
+     */
+    baseUrl?: string;
+    /**
+     * 指定snack模块静态资源上下文，默认随snack js文件路径
+     */
+    staticUrl?: string;
+    paths?: {
+        [key: string]: any;
+    };
+    bundles?: {
+        [key: string]: any;
+    };
+    pkgs?: {
+        [key: string]: any;
+    };
+    shim?: {
+        [key: string]: any;
+    };
+    config?: {
+        [key: string]: any;
+    };
+}
+/**
+ * 表单校验规则
+ */
+export interface SnackFormVerifyRule {
+    /**
+     * 必须匹配条件，如果为true则整个规则组内无论是否有通过的条件都必定会提示错误，如果为false则整个规则组内有一条规则通过，本条规则则不会提示错误，
+     */
+    mustMatch: boolean;
+    /**
+     * 字段校验正则
+     */
+    regExp?: string;
+    /**
+     * 校验错误文本
+     */
+    erorText?: {
+        [lang: string]: string;
+    };
+}
+/**
+ * 表单组件属性
+ */
+export interface SnackFormAttribute {
+    /**
+     * 表单字段，默认''
+     */
+    field?: string;
+    /**
+     * 是否禁用,D、M都需要设置，默认false
+     */
+    disabled?: boolean;
+    /**
+     * 是否必填，校验时需要校验是否为空，默认false
+     */
+    required?: boolean;
+    /**
+     * 必填时，校验非空对象性，默认false
+     * */
+    notEmptyObject?: boolean;
+    /**
+     * 始终禁止提交该字段，组装json时过滤，默认false
+     */
+    noSubmit?: boolean;
+    /**
+     * 当组件被隐藏时则不提交该字段，同时字段校验也将忽略,默认true
+     */
+    hideNoSubmit?: boolean;
+    /**
+     * 是否对value进行tirm过滤，默认过滤，false禁止过滤
+     */
+    trimValue?: boolean;
+    /**
+     * 校验规则组
+     */
+    verifyRules?: SnackFormVerifyRule[];
+    /**
+     * 入参转换脚本
+     */
+    inFormatJS?: string;
+    /**
+     * 出参转换脚本
+     */
+    outFormatJS?: string;
+    /**
+     * 自定义校验脚本
+     */
+    verifyJS?: string;
+    /**
+     * 密码字段标记，为true时则将会在当前表单getData数据组装时候增加 @password: [f...] 字段对当前字段进行描述，默认true
+     */
+    passwordFlag?: boolean;
+    /**
+     * 校验触发事件,默认['onChange', 'onBlur']f
+     */
+    verifyOnEvents?: string[];
+    /**
+     * 校验防抖时间,默认 300ms
+     */
+    verifyASTime?: number;
+    /** 是否跳过校验规则列表 */
+    skipRegx?: boolean;
+}
+/**
+ * 页面数据结构
+ */
+export interface SnackPageData {
+    /**
+     * 页面唯一id
+     */
+    id: string;
+    /**
+     * 页面名称
+     */
+    name: string;
+    /**
+     * 页面分类
+     */
+    type?: string;
+    /**
+     * 页面描述
+     */
+    description?: string;
+    /**
+     * 页面内容 Base64.encode(Object<SnackPageContent>)
+     */
+    content: string | SnackPageContent;
+    [name: string]: any;
+}
+/**
+ * 页面内容结构
+ */
+export interface SnackPageContent {
+    /**
+     * 模块唯一id D.key
+     */
+    key?: string;
+    /** 是否是容器 */
+    isContainer?: boolean;
+    /**
+     * 模块(M)定义
+     */
+    module?: SnackPageContentModule;
+    /**
+     * 下级
+     */
+    children?: Array<SnackPageContent>;
+}
+export interface SnackPageContentModule {
+    /**
+     * 模块(D.data.module)id、全小写目录名
+     */
+    id: string;
+    /**
+     * 是否为页面模版
+     */
+    template: boolean;
+    /**
+     * 模块或页面的分类
+     */
+    type?: string | null;
+    /**
+     * 模块data数据
+     */
+    data?: {
+        /**
+         * Drag容器data数据
+         */
+        D: {
+            [name: string]: any;
+        };
+        /**
+         * 模块(M)data数据
+         */
+        M: {
+            value?: any;
+            formAttr?: SnackFormAttribute;
+            [name: string]: any;
+        };
+    };
+}
+export interface SnackEvent<S extends Snack = any> {
+    /**
+     * 事件名称
+     */
+    name: string;
+    /**
+     * 事件触发对象
+     */
+    target: S;
+    /**
+     * 事件数值
+     */
+    value?: any;
+}

package/dist/lib/require.d.ts

@@ -0,0 +1,5 @@
+export default function _default(global: any, importMaps: any): {
+    requirejs: (deps: any, callback: any, errback: any, optional: any) => any;
+    require: (deps: any, callback: any, errback: any, optional: any) => any;
+    define: (name: any, re: any, callback: any) => void;
+} | undefined;

package/dist/sdk/index.d.ts

@@ -0,0 +1,277 @@
+/**
+ * @author 刘佳
+ * @date 2021/8/31 7:29 下午
+ * @description 包含Core内核的额外增强功能SDK类
+ */
+import React from 'react';
+import Core from '../core';
+import { SnackPageData, SnackEvent, CoreConfig } from '../interface';
+import { DropOjb, CompleteEvent, SnackFormFields, SnackChildMaps } from './renderSnack';
+import Snack, { SnackData } from '../class/snack';
+import { SnackSetting } from '../class/snackSetting';
+import SnackVue from '../class/snackVue';
+import { SnackVueSetting } from '../class/snackVueSetting';
+export * from '../utils/evalJS';
+export interface SnackPageParams {
+    /**
+     * 页面id
+     */
+    id: string;
+    /**
+     * 页面分类
+     */
+    type?: string;
+}
+export interface RenderPageConfig {
+    /**
+     * 表单回填数据
+     */
+    data?: {
+        [key: string]: any;
+    };
+    /**
+     * 渲染规则
+     */
+    rules?: {
+        [key: string]: RenderPageRule;
+    };
+    /**
+     * root容器参数
+     */
+    rootProps?: {};
+    /**
+     * 页面事件对象
+     */
+    snackPageEvent?: SnackPageCompleteEvent;
+    /**
+     * 页面渲染完成事件
+     */
+    onComplete?: (e: SnackPageCompleteEvent, config?: SnackPageConfig) => void;
+}
+export interface RenderPageRule {
+    /**
+     * 字段名
+     */
+    key: string;
+    /**
+     * 字段名称
+     */
+    label: string;
+    /**
+     * 是否有隐藏该字段绑定的组件
+     */
+    hide?: boolean;
+    /**
+     * 是否禁用该字段绑定的组件
+     */
+    disabled?: boolean;
+}
+export interface SnackPageCompleteEvent extends CompleteEvent {
+    /**
+     * 清空表单数据填充
+     */
+    empty?: () => void;
+    /**
+     * 获取表单数据
+     * @param key 指定字段获取表单数据，不传则返回全量json
+     */
+    getData?: (key?: string) => any;
+    /**
+     * 设置表单数据
+     * @param kv    指定字段赋值或传入对象多个字段赋值
+     * @param value kv为对象时该参数将被忽略
+     */
+    setData?: (kv: string | {
+        [key: string]: any;
+    }, value?: any) => void;
+    /**
+     * 表单校验
+     * @param key 指定校验字段，不传则校验所有字段
+     */
+    verify?: (key?: string) => Promise<boolean>;
+    /**
+     * 页面内部事件回调方法
+     * @param e
+     */
+    snackEventCallback?: (e: SnackEvent) => void;
+    /**
+     * 页面销毁方法
+     */
+    destroy?: () => void;
+    /**
+     * 页面原始渲染数据
+     */
+    pageData?: SnackPageData | null;
+}
+export interface SnackCreateModule {
+    main?: typeof Snack;
+    name: string;
+    type: string;
+    setting?: boolean;
+}
+/**
+ * form 自定义脚本所需参数
+ */
+export interface FormDataFormatArgs {
+    fields: SnackFormFields;
+    childrenMaps: SnackChildMaps;
+    rules?: {
+        [key: string]: RenderPageRule;
+    };
+    verify?: (key?: string) => Promise<boolean>;
+    defaultData?: {
+        [key: string]: any;
+    };
+}
+export type SnackPageConfig = SnackPageParams | SnackPageParams[] | SnackPageData | SnackPageData[];
+export declare class SnackSDK extends Core {
+    constructor(config: CoreConfig);
+    /**
+     * 创建Snack模块实例
+     * @param snackClass Snack模块Class
+     * @param main 如果创建的是setting模块则需要传入main主模块Snack对象
+     * @param data
+     */
+    createModule<T extends Snack = any>({ main, name, type, setting }: SnackCreateModule, data?: SnackData): Promise<T | null>;
+    /**
+     * 渲染设计器页面
+     * @param params {SnackPageParams | SnackPageData} 页面加载参数 参数非法则创建空容器
+     * @param config {RenderPageConfig} 页面渲染参数
+     * @param root 根容器
+     * @param filter 过滤渲染组件列表
+     * @private
+     */
+    private createPage;
+    private verifyTimeout;
+    /**
+     * 渲染多个页面，当页面为表单时会过滤相同字段的表单组件
+     * @param params
+     * @param config
+     */
+    renderPage(params: SnackPageConfig, config?: RenderPageConfig): Promise<any>;
+    /**
+     * 卸载页面
+     * @private
+     */
+    destroy(event: SnackPageCompleteEvent | null, root: DropOjb | null): void;
+    /**
+     * 设置表单字段数据
+     * @param formatArag
+     * @param kv    所要设置的字段名，当value为空，key为对象则覆盖整个data对象
+     * @param value  所要设置的字段值
+     * @private
+     */
+    private formSetData;
+    /**
+     * 表单入参转换
+     * @param M
+     * @param verify
+     * @param fields
+     * @param defaultData
+     * @param childrenMaps
+     * @private
+     */
+    private formFormatValue;
+    /**
+     * 获取表单数据
+     * @param verify
+     * @param childrenMaps
+     * @param fields    表单字段对象
+     * @param defaultData
+     * @param key       指定获取字段值
+     * @private
+     */
+    private formGetData;
+    /**
+     * 表单校验
+     * @private
+     * @param formatArag
+     * @param key
+     * @param pageData
+     */
+    private formVerify;
+    /**
+     * 清空表单填充数据
+     * @param children
+     * @private
+     */
+    private formEmpty;
+    /**
+     * 格式化Form入参数据
+     * @param defaultData
+     * @param moduleData    组件初始化入参
+     * @param fields
+     * @private
+     */
+    private formatData;
+    /**
+     * 解码页面内容base64
+     * @param data
+     */
+    private pageContentDecode;
+    /**
+     * 获取页面数据
+     */
+    getPage(params: SnackPageParams): Promise<SnackPageData | null>;
+    /**
+     * 渲染设计器页面 - React FC组件
+     * @param params {SnackPageConfig}
+     * @param config {RenderPageConfig}
+     */
+    createPageComponent<T>(params: SnackPageConfig, config?: RenderPageConfig): Promise<React.FunctionComponent>;
+    /**
+     * 渲染页面到dom元素内
+     * @param el
+     * @param params
+     * @param config
+     */
+    createPageForElement<T>(el: HTMLElement, params: SnackPageConfig, config?: RenderPageConfig): Promise<DropOjb | null | undefined>;
+    /**
+     * 渲染模块 - React FC组件
+     * @param args  模块装载参数
+     * @param data 模块初始数据
+     */
+    createModuleComponent<T extends SnackData>(args: SnackCreateModule, data?: T): Promise<React.FunctionComponent>;
+    /**
+     * 渲染模块到dom元素内
+     * @param el    所要渲染模块的容器
+     * @param args  模块装载参数
+     * @param data  模块初始数据
+     */
+    createModuleForElement<T extends SnackData, S extends Snack = any>(el: HTMLElement, args: SnackCreateModule, data?: T): Promise<S | null>;
+    /**
+     * 通过模块Class渲染模块
+     * @param SnackClass    sanck 模块 Class
+     * @param data          snack对象参数
+     * @param main          如果为设置模块，传入主模块对象
+     */
+    createClassModule<T extends SnackData, S extends Snack | SnackSetting | SnackVue | SnackVueSetting>(SnackClass: S, data?: T, main?: Snack): S;
+    /**
+     * 通过模块Class渲染模块
+     * @param SnackClass    snack 模块 Class
+     * @param data          snack对象参数
+     * @param main          如果为设置模块，传入主模块对象
+     */
+    createClassModuleComponent<T extends SnackData, S extends Snack | SnackSetting | SnackVue | SnackVueSetting>(SnackClass: S, data?: T, main?: Snack): React.FunctionComponent;
+}
+export default SnackSDK;
+/**
+ * 设计器事件列表
+ * @param language {boolean} 当前语言*
+ */
+export declare const GetDefaultEvents: (language?: 'zh-CN' | 'en-US') => ({
+    name: string;
+    label: string;
+    default: boolean;
+    verify: boolean;
+} | {
+    name: string;
+    label: string;
+    default: boolean;
+    verify?: undefined;
+} | {
+    name: string;
+    label: string;
+    default?: undefined;
+    verify?: undefined;
+})[];