@maas/vue-equipment 1.0.0-beta.75 → 1.0.0-beta.76

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.
Files changed (7) hide show
  1. package/dist/nuxt/module.json +1 -1
  2. package/dist/plugins/MagicEmitter/src/composables/useMagicEmitter.d.ts +28 -10
  3. package/dist/plugins/MagicTray/index.d.ts +1 -1
  4. package/dist/plugins/MagicTray/src/composables/private/useTrayDrag.mjs +74 -14
  5. package/dist/plugins/MagicTray/src/types/index.d.ts +4 -0
  6. package/dist/plugins/MagicTray/src/utils/defaultOptions.mjs +2 -1
  7. package/package.json +1 -1
package/dist/nuxt/module.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@maas/vue-equipment/nuxt",
3
3
  "configKey": "vueEquipment",
4
- "version": "1.0.0-beta.74",
4
+ "version": "1.0.0-beta.75",
5
5
  "builder": {
6
6
  "@nuxt/module-builder": "1.0.2",
7
7
  "unbuild": "unknown"
package/dist/plugins/MagicEmitter/src/composables/useMagicEmitter.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  export declare function useMagicEmitter(): {
2
2
  on: {
3
- <Key extends "progress" | "acceptAll" | "acceptSelected" | "rejectAll" | "magnet" | "willSnapTo" | "collision" | keyof import("../../../MagicPlayer/src/types/index.js").PlayerEvents | keyof import("../../../MagicDraggable/src/types/index.js").DraggableEvents | keyof import("../../../MagicAccordion/src/types/index.js").AccordionEvents>(type: Key, handler: import("mitt").Handler<({
3
+ <Key extends "progress" | "staticClick" | "magnet" | "willSnapTo" | "collision" | keyof import("../../../MagicPlayer/src/types/index.js").PlayerEvents | keyof import("../../../MagicDraggable/src/types/index.js").DraggableEvents | "acceptAll" | "rejectAll" | "acceptSelected" | keyof import("../../../MagicAccordion/src/types/index.js").AccordionEvents>(type: Key, handler: import("mitt").Handler<({
4
4
  beforeEnter: string | {
5
5
  id: string;
6
6
  viewId: string;
@@ -323,13 +323,16 @@ export declare function useMagicEmitter(): {
323
323
  afterDrag: {
324
324
  id: string;
325
325
  } & import("../../../MagicTray/index.js").TraySidePayload;
326
+ staticClick: {
327
+ id: string;
328
+ } & import("../../../MagicTray/index.js").TraySidePayload;
326
329
  progress: {
327
330
  id: string;
328
331
  } & import("../../../MagicTray/index.js").TraySidePayload;
329
332
  magnet: {
330
333
  id: string;
331
334
  } & import("../../../MagicTray/index.js").TraySidePayload;
332
- willSnapTo: import("../../../MagicTray/src/types/index.js").TrayWillSnapToPayload;
335
+ willSnapTo: import("../../../MagicTray/index.js").TrayWillSnapToPayload;
333
336
  } & Omit<object, keyof import("../../../MagicTray/src/types/index.js").TrayEvents>, keyof import("../../../MagicToast/src/types/index.js").ToastEvents>, "collision">, keyof import("../../../MagicPlayer/src/types/index.js").PlayerEvents>, keyof import("../../../MagicMenu/src/types/index.js").MenuEvents>, keyof import("../../../MagicModal/src/types/index.js").ModalEvents>, keyof import("../../../MagicDrawer/src/types/index.js").DrawerEvents>, keyof import("../../../MagicDraggable/src/types/index.js").DraggableEvents>, keyof import("../../../MagicCookie/src/types/index.js").CookieEvents>, keyof import("../../../MagicAccordion/src/types/index.js").AccordionEvents>)[Key]>): void;
334
337
  (type: "*", handler: import("mitt").WildcardHandler<{
335
338
  beforeEnter: string | {
@@ -654,17 +657,20 @@ export declare function useMagicEmitter(): {
654
657
  afterDrag: {
655
658
  id: string;
656
659
  } & import("../../../MagicTray/index.js").TraySidePayload;
660
+ staticClick: {
661
+ id: string;
662
+ } & import("../../../MagicTray/index.js").TraySidePayload;
657
663
  progress: {
658
664
  id: string;
659
665
  } & import("../../../MagicTray/index.js").TraySidePayload;
660
666
  magnet: {
661
667
  id: string;
662
668
  } & import("../../../MagicTray/index.js").TraySidePayload;
663
- willSnapTo: import("../../../MagicTray/src/types/index.js").TrayWillSnapToPayload;
669
+ willSnapTo: import("../../../MagicTray/index.js").TrayWillSnapToPayload;
664
670
  } & Omit<object, keyof import("../../../MagicTray/src/types/index.js").TrayEvents>, keyof import("../../../MagicToast/src/types/index.js").ToastEvents>, "collision">, keyof import("../../../MagicPlayer/src/types/index.js").PlayerEvents>, keyof import("../../../MagicMenu/src/types/index.js").MenuEvents>, keyof import("../../../MagicModal/src/types/index.js").ModalEvents>, keyof import("../../../MagicDrawer/src/types/index.js").DrawerEvents>, keyof import("../../../MagicDraggable/src/types/index.js").DraggableEvents>, keyof import("../../../MagicCookie/src/types/index.js").CookieEvents>, keyof import("../../../MagicAccordion/src/types/index.js").AccordionEvents>>): void;
665
671
  };
666
672
  off: {
667
- <Key extends "progress" | "acceptAll" | "acceptSelected" | "rejectAll" | "magnet" | "willSnapTo" | "collision" | keyof import("../../../MagicPlayer/src/types/index.js").PlayerEvents | keyof import("../../../MagicDraggable/src/types/index.js").DraggableEvents | keyof import("../../../MagicAccordion/src/types/index.js").AccordionEvents>(type: Key, handler?: import("mitt").Handler<({
673
+ <Key extends "progress" | "staticClick" | "magnet" | "willSnapTo" | "collision" | keyof import("../../../MagicPlayer/src/types/index.js").PlayerEvents | keyof import("../../../MagicDraggable/src/types/index.js").DraggableEvents | "acceptAll" | "rejectAll" | "acceptSelected" | keyof import("../../../MagicAccordion/src/types/index.js").AccordionEvents>(type: Key, handler?: import("mitt").Handler<({
668
674
  beforeEnter: string | {
669
675
  id: string;
670
676
  viewId: string;
@@ -987,13 +993,16 @@ export declare function useMagicEmitter(): {
987
993
  afterDrag: {
988
994
  id: string;
989
995
  } & import("../../../MagicTray/index.js").TraySidePayload;
996
+ staticClick: {
997
+ id: string;
998
+ } & import("../../../MagicTray/index.js").TraySidePayload;
990
999
  progress: {
991
1000
  id: string;
992
1001
  } & import("../../../MagicTray/index.js").TraySidePayload;
993
1002
  magnet: {
994
1003
  id: string;
995
1004
  } & import("../../../MagicTray/index.js").TraySidePayload;
996
- willSnapTo: import("../../../MagicTray/src/types/index.js").TrayWillSnapToPayload;
1005
+ willSnapTo: import("../../../MagicTray/index.js").TrayWillSnapToPayload;
997
1006
  } & Omit<object, keyof import("../../../MagicTray/src/types/index.js").TrayEvents>, keyof import("../../../MagicToast/src/types/index.js").ToastEvents>, "collision">, keyof import("../../../MagicPlayer/src/types/index.js").PlayerEvents>, keyof import("../../../MagicMenu/src/types/index.js").MenuEvents>, keyof import("../../../MagicModal/src/types/index.js").ModalEvents>, keyof import("../../../MagicDrawer/src/types/index.js").DrawerEvents>, keyof import("../../../MagicDraggable/src/types/index.js").DraggableEvents>, keyof import("../../../MagicCookie/src/types/index.js").CookieEvents>, keyof import("../../../MagicAccordion/src/types/index.js").AccordionEvents>)[Key]> | undefined): void;
998
1007
  (type: "*", handler: import("mitt").WildcardHandler<{
999
1008
  beforeEnter: string | {
@@ -1318,17 +1327,20 @@ export declare function useMagicEmitter(): {
1318
1327
  afterDrag: {
1319
1328
  id: string;
1320
1329
  } & import("../../../MagicTray/index.js").TraySidePayload;
1330
+ staticClick: {
1331
+ id: string;
1332
+ } & import("../../../MagicTray/index.js").TraySidePayload;
1321
1333
  progress: {
1322
1334
  id: string;
1323
1335
  } & import("../../../MagicTray/index.js").TraySidePayload;
1324
1336
  magnet: {
1325
1337
  id: string;
1326
1338
  } & import("../../../MagicTray/index.js").TraySidePayload;
1327
- willSnapTo: import("../../../MagicTray/src/types/index.js").TrayWillSnapToPayload;
1339
+ willSnapTo: import("../../../MagicTray/index.js").TrayWillSnapToPayload;
1328
1340
  } & Omit<object, keyof import("../../../MagicTray/src/types/index.js").TrayEvents>, keyof import("../../../MagicToast/src/types/index.js").ToastEvents>, "collision">, keyof import("../../../MagicPlayer/src/types/index.js").PlayerEvents>, keyof import("../../../MagicMenu/src/types/index.js").MenuEvents>, keyof import("../../../MagicModal/src/types/index.js").ModalEvents>, keyof import("../../../MagicDrawer/src/types/index.js").DrawerEvents>, keyof import("../../../MagicDraggable/src/types/index.js").DraggableEvents>, keyof import("../../../MagicCookie/src/types/index.js").CookieEvents>, keyof import("../../../MagicAccordion/src/types/index.js").AccordionEvents>>): void;
1329
1341
  };
1330
1342
  emit: {
1331
- <Key extends "progress" | "acceptAll" | "acceptSelected" | "rejectAll" | "magnet" | "willSnapTo" | "collision" | keyof import("../../../MagicPlayer/src/types/index.js").PlayerEvents | keyof import("../../../MagicDraggable/src/types/index.js").DraggableEvents | keyof import("../../../MagicAccordion/src/types/index.js").AccordionEvents>(type: Key, event: ({
1343
+ <Key extends "progress" | "staticClick" | "magnet" | "willSnapTo" | "collision" | keyof import("../../../MagicPlayer/src/types/index.js").PlayerEvents | keyof import("../../../MagicDraggable/src/types/index.js").DraggableEvents | "acceptAll" | "rejectAll" | "acceptSelected" | keyof import("../../../MagicAccordion/src/types/index.js").AccordionEvents>(type: Key, event: ({
1332
1344
  beforeEnter: string | {
1333
1345
  id: string;
1334
1346
  viewId: string;
@@ -1651,15 +1663,18 @@ export declare function useMagicEmitter(): {
1651
1663
  afterDrag: {
1652
1664
  id: string;
1653
1665
  } & import("../../../MagicTray/index.js").TraySidePayload;
1666
+ staticClick: {
1667
+ id: string;
1668
+ } & import("../../../MagicTray/index.js").TraySidePayload;
1654
1669
  progress: {
1655
1670
  id: string;
1656
1671
  } & import("../../../MagicTray/index.js").TraySidePayload;
1657
1672
  magnet: {
1658
1673
  id: string;
1659
1674
  } & import("../../../MagicTray/index.js").TraySidePayload;
1660
- willSnapTo: import("../../../MagicTray/src/types/index.js").TrayWillSnapToPayload;
1675
+ willSnapTo: import("../../../MagicTray/index.js").TrayWillSnapToPayload;
1661
1676
  } & Omit<object, keyof import("../../../MagicTray/src/types/index.js").TrayEvents>, keyof import("../../../MagicToast/src/types/index.js").ToastEvents>, "collision">, keyof import("../../../MagicPlayer/src/types/index.js").PlayerEvents>, keyof import("../../../MagicMenu/src/types/index.js").MenuEvents>, keyof import("../../../MagicModal/src/types/index.js").ModalEvents>, keyof import("../../../MagicDrawer/src/types/index.js").DrawerEvents>, keyof import("../../../MagicDraggable/src/types/index.js").DraggableEvents>, keyof import("../../../MagicCookie/src/types/index.js").CookieEvents>, keyof import("../../../MagicAccordion/src/types/index.js").AccordionEvents>)[Key]): void;
1662
- <Key extends "progress" | "acceptAll" | "acceptSelected" | "rejectAll" | "magnet" | "willSnapTo" | "collision" | keyof import("../../../MagicPlayer/src/types/index.js").PlayerEvents | keyof import("../../../MagicDraggable/src/types/index.js").DraggableEvents | keyof import("../../../MagicAccordion/src/types/index.js").AccordionEvents>(type: undefined extends ({
1677
+ <Key extends "progress" | "staticClick" | "magnet" | "willSnapTo" | "collision" | keyof import("../../../MagicPlayer/src/types/index.js").PlayerEvents | keyof import("../../../MagicDraggable/src/types/index.js").DraggableEvents | "acceptAll" | "rejectAll" | "acceptSelected" | keyof import("../../../MagicAccordion/src/types/index.js").AccordionEvents>(type: undefined extends ({
1663
1678
  beforeEnter: string | {
1664
1679
  id: string;
1665
1680
  viewId: string;
@@ -1982,13 +1997,16 @@ export declare function useMagicEmitter(): {
1982
1997
  afterDrag: {
1983
1998
  id: string;
1984
1999
  } & import("../../../MagicTray/index.js").TraySidePayload;
2000
+ staticClick: {
2001
+ id: string;
2002
+ } & import("../../../MagicTray/index.js").TraySidePayload;
1985
2003
  progress: {
1986
2004
  id: string;
1987
2005
  } & import("../../../MagicTray/index.js").TraySidePayload;
1988
2006
  magnet: {
1989
2007
  id: string;
1990
2008
  } & import("../../../MagicTray/index.js").TraySidePayload;
1991
- willSnapTo: import("../../../MagicTray/src/types/index.js").TrayWillSnapToPayload;
2009
+ willSnapTo: import("../../../MagicTray/index.js").TrayWillSnapToPayload;
1992
2010
  } & Omit<object, keyof import("../../../MagicTray/src/types/index.js").TrayEvents>, keyof import("../../../MagicToast/src/types/index.js").ToastEvents>, "collision">, keyof import("../../../MagicPlayer/src/types/index.js").PlayerEvents>, keyof import("../../../MagicMenu/src/types/index.js").MenuEvents>, keyof import("../../../MagicModal/src/types/index.js").ModalEvents>, keyof import("../../../MagicDrawer/src/types/index.js").DrawerEvents>, keyof import("../../../MagicDraggable/src/types/index.js").DraggableEvents>, keyof import("../../../MagicCookie/src/types/index.js").CookieEvents>, keyof import("../../../MagicAccordion/src/types/index.js").AccordionEvents>)[Key] ? Key : never): void;
1993
2011
  };
1994
2012
  };
package/dist/plugins/MagicTray/index.d.ts CHANGED
@@ -5,7 +5,7 @@ import MagicTrayHandle from './src/components/MagicTrayHandle.vue.js';
5
5
  import MagicTrayTransform from './src/components/MagicTrayTransform.vue.js';
6
6
  import { useMagicTray } from './src/composables/useMagicTray.js';
7
7
  import type { Plugin } from 'vue';
8
- import type { MagicTrayOptions, TraySide, TraySidePayload, TraySnapMode, TraySnapPoint, TraySnapPointPayload, TrayTransformAxis } from './src/types/index.js';
8
+ import type { MagicTrayOptions, TraySide, TraySidePayload, TraySnapMode, TraySnapPoint, TraySnapPointPayload, TrayTransformAxis, TrayWillSnapToPayload } from './src/types/index.js';
9
9
  declare const MagicTrayPlugin: Plugin;
10
10
  export { MagicTrayPlugin, MagicTray, MagicTrayProvider, MagicTrayContent, MagicTrayHandle, MagicTrayTransform, useMagicTray, };
11
11
  export type { MagicTrayOptions, TraySide, TraySidePayload, TraySnapMode, TraySnapPoint, TraySnapPointPayload, TrayWillSnapToPayload, TrayTransformAxis, };
package/dist/plugins/MagicTray/src/composables/private/useTrayDrag.mjs CHANGED
@@ -79,9 +79,13 @@ export function useTrayDrag(args) {
79
79
  const threshold = computed(() => state.options.threshold);
80
80
  const disabled = computed(() => state.options.disabled);
81
81
  const snapMode = computed(() => state.options.snap.mode);
82
+ const instant = computed(() => state.options.snap.instant);
82
83
  function snapReference(side) {
83
84
  return snapMode.value === "step" ? state.lastDragged[side] : state.dragged[side];
84
85
  }
86
+ function isInstant(side) {
87
+ return typeof instant.value === "boolean" ? instant.value : instant.value?.[side] ?? false;
88
+ }
85
89
  const hasDragged = computed(() => {
86
90
  const side = state.draggingSide;
87
91
  if (!side) {
@@ -165,7 +169,7 @@ export function useTrayDrag(args) {
165
169
  state.overshoot.inner = innerPixels ?? 0;
166
170
  await nextTick();
167
171
  }
168
- function setDragged(side, coord) {
172
+ function computeInset(side, coord) {
169
173
  let newInset = 0;
170
174
  switch (side) {
171
175
  case "top":
@@ -182,13 +186,16 @@ export function useTrayDrag(args) {
182
186
  break;
183
187
  }
184
188
  const { min, max } = dragBounds(side);
185
- newInset = clampWithOvershoot(
189
+ return clampWithOvershoot(
186
190
  newInset,
187
191
  min,
188
192
  max,
189
193
  state.overshoot.outer[side],
190
194
  state.overshoot.inner
191
195
  );
196
+ }
197
+ function setDragged(side, coord) {
198
+ const newInset = computeInset(side, coord);
192
199
  if (newInset === state.dragged[side]) {
193
200
  return;
194
201
  }
@@ -196,6 +203,27 @@ export function useTrayDrag(args) {
196
203
  state.relDirection[side] = newInset < prev ? "below" : "above";
197
204
  state.dragged[side] = newInset;
198
205
  }
206
+ function setInstant(side, coord) {
207
+ const inset = computeInset(side, coord);
208
+ const target = findClosestSnapPoint({ side, value: inset });
209
+ if (target === void 0 || target === state.snapped[side]) {
210
+ return;
211
+ }
212
+ const snapPoint = snapPointsMap(side)[target];
213
+ state.dragged[side] = target;
214
+ state.snapped[side] = target;
215
+ state.activeSnapPoint[side] = snapPoint;
216
+ if (snapPoint || snapPoint === 0) {
217
+ emitter.emit("beforeSnap", {
218
+ id: toValue(id),
219
+ snapPoint: { side, point: snapPoint }
220
+ });
221
+ emitter.emit("afterSnap", {
222
+ id: toValue(id),
223
+ snapPoint: { side, point: snapPoint }
224
+ });
225
+ }
226
+ }
199
227
  function checkPosition(side) {
200
228
  const delta = state.dragged[side] - state.lastDragged[side];
201
229
  if (Math.abs(delta) > toValue(threshold).distance) {
@@ -210,10 +238,14 @@ export function useTrayDrag(args) {
210
238
  }
211
239
  function emitWillSnapTo(side) {
212
240
  const target = state.interpolateTo ?? state.snapped[side];
213
- if (target === lastPendingTarget) return;
241
+ if (target === lastPendingTarget) {
242
+ return;
243
+ }
214
244
  lastPendingTarget = target;
215
245
  const snapPoint = snapPointsMap(side)[target];
216
- if (!snapPoint && snapPoint !== 0) return;
246
+ if (!snapPoint && snapPoint !== 0) {
247
+ return;
248
+ }
217
249
  emitter.emit("willSnapTo", {
218
250
  id: toValue(id),
219
251
  side,
@@ -265,10 +297,14 @@ export function useTrayDrag(args) {
265
297
  e.stopImmediatePropagation();
266
298
  e.stopPropagation();
267
299
  const coord = isVertical(side) ? e.clientY : e.clientX;
268
- setDragged(side, coord);
269
- checkMomentum(side);
270
- checkPosition(side);
271
- emitWillSnapTo(side);
300
+ if (isInstant(side)) {
301
+ setInstant(side, coord);
302
+ } else {
303
+ setDragged(side, coord);
304
+ checkMomentum(side);
305
+ checkPosition(side);
306
+ emitWillSnapTo(side);
307
+ }
272
308
  emitter.emit("drag", {
273
309
  id: toValue(id),
274
310
  side,
@@ -278,12 +314,22 @@ export function useTrayDrag(args) {
278
314
  function onPointerup(e) {
279
315
  const side = state.draggingSide;
280
316
  if (side) {
281
- settle(side);
317
+ const isStaticClick = !hasDragged.value;
318
+ if (!isInstant(side)) {
319
+ settle(side);
320
+ }
282
321
  emitter.emit("afterDrag", {
283
322
  id: toValue(id),
284
323
  side,
285
324
  value: state.dragged[side]
286
325
  });
326
+ if (isStaticClick) {
327
+ emitter.emit("staticClick", {
328
+ id: toValue(id),
329
+ side,
330
+ value: state.dragged[side]
331
+ });
332
+ }
287
333
  }
288
334
  resetDragState();
289
335
  resetListeners();
@@ -304,10 +350,14 @@ export function useTrayDrag(args) {
304
350
  e.preventDefault();
305
351
  }
306
352
  const coord = isVertical(side) ? firstTouch.clientY : firstTouch.clientX;
307
- setDragged(side, coord);
308
- checkMomentum(side);
309
- checkPosition(side);
310
- emitWillSnapTo(side);
353
+ if (isInstant(side)) {
354
+ setInstant(side, coord);
355
+ } else {
356
+ setDragged(side, coord);
357
+ checkMomentum(side);
358
+ checkPosition(side);
359
+ emitWillSnapTo(side);
360
+ }
311
361
  emitter.emit("drag", {
312
362
  id: toValue(id),
313
363
  side,
@@ -317,12 +367,22 @@ export function useTrayDrag(args) {
317
367
  function onTouchend() {
318
368
  const side = state.draggingSide;
319
369
  if (side) {
320
- settle(side);
370
+ const isStaticClick = !hasDragged.value;
371
+ if (!isInstant(side)) {
372
+ settle(side);
373
+ }
321
374
  emitter.emit("afterDrag", {
322
375
  id: toValue(id),
323
376
  side,
324
377
  value: state.dragged[side]
325
378
  });
379
+ if (isStaticClick) {
380
+ emitter.emit("staticClick", {
381
+ id: toValue(id),
382
+ side,
383
+ value: state.dragged[side]
384
+ });
385
+ }
326
386
  }
327
387
  resetDragState();
328
388
  resetListeners();
package/dist/plugins/MagicTray/src/types/index.d.ts CHANGED
@@ -33,6 +33,7 @@ export interface MagicTrayOptions {
33
33
  snapPoints?: TraySnapPoints;
34
34
  snap?: {
35
35
  mode?: TraySnapMode;
36
+ instant?: boolean | Partial<Record<TraySide, boolean>>;
36
37
  };
37
38
  handles?: boolean | Partial<Record<TraySide, boolean>>;
38
39
  magnetism?: TrayMagnetism;
@@ -110,6 +111,9 @@ export type TrayEvents = {
110
111
  afterDrag: {
111
112
  id: string;
112
113
  } & TraySidePayload;
114
+ staticClick: {
115
+ id: string;
116
+ } & TraySidePayload;
113
117
  progress: {
114
118
  id: string;
115
119
  } & TraySidePayload;
package/dist/plugins/MagicTray/src/utils/defaultOptions.mjs CHANGED
@@ -5,7 +5,8 @@ const defaultOptions = {
5
5
  bottom: [0, 0.5, 1]
6
6
  },
7
7
  snap: {
8
- mode: "closest"
8
+ mode: "closest",
9
+ instant: false
9
10
  },
10
11
  handles: true,
11
12
  magnetism: {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@maas/vue-equipment",
3
3
  "description": "Our Frontend Toolkit, Free and Open Source",
4
- "version": "1.0.0-beta.75",
4
+ "version": "1.0.0-beta.76",
5
5
  "contributors": [
6
6
  {
7
7
  "name": "Robin Scholz",