@ithinkdt/ui 4.0.0-700 → 4.0.0-801
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-Yo5FKzwp.js → components-BqDuqv2P.js} +622 -635
- package/dist/components.js +1 -1
- package/dist/directives-pc2Vi93X.js +240 -0
- package/dist/directives.js +1 -1
- package/dist/index.js +333 -333
- package/dist/page.js +426 -329
- package/dist/{use-style-DrH-89qR.js → use-style-BGq0HdRK.js} +2 -2
- package/dist/use-style.js +1 -1
- package/esm/components.d.ts +25 -7
- package/esm/design.d.ts +1 -1
- package/esm/page.d.ts +18 -4
- package/locale.d.ts +1 -0
- package/package.json +9 -9
- package/dist/directives-RPqFovTo.js +0 -237
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { useMergedClsPrefix } from "ithinkdt-ui/es/_mixins/use-config";
|
|
2
2
|
import _useStyle from "ithinkdt-ui/es/_mixins/use-style";
|
|
3
3
|
import { c, cB, cE, cM } from "ithinkdt-ui/es/_utils/cssr/index";
|
|
4
|
-
function useStyle(
|
|
5
|
-
return
|
|
4
|
+
function useStyle(t, n, r, i) {
|
|
5
|
+
return r ??= useMergedClsPrefix(), _useStyle(t, n, r, i), r;
|
|
6
6
|
}
|
|
7
7
|
const fullWidth = { width: "100%" }, fullHeight = { height: "100%" }, fullWH = {
|
|
8
8
|
...fullWidth,
|
package/dist/use-style.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { a as flex, c as flexDirCol, d as flexJustifySB, f as fullHeight, g as useStyle, h as useMergedClsPrefix, i as cM, l as flexGap, m as fullWidth, n as cB, o as flexAlignCenter, p as fullWH, r as cE, s as flexCenter, t as c, u as flexJustifyCenter } from "./use-style-
|
|
1
|
+
import { a as flex, c as flexDirCol, d as flexJustifySB, f as fullHeight, g as useStyle, h as useMergedClsPrefix, i as cM, l as flexGap, m as fullWidth, n as cB, o as flexAlignCenter, p as fullWH, r as cE, s as flexCenter, t as c, u as flexJustifyCenter } from "./use-style-BGq0HdRK.js";
|
|
2
2
|
export { c, cB, cE, cM, useStyle as default, flex, flexAlignCenter, flexCenter, flexDirCol, flexGap, flexJustifyCenter, flexJustifySB, fullHeight, fullWH, fullWidth, useMergedClsPrefix as useClsPrefix };
|
package/esm/components.d.ts
CHANGED
|
@@ -3,9 +3,10 @@ import {
|
|
|
3
3
|
FlexProps, FormItemGiProps as NFormItemGiProps, FormProps as NFormProps, GridItemProps as NGridItemProps, GridProps as NGridProps,
|
|
4
4
|
PopoverProps, RadioGroupProps, TransferProps,
|
|
5
5
|
} from 'ithinkdt-ui'
|
|
6
|
+
import { TableBaseColumn } from 'ithinkdt-ui/es/data-table/src/interface'
|
|
6
7
|
import Sortable from 'sortablejs'
|
|
7
8
|
import { AllowedComponentProps, MaybeRef, MaybeRefOrGetter, VNodeChild } from 'vue'
|
|
8
|
-
import type { CSSProperties, HTMLAttributes, TemplateRef } from 'vue'
|
|
9
|
+
import type { CSSProperties, ComponentPublicInstance, HTMLAttributes, TemplateRef } from 'vue'
|
|
9
10
|
|
|
10
11
|
import { GenericCtx, GenericExposed, GenericReturn, MaybeArray, MaybePromise, PublicProps } from '@ithinkdt/common'
|
|
11
12
|
import { DictItem } from '@ithinkdt/common/dict'
|
|
@@ -50,6 +51,20 @@ declare module '@ithinkdt/page' {
|
|
|
50
51
|
interface FormItemRenderExtraParams {
|
|
51
52
|
size?: 'small' | 'medium' | 'large' | undefined
|
|
52
53
|
}
|
|
54
|
+
|
|
55
|
+
type TableColumnOptionKeys = 'cellProps' | 'className' | 'tree' | 'allowExport' | 'customNextSortOrder' | 'filter' | 'filterMode' | 'filterMultiple'
|
|
56
|
+
| 'defaultFilterOptionValue' | 'defaultFilterOptionValues' | 'filterOptionValue' | 'filterOptionValues' | 'filterOptions' | 'renderFilter' | 'renderFilterIcon' | 'renderFilterMenu'
|
|
57
|
+
type TableColumnOptionExtra = {
|
|
58
|
+
[K in TableColumnOptionKeys]?: MaybeRef<TableBaseColumn[K]>
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
// eslint-disable-next-line ts/no-unused-vars
|
|
62
|
+
interface TableColumnOptions<Model extends {}> extends TableColumnOptionExtra {
|
|
63
|
+
}
|
|
64
|
+
|
|
65
|
+
// eslint-disable-next-line ts/no-unused-vars
|
|
66
|
+
interface TableColumn<Model extends {}>extends Pick<TableBaseColumn, TableColumnOptionKeys> {
|
|
67
|
+
}
|
|
53
68
|
}
|
|
54
69
|
|
|
55
70
|
export type NStateButtonProps = ButtonProps & {
|
|
@@ -91,7 +106,7 @@ export type DataFormActionsProps = Pick<FlexProps, 'align' | 'justify' | 'vertic
|
|
|
91
106
|
successText?: VNodeChild | undefined
|
|
92
107
|
failureText?: VNodeChild | undefined
|
|
93
108
|
onSubmit?: MaybeArray<() => void> | undefined
|
|
94
|
-
|
|
109
|
+
onReset?: MaybeArray<() => void> | undefined
|
|
95
110
|
onCancel?: MaybeArray<() => void> | undefined
|
|
96
111
|
nativeButtonType?: boolean | undefined
|
|
97
112
|
}
|
|
@@ -115,7 +130,7 @@ export declare function DataFormActions(
|
|
|
115
130
|
): GenericReturn<DataFormActionsProps, DataFormActionsEmits, DataFormActionsSlots>
|
|
116
131
|
|
|
117
132
|
export type DataFormProps<Data extends {}> = Omit<NFormProps, 'model' | 'rules' | 'onSubmit' | 'validateMessages'>
|
|
118
|
-
& Omit<DataFormActionsProps, 'onSubmit' | 'size' | 'gap' | 'justify' | 'direction' | '
|
|
133
|
+
& Omit<DataFormActionsProps, 'onSubmit' | 'size' | 'gap' | 'justify' | 'direction' | 'submitLoading'> & {
|
|
119
134
|
items: FormItem<Data>[]
|
|
120
135
|
model: Data
|
|
121
136
|
readonly?: boolean | undefined
|
|
@@ -138,7 +153,7 @@ export type DataFormEmits<Data extends {}> = {
|
|
|
138
153
|
}
|
|
139
154
|
|
|
140
155
|
export type DataFormSlots<_Data extends {}> = {
|
|
141
|
-
action?: (params: {
|
|
156
|
+
action?: (params: { overflow: boolean, grid: ComponentPublicInstance | undefined }) => VNodeChild
|
|
142
157
|
actionPrefix?: () => VNodeChild
|
|
143
158
|
actionSuffix?: () => VNodeChild
|
|
144
159
|
}
|
|
@@ -168,7 +183,7 @@ export type DataFilterProps<Data extends {}> = Omit<NFormProps, 'model' | 'rules
|
|
|
168
183
|
tooltipPlacement?: 'bottom' | 'icon' | undefined
|
|
169
184
|
customizable?: boolean | undefined
|
|
170
185
|
onFilter?: MaybeArray<(model: Data) => void> | undefined
|
|
171
|
-
|
|
186
|
+
onReset?: MaybeArray<() => void> | undefined
|
|
172
187
|
onCustom?: MaybeArray<
|
|
173
188
|
((reset: true) => void)
|
|
174
189
|
| ((sort: string[]) => void)
|
|
@@ -190,7 +205,7 @@ export type DataFilterEmits<Data extends {}> = {
|
|
|
190
205
|
key: string
|
|
191
206
|
hidden?: boolean
|
|
192
207
|
}): void
|
|
193
|
-
(e: '
|
|
208
|
+
(e: 'collapse', collapsed: boolean): void
|
|
194
209
|
}
|
|
195
210
|
|
|
196
211
|
export type DataFilterInst = {
|
|
@@ -256,6 +271,7 @@ export type DataPaginationProps = (PageParams | { page: PageParams }) & {
|
|
|
256
271
|
simple?: boolean | undefined
|
|
257
272
|
total: number
|
|
258
273
|
pageSizes?: number[] | undefined
|
|
274
|
+
resetPageOnSizeChange?: boolean | undefined
|
|
259
275
|
onChange?: MaybeArray<(value: PageParams) => void> | undefined
|
|
260
276
|
}
|
|
261
277
|
|
|
@@ -297,7 +313,7 @@ export type DataCustomProps<Data extends {}> = {
|
|
|
297
313
|
keyField?: keyof Data | undefined
|
|
298
314
|
showFixed?: boolean | undefined
|
|
299
315
|
disabledField?: keyof Data | undefined
|
|
300
|
-
|
|
316
|
+
visibleField?: keyof Data | undefined
|
|
301
317
|
labelTitle?: VNodeChild | undefined
|
|
302
318
|
size?: number | undefined
|
|
303
319
|
type?: 'primary' | 'default' | undefined
|
|
@@ -458,6 +474,7 @@ interface UserDeptProps<Multiple extends boolean> {
|
|
|
458
474
|
'modelValue'?: Multiple extends true ? (string[] | null | undefined) : (string | null | undefined)
|
|
459
475
|
'onUpdate:modelValue'?: MaybeArray<(value: Multiple extends true ? string[] : string) => void> | undefined
|
|
460
476
|
'onUpdateModelValue'?: MaybeArray<(value: Multiple extends true ? string[] : string) => void> | undefined
|
|
477
|
+
'renderUserInfo'?: (user: { username: string, nickname: string }) => VNodeChild | undefined
|
|
461
478
|
}
|
|
462
479
|
|
|
463
480
|
interface UserDeptEmits<Multiple extends boolean> {
|
|
@@ -479,6 +496,7 @@ interface UserRenderProps {
|
|
|
479
496
|
size?: number | undefined
|
|
480
497
|
placement?: PopoverProps['placement']
|
|
481
498
|
getUsersByUsername?: ((usernames: string[]) => Promise<{ username: string, nickname: string }[]>) | undefined
|
|
499
|
+
renderInfo?: (user: { username: string, nickname: string }) => VNodeChild
|
|
482
500
|
}
|
|
483
501
|
|
|
484
502
|
interface UserRenderEmits {
|
package/esm/design.d.ts
CHANGED
package/esm/page.d.ts
CHANGED
|
@@ -4,13 +4,13 @@ import {
|
|
|
4
4
|
ModalOptions, SelectGroupOption, SelectOption, SelectProps, SelectSlots,
|
|
5
5
|
UploadFileInfo, UploadProps,
|
|
6
6
|
} from 'ithinkdt-ui'
|
|
7
|
-
import { MaybeRef, VNode } from 'vue'
|
|
7
|
+
import { MaybeRef, VNode, VNodeChild } from 'vue'
|
|
8
8
|
|
|
9
9
|
import { PublicProps } from '@ithinkdt/common'
|
|
10
10
|
import { DictItem, DictTypeKey } from '@ithinkdt/common/dict'
|
|
11
11
|
import { PageOptions } from '@ithinkdt/page'
|
|
12
12
|
|
|
13
|
-
import { CheckboxesProps, RadiosProps, UserDeptProps, UserGroupOption } from './components'
|
|
13
|
+
import { CheckboxesProps, RadiosProps, UserDeptProps, UserGroupOption, UserRenderProps } from './components'
|
|
14
14
|
|
|
15
15
|
type ShallowMaybeRef<T extends {}> = {
|
|
16
16
|
[Key in (keyof T)]: MaybeRef<T[Key]>
|
|
@@ -78,6 +78,7 @@ declare module '@ithinkdt/page' {
|
|
|
78
78
|
multiple?: boolean | undefined
|
|
79
79
|
max?: number | undefined
|
|
80
80
|
accept?: string | undefined
|
|
81
|
+
/** 最大文件大小(单位:KB) */
|
|
81
82
|
maxSize?: number | undefined
|
|
82
83
|
onBeforeUpload?: UploadProps['onBeforeUpload']
|
|
83
84
|
} & PublicProps>
|
|
@@ -91,8 +92,10 @@ declare module '@ithinkdt/page' {
|
|
|
91
92
|
multiple?: boolean | undefined
|
|
92
93
|
max?: number | undefined
|
|
93
94
|
accept?: string | undefined
|
|
95
|
+
/** 最大文件大小(单位:KB) */
|
|
94
96
|
maxSize?: number | undefined
|
|
95
97
|
onBeforeUpload?: UploadProps['onBeforeUpload']
|
|
98
|
+
defaultUpload?: boolean | undefined
|
|
96
99
|
} & PublicProps>
|
|
97
100
|
uploadSlots?: {
|
|
98
101
|
default?: (() => VNode[]) | undefined
|
|
@@ -101,12 +104,23 @@ declare module '@ithinkdt/page' {
|
|
|
101
104
|
|
|
102
105
|
user: {
|
|
103
106
|
userProps?: ShallowMaybeRef<Omit<UserDeptProps<boolean>, 'modelValue' | 'onUpdate:modelValue' | 'disabled'
|
|
104
|
-
| 'users' | 'groups' | 'depts' | 'getUsersByGroup' | 'getUsersByDept'
|
|
107
|
+
| 'users' | 'groups' | 'depts' | 'getUsersByGroup' | 'getUsersByDept' | 'renderUserInfo'> & {
|
|
108
|
+
renderInfo: UserRenderProps['renderInfo']
|
|
109
|
+
}> & PublicProps
|
|
105
110
|
userSlots?: {}
|
|
106
111
|
}
|
|
107
112
|
}
|
|
108
113
|
|
|
109
114
|
interface DescriptionTypePresets {
|
|
115
|
+
longtext: {
|
|
116
|
+
longtextParams: {
|
|
117
|
+
title?: VNodeChild
|
|
118
|
+
showText?: ((value: string) => void) | undefined
|
|
119
|
+
formatText?: ((value: string) => VNodeChild) | undefined
|
|
120
|
+
copyable?: boolean | undefined
|
|
121
|
+
onCopy?: (value: string) => void | undefined
|
|
122
|
+
}
|
|
123
|
+
}
|
|
110
124
|
number: {
|
|
111
125
|
numberParams: ShallowMaybeRef<{
|
|
112
126
|
/** 保留 n 位小数(保留 0) */
|
|
@@ -154,7 +168,7 @@ declare module '@ithinkdt/page' {
|
|
|
154
168
|
fileParams: ShallowMaybeRef<{ multiple?: boolean | undefined }>
|
|
155
169
|
}
|
|
156
170
|
user: {
|
|
157
|
-
fileParams: ShallowMaybeRef<{ multiple?: boolean | undefined }>
|
|
171
|
+
fileParams: ShallowMaybeRef<{ multiple?: boolean | undefined, renderInfo?: UserRenderProps['renderInfo'] }>
|
|
158
172
|
}
|
|
159
173
|
dept: {
|
|
160
174
|
fileParams: ShallowMaybeRef<{ multiple?: boolean | undefined }>
|
package/locale.d.ts
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ithinkdt/ui",
|
|
3
|
-
"version": "4.0.0-
|
|
3
|
+
"version": "4.0.0-801",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"description": "iThinkDT UI",
|
|
@@ -64,7 +64,7 @@
|
|
|
64
64
|
"sortablejs": "^1.15.6",
|
|
65
65
|
"@types/sortablejs": "^1.15.9",
|
|
66
66
|
"nanoid": "^5.1.6",
|
|
67
|
-
"@ithinkdt/common": "^4.0.0-
|
|
67
|
+
"@ithinkdt/common": "^4.0.0-800"
|
|
68
68
|
},
|
|
69
69
|
"peerDependencies": {
|
|
70
70
|
"@ithinkdt/page": ">=4.0",
|
|
@@ -82,14 +82,14 @@
|
|
|
82
82
|
}
|
|
83
83
|
},
|
|
84
84
|
"devDependencies": {
|
|
85
|
-
"@vitejs/plugin-vue-jsx": "^5.1.
|
|
86
|
-
"ithinkdt-ui": "^1.8.
|
|
85
|
+
"@vitejs/plugin-vue-jsx": "^5.1.3",
|
|
86
|
+
"ithinkdt-ui": "^1.8.3",
|
|
87
87
|
"typescript": "~5.9.3",
|
|
88
|
-
"unocss": ">=66.
|
|
89
|
-
"vite": "^8.0.0-beta.
|
|
90
|
-
"vue": "^3.5.
|
|
91
|
-
"vue-router": "^
|
|
92
|
-
"@ithinkdt/page": "^4.0.0-
|
|
88
|
+
"unocss": ">=66.6.0",
|
|
89
|
+
"vite": "^8.0.0-beta.10",
|
|
90
|
+
"vue": "^3.5.27",
|
|
91
|
+
"vue-router": "^5.0.0-beta.2",
|
|
92
|
+
"@ithinkdt/page": "^4.0.0-801"
|
|
93
93
|
},
|
|
94
94
|
"scripts": {
|
|
95
95
|
"dev": "vite build --watch",
|
|
@@ -1,237 +0,0 @@
|
|
|
1
|
-
import { g as useStyle, i as cM, n as cB, r as cE, t as c } from "./use-style-DrH-89qR.js";
|
|
2
|
-
import { Fragment, createVNode, defineComponent, h, nextTick, reactive, ref, shallowRef, toRef, watch } from "vue";
|
|
3
|
-
import { promiseTimeout, useEventListener } from "@vueuse/core";
|
|
4
|
-
import { NTooltip } from "ithinkdt-ui";
|
|
5
|
-
import { nanoid } from "nanoid";
|
|
6
|
-
import { debounce, throttle } from "@ithinkdt/common/fn";
|
|
7
|
-
import { useElementIntersectionRect } from "@ithinkdt/common/composables";
|
|
8
|
-
import { string2dom } from "@ithinkdt/common/dom";
|
|
9
|
-
var SUPPORT_LINE_CLAMP = [
|
|
10
|
-
2,
|
|
11
|
-
3,
|
|
12
|
-
5
|
|
13
|
-
], style$1 = /* @__PURE__ */ c([
|
|
14
|
-
c(({ props: g }) => `:where(span${g.bPrefix}tooltip-host)`, { display: "inline-block" }),
|
|
15
|
-
c(({ props: g }) => `:where(${g.bPrefix}tooltip-host)`, {
|
|
16
|
-
maxWidth: "100%",
|
|
17
|
-
whiteSpace: "nowrap",
|
|
18
|
-
overflow: "hidden",
|
|
19
|
-
textOverflow: "ellipsis"
|
|
20
|
-
}),
|
|
21
|
-
...SUPPORT_LINE_CLAMP.map((g) => c(({ props: L }) => `:where(${L.bPrefix}tooltip-ell${g}:not(${L.bPrefix}tooltip-expanded))`, {
|
|
22
|
-
display: "-webkit-box",
|
|
23
|
-
WebkitLineClamp: g,
|
|
24
|
-
WebkitBoxOrient: "vertical",
|
|
25
|
-
whiteSpace: "normal"
|
|
26
|
-
})),
|
|
27
|
-
c(({ props: g }) => `:where(${g.bPrefix}tooltip-expandable)`, { cursor: "pointer" }),
|
|
28
|
-
c(({ props: g }) => `:where(${g.bPrefix}tooltip-expanded)`, {
|
|
29
|
-
cursor: "pointer",
|
|
30
|
-
whiteSpace: "normal",
|
|
31
|
-
lineHeight: "1.25"
|
|
32
|
-
})
|
|
33
|
-
]), Tooltip = /* @__PURE__ */ Symbol("tooltip-dir"), current = /* @__PURE__ */ shallowRef();
|
|
34
|
-
function detactOverflow(g) {
|
|
35
|
-
let L = g.firstChild;
|
|
36
|
-
if (!L) return !1;
|
|
37
|
-
let R = L instanceof Text ? {
|
|
38
|
-
width: g.scrollWidth,
|
|
39
|
-
height: g.scrollHeight
|
|
40
|
-
} : L.getBoundingClientRect?.() ?? {
|
|
41
|
-
width: L.clientWidth,
|
|
42
|
-
height: L.clientHeight
|
|
43
|
-
};
|
|
44
|
-
return R.width > g.clientWidth + 1 || R.height > g.clientHeight + 2;
|
|
45
|
-
}
|
|
46
|
-
var _update, _current, clsPrefix$1;
|
|
47
|
-
const TooltipDirectiveProvider = /* @__PURE__ */ defineComponent({
|
|
48
|
-
name: "TooltipDirectiveProvider",
|
|
49
|
-
props: { delay: {
|
|
50
|
-
type: Number,
|
|
51
|
-
default: 180
|
|
52
|
-
} },
|
|
53
|
-
setup(L) {
|
|
54
|
-
clsPrefix$1 = useStyle("-tooltip-directive", style$1);
|
|
55
|
-
let R = shallowRef(), z = reactive({
|
|
56
|
-
show: !1,
|
|
57
|
-
tip: void 0,
|
|
58
|
-
placement: "top",
|
|
59
|
-
x: 0,
|
|
60
|
-
y: 0
|
|
61
|
-
});
|
|
62
|
-
_update = async () => {
|
|
63
|
-
if (!current.value) return;
|
|
64
|
-
L.delay > 0 && await promiseTimeout(L.delay);
|
|
65
|
-
let g = current.value;
|
|
66
|
-
if (g?.classList.contains(`${clsPrefix$1.value}-tooltip-expanded`)) {
|
|
67
|
-
z.show = !1;
|
|
68
|
-
return;
|
|
69
|
-
}
|
|
70
|
-
let B = g?.[Tooltip];
|
|
71
|
-
if (!B) return;
|
|
72
|
-
B.binding.modifiers.expandable && g.classList.remove(`${clsPrefix$1.value}-tooltip-expandable`);
|
|
73
|
-
let V = B.tip;
|
|
74
|
-
if (R.value = typeof V == "function" ? V : () => V || g.attributes.getNamedItem("title") || g.textContent, !B.binding.modifiers || detactOverflow(g)) {
|
|
75
|
-
z.show = !0, B.binding.modifiers.expandable && g.classList.add(`${clsPrefix$1.value}-tooltip-expandable`);
|
|
76
|
-
let L = g.getBoundingClientRect();
|
|
77
|
-
switch (z.placement = Object.keys(B.binding.modifiers).find((g) => [
|
|
78
|
-
"top",
|
|
79
|
-
"right",
|
|
80
|
-
"left",
|
|
81
|
-
"bottom"
|
|
82
|
-
].find((L) => g.startsWith(L))) ?? "top", z.placement.split("-")[0]) {
|
|
83
|
-
case "top":
|
|
84
|
-
z.x = L.left + L.width / 2, z.y = L.top;
|
|
85
|
-
break;
|
|
86
|
-
case "right":
|
|
87
|
-
z.x = L.left + L.width, z.y = L.top + L.height / 2;
|
|
88
|
-
break;
|
|
89
|
-
case "left":
|
|
90
|
-
z.x = L.left, z.y = L.top + L.height / 2;
|
|
91
|
-
break;
|
|
92
|
-
case "bottom":
|
|
93
|
-
z.x = L.left + L.width / 2, z.y = L.bottom;
|
|
94
|
-
break;
|
|
95
|
-
}
|
|
96
|
-
} else z.show &&= !1;
|
|
97
|
-
};
|
|
98
|
-
let B = `ithinkdt-tooltip-${nanoid()}`, V = throttle((g) => {
|
|
99
|
-
!_current || _current.contains(g) || g.closest(`.${B}`) || (z.show = !1, current.value = void 0);
|
|
100
|
-
}, 100, { leading: !1 });
|
|
101
|
-
return useEventListener("mouseover", (g) => {
|
|
102
|
-
_current = current.value, V(g.target);
|
|
103
|
-
}, { capture: !0 }), () => createVNode(NTooltip, {
|
|
104
|
-
trigger: "manual",
|
|
105
|
-
show: !!current.value && z.show,
|
|
106
|
-
x: z.x,
|
|
107
|
-
y: z.y,
|
|
108
|
-
placement: z.placement
|
|
109
|
-
}, { default: () => [createVNode("div", { class: B }, [R.value?.()])] });
|
|
110
|
-
}
|
|
111
|
-
});
|
|
112
|
-
var _mouseenter = (g) => {
|
|
113
|
-
_current = void 0, current.value = g.target, _update?.();
|
|
114
|
-
}, _mouseclick = (g) => {
|
|
115
|
-
g.target.classList.contains(`${clsPrefix$1.value}-tooltip-expandable`) ? (g.target.classList.remove(`${clsPrefix$1.value}-tooltip-expandable`), g.target.classList.add(`${clsPrefix$1.value}-tooltip-expanded`), _update()) : g.target.classList.contains(`${clsPrefix$1.value}-tooltip-expanded`) && (g.target.classList.remove(`${clsPrefix$1.value}-tooltip-expanded`), g.target.classList.add(`${clsPrefix$1.value}-tooltip-expandable`), _update());
|
|
116
|
-
};
|
|
117
|
-
const vTooltip = {
|
|
118
|
-
mounted(g, L) {
|
|
119
|
-
g[Tooltip] = {
|
|
120
|
-
binding: L,
|
|
121
|
-
tip: L.value
|
|
122
|
-
}, g.addEventListener("mouseenter", _mouseenter), L.modifiers.auto && g.classList.add(`${clsPrefix$1.value}-tooltip-host`), L.modifiers.expandable && g.addEventListener("click", _mouseclick);
|
|
123
|
-
for (let R of SUPPORT_LINE_CLAMP) L.modifiers[`ell${R}`] && g.classList.add(`${clsPrefix$1.value}-tooltip-ell${R}`);
|
|
124
|
-
},
|
|
125
|
-
updated(g, L) {
|
|
126
|
-
if (g[Tooltip]) {
|
|
127
|
-
g[Tooltip].binding = L, g[Tooltip].tip = L.value, g.classList.toggle(`${clsPrefix$1.value}-tooltip-host`, L.modifiers.auto);
|
|
128
|
-
for (let R of SUPPORT_LINE_CLAMP) g.classList.toggle(`${clsPrefix$1.value}-tooltip-ell${R}`, L.modifiers[`ell${R}`]);
|
|
129
|
-
L.modifiers.expandable ? g.addEventListener("click", _mouseclick) : g.removeEventListener("click", _mouseclick), _update();
|
|
130
|
-
}
|
|
131
|
-
},
|
|
132
|
-
beforeUnmount(g) {
|
|
133
|
-
current.value === g && (current.value = void 0), g[Tooltip] && (g.removeEventListener("mouseenter", _mouseenter), g.removeEventListener("click", _mouseclick), g.classList.remove(`${clsPrefix$1.value}-tooltip-host`, `${clsPrefix$1.value}-tooltip-expandable`, `${clsPrefix$1.value}-tooltip-expanded`, ...SUPPORT_LINE_CLAMP.map((g) => `${clsPrefix$1.value}-tooltip-ell${g}`)), delete g[Tooltip]);
|
|
134
|
-
}
|
|
135
|
-
};
|
|
136
|
-
var clsPrefix, isDark, style = /* @__PURE__ */ c([c(({ props: g }) => `:where(${g.bPrefix}spin-host)`, { position: "relative" }), cB("spin-directive", {
|
|
137
|
-
zIndex: "999999",
|
|
138
|
-
position: "absolute",
|
|
139
|
-
color: "var(--color-primary)",
|
|
140
|
-
display: "flex",
|
|
141
|
-
flexDirection: "column",
|
|
142
|
-
justifyContent: "center",
|
|
143
|
-
alignItems: "center",
|
|
144
|
-
gap: "4px",
|
|
145
|
-
willChange: "background-color",
|
|
146
|
-
backgroundColor: "rgb(var(--host-bg, 255 255 255) / 0)",
|
|
147
|
-
transition: "background-color 0.3s cubic-bezier(0.4, 0, 0.2, 1)"
|
|
148
|
-
}, [
|
|
149
|
-
cE("tip, icon", {
|
|
150
|
-
willChange: "opacity",
|
|
151
|
-
opacity: "0",
|
|
152
|
-
transition: "opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1)"
|
|
153
|
-
}),
|
|
154
|
-
cE("tip:empty", { display: "none" }),
|
|
155
|
-
cM("spining", { backgroundColor: "rgb(var(--host-bg, 255 255 255) / 0.5)" }, [cE("tip, icon", { opacity: "1" })])
|
|
156
|
-
])]);
|
|
157
|
-
const SpinDirectiveProvider = /* @__PURE__ */ defineComponent({
|
|
158
|
-
name: "SpinDirectiveProvider",
|
|
159
|
-
props: { dark: Boolean },
|
|
160
|
-
setup(L) {
|
|
161
|
-
return clsPrefix = useStyle("-spin-directive", style), isDark = toRef(L, "dark"), () => h(Fragment);
|
|
162
|
-
}
|
|
163
|
-
});
|
|
164
|
-
var Spin = /* @__PURE__ */ Symbol("spin-dir"), updateLoading = (g, { value: L, modifiers: R }) => {
|
|
165
|
-
if (g[Spin].loading.value = !!L, !g[Spin].loading.value) return;
|
|
166
|
-
let z = R.dark || !R.light && isDark.value;
|
|
167
|
-
g[Spin].spinEl.style.setProperty("--host-bg", z ? "0 0 0" : "255 255 255");
|
|
168
|
-
};
|
|
169
|
-
const vSpin = {
|
|
170
|
-
beforeMount(g) {
|
|
171
|
-
if (g.classList.add(`${clsPrefix.value}-spin-host`), g[Spin]) return;
|
|
172
|
-
let L = ref(!1), R = string2dom(`
|
|
173
|
-
<div class="${clsPrefix.value}-spin-directive">
|
|
174
|
-
<svg class="${clsPrefix.value}-spin-directive__icon" width="32" height="32" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
|
|
175
|
-
<g>
|
|
176
|
-
<animateTransform attributeName="transform" type="rotate" values="0 100 100;270 100 100" begin="0s" dur="1.6s" fill="freeze" repeatCount="indefinite"></animateTransform>
|
|
177
|
-
<circle fill="none" stroke="currentColor" stroke-width="18" stroke-linecap="round" cx="100" cy="100" r="92" stroke-dasharray="567" stroke-dashoffset="1848">
|
|
178
|
-
<animateTransform attributeName="transform" type="rotate" values="0 100 100;135 100 100;450 100 100" begin="0s" dur="1.6s" fill="freeze" repeatCount="indefinite"></animateTransform>
|
|
179
|
-
<animate attributeName="stroke-dashoffset" values="567;142;567" begin="0s" dur="1.6s" fill="freeze" repeatCount="indefinite"></animate>
|
|
180
|
-
</circle>
|
|
181
|
-
</g>
|
|
182
|
-
</svg>
|
|
183
|
-
<div class="${clsPrefix.value}-spin-directive__tip"></div>
|
|
184
|
-
</div>
|
|
185
|
-
`.trim()), z, { stop: B, update: V } = useElementIntersectionRect(g, (g) => {
|
|
186
|
-
z = g, Object.assign(R.style, {
|
|
187
|
-
left: 0,
|
|
188
|
-
top: 0,
|
|
189
|
-
width: z.width + "px",
|
|
190
|
-
height: z.height + "px"
|
|
191
|
-
});
|
|
192
|
-
}, { interval: 1e3 / 30 }), H, U = watch(L, debounce(() => {
|
|
193
|
-
if (L.value) H === void 0 && (clearTimeout(H), H = void 0), V(), g.append(R), requestAnimationFrame(() => {
|
|
194
|
-
L.value && R.classList.add(`${clsPrefix.value}-spin-directive--spining`);
|
|
195
|
-
});
|
|
196
|
-
else {
|
|
197
|
-
R.classList.remove(`${clsPrefix.value}-spin-directive--spining`);
|
|
198
|
-
let g = () => {
|
|
199
|
-
R.remove(), L && clearTimeout(L), L = null, R.removeEventListener("transitioncancel", g), R.removeEventListener("transitionend", g);
|
|
200
|
-
};
|
|
201
|
-
R.addEventListener("transitioncancel", g), R.addEventListener("transitionend", g);
|
|
202
|
-
let L = setTimeout(g, 300);
|
|
203
|
-
}
|
|
204
|
-
}, 30));
|
|
205
|
-
g[Spin] = {
|
|
206
|
-
loading: L,
|
|
207
|
-
spinEl: R,
|
|
208
|
-
updateTip: () => {
|
|
209
|
-
let L = R.querySelector(`.${clsPrefix.value}-spin-directive__tip`);
|
|
210
|
-
L.textContent = g.dataset.spinTip;
|
|
211
|
-
},
|
|
212
|
-
stop: () => {
|
|
213
|
-
B(), U();
|
|
214
|
-
}
|
|
215
|
-
};
|
|
216
|
-
},
|
|
217
|
-
mounted(g, L) {
|
|
218
|
-
g[Spin] && (updateLoading(g, L), g[Spin].updateTip(), !g[Spin].observer && nextTick().then(() => {
|
|
219
|
-
(g[Spin].observer = new MutationObserver((L) => {
|
|
220
|
-
for (let R of L) if (R.type === "attributes" && R.attributeName === "data-spin-tip") {
|
|
221
|
-
g[Spin].updateTip();
|
|
222
|
-
return;
|
|
223
|
-
}
|
|
224
|
-
})).observe(g, {
|
|
225
|
-
attributes: !0,
|
|
226
|
-
attributeFilter: ["data-spin-tip"]
|
|
227
|
-
});
|
|
228
|
-
}));
|
|
229
|
-
},
|
|
230
|
-
updated(g, L) {
|
|
231
|
-
g[Spin] && updateLoading(g, L);
|
|
232
|
-
},
|
|
233
|
-
beforeUnmount(g) {
|
|
234
|
-
g[Spin] && (g[Spin].loading.value = !1, g[Spin].stop(), g[Spin].observer?.disconnect(), delete g[Spin]);
|
|
235
|
-
}
|
|
236
|
-
};
|
|
237
|
-
export { vTooltip as i, vSpin as n, TooltipDirectiveProvider as r, SpinDirectiveProvider as t };
|