@maas/vue-equipment 0.39.2 → 1.0.0-beta.1

package/dist/plugins/MagicAccordion/src/components/MagicAccordionView.vue

@@ -1,54 +1,55 @@
-<template>
-  <primitive
-    :as-child="asChild"
-    :class="['magic-accordion-view', { '-active': view.active }]"
-  >
-    <slot :is-active="view?.active" />
-  </primitive>
-</template>
-
-<script lang="ts" setup>
-import { computed, inject, onBeforeUnmount, provide, useId } from 'vue'
-import { Primitive } from '@maas/vue-primitive'
+<script>
+import { defineComponent as _defineComponent } from "vue";
+import { unref as _unref, renderSlot as _renderSlot, withCtx as _withCtx, openBlock as _openBlock, createBlock as _createBlock } from "vue";
+import { computed, inject, onBeforeUnmount, provide, useId } from "vue";
+import { Primitive } from "@maas/vue-primitive";
 import {
   MagicAccordionInstanceId,
   MagicAccordionViewActive,
-  MagicAccordionViewId,
-} from '../symbols'
-import { useAccordionView } from '../composables/private/useAccordionView'
-
-interface MagicAccordionViewProps {
-  asChild?: boolean
-  id?: string
-  activeOnMounted?: boolean
-}
-
-const props = defineProps<MagicAccordionViewProps>()
-
-const instanceId = inject(MagicAccordionInstanceId, undefined)
-
-if (!instanceId) {
-  throw new Error(
-    'MagicAccordionView must be nested inside MagicAccordionProvider'
-  )
-}
-
-const mappedId = computed(() => props.id ?? `magic-accordion-view-${useId()}`)
-
-// Register view
-const { initializeView, deleteView } = useAccordionView(instanceId)
-
-const view = initializeView({
-  id: mappedId.value,
-  active: props.activeOnMounted ?? false,
-})
-
-// Pass id and active state to children
-provide(MagicAccordionViewId, mappedId.value)
-provide(MagicAccordionViewActive, view.active)
-
-// Lifecycle
-onBeforeUnmount(() => {
-  deleteView(mappedId.value)
-})
+  MagicAccordionViewId
+} from "../symbols";
+import { useAccordionView } from "../composables/private/useAccordionView";
+export default /* @__PURE__ */ _defineComponent({
+  __name: "MagicAccordionView",
+  props: {
+    id: { type: String, required: false },
+    asChild: { type: Boolean, required: false },
+    active: { type: Boolean, required: false }
+  },
+  setup(__props) {
+    const instanceId = inject(MagicAccordionInstanceId, void 0);
+    if (!instanceId) {
+      throw new Error(
+        "MagicAccordionView must be nested inside MagicAccordionProvider"
+      );
+    }
+    const mappedId = computed(() => __props.id ?? `magic-accordion-view-${useId()}`);
+    const mappedActive = computed(() => view.active);
+    const { initializeView, deleteView } = useAccordionView(instanceId);
+    const view = initializeView({
+      id: mappedId.value,
+      active: __props.active ?? false
+    });
+    provide(MagicAccordionViewId, mappedId.value);
+    provide(MagicAccordionViewActive, mappedActive);
+    onBeforeUnmount(() => {
+      deleteView(mappedId.value);
+    });
+    return (_ctx, _cache) => {
+      return _openBlock(), _createBlock(_unref(Primitive), {
+        "as-child": _ctx.asChild,
+        "data-active": _unref(view)?.active,
+        class: "magic-accordion-view"
+      }, {
+        default: _withCtx(() => [
+          _renderSlot(_ctx.$slots, "default", {
+            viewActive: _unref(view)?.active
+          })
+        ]),
+        _: 3
+        /* FORWARDED */
+      }, 8, ["as-child", "data-active"]);
+    };
+  }
+});
 </script>

package/dist/plugins/MagicAccordion/src/components/MagicAccordionView.vue.d.ts

