@tekkare/auriga 0.1.4 → 0.1.6

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

@@ -0,0 +1,258 @@
+declare const _default: import("vue").DefineComponent<{
+    iso: {
+        type: StringConstructor;
+    };
+    slug: {
+        type: StringConstructor;
+    };
+    height: {
+        type: StringConstructor;
+        default: string;
+    };
+    round: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    emoji: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}, {
+    name: {
+        iso: string;
+        slug: string;
+        name: string;
+    }[];
+    countriesList: {
+        AD: string;
+        AE: string;
+        AF: string;
+        AG: string;
+        AL: string;
+        AM: string;
+        AN: string;
+        AO: string;
+        AR: string;
+        AT: string;
+        AU: string;
+        AW: string;
+        AZ: string;
+        BA: string;
+        BB: string;
+        BD: string;
+        BE: string;
+        BF: string;
+        BG: string;
+        BS: string;
+        BI: string;
+        BJ: string;
+        BN: string;
+        BO: string;
+        BR: string;
+        BH: string;
+        BT: string;
+        BV: string;
+        BW: string;
+        BY: string;
+        BZ: string;
+        CA: string;
+        CD: string;
+        CF: string;
+        CG: string;
+        CH: string;
+        CI: string;
+        CL: string;
+        CM: string;
+        CN: string;
+        CO: string;
+        CR: string;
+        CU: string;
+        CV: string;
+        CW: string;
+        CY: string;
+        CZ: string;
+        DE: string;
+        DJ: string;
+        DK: string;
+        DM: string;
+        DO: string;
+        DZ: string;
+        EC: string;
+        EE: string;
+        EG: string;
+        ER: string;
+        ES: string;
+        ET: string;
+        FI: string;
+        FJ: string;
+        FM: string;
+        FR: string;
+        GA: string;
+        'GB-ENG': string;
+        'GB-NIR': string;
+        'GB-SCT': string;
+        'GB-WLS': string;
+        GB: string;
+        GD: string;
+        GE: string;
+        GH: string;
+        GM: string;
+        GN: string;
+        GQ: string;
+        GR: string;
+        GT: string;
+        GW: string;
+        GY: string;
+        HK: string;
+        HN: string;
+        HR: string;
+        HT: string;
+        HU: string;
+        ID: string;
+        IE: string;
+        IL: string;
+        IN: string;
+        IQ: string;
+        IR: string;
+        IS: string;
+        IT: string;
+        JM: string;
+        JO: string;
+        JP: string;
+        KE: string;
+        KG: string;
+        KH: string;
+        KI: string;
+        KM: string;
+        KP: string;
+        KR: string;
+        KW: string;
+        KZ: string;
+        LA: string;
+        LB: string;
+        LC: string;
+        LI: string;
+        LK: string;
+        LR: string;
+        LS: string;
+        LT: string;
+        LU: string;
+        LV: string;
+        LY: string;
+        MA: string;
+        MC: string;
+        MD: string;
+        ME: string;
+        MG: string;
+        MH: string;
+        MK: string;
+        ML: string;
+        MM: string;
+        MN: string;
+        MR: string;
+        MT: string;
+        MU: string;
+        MV: string;
+        MW: string;
+        MX: string;
+        MY: string;
+        MZ: string;
+        NA: string;
+        NE: string;
+        NG: string;
+        NI: string;
+        NL: string;
+        NO: string;
+        NR: string;
+        NZ: string;
+        OM: string;
+        PA: string;
+        PE: string;
+        PG: string;
+        PH: string;
+        PK: string;
+        PL: string;
+        PS: string;
+        PT: string;
+        PW: string;
+        PY: string;
+        QA: string;
+        RO: string;
+        RS: string;
+        RU: string;
+        RW: string;
+        SA: string;
+        SB: string;
+        SC: string;
+        SD: string;
+        SE: string;
+        SG: string;
+        SI: string;
+        SK: string;
+        SL: string;
+        SM: string;
+        SN: string;
+        SO: string;
+        SR: string;
+        SS: string;
+        ST: string;
+        SV: string;
+        SX: string;
+        SY: string;
+        SZ: string;
+        TD: string;
+        TG: string;
+        TH: string;
+        TJ: string;
+        TL: string;
+        TM: string;
+        TN: string;
+        TO: string;
+        TR: string;
+        TT: string;
+        TV: string;
+        TZ: string;
+        UA: string;
+        UG: string;
+        US: string;
+        UY: string;
+        UZ: string;
+        VC: string;
+        VE: string;
+        VI: string;
+        VN: string;
+        VU: string;
+        WS: string;
+        YE: string;
+        ZA: string;
+        ZM: string;
+        ZW: string;
+    };
+    countryName: import("vue").ComputedRef<string>;
+    size: import("vue").ComputedRef<string>;
+    getEmojiFlag: (name: string) => string;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    iso: {
+        type: StringConstructor;
+    };
+    slug: {
+        type: StringConstructor;
+    };
+    height: {
+        type: StringConstructor;
+        default: string;
+    };
+    round: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    emoji: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+}>>, {
+    height: string;
+    round: boolean;
+    emoji: boolean;
+}, {}>;
+export default _default;

