@tekkare/auriga 0.1.8 → 0.1.10

package/dist/runtime/components/argMenuItem.vue

@@ -1,9 +1,16 @@
 <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>
+  <NuxtLink :to="to" class="auriga_menu_item" activeClass="is-active">
+    <arg-tooltip
+      :tooltip-text="label"
+      :disable="sidebarOpen"
+      dir="right"
+      :class="['tooltip_display', sidebarOpen ? '' : 'menu_tooltip_icon']"
+    >
+      <arg-icon :name="icon" v-if="icon" size="20" />
+    </arg-tooltip>
+    <arg-flag :iso="countryIso" v-if="countryIso" emoji height="14" />
+    <span v-show="sidebarOpen">{{ label }}</span>
+  </NuxtLink>
 </template>
 <script>
 import argIcon from "./argIcon.vue";
@@ -28,6 +35,10 @@ export default defineComponent({
         return true;
       }
     },
+    sidebarOpen: {
+      type: Boolean,
+      default: true
+    },
     countryIso: {
       type: String,
       validator: function(value) {
@@ -43,31 +54,37 @@ export default defineComponent({
 });
 </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 {
+  display: flex;
+  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(--cool-grey) !important;
+}
+.auriga_menu_item.is-active svg,
+.auriga_menu_item:hover:not(.is-active) svg {
+  color: var(--primary, #2176ff) !important;
 }
-.auriga_menu_item svg{
-    color: var(--primary, #2176FF) !important;
+.auriga_menu_item.is-active {
+  background: rgba(33, 118, 255, 0.1) !important;
 }
-.auriga_menu_item.is-active{
-    background: var(--primary, #2176FF);
-    color: #FFF;
+.auriga_menu_item:hover:not(.is-active) {
+  background: var(--base-dividers, #ececf2);
 }
-.auriga_menu_item.is-active svg{
-    color: #FFF !important;
+.menu_tooltip_icon {
+  flex: 1 1 100%;
 }
-.auriga_menu_item:hover:not(.is-active){
-    background: var(--base-dividers, #ECECF2);
+.tooltip_display {
+  display: flex !important;
 }
 </style>

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

@@ -7,6 +7,10 @@ declare const _default: import("vue").DefineComponent<{
         type: StringConstructor;
         validator: (this: any, value: string | undefined) => boolean;
     };
+    sidebarOpen: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     countryIso: {
         type: StringConstructor;
         validator: (this: any, value: string | undefined) => boolean;
@@ -24,6 +28,10 @@ declare const _default: import("vue").DefineComponent<{
         type: StringConstructor;
         validator: (this: any, value: string | undefined) => boolean;
     };
+    sidebarOpen: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
     countryIso: {
         type: StringConstructor;
         validator: (this: any, value: string | undefined) => boolean;
@@ -32,5 +40,7 @@ declare const _default: import("vue").DefineComponent<{
         type: StringConstructor;
         required: true;
     };
-}>>, {}, {}>;
+}>>, {
+    sidebarOpen: boolean;
+}, {}>;
 export default _default;

package/dist/runtime/components/argMenuLink.vue

@@ -1,8 +1,15 @@
 <template>
-    <nuxt-link :to="to" class="arg_menu_link">
-        <arg-icon :name="icon" color="var(--primary)" size="20"/>
-        {{label}}
-    </nuxt-link>
+  <nuxt-link :to="to" class="arg_menu_link">
+    <arg-tooltip
+      :tooltip-text="label"
+      :disable="sidebarOpen"
+      dir="right"
+      :class="['tooltip_display', sidebarOpen ? '' : 'link_menu_tooltip_icon']"
+    >
+      <arg-icon :name="icon" color="var(--cool-grey)" size="20" />
+    </arg-tooltip>
+    <span v-show="sidebarOpen">{{ label }}</span>
+  </nuxt-link>
 </template>
 <script>
 import {
@@ -16,24 +23,41 @@ export default defineComponent({
   props: {
     icon: { type: String, required: true },
     label: { type: String, required: true },
-    to: { type: String, required: true, default: "/" }
+    to: { type: String, required: true, default: "/" },
+    sidebarOpen: { type: Boolean, default: true }
   }
 });
 </script>
 <style>
-.arg_menu_link{
-    display: flex;
-    height: 32px;
-    padding: 6px;
-    align-items: center;
-    gap: 6px;
-    align-self: stretch;
-    color: var(--primary);
-    font-size: 14px;
-    font-style: normal;
-    font-weight: 400;
-    line-height: 160%; 
-    text-transform: capitalize;
-    cursor: pointer;
+.arg_menu_link {
+  display: flex;
+  padding: 6px;
+  align-items: center;
+  gap: 6px;
+  align-self: stretch;
+  color: var(--independence);
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: 160%;
+  text-transform: capitalize;
+  cursor: pointer;
+  border-radius: 4px;
+  margin: 8px 0px;
 }
-</style>
+
+.arg_menu_link:hover svg {
+  color: var(--primary) !important;
+}
+
+.arg_menu_link:hover {
+  background: var(--base-dividers, #ececf2);
+}
+
+.link_menu_tooltip_icon {
+  flex: 1 1 100%;
+}
+.tooltip_display {
+  display: flex !important;
+}
+</style>

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

@@ -12,6 +12,10 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
         default: string;
     };
+    sidebarOpen: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }, unknown, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     icon: {
         type: StringConstructor;
@@ -26,7 +30,12 @@ declare const _default: import("vue").DefineComponent<{
         required: true;
         default: string;
     };
+    sidebarOpen: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>>, {
+    sidebarOpen: boolean;
     to: string;
 }, {}>;
 export default _default;

package/dist/runtime/components/argMultipleChoice.vue

@@ -21,7 +21,8 @@
 import argIcon from "./argIcon.vue";
 import {
   ref,
-  defineComponent
+  defineComponent,
+  onBeforeMount
 } from "vue";
 export default defineComponent({
   name: "argMultipleChoice",
@@ -41,15 +42,36 @@ export default defineComponent({
     },
     return_value: {
       type: Boolean,
-      default: false
+      default: true
     }
   },
   emits: ["changeElement", "update:Selection"],
   setup(props, { emit }) {
     const intArray = [];
     const stringArray = [];
-    let selectedInts = ref(intArray);
-    let selectedString = ref(stringArray);
+    const selectedInts = ref(intArray);
+    const selectedString = ref(stringArray);
+    onBeforeMount(() => {
+      if (props.default_select.length > 0) {
+        for (let i = 0; i < props.default_select.length; i++) {
+          if (props.return_value) {
+            selectedString.value.push(
+              props.element_table[props.default_select[i]]
+            );
+          } else {
+            selectedInts.value.push(props.default_select[i]);
+          }
+        }
+        emit(
+          "changeElement",
+          props.return_value ? selectedString.value : selectedInts.value
+        );
+        emit(
+          "update:Selection",
+          props.return_value ? selectedString.value : selectedInts.value
+        );
+      }
+    });
     function isSelected(index, option) {
       if (selectedInts.value?.includes(index) || selectedString.value?.includes(option)) {
         return true;