@tekkare/auriga 0.1.43 → 0.1.45

package/dist/module.json

@@ -4,5 +4,5 @@
   "compatibility": {
     "nuxt": "^3.0.0"
   },
-  "version": "0.1.43"
+  "version": "0.1.45"
 }

package/dist/runtime/components/argBtn.vue

@@ -18,13 +18,19 @@
       @click="send()"
     >
       <span :class="{ oip_button_is_loading: loading }" class="oip_button_flex">
-        <span v-if="prefixIcon">
-          <arg-icon :name="prefixIcon" size="20" :color="getIconColor" />
-        </span>
+        <arg-icon
+          v-if="prefixIcon"
+          :name="prefixIcon"
+          size="20"
+          :color="getIconColor"
+        />
         <slot></slot>
-        <span v-if="suffixIcon">
-          <arg-icon :name="suffixIcon" size="20" :color="getIconColor" />
-        </span>
+        <arg-icon
+          v-if="suffixIcon"
+          :name="suffixIcon"
+          size="20"
+          :color="getIconColor"
+        />
       </span>
       <span class="oip_button_loading" v-if="loading">
         <div class="oip_button_spinner">

package/dist/runtime/components/argMainLayout.vue

@@ -3,7 +3,11 @@
   <div :class="sidebarOpen ? 'arg_main_with_sidebar' : 'arg_main_no_sidebar'">
     <slot name="sidebar" />
     <div class="arg_main_layout_body">
-      <div class="arg_info" id="arg_info_section">
+      <div
+        class="arg_info"
+        :class="infoOpen ? 'arg_info_open' : 'arg_info_closed'"
+        id="arg_info_section"
+      >
         <slot name="infoBar" />
         <slot name="infoSection" />
       </div>
