@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.
@@ -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(m, h, g, _) {
5
- return g ??= useMergedClsPrefix(), _useStyle(m, h, g, _), g;
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-DrH-89qR.js";
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 };
@@ -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
- onRest?: MaybeArray<() => void> | undefined
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' | 'submitloading'> & {
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: { cols: number, spans: number, overflow: boolean }) => VNodeChild
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
- onRest?: MaybeArray<() => void> | undefined
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: 'collpase', collapsed: boolean): void
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
- visiblityField?: keyof Data | undefined
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
@@ -43,7 +43,7 @@ export declare const AppContent: (
43
43
  },
44
44
  ) => VNode
45
45
 
46
- export declare const AppSider: (
46
+ export declare const AppSidebar: (
47
47
  props: PublicProps & {
48
48
  'collapsed'?: boolean | undefined
49
49
  'width'?: number | undefined
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'>> & PublicProps
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
@@ -64,6 +64,7 @@ export interface UILocale {
64
64
  selectFileText: string
65
65
  validate: {
66
66
  fileErrorMessage: string
67
+ fileSizeExceeded: string
67
68
  }
68
69
  }
69
70
  filter: {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ithinkdt/ui",
3
- "version": "4.0.0-700",
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-700"
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.2",
86
- "ithinkdt-ui": "^1.8.1",
85
+ "@vitejs/plugin-vue-jsx": "^5.1.3",
86
+ "ithinkdt-ui": "^1.8.3",
87
87
  "typescript": "~5.9.3",
88
- "unocss": ">=66.5.10",
89
- "vite": "^8.0.0-beta.3",
90
- "vue": "^3.5.25",
91
- "vue-router": "^4.6.4",
92
- "@ithinkdt/page": "^4.0.0-700"
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 };