@teammodlr/ui-kit 2.3.12 → 2.3.15

package/src/components/form/style/Form.css.ts

@@ -1,28 +1,28 @@
-import {
-    createVar,
-    globalKeyframes,
-    globalStyle,
-    style
-} from '@vanilla-extract/css';
-import { themeVars } from '../../../styles/theme.css';
-
-const borderRadiuses = {
-    xs: '2px',
-    sm: '3px',
-    md: '4px',
-    lg: '6px',
-    xl: '8px'
-};
-
-export const vars = {
-    spacing: createVar()
-};
-
-export const base = style({
-    vars: {
-        [vars.spacing]: themeVars.space[4]
-    },
-    display: 'flex',
-    flexDirection: 'column',
-    gap: vars.spacing
-});
+import {
+    createVar,
+    globalKeyframes,
+    globalStyle,
+    style
+} from '@vanilla-extract/css';
+import { themeVars } from '../../../styles/theme.css';
+
+const borderRadiuses = {
+    xs: '2px',
+    sm: '3px',
+    md: '4px',
+    lg: '6px',
+    xl: '8px'
+};
+
+export const vars = {
+    spacing: createVar()
+};
+
+export const base = style({
+    vars: {
+        [vars.spacing]: themeVars.space[4]
+    },
+    display: 'flex',
+    flexDirection: 'column',
+    gap: vars.spacing
+});

package/src/components/form/style/index.ts

@@ -1,2 +1,2 @@
-export { assignInlineVars } from '@vanilla-extract/dynamic';
-export * from './Form.css';
+export { assignInlineVars } from '@vanilla-extract/dynamic';
+export * from './Form.css';

package/src/components/form/symbol.ts

@@ -1,16 +1,16 @@
-import type { InjectionKey } from 'vue';
-
-export interface FormState {
-    add: (
-        name: string,
-        focus: () => void,
-        validate: () => boolean,
-        setError: (error: string) => void
-    ) => void;
-    remove: (name: string) => void;
-    insideForm: boolean;
-    disabled: boolean;
-    loading: boolean;
-}
-
-export const FORM_STATE: InjectionKey<FormState> = Symbol('FORM_STATE');
+import type { InjectionKey } from 'vue';
+
+export interface FormState {
+    add: (
+        name: string,
+        focus: () => void,
+        validate: () => boolean,
+        setError: (error: string) => void
+    ) => void;
+    remove: (name: string) => void;
+    insideForm: boolean;
+    disabled: boolean;
+    loading: boolean;
+}
+
+export const FORM_STATE: InjectionKey<FormState> = Symbol('FORM_STATE');

package/src/components/image/Image.vue

@@ -1,71 +1,71 @@
-<template>
-    <img :class="computedClasses" :style="computedStyles" :src="source" :alt="alt" />
-</template>
-
-<script lang="ts">
-import { defineComponent, watch, ref, computed } from 'vue';
-
-
-export default defineComponent({
-    name: "MImage",
-    props: {
-        src: {
-            type: String,
-            required: true,
-        },
-        scrSet: {
-            type: String,
-            default: "",
-        },
-        fit: {
-            type: String,
-            default: "cover",
-        },
-        alt: {
-            type: String,
-            default: "",
-        },
-    },
-    emits: {
-        error: (e: Event) => true
-    },
-    setup(props, { emit }) {
-        const source = ref<string | undefined>("");
-
-        if (typeof window !== 'undefined' && Image) {
-            watch(() => props.src, (src) => {
-                if(!src) {
-                    return;
-                }
-
-                const image = new Image();
-                image.onload = () => {
-                    source.value = props.src;
-                };
-                image.onerror = () => {
-                    emit('error', new Event('error'));
-                };
-                image.src = src;
-            }, 
-            { immediate: true })
-        }
-
-        const computedClasses = computed(() => {
-            return {
-                "m-image": true,
-            }
-        });
-
-        const computedStyles = computed(() => {
-            return {
-            }
-        });
-
-        return {
-            source,
-            computedClasses,
-            computedStyles,
-        }
-    }
-})
-</script>
+<template>
+    <img :class="computedClasses" :style="computedStyles" :src="source" :alt="alt" />
+</template>
+
+<script lang="ts">
+import { defineComponent, watch, ref, computed } from 'vue';
+
+
+export default defineComponent({
+    name: "MImage",
+    props: {
+        src: {
+            type: String,
+            required: true,
+        },
+        scrSet: {
+            type: String,
+            default: "",
+        },
+        fit: {
+            type: String,
+            default: "cover",
+        },
+        alt: {
+            type: String,
+            default: "",
+        },
+    },
+    emits: {
+        error: (e: Event) => true
+    },
+    setup(props, { emit }) {
+        const source = ref<string | undefined>("");
+
+        if (typeof window !== 'undefined' && Image) {
+            watch(() => props.src, (src) => {
+                if(!src) {
+                    return;
+                }
+
+                const image = new Image();
+                image.onload = () => {
+                    source.value = props.src;
+                };
+                image.onerror = () => {
+                    emit('error', new Event('error'));
+                };
+                image.src = src;
+            }, 
+            { immediate: true })
+        }
+
+        const computedClasses = computed(() => {
+            return {
+                "m-image": true,
+            }
+        });
+
+        const computedStyles = computed(() => {
+            return {
+            }
+        });
+
+        return {
+            source,
+            computedClasses,
+            computedStyles,
+        }
+    }
+})
+</script>

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

@@ -1,5 +1,5 @@
-<template>
-    <MImage 
-        src="https://images.unsplash.com/photo-1672745256937-4e60a4534413?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=976&q=80"
-        />
-</template>
+<template>
+    <MImage 
+        src="https://images.unsplash.com/photo-1672745256937-4e60a4534413?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=976&q=80"
+        />
+</template>

package/src/components/image/examples/index.stories.ts

@@ -1,10 +1,10 @@
-import { createStory } from '../../../__storybook__';
-import MImage from '../Image.vue';
-import { MImageBasic } from './index';
-
-export default {
-    component: MImage,
-    title: 'Components/Image'
-};
-
-export const Basic = createStory(MImageBasic);
+import { createStory } from '../../../__storybook__';
+import MImage from '../Image.vue';
+import { MImageBasic } from './index';
+
+export default {
+    component: MImage,
+    title: 'Components/Image'
+};
+
+export const Basic = createStory(MImageBasic);

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

@@ -1 +1 @@
-export { default as MImageBasic } from './basic.vue';
+export { default as MImageBasic } from './basic.vue';