@maas/vue-equipment 0.40.0 → 1.0.0-beta.10

package/dist/plugins/MagicScroll/src/composables/private/useCollisionDetect.d.ts

@@ -1,56 +0,0 @@
-import { type MaybeRef } from 'vue';
-import type { MagicScrollCollisionEntry, Offset } from '../../types/index.js';
-type AlertPositions = {
-    top: boolean;
-    bottom: boolean;
-};
-type UseCollisionDetectArgs = {
-    scrollY: MaybeRef<number>;
-    entries: MagicScrollCollisionEntry[];
-    parent: HTMLElement | undefined;
-};
-interface MappedEntry extends Omit<MagicScrollCollisionEntry, 'element'> {
-    element: HTMLElement;
-    alerted: {
-        up: AlertPositions;
-        down: AlertPositions;
-    };
-}
-export declare function useCollisionDetect(args: UseCollisionDetectArgs): {
-    mappedEntries: import("vue").Ref<{
-        element: HTMLElement;
-        alerted: {
-            up: {
-                top: boolean;
-                bottom: boolean;
-            };
-            down: {
-                top: boolean;
-                bottom: boolean;
-            };
-        };
-        data: Record<string, unknown>;
-        offset?: {
-            top: Offset;
-            bottom: Offset;
-        } | undefined;
-    }[], MappedEntry[] | {
-        element: HTMLElement;
-        alerted: {
-            up: {
-                top: boolean;
-                bottom: boolean;
-            };
-            down: {
-                top: boolean;
-                bottom: boolean;
-            };
-        };
-        data: Record<string, unknown>;
-        offset?: {
-            top: Offset;
-            bottom: Offset;
-        } | undefined;
-    }[]>;
-};
-export {};

package/dist/plugins/MagicScroll/src/composables/private/useCollisionDetect.mjs

@@ -1,140 +0,0 @@
-import { ref, watch, computed, toValue } from "vue";
-import { useIntersectionObserver, useWindowSize } from "@vueuse/core";
-import { useMagicEmitter } from "@maas/vue-equipment/plugins";
-export function useCollisionDetect(args) {
-  const { scrollY, entries, parent } = args;
-  const lastScrollY = ref(0);
-  const intersecting = ref();
-  const scrollDirection = ref();
-  const mappedEntries = ref([]);
-  const oppositeScrollDirection = computed(
-    () => scrollDirection.value === "up" ? "down" : "up"
-  );
-  const windowDimensions = useWindowSize();
-  function getOffset(payload) {
-    return typeof payload === "function" ? payload({
-      vh: toValue(windowDimensions.height),
-      vw: toValue(windowDimensions.width)
-    }) : payload ?? 0;
-  }
-  function initialize() {
-    if (!parent) return;
-    mappedEntries.value = entries.map((entry) => {
-      const alerted = {
-        up: {
-          top: false,
-          bottom: false
-        },
-        down: {
-          top: false,
-          bottom: false
-        }
-      };
-      const offset = { top: 0, bottom: 0, ...entry.offset };
-      const element = entry.element ? parent?.querySelector(entry.element) : parent;
-      if (!element) {
-        return void 0;
-      } else {
-        return { ...entry, offset, element, alerted };
-      }
-    }).filter((element) => !!element);
-    useIntersectionObserver(
-      parent.querySelector("*"),
-      ([{ isIntersecting }]) => {
-        intersecting.value = isIntersecting;
-      },
-      { rootMargin: "50% 0px 50% 0px", threshold: 0.01 }
-    );
-    observeAll();
-  }
-  function observeAll() {
-    if (!lastScrollY.value) {
-      lastScrollY.value = toValue(scrollY);
-      resetAll();
-      return;
-    }
-    scrollDirection.value = lastScrollY.value <= toValue(scrollY) ? "down" : "up";
-    lastScrollY.value = toValue(scrollY);
-    let i = mappedEntries.value.length;
-    while (i--) {
-      const entry = mappedEntries.value[i];
-      if (!entry.element) return;
-      const boundingRect = entry.element.getBoundingClientRect();
-      if (scrollDirection.value) {
-        observeEntry({
-          position: "top",
-          direction: scrollDirection.value,
-          boundingRect,
-          entry
-        });
-        observeEntry({
-          position: "bottom",
-          direction: scrollDirection.value,
-          boundingRect,
-          entry
-        });
-        resetEntry({
-          position: "top",
-          direction: oppositeScrollDirection.value,
-          boundingRect,
-          entry
-        });
-        resetEntry({
-          position: "bottom",
-          direction: oppositeScrollDirection.value,
-          boundingRect,
-          entry
-        });
-      }
-    }
-  }
-  function resetAll() {
-    mappedEntries.value = mappedEntries.value.map((entry) => {
-      const alerted = {
-        up: {
-          top: false,
-          bottom: false
-        },
-        down: {
-          top: false,
-          bottom: false
-        }
-      };
-      return { ...entry, alerted };
-    });
-  }
-  function observeEntry(args2) {
-    const { position, direction, boundingRect, entry } = args2;
-    const offset = getOffset(entry.offset[position] ?? 0);
-    if (entry.alerted[direction][position]) return;
-    if (direction === "down" && boundingRect[position] <= offset || direction === "up" && boundingRect[position] >= offset) {
-      entry.alerted[direction][position] = true;
-      useMagicEmitter().emit("collision", {
-        direction,
-        position,
-        element: entry.element,
-        data: entry.data
-      });
-    }
-  }
-  function resetEntry(args2) {
-    const { position, direction, boundingRect, entry } = args2;
-    const offset = getOffset(entry.offset[position] ?? 0);
-    if (!entry.alerted[direction][position]) return;
-    if (direction === "down" && boundingRect[position] >= offset || direction === "up" && boundingRect[position] <= offset) {
-      entry.alerted[direction][position] = false;
-    }
-  }
-  initialize();
-  watch(
-    () => toValue(scrollY),
-    () => {
-      if (intersecting.value) {
-        observeAll();
-      }
-    }
-  );
-  return {
-    mappedEntries
-  };
-}

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

