@data-fair/lib-vuetify 1.10.0 → 1.11.0

package/index.js

@@ -1,89 +1,91 @@
-import { fr, en } from 'vuetify/locale'
+import { fr, en } from 'vuetify/locale';
 const baseColors = {
-  primary: '#1E88E5', // blue.darken1
-  secondary: '#42A5F5', // blue.lighten1,
-  accent: '#FF9800', // orange.base
-  error: '#FF5252', // red.accent2
-  info: '#2196F3', // blue.base
-  success: '#4CAF50', // green.base
-  warning: '#E91E63', // pink.base
-  admin: '#E53935' // red.darken1
-}
+    primary: '#1E88E5', // blue.darken1
+    secondary: '#42A5F5', // blue.lighten1,
+    accent: '#FF9800', // orange.base
+    error: '#FF5252', // red.accent2
+    info: '#2196F3', // blue.base
+    success: '#4CAF50', // green.base
+    warning: '#E91E63', // pink.base
+    admin: '#E53935' // red.darken1
+};
 const baseDarkColors = {
-  primary: '#2196F3', // blue.base
-  success: '#00E676' // green.accent3
-}
-export function vuetifySessionOptions (session, cspNonce) {
-  if (!session.site.value) { throw new Error('vuetifySessionOptions requires fething site info in session util') }
-  const colors = { ...baseColors, ...session.site.value?.colors }
-  return {
-    ssr: false,
-    locale: {
-      locale: session.lang.value,
-      messages: { fr, en }
-    },
-    theme: {
-      cspNonce,
-      defaultTheme: session.theme.value ?? 'default',
-      themes: {
-        [session.theme.value ?? 'default']: {
-          dark: session.site.value?.dark,
-          colors,
-          variables: {
-            // deactivate automatic partial transparencies
-            // best to control colors precisely and ensure sufficient contrast for readability
-            'high-emphasis-opacity': 1,
-            'medium-emphasis-opacity': 0.87
-          }
+    primary: '#2196F3', // blue.base
+    success: '#00E676' // green.accent3
+};
+export function vuetifySessionOptions(session, cspNonce) {
+    if (!session.site.value)
+        throw new Error('vuetifySessionOptions requires fething site info in session util');
+    const colors = { ...baseColors, ...session.site.value?.colors };
+    return {
+        ssr: false,
+        locale: {
+            locale: session.lang.value,
+            messages: { fr, en }
+        },
+        theme: {
+            cspNonce,
+            defaultTheme: session.theme.value ?? 'default',
+            themes: {
+                [session.theme.value ?? 'default']: {
+                    dark: session.site.value?.dark,
+                    colors,
+                    variables: {
+                        // deactivate automatic partial transparencies
+                        // best to control colors precisely and ensure sufficient contrast for readability
+                        'high-emphasis-opacity': 1,
+                        'medium-emphasis-opacity': 0.87
+                    }
+                }
+            }
+        },
+        defaults: {
+            VCard: {
+                // white card with light grey border by default
+                variant: 'flat',
+                border: 'sm'
+            }
         }
-      }
-    },
-    defaults: {
-      VCard: {
-        // white card with light grey border by default
-        variant: 'flat',
-        border: 'sm'
-      }
-    }
-  }
+    };
 }
 // TODO: deprecate this in favor of sessionVuetifyOptions
-export function defaultOptions (searchParams, darkCookie = false, locale = 'fr') {
-  // console.warn('vuetify.defaultOptions is deprecated, use vuetifySessionOptions')
-  const dark = searchParams?.dark ? searchParams.dark === 'true' : darkCookie
-  const searchParamsColors = {}
-  for (const colorCode of ['primary', 'secondary']) {
-    if (searchParams?.[colorCode]) { searchParamsColors[colorCode] = searchParams[colorCode] }
-  }
-  const lightColors = { ...baseColors, ...searchParamsColors }
-  const darkColors = { ...baseColors, ...baseDarkColors, ...searchParamsColors }
-  const defaultTheme = dark ? 'dark' : 'light'
-  return {
-    ssr: false,
-    locale: {
-      locale,
-      messages: { fr, en }
-    },
-    theme: {
-      defaultTheme,
-      themes: {
-        light: {
-          dark: false,
-          colors: lightColors
+export function defaultOptions(searchParams, darkCookie = false, locale = 'fr') {
+    // console.warn('vuetify.defaultOptions is deprecated, use vuetifySessionOptions')
+    const dark = searchParams?.dark ? searchParams.dark === 'true' : darkCookie;
+    const searchParamsColors = {};
+    for (const colorCode of ['primary', 'secondary']) {
+        if (searchParams?.[colorCode])
+            searchParamsColors[colorCode] = searchParams[colorCode];
+    }
+    const lightColors = { ...baseColors, ...searchParamsColors };
+    const darkColors = { ...baseColors, ...baseDarkColors, ...searchParamsColors };
+    const defaultTheme = dark ? 'dark' : 'light';
+    return {
+        ssr: false,
+        locale: {
+            locale,
+            messages: { fr, en }
         },
-        dark: {
-          dark: true,
-          colors: darkColors
+        theme: {
+            defaultTheme,
+            themes: {
+                light: {
+                    dark: false,
+                    colors: lightColors
+                },
+                dark: {
+                    dark: true,
+                    colors: darkColors
+                }
+            }
+        },
+        defaults: {
+            VCard: {
+                // grey outlined card by default
+                variant: 'outlined',
+                style: 'border-color: rgba(var(--v-theme-on-surface), var(--v-focus-opacity)) !important;'
+            }
         }
-      }
-    },
-    defaults: {
-      VCard: {
-        // grey outlined card by default
-        variant: 'outlined',
-        style: 'border-color: rgba(var(--v-theme-on-surface), var(--v-focus-opacity)) !important;'
-      }
-    }
-  }
+    };
 }
-// # sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/navigation-right.vue

@@ -0,0 +1,49 @@
+<template>
+  <v-navigation-drawer
+    v-if="display.lgAndUp.value"
+    class="navigation-right-drawer pl-2"
+    location="right"
+    permanent
+    floating
+    position="fixed"
+    color="surface"
+    style="padding-top: 60px; background-color: transparent;"
+  >
+    <slot />
+  </v-navigation-drawer>
+  <div
+    v-else
+    class="navigation-right-button mt-4"
+  >
+    <v-menu
+      location="bottom left"
+      :close-on-content-click="false"
+    >
+      <template #activator="{ props }">
+        <v-btn
+          v-bind="props"
+          size="small"
+          color="primary"
+          :icon="mdiDotsVertical"
+        />
+      </template>
+      <slot />
+    </v-menu>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { mdiDotsVertical } from '@mdi/js'
+import { useDisplay } from 'vuetify'
+
+const display = useDisplay()
+
+</script>
+
+<style>
+.navigation-right-button {
+  z-index: 1000;
+  position: fixed;
+  right: 20px;
+}
+</style>

package/navigation-right.vue.d.ts

@@ -0,0 +1,17 @@
+declare function __VLS_template(): {
+    slots: {
+        default?(_: {}): any;
+        default?(_: {}): any;
+    };
+    refs: {};
+    attrs: Partial<{}>;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/navigation-right.vue.js

@@ -0,0 +1,86 @@
+/// <reference types=".vue-global-types/vue_3.5_false.d.ts" />
+import { mdiDotsVertical } from '@mdi/js';
+import { useDisplay } from 'vuetify';
+const { defineProps, defineSlots, defineEmits, defineExpose, defineModel, defineOptions, withDefaults, } = await import('vue');
+const display = useDisplay();
+const __VLS_fnComponent = (await import('vue')).defineComponent({});
+;
+let __VLS_functionalComponentProps;
+function __VLS_template() {
+    const __VLS_ctx = {};
+    const __VLS_localComponents = {
+        ...{},
+        ...{},
+        ...__VLS_ctx,
+    };
+    let __VLS_components;
+    const __VLS_localDirectives = {
+        ...{},
+        ...__VLS_ctx,
+    };
+    let __VLS_directives;
+    let __VLS_styleScopedClasses;
+    // CSS variable injection 
+    // CSS variable injection end 
+    let __VLS_resolvedLocalAndGlobalComponents;
+    if (__VLS_ctx.display.lgAndUp.value) {
+        const __VLS_0 = __VLS_resolvedLocalAndGlobalComponents.VNavigationDrawer;
+        /** @type { [typeof __VLS_components.VNavigationDrawer, typeof __VLS_components.vNavigationDrawer, typeof __VLS_components.VNavigationDrawer, typeof __VLS_components.vNavigationDrawer, ] } */
+        // @ts-ignore
+        const __VLS_1 = __VLS_asFunctionalComponent(__VLS_0, new __VLS_0({ ...{ class: ("navigation-right-drawer pl-2") }, location: ("right"), permanent: (true), floating: (true), position: ("fixed"), color: ("surface"), ...{ style: ({}) }, }));
+        const __VLS_2 = __VLS_1({ ...{ class: ("navigation-right-drawer pl-2") }, location: ("right"), permanent: (true), floating: (true), position: ("fixed"), color: ("surface"), ...{ style: ({}) }, }, ...__VLS_functionalComponentArgsRest(__VLS_1));
+        var __VLS_6 = {};
+        __VLS_nonNullable(__VLS_5.slots).default;
+        const __VLS_5 = __VLS_pickFunctionalComponentCtx(__VLS_0, __VLS_2);
+    }
+    else {
+        __VLS_elementAsFunction(__VLS_intrinsicElements.div, __VLS_intrinsicElements.div)({ ...{ class: ("navigation-right-button mt-4") }, });
+        const __VLS_7 = __VLS_resolvedLocalAndGlobalComponents.VMenu;
+        /** @type { [typeof __VLS_components.VMenu, typeof __VLS_components.vMenu, typeof __VLS_components.VMenu, typeof __VLS_components.vMenu, ] } */
+        // @ts-ignore
+        const __VLS_8 = __VLS_asFunctionalComponent(__VLS_7, new __VLS_7({ location: ("bottom left"), closeOnContentClick: ((false)), }));
+        const __VLS_9 = __VLS_8({ location: ("bottom left"), closeOnContentClick: ((false)), }, ...__VLS_functionalComponentArgsRest(__VLS_8));
+        __VLS_elementAsFunction(__VLS_intrinsicElements.template, __VLS_intrinsicElements.template)({});
+        {
+            const { activator: __VLS_thisSlot } = __VLS_nonNullable(__VLS_12.slots);
+            const [{ props }] = __VLS_getSlotParams(__VLS_thisSlot);
+            const __VLS_13 = __VLS_resolvedLocalAndGlobalComponents.VBtn;
+            /** @type { [typeof __VLS_components.VBtn, typeof __VLS_components.vBtn, ] } */
+            // @ts-ignore
+            const __VLS_14 = __VLS_asFunctionalComponent(__VLS_13, new __VLS_13({ ...(props), size: ("small"), color: ("primary"), icon: ((__VLS_ctx.mdiDotsVertical)), }));
+            const __VLS_15 = __VLS_14({ ...(props), size: ("small"), color: ("primary"), icon: ((__VLS_ctx.mdiDotsVertical)), }, ...__VLS_functionalComponentArgsRest(__VLS_14));
+        }
+        var __VLS_19 = {};
+        const __VLS_12 = __VLS_pickFunctionalComponentCtx(__VLS_7, __VLS_9);
+    }
+    __VLS_styleScopedClasses['navigation-right-drawer'];
+    __VLS_styleScopedClasses['pl-2'];
+    __VLS_styleScopedClasses['navigation-right-button'];
+    __VLS_styleScopedClasses['mt-4'];
+    var __VLS_slots;
+    var __VLS_inheritedAttrs;
+    const __VLS_refs = {};
+    var $refs;
+    return {
+        slots: __VLS_slots,
+        refs: $refs,
+        attrs: {},
+    };
+}
+;
+const __VLS_self = (await import('vue')).defineComponent({
+    setup() {
+        return {
+            mdiDotsVertical: mdiDotsVertical,
+            display: display,
+        };
+    },
+});
+const __VLS_component = (await import('vue')).defineComponent({
+    setup() {
+        return {};
+    },
+});
+export default {};
+;
+//# sourceMappingURL=navigation-right.vue.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@data-fair/lib-vuetify",
-  "version": "1.10.0",
+  "version": "1.11.0",
   "description": "Components based on the Vuetify 3 UI lib for the data-fair stack.",
   "main": "index.js",
   "files": [

package/personal-menu.vue

@@ -49,8 +49,8 @@
           <v-list-item-title>
             {{ account.type === 'user' ? t('personalAccount') : account.name }}
           </v-list-item-title>
-          <v-list-item-subtitle v-if="account.department">
-            {{ account.departmentName || account.department }}
+          <v-list-item-subtitle v-if="account.department || organization?.roleLabel">
+            {{ account.departmentName || account.department }} {{ organization?.roleLabel }}
           </v-list-item-subtitle>
           <v-list-item-subtitle>{{ user.name }}</v-list-item-subtitle>
         </v-list-item>
@@ -208,7 +208,7 @@ import { mdiAlert, mdiShieldAlert, mdiLogout, mdiAccountSwitchOutline } from '@m
 const session = useSession()
 
 const { t } = useI18n({ useScope: 'local' })
-const { user, account } = toRefs(session.state)
+const { user, account, organization } = toRefs(session.state)
 const switchableOrganizations = computed(() => {
   const { user, account, accountRole } = session.state
   if (!user || !account) return

package/personal-menu.vue.js

@@ -7,7 +7,7 @@ import { mdiAlert, mdiShieldAlert, mdiLogout, mdiAccountSwitchOutline } from '@m
 const { defineProps, defineSlots, defineEmits, defineExpose, defineModel, defineOptions, withDefaults, } = await import('vue');
 const session = useSession();
 const { t } = useI18n({ useScope: 'local' });
-const { user, account } = toRefs(session.state);
+const { user, account, organization } = toRefs(session.state);
 const switchableOrganizations = computed(() => {
     const { user, account, accountRole } = session.state;
     if (!user || !account)
@@ -104,13 +104,14 @@ function __VLS_template() {
         (__VLS_ctx.account.type === 'user' ? __VLS_ctx.t('personalAccount') : __VLS_ctx.account.name);
         __VLS_nonNullable(__VLS_57.slots).default;
         const __VLS_57 = __VLS_pickFunctionalComponentCtx(__VLS_52, __VLS_54);
-        if (__VLS_ctx.account.department) {
+        if (__VLS_ctx.account.department || __VLS_ctx.organization?.roleLabel) {
             const __VLS_58 = __VLS_resolvedLocalAndGlobalComponents.VListItemSubtitle;
             /** @type { [typeof __VLS_components.VListItemSubtitle, typeof __VLS_components.vListItemSubtitle, typeof __VLS_components.VListItemSubtitle, typeof __VLS_components.vListItemSubtitle, ] } */
             // @ts-ignore
             const __VLS_59 = __VLS_asFunctionalComponent(__VLS_58, new __VLS_58({}));
             const __VLS_60 = __VLS_59({}, ...__VLS_functionalComponentArgsRest(__VLS_59));
             (__VLS_ctx.account.departmentName || __VLS_ctx.account.department);
+            (__VLS_ctx.organization?.roleLabel);
             __VLS_nonNullable(__VLS_63.slots).default;
             const __VLS_63 = __VLS_pickFunctionalComponentCtx(__VLS_58, __VLS_60);
         }
@@ -369,6 +370,7 @@ const __VLS_self = (await import('vue')).defineComponent({
             t: t,
             user: user,
             account: account,
+            organization: organization,
             switchableOrganizations: switchableOrganizations,
         };
     },

package/vite.d.ts

@@ -7,9 +7,20 @@ export declare const autoImports: (string | {
     '@data-fair/lib-vue/fetch.js': string[];
     '@data-fair/lib-vue/ws.js': string[];
     '@data-fair/lib-vue/async-action.js': string[];
+    '@data-fair/lib-vue/deep-diff.js': string[];
 } | {
+    '@data-fair/lib-vuetify/date-match-filter.vue': string[][];
+    '@data-fair/lib-vuetify/date-range-picker.vue': string[][];
+    '@data-fair/lib-vuetify/lang-switcher.vue': string[][];
+    '@data-fair/lib-vuetify/navigation-right.vue': string[][];
+    '@data-fair/lib-vuetify/owner-avatar.vue': string[][];
+    '@data-fair/lib-vuetify/owner-pick.vue': string[][];
     '@data-fair/lib-vuetify/personal-menu.vue': string[][];
+    '@data-fair/lib-vuetify/search-address.vue': string[][];
+    '@data-fair/lib-vuetify/theme-switcher.vue': string[][];
     '@data-fair/lib-vuetify/tutorial-alert.vue': string[][];
-    '@data-fair/lib-vuetify/user-avatar.vue': string[][];
+    '@data-fair/lib-vuetify/ui-notif-alert.vue': string[][];
+    '@data-fair/lib-vuetify/ui-notif.vue': string[][];
+    '@data-fair/lib-vuetify/ui-user-avatar.vue': string[][];
 })[];
 export declare const settingsPath: string;

package/vite.js

@@ -1,12 +1,22 @@
 // made for https://github.com/unplugin/unplugin-auto-import
-import { autoImports as vueAutoImports } from '@data-fair/lib-vue/vite.js'
+import { autoImports as vueAutoImports } from '@data-fair/lib-vue/vite.js';
 export const autoImports = [
-  ...vueAutoImports,
-  {
-    '@data-fair/lib-vuetify/personal-menu.vue': [['default', 'dfPersonalMenu']],
-    '@data-fair/lib-vuetify/tutorial-alert.vue': [['default', 'dfTutorialAlert']],
-    '@data-fair/lib-vuetify/user-avatar.vue': [['default', 'dfUserAvatar']]
-  }
-]
-export const settingsPath = new URL(import.meta.resolve('@data-fair/lib-vuetify/style/settings.scss')).pathname
-// # sourceMappingURL=vite.js.map
+    ...vueAutoImports,
+    {
+        '@data-fair/lib-vuetify/date-match-filter.vue': [['default', 'dfDateMatchFilter']],
+        '@data-fair/lib-vuetify/date-range-picker.vue': [['default', 'dfDateRangePicker']],
+        '@data-fair/lib-vuetify/lang-switcher.vue': [['default', 'dfLangSwitcher']],
+        '@data-fair/lib-vuetify/navigation-right.vue': [['default', 'dfNavigationRight']],
+        '@data-fair/lib-vuetify/owner-avatar.vue': [['default', 'dfOwnerAvatar']],
+        '@data-fair/lib-vuetify/owner-pick.vue': [['default', 'dfOwnerPick']],
+        '@data-fair/lib-vuetify/personal-menu.vue': [['default', 'dfPersonalMenu']],
+        '@data-fair/lib-vuetify/search-address.vue': [['default', 'dfSearchAddress']],
+        '@data-fair/lib-vuetify/theme-switcher.vue': [['default', 'dfThemeSwitcher']],
+        '@data-fair/lib-vuetify/tutorial-alert.vue': [['default', 'dfTutorialAlert']],
+        '@data-fair/lib-vuetify/ui-notif-alert.vue': [['default', 'dfUiNotifAlert']],
+        '@data-fair/lib-vuetify/ui-notif.vue': [['default', 'dfUiNotif']],
+        '@data-fair/lib-vuetify/ui-user-avatar.vue': [['default', 'dfUserAvatar']]
+    }
+];
+export const settingsPath = new URL(import.meta.resolve('@data-fair/lib-vuetify/style/settings.scss')).pathname;
+//# sourceMappingURL=vite.js.map