@fangzhongya/icons 0.0.51 → 0.0.53

package/dist/humpToLine-gLzuzWOm.cjs

@@ -0,0 +1,30 @@
+//#region node_modules/.pnpm/@fangzhongya+utils@0.0.82/node_modules/@fangzhongya/utils/dist/name/humpToLine.js
+/**
+* 驼峰命名转 - 方式
+* @param { string } name 要转换的字符串
+* @returns { string } 转换后字符串
+*/
+function humpToLine(name) {
+	const reg = /(([A-Z])([^A-Z]*))/g;
+	let result;
+	const arr = [];
+	let i = 0;
+	while ((result = reg.exec(name)) !== null) {
+		if (i == 0 && result.index != 0) arr.push(name.substring(0, result.index));
+		i++;
+		arr.push(result[1].toLowerCase());
+	}
+	if (arr.length == 0) return name;
+	else {
+		let a = arr.join("-");
+		a = a.replace(/[-]{2,}/g, "-");
+		return a;
+	}
+}
+//#endregion
+Object.defineProperty(exports, "humpToLine", {
+	enumerable: true,
+	get: function() {
+		return humpToLine;
+	}
+});

package/dist/icon/index.cjs

@@ -1,13 +1,229 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});
-
-
-var _chunkU4CNUH3Acjs = require('../chunk-U4CNUH3A.cjs');
-require('../chunk-YW7CKAOG.cjs');
-require('../chunk-3376ZTRC.cjs');
-require('../chunk-IIVF4KK5.cjs');
-require('../chunk-XHXN5JNR.cjs');
-require('../chunk-75ZPJI57.cjs');
-
-
-
-exports.Icon = _chunkU4CNUH3Acjs.Icon; exports.default = _chunkU4CNUH3Acjs.icon_default;
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
+const require_config = require("../config.cjs");
+const require_humpToLine = require("../humpToLine-gLzuzWOm.cjs");
+const require_util = require("../util.cjs");
+let vue = require("vue");
+//#region packages/icon/index.ts
+const reg = /<svg([^>]*)>((.|\n|\r|\t)*)<\/svg>/g;
+const reg1 = /<path([^>]*)>((.|\n|\r|\t)*)<\/path>/g;
+const reg2 = /<g([^>]*)>((.|\n|\r|\t)*)<\/g>/g;
+const prefix = require_humpToLine.humpToLine(require_config.defaultPrefix) + "-";
+const className = "icon";
+const directory = "/svg";
+const isImg = (name) => {
+	if (name) {
+		if (name.startsWith("data:") || name.startsWith("/") || name.startsWith("./") || name.startsWith("../") || name.includes("://")) return true;
+	}
+	return false;
+};
+const contStyle = {
+	border: 0,
+	display: "inline-flex",
+	"align-items": "center",
+	"object-fit": "contain",
+	"justify-content": "center",
+	"font-size": "inherit",
+	width: "inherit",
+	height: "inherit"
+};
+const svgStyle = {
+	"--color": "inherit",
+	height: "1em",
+	width: "1em",
+	"line-height": "1em",
+	display: "inline-flex",
+	"justify-content": "center",
+	"align-items": "center",
+	position: "relative",
+	fill: "currentColor",
+	color: "var(--color)",
+	"font-size": "inherit"
+};
+const component = (0, vue.defineComponent)({
+	name: "Icon",
+	props: {
+		/**
+		* @props { String, Object } name= ( )
+		* 图标名称
+		*/
+		name: {
+			type: [String, Object],
+			default: ""
+		},
+		/**
+		* @props { String} iconClass= ( )
+		* 图标样式名称
+		*/
+		iconClass: { type: String },
+		color: { type: String },
+		/**
+		* @props { String} type= ( 'css' | 'id' | 'img' | 'font' | 'str' | 'com' )
+		* 图标类型
+		*/
+		type: { type: String },
+		/**
+		* @props { String, Number } size= ( )
+		* 图标大小
+		*/
+		size: { type: [String, Number] },
+		/**
+		* @props { String } flip='' ( 'horizontal' | 'vertical' | 'both' | '' )
+		* 图标方向
+		*/
+		flip: {
+			type: String,
+			default: ""
+		},
+		/**
+		* @props { Number } rotate=0
+		* 图标旋转角度
+		*/
+		rotate: {
+			type: Number,
+			default: 0
+		},
+		default: { type: String },
+		directory: {
+			type: String,
+			default: directory
+		},
+		prefix: {
+			type: String,
+			default: prefix
+		}
+	},
+	setup(props, { slots }) {
+		const outputType = (0, vue.computed)(() => {
+			if (props.type) return props.type;
+			else {
+				const name = props.name || "";
+				if (typeof name == "object") return "vue";
+				else if (reg.test(name) || reg1.test(name) || reg2.test(name)) return "svg";
+				else if (isImg(name)) return "img";
+				return props.default;
+			}
+		});
+		const setPrefix = (name) => {
+			name = require_humpToLine.humpToLine(name);
+			if (name.startsWith(props.prefix)) return name;
+			else return props.prefix + name;
+		};
+		const transformStyle = (0, vue.computed)(() => {
+			const style = [];
+			if (props.flip !== "") switch (props.flip) {
+				case "horizontal":
+					style.push("rotateY(180deg)");
+					break;
+				case "vertical":
+					style.push("rotateX(180deg)");
+					break;
+				case "both":
+					style.push("rotateX(180deg)", "rotateY(180deg)");
+					break;
+			}
+			if (props.rotate !== 0) style.push(`rotate(${props.rotate % 360}deg)`);
+			const styleObj = { ...svgStyle };
+			styleObj.transform = style.join(" ");
+			if (props.color) styleObj.color = props.color;
+			if (props.size) {
+				let s = props.size;
+				if (typeof s == "number") s = s + "px";
+				styleObj.width = s;
+				styleObj.height = s;
+				styleObj["font-size"] = s;
+			}
+			return styleObj;
+		});
+		const outputName = (0, vue.computed)(() => {
+			const name = props.name;
+			if (typeof name == "string") switch (outputType.value) {
+				case "svg":
+					const rs = reg.exec(name);
+					const rs1 = reg1.exec(name) || reg2.exec(name);
+					if (rs && rs.length > 0) return rs[1];
+					else if (rs1 && rs1.length > 0) return rs1[0];
+					else return name;
+				case "css": return setPrefix(name);
+				case "id": return setPrefix(name);
+				case "font": return setPrefix(name);
+				default: return name;
+			}
+			return name;
+		});
+		const dom = (0, vue.computed)(() => {
+			if (!outputName.value) return;
+			else if (outputType.value === "pub") {
+				const src = props.directory + "/" + outputName.value + ".svg";
+				return (0, vue.h)("img", {
+					class: [props.iconClass],
+					style: contStyle,
+					src
+				});
+			} else if (outputType.value === "css" || outputType.value === "font") return (0, vue.h)("i", {
+				class: [props.iconClass, outputName.value],
+				style: contStyle
+			});
+			else if (outputType.value === "img") return (0, vue.h)("img", {
+				class: [props.iconClass],
+				style: contStyle,
+				src: outputName.value
+			});
+			else if (outputType.value === "svg") {
+				let v;
+				let viewBox;
+				if (typeof outputName.value === "string") {
+					v = outputName.value;
+					viewBox = "0 0 1024 1024";
+				} else {
+					v = outputName.value?.body;
+					viewBox = `${outputName.value?.left || 0} ${outputName.value?.top || 0} ${outputName.value?.width || 1024} ${outputName.value?.height || 1024}`;
+				}
+				return (0, vue.h)("svg", {
+					class: [props.iconClass],
+					style: contStyle,
+					viewBox,
+					xmlns: "http://www.w3.org/2000/svg",
+					innerHTML: v
+				});
+			} else if (outputType.value === "id") return (0, vue.h)("svg", {
+				class: [props.iconClass],
+				style: contStyle,
+				"aria-hidden": true
+			}, (0, vue.h)("use", { "xlink:href": "#" + outputName.value }));
+			else if (outputType.value === "vue") if (typeof outputName.value == "string") return (0, vue.h)((0, vue.resolveComponent)(outputName.value), {
+				class: [props.iconClass],
+				style: contStyle
+			});
+			else return (0, vue.h)(outputName.value, {
+				class: [props.iconClass],
+				style: contStyle
+			});
+			else if (typeof outputName.value == "string") {
+				const m = setPrefix(outputName.value);
+				const v = (0, vue.resolveComponent)(m);
+				if (typeof v == "string") return (0, vue.h)("i", {
+					class: [props.iconClass, m],
+					style: contStyle
+				});
+				else return (0, vue.h)(v, {
+					class: [props.iconClass],
+					style: contStyle
+				});
+			} else return (0, vue.h)(outputName.value, {
+				class: [props.iconClass],
+				style: contStyle
+			});
+		});
+		return () => (0, vue.h)("span", {
+			class: [className],
+			style: transformStyle.value
+		}, Object.keys(slots).length > 0 ? slots : dom.value);
+	}
+});
+const Icon = require_util.withInstall(component, "FangIcon");
+//#endregion
+exports.Icon = Icon;
+exports.default = Icon;