@@ -1,141 +0,0 @@
-<template>
-  <Teleport
-    :key="teleportKey"
-    :to="mappedOptions.teleport?.target"
-    :disabled="mappedOptions.teleport?.disabled"
-  >
-    <div class="magic-toast" :id="toValue(id)" :class="toValue(props.class)">
-      <transition-group
-        tag="ol"
-        ref="listRef"
-        class="magic-toast__inner"
-        :name="mappedOptions.transitions!.list"
-        :on-before-enter="onBeforeEnter"
-        :on-enter="onEnter"
-        :on-after-enter="onAfterEnter"
-        :on-before-leave="onBeforeLeave"
-        :on-leave="onLeave"
-        :on-after-leave="onAfterLeave"
-      >
-        <magic-toast-component
-          v-for="(toast, index) in toasts"
-          :id="toast.id"
-          :key="toast.id"
-          :index="index"
-          :total="count || 0"
-          :siblings="activeToasts"
-          :class="{
-            expanded: isExpanded,
-          }"
-          @mouseenter="onMouseenter"
-          @mouseleave="onMouseleave"
-        >
-          <component
-            :is="toast.component"
-            v-bind="toast.props"
-            @close="toast.remove"
-            @click.self="onClick"
-          />
-        </magic-toast-component>
-      </transition-group>
-    </div>
-  </Teleport>
-</template>
-
-<script setup lang="ts">
-import {
-  toValue,
-  ref,
-  watch,
-  onBeforeMount,
-  onUnmounted,
-  useId,
-  type MaybeRef,
-} from 'vue'
-import { defu } from 'defu'
-import { onClickOutside, type MaybeElement } from '@vueuse/core'
-import { defaultOptions } from './../utils/defaultOptions'
-import { useToastApi } from '../composables/private/useToastApi'
-import { useToastCallback } from './../composables/private/useToastCallback'
-import { useMagicToast } from '../composables/useMagicToast'
-
-import MagicToastComponent from './MagicToastComponent.vue'
-
-import type { MagicToastOptions } from './../types/index'
-
-import '@maas/vue-equipment/utils/css/animations/fade-out.css'
-import '@maas/vue-equipment/utils/css/animations/slide-ltr-in.css'
-import '@maas/vue-equipment/utils/css/animations/slide-rtl-in.css'
-import '@maas/vue-equipment/utils/css/animations/slide-ttb-in.css'
-import '@maas/vue-equipment/utils/css/animations/slide-btt-in.css'
-
-interface MagicToastProps {
-  id: MaybeRef<string>
-  class: MaybeRef<string>
-  options?: MagicToastOptions
-}
-
-const props = defineProps<MagicToastProps>()
-
-const { initialize, destroy } = useToastApi(props.id)
-const { toasts, count, firstToast } = useMagicToast(props.id)
-
-const mappedOptions = defu(props.options, defaultOptions)
-const isExpanded = ref(mappedOptions.layout?.expand === true)
-const teleportKey = ref(useId())
-const listRef = ref<MaybeElement>()
-
-const {
-  onBeforeEnter,
-  onEnter,
-  onAfterEnter,
-  onBeforeLeave,
-  onLeave,
-  onAfterLeave,
-  activeToasts,
-} = useToastCallback({ id: props.id, mappedOptions, count, firstToast })
-
-function onMouseenter() {
-  if (mappedOptions.layout?.expand === 'hover') {
-    isExpanded.value = true
-  }
-}
-
-function onMouseleave() {
-  if (mappedOptions.layout?.expand === 'hover') {
-    isExpanded.value = false
-  }
-}
-
-function onClick() {
-  if (mappedOptions.layout?.expand === 'click') {
-    isExpanded.value = true
-  }
-}
-
-function outsideClickCallback() {
-  if (mappedOptions.layout?.expand === 'click') {
-    isExpanded.value = false
-  }
-}
-
-onClickOutside(listRef, outsideClickCallback)
-
-// Lifecycle hooks and listeners
-watch(
-  () => props.id,
-  () => (teleportKey.value = useId())
-)
-
-onBeforeMount(() => {
-  initialize()
-})
-
-onUnmounted(() => {
-  destroy(toValue(props.id))
-})
-</script>
-
-<style>
-:root{--magic-toast-transform-x:0;--magic-toast-transform-y:0;--magic-toast-padding-x:1rem;--magic-toast-padding-y:1rem;--mt-multiplier-x:1;--mt-multiplier-y:1;--mt-align-items:flex-start;--mt-justify-content:center}.magic-toast{align-items:center;background:transparent;color:inherit;flex-direction:column;inset:0;justify-content:center;pointer-events:none;position:fixed;z-index:var(--magic-toast-z-index,999)}.magic-toast,.magic-toast__inner{display:flex;height:100%;width:100%}.magic-toast__inner{align-items:var(--mt-align-items);justify-content:var(--mt-justify-content);max-height:100%;overflow-x:hidden;overflow-y:auto;position:relative;scrollbar-width:none;-ms-overflow-style:none}.magic-toast__inner::-webkit-scrollbar{display:none}.magic-toast__inner *{pointer-events:all}.magic-toast.-top-center,.magic-toast.-top-left,.magic-toast.-top-right{--magic-toast-transform-y:10;--magic-toast-enter-animation:slide-ttb-in 300ms ease;--mt-multiplier-y:1;--mt-align-items:flex-start}.magic-toast.-top-center .magic-toast-component,.magic-toast.-top-left .magic-toast-component,.magic-toast.-top-right .magic-toast-component{padding-top:var(--magic-toast-padding-y,1rem)}.magic-toast.-bottom-center,.magic-toast.-bottom-left,.magic-toast.-bottom-right{--magic-toast-transform-y:10;--magic-toast-enter-animation:slide-btt-in 300ms ease;--mt-multiplier-y:-1;--mt-align-items:flex-end}.magic-toast.-bottom-center .magic-toast-component,.magic-toast.-bottom-left .magic-toast-component,.magic-toast.-bottom-right .magic-toast-component{padding-bottom:var(--magic-toast-padding-y,1rem)}.magic-toast.-bottom-left,.magic-toast.-top-left{--mt-justify-content:flex-start}.magic-toast.-bottom-left .magic-toast-component,.magic-toast.-top-left .magic-toast-component{padding-left:var(--magic-toast-padding-x,1rem)}.magic-toast.-bottom-right,.magic-toast.-top-right{--mt-justify-content:flex-end}.magic-toast.-bottom-right .magic-toast-component,.magic-toast.-top-right .magic-toast-component{padding-right:var(--magic-toast-padding-x,1rem)}.magic-toast.-from-left{--magic-toast-enter-animation:slide-ltr-in 300ms ease;--magic-toast-transform-y:0;--magic-toast-transform-x:30;--mt-multiplier-x:1}.magic-toast.-from-right{--magic-toast-enter-animation:slide-rtl-in 300ms ease;--magic-toast-transform-y:0;--magic-toast-transform-x:30;--mt-multiplier-x:-1}.magic-toast--list-enter-active{animation:var(--magic-toast-enter-animation,unset)}.magic-toast--list-leave-active{animation:var(--magic-toast-leave-animation,fade-out .3s ease)}
-</style>

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

