@maas/vue-equipment 1.0.0-beta.13 → 1.0.0-beta.15

package/dist/plugins/MagicScroll/src/components/MagicScrollProvider.vue

@@ -1,40 +1,36 @@
-<script>
-import { defineComponent as _defineComponent } from "vue";
-import { unref as _unref, renderSlot as _renderSlot, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";
-const _hoisted_1 = { class: "magic-scroll-provider" };
+<template>
+  <div class="magic-scroll-provider">
+    <slot :scroll-return="scrollReturn" />
+  </div>
+</template>
+
+<script setup>
 import { provide, computed } from "vue";
 import { useScroll, unrefElement } from "@vueuse/core";
 import { MagicScrollReturn, MagicScrollTarget } from "../symbols";
-export default /* @__PURE__ */ _defineComponent({
-  __name: "MagicScrollProvider",
-  props: {
-    target: { type: null, required: false }
-  },
-  setup(__props) {
-    const mappedTarget = computed(() => {
-      switch (true) {
-        case !!__props.target:
-          return unrefElement(__props.target);
-        case typeof window !== "undefined":
-          return window;
-        default:
-          return void 0;
-      }
-    });
-    const providedTarget = computed(() => {
-      if (__props.target) {
-        return unrefElement(__props.target);
-      }
+const { target } = defineProps({
+  target: {
+    type: null,
+    required: false
+  }
+});
+const mappedTarget = computed(() => {
+  switch (true) {
+    case !!target:
+      return unrefElement(target);
+    case typeof window !== "undefined":
+      return window;
+    default:
       return void 0;
-    });
-    const scrollReturn = useScroll(mappedTarget);
-    provide(MagicScrollReturn, scrollReturn);
-    provide(MagicScrollTarget, providedTarget);
-    return (_ctx, _cache) => {
-      return _openBlock(), _createElementBlock("div", _hoisted_1, [
-        _renderSlot(_ctx.$slots, "default", { scrollReturn: _unref(scrollReturn) })
-      ]);
-    };
   }
 });
+const providedTarget = computed(() => {
+  if (target) {
+    return unrefElement(target);
+  }
+  return void 0;
+});
+const scrollReturn = useScroll(mappedTarget);
+provide(MagicScrollReturn, scrollReturn);
+provide(MagicScrollTarget, providedTarget);
 </script>

package/dist/plugins/MagicScroll/src/components/MagicScrollScene.vue

@@ -1,10 +1,10 @@
-<script>
-import { defineComponent as _defineComponent } from "vue";
-import { renderSlot as _renderSlot, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";
-const _hoisted_1 = {
-  ref: "el",
-  class: "magic-scroll-scene"
-};
+<template>
+  <div ref="el" class="magic-scroll-scene">
+    <slot :progress="progress" />
+  </div>
+</template>
+
+<script setup>
 import {
   shallowRef,
   provide,
@@ -21,69 +21,59 @@ import {
   MagicScrollProgress,
   MagicScrollReturn
 } from "../symbols";
-export default /* @__PURE__ */ _defineComponent({
-  __name: "MagicScrollScene",
-  props: {
-    from: { type: String, required: false, default: "top-bottom" },
-    to: { type: String, required: false, default: "bottom-top" }
+const { from = "top-bottom", to = "bottom-top" } = defineProps({
+  from: {
+    type: String,
+    required: false
   },
-  setup(__props) {
-    const scrollReturn = inject(MagicScrollReturn, void 0);
-    const scrollTarget = inject(MagicScrollTarget, void 0);
-    if (!scrollTarget) {
-      console.error("MagicScrollScene must be used within a MagicScrollProvider");
-    }
-    const progress = shallowRef(0);
-    const intersecting = shallowRef(false);
-    const elRef = useTemplateRef("el");
-    const { getCalculations, getProgress } = useScrollApi({
-      child: elRef,
-      parent: scrollTarget,
-      from: __props.from,
-      to: __props.to
-    });
-    async function calculate() {
-      getCalculations();
-      await nextTick();
-      progress.value = getProgress();
-    }
-    watch(
-      () => scrollReturn?.y.value,
-      () => {
-        if (intersecting.value) {
-          calculate();
-        }
-      }
-    );
-    watch(
-      () => scrollReturn?.y.value,
-      () => {
-        calculate();
-      },
-      { once: true }
-    );
-    useIntersectionObserver(
-      elRef,
-      ([{ isIntersecting }]) => {
-        intersecting.value = isIntersecting;
-        if (isIntersecting) {
-          calculate();
-        }
-      },
-      { rootMargin: "150% 0px 150% 0px", immediate: true }
-    );
-    provide(MagicScrollProgress, readonly(progress));
-    return (_ctx, _cache) => {
-      return _openBlock(), _createElementBlock(
-        "div",
-        _hoisted_1,
-        [
-          _renderSlot(_ctx.$slots, "default", { progress: progress.value })
-        ],
-        512
-        /* NEED_PATCH */
-      );
-    };
+  to: {
+    type: String,
+    required: false
   }
 });
+const scrollReturn = inject(MagicScrollReturn, void 0);
+const scrollTarget = inject(MagicScrollTarget, void 0);
+if (!scrollTarget) {
+  console.error("MagicScrollScene must be used within a MagicScrollProvider");
+}
+const progress = shallowRef(0);
+const intersecting = shallowRef(false);
+const elRef = useTemplateRef("el");
+const { getCalculations, getProgress } = useScrollApi({
+  child: elRef,
+  parent: scrollTarget,
+  from,
+  to
+});
+async function calculate() {
+  getCalculations();
+  await nextTick();
+  progress.value = getProgress();
+}
+watch(
+  () => scrollReturn?.y.value,
+  () => {
+    if (intersecting.value) {
+      calculate();
+    }
+  }
+);
+watch(
+  () => scrollReturn?.y.value,
+  () => {
+    calculate();
+  },
+  { once: true }
+);
+useIntersectionObserver(
+  elRef,
+  ([{ isIntersecting }]) => {
+    intersecting.value = isIntersecting;
+    if (isIntersecting) {
+      calculate();
+    }
+  },
+  { rootMargin: "150% 0px 150% 0px", immediate: true }
+);
+provide(MagicScrollProgress, readonly(progress));
 </script>

package/dist/plugins/MagicToast/src/components/MagicToastProvider.vue

@@ -1,7 +1,47 @@
-<script>
-import { defineComponent as _defineComponent } from "vue";
-import { unref as _unref, renderList as _renderList, Fragment as _Fragment, openBlock as _openBlock, createElementBlock as _createElementBlock, resolveDynamicComponent as _resolveDynamicComponent, mergeProps as _mergeProps, createBlock as _createBlock, withCtx as _withCtx, TransitionGroup as _TransitionGroup, createVNode as _createVNode, createElementVNode as _createElementVNode, Teleport as _Teleport } from "vue";
-const _hoisted_1 = ["data-id", "data-position", "data-expanded"];
+<template>
+  <teleport
+    :to="state.options.teleport?.target"
+    :disabled="state.options.teleport?.disabled"
+  >
+    <div
+      :data-id="mappedId"
+      :data-position="state.options.position"
+      :data-expanded="state.expanded"
+      class="magic-toast-provider"
+      v-bind="$attrs"
+    >
+      <transition-group
+        ref="list"
+        tag="ol"
+        class="magic-toast-provider__list"
+        :name="state.options.transition"
+        :on-before-enter="onBeforeEnter"
+        :on-enter="onEnter"
+        :on-after-enter="onAfterEnter"
+        :on-before-leave="onBeforeLeave"
+        :on-leave="onLeave"
+        :on-after-leave="onAfterLeave"
+        @mouseenter="onMouseenter"
+        @mouseleave="onMouseleave"
+      >
+        <magic-toast-view
+          v-for="(view, index) in state.views"
+          :id="view.id"
+          :key="view.id"
+          :index="index"
+        >
+          <component
+            :is="view.component"
+            v-bind="view.props"
+            @remove="deleteView(view.id)"
+          />
+        </magic-toast-view>
+      </transition-group>
+    </div>
+  </teleport>
+</template>
+
+<script setup>
 import {
   toValue,
   useTemplateRef,
@@ -13,7 +53,6 @@ import { onClickOutside } from "@vueuse/core";
 import { useToastState } from "../composables/private/useToastState";
 import { useToastView } from "../composables/private/useToastView";
 import { useToastCallback } from "../composables/private/useToastCallback";
-import MagicToastView from "./MagicToastView.vue";
 import { MagicToastInstanceId } from "../../symbols";
 import "@maas/vue-equipment/utils/css/animations/fade-out.css";
 import "@maas/vue-equipment/utils/css/animations/squash-y.css";
@@ -22,99 +61,47 @@ import "@maas/vue-equipment/utils/css/animations/slide-ltr-out.css";
 import "@maas/vue-equipment/utils/css/animations/slide-rtl-in.css";
 import "@maas/vue-equipment/utils/css/animations/slide-rtl-out.css";
 import { useToastListener } from "../composables/private/useToastListener";
-export default /* @__PURE__ */ _defineComponent({
-  ...{
-    inheritAttrs: false
+const { id, options } = defineProps({
+  id: {
+    type: null,
+    required: true
   },
-  __name: "MagicToastProvider",
-  props: {
-    id: { type: null, required: true },
-    options: { type: Object, required: false }
+  options: {
+    type: Object,
+    required: false
+  }
+});
+const mappedId = toValue(id);
+defineOptions({
+  inheritAttrs: false
+});
+const { deleteView } = useToastView(id);
+const { deleteState, initializeState } = useToastState(id);
+const state = initializeState(options);
+const listRef = useTemplateRef("list");
+const {
+  onBeforeEnter,
+  onEnter,
+  onAfterEnter,
+  onBeforeLeave,
+  onLeave,
+  onAfterLeave
+} = useToastCallback(id);
+const { onMouseenter, onMouseleave, outsideClickCallback } = useToastListener(id);
+onClickOutside(listRef, outsideClickCallback);
+watch(
+  () => options,
+  (value) => {
+    initializeState(value);
   },
-  setup(__props) {
-    const { deleteView } = useToastView(__props.id);
-    const { deleteState, initializeState } = useToastState(__props.id);
-    const state = initializeState(__props.options);
-    const listRef = useTemplateRef("list");
-    const {
-      onBeforeEnter,
-      onEnter,
-      onAfterEnter,
-      onBeforeLeave,
-      onLeave,
-      onAfterLeave
-    } = useToastCallback(__props.id);
-    const { onMouseenter, onMouseleave, outsideClickCallback } = useToastListener(__props.id);
-    onClickOutside(listRef, outsideClickCallback);
-    watch(
-      () => __props.options,
-      (value) => {
-        initializeState(value);
-      },
-      {
-        deep: true
-      }
-    );
-    onBeforeUnmount(() => {
-      deleteState();
-    });
-    provide(MagicToastInstanceId, __props.id);
-    return (_ctx, _cache) => {
-      return _openBlock(), _createBlock(_Teleport, {
-        to: _unref(state).options.teleport?.target,
-        disabled: _unref(state).options.teleport?.disabled
-      }, [
-        _createElementVNode("div", _mergeProps({
-          "data-id": toValue(_ctx.id),
-          "data-position": _unref(state).options.position,
-          "data-expanded": _unref(state).expanded,
-          class: "magic-toast-provider"
-        }, _ctx.$attrs), [
-          _createVNode(_TransitionGroup, {
-            ref: "list",
-            tag: "ol",
-            class: "magic-toast-provider__list",
-            name: _unref(state).options.transition,
-            "on-before-enter": _unref(onBeforeEnter),
-            "on-enter": _unref(onEnter),
-            "on-after-enter": _unref(onAfterEnter),
-            "on-before-leave": _unref(onBeforeLeave),
-            "on-leave": _unref(onLeave),
-            "on-after-leave": _unref(onAfterLeave),
-            onMouseenter: _unref(onMouseenter),
-            onMouseleave: _unref(onMouseleave)
-          }, {
-            default: _withCtx(() => [
-              (_openBlock(true), _createElementBlock(
-                _Fragment,
-                null,
-                _renderList(_unref(state).views, (view, index) => {
-                  return _openBlock(), _createBlock(MagicToastView, {
-                    id: view.id,
-                    key: view.id,
-                    index
-                  }, {
-                    default: _withCtx(() => [
-                      (_openBlock(), _createBlock(_resolveDynamicComponent(view.component), _mergeProps({ ref_for: true }, view.props, {
-                        onRemove: ($event) => _unref(deleteView)(view.id)
-                      }), null, 16, ["onRemove"]))
-                    ]),
-                    _: 2
-                    /* DYNAMIC */
-                  }, 1032, ["id", "index"]);
-                }),
-                128
-                /* KEYED_FRAGMENT */
-              ))
-            ]),
-            _: 1
-            /* STABLE */
-          }, 8, ["name", "on-before-enter", "on-enter", "on-after-enter", "on-before-leave", "on-leave", "on-after-leave", "onMouseenter", "onMouseleave"])
-        ], 16, _hoisted_1)
-      ], 8, ["to", "disabled"]);
-    };
+  {
+    deep: true
   }
+);
+onBeforeUnmount(() => {
+  deleteState();
 });
+provide(MagicToastInstanceId, id);
 </script>
 
 <style>

package/dist/plugins/MagicToast/src/components/MagicToastView.vue

@@ -1,81 +1,63 @@
-<script>
-import { defineComponent as _defineComponent } from "vue";
-import { unref as _unref, renderSlot as _renderSlot, normalizeStyle as _normalizeStyle, createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";
-const _hoisted_1 = ["data-id", "data-expanded", "data-dragging", "data-position", "data-debug"];
+<template>
+  <li
+    class="magic-toast-view"
+    :data-id="id"
+    :data-expanded="state.expanded"
+    :data-dragging="view.dragging"
+    :data-position="state.options.position"
+    :data-debug="state.options.debug"
+    :style="{
+  '--mt-index': reversedIndex,
+  '--mt-offset': offset,
+  '--mt-height': height
+}"
+  >
+    <div
+      class="magic-toast-view__inner"
+      @pointerdown="onPointerdown"
+      @click="onClick"
+    >
+      <div :style="style" class="magic-toast-view__drag">
+        <slot />
+      </div>
+    </div>
+  </li>
+</template>
+
+<script setup>
 import { computed, inject } from "vue";
 import { MagicToastInstanceId } from "../../symbols";
 import { useToastState } from "../composables/private/useToastState";
 import { useToastDrag } from "../composables/private/useToastDrag";
 import "@maas/vue-equipment/utils/css/transitions/fade.css";
-export default /* @__PURE__ */ _defineComponent({
-  __name: "MagicToastView",
-  props: {
-    id: { type: String, required: true },
-    index: { type: Number, required: true }
+const { id, index } = defineProps({
+  id: {
+    type: String,
+    required: true
   },
-  setup(__props) {
-    const instanceId = inject(MagicToastInstanceId, void 0);
-    if (!instanceId) {
-      throw new Error("MagicToastView must be used within a MagicToastProvider");
-    }
-    const { initializeState } = useToastState(instanceId);
-    const state = initializeState();
-    const count = computed(() => state.views.length);
-    const view = computed(() => state.views[__props.index]);
-    const reversedIndex = computed(() => count.value - __props.index - 1);
-    const height = computed(() => `${view.value.dimensions?.height}px`);
-    const offset = computed(() => {
-      const mapped = state.views.slice(0, reversedIndex.value).reduce((acc, view2) => acc + (view2.dimensions?.height ?? 0), 0);
-      return `${mapped}px`;
-    });
-    const { style, onPointerdown, onClick } = useToastDrag({
-      view: view.value,
-      instanceId
-    });
-    return (_ctx, _cache) => {
-      return _openBlock(), _createElementBlock("li", {
-        class: "magic-toast-view",
-        "data-id": _ctx.id,
-        "data-expanded": _unref(state).expanded,
-        "data-dragging": view.value.dragging,
-        "data-position": _unref(state).options.position,
-        "data-debug": _unref(state).options.debug,
-        style: _normalizeStyle({
-          "--mt-index": reversedIndex.value,
-          "--mt-offset": offset.value,
-          "--mt-height": height.value
-        })
-      }, [
-        _createElementVNode(
-          "div",
-          {
-            class: "magic-toast-view__inner",
-            onPointerdown: _cache[0] || (_cache[0] = //@ts-ignore
-            (...args) => _unref(onPointerdown) && _unref(onPointerdown)(...args)),
-            onClick: _cache[1] || (_cache[1] = //@ts-ignore
-            (...args) => _unref(onClick) && _unref(onClick)(...args))
-          },
-          [
-            _createElementVNode(
-              "div",
-              {
-                style: _normalizeStyle(_unref(style)),
-                class: "magic-toast-view__drag"
-              },
-              [
-                _renderSlot(_ctx.$slots, "default")
-              ],
-              4
-              /* STYLE */
-            )
-          ],
-          32
-          /* NEED_HYDRATION */
-        )
-      ], 12, _hoisted_1);
-    };
+  index: {
+    type: Number,
+    required: true
   }
 });
+const instanceId = inject(MagicToastInstanceId, void 0);
+if (!instanceId) {
+  throw new Error("MagicToastView must be used within a MagicToastProvider");
+}
+const { initializeState } = useToastState(instanceId);
+const state = initializeState();
+const count = computed(() => state.views.length);
+const view = computed(() => state.views[index]);
+const reversedIndex = computed(() => count.value - index - 1);
+const height = computed(() => `${view.value.dimensions?.height}px`);
+const offset = computed(() => {
+  const mapped = state.views.slice(0, reversedIndex.value).reduce((acc, view2) => acc + (view2.dimensions?.height ?? 0), 0);
+  return `${mapped}px`;
+});
+const { style, onPointerdown, onClick } = useToastDrag({
+  view: view.value,
+  instanceId
+});
 </script>
 
 <style>

package/dist/plugins/MagicToast/src/components/MagicToastView.vue.d.ts

@@ -3,8 +3,8 @@ interface MagicToastViewProps {
     id: string;
     index: number;
 }
-declare const state: import("../types").ToastState;
-declare const view: import("vue").ComputedRef<import("../types").ToastView>;
+declare const state: import("../types/index.js").ToastState;
+declare const view: import("vue").ComputedRef<import("../types/index.js").ToastView>;
 declare const reversedIndex: import("vue").ComputedRef<number>;
 declare const height: import("vue").ComputedRef<string>;
 declare const offset: import("vue").ComputedRef<string>;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@maas/vue-equipment",
   "description": "Our Frontend Toolkit, Free and Open Source",
-  "version": "1.0.0-beta.13",
+  "version": "1.0.0-beta.15",
   "contributors": [
     {
       "name": "Robin Scholz",

package/dist/plugins/MagicAccordion/demo/data/footer.json

@@ -1,117 +0,0 @@
-{
-  "footer": [
-    {
-      "label": "Catalogue",
-      "list": [
-        {
-          "url": "https://maas.engineering/mirror-ui",
-          "label": "Mirror Ui",
-          "badge": {
-            "name": "Pro",
-            "variant": "info",
-            "mode": "translucent"
-          },
-
-          "icon": "maas-mr"
-        },
-        {
-          "url": "https://maas.engineering/dreamtype",
-          "label": "Dreamtype™",
-          "badge": {
-            "name": "Soon",
-            "variant": "primary",
-            "mode": "outline"
-          },
-
-          "icon": "maas-dt"
-        },
-        {
-          "url": "https://maas.engineering/azzets",
-          "label": "Azzets",
-          "badge": {
-            "name": "Soon",
-            "variant": "primary",
-            "mode": "outline"
-          },
-          "icon": "maas-az"
-        }
-      ]
-    },
-    {
-      "label": "Open Source",
-      "list": [
-        {
-          "url": "https://maas.engineering/vue-equipment",
-          "label": "Vue Equipment",
-
-          "icon": "maas-ve"
-        },
-
-        {
-          "url": "https://maas.engineering/open-foundry",
-          "label": "Open Foundry",
-          "badge": {
-            "name": "Soon",
-            "variant": "primary",
-            "mode": "outline"
-          },
-          "icon": "maas-of"
-        }
-      ]
-    },
-    {
-      "label": "Company",
-      "list": [
-        {
-          "url": "https://maas.engineering/blog",
-          "label": "Readme",
-          "badge": {
-            "name": "Blog",
-            "variant": "primary",
-            "mode": "outline"
-          },
-          "icon": "edit-alt"
-        },
-        {
-          "url": "https://maas.engineering/about",
-          "label": "About us",
-          "icon": "maas-robot"
-        },
-
-        {
-          "url": "https://maas.engineering/contact",
-          "label": "Contact",
-          "icon": "maas-robot"
-        }
-      ]
-    },
-    {
-      "label": "Community",
-      "list": [
-        {
-          "url": "https://github.com/magicasaservice",
-          "label": "GitHub"
-        },
-
-        {
-          "url": "https://figma.com",
-          "label": "Figma"
-        }
-      ]
-    },
-    {
-      "label": "Legal",
-      "list": [
-        {
-          "url": "https://maas.engineering/legal-notice",
-          "label": "Legal Notice"
-        },
-
-        {
-          "url": "https://maas.engineering/privacy-policy",
-          "label": "Privacy Policy"
-        }
-      ]
-    }
-  ]
-}

package/dist/plugins/MagicCommand/demo/data/about.json

@@ -1,3 +0,0 @@
-{
-  "about": "Magic as a Service™ is a creative engineering company founded by the experience design studio International Magic. Our mission is to innovate on digital products and services to equip others with the tools and capabilities we wish we had ourselves. By combining design, engineering and culture into one stream, we produce powerful and sustainable outcomes for our users and clients."
-}