@veltra/desktop 1.8.2 → 1.8.4
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/dist/components/action/action-group.js.map +1 -1
- package/dist/components/action/action-group.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/action/action.js.map +1 -1
- package/dist/components/auto-complete/auto-complete.js.map +1 -1
- package/dist/components/badge/badge.js.map +1 -1
- package/dist/components/batch-edit/batch-edit-form.js.map +1 -1
- package/dist/components/batch-edit/batch-edit-list.js.map +1 -1
- package/dist/components/batch-edit/batch-edit.js.map +1 -1
- package/dist/components/breadcrumb/breadcrumb.js.map +1 -1
- package/dist/components/button/button-group.js.map +1 -1
- package/dist/components/button/button.js.map +1 -1
- package/dist/components/calendar/calendar.js.map +1 -1
- package/dist/components/card/card-action.js.map +1 -1
- package/dist/components/card/card-content.js.map +1 -1
- package/dist/components/card/card-cover.js.map +1 -1
- package/dist/components/card/card-header.js.map +1 -1
- package/dist/components/card/card.js.map +1 -1
- package/dist/components/cascade/cascade-panel-item.js.map +1 -1
- package/dist/components/cascade/cascade.js +1 -0
- package/dist/components/cascade/cascade.js.map +1 -1
- package/dist/components/cascade/use-select.js +6 -2
- package/dist/components/cascade/use-select.js.map +1 -1
- package/dist/components/check-tag/check-tag.js.map +1 -1
- package/dist/components/checkbox/checkbox-button.js.map +1 -1
- package/dist/components/checkbox/checkbox.js.map +1 -1
- package/dist/components/checkbox-group/checkbox-group.js.map +1 -1
- package/dist/components/code-editor/code-editor.js.map +1 -1
- package/dist/components/collapse/collapse-item.js.map +1 -1
- package/dist/components/collapse/collapse.js.map +1 -1
- package/dist/components/condition-editor/components/condition-group.js.map +1 -1
- package/dist/components/condition-editor/components/condition-row.js.map +1 -1
- package/dist/components/condition-editor/condition-editor.js.map +1 -1
- package/dist/components/contextmenu/contextmenu-item.js.map +1 -1
- package/dist/components/contextmenu/contextmenu-panel.js.map +1 -1
- package/dist/components/contextmenu/contextmenu-sub.js.map +1 -1
- package/dist/components/contextmenu/contextmenu.js.map +1 -1
- package/dist/components/date-panel/date-panel.js.map +1 -1
- package/dist/components/date-panel/headers/day.js.map +1 -1
- package/dist/components/date-panel/headers/month.js.map +1 -1
- package/dist/components/date-panel/headers/year.js.map +1 -1
- package/dist/components/date-panel/panels/day.js.map +1 -1
- package/dist/components/date-panel/panels/month.js.map +1 -1
- package/dist/components/date-panel/panels/year.js.map +1 -1
- package/dist/components/date-picker/date-picker.js.map +1 -1
- package/dist/components/date-range-picker/date-range-picker.js.map +1 -1
- package/dist/components/dialog/dialog.js.map +1 -1
- package/dist/components/drawer/drawer.js.map +1 -1
- package/dist/components/dropdown/dropdown.js.map +1 -1
- package/dist/components/dual-nav/dual-nav-app.js.map +1 -1
- package/dist/components/dual-nav/dual-nav.js.map +1 -1
- package/dist/components/empty/empty.js.map +1 -1
- package/dist/components/expression-editor/components/path-preview.js.map +1 -1
- package/dist/components/expression-editor/components/variable-picker.js.map +1 -1
- package/dist/components/expression-editor/expression-editor.js.map +1 -1
- package/dist/components/file-picker/file-picker.js.map +1 -1
- package/dist/components/file-viewer/file-viewer.js.map +1 -1
- package/dist/components/file-viewer/previewers/docx-previewer.js.map +1 -1
- package/dist/components/file-viewer/previewers/image-previewer.js.map +1 -1
- package/dist/components/file-viewer/previewers/ofd-previewer.js.map +1 -1
- package/dist/components/file-viewer/previewers/pdf-previewer.js.map +1 -1
- package/dist/components/file-viewer/previewers/pdf-viewport-scroll.js.map +1 -1
- package/dist/components/file-viewer/previewers/pdf-zoom-bridge.js.map +1 -1
- package/dist/components/file-viewer/previewers/sheet-previewer.js.map +1 -1
- package/dist/components/file-viewer/previewers/text-previewer.js.map +1 -1
- package/dist/components/file-viewer/previewers/video-previewer.js.map +1 -1
- package/dist/components/float-button/float-button.js.map +1 -1
- package/dist/components/form/form.js.map +1 -1
- package/dist/components/form/form.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/form-item/form-item.js.map +1 -1
- package/dist/components/form-item/form-item.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/gantt-chart/gantt-chart.js.map +1 -1
- package/dist/components/grid/grid-item.js.map +1 -1
- package/dist/components/grid/grid.js.map +1 -1
- package/dist/components/grid-input/grid-input.js.map +1 -1
- package/dist/components/group-input/group-input.js.map +1 -1
- package/dist/components/group-nav/group-nav-item.js.map +1 -1
- package/dist/components/group-nav/group-nav.js.map +1 -1
- package/dist/components/icon/icon.js.map +1 -1
- package/dist/components/image-cropper/image-cropper.js.map +1 -1
- package/dist/components/input/input.js.map +1 -1
- package/dist/components/input/input.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/kanban/kanban-column.js.map +1 -1
- package/dist/components/kanban/kanban.js.map +1 -1
- package/dist/components/kbd/kbd.js.map +1 -1
- package/dist/components/layout/layout-resizer.js.map +1 -1
- package/dist/components/layout/layout.js.map +1 -1
- package/dist/components/list/list-item.js.map +1 -1
- package/dist/components/list/list.js.map +1 -1
- package/dist/components/loading/loading.js.map +1 -1
- package/dist/components/message/message-box.js.map +1 -1
- package/dist/components/message/message.js.map +1 -1
- package/dist/components/message-confirm/message-confirm-box.js.map +1 -1
- package/dist/components/message-confirm/message-confirm.js.map +1 -1
- package/dist/components/multi-select/multi-select-option.js.map +1 -1
- package/dist/components/multi-select/multi-select.js.map +1 -1
- package/dist/components/multi-tree-select/multi-tree-select.js.map +1 -1
- package/dist/components/nav/nav-icon.js.map +1 -1
- package/dist/components/nav/nav-item-collapsed.js.map +1 -1
- package/dist/components/nav/nav-item.js.map +1 -1
- package/dist/components/nav/nav-sub-collapsed.js.map +1 -1
- package/dist/components/nav/nav-sub.js.map +1 -1
- package/dist/components/nav/nav.js.map +1 -1
- package/dist/components/notification/notification-box.js.map +1 -1
- package/dist/components/notification/notification.js.map +1 -1
- package/dist/components/number/number.js.map +1 -1
- package/dist/components/number-input/number-input.js.map +1 -1
- package/dist/components/number-range-input/number-range-input.js.map +1 -1
- package/dist/components/paginator/paginator.js.map +1 -1
- package/dist/components/palette/palette-alpha.js.map +1 -1
- package/dist/components/palette/palette-color-switch.js.map +1 -1
- package/dist/components/palette/palette-hue.js.map +1 -1
- package/dist/components/palette/palette-sv.js.map +1 -1
- package/dist/components/palette/palette.js.map +1 -1
- package/dist/components/password-input/password-input.js.map +1 -1
- package/dist/components/pop-confirm/pop-confirm.js.map +1 -1
- package/dist/components/progress/progress.js.map +1 -1
- package/dist/components/progress-nodes/progress-nodes.js.map +1 -1
- package/dist/components/radio/radio.js.map +1 -1
- package/dist/components/radio-group/radio-group.js.map +1 -1
- package/dist/components/rich-text-editor/image-node.js +53 -14
- package/dist/components/rich-text-editor/image-node.js.map +1 -1
- package/dist/components/rich-text-editor/rich-text-editor.js +9 -3
- package/dist/components/rich-text-editor/rich-text-editor.js.map +1 -1
- package/dist/components/rich-text-editor/style2.css +31 -0
- package/dist/components/rich-text-editor/toolbar.js.map +1 -1
- package/dist/components/rich-text-editor/use-image-resize.js +118 -0
- package/dist/components/rich-text-editor/use-image-resize.js.map +1 -0
- package/dist/components/scroll/scroll-bar.js.map +1 -1
- package/dist/components/scroll/scroll.js.map +1 -1
- package/dist/components/segment/segment.js.map +1 -1
- package/dist/components/select/select.js +9 -5
- package/dist/components/select/select.js.map +1 -1
- package/dist/components/slider/slider-thumb.js.map +1 -1
- package/dist/components/slider/slider.js.map +1 -1
- package/dist/components/steps/steps.js.map +1 -1
- package/dist/components/switch/switch.js.map +1 -1
- package/dist/components/table/table-body.js.map +1 -1
- package/dist/components/table/table-cell.js.map +1 -1
- package/dist/components/table/table-foot.js.map +1 -1
- package/dist/components/table/table-head.js.map +1 -1
- package/dist/components/table/table-row.js.map +1 -1
- package/dist/components/table/table.js.map +1 -1
- package/dist/components/table-editor/table-editor.js.map +1 -1
- package/dist/components/tabs/tabs-horizontal.js.map +1 -1
- package/dist/components/tabs/tabs-vertical.js.map +1 -1
- package/dist/components/tabs/tabs.js.map +1 -1
- package/dist/components/tag/tag.js.map +1 -1
- package/dist/components/text/text.js.map +1 -1
- package/dist/components/textarea/textarea.js.map +1 -1
- package/dist/components/theme/theme.js.map +1 -1
- package/dist/components/tip/tip.js.map +1 -1
- package/dist/components/tree/tree-node.js.map +1 -1
- package/dist/components/tree/tree.js.map +1 -1
- package/dist/components/tree-select/tree-select.js +19 -10
- package/dist/components/tree-select/tree-select.js.map +1 -1
- package/dist/components/watermark/watermark.js.map +1 -1
- package/dist/types/cascade.d.ts +5 -0
- package/dist/types/select.d.ts +8 -2
- package/dist/types/tree-select.d.ts +8 -2
- package/package.json +18 -18
- package/src/components/batch-edit/__test__/batch-edit.test.ts +1 -1
- package/src/components/button/__test__/button.test.ts +1 -1
- package/src/components/cascade/__test__/cascade.test.ts +26 -1
- package/src/components/cascade/use-select.ts +5 -5
- package/src/components/collapse/__test__/collapse.test.ts +1 -1
- package/src/components/condition-editor/__test__/condition-editor.test.ts +1 -1
- package/src/components/contextmenu/__test__/contextmenu.test.ts +1 -1
- package/src/components/date-picker/__test__/date-picker.test.ts +1 -1
- package/src/components/date-range-picker/__test__/date-range-picker.test.ts +1 -1
- package/src/components/drawer/__test__/drawer.test.ts +1 -1
- package/src/components/expression-editor/__test__/chip.test.ts +1 -1
- package/src/components/expression-editor/__test__/editor.test.ts +1 -1
- package/src/components/expression-editor/__test__/expression-editor.test.ts +1 -1
- package/src/components/expression-editor/__test__/mention.test.ts +1 -1
- package/src/components/expression-editor/__test__/model.test.ts +1 -1
- package/src/components/file-viewer/__test__/helper.test.ts +1 -1
- package/src/components/form/__test__/form.test.ts +1 -1
- package/src/components/form/__test__/is-field-modified.test.ts +1 -1
- package/src/components/form-item/__test__/form-item.test.ts +1 -1
- package/src/components/image-cropper/__test__/draw-crop.test.ts +1 -1
- package/src/components/image-cropper/__test__/image-cropper.test.ts +1 -1
- package/src/components/image-cropper/__test__/use-transform.test.ts +1 -1
- package/src/components/kanban/__test__/kanban.test.ts +1 -1
- package/src/components/message-confirm/__test__/message-confirm.test.ts +1 -1
- package/src/components/multi-tree-select/__test__/multi-tree-select.test.ts +1 -1
- package/src/components/number-input/__test__/number-input.test.ts +1 -1
- package/src/components/number-range-input/__test__/number-range-input.test.ts +1 -1
- package/src/components/palette/__test__/color-transform.test.ts +1 -1
- package/src/components/palette/__test__/palette.test.ts +1 -1
- package/src/components/password-input/__test__/password-input.test.ts +1 -1
- package/src/components/radio-group/__test__/radio-group.test.ts +1 -1
- package/src/components/rich-text-editor/__test__/image-node.test.ts +140 -0
- package/src/components/rich-text-editor/image-node.ts +84 -15
- package/src/components/rich-text-editor/rich-text-editor.vue +15 -4
- package/src/components/rich-text-editor/style.scss +35 -0
- package/src/components/rich-text-editor/use-image-resize.ts +168 -0
- package/src/components/segment/__test__/segment.test.ts +1 -1
- package/src/components/select/__test__/select.test.ts +68 -1
- package/src/components/select/select.vue +15 -5
- package/src/components/table/__test__/col-width.test.ts +1 -1
- package/src/components/table/__test__/column-style.test.ts +1 -1
- package/src/components/table-editor/__test__/table-editor.test.ts +1 -1
- package/src/components/tree-select/__test__/tree-select.test.ts +50 -1
- package/src/components/tree-select/tree-select.vue +28 -11
- package/src/types/cascade.ts +5 -0
- package/src/types/select.ts +8 -2
- package/src/types/tree-select.ts +9 -2
|
@@ -0,0 +1,118 @@
|
|
|
1
|
+
import { $isImageNode } from "./image-node.js";
|
|
2
|
+
import { onBeforeUnmount, watch } from "vue";
|
|
3
|
+
import { $createNodeSelection, $getNodeByKey, $getSelection, $isNodeSelection, $setSelection, CLICK_COMMAND, COMMAND_PRIORITY_HIGH, KEY_ESCAPE_COMMAND } from "lexical";
|
|
4
|
+
//#region src/components/rich-text-editor/use-image-resize.ts
|
|
5
|
+
const WRAP_SELECTOR = "[data-rte-image-key]";
|
|
6
|
+
const HANDLE_SELECTOR = ".u-rte-image-resizer";
|
|
7
|
+
const MIN_WIDTH = 24;
|
|
8
|
+
const captureOptions = { capture: true };
|
|
9
|
+
function swallowClick(event) {
|
|
10
|
+
event.preventDefault();
|
|
11
|
+
event.stopPropagation();
|
|
12
|
+
}
|
|
13
|
+
/**
|
|
14
|
+
* 图片选中与拖拽缩放(参考 Lexical playground ImagesPlugin / ImageResizer):
|
|
15
|
+
* - 点击图片设置 NodeSelection 并标记选中态(wrapper 加 is-selected)
|
|
16
|
+
* - 拖拽右下角手柄等比缩放,实时改写 img 内联尺寸,松手时写入节点
|
|
17
|
+
* - Esc 取消选中;Backspace / Delete 删除走 Lexical 原生 NodeSelection 通路
|
|
18
|
+
* 选中态在每次 editor 更新后重放,避免撤销 / 内容重设后 class 失效。
|
|
19
|
+
*/
|
|
20
|
+
function useImageResize(editor, canEdit) {
|
|
21
|
+
let selectedKey = null;
|
|
22
|
+
let cleanupFns = [];
|
|
23
|
+
function syncSelectionClass(ed) {
|
|
24
|
+
const root = ed.getRootElement();
|
|
25
|
+
if (!root) return;
|
|
26
|
+
root.querySelectorAll(".u-rte-image-wrap.is-selected").forEach((element) => {
|
|
27
|
+
element.classList.remove("is-selected");
|
|
28
|
+
});
|
|
29
|
+
if (selectedKey) ed.getElementByKey(selectedKey)?.classList.add("is-selected");
|
|
30
|
+
}
|
|
31
|
+
function setup(ed) {
|
|
32
|
+
cleanupFns.push(ed.registerCommand(CLICK_COMMAND, (event) => {
|
|
33
|
+
if (!canEdit()) return false;
|
|
34
|
+
const key = event.target.closest?.(WRAP_SELECTOR)?.getAttribute("data-rte-image-key");
|
|
35
|
+
if (!key) return false;
|
|
36
|
+
event.preventDefault();
|
|
37
|
+
ed.update(() => {
|
|
38
|
+
if (!$isImageNode($getNodeByKey(key))) return;
|
|
39
|
+
const selection = $createNodeSelection();
|
|
40
|
+
selection.add(key);
|
|
41
|
+
$setSelection(selection);
|
|
42
|
+
});
|
|
43
|
+
return true;
|
|
44
|
+
}, COMMAND_PRIORITY_HIGH), ed.registerCommand(KEY_ESCAPE_COMMAND, () => {
|
|
45
|
+
if (!selectedKey) return false;
|
|
46
|
+
ed.update(() => {
|
|
47
|
+
if ($isNodeSelection($getSelection())) $setSelection(null);
|
|
48
|
+
});
|
|
49
|
+
return true;
|
|
50
|
+
}, COMMAND_PRIORITY_HIGH), ed.registerUpdateListener(({ editorState }) => {
|
|
51
|
+
editorState.read(() => {
|
|
52
|
+
const selection = $getSelection();
|
|
53
|
+
selectedKey = $isNodeSelection(selection) ? selection.getNodes().find($isImageNode)?.getKey() ?? null : null;
|
|
54
|
+
});
|
|
55
|
+
syncSelectionClass(ed);
|
|
56
|
+
}));
|
|
57
|
+
const root = ed.getRootElement();
|
|
58
|
+
if (!root) return;
|
|
59
|
+
const onPointerDown = (event) => {
|
|
60
|
+
if (!canEdit() || event.button !== 0) return;
|
|
61
|
+
const wrapper = (event.target.closest?.(HANDLE_SELECTOR))?.closest(WRAP_SELECTOR);
|
|
62
|
+
const img = wrapper?.querySelector("img");
|
|
63
|
+
if (!wrapper || !img) return;
|
|
64
|
+
event.preventDefault();
|
|
65
|
+
const key = wrapper.getAttribute("data-rte-image-key");
|
|
66
|
+
const style = getComputedStyle(root);
|
|
67
|
+
const maxWidth = root.clientWidth - parseFloat(style.paddingLeft) - parseFloat(style.paddingRight);
|
|
68
|
+
const ratio = img.clientHeight / img.clientWidth;
|
|
69
|
+
const startX = event.clientX;
|
|
70
|
+
const startWidth = img.clientWidth;
|
|
71
|
+
try {
|
|
72
|
+
root.setPointerCapture(event.pointerId);
|
|
73
|
+
} catch {}
|
|
74
|
+
const onPointerMove = (moveEvent) => {
|
|
75
|
+
const width = Math.min(maxWidth, Math.max(MIN_WIDTH, Math.round(startWidth + moveEvent.clientX - startX)));
|
|
76
|
+
img.style.width = `${width}px`;
|
|
77
|
+
img.style.height = `${Math.round(width * ratio)}px`;
|
|
78
|
+
};
|
|
79
|
+
const finish = (upEvent) => {
|
|
80
|
+
root.removeEventListener("pointermove", onPointerMove);
|
|
81
|
+
root.removeEventListener("pointerup", finish);
|
|
82
|
+
root.removeEventListener("pointercancel", finish);
|
|
83
|
+
if (root.hasPointerCapture(upEvent.pointerId)) root.releasePointerCapture(upEvent.pointerId);
|
|
84
|
+
root.addEventListener("click", swallowClick, {
|
|
85
|
+
capture: true,
|
|
86
|
+
once: true
|
|
87
|
+
});
|
|
88
|
+
setTimeout(() => root.removeEventListener("click", swallowClick, captureOptions), 0);
|
|
89
|
+
if (!key) return;
|
|
90
|
+
ed.update(() => {
|
|
91
|
+
const node = $getNodeByKey(key);
|
|
92
|
+
if (!$isImageNode(node)) return;
|
|
93
|
+
node.setWidthAndHeight(img.clientWidth, img.clientHeight);
|
|
94
|
+
const selection = $createNodeSelection();
|
|
95
|
+
selection.add(key);
|
|
96
|
+
$setSelection(selection);
|
|
97
|
+
});
|
|
98
|
+
};
|
|
99
|
+
root.addEventListener("pointermove", onPointerMove);
|
|
100
|
+
root.addEventListener("pointerup", finish);
|
|
101
|
+
root.addEventListener("pointercancel", finish);
|
|
102
|
+
};
|
|
103
|
+
root.addEventListener("pointerdown", onPointerDown);
|
|
104
|
+
cleanupFns.push(() => root.removeEventListener("pointerdown", onPointerDown));
|
|
105
|
+
}
|
|
106
|
+
watch(editor, (ed) => {
|
|
107
|
+
if (ed) setup(ed);
|
|
108
|
+
}, { immediate: true });
|
|
109
|
+
onBeforeUnmount(() => {
|
|
110
|
+
cleanupFns.forEach((fn) => fn());
|
|
111
|
+
cleanupFns = [];
|
|
112
|
+
selectedKey = null;
|
|
113
|
+
});
|
|
114
|
+
}
|
|
115
|
+
//#endregion
|
|
116
|
+
export { useImageResize };
|
|
117
|
+
|
|
118
|
+
//# sourceMappingURL=use-image-resize.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"use-image-resize.js","names":[],"sources":["../../../src/components/rich-text-editor/use-image-resize.ts"],"sourcesContent":["import {\n $createNodeSelection,\n $getNodeByKey,\n $getSelection,\n $isNodeSelection,\n $setSelection,\n CLICK_COMMAND,\n COMMAND_PRIORITY_HIGH,\n KEY_ESCAPE_COMMAND,\n type LexicalEditor\n} from 'lexical'\nimport { onBeforeUnmount, type ShallowRef, watch } from 'vue'\n\nimport { $isImageNode } from './image-node'\n\nconst WRAP_SELECTOR = '[data-rte-image-key]'\nconst HANDLE_SELECTOR = '.u-rte-image-resizer'\nconst MIN_WIDTH = 24\n\nconst captureOptions = { capture: true } as AddEventListenerOptions\n\nfunction swallowClick(event: Event): void {\n event.preventDefault()\n event.stopPropagation()\n}\n\n/**\n * 图片选中与拖拽缩放(参考 Lexical playground ImagesPlugin / ImageResizer):\n * - 点击图片设置 NodeSelection 并标记选中态(wrapper 加 is-selected)\n * - 拖拽右下角手柄等比缩放,实时改写 img 内联尺寸,松手时写入节点\n * - Esc 取消选中;Backspace / Delete 删除走 Lexical 原生 NodeSelection 通路\n * 选中态在每次 editor 更新后重放,避免撤销 / 内容重设后 class 失效。\n */\nexport function useImageResize(\n editor: ShallowRef<LexicalEditor | null>,\n canEdit: () => boolean\n): void {\n let selectedKey: string | null = null\n let cleanupFns: (() => void)[] = []\n\n function syncSelectionClass(ed: LexicalEditor) {\n const root = ed.getRootElement()\n if (!root) return\n root.querySelectorAll('.u-rte-image-wrap.is-selected').forEach((element) => {\n element.classList.remove('is-selected')\n })\n if (selectedKey) ed.getElementByKey(selectedKey)?.classList.add('is-selected')\n }\n\n function setup(ed: LexicalEditor) {\n cleanupFns.push(\n ed.registerCommand(\n CLICK_COMMAND,\n (event) => {\n if (!canEdit()) return false\n const key = (event.target as HTMLElement)\n .closest?.(WRAP_SELECTOR)\n ?.getAttribute('data-rte-image-key')\n if (!key) return false\n event.preventDefault()\n ed.update(() => {\n if (!$isImageNode($getNodeByKey(key))) return\n const selection = $createNodeSelection()\n selection.add(key)\n $setSelection(selection)\n })\n return true\n },\n COMMAND_PRIORITY_HIGH\n ),\n ed.registerCommand(\n KEY_ESCAPE_COMMAND,\n () => {\n if (!selectedKey) return false\n ed.update(() => {\n if ($isNodeSelection($getSelection())) $setSelection(null)\n })\n return true\n },\n COMMAND_PRIORITY_HIGH\n ),\n ed.registerUpdateListener(({ editorState }) => {\n editorState.read(() => {\n const selection = $getSelection()\n selectedKey = $isNodeSelection(selection)\n ? (selection.getNodes().find($isImageNode)?.getKey() ?? null)\n : null\n })\n syncSelectionClass(ed)\n })\n )\n\n const root = ed.getRootElement()\n if (!root) return\n\n const onPointerDown = (event: PointerEvent) => {\n if (!canEdit() || event.button !== 0) return\n const handle = (event.target as HTMLElement).closest?.(HANDLE_SELECTOR)\n const wrapper = handle?.closest(WRAP_SELECTOR)\n const img = wrapper?.querySelector('img')\n if (!wrapper || !img) return\n event.preventDefault()\n\n const key = wrapper.getAttribute('data-rte-image-key')\n const style = getComputedStyle(root)\n const maxWidth =\n root.clientWidth - parseFloat(style.paddingLeft) - parseFloat(style.paddingRight)\n const ratio = img.clientHeight / img.clientWidth\n const startX = event.clientX\n const startWidth = img.clientWidth\n // 真实输入下捕获指针保证拖出编辑区仍可跟踪;合成事件(自动化测试)无活跃\n // 指针,setPointerCapture 会抛 NotFoundError,降级为仅监听 root 内移动\n try {\n root.setPointerCapture(event.pointerId)\n } catch {\n // ignore\n }\n\n const onPointerMove = (moveEvent: PointerEvent) => {\n const width = Math.min(\n maxWidth,\n Math.max(MIN_WIDTH, Math.round(startWidth + moveEvent.clientX - startX))\n )\n img.style.width = `${width}px`\n img.style.height = `${Math.round(width * ratio)}px`\n }\n const finish = (upEvent: PointerEvent) => {\n root.removeEventListener('pointermove', onPointerMove)\n root.removeEventListener('pointerup', finish)\n root.removeEventListener('pointercancel', finish)\n if (root.hasPointerCapture(upEvent.pointerId)) root.releasePointerCapture(upEvent.pointerId)\n // pointer capture 使松手 target 落在编辑区内,浏览器随派发的 click 会把\n // 图片选中换成文本光标;吞掉这次拖拽尾随的 click\n root.addEventListener('click', swallowClick, { capture: true, once: true })\n setTimeout(() => root.removeEventListener('click', swallowClick, captureOptions), 0)\n if (!key) return\n ed.update(() => {\n const node = $getNodeByKey(key)\n if (!$isImageNode(node)) return\n node.setWidthAndHeight(img.clientWidth, img.clientHeight)\n // 松手后保持图片选中,方便继续微调或删除\n const selection = $createNodeSelection()\n selection.add(key)\n $setSelection(selection)\n })\n }\n root.addEventListener('pointermove', onPointerMove)\n root.addEventListener('pointerup', finish)\n root.addEventListener('pointercancel', finish)\n }\n root.addEventListener('pointerdown', onPointerDown)\n cleanupFns.push(() => root.removeEventListener('pointerdown', onPointerDown))\n }\n\n watch(\n editor,\n (ed) => {\n if (ed) setup(ed)\n },\n { immediate: true }\n )\n\n onBeforeUnmount(() => {\n cleanupFns.forEach((fn) => fn())\n cleanupFns = []\n selectedKey = null\n })\n}\n"],"mappings":";;;;AAeA,MAAM,gBAAgB;AACtB,MAAM,kBAAkB;AACxB,MAAM,YAAY;AAElB,MAAM,iBAAiB,EAAE,SAAS,KAAK;AAEvC,SAAS,aAAa,OAAoB;CACxC,MAAM,eAAe;CACrB,MAAM,gBAAgB;AACxB;;;;;;;;AASA,SAAgB,eACd,QACA,SACM;CACN,IAAI,cAA6B;CACjC,IAAI,aAA6B,CAAC;CAElC,SAAS,mBAAmB,IAAmB;EAC7C,MAAM,OAAO,GAAG,eAAe;EAC/B,IAAI,CAAC,MAAM;EACX,KAAK,iBAAiB,+BAA+B,CAAC,CAAC,SAAS,YAAY;GAC1E,QAAQ,UAAU,OAAO,aAAa;EACxC,CAAC;EACD,IAAI,aAAa,GAAG,gBAAgB,WAAW,CAAC,EAAE,UAAU,IAAI,aAAa;CAC/E;CAEA,SAAS,MAAM,IAAmB;EAChC,WAAW,KACT,GAAG,gBACD,gBACC,UAAU;GACT,IAAI,CAAC,QAAQ,GAAG,OAAO;GACvB,MAAM,MAAO,MAAM,OAChB,UAAU,aAAa,CAAC,EACvB,aAAa,oBAAoB;GACrC,IAAI,CAAC,KAAK,OAAO;GACjB,MAAM,eAAe;GACrB,GAAG,aAAa;IACd,IAAI,CAAC,aAAa,cAAc,GAAG,CAAC,GAAG;IACvC,MAAM,YAAY,qBAAqB;IACvC,UAAU,IAAI,GAAG;IACjB,cAAc,SAAS;GACzB,CAAC;GACD,OAAO;EACT,GACA,qBACF,GACA,GAAG,gBACD,0BACM;GACJ,IAAI,CAAC,aAAa,OAAO;GACzB,GAAG,aAAa;IACd,IAAI,iBAAiB,cAAc,CAAC,GAAG,cAAc,IAAI;GAC3D,CAAC;GACD,OAAO;EACT,GACA,qBACF,GACA,GAAG,wBAAwB,EAAE,kBAAkB;GAC7C,YAAY,WAAW;IACrB,MAAM,YAAY,cAAc;IAChC,cAAc,iBAAiB,SAAS,IACnC,UAAU,SAAS,CAAC,CAAC,KAAK,YAAY,CAAC,EAAE,OAAO,KAAK,OACtD;GACN,CAAC;GACD,mBAAmB,EAAE;EACvB,CAAC,CACH;EAEA,MAAM,OAAO,GAAG,eAAe;EAC/B,IAAI,CAAC,MAAM;EAEX,MAAM,iBAAiB,UAAwB;GAC7C,IAAI,CAAC,QAAQ,KAAK,MAAM,WAAW,GAAG;GAEtC,MAAM,WADU,MAAM,OAAuB,UAAU,eAAe,EAAA,EAC9C,QAAQ,aAAa;GAC7C,MAAM,MAAM,SAAS,cAAc,KAAK;GACxC,IAAI,CAAC,WAAW,CAAC,KAAK;GACtB,MAAM,eAAe;GAErB,MAAM,MAAM,QAAQ,aAAa,oBAAoB;GACrD,MAAM,QAAQ,iBAAiB,IAAI;GACnC,MAAM,WACJ,KAAK,cAAc,WAAW,MAAM,WAAW,IAAI,WAAW,MAAM,YAAY;GAClF,MAAM,QAAQ,IAAI,eAAe,IAAI;GACrC,MAAM,SAAS,MAAM;GACrB,MAAM,aAAa,IAAI;GAGvB,IAAI;IACF,KAAK,kBAAkB,MAAM,SAAS;GACxC,QAAQ,CAER;GAEA,MAAM,iBAAiB,cAA4B;IACjD,MAAM,QAAQ,KAAK,IACjB,UACA,KAAK,IAAI,WAAW,KAAK,MAAM,aAAa,UAAU,UAAU,MAAM,CAAC,CACzE;IACA,IAAI,MAAM,QAAQ,GAAG,MAAM;IAC3B,IAAI,MAAM,SAAS,GAAG,KAAK,MAAM,QAAQ,KAAK,EAAE;GAClD;GACA,MAAM,UAAU,YAA0B;IACxC,KAAK,oBAAoB,eAAe,aAAa;IACrD,KAAK,oBAAoB,aAAa,MAAM;IAC5C,KAAK,oBAAoB,iBAAiB,MAAM;IAChD,IAAI,KAAK,kBAAkB,QAAQ,SAAS,GAAG,KAAK,sBAAsB,QAAQ,SAAS;IAG3F,KAAK,iBAAiB,SAAS,cAAc;KAAE,SAAS;KAAM,MAAM;IAAK,CAAC;IAC1E,iBAAiB,KAAK,oBAAoB,SAAS,cAAc,cAAc,GAAG,CAAC;IACnF,IAAI,CAAC,KAAK;IACV,GAAG,aAAa;KACd,MAAM,OAAO,cAAc,GAAG;KAC9B,IAAI,CAAC,aAAa,IAAI,GAAG;KACzB,KAAK,kBAAkB,IAAI,aAAa,IAAI,YAAY;KAExD,MAAM,YAAY,qBAAqB;KACvC,UAAU,IAAI,GAAG;KACjB,cAAc,SAAS;IACzB,CAAC;GACH;GACA,KAAK,iBAAiB,eAAe,aAAa;GAClD,KAAK,iBAAiB,aAAa,MAAM;GACzC,KAAK,iBAAiB,iBAAiB,MAAM;EAC/C;EACA,KAAK,iBAAiB,eAAe,aAAa;EAClD,WAAW,WAAW,KAAK,oBAAoB,eAAe,aAAa,CAAC;CAC9E;CAEA,MACE,SACC,OAAO;EACN,IAAI,IAAI,MAAM,EAAE;CAClB,GACA,EAAE,WAAW,KAAK,CACpB;CAEA,sBAAsB;EACpB,WAAW,SAAS,OAAO,GAAG,CAAC;EAC/B,aAAa,CAAC;EACd,cAAc;CAChB,CAAC;AACH"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scroll-bar.js","names":[],"sources":["../../../src/components/scroll/scroll-bar.vue"],"sourcesContent":["<template>\n <div v-show=\"!!size\" ref=\"domRef\" :style=\"style\" :class=\"className\"></div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useDrag } from '@veltra/compositions'\nimport { bem } from '@veltra/utils'\nimport { computed, inject, shallowRef } from 'vue'\n\nimport { ScrollDIKey } from './di'\n\ndefineOptions({ name: 'UScrollBar' })\n\nconst props = defineProps<{ type: 'x' | 'y' }>()\n\nconst emit = defineEmits<{ drag: [offset: number, size: number] }>()\n\n/** 滚动条高度(type为x时为宽度) */\nconst size = shallowRef(0)\n/** 滚动条偏移量 */\nconst offset = shallowRef(0)\n/** 滚动条拖拽前偏移量 */\nlet currentOffset = 0\n/** 滚动条轨道尺寸 */\nlet trackSize = 0\n\nconst { cls } = inject(ScrollDIKey)!\n\nconst dragging = shallowRef(false)\n\nconst className = computed(() => {\n return [cls.e(`bar-${props.type}`), bem.is('active', dragging.value)]\n})\n\nconst style =\n props.type === 'x'\n ? computed(() => {\n return { width: size.value + 'px', transform: `translateX(${offset.value}px)` }\n })\n : computed(() => {\n return { height: size.value + 'px', transform: `translateY(${offset.value}px)` }\n })\n\nconst domRef = shallowRef<HTMLElement>()\n\n/** 获取拖拽偏移量 */\nconst getDragOffset =\n props.type === 'x'\n ? (x: number, y: number) => currentOffset + x\n : (x: number, y: number) => currentOffset + y\n\n// 应用拖拽\nuseDrag({\n target: domRef,\n onDragStart() {\n dragging.value = true\n currentOffset = offset.value\n },\n onDragEnd() {\n dragging.value = false\n },\n onDrag({ x, y }) {\n const newOffset = getDragOffset(x, y)\n const maxOffset = trackSize - size.value\n\n if (newOffset < 0) {\n offset.value = 0\n } else if (newOffset > maxOffset) {\n offset.value = maxOffset\n } else {\n offset.value = newOffset\n }\n\n emit('drag', offset.value, size.value)\n }\n})\n\ndefineExpose({\n /** 更新滚动条状态 */\n update(_size: number, _offset: number): void {\n size.value = _size\n offset.value = _offset\n },\n\n /** 设置轨道尺寸 */\n setTrackSize(size: number): void {\n trackSize = size\n }\n})\n</script>\n"],"mappings":";;;;;;;;;;;EAaA,MAAM,QAAQ;EAEd,MAAM,OAAO;;EAGb,MAAM,OAAO,WAAW,CAAC;;EAEzB,MAAM,SAAS,WAAW,CAAC;;EAE3B,IAAI,gBAAgB;;EAEpB,IAAI,YAAY;EAEhB,MAAM,EAAE,QAAQ,OAAO,WAAW;EAElC,MAAM,WAAW,WAAW,KAAK;EAEjC,MAAM,YAAY,eAAe;GAC/B,OAAO,CAAC,IAAI,EAAE,OAAO,MAAM,MAAM,GAAG,IAAI,GAAG,UAAU,SAAS,KAAK,CAAC;EACtE,CAAC;EAED,MAAM,QACJ,MAAM,SAAS,MACX,eAAe;GACb,OAAO;IAAE,OAAO,KAAK,QAAQ;IAAM,WAAW,cAAc,OAAO,MAAM;GAAK;EAChF,CAAC,IACD,eAAe;GACb,OAAO;IAAE,QAAQ,KAAK,QAAQ;IAAM,WAAW,cAAc,OAAO,MAAM;GAAK;EACjF,CAAC;EAEP,MAAM,SAAS,WAAwB;;EAGvC,MAAM,gBACJ,MAAM,SAAS,OACV,GAAW,MAAc,gBAAgB,KACzC,GAAW,MAAc,gBAAgB;EAGhD,QAAQ;GACN,QAAQ;GACR,cAAc;IACZ,SAAS,QAAQ;IACjB,gBAAgB,OAAO;GACzB;GACA,YAAY;IACV,SAAS,QAAQ;GACnB;GACA,OAAO,EAAE,GAAG,KAAK;IACf,MAAM,YAAY,cAAc,GAAG,CAAC;IACpC,MAAM,YAAY,YAAY,KAAK;IAEnC,IAAI,YAAY,GACd,OAAO,QAAQ;SACV,IAAI,YAAY,WACrB,OAAO,QAAQ;SAEf,OAAO,QAAQ;IAGjB,KAAK,QAAQ,OAAO,OAAO,KAAK,KAAK;GACvC;EACF,CAAC;EAED,SAAa;;GAEX,OAAO,OAAe,SAAuB;IAC3C,KAAK,QAAQ;IACb,OAAO,QAAQ;GACjB;;GAGA,aAAa,MAAoB;IAC/B,YAAY;GACd;EACF,CAAC;;GAvFC,
|
|
1
|
+
{"version":3,"file":"scroll-bar.js","names":["_withDirectives","_openBlock","_createElementBlock","_normalizeStyle","_unref","_normalizeClass","_vShow"],"sources":["../../../src/components/scroll/scroll-bar.vue"],"sourcesContent":["<template>\n <div v-show=\"!!size\" ref=\"domRef\" :style=\"style\" :class=\"className\"></div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useDrag } from '@veltra/compositions'\nimport { bem } from '@veltra/utils'\nimport { computed, inject, shallowRef } from 'vue'\n\nimport { ScrollDIKey } from './di'\n\ndefineOptions({ name: 'UScrollBar' })\n\nconst props = defineProps<{ type: 'x' | 'y' }>()\n\nconst emit = defineEmits<{ drag: [offset: number, size: number] }>()\n\n/** 滚动条高度(type为x时为宽度) */\nconst size = shallowRef(0)\n/** 滚动条偏移量 */\nconst offset = shallowRef(0)\n/** 滚动条拖拽前偏移量 */\nlet currentOffset = 0\n/** 滚动条轨道尺寸 */\nlet trackSize = 0\n\nconst { cls } = inject(ScrollDIKey)!\n\nconst dragging = shallowRef(false)\n\nconst className = computed(() => {\n return [cls.e(`bar-${props.type}`), bem.is('active', dragging.value)]\n})\n\nconst style =\n props.type === 'x'\n ? computed(() => {\n return { width: size.value + 'px', transform: `translateX(${offset.value}px)` }\n })\n : computed(() => {\n return { height: size.value + 'px', transform: `translateY(${offset.value}px)` }\n })\n\nconst domRef = shallowRef<HTMLElement>()\n\n/** 获取拖拽偏移量 */\nconst getDragOffset =\n props.type === 'x'\n ? (x: number, y: number) => currentOffset + x\n : (x: number, y: number) => currentOffset + y\n\n// 应用拖拽\nuseDrag({\n target: domRef,\n onDragStart() {\n dragging.value = true\n currentOffset = offset.value\n },\n onDragEnd() {\n dragging.value = false\n },\n onDrag({ x, y }) {\n const newOffset = getDragOffset(x, y)\n const maxOffset = trackSize - size.value\n\n if (newOffset < 0) {\n offset.value = 0\n } else if (newOffset > maxOffset) {\n offset.value = maxOffset\n } else {\n offset.value = newOffset\n }\n\n emit('drag', offset.value, size.value)\n }\n})\n\ndefineExpose({\n /** 更新滚动条状态 */\n update(_size: number, _offset: number): void {\n size.value = _size\n offset.value = _offset\n },\n\n /** 设置轨道尺寸 */\n setTrackSize(size: number): void {\n trackSize = size\n }\n})\n</script>\n"],"mappings":";;;;;;;;;;;EAaA,MAAM,QAAQ;EAEd,MAAM,OAAO;;EAGb,MAAM,OAAO,WAAW,CAAC;;EAEzB,MAAM,SAAS,WAAW,CAAC;;EAE3B,IAAI,gBAAgB;;EAEpB,IAAI,YAAY;EAEhB,MAAM,EAAE,QAAQ,OAAO,WAAW;EAElC,MAAM,WAAW,WAAW,KAAK;EAEjC,MAAM,YAAY,eAAe;GAC/B,OAAO,CAAC,IAAI,EAAE,OAAO,MAAM,MAAM,GAAG,IAAI,GAAG,UAAU,SAAS,KAAK,CAAC;EACtE,CAAC;EAED,MAAM,QACJ,MAAM,SAAS,MACX,eAAe;GACb,OAAO;IAAE,OAAO,KAAK,QAAQ;IAAM,WAAW,cAAc,OAAO,MAAM;GAAK;EAChF,CAAC,IACD,eAAe;GACb,OAAO;IAAE,QAAQ,KAAK,QAAQ;IAAM,WAAW,cAAc,OAAO,MAAM;GAAK;EACjF,CAAC;EAEP,MAAM,SAAS,WAAwB;;EAGvC,MAAM,gBACJ,MAAM,SAAS,OACV,GAAW,MAAc,gBAAgB,KACzC,GAAW,MAAc,gBAAgB;EAGhD,QAAQ;GACN,QAAQ;GACR,cAAc;IACZ,SAAS,QAAQ;IACjB,gBAAgB,OAAO;GACzB;GACA,YAAY;IACV,SAAS,QAAQ;GACnB;GACA,OAAO,EAAE,GAAG,KAAK;IACf,MAAM,YAAY,cAAc,GAAG,CAAC;IACpC,MAAM,YAAY,YAAY,KAAK;IAEnC,IAAI,YAAY,GACd,OAAO,QAAQ;SACV,IAAI,YAAY,WACrB,OAAO,QAAQ;SAEf,OAAO,QAAQ;IAGjB,KAAK,QAAQ,OAAO,OAAO,KAAK,KAAK;GACvC;EACF,CAAC;EAED,SAAa;;GAEX,OAAO,OAAe,SAAuB;IAC3C,KAAK,QAAQ;IACb,OAAO,QAAQ;GACjB;;GAGA,aAAa,MAAoB;IAC/B,YAAY;GACd;EACF,CAAC;;GAvFC,OAAAA,gBAAAC,UAAA,GAAAC,mBAA0E,OAAA;IAAjD,SAAA;IAAJ,KAAI;IAAU,OAAKC,eAAEC,MAAA,KAAA,CAAK;IAAG,OAAKC,eAAE,UAAA,KAAS;GAAnD,GAAA,MAAA,CAAA,IAAA,CAAA,CAAAC,OAAA,CAAA,CAAA,KAAA,KAAI,CAAA,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scroll.js","names":[],"sources":["../../../src/components/scroll/scroll.vue"],"sourcesContent":["<template>\n <div :class=\"className\" :style=\"style\" ref=\"scrollRef\">\n <div\n ref=\"containerRef\"\n :class=\"[cls.e('container'), containerClass]\"\n @scroll.passive=\"handleScroll\"\n :style=\"containerStyle\"\n >\n <component\n ref=\"contentRef\"\n :style=\"contentStyle\"\n :class=\"[cls.e('content'), contentClass]\"\n :is=\"tag\"\n >\n <slot />\n </component>\n </div>\n\n <u-scroll-bar type=\"y\" :class=\"cls.e('bar-y')\" @drag=\"handleDragY\" ref=\"barY\" />\n <u-scroll-bar type=\"x\" :class=\"cls.e('bar-x')\" @drag=\"handleDragX\" ref=\"barX\" />\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { debounce } from '@cat-kit/core'\nimport { useResizeObserver } from '@veltra/compositions'\nimport { bem, withUnit } from '@veltra/utils'\nimport { type CSSProperties, computed, provide, shallowRef } from 'vue'\n\nimport type { ScrollPosition, _ScrollExposed, ScrollProps, ScrollEmits } from '../../types'\nimport { ScrollDIKey } from './di'\nimport UScrollBar from './scroll-bar.vue'\n\ndefineOptions({ name: 'UScroll' })\n\nconst props = withDefaults(defineProps<ScrollProps>(), { tag: 'div' })\n\nconst emit = defineEmits<ScrollEmits>()\n\ndefineSlots<{\n /** 默认插槽 */\n default(): any\n /** 内容插槽 */\n content(): any\n}>()\n\nconst cls = bem('scroll')\n\nconst className = computed(() => {\n return [cls.b, bem.is('always', props.always)]\n})\n\nconst style = computed<CSSProperties>(() => {\n return { height: withUnit(props.height, 'px') }\n})\n\nconst contentRef = shallowRef<HTMLElement>()\nconst scrollRef = shallowRef<HTMLElement>()\nconst containerRef = shallowRef<HTMLElement>()\nconst barX = shallowRef<InstanceType<typeof UScrollBar>>()\nconst barY = shallowRef<InstanceType<typeof UScrollBar>>()\nconst minSize = 20\n\nconst trackSize = { width: 0, height: 0 }\n\nconst updateBar = () => {\n const container = containerRef.value\n if (!container) return\n\n const { scrollHeight, clientHeight, scrollTop, scrollWidth, clientWidth, scrollLeft } = container\n\n emit('scroll', {\n x: scrollLeft,\n y: scrollTop,\n sw: scrollWidth,\n sh: scrollHeight,\n cw: clientWidth,\n ch: clientHeight\n })\n\n if (scrollHeight !== clientHeight) {\n const barYHeight = Math.max((clientHeight / scrollHeight) * trackSize.height, minSize)\n const barYTop = (scrollTop / (scrollHeight - clientHeight)) * (trackSize.height - barYHeight)\n barY.value?.update(barYHeight, barYTop)\n } else {\n barY.value?.update(0, 0)\n }\n\n if (scrollWidth !== clientWidth) {\n const barXWidth = Math.max((clientWidth / scrollWidth) * trackSize.width, minSize)\n const barXLeft = (scrollLeft / (scrollWidth - clientWidth)) * (trackSize.width - barXWidth)\n barX.value?.update(barXWidth, barXLeft)\n } else {\n barX.value?.update(0, 0)\n }\n}\n\nconst handleDragX = debounce(\n (offset: number, size: number) => {\n const container = containerRef.value\n if (!container) return\n const { clientWidth, scrollWidth } = container\n container.scrollLeft = (offset / (trackSize.width - size)) * (scrollWidth - clientWidth)\n },\n props.dragDebounce ?? 0,\n false\n)\n\nconst handleDragY = debounce(\n (offset: number, size: number) => {\n const container = containerRef.value\n if (!container) return\n const { clientHeight, scrollHeight } = container\n container.scrollTop = (offset / (trackSize.height - size)) * (scrollHeight - clientHeight)\n },\n props.dragDebounce ?? 0,\n false\n)\n\nconst handleScroll = () => {\n updateBar()\n}\n\nuseResizeObserver({\n targets: [contentRef, scrollRef],\n onResize: (entries) => {\n const trackEl = scrollRef.value\n if (trackEl) {\n trackSize.width = trackEl.clientWidth\n trackSize.height = trackEl.clientHeight\n barX.value?.setTrackSize(trackSize.width)\n barY.value?.setTrackSize(trackSize.height)\n }\n updateBar()\n if (entries.length) {\n emit(\n 'resize',\n entries.map((entry) => entry.target as HTMLElement)\n )\n }\n }\n})\n\nconst scrollToLeft = (left: number) => {\n const container = containerRef.value\n if (!container) return\n container.scrollTo({ left })\n}\n\nconst scrollToTop = (top: number) => {\n const container = containerRef.value\n if (!container) return\n container.scrollTo({ top })\n}\n\nconst scrollTo = (position: ScrollPosition) => {\n if (position.x !== undefined) scrollToLeft(position.x)\n if (position.y !== undefined) scrollToTop(position.y)\n}\n\nprovide(ScrollDIKey, { cls })\n\nconst exposed: _ScrollExposed = {\n el: scrollRef,\n contentRef,\n containerRef,\n scrollTo,\n update: updateBar\n}\n\ndefineExpose(exposed)\n</script>\n"],"mappings":"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
|
|
1
|
+
{"version":3,"file":"scroll.js","names":["_openBlock","_createElementBlock","_normalizeClass","_normalizeStyle","_createElementVNode","_unref","_createBlock","_resolveDynamicComponent","_withCtx","_renderSlot","_createVNode","UScrollBar"],"sources":["../../../src/components/scroll/scroll.vue"],"sourcesContent":["<template>\n <div :class=\"className\" :style=\"style\" ref=\"scrollRef\">\n <div\n ref=\"containerRef\"\n :class=\"[cls.e('container'), containerClass]\"\n @scroll.passive=\"handleScroll\"\n :style=\"containerStyle\"\n >\n <component\n ref=\"contentRef\"\n :style=\"contentStyle\"\n :class=\"[cls.e('content'), contentClass]\"\n :is=\"tag\"\n >\n <slot />\n </component>\n </div>\n\n <u-scroll-bar type=\"y\" :class=\"cls.e('bar-y')\" @drag=\"handleDragY\" ref=\"barY\" />\n <u-scroll-bar type=\"x\" :class=\"cls.e('bar-x')\" @drag=\"handleDragX\" ref=\"barX\" />\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { debounce } from '@cat-kit/core'\nimport { useResizeObserver } from '@veltra/compositions'\nimport { bem, withUnit } from '@veltra/utils'\nimport { type CSSProperties, computed, provide, shallowRef } from 'vue'\n\nimport type { ScrollPosition, _ScrollExposed, ScrollProps, ScrollEmits } from '../../types'\nimport { ScrollDIKey } from './di'\nimport UScrollBar from './scroll-bar.vue'\n\ndefineOptions({ name: 'UScroll' })\n\nconst props = withDefaults(defineProps<ScrollProps>(), { tag: 'div' })\n\nconst emit = defineEmits<ScrollEmits>()\n\ndefineSlots<{\n /** 默认插槽 */\n default(): any\n /** 内容插槽 */\n content(): any\n}>()\n\nconst cls = bem('scroll')\n\nconst className = computed(() => {\n return [cls.b, bem.is('always', props.always)]\n})\n\nconst style = computed<CSSProperties>(() => {\n return { height: withUnit(props.height, 'px') }\n})\n\nconst contentRef = shallowRef<HTMLElement>()\nconst scrollRef = shallowRef<HTMLElement>()\nconst containerRef = shallowRef<HTMLElement>()\nconst barX = shallowRef<InstanceType<typeof UScrollBar>>()\nconst barY = shallowRef<InstanceType<typeof UScrollBar>>()\nconst minSize = 20\n\nconst trackSize = { width: 0, height: 0 }\n\nconst updateBar = () => {\n const container = containerRef.value\n if (!container) return\n\n const { scrollHeight, clientHeight, scrollTop, scrollWidth, clientWidth, scrollLeft } = container\n\n emit('scroll', {\n x: scrollLeft,\n y: scrollTop,\n sw: scrollWidth,\n sh: scrollHeight,\n cw: clientWidth,\n ch: clientHeight\n })\n\n if (scrollHeight !== clientHeight) {\n const barYHeight = Math.max((clientHeight / scrollHeight) * trackSize.height, minSize)\n const barYTop = (scrollTop / (scrollHeight - clientHeight)) * (trackSize.height - barYHeight)\n barY.value?.update(barYHeight, barYTop)\n } else {\n barY.value?.update(0, 0)\n }\n\n if (scrollWidth !== clientWidth) {\n const barXWidth = Math.max((clientWidth / scrollWidth) * trackSize.width, minSize)\n const barXLeft = (scrollLeft / (scrollWidth - clientWidth)) * (trackSize.width - barXWidth)\n barX.value?.update(barXWidth, barXLeft)\n } else {\n barX.value?.update(0, 0)\n }\n}\n\nconst handleDragX = debounce(\n (offset: number, size: number) => {\n const container = containerRef.value\n if (!container) return\n const { clientWidth, scrollWidth } = container\n container.scrollLeft = (offset / (trackSize.width - size)) * (scrollWidth - clientWidth)\n },\n props.dragDebounce ?? 0,\n false\n)\n\nconst handleDragY = debounce(\n (offset: number, size: number) => {\n const container = containerRef.value\n if (!container) return\n const { clientHeight, scrollHeight } = container\n container.scrollTop = (offset / (trackSize.height - size)) * (scrollHeight - clientHeight)\n },\n props.dragDebounce ?? 0,\n false\n)\n\nconst handleScroll = () => {\n updateBar()\n}\n\nuseResizeObserver({\n targets: [contentRef, scrollRef],\n onResize: (entries) => {\n const trackEl = scrollRef.value\n if (trackEl) {\n trackSize.width = trackEl.clientWidth\n trackSize.height = trackEl.clientHeight\n barX.value?.setTrackSize(trackSize.width)\n barY.value?.setTrackSize(trackSize.height)\n }\n updateBar()\n if (entries.length) {\n emit(\n 'resize',\n entries.map((entry) => entry.target as HTMLElement)\n )\n }\n }\n})\n\nconst scrollToLeft = (left: number) => {\n const container = containerRef.value\n if (!container) return\n container.scrollTo({ left })\n}\n\nconst scrollToTop = (top: number) => {\n const container = containerRef.value\n if (!container) return\n container.scrollTo({ top })\n}\n\nconst scrollTo = (position: ScrollPosition) => {\n if (position.x !== undefined) scrollToLeft(position.x)\n if (position.y !== undefined) scrollToTop(position.y)\n}\n\nprovide(ScrollDIKey, { cls })\n\nconst exposed: _ScrollExposed = {\n el: scrollRef,\n contentRef,\n containerRef,\n scrollTo,\n update: updateBar\n}\n\ndefineExpose(exposed)\n</script>\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"segment.js","names":["$attrs"],"sources":["../../../src/components/segment/segment.vue"],"sourcesContent":["<template>\n <div\n v-if=\"!readonly\"\n v-bind=\"$attrs\"\n :class=\"[cls.b, bem.is('block', block), bem.is('disabled', disabled), cls.m(size)]\"\n role=\"radiogroup\"\n >\n <div\n v-for=\"item of items\"\n :key=\"item[valueKey]\"\n :class=\"[\n cls.e('item'),\n bem.is('active', item[valueKey] === model),\n bem.is('disabled', disabled || Boolean(disabledItem?.(item)))\n ]\"\n role=\"radio\"\n :aria-checked=\"item[valueKey] === model\"\n :aria-disabled=\"disabled || Boolean(disabledItem?.(item))\"\n tabindex=\"0\"\n @click=\"handleSelect(item)\"\n @keydown.enter.prevent=\"handleSelect(item)\"\n @keydown.space.prevent=\"handleSelect(item)\"\n >\n <slot name=\"item\" :item=\"item\" :active=\"item[valueKey] === model\">\n <span :class=\"cls.e('item-label')\">{{ item[labelKey] }}</span>\n </slot>\n </div>\n </div>\n\n <template v-else>\n {{ items.find((item) => item[valueKey] === model)?.[labelKey] || FORM_EMPTY_CONTENT }}\n </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useFormFallbackProps } from '@veltra/compositions'\nimport { bem, fieldKey, FORM_EMPTY_CONTENT, injectFormContext } from '@veltra/utils'\nimport { computed } from 'vue'\n\nimport type { SegmentEmits, SegmentItem, SegmentProps } from '../../types'\n\ndefineOptions({ name: 'USegment', inheritAttrs: false })\n\nconst props = withDefaults(defineProps<SegmentProps>(), {\n items: () => [],\n labelKey: 'label',\n valueKey: 'value',\n disabled: undefined,\n readonly: undefined,\n block: false\n})\n\nconst model = defineModel<any>()\n\nconst emit = defineEmits<SegmentEmits>()\n\nconst { formProps } = injectFormContext()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n size: 'default',\n disabled: false,\n readonly: false\n})\n\nconst cls = bem('segment')\n\nconst labelKey = computed(() => fieldKey(props.labelKey, 'label'))\nconst valueKey = computed(() => fieldKey(props.valueKey, 'value'))\n\nconst handleSelect = (item: SegmentItem) => {\n if (disabled.value || props.disabledItem?.(item)) return\n const val = item[valueKey.value]\n if (model.value === val) return\n model.value = val\n emit('change', item)\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2CA,MAAM,QAAQ;EASd,MAAM,
|
|
1
|
+
{"version":3,"file":"segment.js","names":["$attrs","_useModel","_unref","_openBlock","_createElementBlock","_mergeProps","_Fragment","_renderList","_normalizeClass","_withKeys","_withModifiers","_renderSlot","_createElementVNode","_toDisplayString","_createTextVNode"],"sources":["../../../src/components/segment/segment.vue"],"sourcesContent":["<template>\n <div\n v-if=\"!readonly\"\n v-bind=\"$attrs\"\n :class=\"[cls.b, bem.is('block', block), bem.is('disabled', disabled), cls.m(size)]\"\n role=\"radiogroup\"\n >\n <div\n v-for=\"item of items\"\n :key=\"item[valueKey]\"\n :class=\"[\n cls.e('item'),\n bem.is('active', item[valueKey] === model),\n bem.is('disabled', disabled || Boolean(disabledItem?.(item)))\n ]\"\n role=\"radio\"\n :aria-checked=\"item[valueKey] === model\"\n :aria-disabled=\"disabled || Boolean(disabledItem?.(item))\"\n tabindex=\"0\"\n @click=\"handleSelect(item)\"\n @keydown.enter.prevent=\"handleSelect(item)\"\n @keydown.space.prevent=\"handleSelect(item)\"\n >\n <slot name=\"item\" :item=\"item\" :active=\"item[valueKey] === model\">\n <span :class=\"cls.e('item-label')\">{{ item[labelKey] }}</span>\n </slot>\n </div>\n </div>\n\n <template v-else>\n {{ items.find((item) => item[valueKey] === model)?.[labelKey] || FORM_EMPTY_CONTENT }}\n </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useFormFallbackProps } from '@veltra/compositions'\nimport { bem, fieldKey, FORM_EMPTY_CONTENT, injectFormContext } from '@veltra/utils'\nimport { computed } from 'vue'\n\nimport type { SegmentEmits, SegmentItem, SegmentProps } from '../../types'\n\ndefineOptions({ name: 'USegment', inheritAttrs: false })\n\nconst props = withDefaults(defineProps<SegmentProps>(), {\n items: () => [],\n labelKey: 'label',\n valueKey: 'value',\n disabled: undefined,\n readonly: undefined,\n block: false\n})\n\nconst model = defineModel<any>()\n\nconst emit = defineEmits<SegmentEmits>()\n\nconst { formProps } = injectFormContext()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n size: 'default',\n disabled: false,\n readonly: false\n})\n\nconst cls = bem('segment')\n\nconst labelKey = computed(() => fieldKey(props.labelKey, 'label'))\nconst valueKey = computed(() => fieldKey(props.valueKey, 'value'))\n\nconst handleSelect = (item: SegmentItem) => {\n if (disabled.value || props.disabledItem?.(item)) return\n const val = item[valueKey.value]\n if (model.value === val) return\n model.value = val\n emit('change', item)\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2CA,MAAM,QAAQ;EASd,MAAM,QAAQC,SAAgB,SAAA,YAAC;EAE/B,MAAM,OAAO;EAEb,MAAM,EAAE,cAAc,kBAAkB;EAExC,MAAM,EAAE,MAAM,UAAU,aAAa,qBAAqB,CAAC,aAAa,CAAC,GAAG,KAAK,GAAG;GAClF,MAAM;GACN,UAAU;GACV,UAAU;EACZ,CAAC;EAED,MAAM,MAAM,IAAI,SAAS;EAEzB,MAAM,WAAW,eAAe,SAAS,MAAM,UAAU,OAAO,CAAC;EACjE,MAAM,WAAW,eAAe,SAAS,MAAM,UAAU,OAAO,CAAC;EAEjE,MAAM,gBAAgB,SAAsB;GAC1C,IAAI,SAAS,SAAS,MAAM,eAAe,IAAI,GAAG;GAClD,MAAM,MAAM,KAAK,SAAS;GAC1B,IAAI,MAAM,UAAU,KAAK;GACzB,MAAM,QAAQ;GACd,KAAK,UAAU,IAAI;EACrB;;GAzEW,OAAA,CAAAC,MAAA,QAAA,KADTC,UAAA,GAAAC,mBA0BM,OA1BNC,WA0BM,EAAA,KAAA,EAAA,GAxBIL,KAAAA,QAAM;IACb,OAAK;KAAGE,MAAA,GAAA,CAAG,CAAC;KAAGA,MAAA,GAAA,CAAG,CAAC,GAAE,SAAU,QAAA,KAAK;KAAGA,MAAA,GAAA,CAAG,CAAC,GAAE,YAAaA,MAAA,QAAA,CAAQ;KAAGA,MAAA,GAAA,CAAG,CAAC,EAAEA,MAAA,IAAA,CAAI;IAAA;IAChF,MAAK;GAEL,CAAA,GAAA,EAAAC,UAAA,IAAA,GAAAC,mBAmBME,UAAA,MAAAC,WAlBW,QAAA,QAAR,SAAI;IADb,OAAAJ,UAAA,GAAAC,mBAmBM,OAAA;KAjBH,KAAK,KAAK,SAAA;KACV,OAAKI,eAAA;MAAYN,MAAA,GAAA,CAAG,CAAC,EAAC,MAAA;MAAkBA,MAAA,GAAA,CAAG,CAAC,GAAE,UAAW,KAAK,SAAA,WAAc,MAAA,KAAK;MAAWA,MAAA,GAAA,CAAG,CAAC,GAAE,YAAaA,MAAA,QAAA,KAAY,QAAQ,QAAA,eAAe,IAAI,CAAA,CAAA;;KAKvJ,MAAK;KACJ,gBAAc,KAAK,SAAA,WAAc,MAAA;KACjC,iBAAeA,MAAA,QAAA,KAAY,QAAQ,QAAA,eAAe,IAAI,CAAA;KACvD,UAAS;KACR,UAAK,WAAE,aAAa,IAAI;KACxB,WAAO,CAAgBO,SAAAC,eAAA,WAAA,aAAa,IAAI,GAAA,CAAA,SAAA,CAAA,GAAA,CAAA,OAAA,CAAA,GACjBD,SAAAC,eAAA,WAAA,aAAa,IAAI,GAAA,CAAA,SAAA,CAAA,GAAA,CAAA,OAAA,CAAA,CAAA;IAEzC,GAAA,CAAAC,WAEO,KAAA,QAAA,QAAA;KAFkB;KAAO,QAAQ,KAAK,SAAA,WAAc,MAAA;IAA3D,SAEO,CADLC,mBAA8D,QAAA,EAAvD,OAAKJ,eAAEN,MAAA,GAAA,CAAG,CAAC,EAAC,YAAA,CAAA,EAAmB,GAAAW,gBAAA,KAAK,SAAA,MAAQ,GAAA,CAAA,CAAA,CAAA,CAAA,GAAA,IAAA,UAAA;GAKzD,CAAA,GAAA,GAAA,EAAA,GAAA,EAAA,MAAAV,UAAA,GAAAC,mBAEWE,UAAA,EAAA,KAAA,EAAA,GAAA,CADNQ,gBAAAD,gBAAA,QAAA,MAAM,MAAM,SAAS,KAAK,SAAA,WAAc,MAAA,KAAK,CAAA,GAAI,SAAA,UAAaX,MAAA,kBAAA,CAAkB,GAAA,CAAA,CAAA,GAAA,EAAA"}
|
|
@@ -27,6 +27,7 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
|
27
27
|
options: {},
|
|
28
28
|
valueKey: { default: "value" },
|
|
29
29
|
labelKey: { default: "label" },
|
|
30
|
+
text: {},
|
|
30
31
|
clearable: {
|
|
31
32
|
type: Boolean,
|
|
32
33
|
default: true
|
|
@@ -73,12 +74,13 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
|
73
74
|
readonly: false
|
|
74
75
|
});
|
|
75
76
|
const currentIndex = shallowRef(-1);
|
|
76
|
-
/**
|
|
77
|
+
/** 内部展示文案,仅由选项推导(未命中时展示 text 兜底);经 update:text 通知父级 */
|
|
77
78
|
const label = shallowRef();
|
|
78
79
|
const selected = shallowRef();
|
|
79
80
|
const displayedValue = computed(() => {
|
|
80
81
|
if (label.value) return label.value;
|
|
81
|
-
|
|
82
|
+
if (selected.value) return o(selected.value).get(labelKey.value);
|
|
83
|
+
return props.text ?? String(props.modelValue ?? "");
|
|
82
84
|
});
|
|
83
85
|
const dropdownRef = shallowRef();
|
|
84
86
|
const scrollRef = shallowRef();
|
|
@@ -127,11 +129,11 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
|
127
129
|
if (!dropdownVisible.value) dropdownRef.value?.open();
|
|
128
130
|
}
|
|
129
131
|
const { userAction, isUserActive } = useUserAction();
|
|
130
|
-
/**
|
|
132
|
+
/** 更新内部文案;值变化时 emit update:text(readonly 纯展示,不通知父级) */
|
|
131
133
|
function setLabel(next) {
|
|
132
134
|
if (label.value === next) return;
|
|
133
135
|
label.value = next;
|
|
134
|
-
emit("update:text", next);
|
|
136
|
+
if (!readonly.value) emit("update:text", next);
|
|
135
137
|
}
|
|
136
138
|
/** 按 modelValue 与完整选项列表同步高亮索引、选中项与显示标签(外部回显用,O(n)) */
|
|
137
139
|
function syncSelected(modelValue, sourceOptions) {
|
|
@@ -143,7 +145,9 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
|
143
145
|
if (modelValue !== void 0 && modelValue !== null && modelValue !== "") {
|
|
144
146
|
currentIndex.value = sourceOptions.findIndex((option) => o(option).get(valueKey.value) === modelValue);
|
|
145
147
|
selected.value = currentIndex.value >= 0 ? sourceOptions[currentIndex.value] : void 0;
|
|
146
|
-
|
|
148
|
+
if (selected.value) setLabel(o(selected.value).get(labelKey.value));
|
|
149
|
+
else if (props.text) label.value = void 0;
|
|
150
|
+
else setLabel(void 0);
|
|
147
151
|
} else {
|
|
148
152
|
currentIndex.value = -1;
|
|
149
153
|
selected.value = void 0;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.js","names":["$attrs","$slots"],"sources":["../../../src/components/select/select.vue"],"sourcesContent":["<template>\n <u-dropdown\n v-if=\"!readonly\"\n v-bind=\"$attrs\"\n trigger=\"click\"\n :class=\"[cls.b, bem.is('disabled', disabled)]\"\n ref=\"dropdownRef\"\n v-model:visible=\"dropdownVisible\"\n :content-class=\"[cls.e('panel'), cls.em('panel', size), contentClass]\"\n :content-style=\"contentStyle\"\n :disabled=\"disabled\"\n :min-width=\"minWidth\"\n :width=\"width\"\n @keydown=\"handleKeydown\"\n @mouseenter=\"hovered = true\"\n @mouseleave=\"hovered = false\"\n >\n <!-- 触发 -->\n <template #trigger>\n <u-input\n ref=\"inputRef\"\n :size=\"size\"\n :disabled=\"disabled\"\n :placeholder=\"inputPlaceholder\"\n :clearable=\"false\"\n :model-value=\"inputValue\"\n @update:model-value=\"handleQueryInput\"\n @keydown=\"handleKeydown\"\n :native-readonly=\"!filterable || !querying\"\n @click.capture=\"handleTriggerClickCapture\"\n >\n <template #prefix v-if=\"$slots.prefix\">\n <slot name=\"prefix\" />\n </template>\n\n <template #suffix>\n <transition name=\"zoom-in\" mode=\"out-in\">\n <u-icon\n v-if=\"showClear\"\n :class=\"cls.e('clear')\"\n title=\"清除\"\n key=\"clear\"\n @click.stop=\"handleClear\"\n >\n <Close />\n </u-icon>\n <u-icon v-else :class=\"cls.e('arrow')\" key=\"arrow\">\n <ArrowDown />\n </u-icon>\n </transition>\n </template>\n </u-input>\n </template>\n\n <!-- 下拉内容 -->\n <template #content>\n <!--\n 单选列表。虚拟化启用时,内容容器 height 由 useVirtualizer 命令式写入;\n 此处 content-style 仅承担 grid 相关样式,避免 height 变化触发模板重渲染。\n -->\n <div v-if=\"loading\" :class=\"cls.e('loading')\">\n <ULoading type=\"dual-ring\" />\n </div>\n <u-scroll\n v-else-if=\"options.length\"\n tag=\"ul\"\n :class=\"cls.e('options')\"\n ref=\"scrollRef\"\n :content-class=\"[\n cls.e('options-wrap'),\n bem.is('virtual', virtualEnabled),\n bem.is('grid', !!grid)\n ]\"\n :content-style=\"{\n gridTemplateColumns: grid ? `repeat(${grid.cols}, minmax(0px, 1fr))` : undefined,\n gridGap: grid ? withUnit(grid.gap, 'px') : undefined\n }\"\n >\n <template v-if=\"virtualEnabled\">\n <!-- @vue-ignore -->\n <li\n v-for=\"{ option, index, val, label, key, offset } of virtualOptions\"\n :class=\"[optionClass, bem.is('selected', index === currentIndex)]\"\n @click=\"handleSelect(option, index)\"\n :key=\"key\"\n :style=\"{ transform: `translateY(${offset}px)` }\"\n :data-index=\"index\"\n :ref=\"(el) => measureElement(index, el as Element | null)\"\n >\n <slot v-bind=\"{ option, index }\">\n {{ label }}\n </slot>\n </li>\n </template>\n\n <template v-else>\n <li\n v-for=\"(option, index) of options\"\n :class=\"[optionClass, bem.is('selected', index === currentIndex)]\"\n @click=\"handleSelect(option, index)\"\n :data-index=\"index\"\n :title=\"o(option).get(labelKey)\"\n :key=\"o(option).get(valueKey)\"\n >\n <slot v-bind=\"{ option, index }\">\n {{ o(option).get(labelKey) }}\n </slot>\n </li>\n </template>\n </u-scroll>\n\n <div v-else :class=\"cls.e('empty')\">\n <UEmpty />\n </div>\n </template>\n </u-dropdown>\n\n <template v-else>\n {{ displayedValue || FORM_EMPTY_CONTENT }}\n </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { o } from '@cat-kit/core'\nimport { useFormFallbackProps, useUserAction, useVirtualizer } from '@veltra/compositions'\nimport { ArrowDown, Close } from '@veltra/icons/normal'\nimport { bem, fieldKey, FORM_EMPTY_CONTENT, scrollIntoContainerView, withUnit } from '@veltra/utils'\nimport { injectFormContext } from '@veltra/utils'\nimport { computed, nextTick, shallowRef, useTemplateRef, watch } from 'vue'\n\nimport type {\n SelectEmits,\n SelectProps,\n _SelectExposed,\n DropdownExposed,\n InputExposed,\n ScrollExposed\n} from '../../types'\nimport { UDropdown } from '../dropdown'\nimport { UEmpty } from '../empty'\nimport { UIcon } from '../icon'\nimport { UInput } from '../input'\nimport { ULoading } from '../loading'\nimport { UScroll } from '../scroll'\nimport { useKeyboard } from './use-keyboard'\nimport { useOptions } from './use-options'\n\ndefineOptions({ name: 'USelect', inheritAttrs: false })\n\nconst props = withDefaults(defineProps<SelectProps>(), {\n labelKey: 'label',\n valueKey: 'value',\n placeholder: '请选择',\n clearable: true,\n disabled: undefined,\n readonly: undefined\n})\n\nconst emit = defineEmits<SelectEmits>()\n\ndefineSlots<{\n /** 前缀插槽 */\n prefix?: () => any\n /** 默认插槽 */\n default?: (scope: { option: Record<string, any>; index: number }) => any\n}>()\n\nconst cls = bem('select')\n\nconst labelKey = computed(() => fieldKey(props.labelKey, 'label'))\nconst valueKey = computed(() => fieldKey(props.valueKey, 'value'))\n\nconst optionClass = cls.e('option')\n\nconst { formProps } = injectFormContext()\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n size: 'default',\n disabled: false,\n readonly: false\n})\n\nconst currentIndex = shallowRef(-1)\n/** 内部展示文案,仅由选项推导;通过 update:text 单向通知父级 */\nconst label = shallowRef<string>()\nconst selected = shallowRef<Record<string, any>>()\n\nconst displayedValue = computed(() => {\n if (label.value) return label.value\n\n return selected.value ? o(selected.value).get(labelKey.value) : String(props.modelValue ?? '')\n})\n\nconst dropdownRef = shallowRef<DropdownExposed>()\nconst scrollRef = shallowRef<ScrollExposed>()\nconst inputRef = useTemplateRef<InputExposed>('inputRef')\n\nconst filterable = computed(() => {\n return props.filterable || typeof props.options === 'function'\n})\n\nconst {\n queryString,\n loading,\n options,\n allOptions,\n temOptionsToCreatedOptions,\n clearCreatedOptions\n} = useOptions({ props })\n\nconst dropdownVisible = shallowRef(false)\n\n/** 选中临时选项后待转正标记:面板关闭后再落定,避免关闭动画期间列表恢复全量导致面板变长 */\nlet pendingTempPromote = false\n\n/**\n * 是否处于查询态:决定触发输入框显示查询串还是选中标签。\n * 与面板可见状态解耦 —— 选择后立即退出查询态,\n * 不等面板关闭动画结束(否则显示值会延迟一个动画时长才恢复)。\n */\nconst querying = shallowRef(false)\n\n/** 触发输入框的值:查询态下承载查询串,否则展示选中标签 */\nconst inputValue = computed(() => {\n if (filterable.value && querying.value) return queryString.value\n return displayedValue.value\n})\n\n/** 查询态下已选标签降级为占位提示 */\nconst inputPlaceholder = computed(() => {\n if (filterable.value && querying.value && displayedValue.value) {\n return displayedValue.value\n }\n return props.placeholder\n})\n\nfunction handleQueryInput(value: string) {\n if (!filterable.value) return\n queryString.value = value\n}\n\nconst hovered = shallowRef(false)\n\n/** 悬停且存在选中值时展示清除按钮(替代下拉箭头) */\nconst showClear = computed(() => {\n return props.clearable && !disabled.value && hovered.value && !!displayedValue.value\n})\n\n/**\n * 过滤模式下拦截输入区域的点击:\n * 阻止 dropdown 的 trigger 开合切换,保持面板展开以不中断输入。\n * 非输入区域(箭头、留白)放行,维持原开合行为。\n */\nfunction handleTriggerClickCapture(e: MouseEvent) {\n if (!filterable.value || disabled.value) return\n if (!(e.target instanceof HTMLInputElement)) return\n\n e.stopPropagation()\n if (!dropdownVisible.value) dropdownRef.value?.open()\n}\n\nconst { userAction, isUserActive } = useUserAction()\n\n/** 更新内部文案;值变化时单向 emit update:text */\nfunction setLabel(next?: string) {\n if (label.value === next) return\n label.value = next\n emit('update:text', next)\n}\n\n/** 按 modelValue 与完整选项列表同步高亮索引、选中项与显示标签(外部回显用,O(n)) */\nfunction syncSelected(modelValue: any, sourceOptions: Record<string, any>[] | undefined) {\n // 查询输入期间高亮第一项(创建模式下通常是临时项,便于回车创建)\n if (queryString.value) {\n currentIndex.value = options.value.length ? 0 : -1\n return\n }\n\n if (!sourceOptions?.length) return\n\n if (modelValue !== undefined && modelValue !== null && modelValue !== '') {\n currentIndex.value = sourceOptions.findIndex(\n (option) => o(option).get(valueKey.value) === modelValue\n )\n selected.value = currentIndex.value >= 0 ? sourceOptions[currentIndex.value] : undefined\n setLabel(selected.value ? o(selected.value).get(labelKey.value) : undefined)\n } else {\n currentIndex.value = -1\n selected.value = undefined\n setLabel(undefined)\n }\n}\n\n// 回显:以 allOptions 匹配,避免过滤列表缺项时清掉已选文案;用户动作期内跳过\nwatch(\n [() => props.modelValue, allOptions],\n ([modelValue]) => {\n if (isUserActive()) return\n syncSelected(modelValue, allOptions.value)\n },\n { immediate: true }\n)\n\n// 过滤时单独同步高亮(allOptions 不变,不会触发上方回显 watch)\nwatch([queryString, options], () => {\n if (!queryString.value) return\n currentIndex.value = options.value.length ? 0 : -1\n})\n\nconst baseVirtualEnabled = computed(() => options.value.length > 80)\nconst virtualEnabled = computed(() => baseVirtualEnabled.value && !props.grid)\n\nconst { virtualizer, items } = useVirtualizer({\n count: computed(() => options.value.length),\n scrollEl: () => scrollRef.value?.containerRef ?? null,\n contentEl: () => (virtualEnabled.value ? (scrollRef.value?.contentRef ?? null) : null),\n gap: 4,\n estimateSize: () => 40\n})\n\nconst virtualOptions = computed(() => {\n const _options = options.value\n return items.value.map((item) => {\n const option = _options[item.index]!\n return {\n option,\n index: item.index,\n label: o(option).get(labelKey.value),\n val: o(option).get(valueKey.value),\n key: item.index,\n offset: item.start\n }\n })\n})\n\nconst measureElement: (index: number, el: Element | null) => void = (index, el) =>\n virtualizer.measureElement(index, el)\n\nfunction scrollTo(index: number): void {\n virtualizer.scrollToIndex(index, { align: 'center' })\n}\n\nwatch([scrollRef, virtualEnabled], ([scroll, virtualEnabled]) => {\n if (!scroll || !props.modelValue) return\n\n if (virtualEnabled) {\n const index = options.value.findIndex((option) => option === selected.value)\n index !== -1 && dropdownVisible.value && nextTick(() => scrollTo(index))\n } else {\n const selectedEl = scroll?.contentRef?.getElementsByClassName('is-selected')[0]\n if (selectedEl) {\n scrollIntoContainerView(selectedEl as HTMLElement, scroll.containerRef ?? null)\n }\n }\n})\n\n/** 落定待转正的临时选项(面板 DOM 已卸载,列表恢复全量用户不可见) */\nfunction promotePendingTemp() {\n if (!pendingTempPromote) return\n pendingTempPromote = false\n temOptionsToCreatedOptions()\n}\n\nwatch(dropdownVisible, (visible) => {\n if (visible) {\n // 关闭动画期间被重新打开时补一次转正,保证已选临时项落到完整列表\n promotePendingTemp()\n // 面板展开后进入查询态并聚焦输入框,可以立即输入查询\n if (filterable.value) {\n queryString.value = ''\n querying.value = true\n nextTick(() => inputRef.value?.el?.focus())\n }\n } else {\n // 面板完全关闭(动画结束、DOM 卸载)后才清空查询串并转正,关闭动画期间列表保持过滤态\n querying.value = false\n queryString.value = ''\n promotePendingTemp()\n }\n})\n\n/** 单选:用户动作内 O(1) 写入值与文案,跳过 modelValue 回显的 O(n) 查找 */\nconst handleSelect = userAction((option: Record<string, any>, _index: number) => {\n const value = option?.[valueKey.value]\n selected.value = option\n\n emit('update:modelValue', value)\n setLabel(option?.[labelKey.value])\n emit('change', option)\n if (option.__isTemp) {\n // 转正延迟到面板关闭后:动画期间保持过滤列表,避免列表瞬间恢复全量导致面板变长闪烁\n pendingTempPromote = true\n }\n // 立即退出查询态,输入框同步恢复显示选中标签;查询串保留至面板关闭,避免关闭动画期间列表恢复全量\n querying.value = false\n // 按当前列表定位高亮(临时项尚未转正,仍在过滤列表中,通常为 0)\n currentIndex.value = options.value.findIndex((item) => o(item).get(valueKey.value) === value)\n if (currentIndex.value >= 0) {\n selected.value = options.value[currentIndex.value]\n }\n dropdownRef.value?.close()\n})\n\n/** 清除选项 */\nconst handleClear = userAction(() => {\n selected.value = undefined\n currentIndex.value = -1\n setLabel(undefined)\n clearCreatedOptions()\n emit('update:modelValue', undefined)\n emit('change', undefined)\n})\n\nfunction getCurrentEl() {\n return scrollRef.value?.contentRef?.querySelector('li.is-selected') as HTMLElement | undefined\n}\n\nconst { handleKeydown } = useKeyboard({\n options,\n currentIndex,\n selectOption: handleSelect,\n getCurrentEl\n})\n</script>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"select.js","names":["$attrs","$slots","_unref","_openBlock","_createBlock","UDropdown","_mergeProps","_withCtx","_createVNode","UInput","_createSlots","_Transition","UIcon","_normalizeClass","_withModifiers","_renderSlot","_createCommentVNode","_createElementBlock","ULoading","UScroll","_Fragment","_renderList","_normalizeStyle","_createTextVNode","_toDisplayString","UEmpty"],"sources":["../../../src/components/select/select.vue"],"sourcesContent":["<template>\n <u-dropdown\n v-if=\"!readonly\"\n v-bind=\"$attrs\"\n trigger=\"click\"\n :class=\"[cls.b, bem.is('disabled', disabled)]\"\n ref=\"dropdownRef\"\n v-model:visible=\"dropdownVisible\"\n :content-class=\"[cls.e('panel'), cls.em('panel', size), contentClass]\"\n :content-style=\"contentStyle\"\n :disabled=\"disabled\"\n :min-width=\"minWidth\"\n :width=\"width\"\n @keydown=\"handleKeydown\"\n @mouseenter=\"hovered = true\"\n @mouseleave=\"hovered = false\"\n >\n <!-- 触发 -->\n <template #trigger>\n <u-input\n ref=\"inputRef\"\n :size=\"size\"\n :disabled=\"disabled\"\n :placeholder=\"inputPlaceholder\"\n :clearable=\"false\"\n :model-value=\"inputValue\"\n @update:model-value=\"handleQueryInput\"\n @keydown=\"handleKeydown\"\n :native-readonly=\"!filterable || !querying\"\n @click.capture=\"handleTriggerClickCapture\"\n >\n <template #prefix v-if=\"$slots.prefix\">\n <slot name=\"prefix\" />\n </template>\n\n <template #suffix>\n <transition name=\"zoom-in\" mode=\"out-in\">\n <u-icon\n v-if=\"showClear\"\n :class=\"cls.e('clear')\"\n title=\"清除\"\n key=\"clear\"\n @click.stop=\"handleClear\"\n >\n <Close />\n </u-icon>\n <u-icon v-else :class=\"cls.e('arrow')\" key=\"arrow\">\n <ArrowDown />\n </u-icon>\n </transition>\n </template>\n </u-input>\n </template>\n\n <!-- 下拉内容 -->\n <template #content>\n <!--\n 单选列表。虚拟化启用时,内容容器 height 由 useVirtualizer 命令式写入;\n 此处 content-style 仅承担 grid 相关样式,避免 height 变化触发模板重渲染。\n -->\n <div v-if=\"loading\" :class=\"cls.e('loading')\">\n <ULoading type=\"dual-ring\" />\n </div>\n <u-scroll\n v-else-if=\"options.length\"\n tag=\"ul\"\n :class=\"cls.e('options')\"\n ref=\"scrollRef\"\n :content-class=\"[\n cls.e('options-wrap'),\n bem.is('virtual', virtualEnabled),\n bem.is('grid', !!grid)\n ]\"\n :content-style=\"{\n gridTemplateColumns: grid ? `repeat(${grid.cols}, minmax(0px, 1fr))` : undefined,\n gridGap: grid ? withUnit(grid.gap, 'px') : undefined\n }\"\n >\n <template v-if=\"virtualEnabled\">\n <!-- @vue-ignore -->\n <li\n v-for=\"{ option, index, val, label, key, offset } of virtualOptions\"\n :class=\"[optionClass, bem.is('selected', index === currentIndex)]\"\n @click=\"handleSelect(option, index)\"\n :key=\"key\"\n :style=\"{ transform: `translateY(${offset}px)` }\"\n :data-index=\"index\"\n :ref=\"(el) => measureElement(index, el as Element | null)\"\n >\n <slot v-bind=\"{ option, index }\">\n {{ label }}\n </slot>\n </li>\n </template>\n\n <template v-else>\n <li\n v-for=\"(option, index) of options\"\n :class=\"[optionClass, bem.is('selected', index === currentIndex)]\"\n @click=\"handleSelect(option, index)\"\n :data-index=\"index\"\n :title=\"o(option).get(labelKey)\"\n :key=\"o(option).get(valueKey)\"\n >\n <slot v-bind=\"{ option, index }\">\n {{ o(option).get(labelKey) }}\n </slot>\n </li>\n </template>\n </u-scroll>\n\n <div v-else :class=\"cls.e('empty')\">\n <UEmpty />\n </div>\n </template>\n </u-dropdown>\n\n <template v-else>\n {{ displayedValue || FORM_EMPTY_CONTENT }}\n </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { o } from '@cat-kit/core'\nimport { useFormFallbackProps, useUserAction, useVirtualizer } from '@veltra/compositions'\nimport { ArrowDown, Close } from '@veltra/icons/normal'\nimport { bem, fieldKey, FORM_EMPTY_CONTENT, scrollIntoContainerView, withUnit } from '@veltra/utils'\nimport { injectFormContext } from '@veltra/utils'\nimport { computed, nextTick, shallowRef, useTemplateRef, watch } from 'vue'\n\nimport type {\n SelectEmits,\n SelectProps,\n _SelectExposed,\n DropdownExposed,\n InputExposed,\n ScrollExposed\n} from '../../types'\nimport { UDropdown } from '../dropdown'\nimport { UEmpty } from '../empty'\nimport { UIcon } from '../icon'\nimport { UInput } from '../input'\nimport { ULoading } from '../loading'\nimport { UScroll } from '../scroll'\nimport { useKeyboard } from './use-keyboard'\nimport { useOptions } from './use-options'\n\ndefineOptions({ name: 'USelect', inheritAttrs: false })\n\nconst props = withDefaults(defineProps<SelectProps>(), {\n labelKey: 'label',\n valueKey: 'value',\n placeholder: '请选择',\n clearable: true,\n disabled: undefined,\n readonly: undefined\n})\n\nconst emit = defineEmits<SelectEmits>()\n\ndefineSlots<{\n /** 前缀插槽 */\n prefix?: () => any\n /** 默认插槽 */\n default?: (scope: { option: Record<string, any>; index: number }) => any\n}>()\n\nconst cls = bem('select')\n\nconst labelKey = computed(() => fieldKey(props.labelKey, 'label'))\nconst valueKey = computed(() => fieldKey(props.valueKey, 'value'))\n\nconst optionClass = cls.e('option')\n\nconst { formProps } = injectFormContext()\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n size: 'default',\n disabled: false,\n readonly: false\n})\n\nconst currentIndex = shallowRef(-1)\n/** 内部展示文案,仅由选项推导(未命中时展示 text 兜底);经 update:text 通知父级 */\nconst label = shallowRef<string>()\nconst selected = shallowRef<Record<string, any>>()\n\nconst displayedValue = computed(() => {\n if (label.value) return label.value\n\n if (selected.value) return o(selected.value).get(labelKey.value)\n // 未命中选项:优先展示 text 兜底文案,避免露出不可读的编码\n return props.text ?? String(props.modelValue ?? '')\n})\n\nconst dropdownRef = shallowRef<DropdownExposed>()\nconst scrollRef = shallowRef<ScrollExposed>()\nconst inputRef = useTemplateRef<InputExposed>('inputRef')\n\nconst filterable = computed(() => {\n return props.filterable || typeof props.options === 'function'\n})\n\nconst {\n queryString,\n loading,\n options,\n allOptions,\n temOptionsToCreatedOptions,\n clearCreatedOptions\n} = useOptions({ props })\n\nconst dropdownVisible = shallowRef(false)\n\n/** 选中临时选项后待转正标记:面板关闭后再落定,避免关闭动画期间列表恢复全量导致面板变长 */\nlet pendingTempPromote = false\n\n/**\n * 是否处于查询态:决定触发输入框显示查询串还是选中标签。\n * 与面板可见状态解耦 —— 选择后立即退出查询态,\n * 不等面板关闭动画结束(否则显示值会延迟一个动画时长才恢复)。\n */\nconst querying = shallowRef(false)\n\n/** 触发输入框的值:查询态下承载查询串,否则展示选中标签 */\nconst inputValue = computed(() => {\n if (filterable.value && querying.value) return queryString.value\n return displayedValue.value\n})\n\n/** 查询态下已选标签降级为占位提示 */\nconst inputPlaceholder = computed(() => {\n if (filterable.value && querying.value && displayedValue.value) {\n return displayedValue.value\n }\n return props.placeholder\n})\n\nfunction handleQueryInput(value: string) {\n if (!filterable.value) return\n queryString.value = value\n}\n\nconst hovered = shallowRef(false)\n\n/** 悬停且存在选中值时展示清除按钮(替代下拉箭头) */\nconst showClear = computed(() => {\n return props.clearable && !disabled.value && hovered.value && !!displayedValue.value\n})\n\n/**\n * 过滤模式下拦截输入区域的点击:\n * 阻止 dropdown 的 trigger 开合切换,保持面板展开以不中断输入。\n * 非输入区域(箭头、留白)放行,维持原开合行为。\n */\nfunction handleTriggerClickCapture(e: MouseEvent) {\n if (!filterable.value || disabled.value) return\n if (!(e.target instanceof HTMLInputElement)) return\n\n e.stopPropagation()\n if (!dropdownVisible.value) dropdownRef.value?.open()\n}\n\nconst { userAction, isUserActive } = useUserAction()\n\n/** 更新内部文案;值变化时 emit update:text(readonly 纯展示,不通知父级) */\nfunction setLabel(next?: string) {\n if (label.value === next) return\n label.value = next\n if (!readonly.value) emit('update:text', next)\n}\n\n/** 按 modelValue 与完整选项列表同步高亮索引、选中项与显示标签(外部回显用,O(n)) */\nfunction syncSelected(modelValue: any, sourceOptions: Record<string, any>[] | undefined) {\n // 查询输入期间高亮第一项(创建模式下通常是临时项,便于回车创建)\n if (queryString.value) {\n currentIndex.value = options.value.length ? 0 : -1\n return\n }\n\n if (!sourceOptions?.length) return\n\n if (modelValue !== undefined && modelValue !== null && modelValue !== '') {\n currentIndex.value = sourceOptions.findIndex(\n (option) => o(option).get(valueKey.value) === modelValue\n )\n selected.value = currentIndex.value >= 0 ? sourceOptions[currentIndex.value] : undefined\n if (selected.value) {\n setLabel(o(selected.value).get(labelKey.value))\n } else if (props.text) {\n // 未命中但有 text 兜底:文案以父级为准,不回发\n label.value = undefined\n } else {\n // 未命中且无兜底:如实通知父级当前没有可展示文案\n setLabel(undefined)\n }\n } else {\n currentIndex.value = -1\n selected.value = undefined\n setLabel(undefined)\n }\n}\n\n// 回显:以 allOptions 匹配,避免过滤列表缺项时清掉已选文案;用户动作期内跳过\nwatch(\n [() => props.modelValue, allOptions],\n ([modelValue]) => {\n if (isUserActive()) return\n syncSelected(modelValue, allOptions.value)\n },\n { immediate: true }\n)\n\n// 过滤时单独同步高亮(allOptions 不变,不会触发上方回显 watch)\nwatch([queryString, options], () => {\n if (!queryString.value) return\n currentIndex.value = options.value.length ? 0 : -1\n})\n\nconst baseVirtualEnabled = computed(() => options.value.length > 80)\nconst virtualEnabled = computed(() => baseVirtualEnabled.value && !props.grid)\n\nconst { virtualizer, items } = useVirtualizer({\n count: computed(() => options.value.length),\n scrollEl: () => scrollRef.value?.containerRef ?? null,\n contentEl: () => (virtualEnabled.value ? (scrollRef.value?.contentRef ?? null) : null),\n gap: 4,\n estimateSize: () => 40\n})\n\nconst virtualOptions = computed(() => {\n const _options = options.value\n return items.value.map((item) => {\n const option = _options[item.index]!\n return {\n option,\n index: item.index,\n label: o(option).get(labelKey.value),\n val: o(option).get(valueKey.value),\n key: item.index,\n offset: item.start\n }\n })\n})\n\nconst measureElement: (index: number, el: Element | null) => void = (index, el) =>\n virtualizer.measureElement(index, el)\n\nfunction scrollTo(index: number): void {\n virtualizer.scrollToIndex(index, { align: 'center' })\n}\n\nwatch([scrollRef, virtualEnabled], ([scroll, virtualEnabled]) => {\n if (!scroll || !props.modelValue) return\n\n if (virtualEnabled) {\n const index = options.value.findIndex((option) => option === selected.value)\n index !== -1 && dropdownVisible.value && nextTick(() => scrollTo(index))\n } else {\n const selectedEl = scroll?.contentRef?.getElementsByClassName('is-selected')[0]\n if (selectedEl) {\n scrollIntoContainerView(selectedEl as HTMLElement, scroll.containerRef ?? null)\n }\n }\n})\n\n/** 落定待转正的临时选项(面板 DOM 已卸载,列表恢复全量用户不可见) */\nfunction promotePendingTemp() {\n if (!pendingTempPromote) return\n pendingTempPromote = false\n temOptionsToCreatedOptions()\n}\n\nwatch(dropdownVisible, (visible) => {\n if (visible) {\n // 关闭动画期间被重新打开时补一次转正,保证已选临时项落到完整列表\n promotePendingTemp()\n // 面板展开后进入查询态并聚焦输入框,可以立即输入查询\n if (filterable.value) {\n queryString.value = ''\n querying.value = true\n nextTick(() => inputRef.value?.el?.focus())\n }\n } else {\n // 面板完全关闭(动画结束、DOM 卸载)后才清空查询串并转正,关闭动画期间列表保持过滤态\n querying.value = false\n queryString.value = ''\n promotePendingTemp()\n }\n})\n\n/** 单选:用户动作内 O(1) 写入值与文案,跳过 modelValue 回显的 O(n) 查找 */\nconst handleSelect = userAction((option: Record<string, any>, _index: number) => {\n const value = option?.[valueKey.value]\n selected.value = option\n\n emit('update:modelValue', value)\n setLabel(option?.[labelKey.value])\n emit('change', option)\n if (option.__isTemp) {\n // 转正延迟到面板关闭后:动画期间保持过滤列表,避免列表瞬间恢复全量导致面板变长闪烁\n pendingTempPromote = true\n }\n // 立即退出查询态,输入框同步恢复显示选中标签;查询串保留至面板关闭,避免关闭动画期间列表恢复全量\n querying.value = false\n // 按当前列表定位高亮(临时项尚未转正,仍在过滤列表中,通常为 0)\n currentIndex.value = options.value.findIndex((item) => o(item).get(valueKey.value) === value)\n if (currentIndex.value >= 0) {\n selected.value = options.value[currentIndex.value]\n }\n dropdownRef.value?.close()\n})\n\n/** 清除选项 */\nconst handleClear = userAction(() => {\n selected.value = undefined\n currentIndex.value = -1\n setLabel(undefined)\n clearCreatedOptions()\n emit('update:modelValue', undefined)\n emit('change', undefined)\n})\n\nfunction getCurrentEl() {\n return scrollRef.value?.contentRef?.querySelector('li.is-selected') as HTMLElement | undefined\n}\n\nconst { handleKeydown } = useKeyboard({\n options,\n currentIndex,\n selectOption: handleSelect,\n getCurrentEl\n})\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqJA,MAAM,QAAQ;EASd,MAAM,OAAO;EASb,MAAM,MAAM,IAAI,QAAQ;EAExB,MAAM,WAAW,eAAe,SAAS,MAAM,UAAU,OAAO,CAAC;EACjE,MAAM,WAAW,eAAe,SAAS,MAAM,UAAU,OAAO,CAAC;EAEjE,MAAM,cAAc,IAAI,EAAE,QAAQ;EAElC,MAAM,EAAE,cAAc,kBAAkB;EACxC,MAAM,EAAE,MAAM,UAAU,aAAa,qBAAqB,CAAC,aAAa,CAAC,GAAG,KAAK,GAAG;GAClF,MAAM;GACN,UAAU;GACV,UAAU;EACZ,CAAC;EAED,MAAM,eAAe,WAAW,EAAE;;EAElC,MAAM,QAAQ,WAAmB;EACjC,MAAM,WAAW,WAAgC;EAEjD,MAAM,iBAAiB,eAAe;GACpC,IAAI,MAAM,OAAO,OAAO,MAAM;GAE9B,IAAI,SAAS,OAAO,OAAO,EAAE,SAAS,KAAK,CAAC,CAAC,IAAI,SAAS,KAAK;GAE/D,OAAO,MAAM,QAAQ,OAAO,MAAM,cAAc,EAAE;EACpD,CAAC;EAED,MAAM,cAAc,WAA4B;EAChD,MAAM,YAAY,WAA0B;EAC5C,MAAM,WAAW,eAA6B,UAAU;EAExD,MAAM,aAAa,eAAe;GAChC,OAAO,MAAM,cAAc,OAAO,MAAM,YAAY;EACtD,CAAC;EAED,MAAM,EACJ,aACA,SACA,SACA,YACA,4BACA,wBACE,WAAW,EAAE,MAAM,CAAC;EAExB,MAAM,kBAAkB,WAAW,KAAK;;EAGxC,IAAI,qBAAqB;;;;;;EAOzB,MAAM,WAAW,WAAW,KAAK;;EAGjC,MAAM,aAAa,eAAe;GAChC,IAAI,WAAW,SAAS,SAAS,OAAO,OAAO,YAAY;GAC3D,OAAO,eAAe;EACxB,CAAC;;EAGD,MAAM,mBAAmB,eAAe;GACtC,IAAI,WAAW,SAAS,SAAS,SAAS,eAAe,OACvD,OAAO,eAAe;GAExB,OAAO,MAAM;EACf,CAAC;EAED,SAAS,iBAAiB,OAAe;GACvC,IAAI,CAAC,WAAW,OAAO;GACvB,YAAY,QAAQ;EACtB;EAEA,MAAM,UAAU,WAAW,KAAK;;EAGhC,MAAM,YAAY,eAAe;GAC/B,OAAO,MAAM,aAAa,CAAC,SAAS,SAAS,QAAQ,SAAS,CAAC,CAAC,eAAe;EACjF,CAAC;;;;;;EAOD,SAAS,0BAA0B,GAAe;GAChD,IAAI,CAAC,WAAW,SAAS,SAAS,OAAO;GACzC,IAAI,EAAE,EAAE,kBAAkB,mBAAmB;GAE7C,EAAE,gBAAgB;GAClB,IAAI,CAAC,gBAAgB,OAAO,YAAY,OAAO,KAAK;EACtD;EAEA,MAAM,EAAE,YAAY,iBAAiB,cAAc;;EAGnD,SAAS,SAAS,MAAe;GAC/B,IAAI,MAAM,UAAU,MAAM;GAC1B,MAAM,QAAQ;GACd,IAAI,CAAC,SAAS,OAAO,KAAK,eAAe,IAAI;EAC/C;;EAGA,SAAS,aAAa,YAAiB,eAAkD;GAEvF,IAAI,YAAY,OAAO;IACrB,aAAa,QAAQ,QAAQ,MAAM,SAAS,IAAI;IAChD;GACF;GAEA,IAAI,CAAC,eAAe,QAAQ;GAE5B,IAAI,eAAe,KAAA,KAAa,eAAe,QAAQ,eAAe,IAAI;IACxE,aAAa,QAAQ,cAAc,WAChC,WAAW,EAAE,MAAM,CAAC,CAAC,IAAI,SAAS,KAAK,MAAM,UAChD;IACA,SAAS,QAAQ,aAAa,SAAS,IAAI,cAAc,aAAa,SAAS,KAAA;IAC/E,IAAI,SAAS,OACX,SAAS,EAAE,SAAS,KAAK,CAAC,CAAC,IAAI,SAAS,KAAK,CAAC;SACzC,IAAI,MAAM,MAEf,MAAM,QAAQ,KAAA;SAGd,SAAS,KAAA,CAAS;GAEtB,OAAO;IACL,aAAa,QAAQ;IACrB,SAAS,QAAQ,KAAA;IACjB,SAAS,KAAA,CAAS;GACpB;EACF;EAGA,MACE,OAAO,MAAM,YAAY,UAAU,IAClC,CAAC,gBAAgB;GAChB,IAAI,aAAa,GAAG;GACpB,aAAa,YAAY,WAAW,KAAK;EAC3C,GACA,EAAE,WAAW,KAAK,CACpB;EAGA,MAAM,CAAC,aAAa,OAAO,SAAS;GAClC,IAAI,CAAC,YAAY,OAAO;GACxB,aAAa,QAAQ,QAAQ,MAAM,SAAS,IAAI;EAClD,CAAC;EAED,MAAM,qBAAqB,eAAe,QAAQ,MAAM,SAAS,EAAE;EACnE,MAAM,iBAAiB,eAAe,mBAAmB,SAAS,CAAC,MAAM,IAAI;EAE7E,MAAM,EAAE,aAAa,UAAU,eAAe;GAC5C,OAAO,eAAe,QAAQ,MAAM,MAAM;GAC1C,gBAAgB,UAAU,OAAO,gBAAgB;GACjD,iBAAkB,eAAe,QAAS,UAAU,OAAO,cAAc,OAAQ;GACjF,KAAK;GACL,oBAAoB;EACtB,CAAC;EAED,MAAM,iBAAiB,eAAe;GACpC,MAAM,WAAW,QAAQ;GACzB,OAAO,MAAM,MAAM,KAAK,SAAS;IAC/B,MAAM,SAAS,SAAS,KAAK;IAC7B,OAAO;KACL;KACA,OAAO,KAAK;KACZ,OAAO,EAAE,MAAM,CAAC,CAAC,IAAI,SAAS,KAAK;KACnC,KAAK,EAAE,MAAM,CAAC,CAAC,IAAI,SAAS,KAAK;KACjC,KAAK,KAAK;KACV,QAAQ,KAAK;IACf;GACF,CAAC;EACH,CAAC;EAED,MAAM,kBAA+D,OAAO,OAC1E,YAAY,eAAe,OAAO,EAAE;EAEtC,SAAS,SAAS,OAAqB;GACrC,YAAY,cAAc,OAAO,EAAE,OAAO,SAAS,CAAC;EACtD;EAEA,MAAM,CAAC,WAAW,cAAc,IAAI,CAAC,QAAQ,oBAAoB;GAC/D,IAAI,CAAC,UAAU,CAAC,MAAM,YAAY;GAElC,IAAI,gBAAgB;IAClB,MAAM,QAAQ,QAAQ,MAAM,WAAW,WAAW,WAAW,SAAS,KAAK;IAC3E,UAAU,MAAM,gBAAgB,SAAS,eAAe,SAAS,KAAK,CAAC;GACzE,OAAO;IACL,MAAM,aAAa,QAAQ,YAAY,uBAAuB,aAAa,CAAC,CAAC;IAC7E,IAAI,YACF,wBAAwB,YAA2B,OAAO,gBAAgB,IAAI;GAElF;EACF,CAAC;;EAGD,SAAS,qBAAqB;GAC5B,IAAI,CAAC,oBAAoB;GACzB,qBAAqB;GACrB,2BAA2B;EAC7B;EAEA,MAAM,kBAAkB,YAAY;GAClC,IAAI,SAAS;IAEX,mBAAmB;IAEnB,IAAI,WAAW,OAAO;KACpB,YAAY,QAAQ;KACpB,SAAS,QAAQ;KACjB,eAAe,SAAS,OAAO,IAAI,MAAM,CAAC;IAC5C;GACF,OAAO;IAEL,SAAS,QAAQ;IACjB,YAAY,QAAQ;IACpB,mBAAmB;GACrB;EACF,CAAC;;EAGD,MAAM,eAAe,YAAY,QAA6B,WAAmB;GAC/E,MAAM,QAAQ,SAAS,SAAS;GAChC,SAAS,QAAQ;GAEjB,KAAK,qBAAqB,KAAK;GAC/B,SAAS,SAAS,SAAS,MAAM;GACjC,KAAK,UAAU,MAAM;GACrB,IAAI,OAAO,UAET,qBAAqB;GAGvB,SAAS,QAAQ;GAEjB,aAAa,QAAQ,QAAQ,MAAM,WAAW,SAAS,EAAE,IAAI,CAAC,CAAC,IAAI,SAAS,KAAK,MAAM,KAAK;GAC5F,IAAI,aAAa,SAAS,GACxB,SAAS,QAAQ,QAAQ,MAAM,aAAa;GAE9C,YAAY,OAAO,MAAM;EAC3B,CAAC;;EAGD,MAAM,cAAc,iBAAiB;GACnC,SAAS,QAAQ,KAAA;GACjB,aAAa,QAAQ;GACrB,SAAS,KAAA,CAAS;GAClB,oBAAoB;GACpB,KAAK,qBAAqB,KAAA,CAAS;GACnC,KAAK,UAAU,KAAA,CAAS;EAC1B,CAAC;EAED,SAAS,eAAe;GACtB,OAAO,UAAU,OAAO,YAAY,cAAc,gBAAgB;EACpE;EAEA,MAAM,EAAE,kBAAkB,YAAY;GACpC;GACA;GACA,cAAc;GACd;EACF,CAAC;;GA7aU,OAAA,CAAAE,MAAA,QAAA,KADTC,UAAA,GAAAC,YAkHaF,MAAAG,WAAA,GAlHbC,WAkHa,EAAA,KAAA,EAAA,GAhHHN,KAAAA,QAAM;IACd,SAAQ;IACP,OAAK,CAAGE,MAAA,GAAA,CAAG,CAAC,GAAGA,MAAA,GAAA,CAAG,CAAC,GAAE,YAAaA,MAAA,QAAA,CAAQ,CAAA;IACvC,SAAA;IAAJ,KAAI;IACI,SAAS,gBAAA;IAAA,oBAAA,OAAA,OAAA,OAAA,MAAA,WAAA,gBAAe,QAAA;IAC/B,iBAAa;KAAGA,MAAA,GAAA,CAAG,CAAC,EAAC,OAAA;KAAWA,MAAA,GAAA,CAAG,CAAC,GAAE,SAAUA,MAAA,IAAA,CAAI;KAAG,QAAA;IAAY;IACnE,iBAAe,QAAA;IACf,UAAUA,MAAA,QAAA;IACV,aAAW,QAAA;IACX,OAAO,QAAA;IACP,WAASA,MAAA,aAAA;IACT,cAAU,OAAA,OAAA,OAAA,MAAA,WAAE,QAAA,QAAO;IACnB,cAAU,OAAA,OAAA,OAAA,MAAA,WAAE,QAAA,QAAO;;IAGT,SAAOK,cAiCN,CAhCVC,YAgCUN,MAAAO,aAAA,GAAA;KA/BJ,SAAA;KAAJ,KAAI;KACH,MAAMP,MAAA,IAAA;KACN,UAAUA,MAAA,QAAA;KACV,aAAa,iBAAA;KACb,WAAW;KACX,eAAa,WAAA;KACb,uBAAoB;KACpB,WAASA,MAAA,aAAA;KACT,mBAAe,CAAG,WAAA,SAAU,CAAK,SAAA;KAClB,gBAAA;;KAML,QAAMK,cAcF,CAbbC,YAaaG,YAAA;MAbD,MAAK;MAAU,MAAK;;MAC9B,SAAAJ,cAQS,CAPD,UAAA,SADRJ,UAAA,GAAAC,YAQSF,MAAAU,WAAA,GAAA;OANN,OAAKC,eAAEX,MAAA,GAAA,CAAG,CAAC,EAAC,OAAA,CAAA;OACb,OAAM;OACN,KAAI;OACH,SAAKY,cAAOZ,MAAA,WAAA,GAAW,CAAA,MAAA,CAAA;;OAExB,SAAAK,cAAS,CAATC,YAASN,MAAA,KAAA,CAAA,CAAA,CAAA;;MAEX,GAAA,GAAA,CAAA,SAAA,SAAA,CAAA,MAAAC,UAAA,GAAAC,YAESF,MAAAU,WAAA,GAAA;OAFO,OAAKC,eAAEX,MAAA,GAAA,CAAG,CAAC,EAAC,OAAA,CAAA;OAAW,KAAI;;OACzC,SAAAK,cAAa,CAAbC,YAAaN,MAAA,SAAA,CAAA,CAAA,CAAA;;;;;;IAhBKD,GAAAA,CAAAA,KAAAA,OAAO,SAAA;KAApB,MAAA;KACT,IAAAM,cAAsB,CAAtBQ,WAAsB,KAAA,QAAA,QAAA,CAAA,CAAA;;;;;;;;;;IAuBjB,SAAOR,cAIb,CAHHS,mBAAA,gIAAA,GAIWd,MAAA,OAAA,KAAXC,UAAA,GAAAc,mBAEM,OAAA;;KAFe,OAAKJ,eAAEX,MAAA,GAAA,CAAG,CAAC,EAAC,SAAA,CAAA;IAC/B,GAAA,CAAAM,YAA6BN,MAAAgB,WAAA,GAAA,EAAnB,MAAK,YAAW,CAAA,CAAA,GAAA,CAGf,KAAAhB,MAAA,OAAA,CAAO,CAAC,UADrBC,UAAA,GAAAC,YA8CWF,MAAAiB,WAAA,GAAA;;KA5CT,KAAI;KACH,OAAKN,eAAEX,MAAA,GAAA,CAAG,CAAC,EAAC,SAAA,CAAA;KACT,SAAA;KAAJ,KAAI;KACH,iBAAa;MAAcA,MAAA,GAAA,CAAG,CAAC,EAAC,cAAA;MAA4BA,MAAA,GAAA,CAAG,CAAC,GAAE,WAAY,eAAA,KAAc;MAAaA,MAAA,GAAA,CAAG,CAAC,GAAE,QAAA,CAAA,CAAW,QAAA,IAAI;;KAK9H,iBAAa;MAAmC,qBAAA,QAAA,OAAI,UAAa,QAAA,KAAK,KAAI,uBAAwB,KAAA;MAA8B,SAAA,QAAA,OAAOA,MAAA,QAAA,CAAQ,CAAC,QAAA,KAAK,KAAG,IAAA,IAAU,KAAA;;;KAKnK,SAAAK,cAeW,CAfK,eAAA,SAAhBJ,UAAA,GAAAc,mBAeWG,UAAA,EAAA,KAAA,EAAA,GAAA,CAdTJ,mBAAA,eAAA,IACAb,UAAA,IAAA,GAAAc,mBAYKG,UAAA,MAAAC,WAXkD,eAAA,QAAc,EAA1D,QAAQ,OAAO,KAAK,OAAO,KAAK,aAAM;MADjD,OAAAlB,UAAA,GAAAc,mBAYK,MAAA;OAVF,OAAKJ,eAAA,CAAGX,MAAA,WAAA,GAAaA,MAAA,GAAA,CAAG,CAAC,GAAE,YAAa,UAAU,aAAA,KAAY,CAAA,CAAA;OAC9D,UAAK,WAAEA,MAAA,YAAA,CAAY,CAAC,QAAQ,KAAK;OAC5B;OACL,OAAKoB,eAAA,EAAA,WAAA,cAA6B,OAAM,KAAA,CAAA;OACxC,cAAY;;OACZ,MAAM,OAAO,eAAe,OAAO,EAAE;MAEtC,GAAA,CAAAP,WAEO,KAAA,QAAA,WAFPT,WAEO,EAAA,SAAA,KAAA,GAAA;OAFS;OAAQ;MAAK,CAAA,SAEtB,CADFiB,gBAAAC,gBAAA,KAAK,GAAA,CAAA,CAAA,CAAA,CAAA,GAAA,IAAA,UAAA;KAMZ,CAAA,GAAA,GAAA,EAAA,GAAA,EAAA,MAAArB,UAAA,IAAA,GAAAc,mBAWKG,UAAA,EAAA,KAAA,EAAA,GAAAC,WAVuBnB,MAAA,OAAA,IAAlB,QAAQ,UAAK;MADvB,OAAAC,UAAA,GAAAc,mBAWK,MAAA;OATF,OAAKJ,eAAA,CAAGX,MAAA,WAAA,GAAaA,MAAA,GAAA,CAAG,CAAC,GAAE,YAAa,UAAU,aAAA,KAAY,CAAA,CAAA;OAC9D,UAAK,WAAEA,MAAA,YAAA,CAAY,CAAC,QAAQ,KAAK;OACjC,cAAY;OACZ,OAAOA,MAAA,CAAA,CAAC,CAAC,MAAM,CAAA,CAAE,IAAI,SAAA,KAAQ;OAC7B,KAAKA,MAAA,CAAA,CAAC,CAAC,MAAM,CAAA,CAAE,IAAI,SAAA,KAAQ;MAE5B,GAAA,CAAAa,WAEO,KAAA,QAAA,WAFPT,WAEO,EAAA,SAAA,KAAA,GAAA;OAFS;OAAQ;MAAK,CAAA,SAEtB,CADFiB,gBAAAC,gBAAAtB,MAAA,CAAA,CAAC,CAAC,MAAM,CAAA,CAAE,IAAI,SAAA,KAAQ,CAAA,GAAA,CAAA,CAAA,CAAA,CAAA,GAAA,IAAA,UAAA;;;;;;;IAMjC,CAAA,MAAAC,UAAA,GAAAc,mBAEM,OAAA;;KAFO,OAAKJ,eAAEX,MAAA,GAAA,CAAG,CAAC,EAAC,OAAA,CAAA;IACvB,GAAA,CAAAM,YAAUN,MAAAuB,WAAA,CAAA,CAAA,GAAA,CAAA,EAAA,CAAA;;;;;;;;;;;GAKhB,CAAA,MAAAtB,UAAA,GAAAc,mBAEWG,UAAA,EAAA,KAAA,EAAA,GAAA,CADNG,gBAAAC,gBAAA,eAAA,SAAkBtB,MAAA,kBAAA,CAAkB,GAAA,CAAA,CAAA,GAAA,EAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slider-thumb.js","names":[],"sources":["../../../src/components/slider/slider-thumb.vue"],"sourcesContent":["<template>\n <div ref=\"thumb\" :class=\"cls.e('thumb')\" :style :tabindex=\"disabled ? -1 : 0\"></div>\n</template>\n<script lang=\"ts\" setup>\nimport { useDrag, useUserAction } from '@veltra/compositions'\nimport { computed, inject, useTemplateRef, watch } from 'vue'\n\nimport { sliderContextKey } from './di'\n\nconst props = defineProps<{ modelValue: number }>()\n\nconst emit = defineEmits<{ (e: 'update:modelValue', value: number): void }>()\n\nconst { cls, range, disabled, sliderProps, getOffsetByStep } = inject(sliderContextKey)!\n\nconst thumbRef = useTemplateRef('thumb')\n\nconst style = computed(() => {\n if (sliderProps.vertical) {\n return { transform: `translate(0, ${props.modelValue}px)` }\n }\n return { transform: `translate(${props.modelValue}px, 0)` }\n})\n\nconst { userAction, isUserActive } = useUserAction()\n\nfunction updateModel(offset: number) {\n offset = getOffsetByStep(offset)\n emit('update:modelValue', offset)\n return offset\n}\n\nconst dragger = useDrag({\n target: computed(() => (disabled.value ? null : thumbRef.value)),\n\n onDrag: userAction(({ offsetX, offsetY }) => {\n updateModel(sliderProps.vertical ? offsetY : offsetX)\n }),\n rangeX: range,\n rangeY: range,\n onDragEnd: userAction(({ offsetX, offsetY }) => {\n const offset = updateModel(sliderProps.vertical ? offsetY : offsetX)\n updateDragger(offset)\n })\n})\n\nfunction updateDragger(offset: number) {\n if (sliderProps.vertical) {\n dragger.update({ offsetY: offset })\n } else {\n dragger.update({ offsetX: offset })\n }\n}\n\nwatch(\n () => props.modelValue,\n (offset) => {\n if (isUserActive()) return\n updateDragger(offset)\n }\n)\n</script>\n"],"mappings":";;;;;;;;;;EASA,MAAM,QAAQ;EAEd,MAAM,OAAO;EAEb,MAAM,EAAE,KAAK,OAAO,UAAU,aAAa,oBAAoB,OAAO,gBAAgB;EAEtF,MAAM,WAAW,eAAe,OAAO;EAEvC,MAAM,QAAQ,eAAe;GAC3B,IAAI,YAAY,UACd,OAAO,EAAE,WAAW,gBAAgB,MAAM,WAAW,KAAK;GAE5D,OAAO,EAAE,WAAW,aAAa,MAAM,WAAW,QAAQ;EAC5D,CAAC;EAED,MAAM,EAAE,YAAY,iBAAiB,cAAc;EAEnD,SAAS,YAAY,QAAgB;GACnC,SAAS,gBAAgB,MAAM;GAC/B,KAAK,qBAAqB,MAAM;GAChC,OAAO;EACT;EAEA,MAAM,UAAU,QAAQ;GACtB,QAAQ,eAAgB,SAAS,QAAQ,OAAO,SAAS,KAAM;GAE/D,QAAQ,YAAY,EAAE,SAAS,cAAc;IAC3C,YAAY,YAAY,WAAW,UAAU,OAAO;GACtD,CAAC;GACD,QAAQ;GACR,QAAQ;GACR,WAAW,YAAY,EAAE,SAAS,cAAc;IAE9C,cADe,YAAY,YAAY,WAAW,UAAU,OAC9C,CAAM;GACtB,CAAC;EACH,CAAC;EAED,SAAS,cAAc,QAAgB;GACrC,IAAI,YAAY,UACd,QAAQ,OAAO,EAAE,SAAS,OAAO,CAAC;QAElC,QAAQ,OAAO,EAAE,SAAS,OAAO,CAAC;EAEtC;EAEA,YACQ,MAAM,aACX,WAAW;GACV,IAAI,aAAa,GAAG;GACpB,cAAc,MAAM;EACtB,CACF;;GA3DE,
|
|
1
|
+
{"version":3,"file":"slider-thumb.js","names":["_openBlock","_createElementBlock","_normalizeClass","_unref","_normalizeStyle"],"sources":["../../../src/components/slider/slider-thumb.vue"],"sourcesContent":["<template>\n <div ref=\"thumb\" :class=\"cls.e('thumb')\" :style :tabindex=\"disabled ? -1 : 0\"></div>\n</template>\n<script lang=\"ts\" setup>\nimport { useDrag, useUserAction } from '@veltra/compositions'\nimport { computed, inject, useTemplateRef, watch } from 'vue'\n\nimport { sliderContextKey } from './di'\n\nconst props = defineProps<{ modelValue: number }>()\n\nconst emit = defineEmits<{ (e: 'update:modelValue', value: number): void }>()\n\nconst { cls, range, disabled, sliderProps, getOffsetByStep } = inject(sliderContextKey)!\n\nconst thumbRef = useTemplateRef('thumb')\n\nconst style = computed(() => {\n if (sliderProps.vertical) {\n return { transform: `translate(0, ${props.modelValue}px)` }\n }\n return { transform: `translate(${props.modelValue}px, 0)` }\n})\n\nconst { userAction, isUserActive } = useUserAction()\n\nfunction updateModel(offset: number) {\n offset = getOffsetByStep(offset)\n emit('update:modelValue', offset)\n return offset\n}\n\nconst dragger = useDrag({\n target: computed(() => (disabled.value ? null : thumbRef.value)),\n\n onDrag: userAction(({ offsetX, offsetY }) => {\n updateModel(sliderProps.vertical ? offsetY : offsetX)\n }),\n rangeX: range,\n rangeY: range,\n onDragEnd: userAction(({ offsetX, offsetY }) => {\n const offset = updateModel(sliderProps.vertical ? offsetY : offsetX)\n updateDragger(offset)\n })\n})\n\nfunction updateDragger(offset: number) {\n if (sliderProps.vertical) {\n dragger.update({ offsetY: offset })\n } else {\n dragger.update({ offsetX: offset })\n }\n}\n\nwatch(\n () => props.modelValue,\n (offset) => {\n if (isUserActive()) return\n updateDragger(offset)\n }\n)\n</script>\n"],"mappings":";;;;;;;;;;EASA,MAAM,QAAQ;EAEd,MAAM,OAAO;EAEb,MAAM,EAAE,KAAK,OAAO,UAAU,aAAa,oBAAoB,OAAO,gBAAgB;EAEtF,MAAM,WAAW,eAAe,OAAO;EAEvC,MAAM,QAAQ,eAAe;GAC3B,IAAI,YAAY,UACd,OAAO,EAAE,WAAW,gBAAgB,MAAM,WAAW,KAAK;GAE5D,OAAO,EAAE,WAAW,aAAa,MAAM,WAAW,QAAQ;EAC5D,CAAC;EAED,MAAM,EAAE,YAAY,iBAAiB,cAAc;EAEnD,SAAS,YAAY,QAAgB;GACnC,SAAS,gBAAgB,MAAM;GAC/B,KAAK,qBAAqB,MAAM;GAChC,OAAO;EACT;EAEA,MAAM,UAAU,QAAQ;GACtB,QAAQ,eAAgB,SAAS,QAAQ,OAAO,SAAS,KAAM;GAE/D,QAAQ,YAAY,EAAE,SAAS,cAAc;IAC3C,YAAY,YAAY,WAAW,UAAU,OAAO;GACtD,CAAC;GACD,QAAQ;GACR,QAAQ;GACR,WAAW,YAAY,EAAE,SAAS,cAAc;IAE9C,cADe,YAAY,YAAY,WAAW,UAAU,OAC9C,CAAM;GACtB,CAAC;EACH,CAAC;EAED,SAAS,cAAc,QAAgB;GACrC,IAAI,YAAY,UACd,QAAQ,OAAO,EAAE,SAAS,OAAO,CAAC;QAElC,QAAQ,OAAO,EAAE,SAAS,OAAO,CAAC;EAEtC;EAEA,YACQ,MAAM,aACX,WAAW;GACV,IAAI,aAAa,GAAG;GACpB,cAAc,MAAM;EACtB,CACF;;GA3DE,OAAAA,UAAA,GAAAC,mBAAoF,OAAA;IAA/E,KAAI;IAAS,OAAKC,eAAEC,MAAA,GAAA,CAAG,CAAC,EAAC,OAAA,CAAA;IAAY,OAAKC,eAAL,MAAA,KAAK;IAAE,UAAUD,MAAA,QAAA,IAAQ,KAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"slider.js","names":[],"sources":["../../../src/components/slider/slider.vue"],"sourcesContent":["<template>\n <div v-if=\"!readonly\" :class=\"className\">\n <div :class=\"cls.e('track')\" ref=\"sliderRef\" @click=\"handleClickSlider\">\n <div :class=\"cls.e('bar')\" :style=\"barStyles\" />\n\n <slider-thumb v-model=\"offset1\" @click.stop />\n <slider-thumb v-if=\"range\" v-model=\"offset2\" @click.stop />\n\n <div\n v-for=\"tick in ticks\"\n :style=\"{ [vertical ? 'bottom' : 'left']: `${tick}%` }\"\n :class=\"cls.e('tick')\"\n />\n </div>\n </div>\n\n <div v-else>\n {{ props.modelValue }}\n </div>\n</template>\n\n<script lang=\"ts\" setup generic=\"T extends number | [number, number]\">\nimport { useFormFallbackProps, useUserAction } from '@veltra/compositions'\nimport { bem } from '@veltra/utils'\nimport { injectFormContext } from '@veltra/utils'\nimport { computed, provide, watch } from 'vue'\n\nimport type { SliderProps, SliderEmits } from '../../types'\nimport { sliderContextKey } from './di'\nimport SliderThumb from './slider-thumb.vue'\nimport { useSlider } from './use-slider'\n\ndefineOptions({ name: 'USlider' })\n\nconst props = withDefaults(defineProps<SliderProps<T>>(), {\n min: 0,\n max: 100,\n disabled: undefined,\n readonly: undefined\n})\n\nconst emit = defineEmits<SliderEmits<T>>()\n\nconst cls = bem('slider')\n\nconst { formProps } = injectFormContext()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props])\n\nconst className = computed(() => {\n return [\n cls.b,\n cls.m(size.value),\n bem.is('disabled', disabled.value),\n bem.is('range', props.range),\n bem.is('horizontal', !props.vertical),\n bem.is('vertical', props.vertical)\n ]\n})\n\nconst {\n offset1,\n offset2,\n sliderRef,\n slideRange,\n sliderSize,\n sliderOffset2Value,\n value2SliderOffset,\n getOffsetByStep\n} = useSlider(props)\n\nconst barStyles = computed(() => {\n const { vertical } = props\n const offsetProp = vertical ? 'bottom' : 'left'\n const sizeProp = vertical ? 'height' : 'width'\n\n if (!props.range) {\n return { [offsetProp]: 0, [sizeProp]: `${Math.abs(offset1.value)}px` }\n }\n return {\n [offsetProp]: `${Math.min(Math.abs(offset1.value), Math.abs(offset2.value))}px`,\n [sizeProp]: `${Math.abs(offset1.value - offset2.value)}px`\n }\n})\n\nconst { userAction, isUserActive } = useUserAction()\n\nwatch(\n [sliderSize, ...['modelValue', 'range', 'max', 'min', 'vertical'].map((k) => () => props[k])],\n ([size, value, range]) => {\n if (isUserActive()) return\n if (value === undefined || size === 0) return\n\n if (range) {\n offset1.value = value2SliderOffset((value as [number, number])[0])\n offset2.value = value2SliderOffset((value as [number, number])[1])\n } else {\n offset1.value = value2SliderOffset(value as number)\n }\n },\n { immediate: true }\n)\n\nconst ticks = computed(() => {\n const { step, min, max } = props\n if (!step) return []\n const tickLength = Math.ceil((max! - min!) / step)\n const offsetPercent = (step / (max! - min!)) * 100\n\n return [...Array.from({ length: tickLength }, (_, i) => i * offsetPercent), 100]\n})\n\nwatch(\n [offset1, offset2],\n userAction((v) => {\n if (sliderSize.value === 0) return\n\n if (props.range) {\n const next = v.map(sliderOffset2Value).toSorted((a, b) => a - b) as [number, number]\n const current = props.modelValue as [number, number] | undefined\n if (current) {\n const [a, b] = [...current].sort((x, y) => x - y)\n if (next[0] === a && next[1] === b) return\n }\n emit('update:modelValue', next as T)\n } else {\n const next = sliderOffset2Value(v[0])\n if (next === props.modelValue) return\n emit('update:modelValue', next as T)\n }\n })\n)\n\nfunction handleClickSlider(e: MouseEvent) {\n if (disabled.value || props.range) return\n\n // 获取点击位置相对于滑块的偏移量\n const rect = (e.currentTarget as HTMLElement).getBoundingClientRect()\n\n offset1.value = getOffsetByStep(e.clientX - rect.left)\n}\n\nprovide(sliderContextKey, { sliderProps: props, disabled, range: slideRange, cls, getOffsetByStep })\n</script>\n"],"mappings":"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
|
|
1
|
+
{"version":3,"file":"slider.js","names":["_unref","_openBlock","_createElementBlock","_normalizeClass","_createElementVNode","_normalizeStyle","_createVNode","SliderThumb","_isRef","_withModifiers","_createBlock","_createCommentVNode","_Fragment","_renderList","_toDisplayString"],"sources":["../../../src/components/slider/slider.vue"],"sourcesContent":["<template>\n <div v-if=\"!readonly\" :class=\"className\">\n <div :class=\"cls.e('track')\" ref=\"sliderRef\" @click=\"handleClickSlider\">\n <div :class=\"cls.e('bar')\" :style=\"barStyles\" />\n\n <slider-thumb v-model=\"offset1\" @click.stop />\n <slider-thumb v-if=\"range\" v-model=\"offset2\" @click.stop />\n\n <div\n v-for=\"tick in ticks\"\n :style=\"{ [vertical ? 'bottom' : 'left']: `${tick}%` }\"\n :class=\"cls.e('tick')\"\n />\n </div>\n </div>\n\n <div v-else>\n {{ props.modelValue }}\n </div>\n</template>\n\n<script lang=\"ts\" setup generic=\"T extends number | [number, number]\">\nimport { useFormFallbackProps, useUserAction } from '@veltra/compositions'\nimport { bem } from '@veltra/utils'\nimport { injectFormContext } from '@veltra/utils'\nimport { computed, provide, watch } from 'vue'\n\nimport type { SliderProps, SliderEmits } from '../../types'\nimport { sliderContextKey } from './di'\nimport SliderThumb from './slider-thumb.vue'\nimport { useSlider } from './use-slider'\n\ndefineOptions({ name: 'USlider' })\n\nconst props = withDefaults(defineProps<SliderProps<T>>(), {\n min: 0,\n max: 100,\n disabled: undefined,\n readonly: undefined\n})\n\nconst emit = defineEmits<SliderEmits<T>>()\n\nconst cls = bem('slider')\n\nconst { formProps } = injectFormContext()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props])\n\nconst className = computed(() => {\n return [\n cls.b,\n cls.m(size.value),\n bem.is('disabled', disabled.value),\n bem.is('range', props.range),\n bem.is('horizontal', !props.vertical),\n bem.is('vertical', props.vertical)\n ]\n})\n\nconst {\n offset1,\n offset2,\n sliderRef,\n slideRange,\n sliderSize,\n sliderOffset2Value,\n value2SliderOffset,\n getOffsetByStep\n} = useSlider(props)\n\nconst barStyles = computed(() => {\n const { vertical } = props\n const offsetProp = vertical ? 'bottom' : 'left'\n const sizeProp = vertical ? 'height' : 'width'\n\n if (!props.range) {\n return { [offsetProp]: 0, [sizeProp]: `${Math.abs(offset1.value)}px` }\n }\n return {\n [offsetProp]: `${Math.min(Math.abs(offset1.value), Math.abs(offset2.value))}px`,\n [sizeProp]: `${Math.abs(offset1.value - offset2.value)}px`\n }\n})\n\nconst { userAction, isUserActive } = useUserAction()\n\nwatch(\n [sliderSize, ...['modelValue', 'range', 'max', 'min', 'vertical'].map((k) => () => props[k])],\n ([size, value, range]) => {\n if (isUserActive()) return\n if (value === undefined || size === 0) return\n\n if (range) {\n offset1.value = value2SliderOffset((value as [number, number])[0])\n offset2.value = value2SliderOffset((value as [number, number])[1])\n } else {\n offset1.value = value2SliderOffset(value as number)\n }\n },\n { immediate: true }\n)\n\nconst ticks = computed(() => {\n const { step, min, max } = props\n if (!step) return []\n const tickLength = Math.ceil((max! - min!) / step)\n const offsetPercent = (step / (max! - min!)) * 100\n\n return [...Array.from({ length: tickLength }, (_, i) => i * offsetPercent), 100]\n})\n\nwatch(\n [offset1, offset2],\n userAction((v) => {\n if (sliderSize.value === 0) return\n\n if (props.range) {\n const next = v.map(sliderOffset2Value).toSorted((a, b) => a - b) as [number, number]\n const current = props.modelValue as [number, number] | undefined\n if (current) {\n const [a, b] = [...current].sort((x, y) => x - y)\n if (next[0] === a && next[1] === b) return\n }\n emit('update:modelValue', next as T)\n } else {\n const next = sliderOffset2Value(v[0])\n if (next === props.modelValue) return\n emit('update:modelValue', next as T)\n }\n })\n)\n\nfunction handleClickSlider(e: MouseEvent) {\n if (disabled.value || props.range) return\n\n // 获取点击位置相对于滑块的偏移量\n const rect = (e.currentTarget as HTMLElement).getBoundingClientRect()\n\n offset1.value = getOffsetByStep(e.clientX - rect.left)\n}\n\nprovide(sliderContextKey, { sliderProps: props, disabled, range: slideRange, cls, getOffsetByStep })\n</script>\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"steps.js","names":[],"sources":["../../../src/components/steps/steps.vue"],"sourcesContent":["<template>\n <ol :class=\"className\" ref=\"steps\">\n <li\n v-for=\"(item, index) in items\"\n :class=\"[\n cls.e('item'),\n bem.is('current', index === currentIndex),\n bem.is('finished', currentIndex === undefined || index < currentIndex)\n ]\"\n @click=\"handleStepClick(item, index)\"\n >\n <div :class=\"cls.e('node')\">\n <i :class=\"cls.e('link')\" v-if=\"index !== items.length - 1\"></i>\n\n <span\n :class=\"cls.e('icon')\"\n @mouseenter=\"handleStepMouseenter($event, item, index)\"\n @mouseleave=\"handleStepMouseleave\"\n >\n <slot name=\"icon\" :item=\"item\" :index=\"index\">\n <UIcon v-if=\"currentIndex === undefined || index < currentIndex\">\n <Check />\n </UIcon>\n\n <template v-else>\n {{ index + 1 }}\n </template>\n </slot>\n </span>\n </div>\n\n <div :class=\"cls.e('content')\">\n <slot name=\"content\" :item=\"item\" :index=\"index\">\n {{ o(item).get(labelKey) }}\n </slot>\n </div>\n </li>\n\n <u-tip\n v-if=\"slots.tip\"\n ref=\"tip\"\n :trigger-dom=\"tipTriggerDom\"\n v-model:visible=\"tipVisible\"\n @update:visible=\"handleTipUpdateVisible\"\n >\n <template #content>\n <UNodeRender :content=\"tipContent\" />\n </template>\n </u-tip>\n </ol>\n</template>\n\n<script lang=\"ts\" setup>\nimport { n, o } from '@cat-kit/core'\nimport { useFallbackProps } from '@veltra/compositions'\nimport { Check } from '@veltra/icons/normal'\nimport { bem, fieldKey } from '@veltra/utils'\nimport { computed, shallowRef, useTemplateRef, watch } from 'vue'\n\nimport type { StepsProps, StepsEmits, ComponentSize, StepsSlotScope } from '../../types'\nimport { UIcon } from '../icon'\nimport { UNodeRender } from '../node-render'\nimport { UTip } from '../tip'\n\ndefineOptions({ name: 'USteps' })\n\nconst props = withDefaults(defineProps<StepsProps>(), {\n direction: 'horizontal',\n finishedStepType: 'success',\n labelKey: 'label'\n})\n\nconst emit = defineEmits<StepsEmits>()\n\nconst slots = defineSlots<{\n icon?: (scope: StepsSlotScope) => any\n content?: (scope: StepsSlotScope) => any\n tip?: (scope: StepsSlotScope) => any\n}>()\n\nconst cls = bem('steps')\n\nconst labelKey = computed(() => fieldKey(props.labelKey, 'label'))\n\nconst { size } = useFallbackProps([props], { size: 'default' as ComponentSize })\n\nconst className = computed(() => {\n const { direction, currentStepType, finishedStepType } = props\n const ret: string[] = [\n cls.b,\n bem.is(direction),\n cls.m(size.value),\n bem.is('align-center', props.alignCenter),\n cls.em('finished', finishedStepType)\n ]\n currentStepType && ret.push(cls.em('current', currentStepType))\n return ret\n})\n\nconst stepsRef = useTemplateRef('steps')\n\nconst currentToIndexMap = computed<Record<string, number> | undefined>(() => {\n const { currentKey, items } = props\n if (!currentKey) return undefined\n return items.reduce(\n (acc, item, index) => {\n acc[o(item).get(currentKey)] = index\n return acc\n },\n {} as Record<string, number>\n )\n})\n\n/** 当前索引 */\nconst currentIndex = computed<number | undefined>(() => {\n const { currentKey, current } = props\n if (current === undefined) return undefined\n\n if (currentKey) {\n return currentToIndexMap.value?.[current]\n }\n\n if (typeof current !== 'number') return undefined\n return n(current).range(0, props.items.length - 1)\n})\n\nwatch(currentIndex, (index) => {\n if (index === undefined || props.direction === 'vertical') return\n const step = stepsRef.value?.children[index]\n if (step) {\n step.scrollIntoView({ behavior: 'smooth', block: 'center' })\n }\n})\n\n// 点击步骤项\nfunction handleStepClick(item: Record<string, any>, index: number) {\n emit('item-click', item, index)\n emit('update:current', props.currentKey ? o(item).get(props.currentKey) : index)\n}\n\n// 提示\nconst tipVisible = shallowRef(false)\nconst tipTriggerDom = shallowRef<HTMLElement>()\nconst tipContent = shallowRef()\n\nfunction handleStepMouseenter(event: MouseEvent, item: Record<string, any>, index: number) {\n if (!slots.tip) return\n tipTriggerDom.value = event.target as HTMLElement\n tipVisible.value = true\n tipContent.value = slots.tip?.({ item, index })\n}\n\nlet timer: number | undefined = undefined\nfunction closeTip() {\n timer = setTimeout(() => {\n tipVisible.value = false\n tipContent.value = undefined\n tipTriggerDom.value = undefined\n }, 250)\n}\n\nfunction handleTipUpdateVisible(visible: boolean) {\n visible && clearTimeout(timer)\n}\n\nfunction handleStepMouseleave() {\n if (!slots.tip) return\n closeTip()\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;EAkEA,MAAM,QAAQ;EAMd,MAAM,OAAO;EAEb,MAAM,
|
|
1
|
+
{"version":3,"file":"steps.js","names":["_useSlots","_openBlock","_createElementBlock","_normalizeClass","_Fragment","_renderList","_unref","_createElementVNode","_createCommentVNode","_renderSlot","_createBlock","UIcon","_withCtx","_createVNode","_createTextVNode","_toDisplayString","UTip","UNodeRender"],"sources":["../../../src/components/steps/steps.vue"],"sourcesContent":["<template>\n <ol :class=\"className\" ref=\"steps\">\n <li\n v-for=\"(item, index) in items\"\n :class=\"[\n cls.e('item'),\n bem.is('current', index === currentIndex),\n bem.is('finished', currentIndex === undefined || index < currentIndex)\n ]\"\n @click=\"handleStepClick(item, index)\"\n >\n <div :class=\"cls.e('node')\">\n <i :class=\"cls.e('link')\" v-if=\"index !== items.length - 1\"></i>\n\n <span\n :class=\"cls.e('icon')\"\n @mouseenter=\"handleStepMouseenter($event, item, index)\"\n @mouseleave=\"handleStepMouseleave\"\n >\n <slot name=\"icon\" :item=\"item\" :index=\"index\">\n <UIcon v-if=\"currentIndex === undefined || index < currentIndex\">\n <Check />\n </UIcon>\n\n <template v-else>\n {{ index + 1 }}\n </template>\n </slot>\n </span>\n </div>\n\n <div :class=\"cls.e('content')\">\n <slot name=\"content\" :item=\"item\" :index=\"index\">\n {{ o(item).get(labelKey) }}\n </slot>\n </div>\n </li>\n\n <u-tip\n v-if=\"slots.tip\"\n ref=\"tip\"\n :trigger-dom=\"tipTriggerDom\"\n v-model:visible=\"tipVisible\"\n @update:visible=\"handleTipUpdateVisible\"\n >\n <template #content>\n <UNodeRender :content=\"tipContent\" />\n </template>\n </u-tip>\n </ol>\n</template>\n\n<script lang=\"ts\" setup>\nimport { n, o } from '@cat-kit/core'\nimport { useFallbackProps } from '@veltra/compositions'\nimport { Check } from '@veltra/icons/normal'\nimport { bem, fieldKey } from '@veltra/utils'\nimport { computed, shallowRef, useTemplateRef, watch } from 'vue'\n\nimport type { StepsProps, StepsEmits, ComponentSize, StepsSlotScope } from '../../types'\nimport { UIcon } from '../icon'\nimport { UNodeRender } from '../node-render'\nimport { UTip } from '../tip'\n\ndefineOptions({ name: 'USteps' })\n\nconst props = withDefaults(defineProps<StepsProps>(), {\n direction: 'horizontal',\n finishedStepType: 'success',\n labelKey: 'label'\n})\n\nconst emit = defineEmits<StepsEmits>()\n\nconst slots = defineSlots<{\n icon?: (scope: StepsSlotScope) => any\n content?: (scope: StepsSlotScope) => any\n tip?: (scope: StepsSlotScope) => any\n}>()\n\nconst cls = bem('steps')\n\nconst labelKey = computed(() => fieldKey(props.labelKey, 'label'))\n\nconst { size } = useFallbackProps([props], { size: 'default' as ComponentSize })\n\nconst className = computed(() => {\n const { direction, currentStepType, finishedStepType } = props\n const ret: string[] = [\n cls.b,\n bem.is(direction),\n cls.m(size.value),\n bem.is('align-center', props.alignCenter),\n cls.em('finished', finishedStepType)\n ]\n currentStepType && ret.push(cls.em('current', currentStepType))\n return ret\n})\n\nconst stepsRef = useTemplateRef('steps')\n\nconst currentToIndexMap = computed<Record<string, number> | undefined>(() => {\n const { currentKey, items } = props\n if (!currentKey) return undefined\n return items.reduce(\n (acc, item, index) => {\n acc[o(item).get(currentKey)] = index\n return acc\n },\n {} as Record<string, number>\n )\n})\n\n/** 当前索引 */\nconst currentIndex = computed<number | undefined>(() => {\n const { currentKey, current } = props\n if (current === undefined) return undefined\n\n if (currentKey) {\n return currentToIndexMap.value?.[current]\n }\n\n if (typeof current !== 'number') return undefined\n return n(current).range(0, props.items.length - 1)\n})\n\nwatch(currentIndex, (index) => {\n if (index === undefined || props.direction === 'vertical') return\n const step = stepsRef.value?.children[index]\n if (step) {\n step.scrollIntoView({ behavior: 'smooth', block: 'center' })\n }\n})\n\n// 点击步骤项\nfunction handleStepClick(item: Record<string, any>, index: number) {\n emit('item-click', item, index)\n emit('update:current', props.currentKey ? o(item).get(props.currentKey) : index)\n}\n\n// 提示\nconst tipVisible = shallowRef(false)\nconst tipTriggerDom = shallowRef<HTMLElement>()\nconst tipContent = shallowRef()\n\nfunction handleStepMouseenter(event: MouseEvent, item: Record<string, any>, index: number) {\n if (!slots.tip) return\n tipTriggerDom.value = event.target as HTMLElement\n tipVisible.value = true\n tipContent.value = slots.tip?.({ item, index })\n}\n\nlet timer: number | undefined = undefined\nfunction closeTip() {\n timer = setTimeout(() => {\n tipVisible.value = false\n tipContent.value = undefined\n tipTriggerDom.value = undefined\n }, 250)\n}\n\nfunction handleTipUpdateVisible(visible: boolean) {\n visible && clearTimeout(timer)\n}\n\nfunction handleStepMouseleave() {\n if (!slots.tip) return\n closeTip()\n}\n</script>\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"switch.js","names":[],"sources":["../../../src/components/switch/switch.vue"],"sourcesContent":["<template>\n <label :class=\"switchClass\" @click.stop>\n <input\n type=\"checkbox\"\n :class=\"cls.e('native')\"\n :checked=\"model\"\n :disabled=\"disabled\"\n @input=\"handleInput\"\n />\n <span :class=\"[cls.e('text'), bem.is('selected', !model)]\" v-if=\"inactiveText\">\n {{ inactiveText }}\n </span>\n\n <div :class=\"cls.e('button')\">\n <span :class=\"cls.e('thumb')\"></span>\n </div>\n\n <span v-if=\"activeText\" :class=\"[cls.e('text'), bem.is('selected', model)]\">\n {{ activeText }}\n </span>\n </label>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useFormFallbackProps } from '@veltra/compositions'\nimport { bem } from '@veltra/utils'\nimport { injectFormContext } from '@veltra/utils'\nimport { computed } from 'vue'\n\nimport type { SwitchEmits, SwitchProps, _SwitchExposed } from '../../types'\n\ndefineOptions({ name: 'USwitch' })\n\nconst props = withDefaults(defineProps<SwitchProps>(), { disabled: undefined, readonly: undefined })\n\nconst emit = defineEmits<SwitchEmits>()\n\nconst model = defineModel<boolean>()\n\nconst cls = bem('switch')\n\nconst { formProps } = injectFormContext()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props])\n\nconst switchClass = computed(() => {\n return [\n cls.b,\n cls.m(size.value),\n bem.is('disabled', disabled.value),\n bem.is('readonly', readonly.value),\n bem.is('checked', model.value)\n ]\n})\n\nconst handleInput = (e: Event) => {\n if (disabled.value || readonly.value) return\n\n const newValue = (e.target as HTMLInputElement).checked\n model.value = newValue\n emit('change', newValue)\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAiCA,MAAM,QAAQ;EAEd,MAAM,OAAO;EAEb,MAAM,
|
|
1
|
+
{"version":3,"file":"switch.js","names":["_useModel","_openBlock","_createElementBlock","_normalizeClass","_withModifiers","_createElementVNode","_unref","_toDisplayString","_createCommentVNode"],"sources":["../../../src/components/switch/switch.vue"],"sourcesContent":["<template>\n <label :class=\"switchClass\" @click.stop>\n <input\n type=\"checkbox\"\n :class=\"cls.e('native')\"\n :checked=\"model\"\n :disabled=\"disabled\"\n @input=\"handleInput\"\n />\n <span :class=\"[cls.e('text'), bem.is('selected', !model)]\" v-if=\"inactiveText\">\n {{ inactiveText }}\n </span>\n\n <div :class=\"cls.e('button')\">\n <span :class=\"cls.e('thumb')\"></span>\n </div>\n\n <span v-if=\"activeText\" :class=\"[cls.e('text'), bem.is('selected', model)]\">\n {{ activeText }}\n </span>\n </label>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useFormFallbackProps } from '@veltra/compositions'\nimport { bem } from '@veltra/utils'\nimport { injectFormContext } from '@veltra/utils'\nimport { computed } from 'vue'\n\nimport type { SwitchEmits, SwitchProps, _SwitchExposed } from '../../types'\n\ndefineOptions({ name: 'USwitch' })\n\nconst props = withDefaults(defineProps<SwitchProps>(), { disabled: undefined, readonly: undefined })\n\nconst emit = defineEmits<SwitchEmits>()\n\nconst model = defineModel<boolean>()\n\nconst cls = bem('switch')\n\nconst { formProps } = injectFormContext()\n\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props])\n\nconst switchClass = computed(() => {\n return [\n cls.b,\n cls.m(size.value),\n bem.is('disabled', disabled.value),\n bem.is('readonly', readonly.value),\n bem.is('checked', model.value)\n ]\n})\n\nconst handleInput = (e: Event) => {\n if (disabled.value || readonly.value) return\n\n const newValue = (e.target as HTMLInputElement).checked\n model.value = newValue\n emit('change', newValue)\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAiCA,MAAM,QAAQ;EAEd,MAAM,OAAO;EAEb,MAAM,QAAQA,SAAoB,SAAA,YAAC;EAEnC,MAAM,MAAM,IAAI,QAAQ;EAExB,MAAM,EAAE,cAAc,kBAAkB;EAExC,MAAM,EAAE,MAAM,UAAU,aAAa,qBAAqB,CAAC,aAAa,CAAC,GAAG,KAAK,CAAC;EAElF,MAAM,cAAc,eAAe;GACjC,OAAO;IACL,IAAI;IACJ,IAAI,EAAE,KAAK,KAAK;IAChB,IAAI,GAAG,YAAY,SAAS,KAAK;IACjC,IAAI,GAAG,YAAY,SAAS,KAAK;IACjC,IAAI,GAAG,WAAW,MAAM,KAAK;GAC/B;EACF,CAAC;EAED,MAAM,eAAe,MAAa;GAChC,IAAI,SAAS,SAAS,SAAS,OAAO;GAEtC,MAAM,WAAY,EAAE,OAA4B;GAChD,MAAM,QAAQ;GACd,KAAK,UAAU,QAAQ;EACzB;;GA5DE,OAAAC,UAAA,GAAAC,mBAmBQ,SAAA;IAnBA,OAAKC,eAAE,YAAA,KAAW;IAAG,SAAK,OAAA,OAAA,OAAA,KAAAC,oBAAN,CAAA,GAAW,CAAA,MAAA,CAAA;;IACrCC,mBAME,SAAA;KALA,MAAK;KACJ,OAAKF,eAAEG,MAAA,GAAA,CAAG,CAAC,EAAC,QAAA,CAAA;KACZ,SAAS,MAAA;KACT,UAAUA,MAAA,QAAA;KACV,SAAO;;IAEuD,QAAA,gBAAjEL,UAAA,GAAAC,mBAEO,QAAA;;KAFA,OAAKC,eAAA,CAAGG,MAAA,GAAA,CAAG,CAAC,EAAC,MAAA,GAAUA,MAAA,GAAA,CAAG,CAAC,GAAE,YAAA,CAAc,MAAA,KAAK,CAAA,CAAA;IAClD,GAAAC,gBAAA,QAAA,YAAY,GAAA,CAAA,KAAAC,mBAAA,QAAA,IAAA;IAGjBH,mBAEM,OAAA,EAFA,OAAKF,eAAEG,MAAA,GAAA,CAAG,CAAC,EAAC,QAAA,CAAA,EAAA,GAChB,CAAAD,mBAAqC,QAAA,EAA9B,OAAKF,eAAEG,MAAA,GAAA,CAAG,CAAC,EAAC,OAAA,CAAA,EAAA,GAAA,MAAA,CAAA,CAAA,GAAA,CAAA;IAGT,QAAA,cAAZL,UAAA,GAAAC,mBAEO,QAAA;;KAFkB,OAAKC,eAAA,CAAGG,MAAA,GAAA,CAAG,CAAC,EAAC,MAAA,GAAUA,MAAA,GAAA,CAAG,CAAC,GAAE,YAAa,MAAA,KAAK,CAAA,CAAA;IACnE,GAAAC,gBAAA,QAAA,UAAU,GAAA,CAAA,KAAAC,mBAAA,QAAA,IAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table-body.js","names":[],"sources":["../../../src/components/table/table-body.vue"],"sourcesContent":["<template>\n <tbody :class=\"bodyCls\">\n <template v-for=\"{ row, index, stripeIndex } of tableRows\" :key=\"row.uid\">\n <UExpandTableRow v-if=\"row.isExpandRow\" :row=\"row\" :index=\"index\" />\n <UTableRow v-else :row=\"row\" :index=\"index\" :class=\"getStripeCls(stripeIndex)\" />\n </template>\n\n <!-- 空 -->\n <tr v-if=\"!rows.length\" :class=\"emptyRowCls\">\n <td :colspan=\"leafColumns.length\">\n <slot name=\"empty\">\n <UEmpty :class=\"emptyCls\" />\n </slot>\n </td>\n </tr>\n\n <slot></slot>\n </tbody>\n</template>\n\n<script lang=\"ts\" setup>\nimport { bem } from '@veltra/utils'\nimport { computed, inject } from 'vue'\n\nimport { UEmpty } from '../empty'\nimport { TableDIKey } from './di'\nimport { UTableRow, UExpandTableRow } from './table-row'\n\ndefineOptions({ name: 'UTableBody' })\n\nconst { cls, rows, virtualList, columnConfig, tableProps, virtualEnabled } = inject(TableDIKey)!\nconst { leafColumns } = columnConfig\n\n// A1 的同族优化:把 body / empty / empty-row 等静态 class 一次性取出,\n// 避免每次 render 触发 `cls.e` 的字符串拼接。\nconst bodyCls = cls.e('body')\nconst emptyRowCls = cls.e('row')\nconst emptyCls = cls.e('empty')\n\n/**\n * C1:stripe class 查找表。\n *\n * `bem.is('stripe', true) === 'is-stripe'`,`bem.is('stripe', false) === ''`。\n * 两种输出是全局常量,无需每次调用 `bem.is`;按奇偶直接查表即可。\n * 非 stripe 模式下两个位置均返回空串。\n */\nconst STRIPE_CLS_ON: readonly [string, string] = [bem.is('stripe', false), bem.is('stripe', true)]\nconst STRIPE_CLS_OFF: readonly [string, string] = ['', '']\n\nconst stripeTable = computed<readonly [string, string]>(() =>\n tableProps.stripe ? STRIPE_CLS_ON : STRIPE_CLS_OFF\n)\nconst getStripeCls = (index: number): string => stripeTable.value[index & 1]!\n\nconst tableRows = computed(() => {\n if (!virtualEnabled.value) {\n return rows.value.map((row, index) => {\n return { row, stripeIndex: row.index, index }\n })\n }\n\n // 虚拟列表:仅渲染可视窗口内的行,位置由 table.vue 中的 before/after 占位 tbody 撑开\n return virtualList.value.map((item) => {\n return {\n row: rows.value[item.index]!,\n stripeIndex: rows.value[item.index]!.index,\n index: item.index\n }\n })\n})\n</script>\n"],"mappings":";;;;;;;;;;;EA8BA,MAAM,EAAE,KAAK,MAAM,aAAa,cAAc,YAAY,mBAAmB,OAAO,UAAU;EAC9F,MAAM,EAAE,gBAAgB;EAIxB,MAAM,UAAU,IAAI,EAAE,MAAM;EAC5B,MAAM,cAAc,IAAI,EAAE,KAAK;EAC/B,MAAM,WAAW,IAAI,EAAE,OAAO;;;;;;;;EAS9B,MAAM,gBAA2C,CAAC,IAAI,GAAG,UAAU,KAAK,GAAG,IAAI,GAAG,UAAU,IAAI,CAAC;EACjG,MAAM,iBAA4C,CAAC,IAAI,EAAE;EAEzD,MAAM,cAAc,eAClB,WAAW,SAAS,gBAAgB,cACtC;EACA,MAAM,gBAAgB,UAA0B,YAAY,MAAM,QAAQ;EAE1E,MAAM,YAAY,eAAe;GAC/B,IAAI,CAAC,eAAe,OAClB,OAAO,KAAK,MAAM,KAAK,KAAK,UAAU;IACpC,OAAO;KAAE;KAAK,aAAa,IAAI;KAAO;IAAM;GAC9C,CAAC;GAIH,OAAO,YAAY,MAAM,KAAK,SAAS;IACrC,OAAO;KACL,KAAK,KAAK,MAAM,KAAK;KACrB,aAAa,KAAK,MAAM,KAAK,MAAM,CAAE;KACrC,OAAO,KAAK;IACd;GACF,CAAC;EACH,CAAC;;GApEC,
|
|
1
|
+
{"version":3,"file":"table-body.js","names":["_openBlock","_createElementBlock","_normalizeClass","_unref","_Fragment","_renderList","_createBlock","_createCommentVNode","_createElementVNode","_renderSlot","_createVNode","UEmpty"],"sources":["../../../src/components/table/table-body.vue"],"sourcesContent":["<template>\n <tbody :class=\"bodyCls\">\n <template v-for=\"{ row, index, stripeIndex } of tableRows\" :key=\"row.uid\">\n <UExpandTableRow v-if=\"row.isExpandRow\" :row=\"row\" :index=\"index\" />\n <UTableRow v-else :row=\"row\" :index=\"index\" :class=\"getStripeCls(stripeIndex)\" />\n </template>\n\n <!-- 空 -->\n <tr v-if=\"!rows.length\" :class=\"emptyRowCls\">\n <td :colspan=\"leafColumns.length\">\n <slot name=\"empty\">\n <UEmpty :class=\"emptyCls\" />\n </slot>\n </td>\n </tr>\n\n <slot></slot>\n </tbody>\n</template>\n\n<script lang=\"ts\" setup>\nimport { bem } from '@veltra/utils'\nimport { computed, inject } from 'vue'\n\nimport { UEmpty } from '../empty'\nimport { TableDIKey } from './di'\nimport { UTableRow, UExpandTableRow } from './table-row'\n\ndefineOptions({ name: 'UTableBody' })\n\nconst { cls, rows, virtualList, columnConfig, tableProps, virtualEnabled } = inject(TableDIKey)!\nconst { leafColumns } = columnConfig\n\n// A1 的同族优化:把 body / empty / empty-row 等静态 class 一次性取出,\n// 避免每次 render 触发 `cls.e` 的字符串拼接。\nconst bodyCls = cls.e('body')\nconst emptyRowCls = cls.e('row')\nconst emptyCls = cls.e('empty')\n\n/**\n * C1:stripe class 查找表。\n *\n * `bem.is('stripe', true) === 'is-stripe'`,`bem.is('stripe', false) === ''`。\n * 两种输出是全局常量,无需每次调用 `bem.is`;按奇偶直接查表即可。\n * 非 stripe 模式下两个位置均返回空串。\n */\nconst STRIPE_CLS_ON: readonly [string, string] = [bem.is('stripe', false), bem.is('stripe', true)]\nconst STRIPE_CLS_OFF: readonly [string, string] = ['', '']\n\nconst stripeTable = computed<readonly [string, string]>(() =>\n tableProps.stripe ? STRIPE_CLS_ON : STRIPE_CLS_OFF\n)\nconst getStripeCls = (index: number): string => stripeTable.value[index & 1]!\n\nconst tableRows = computed(() => {\n if (!virtualEnabled.value) {\n return rows.value.map((row, index) => {\n return { row, stripeIndex: row.index, index }\n })\n }\n\n // 虚拟列表:仅渲染可视窗口内的行,位置由 table.vue 中的 before/after 占位 tbody 撑开\n return virtualList.value.map((item) => {\n return {\n row: rows.value[item.index]!,\n stripeIndex: rows.value[item.index]!.index,\n index: item.index\n }\n })\n})\n</script>\n"],"mappings":";;;;;;;;;;;EA8BA,MAAM,EAAE,KAAK,MAAM,aAAa,cAAc,YAAY,mBAAmB,OAAO,UAAU;EAC9F,MAAM,EAAE,gBAAgB;EAIxB,MAAM,UAAU,IAAI,EAAE,MAAM;EAC5B,MAAM,cAAc,IAAI,EAAE,KAAK;EAC/B,MAAM,WAAW,IAAI,EAAE,OAAO;;;;;;;;EAS9B,MAAM,gBAA2C,CAAC,IAAI,GAAG,UAAU,KAAK,GAAG,IAAI,GAAG,UAAU,IAAI,CAAC;EACjG,MAAM,iBAA4C,CAAC,IAAI,EAAE;EAEzD,MAAM,cAAc,eAClB,WAAW,SAAS,gBAAgB,cACtC;EACA,MAAM,gBAAgB,UAA0B,YAAY,MAAM,QAAQ;EAE1E,MAAM,YAAY,eAAe;GAC/B,IAAI,CAAC,eAAe,OAClB,OAAO,KAAK,MAAM,KAAK,KAAK,UAAU;IACpC,OAAO;KAAE;KAAK,aAAa,IAAI;KAAO;IAAM;GAC9C,CAAC;GAIH,OAAO,YAAY,MAAM,KAAK,SAAS;IACrC,OAAO;KACL,KAAK,KAAK,MAAM,KAAK;KACrB,aAAa,KAAK,MAAM,KAAK,MAAM,CAAE;KACrC,OAAO,KAAK;IACd;GACF,CAAC;EACH,CAAC;;GApEC,OAAAA,UAAA,GAAAC,mBAgBQ,SAAA,EAhBA,OAAKC,eAAEC,MAAA,OAAA,CAAO,EAAA,GAAA;KACpBH,UAAA,IAAA,GAAAC,mBAGWG,UAAA,MAAAC,WAHqC,UAAA,QAAS,EAAtC,KAAK,OAAO,kBAAW;KAAuB,OAAA,UAAA,GAAA,mBAAA,UAAA,EAAA,KAAA,IAAI,IAAA,GAC5C,CAAA,IAAI,eAA3BL,UAAA,GAAAM,YAAoEH,MAAA,eAAA,GAAA;;MAAtB;MAAa;KAC3D,GAAA,MAAA,GAAA,CAAA,OAAA,OAAA,CAAA,MAAAH,UAAA,GAAAM,YAAiFH,MAAA,SAAA,GAAA;;MAAzD;MAAa;MAAQ,OAAKD,eAAE,aAAa,WAAW,CAAA;;;;;;;IAG9EK,mBAAA,KAAA;IACW,CAAAJ,MAAA,IAAA,CAAI,CAAC,UAAhBH,UAAA,GAAAC,mBAMK,MAAA;;KANoB,OAAKC,eAAEC,MAAA,WAAA,CAAW;IACzC,GAAA,CAAAK,mBAIK,MAAA,EAJA,SAASL,MAAA,WAAA,CAAW,CAAC,OAAA,GAAA,CACxBM,WAEO,KAAA,QAAA,SAAA,CAAA,SAAA,CADLC,YAA4BP,MAAAQ,WAAA,GAAA,EAAnB,OAAKT,eAAEC,MAAA,QAAA,CAAQ,EAAA,GAAA,MAAA,GAAA,CAAA,OAAA,CAAA,CAAA,CAAA,CAAA,GAAA,GAAA,UAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,QAAA,IAAA;IAK9BM,WAAa,KAAA,QAAA,SAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table-cell.js","names":[],"sources":["../../../src/components/table/table-cell.vue"],"sourcesContent":["<template>\n <td\n :class=\"cellClass\"\n :style=\"style\"\n :rowspan=\"rowspan\"\n :colspan=\"colspan\"\n v-if=\"rowspan !== 0 && colspan !== 0\"\n >\n <slot />\n </td>\n</template>\n\n<script lang=\"ts\" setup>\nimport { withUnit } from '@veltra/utils'\nimport { computed } from 'vue'\n\ndefineOptions({ name: 'UTableCell' })\n\n/**\n * B2: TableCell 去 inject 化。\n *\n * 原先每个可见单元格都会执行 `inject(TableDIKey)` 并在模板中调用 `getCellClass(column)`,\n * 在 30 列场景下每次滚动每行产生 30 次 inject / 30 次类名拼接。\n * 父组件 `TableRow` 已经持有注入上下文,直接把 `cellClass` 传下来即可;\n * 这里变成「完全受控」的纯渲染单元。\n */\nconst { left, right, cellStyle } = defineProps<{\n cellClass: string\n left?: number\n right?: number\n cellStyle?: Record<string, string>\n rowspan?: number\n colspan?: number\n}>()\n\nconst style = computed(() => ({\n ...cellStyle,\n left: withUnit(left, 'px'),\n right: withUnit(right, 'px')\n}))\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;EAmCA,MAAM,QAAQ,gBAAgB;GAC5B,GAAG,QAAA;GACH,MAAM,SAAS,QAAA,MAAM,IAAI;GACzB,OAAO,SAAS,QAAA,OAAO,IAAI;EAC7B,EAAE;;GAjCQ,OAAA,QAAA,YAAO,KAAU,QAAA,YAAO,
|
|
1
|
+
{"version":3,"file":"table-cell.js","names":["_openBlock","_createElementBlock","_normalizeClass","_normalizeStyle","_renderSlot","_createCommentVNode"],"sources":["../../../src/components/table/table-cell.vue"],"sourcesContent":["<template>\n <td\n :class=\"cellClass\"\n :style=\"style\"\n :rowspan=\"rowspan\"\n :colspan=\"colspan\"\n v-if=\"rowspan !== 0 && colspan !== 0\"\n >\n <slot />\n </td>\n</template>\n\n<script lang=\"ts\" setup>\nimport { withUnit } from '@veltra/utils'\nimport { computed } from 'vue'\n\ndefineOptions({ name: 'UTableCell' })\n\n/**\n * B2: TableCell 去 inject 化。\n *\n * 原先每个可见单元格都会执行 `inject(TableDIKey)` 并在模板中调用 `getCellClass(column)`,\n * 在 30 列场景下每次滚动每行产生 30 次 inject / 30 次类名拼接。\n * 父组件 `TableRow` 已经持有注入上下文,直接把 `cellClass` 传下来即可;\n * 这里变成「完全受控」的纯渲染单元。\n */\nconst { left, right, cellStyle } = defineProps<{\n cellClass: string\n left?: number\n right?: number\n cellStyle?: Record<string, string>\n rowspan?: number\n colspan?: number\n}>()\n\nconst style = computed(() => ({\n ...cellStyle,\n left: withUnit(left, 'px'),\n right: withUnit(right, 'px')\n}))\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;EAmCA,MAAM,QAAQ,gBAAgB;GAC5B,GAAG,QAAA;GACH,MAAM,SAAS,QAAA,MAAM,IAAI;GACzB,OAAO,SAAS,QAAA,OAAO,IAAI;EAC7B,EAAE;;GAjCQ,OAAA,QAAA,YAAO,KAAU,QAAA,YAAO,KALhCA,UAAA,GAAAC,mBAQK,MAAA;;IAPF,OAAKC,eAAE,QAAA,SAAS;IAChB,OAAKC,eAAE,MAAA,KAAK;IACZ,SAAS,QAAA;IACT,SAAS,QAAA;GAGV,GAAA,CAAAC,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,IAAA,UAAA,KAAAC,mBAAA,QAAA,IAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"table-foot.js","names":[],"sources":["../../../src/components/table/table-foot.vue"],"sourcesContent":["<template>\n <tfoot v-if=\"tableSlots.foot || showSummary\" :class=\"cls.e('foot')\">\n <tr v-if=\"showSummary\">\n <td\n v-if=\"leafColumns[0]\"\n :class=\"getCellClass(leafColumns[0])\"\n :style=\"{\n ...leafColumns[0].cellStyle,\n right: withUnit(leafColumns[0].style.right, 'px'),\n left: withUnit(leafColumns[0].style.left, 'px')\n }\"\n >\n 合计:\n </td>\n <td\n v-for=\"column of leafColumns.slice(1)\"\n :class=\"getCellClass(column)\"\n :key=\"column.key\"\n :style=\"{\n ...column.cellStyle,\n right: withUnit(column.style.right, 'px'),\n left: withUnit(column.style.left, 'px')\n }\"\n >\n <u-node-render :content=\"getColumnSummaryNode(column)\" />\n </td>\n </tr>\n <slot />\n </tfoot>\n</template>\n\n<script lang=\"ts\" setup>\nimport { $n } from '@cat-kit/core'\nimport { withUnit, type RenderReturn } from '@veltra/utils'\nimport { computed, inject } from 'vue'\n\nimport { UNodeRender } from '../node-render'\nimport { TableDIKey } from './di'\nimport type { ColumnNode } from './node/col'\n\ndefineOptions({ name: 'UTableFoot' })\n\nconst { cls, columnConfig, rows, checkedRows, tableSlots, getCellClass } = inject(TableDIKey)!\n\nconst { leafColumns } = columnConfig\n\nconst showSummary = computed(() => {\n return leafColumns.value.some((col) => !!col.data.summary)\n})\n\nfunction computeSummary(key: string) {\n let sum = 0\n let i = 0\n\n while (i < rows.value.length) {\n sum = $n.plus(sum, rows.value[i]!.data[key] ?? 0)\n if (isNaN(sum)) return sum\n i++\n }\n\n return sum\n}\n\nconst summaryRow = computed<Record<string, any>>(() => {\n return leafColumns.value.reduce((acc, column) => {\n if (column.data.summary) {\n acc[column.key] = computeSummary(column.key)\n }\n return acc\n }, {})\n})\n\nfunction getColumnSummaryNode(column: ColumnNode): RenderReturn {\n const { summary } = column.data\n\n if (!summary) return null\n\n let total = summaryRow.value[column.key]\n\n if (typeof summary === 'function') {\n return summary({ total, rows: rows.value, checkedRows: checkedRows.value, column })\n }\n return total\n}\n\ndefineExpose({\n getSummaryRow(): Record<string, any> {\n return summaryRow.value\n }\n})\n</script>\n"],"mappings":";;;;;;;;;;;EA0CA,MAAM,EAAE,KAAK,cAAc,MAAM,aAAa,YAAY,iBAAiB,OAAO,UAAU;EAE5F,MAAM,EAAE,gBAAgB;EAExB,MAAM,cAAc,eAAe;GACjC,OAAO,YAAY,MAAM,MAAM,QAAQ,CAAC,CAAC,IAAI,KAAK,OAAO;EAC3D,CAAC;EAED,SAAS,eAAe,KAAa;GACnC,IAAI,MAAM;GACV,IAAI,IAAI;GAER,OAAO,IAAI,KAAK,MAAM,QAAQ;IAC5B,MAAM,GAAG,KAAK,KAAK,KAAK,MAAM,EAAE,CAAE,KAAK,QAAQ,CAAC;IAChD,IAAI,MAAM,GAAG,GAAG,OAAO;IACvB;GACF;GAEA,OAAO;EACT;EAEA,MAAM,aAAa,eAAoC;GACrD,OAAO,YAAY,MAAM,QAAQ,KAAK,WAAW;IAC/C,IAAI,OAAO,KAAK,SACd,IAAI,OAAO,OAAO,eAAe,OAAO,GAAG;IAE7C,OAAO;GACT,GAAG,CAAC,CAAC;EACP,CAAC;EAED,SAAS,qBAAqB,QAAkC;GAC9D,MAAM,EAAE,YAAY,OAAO;GAE3B,IAAI,CAAC,SAAS,OAAO;GAErB,IAAI,QAAQ,WAAW,MAAM,OAAO;GAEpC,IAAI,OAAO,YAAY,YACrB,OAAO,QAAQ;IAAE;IAAO,MAAM,KAAK;IAAO,aAAa,YAAY;IAAO;GAAO,CAAC;GAEpF,OAAO;EACT;EAEA,SAAa,EACX,gBAAqC;GACnC,OAAO,WAAW;EACpB,EACF,CAAC;;GAxFc,
|
|
1
|
+
{"version":3,"file":"table-foot.js","names":["_unref","_openBlock","_createElementBlock","_normalizeClass","_normalizeStyle","_createCommentVNode","_Fragment","_renderList","_createVNode","UNodeRender","_renderSlot"],"sources":["../../../src/components/table/table-foot.vue"],"sourcesContent":["<template>\n <tfoot v-if=\"tableSlots.foot || showSummary\" :class=\"cls.e('foot')\">\n <tr v-if=\"showSummary\">\n <td\n v-if=\"leafColumns[0]\"\n :class=\"getCellClass(leafColumns[0])\"\n :style=\"{\n ...leafColumns[0].cellStyle,\n right: withUnit(leafColumns[0].style.right, 'px'),\n left: withUnit(leafColumns[0].style.left, 'px')\n }\"\n >\n 合计:\n </td>\n <td\n v-for=\"column of leafColumns.slice(1)\"\n :class=\"getCellClass(column)\"\n :key=\"column.key\"\n :style=\"{\n ...column.cellStyle,\n right: withUnit(column.style.right, 'px'),\n left: withUnit(column.style.left, 'px')\n }\"\n >\n <u-node-render :content=\"getColumnSummaryNode(column)\" />\n </td>\n </tr>\n <slot />\n </tfoot>\n</template>\n\n<script lang=\"ts\" setup>\nimport { $n } from '@cat-kit/core'\nimport { withUnit, type RenderReturn } from '@veltra/utils'\nimport { computed, inject } from 'vue'\n\nimport { UNodeRender } from '../node-render'\nimport { TableDIKey } from './di'\nimport type { ColumnNode } from './node/col'\n\ndefineOptions({ name: 'UTableFoot' })\n\nconst { cls, columnConfig, rows, checkedRows, tableSlots, getCellClass } = inject(TableDIKey)!\n\nconst { leafColumns } = columnConfig\n\nconst showSummary = computed(() => {\n return leafColumns.value.some((col) => !!col.data.summary)\n})\n\nfunction computeSummary(key: string) {\n let sum = 0\n let i = 0\n\n while (i < rows.value.length) {\n sum = $n.plus(sum, rows.value[i]!.data[key] ?? 0)\n if (isNaN(sum)) return sum\n i++\n }\n\n return sum\n}\n\nconst summaryRow = computed<Record<string, any>>(() => {\n return leafColumns.value.reduce((acc, column) => {\n if (column.data.summary) {\n acc[column.key] = computeSummary(column.key)\n }\n return acc\n }, {})\n})\n\nfunction getColumnSummaryNode(column: ColumnNode): RenderReturn {\n const { summary } = column.data\n\n if (!summary) return null\n\n let total = summaryRow.value[column.key]\n\n if (typeof summary === 'function') {\n return summary({ total, rows: rows.value, checkedRows: checkedRows.value, column })\n }\n return total\n}\n\ndefineExpose({\n getSummaryRow(): Record<string, any> {\n return summaryRow.value\n }\n})\n</script>\n"],"mappings":";;;;;;;;;;;EA0CA,MAAM,EAAE,KAAK,cAAc,MAAM,aAAa,YAAY,iBAAiB,OAAO,UAAU;EAE5F,MAAM,EAAE,gBAAgB;EAExB,MAAM,cAAc,eAAe;GACjC,OAAO,YAAY,MAAM,MAAM,QAAQ,CAAC,CAAC,IAAI,KAAK,OAAO;EAC3D,CAAC;EAED,SAAS,eAAe,KAAa;GACnC,IAAI,MAAM;GACV,IAAI,IAAI;GAER,OAAO,IAAI,KAAK,MAAM,QAAQ;IAC5B,MAAM,GAAG,KAAK,KAAK,KAAK,MAAM,EAAE,CAAE,KAAK,QAAQ,CAAC;IAChD,IAAI,MAAM,GAAG,GAAG,OAAO;IACvB;GACF;GAEA,OAAO;EACT;EAEA,MAAM,aAAa,eAAoC;GACrD,OAAO,YAAY,MAAM,QAAQ,KAAK,WAAW;IAC/C,IAAI,OAAO,KAAK,SACd,IAAI,OAAO,OAAO,eAAe,OAAO,GAAG;IAE7C,OAAO;GACT,GAAG,CAAC,CAAC;EACP,CAAC;EAED,SAAS,qBAAqB,QAAkC;GAC9D,MAAM,EAAE,YAAY,OAAO;GAE3B,IAAI,CAAC,SAAS,OAAO;GAErB,IAAI,QAAQ,WAAW,MAAM,OAAO;GAEpC,IAAI,OAAO,YAAY,YACrB,OAAO,QAAQ;IAAE;IAAO,MAAM,KAAK;IAAO,aAAa,YAAY;IAAO;GAAO,CAAC;GAEpF,OAAO;EACT;EAEA,SAAa,EACX,gBAAqC;GACnC,OAAO,WAAW;EACpB,EACF,CAAC;;GAxFc,OAAAA,MAAA,UAAA,CAAU,CAAC,QAAQ,YAAA,SAAhCC,UAAA,GAAAC,mBA2BQ,SAAA;;IA3BsC,OAAKC,eAAEH,MAAA,GAAA,CAAG,CAAC,EAAC,MAAA,CAAA;GAC9C,GAAA,CAAA,YAAA,SAAVC,UAAA,GAAAC,mBAwBK,MAAA,YAAA,CAtBKF,MAAA,WAAA,CAAW,CAAA,MADnBC,UAAA,GAAAC,mBAUK,MAAA;;IARF,OAAKC,eAAEH,MAAA,YAAA,CAAY,CAACA,MAAA,WAAA,CAAW,CAAA,EAAA,CAAA;IAC/B,OAAKI,eAAA;KAAiB,GAAAJ,MAAA,WAAA,CAAW,CAAA,EAAA,CAAI;KAA4B,OAAAA,MAAA,QAAA,CAAQ,CAACA,MAAA,WAAA,CAAW,CAAA,EAAA,CAAI,MAAM,OAAK,IAAA;KAAyB,MAAAA,MAAA,QAAA,CAAQ,CAACA,MAAA,WAAA,CAAW,CAAA,EAAA,CAAI,MAAM,MAAI,IAAA;;GAKjK,GAAA,SAED,CAAA,KAAAK,mBAAA,QAAA,IAAA,IACAJ,UAAA,IAAA,GAAAC,mBAWKI,UAAA,MAAAC,WAVcP,MAAA,WAAA,CAAW,CAAC,MAAK,CAAA,IAA3B,WAAM;IADf,OAAAC,UAAA,GAAAC,mBAWK,MAAA;KATF,OAAKC,eAAEH,MAAA,YAAA,CAAY,CAAC,MAAM,CAAA;KAC1B,KAAK,OAAO;KACZ,OAAKI,eAAA;MAAiB,GAAA,OAAO;MAA4B,OAAAJ,MAAA,QAAA,CAAQ,CAAC,OAAO,MAAM,OAAK,IAAA;MAAyB,MAAAA,MAAA,QAAA,CAAQ,CAAC,OAAO,MAAM,MAAI,IAAA;;IAMxI,GAAA,CAAAQ,YAAyDR,MAAAS,UAAA,GAAA,EAAzC,SAAS,qBAAqB,MAAM,EAAA,GAAA,MAAA,GAAA,CAAA,SAAA,CAAA,CAAA,GAAA,CAAA;GAGxD,CAAA,GAAA,GAAA,EAAA,CAAA,KAAAJ,mBAAA,QAAA,IAAA,GAAAK,WAAQ,KAAA,QAAA,SAAA,CAAA,GAAA,CAAA,KAAA,mBAAA,QAAA,IAAA"}
|