@tekkare/auriga 0.1.0 → 0.1.4

package/dist/runtime/components/argFileBtn.vue

@@ -16,67 +16,69 @@
   </button>
 </template>
 <script>
-export default {
-  name: "argFileBtn"
-};
-</script>
-<script setup lang="ts">
+import {
+  computed,
+  defineComponent
+} from "vue";
 import argIcon from "./argIcon.vue";
-import { onMounted, ref, computed, defineProps, defineEmits } from "vue";
-const props = defineProps({
-  fileType: {
-    type: String,
-    required: false,
-  },
-  fileName: {
-    type: String,
-    required: true,
-  },
-  fileSize: {
-    type: String,
-    required: false,
-  },
-  download: {
-    type: Boolean,
-    default: false,
-    required: false,
-  },
-  preview: {
-    type: Boolean,
-    default: false,
-    required: false,
+export default defineComponent({
+  name: "argFileBtn",
+  components: { argIcon },
+  props: {
+    fileType: {
+      type: String,
+      required: false
+    },
+    fileName: {
+      type: String,
+      required: true
+    },
+    fileSize: {
+      type: String,
+      required: false
+    },
+    download: {
+      type: Boolean,
+      default: false,
+      required: false
+    },
+    preview: {
+      type: Boolean,
+      default: false,
+      required: false
+    }
   },
-});
-
-const emit = defineEmits(["onPreview", "onDownload"]);
-
-var fileIcon = computed(() => {
-  var iconName = { icon: "File", color: "#3E3F5E" };
-  if (props.fileType) {
-    var ft = props.fileType.toUpperCase();
-    if (ft === "PDF") {
-      iconName = { icon: "FilePdf", color: "#D93221" };
-    } else if (ft === "CSV") {
-      iconName = { icon: "FileCsv", color: "#387A47" };
-    } else if (ft === "XLS" || ft === "XLSX") {
-      iconName = { icon: "FileXls", color: "#387A47" };
-    } else if (ft === "PNG") {
-      iconName = { icon: "FilePng", color: "#3E3F5E" };
-    } else if (ft === "JPG" || ft === "JPEG") {
-      iconName = { icon: "FileJpg", color: "#3E3F5E" };
-    } else if (ft === "MP4" || ft === "AVI" || ft === "MOV") {
-      iconName = { icon: "FileVideo", color: "#3E3F5E" };
+  emits: ["onPreview", "onDownload"],
+  setup(props, { emit }) {
+    const fileIcon = computed(() => {
+      let iconName = { icon: "File", color: "#3E3F5E" };
+      if (props.fileType) {
+        const ft = props.fileType.toUpperCase();
+        if (ft === "PDF") {
+          iconName = { icon: "FilePdf", color: "#D93221" };
+        } else if (ft === "CSV") {
+          iconName = { icon: "FileCsv", color: "#387A47" };
+        } else if (ft === "XLS" || ft === "XLSX") {
+          iconName = { icon: "FileXls", color: "#387A47" };
+        } else if (ft === "PNG") {
+          iconName = { icon: "FilePng", color: "#3E3F5E" };
+        } else if (ft === "JPG" || ft === "JPEG") {
+          iconName = { icon: "FileJpg", color: "#3E3F5E" };
+        } else if (ft === "MP4" || ft === "AVI" || ft === "MOV") {
+          iconName = { icon: "FileVideo", color: "#3E3F5E" };
+        }
+      }
+      return iconName;
+    });
+    function onPreview() {
+      emit("onPreview");
+    }
+    function onDownload() {
+      emit("onDownload");
     }
+    return { fileIcon, onPreview, onDownload };
   }
-  return iconName;
 });
-
-function onPreview() {
-  emit("onPreview");
-}
-function onDownload() {
-  emit("onDownload");
-}
 </script>
 <style scoped>
 .prmt_file_button {

package/dist/runtime/components/argFileBtn.vue.d.ts

@@ -1,4 +1,61 @@
-declare const _default: {
-    name: string;
-};
+declare const _default: import("vue").DefineComponent<{
+    fileType: {
+        type: StringConstructor;
+        required: false;
+    };
+    fileName: {
+        type: StringConstructor;
+        required: true;
+    };
+    fileSize: {
+        type: StringConstructor;
+        required: false;
+    };
+    download: {
+        type: BooleanConstructor;
+        default: boolean;
+        required: false;
+    };
+    preview: {
+        type: BooleanConstructor;
+        default: boolean;
+        required: false;
+    };
+}, {
+    fileIcon: import("vue").ComputedRef<{
+        icon: string;
+        color: string;
+    }>;
+    onPreview: () => void;
+    onDownload: () => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("onPreview" | "onDownload")[], "onPreview" | "onDownload", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    fileType: {
+        type: StringConstructor;
+        required: false;
+    };
+    fileName: {
+        type: StringConstructor;
+        required: true;
+    };
+    fileSize: {
+        type: StringConstructor;
+        required: false;
+    };
+    download: {
+        type: BooleanConstructor;
+        default: boolean;
+        required: false;
+    };
+    preview: {
+        type: BooleanConstructor;
+        default: boolean;
+        required: false;
+    };
+}>> & {
+    onOnPreview?: ((...args: any[]) => any) | undefined;
+    onOnDownload?: ((...args: any[]) => any) | undefined;
+}, {
+    download: boolean;
+    preview: boolean;
+}, {}>;
 export default _default;

package/dist/runtime/components/argHeaderTabs.vue

@@ -5,7 +5,7 @@
         <div class="header_one_tab_active-selector" id="header_nav_bar"></div>
         <span
           class="header_one_tab_container"
-          v-for="(tab, index) in removeNullProps(tabs)"
+          v-for="(tab, index) in tabs"
           :key="index"
           :id="`headerTab${index + 1}`"
         >
@@ -24,118 +24,106 @@
   </div>
 </template>
 <script>
-export default {
-  name: "argHeaderTabs"
-};
-</script>
-
-<script setup lang="ts">
 import {
   onMounted,
   ref,
   computed,
-  defineProps,
-  defineEmits,
   watch,
-  defineComponent,
+  defineComponent
 } from "vue";
-import _ from "lodash";
-const props = defineProps({
-  tabs: {
-    type: Array,
-    required: true,
-  },
-  index_menu: {
-    type: [String, Number],
-    default: 1,
-  },
-});
-
-const emit = defineEmits(["updateMenu", "update:Value"]);
-
-var true_index_menu = ref(props.index_menu);
-var scrollValue = ref(0);
-var oldWidth = ref();
-
-watch(
-  () => props.index_menu,
-  (new_index_menu: number | string) => {
-    true_index_menu.value = new_index_menu;
-  }
-);
-
-function removeNullProps(object) {
-  return _.reject(object, (value) => value === null);
-}
-
-var tabsWidth = computed(() => {
-  const table = [];
-  for (let i = 0; i < props.tabs.length; i++) {
-    let domTab = document?.getElementById(`headerTab${i + 1}`);
-    if (domTab !== null) {
-      table.push(domTab.offsetWidth);
-    }
-  }
-  return table;
-});
-
-var getTranslationWidth = computed(() => {
-  let translateWidth = 0;
-  if (true_index_menu.value === 1) {
-    return 0;
-  } else {
-    let i = 0;
-    while (i + 1 < true_index_menu.value) {
-      translateWidth += tabsWidth.value[i];
-      i += 1;
+export default defineComponent({
+  name: "argHeaderTabs",
+  props: {
+    tabs: {
+      type: Array,
+      required: true
+    },
+    index_menu: {
+      type: [String, Number],
+      default: 1
     }
-    return translateWidth;
-  }
-});
-
-function changeMenu(value: number | string) {
-  if (typeof true_index_menu.value === "string") {
-    emit("updateMenu", value.toString());
-    emit("update:Value", value.toString());
-  } else {
-    emit("updateMenu", value);
-    emit("update:Value", value);
-  }
-  true_index_menu.value = value;
-  setBarWidth();
-}
-
-function setBarWidth() {
-  const selector = document?.getElementById("header_nav_bar");
-  const element = document?.getElementById(`headerTab${true_index_menu.value}`);
-  if (element !== null && selector !== null) {
-    const width = element.offsetWidth;
-    selector.style.width = `${width}px`;
-    selector.style.transform = `translateX(${
-      getTranslationWidth.value +
-      scrollValue.value +
-      24 * (true_index_menu.value - 1)
-    }px)`;
-  }
-}
-
-onMounted(() => {
-  oldWidth.value = window?.innerWidth;
-  setTimeout(() => {
-    changeMenu(props.index_menu);
-  });
-  window.onresize = () => {
-    const content = document?.querySelector(".header_tabs_overlay");
-    if (content !== null) {
-      if (window.innerWidth > oldWidth.value) {
-        if (content.scrollLeft === 0) {
-          scrollValue.value = 0;
+  },
+  emits: ["updateMenu", "update:Menu"],
+  setup(props, { emit }) {
+    const true_index_menu = ref(props.index_menu);
+    const scrollValue = ref(0);
+    const oldWidth = ref();
+    watch(
+      () => props.index_menu,
+      (new_index_menu) => {
+        true_index_menu.value = new_index_menu;
+      }
+    );
+    const tabsWidth = computed(() => {
+      const table = [];
+      for (let i = 0; i < props.tabs.length; i++) {
+        let domTab = document?.getElementById(`headerTab${i + 1}`);
+        if (domTab !== null) {
+          table.push(domTab.offsetWidth);
+        }
+      }
+      return table;
+    });
+    const getTranslationWidth = computed(() => {
+      let translateWidth = 0;
+      if (true_index_menu.value === 1) {
+        return 0;
+      } else {
+        let i = 0;
+        while (i + 1 < true_index_menu.value) {
+          translateWidth += tabsWidth.value[i];
+          i += 1;
         }
+        return translateWidth;
+      }
+    });
+    function changeMenu(value) {
+      if (typeof true_index_menu.value === "string") {
+        emit("updateMenu", value.toString());
+        emit("update:Menu", value.toString());
+      } else {
+        emit("updateMenu", value);
+        emit("update:Menu", value);
       }
-      oldWidth.value = window.innerWidth;
+      true_index_menu.value = value;
+      setBarWidth();
     }
-    setBarWidth();
-  };
+    function setBarWidth() {
+      const selector = document?.getElementById("header_nav_bar");
+      const element = document?.getElementById(
+        `headerTab${true_index_menu.value}`
+      );
+      if (element !== null && selector !== null) {
+        const width = element.offsetWidth;
+        selector.style.width = `${width}px`;
+        selector.style.transform = `translateX(${getTranslationWidth.value + scrollValue.value + 24 * (true_index_menu.value - 1)}px)`;
+      }
+    }
+    onMounted(() => {
+      oldWidth.value = window?.innerWidth;
+      setTimeout(() => {
+        changeMenu(props.index_menu);
+      });
+      window.onresize = () => {
+        const content = document?.querySelector(".header_tabs_overlay");
+        if (content !== null) {
+          if (window.innerWidth > oldWidth.value) {
+            if (content.scrollLeft === 0) {
+              scrollValue.value = 0;
+            }
+          }
+          oldWidth.value = window.innerWidth;
+        }
+        setBarWidth();
+      };
+    });
+    return {
+      true_index_menu,
+      scrollValue,
+      oldWidth,
+      changeMenu
+    };
+  }
 });
 </script>
 

package/dist/runtime/components/argHeaderTabs.vue.d.ts

@@ -1,4 +1,30 @@
-declare const _default: {
-    name: string;
-};
+declare const _default: import("vue").DefineComponent<{
+    tabs: {
+        type: ArrayConstructor;
+        required: true;
+    };
+    index_menu: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: number;
+    };
+}, {
+    true_index_menu: import("vue").Ref<string | number>;
+    scrollValue: import("vue").Ref<number>;
+    oldWidth: import("vue").Ref<any>;
+    changeMenu: (value: number | string) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("updateMenu" | "update:Menu")[], "updateMenu" | "update:Menu", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    tabs: {
+        type: ArrayConstructor;
+        required: true;
+    };
+    index_menu: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: number;
+    };
+}>> & {
+    onUpdateMenu?: ((...args: any[]) => any) | undefined;
+    "onUpdate:Menu"?: ((...args: any[]) => any) | undefined;
+}, {
+    index_menu: string | number;
+}, {}>;
 export default _default;