@gx-design-vue/pro-utils 0.1.4 → 0.2.0-alpha.1

package/dist/vue/index.js

@@ -0,0 +1,3 @@
+import { filterEmpty, getKeys, getSlot, getSlotVNode, getSlotsChildren, getSlotsProps, isEmptyElement, slotRender } from "./slots.js";
+
+export { filterEmpty, getKeys, getSlot, getSlotVNode, getSlotsChildren, getSlotsProps, isEmptyElement, slotRender };

package/dist/vue/slots.d.ts

@@ -0,0 +1,56 @@
+import { CustomRender, WithFalse } from "../typing.js";
+import * as vue0 from "vue";
+import { VNode } from "vue";
+
+//#region src/vue/slots.d.ts
+type SlotsPropsResult<S extends object, K extends keyof S, R extends boolean, D = any> = { [P in K]: R extends true ? D extends undefined ? WithFalse<CustomRender> : CustomRender : D extends undefined ? (S[P] | false) : CustomRender };
+type RenderResult<S extends object, K extends keyof S, R extends boolean, D = any> = R extends true ? D extends undefined ? WithFalse<CustomRender> : CustomRender : D extends undefined ? (S[K] | false) : CustomRender;
+declare function getKeys(keys: string | string[]): string;
+declare function isEmptyElement(c: any): boolean;
+declare function getSlotsChildren<T extends object = Record<string, any>>(slots: T, key: keyof T): VNode[];
+declare function filterEmpty(vnode?: any, isEmpty?: boolean): VNode<vue0.RendererNode, vue0.RendererElement, {
+  [key: string]: any;
+}>[];
+declare function slotRender({
+  vnode,
+  defaultVNode
+}: {
+  vnode: any;
+  defaultVNode?: any;
+}, ...arg: any): any;
+declare function getSlot<S extends object, K extends keyof S = keyof S, R extends boolean = false>(options: {
+  slots: S;
+  props: Record<string, any>;
+  key: K;
+  render?: R;
+  defaultChildren?: undefined;
+}, ...arg: any): RenderResult<S, K, R, undefined>;
+declare function getSlot<S extends object, K extends keyof S = keyof S, R extends boolean = false>(options: {
+  slots: S;
+  props: Record<string, any>;
+  key: K;
+  render?: R;
+  defaultChildren: any;
+}, ...arg: any): RenderResult<S, K, R>;
+declare function getSlotVNode<S extends object, K extends keyof S = keyof S>(options: {
+  slots: S;
+  props: Record<string, any>;
+  key: K;
+  defaultChildren?: any;
+}, ...arg: any): WithFalse<CustomRender>;
+declare function getSlotsProps<S extends object, K extends keyof S = keyof S, R extends boolean = false>(options: {
+  slots: S;
+  props: Record<string, any>;
+  keys: K[];
+  render?: R;
+  defaultVNodes?: undefined;
+}, ...arg: any): SlotsPropsResult<S, K, R, undefined>;
+declare function getSlotsProps<S extends object, K extends keyof S = keyof S, R extends boolean = false>(options: {
+  slots: S;
+  props: Record<string, any>;
+  keys: K[];
+  render?: R;
+  defaultVNodes?: any;
+}, ...arg: any): SlotsPropsResult<S, K, R>;
+//#endregion
+export { RenderResult, SlotsPropsResult, filterEmpty, getKeys, getSlot, getSlotVNode, getSlotsChildren, getSlotsProps, isEmptyElement, slotRender };

package/dist/vue/slots.js

