@teammodlr/ui-kit 2.1.41 → 2.1.44

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.ts

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

package/src/components/index.ts

@@ -1,47 +1,48 @@
-export { default as MRenderer } from './renderer/renderer';
-export { default as MAvatar } from './avatar/Avatar.vue';
-export { default as MAvatarGroup } from './avatargroup/AvatarGroup.vue';
-export { default as MBadge } from './badge/Badge.vue';
-export { default as MBreadcrumb } from './breadcrumb/Breadcrumb.vue';
-export { default as MBreadcrumbItem } from './breadcrumb/BreadcrumbItem.vue';
-export { default as MButton } from './button/Button.vue';
-export { default as MButtonGroup } from './buttongroup/ButtonGroup.vue';
-export { default as MCheckbox } from './checkbox/Checkbox.vue';
-export { default as MColorPicker } from './colorpicker/ColorPicker.vue';
-export { default as MDropdown } from './dropdown/Dropdown.vue';
-export { default as MDropdownItem } from './dropdown/DropdownItem.vue';
-export { default as MDropdownList } from './dropdown/DropdownList.vue';
-export { default as MDropdownSeperator } from './dropdown/DropdownSeperator.vue';
-export { default as MDropdownHeading } from './dropdown/DropdownHeading.vue';
-export { default as MDropdownWrapper } from './dropdown/DropdownWrapper.vue';
-export { default as MForm } from './form/Form.vue';
-export { default as MImage } from './image/Image.vue';
-export { default as MInput } from './input/Input.vue';
-export { default as MLink } from './link/Link.vue';
-export { default as MMessageProvider } from './messageprovider/MessageProvider.vue';
-export { default as MModal } from './modal/Modal.vue';
-export { default as MPagination } from './pagination/Pagination.vue';
-export { default as MRadio } from './radio/Radio.vue';
-export { default as MRadioButton } from './radiobutton/RadioButton.vue';
-export { default as MRadioButtonGroup } from './radiobuttongroup/RadioButtonGroup.vue';
-export { default as MSelect } from './select/Select.vue';
-export { default as MSkeleton } from './skeleton/Skeleton.vue';
-export { default as MSlider } from './slider/Slider.vue';
-export { default as MSwitch } from './switch/Switch.vue';
-export { default as MTab } from './tab/Tab.vue';
-export { default as MTabGroup } from './tab/TabGroup.vue';
-export { default as MTable } from './table/Table.vue';
-export { default as MTableBody } from './table/TableBody.vue';
-export { default as MTableCell } from './table/TableCell.vue';
-export { default as MTableHead } from './table/TableHead.vue';
-export { default as MTableHeadRow } from './table/TableHeadRow.vue';
-export { default as MTableRow } from './table/TableRow.vue';
-export { default as MTag } from './tag/Tag.vue';
-export { default as MTextarea } from './textarea/Textarea.vue';
-export { default as MTooltip } from './tooltip/Tooltip.vue';
-export { default as MTransfer } from './transfer/Transfer.vue';
-export { default as MVirtualScroll } from './virtualscroll/VirtualScroll.vue';
-export { default as MConfirm } from './confirm/Confirm.vue';
-export { default as MConfirmProvider } from './confirm/ConfirmProvider.vue';
-export { default as MDialog } from './dialog/Dialog.vue';
-export { default as MTree } from './tree/Tree.vue';
+export { default as MRenderer } from './renderer/renderer';
+export { default as MConfigProvider } from './configprovider/ConfigProvider.vue';
+export { default as MAvatar } from './avatar/Avatar.vue';
+export { default as MAvatarGroup } from './avatargroup/AvatarGroup.vue';
+export { default as MBadge } from './badge/Badge.vue';
+export { default as MBreadcrumb } from './breadcrumb/Breadcrumb.vue';
+export { default as MBreadcrumbItem } from './breadcrumb/BreadcrumbItem.vue';
+export { default as MButton } from './button/Button.vue';
+export { default as MButtonGroup } from './buttongroup/ButtonGroup.vue';
+export { default as MCheckbox } from './checkbox/Checkbox.vue';
+export { default as MColorPicker } from './colorpicker/ColorPicker.vue';
+export { default as MDropdown } from './dropdown/Dropdown.vue';
+export { default as MDropdownItem } from './dropdown/DropdownItem.vue';
+export { default as MDropdownList } from './dropdown/DropdownList.vue';
+export { default as MDropdownSeperator } from './dropdown/DropdownSeperator.vue';
+export { default as MDropdownHeading } from './dropdown/DropdownHeading.vue';
+export { default as MDropdownWrapper } from './dropdown/DropdownWrapper.vue';
+export { default as MForm } from './form/Form.vue';
+export { default as MImage } from './image/Image.vue';
+export { default as MInput } from './input/Input.vue';
+export { default as MLink } from './link/Link.vue';
+export { default as MMessageProvider } from './messageprovider/MessageProvider.vue';
+export { default as MModal } from './modal/Modal.vue';
+export { default as MPagination } from './pagination/Pagination.vue';
+export { default as MRadio } from './radio/Radio.vue';
+export { default as MRadioButton } from './radiobutton/RadioButton.vue';
+export { default as MRadioButtonGroup } from './radiobuttongroup/RadioButtonGroup.vue';
+export { default as MSelect } from './select/Select.vue';
+export { default as MSkeleton } from './skeleton/Skeleton.vue';
+export { default as MSlider } from './slider/Slider.vue';
+export { default as MSwitch } from './switch/Switch.vue';
+export { default as MTab } from './tab/Tab.vue';
+export { default as MTabGroup } from './tab/TabGroup.vue';
+export { default as MTable } from './table/Table.vue';
+export { default as MTableBody } from './table/TableBody.vue';
+export { default as MTableCell } from './table/TableCell.vue';
+export { default as MTableHead } from './table/TableHead.vue';
+export { default as MTableHeadRow } from './table/TableHeadRow.vue';
+export { default as MTableRow } from './table/TableRow.vue';
+export { default as MTag } from './tag/Tag.vue';
+export { default as MTextarea } from './textarea/Textarea.vue';
+export { default as MTooltip } from './tooltip/Tooltip.vue';
+export { default as MTransfer } from './transfer/Transfer.vue';
+export { default as MVirtualScroll } from './virtualscroll/VirtualScroll.vue';
+export { default as MConfirm } from './confirm/Confirm.vue';
+export { default as MConfirmProvider } from './confirm/ConfirmProvider.vue';
+export { default as MDialog } from './dialog/Dialog.vue';
+export { default as MTree } from './tree/Tree.vue';