package/dist/icon/index.d.cts

@@ -1,136 +1,136 @@
-import { SFCWithInstall } from '../util.cjs';
-import * as vue from 'vue';
+import { SFCWithInstall } from "../util.cjs";
 
+//#region packages/icon/index.d.ts
 type Flip = 'horizontal' | 'vertical' | 'both' | '';
 type IconType = 'css' | 'id' | 'img' | 'font' | 'svg' | 'vue' | 'pub';
-declare const Icon: SFCWithInstall<vue.DefineComponent<vue.ExtractPropTypes<{
-    /**
-     * @props { String, Object } name= ( )
-     * 图标名称
-     */
-    name: {
-        type: (StringConstructor | ObjectConstructor)[];
-        default: string;
-    };
-    /**
-     * @props { String} iconClass= ( )
-     * 图标样式名称
-     */
-    iconClass: {
-        type: StringConstructor;
-    };
-    color: {
-        type: StringConstructor;
-    };
-    /**
-     * @props { String} type= ( 'css' | 'id' | 'img' | 'font' | 'str' | 'com' )
-     * 图标类型
-     */
-    type: {
-        type: () => IconType;
-    };
-    /**
-     * @props { String, Number } size= ( )
-     * 图标大小
-     */
-    size: {
-        type: (StringConstructor | NumberConstructor)[];
-    };
-    /**
-     * @props { String } flip='' ( 'horizontal' | 'vertical' | 'both' | '' )
-     * 图标方向
-     */
-    flip: {
-        type: () => Flip;
-        default: string;
-    };
-    /**
-     * @props { Number } rotate=0
-     * 图标旋转角度
-     */
-    rotate: {
-        type: NumberConstructor;
-        default: number;
-    };
-    default: {
-        type: StringConstructor;
-    };
-    directory: {
-        type: StringConstructor;
-        default: string;
-    };
-    prefix: {
-        type: StringConstructor;
-        default: string;
-    };
-}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
-    [key: string]: any;
-}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
-    /**
-     * @props { String, Object } name= ( )
-     * 图标名称
-     */
-    name: {
-        type: (StringConstructor | ObjectConstructor)[];
-        default: string;
-    };
-    /**
-     * @props { String} iconClass= ( )
-     * 图标样式名称
-     */
-    iconClass: {
-        type: StringConstructor;
-    };
-    color: {
-        type: StringConstructor;
-    };
-    /**
-     * @props { String} type= ( 'css' | 'id' | 'img' | 'font' | 'str' | 'com' )
-     * 图标类型
-     */
-    type: {
-        type: () => IconType;
-    };
-    /**
-     * @props { String, Number } size= ( )
-     * 图标大小
-     */
-    size: {
-        type: (StringConstructor | NumberConstructor)[];
-    };
-    /**
-     * @props { String } flip='' ( 'horizontal' | 'vertical' | 'both' | '' )
-     * 图标方向
-     */
-    flip: {
-        type: () => Flip;
-        default: string;
-    };
-    /**
-     * @props { Number } rotate=0
-     * 图标旋转角度
-     */
-    rotate: {
-        type: NumberConstructor;
-        default: number;
-    };
-    default: {
-        type: StringConstructor;
-    };
-    directory: {
-        type: StringConstructor;
-        default: string;
-    };
-    prefix: {
-        type: StringConstructor;
-        default: string;
-    };
+declare const Icon: SFCWithInstall<import("vue").DefineComponent<globalThis.ExtractPropTypes<{
+  /**
+   * @props { String, Object } name= ( )
+   * 图标名称
+   */
+  name: {
+    type: (ObjectConstructor | StringConstructor)[];
+    default: string;
+  };
+  /**
+   * @props { String} iconClass= ( )
+   * 图标样式名称
+   */
+  iconClass: {
+    type: StringConstructor;
+  };
+  color: {
+    type: StringConstructor;
+  };
+  /**
+   * @props { String} type= ( 'css' | 'id' | 'img' | 'font' | 'str' | 'com' )
+   * 图标类型
+   */
+  type: {
+    type: () => IconType;
+  };
+  /**
+   * @props { String, Number } size= ( )
+   * 图标大小
+   */
+  size: {
+    type: (StringConstructor | NumberConstructor)[];
+  };
+  /**
+   * @props { String } flip='' ( 'horizontal' | 'vertical' | 'both' | '' )
+   * 图标方向
+   */
+  flip: {
+    type: () => Flip;
+    default: string;
+  };
+  /**
+   * @props { Number } rotate=0
+   * 图标旋转角度
+   */
+  rotate: {
+    type: NumberConstructor;
+    default: number;
+  };
+  default: {
+    type: StringConstructor;
+  };
+  directory: {
+    type: StringConstructor;
+    default: string;
+  };
+  prefix: {
+    type: StringConstructor;
+    default: string;
+  };
+}>, () => globalThis.VNode<import("vue").RendererNode, import("vue").RendererElement, {
+  [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<globalThis.ExtractPropTypes<{
+  /**
+   * @props { String, Object } name= ( )
+   * 图标名称
+   */
+  name: {
+    type: (ObjectConstructor | StringConstructor)[];
+    default: string;
+  };
+  /**
+   * @props { String} iconClass= ( )
+   * 图标样式名称
+   */
+  iconClass: {
+    type: StringConstructor;
+  };
+  color: {
+    type: StringConstructor;
+  };
+  /**
+   * @props { String} type= ( 'css' | 'id' | 'img' | 'font' | 'str' | 'com' )
+   * 图标类型
+   */
+  type: {
+    type: () => IconType;
+  };
+  /**
+   * @props { String, Number } size= ( )
+   * 图标大小
+   */
+  size: {
+    type: (StringConstructor | NumberConstructor)[];
+  };
+  /**
+   * @props { String } flip='' ( 'horizontal' | 'vertical' | 'both' | '' )
+   * 图标方向
+   */
+  flip: {
+    type: () => Flip;
+    default: string;
+  };
+  /**
+   * @props { Number } rotate=0
+   * 图标旋转角度
+   */
+  rotate: {
+    type: NumberConstructor;
+    default: number;
+  };
+  default: {
+    type: StringConstructor;
+  };
+  directory: {
+    type: StringConstructor;
+    default: string;
+  };
+  prefix: {
+    type: StringConstructor;
+    default: string;
+  };
 }>> & Readonly<{}>, {
-    name: string | Record<string, any>;
-    flip: Flip;
-    rotate: number;
-    directory: string;
-    prefix: string;
-}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>>;
-
-export { type Flip, Icon, type IconType, Icon as default };
+  name: string | Record<string, any>;
+  prefix: string;
+  flip: Flip;
+  rotate: number;
+  directory: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>>;
+//#endregion
+export { Flip, Icon, Icon as default, IconType };