@gct-paas/core-web 0.1.4-dev.0 → 0.1.4-dev.10

package/es/components/layout/view-container/view-container.css

@@ -0,0 +1,83 @@
+@charset "UTF-8";
+/* stylelint-disable scss/no-global-function-names */
+/* bem('block', 'element', 'modifier') => 'ibiz-block__element--modifier' */
+/**
+ * 定义 Block 块
+ * @param {String} $block - Block 块名称
+ * @example
+ *   @include b('button') {
+ *     padding: 10px;
+ *   }
+ */
+/**
+ * 定义 Element 元素
+ * @param {String|List} $element - Element 元素名称，支持单个或多个
+ * @example
+ *   @include b('button') {
+ *     @include e('text') {
+ *       color: #000;
+ *     }
+ *   }
+ *   // 或传入多个元素
+ *   @include b('button') {
+ *     @include e(('text', 'icon')) {
+ *       margin: 5px;
+ *     }
+ *   }
+ */
+/**
+ * 定义 Modifier 修饰符
+ * @param {String|List} $modifier - Modifier 修饰符名称，支持单个或多个
+ * @example
+ *   @include b('button') {
+ *     @include m('primary') {
+ *       background: blue;
+ *     }
+ *   }
+ *   // 或传入多个修饰符
+ *   @include b('button') {
+ *     @include m(('primary', 'large')) {
+ *       background: blue;
+ *       font-size: 16px;
+ *     }
+ *   }
+ */
+/**
+ * 定义状态选择器
+ * @param {String} $state - 状态名称
+ * @example
+ *   @include b('button') {
+ *     @include when('disabled') {
+ *       opacity: 0.5;
+ *     }
+ *   }
+ */
+/**
+ * 深色主题样式
+ * @param {String} $block - Block 块名称
+ * @example
+ *   @include dark('button') {
+ *     background: #333;
+ *     color: #fff;
+ *   }
+ */
+/* stylelint-disable scss/no-global-function-names */
+.gct-view-container {
+  background-color: white;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
+.gct-view-container-header {
+  flex-shrink: 0;
+}
+
+.gct-view-container-content {
+  flex-grow: 1;
+  overflow: hidden auto;
+}
+
+.gct-view-container-footer {
+  flex-shrink: 0;
+}

package/es/components/layout/view-container/view-container.mjs

@@ -1,10 +1,9 @@
 import { defineComponent, createVNode } from 'vue';
 import { useNamespace } from '@gct-paas/core';
-import './view-container.scss';
+import './view-container.css';/* empty css                     */
 
-"use strict";
 const ViewContainer = /* @__PURE__ */ defineComponent({
-  name: "ViewContainer",
+  name: 'ViewContainer',
   props: {
     context: {
       type: Object
@@ -18,7 +17,7 @@ const ViewContainer = /* @__PURE__ */ defineComponent({
     }
   },
   setup() {
-    const ns = useNamespace("view-container");
+    const ns = useNamespace('view-container');
     return {
       ns
     };
@@ -27,11 +26,11 @@ const ViewContainer = /* @__PURE__ */ defineComponent({
     return createVNode("div", {
       "class": this.ns.b()
     }, [this.$slots.header ? createVNode("div", {
-      "class": this.ns.b("header")
+      "class": this.ns.b('header')
     }, [this.$slots.header()]) : null, createVNode("div", {
-      "class": this.ns.b("content")
+      "class": this.ns.b('content')
     }, [this.$slots.default?.()]), this.$slots.footer ? createVNode("div", {
-      "class": this.ns.b("footer")
+      "class": this.ns.b('footer')
     }, [this.$slots.footer()]) : null]);
   }
 });

package/es/components/svg-icon/svg-icon.css

@@ -0,0 +1,73 @@
+@charset "UTF-8";
+/* stylelint-disable scss/no-global-function-names */
+/* bem('block', 'element', 'modifier') => 'ibiz-block__element--modifier' */
+/**
+ * 定义 Block 块
+ * @param {String} $block - Block 块名称
+ * @example
+ *   @include b('button') {
+ *     padding: 10px;
+ *   }
+ */
+/**
+ * 定义 Element 元素
+ * @param {String|List} $element - Element 元素名称，支持单个或多个
+ * @example
+ *   @include b('button') {
+ *     @include e('text') {
+ *       color: #000;
+ *     }
+ *   }
+ *   // 或传入多个元素
+ *   @include b('button') {
+ *     @include e(('text', 'icon')) {
+ *       margin: 5px;
+ *     }
+ *   }
+ */
+/**
+ * 定义 Modifier 修饰符
+ * @param {String|List} $modifier - Modifier 修饰符名称，支持单个或多个
+ * @example
+ *   @include b('button') {
+ *     @include m('primary') {
+ *       background: blue;
+ *     }
+ *   }
+ *   // 或传入多个修饰符
+ *   @include b('button') {
+ *     @include m(('primary', 'large')) {
+ *       background: blue;
+ *       font-size: 16px;
+ *     }
+ *   }
+ */
+/**
+ * 定义状态选择器
+ * @param {String} $state - 状态名称
+ * @example
+ *   @include b('button') {
+ *     @include when('disabled') {
+ *       opacity: 0.5;
+ *     }
+ *   }
+ */
+/**
+ * 深色主题样式
+ * @param {String} $block - Block 块名称
+ * @example
+ *   @include dark('button') {
+ *     background: #333;
+ *     color: #fff;
+ *   }
+ */
+/* stylelint-disable scss/no-global-function-names */
+.gct-svg-icon {
+  display: inline-block;
+  overflow: hidden;
+  fill: currentcolor;
+  vertical-align: -0.15em;
+}
+.gct-svg-icon--spin {
+  animation: loadingCircle 1s infinite linear;
+}

package/es/components/svg-icon/svg-icon.vue.d.ts

@@ -0,0 +1,40 @@
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    prefix: {
+        type: StringConstructor;
+        default: string;
+    };
+    name: {
+        type: StringConstructor;
+        required: true;
+    };
+    size: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: number;
+    };
+    spin: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    prefix: {
+        type: StringConstructor;
+        default: string;
+    };
+    name: {
+        type: StringConstructor;
+        required: true;
+    };
+    size: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: number;
+    };
+    spin: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{}>, {
+    size: string | number;
+    spin: boolean;
+    prefix: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, SVGSVGElement>;
+export default _default;

package/es/components/svg-icon/svg-icon.vue.mjs

@@ -0,0 +1,50 @@
+import { defineComponent, computed, openBlock, createElementBlock, normalizeStyle, normalizeClass, unref, createElementVNode } from 'vue';
+import { useNamespace } from '@gct-paas/core';
+
+const _hoisted_1 = ["xlink:href"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "svg-icon",
+  props: {
+    prefix: {
+      type: String,
+      default: "icon"
+    },
+    name: {
+      type: String,
+      required: true
+    },
+    size: {
+      type: [Number, String],
+      default: 16
+    },
+    spin: {
+      type: Boolean,
+      default: false
+    }
+  },
+  setup(__props) {
+    const ns = useNamespace("svg-icon");
+    const props = __props;
+    const symbolId = computed(() => `#${props.prefix}-${props.name}`);
+    const getStyle = computed(() => {
+      const { size } = props;
+      let s = `${size}`;
+      s = `${s.replace("px", "")}px`;
+      return {
+        width: s,
+        height: s
+      };
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("svg", {
+        class: normalizeClass([_ctx.$attrs.class, unref(ns).b(), __props.spin && unref(ns).m("spin")]),
+        style: normalizeStyle(getStyle.value),
+        "aria-hidden": "true"
+      }, [
+        createElementVNode("use", { "xlink:href": symbolId.value }, null, 8, _hoisted_1)
+      ], 6);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/es/components/svg-icon/svg-icon.vue3.mjs

@@ -0,0 +1,6 @@
+import _sfc_main from './svg-icon.vue.mjs';
+import './svg-icon.css';/* empty css               */
+
+
+
+export { _sfc_main as default };

package/es/components/wujie-container/wujie-container.css

@@ -0,0 +1,74 @@
+@charset "UTF-8";
+/* stylelint-disable scss/no-global-function-names */
+/* bem('block', 'element', 'modifier') => 'ibiz-block__element--modifier' */
+/**
+ * 定义 Block 块
+ * @param {String} $block - Block 块名称
+ * @example
+ *   @include b('button') {
+ *     padding: 10px;
+ *   }
+ */
+/**
+ * 定义 Element 元素
+ * @param {String|List} $element - Element 元素名称，支持单个或多个
+ * @example
+ *   @include b('button') {
+ *     @include e('text') {
+ *       color: #000;
+ *     }
+ *   }
+ *   // 或传入多个元素
+ *   @include b('button') {
+ *     @include e(('text', 'icon')) {
+ *       margin: 5px;
+ *     }
+ *   }
+ */
+/**
+ * 定义 Modifier 修饰符
+ * @param {String|List} $modifier - Modifier 修饰符名称，支持单个或多个
+ * @example
+ *   @include b('button') {
+ *     @include m('primary') {
+ *       background: blue;
+ *     }
+ *   }
+ *   // 或传入多个修饰符
+ *   @include b('button') {
+ *     @include m(('primary', 'large')) {
+ *       background: blue;
+ *       font-size: 16px;
+ *     }
+ *   }
+ */
+/**
+ * 定义状态选择器
+ * @param {String} $state - 状态名称
+ * @example
+ *   @include b('button') {
+ *     @include when('disabled') {
+ *       opacity: 0.5;
+ *     }
+ *   }
+ */
+/**
+ * 深色主题样式
+ * @param {String} $block - Block 块名称
+ * @example
+ *   @include dark('button') {
+ *     background: #333;
+ *     color: #fff;
+ *   }
+ */
+/* stylelint-disable scss/no-global-function-names */
+.gct-wujie-container {
+  height: 100%;
+  width: 100%;
+}
+.gct-wujie-container .__vue-devtools-container__ {
+  display: none;
+}
+.gct-wujie-container iframe {
+  border: 0;
+}

package/es/components/wujie-container/wujie-container.d.ts

@@ -0,0 +1,11 @@
+export declare const WuJieContainer: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    wuJieName: {
+        type: StringConstructor;
+        required: true;
+    };
+}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    wuJieName: {
+        type: StringConstructor;
+        required: true;
+    };
+}>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/es/components/wujie-container/wujie-container.mjs

@@ -0,0 +1,84 @@
+import { defineComponent, useAttrs, computed, onUnmounted, createVNode, resolveComponent, mergeProps } from 'vue';
+import { useNamespace, useUserStore, getToken } from '@gct-paas/core';
+import WujieVue3 from 'wujie-vue3';
+import './wujie-container.css';/* empty css                      */
+
+const {
+  destroyApp
+} = WujieVue3;
+const WuJieContainer = /* @__PURE__ */ defineComponent({
+  name: 'WuJieContainer',
+  props: {
+    wuJieName: {
+      type: String,
+      required: true
+    }
+  },
+  setup(props) {
+    const ns = useNamespace('wujie-container');
+    const attr = useAttrs();
+
+    // 加载脚本之前
+    function beforeLoad(win) {
+      Object.defineProperty(win, 'pSystem', {
+        get: () => {
+          return window.System;
+        }
+      });
+      Object.defineProperty(win, '_gct', {
+        get: () => {
+          return window._gct;
+        }
+      });
+      Object.defineProperty(win, '_api', {
+        get: () => {
+          return window._api;
+        }
+      });
+    }
+
+    // 加载脚本之后
+    function beforeMount(win) {
+      console.debug('beforeMount System', win.System);
+      console.debug('beforeMount _gct', win._gct);
+      console.debug('beforeMount _api', win._api);
+    }
+
+    // 加载脚本失败
+    function loadError(win) {
+      console.debug('loadError', win.System);
+    }
+    const {
+      userInfo
+    } = useUserStore();
+    const token = getToken();
+    const _props = computed(() => {
+      return {
+        appInfo: _gct.store.appInfo,
+        userInfo: userInfo,
+        token,
+        ...(attr.props ?? {})
+      };
+    });
+    onUnmounted(() => {
+      // 如果是 alive 模式，则不销毁应用
+      if (attr.alive === true) {
+        return;
+      }
+      destroyApp(props.wuJieName);
+    });
+    return () => {
+      return createVNode(resolveComponent("wujieVue"), mergeProps({
+        "class": ns.b(),
+        "name": props.wuJieName,
+        "beforeLoad": beforeLoad,
+        "beforeMount": beforeMount,
+        "loadError": loadError
+      }, attr, {
+        "props": _props.value
+      }), null);
+    };
+  }
+});
+
+export { WuJieContainer };

package/es/create-app-vue.d.ts

@@ -0,0 +1,9 @@
+import { App } from 'vue';
+/**
+ * 核心 Web 库的外部使用注册，在创建 app 时调用
+ *
+ * @export
+ * @param {App} app
+ * @return {*}  {Promise<void>}
+ */
+export declare function coreWebCreateAppVue(app: App): Promise<void>;

package/es/create-app-vue.mjs

@@ -0,0 +1,17 @@
+import { OverlayScrollbarsComponent } from 'overlayscrollbars-vue';
+import Comps from './components/index.mjs';
+import * as Icons from '@ant-design/icons-vue';
+import { setupDirectives } from './directives/index.mjs';
+import ColorPicker from './modules/color-picker/src/ColorPicker.vue.mjs';
+
+async function coreWebCreateAppVue(app) {
+  setupDirectives(app);
+  app.use(Comps);
+  Object.entries(Icons).forEach(([key, component]) => {
+    app.component(key, component);
+  });
+  app.component(ColorPicker.name, ColorPicker);
+  app.component(OverlayScrollbarsComponent.__name, OverlayScrollbarsComponent);
+}
+
+export { coreWebCreateAppVue };

package/es/directives/drag-resize.d.ts

@@ -0,0 +1,4 @@
+import { App, Directive } from 'vue';
+declare const dragResizeDirective: Directive;
+export declare function setupDragResizeDirective(app: App): void;
+export default dragResizeDirective;

package/es/directives/drag-resize.mjs

@@ -0,0 +1,42 @@
+const dragResizeDirective = {
+  mounted(el, binding) {
+    if (!binding.value) return false;
+    binding.instance?.$nextTick(() => {
+      const minWidth = binding.value;
+      const dragDom = el;
+      const resizeElL = document.createElement("div");
+      dragDom.appendChild(resizeElL);
+      resizeElL.style.cursor = "col-resize";
+      resizeElL.style.position = "absolute";
+      resizeElL.style.height = "100%";
+      resizeElL.style.width = "5px";
+      resizeElL.style.right = "0px";
+      resizeElL.style.top = "0px";
+      resizeElL.style.background = "rgba(255, 0, 0, 0);";
+      resizeElL.onmousedown = (e) => {
+        const elW = dragDom.clientWidth;
+        const clientX = e.clientX;
+        document.onmousemove = function(e2) {
+          e2.preventDefault();
+          const l = e2.clientX - clientX;
+          let nw = elW + l;
+          nw = nw < minWidth ? minWidth : nw;
+          dragDom.setAttribute("style", `width:${nw}px !important;`);
+          const resizeEvent = new CustomEvent("drag-resize-width", {
+            detail: { width: nw, resizing: true }
+          });
+          el.dispatchEvent(resizeEvent);
+        };
+        document.onmouseup = function() {
+          document.onmousemove = null;
+          document.onmouseup = null;
+        };
+      };
+    });
+  }
+};
+function setupDragResizeDirective(app) {
+  app.directive("dragResize", dragResizeDirective);
+}
+
+export { setupDragResizeDirective };

package/es/directives/index.d.ts

@@ -0,0 +1,8 @@
+import { App } from 'vue';
+/**
+ * 注册全局通用指令
+ *
+ * @export
+ * @param {App} app
+ */
+export declare function setupDirectives(app: App): void;

package/es/directives/index.mjs

@@ -0,0 +1,9 @@
+import { setupDragResizeDirective } from './drag-resize.mjs';
+import { setupLoadingDirective } from './target-loading.mjs';
+
+function setupDirectives(app) {
+  setupDragResizeDirective(app);
+  setupLoadingDirective(app);
+}
+
+export { setupDirectives };

package/es/directives/target-loading.d.ts

@@ -0,0 +1,4 @@
+import { Directive, App } from 'vue';
+declare const loadingDirective: Directive;
+export declare function setupLoadingDirective(app: App): void;
+export default loadingDirective;

package/es/directives/target-loading.mjs

@@ -0,0 +1,40 @@
+import '../modules/target-loading/src/target-loading.vue.mjs';
+import '../modules/target-loading/src/target-loading.css';/* empty css                                                 */
+import 'vue';
+import { createLoading } from '../modules/target-loading/src/createLoading.mjs';
+
+const loadingDirective = {
+  mounted(el, binding) {
+    const tip = el.getAttribute("loading-tip");
+    const background = el.getAttribute("loading-background");
+    const size = el.getAttribute("loading-size");
+    const fullscreen = !!binding.modifiers.fullscreen;
+    const instance = createLoading(
+      {
+        tip,
+        background,
+        size: size || "large",
+        loading: !!binding.value,
+        absolute: !fullscreen
+      },
+      fullscreen ? document.body : el
+    );
+    el.instance = instance;
+  },
+  updated(el, binding) {
+    const instance = el.instance;
+    if (!instance) return;
+    instance.setTip(el.getAttribute("loading-tip"));
+    if (binding.oldValue !== binding.value) {
+      instance.setLoading?.(binding.value && !instance.loading);
+    }
+  },
+  unmounted(el) {
+    el?.instance?.close();
+  }
+};
+function setupLoadingDirective(app) {
+  app.directive("target-loading", loadingDirective);
+}
+
+export { setupLoadingDirective };

package/es/editor/gct-form-check-switch/gct-form-check-switch.d.ts

@@ -19,7 +19,7 @@ export declare const GctFormCheckSwitch: import('vue').DefineComponent<import('v
 }>, {
     ns: import('@gct-paas/core').Namespace;
     c: EditorController<ICheckSwitchEditor>;
-    val: import('vue').WritableComputedRef<any, any> | null;
+    val: import('vue').WritableComputedRef<any, any>;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "update:value"[], "update:value", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     itemModel: {
         type: PropType<IFormItem>;

package/es/editor/gct-form-i18n/gct-form-i18n.d.ts

@@ -15,7 +15,7 @@ export declare const GctFormI18n: import('vue').DefineComponent<import('vue').Ex
     };
 }>, {
     ns: import('@gct-paas/core').Namespace;
-    val: import('vue').WritableComputedRef<any, any> | null;
+    val: import('vue').WritableComputedRef<any, any>;
     i18nConfigValue: import('vue').WritableComputedRef<any, any>;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "update:value"[], "update:value", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     c: {

package/es/editor/gct-form-info/gct-form-info.d.ts

@@ -11,7 +11,7 @@ export declare const GctFormInfo: import('vue').DefineComponent<import('vue').Ex
     };
 }>, {
     ns: import('@gct-paas/core').Namespace;
-    val: import('vue').WritableComputedRef<any, any> | null;
+    val: import('vue').WritableComputedRef<any, any>;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "update:value"[], "update:value", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     value: {
         type: StringConstructor;

package/es/editor/gct-form-length-unit/gct-form-length-unit.d.ts

@@ -19,7 +19,7 @@ export declare const GctFormLengthUnit: import('vue').DefineComponent<import('vu
 }>, {
     ns: import('@gct-paas/core').Namespace;
     c: LengthUnitEditorController;
-    val: import('vue').WritableComputedRef<any, any> | null;
+    val: import('vue').WritableComputedRef<any, any>;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "update:value"[], "update:value", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     itemModel: {
         type: PropType<IFormItem>;

package/es/editor/gct-form-number/gct-form-number.d.ts

@@ -11,7 +11,7 @@ export declare const GctFormNumber: import('vue').DefineComponent<import('vue').
     };
 }>, {
     ns: import('@gct-paas/core').Namespace;
-    val: import('vue').WritableComputedRef<any, any> | null;
+    val: import('vue').WritableComputedRef<any, any>;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "update:value"[], "update:value", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     model: {
         type: PropType<INumberEditor>;

package/es/editor/gct-form-radio/gct-form-radio.d.ts

@@ -15,7 +15,7 @@ export declare const GctFormRadio: import('vue').DefineComponent<import('vue').E
     };
 }>, {
     ns: import('@gct-paas/core').Namespace;
-    val: import('vue').WritableComputedRef<any, any> | null;
+    val: import('vue').WritableComputedRef<any, any>;
 }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "update:value"[], "update:value", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     c: {
         type: PropType<IFormItemController>;