package/dist/runtime/components/argFooter.vue

@@ -0,0 +1,41 @@
+<template>
+  <div class="oip_footer">
+	<div class="oip_footer_text">
+		<h2>Powered by</h2>
+		<img src="https://rcd-media.com/tekkare/logos/tekkare_logo.svg" />
+	</div>
+  </div>
+</template>
+<script>
+import {
+  defineComponent
+} from "vue";
+import argIcon from "./argIcon.vue";
+import argStyle from "./argStyle.vue";
+export default defineComponent({
+  name: "argFooter",
+  components: { argIcon, argStyle }
+});
+</script>
+<style>
+.oip_footer {
+	background: var(--pure-white);
+	padding: 24px 96px;
+	margin-top: 24px;
+	box-shadow: 0px 4px 8px rgba(37, 99, 235, 0.04), 0px 0px 2px rgba(37, 99, 235, 0.06), 0px 0px 1px rgba(37, 99, 235, 0.04);
+}
+.oip_footer_text {
+	display: flex;
+	flex-direction: row;
+	justify-content: flex-end;
+	gap: 24px;
+	align-items: flex-end;
+}
+.oip_footer_text h2{
+	font-style: normal;
+	font-size: 14px;
+	line-height: 16px;
+	color: var(--independence);
+	font-weight: normal;
+}
+</style>

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

@@ -0,0 +1,2 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+export default _default;

package/dist/runtime/components/argHeader.vue