@@ -1,22 +1,31 @@
 interface MagicAccordionViewProps {
-    asChild?: boolean;
     id?: string;
-    activeOnMounted?: boolean;
+    asChild?: boolean;
+    active?: boolean;
 }
 declare function __VLS_template(): {
     attrs: Partial<{}>;
     slots: {
         default?(_: {
-            isActive: boolean;
+            viewActive: boolean;
         }): any;
     };
     refs: {};
     rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import("vue").DefineComponent<MagicAccordionViewProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<MagicAccordionViewProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_component: import("vue").DefineComponent<import("vue").ExtractPropTypes<__VLS_TypePropsToOption<MagicAccordionViewProps>>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToOption<MagicAccordionViewProps>>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToOption<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
 type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;

package/dist/plugins/MagicAccordion/src/composables/private/useAccordionCallback.d.ts

@@ -4,11 +4,11 @@ type UseModalCallbackArgs = {
     instanceId: MaybeRef<string>;
 };
 export declare function useAccordionCallback(args: UseModalCallbackArgs): {
-    onBeforeEnter: (_el?: Element) => void;
-    onEnter: (_el?: Element) => void;
-    onAfterEnter: (_el?: Element) => Promise<void>;
-    onBeforeLeave: (_el?: Element) => void;
-    onLeave: (_el?: Element) => void;
-    onAfterLeave: (_el?: Element) => void;
+    onBeforeEnter: () => void;
+    onEnter: () => void;
+    onAfterEnter: () => Promise<void>;
+    onBeforeLeave: () => void;
+    onLeave: () => void;
+    onAfterLeave: () => void;
 };
 export {};

package/dist/plugins/MagicAccordion/src/composables/private/useAccordionCallback.mjs

@@ -3,22 +3,22 @@ import { useMagicEmitter } from "@maas/vue-equipment/plugins";
 export function useAccordionCallback(args) {
   const { viewId, instanceId } = args;
   const emitter = useMagicEmitter();
-  function onBeforeEnter(_el) {
+  function onBeforeEnter() {
     emitter.emit("beforeEnter", { id: toValue(instanceId), viewId });
   }
-  function onEnter(_el) {
+  function onEnter() {
     emitter.emit("enter", { id: toValue(instanceId), viewId });
   }
-  async function onAfterEnter(_el) {
+  async function onAfterEnter() {
     emitter.emit("afterEnter", { id: toValue(instanceId), viewId });
   }
-  function onBeforeLeave(_el) {
+  function onBeforeLeave() {
     emitter.emit("beforeLeave", { id: toValue(instanceId), viewId });
   }
-  function onLeave(_el) {
+  function onLeave() {
     emitter.emit("leave", { id: toValue(instanceId), viewId });
   }
-  function onAfterLeave(_el) {
+  function onAfterLeave() {
     emitter.emit("afterLeave", { id: toValue(instanceId), viewId });
   }
   return {

package/dist/plugins/MagicAccordion/src/composables/private/useAccordionState.mjs

@@ -6,28 +6,28 @@ export function useAccordionState(instanceId) {
   function createState(id) {
     const state = {
       id,
-      options: defaultOptions,
+      options: { ...defaultOptions },
       views: []
     };
     return reactive(state);
   }
   function addState(id) {
-    const instance = createState(id);
-    accordionStateStore.value = [...accordionStateStore.value, instance];
-    return instance;
+    const state = createState(id);
+    accordionStateStore.value = [...accordionStateStore.value, state];
+    return state;
   }
   function initializeState(options) {
-    let instance = accordionStateStore.value.find((instance2) => {
-      return instance2.id === toValue(instanceId);
+    let state = accordionStateStore.value.find((entry) => {
+      return entry.id === toValue(instanceId);
     });
-    if (!instance) {
-      instance = addState(toValue(instanceId));
+    if (!state) {
+      state = addState(toValue(instanceId));
     }
     if (options) {
       const mappedOptions = defu(options, defaultOptions);
-      instance.options = mappedOptions;
+      state.options = mappedOptions;
     }
-    return instance;
+    return state;
   }
   function deleteState() {
     accordionStateStore.value = accordionStateStore.value.filter(

package/dist/plugins/MagicAccordion/src/composables/private/useAccordionView.mjs

@@ -18,10 +18,11 @@ export function useAccordionView(instanceId) {
   }
   function initializeView(args) {
     const { id, active } = args;
-    let instance = getView(id);
-    if (!instance) instance = addView(args);
-    if (active) selectView(id);
-    return instance;
+    const view = getView(id) ?? addView(args);
+    if (active) {
+      selectView(id);
+    }
+    return view;
   }
   function deleteView(id) {
     state.views = state.views?.filter((view) => view.id !== id);
@@ -30,18 +31,18 @@ export function useAccordionView(instanceId) {
     return state.views?.find((view) => view.id === id);
   }
   function selectView(id) {
-    const instance = getView(id);
-    if (instance) {
+    const view = getView(id);
+    if (view) {
       if (state.options.mode === "single") {
         unselectAllViews();
       }
-      instance.active = true;
+      view.active = true;
     }
   }
   function unselectView(id) {
-    const instance = getView(id);
-    if (instance) {
-      instance.active = false;
+    const view = getView(id);
+    if (view) {
+      view.active = false;
     }
   }
   function unselectAllViews() {

package/dist/plugins/MagicAccordion/src/symbols/index.d.ts

@@ -1,5 +1,5 @@
 import type { InjectionKey, MaybeRef } from 'vue';
 declare const MagicAccordionInstanceId: InjectionKey<MaybeRef<string>>;
 declare const MagicAccordionViewId: InjectionKey<string>;
-declare const MagicAccordionViewActive: InjectionKey<boolean>;
+declare const MagicAccordionViewActive: InjectionKey<MaybeRef<boolean>>;
 export { MagicAccordionInstanceId, MagicAccordionViewId, MagicAccordionViewActive, };

package/dist/plugins/MagicAccordion/src/types/index.d.ts

@@ -3,6 +3,10 @@ export interface MagicAccordionOptions {
     mode?: AccordionMode;
     transition?: string;
     disabled?: boolean;
+    animation?: {
+        duration: number;
+        easing: (t: number) => number;
+    };
 }
 export interface AccordionView {
     id: string;

package/dist/plugins/MagicAccordion/src/utils/defaultOptions.d.ts

@@ -1,4 +1,4 @@
 import type { MagicAccordionOptions } from '../types/index.js';
-import type { RequireAllNested } from '@maas/vue-equipment/utils';
-declare const defaultOptions: RequireAllNested<MagicAccordionOptions>;
+import { type RequireAll } from '@maas/vue-equipment/utils';
+declare const defaultOptions: RequireAll<MagicAccordionOptions>;
 export { defaultOptions };

package/dist/plugins/MagicAccordion/src/utils/defaultOptions.mjs

@@ -1,6 +1,11 @@
+import { easeOutQuad } from "@maas/vue-equipment/utils";
 const defaultOptions = {
-  mode: "multiple",
+  mode: "single",
   transition: "magic-accordion",
-  disabled: false
+  disabled: false,
+  animation: {
+    duration: 200,
+    easing: easeOutQuad
+  }
 };
 export { defaultOptions };

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

@@ -0,0 +1,3 @@
+{
+  "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."
+}