@maas/vue-equipment 0.31.0 → 0.32.1
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/nuxt/module.json +1 -1
- package/dist/nuxt/module.mjs +8 -1
- package/dist/plugins/MagicAccordion/index.d.ts +5 -0
- package/dist/plugins/MagicAccordion/index.mjs +25 -0
- package/dist/plugins/MagicAccordion/nuxt.d.ts +2 -0
- package/dist/plugins/MagicAccordion/nuxt.mjs +23 -0
- package/dist/plugins/MagicAccordion/src/components/MagicAccordionContent.vue +72 -0
- package/dist/plugins/MagicAccordion/src/components/MagicAccordionContent.vue.d.ts +26 -0
- package/dist/plugins/MagicAccordion/src/components/MagicAccordionProvider.vue +31 -0
- package/dist/plugins/MagicAccordion/src/components/MagicAccordionProvider.vue.d.ts +27 -0
- package/dist/plugins/MagicAccordion/src/components/MagicAccordionTrigger.vue +71 -0
- package/dist/plugins/MagicAccordion/src/components/MagicAccordionTrigger.vue.d.ts +47 -0
- package/dist/plugins/MagicAccordion/src/components/MagicAccordionView.vue +55 -0
- package/dist/plugins/MagicAccordion/src/components/MagicAccordionView.vue.d.ts +25 -0
- package/dist/plugins/MagicAccordion/src/composables/private/useAccordionCallback.d.ts +14 -0
- package/dist/plugins/MagicAccordion/src/composables/private/useAccordionCallback.mjs +32 -0
- package/dist/plugins/MagicAccordion/src/composables/private/useAccordionState.d.ts +7 -0
- package/dist/plugins/MagicAccordion/src/composables/private/useAccordionState.mjs +42 -0
- package/dist/plugins/MagicAccordion/src/composables/private/useAccordionTrigger.d.ts +16 -0
- package/dist/plugins/MagicAccordion/src/composables/private/useAccordionTrigger.mjs +35 -0
- package/dist/plugins/MagicAccordion/src/composables/private/useAccordionView.d.ts +12 -0
- package/dist/plugins/MagicAccordion/src/composables/private/useAccordionView.mjs +60 -0
- package/dist/plugins/MagicAccordion/src/composables/useMagicAccordion.d.ts +10 -0
- package/dist/plugins/MagicAccordion/src/composables/useMagicAccordion.mjs +9 -0
- package/dist/plugins/MagicAccordion/src/symbols/index.d.ts +5 -0
- package/dist/plugins/MagicAccordion/src/symbols/index.mjs +8 -0
- package/dist/plugins/MagicAccordion/src/types/index.d.ts +43 -0
- package/dist/plugins/MagicAccordion/src/types/index.mjs +0 -0
- package/dist/plugins/MagicAccordion/src/utils/defaultOptions.d.ts +4 -0
- package/dist/plugins/MagicAccordion/src/utils/defaultOptions.mjs +6 -0
- package/dist/plugins/MagicAutoSize/src/components/MagicAutoSize.vue +43 -4
- package/dist/plugins/MagicAutoSize/src/components/MagicAutoSize.vue.d.ts +5 -1
- package/dist/plugins/MagicDrawer/src/components/MagicDrawer.vue +3 -1
- package/dist/plugins/MagicDrawer/src/composables/private/useDrawerState.d.ts +2 -45
- package/dist/plugins/MagicDrawer/src/composables/private/useDrawerState.mjs +3 -2
- package/dist/plugins/MagicDrawer/src/composables/useMagicDrawer.mjs +5 -8
- package/dist/plugins/MagicDrawer/src/types/index.d.ts +1 -0
- package/dist/plugins/MagicEmitter/src/composables/useMagicEmitter.d.ts +376 -118
- package/dist/plugins/MagicEmitter/src/types/index.d.ts +2 -0
- package/dist/plugins/MagicMenu/index.d.ts +2 -2
- package/dist/plugins/MagicMenu/index.mjs +14 -2
- package/dist/plugins/MagicMenu/src/composables/private/useMenuCallback.mjs +6 -6
- package/dist/plugins/MagicMenu/src/composables/private/useMenuView.mjs +6 -6
- package/dist/plugins/MagicMenu/src/types/index.d.ts +21 -8
- package/dist/plugins/MagicMenu/src/utils/defaultOptions.d.ts +2 -3
- package/dist/plugins/MagicPlayer/src/components/MagicPlayerOverlay.vue +1 -1
- package/dist/plugins/MagicScroll/src/symbols/index.d.ts +2 -2
- package/dist/plugins/MagicToast/src/composables/private/useToastApi.d.ts +1 -1
- package/dist/plugins/MagicToast/src/composables/private/useToastStore.d.ts +14 -4
- package/dist/plugins/MagicToast/src/composables/useMagicToast.d.ts +5 -5
- package/dist/plugins/index.d.ts +1 -0
- package/dist/plugins/index.mjs +1 -0
- package/dist/utils/css/easings.css +4 -0
- package/package.json +1 -1
- package/dist/plugins/MagicDrawer/src/composables/private/useDrawerStore.d.ts +0 -5
- package/dist/plugins/MagicDrawer/src/composables/private/useDrawerStore.mjs +0 -15
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import type { AccordionEvents } from '../../../MagicAccordion/src/types/index.js';
|
|
1
2
|
import type { CookieEvents } from '../../../MagicCookie/src/types/index.js';
|
|
2
3
|
import type { DraggableEvents } from '../../../MagicDraggable/src/types/index.js';
|
|
3
4
|
import type { DrawerEvents } from '../../../MagicDrawer/src/types/index.js';
|
|
@@ -10,6 +11,7 @@ type MergeTypes<T, U> = {
|
|
|
10
11
|
} & Omit<U, keyof T>;
|
|
11
12
|
type Merge<T extends unknown[]> = T extends [infer First, ...infer Rest] ? MergeTypes<First, Merge<Rest>> : {};
|
|
12
13
|
export type MagicEmitterEvents = Merge<[
|
|
14
|
+
AccordionEvents,
|
|
13
15
|
CookieEvents,
|
|
14
16
|
DraggableEvents,
|
|
15
17
|
DrawerEvents,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { useMagicMenu } from './src/composables/useMagicMenu.js';
|
|
2
|
-
import { MagicMenuInstanceId, MagicMenuItemActive, MagicMenuParentTree } from './src/symbols/index.js';
|
|
2
|
+
import { MagicMenuInstanceId, MagicMenuViewId, MagicMenuViewActive, MagicMenuItemId, MagicMenuItemActive, MagicMenuParentTree, MagicMenuChannelId, MagicMenuChannelActive, MagicMenuContentId } from './src/symbols/index.js';
|
|
3
3
|
import type { Plugin } from 'vue';
|
|
4
4
|
declare const MagicMenuPlugin: Plugin;
|
|
5
|
-
export { MagicMenuPlugin, useMagicMenu, MagicMenuInstanceId, MagicMenuItemActive, MagicMenuParentTree, };
|
|
5
|
+
export { MagicMenuPlugin, useMagicMenu, MagicMenuInstanceId, MagicMenuViewId, MagicMenuViewActive, MagicMenuItemId, MagicMenuItemActive, MagicMenuParentTree, MagicMenuChannelId, MagicMenuChannelActive, MagicMenuContentId, };
|
|
@@ -9,8 +9,14 @@ import MagicMenuView from "./src/components/MagicMenuView.vue";
|
|
|
9
9
|
import { useMagicMenu } from "./src/composables/useMagicMenu.mjs";
|
|
10
10
|
import {
|
|
11
11
|
MagicMenuInstanceId,
|
|
12
|
+
MagicMenuViewId,
|
|
13
|
+
MagicMenuViewActive,
|
|
14
|
+
MagicMenuItemId,
|
|
12
15
|
MagicMenuItemActive,
|
|
13
|
-
MagicMenuParentTree
|
|
16
|
+
MagicMenuParentTree,
|
|
17
|
+
MagicMenuChannelId,
|
|
18
|
+
MagicMenuChannelActive,
|
|
19
|
+
MagicMenuContentId
|
|
14
20
|
} from "./src/symbols/index.mjs";
|
|
15
21
|
const MagicMenuPlugin = {
|
|
16
22
|
install: (app) => {
|
|
@@ -28,6 +34,12 @@ export {
|
|
|
28
34
|
MagicMenuPlugin,
|
|
29
35
|
useMagicMenu,
|
|
30
36
|
MagicMenuInstanceId,
|
|
37
|
+
MagicMenuViewId,
|
|
38
|
+
MagicMenuViewActive,
|
|
39
|
+
MagicMenuItemId,
|
|
31
40
|
MagicMenuItemActive,
|
|
32
|
-
MagicMenuParentTree
|
|
41
|
+
MagicMenuParentTree,
|
|
42
|
+
MagicMenuChannelId,
|
|
43
|
+
MagicMenuChannelActive,
|
|
44
|
+
MagicMenuContentId
|
|
33
45
|
};
|
|
@@ -14,13 +14,13 @@ export function useMenuCallback(args) {
|
|
|
14
14
|
} = args;
|
|
15
15
|
const emitter = useMagicEmitter();
|
|
16
16
|
function onBeforeEnter(_el) {
|
|
17
|
-
emitter.emit("beforeEnter", { id: toValue(instanceId),
|
|
17
|
+
emitter.emit("beforeEnter", { id: toValue(instanceId), viewId });
|
|
18
18
|
}
|
|
19
19
|
function onEnter(_el) {
|
|
20
|
-
emitter.emit("enter", { id: toValue(instanceId),
|
|
20
|
+
emitter.emit("enter", { id: toValue(instanceId), viewId });
|
|
21
21
|
}
|
|
22
22
|
function onAfterEnter(_el) {
|
|
23
|
-
emitter.emit("afterEnter", { id: toValue(instanceId),
|
|
23
|
+
emitter.emit("afterEnter", { id: toValue(instanceId), viewId });
|
|
24
24
|
const scrollLock = state.options.scrollLock ?? ModeScrollLock[state.options.mode].value;
|
|
25
25
|
if (!!scrollLock) {
|
|
26
26
|
lockScroll();
|
|
@@ -30,13 +30,13 @@ export function useMenuCallback(args) {
|
|
|
30
30
|
}
|
|
31
31
|
}
|
|
32
32
|
function onBeforeLeave(_el) {
|
|
33
|
-
emitter.emit("beforeLeave", { id: toValue(instanceId),
|
|
33
|
+
emitter.emit("beforeLeave", { id: toValue(instanceId), viewId });
|
|
34
34
|
}
|
|
35
35
|
function onLeave(_el) {
|
|
36
|
-
emitter.emit("leave", { id: toValue(instanceId),
|
|
36
|
+
emitter.emit("leave", { id: toValue(instanceId), viewId });
|
|
37
37
|
}
|
|
38
38
|
function onAfterLeave(_el) {
|
|
39
|
-
emitter.emit("afterLeave", { id: toValue(instanceId),
|
|
39
|
+
emitter.emit("afterLeave", { id: toValue(instanceId), viewId });
|
|
40
40
|
const scrollLock = state.options.scrollLock ?? ModeScrollLock[state.options.mode].value;
|
|
41
41
|
if (!!scrollLock) {
|
|
42
42
|
unlockScroll();
|
|
@@ -101,13 +101,13 @@ export function useMenuView(instanceId) {
|
|
|
101
101
|
await delay(delayMs, abortController.signal);
|
|
102
102
|
instance.active = true;
|
|
103
103
|
unselectUnrelatedViews(id);
|
|
104
|
-
} catch (
|
|
105
|
-
if (
|
|
104
|
+
} catch (error) {
|
|
105
|
+
if (error.name === "AbortError") {
|
|
106
106
|
console.log(
|
|
107
107
|
`selectView() was interrupted by a call to unselectView()`
|
|
108
108
|
);
|
|
109
109
|
} else {
|
|
110
|
-
throw
|
|
110
|
+
throw error;
|
|
111
111
|
}
|
|
112
112
|
}
|
|
113
113
|
}
|
|
@@ -123,13 +123,13 @@ export function useMenuView(instanceId) {
|
|
|
123
123
|
try {
|
|
124
124
|
await delay(delayMs, abortController.signal);
|
|
125
125
|
instance.active = false;
|
|
126
|
-
} catch (
|
|
127
|
-
if (
|
|
126
|
+
} catch (error) {
|
|
127
|
+
if (error.name === "AbortError") {
|
|
128
128
|
console.log(
|
|
129
129
|
`unselectView() was interrupted by a call to selectView()`
|
|
130
130
|
);
|
|
131
131
|
} else {
|
|
132
|
-
throw
|
|
132
|
+
throw error;
|
|
133
133
|
}
|
|
134
134
|
}
|
|
135
135
|
}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import type { Placement } from '@floating-ui/vue';
|
|
2
|
-
import type { RequireAllNested } from '@maas/vue-equipment/utils';
|
|
3
2
|
type MenuMode = 'dropdown' | 'menubar' | 'context' | 'navigation';
|
|
4
3
|
export interface MagicMenuOptions {
|
|
5
4
|
mode?: MenuMode;
|
|
@@ -24,6 +23,20 @@ export interface MagicMenuOptions {
|
|
|
24
23
|
rightClick?: number;
|
|
25
24
|
};
|
|
26
25
|
}
|
|
26
|
+
export interface RequiredMagicMenuOptions {
|
|
27
|
+
mode: MenuMode;
|
|
28
|
+
debug: boolean;
|
|
29
|
+
transition: {
|
|
30
|
+
content: {
|
|
31
|
+
default: string;
|
|
32
|
+
nested: string;
|
|
33
|
+
};
|
|
34
|
+
channel: string;
|
|
35
|
+
};
|
|
36
|
+
}
|
|
37
|
+
export interface OptionalMagicMenuOptions extends Pick<MagicMenuOptions, 'scrollLock' | 'floating' | 'delay'> {
|
|
38
|
+
}
|
|
39
|
+
export type CombinedMagicMenuOptions = RequiredMagicMenuOptions & OptionalMagicMenuOptions;
|
|
27
40
|
export type Interaction = 'click' | 'mouseenter' | 'right-click';
|
|
28
41
|
export type Coordinates = {
|
|
29
42
|
x: number;
|
|
@@ -58,7 +71,7 @@ export interface MenuState {
|
|
|
58
71
|
id: string;
|
|
59
72
|
active: boolean;
|
|
60
73
|
views: MenuView[];
|
|
61
|
-
options:
|
|
74
|
+
options: CombinedMagicMenuOptions;
|
|
62
75
|
input: {
|
|
63
76
|
type: 'keyboard' | 'pointer';
|
|
64
77
|
disabled: ('keyboard' | 'pointer')[];
|
|
@@ -68,27 +81,27 @@ export interface MenuState {
|
|
|
68
81
|
export type MenuEvents = {
|
|
69
82
|
beforeEnter: {
|
|
70
83
|
id: string;
|
|
71
|
-
|
|
84
|
+
viewId: string;
|
|
72
85
|
};
|
|
73
86
|
enter: {
|
|
74
87
|
id: string;
|
|
75
|
-
|
|
88
|
+
viewId: string;
|
|
76
89
|
};
|
|
77
90
|
afterEnter: {
|
|
78
91
|
id: string;
|
|
79
|
-
|
|
92
|
+
viewId: string;
|
|
80
93
|
};
|
|
81
94
|
beforeLeave: {
|
|
82
95
|
id: string;
|
|
83
|
-
|
|
96
|
+
viewId: string;
|
|
84
97
|
};
|
|
85
98
|
leave: {
|
|
86
99
|
id: string;
|
|
87
|
-
|
|
100
|
+
viewId: string;
|
|
88
101
|
};
|
|
89
102
|
afterLeave: {
|
|
90
103
|
id: string;
|
|
91
|
-
|
|
104
|
+
viewId: string;
|
|
92
105
|
};
|
|
93
106
|
};
|
|
94
107
|
export {};
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import type {
|
|
2
|
-
|
|
3
|
-
declare const defaultOptions: Omit<RequireAllNested<MagicMenuOptions>, 'scrollLock' | 'floating' | 'delay'>;
|
|
1
|
+
import type { RequiredMagicMenuOptions } from '../types.js';
|
|
2
|
+
declare const defaultOptions: RequiredMagicMenuOptions;
|
|
4
3
|
export { defaultOptions };
|
|
@@ -60,5 +60,5 @@ const { idle } = useIdle(3000)
|
|
|
60
60
|
</script>
|
|
61
61
|
|
|
62
62
|
<style>
|
|
63
|
-
:root{--magic-player-overlay-background:rgba(0,0,0,.3);--magic-player-overlay-color:#fff;--magic-player-overlay-button-size:2.5rem}.magic-player-overlay{align-items:center;background-color:var(--magic-player-overlay-background);color:var(--magic-player-overlay-color);cursor:pointer;display:flex;inset:0;justify-content:center;position:absolute;transition-
|
|
63
|
+
:root{--magic-player-overlay-background:rgba(0,0,0,.3);--magic-player-overlay-color:#fff;--magic-player-overlay-button-size:2.5rem;--magic-player-overlay-transition:opacity 300ms ease}.magic-player-overlay{align-items:center;background-color:var(--magic-player-overlay-background);color:var(--magic-player-overlay-color);cursor:pointer;display:flex;inset:0;justify-content:center;position:absolute;transition:var(--magic-player-overlay-transition)}.magic-player-overlay__button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:0;border-radius:0;color:inherit;cursor:pointer;height:var(--magic-player-overlay-button-size);outline:none;padding:0;width:var(--magic-player-overlay-button-size)}.magic-player-overlay.-playing.-idle,.magic-player-overlay.-playing.-not-hover{opacity:0}
|
|
64
64
|
</style>
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import type { InjectionKey, Ref,
|
|
1
|
+
import type { InjectionKey, Ref, MaybeRef } from 'vue';
|
|
2
2
|
import type { UseScrollReturn } from '@vueuse/core';
|
|
3
|
-
declare const MagicScrollParent: InjectionKey<
|
|
3
|
+
declare const MagicScrollParent: InjectionKey<MaybeRef<HTMLElement | undefined>>;
|
|
4
4
|
declare const MagicScrollProgress: InjectionKey<Ref<number>>;
|
|
5
5
|
declare const MagicScrollReturn: InjectionKey<UseScrollReturn | undefined>;
|
|
6
6
|
export { MagicScrollParent, MagicScrollProgress, MagicScrollReturn };
|
|
@@ -1,7 +1,17 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { ToastInstance, AddToastArgs } from '../../types.js';
|
|
2
2
|
export declare function useToastStore(): {
|
|
3
|
-
toastStore: import("vue").Ref<
|
|
4
|
-
|
|
5
|
-
|
|
3
|
+
toastStore: import("vue").Ref<{
|
|
4
|
+
id: string;
|
|
5
|
+
toasts: {
|
|
6
|
+
id: string;
|
|
7
|
+
component: Object;
|
|
8
|
+
props?: Record<string, any> | undefined;
|
|
9
|
+
remove: Function;
|
|
10
|
+
}[];
|
|
11
|
+
add: (args: AddToastArgs) => string;
|
|
12
|
+
remove: (id: string) => void;
|
|
13
|
+
}[]>;
|
|
14
|
+
findInstance: (id: string) => ToastInstance | undefined;
|
|
15
|
+
addInstance: (id: string) => ToastInstance;
|
|
6
16
|
removeInstance: (id: string) => void;
|
|
7
17
|
};
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { type MaybeRef } from 'vue';
|
|
2
2
|
import type { AddToastArgs } from './../types.js';
|
|
3
3
|
export declare function useMagicToast(id: MaybeRef<string>): {
|
|
4
|
-
toasts: import("vue").ComputedRef<
|
|
5
|
-
count: import("vue").ComputedRef<
|
|
6
|
-
firstToast: import("vue").ComputedRef<
|
|
7
|
-
lastToast: import("vue").ComputedRef<
|
|
8
|
-
add: (options: AddToastArgs) => Promise<
|
|
4
|
+
toasts: import("vue").ComputedRef<import("./../types").Toast[] | undefined>;
|
|
5
|
+
count: import("vue").ComputedRef<number | undefined>;
|
|
6
|
+
firstToast: import("vue").ComputedRef<import("./../types").Toast | undefined>;
|
|
7
|
+
lastToast: import("vue").ComputedRef<import("./../types").Toast | undefined>;
|
|
8
|
+
add: (options: AddToastArgs) => Promise<string | undefined>;
|
|
9
9
|
remove: (toastId: string) => void;
|
|
10
10
|
clear: () => void;
|
|
11
11
|
};
|
package/dist/plugins/index.d.ts
CHANGED
package/dist/plugins/index.mjs
CHANGED
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@maas/vue-equipment",
|
|
3
3
|
"description": "A magic collection of Vue composables, plugins, components and directives",
|
|
4
|
-
"version": "0.
|
|
4
|
+
"version": "0.32.1",
|
|
5
5
|
"author": "Robin Scholz <https://github.com/robinscholz>, Christoph Jeworutzki <https://github.com/ChristophJeworutzki>",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"devDependencies": {
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import { ref } from "vue";
|
|
2
|
-
let drawerStore = ref([]);
|
|
3
|
-
export function useDrawerStore() {
|
|
4
|
-
function addInstance(id) {
|
|
5
|
-
drawerStore.value.push(id);
|
|
6
|
-
}
|
|
7
|
-
function removeInstance(id) {
|
|
8
|
-
drawerStore.value = drawerStore.value.filter((x) => x !== id);
|
|
9
|
-
}
|
|
10
|
-
return {
|
|
11
|
-
drawerStore,
|
|
12
|
-
addInstance,
|
|
13
|
-
removeInstance
|
|
14
|
-
};
|
|
15
|
-
}
|