@teammodlr/ui-kit 2.1.39 → 2.1.43

package/src/__storybook__/createStory.ts

@@ -1,15 +1,15 @@
-import { h } from 'vue';
-import type { Component } from 'vue';
-
-export const createStory =
-    (component: Component, storyArgs: { classes?: string } = {}) =>
-    (args: any) => ({
-        setup: () => () =>
-            h(
-                'div',
-                {
-                    class: `storybook-example ${storyArgs.classes || ''}`
-                },
-                [h(component, args)]
-            )
-    });
+import { h } from 'vue';
+import type { Component } from 'vue';
+
+export const createStory =
+    (component: Component, storyArgs: { classes?: string } = {}) =>
+    (args: any) => ({
+        setup: () => () =>
+            h(
+                'div',
+                {
+                    class: `storybook-example ${storyArgs.classes || ''}`
+                },
+                [h(component, args)]
+            )
+    });

package/src/__storybook__/index.ts

@@ -1,2 +1,2 @@
-export * from './createStory';
-export * from './argTypes';
+export * from './createStory';
+export * from './argTypes';

package/src/call.ts

@@ -1,34 +1,34 @@
-type AnyFunction = (...args: any[]) => any;
-
-function call(funcs: MaybeArray<() => void>): void;
-function call<A1>(funcs: MaybeArray<(a1: A1) => void>, a1: A1): void;
-function call<A1, A2>(
-    funcs: MaybeArray<(a1: A1, a2: A2) => void>,
-    a1: A1,
-    a2: A2
-): void;
-function call<A1, A2, A3>(
-    funcs: MaybeArray<(a1: A1, a2: A2, a3: A3) => void>,
-    a1: A1,
-    a2: A2,
-    a3: A3
-): void;
-function call<A1, A2, A3, A4>(
-    funcs: MaybeArray<(a1: A1, a2: A2, a3: A3, a4: A4) => void>,
-    a1: A1,
-    a2: A2,
-    a3: A3,
-    a4: A4
-): void;
-function call<A extends any[]>(
-    funcs: AnyFunction[] | AnyFunction,
-    ...args: A
-): void {
-    if (Array.isArray(funcs)) {
-        funcs.forEach(func => (call as any)(func, ...args));
-    } else return funcs(...args);
-}
-
-export { call };
-
-export type MaybeArray<T> = T | T[];
+type AnyFunction = (...args: any[]) => any;
+
+function call(funcs: MaybeArray<() => void>): void;
+function call<A1>(funcs: MaybeArray<(a1: A1) => void>, a1: A1): void;
+function call<A1, A2>(
+    funcs: MaybeArray<(a1: A1, a2: A2) => void>,
+    a1: A1,
+    a2: A2
+): void;
+function call<A1, A2, A3>(
+    funcs: MaybeArray<(a1: A1, a2: A2, a3: A3) => void>,
+    a1: A1,
+    a2: A2,
+    a3: A3
+): void;
+function call<A1, A2, A3, A4>(
+    funcs: MaybeArray<(a1: A1, a2: A2, a3: A3, a4: A4) => void>,
+    a1: A1,
+    a2: A2,
+    a3: A3,
+    a4: A4
+): void;
+function call<A extends any[]>(
+    funcs: AnyFunction[] | AnyFunction,
+    ...args: A
+): void {
+    if (Array.isArray(funcs)) {
+        funcs.forEach(func => (call as any)(func, ...args));
+    } else return funcs(...args);
+}
+
+export { call };
+
+export type MaybeArray<T> = T | T[];

package/src/components/avatar/Avatar.vue

