@gct-paas/core-web 0.1.4-dev.7 → 0.1.4-dev.9

package/es/components/base-button/base-button.vue3.mjs

@@ -0,0 +1,179 @@
+import { defineComponent, useCssVars, computed, resolveComponent, openBlock, createElementBlock, createVNode, normalizeClass, unref, withCtx, toDisplayString, createCommentVNode, createBlock, normalizeStyle } from 'vue';
+import { Modal } from 'ant-design-vue';
+import { debounce } from 'lodash-es';
+import { ButtonStyle, ButtonSize, t } from '@gct-paas/core';
+
+const _hoisted_1 = { class: "inline-block align-middle" };
+const _hoisted_2 = {
+  key: 0,
+  class: "btn-title gct-text-overflow whitespace-nowrap"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "base-button",
+  props: {
+    block: {
+      type: Boolean,
+      default: false
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    loading: {
+      type: Boolean,
+      default: false
+    },
+    title: {
+      type: String,
+      default: ""
+    },
+    size: {
+      type: String,
+      default: "default"
+    },
+    icon: {
+      type: String,
+      default: ""
+    },
+    type: {
+      type: String,
+      default: ""
+    },
+    hasIcon: {
+      type: Boolean,
+      default: false
+    },
+    hasText: {
+      type: Boolean,
+      default: true
+    },
+    danger: {
+      type: Boolean,
+      default: false
+    },
+    buttonStyle: {
+      type: String,
+      default: ""
+    },
+    i18nConfig: {
+      type: String,
+      default: ""
+    },
+    hidden: {
+      type: Boolean,
+      default: false
+    },
+    confirm: {
+      type: Boolean,
+      default: false
+    },
+    confirmText: {
+      type: String,
+      default: ""
+    },
+    enableCustomColor: {
+      type: Boolean,
+      default: false
+    },
+    backgroundColor: {
+      type: String,
+      default: ""
+    },
+    fontColor: {
+      type: String,
+      default: ""
+    }
+  },
+  emits: ["click"],
+  setup(__props, { emit: __emit }) {
+    useCssVars((_ctx) => ({
+      "v8d035854": props.fontColor,
+      "e376d652": props.backgroundColor,
+      "v4ee5fd6d": props.type === "primary" ? props.backgroundColor : "transparent"
+    }));
+    const props = __props;
+    const emit = __emit;
+    const getVertivalAlign = computed(() => {
+      if (!props.hasText) return "text-top";
+      else return "text-top";
+    });
+    const debonceClick = debounce(function() {
+      emit("click");
+    }, 300);
+    const clickEvent = async (evt) => {
+      const isAppRun = /\/web-render|\/web\/|web-single\/|dev-single\/|test-single\//.test(
+        location.pathname
+      );
+      let target = evt.target;
+      if (target.nodeName == "SPAN") {
+        target = target.parentNode;
+      }
+      target.blur();
+      if (props.confirm && isAppRun) {
+        await new Promise((res, rej) => {
+          Modal.confirm({
+            content: props.confirmText || t("sys.pageDesigner.confirmTodo"),
+            onOk() {
+              res("onOk");
+            },
+            onCancel() {
+              rej("onCancel");
+            }
+          });
+        });
+        emit("click");
+        return;
+      }
+      debonceClick();
+    };
+    return (_ctx, _cache) => {
+      const _component_IconNext = resolveComponent("IconNext");
+      const _component_a_button = resolveComponent("a-button");
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createVNode(_component_a_button, {
+          size: __props.size,
+          type: __props.type,
+          danger: __props.danger,
+          loading: __props.loading,
+          block: __props.block,
+          disabled: __props.disabled,
+          class: normalizeClass([
+            __props.enableCustomColor && __props.fontColor ? "btn-font-color" : "",
+            __props.enableCustomColor && __props.backgroundColor ? "btn-bg-style" : "",
+            { square: __props.buttonStyle === unref(ButtonStyle).SQUARE }
+          ]),
+          title: __props.title,
+          onClick: clickEvent
+        }, {
+          icon: withCtx(() => [
+            __props.hasIcon ? (openBlock(), createBlock(_component_IconNext, {
+              key: 0,
+              size: __props.buttonStyle === unref(ButtonStyle).SQUARE ? 20 : 16,
+              value: __props.icon,
+              style: normalizeStyle({
+                "--color": "inherit",
+                lineHeight: "1",
+                verticalAlign: getVertivalAlign.value
+              })
+            }, null, 8, ["size", "value", "style"])) : createCommentVNode("", true),
+            __props.icon && __props.hasText ? (openBlock(), createElementBlock("div", {
+              key: 1,
+              class: normalizeClass({
+                "h-6px": __props.hasIcon && __props.hasText && __props.buttonStyle === unref(ButtonStyle).SQUARE && __props.size !== unref(ButtonSize).SMALL,
+                "h-4px": __props.hasIcon && __props.hasText && __props.buttonStyle === unref(ButtonStyle).SQUARE && __props.size === unref(ButtonSize).SMALL,
+                "w-6px": __props.hasIcon && __props.hasText && __props.buttonStyle === unref(ButtonStyle).ORDINARY && __props.size !== unref(ButtonSize).SMALL,
+                "w-4px": __props.hasIcon && __props.hasText && __props.buttonStyle === unref(ButtonStyle).ORDINARY && __props.size === unref(ButtonSize).SMALL
+              })
+            }, null, 2)) : createCommentVNode("", true)
+          ]),
+          default: withCtx(() => [
+            __props.hasText ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(__props.hasText ? __props.title : ""), 1)) : createCommentVNode("", true)
+          ]),
+          _: 1
+        }, 8, ["size", "type", "danger", "loading", "block", "disabled", "class", "title"])
+      ]);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/es/components/basic-button/basic-button.css

