@maas/vue-equipment 0.29.8 → 0.30.0

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 (13) hide show
  1. package/dist/nuxt/module.json +1 -1
  2. package/dist/nuxt/module.mjs +7 -0
  3. package/dist/plugins/MagicAutoSize/index.d.ts +4 -0
  4. package/dist/plugins/MagicAutoSize/index.mjs +7 -0
  5. package/dist/plugins/MagicAutoSize/nuxt.d.ts +2 -0
  6. package/dist/plugins/MagicAutoSize/nuxt.mjs +14 -0
  7. package/dist/plugins/MagicAutoSize/src/components/MagicAutoSize.vue +94 -0
  8. package/dist/plugins/MagicAutoSize/src/components/MagicAutoSize.vue.d.ts +40 -0
  9. package/dist/plugins/MagicCommand/src/components/MagicCommandBody.vue.d.ts +0 -1
  10. package/dist/plugins/MagicPlayer/src/components/MagicPlayerControls.vue +1 -1
  11. package/dist/plugins/index.d.ts +1 -0
  12. package/dist/plugins/index.mjs +1 -0
  13. 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": "0.29.7",
4
+ "version": "0.29.8",
5
5
  "builder": {
6
6
  "@nuxt/module-builder": "0.8.0",
7
7
  "unbuild": "unknown"
package/dist/nuxt/module.mjs CHANGED
@@ -1,6 +1,13 @@
1
1
  import { defineNuxtModule, createResolver, extendViteConfig, installModule, addImportsSources } from '@nuxt/kit';
2
2
 
3
3
  const functions$1 = [
4
+ {
5
+ name: "MagicAutoSize",
6
+ "package": "plugins",
7
+ lastUpdated: 0,
8
+ docs: "https://maas.egineering/vue-equipment/plugins/MagicAutoSize/",
9
+ description: "auto Size"
10
+ },
4
11
  {
5
12
  name: "MagicCommand",
6
13
  "package": "plugins",
package/dist/plugins/MagicAutoSize/index.d.ts ADDED
@@ -0,0 +1,4 @@
1
+ import type { Plugin } from 'vue';
2
+ import MagicAutoSize from './src/components/MagicAutoSize.vue.js';
3
+ declare const MagicAutoSizePlugin: Plugin;
4
+ export { MagicAutoSizePlugin, MagicAutoSize };
package/dist/plugins/MagicAutoSize/index.mjs ADDED
@@ -0,0 +1,7 @@
1
+ import MagicAutoSize from "./src/components/MagicAutoSize.vue";
2
+ const MagicAutoSizePlugin = {
3
+ install: (app) => {
4
+ app.component("MagicAutoSize", MagicAutoSize);
5
+ }
6
+ };
7
+ export { MagicAutoSizePlugin, MagicAutoSize };
package/dist/plugins/MagicAutoSize/nuxt.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ declare const _default: import("@nuxt/schema").NuxtModule<import("@nuxt/schema").ModuleOptions>;
2
+ export default _default;
package/dist/plugins/MagicAutoSize/nuxt.mjs ADDED
@@ -0,0 +1,14 @@
1
+ import { defineNuxtModule, createResolver, addComponent } from "@nuxt/kit";
2
+ export default defineNuxtModule({
3
+ meta: {
4
+ name: "@maas/vue-equipment/nuxt/MagicAutoSize"
5
+ },
6
+ setup() {
7
+ const resolver = createResolver(import.meta.url);
8
+ addComponent({
9
+ filePath: resolver.resolve("src/components/MagicAutoSize.vue"),
10
+ name: "MagicAutoSize",
11
+ global: true
12
+ });
13
+ }
14
+ });
package/dist/plugins/MagicAutoSize/src/components/MagicAutoSize.vue ADDED
@@ -0,0 +1,94 @@
1
+ <template>
2
+ <div
3
+ class="magic-auto-size"
4
+ ref="elRef"
5
+ :style="{
6
+ '--magic-auto-size-width': mappedSize?.width,
7
+ '--magic-auto-size-height': mappedSize?.height,
8
+ }"
9
+ >
10
+ <slot />
11
+ </div>
12
+ </template>
13
+
14
+ <script lang="ts" setup>
15
+ import { ref, computed, onMounted } from 'vue'
16
+ import { useResizeObserver, useMutationObserver } from '@vueuse/core'
17
+
18
+ interface MagicAutoSizeProps {
19
+ width?: boolean
20
+ height?: boolean
21
+ }
22
+
23
+ const props = withDefaults(defineProps<MagicAutoSizeProps>(), {
24
+ width: true,
25
+ height: true,
26
+ })
27
+
28
+ const elRef = ref<HTMLElement | undefined>(undefined)
29
+
30
+ const size = ref<{ width: number; height: number }>()
31
+ const content = ref<HTMLElement | undefined>(undefined)
32
+
33
+ const mappedSize = computed(() => {
34
+ if (size.value) {
35
+ switch (true) {
36
+ case props.width && props.height:
37
+ return {
38
+ width: `${size.value.width}px`,
39
+ height: `${size.value.height}px`,
40
+ }
41
+ case props.width:
42
+ return {
43
+ width: `${size.value.width}px`,
44
+ }
45
+ case props.height:
46
+ return {
47
+ height: `${size.value.height}px`,
48
+ }
49
+ }
50
+ } else {
51
+ return undefined
52
+ }
53
+ })
54
+
55
+ useMutationObserver(
56
+ elRef,
57
+ (mutations) => {
58
+ const addedNodes: HTMLElement[] = mutations
59
+ .flatMap((m) => [...m.addedNodes])
60
+ .filter((n) => n instanceof HTMLElement)
61
+ .map((n) => n as HTMLElement)
62
+
63
+ content.value = addedNodes[0]
64
+ },
65
+ {
66
+ childList: true,
67
+ }
68
+ )
69
+
70
+ useResizeObserver(content, () => {
71
+ if (content.value) {
72
+ size.value = {
73
+ width: content.value.offsetWidth,
74
+ height: content.value.offsetHeight,
75
+ }
76
+ }
77
+ })
78
+
79
+ onMounted(() => {
80
+ if (elRef.value) {
81
+ const content = elRef.value.querySelector('*')
82
+ if (content instanceof HTMLElement) {
83
+ size.value = {
84
+ width: content.offsetWidth,
85
+ height: content.offsetHeight,
86
+ }
87
+ }
88
+ }
89
+ })
90
+ </script>
91
+
92
+ <style>
93
+ .magic-auto-size{--magic-auto-size-transition-function:ease;--magic-auto-size-transition-duration:100ms;height:var(--magic-auto-size-height);transition:all var(--magic-auto-size-transition-duration) var(--magic-auto-size-transition-function);width:var(--magic-auto-size-width)}
94
+ </style>
package/dist/plugins/MagicAutoSize/src/components/MagicAutoSize.vue.d.ts ADDED
@@ -0,0 +1,40 @@
1
+ interface MagicAutoSizeProps {
2
+ width?: boolean;
3
+ height?: boolean;
4
+ }
5
+ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<MagicAutoSizeProps>, {
6
+ width: boolean;
7
+ height: boolean;
8
+ }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<MagicAutoSizeProps>, {
9
+ width: boolean;
10
+ height: boolean;
11
+ }>>>, {
12
+ width: boolean;
13
+ height: boolean;
14
+ }, {}>, {
15
+ default?(_: {}): any;
16
+ }>;
17
+ export default _default;
18
+
19
+ type __VLS_WithDefaults<P, D> = {
20
+ [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
21
+ default: D[K];
22
+ }> : P[K];
23
+ };
24
+ type __VLS_Prettify<T> = {
25
+ [K in keyof T]: T[K];
26
+ } & {};
27
+ type __VLS_WithTemplateSlots<T, S> = T & {
28
+ new (): {
29
+ $slots: S;
30
+ };
31
+ };
32
+ type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
33
+ type __VLS_TypePropsToOption<T> = {
34
+ [K in keyof T]-?: {} extends Pick<T, K> ? {
35
+ type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
36
+ } : {
37
+ type: import('vue').PropType<T[K]>;
38
+ required: true;
39
+ };
40
+ };
package/dist/plugins/MagicCommand/src/components/MagicCommandBody.vue.d.ts CHANGED
@@ -2,7 +2,6 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{}
2
2
  default?(_: {}): any;
3
3
  }>;
4
4
  export default _default;
5
-
6
5
  type __VLS_WithTemplateSlots<T, S> = T & {
7
6
  new (): {
8
7
  $slots: S;
package/dist/plugins/MagicPlayer/src/components/MagicPlayerControls.vue CHANGED
@@ -146,5 +146,5 @@ const hidden = computed(() => {
146
146
  </script>
147
147
 
148
148
  <style>
149
- :root{--magic-player-controls-height:3rem;--magic-player-controls-padding:0.75rem;--magic-player-controls-bottom:1.5rem;--magic-player-controls-left:1.5rem;--magic-player-controls-width:calc(100% - var(--magic-player-controls-left)*2);--magic-player-controls-gap:1rem;--magic-player-controls-border-radius:50rem;--magic-player-controls-background:rgba(32,32,32,.8);--magic-player-controls-backdrop-filter:blur(80px);--magic-player-controls-color:#fff;--magic-player-controls-button-width:3rem;--magic-player-controls-icon-width:1.25rem}@media (max-width:640px){:root{--magic-player-controls-height:2.5rem;--magic-player-controls-bottom:0.75rem;--magic-player-controls-padding:0.5rem}}.magic-player-controls{inset:0;pointer-events:none;position:absolute;width:100%}.magic-player-controls-enter-active{animation:fade-up-in .15s ease}.magic-player-controls-leave-active{animation:fade-up-out .15s ease}.magic-player-controls__bar{align-items:flex-start;bottom:var(--magic-player-controls-bottom);display:flex;flex-direction:column;gap:var(--magic-player-controls-gap);left:var(--magic-player-controls-left);margin:0 auto;pointer-events:auto;position:absolute;width:var(--magic-player-controls-width)}.magic-player-controls__bar--inner{align-items:center;-webkit-backdrop-filter:var(--magic-player-controls-backdrop-filter);backdrop-filter:var(--magic-player-controls-backdrop-filter);background-color:var(--magic-player-controls-background);border-radius:var(--magic-player-controls-border-radius);box-sizing:border-box;color:var(--magic-player-controls-color);display:flex;height:var(--magic-player-controls-height);padding:0 var(--magic-player-controls-padding);width:100%}.magic-player-controls__item{align-items:center;display:inline-flex;-webkit-user-select:none;-moz-user-select:none;user-select:none}.magic-player-controls__item.-shrink-0{flex-shrink:0}.magic-player-controls__item.-grow{flex-grow:1}.magic-player-controls__item button{align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:0;border-radius:0;color:inherit;cursor:pointer;display:flex;height:var(--magic-player-controls-height);justify-content:center;outline:none;padding:0;width:var(--magic-player-controls-button-width)}.magic-player-controls__item button svg{display:block;height:auto;width:var(--magic-player-controls-icon-width)}.magic-player-controls__timeline{width:100%}.magic-player-controls.-standalone{inset:unset;position:relative;--magic-player-controls-width:100%;--magic-player-controls-bottom:0;--magic-player-controls-left:0;--magic-player-controls-padding:0;--magic-player-controls-background:unset;--magic-player-controls-border-radius:unset;--magic-player-controls-background:transparent;--magic-player-controls-backdrop-filter:none;--magic-player-controls-transition-duration:unset;--magic-player-controls-transition-timing-function:unset}.magic-player-controls.-standalone .magic-player-controls__bar{position:relative}
149
+ :root{--magic-player-controls-height:3rem;--magic-player-controls-padding:0.75rem;--magic-player-controls-bottom:1.5rem;--magic-player-controls-left:1.5rem;--magic-player-controls-width:calc(100% - var(--magic-player-controls-left)*2);--magic-player-controls-gap:1rem;--magic-player-controls-border-radius:50rem;--magic-player-controls-background:rgba(32,32,32,.8);--magic-player-controls-backdrop-filter:blur(80px);--magic-player-controls-color:#fff;--magic-player-controls-button-width:3rem;--magic-player-controls-icon-width:1.25rem}@media (max-width:640px){:root{--magic-player-controls-height:2.5rem;--magic-player-controls-bottom:0.75rem;--magic-player-controls-padding:0.5rem}}.magic-player-controls{inset:0;pointer-events:none;position:absolute;width:100%}.magic-player-controls-enter-active{animation:fade-up-in .15s ease}.magic-player-controls-leave-active{animation:fade-up-out .15s ease}.magic-player-controls__bar{align-items:flex-start;bottom:var(--magic-player-controls-bottom);display:flex;flex-direction:column;gap:var(--magic-player-controls-gap);left:var(--magic-player-controls-left);margin:0 auto;pointer-events:auto;position:absolute;width:var(--magic-player-controls-width)}.magic-player-controls__bar--inner{align-items:center;-webkit-backdrop-filter:var(--magic-player-controls-backdrop-filter);backdrop-filter:var(--magic-player-controls-backdrop-filter);background-color:var(--magic-player-controls-background);border-radius:var(--magic-player-controls-border-radius);box-sizing:border-box;color:var(--magic-player-controls-color);display:flex;height:var(--magic-player-controls-height);padding:0 var(--magic-player-controls-padding);width:100%}.magic-player-controls__item{align-items:center;display:inline-flex;-webkit-user-select:none;-moz-user-select:none;user-select:none}.magic-player-controls__item.-shrink-0{flex-shrink:0}.magic-player-controls__item.-grow{flex-grow:1}.magic-player-controls__item button{align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:0;border-radius:0;color:inherit;cursor:pointer;display:flex;height:var(--magic-player-controls-height);justify-content:center;outline:none;padding:0;width:var(--magic-player-controls-button-width)}.magic-player-controls__item button svg{display:block;height:auto;width:var(--magic-player-controls-icon-width)}.magic-player-controls__timeline{width:100%}.magic-player-controls.-standalone{inset:unset;position:relative;--magic-player-controls-width:100%;--magic-player-controls-bottom:0;--magic-player-controls-left:0;--magic-player-controls-padding:0;--magic-player-controls-background:unset;--magic-player-controls-border-radius:unset;--magic-player-controls-background:transparent;--magic-player-controls-backdrop-filter:none}.magic-player-controls.-standalone .magic-player-controls__bar{position:relative}
150
150
  </style>
package/dist/plugins/index.d.ts CHANGED
@@ -1,3 +1,4 @@
1
+ export * from './MagicAutoSize/index.js';
1
2
  export * from './MagicCommand/index.js';
2
3
  export * from './MagicCookie/index.js';
3
4
  export * from './MagicDraggable/index.js';
package/dist/plugins/index.mjs CHANGED
@@ -1,3 +1,4 @@
1
+ export * from "./MagicAutoSize/index.mjs";
1
2
  export * from "./MagicCommand/index.mjs";
2
3
  export * from "./MagicCookie/index.mjs";
3
4
  export * from "./MagicDraggable/index.mjs";
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.29.8",
4
+ "version": "0.30.0",
5
5
  "author": "Robin Scholz <https://github.com/robinscholz>, Christoph Jeworutzki <https://github.com/ChristophJeworutzki>",
6
6
  "devDependencies": {
7
7
  "@antfu/ni": "^0.21.12",