@@ -1,64 +0,0 @@
-<template>
-  <li
-    class="magic-toast-component"
-    ref="elRef"
-    @mouseenter="onMouseenter"
-    :id="id"
-  >
-    <div class="magic-toast-component__inner">
-      <slot />
-    </div>
-  </li>
-</template>
-
-<script lang="ts" setup>
-import { ref, computed, onMounted, watchEffect } from 'vue'
-import { type ActiveToast } from './../types'
-
-interface MagicToastComponentProps {
-  index: number
-  total: number
-  id: string
-  siblings: ActiveToast[]
-}
-
-const props = defineProps<MagicToastComponentProps>()
-const emit = defineEmits<{
-  mouseenter: [event: Event]
-}>()
-
-const elRef = ref<HTMLElement | undefined>(undefined)
-const newerSiblings = computed(() => {
-  return props.siblings.slice(props.index + 1)
-})
-
-function setIndex() {
-  const index = (props.total - props.index - 1).toString()
-  elRef.value?.style.setProperty('--mt-index', index)
-}
-
-function setOffset() {
-  const offset = newerSiblings.value.reduce((acc, curr) => {
-    return acc + curr.height - curr.padding.top - curr.padding.bottom
-  }, 0)
-  elRef.value?.style.setProperty('--mt-offset', `${offset}`)
-}
-
-function onMouseenter(event: Event) {
-  emit('mouseenter', event)
-}
-
-onMounted(() => {
-  setIndex()
-  setOffset()
-})
-
-watchEffect(() => {
-  setIndex()
-  setOffset()
-})
-</script>
-
-<style>
-.magic-toast-component{--mt-index:0;--mt-offset:0;--mt-matrix-scale:calc(1 - var(--magic-toast-scale, 0.1)*var(--mt-index, 0));--mt-matrix-transform-x:calc(var(--magic-toast-transform-x)*var(--mt-index, 0)*var(--mt-multiplier-x));--mt-matrix-transform-y:calc(var(--magic-toast-transform-y)*var(--mt-index, 0)*var(--mt-multiplier-y));list-style:none;position:absolute}.magic-toast-component__inner{height:100%;position:relative;transform:matrix(var(--mt-matrix-scale),0,0,var(--mt-matrix-scale),var(--mt-matrix-transform-x),var(--mt-matrix-transform-y));transition:var(--magic-toast-transition,transform .3s ease);width:100%}.magic-toast-component.expanded{--mt-matrix-scale:1;--mt-matrix-transform-y:calc(var(--mt-offset)*var(--mt-multiplier-y));--mt-matrix-transform-x:0}.magic-toast-component.expanded:not(:last-child) .magic-toast-component__inner{padding-bottom:calc(var(--magic-toast-gap, .75rem)*var(--mt-index));padding-top:calc(var(--magic-toast-gap, .75rem)*var(--mt-index))}
-</style>

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