@@ -1,110 +1,110 @@
-<template>
-    <span
-        :class="classes"
-        ref="avatar"
-    >
-        <MImage
-            v-bind="$attrs"
-            :class="imageClass"
-            v-if="(src || srcSet) && imageExists"
-            :src="src"
-            :alt="src"
-            :srcset="srcSet"
-            @error="handleImageLoadError"
-            />
-        <slot v-else />
-    </span>
-</template>
-
-<script lang="ts">
-import type {PropType} from 'vue';
-import {computed, defineComponent, inject, onMounted, ref} from 'vue';
-import MImage from '../image/Image.vue';
-import * as style from "./style";
-import type {Size} from "../../types/props";
-import {AVATAR_GROUP_STATE} from "../avatargroup/symbol";
-
-export default defineComponent({
-    name: "MAvatar",
-    components: {
-        MImage,
-    },
-    props: {
-        src: {
-            type: String,
-            default: ""
-        },
-        srcSet: {
-            type: String,
-            default: ""
-        },
-        size: {
-            type: String as PropType<Size>,
-            default: 'md'
-        },
-        rounded: {
-            type: Boolean,
-            default: false
-        }
-    },
-    emits: {
-        error: (e: Event) => true
-    },
-    setup(props, { emit }) {
-        const avatarGroup = inject(AVATAR_GROUP_STATE, undefined);
-        const avatar = ref<HTMLElement | null>(null);
-        const imageExists = ref(true);
-        const sizeValue = ref<Size>('md');
-
-        const groupSize = computed(() => {
-            return avatarGroup?.size
-        });
-
-        const groupRounded = computed(() => {
-            return avatarGroup?.rounded
-        });
-
-        const inGroup = computed(() => {
-            return !!avatarGroup
-        });
-
-        const size = computed<Size>(() => {
-            return groupSize.value || props.size
-        });
-
-        const rounded = computed(() => {
-            return groupRounded.value || props.rounded
-        })
-
-        const classes = computed(() => {
-            return [
-                style.base,
-                [style.size[size.value]],
-                {
-                    [style.outline]: inGroup.value,
-                    [style.rounded]: rounded.value,
-                }
-            ]
-        });
-
-        const handleImageLoadError = (e: Event) => {
-            imageExists.value = false;
-            emit('error', e);
-        };
-
-        onMounted(() => {
-            sizeValue.value = groupSize.value || props.size;
-        });
-
-        return {
-            avatar,
-            avatarGroup,
-            classes,
-            imageExists,
-            imageClass: style.image,
-
-            handleImageLoadError
-        }
-    }
-})
-</script>
+<template>
+    <span
+        :class="classes"
+        ref="avatar"
+    >
+        <MImage
+            v-bind="$attrs"
+            :class="imageClass"
+            v-if="(src || srcSet) && imageExists"
+            :src="src"
+            :alt="src"
+            :srcset="srcSet"
+            @error="handleImageLoadError"
+            />
+        <slot v-else />
+    </span>
+</template>
+
+<script lang="ts">
+import type {PropType} from 'vue';
+import {computed, defineComponent, inject, onMounted, ref} from 'vue';
+import MImage from '../image/Image.vue';
+import * as style from "./style";
+import type {Size} from "../../types/props";
+import {AVATAR_GROUP_STATE} from "../avatargroup/symbol";
+
+export default defineComponent({
+    name: "MAvatar",
+    components: {
+        MImage,
+    },
+    props: {
+        src: {
+            type: String,
+            default: ""
+        },
+        srcSet: {
+            type: String,
+            default: ""
+        },
+        size: {
+            type: String as PropType<Size>,
+            default: 'md'
+        },
+        rounded: {
+            type: Boolean,
+            default: false
+        }
+    },
+    emits: {
+        error: (e: Event) => true
+    },
+    setup(props, { emit }) {
+        const avatarGroup = inject(AVATAR_GROUP_STATE, undefined);
+        const avatar = ref<HTMLElement | null>(null);
+        const imageExists = ref(true);
+        const sizeValue = ref<Size>('md');
+
+        const groupSize = computed(() => {
+            return avatarGroup?.size
+        });
+
+        const groupRounded = computed(() => {
+            return avatarGroup?.rounded
+        });
+
+        const inGroup = computed(() => {
+            return !!avatarGroup
+        });
+
+        const size = computed<Size>(() => {
+            return groupSize.value || props.size
+        });
+
+        const rounded = computed(() => {
+            return groupRounded.value || props.rounded
+        })
+
+        const classes = computed(() => {
+            return [
+                style.base,
+                [style.size[size.value]],
+                {
+                    [style.outline]: inGroup.value,
+                    [style.rounded]: rounded.value,
+                }
+            ]
+        });
+
+        const handleImageLoadError = (e: Event) => {
+            imageExists.value = false;
+            emit('error', e);
+        };
+
+        onMounted(() => {
+            sizeValue.value = groupSize.value || props.size;
+        });
+
+        return {
+            avatar,
+            avatarGroup,
+            classes,
+            imageExists,
+            imageClass: style.image,
+
+            handleImageLoadError
+        }
+    }
+})
+</script>