@@ -0,0 +1,89 @@
+import { isBoolean, isObject } from "../is/type.js";
+import { isValid } from "../is/valid.js";
+import "../is/index.js";
+import { Comment, Fragment, isVNode } from "vue";
+
+//#region src/vue/slots.ts
+function getKeys(keys) {
+	if (typeof keys !== "string" && !Array.isArray(keys)) return;
+	return Array.isArray(keys) ? keys[keys.length - 1] : keys.split(":")?.slice(-1)[0];
+}
+function isEmptyElement(c) {
+	return c && (c.type === Comment || c.type === Fragment && c.children.length === 0 || c.type === Text && c.children.trim() === "");
+}
+function getSlotsChildren(slots, key) {
+	return filterEmpty(typeof slots[key] === "function" ? slots[key]?.() : []);
+}
+function filterEmpty(vnode = [], isEmpty = true) {
+	const temp = Array.isArray(vnode) ? vnode : [vnode];
+	const children = [];
+	temp.forEach((child) => {
+		if (Array.isArray(child)) children.push(...filterEmpty(child, isEmpty));
+		else if (child?.type === Fragment || child?.type === "template") children.push(...filterEmpty(child.children, isEmpty));
+		else if (child && isVNode(child)) {
+			if (isEmpty && !isEmptyElement(child)) children.push(child);
+			else if (!isEmpty) children.push(child);
+		} else if (isValid(child)) children.push(child);
+	});
+	return children;
+}
+function slotRender({ vnode, defaultVNode }, ...arg) {
+	return vnode === false ? null : typeof vnode === "function" ? vnode?.(...arg) : vnode || defaultVNode;
+}
+function getSlot(options, ...arg) {
+	const { slots, key = "default", render, props, defaultChildren } = options;
+	let result;
+	const value = props[key];
+	const slotsValue = slots?.[key];
+	const defaultVNode = typeof defaultChildren === "function" ? defaultChildren?.() : defaultChildren;
+	if (value === false) result = false;
+	else if (value === true) result = slotsValue ?? defaultVNode;
+	else if (isObject(value)) if (render) if (isVNode(value)) result = value;
+	else result = slotsValue;
+	else result = value || slotsValue;
+	else result = value || slotsValue;
+	return result === false ? false : render ? slotRender({
+		vnode: result,
+		defaultVNode
+	}, ...arg) : result;
+}
+function getSlotVNode(options, ...arg) {
+	const { slots, key = "default", props, defaultChildren } = options;
+	let result;
+	const value = props[key];
+	const slotsValue = slots?.[key]?.(...arg);
+	const defaultVNode = typeof defaultChildren === "function" ? defaultChildren?.() : defaultChildren;
+	if (value === false) result = false;
+	else if (value === true) result = slotsValue ?? defaultVNode;
+	else if (isObject(value)) if (isVNode(value)) result = value;
+	else result = slotsValue;
+	else result = value || slotsValue;
+	return result === false ? false : slotRender({
+		vnode: result,
+		defaultVNode
+	}, ...arg);
+}
+function getSlotsProps(options, ...arg) {
+	const { slots, props, keys, render, defaultVNodes } = options;
+	const renderMap = {};
+	keys.forEach((key, index) => {
+		const defaultChildren = defaultVNodes ? defaultVNodes[index] : null;
+		const slotComponents = render ? getSlotVNode({
+			slots,
+			props,
+			key,
+			defaultChildren
+		}, ...arg) : getSlot({
+			slots,
+			props,
+			key,
+			render: false,
+			defaultChildren
+		}, ...arg);
+		if (isBoolean(slotComponents) || slotComponents) renderMap[key] = slotComponents;
+	});
+	return renderMap;
+}
+
+//#endregion
+export { filterEmpty, getKeys, getSlot, getSlotVNode, getSlotsChildren, getSlotsProps, isEmptyElement, slotRender };

package/package.json

