@sdata/web-vue 3.9.0 → 3.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -79,7 +79,7 @@
79
79
  min-width: 0;
80
80
  min-height: 0;
81
81
  }
82
- .sd-file-previewer-image, .sd-file-previewer-video-player, .sd-file-previewer-audio-player, .sd-file-previewer-video, .sd-file-previewer-pdf {
82
+ .sd-file-previewer-image, .sd-file-previewer-video-player, .sd-file-previewer-audio-player, .sd-file-previewer-video {
83
83
  display: block;
84
84
  width: 100%;
85
85
  height: 100%;
@@ -122,12 +122,60 @@
122
122
  width: 100%;
123
123
  }
124
124
  .sd-file-previewer-pdf {
125
- background: var(--sd-color-bg-2);
126
- border: 0;
125
+ display: flex;
126
+ flex-direction: column;
127
+ gap: 6px;
128
+ width: 100%;
129
+ height: 100%;
130
+ }
131
+ .sd-file-previewer-pdf-canvas-wrap {
132
+ display: flex;
133
+ flex: 1;
134
+ align-items: center;
135
+ justify-content: center;
136
+ min-width: 0;
137
+ min-height: 0;
138
+ overflow: auto;
139
+ background: var(--sd-color-bg-1);
140
+ border-radius: var(--sd-border-radius-medium);
141
+ }
142
+ .sd-file-previewer-pdf-canvas {
143
+ display: block;
144
+ }
145
+ .sd-file-previewer-pdf-toolbar {
146
+ display: flex;
147
+ flex-shrink: 0;
148
+ gap: 6px;
149
+ align-items: center;
150
+ justify-content: center;
151
+ padding: 4px;
152
+ color: var(--sd-color-white);
153
+ background: rgba(0, 0, 0, 0.5);
127
154
  border-radius: var(--sd-border-radius-medium);
128
155
  }
129
- .sd-file-previewer-inline .sd-file-previewer-pdf {
130
- border-radius: 0;
156
+ .sd-file-previewer-pdf-btn {
157
+ display: inline-flex;
158
+ align-items: center;
159
+ justify-content: center;
160
+ min-width: 28px;
161
+ height: 28px;
162
+ padding: 0 6px;
163
+ color: inherit;
164
+ font-size: 16px;
165
+ line-height: 1;
166
+ background: transparent;
167
+ border: 0;
168
+ border-radius: var(--sd-border-radius-small);
169
+ cursor: pointer;
170
+ }
171
+ .sd-file-previewer-pdf-btn:disabled {
172
+ color: var(--sd-color-fill-3);
173
+ cursor: not-allowed;
174
+ }
175
+ .sd-file-previewer-pdf-page {
176
+ min-width: 64px;
177
+ font-size: 14px;
178
+ text-align: center;
131
179
  }
132
180
  .sd-file-previewer-close-btn {
133
181
  position: absolute;
@@ -93,8 +93,7 @@ $image-prefix-cls: string.unquote('#{theme.$prefix}-image');
93
93
  &-image,
94
94
  &-video-player,
95
95
  &-audio-player,
96
- &-video,
97
- &-pdf {
96
+ &-video {
98
97
  display: block;
99
98
  width: 100%;
100
99
  height: 100%;
@@ -149,13 +148,66 @@ $image-prefix-cls: string.unquote('#{theme.$prefix}-image');
149
148
  }
150
149
 
151
150
  &-pdf {
152
- background: $file-previewer-color-content-bg;
151
+ display: flex;
152
+ flex-direction: column;
153
+ gap: $file-previewer-spacing-pdf-gap;
154
+ width: 100%;
155
+ height: 100%;
156
+ }
157
+
158
+ &-pdf-canvas-wrap {
159
+ display: flex;
160
+ flex: 1;
161
+ align-items: center;
162
+ justify-content: center;
163
+ min-width: 0;
164
+ min-height: 0;
165
+ overflow: auto;
166
+ background: $file-previewer-color-pdf-canvas-bg;
167
+ border-radius: $file-previewer-radius-pdf-canvas;
168
+ }
169
+
170
+ &-pdf-canvas {
171
+ display: block;
172
+ }
173
+
174
+ &-pdf-toolbar {
175
+ display: flex;
176
+ flex-shrink: 0;
177
+ gap: $file-previewer-spacing-pdf-toolbar-gap;
178
+ align-items: center;
179
+ justify-content: center;
180
+ padding: $file-previewer-spacing-pdf-toolbar-padding;
181
+ color: $file-previewer-color-pdf-toolbar-text;
182
+ background: $file-previewer-color-pdf-toolbar-bg;
183
+ border-radius: $file-previewer-radius-pdf-canvas;
184
+ }
185
+
186
+ &-pdf-btn {
187
+ display: inline-flex;
188
+ align-items: center;
189
+ justify-content: center;
190
+ min-width: $file-previewer-size-pdf-btn-min-width;
191
+ height: $file-previewer-size-pdf-btn;
192
+ padding: 0 $file-previewer-spacing-pdf-toolbar-gap;
193
+ color: inherit;
194
+ font-size: $file-previewer-font-size-pdf-btn;
195
+ line-height: 1;
196
+ background: transparent;
153
197
  border: 0;
154
- border-radius: $file-previewer-radius-panel;
198
+ border-radius: $file-previewer-radius-pdf-btn;
199
+ cursor: pointer;
200
+
201
+ &:disabled {
202
+ color: $file-previewer-color-pdf-btn-disabled;
203
+ cursor: not-allowed;
204
+ }
155
205
  }
156
206
 
157
- &-inline &-pdf {
158
- border-radius: 0;
207
+ &-pdf-page {
208
+ min-width: 64px;
209
+ font-size: $file-previewer-font-size-pdf-page;
210
+ text-align: center;
159
211
  }
160
212
 
161
213
  &-close-btn {
@@ -29,3 +29,16 @@ $file-previewer-font-size-title: $font-size-title-1;
29
29
  $file-previewer-size-audio-width: 560px;
30
30
  $file-previewer-size-media-width: 1180px;
31
31
  $file-previewer-size-media-height: 78vh;
32
+ $file-previewer-color-pdf-canvas-bg: var(string.unquote('#{$sd-cssvars-prefix}-color-bg-1'));
33
+ $file-previewer-color-pdf-toolbar-bg: rgb(0 0 0 / 50%);
34
+ $file-previewer-color-pdf-toolbar-text: var(string.unquote('#{$sd-cssvars-prefix}-color-white'));
35
+ $file-previewer-color-pdf-btn-disabled: var(string.unquote('#{$sd-cssvars-prefix}-color-fill-3'));
36
+ $file-previewer-spacing-pdf-gap: $spacing-3;
37
+ $file-previewer-spacing-pdf-toolbar-padding: $spacing-2;
38
+ $file-previewer-spacing-pdf-toolbar-gap: $spacing-3;
39
+ $file-previewer-radius-pdf-canvas: $radius-medium;
40
+ $file-previewer-radius-pdf-btn: $radius-small;
41
+ $file-previewer-size-pdf-btn: 28px;
42
+ $file-previewer-size-pdf-btn-min-width: 28px;
43
+ $file-previewer-font-size-pdf-btn: 16px;
44
+ $file-previewer-font-size-pdf-page: $font-size-body-3;
@@ -1,3 +1,4 @@
1
+ import type { PDFDocumentProxy } from 'pdfjs-dist';
1
2
  import type { Except, Simplify, UnknownRecord } from 'type-fest';
2
3
  import type { ImageProps } from '../image/interface';
3
4
  export type FilePreviewerType = 'image' | 'video' | 'audio' | 'pdf';
@@ -12,7 +13,18 @@ export type FilePreviewerMediaProps = Simplify<UnknownRecord & {
12
13
  playerProps?: UnknownRecord;
13
14
  skinProps?: UnknownRecord;
14
15
  }>;
15
- export type FilePreviewerPdfProps = UnknownRecord;
16
+ export type FilePreviewerPdfRotation = 0 | 90 | 180 | 270;
17
+ export type FilePreviewerPdfProps = Simplify<UnknownRecord & {
18
+ worker?: boolean;
19
+ workerSrc?: string;
20
+ workerPort?: Worker;
21
+ scale?: number;
22
+ rotation?: FilePreviewerPdfRotation;
23
+ page?: number;
24
+ documentParams?: UnknownRecord;
25
+ renderParams?: UnknownRecord;
26
+ onDocumentLoad?: (doc: PDFDocumentProxy) => void;
27
+ }>;
16
28
  export interface FilePreviewerContentSlotProps {
17
29
  src: string;
18
30
  type: FilePreviewerType;
@@ -27,6 +39,48 @@ export interface FilePreviewerContentSlotProps {
27
39
  onLoad: () => void;
28
40
  onError: () => void;
29
41
  }
42
+ export interface FilePreviewerPdfSlotProps {
43
+ src: string;
44
+ status: FilePreviewerStatus;
45
+ loading: boolean;
46
+ loaded: boolean;
47
+ error: boolean;
48
+ doc: PDFDocumentProxy | null;
49
+ page: number;
50
+ numPages: number;
51
+ goto: (page: number) => void;
52
+ prev: () => void;
53
+ next: () => void;
54
+ render: (canvas: HTMLCanvasElement, page?: number) => Promise<void>;
55
+ close: () => void;
56
+ onLoad: () => void;
57
+ onError: (error?: unknown) => void;
58
+ }
59
+ export interface FilePreviewerMediaSlotProps {
60
+ src: string;
61
+ status: FilePreviewerStatus;
62
+ loading: boolean;
63
+ loaded: boolean;
64
+ error: boolean;
65
+ skin: FilePreviewerMediaSkin;
66
+ useVideoJs: boolean;
67
+ playerProps: UnknownRecord;
68
+ skinProps: UnknownRecord;
69
+ close: () => void;
70
+ onLoad: () => void;
71
+ onError: (error?: unknown) => void;
72
+ }
73
+ export interface FilePreviewerImageSlotProps {
74
+ src: string;
75
+ status: FilePreviewerStatus;
76
+ loading: boolean;
77
+ loaded: boolean;
78
+ error: boolean;
79
+ imageProps: FilePreviewerImageProps;
80
+ close: () => void;
81
+ onLoad: () => void;
82
+ onError: (error?: unknown) => void;
83
+ }
30
84
  export interface FilePreviewerProps {
31
85
  src?: string;
32
86
  type?: FilePreviewerType;
@@ -0,0 +1,20 @@
1
+ import type { PDFDocumentProxy } from 'pdfjs-dist';
2
+ import type { ShallowRef } from 'vue';
3
+ import type { FilePreviewerPdfProps, FilePreviewerStatus } from './types';
4
+ export interface UsePdfJsContext {
5
+ src: () => string;
6
+ pdfProps: () => FilePreviewerPdfProps | undefined;
7
+ onStatus: (status: FilePreviewerStatus) => void;
8
+ }
9
+ export interface UsePdfJsReturn {
10
+ doc: ShallowRef<PDFDocumentProxy | null>;
11
+ numPages: ShallowRef<number>;
12
+ page: ShallowRef<number>;
13
+ goto: (page: number) => void;
14
+ prev: () => void;
15
+ next: () => void;
16
+ render: (canvas: HTMLCanvasElement, page?: number) => Promise<void>;
17
+ load: () => Promise<void>;
18
+ destroy: () => Promise<void>;
19
+ }
20
+ export declare function usePdfJs(context: UsePdfJsContext): UsePdfJsReturn;
@@ -0,0 +1,197 @@
1
+ import { _objectSpread2 } from "../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/objectSpread2.js";
2
+ import { isServerRendering } from "../_utils/dom.js";
3
+ import { _asyncToGenerator } from "../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/asyncToGenerator.js";
4
+ import { shallowRef } from "vue";
5
+ //#region components/file-previewer/use-pdf-js.ts
6
+ var pdfModulePromise;
7
+ function loadPdfModule() {
8
+ if (!pdfModulePromise) pdfModulePromise = import("pdfjs-dist");
9
+ return pdfModulePromise;
10
+ }
11
+ var mainThreadWorkerPromise;
12
+ function ensureMainThreadWorker() {
13
+ if (!mainThreadWorkerPromise) mainThreadWorkerPromise = import("pdfjs-dist/build/pdf.worker.min.mjs").then(() => void 0);
14
+ return mainThreadWorkerPromise;
15
+ }
16
+ var bundledWorkerSrcPromise;
17
+ function defaultWorkerSrc() {
18
+ if (!bundledWorkerSrcPromise) bundledWorkerSrcPromise = import("./pdfjs-worker-url.js").then((module) => module.default);
19
+ return bundledWorkerSrcPromise;
20
+ }
21
+ function resolveWorker(_x, _x2) {
22
+ return _resolveWorker.apply(this, arguments);
23
+ }
24
+ function _resolveWorker() {
25
+ _resolveWorker = _asyncToGenerator(function* (props, pdfjs) {
26
+ if (props.worker === false) {
27
+ yield ensureMainThreadWorker();
28
+ return;
29
+ }
30
+ if (props.workerPort) {
31
+ pdfjs.GlobalWorkerOptions.workerPort = props.workerPort;
32
+ return;
33
+ }
34
+ if (props.workerSrc) {
35
+ pdfjs.GlobalWorkerOptions.workerSrc = props.workerSrc;
36
+ return;
37
+ }
38
+ pdfjs.GlobalWorkerOptions.workerSrc = yield defaultWorkerSrc();
39
+ });
40
+ return _resolveWorker.apply(this, arguments);
41
+ }
42
+ function isCancelledError(error) {
43
+ return error !== null && typeof error === "object" && "name" in error && error.name === "RenderingCancelledException";
44
+ }
45
+ /**
46
+ * @zh 管理 pdf.js 文档加载、分页与画布渲染的生命周期,内部按请求 id 防竞态。
47
+ * @en Manages the pdf.js document loading, pagination and canvas rendering lifecycle, with internal request-id based race protection.
48
+ */
49
+ function usePdfJs(context) {
50
+ const doc = shallowRef(null);
51
+ const numPages = shallowRef(0);
52
+ const page = shallowRef(1);
53
+ let loadingTask = null;
54
+ let renderTask = null;
55
+ let activePage = null;
56
+ let loadId = 0;
57
+ function load() {
58
+ return _load.apply(this, arguments);
59
+ }
60
+ function _load() {
61
+ _load = _asyncToGenerator(function* () {
62
+ const url = context.src();
63
+ if (!url || isServerRendering) return;
64
+ const currentId = ++loadId;
65
+ context.onStatus("loading");
66
+ try {
67
+ var _context$pdfProps, _props$page, _props$onDocumentLoad;
68
+ const pdfjs = yield loadPdfModule();
69
+ if (currentId !== loadId) return;
70
+ const props = (_context$pdfProps = context.pdfProps()) !== null && _context$pdfProps !== void 0 ? _context$pdfProps : {};
71
+ yield resolveWorker(props, pdfjs);
72
+ yield destroy();
73
+ if (currentId !== loadId) return;
74
+ loadingTask = pdfjs.getDocument(_objectSpread2({ url }, props.documentParams));
75
+ const pdfDoc = yield loadingTask.promise;
76
+ if (currentId !== loadId) {
77
+ loadingTask = null;
78
+ return;
79
+ }
80
+ doc.value = pdfDoc;
81
+ numPages.value = pdfDoc.numPages;
82
+ page.value = Math.min(Math.max((_props$page = props.page) !== null && _props$page !== void 0 ? _props$page : 1, 1), pdfDoc.numPages);
83
+ context.onStatus("loaded");
84
+ (_props$onDocumentLoad = props.onDocumentLoad) === null || _props$onDocumentLoad === void 0 || _props$onDocumentLoad.call(props, pdfDoc);
85
+ } catch (_unused) {
86
+ if (currentId !== loadId) return;
87
+ context.onStatus("error");
88
+ }
89
+ });
90
+ return _load.apply(this, arguments);
91
+ }
92
+ function render(_x3) {
93
+ return _render.apply(this, arguments);
94
+ }
95
+ function _render() {
96
+ _render = _asyncToGenerator(function* (canvas, pageNumber = page.value) {
97
+ var _context$pdfProps2, _props$scale, _props$rotation;
98
+ const pdfDoc = doc.value;
99
+ if (!pdfDoc) return;
100
+ const props = (_context$pdfProps2 = context.pdfProps()) !== null && _context$pdfProps2 !== void 0 ? _context$pdfProps2 : {};
101
+ const scale = (_props$scale = props.scale) !== null && _props$scale !== void 0 ? _props$scale : 1;
102
+ const rotation = (_props$rotation = props.rotation) !== null && _props$rotation !== void 0 ? _props$rotation : 0;
103
+ const target = Math.min(Math.max(pageNumber, 1), numPages.value || 1);
104
+ if (target !== page.value) page.value = target;
105
+ if (renderTask) try {
106
+ renderTask.cancel();
107
+ } catch (_unused2) {}
108
+ if (activePage) try {
109
+ activePage.cleanup();
110
+ } catch (_unused3) {}
111
+ const pdfPage = yield pdfDoc.getPage(target);
112
+ activePage = pdfPage;
113
+ const viewport = pdfPage.getViewport({
114
+ scale,
115
+ rotation
116
+ });
117
+ if (!canvas.getContext("2d")) return;
118
+ const dpr = window.devicePixelRatio || 1;
119
+ canvas.width = Math.floor(viewport.width * dpr);
120
+ canvas.height = Math.floor(viewport.height * dpr);
121
+ canvas.style.width = `${Math.floor(viewport.width)}px`;
122
+ canvas.style.height = `${Math.floor(viewport.height)}px`;
123
+ const renderParams = _objectSpread2(_objectSpread2({
124
+ canvas,
125
+ viewport
126
+ }, dpr !== 1 ? { transform: [
127
+ dpr,
128
+ 0,
129
+ 0,
130
+ dpr,
131
+ 0,
132
+ 0
133
+ ] } : {}), props.renderParams);
134
+ const task = pdfPage.render(renderParams);
135
+ renderTask = task;
136
+ try {
137
+ yield task.promise;
138
+ } catch (error) {
139
+ if (!isCancelledError(error)) throw error;
140
+ } finally {
141
+ if (renderTask === task) renderTask = null;
142
+ }
143
+ });
144
+ return _render.apply(this, arguments);
145
+ }
146
+ function goto(next) {
147
+ if (!doc.value || numPages.value === 0) return;
148
+ page.value = Math.min(Math.max(next, 1), numPages.value);
149
+ }
150
+ function prev() {
151
+ goto(page.value - 1);
152
+ }
153
+ function next() {
154
+ goto(page.value + 1);
155
+ }
156
+ function destroy() {
157
+ return _destroy.apply(this, arguments);
158
+ }
159
+ function _destroy() {
160
+ _destroy = _asyncToGenerator(function* () {
161
+ if (renderTask) {
162
+ try {
163
+ renderTask.cancel();
164
+ } catch (_unused4) {}
165
+ renderTask = null;
166
+ }
167
+ if (activePage) {
168
+ try {
169
+ activePage.cleanup();
170
+ } catch (_unused5) {}
171
+ activePage = null;
172
+ }
173
+ const task = loadingTask;
174
+ loadingTask = null;
175
+ doc.value = null;
176
+ numPages.value = 0;
177
+ page.value = 1;
178
+ if (task) try {
179
+ yield task.destroy();
180
+ } catch (_unused6) {}
181
+ });
182
+ return _destroy.apply(this, arguments);
183
+ }
184
+ return {
185
+ doc,
186
+ numPages,
187
+ page,
188
+ goto,
189
+ prev,
190
+ next,
191
+ render,
192
+ load,
193
+ destroy
194
+ };
195
+ }
196
+ //#endregion
197
+ export { usePdfJs };
package/es/index.css CHANGED
@@ -14980,7 +14980,7 @@ body.sd-tour-active .sd-tour-popover * {
14980
14980
  min-width: 0;
14981
14981
  min-height: 0;
14982
14982
  }
14983
- .sd-file-previewer-image, .sd-file-previewer-video-player, .sd-file-previewer-audio-player, .sd-file-previewer-video, .sd-file-previewer-pdf {
14983
+ .sd-file-previewer-image, .sd-file-previewer-video-player, .sd-file-previewer-audio-player, .sd-file-previewer-video {
14984
14984
  display: block;
14985
14985
  width: 100%;
14986
14986
  height: 100%;
@@ -15023,12 +15023,60 @@ body.sd-tour-active .sd-tour-popover * {
15023
15023
  width: 100%;
15024
15024
  }
15025
15025
  .sd-file-previewer-pdf {
15026
- background: var(--sd-color-bg-2);
15027
- border: 0;
15026
+ display: flex;
15027
+ flex-direction: column;
15028
+ gap: 6px;
15029
+ width: 100%;
15030
+ height: 100%;
15031
+ }
15032
+ .sd-file-previewer-pdf-canvas-wrap {
15033
+ display: flex;
15034
+ flex: 1;
15035
+ align-items: center;
15036
+ justify-content: center;
15037
+ min-width: 0;
15038
+ min-height: 0;
15039
+ overflow: auto;
15040
+ background: var(--sd-color-bg-1);
15028
15041
  border-radius: var(--sd-border-radius-medium);
15029
15042
  }
15030
- .sd-file-previewer-inline .sd-file-previewer-pdf {
15031
- border-radius: 0;
15043
+ .sd-file-previewer-pdf-canvas {
15044
+ display: block;
15045
+ }
15046
+ .sd-file-previewer-pdf-toolbar {
15047
+ display: flex;
15048
+ flex-shrink: 0;
15049
+ gap: 6px;
15050
+ align-items: center;
15051
+ justify-content: center;
15052
+ padding: 4px;
15053
+ color: var(--sd-color-white);
15054
+ background: rgba(0, 0, 0, 0.5);
15055
+ border-radius: var(--sd-border-radius-medium);
15056
+ }
15057
+ .sd-file-previewer-pdf-btn {
15058
+ display: inline-flex;
15059
+ align-items: center;
15060
+ justify-content: center;
15061
+ min-width: 28px;
15062
+ height: 28px;
15063
+ padding: 0 6px;
15064
+ color: inherit;
15065
+ font-size: 16px;
15066
+ line-height: 1;
15067
+ background: transparent;
15068
+ border: 0;
15069
+ border-radius: var(--sd-border-radius-small);
15070
+ cursor: pointer;
15071
+ }
15072
+ .sd-file-previewer-pdf-btn:disabled {
15073
+ color: var(--sd-color-fill-3);
15074
+ cursor: not-allowed;
15075
+ }
15076
+ .sd-file-previewer-pdf-page {
15077
+ min-width: 64px;
15078
+ font-size: 14px;
15079
+ text-align: center;
15032
15080
  }
15033
15081
  .sd-file-previewer-close-btn {
15034
15082
  position: absolute;
package/es/index.d.ts CHANGED
@@ -70,7 +70,7 @@ export type { ColProps, GridColInstance, GridInstance, GridItemInstance, GridIte
70
70
  export { default as Icon } from './icon-component';
71
71
  export type { IconInstance, IconProps } from './icon-component';
72
72
  export { default as FilePreviewer } from './file-previewer';
73
- export type { FilePreviewerContentSlotProps, FilePreviewerImageProps, FilePreviewerInstance, FilePreviewerMediaProps, FilePreviewerMediaSkin, FilePreviewerPdfProps, FilePreviewerProps, FilePreviewerStatus, FilePreviewerType, } from './file-previewer';
73
+ export type { FilePreviewerContentSlotProps, FilePreviewerImageProps, FilePreviewerImageSlotProps, FilePreviewerInstance, FilePreviewerMediaProps, FilePreviewerMediaSkin, FilePreviewerMediaSlotProps, FilePreviewerPdfProps, FilePreviewerPdfRotation, FilePreviewerPdfSlotProps, FilePreviewerProps, FilePreviewerStatus, FilePreviewerType, } from './file-previewer';
74
74
  export { default as Image, ImagePreviewAction, ImagePreview, ImagePreviewGroup } from './image';
75
75
  export type { ImageInstance, ImagePreviewActionInstance, ImagePreviewInstance, ImagePreviewGroupInstance, } from './image';
76
76
  export { default as Input, InputGroup, InputPassword, InputSearch } from './input';
@@ -64,15 +64,19 @@ var base_node_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
64
64
  const action = (_treeContext$treeProp = treeContext.treeProps) === null || _treeContext$treeProp === void 0 ? void 0 : _treeContext$treeProp.actionOnNodeClick;
65
65
  return action ? toArray(action) : [];
66
66
  });
67
+ const showSwitcher = computed(() => {
68
+ var _treeContext$treeProp2;
69
+ return ((_treeContext$treeProp2 = treeContext.treeProps) === null || _treeContext$treeProp2 === void 0 ? void 0 : _treeContext$treeProp2.switcher) !== false;
70
+ });
67
71
  const { isLeaf, isTail, selectable, disabled, disableCheckbox, draggable } = toRefs(props);
68
72
  const classNames = computed(() => {
69
- var _treeContext$treeProp2;
73
+ var _treeContext$treeProp3;
70
74
  return [`${prefixCls}`, {
71
75
  [`${prefixCls}-selected`]: selected.value,
72
76
  [`${prefixCls}-is-leaf`]: isLeaf.value,
73
77
  [`${prefixCls}-is-tail`]: isTail.value,
74
78
  [`${prefixCls}-expanded`]: expanded.value,
75
- [`${prefixCls}-disabled-selectable`]: !selectable.value && !((_treeContext$treeProp2 = treeContext.treeProps) === null || _treeContext$treeProp2 === void 0 ? void 0 : _treeContext$treeProp2.disableSelectActionOnly),
79
+ [`${prefixCls}-disabled-selectable`]: !selectable.value && !((_treeContext$treeProp3 = treeContext.treeProps) === null || _treeContext$treeProp3 === void 0 ? void 0 : _treeContext$treeProp3.disableSelectActionOnly),
76
80
  [`${prefixCls}-disabled`]: disabled.value
77
81
  }];
78
82
  });
@@ -131,12 +135,12 @@ var base_node_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
131
135
  const treeDragIcon = computed(() => treeContext.dragIcon);
132
136
  const treeNodeIcon = computed(() => treeContext.nodeIcon);
133
137
  const shouldRenderEllipsis = computed(() => {
134
- var _treeContext$treeProp3, _treeContext$treeProp4, _treeContext$treeProp5;
135
- return !treeContext.nodeTitle && !slots.title && (((_treeContext$treeProp3 = treeContext.treeProps) === null || _treeContext$treeProp3 === void 0 ? void 0 : _treeContext$treeProp3.ellipsis) === true || ((_treeContext$treeProp4 = treeContext.treeProps) === null || _treeContext$treeProp4 === void 0 ? void 0 : _treeContext$treeProp4.ellipsis) === "performant-ellipsis" || Boolean((_treeContext$treeProp5 = treeContext.treeProps) === null || _treeContext$treeProp5 === void 0 ? void 0 : _treeContext$treeProp5.virtualListProps));
138
+ var _treeContext$treeProp4, _treeContext$treeProp5, _treeContext$treeProp6;
139
+ return !treeContext.nodeTitle && !slots.title && (((_treeContext$treeProp4 = treeContext.treeProps) === null || _treeContext$treeProp4 === void 0 ? void 0 : _treeContext$treeProp4.ellipsis) === true || ((_treeContext$treeProp5 = treeContext.treeProps) === null || _treeContext$treeProp5 === void 0 ? void 0 : _treeContext$treeProp5.ellipsis) === "performant-ellipsis" || Boolean((_treeContext$treeProp6 = treeContext.treeProps) === null || _treeContext$treeProp6 === void 0 ? void 0 : _treeContext$treeProp6.virtualListProps));
136
140
  });
137
141
  const ellipsisComponent = computed(() => {
138
- var _treeContext$treeProp6, _treeContext$treeProp7;
139
- return ((_treeContext$treeProp6 = treeContext.treeProps) === null || _treeContext$treeProp6 === void 0 ? void 0 : _treeContext$treeProp6.ellipsis) === true && !((_treeContext$treeProp7 = treeContext.treeProps) === null || _treeContext$treeProp7 === void 0 ? void 0 : _treeContext$treeProp7.virtualListProps) ? Ellipsis : PerformantEllipsis;
142
+ var _treeContext$treeProp7, _treeContext$treeProp8;
143
+ return ((_treeContext$treeProp7 = treeContext.treeProps) === null || _treeContext$treeProp7 === void 0 ? void 0 : _treeContext$treeProp7.ellipsis) === true && !((_treeContext$treeProp8 = treeContext.treeProps) === null || _treeContext$treeProp8 === void 0 ? void 0 : _treeContext$treeProp8.virtualListProps) ? Ellipsis : PerformantEllipsis;
140
144
  });
141
145
  const titleTextClassNames = computed(() => [`${prefixCls}-title-text`, { [`${prefixCls}-title-text-ellipsis`]: shouldRenderEllipsis.value }]);
142
146
  function onSwitcherClick(e) {
@@ -233,7 +237,10 @@ var base_node_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
233
237
  class: normalizeClass([`${unref(prefixCls)}-indent-block`, { [`${unref(prefixCls)}-indent-block-lineless`]: __props.lineless[i - 1] }])
234
238
  }, null, 2);
235
239
  }), 128))], 2),
236
- createElementVNode("span", { class: normalizeClass([`${unref(prefixCls)}-switcher`, { [`${unref(prefixCls)}-switcher-expanded`]: expanded.value }]) }, [createVNode(node_switcher_default, {
240
+ showSwitcher.value ? (openBlock(), createElementBlock("span", {
241
+ key: 0,
242
+ class: normalizeClass([`${unref(prefixCls)}-switcher`, { [`${unref(prefixCls)}-switcher-expanded`]: expanded.value }])
243
+ }, [createVNode(node_switcher_default, {
237
244
  "prefix-cls": unref(prefixCls),
238
245
  loading: loading.value,
239
246
  "show-line": __props.showLine,
@@ -259,9 +266,9 @@ var base_node_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
259
266
  "tree-node-data",
260
267
  "icons",
261
268
  "node-status"
262
- ])], 2),
269
+ ])], 2)) : createCommentVNode("", true),
263
270
  __props.checkable ? (openBlock(), createBlock(unref(Checkbox), {
264
- key: 0,
271
+ key: 1,
265
272
  disabled: unref(disableCheckbox) || unref(disabled),
266
273
  "model-value": checked.value,
267
274
  indeterminate: indeterminate.value,
@@ -329,7 +336,7 @@ var base_node_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
329
336
  key: 2,
330
337
  node: treeNodeData.value
331
338
  }, nodeStatus), null, 16, ["node"])) : (openBlock(), createBlock(unref(IconDragDotVertical), { key: 3 }))], 2)) : createCommentVNode("", true)], 2)], 42, _hoisted_2),
