@toolmain/components 1.2.1 → 1.2.2

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.
@@ -0,0 +1,285 @@
1
+ import type { Component } from 'vue';
2
+ import { ComponentOptionsMixin } from 'vue';
3
+ import { ComponentProvideOptions } from 'vue';
4
+ import type * as CSS_2 from 'csstype';
5
+ import { DefineComponent } from 'vue';
6
+ import type { MaybeRef } from 'vue';
7
+ import { PublicProps } from 'vue';
8
+ import type { VNode } from 'vue';
9
+
10
+ declare const __VLS_component: DefineComponent<__VLS_Props, {
11
+ update: () => void;
12
+ }, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
13
+
14
+ declare const __VLS_component_2: DefineComponent<ScaleProps, ScaleInstance, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {
15
+ moving: (pos: MoveParams) => any;
16
+ scaling: (scaleEl: HTMLElement) => any;
17
+ beforeMove: (pos: MoveParams) => any;
18
+ afterMove: (pos: MoveParams) => any;
19
+ afterScale: (scaleEl: HTMLElement) => any;
20
+ maskClick: () => any;
21
+ "update:modelValue": (data: ScaleConfig) => any;
22
+ }, string, PublicProps, Readonly<ScaleProps> & Readonly<{
23
+ onMoving?: ((pos: MoveParams) => any) | undefined;
24
+ onScaling?: ((scaleEl: HTMLElement) => any) | undefined;
25
+ onBeforeMove?: ((pos: MoveParams) => any) | undefined;
26
+ onAfterMove?: ((pos: MoveParams) => any) | undefined;
27
+ onAfterScale?: ((scaleEl: HTMLElement) => any) | undefined;
28
+ onMaskClick?: (() => any) | undefined;
29
+ "onUpdate:modelValue"?: ((data: ScaleConfig) => any) | undefined;
30
+ }>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
31
+
32
+ declare type __VLS_Props = {
33
+ /**
34
+ * 选择top时,如果元素滚动到[底部]消失或即将消失,会回到原位置
35
+ *
36
+ * 选择bottom时则是滚动到[顶部]时触发
37
+ */
38
+ position?: "top" | "bottom";
39
+ target?: string;
40
+ offset?: number;
41
+ };
42
+
43
+ declare type __VLS_Slots = {} & {
44
+ default?: (props: typeof __VLS_1) => any;
45
+ };
46
+
47
+ declare type __VLS_Slots_2 = {} & {
48
+ header?: (props: typeof __VLS_1) => any;
49
+ } & {
50
+ default?: (props: typeof __VLS_7) => any;
51
+ };
52
+
53
+ declare type __VLS_WithSlots<T, S> = T & {
54
+ new (): {
55
+ $slots: S;
56
+ };
57
+ };
58
+
59
+ declare type __VLS_WithSlots_2<T, S> = T & {
60
+ new (): {
61
+ $slots: S;
62
+ };
63
+ };
64
+
65
+ export declare const Affix: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
66
+
67
+ export declare type AnimateDir = "left" | "top" | "bottom" | "right" | "self" | "center" | {
68
+ x?: number;
69
+ y?: number;
70
+ };
71
+
72
+ declare type ArrMutKeys = "splice" | "push" | "pop" | "shift" | "unshift";
73
+
74
+ /**
75
+ * CSS Properties
76
+ */
77
+ declare interface CSSProperties extends CSS_2.Properties<string | number>, CSS_2.PropertiesHyphen<string | number> {
78
+ [v: `--${string}`]: string | number | undefined;
79
+ }
80
+
81
+ declare type Dir = "horizontal" | "vertical" | "any";
82
+
83
+ declare interface DragAttr {
84
+ /**
85
+ * 元素x轴坐标
86
+ */
87
+ x: number;
88
+ /**
89
+ * 元素y轴坐标
90
+ */
91
+ y: number;
92
+ /**
93
+ * 指针x坐标
94
+ */
95
+ clientX: number;
96
+ /**
97
+ * 指针y坐标
98
+ */
99
+ clientY: number;
100
+ width: number | InitType;
101
+ height: number | InitType;
102
+ }
103
+
104
+ /**
105
+ * 拖拽时transform计算的坐标
106
+ */
107
+ export declare interface DragOffset {
108
+ /**
109
+ * pointer按下时的X坐标
110
+ */
111
+ prevClientX: number;
112
+ /**
113
+ * pointer按下时的Y坐标
114
+ */
115
+ prevClientY: number;
116
+ /**
117
+ * 上次移动之后的translateX
118
+ */
119
+ prevTranslateX: number;
120
+ /**
121
+ * 上次移动之后的translateY
122
+ */
123
+ prevTranslateY: number;
124
+ /**
125
+ * 正在移动时的translateX
126
+ */
127
+ translateX: number;
128
+ /**
129
+ * 正在移动时的translateY
130
+ */
131
+ translateY: number;
132
+ scale: FixedArray<number, 2>;
133
+ }
134
+
135
+ /**
136
+ * 定长数组类型
137
+ */
138
+ declare type FixedArray<T, L extends number> = Pick<T[], Exclude<keyof T[], ArrMutKeys>> & {
139
+ readonly length: L;
140
+ };
141
+
142
+ declare type InitType = "auto" | "inherit" | "initial" | "unset";
143
+
144
+ export declare interface MoveHook {
145
+ x?: (oldVal: number, newVal: number, width: number, height: number) => number;
146
+ y?: (oldVal: number, newVal: number, width: number, height: number) => number;
147
+ scale?: (oldVal: FixedArray<number, 2>, newVal: FixedArray<number, 2>) => [FixedArray<number, 2>, FixedArray<number, 2>];
148
+ }
149
+
150
+ declare interface MoveOptions {
151
+ /**
152
+ * 移动方向
153
+ */
154
+ direction?: Dir;
155
+ }
156
+
157
+ export declare type MoveParams = DragAttr & {
158
+ translateX: number;
159
+ translateY: number;
160
+ };
161
+
162
+ export declare const ParentView: DefineComponent< {}, void, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
163
+
164
+ export declare interface ScaleConfig {
165
+ /**
166
+ * 组件可改变尺寸
167
+ */
168
+ scalable?: boolean;
169
+ /**
170
+ * 组件可移动
171
+ */
172
+ movable?: boolean;
173
+ /**
174
+ * 变成正常元素
175
+ */
176
+ normal?: boolean;
177
+ /**
178
+ * 拖动后自动靠边
179
+ */
180
+ autoStick?: boolean | AnimateDir;
181
+ /**
182
+ * 是否显示
183
+ */
184
+ visible?: boolean;
185
+ /**
186
+ * 初始移动位置 `translateX`
187
+ */
188
+ x?: number;
189
+ /**
190
+ * 初始移动位置 `translateY`
191
+ */
192
+ y?: number;
193
+ /**
194
+ * 是否拥有头部
195
+ */
196
+ header?: boolean;
197
+ /**
198
+ * 当组件`position`不为`fixed`时
199
+ * 是否相对于window定位,否则相对于父元素定位
200
+ *
201
+ * @default false
202
+ */
203
+ attachWindow?: boolean;
204
+ /**
205
+ * 移动功能的配置项
206
+ */
207
+ moveConfig?: MoveOptions;
208
+ /**
209
+ * 外壳样式
210
+ */
211
+ containerStyle?: CSSProperties;
212
+ /**
213
+ * 内容样式,初始宽高应该在这里设置
214
+ */
215
+ contentStyle?: CSSProperties;
216
+ /**
217
+ * 头部样式
218
+ */
219
+ headerStyle?: CSSProperties;
220
+ /**
221
+ * 是否显示遮罩层
222
+ */
223
+ mask?: boolean;
224
+ /**
225
+ * 遮罩层样式
226
+ */
227
+ maskStyle?: CSSProperties;
228
+ }
229
+
230
+ export declare interface ScaleExtraConfNode {
231
+ label: string;
232
+ node: VNode | Component | string;
233
+ }
234
+
235
+ export declare interface ScaleInstance {
236
+ /**
237
+ * 智能移动到屏幕边界
238
+ * @param animate - 是否有动画效果 default: true
239
+ */
240
+ autoStick: (animate: boolean) => Promise<void>;
241
+ /**
242
+ * 自动隐藏
243
+ * @param animate - 是否有动画效果 default: true
244
+ */
245
+ autoHide: (animate: boolean) => Promise<void>;
246
+ /**
247
+ * 移动到屏幕边界
248
+ * @param animate - 是否有动画效果 default: true
249
+ */
250
+ stickTo: (dir: AnimateDir, animate: boolean) => Promise<void>;
251
+ /**
252
+ * 移动到屏幕 `dir`位置并隐藏
253
+ * @param animate - 是否有动画效果 default: true
254
+ */
255
+ hideTo: (dir: AnimateDir, animate: boolean) => Promise<void>;
256
+ /**
257
+ * 显示组件
258
+ */
259
+ show: (animate: boolean, dir?: AnimateDir) => Promise<void>;
260
+ /**
261
+ * 当组件`position:fixed`或者`attachWindow:true`时坐标相对于屏幕左上角;否则相对于父元素
262
+ */
263
+ moveTo: (animate: boolean, dir: AnimateDir, hooks?: MoveHook) => Promise<void>;
264
+ /**
265
+ * 获取当前状态
266
+ */
267
+ getStatus: () => Status | undefined;
268
+ }
269
+
270
+ export declare const ScalePanel: __VLS_WithSlots_2<typeof __VLS_component_2, __VLS_Slots_2>;
271
+
272
+ export declare interface ScaleProps {
273
+ modelValue: ScaleConfig;
274
+ /**
275
+ * 按下目标元素并拖动组件,默认按下头部拖动。
276
+ */
277
+ dragTarget?: MaybeRef<HTMLElement | null | undefined>;
278
+ }
279
+
280
+ declare enum Status {
281
+ NORMAL = "NORMAL",
282
+ HIDDEN = "HIDDEN"
283
+ }
284
+
285
+ export { }
package/dist/index.js ADDED
@@ -0,0 +1,896 @@
1
+ (function(){"use strict";try{if(typeof document<"u"){var r=document.createElement("style");r.appendChild(document.createTextNode('*,:before,:after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}[top~="0"]{top:0}.hidden{display:none}.flex{display:flex}.flex-shrink{flex-shrink:1}.transform{transform:translate(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotate(var(--un-rotate-z)) skew(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z))}.resize,[resize=""]{resize:both}.px,[px=""]{padding-left:1rem;padding-right:1rem}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.comp-affix .comp-affix-inner[data-v-4c40ccd8]{transition:box-shadow .3s;border-radius:1rem}.comp-affix .comp-affix-inner.fix[data-v-4c40ccd8]{position:fixed;box-shadow:var(--el-box-shadow);background-color:var(--el-card-bg-color)}.p-t[data-v-2dbd22ac],.p-r[data-v-2dbd22ac],.p-b[data-v-2dbd22ac],.p-l[data-v-2dbd22ac],.p-lt[data-v-2dbd22ac],.p-rt[data-v-2dbd22ac],.p-lb[data-v-2dbd22ac],.p-rb[data-v-2dbd22ac]{z-index:var(--dc02cff8);position:absolute}.p-b[data-v-2dbd22ac],.p-t[data-v-2dbd22ac],.p-r[data-v-2dbd22ac],.p-l[data-v-2dbd22ac]{background-color:transparent;border-radius:4px}.p-b[data-v-2dbd22ac],.p-t[data-v-2dbd22ac]{height:4px;left:4px;right:4px}.p-r[data-v-2dbd22ac],.p-l[data-v-2dbd22ac]{width:4px;top:4px;bottom:4px}.p-lt[data-v-2dbd22ac],.p-rt[data-v-2dbd22ac],.p-lb[data-v-2dbd22ac],.p-rb[data-v-2dbd22ac]{width:0;height:0}.p-b[data-v-2dbd22ac]{bottom:0;cursor:ns-resize}.p-t[data-v-2dbd22ac]{top:0;cursor:ns-resize}.p-r[data-v-2dbd22ac]{right:0;cursor:ew-resize}.p-l[data-v-2dbd22ac]{left:0;cursor:ew-resize}.p-lt[data-v-2dbd22ac]{left:0;top:0;cursor:nwse-resize;border-top:.4rem solid transparent;border-left:.4rem solid transparent;border-right:.4rem solid transparent;border-bottom:.4rem solid transparent}.p-rt[data-v-2dbd22ac]{right:0;top:0;cursor:nesw-resize;border-top:.4rem solid transparent;border-left:.4rem solid transparent;border-right:.4rem solid transparent;border-bottom:.4rem solid transparent}.p-lb[data-v-2dbd22ac]{left:0;bottom:0;cursor:nesw-resize;border-top:.4rem solid transparent;border-left:.4rem solid transparent;border-right:.4rem solid transparent;border-bottom:.4rem solid transparent}.p-rb[data-v-2dbd22ac]{right:0;bottom:0;cursor:nwse-resize;border-top:.4rem solid transparent;border-left:.4rem solid transparent;border-right:.4rem solid transparent;border-bottom:.4rem solid transparent}.dragContainer[data-v-f5de5f52]{display:flex;flex-direction:column;transform-origin:0 0}.dragContainer>.dragHeader[data-v-f5de5f52]{flex-shrink:0;display:flex}.dragContainer>.scaleContent[data-v-f5de5f52]{flex:1;overflow:hidden;position:relative;display:flex}.dragMask[data-v-f5de5f52]{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:100}')),document.head.appendChild(r)}}catch(a){console.error("vite-plugin-css-injected-by-js",a)}})();
2
+ import { defineComponent as ce, useTemplateRef as te, shallowRef as ee, computed as $, reactive as Me, onMounted as Oe, onBeforeUnmount as Pe, createElementBlock as Q, openBlock as B, normalizeStyle as J, normalizeClass as ye, createElementVNode as He, renderSlot as xe, useCssVars as ze, createCommentVNode as re, Fragment as $e, renderList as Be, withDirectives as We, vShow as Ue, unref as Se, ref as Ee, toValue as be, watch as q, toRef as oe, createBlock as le, Teleport as je, withCtx as ke, createVNode as Ge, Transition as Ke, resolveDynamicComponent as qe } from "vue";
3
+ import { px as _, useEvent as fe, z as Je, getStyleValue as _e, isBoolean as Re, isNumber as G, toNumber as w, useFlip as Qe, merge as Ze } from "@toolmain/shared";
4
+ import { useElementBounding as ue, useIntersectionObserver as Le, useThrottleFn as et, useDebounceFn as tt } from "@vueuse/core";
5
+ import { RouterView as nt } from "vue-router";
6
+ const ae = 2, at = /* @__PURE__ */ ce({
7
+ __name: "index",
8
+ props: {
9
+ position: { default: "top" },
10
+ target: { default: "" },
11
+ offset: { default: 0 }
12
+ },
13
+ setup(e, { expose: l }) {
14
+ const c = te("affix"), r = te("affixInner"), h = ee(), d = ee(), { width: i, height: R } = ue(h), T = $(() => !!d.value), y = ee({}), S = ee({}), a = Me({
15
+ disableTeleport: !0,
16
+ target: {
17
+ isIntersecting: !1,
18
+ intersectionRatio: 0,
19
+ directions: []
20
+ },
21
+ affix: {
22
+ isIntersecting: !1,
23
+ intersectionRatio: 0,
24
+ needFloat: !1,
25
+ directions: []
26
+ }
27
+ }), {
28
+ x,
29
+ y: n,
30
+ // width: affixWidth,
31
+ height: L,
32
+ update: A
33
+ } = ue(c), m = () => {
34
+ if (T.value) {
35
+ if (a.target.isIntersecting && (!a.affix.isIntersecting || a.affix.intersectionRatio < 0.5))
36
+ return !0;
37
+ } else if (!a.affix.isIntersecting || a.affix.intersectionRatio < 0.5)
38
+ return !0;
39
+ return !1;
40
+ }, g = () => {
41
+ if (A(), a.affix.needFloat = !1, a.affix.directions.includes(
42
+ "left"
43
+ /* Left */
44
+ ) || a.affix.directions.includes(
45
+ "right"
46
+ /* Right */
47
+ ) || a.target.directions.includes(
48
+ "left"
49
+ /* Left */
50
+ ) || a.target.directions.includes(
51
+ "right"
52
+ /* Right */
53
+ ))
54
+ a.affix.needFloat = !1;
55
+ else if (m()) {
56
+ const X = n.value + L.value / 2 <= window.innerHeight / 2;
57
+ a.affix.needFloat = e.position === "top" ? X : !X;
58
+ }
59
+ a.affix.needFloat ? (y.value = {
60
+ zIndex: 100,
61
+ left: _(x.value),
62
+ [e.position === "bottom" ? "bottom" : "top"]: _(e.offset)
63
+ }, S.value = {
64
+ minWidth: _(i.value),
65
+ height: _(R.value)
66
+ }) : (y.value = {}, S.value = {});
67
+ };
68
+ function P(X, N) {
69
+ const { boundingClientRect: V, intersectionRect: W, rootBounds: Z } = X;
70
+ Z && X.isIntersecting && (N.length = 0, W.y - V.y > ae && N.push(
71
+ "top"
72
+ /* Top */
73
+ ), V.y - W.y > ae && N.push(
74
+ "bottom"
75
+ /* Bottom */
76
+ ), W.x - V.x > ae && N.push(
77
+ "left"
78
+ /* Left */
79
+ ), V.x + V.width - (W.x + W.width) > ae && N.push(
80
+ "right"
81
+ /* Right */
82
+ ));
83
+ }
84
+ const F = ([X]) => {
85
+ a.affix.isIntersecting = X.isIntersecting, P(X, a.affix.directions), a.affix.intersectionRatio = X.intersectionRatio, g();
86
+ }, H = ([X]) => {
87
+ a.target.isIntersecting = X.isIntersecting, P(X, a.target.directions), a.target.intersectionRatio = X.intersectionRatio, g();
88
+ }, s = Le(c, F, {
89
+ root: window.document.documentElement,
90
+ threshold: [0, 0.01, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 0.99, 1]
91
+ }), u = Le(d, H, {
92
+ root: window.document.documentElement,
93
+ threshold: [0, 0.01, 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 0.99, 1]
94
+ });
95
+ function I() {
96
+ h.value = r.value?.firstElementChild, e.target && (d.value = document.querySelector(e.target)), A();
97
+ }
98
+ const D = et(g, 250, !0);
99
+ return Oe(() => {
100
+ I(), window.addEventListener("resize", D);
101
+ }), Pe(() => {
102
+ window.removeEventListener("resize", D), s.stop(), u.stop();
103
+ }), l({
104
+ update: () => {
105
+ m() && g();
106
+ }
107
+ }), (X, N) => (B(), Q("div", {
108
+ class: ye(["comp-affix", { fix: a.affix.needFloat }]),
109
+ style: J(S.value),
110
+ ref: "affix"
111
+ }, [
112
+ He("div", {
113
+ ref_key: "affixInner",
114
+ ref: r,
115
+ style: J([y.value, S.value]),
116
+ class: ye(["comp-affix-inner", { fix: a.affix.needFloat }])
117
+ }, [
118
+ xe(X.$slots, "default", {}, void 0, !0)
119
+ ], 6)
120
+ ], 6));
121
+ }
122
+ }), Ce = (e, l) => {
123
+ const c = e.__vccOpts || e;
124
+ for (const [r, h] of l)
125
+ c[r] = h;
126
+ return c;
127
+ }, pt = /* @__PURE__ */ Ce(at, [["__scopeId", "data-v-4c40ccd8"]]);
128
+ function Ie() {
129
+ return {
130
+ x: 0,
131
+ y: 0,
132
+ clientX: 0,
133
+ clientY: 0,
134
+ width: 0,
135
+ height: 0
136
+ };
137
+ }
138
+ function Ae() {
139
+ return {
140
+ x: 0,
141
+ y: 0,
142
+ width: 0,
143
+ height: 0,
144
+ left: 0,
145
+ top: 0,
146
+ right: 0,
147
+ bottom: 0
148
+ };
149
+ }
150
+ const it = () => {
151
+ let e, l = Ae(), c = Ie(), r = !1, h = !1;
152
+ const d = fe(), i = {
153
+ emit: (n, ...L) => {
154
+ r || d.emit(n, ...L);
155
+ },
156
+ setTargetAttr: (n) => {
157
+ R(), T({
158
+ x: l.x,
159
+ y: l.y,
160
+ clientX: n.clientX,
161
+ clientY: n.clientY,
162
+ width: l.width,
163
+ height: l.height
164
+ });
165
+ },
166
+ onSelectStart: (n) => h ? (n.preventDefault(), !1) : !0,
167
+ onDomPointerUp: (n) => {
168
+ if (!r) {
169
+ if (!e) {
170
+ h = !1;
171
+ return;
172
+ }
173
+ h && i.emit("aftermove", { ...c }), h = !1;
174
+ }
175
+ },
176
+ onDomPointerMove: (n) => {
177
+ r || h && (i.setTargetAttr(n), i.emit("moving", { ...c }));
178
+ },
179
+ onElePointerDown: (n) => {
180
+ r || (h = !0, i.setTargetAttr(n), i.emit("beforemove", { ...c }));
181
+ },
182
+ clearEvent: () => {
183
+ document.removeEventListener("selectstart", i.onSelectStart), e?.removeEventListener("pointerdown", i.onElePointerDown), document.removeEventListener("pointerup", i.onDomPointerUp), document.removeEventListener("pointermove", i.onDomPointerMove);
184
+ },
185
+ listenEvent: () => {
186
+ e && (document.addEventListener("selectstart", i.onSelectStart), e.addEventListener("pointerdown", i.onElePointerDown), document.addEventListener("pointerup", i.onDomPointerUp), document.addEventListener("pointermove", i.onDomPointerMove));
187
+ }
188
+ };
189
+ function R() {
190
+ l = e?.getBoundingClientRect() ?? Ae();
191
+ }
192
+ function T(n) {
193
+ c = { ...n };
194
+ }
195
+ function y(n) {
196
+ i.clearEvent(), e = n, d.removeAllListeners(), T(Ie()), R(), i.listenEvent();
197
+ }
198
+ function S(n, L) {
199
+ d.on(n, L);
200
+ }
201
+ function a() {
202
+ r = !0;
203
+ }
204
+ function x() {
205
+ r = !1;
206
+ }
207
+ return {
208
+ ele: e,
209
+ rect: l,
210
+ attr: c,
211
+ updateRect: R,
212
+ setAttr: T,
213
+ setTarget: y,
214
+ on: S,
215
+ disable: a,
216
+ enable: x
217
+ };
218
+ };
219
+ function rt() {
220
+ const e = fe();
221
+ let l = !1;
222
+ const c = {
223
+ direction: "any"
224
+ }, r = it(), h = (m) => {
225
+ c.direction === "horizontal" ? (m.clientY = 0, m.y = 0) : c.direction === "vertical" && (m.clientX = 0, m.x = 0);
226
+ };
227
+ function d(m) {
228
+ l = !1, r.setTarget(m), r.on("beforemove", (g) => {
229
+ h(g), l = !1, R("beforemove", g);
230
+ }), r.on("moving", (g) => {
231
+ h(g), l = !0, R("moving", g);
232
+ }), r.on("aftermove", (g) => {
233
+ h(g), l = !1, R("aftermove", g);
234
+ });
235
+ }
236
+ function i() {
237
+ return r.ele;
238
+ }
239
+ function R(m, g) {
240
+ e.emit(m, g);
241
+ }
242
+ function T(m) {
243
+ c.direction = m;
244
+ }
245
+ function y(m, g) {
246
+ e.on(m, g);
247
+ }
248
+ function S(m, g) {
249
+ e.once(m, g);
250
+ }
251
+ function a(m, g) {
252
+ e.removeAllListeners(m), e.on(m, g);
253
+ }
254
+ function x(m) {
255
+ m && Object.assign(c, m);
256
+ }
257
+ function n() {
258
+ r.enable();
259
+ }
260
+ function L() {
261
+ r.disable();
262
+ }
263
+ function A() {
264
+ return l;
265
+ }
266
+ return {
267
+ every: a,
268
+ setTarget: d,
269
+ getTarget: i,
270
+ setDirection: T,
271
+ isMoving: A,
272
+ on: y,
273
+ once: S,
274
+ updateOption: x,
275
+ enable: n,
276
+ disable: L
277
+ };
278
+ }
279
+ const ot = ["onMousedown"], st = /* @__PURE__ */ ce({
280
+ __name: "resize",
281
+ props: {
282
+ config: {},
283
+ scale: {},
284
+ handle: {},
285
+ move: {}
286
+ },
287
+ setup(e) {
288
+ ze((r) => ({
289
+ dc02cff8: c.value
290
+ }));
291
+ const l = e, c = $(() => l.config.normal ? void 0 : Je.ABSOLUTE);
292
+ return (r, h) => r.scale ? (B(!0), Q($e, { key: 0 }, Be(r.scale.pointer, (d) => We((B(), Q("i", {
293
+ key: d,
294
+ class: ye([`p-${d}`]),
295
+ onMousedown: (i) => r.scale.onMouseDown(i, d)
296
+ }, null, 42, ot)), [
297
+ [Ue, r.config.scalable]
298
+ ])), 128)) : re("", !0);
299
+ }
300
+ }), lt = /* @__PURE__ */ Ce(st, [["__scopeId", "data-v-2dbd22ac"]]), ie = (e) => {
301
+ if (!e) return {};
302
+ const l = {};
303
+ for (const [c, r] of Object.entries(e))
304
+ l[c] = _e(c, r);
305
+ return l;
306
+ };
307
+ function Xe(e) {
308
+ function l() {
309
+ return {
310
+ scaleX: e.scale[0],
311
+ scaleY: e.scale[1]
312
+ };
313
+ }
314
+ function c() {
315
+ return {
316
+ translateX: e.translateX,
317
+ translateY: e.translateY
318
+ };
319
+ }
320
+ function r(a, x, n) {
321
+ e.translateX = n ? e.translateX + a : a, e.translateY = n ? e.translateY + x : x;
322
+ }
323
+ function h(a, x) {
324
+ e.prevClientX = a, e.prevClientY = x;
325
+ }
326
+ function d(a, x) {
327
+ e.prevTranslateX = a, e.prevTranslateY = x;
328
+ }
329
+ function i() {
330
+ return {
331
+ clientX: e.prevClientX,
332
+ clientY: e.prevClientY
333
+ };
334
+ }
335
+ function R() {
336
+ return {
337
+ translateX: e.prevTranslateX,
338
+ translateY: e.prevTranslateY
339
+ };
340
+ }
341
+ function T(a, x) {
342
+ e.scale = [a, x];
343
+ }
344
+ function y() {
345
+ e.scale = [1, 1], e.prevClientX = 0, e.prevTranslateX = 0, e.prevClientY = 0, e.prevTranslateY = 0, e.translateX = 0, e.translateY = 0;
346
+ }
347
+ function S(a) {
348
+ Object.assign(e, a);
349
+ }
350
+ return {
351
+ setData: S,
352
+ getTranslate: c,
353
+ setTranslate: r,
354
+ getScale: l,
355
+ setScale: T,
356
+ setNormal: y,
357
+ setPrevClientPos: h,
358
+ getPrevClientPos: i,
359
+ getPrevTranslate: R,
360
+ setPrevTranslate: d
361
+ };
362
+ }
363
+ function Ye(e) {
364
+ function l(h, d) {
365
+ e.value && (e.value[h] = d);
366
+ }
367
+ function c(h) {
368
+ for (const [d, i] of Object.entries(h))
369
+ l(d, i);
370
+ }
371
+ function r(h) {
372
+ if (e.value)
373
+ return e.value[h];
374
+ }
375
+ return {
376
+ get: r,
377
+ set: l,
378
+ sets: c
379
+ };
380
+ }
381
+ function ut(e, l, c, r, h, d, i) {
382
+ const { setNormal: R, setTranslate: T, setPrevTranslate: y } = Xe(r), { get: S, set: a } = Ye(h), x = Ee(be(S("position"))), n = tt(
383
+ async () => {
384
+ e.value.autoStick && (typeof e.value.autoStick == "boolean" ? await c.value?.autoStick(!0) : await c.value?.stickTo(e.value.autoStick, !0));
385
+ },
386
+ 200,
387
+ { maxWait: 1e3 }
388
+ );
389
+ function L() {
390
+ l.value && l.value.setTarget(be(d) ?? i.value ?? null);
391
+ }
392
+ function A() {
393
+ c.value?.setStatus(Ne.NORMAL), g(e.value.movable), F(e.value.moveConfig), H(e.value.x, e.value.y), P(e.value.normal), Re(e.value.visible) ? m(e.value.visible, !1) : c.value?.hideTo("self", !1);
394
+ }
395
+ function m(s, u) {
396
+ if (!Re(s)) return;
397
+ const I = G(e.value.x) || G(e.value.y);
398
+ s ? c.value?.show(u, I ? { x: e.value.x, y: e.value.y } : "self") : c.value?.hideTo(I ? { x: e.value.x, y: e.value.y } : "self", u);
399
+ }
400
+ function g(s) {
401
+ s ? l.value?.enable() : l.value?.disable();
402
+ }
403
+ function P(s) {
404
+ s ? (l.value?.setTarget(), x.value = S("position"), e.value.movable = !1, e.value.scalable = !1, R(), a("position", "static")) : (L(), a("position", x.value));
405
+ }
406
+ function F(s) {
407
+ s && l.value?.updateOption(s);
408
+ }
409
+ function H(s, u) {
410
+ if (!l.value?.isMoving() && (G(e.value.x) || G(e.value.y))) {
411
+ const I = w(s), D = w(u);
412
+ T(I, D), y(I, D);
413
+ }
414
+ }
415
+ return q(() => e.value.movable, g), q(() => e.value.normal, P), q(() => e.value.moveConfig, F, { deep: !0 }), q(
416
+ () => e.value.visible,
417
+ (s) => m(s, !0)
418
+ ), q([() => e.value.x, () => e.value.y], ([s, u]) => H(s, u)), q(d, () => {
419
+ e.value.normal || L();
420
+ }), {
421
+ autoStick: n,
422
+ onInit: A,
423
+ onMovableChange: g,
424
+ onNormalChange: P
425
+ };
426
+ }
427
+ function De(e, l) {
428
+ const c = Se(e);
429
+ return c ? window.getComputedStyle(c).getPropertyValue(l) : _e(l, void 0);
430
+ }
431
+ var Ne = /* @__PURE__ */ ((e) => (e.NORMAL = "NORMAL", e.HIDDEN = "HIDDEN", e))(Ne || {}), se = /* @__PURE__ */ ((e) => (e.AFTER_SHOW = "after_show", e.AFTER_HIDE = "after_hide", e.AFTER_STICK = "after_stick", e))(se || {});
432
+ const ct = (e) => {
433
+ const { getTranslate: l, setTranslate: c, setScale: r, setPrevTranslate: h, getScale: d } = Xe(e.dragOffset);
434
+ let i = e.parent;
435
+ const R = Qe(), T = fe(), y = Ee(
436
+ "NORMAL"
437
+ /* NORMAL */
438
+ ), S = {
439
+ stick: 160
440
+ }, a = {
441
+ transX: { old: 0, final: 0 },
442
+ transY: { old: 0, final: 0 }
443
+ }, x = [], n = [];
444
+ function L() {
445
+ const { translateX: t, translateY: f } = l();
446
+ a.transX.old = t, a.transX.final = t, a.transY.old = f, a.transY.final = f;
447
+ }
448
+ const { x: A, y: m, width: g, left: P } = ue(e.targetEle);
449
+ function F(t, f) {
450
+ const o = {
451
+ width: window.innerWidth,
452
+ height: window.innerHeight
453
+ };
454
+ if (!e.targetEle.value || t.position === "fixed")
455
+ return o;
456
+ {
457
+ if (f) return o;
458
+ const C = ne();
459
+ return o.width = C.offsetWidth, o.height = C.offsetHeight, o;
460
+ }
461
+ }
462
+ function H(t, f, o, v, C) {
463
+ return () => {
464
+ r(C[0], C[1]), c(t, f), h(t, f);
465
+ };
466
+ }
467
+ function s(t, f) {
468
+ const o = { x: 0, y: 0, w: 0, h: 0 };
469
+ if (!e.targetEle.value) return o;
470
+ const v = Ze(
471
+ {
472
+ x: (U, j, Fe, Ve) => j,
473
+ y: (U, j, Fe, Ve) => j,
474
+ scale: (U, j) => [U, j]
475
+ },
476
+ f
477
+ ), C = !!e.config.value.attachWindow, Y = window.getComputedStyle(e.targetEle.value), z = F(Y, C);
478
+ let M = 0, O = 0;
479
+ const p = w(Y.width), b = w(Y.height);
480
+ o.w = p, o.h = b;
481
+ const { translateX: E, translateY: k } = l();
482
+ if (Y.position === "fixed" ? (M = w(Y.left), O = w(Y.top)) : C ? (M = w(A.value - E), O = w(m.value - k)) : (M = w(Y.left), O = w(Y.top)), typeof t == "string")
483
+ switch (t) {
484
+ case "left": {
485
+ o.x = v.x(E, -w(M), p, b), o.y = v.y(k, k, p, b);
486
+ break;
487
+ }
488
+ case "top": {
489
+ o.x = v.x(E, E, p, b), o.y = v.y(k, -w(O), p, b);
490
+ break;
491
+ }
492
+ case "right": {
493
+ o.x = v.x(E, -w(M) + z.width - p, p, b), o.y = v.y(k, k, p, b);
494
+ break;
495
+ }
496
+ case "bottom": {
497
+ o.x = v.x(E, E, p, b), o.y = v.y(k, -w(O) + z.height - b, p, b);
498
+ break;
499
+ }
500
+ case "self": {
501
+ o.x = v.x(E, E, p, b), o.y = v.y(k, k, p, b);
502
+ break;
503
+ }
504
+ case "center":
505
+ default:
506
+ o.x = v.x(E, -w(M) + z.width / 2 - p / 2, p, b), o.y = v.y(k, -w(O) + z.height / 2 - b / 2, p, b);
507
+ }
508
+ else
509
+ G(t.x) ? o.x = v.x(E, -w(M) + (t.x ?? E), p, b) : o.x = v.x(E, E, p, b), G(t.y) ? o.y = v.y(k, -w(O) + (t.y ?? k), p, b) : o.y = v.y(k, k, p, b);
510
+ return o;
511
+ }
512
+ async function u(t, f, o, v) {
513
+ await new Promise((C) => {
514
+ if (o(), !f) {
515
+ C();
516
+ return;
517
+ }
518
+ R.animate(
519
+ t,
520
+ v,
521
+ { duration: S.stick, iterations: 1 },
522
+ {
523
+ finish(Y, z) {
524
+ C();
525
+ }
526
+ }
527
+ );
528
+ });
529
+ }
530
+ function I() {
531
+ return w(P.value) + w(g.value) / 2 >= window.innerWidth / 2 ? "right" : "left";
532
+ }
533
+ async function D(t = !0, f, o) {
534
+ if (!e.targetEle.value) return;
535
+ const { x: v, y: C, w: Y, h: z } = s(f, o), { scaleX: M, scaleY: O } = d(), p = {
536
+ old: [M, O],
537
+ final: [M, O]
538
+ };
539
+ if (o?.scale) {
540
+ const j = o.scale(p.old, p.final);
541
+ p.old = j[0], p.final = j[1];
542
+ }
543
+ const b = H(v, C, Y, z, p.final), { translateX: E, translateY: k } = l(), U = [
544
+ { scale: p.old, translate: [_(E), _(k)] },
545
+ { scale: p.final, translate: [_(v), _(C)] }
546
+ ];
547
+ await u(e.targetEle.value, t, b, U);
548
+ }
549
+ async function X(t = !0, f) {
550
+ if (y.value !== "HIDDEN" || !e.targetEle.value) return;
551
+ const o = [0, 0], v = [1, 1], C = [
552
+ { scale: v, translate: [_(a.transX.final), _(a.transY.final)] },
553
+ { scale: v, translate: [_(a.transX.old), _(a.transY.old)] }
554
+ ], Y = () => {
555
+ r(v[0], v[1]), c(a.transX.old, a.transY.old), h(a.transX.old, a.transY.old);
556
+ };
557
+ f ? await D(t, f, {
558
+ scale(z, M) {
559
+ return f === "self" || f === "center" ? [o, v] : [v, v];
560
+ }
561
+ }) : await u(e.targetEle.value, t, Y, C), y.value = "NORMAL", T.emit(
562
+ "after_show"
563
+ /* AFTER_SHOW */
564
+ );
565
+ }
566
+ async function N(t, f = !0) {
567
+ if (y.value !== "NORMAL" || !e.targetEle.value) return;
568
+ for await (const b of x)
569
+ await b();
570
+ L();
571
+ const { x: o, y: v, w: C, h: Y } = s(t, {
572
+ x: (b, E, k, U) => {
573
+ switch (t) {
574
+ case "left":
575
+ return E -= w(k);
576
+ case "right":
577
+ return E += w(k);
578
+ }
579
+ return E;
580
+ },
581
+ y: (b, E, k, U) => {
582
+ switch (t) {
583
+ case "top":
584
+ return E -= w(U);
585
+ case "bottom":
586
+ return E += w(U);
587
+ }
588
+ return E;
589
+ }
590
+ }), { translateX: z, translateY: M } = l();
591
+ let O = [
592
+ { scale: [1, 1], translate: [_(z), _(M)] },
593
+ { scale: [1, 1], translate: [_(o), _(v)] }
594
+ ];
595
+ (t === "self" || t === "center") && (O = [
596
+ { scale: [1, 1], translate: [_(o), _(v)] },
597
+ { scale: [0, 0], translate: [_(o), _(v)] }
598
+ ]), a.transX.final = o, a.transY.final = v;
599
+ const p = H(o, v, C, Y, [0, 0]);
600
+ await u(e.targetEle.value, f, p, O), y.value = "HIDDEN", T.emit(
601
+ "after_hide"
602
+ /* AFTER_HIDE */
603
+ );
604
+ }
605
+ async function V(t, f = !0) {
606
+ if (y.value === "NORMAL" && e.targetEle.value) {
607
+ for await (const o of n)
608
+ await o();
609
+ await D(f, t), T.emit(
610
+ "after_stick"
611
+ /* AFTER_STICK */
612
+ );
613
+ }
614
+ }
615
+ async function W(t = !0) {
616
+ y.value === "NORMAL" && await N(I(), t);
617
+ }
618
+ async function Z(t = !0) {
619
+ y.value === "NORMAL" && await V(I(), t);
620
+ }
621
+ function ve(t) {
622
+ y.value = t;
623
+ }
624
+ function K() {
625
+ return y.value;
626
+ }
627
+ function de() {
628
+ return e.targetEle.value;
629
+ }
630
+ function he(t, f) {
631
+ T.on(t, f);
632
+ }
633
+ function ge(t) {
634
+ x.push(t);
635
+ }
636
+ function me(t) {
637
+ n.push(t);
638
+ }
639
+ function pe(t) {
640
+ t && (i = t);
641
+ }
642
+ function ne() {
643
+ return i ?? e.targetEle.value?.parentElement ?? document.body;
644
+ }
645
+ function we() {
646
+ T.removeAllListeners(), x.length = 0, n.length = 0;
647
+ }
648
+ return {
649
+ getTarget: de,
650
+ setStatus: ve,
651
+ getStatus: K,
652
+ show: X,
653
+ autoHide: W,
654
+ autoStick: Z,
655
+ stickTo: V,
656
+ hideTo: N,
657
+ moveTo: D,
658
+ dispose: we,
659
+ registerBeforeHideHook: ge,
660
+ registerBeforeStickHook: me,
661
+ on: he,
662
+ setTargetParent: pe,
663
+ getTargetParent: ne
664
+ };
665
+ };
666
+ var Te = /* @__PURE__ */ ((e) => (e.SCALING = "scaling", e.AFTER_SCALE = "after_scale", e))(Te || {});
667
+ const ft = (e) => {
668
+ const l = oe(e.config.value, "containerStyle"), { set: c, sets: r } = Ye(l), h = fe(), d = ["t", "r", "b", "l", "lt", "rt", "lb", "rb"];
669
+ let i = "";
670
+ const { x: R, y: T, width: y, height: S, update: a } = ue(e.targetEle), x = {
671
+ t: (s, u) => {
672
+ s.clientY >= n.y + n.height || r({ top: u.t, height: u.h });
673
+ },
674
+ r: (s, u) => {
675
+ c("width", u.w);
676
+ },
677
+ b: (s, u) => {
678
+ c("height", u.h);
679
+ },
680
+ l: (s, u) => {
681
+ s.clientX >= n.x + n.width || r({ left: u.l, width: u.w });
682
+ },
683
+ lt: (s, u) => {
684
+ s.clientX >= n.x + n.width || s.clientY >= n.y + n.height || r({ left: u.l, top: u.t, width: u.w, height: u.h });
685
+ },
686
+ rt: (s, u) => {
687
+ s.clientY >= n.y + n.height || r({ top: u.t, width: u.w, height: u.h });
688
+ },
689
+ lb: (s, u) => {
690
+ s.clientX >= n.x + n.width || r({ left: u.l, width: u.w, height: u.h });
691
+ },
692
+ rb: (s, u) => {
693
+ r({ width: u.w, height: u.h });
694
+ }
695
+ }, n = { x: 0, y: 0, clientX: 0, clientY: 0, left: 0, top: 0, width: 0, height: 0 };
696
+ function L(s) {
697
+ s.preventDefault();
698
+ }
699
+ function A(s) {
700
+ const u = n.top + s.clientY - n.clientY, I = n.left + s.clientX - n.clientX, D = i.startsWith("r") ? s.clientX - n.x : n.width + n.clientX - s.clientX, X = i.endsWith("t") ? n.height + n.clientY - s.clientY : s.clientY - n.y;
701
+ x[i](s, {
702
+ l: I,
703
+ t: u,
704
+ w: D,
705
+ h: X
706
+ }), h.emit(
707
+ "scaling"
708
+ /* SCALING */
709
+ );
710
+ }
711
+ function m() {
712
+ document.removeEventListener("mouseup", m), document.removeEventListener("mousemove", A), document.removeEventListener("selectstart", L), h.emit(
713
+ "after_scale"
714
+ /* AFTER_SCALE */
715
+ );
716
+ }
717
+ function g(s, u) {
718
+ document.addEventListener("selectstart", L), i = u, s.stopPropagation(), s.preventDefault(), a(), n.x = R.value, n.y = T.value, n.clientX = s.clientX, n.clientY = s.clientY, n.left = w(e.config.value.containerStyle?.left), n.top = w(e.config.value.containerStyle?.top) || w(e.targetEle.value?.offsetTop), n.width = y.value, n.height = S.value, document.addEventListener("mousemove", A), document.addEventListener("mouseup", m);
719
+ }
720
+ function P(s, u) {
721
+ h.on(s, u);
722
+ }
723
+ function F() {
724
+ h.removeAllListeners();
725
+ }
726
+ function H() {
727
+ return e.targetEle.value;
728
+ }
729
+ return {
730
+ pointer: d,
731
+ getTarget: H,
732
+ onMouseDown: g,
733
+ on: P,
734
+ dispose: F
735
+ };
736
+ }, vt = /* @__PURE__ */ ce({
737
+ __name: "index",
738
+ props: {
739
+ modelValue: {},
740
+ dragTarget: {}
741
+ },
742
+ emits: ["beforeMove", "moving", "afterMove", "scaling", "afterScale", "maskClick", "update:modelValue"],
743
+ setup(e, { expose: l, emit: c }) {
744
+ const r = c, h = e, d = Ee(), i = $({
745
+ get: () => h.modelValue,
746
+ set: (t) => r("update:modelValue", t)
747
+ }), R = te("header"), T = te("scales"), y = te("drag"), S = ee(), a = oe(i.value, "containerStyle"), x = oe(i.value, "contentStyle"), n = oe(i.value, "headerStyle"), { get: L } = Ye(a), A = Me({
748
+ prevClientX: 0,
749
+ prevClientY: 0,
750
+ prevTranslateX: 0,
751
+ prevTranslateY: 0,
752
+ translateX: 0,
753
+ translateY: 0,
754
+ scale: [0, 0]
755
+ }), { getScale: m, getTranslate: g, setTranslate: P, setPrevClientPos: F, getPrevClientPos: H, setPrevTranslate: s, getPrevTranslate: u } = Xe(A), I = ft({
756
+ config: i,
757
+ targetEle: y
758
+ }), D = $(() => be(h.dragTarget)), X = $(() => !!i.value.header), N = $(() => ie(x.value)), V = $(() => ie(n.value)), W = $(() => ie(a.value)), Z = $(() => {
759
+ const { scaleX: t, scaleY: f } = m(), { translateX: o, translateY: v } = g(), C = L("width") ?? De(y, "width"), Y = L("height") ?? De(y, "height");
760
+ return {
761
+ transform: `scale(${t},${f}) translate(${_(o)},${_(v)})`,
762
+ zIndex: i.value.normal ? void 0 : _e("zIndex", L("zIndex")),
763
+ // 计算其transform中心点,用于优化动画效果。元素移动时,其left和top并没有发生变化
764
+ transformOrigin: `${_(parseFloat((o + w(C) / 2).toFixed(2)))}
765
+ ${_(parseFloat((v + w(Y) / 2).toFixed(2)))}`
766
+ };
767
+ }), ve = $(() => ie(i.value.maskStyle)), { autoStick: K, onInit: de, onMovableChange: he, onNormalChange: ge } = ut(
768
+ i,
769
+ S,
770
+ d,
771
+ A,
772
+ a,
773
+ D,
774
+ R
775
+ );
776
+ function me() {
777
+ S.value = rt(), S.value.every("beforemove", (t) => {
778
+ F(t.clientX, t.clientY), r("beforeMove", Object.assign({}, t, g()));
779
+ }), S.value.every("moving", (t) => {
780
+ const { clientX: f, clientY: o } = H(), { translateX: v, translateY: C } = u();
781
+ P(v + t.clientX - f, C + t.clientY - o);
782
+ const Y = g();
783
+ (G(i.value.x) || G(i.value.y)) && (i.value.x = Y.translateX, i.value.y = Y.translateY), r("moving", { ...t, ...Y });
784
+ }), S.value.every("aftermove", async (t) => {
785
+ const { translateX: f, translateY: o } = g();
786
+ s(f, o), await K(), r("afterMove", { ...t, ...g() });
787
+ });
788
+ }
789
+ function pe() {
790
+ I.on(Te.AFTER_SCALE, async () => {
791
+ await K(), T.value && r("afterScale", T.value);
792
+ }), I.on(Te.SCALING, async () => {
793
+ T.value && r("scaling", T.value);
794
+ });
795
+ }
796
+ function ne() {
797
+ d.value = ct({
798
+ config: i,
799
+ targetEle: y,
800
+ dragOffset: A
801
+ }), d.value.on(se.AFTER_HIDE, () => {
802
+ i.value.visible = !1;
803
+ }), d.value.on(se.AFTER_SHOW, () => {
804
+ i.value.visible = !0;
805
+ }), d.value.on(se.AFTER_STICK, () => {
806
+ const { translateX: t, translateY: f } = g();
807
+ i.value.x = t, i.value.y = f;
808
+ });
809
+ }
810
+ async function we() {
811
+ pe(), me(), ne(), he(i.value.movable), ge(i.value.normal), de(), window.addEventListener("resize", K);
812
+ }
813
+ return Oe(we), Pe(() => {
814
+ window.removeEventListener("resize", K), I.dispose(), d.value?.dispose();
815
+ }), l({
816
+ async autoStick(t) {
817
+ return d.value?.autoStick(t);
818
+ },
819
+ async stickTo(t, f) {
820
+ return d.value?.stickTo(t, f);
821
+ },
822
+ async hideTo(t, f) {
823
+ return d.value?.hideTo(t, f);
824
+ },
825
+ async autoHide(t) {
826
+ return d.value?.autoHide(t);
827
+ },
828
+ async show(t, f) {
829
+ return d.value?.show(t, f);
830
+ },
831
+ async moveTo(t, f, o) {
832
+ return d.value?.moveTo(t, f, o);
833
+ },
834
+ getStatus: function() {
835
+ return d.value?.getStatus();
836
+ }
837
+ }), (t, f) => (B(), Q("div", {
838
+ ref: "drag",
839
+ class: "dragContainer",
840
+ style: J([W.value, Z.value])
841
+ }, [
842
+ X.value ? (B(), Q("div", {
843
+ key: 0,
844
+ ref: "header",
845
+ class: "dragHeader",
846
+ style: J(V.value)
847
+ }, [
848
+ xe(t.$slots, "header", {}, void 0, !0)
849
+ ], 4)) : re("", !0),
850
+ i.value.scalable ? (B(), le(lt, {
851
+ key: 1,
852
+ config: i.value,
853
+ scale: Se(I),
854
+ move: S.value
855
+ }, null, 8, ["config", "scale", "move"])) : re("", !0),
856
+ He("div", {
857
+ ref: "scales",
858
+ class: "scaleContent",
859
+ style: J(N.value)
860
+ }, [
861
+ xe(t.$slots, "default", {}, void 0, !0)
862
+ ], 4),
863
+ (B(), le(je, {
864
+ to: "body",
865
+ disabled: !i.value.mask
866
+ }, [
867
+ i.value.mask ? (B(), Q("div", {
868
+ key: 0,
869
+ class: "dragMask",
870
+ style: J(ve.value),
871
+ onClick: f[0] || (f[0] = (o) => r("maskClick"))
872
+ }, null, 4)) : re("", !0)
873
+ ], 8, ["disabled"]))
874
+ ], 4));
875
+ }
876
+ }), wt = /* @__PURE__ */ Ce(vt, [["__scopeId", "data-v-f5de5f52"]]), yt = /* @__PURE__ */ ce({
877
+ __name: "index",
878
+ setup(e) {
879
+ return (l, c) => (B(), le(Se(nt), null, {
880
+ default: ke(({ Component: r }) => [
881
+ Ge(Ke, { name: "slide" }, {
882
+ default: ke(() => [
883
+ (B(), le(qe(r)))
884
+ ]),
885
+ _: 2
886
+ }, 1024)
887
+ ]),
888
+ _: 1
889
+ }));
890
+ }
891
+ });
892
+ export {
893
+ pt as Affix,
894
+ yt as ParentView,
895
+ wt as ScalePanel
896
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@toolmain/components",
3
- "version": "1.2.1",
3
+ "version": "1.2.2",
4
4
  "description": "Convient components base on vue3",
5
5
  "license": "MIT",
6
6
  "type": "module",
@@ -33,12 +33,12 @@
33
33
  "unocss": "^66.4.2",
34
34
  "vue": "^3.5.18",
35
35
  "vue-router": "^4.5.1",
36
- "@toolmain/libs": "^1.1.0"
36
+ "@toolmain/libs": "^1.1.1"
37
37
  },
38
38
  "dependencies": {
39
39
  "dexie": "^4.2.0",
40
40
  "three-mesh-bvh": "^0.9.1",
41
- "@toolmain/shared": "^1.2.1"
41
+ "@toolmain/shared": "^1.2.2"
42
42
  },
43
43
  "devDependencies": {
44
44
  "@types/three": "^0.179.0",
@@ -49,7 +49,7 @@
49
49
  "unocss": "^66.4.2",
50
50
  "vue": "^3.5.18",
51
51
  "vue-router": "^4.5.1",
52
- "@toolmain/libs": "^1.1.0"
52
+ "@toolmain/libs": "^1.1.1"
53
53
  },
54
54
  "scripts": {
55
55
  "build": "vue-tsc -p tsconfig.json --declaration --emitDeclarationOnly && vite build && api-extractor run"