@data-fair/lib-vuetify 1.1.0 → 1.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@data-fair/lib-vuetify",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "description": "Components based on the Vuetify 3 UI lib for the data-fair stack.",
   "main": "index.js",
   "files": [
@@ -16,7 +16,7 @@
     "build": "cd .. && npm run build"
   },
   "peerDependencies": {
-    "@data-fair/lib-vue": "^1.1.0",
+    "@data-fair/lib-vue": "^1.2.0",
     "ofetch": "1",
     "vue-i18n": "10",
     "vuetify": "3"

package/personal-menu.vue

@@ -24,9 +24,8 @@
             v-if="user.pd"
             color="warning"
             style="position:absolute;"
-          >
-            mdi-alert
-          </v-icon>
+            :icon="mdiAlert"
+          />
         </v-btn>
       </template>
 
@@ -134,7 +133,7 @@
           class="personal-menu-switch-list-item"
         >
           <template #prepend>
-            <v-icon>mdi-shield-alert</v-icon>
+            <v-icon :icon="mdiShieldAlert" />
           </template>
           <v-list-item-title>
             <v-switch
@@ -157,7 +156,7 @@
           @click="session.asAdmin(null)"
         >
           <template #prepend>
-            <v-icon>mdi-account-switch-outline</v-icon>
+            <v-icon :icon="mdiAccountSwitchOutline" />
           </template>
           <v-list-item-title>{{ t('backToAdmin') }}</v-list-item-title>
         </v-list-item>
@@ -169,7 +168,7 @@
           class="personal-menu-switch-list-item"
         >
           <template #prepend>
-            <v-icon>mdi-weather-night</v-icon>
+            <v-icon :icon="mdiWeatherNight" />
           </template>
           <v-list-item-title>
             <v-switch
@@ -190,7 +189,7 @@
           @click="() => session.logout()"
         >
           <template #prepend>
-            <v-icon>mdi-logout</v-icon>
+            <v-icon :icon="mdiLogout" />
           </template>
           <v-list-item-title v-t="'logout'" />
         </v-list-item>
@@ -230,6 +229,7 @@ import { useI18n } from 'vue-i18n'
 import { useSession } from '@data-fair/lib-vue/session.js'
 import { useTheme } from 'vuetify'
 import UserAvatar from './user-avatar.vue'
+import { mdiAlert, mdiShieldAlert, mdiLogout, mdiAccountSwitchOutline, mdiWeatherNight } from '@mdi/js'
 
 const theme = useTheme()
 const session = useSession()

package/personal-menu.vue.js

@@ -4,6 +4,7 @@ import { useI18n } from 'vue-i18n';
 import { useSession } from '@data-fair/lib-vue/session.js';
 import { useTheme } from 'vuetify';
 import UserAvatar from './user-avatar.vue';
+import { mdiAlert, mdiShieldAlert, mdiLogout, mdiAccountSwitchOutline, mdiWeatherNight } from '@mdi/js';
 const { defineProps, defineSlots, defineEmits, defineExpose, defineModel, defineOptions, withDefaults, } = await import('vue');
 const theme = useTheme();
 const session = useSession();
@@ -83,12 +84,10 @@ function __VLS_template() {
             const __VLS_25 = __VLS_24({ showAccount: (true), }, ...__VLS_functionalComponentArgsRest(__VLS_24));
             if (__VLS_ctx.user.pd) {
                 const __VLS_29 = __VLS_resolvedLocalAndGlobalComponents.VIcon;
-                /** @type { [typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, ] } */
+                /** @type { [typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, ] } */
                 // @ts-ignore
-                const __VLS_30 = __VLS_asFunctionalComponent(__VLS_29, new __VLS_29({ color: ("warning"), ...{ style: ({}) }, }));
-                const __VLS_31 = __VLS_30({ color: ("warning"), ...{ style: ({}) }, }, ...__VLS_functionalComponentArgsRest(__VLS_30));
-                __VLS_nonNullable(__VLS_34.slots).default;
-                const __VLS_34 = __VLS_pickFunctionalComponentCtx(__VLS_29, __VLS_31);
+                const __VLS_30 = __VLS_asFunctionalComponent(__VLS_29, new __VLS_29({ color: ("warning"), ...{ style: ({}) }, icon: ((__VLS_ctx.mdiAlert)), }));
+                const __VLS_31 = __VLS_30({ color: ("warning"), ...{ style: ({}) }, icon: ((__VLS_ctx.mdiAlert)), }, ...__VLS_functionalComponentArgsRest(__VLS_30));
             }
             __VLS_nonNullable(__VLS_23.slots).default;
             const __VLS_23 = __VLS_pickFunctionalComponentCtx(__VLS_18, __VLS_20);
@@ -289,12 +288,10 @@ function __VLS_template() {
             {
                 const { prepend: __VLS_thisSlot } = __VLS_nonNullable(__VLS_154.slots);
                 const __VLS_155 = __VLS_resolvedLocalAndGlobalComponents.VIcon;
-                /** @type { [typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, ] } */
+                /** @type { [typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, ] } */
                 // @ts-ignore
-                const __VLS_156 = __VLS_asFunctionalComponent(__VLS_155, new __VLS_155({}));
-                const __VLS_157 = __VLS_156({}, ...__VLS_functionalComponentArgsRest(__VLS_156));
-                __VLS_nonNullable(__VLS_160.slots).default;
-                const __VLS_160 = __VLS_pickFunctionalComponentCtx(__VLS_155, __VLS_157);
+                const __VLS_156 = __VLS_asFunctionalComponent(__VLS_155, new __VLS_155({ icon: ((__VLS_ctx.mdiShieldAlert)), }));
+                const __VLS_157 = __VLS_156({ icon: ((__VLS_ctx.mdiShieldAlert)), }, ...__VLS_functionalComponentArgsRest(__VLS_156));
             }
             const __VLS_161 = __VLS_resolvedLocalAndGlobalComponents.VListItemTitle;
             /** @type { [typeof __VLS_components.VListItemTitle, typeof __VLS_components.vListItemTitle, typeof __VLS_components.VListItemTitle, typeof __VLS_components.vListItemTitle, ] } */
@@ -339,12 +336,10 @@ function __VLS_template() {
             {
                 const { prepend: __VLS_thisSlot } = __VLS_nonNullable(__VLS_180.slots);
                 const __VLS_183 = __VLS_resolvedLocalAndGlobalComponents.VIcon;
-                /** @type { [typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, ] } */
+                /** @type { [typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, ] } */
                 // @ts-ignore
-                const __VLS_184 = __VLS_asFunctionalComponent(__VLS_183, new __VLS_183({}));
-                const __VLS_185 = __VLS_184({}, ...__VLS_functionalComponentArgsRest(__VLS_184));
-                __VLS_nonNullable(__VLS_188.slots).default;
-                const __VLS_188 = __VLS_pickFunctionalComponentCtx(__VLS_183, __VLS_185);
+                const __VLS_184 = __VLS_asFunctionalComponent(__VLS_183, new __VLS_183({ icon: ((__VLS_ctx.mdiAccountSwitchOutline)), }));
+                const __VLS_185 = __VLS_184({ icon: ((__VLS_ctx.mdiAccountSwitchOutline)), }, ...__VLS_functionalComponentArgsRest(__VLS_184));
             }
             const __VLS_189 = __VLS_resolvedLocalAndGlobalComponents.VListItemTitle;
             /** @type { [typeof __VLS_components.VListItemTitle, typeof __VLS_components.vListItemTitle, typeof __VLS_components.VListItemTitle, typeof __VLS_components.vListItemTitle, ] } */
@@ -366,12 +361,10 @@ function __VLS_template() {
             {
                 const { prepend: __VLS_thisSlot } = __VLS_nonNullable(__VLS_200.slots);
                 const __VLS_201 = __VLS_resolvedLocalAndGlobalComponents.VIcon;
-                /** @type { [typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, ] } */
+                /** @type { [typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, ] } */
                 // @ts-ignore
-                const __VLS_202 = __VLS_asFunctionalComponent(__VLS_201, new __VLS_201({}));
-                const __VLS_203 = __VLS_202({}, ...__VLS_functionalComponentArgsRest(__VLS_202));
-                __VLS_nonNullable(__VLS_206.slots).default;
-                const __VLS_206 = __VLS_pickFunctionalComponentCtx(__VLS_201, __VLS_203);
+                const __VLS_202 = __VLS_asFunctionalComponent(__VLS_201, new __VLS_201({ icon: ((__VLS_ctx.mdiWeatherNight)), }));
+                const __VLS_203 = __VLS_202({ icon: ((__VLS_ctx.mdiWeatherNight)), }, ...__VLS_functionalComponentArgsRest(__VLS_202));
             }
             const __VLS_207 = __VLS_resolvedLocalAndGlobalComponents.VListItemTitle;
             /** @type { [typeof __VLS_components.VListItemTitle, typeof __VLS_components.vListItemTitle, typeof __VLS_components.VListItemTitle, typeof __VLS_components.vListItemTitle, ] } */
@@ -414,12 +407,10 @@ function __VLS_template() {
         {
             const { prepend: __VLS_thisSlot } = __VLS_nonNullable(__VLS_232.slots);
             const __VLS_235 = __VLS_resolvedLocalAndGlobalComponents.VIcon;
-            /** @type { [typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, ] } */
+            /** @type { [typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, ] } */
             // @ts-ignore
-            const __VLS_236 = __VLS_asFunctionalComponent(__VLS_235, new __VLS_235({}));
-            const __VLS_237 = __VLS_236({}, ...__VLS_functionalComponentArgsRest(__VLS_236));
-            __VLS_nonNullable(__VLS_240.slots).default;
-            const __VLS_240 = __VLS_pickFunctionalComponentCtx(__VLS_235, __VLS_237);
+            const __VLS_236 = __VLS_asFunctionalComponent(__VLS_235, new __VLS_235({ icon: ((__VLS_ctx.mdiLogout)), }));
+            const __VLS_237 = __VLS_236({ icon: ((__VLS_ctx.mdiLogout)), }, ...__VLS_functionalComponentArgsRest(__VLS_236));
         }
         const __VLS_241 = __VLS_resolvedLocalAndGlobalComponents.VListItemTitle;
         /** @type { [typeof __VLS_components.VListItemTitle, typeof __VLS_components.vListItemTitle, ] } */
@@ -460,6 +451,11 @@ const __VLS_self = (await import('vue')).defineComponent({
     setup() {
         return {
             UserAvatar: UserAvatar,
+            mdiAlert: mdiAlert,
+            mdiShieldAlert: mdiShieldAlert,
+            mdiLogout: mdiLogout,
+            mdiAccountSwitchOutline: mdiAccountSwitchOutline,
+            mdiWeatherNight: mdiWeatherNight,
             theme: theme,
             session: session,
             t: t,

package/tutorial-alert.vue

@@ -18,7 +18,7 @@
           v-if="href"
           :href="href"
           target="_blank"
-        >{{ text || $t('readDoc') }}</a>
+        >{{ text || t('readDoc') }}</a>
         <template v-else>
           <span
             v-if="text"
@@ -37,15 +37,11 @@
       icon
       density="compact"
       color="success"
-      :title="show ? $t('closeHelp') : $t('readHelp')"
+      :title="show ? t('closeHelp') : t('readHelp')"
       @click="show = !show"
     >
-      <v-icon v-if="show">
-        mdi-close-circle
-      </v-icon>
-      <v-icon v-else>
-        mdi-information
-      </v-icon>
+      <v-icon v-if="show":icon="mdiCloseCircle" />
+      <v-icon v-else :icon="mdiInformation" />
     </v-btn>
   </div>
 </template>
@@ -63,6 +59,8 @@ en:
 
 <script lang="ts">
 import { useTheme } from 'vuetify'
+import { useI18n } from 'vue-i18n'
+import { mdiCloseCircle, mdiInformation } from '@mdi/js'
 
 export default {
   props: {
@@ -75,10 +73,13 @@ export default {
   },
   setup () {
     const theme = useTheme()
-    return { theme }
+    const { t } = useI18n({ useScope: 'local' })
+    return { theme, t }
   },
   data: () => ({
-    show: false
+    show: false,
+    mdiCloseCircle,
+    mdiInformation
   }),
   computed: {
     showBtn () {

package/tutorial-alert.vue.d.ts

@@ -28,8 +28,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     };
 }>, {
     theme: import("vuetify", { with: { "resolution-mode": "import" } }).ThemeInstance;
+    t: import("vue-i18n").ComposerTranslation<{}, string, import("@intlify/core-base").RemoveIndexSignature<{
+        [x: string]: import("vue-i18n").LocaleMessageValue<import("vue-i18n").VueMessageType>;
+    }>, never, never, never>;
 }, {
     show: boolean;
+    mdiCloseCircle: string;
+    mdiInformation: string;
 }, {
     showBtn(): boolean;
 }, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{

package/tutorial-alert.vue.js

@@ -1,5 +1,7 @@
 /// <reference types=".vue-global-types/vue_3.5_false.d.ts" />
 import { useTheme } from 'vuetify';
+import { useI18n } from 'vue-i18n';
+import { mdiCloseCircle, mdiInformation } from '@mdi/js';
 export default (await import('vue')).defineComponent({
     props: {
         id: { type: String, required: true },
@@ -11,10 +13,13 @@ export default (await import('vue')).defineComponent({
     },
     setup() {
         const theme = useTheme();
-        return { theme };
+        const { t } = useI18n({ useScope: 'local' });
+        return { theme, t };
     },
     data: () => ({
-        show: false
+        show: false,
+        mdiCloseCircle,
+        mdiInformation
     }),
     computed: {
         showBtn() {
@@ -61,7 +66,7 @@ function __VLS_template() {
             var __VLS_6 = {};
             if (__VLS_ctx.href) {
                 __VLS_elementAsFunction(__VLS_intrinsicElements.a, __VLS_intrinsicElements.a)({ href: ((__VLS_ctx.href)), target: ("_blank"), });
-                (__VLS_ctx.text || __VLS_ctx.$t('readDoc'));
+                (__VLS_ctx.text || __VLS_ctx.t('readDoc'));
             }
             else {
                 if (__VLS_ctx.text) {
@@ -81,8 +86,8 @@ function __VLS_template() {
             const __VLS_7 = __VLS_resolvedLocalAndGlobalComponents.VBtn;
             /** @type { [typeof __VLS_components.VBtn, typeof __VLS_components.vBtn, typeof __VLS_components.VBtn, typeof __VLS_components.vBtn, ] } */
             // @ts-ignore
-            const __VLS_8 = __VLS_asFunctionalComponent(__VLS_7, new __VLS_7({ ...{ 'onClick': {} }, ...{ class: ("toggle") }, icon: (true), density: ("compact"), color: ("success"), title: ((__VLS_ctx.show ? __VLS_ctx.$t('closeHelp') : __VLS_ctx.$t('readHelp'))), }));
-            const __VLS_9 = __VLS_8({ ...{ 'onClick': {} }, ...{ class: ("toggle") }, icon: (true), density: ("compact"), color: ("success"), title: ((__VLS_ctx.show ? __VLS_ctx.$t('closeHelp') : __VLS_ctx.$t('readHelp'))), }, ...__VLS_functionalComponentArgsRest(__VLS_8));
+            const __VLS_8 = __VLS_asFunctionalComponent(__VLS_7, new __VLS_7({ ...{ 'onClick': {} }, ...{ class: ("toggle") }, icon: (true), density: ("compact"), color: ("success"), title: ((__VLS_ctx.show ? __VLS_ctx.t('closeHelp') : __VLS_ctx.t('readHelp'))), }));
+            const __VLS_9 = __VLS_8({ ...{ 'onClick': {} }, ...{ class: ("toggle") }, icon: (true), density: ("compact"), color: ("success"), title: ((__VLS_ctx.show ? __VLS_ctx.t('closeHelp') : __VLS_ctx.t('readHelp'))), }, ...__VLS_functionalComponentArgsRest(__VLS_8));
             let __VLS_13;
             const __VLS_14 = {
                 onClick: (...[$event]) => {
@@ -97,21 +102,17 @@ function __VLS_template() {
             let __VLS_11;
             if (__VLS_ctx.show) {
                 const __VLS_15 = __VLS_resolvedLocalAndGlobalComponents.VIcon;
-                /** @type { [typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, ] } */
+                /** @type { [typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, ] } */
                 // @ts-ignore
-                const __VLS_16 = __VLS_asFunctionalComponent(__VLS_15, new __VLS_15({}));
-                const __VLS_17 = __VLS_16({}, ...__VLS_functionalComponentArgsRest(__VLS_16));
-                __VLS_nonNullable(__VLS_20.slots).default;
-                const __VLS_20 = __VLS_pickFunctionalComponentCtx(__VLS_15, __VLS_17);
+                const __VLS_16 = __VLS_asFunctionalComponent(__VLS_15, new __VLS_15({ icon: ((__VLS_ctx.mdiCloseCircle)), }));
+                const __VLS_17 = __VLS_16({ icon: ((__VLS_ctx.mdiCloseCircle)), }, ...__VLS_functionalComponentArgsRest(__VLS_16));
             }
             else {
                 const __VLS_21 = __VLS_resolvedLocalAndGlobalComponents.VIcon;
-                /** @type { [typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, ] } */
+                /** @type { [typeof __VLS_components.VIcon, typeof __VLS_components.vIcon, ] } */
                 // @ts-ignore
-                const __VLS_22 = __VLS_asFunctionalComponent(__VLS_21, new __VLS_21({}));
-                const __VLS_23 = __VLS_22({}, ...__VLS_functionalComponentArgsRest(__VLS_22));
-                __VLS_nonNullable(__VLS_26.slots).default;
-                const __VLS_26 = __VLS_pickFunctionalComponentCtx(__VLS_21, __VLS_23);
+                const __VLS_22 = __VLS_asFunctionalComponent(__VLS_21, new __VLS_21({ icon: ((__VLS_ctx.mdiInformation)), }));
+                const __VLS_23 = __VLS_22({ icon: ((__VLS_ctx.mdiInformation)), }, ...__VLS_functionalComponentArgsRest(__VLS_22));
             }
             __VLS_nonNullable(__VLS_12.slots).default;
             const __VLS_12 = __VLS_pickFunctionalComponentCtx(__VLS_7, __VLS_9);

package/ui-notif.vue

@@ -10,7 +10,7 @@
     <p
       v-if="notification.type === 'error'"
       class="ml-3"
-      v-html="notification.errorMsg"
+      v-text="notification.errorMsg"
     />
 
     <template #actions>

package/ui-notif.vue.js

@@ -74,7 +74,7 @@ function __VLS_template() {
         (__VLS_ctx.notification.msg);
         if (__VLS_ctx.notification.type === 'error') {
             __VLS_elementAsFunction(__VLS_intrinsicElements.p)({ ...{ class: ("ml-3") }, });
-            __VLS_directiveAsFunction(__VLS_directives.vHtml)(null, { ...__VLS_directiveBindingRestFields, value: (__VLS_ctx.notification.errorMsg) }, null, null);
+            __VLS_directiveAsFunction(__VLS_directives.vText)(null, { ...__VLS_directiveBindingRestFields, value: (__VLS_ctx.notification.errorMsg) }, null, null);
         }
         __VLS_elementAsFunction(__VLS_intrinsicElements.template, __VLS_intrinsicElements.template)({});
         {

package/vite.d.ts

@@ -4,6 +4,8 @@ export declare const autoImports: (string | {
     '@data-fair/lib-vue/locale-dayjs.js': string[];
     '@data-fair/lib-vue/concept-filters.js': string[];
     '@data-fair/lib-vue/ui-notif.js': string[];
+    '@data-fair/lib-vue/fetch.js': string[];
+    '@data-fair/lib-vue/ws.js': string[];
 } | {
     '@data-fair/lib-vuetify/personal-menu.vue': string[][];
     '@data-fair/lib-vuetify/tutorial-alert.vue': string[][];