@@ -1,72 +1,53 @@
 {
   "name": "@gx-design-vue/pro-utils",
-  "version": "0.1.4",
-  "scripts": {
-    "dev": "vite",
-    "build": "vite build",
-    "types": "vue-tsc --declaration --emitDeclarationOnly",
-    "preview": "vite preview --port 5050",
-    "test:unit": "vitest --environment jsdom",
-    "typecheck": "vue-tsc --noEmit && vue-tsc --noEmit -p tsconfig.vitest.json --composite false",
-    "lint": "TIMING=1 eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore"
+  "type": "module",
+  "version": "0.2.0-alpha.1",
+  "description": "Gx Design Pro Utils",
+  "author": {
+    "name": "gx12358",
+    "email": "gx12358@gmail.com",
+    "url": "https://github.com/gx12358"
+  },
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/gx12358/pro-components-next.git",
+    "directory": "packages/pro-utils"
   },
-  "files": [
-    "dist"
-  ],
-  "types": "./dist",
-  "main": "./dist/pro-utils.umd.js",
-  "module": "./dist/pro-utils.es.js",
   "exports": {
     ".": {
-      "import": "./dist/pro-utils.es.js",
-      "require": "./dist/pro-utils.umd.js"
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
     },
-    "./dist/style.css": "./dist/style.css",
-    "./dist/style.less": "./dist/style.less",
-    "./dist/proUtils.less": "./dist/proUtils.less",
-    "./dist/components/FieldLabel/index.less": "./dist/components/FieldLabel/index.less",
-    "./dist/components/LabelIconTip/index.less": "./dist/components/LabelIconTip/index.less"
-  },
-  "dependencies": {
-    "@vueuse/core": "^9.10.0",
-    "ant-design-vue": "^3.2.17",
-    "dayjs": "^1.11.0",
-    "lodash-es": "^4.17.21",
-    "vue": "^3.2.45",
-    "vue-types": "^4.1.1"
+    "./dist/*": {
+      "types": "./dist/*.d.ts",
+      "import": "./dist/*.js",
+      "default": "./dist/*.js"
+    },
+    "./package.json": "./package.json"
   },
-  "devDependencies": {
-    "@shared/vite-plugin-less-copy": "workspace:^0.0.0",
-    "@rollup/plugin-typescript": "^8.3.0",
-    "@rushstack/eslint-patch": "^1.1.0",
-    "@types/lodash-es": "^4.17.6",
-    "@types/jsdom": "^16.2.14",
-    "@types/node": "^16.11.26",
-    "@vitejs/plugin-vue": "^2.3.1",
-    "@vitejs/plugin-vue-jsx": "^1.3.10",
-    "@vue/eslint-config-prettier": "^7.0.0",
-    "@vue/eslint-config-typescript": "^10.0.0",
-    "@vue/tsconfig": "^0.1.3",
-    "eslint": "^8.13.0",
-    "eslint-plugin-prettier": "^4.0.0",
-    "eslint-plugin-vue": "^8.6.0",
-    "jsdom": "^19.0.0",
-    "less": "^4.1.2",
-    "postcss": "^8.4.12",
-    "postcss-html": "^1.4.1",
-    "postcss-less": "^6.0.0",
-    "prettier": "^2.6.2",
-    "rollup": "^2.70.2",
-    "stylelint": "^14.7.1",
-    "stylelint-config-prettier": "^9.0.3",
-    "stylelint-config-recommended": "^7.0.0",
-    "stylelint-config-recommended-vue": "^1.4.0",
-    "stylelint-config-standard": "^25.0.0",
-    "stylelint-order": "^5.0.0",
-    "typescript": "^4.6.4",
-    "vite": "^2.9.14",
-    "vue-eslint-parser": "^9.0.3",
-    "vue-tsc": "^1.0.24"
+  "unpkg": "dist/pro-utils.js",
+  "jsdelivr": "dist/pro-utils.js",
+  "files": [
+    "dist",
+    "package.json"
+  ],
+  "peerDependencies": {
+    "vue": ">=3.2.0"
   },
-  "description": "Gx Design"
-}
+  "browserslist": [
+    "> 1%",
+    "not ie 11",
+    "not op_mini all"
+  ],
+  "scripts": {
+    "test": "vitest run",
+    "build": "run-s build:esm build:vite:parallel",
+    "build:esm": "tsdown",
+    "build:vite:parallel": "run-p build:umd build:full-esm",
+    "build:full-esm": "vite build --config ./vite.esm.config.ts",
+    "build:umd": "vite build",
+    "prepublish": "pnpm build"
+  }
+}

package/dist/classNames/index.d.ts

@@ -1,2 +0,0 @@
-declare function classNames(...args: any[]): string;
-export default classNames;

package/dist/components/FieldLabel/index.d.ts