package/src/components/avatar/examples/basic.vue

@@ -1,6 +1,6 @@
-<template>
-    <MAvatar
-        src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
-        variant="rounded"
-        />
-</template>
+<template>
+    <MAvatar
+        src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
+        variant="rounded"
+        />
+</template>

package/src/components/avatar/examples/custom-size.vue

@@ -1,7 +1,7 @@
-<template>
-    <MAvatar
-        src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
-        variant="rounded"
-        size="100px"
-        />
-</template>
+<template>
+    <MAvatar
+        src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
+        variant="rounded"
+        size="100px"
+        />
+</template>

package/src/components/avatar/examples/index.ts

@@ -1,5 +1,5 @@
-export { default as MAvatarBasic } from './basic.vue';
-export { default as MAvatarSize } from './sizes.vue';
-export { default as MAvatarCustomSize } from './custom-size.vue';
-export { default as MAvatarVariant } from './variants.vue';
-export { default as MAvatarSlot } from './slots.vue';
+export { default as MAvatarBasic } from './basic.vue';
+export { default as MAvatarSize } from './sizes.vue';
+export { default as MAvatarCustomSize } from './custom-size.vue';
+export { default as MAvatarVariant } from './variants.vue';
+export { default as MAvatarSlot } from './slots.vue';

package/src/components/avatar/examples/sizes.vue

@@ -1,33 +1,33 @@
-<template>
-    <div>
-        <MAvatar
-            src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
-            variant="rounded"
-            size="xs"
-            /><br /><br />
-
-        <MAvatar
-            src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
-            variant="rounded"
-            size="sm"
-            /><br /><br />
-
-        <MAvatar
-            src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
-            variant="rounded"
-            size="md"
-            /><br /><br />
-
-        <MAvatar
-            src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
-            variant="rounded"
-            size="lg"
-            /><br /><br />
-
-        <MAvatar
-            src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
-            variant="rounded"
-            size="xl"
-            /><br /><br />
-    </div>
-</template>
+<template>
+    <div>
+        <MAvatar
+            src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
+            variant="rounded"
+            size="xs"
+            /><br /><br />
+
+        <MAvatar
+            src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
+            variant="rounded"
+            size="sm"
+            /><br /><br />
+
+        <MAvatar
+            src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
+            variant="rounded"
+            size="md"
+            /><br /><br />
+
+        <MAvatar
+            src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
+            variant="rounded"
+            size="lg"
+            /><br /><br />
+
+        <MAvatar
+            src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
+            variant="rounded"
+            size="xl"
+            /><br /><br />
+    </div>
+</template>

package/src/components/avatar/examples/slots.vue

@@ -1,8 +1,8 @@
-<template>
-    <MAvatar
-        variant="rounded"
-        style="background-color: red; color: white;"
-    >
-        BV
-    </MAvatar>
-</template>
+<template>
+    <MAvatar
+        variant="rounded"
+        style="background-color: red; color: white;"
+    >
+        BV
+    </MAvatar>
+</template>

package/src/components/avatar/examples/variants.vue

@@ -1,18 +1,18 @@
-<template>
-    <div>
-        <MAvatar
-            src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
-            variant="square"
-            /><br /><br />
-
-        <MAvatar
-            src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
-            variant="rounded"
-            /><br /><br />
-
-        <MAvatar
-            src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
-            variant="circle"
-            /><br /><br />
-    </div>
-</template>
+<template>
+    <div>
+        <MAvatar
+            src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
+            variant="square"
+            /><br /><br />
+
+        <MAvatar
+            src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
+            variant="rounded"
+            /><br /><br />
+
+        <MAvatar
+            src="https://cdn.discordapp.com/avatars/314170125915783180/9f71af5f78d3188a0c92800c94112496.webp"
+            variant="circle"
+            /><br /><br />
+    </div>
+</template>