@data-fair/lib-vuetify 1.7.1 → 1.8.0

package/index.d.ts

@@ -1,5 +1,4 @@
 import { type Session } from '@data-fair/lib-vue/session.js';
 import { VuetifyOptions } from 'vuetify';
 export declare function vuetifySessionOptions(session: Session): VuetifyOptions;
-export declare function vuetifySessionStyle(session: Session): string;
 export declare function defaultOptions(searchParams: Record<string, string>, darkCookie?: boolean, locale?: string): VuetifyOptions;

package/index.js

@@ -23,9 +23,9 @@ export function vuetifySessionOptions (session) {
       messages: { fr, en }
     },
     theme: {
-      defaultTheme: 'site',
+      defaultTheme: session.theme.value ?? 'default',
       themes: {
-        site: {
+        [session.theme.value ?? 'default']: {
           dark: session.site.value?.dark,
           colors,
           variables: {
@@ -46,17 +46,6 @@ export function vuetifySessionOptions (session) {
     }
   }
 }
-export function vuetifySessionStyle (session) {
-  if (!session.site.value) { throw new Error('vuetifySectionStyle requires fething site info in session util') }
-  return `
-.v-application .text-primary!important {
-  color: ${session.site.value.colors['text-primary']};
-}
-.v-application .text-secondary!important {
-  color: ${session.site.value.colors['text-secondary']};
-}
-  `
-}
 // TODO: deprecate this in favor of sessionVuetifyOptions
 export function defaultOptions (searchParams, darkCookie = false, locale = 'fr') {
   // console.warn('vuetify.defaultOptions is deprecated, use vuetifySessionOptions')

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@data-fair/lib-vuetify",
-  "version": "1.7.1",
+  "version": "1.8.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.13.0",
+    "@data-fair/lib-vue": "^1.15.0",
     "ofetch": "1",
     "vue-i18n": "10",
     "vuetify": "3"

package/theme-switcher.vue

@@ -1,5 +1,5 @@
 <template>
-  <v-toolbar-items class="theme-switcher" v-if="session.fullSite.value?.theme.dark || session.fullSite.value?.theme.hc">
+  <v-toolbar-items class="theme-switcher" v-if="session.fullSite.value?.theme.dark || session.fullSite.value?.theme.hc || session.fullSite.value?.theme.hcDark">
     <v-menu
       offset-y
       nudge-left
@@ -21,11 +21,12 @@
             color="primary"
             hide-details
             :label="t('themeSwitch')"
-            @update:modelValue="value => session.switchTheme(value as 'default' | 'dark' | 'hc')"
+            @update:modelValue="value => session.switchTheme(value as 'default' | 'dark' | 'hc' | 'hc-dark')"
           >
             <v-radio :label="t('theme.default')" value="default"></v-radio>
-            <v-radio :label="t('theme.dark')" value="dark"></v-radio>
-            <v-radio :label="t('theme.hc')" value="hc"></v-radio>
+            <v-radio v-if="session.fullSite.value?.theme.dark" :label="t('theme.dark')" value="dark"></v-radio>
+            <v-radio v-if="session.fullSite.value?.theme.hc":label="t('theme.hc')" value="hc"></v-radio>
+            <v-radio v-if="session.fullSite.value?.theme.hcDark" :label="t('theme.hcDark')" value="hc-dark"></v-radio>
           </v-radio-group>
         </v-list-item>
       </v-list>
@@ -40,12 +41,14 @@ fr:
     default: par défaut
     dark: sombre
     hc: contraste élevé
+    hcDark: sombre et contraste élevé
 en:
   themeSwitch: Change theme
   theme:
     default: default
     dark: dark
     hc: high contrast
+    hcDark: dark and high contrast
 </i18n>
 
 <script setup lang="ts">

package/theme-switcher.vue.js

@@ -25,7 +25,7 @@ function __VLS_template() {
     // CSS variable injection 
     // CSS variable injection end 
     let __VLS_resolvedLocalAndGlobalComponents;
-    if (__VLS_ctx.session.fullSite.value?.theme.dark || __VLS_ctx.session.fullSite.value?.theme.hc) {
+    if (__VLS_ctx.session.fullSite.value?.theme.dark || __VLS_ctx.session.fullSite.value?.theme.hc || __VLS_ctx.session.fullSite.value?.theme.hcDark) {
         const __VLS_0 = __VLS_resolvedLocalAndGlobalComponents.VToolbarItems;
         /** @type { [typeof __VLS_components.VToolbarItems, typeof __VLS_components.vToolbarItems, typeof __VLS_components.VToolbarItems, typeof __VLS_components.vToolbarItems, ] } */
         // @ts-ignore
@@ -72,16 +72,27 @@ function __VLS_template() {
         // @ts-ignore
         const __VLS_39 = __VLS_asFunctionalComponent(__VLS_38, new __VLS_38({ label: ((__VLS_ctx.t('theme.default'))), value: ("default"), }));
         const __VLS_40 = __VLS_39({ label: ((__VLS_ctx.t('theme.default'))), value: ("default"), }, ...__VLS_functionalComponentArgsRest(__VLS_39));
-        const __VLS_44 = __VLS_resolvedLocalAndGlobalComponents.VRadio;
-        /** @type { [typeof __VLS_components.VRadio, typeof __VLS_components.vRadio, typeof __VLS_components.VRadio, typeof __VLS_components.vRadio, ] } */
-        // @ts-ignore
-        const __VLS_45 = __VLS_asFunctionalComponent(__VLS_44, new __VLS_44({ label: ((__VLS_ctx.t('theme.dark'))), value: ("dark"), }));
-        const __VLS_46 = __VLS_45({ label: ((__VLS_ctx.t('theme.dark'))), value: ("dark"), }, ...__VLS_functionalComponentArgsRest(__VLS_45));
-        const __VLS_50 = __VLS_resolvedLocalAndGlobalComponents.VRadio;
-        /** @type { [typeof __VLS_components.VRadio, typeof __VLS_components.vRadio, typeof __VLS_components.VRadio, typeof __VLS_components.vRadio, ] } */
-        // @ts-ignore
-        const __VLS_51 = __VLS_asFunctionalComponent(__VLS_50, new __VLS_50({ label: ((__VLS_ctx.t('theme.hc'))), value: ("hc"), }));
-        const __VLS_52 = __VLS_51({ label: ((__VLS_ctx.t('theme.hc'))), value: ("hc"), }, ...__VLS_functionalComponentArgsRest(__VLS_51));
+        if (__VLS_ctx.session.fullSite.value?.theme.dark) {
+            const __VLS_44 = __VLS_resolvedLocalAndGlobalComponents.VRadio;
+            /** @type { [typeof __VLS_components.VRadio, typeof __VLS_components.vRadio, typeof __VLS_components.VRadio, typeof __VLS_components.vRadio, ] } */
+            // @ts-ignore
+            const __VLS_45 = __VLS_asFunctionalComponent(__VLS_44, new __VLS_44({ label: ((__VLS_ctx.t('theme.dark'))), value: ("dark"), }));
+            const __VLS_46 = __VLS_45({ label: ((__VLS_ctx.t('theme.dark'))), value: ("dark"), }, ...__VLS_functionalComponentArgsRest(__VLS_45));
+        }
+        if (__VLS_ctx.session.fullSite.value?.theme.hc) {
+            const __VLS_50 = __VLS_resolvedLocalAndGlobalComponents.VRadio;
+            /** @type { [typeof __VLS_components.VRadio, typeof __VLS_components.vRadio, typeof __VLS_components.VRadio, typeof __VLS_components.vRadio, ] } */
+            // @ts-ignore
+            const __VLS_51 = __VLS_asFunctionalComponent(__VLS_50, new __VLS_50({ label: ((__VLS_ctx.t('theme.hc'))), value: ("hc"), }));
+            const __VLS_52 = __VLS_51({ label: ((__VLS_ctx.t('theme.hc'))), value: ("hc"), }, ...__VLS_functionalComponentArgsRest(__VLS_51));
+        }
+        if (__VLS_ctx.session.fullSite.value?.theme.hcDark) {
+            const __VLS_56 = __VLS_resolvedLocalAndGlobalComponents.VRadio;
+            /** @type { [typeof __VLS_components.VRadio, typeof __VLS_components.vRadio, typeof __VLS_components.VRadio, typeof __VLS_components.vRadio, ] } */
+            // @ts-ignore
+            const __VLS_57 = __VLS_asFunctionalComponent(__VLS_56, new __VLS_56({ label: ((__VLS_ctx.t('theme.hcDark'))), value: ("hc-dark"), }));
+            const __VLS_58 = __VLS_57({ label: ((__VLS_ctx.t('theme.hcDark'))), value: ("hc-dark"), }, ...__VLS_functionalComponentArgsRest(__VLS_57));
+        }
         __VLS_nonNullable(__VLS_35.slots).default;
         const __VLS_35 = __VLS_pickFunctionalComponentCtx(__VLS_30, __VLS_32);
         __VLS_nonNullable(__VLS_29.slots).default;