@@ -0,0 +1,25 @@
+.square[data-v-1dbcb2fa] {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  min-width: 72px;
+  height: 72px;
+  padding: 0;
+}
+.squaref[data-v-1dbcb2fa] {
+  min-width: 72px;
+  height: 72px;
+  padding: 0;
+}
+.line[data-v-1dbcb2fa] {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+[data-v-1dbcb2fa] .group .ant-btn {
+  height: 100%;
+}
+[data-v-1dbcb2fa] .ant-btn-loading-icon {
+  height: 0;
+}

package/es/components/basic-button/basic-button.vue.d.ts

@@ -0,0 +1,100 @@
+import { PropType } from 'vue';
+import { ButtonStyle as buttonEnum, ButtonColorType } from '@gct-paas/core';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+        default?(_: {}): any;
+        icon?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    buttonType: {
+        type: PropType<ButtonColorType>;
+        default: string;
+    };
+    buttonTheme: {
+        type: StringConstructor;
+        default: string;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    loading: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    icon: {
+        type: StringConstructor;
+        default: string;
+    };
+    iconColor: {
+        type: StringConstructor;
+        default: string;
+    };
+    buttonStyle: {
+        type: PropType<buttonEnum>;
+        default: string;
+    };
+    dropdown: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    dropdown: (...args: any[]) => void;
+}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    buttonType: {
+        type: PropType<ButtonColorType>;
+        default: string;
+    };
+    buttonTheme: {
+        type: StringConstructor;
+        default: string;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    loading: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    icon: {
+        type: StringConstructor;
+        default: string;
+    };
+    iconColor: {
+        type: StringConstructor;
+        default: string;
+    };
+    buttonStyle: {
+        type: PropType<buttonEnum>;
+        default: string;
+    };
+    dropdown: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>> & Readonly<{
+    onDropdown?: ((...args: any[]) => any) | undefined;
+}>, {
+    loading: boolean;
+    disabled: boolean;
+    icon: string;
+    buttonStyle: buttonEnum;
+    dropdown: boolean;
+    buttonType: ButtonColorType;
+    buttonTheme: string;
+    iconColor: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/es/components/basic-button/basic-button.vue.mjs

@@ -0,0 +1,7 @@
+import _sfc_main from './basic-button.vue3.mjs';
+import './basic-button.css';/* empty css                   */
+import _export_sfc from '../../_virtual/_plugin-vue_export-helper.mjs';
+
+const basicButton = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-1dbcb2fa"]]);
+
+export { basicButton as default };

package/es/components/basic-button/basic-button.vue3.mjs

@@ -0,0 +1,130 @@
+import { defineComponent, computed, resolveComponent, openBlock, createElementBlock, normalizeClass, unref, createVNode, withCtx, createBlock, createCommentVNode, createElementVNode, renderSlot, withModifiers } from 'vue';
+import { ButtonStyle } from '@gct-paas/core';
+
+const _hoisted_1 = { class: "inline-block align-middle" };
+const _hoisted_2 = { class: "align-middle leading-none" };
+const _hoisted_3 = { class: "align-middle leading-none" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "basic-button",
+  props: {
+    buttonType: { type: String, default: "" },
+    buttonTheme: { type: String, default: "" },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    loading: {
+      type: Boolean,
+      default: false
+    },
+    icon: {
+      type: String,
+      default: ""
+    },
+    iconColor: { type: String, default: "" },
+    buttonStyle: { type: String, default: "" },
+    dropdown: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ["dropdown"],
+  setup(__props, { emit: __emit }) {
+    const emit = __emit;
+    const props = __props;
+    const getButtonClass = computed(() => {
+      const { buttonTheme, buttonStyle } = props;
+      const className = [`ant-btn-${buttonTheme}`];
+      if (buttonStyle === ButtonStyle.SQUARE) {
+        className.push("square");
+      } else {
+        className.push("line");
+      }
+      return className;
+    });
+    const getDropdownClass = computed(() => {
+      const { buttonTheme } = props;
+      return `ant-btn-${buttonTheme}`;
+    });
+    function handel() {
+      emit("dropdown");
+    }
+    return (_ctx, _cache) => {
+      const _component_IconNext = resolveComponent("IconNext");
+      const _component_a_button = resolveComponent("a-button");
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        __props.dropdown ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          class: normalizeClass(["inline-block ant-btn-group", __props.buttonStyle === unref(ButtonStyle).SQUARE ? "squaref group" : ""])
+        }, [
+          createVNode(_component_a_button, {
+            class: normalizeClass(getButtonClass.value),
+            disabled: __props.disabled,
+            type: __props.buttonType,
+            "ant-click-animating-without-extra-node": "false"
+          }, {
+            default: withCtx(() => [
+              __props.icon ? (openBlock(), createBlock(_component_IconNext, {
+                key: 0,
+                class: "align-middle",
+                value: __props.icon,
+                size: __props.buttonStyle === unref(ButtonStyle).SQUARE ? 20 : 14,
+                color: __props.iconColor
+              }, null, 8, ["value", "size", "color"])) : createCommentVNode("", true),
+              __props.icon ? (openBlock(), createElementBlock("div", {
+                key: 1,
+                class: normalizeClass({
+                  "inline-block w2px": __props.buttonStyle === unref(ButtonStyle).ORDINARY,
+                  "h-4px": __props.buttonStyle === unref(ButtonStyle).SQUARE
+                })
+              }, null, 2)) : createCommentVNode("", true),
+              createElementVNode("span", _hoisted_2, [
+                renderSlot(_ctx.$slots, "default", {}, void 0, true)
+              ])
+            ]),
+            _: 3
+          }, 8, ["class", "disabled", "type"]),
+          createVNode(_component_a_button, {
+            disabled: __props.disabled,
+            type: __props.buttonType,
+            class: normalizeClass(getDropdownClass.value),
+            onClick: withModifiers(handel, ["stop"])
+          }, {
+            icon: withCtx(() => [
+              renderSlot(_ctx.$slots, "icon", {}, void 0, true)
+            ]),
+            _: 3
+          }, 8, ["disabled", "type", "class"])
+        ], 2)) : (openBlock(), createBlock(_component_a_button, {
+          key: 1,
+          disabled: __props.disabled,
+          type: __props.buttonType,
+          class: normalizeClass(getButtonClass.value)
+        }, {
+          default: withCtx(() => [
+            __props.icon ? (openBlock(), createBlock(_component_IconNext, {
+              key: 0,
+              class: "align-middle",
+              value: __props.icon,
+              size: __props.buttonStyle === unref(ButtonStyle).SQUARE ? 20 : 14,
+              color: __props.iconColor
+            }, null, 8, ["value", "size", "color"])) : createCommentVNode("", true),
+            __props.icon ? (openBlock(), createElementBlock("div", {
+              key: 1,
+              class: normalizeClass({
+                "inline-block w3px": __props.buttonStyle === unref(ButtonStyle).ORDINARY,
+                "h-4px": __props.buttonStyle === unref(ButtonStyle).SQUARE
+              })
+            }, null, 2)) : createCommentVNode("", true),
+            createElementVNode("span", _hoisted_3, [
+              renderSlot(_ctx.$slots, "default", {}, void 0, true)
+            ])
+          ]),
+          _: 3
+        }, 8, ["disabled", "type", "class"]))
+      ]);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/es/components/code-editor/code-editor.css

@@ -0,0 +1,67 @@
+@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-code-editor {
+  height: 100%;
+}

package/es/components/code-editor/code-editor.d.ts

@@ -30,6 +30,6 @@ export declare const CodeEditor: import('vue').DefineComponent<import('vue').Ext
     "onUpdate:value"?: ((...args: any[]) => any) | undefined;
 }>, {
     value: string;
-    config: editor.IStandaloneEditorConstructionOptions;
     language: string;
+    config: editor.IStandaloneEditorConstructionOptions;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/es/components/code-editor/code-editor.mjs

@@ -1,15 +1,14 @@
 import { defineComponent, computed, ref, onMounted, onUnmounted, createVNode } from 'vue';
 import { useNamespace, deepMerge } from '@gct-paas/core';
 import loader from '@monaco-editor/loader';
-import './code-editor.scss';
+import './code-editor.css';/* empty css                  */
 
-"use strict";
 const CodeEditor = /* @__PURE__ */ defineComponent({
-  name: "CodeEditor",
+  name: 'CodeEditor',
   props: {
     value: {
       type: String,
-      default: ""
+      default: ''
     },
     config: {
       type: Object,
@@ -17,26 +16,26 @@ const CodeEditor = /* @__PURE__ */ defineComponent({
     },
     language: {
       type: String,
-      default: "typescript"
+      default: 'typescript'
     }
   },
-  emits: ["update:value"],
+  emits: ['update:value'],
   setup(props, {
     emit
   }) {
-    const ns = useNamespace("code-editor");
+    const ns = useNamespace('code-editor');
     const val = computed({
       get() {
-        return props.value || "";
+        return props.value || '';
       },
       set(v) {
-        emit("update:value", v);
+        emit('update:value', v);
       }
     });
     const el = ref(null);
     let monacoEditor = null;
     onMounted(() => {
-      loader.init().then((m) => {
+      loader.init().then(m => {
         if (el.value) {
           monacoEditor = m.editor.create(el.value, deepMerge({
             value: val.value,

package/es/components/index.d.ts

@@ -1,5 +1,15 @@
+import { App } from 'vue';
+import { default as SvgIcon } from './svg-icon/svg-icon.vue';
+import { AssetsSvgIcon } from './assets-svg-icon/assets-svg-icon';
+import { default as BaseButton } from './base-button/base-button.vue';
+import { default as BasicButton } from './basic-button/basic-button.vue';
+export { SvgIcon, AssetsSvgIcon, BaseButton, BasicButton };
 export { CodeEditor } from './code-editor/code-editor';
 export { FlexContainer } from './layout/flex-container/flex-container';
 export { FlexItem } from './layout/flex-item/flex-item';
 export { GridContainer } from './layout/grid-container/grid-container';
 export { ViewContainer } from './layout/view-container/view-container';
+declare const _default: {
+    install(app: App): void;
+};
+export default _default;

package/es/components/index.mjs

@@ -1,7 +1,22 @@
-export { CodeEditor } from './code-editor/code-editor.mjs';
-export { FlexContainer } from './layout/flex-container/flex-container.mjs';
-export { FlexItem } from './layout/flex-item/flex-item.mjs';
-export { GridContainer } from './layout/grid-container/grid-container.mjs';
-export { ViewContainer } from './layout/view-container/view-container.mjs';
+import _sfc_main from './svg-icon/svg-icon.vue.mjs';
+import './layout/view-container/view-container.css';import './layout/flex-container/flex-container.css';import './code-editor/code-editor.css';import './basic-button/basic-button.css';import './base-button/base-button.css';import './svg-icon/svg-icon.css';/* empty css                        */
+import { AssetsSvgIcon } from './assets-svg-icon/assets-svg-icon.mjs';
+import 'vue';
+import 'ant-design-vue';
+import 'lodash-es';
+import '@gct-paas/core';
+/* empty css                              */
+/* empty css                                */
+import '@monaco-editor/loader';
+/* empty css                              */
+/* empty css                                           */
+/* empty css                                           */
 
-"use strict";
+const Comps = {
+  install(app) {
+    app.component(AssetsSvgIcon.name, AssetsSvgIcon);
+    app.component(_sfc_main.name, _sfc_main);
+  }
+};
+
+export { AssetsSvgIcon, _sfc_main as SvgIcon, Comps as default };

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

@@ -0,0 +1,67 @@
+@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-flex-container {
+  display: flex;
+}