332
- extra.value ? (openBlock(), createBlock(resolveDynamicComponent(extra.value), { key: 1 })) : createCommentVNode("", true)
339
+ extra.value ? (openBlock(), createBlock(resolveDynamicComponent(extra.value), { key: 2 })) : createCommentVNode("", true)
333
340
  ], 10, _hoisted_1);
334
341
  };
335
342
  }
@@ -71,6 +71,7 @@ export type CheckableType = boolean | ((node: TreeNodeData, info: {
71
71
  export interface TreeProps {
72
72
  size: Size;
73
73
  blockNode: boolean;
74
+ switcher: boolean;
74
75
  defaultExpandAll: boolean;
75
76
  multiple: boolean;
76
77
  checkable: CheckableType;
@@ -24,6 +24,10 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
24
24
  blockNode: {
25
25
  type: BooleanConstructor;
26
26
  };
27
+ switcher: {
28
+ type: BooleanConstructor;
29
+ default: boolean;
30
+ };
27
31
  defaultExpandAll: {
28
32
  type: BooleanConstructor;
29
33
  default: boolean;
@@ -219,6 +223,10 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
219
223
  blockNode: {
220
224
  type: BooleanConstructor;
221
225
  };
226
+ switcher: {
227
+ type: BooleanConstructor;
228
+ default: boolean;
229
+ };
222
230
  defaultExpandAll: {
223
231
  type: BooleanConstructor;
224
232
  default: boolean;
@@ -413,6 +421,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
413
421
  showLine: boolean;
414
422
  searchValue: string;
415
423
  onlyCheckLeaf: boolean;
424
+ switcher: boolean;
416
425
  defaultExpandAll: boolean;
417
426
  checkedStrategy: "parent" | "all" | "child";
418
427
  defaultExpandSelected: boolean;
@@ -30,6 +30,14 @@ var tree_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineCompo
30
30
  */
31
31
  blockNode: { type: Boolean },
32
32
  /**
33
+ * @zh 是否显示节点的展开/收起 switcher,设为 `false` 时不渲染 `switcher` 节点
34
+ * @en Whether to display the expand/collapse switcher of the node. When set to `false`, the switcher node will not be rendered
35
+ */
36
+ switcher: {
37
+ type: Boolean,
38
+ default: true
39
+ },
40
+ /**
33
41
  * @zh 是否默认展开父节点
34
42
  * @en Whether to expand the parent node by default
35
43
  */