@@ -29,6 +33,10 @@ export default defineComponent({
     sidebarOpen: {
       type: Boolean,
       default: true
+    },
+    infoOpen: {
+      type: Boolean,
+      default: false
     }
   },
   setup() {
@@ -81,6 +89,12 @@ export default defineComponent({
 .arg_info {
   position: fixed;
   right: 8px;
-  z-index: 98;
+}
+
+.arg_info_open {
+  z-index: 99;
+}
+.arg_info_closed {
+  z-index: 95;
 }
 </style>

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

@@ -3,12 +3,21 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    infoOpen: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }, void, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     sidebarOpen: {
         type: BooleanConstructor;
         default: boolean;
     };
+    infoOpen: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>>, {
     sidebarOpen: boolean;
+    infoOpen: boolean;
 }, {}>;
 export default _default;

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

@@ -1,10 +1,10 @@
 declare const _default: import("vue").DefineComponent<{
     element_table: {
         type: {
-            (arrayLength: number): any[];
-            (...items: any[]): any[];
-            new (arrayLength: number): any[];
-            new (...items: any[]): any[];
+            (arrayLength: number): (Object | String)[];
+            (...items: (Object | String)[]): (Object | String)[];
+            new (arrayLength: number): (Object | String)[];
+            new (...items: (Object | String)[]): (Object | String)[];
             isArray(arg: any): arg is any[];
             readonly prototype: any[];
             from<T>(arrayLike: ArrayLike<T>): T[];
@@ -143,10 +143,10 @@ declare const _default: import("vue").DefineComponent<{
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("onClose" | "changeElement" | "update:Selection" | "changeInputValue")[], "onClose" | "changeElement" | "update:Selection" | "changeInputValue", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     element_table: {
         type: {
-            (arrayLength: number): any[];
-            (...items: any[]): any[];
-            new (arrayLength: number): any[];
-            new (...items: any[]): any[];
+            (arrayLength: number): (Object | String)[];
+            (...items: (Object | String)[]): (Object | String)[];
+            new (arrayLength: number): (Object | String)[];
+            new (...items: (Object | String)[]): (Object | String)[];
             isArray(arg: any): arg is any[];
             readonly prototype: any[];
             from<T>(arrayLike: ArrayLike<T>): T[];

package/dist/runtime/components/argNoSelectedScope.vue

@@ -8,7 +8,7 @@
         {{ getNoScopeMsg }}
       </div>
       <div v-if="scopeArray.length > 0" class="arg_scopes_select">
-        <div class="oip_row v-center justify-between">
+        <div class="oip_row v-center justify-between full_row">
           <p class="args_select_title">
             {{
               lang === "fr"
@@ -147,6 +147,7 @@ export default defineComponent({
   flex-direction: column;
   align-items: flex-start;
   gap: 8px;
+  align-self: stretch;
 }
 
 .args_select_title {
@@ -174,4 +175,11 @@ export default defineComponent({
   line-height: normal;
   color: var(--wild-blue-yonder);
 }
+
+.full_row {
+  align-self: stretch;
+}
+.justify-between {
+  justify-content: space-between;
+}
 </style>

package/dist/runtime/components/argScopeChange.vue

@@ -0,0 +1,194 @@
+<template>
+  <div class="scope_change_display">
+    <arg-btn btn-style="primary-fill" @onClick="changeDisplay()">{{
+      getTitle
+    }}</arg-btn>
+    <div
+      :style="
+        isDisplay === false || scopes.length === 0 ? 'display : none' : ''
+      "
+      class="scope_select_dropdown_block"
+    >
+      <div class="oip_select_dropdown_selection_container">
+        <arg-btn
+          btn-style="primary-stroke"
+          class="my-4"
+          @onClick="newScope()"
+          prefix-icon="PlusCircle"
+          >{{ lang === "fr" ? "Nouveau scope" : "New scope" }}</arg-btn
+        >
+        <div
+          v-for="(element, index) of scopes"
+          :key="index"
+          class="oip_select_complex_selection_loop"
+          @click="selectScope(element)"
+        >
+          <arg-icon
+            :class="selectedScope?.id === element.id ? 'add' : ''"
+            :color="
+              selectedScope?.id === element.id
+                ? 'var(--primary)'
+                : 'var(--lavendar-grey)'
+            "
+            size="16"
+            :name="
+              selectedScope?.id === element.id ? 'CircleSelectFill' : 'Circle'
+            "
+          />
+          <div
+            :class="[
+              'oip_select_complex_selection_loop_name',
+              selectedScope?.id === element.id ? 'add' : 'del',
+            ]"
+          >
+            {{ element.title }}
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import argIcon from "./argIcon.vue";
+import argBtn from "./argBtn.vue";
+import {
+  onMounted,
+  ref,
+  computed,
+  defineComponent,
+  onUnmounted
+} from "vue";
+export default defineComponent({
+  name: "argScopeChange",
+  components: { argIcon, argBtn },
+  props: {
+    scopes: { type: Array, required: true },
+    active_scope: { type: Object, required: false, default: null },
+    lang: {
+      type: String,
+      default: "en",
+      validator: (value) => {
+        return ["en", "fr"].includes(value);
+      }
+    }
+  },
+  emits: ["changeScope", "update:Scope", "onNewScope"],
+  setup(props, { emit }) {
+    const isDisplay = ref(false);
+    const selectedScope = ref(null);
+    onMounted(() => {
+      if (props.active_scope !== null) {
+        selectedScope.value = props.active_scope;
+      }
+    });
+    const getTitle = computed(() => {
+      if (props.scopes.length > 0) {
+        return props.lang === "en" ? "Change scope" : "Changer de scope";
+      } else
+        return props.lang === "en" ? "New scope" : "Nouveau scope";
+    });
+    function closeDropdown() {
+      isDisplay.value = false;
+      document?.removeEventListener("click", closeDropdown);
+    }
+    function selectScope(scope) {
+      selectedScope.value = scope;
+      emit("changeScope", scope);
+      emit("update:Scope", scope);
+    }
+    function changeDisplay() {
+      if (props.scopes.length === 0) {
+        emit("onNewScope");
+      } else {
+        if (isDisplay.value === true) {
+          isDisplay.value = !isDisplay.value;
+        } else {
+          isDisplay.value = !isDisplay.value;
+          setTimeout(() => {
+            document?.addEventListener("click", closeDropdown);
+          }, 100);
+        }
+      }
+    }
+    function newScope() {
+      emit("onNewScope");
+    }
+    onUnmounted(() => {
+      document?.removeEventListener("click", closeDropdown);
+    });
+    return {
+      isDisplay,
+      closeDropdown,
+      changeDisplay,
+      getTitle,
+      selectScope,
+      selectedScope,
+      newScope
+    };
+  }
+});
+</script>
+
+<style scoped>
+.scope_select_dropdown_block {
+  z-index: 99 !important;
+  margin-top: 15px;
+  position: absolute;
+  min-width: 100px;
+  max-height: 200px;
+  border: 1.5px solid var(--dividers);
+  background: var(--demi-fond);
+  border-radius: 12px;
+  box-shadow: var(--overlay-shadow);
+  padding: 16px;
+  display: flex;
+  flex-direction: column;
+  right: -16px;
+}
+
+.scope_change_display {
+  position: relative;
+}
+
+.oip_select_complex_selection_loop > svg.add {
+  color: var(--primary) !important;
+}
+.oip_select_complex_selection_loop > svg.disable,
+.oip_select_complex_selection_loop.disabled_option:hover svg {
+  color: var(--independence) !important;
+}
+.oip_select_complex_selection_loop:hover > svg.add {
+  color: var(--primary-hover) !important;
+}
+
+.oip_select_complex_selection_loop:hover svg {
+  color: var(--primary) !important;
+}
+.oip_select_complex_selection_loop .add {
+  font-weight: 700 !important;
+}
+.oip_select_complex_selection_loop:hover {
+  background: rgba(33, 118, 255, 0.05) !important;
+  border-radius: 4px !important;
+}
+.oip_select_complex_selection_loop {
+  padding: 2px 4px;
+}
+.oip_select_complex_selection_loop.disabled_option:hover {
+  background: transparent !important;
+}
+.oip_select_complex_selection_loop {
+  margin: 4px 0px !important;
+}
+svg.add {
+  flex-shrink: 0;
+}
+.my-4 {
+  margin: 4px 0px;
+}
+
+.full_width {
+  width: 100%;
+}
+</style>

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

@@ -0,0 +1,73 @@
+declare const _default: import("vue").DefineComponent<{
+    scopes: {
+        type: {
+            (arrayLength: number): string[];
+            (...items: string[]): string[];
+            new (arrayLength: number): string[];
+            new (...items: string[]): string[];
+            isArray(arg: any): arg is any[];
+            readonly prototype: any[];
+            from<T>(arrayLike: ArrayLike<T>): T[];
+            from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
+            from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
+            from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
+            of<T_4>(...items: T_4[]): T_4[];
+            readonly [Symbol.species]: ArrayConstructor;
+        };
+        required: true;
+    };
+    active_scope: {
+        type: ObjectConstructor;
+        required: false;
+        default: null;
+    };
+    lang: {
+        type: StringConstructor;
+        default: string;
+        validator: (value: string) => boolean;
+    };
+}, {
+    isDisplay: import("vue").Ref<boolean>;
+    closeDropdown: () => void;
+    changeDisplay: () => void;
+    getTitle: import("vue").ComputedRef<"Change scope" | "Changer de scope" | "New scope" | "Nouveau scope">;
+    selectScope: (scope: any) => void;
+    selectedScope: any;
+    newScope: () => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:Scope" | "changeScope" | "onNewScope")[], "update:Scope" | "changeScope" | "onNewScope", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    scopes: {
+        type: {
+            (arrayLength: number): string[];
+            (...items: string[]): string[];
+            new (arrayLength: number): string[];
+            new (...items: string[]): string[];
+            isArray(arg: any): arg is any[];
+            readonly prototype: any[];
+            from<T>(arrayLike: ArrayLike<T>): T[];
+            from<T_1, U>(arrayLike: ArrayLike<T_1>, mapfn: (v: T_1, k: number) => U, thisArg?: any): U[];
+            from<T_2>(iterable: Iterable<T_2> | ArrayLike<T_2>): T_2[];
+            from<T_3, U_1>(iterable: Iterable<T_3> | ArrayLike<T_3>, mapfn: (v: T_3, k: number) => U_1, thisArg?: any): U_1[];
+            of<T_4>(...items: T_4[]): T_4[];
+            readonly [Symbol.species]: ArrayConstructor;
+        };
+        required: true;
+    };
+    active_scope: {
+        type: ObjectConstructor;
+        required: false;
+        default: null;
+    };
+    lang: {
+        type: StringConstructor;
+        default: string;
+        validator: (value: string) => boolean;
+    };
+}>> & {
+    "onUpdate:Scope"?: ((...args: any[]) => any) | undefined;
+    onChangeScope?: ((...args: any[]) => any) | undefined;
+    onOnNewScope?: ((...args: any[]) => any) | undefined;
+}, {
+    lang: string;
+    active_scope: Record<string, any>;
+}, {}>;
+export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tekkare/auriga",
-  "version": "0.1.43",
+  "version": "0.1.45",
   "description": "Aurgia is a UI kit developped by Tekkare",
   "license": "MIT",
   "type": "module",