@@ -1,77 +0,0 @@
-import type { CSSProperties, PropType } from 'vue';
-import type { SizeType, VueNode } from '../../typings';
-import './index.less';
-export type FieldLabelProps = {
-    label?: VueNode;
-    value?: any;
-    disabled?: boolean;
-    onClear?: () => void;
-    size?: SizeType;
-    ellipsis?: boolean;
-    placeholder?: VueNode;
-    expanded?: boolean;
-    id?: string;
-    class?: string;
-    formatter?: (value: any) => VueNode;
-    style?: CSSProperties;
-    bordered?: boolean;
-    allowClear?: boolean;
-    /**
-     * 点击标签的事件，用来唤醒 down menu 状态
-     */
-    onLabelClick?: () => void;
-};
-declare const FieldLabel: import("vue").DefineComponent<{
-    id: import("vue-types").VueTypeValidableDef<string> & {
-        default: string;
-    };
-    style: import("vue-types").VueTypeValidableDef<CSSProperties>;
-    size: {
-        type: PropType<SizeType>;
-        default: string;
-    };
-    label: PropType<VueNode>;
-    placeholder: PropType<VueNode>;
-    class: PropType<string>;
-    ellipsis: PropType<boolean>;
-    allowClear: {
-        type: PropType<boolean>;
-        default: boolean;
-    };
-    bordered: PropType<boolean>;
-    expanded: PropType<boolean>;
-    disabled: PropType<boolean>;
-    onClear: PropType<() => void>;
-    onLabelClick: PropType<() => void>;
-    formatter: PropType<((value: any) => VueNode) | undefined>;
-    value: import("vue-types").VueTypeValidableDef<any>;
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    id: import("vue-types").VueTypeValidableDef<string> & {
-        default: string;
-    };
-    style: import("vue-types").VueTypeValidableDef<CSSProperties>;
-    size: {
-        type: PropType<SizeType>;
-        default: string;
-    };
-    label: PropType<VueNode>;
-    placeholder: PropType<VueNode>;
-    class: PropType<string>;
-    ellipsis: PropType<boolean>;
-    allowClear: {
-        type: PropType<boolean>;
-        default: boolean;
-    };
-    bordered: PropType<boolean>;
-    expanded: PropType<boolean>;
-    disabled: PropType<boolean>;
-    onClear: PropType<() => void>;
-    onLabelClick: PropType<() => void>;
-    formatter: PropType<((value: any) => VueNode) | undefined>;
-    value: import("vue-types").VueTypeValidableDef<any>;
-}>>, {
-    id: string;
-    size: SizeType;
-    allowClear: boolean;
-}>;
-export default FieldLabel;

package/dist/components/FieldLabel/index.less

@@ -1,107 +0,0 @@
-@import '../../design/config.less';
-@import '../../design/ant-design-theme.less';
-
-@pro-core-field-label: ~'@{gx-prefix}-pro-core-field-label';
-
-.@{pro-core-field-label} {
-  display: inline-flex;
-  gap: 4px;
-  align-items: center;
-  height: 30px;
-  padding-block: 0;
-  padding-inline: 8px;
-  font-size: 14px;
-  line-height: 30px;
-  border-radius: 2px;
-  cursor: pointer;
-
-  &:hover {
-    background-color: fade(@black, 6%);
-  }
-
-  &-active {
-    padding: 0 12px;
-    background-color: fade(@black, 6%);
-
-    &.@{pro-core-field-label}-allow-clear:hover:not(.@{pro-core-field-label}-disabled) {
-      .@{pro-core-field-label}-arrow {
-        display: none;
-      }
-
-      .@{pro-core-field-label}-close {
-        display: inline-flex;
-      }
-    }
-  }
-
-  .@{pro-core-field-label}-icon {
-    height: 12px;
-    padding-block: 1px;
-    padding-inline: 1px;
-    color:  fade(@black, 45%);
-    font-size: 12px;
-    vertical-align: middle;
-
-    &.@{pro-core-field-label}-close {
-      display: none;
-      height: 14px;
-      align-items: center;
-      justify-content: center;
-      width: 14px;
-      color: #ffffff;
-      font-size: 8px;
-      background-color:  fade(@black, 25%);
-      border-radius: 50%;
-
-      &:hover {
-        color:  fade(@black, 45%);
-      }
-    }
-  }
-
-  &-disabled {
-    color:  fade(@black, 25%);
-    cursor: not-allowed;
-
-    .@{pro-core-field-label}-icon {
-      color:  fade(@black, 25%);
-    }
-  }
-
-  &-small {
-    height: 24px;
-    padding: 0 4px;
-    font-size: @font-size-sm;
-    line-height: 24px;
-
-    &.@{pro-core-field-label}-active {
-      padding: 0 8px;
-    }
-
-    .@{pro-core-field-label}-icon {
-      padding: 0;
-    }
-
-    .@{pro-core-field-label}-close {
-      padding: 3px;
-      margin-top: -2px;
-      font-size: 6px;
-    }
-  }
-
-  &-bordered {
-    height: 32px;
-    padding: 0 12px;
-    border: @border-width-base solid #d9d9d9;
-    border-radius: @border-radius-base;
-  }
-
-  &-bordered&-small {
-    height: 24px;
-    padding: 0 8px;
-  }
-
-  &-bordered&-active {
-    background-color: @white;
-  }
-}

