cd-icon-picker 1.0.0 → 1.1.0
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/package.json +2 -2
- package/src/IconPicker.vue +17 -8
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "cd-icon-picker",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.1.0",
|
|
4
4
|
"description": "Vue 3 icon picker supporting TDesign & RemixIcon, with custom SVG via :diy-icon.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
@@ -26,4 +26,4 @@
|
|
|
26
26
|
"remixicon",
|
|
27
27
|
"svg"
|
|
28
28
|
]
|
|
29
|
-
}
|
|
29
|
+
}
|
package/src/IconPicker.vue
CHANGED
|
@@ -15,7 +15,8 @@
|
|
|
15
15
|
</template>
|
|
16
16
|
</t-input>
|
|
17
17
|
|
|
18
|
-
<
|
|
18
|
+
<teleport to="body">
|
|
19
|
+
<t-dialog v-model:visible="visible" width="960px" :close-on-esc-keydown="true" :close-on-overlay-click="true" @confirm="handleConfirm" @cancel="handleCancel">
|
|
19
20
|
<template #header>
|
|
20
21
|
<div class="cd-picker-header">
|
|
21
22
|
<span style="font-size: 14px;font-weight: normal;">当前图标：</span>
|
|
@@ -76,7 +77,8 @@
|
|
|
76
77
|
</div>
|
|
77
78
|
</div>
|
|
78
79
|
</div>
|
|
79
|
-
|
|
80
|
+
</t-dialog>
|
|
81
|
+
</teleport>
|
|
80
82
|
</div>
|
|
81
83
|
</template>
|
|
82
84
|
<script lang="ts" setup>
|
|
@@ -223,12 +225,6 @@ function handleClick(icon: string) {
|
|
|
223
225
|
if (props.copy && navigator?.clipboard) {
|
|
224
226
|
navigator.clipboard.writeText(icon).catch(() => {});
|
|
225
227
|
}
|
|
226
|
-
if (sourceType.value === 'tdesign') emit('update:tdesign', icon);
|
|
227
|
-
else if (sourceType.value === 'remix') emit('update:remixicon', icon);
|
|
228
|
-
else emit('update:svg', icon);
|
|
229
|
-
|
|
230
|
-
emit('update:value', icon);
|
|
231
|
-
emit('change', sourceType.value as any, icon as any);
|
|
232
228
|
}
|
|
233
229
|
|
|
234
230
|
let timer: any = null;
|
|
@@ -249,10 +245,23 @@ function handleOpen() {
|
|
|
249
245
|
|
|
250
246
|
function handleConfirm() {
|
|
251
247
|
visible.value = false;
|
|
248
|
+
const icon = currentSelect.value;
|
|
249
|
+
if (!icon) return;
|
|
250
|
+
if (sourceType.value === 'tdesign') emit('update:tdesign', icon);
|
|
251
|
+
else if (sourceType.value === 'remix') emit('update:remixicon', icon);
|
|
252
|
+
else emit('update:svg', icon);
|
|
253
|
+
|
|
254
|
+
emit('update:value', icon);
|
|
255
|
+
emit('change', sourceType.value as any, icon as any);
|
|
252
256
|
}
|
|
253
257
|
|
|
254
258
|
function handleCancel() {
|
|
255
259
|
visible.value = false;
|
|
260
|
+
let v = props.value || '';
|
|
261
|
+
if (sourceType.value === 'remix' && v && !/-line$|-fill$/.test(v)) {
|
|
262
|
+
v = v + (styleType.value === 'filled' ? '-fill' : '-line');
|
|
263
|
+
}
|
|
264
|
+
currentSelect.value = v;
|
|
256
265
|
}
|
|
257
266
|
|
|
258
267
|
watch(
|