fast-element-plus 2.0.18 → 2.0.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +52 -19
- package/CONTRIBUTING.md +3 -4
- package/README.md +80 -27
- package/README.zh.md +66 -27
- package/dist/component.d.ts +123 -123
- package/dist/components/avatar/src/avatar.d.ts +26 -26
- package/dist/components/avatar/src/avatar.mjs +10 -10
- package/dist/components/avatar/src/avatar.mjs.map +1 -1
- package/dist/components/button/src/button.d.ts +32 -27
- package/dist/components/button/src/button.mjs +57 -36
- package/dist/components/button/src/button.mjs.map +1 -1
- package/dist/components/carNumber/src/carNumber.d.ts +8 -8
- package/dist/components/carNumber/src/carNumber.mjs +5 -5
- package/dist/components/carNumber/src/carNumber.mjs.map +1 -1
- package/dist/components/contextMenu/src/contextMenu.d.ts +7 -7
- package/dist/components/contextMenu/src/contextMenu.mjs +7 -7
- package/dist/components/contextMenu/src/contextMenu.mjs.map +1 -1
- package/dist/components/contextMenu/src/contextMenu.type.d.ts +7 -7
- package/dist/components/dialog/src/dialog.d.ts +76 -76
- package/dist/components/dialog/src/dialog.mjs +34 -34
- package/dist/components/dialog/src/dialog.mjs.map +1 -1
- package/dist/components/drawer/src/drawer.d.ts +59 -59
- package/dist/components/drawer/src/drawer.mjs +27 -27
- package/dist/components/drawer/src/drawer.mjs.map +1 -1
- package/dist/components/form/src/form.d.ts +30 -30
- package/dist/components/form/src/form.mjs +16 -16
- package/dist/components/form/src/form.mjs.map +1 -1
- package/dist/components/form/src/formItem.d.ts +30 -30
- package/dist/components/form/src/formItem.mjs +13 -13
- package/dist/components/form/src/formItem.mjs.map +1 -1
- package/dist/components/formItemTip/src/formItemTip.d.ts +9 -9
- package/dist/components/formItemTip/src/formItemTip.mjs +3 -3
- package/dist/components/formItemTip/src/formItemTip.mjs.map +1 -1
- package/dist/components/icon/src/icon.d.ts +10 -10
- package/dist/components/icon/src/icon.mjs +4 -4
- package/dist/components/icon/src/icon.mjs.map +1 -1
- package/dist/components/iconSelector/src/iconSelector.d.ts +6 -6
- package/dist/components/iconSelector/src/iconSelector.mjs +4 -4
- package/dist/components/iconSelector/src/iconSelector.mjs.map +1 -1
- package/dist/components/image/src/image.d.ts +36 -36
- package/dist/components/image/src/image.mjs +11 -11
- package/dist/components/image/src/image.mjs.map +1 -1
- package/dist/components/inputDialogPage/src/inputDialogPage.d.ts +37 -37
- package/dist/components/inputDialogPage/src/inputDialogPage.mjs +16 -16
- package/dist/components/inputDialogPage/src/inputDialogPage.mjs.map +1 -1
- package/dist/components/layoutGrid/src/layoutGrid.d.ts +12 -12
- package/dist/components/layoutGrid/src/layoutGrid.mjs +6 -6
- package/dist/components/layoutGrid/src/layoutGrid.mjs.map +1 -1
- package/dist/components/layoutGrid/src/layoutGridItem.d.ts +19 -19
- package/dist/components/layoutGrid/src/layoutGridItem.mjs +9 -9
- package/dist/components/layoutGrid/src/layoutGridItem.mjs.map +1 -1
- package/dist/components/select/src/select.d.ts +89 -89
- package/dist/components/select/src/select.mjs +30 -30
- package/dist/components/select/src/select.mjs.map +1 -1
- package/dist/components/select/src/selectOption.d.ts +13 -13
- package/dist/components/select/src/selectOption.mjs +6 -6
- package/dist/components/select/src/selectOption.mjs.map +1 -1
- package/dist/components/selectPage/src/selectPage.d.ts +76 -76
- package/dist/components/selectPage/src/selectPage.mjs +50 -36
- package/dist/components/selectPage/src/selectPage.mjs.map +1 -1
- package/dist/components/selectV2/index.mjs +2 -1
- package/dist/components/selectV2/index.mjs.map +1 -1
- package/dist/components/selectV2/src/selectV2.d.ts +161 -852
- package/dist/components/selectV2/src/selectV2.mjs +32 -340
- package/dist/components/selectV2/src/selectV2.mjs.map +1 -1
- package/dist/components/table/index.mjs +3 -2
- package/dist/components/table/index.mjs.map +1 -1
- package/dist/components/table/src/page.type.d.ts +1 -1
- package/dist/components/table/src/table.d.ts +211 -744
- package/dist/components/table/src/table.mjs +111 -307
- package/dist/components/table/src/table.mjs.map +1 -1
- package/dist/components/table/src/table.state.d.ts +3 -3
- package/dist/components/table/src/table.type.d.ts +1 -9
- package/dist/components/table/src/table.type.mjs.map +1 -1
- package/dist/components/table/src/tableColumn.d.ts +102 -399
- package/dist/components/table/src/tableColumn.mjs +28 -185
- package/dist/components/table/src/tableColumn.mjs.map +1 -1
- package/dist/components/table/src/tableColumnSettingDialog.d.ts +4 -4
- package/dist/components/table/src/tableColumnSettingDialog.mjs +3 -3
- package/dist/components/table/src/tableColumnSettingDialog.mjs.map +1 -1
- package/dist/components/table/src/tablePagination.d.ts +4 -4
- package/dist/components/table/src/tablePagination.mjs +3 -3
- package/dist/components/table/src/tablePagination.mjs.map +1 -1
- package/dist/components/table/src/tableSearchForm.d.ts +12 -12
- package/dist/components/table/src/tableSearchForm.mjs +6 -6
- package/dist/components/table/src/tableSearchForm.mjs.map +1 -1
- package/dist/components/table/src/tableSearchFormItem.d.ts +4 -4
- package/dist/components/table/src/tableSearchFormItem.mjs +2 -2
- package/dist/components/table/src/tableSearchFormItem.mjs.map +1 -1
- package/dist/components/table/src/useTable.d.ts +1 -0
- package/dist/components/table/src/useTable.mjs +109 -65
- package/dist/components/table/src/useTable.mjs.map +1 -1
- package/dist/components/table/utils/table.d.ts +4 -4
- package/dist/components/table/utils/table.mjs +4 -4
- package/dist/components/table/utils/table.mjs.map +1 -1
- package/dist/components/tree/src/tree.d.ts +87 -87
- package/dist/components/tree/src/tree.mjs +48 -48
- package/dist/components/tree/src/tree.mjs.map +1 -1
- package/dist/components/treeSelect/src/treeSelect.d.ts +139 -133
- package/dist/components/treeSelect/src/treeSelect.mjs +57 -57
- package/dist/components/treeSelect/src/treeSelect.mjs.map +1 -1
- package/dist/components/upload/src/upload.d.ts +36 -36
- package/dist/components/upload/src/upload.mjs +19 -19
- package/dist/components/upload/src/upload.mjs.map +1 -1
- package/dist/components/uploadImage/src/uploadImage.d.ts +47 -47
- package/dist/components/uploadImage/src/uploadImage.mjs +24 -28
- package/dist/components/uploadImage/src/uploadImage.mjs.map +1 -1
- package/dist/components/uploadImages/src/uploadImages.d.ts +41 -41
- package/dist/components/uploadImages/src/uploadImages.mjs +21 -21
- package/dist/components/uploadImages/src/uploadImages.mjs.map +1 -1
- package/dist/directives/click-debounce/index.mjs +19 -11
- package/dist/directives/click-debounce/index.mjs.map +1 -1
- package/dist/directives/click-throttle/index.d.ts +4 -2
- package/dist/directives/click-throttle/index.mjs +21 -11
- package/dist/directives/click-throttle/index.mjs.map +1 -1
- package/dist/index.css +1 -1
- package/dist/index.css.map +1 -1
- package/dist/index.global.min.js +3 -3
- package/dist/index.global.min.js.map +1 -1
- package/dist/index.mjs +3 -3
- package/dist/internal/props.d.ts +685 -0
- package/dist/internal/props.mjs +683 -0
- package/dist/internal/props.mjs.map +1 -0
- package/dist/utils/loading-tasks.d.ts +5 -0
- package/dist/utils/loading-tasks.mjs +32 -0
- package/dist/utils/loading-tasks.mjs.map +1 -0
- package/dist/version.d.ts +1 -1
- package/dist/version.mjs +1 -1
- package/dist/version.mjs.map +1 -1
- package/package.json +5 -10
|
@@ -1,24 +1,24 @@
|
|
|
1
|
-
/** FaFormItemTip 的运行时 Props
|
|
1
|
+
/** FaFormItemTip 的运行时 Props 定义 */
|
|
2
2
|
export declare const faFormItemTipProps: {
|
|
3
|
-
/**
|
|
3
|
+
/** 提示 */
|
|
4
4
|
tips: StringConstructor;
|
|
5
|
-
/**
|
|
5
|
+
/** 显示 */
|
|
6
6
|
label: StringConstructor;
|
|
7
7
|
};
|
|
8
|
-
/** FaFormItemTip
|
|
8
|
+
/** FaFormItemTip 的插槽参数 */
|
|
9
9
|
export interface FaFormItemTipSlots extends Record<string, unknown> {
|
|
10
|
-
/**
|
|
10
|
+
/** 显示插槽 */
|
|
11
11
|
label: never;
|
|
12
12
|
}
|
|
13
13
|
declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
14
|
-
/**
|
|
14
|
+
/** 提示 */
|
|
15
15
|
tips: StringConstructor;
|
|
16
|
-
/**
|
|
16
|
+
/** 显示 */
|
|
17
17
|
label: StringConstructor;
|
|
18
18
|
}>, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
19
|
-
/**
|
|
19
|
+
/** 提示 */
|
|
20
20
|
tips: StringConstructor;
|
|
21
|
-
/**
|
|
21
|
+
/** 显示 */
|
|
22
22
|
label: StringConstructor;
|
|
23
23
|
}>> & Readonly<{}>, {}, import("../../../utils").TypedSlotsDeclaration<FaFormItemTipSlots>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
24
24
|
export default _default;
|
|
@@ -4,11 +4,11 @@ import { createVNode, defineComponent } from "vue";
|
|
|
4
4
|
import { QuestionFilled } from "@element-plus/icons-vue";
|
|
5
5
|
import { ElIcon, ElTooltip } from "element-plus";
|
|
6
6
|
//#region src/components/formItemTip/src/formItemTip.tsx
|
|
7
|
-
/** FaFormItemTip 的运行时 Props
|
|
7
|
+
/** FaFormItemTip 的运行时 Props 定义 */
|
|
8
8
|
const faFormItemTipProps = {
|
|
9
|
-
/**
|
|
9
|
+
/** 提示 */
|
|
10
10
|
tips: String,
|
|
11
|
-
/**
|
|
11
|
+
/** 显示 */
|
|
12
12
|
label: String
|
|
13
13
|
};
|
|
14
14
|
var formItemTip_default = defineComponent({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"formItemTip.mjs","names":[],"sources":["../../../../src/components/formItemTip/src/formItemTip.tsx"],"sourcesContent":["import { defineComponent } from \"vue\";\nimport { QuestionFilled } from \"@element-plus/icons-vue\";\nimport { ElIcon, ElTooltip } from \"element-plus\";\nimport { makeSlots, useRender } from \"../../../utils\";\n\n/** FaFormItemTip 的运行时 Props
|
|
1
|
+
{"version":3,"file":"formItemTip.mjs","names":[],"sources":["../../../../src/components/formItemTip/src/formItemTip.tsx"],"sourcesContent":["import { defineComponent } from \"vue\";\nimport { QuestionFilled } from \"@element-plus/icons-vue\";\nimport { ElIcon, ElTooltip } from \"element-plus\";\nimport { makeSlots, useRender } from \"../../../utils\";\n\n/** FaFormItemTip 的运行时 Props 定义 */\nexport const faFormItemTipProps = {\n\t/** 提示 */\n\ttips: String,\n\t/** 显示 */\n\tlabel: String,\n};\n\n/** FaFormItemTip 的插槽参数 */\nexport interface FaFormItemTipSlots extends Record<string, unknown> {\n\t/** 显示插槽 */\n\tlabel: never;\n}\n\nexport default defineComponent({\n\tname: \"FaFormItemTip\",\n\tprops: faFormItemTipProps,\n\tslots: makeSlots<FaFormItemTipSlots>(),\n\tsetup(props, { slots }) {\n\t\tuseRender(() => (\n\t\t\t<div class=\"fa-form-item-tip\">\n\t\t\t\t<ElTooltip effect=\"dark\" rawContent content={props.tips} placement=\"top\">\n\t\t\t\t\t<ElIcon>\n\t\t\t\t\t\t<QuestionFilled />\n\t\t\t\t\t</ElIcon>\n\t\t\t\t</ElTooltip>\n\t\t\t\t<span class=\"fa-form-item-tip__label\">{slots.label ? slots.label() : props.label}</span>\n\t\t\t</div>\n\t\t));\n\t},\n});\n"],"mappings":";;;;;;;AAMA,MAAa,qBAAqB;;CAEjC,MAAM;;CAEN,OAAO;AACR;AAQA,IAAA,sBAAe,gBAAgB;CAC9B,MAAM;CACN,OAAO;CACP,OAAO,UAA8B;CACrC,MAAM,OAAO,EAAE,SAAS;EACvB,gBAAU,YAAA,OAAA,EAAA,SAAA,mBAAA,GAAA,CAAA,YAAA,WAAA;GAAA,UAAA;GAAA,cAAA;GAAA,WAEqC,MAAM;GAAI,aAAA;EAAA,GAAA,EAAA,eAAA,CAAA,YAAA,QAAA,MAAA,EAAA,eAAA,CAAA,YAAA,gBAAA,MAAA,IAAA,CAAA,EAAA,CAAA,CAAA,EAAA,CAAA,GAAA,YAAA,QAAA,EAAA,SAAA,0BAAA,GAAA,CAKhB,MAAM,QAAQ,MAAM,MAAM,IAAI,MAAM,KAAK,CAAA,CAAA,CAAA,CAEjF;CACF;AACD,CAAC"}
|
|
@@ -1,40 +1,40 @@
|
|
|
1
|
-
/** FaIcon 的运行时 Props
|
|
1
|
+
/** FaIcon 的运行时 Props 定义 */
|
|
2
2
|
export declare const faIconProps: {
|
|
3
|
-
/**
|
|
3
|
+
/** el-icon- 使用 El-icon 的图标;fa-icon 使用 Fast 图标组件库; */
|
|
4
4
|
name: {
|
|
5
5
|
type: StringConstructor;
|
|
6
6
|
required: true;
|
|
7
7
|
};
|
|
8
|
-
/**
|
|
8
|
+
/** 大小 */
|
|
9
9
|
size: {
|
|
10
10
|
type: (NumberConstructor | StringConstructor)[];
|
|
11
11
|
};
|
|
12
|
-
/**
|
|
12
|
+
/** 颜色 */
|
|
13
13
|
color: StringConstructor;
|
|
14
14
|
};
|
|
15
15
|
declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
16
|
-
/**
|
|
16
|
+
/** el-icon- 使用 El-icon 的图标;fa-icon 使用 Fast 图标组件库; */
|
|
17
17
|
name: {
|
|
18
18
|
type: StringConstructor;
|
|
19
19
|
required: true;
|
|
20
20
|
};
|
|
21
|
-
/**
|
|
21
|
+
/** 大小 */
|
|
22
22
|
size: {
|
|
23
23
|
type: (NumberConstructor | StringConstructor)[];
|
|
24
24
|
};
|
|
25
|
-
/**
|
|
25
|
+
/** 颜色 */
|
|
26
26
|
color: StringConstructor;
|
|
27
27
|
}>, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
28
|
-
/**
|
|
28
|
+
/** el-icon- 使用 El-icon 的图标;fa-icon 使用 Fast 图标组件库; */
|
|
29
29
|
name: {
|
|
30
30
|
type: StringConstructor;
|
|
31
31
|
required: true;
|
|
32
32
|
};
|
|
33
|
-
/**
|
|
33
|
+
/** 大小 */
|
|
34
34
|
size: {
|
|
35
35
|
type: (NumberConstructor | StringConstructor)[];
|
|
36
36
|
};
|
|
37
|
-
/**
|
|
37
|
+
/** 颜色 */
|
|
38
38
|
color: StringConstructor;
|
|
39
39
|
}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
40
40
|
export default _default;
|
|
@@ -4,19 +4,19 @@ import { RegExps } from "../../../constants/regex.mjs";
|
|
|
4
4
|
import { computed, createVNode, defineComponent, h, isVNode, mergeProps, reactive, resolveComponent } from "vue";
|
|
5
5
|
import { ElIcon } from "element-plus";
|
|
6
6
|
//#region src/components/icon/src/icon.tsx
|
|
7
|
-
/** FaIcon 的运行时 Props
|
|
7
|
+
/** FaIcon 的运行时 Props 定义 */
|
|
8
8
|
function _isSlot(s) {
|
|
9
9
|
return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
|
|
10
10
|
}
|
|
11
11
|
const faIconProps = {
|
|
12
|
-
/**
|
|
12
|
+
/** el-icon- 使用 El-icon 的图标;fa-icon 使用 Fast 图标组件库; */
|
|
13
13
|
name: {
|
|
14
14
|
type: String,
|
|
15
15
|
required: true
|
|
16
16
|
},
|
|
17
|
-
/**
|
|
17
|
+
/** 大小 */
|
|
18
18
|
size: { type: [String, Number] },
|
|
19
|
-
/**
|
|
19
|
+
/** 颜色 */
|
|
20
20
|
color: String
|
|
21
21
|
};
|
|
22
22
|
var icon_default = defineComponent({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon.mjs","names":[],"sources":["../../../../src/components/icon/src/icon.tsx"],"sourcesContent":["import { computed, defineComponent, h, reactive, resolveComponent } from \"vue\";\nimport { ElIcon } from \"element-plus\";\nimport { RegExps } from \"../../../constants\";\nimport { addCssUnit, useRender } from \"../../../utils\";\nimport type { CSSProperties, ComponentObjectPropsOptions } from \"vue\";\n\n/** FaIcon 的运行时 Props
|
|
1
|
+
{"version":3,"file":"icon.mjs","names":[],"sources":["../../../../src/components/icon/src/icon.tsx"],"sourcesContent":["import { computed, defineComponent, h, reactive, resolveComponent } from \"vue\";\nimport { ElIcon } from \"element-plus\";\nimport { RegExps } from \"../../../constants\";\nimport { addCssUnit, useRender } from \"../../../utils\";\nimport type { CSSProperties, ComponentObjectPropsOptions } from \"vue\";\n\n/** FaIcon 的运行时 Props 定义 */\nexport const faIconProps = {\n\t/** el-icon- 使用 El-icon 的图标;fa-icon 使用 Fast 图标组件库; */\n\tname: {\n\t\ttype: String,\n\t\trequired: true,\n\t},\n\t/** 大小 */\n\tsize: {\n\t\ttype: [String, Number],\n\t},\n\t/** 颜色 */\n\tcolor: String,\n} satisfies ComponentObjectPropsOptions;\n\nexport default defineComponent({\n\tname: \"FaIcon\",\n\tprops: faIconProps,\n\tsetup(props, { attrs }) {\n\t\tconst state = reactive({\n\t\t\tisUrl: computed(() => RegExps.External.test(props.name)),\n\t\t\tstyle: computed(() => {\n\t\t\t\tconst result: CSSProperties & { \"-webkit-mask\"?: string } = {};\n\t\t\t\tif (props.size) {\n\t\t\t\t\tresult.fontSize = addCssUnit(props.size);\n\t\t\t\t}\n\t\t\t\tif (props.color) {\n\t\t\t\t\tresult.color = props.color;\n\t\t\t\t}\n\t\t\t\tif (state.isUrl) {\n\t\t\t\t\tresult.mask = `url(${props.name}) no-repeat 50% 50%`;\n\t\t\t\t\tresult[\"-webkit-mask\"] = `url(${props.name}) no-repeat 50% 50%`;\n\t\t\t\t}\n\t\t\t\treturn result;\n\t\t\t}),\n\t\t});\n\n\t\tuseRender(() =>\n\t\t\tprops.name.startsWith(\"el-icon-\") ? (\n\t\t\t\t<ElIcon {...attrs} {...props} class={[\"fa-icon\", props.name]}>\n\t\t\t\t\t{h(resolveComponent(props.name))}\n\t\t\t\t</ElIcon>\n\t\t\t) : props.name.startsWith(\"fa-icon\") ? (\n\t\t\t\t<ElIcon {...attrs} {...props} class={[\"fa-icon\", props.name]}>\n\t\t\t\t\t{h(resolveComponent(props.name))}\n\t\t\t\t</ElIcon>\n\t\t\t) : state.isUrl ? (\n\t\t\t\t<div {...attrs} class=\"el-icon fa-icon url-icon\" style={state.style} />\n\t\t\t) : (\n\t\t\t\t<i {...attrs} class={[\"el-icon fa-icon\", props.name]} style={state.style} />\n\t\t\t)\n\t\t);\n\t},\n});\n"],"mappings":";;;;;;;AAMA,SAAA,QAAA,GAAA;CAAA,OAAA,OAAA,MAAA,cAAA,OAAA,UAAA,SAAA,KAAA,CAAA,MAAA,qBAAA,CAAA,QAAA,CAAA;AAAA;AACA,MAAa,cAAc;;CAE1B,MAAM;EACL,MAAM;EACN,UAAU;CACX;;CAEA,MAAM,EACL,MAAM,CAAC,QAAQ,MAAM,EACtB;;CAEA,OAAO;AACR;AAEA,IAAA,eAAe,gBAAgB;CAC9B,MAAM;CACN,OAAO;CACP,MAAM,OAAO,EAAE,SAAS;EACvB,MAAM,QAAQ,SAAS;GACtB,OAAO,eAAe,QAAQ,SAAS,KAAK,MAAM,IAAI,CAAC;GACvD,OAAO,eAAe;IACrB,MAAM,SAAsD,CAAC;IAC7D,IAAI,MAAM,MACT,OAAO,WAAW,WAAW,MAAM,IAAI;IAExC,IAAI,MAAM,OACT,OAAO,QAAQ,MAAM;IAEtB,IAAI,MAAM,OAAO;KAChB,OAAO,OAAO,OAAO,MAAM,KAAI;KAC/B,OAAO,kBAAkB,OAAO,MAAM,KAAI;IAC3C;IACA,OAAO;GACR,CAAC;EACF,CAAC;EAED,gBAAU;GAAA,IAAA,OAAA;GAAA,OACT,MAAM,KAAK,WAAW,UAAU,IAAC,YAAA,QAAA,WACpB,OAAW,OAAK,EAAA,SAAS,CAAC,WAAW,MAAM,IAAI,EAAC,CAAA,GAAA,QAAA,QAC1D,EAAE,iBAAiB,MAAM,IAAI,CAAC,CAAC,IAAA,QAAA,EAAA,eAAA,CAAA,KAAA,EAAA,CAAA,IAE9B,MAAM,KAAK,WAAW,SAAS,IAAC,YAAA,QAAA,WACvB,OAAW,OAAK,EAAA,SAAS,CAAC,WAAW,MAAM,IAAI,EAAC,CAAA,GAAA,QAAA,SAC1D,EAAE,iBAAiB,MAAM,IAAI,CAAC,CAAC,IAAA,SAAA,EAAA,eAAA,CAAA,MAAA,EAAA,CAAA,IAE9B,MAAM,QAAK,YAAA,OAAA,WACL,OAAK;IAAA,SAAA;IAAA,SAA0C,MAAM;GAAK,CAAA,GAAA,IAAA,IAAA,YAAA,KAAA,WAE5D,OAAK;IAAA,SAAS,CAAC,mBAAmB,MAAM,IAAI;IAAC,SAAS,MAAM;GAAK,CAAA,GAAA,IAAA;EACxE,CACF;CACD;AACD,CAAC"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import type { PropType } from "vue";
|
|
2
2
|
type IconType = "ele" | "fastEle" | "local";
|
|
3
3
|
declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
4
|
-
/**
|
|
4
|
+
/** v-model 绑定值 */
|
|
5
5
|
modelValue: PropType<string | null>;
|
|
6
|
-
/**
|
|
6
|
+
/** 自定义图标 */
|
|
7
7
|
customIcons: {
|
|
8
8
|
type: PropType<string[]>;
|
|
9
9
|
default: () => never[];
|
|
@@ -14,14 +14,14 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
14
14
|
/** 当前选中的图标名称。 */
|
|
15
15
|
value: import("vue").ComputedRef<string | null>;
|
|
16
16
|
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
17
|
-
/**
|
|
17
|
+
/** v-model 回调 */
|
|
18
18
|
"update:modelValue": (value: string | null) => boolean;
|
|
19
|
-
/**
|
|
19
|
+
/** 改变 */
|
|
20
20
|
change: (value: string | null) => boolean;
|
|
21
21
|
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
22
|
-
/**
|
|
22
|
+
/** v-model 绑定值 */
|
|
23
23
|
modelValue: PropType<string | null>;
|
|
24
|
-
/**
|
|
24
|
+
/** 自定义图标 */
|
|
25
25
|
customIcons: {
|
|
26
26
|
type: PropType<string[]>;
|
|
27
27
|
default: () => never[];
|
|
@@ -15,18 +15,18 @@ function _isSlot(s) {
|
|
|
15
15
|
var iconSelector_default = defineComponent({
|
|
16
16
|
name: "FaIconSelector",
|
|
17
17
|
props: {
|
|
18
|
-
/**
|
|
18
|
+
/** v-model 绑定值 */
|
|
19
19
|
modelValue: String,
|
|
20
|
-
/**
|
|
20
|
+
/** 自定义图标 */
|
|
21
21
|
customIcons: {
|
|
22
22
|
type: definePropType(Array),
|
|
23
23
|
default: () => []
|
|
24
24
|
}
|
|
25
25
|
},
|
|
26
26
|
emits: {
|
|
27
|
-
/**
|
|
27
|
+
/** v-model 回调 */
|
|
28
28
|
"update:modelValue": (value) => typeof value === "string" || value === null,
|
|
29
|
-
/**
|
|
29
|
+
/** 改变 */
|
|
30
30
|
change: (value) => typeof value === "string" || value === null
|
|
31
31
|
},
|
|
32
32
|
setup(props, { emit, expose }) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"iconSelector.mjs","names":["update:modelValue"],"sources":["../../../../src/components/iconSelector/src/iconSelector.tsx"],"sourcesContent":["import { computed, defineComponent, reactive, watch } from \"vue\";\nimport * as ElementPlusIconsVue from \"@element-plus/icons-vue\";\nimport { ChromeFilled, RefreshRight } from \"@element-plus/icons-vue\";\nimport { ElIcon, ElInput, ElPopover, ElScrollbar } from \"element-plus\";\nimport * as FastElementPlusIconsVue from \"@fast-element-plus/icons-vue\";\nimport { definePropType, useExpose, useRender, withDefineType } from \"../../../utils\";\nimport { FaIcon } from \"../../icon\";\nimport type { PropType } from \"vue\";\n\ntype IconType = \"ele\" | \"fastEle\" | \"local\";\n\nexport default defineComponent({\n\tname: \"FaIconSelector\",\n\tprops: {\n\t\t/** @description v-model绑定值 */\n\t\tmodelValue: String as PropType<string | null>,\n\t\t/** @description 自定义图标 */\n\t\tcustomIcons: {\n\t\t\ttype: definePropType<string[]>(Array),\n\t\t\tdefault: () => [],\n\t\t},\n\t},\n\temits: {\n\t\t/** @description v-model 回调 */\n\t\t\"update:modelValue\": (value: string | null) => typeof value === \"string\" || value === null,\n\t\t/** @description 改变 */\n\t\tchange: (value: string | null) => typeof value === \"string\" || value === null,\n\t},\n\tsetup(props, { emit, expose }) {\n\t\tconst state = reactive({\n\t\t\tvalue: withDefineType<string | null>(null),\n\t\t\tsearchValue: withDefineType<string | null>(),\n\t\t\ticonType: withDefineType<IconType>(\"ele\"),\n\t\t\tpopoverVisible: false,\n\t\t\ticonNames: withDefineType<string[]>(Object.keys(ElementPlusIconsVue).map((name) => `el-icon-${name}`)),\n\t\t\trenderIconNames: computed((): string[] => {\n\t\t\t\tif (!state.searchValue) return state.iconNames;\n\t\t\t\treturn state.iconNames.filter((f) => f.toLowerCase().includes(state.searchValue?.toLowerCase() ?? \"\"));\n\t\t\t}),\n\t\t});\n\t\tconst popoverVisibleModel = computed({\n\t\t\tget: () => state.popoverVisible,\n\t\t\tset: (visible: boolean) => {\n\t\t\t\tstate.popoverVisible = visible;\n\t\t\t\tif (!visible) state.searchValue = null;\n\t\t\t},\n\t\t});\n\n\t\tconst handleTabClick = (iconType: IconType) => {\n\t\t\tstate.iconType = iconType;\n\t\t\tstate.iconNames = [];\n\t\t\tswitch (iconType) {\n\t\t\t\tcase \"ele\":\n\t\t\t\t\tstate.iconNames = Object.keys(ElementPlusIconsVue).map((name) => `el-icon-${name}`);\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"fastEle\":\n\t\t\t\t\tstate.iconNames = Object.keys(FastElementPlusIconsVue).map((name) => `fa-icon-${name}`);\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"local\":\n\t\t\t\t\tstate.iconNames = props.customIcons;\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t};\n\n\t\tconst handleIconClick = (value: string) => {\n\t\t\tstate.popoverVisible = false;\n\t\t\tstate.value = value;\n\t\t\tstate.searchValue = \"\";\n\t\t\temit(\"update:modelValue\", value);\n\t\t\temit(\"change\", value);\n\t\t};\n\n\t\tconst handleRefresh = () => {\n\t\t\tstate.value = null;\n\t\t\tstate.searchValue = null;\n\t\t\temit(\"update:modelValue\", null);\n\t\t\temit(\"change\", null);\n\t\t};\n\n\t\twatch(\n\t\t\t() => props.modelValue,\n\t\t\t(newValue) => {\n\t\t\t\tstate.value = newValue ?? null;\n\t\t\t},\n\t\t\t{ immediate: true }\n\t\t);\n\n\t\twatch(\n\t\t\t() => props.customIcons,\n\t\t\t() => {\n\t\t\t\tif (state.iconType === \"local\") state.iconNames = [...props.customIcons];\n\t\t\t},\n\t\t\t{ deep: true }\n\t\t);\n\n\t\tuseRender(() => (\n\t\t\t<ElPopover\n\t\t\t\tpopperClass=\"fa-icon-selector-popover\"\n\t\t\t\tvModel:visible={popoverVisibleModel.value}\n\t\t\t\twidth=\"auto\"\n\t\t\t\ttrigger=\"click\"\n\t\t\t\tshowArrow={false}\n\t\t\t\tshowAfter={0}\n\t\t\t\thideAfter={0}\n\t\t\t>\n\t\t\t\t{{\n\t\t\t\t\treference: () => (\n\t\t\t\t\t\t<ElInput\n\t\t\t\t\t\t\tclass=\"fa-icon-selector\"\n\t\t\t\t\t\t\tmodelValue={state.popoverVisible ? (state.searchValue ?? \"\") : (state.value ?? \"\")}\n\t\t\t\t\t\t\tplaceholder={state.popoverVisible ? \"搜索图标\" : \"请选择图标\"}\n\t\t\t\t\t\t\treadonly={!state.popoverVisible}\n\t\t\t\t\t\t\tonInput={(value: string) => {\n\t\t\t\t\t\t\t\tif (state.popoverVisible) state.searchValue = value;\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{{\n\t\t\t\t\t\t\t\tprepend: () => <ElIcon>{state.value ? <FaIcon name={state.value} /> : <ChromeFilled />}</ElIcon>,\n\t\t\t\t\t\t\t\tappend: () => (\n\t\t\t\t\t\t\t\t\t<ElIcon\n\t\t\t\t\t\t\t\t\t\tonClick={(event: MouseEvent) => {\n\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\thandleRefresh();\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<RefreshRight />\n\t\t\t\t\t\t\t\t\t</ElIcon>\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t</ElInput>\n\t\t\t\t\t),\n\t\t\t\t\tdefault: () => (\n\t\t\t\t\t\t<div class=\"fa-icon-selector-popover__box\">\n\t\t\t\t\t\t\t<div class=\"fa-icon-selector-popover__box-header\">\n\t\t\t\t\t\t\t\t<div class=\"fa-icon-selector-popover__box-header__title\">请选择图标</div>\n\t\t\t\t\t\t\t\t<div class=\"fa-icon-selector-popover__box-header__tab\">\n\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\tclass={{ \"is-active\": state.iconType === \"ele\" }}\n\t\t\t\t\t\t\t\t\t\ttitle=\"Element Plus 图标\"\n\t\t\t\t\t\t\t\t\t\tonClick={() => handleTabClick(\"ele\")}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\tele\n\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\tclass={{ \"is-active\": state.iconType === \"fastEle\" }}\n\t\t\t\t\t\t\t\t\t\ttitle=\"Fast Element Plus 图标\"\n\t\t\t\t\t\t\t\t\t\tonClick={() => handleTabClick(\"fastEle\")}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\tfastEle\n\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\tclass={{ \"is-active\": state.iconType === \"local\" }}\n\t\t\t\t\t\t\t\t\t\ttitle=\"本地图标\"\n\t\t\t\t\t\t\t\t\t\tonClick={() => handleTabClick(\"local\")}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\tlocal\n\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"fa-icon-selector-popover__box-body\">\n\t\t\t\t\t\t\t\t<ElScrollbar>\n\t\t\t\t\t\t\t\t\t{state.renderIconNames.map((m) => (\n\t\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\t\tkey={m}\n\t\t\t\t\t\t\t\t\t\t\tclass=\"fa-icon-selector-popover__box-body__item\"\n\t\t\t\t\t\t\t\t\t\t\ttitle={m}\n\t\t\t\t\t\t\t\t\t\t\tonClick={() => handleIconClick(m)}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<FaIcon name={m} />\n\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t</ElScrollbar>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t),\n\t\t\t\t}}\n\t\t\t</ElPopover>\n\t\t));\n\n\t\treturn useExpose(expose, {\n\t\t\t/** 当前图标来源。 */\n\t\t\ticonType: computed(() => state.iconType),\n\t\t\t/** 当前选中的图标名称。 */\n\t\t\tvalue: computed(() => state.value),\n\t\t});\n\t},\n});\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"iconSelector.mjs","names":["update:modelValue"],"sources":["../../../../src/components/iconSelector/src/iconSelector.tsx"],"sourcesContent":["import { computed, defineComponent, reactive, watch } from \"vue\";\nimport * as ElementPlusIconsVue from \"@element-plus/icons-vue\";\nimport { ChromeFilled, RefreshRight } from \"@element-plus/icons-vue\";\nimport { ElIcon, ElInput, ElPopover, ElScrollbar } from \"element-plus\";\nimport * as FastElementPlusIconsVue from \"@fast-element-plus/icons-vue\";\nimport { definePropType, useExpose, useRender, withDefineType } from \"../../../utils\";\nimport { FaIcon } from \"../../icon\";\nimport type { PropType } from \"vue\";\n\ntype IconType = \"ele\" | \"fastEle\" | \"local\";\n\nexport default defineComponent({\n\tname: \"FaIconSelector\",\n\tprops: {\n\t\t/** v-model 绑定值 */\n\t\tmodelValue: String as PropType<string | null>,\n\t\t/** 自定义图标 */\n\t\tcustomIcons: {\n\t\t\ttype: definePropType<string[]>(Array),\n\t\t\tdefault: () => [],\n\t\t},\n\t},\n\temits: {\n\t\t/** v-model 回调 */\n\t\t\"update:modelValue\": (value: string | null) => typeof value === \"string\" || value === null,\n\t\t/** 改变 */\n\t\tchange: (value: string | null) => typeof value === \"string\" || value === null,\n\t},\n\tsetup(props, { emit, expose }) {\n\t\tconst state = reactive({\n\t\t\tvalue: withDefineType<string | null>(null),\n\t\t\tsearchValue: withDefineType<string | null>(),\n\t\t\ticonType: withDefineType<IconType>(\"ele\"),\n\t\t\tpopoverVisible: false,\n\t\t\ticonNames: withDefineType<string[]>(Object.keys(ElementPlusIconsVue).map((name) => `el-icon-${name}`)),\n\t\t\trenderIconNames: computed((): string[] => {\n\t\t\t\tif (!state.searchValue) return state.iconNames;\n\t\t\t\treturn state.iconNames.filter((f) => f.toLowerCase().includes(state.searchValue?.toLowerCase() ?? \"\"));\n\t\t\t}),\n\t\t});\n\t\tconst popoverVisibleModel = computed({\n\t\t\tget: () => state.popoverVisible,\n\t\t\tset: (visible: boolean) => {\n\t\t\t\tstate.popoverVisible = visible;\n\t\t\t\tif (!visible) state.searchValue = null;\n\t\t\t},\n\t\t});\n\n\t\tconst handleTabClick = (iconType: IconType) => {\n\t\t\tstate.iconType = iconType;\n\t\t\tstate.iconNames = [];\n\t\t\tswitch (iconType) {\n\t\t\t\tcase \"ele\":\n\t\t\t\t\tstate.iconNames = Object.keys(ElementPlusIconsVue).map((name) => `el-icon-${name}`);\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"fastEle\":\n\t\t\t\t\tstate.iconNames = Object.keys(FastElementPlusIconsVue).map((name) => `fa-icon-${name}`);\n\t\t\t\t\tbreak;\n\t\t\t\tcase \"local\":\n\t\t\t\t\tstate.iconNames = props.customIcons;\n\t\t\t\t\tbreak;\n\t\t\t}\n\t\t};\n\n\t\tconst handleIconClick = (value: string) => {\n\t\t\tstate.popoverVisible = false;\n\t\t\tstate.value = value;\n\t\t\tstate.searchValue = \"\";\n\t\t\temit(\"update:modelValue\", value);\n\t\t\temit(\"change\", value);\n\t\t};\n\n\t\tconst handleRefresh = () => {\n\t\t\tstate.value = null;\n\t\t\tstate.searchValue = null;\n\t\t\temit(\"update:modelValue\", null);\n\t\t\temit(\"change\", null);\n\t\t};\n\n\t\twatch(\n\t\t\t() => props.modelValue,\n\t\t\t(newValue) => {\n\t\t\t\tstate.value = newValue ?? null;\n\t\t\t},\n\t\t\t{ immediate: true }\n\t\t);\n\n\t\twatch(\n\t\t\t() => props.customIcons,\n\t\t\t() => {\n\t\t\t\tif (state.iconType === \"local\") state.iconNames = [...props.customIcons];\n\t\t\t},\n\t\t\t{ deep: true }\n\t\t);\n\n\t\tuseRender(() => (\n\t\t\t<ElPopover\n\t\t\t\tpopperClass=\"fa-icon-selector-popover\"\n\t\t\t\tvModel:visible={popoverVisibleModel.value}\n\t\t\t\twidth=\"auto\"\n\t\t\t\ttrigger=\"click\"\n\t\t\t\tshowArrow={false}\n\t\t\t\tshowAfter={0}\n\t\t\t\thideAfter={0}\n\t\t\t>\n\t\t\t\t{{\n\t\t\t\t\treference: () => (\n\t\t\t\t\t\t<ElInput\n\t\t\t\t\t\t\tclass=\"fa-icon-selector\"\n\t\t\t\t\t\t\tmodelValue={state.popoverVisible ? (state.searchValue ?? \"\") : (state.value ?? \"\")}\n\t\t\t\t\t\t\tplaceholder={state.popoverVisible ? \"搜索图标\" : \"请选择图标\"}\n\t\t\t\t\t\t\treadonly={!state.popoverVisible}\n\t\t\t\t\t\t\tonInput={(value: string) => {\n\t\t\t\t\t\t\t\tif (state.popoverVisible) state.searchValue = value;\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{{\n\t\t\t\t\t\t\t\tprepend: () => <ElIcon>{state.value ? <FaIcon name={state.value} /> : <ChromeFilled />}</ElIcon>,\n\t\t\t\t\t\t\t\tappend: () => (\n\t\t\t\t\t\t\t\t\t<ElIcon\n\t\t\t\t\t\t\t\t\t\tonClick={(event: MouseEvent) => {\n\t\t\t\t\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t\thandleRefresh();\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<RefreshRight />\n\t\t\t\t\t\t\t\t\t</ElIcon>\n\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t</ElInput>\n\t\t\t\t\t),\n\t\t\t\t\tdefault: () => (\n\t\t\t\t\t\t<div class=\"fa-icon-selector-popover__box\">\n\t\t\t\t\t\t\t<div class=\"fa-icon-selector-popover__box-header\">\n\t\t\t\t\t\t\t\t<div class=\"fa-icon-selector-popover__box-header__title\">请选择图标</div>\n\t\t\t\t\t\t\t\t<div class=\"fa-icon-selector-popover__box-header__tab\">\n\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\tclass={{ \"is-active\": state.iconType === \"ele\" }}\n\t\t\t\t\t\t\t\t\t\ttitle=\"Element Plus 图标\"\n\t\t\t\t\t\t\t\t\t\tonClick={() => handleTabClick(\"ele\")}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\tele\n\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\tclass={{ \"is-active\": state.iconType === \"fastEle\" }}\n\t\t\t\t\t\t\t\t\t\ttitle=\"Fast Element Plus 图标\"\n\t\t\t\t\t\t\t\t\t\tonClick={() => handleTabClick(\"fastEle\")}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\tfastEle\n\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\tclass={{ \"is-active\": state.iconType === \"local\" }}\n\t\t\t\t\t\t\t\t\t\ttitle=\"本地图标\"\n\t\t\t\t\t\t\t\t\t\tonClick={() => handleTabClick(\"local\")}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\tlocal\n\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"fa-icon-selector-popover__box-body\">\n\t\t\t\t\t\t\t\t<ElScrollbar>\n\t\t\t\t\t\t\t\t\t{state.renderIconNames.map((m) => (\n\t\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\t\tkey={m}\n\t\t\t\t\t\t\t\t\t\t\tclass=\"fa-icon-selector-popover__box-body__item\"\n\t\t\t\t\t\t\t\t\t\t\ttitle={m}\n\t\t\t\t\t\t\t\t\t\t\tonClick={() => handleIconClick(m)}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<FaIcon name={m} />\n\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t</ElScrollbar>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t),\n\t\t\t\t}}\n\t\t\t</ElPopover>\n\t\t));\n\n\t\treturn useExpose(expose, {\n\t\t\t/** 当前图标来源。 */\n\t\t\ticonType: computed(() => state.iconType),\n\t\t\t/** 当前选中的图标名称。 */\n\t\t\tvalue: computed(() => state.value),\n\t\t});\n\t},\n});\n"],"mappings":"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"}
|
|
@@ -1,32 +1,32 @@
|
|
|
1
1
|
import type { ImageViewerAction } from "element-plus";
|
|
2
|
-
/** FaImage 的运行时 Props
|
|
2
|
+
/** FaImage 的运行时 Props 定义 */
|
|
3
3
|
export declare const faImageProps: {
|
|
4
|
-
/**
|
|
4
|
+
/** when enabling preview, use this flag to control whether clicking on backdrop can exit preview mode. */
|
|
5
5
|
hideOnClickModal: {
|
|
6
6
|
type: BooleanConstructor;
|
|
7
7
|
default: boolean;
|
|
8
8
|
};
|
|
9
|
-
/**
|
|
9
|
+
/** whether to append image-viewer to body. A nested parent element attribute transform should have this attribute set to `true`. */
|
|
10
10
|
previewTeleported: {
|
|
11
11
|
type: BooleanConstructor;
|
|
12
12
|
default: boolean;
|
|
13
13
|
};
|
|
14
|
-
/**
|
|
14
|
+
/** whether to use lazy load. */
|
|
15
15
|
lazy: {
|
|
16
16
|
type: BooleanConstructor;
|
|
17
17
|
default: boolean;
|
|
18
18
|
};
|
|
19
|
-
/**
|
|
19
|
+
/** Base64图片 */
|
|
20
20
|
base64: BooleanConstructor;
|
|
21
|
-
/**
|
|
21
|
+
/** 原图 */
|
|
22
22
|
original: BooleanConstructor;
|
|
23
|
-
/**
|
|
23
|
+
/** 标准 */
|
|
24
24
|
normal: BooleanConstructor;
|
|
25
|
-
/**
|
|
25
|
+
/** 小图 */
|
|
26
26
|
small: BooleanConstructor;
|
|
27
|
-
/**
|
|
27
|
+
/** 缩略图 */
|
|
28
28
|
thumb: BooleanConstructor;
|
|
29
|
-
/**
|
|
29
|
+
/** 是否可以预览图片 */
|
|
30
30
|
preview: {
|
|
31
31
|
type: BooleanConstructor;
|
|
32
32
|
default: boolean;
|
|
@@ -75,22 +75,22 @@ export declare const faImageEmits: {
|
|
|
75
75
|
close: () => boolean;
|
|
76
76
|
show: () => boolean;
|
|
77
77
|
};
|
|
78
|
-
/** FaImage
|
|
78
|
+
/** FaImage 的插槽参数 */
|
|
79
79
|
export interface FaImageSlots extends Record<string, unknown> {
|
|
80
|
-
/**
|
|
80
|
+
/** 当图像尚未加载时,自定义的占位符内容 */
|
|
81
81
|
placeholder: never;
|
|
82
|
-
/**
|
|
82
|
+
/** 自定义图像加载失败的内容 */
|
|
83
83
|
error: never;
|
|
84
|
-
/**
|
|
84
|
+
/** 当图像预览时自定义内容 */
|
|
85
85
|
viewer: {
|
|
86
86
|
src?: string;
|
|
87
87
|
};
|
|
88
|
-
/**
|
|
88
|
+
/** 图片预览进度内容 */
|
|
89
89
|
progress: {
|
|
90
90
|
activeIndex: number;
|
|
91
91
|
total: number;
|
|
92
92
|
};
|
|
93
|
-
/**
|
|
93
|
+
/** 图片预览工具栏内容 */
|
|
94
94
|
toolbar: {
|
|
95
95
|
actions: (action: ImageViewerAction, options?: Record<string, never>) => void;
|
|
96
96
|
prev: () => void;
|
|
@@ -99,39 +99,39 @@ export interface FaImageSlots extends Record<string, unknown> {
|
|
|
99
99
|
activeIndex: number;
|
|
100
100
|
setActiveItem: (index: number) => void;
|
|
101
101
|
};
|
|
102
|
-
/**
|
|
102
|
+
/** 图片预览加载失败内容 */
|
|
103
103
|
"viewer-error": {
|
|
104
104
|
activeIndex: number;
|
|
105
105
|
src: string;
|
|
106
106
|
};
|
|
107
107
|
}
|
|
108
108
|
declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
109
|
-
/**
|
|
109
|
+
/** when enabling preview, use this flag to control whether clicking on backdrop can exit preview mode. */
|
|
110
110
|
hideOnClickModal: {
|
|
111
111
|
type: BooleanConstructor;
|
|
112
112
|
default: boolean;
|
|
113
113
|
};
|
|
114
|
-
/**
|
|
114
|
+
/** whether to append image-viewer to body. A nested parent element attribute transform should have this attribute set to `true`. */
|
|
115
115
|
previewTeleported: {
|
|
116
116
|
type: BooleanConstructor;
|
|
117
117
|
default: boolean;
|
|
118
118
|
};
|
|
119
|
-
/**
|
|
119
|
+
/** whether to use lazy load. */
|
|
120
120
|
lazy: {
|
|
121
121
|
type: BooleanConstructor;
|
|
122
122
|
default: boolean;
|
|
123
123
|
};
|
|
124
|
-
/**
|
|
124
|
+
/** Base64图片 */
|
|
125
125
|
base64: BooleanConstructor;
|
|
126
|
-
/**
|
|
126
|
+
/** 原图 */
|
|
127
127
|
original: BooleanConstructor;
|
|
128
|
-
/**
|
|
128
|
+
/** 标准 */
|
|
129
129
|
normal: BooleanConstructor;
|
|
130
|
-
/**
|
|
130
|
+
/** 小图 */
|
|
131
131
|
small: BooleanConstructor;
|
|
132
|
-
/**
|
|
132
|
+
/** 缩略图 */
|
|
133
133
|
thumb: BooleanConstructor;
|
|
134
|
-
/**
|
|
134
|
+
/** 是否可以预览图片 */
|
|
135
135
|
preview: {
|
|
136
136
|
type: BooleanConstructor;
|
|
137
137
|
default: boolean;
|
|
@@ -172,7 +172,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
172
172
|
__epPropKey: true;
|
|
173
173
|
};
|
|
174
174
|
}>, {
|
|
175
|
-
/**
|
|
175
|
+
/** 手动打开图片预览。 */
|
|
176
176
|
showPreview: import("vue").ComputedRef<(() => void) | undefined>;
|
|
177
177
|
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
178
178
|
load: (evt: Event) => boolean;
|
|
@@ -181,32 +181,32 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
181
181
|
close: () => boolean;
|
|
182
182
|
show: () => boolean;
|
|
183
183
|
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
|
|
184
|
-
/**
|
|
184
|
+
/** when enabling preview, use this flag to control whether clicking on backdrop can exit preview mode. */
|
|
185
185
|
hideOnClickModal: {
|
|
186
186
|
type: BooleanConstructor;
|
|
187
187
|
default: boolean;
|
|
188
188
|
};
|
|
189
|
-
/**
|
|
189
|
+
/** whether to append image-viewer to body. A nested parent element attribute transform should have this attribute set to `true`. */
|
|
190
190
|
previewTeleported: {
|
|
191
191
|
type: BooleanConstructor;
|
|
192
192
|
default: boolean;
|
|
193
193
|
};
|
|
194
|
-
/**
|
|
194
|
+
/** whether to use lazy load. */
|
|
195
195
|
lazy: {
|
|
196
196
|
type: BooleanConstructor;
|
|
197
197
|
default: boolean;
|
|
198
198
|
};
|
|
199
|
-
/**
|
|
199
|
+
/** Base64图片 */
|
|
200
200
|
base64: BooleanConstructor;
|
|
201
|
-
/**
|
|
201
|
+
/** 原图 */
|
|
202
202
|
original: BooleanConstructor;
|
|
203
|
-
/**
|
|
203
|
+
/** 标准 */
|
|
204
204
|
normal: BooleanConstructor;
|
|
205
|
-
/**
|
|
205
|
+
/** 小图 */
|
|
206
206
|
small: BooleanConstructor;
|
|
207
|
-
/**
|
|
207
|
+
/** 缩略图 */
|
|
208
208
|
thumb: BooleanConstructor;
|
|
209
|
-
/**
|
|
209
|
+
/** 是否可以预览图片 */
|
|
210
210
|
preview: {
|
|
211
211
|
type: BooleanConstructor;
|
|
212
212
|
default: boolean;
|
|
@@ -7,35 +7,35 @@ import { computed, createVNode, defineComponent, mergeProps, reactive, shallowRe
|
|
|
7
7
|
import { Picture } from "@element-plus/icons-vue";
|
|
8
8
|
import { ElIcon, ElImage, imageEmits, imageProps } from "element-plus";
|
|
9
9
|
//#region src/components/image/src/image.tsx
|
|
10
|
-
/** FaImage 的运行时 Props
|
|
10
|
+
/** FaImage 的运行时 Props 定义 */
|
|
11
11
|
const faImageProps = {
|
|
12
12
|
...imageProps,
|
|
13
|
-
/**
|
|
13
|
+
/** when enabling preview, use this flag to control whether clicking on backdrop can exit preview mode. */
|
|
14
14
|
hideOnClickModal: {
|
|
15
15
|
type: Boolean,
|
|
16
16
|
default: true
|
|
17
17
|
},
|
|
18
|
-
/**
|
|
18
|
+
/** whether to append image-viewer to body. A nested parent element attribute transform should have this attribute set to `true`. */
|
|
19
19
|
previewTeleported: {
|
|
20
20
|
type: Boolean,
|
|
21
21
|
default: true
|
|
22
22
|
},
|
|
23
|
-
/**
|
|
23
|
+
/** whether to use lazy load. */
|
|
24
24
|
lazy: {
|
|
25
25
|
type: Boolean,
|
|
26
26
|
default: true
|
|
27
27
|
},
|
|
28
|
-
/**
|
|
28
|
+
/** Base64图片 */
|
|
29
29
|
base64: Boolean,
|
|
30
|
-
/**
|
|
30
|
+
/** 原图 */
|
|
31
31
|
original: Boolean,
|
|
32
|
-
/**
|
|
32
|
+
/** 标准 */
|
|
33
33
|
normal: Boolean,
|
|
34
|
-
/**
|
|
34
|
+
/** 小图 */
|
|
35
35
|
small: Boolean,
|
|
36
|
-
/**
|
|
36
|
+
/** 缩略图 */
|
|
37
37
|
thumb: Boolean,
|
|
38
|
-
/**
|
|
38
|
+
/** 是否可以预览图片 */
|
|
39
39
|
preview: {
|
|
40
40
|
type: Boolean,
|
|
41
41
|
default: true
|
|
@@ -87,7 +87,7 @@ var image_default = defineComponent({
|
|
|
87
87
|
...slots["viewer-error"] && { "viewer-error": (scope) => slots["viewer-error"]?.(scope) ?? [] }
|
|
88
88
|
}));
|
|
89
89
|
return useExpose(expose, {
|
|
90
|
-
/**
|
|
90
|
+
/** 手动打开图片预览。 */
|
|
91
91
|
showPreview: computed(() => imageRef.value?.showPreview) });
|
|
92
92
|
}
|
|
93
93
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"image.mjs","names":["viewer-error"],"sources":["../../../../src/components/image/src/image.tsx"],"sourcesContent":["import { computed, defineComponent, reactive, shallowRef, watch } from \"vue\";\nimport { Picture as ElIconPicture } from \"@element-plus/icons-vue\";\nimport { ElIcon, ElImage, imageEmits, imageProps } from \"element-plus\";\nimport { makeSlots, useEmits, useExpose, useProps, useRender } from \"../../../utils\";\nimport type { ImageInstance, ImageViewerAction } from \"element-plus\";\n\n/** FaImage 的运行时 Props
|
|
1
|
+
{"version":3,"file":"image.mjs","names":["viewer-error"],"sources":["../../../../src/components/image/src/image.tsx"],"sourcesContent":["import { computed, defineComponent, reactive, shallowRef, watch } from \"vue\";\nimport { Picture as ElIconPicture } from \"@element-plus/icons-vue\";\nimport { ElIcon, ElImage, imageEmits, imageProps } from \"element-plus\";\nimport { makeSlots, useEmits, useExpose, useProps, useRender } from \"../../../utils\";\nimport type { ImageInstance, ImageViewerAction } from \"element-plus\";\n\n/** FaImage 的运行时 Props 定义 */\nexport const faImageProps = {\n\t// eslint-disable-next-line @typescript-eslint/no-deprecated -- Element Plus 2.x 尚未提供可替代的公开运行时 props 定义。\n\t...imageProps,\n\t/** when enabling preview, use this flag to control whether clicking on backdrop can exit preview mode. */\n\thideOnClickModal: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** whether to append image-viewer to body. A nested parent element attribute transform should have this attribute set to `true`. */\n\tpreviewTeleported: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** whether to use lazy load. */\n\tlazy: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n\t/** Base64图片 */\n\tbase64: Boolean,\n\t/** 原图 */\n\toriginal: Boolean,\n\t/** 标准 */\n\tnormal: Boolean,\n\t/** 小图 */\n\tsmall: Boolean,\n\t/** 缩略图 */\n\tthumb: Boolean,\n\t/** 是否可以预览图片 */\n\tpreview: {\n\t\ttype: Boolean,\n\t\tdefault: true,\n\t},\n};\n\n/** FaImage 的运行时事件定义。 */\nexport const faImageEmits = {\n\t...imageEmits,\n};\n\n/** FaImage 的插槽参数 */\nexport interface FaImageSlots extends Record<string, unknown> {\n\t/** 当图像尚未加载时,自定义的占位符内容 */\n\tplaceholder: never;\n\t/** 自定义图像加载失败的内容 */\n\terror: never;\n\t/** 当图像预览时自定义内容 */\n\tviewer: { src?: string };\n\t/** 图片预览进度内容 */\n\tprogress: { activeIndex: number; total: number };\n\t/** 图片预览工具栏内容 */\n\ttoolbar: {\n\t\tactions: (action: ImageViewerAction, options?: Record<string, never>) => void;\n\t\tprev: () => void;\n\t\tnext: () => void;\n\t\treset: () => void;\n\t\tactiveIndex: number;\n\t\tsetActiveItem: (index: number) => void;\n\t};\n\t/** 图片预览加载失败内容 */\n\t\"viewer-error\": { activeIndex: number; src: string };\n}\n\nexport default defineComponent({\n\tname: \"FaImage\",\n\tprops: faImageProps,\n\temits: faImageEmits,\n\tslots: makeSlots<FaImageSlots>(),\n\tsetup(props, { slots, emit, expose }) {\n\t\tconst imageRef = shallowRef<ImageInstance | null>(null);\n\n\t\tconst state = reactive({\n\t\t\t/** 图片加载错误 */\n\t\t\tloadError: false,\n\t\t\tsrc: computed(() => {\n\t\t\t\tif (!props.src) return undefined;\n\t\t\t\tif (props.base64) {\n\t\t\t\t\treturn `data:image/png;base64,${props.src}`;\n\t\t\t\t} else if (props.original || state.loadError) {\n\t\t\t\t\treturn props.src;\n\t\t\t\t} else if (props.normal) {\n\t\t\t\t\treturn `${props.src}@!normal`;\n\t\t\t\t} else if (props.small) {\n\t\t\t\t\treturn `${props.src}@!small`;\n\t\t\t\t} else if (props.thumb) {\n\t\t\t\t\treturn `${props.src}@!thumb`;\n\t\t\t\t} else {\n\t\t\t\t\t// 默认使用缩略图\n\t\t\t\t\treturn `${props.src}@!thumb`;\n\t\t\t\t}\n\t\t\t}),\n\t\t\tpreviewList: computed(() => (props.preview && props.src ? [props.base64 ? `data:image/png;base64,${props.src}` : props.src] : [])),\n\t\t});\n\t\twatch(\n\t\t\t() => props.src,\n\t\t\t() => {\n\t\t\t\tstate.loadError = false;\n\t\t\t}\n\t\t);\n\n\t\t// eslint-disable-next-line @typescript-eslint/no-deprecated -- 透传范围必须与继承的 Element Plus 2.x 运行时 props 保持一致。\n\t\tconst bindProps = useProps(props, imageProps, [\"src\", \"previewSrcList\"]);\n\t\tconst bindEmits = useEmits(imageEmits, emit, [\"error\"]);\n\n\t\tuseRender(() => (\n\t\t\t<ElImage\n\t\t\t\t{...bindProps.value}\n\t\t\t\t{...bindEmits.value}\n\t\t\t\tclass=\"fa-image\"\n\t\t\t\tref={imageRef}\n\t\t\t\tsrc={state.src}\n\t\t\t\tpreviewSrcList={state.previewList}\n\t\t\t\tonError={(event) => {\n\t\t\t\t\tstate.loadError ||= true;\n\t\t\t\t\temit(\"error\", event);\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{{\n\t\t\t\t\terror: () =>\n\t\t\t\t\t\tslots.error ? (\n\t\t\t\t\t\t\tslots.error()\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<div class=\"fa-image__error-image\">\n\t\t\t\t\t\t\t\t<ElIcon class=\"icon\">\n\t\t\t\t\t\t\t\t\t<ElIconPicture />\n\t\t\t\t\t\t\t\t</ElIcon>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t),\n\t\t\t\t\t...(slots.placeholder && { placeholder: () => slots.placeholder?.() ?? [] }),\n\t\t\t\t\t...(slots.viewer && { viewer: () => slots.viewer?.({ src: state.src }) ?? [] }),\n\t\t\t\t\t...(slots.progress && {\n\t\t\t\t\t\tprogress: (scope: { activeIndex: number; total: number }) => slots.progress?.(scope) ?? [],\n\t\t\t\t\t}),\n\t\t\t\t\t...(slots.toolbar && {\n\t\t\t\t\t\ttoolbar: (scope: FaImageSlots[\"toolbar\"]) => slots.toolbar?.(scope) ?? [],\n\t\t\t\t\t}),\n\t\t\t\t\t...(slots[\"viewer-error\"] && {\n\t\t\t\t\t\t\"viewer-error\": (scope: { activeIndex: number; src: string }) => slots[\"viewer-error\"]?.(scope) ?? [],\n\t\t\t\t\t}),\n\t\t\t\t}}\n\t\t\t</ElImage>\n\t\t));\n\n\t\treturn useExpose(expose, {\n\t\t\t/** 手动打开图片预览。 */\n\t\t\tshowPreview: computed(() => imageRef.value?.showPreview),\n\t\t});\n\t},\n});\n"],"mappings":";;;;;;;;;;AAOA,MAAa,eAAe;CAE3B,GAAG;;CAEH,kBAAkB;EACjB,MAAM;EACN,SAAS;CACV;;CAEA,mBAAmB;EAClB,MAAM;EACN,SAAS;CACV;;CAEA,MAAM;EACL,MAAM;EACN,SAAS;CACV;;CAEA,QAAQ;;CAER,UAAU;;CAEV,QAAQ;;CAER,OAAO;;CAEP,OAAO;;CAEP,SAAS;EACR,MAAM;EACN,SAAS;CACV;AACD;;AAGA,MAAa,eAAe,EAC3B,GAAG,WACJ;AAyBA,IAAA,gBAAe,gBAAgB;CAC9B,MAAM;CACN,OAAO;CACP,OAAO;CACP,OAAO,UAAwB;CAC/B,MAAM,OAAO,EAAE,OAAO,MAAM,UAAU;EACrC,MAAM,WAAW,WAAiC,IAAI;EAEtD,MAAM,QAAQ,SAAS;;GAEtB,WAAW;GACX,KAAK,eAAe;IACnB,IAAI,CAAC,MAAM,KAAK,OAAO,KAAA;IACvB,IAAI,MAAM,QACT,OAAO,yBAAyB,MAAM;SAChC,IAAI,MAAM,YAAY,MAAM,WAClC,OAAO,MAAM;SACP,IAAI,MAAM,QAChB,OAAO,GAAG,MAAM,IAAG;SACb,IAAI,MAAM,OAChB,OAAO,GAAG,MAAM,IAAG;SACb,IAAI,MAAM,OAChB,OAAO,GAAG,MAAM,IAAG;SAGnB,OAAO,GAAG,MAAM,IAAG;GAErB,CAAC;GACD,aAAa,eAAgB,MAAM,WAAW,MAAM,MAAM,CAAC,MAAM,SAAS,yBAAyB,MAAM,QAAQ,MAAM,GAAG,IAAI,CAAA,CAAG;EAClI,CAAC;EACD,YACO,MAAM,WACN;GACL,MAAM,YAAY;EACnB,CACD;EAGA,MAAM,YAAY,SAAS,OAAO,YAAY,CAAC,OAAO,gBAAgB,CAAC;EACvE,MAAM,YAAY,SAAS,YAAY,MAAM,CAAC,OAAO,CAAC;EAEtD,gBAAU,YAAA,SAAA,WAEJ,UAAU,OACV,UAAU,OAAK;GAAA,SAAA;GAAA,OAEd;GAAQ,OACR,MAAM;GAAG,kBACE,MAAM;GAAW,YACvB,UAAU;IACnB,MAAM,cAAc;IACpB,KAAK,SAAS,KAAK;GACpB;EAAC,CAAA,GAAA;GAGA,aACC,MAAM,QACL,MAAM,MAAM,IAAC,YAAA,OAAA,EAAA,SAAA,wBAAA,GAAA,CAAA,YAAA,QAAA,EAAA,SAAA,OAAA,GAAA,EAAA,eAAA,CAAA,YAAA,SAAA,MAAA,IAAA,CAAA,EAAA,CAAA,CAAA,CAAA;GAQf,GAAI,MAAM,eAAe,EAAE,mBAAmB,MAAM,cAAc,KAAK,CAAA,EAAG;GAC1E,GAAI,MAAM,UAAU,EAAE,cAAc,MAAM,SAAS,EAAE,KAAK,MAAM,IAAI,CAAC,KAAK,CAAA,EAAG;GAC7E,GAAI,MAAM,YAAY,EACrB,WAAW,UAAkD,MAAM,WAAW,KAAK,KAAK,CAAA,EACzF;GACA,GAAI,MAAM,WAAW,EACpB,UAAU,UAAmC,MAAM,UAAU,KAAK,KAAK,CAAA,EACxE;GACA,GAAI,MAAM,mBAAmB,EAC5B,iBAAiB,UAAgD,MAAM,eAAe,GAAG,KAAK,KAAK,CAAA,EACpG;EAAE,CAAA,CAGJ;EAED,OAAO,UAAU,QAAQ;;AAExB,aAAa,eAAe,SAAS,OAAO,WAAW,EACxD,CAAC;CACF;AACD,CAAC"}
|