package/dist/components/LabelIconTip/index.d.ts

@@ -1,20 +0,0 @@
-import type { FunctionalComponent, VueElement } from 'vue';
-import { type TooltipProps } from 'ant-design-vue';
-import type { VueNode } from '../../typings';
-import './index.less';
-export type WrapperTooltipProps = TooltipProps & {
-    icon?: VueElement;
-};
-export type LabelTooltipType = WrapperTooltipProps | VueNode;
-/**
- * 在 form 的 label 后面增加一个 tips 来展示一些说明文案
- *
- * @param props
- */
-declare const LabelIconTip: FunctionalComponent<{
-    label: VueNode;
-    subTitle?: VueNode;
-    tooltip?: string | LabelTooltipType;
-    ellipsis?: boolean;
-}>;
-export default LabelIconTip;

package/dist/components/LabelIconTip/index.less

@@ -1,38 +0,0 @@
-@import '../../design/config.less';
-@import '../../design/ant-design-theme.less';
-
-@root-entry-name: 'default';
-
-@pro-core-label-tip: ~'@{gx-prefix-pro}-core-label-tip';
-
-.@{pro-core-label-tip} {
-  display: inline-flex;
-  align-items: center;
-  max-width: 100%;
-
-  &-icon {
-    display: block;
-    margin-left: 4px;
-    cursor: pointer;
-  }
-
-  &-title {
-    display: inline-flex;
-    flex: 1;
-  }
-
-  &-subtitle {
-    margin-left: 8px;
-    color: @text-color-secondary;
-    font-weight: normal;
-    font-size: @font-size-base;
-    white-space: nowrap;
-  }
-
-  &-title-ellipsis {
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    word-break: keep-all;
-  }
-}

package/dist/design/ant-design-theme.less

@@ -1,4 +0,0 @@
-@root-entry-name: default;
-
-@import 'ant-design-vue/es/style/themes/default.less';
-@import 'ant-design-vue/es/style/core/index.less';

package/dist/design/ant-design-vue.less

@@ -1 +0,0 @@
-@import 'ant-design-vue/es/tooltip/style/index.less';

package/dist/design/config.less

@@ -1,2 +0,0 @@
-@gx-prefix: gx;
-@gx-prefix-pro: ~'@{gx-prefix}-pro';

package/dist/isBrowser/index.d.ts

@@ -1 +0,0 @@
-export declare const isBrowser: () => boolean;

package/dist/isDeepEqualReact/index.d.ts

@@ -1 +0,0 @@
-export declare function isDeepEqualReact(a: any, b: any, ignoreKeys?: string[], debug?: boolean): boolean;

package/dist/isServer.d.ts

@@ -1,2 +0,0 @@
-declare const _default: boolean;
-export default _default;

package/dist/omitBoolean/index.d.ts

@@ -1,6 +0,0 @@
-/**
- * 剔除 boolean 值
- * @param  {boolean|T} obj
- * @returns T
- */
-export declare const omitBoolean: <T>(obj: boolean | T) => T | undefined;

package/dist/omitUndefined/index.d.ts

@@ -1,5 +0,0 @@
-type OmitUndefined<T> = {
-    [P in keyof T]: NonNullable<T[P]>;
-};
-export declare const omitUndefined: <T>(obj: T) => OmitUndefined<T>;
-export {};