@@ -1,30 +0,0 @@
-import { type ActiveToast } from './../types';
-interface MagicToastComponentProps {
-    index: number;
-    total: number;
-    id: string;
-    siblings: ActiveToast[];
-}
-declare function __VLS_template(): {
-    attrs: Partial<{}>;
-    slots: {
-        default?(_: {}): any;
-    };
-    refs: {
-        elRef: HTMLLIElement;
-    };
-    rootEl: HTMLLIElement;
-};
-type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import("vue").DefineComponent<MagicToastComponentProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    mouseenter: (event: Event) => any;
-}, string, import("vue").PublicProps, Readonly<MagicToastComponentProps> & Readonly<{
-    onMouseenter?: ((event: Event) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, HTMLLIElement>;
-declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
-export default _default;
-type __VLS_WithTemplateSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

package/dist/plugins/MagicToast/src/composables/private/useToastApi.d.ts

@@ -1,5 +0,0 @@
-import { type MaybeRef } from 'vue';
-export declare function useToastApi(id: MaybeRef<string>): {
-    initialize: () => import("../../types").ToastInstance | undefined;
-    destroy: (id: string) => void;
-};

package/dist/plugins/MagicToast/src/composables/private/useToastApi.mjs

@@ -1,22 +0,0 @@
-import { toValue } from "vue";
-import { useToastStore } from "./useToastStore.mjs";
-import { useMagicToast } from "../useMagicToast.mjs";
-export function useToastApi(id) {
-  const { findInstance, addInstance, removeInstance } = useToastStore();
-  const { clear } = useMagicToast(toValue(id));
-  function initialize() {
-    const mappedId = toValue(id);
-    if (!findInstance(mappedId)) {
-      return addInstance(mappedId);
-    }
-  }
-  function destroy(id2) {
-    if (!id2) return;
-    clear();
-    removeInstance(toValue(id2));
-  }
-  return {
-    initialize,
-    destroy
-  };
-}

package/dist/plugins/MagicToast/src/composables/private/useToastInternalApi.d.ts

@@ -1,4 +0,0 @@
-import type { ToastInstance, AddToastArgs } from './../../types/index.js';
-export declare function useToastInternalApi(): {
-    addToast: (args: AddToastArgs, ctx: ToastInstance) => string;
-};

package/dist/plugins/MagicToast/src/composables/private/useToastInternalApi.mjs

@@ -1,28 +0,0 @@
-export function useToastInternalApi() {
-  function uuid() {
-    return Math.random().toString(36).slice(2, 11);
-  }
-  function removeToastAfterTimeout(id, duration, ctx) {
-    if (duration > 0) {
-      setTimeout(() => {
-        ctx.remove(id);
-      }, duration);
-    }
-  }
-  function addToast(args, ctx) {
-    const id = uuid();
-    let { component, props, duration = 0 } = args;
-    const toast = {
-      component,
-      props,
-      id,
-      remove: () => ctx.remove(id)
-    };
-    ctx.toasts.push(toast);
-    removeToastAfterTimeout(id, duration, ctx);
-    return id;
-  }
-  return {
-    addToast
-  };
-}

package/dist/plugins/MagicToast/src/composables/private/useToastStore.d.ts

@@ -1,27 +0,0 @@
-import type { ToastInstance, AddToastArgs } from '../../types/index.js';
-export declare function useToastStore(): {
-    toastStore: import("vue").Ref<{
-        id: string;
-        toasts: {
-            id: string;
-            component: Object;
-            props?: Record<string, any> | undefined;
-            remove: Function;
-        }[];
-        add: (args: AddToastArgs) => string;
-        remove: (id: string) => void;
-    }[], ToastInstance[] | {
-        id: string;
-        toasts: {
-            id: string;
-            component: Object;
-            props?: Record<string, any> | undefined;
-            remove: Function;
-        }[];
-        add: (args: AddToastArgs) => string;
-        remove: (id: string) => void;
-    }[]>;
-    findInstance: (id: string) => ToastInstance | undefined;
-    addInstance: (id: string) => ToastInstance;
-    removeInstance: (id: string) => void;
-};

package/dist/plugins/MagicToast/src/composables/private/useToastStore.mjs

@@ -1,41 +0,0 @@
-import { ref } from "vue";
-import { useToastInternalApi } from "./useToastInternalApi.mjs";
-const toastStore = ref([]);
-export function useToastStore() {
-  const { addToast } = useToastInternalApi();
-  function createInstance(id) {
-    const instance = {
-      id,
-      toasts: [],
-      add: function(args) {
-        return addToast(args, this);
-      },
-      remove: function(id2) {
-        this.toasts = this.toasts.filter((toast) => toast.id !== id2);
-      }
-    };
-    return instance;
-  }
-  function findInstance(id) {
-    const instance = toastStore.value.find(
-      (instance2) => instance2.id === id
-    );
-    return instance;
-  }
-  function addInstance(id) {
-    const instance = createInstance(id);
-    toastStore.value.push(instance);
-    return instance;
-  }
-  function removeInstance(id) {
-    toastStore.value = toastStore.value.filter(
-      (instance) => instance.id !== id
-    );
-  }
-  return {
-    toastStore,
-    findInstance,
-    addInstance,
-    removeInstance
-  };
-}

package/dist/utils/index.d.mts

@@ -1,80 +0,0 @@
-declare function clampValue(value: number, min: number, max: number): number;
-
-declare function linear(t: number): number;
-declare function easeInQuad(t: number): number;
-declare function easeOutQuad(t: number): number;
-declare function easeInOutQuad(t: number): number;
-declare function easeOutBack(t: number, o?: number): number;
-declare function easeInCubic(t: number): number;
-declare function easeOutCubic(t: number): number;
-declare function easeInOutCubic(t: number): number;
-declare function easeInQuart(t: number): number;
-declare function easeOutQuart(t: number): number;
-declare function easeInOutQuart(t: number): number;
-declare function easeInQuint(t: number): number;
-declare function easeOutQuint(t: number): number;
-declare function easeInOutQuint(t: number): number;
-
-declare function formatTime(seconds: number, guide: number): string;
-
-type InterpolateArgs = {
-    from: number;
-    to: number;
-    duration: number;
-    interval?: number;
-    easing?: (t: number) => number;
-    callback: (result: number) => void;
-};
-declare function interpolate(args: InterpolateArgs): void;
-
-declare function isIOS(): boolean;
-
-interface isWithinRangeArgs {
-    input: number;
-    base: number;
-    threshold: number;
-}
-declare function isWithinRange(args: isWithinRangeArgs): boolean;
-
-declare function mapValue(value: number, inMin: number, inMax: number, outMin: number, outMax: number): number;
-
-declare function matchClass(el: Element, regex: RegExp): boolean;
-
-interface GuardedSetPointerCaptureArgs {
-    event: PointerEvent;
-    element?: Element;
-    debug?: boolean;
-}
-interface GuardedReleasePointerCaptureArgs {
-    event: PointerEvent;
-    element?: Element;
-}
-declare function guardedSetPointerCapture(args: GuardedSetPointerCaptureArgs): void;
-declare function guardedReleasePointerCapture(args: GuardedReleasePointerCaptureArgs): void;
-
-interface SlugifyOptions {
-    separator?: string;
-    trim?: boolean;
-    remove?: RegExp;
-    strict?: boolean;
-    lowercase?: boolean;
-}
-declare function slugify(string: string, options?: SlugifyOptions): string;
-
-declare function uniq<T extends any[]>(a: T): any[];
-
-type PickPartial<T, K extends keyof T> = {
-    [P in K]: Partial<T[P]>;
-};
-
-type RequireAll<T> = {
-    [P in keyof T]-?: T[P];
-};
-
-type RequireAllNested<T> = {
-    [P in keyof T]-?: RequireAllNested<T[P]>;
-};
-
-type ValueOf<T> = T[keyof T];
-
-export { type InterpolateArgs, type PickPartial, type RequireAll, type RequireAllNested, type SlugifyOptions, type ValueOf, clampValue, easeInCubic, easeInOutCubic, easeInOutQuad, easeInOutQuart, easeInOutQuint, easeInQuad, easeInQuart, easeInQuint, easeOutBack, easeOutCubic, easeOutQuad, easeOutQuart, easeOutQuint, formatTime, guardedReleasePointerCapture, guardedSetPointerCapture, interpolate, isIOS, isWithinRange, linear, mapValue, matchClass, slugify, uniq };