@@ -0,0 +1,96 @@
+<template>
+  <div class="arg_header" id="arg_header">
+    <div class="arg_header_title_group">
+      <nuxt-link :to="backTo" v-if="backTo" class="arg_header_back_button">
+        <arg-icon name="CaretLeft" size="20px" />
+      </nuxt-link>
+      <button @click="goBack()" v-else class="arg_header_back_button">
+        <arg-icon name="CaretLeft" size="20px" />
+      </button>
+      <h1 class="arg_header_title">
+        {{ title }}
+      </h1>
+      <slot name="group" />
+    </div>
+    <arg-header-tabs
+      v-if="tabs"
+      :tabs="tabs"
+      :index_menu="index_menu"
+      @updateMenu="updateMenu"
+    />
+  </div>
+</template>
+<script>
+import {
+  defineComponent
+} from "vue";
+import argIcon from "./argIcon.vue";
+import argStyle from "./argStyle.vue";
+import argHeaderTabs from "./argHeaderTabs.vue";
+import { useRouter } from "vue-router";
+export default defineComponent({
+  name: "argHeader",
+  components: { argIcon, argStyle, argHeaderTabs },
+  props: {
+    title: { type: String, required: true },
+    backTo: { type: String, required: false },
+    tabs: { type: Array, required: false },
+    index_menu: { type: [String, Number], default: 1 }
+  },
+  emits: ["updateMenu", "update:Menu"],
+  setup(props, { emit }) {
+    const router = useRouter();
+    function goBack() {
+      if (props.backTo) {
+        router.push(props.backTo);
+      } else {
+        router.back();
+      }
+    }
+    function updateMenu(value) {
+      emit("updateMenu", value);
+      emit("update:Menu", value);
+    }
+    return { goBack, updateMenu };
+  }
+});
+</script>
+<style>
+.arg_header {
+  -webkit-backdrop-filter: blur(12px);
+  backdrop-filter: blur(12px);
+  display: flex;
+  flex-direction: column;
+  gap: 24px;
+  padding: 24px 32px 12px;
+  position: fixed;
+  top: 0;
+  z-index: 99;
+  border-bottom: 1px solid var(--base-dividers, #ececf2);
+  background: transparent;
+  width: 100%;
+  box-sizing: border-box;
+}
+.arg_header_title_group {
+  display: flex;
+  align-items: center;
+  gap: 16px;
+  align-self: stretch;
+}
+.arg_header_title {
+  font-size: 20px;
+  font-style: normal;
+  font-weight: 900;
+  line-height: normal;
+  flex-grow: 2;
+}
+.arg_header_back_button {
+  cursor: pointer;
+  border: 0px solid transparent;
+  padding: 0;
+  background: transparent;
+}
+.arg_header:has(> .header_tabs_section) {
+  padding: 24px 32px 0px;
+}
+</style>

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

@@ -0,0 +1,44 @@
+declare const _default: import("vue").DefineComponent<{
+    title: {
+        type: StringConstructor;
+        required: true;
+    };
+    backTo: {
+        type: StringConstructor;
+        required: false;
+    };
+    tabs: {
+        type: ArrayConstructor;
+        required: false;
+    };
+    index_menu: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: number;
+    };
+}, {
+    goBack: () => void;
+    updateMenu: (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<{
+    title: {
+        type: StringConstructor;
+        required: true;
+    };
+    backTo: {
+        type: StringConstructor;
+        required: false;
+    };
+    tabs: {
+        type: ArrayConstructor;
+        required: false;
+    };
+    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;

package/dist/runtime/components/argHeaderTabs.vue

@@ -2,7 +2,10 @@
   <div class="header_tabs_section">
     <div class="header_tabs">
       <div class="header_tabs_overlay">
-        <div class="header_one_tab_active-selector" id="header_nav_bar"></div>
+        <div
+          class="header_one_tab_active-selector"
+          :id="`header_nav_bar`"
+        ></div>
         <span
           class="header_one_tab_container"
           v-for="(tab, index) in tabs"
@@ -52,12 +55,13 @@ export default defineComponent({
       () => props.index_menu,
       (new_index_menu) => {
         true_index_menu.value = new_index_menu;
+        setBarWidth();
       }
     );
     const tabsWidth = computed(() => {
       const table = [];
       for (let i = 0; i < props.tabs.length; i++) {
-        let domTab = document?.getElementById(`headerTab${i + 1}`);
+        const domTab = document?.getElementById(`headerTab${i + 1}`);
         if (domTab !== null) {
           table.push(domTab.offsetWidth);
         }
@@ -89,7 +93,7 @@ export default defineComponent({
       setBarWidth();
     }
     function setBarWidth() {
-      const selector = document?.getElementById("header_nav_bar");
+      const selector = document?.getElementById(`header_nav_bar`);
       const element = document?.getElementById(
         `headerTab${true_index_menu.value}`
       );

package/dist/runtime/components/argLineBreak.vue

@@ -0,0 +1,21 @@
+<template>
+    <hr class="arg_line_break"/>
+</template>
+<script>
+import {
+  defineComponent
+} from "vue";
+import argStyle from "./argStyle.vue";
+export default defineComponent({
+  name: "argLineBreak",
+  components: { argStyle }
+});
+</script>
+<style>
+.arg_line_break{
+    background: var(--base-dividers, #ECECF2);
+    margin: 0;
+    height: 1px;
+    border: 0px solid transparent;
+}
+</style>

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

@@ -0,0 +1,2 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+export default _default;

package/dist/runtime/components/argMainLayout.vue

@@ -0,0 +1,56 @@
+<template>
+    <div class="arg_main_layout_container">
+        <slot name="sidebar"/>
+        <div class="arg_main_layout_body">
+            <slot name="header"/>
+            <div class="arg_main_layout_section" id="arg_main_layout_section">
+                <slot name="body"/>
+            </div>
+            <argFooter />
+        </div>
+        
+    </div>
+</template>
+<script>
+import {
+  onMounted,
+  defineComponent
+} from "vue";
+import argIcon from "./argIcon.vue";
+import argStyle from "./argStyle.vue";
+import argFooter from "./argFooter.vue";
+export default defineComponent({
+  name: "argMainLayout",
+  components: { argIcon, argStyle, argFooter },
+  setup() {
+    onMounted(() => {
+      adjustMarginForBody();
+      window.addEventListener("resize", adjustMarginForBody);
+    });
+    function adjustMarginForBody() {
+      const fixedHeader = document.getElementById("arg_header");
+      const bodyContent = document.getElementById("arg_main_layout_section");
+      if (fixedHeader && bodyContent) {
+        const headerHeight = fixedHeader.offsetHeight;
+        bodyContent.style.marginTop = `${headerHeight}px`;
+      }
+    }
+  }
+});
+</script>
+<style>
+.arg_main_layout_container{
+    margin-left: 200px;
+}
+.arg_main_layout_body{
+    display: flex;
+    flex-direction: column;
+}
+.arg_main_layout_section{
+    min-height: calc(100vh - 77px);
+    padding: 8px;
+}
+.arg_main_layout_body .arg_header{
+    width: calc(100% - 200px);
+}
+</style>

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

@@ -0,0 +1,2 @@
+declare const _default: import("vue").DefineComponent<{}, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
+export default _default;

package/dist/runtime/components/argMenuItem.vue

@@ -0,0 +1,73 @@
+<template>
+        <NuxtLink :to="to" class="auriga_menu_item" activeClass="is-active">
+            <arg-icon :name="icon" v-if="icon" size="20"/>
+            <arg-flag :iso="countryIso" v-if="countryIso" emoji height="14"/>
+           {{ label }}
+        </NuxtLink>
+</template>
+<script>
+import argIcon from "./argIcon.vue";
+import argStyle from "./argStyle.vue";
+import argFlag from "./argFlag.vue";
+import {
+  defineComponent
+} from "vue";
+export default defineComponent({
+  name: "argMenuItem",
+  components: { argIcon, argStyle, argFlag },
+  props: {
+    to: { type: String, required: true },
+    //Require eiter an icon or a country flag
+    icon: {
+      type: String,
+      validator: function(value) {
+        if (!value && !this.countryIso) {
+          console.warn("Either 'icon' or 'country' should be provided.");
+          return false;
+        }
+        return true;
+      }
+    },
+    countryIso: {
+      type: String,
+      validator: function(value) {
+        if (!value && !this.icon) {
+          console.warn("Either 'icon' or 'country' should be provided.");
+          return false;
+        }
+        return true;
+      }
+    },
+    label: { type: String, required: true }
+  }
+});
+</script>
+<style scoped>
+.auriga_menu_item{
+    display: flex;
+    height: 32px;
+    padding: 8px;
+    align-items: center;
+    gap: 8px;
+    align-self: stretch;
+    border-radius: 4px;
+    font-size: 14px;
+    font-style: normal;
+    font-weight: 400;
+    line-height: 160%;
+    color: var(--independence);
+}
+.auriga_menu_item svg{
+    color: var(--primary, #2176FF) !important;
+}
+.auriga_menu_item.is-active{
+    background: var(--primary, #2176FF);
+    color: #FFF;
+}
+.auriga_menu_item.is-active svg{
+    color: #FFF !important;
+}
+.auriga_menu_item:hover:not(.is-active){
+    background: var(--base-dividers, #ECECF2);
+}
+</style>

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

@@ -0,0 +1,36 @@
+declare const _default: import("vue").DefineComponent<{
+    to: {
+        type: StringConstructor;
+        required: true;
+    };
+    icon: {
+        type: StringConstructor;
+        validator: (this: any, value: string | undefined) => boolean;
+    };
+    countryIso: {
+        type: StringConstructor;
+        validator: (this: any, value: string | undefined) => boolean;
+    };
+    label: {
+        type: StringConstructor;
+        required: true;
+    };
+}, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    to: {
+        type: StringConstructor;
+        required: true;
+    };
+    icon: {
+        type: StringConstructor;
+        validator: (this: any, value: string | undefined) => boolean;
+    };
+    countryIso: {
+        type: StringConstructor;
+        validator: (this: any, value: string | undefined) => boolean;
+    };
+    label: {
+        type: StringConstructor;
+        required: true;
+    };
+}>>, {}, {}>;
+export default _default;