@data-fair/lib-vue 1.14.0 → 1.15.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@data-fair/lib-vue",
-  "version": "1.14.0",
+  "version": "1.15.1",
   "description": "Composables and other utilities for Vue applications in the data-fair stack.",
   "main": "index.js",
   "files": [

package/session.d.ts

@@ -51,6 +51,8 @@ interface FullSiteInfo {
         darkColors?: Colors;
         hc: boolean;
         hcColors?: Colors;
+        hcDark: boolean;
+        hcDarkColors?: Colors;
     };
 }
 export interface SiteInfo {
@@ -59,7 +61,7 @@ export interface SiteInfo {
     dark?: boolean;
     colors: Colors;
 }
-type Theme = 'default' | 'dark' | 'hc';
+type Theme = 'default' | 'dark' | 'hc' | 'hc-dark';
 export interface Session {
     state: SessionState;
     user: ComputedRef<SessionState['user']>;

package/session.js

@@ -11,12 +11,11 @@ const debug = Debug('session')
 debug.log = console.log.bind(console)
 function getDefaultTheme (site) {
   // see https://www.scottohara.me/blog/2021/10/01/detect-high-contrast-and-dark-modes.html
-  if (site.theme.hc) {
-    if (window.matchMedia && window.matchMedia('(forced-colors: active)').matches) { return 'hc' }
-  }
-  if (site.theme.dark) {
-    if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) { return 'dark' }
-  }
+  const preferDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches
+  const preferHC = window.matchMedia && window.matchMedia('(forced-colors: active)').matches
+  if (site.theme.hcDark && preferDark && preferHC) { return 'hc-dark' }
+  if (site.theme.hc && preferHC) { return 'hc' }
+  if (site.theme.dark && preferDark) { return 'dark' }
   return 'default'
 }
 function jwtDecodeAlive (jwt) {
@@ -73,7 +72,7 @@ export async function getSession (initOptions) {
   // cookies are the source of truth and this information is transformed into the state reactive object
   const cookies = initOptions?.cookies ?? new Cookies(options.req?.headers.cookie)
   const readState = () => {
-    theme.value = cookies.get('theme') ?? 'default'
+    theme.value = cookies.get('theme') ?? null
     const langCookie = cookies.get('i18n_lang')
     state.lang = langCookie ?? options.defaultLang
     const idToken = cookies.get('id_token')
@@ -250,6 +249,10 @@ export async function getSession (initOptions) {
         partialSite.colors = siteInfo.theme.darkColors
         partialSite.dark = true
       }
+      if (theme.value === 'hc-dark') {
+        partialSite.colors = siteInfo.theme.hcDarkColors
+        partialSite.dark = true
+      }
       site.value = partialSite
     } else {
       site.value = siteInfo

package/ui-notif.js

@@ -15,8 +15,8 @@ export function getErrorMsg (error) {
   if (typeof error === 'string') { return error }
   if (error.data && typeof error.data === 'string') { return error.data }
   if (error.response?.data && typeof error.response.data === 'string') { return error.response.data }
-  if (typeof error.statusText === 'string') { return error.statusText }
-  if (typeof error.response?.statusText === 'string') { return error.response?.statusText }
+  if (error.statusText && typeof error.statusText === 'string') { return error.statusText }
+  if (error.response?.statusText && typeof error.response?.statusText === 'string') { return error.response?.statusText }
   if (error.message) { return error.message }
   return 'erreur inconnue'
 }