@globalbrain/sefirot 4.10.0 → 4.11.0

package/lib/composables/App.ts

@@ -0,0 +1,22 @@
+import { type HttpOptions } from '../http/Http'
+import { useSetupHttp } from './Http'
+import { type HasLang, useSetupLang } from './Lang'
+import { type HasTheme, useSetupTheme } from './Theme'
+
+export interface SetupAppUser extends HasLang, HasTheme {}
+
+export interface SetupAppOptions {
+  http?: HttpOptions
+}
+
+export function useSetupApp(): (user?: SetupAppUser | null, options?: SetupAppOptions) => void {
+  const setupLang = useSetupLang()
+  const setupTheme = useSetupTheme()
+  const setupHttp = useSetupHttp()
+
+  return (user, options) => {
+    setupLang(user)
+    setupTheme(user)
+    setupHttp(user, options?.http)
+  }
+}

package/lib/composables/Http.ts

@@ -0,0 +1,17 @@
+import { type Lang, useBrowserLang } from 'sefirot/composables/Lang'
+import { Http, type HttpOptions } from 'sefirot/http/Http'
+
+export interface HasLang {
+  lang: Lang
+}
+
+export function useSetupHttp(): (user?: HasLang | null, options?: HttpOptions) => void {
+  const browserLang = useBrowserLang()
+
+  return (user, options = {}) => {
+    Http.config({
+      lang: user?.lang ?? browserLang,
+      ...options
+    })
+  }
+}

package/lib/composables/Lang.ts

@@ -11,8 +11,20 @@ export interface TransMessages<T> {
   ja: T
 }
 
+export interface HasLang {
+  lang: Lang
+}
+
 export const SefirotLangKey = 'sefirot-lang-key'
 
+export function useSetupLang(): (user?: HasLang | null) => void {
+  const browserLang = useBrowserLang()
+
+  return (user) => {
+    provideLang(user?.lang ?? browserLang)
+  }
+}
+
 export function provideLang(lang: Lang) {
   provide(SefirotLangKey, lang)
 }
@@ -23,6 +35,12 @@ export function useLang(): Lang {
   return inject(SefirotLangKey, 'en') || 'en'
 }
 
+export function useBrowserLang(): Lang {
+  const lang = navigator.language
+
+  return lang.split('-')[0] === 'ja' ? 'ja' : 'en'
+}
+
 export function useTrans<T>(messages: TransMessages<T>): Trans<T> {
   const lang = useLang()
 
@@ -32,9 +50,3 @@ export function useTrans<T>(messages: TransMessages<T>): Trans<T> {
     t
   }
 }
-
-export function useBrowserLang(): Lang {
-  const lang = navigator.language
-
-  return lang.split('-')[0] === 'ja' ? 'ja' : 'en'
-}

package/lib/composables/Theme.ts

@@ -0,0 +1,25 @@
+import { useDark } from '@vueuse/core'
+import { type WritableComputedRef, computed } from 'vue'
+
+export type Theme = 'light' | 'dark'
+
+export interface HasTheme {
+  theme: Theme
+}
+
+export function useSetupTheme(): (user?: HasTheme | null) => void {
+  const theme = useTheme()
+
+  return (user) => {
+    theme.value = user?.theme ?? 'light'
+  }
+}
+
+export function useTheme(): WritableComputedRef<Theme> {
+  const _isDark = useDark()
+
+  return computed({
+    get: () => _isDark.value ? 'dark' : 'light',
+    set: (v) => { _isDark.value = v === 'dark' }
+  })
+}

package/lib/composables/Url.ts

@@ -1,5 +1,5 @@
 import isEqual from 'lodash-es/isEqual'
-import { type MaybeRef, nextTick, unref, watch } from 'vue'
+import { type MaybeRef, computed, nextTick, unref, watch } from 'vue'
 import { type LocationQuery, useRoute, useRouter } from 'vue-router'
 
 export interface UseUrlQuerySyncOptions {
@@ -21,13 +21,22 @@ export function useUrlQuerySync(
   const route = useRoute()
   const router = useRouter()
 
+  const routeQuery = computed(() => ({
+    path: route.path,
+    query: route.query
+  }))
+
   const flattenedDefaultState = flattenObject(unref(state))
 
   let isSyncing = false
 
   watch(
-    () => route.query,
-    async () => {
+    routeQuery,
+    async (to, from) => {
+      if (from && from.path !== to.path) {
+        return
+      }
+
       if (!isSyncing) {
         isSyncing = true
         await setState()

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@globalbrain/sefirot",
   "type": "module",
-  "version": "4.10.0",
+  "version": "4.11.0",
   "packageManager": "pnpm@9.15.3",
   "description": "Vue Components for Global Brain Design System.",
   "author": "Kia Ishii <ka.ishii@globalbrains.com>",