@saasicat/ui-vue 0.22.2 → 0.23.0

package/dist/index.d.cts

@@ -2,8 +2,8 @@ import { BootLoaderOptions, ManifestLoaderOptions, BuildRouteEntry, SidebarSecti
 export { ADMIN_UI_VERSION, AdminPromoListFilter, AdminPromoListRow, AdminResourceClientOptions, BatchColumnDriftError, BatchColumnFetcher, BatchColumnRow, BatchColumnValue, BootLoadError, CachedManifestEntry, DEFAULT_STANDARD_PAGE_ROUTES, HttpJsonError, LoginBootProject, LoginBrandFallback, LoginBranding, ManifestLoadError, MessageParams, ParamStyle, PlanCounts, PlanRowLike, PlanVersionLike, ResolvePlansInput, ResolvedPlan, SidebarItem, buildRoutes, buildSidebar, countPlans, createAdminResourceClient, defaultSectionOrder, formatCurrency, formatMessage, getJson, isCurrentlyValid, isExpired, isFutureScheduled, isProductionBoot, postJson, resolveExtension, resolveLoginBranding, resolvePlans, todayIsoDate, trimTrailingSlashes } from './client/index.cjs';
 import { H as HttpClient, e as ActionRegistry, A as ActionHandler, K as KvStore, S as SaLocale } from './catalog-DJcfm5N2.cjs';
 export { f as ActionDefNotInManifestError, D as DEFAULT_SA_LOCALE, g as HttpResponse, M as MessageTree, h as MissingHandlerError, P as PartialMessages, R as ResolvedAction, i as SA_INTL_LOCALES, j as SA_LOCALES, k as SA_LOCALE_LABELS, l as SA_MESSAGES, m as SaBuiltinLocale, n as SaCatalog, o as SaCatalogOptions, c as SaLocaleDefinition, b as SaLocaleOption, a as SaMessages, d as SaMessagesOverrides, T as TranslationOf, p as createSaCatalog, q as defaultHttpClient, r as defaultKvStore, s as defineMessages, t as isSaBuiltinLocale, u as mergeMessages, v as resolveMessages } from './catalog-DJcfm5N2.cjs';
-import { A as ActionsMap, a as SuperAdminBrand, b as SuperAdminEndpoints, E as ExtensionsMap, c as SuperAdminLoginAdapter } from './use-super-admin-i18n-CgTuNi8h.cjs';
-export { f as ExtensionLoader, I as InstallPlugin, g as SA_LOCALE_STORAGE_KEY, h as SUPER_ADMIN_ACTIONS_KEY, i as SUPER_ADMIN_BRAND_KEY, j as SUPER_ADMIN_ENDPOINTS_KEY, k as SUPER_ADMIN_EXTENSIONS_KEY, l as SUPER_ADMIN_HTTP_KEY, m as SUPER_ADMIN_I18N_KEY, n as SUPER_ADMIN_LOGIN_ADAPTER_KEY, o as SUPER_ADMIN_MANIFEST_CLEAR_CACHE_KEY, p as SUPER_ADMIN_MANIFEST_KEY, q as SUPER_ADMIN_NOTIFY_KEY, r as SuperAdminAuthGuardOptions, S as SuperAdminGuardOptions, e as SuperAdminI18n, d as SuperAdminI18nOptions, s as SuperAdminLoginResult, t as SuperAdminManifestGuardOptions, U as UiNotify, u as UiNotifyKind, v as UiNotifyOptions, w as buildNavigationGuard, x as createSuperAdminI18n, y as useSaMessages, z as useSuperAdminI18n } from './use-super-admin-i18n-CgTuNi8h.cjs';
+import { A as ActionsMap, a as SuperAdminBrand, b as SuperAdminEndpoints, E as ExtensionsMap, c as SuperAdminLoginAdapter } from './use-sa-theme-B5t7oXph.cjs';
+export { h as ExtensionLoader, I as InstallPlugin, i as SA_LOCALE_STORAGE_KEY, j as SA_THEME_KEY, k as SUPER_ADMIN_ACTIONS_KEY, l as SUPER_ADMIN_BRAND_KEY, m as SUPER_ADMIN_ENDPOINTS_KEY, n as SUPER_ADMIN_EXTENSIONS_KEY, o as SUPER_ADMIN_HTTP_KEY, p as SUPER_ADMIN_I18N_KEY, q as SUPER_ADMIN_LOGIN_ADAPTER_KEY, r as SUPER_ADMIN_MANIFEST_CLEAR_CACHE_KEY, s as SUPER_ADMIN_MANIFEST_KEY, t as SUPER_ADMIN_NOTIFY_KEY, u as SaColorScheme, v as SaResolvedScheme, g as SaTheme, e as SaThemeOptions, w as SuperAdminAuthGuardOptions, S as SuperAdminGuardOptions, f as SuperAdminI18n, d as SuperAdminI18nOptions, x as SuperAdminLoginResult, y as SuperAdminManifestGuardOptions, U as UiNotify, z as UiNotifyKind, B as UiNotifyOptions, C as buildNavigationGuard, D as createSaTheme, F as createSuperAdminI18n, G as useSaMessages, H as useSaTheme, J as useSuperAdminI18n } from './use-sa-theme-B5t7oXph.cjs';
 import { AdminManifest, TenantListFilter, TenantDto, AuditQuery, AuditEntry, FeatureUiRegistry, PromoPreviewResponse, OnboardingSelectionRequest, PublicMarketingBundle, FeatureDef, FeatureKey, PublicBootResponse, DiscoverySnapshot, CapabilityCatalogEntryRow, FeatureCatalogEntryRow, QuotaCatalogEntryRow, ReviewCatalogEntryData, CatalogEntryI18n, UpdateCatalogEntryBaseData, SyncDiscoveryResult, BundleVersionRow, CreateBundleVersionDraftData, BundleVersionMutationResult, UpdateBundleVersionDraftData, BundleRow, CreateBundleData, UpdateBundleData, SubscriptionBundleRecord, MarketingProjectionFilter, MarketingProjectionRow, CreateMarketingProjectionData, UpdateMarketingProjectionData, PromotionRow, CreatePromotionData, UpdatePromotionData, PlanVersionRow, CreatePlanVersionDraftData, PlanVersionMutationResult, UpdatePlanVersionDraftData, PlanRow, CreatePlanData, UpdatePlanData, TenantActionDef } from '@saasicat/types';
 import { RouteRecordRaw, NavigationGuardWithThis } from 'vue-router';
 import * as vue from 'vue';

package/dist/index.d.ts

@@ -2,8 +2,8 @@ import { BootLoaderOptions, ManifestLoaderOptions, BuildRouteEntry, SidebarSecti
 export { ADMIN_UI_VERSION, AdminPromoListFilter, AdminPromoListRow, AdminResourceClientOptions, BatchColumnDriftError, BatchColumnFetcher, BatchColumnRow, BatchColumnValue, BootLoadError, CachedManifestEntry, DEFAULT_STANDARD_PAGE_ROUTES, HttpJsonError, LoginBootProject, LoginBrandFallback, LoginBranding, ManifestLoadError, MessageParams, ParamStyle, PlanCounts, PlanRowLike, PlanVersionLike, ResolvePlansInput, ResolvedPlan, SidebarItem, buildRoutes, buildSidebar, countPlans, createAdminResourceClient, defaultSectionOrder, formatCurrency, formatMessage, getJson, isCurrentlyValid, isExpired, isFutureScheduled, isProductionBoot, postJson, resolveExtension, resolveLoginBranding, resolvePlans, todayIsoDate, trimTrailingSlashes } from './client/index.js';
 import { H as HttpClient, e as ActionRegistry, A as ActionHandler, K as KvStore, S as SaLocale } from './catalog-DJcfm5N2.js';
 export { f as ActionDefNotInManifestError, D as DEFAULT_SA_LOCALE, g as HttpResponse, M as MessageTree, h as MissingHandlerError, P as PartialMessages, R as ResolvedAction, i as SA_INTL_LOCALES, j as SA_LOCALES, k as SA_LOCALE_LABELS, l as SA_MESSAGES, m as SaBuiltinLocale, n as SaCatalog, o as SaCatalogOptions, c as SaLocaleDefinition, b as SaLocaleOption, a as SaMessages, d as SaMessagesOverrides, T as TranslationOf, p as createSaCatalog, q as defaultHttpClient, r as defaultKvStore, s as defineMessages, t as isSaBuiltinLocale, u as mergeMessages, v as resolveMessages } from './catalog-DJcfm5N2.js';
-import { A as ActionsMap, a as SuperAdminBrand, b as SuperAdminEndpoints, E as ExtensionsMap, c as SuperAdminLoginAdapter } from './use-super-admin-i18n-CHNdsSlm.js';
-export { f as ExtensionLoader, I as InstallPlugin, g as SA_LOCALE_STORAGE_KEY, h as SUPER_ADMIN_ACTIONS_KEY, i as SUPER_ADMIN_BRAND_KEY, j as SUPER_ADMIN_ENDPOINTS_KEY, k as SUPER_ADMIN_EXTENSIONS_KEY, l as SUPER_ADMIN_HTTP_KEY, m as SUPER_ADMIN_I18N_KEY, n as SUPER_ADMIN_LOGIN_ADAPTER_KEY, o as SUPER_ADMIN_MANIFEST_CLEAR_CACHE_KEY, p as SUPER_ADMIN_MANIFEST_KEY, q as SUPER_ADMIN_NOTIFY_KEY, r as SuperAdminAuthGuardOptions, S as SuperAdminGuardOptions, e as SuperAdminI18n, d as SuperAdminI18nOptions, s as SuperAdminLoginResult, t as SuperAdminManifestGuardOptions, U as UiNotify, u as UiNotifyKind, v as UiNotifyOptions, w as buildNavigationGuard, x as createSuperAdminI18n, y as useSaMessages, z as useSuperAdminI18n } from './use-super-admin-i18n-CHNdsSlm.js';
+import { A as ActionsMap, a as SuperAdminBrand, b as SuperAdminEndpoints, E as ExtensionsMap, c as SuperAdminLoginAdapter } from './use-sa-theme-OUBlaqgl.js';
+export { h as ExtensionLoader, I as InstallPlugin, i as SA_LOCALE_STORAGE_KEY, j as SA_THEME_KEY, k as SUPER_ADMIN_ACTIONS_KEY, l as SUPER_ADMIN_BRAND_KEY, m as SUPER_ADMIN_ENDPOINTS_KEY, n as SUPER_ADMIN_EXTENSIONS_KEY, o as SUPER_ADMIN_HTTP_KEY, p as SUPER_ADMIN_I18N_KEY, q as SUPER_ADMIN_LOGIN_ADAPTER_KEY, r as SUPER_ADMIN_MANIFEST_CLEAR_CACHE_KEY, s as SUPER_ADMIN_MANIFEST_KEY, t as SUPER_ADMIN_NOTIFY_KEY, u as SaColorScheme, v as SaResolvedScheme, g as SaTheme, e as SaThemeOptions, w as SuperAdminAuthGuardOptions, S as SuperAdminGuardOptions, f as SuperAdminI18n, d as SuperAdminI18nOptions, x as SuperAdminLoginResult, y as SuperAdminManifestGuardOptions, U as UiNotify, z as UiNotifyKind, B as UiNotifyOptions, C as buildNavigationGuard, D as createSaTheme, F as createSuperAdminI18n, G as useSaMessages, H as useSaTheme, J as useSuperAdminI18n } from './use-sa-theme-OUBlaqgl.js';
 import { AdminManifest, TenantListFilter, TenantDto, AuditQuery, AuditEntry, FeatureUiRegistry, PromoPreviewResponse, OnboardingSelectionRequest, PublicMarketingBundle, FeatureDef, FeatureKey, PublicBootResponse, DiscoverySnapshot, CapabilityCatalogEntryRow, FeatureCatalogEntryRow, QuotaCatalogEntryRow, ReviewCatalogEntryData, CatalogEntryI18n, UpdateCatalogEntryBaseData, SyncDiscoveryResult, BundleVersionRow, CreateBundleVersionDraftData, BundleVersionMutationResult, UpdateBundleVersionDraftData, BundleRow, CreateBundleData, UpdateBundleData, SubscriptionBundleRecord, MarketingProjectionFilter, MarketingProjectionRow, CreateMarketingProjectionData, UpdateMarketingProjectionData, PromotionRow, CreatePromotionData, UpdatePromotionData, PlanVersionRow, CreatePlanVersionDraftData, PlanVersionMutationResult, UpdatePlanVersionDraftData, PlanRow, CreatePlanData, UpdatePlanData, TenantActionDef } from '@saasicat/types';
 import { RouteRecordRaw, NavigationGuardWithThis } from 'vue-router';
 import * as vue from 'vue';

package/dist/index.js

@@ -30,6 +30,7 @@ import {
 } from "./chunk-XMMFN2WJ.js";
 import {
   SA_LOCALE_STORAGE_KEY,
+  SA_THEME_KEY,
   SUPER_ADMIN_ACTIONS_KEY,
   SUPER_ADMIN_BRAND_KEY,
   SUPER_ADMIN_ENDPOINTS_KEY,
@@ -41,10 +42,12 @@ import {
   SUPER_ADMIN_MANIFEST_KEY,
   SUPER_ADMIN_NOTIFY_KEY,
   buildNavigationGuard,
+  createSaTheme,
   createSuperAdminI18n,
   useSaMessages,
+  useSaTheme,
   useSuperAdminI18n
-} from "./chunk-LY52T4N4.js";
+} from "./chunk-TQQMKWN6.js";
 import {
   DEFAULT_SA_LOCALE,
   SA_INTL_LOCALES,
@@ -2858,6 +2861,7 @@ export {
   SA_LOCALE_LABELS,
   SA_LOCALE_STORAGE_KEY,
   SA_MESSAGES,
+  SA_THEME_KEY,
   SERVER_PAGE_SIZE_OPTIONS,
   SUPER_ADMIN_ACTIONS_KEY,
   SUPER_ADMIN_BRAND_KEY,
@@ -2883,6 +2887,7 @@ export {
   createPlatformLoaders,
   createProjectPageHostRoute,
   createSaCatalog,
+  createSaTheme,
   createSuperAdminI18n,
   defaultHttpClient,
   defaultIconForActionKey,
@@ -2932,6 +2937,7 @@ export {
   usePromotions,
   usePublicBoot,
   useSaMessages,
+  useSaTheme,
   useSubscriptionDraft,
   useSuperAdminActions,
   useSuperAdminBrand,

package/dist/quasar/index.cjs

@@ -20,6 +20,8 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/quasar/index.ts
 var quasar_exports = {};
 __export(quasar_exports, {
+  SA_PORTAL_CLASS: () => SA_PORTAL_CLASS,
+  bindSaThemeToDocument: () => bindSaThemeToDocument,
   createSuperAdminApp: () => createSuperAdminApp,
   quasarNotify: () => quasarNotify,
   useSuperAdminNotify: () => useSuperAdminNotify
@@ -27,8 +29,8 @@ __export(quasar_exports, {
 module.exports = __toCommonJS(quasar_exports);
 
 // src/quasar/create-super-admin-app.ts
-var import_vue3 = require("vue");
-var import_quasar2 = require("quasar");
+var import_vue5 = require("vue");
+var import_quasar3 = require("quasar");
 var import_pinia = require("pinia");
 var import_vue_router = require("vue-router");
 
@@ -146,8 +148,49 @@ var SUPER_ADMIN_NOTIFY_KEY = /* @__PURE__ */ Symbol.for(
   "@saasicat/ui-vue/SUPER_ADMIN_NOTIFY"
 );
 
-// src/vue/use-super-admin-i18n.ts
+// src/vue/use-sa-theme.ts
 var import_vue = require("vue");
+var SCHEMES = ["light", "dark", "system"];
+var STORAGE_KEY = "saasicat.theme.scheme";
+function isScheme(value) {
+  return typeof value === "string" && SCHEMES.includes(value);
+}
+function systemScheme() {
+  const value = (0, import_vue.ref)("light");
+  if (typeof window === "undefined" || typeof window.matchMedia !== "function") {
+    return { value, unsubscribe: () => {
+    } };
+  }
+  const query = window.matchMedia("(prefers-color-scheme: dark)");
+  value.value = query.matches ? "dark" : "light";
+  const onChange = (event) => {
+    value.value = event.matches ? "dark" : "light";
+  };
+  query.addEventListener("change", onChange);
+  return { value, unsubscribe: () => query.removeEventListener("change", onChange) };
+}
+function createSaTheme(options = {}) {
+  const storage = options.storage ?? defaultKvStore();
+  const persist = options.persist !== false;
+  const provided = options.scheme;
+  const appOwnsIt = (0, import_vue.isRef)(provided);
+  const stored = persist && !appOwnsIt ? storage.get(STORAGE_KEY) : null;
+  const scheme = (0, import_vue.isRef)(provided) ? provided : (0, import_vue.ref)(isScheme(stored) ? stored : provided ?? "system");
+  const { value: system, unsubscribe } = systemScheme();
+  const stopPersisting = persist && !appOwnsIt ? (0, import_vue.watch)(scheme, (next) => storage.set(STORAGE_KEY, next)) : null;
+  return {
+    scheme,
+    resolved: (0, import_vue.computed)(() => scheme.value === "system" ? system.value : scheme.value),
+    dispose: () => {
+      unsubscribe();
+      stopPersisting?.();
+    }
+  };
+}
+var SA_THEME_KEY = /* @__PURE__ */ Symbol.for("@saasicat/ui-vue/SA_THEME");
+
+// src/vue/use-super-admin-i18n.ts
+var import_vue2 = require("vue");
 
 // src/client/i18n/locale.ts
 var SA_LOCALES = ["de", "en"];
@@ -186,7 +229,7 @@ function mergeMessages(base, overrides) {
 }
 
 // src/client/i18n/format.ts
-var import_types = require("@saasicat/types");
+var import_types2 = require("@saasicat/types");
 
 // src/client/i18n/messages/audit.ts
 var auditMessages = defineMessages(
@@ -3250,13 +3293,13 @@ var SUPER_ADMIN_I18N_KEY = /* @__PURE__ */ Symbol.for(
 );
 function createSuperAdminI18n(options = {}) {
   const catalog = createSaCatalog(options);
-  const locale = (0, import_vue.isRef)(options.locale) ? options.locale : createOwnedLocale(options, catalog);
-  const active = (0, import_vue.computed)(
+  const locale = (0, import_vue2.isRef)(options.locale) ? options.locale : createOwnedLocale(options, catalog);
+  const active = (0, import_vue2.computed)(
     () => catalog.has(locale.value) ? locale.value : catalog.defaultLocale
   );
-  const messages = (0, import_vue.computed)(() => catalog.messagesFor(active.value));
-  const intlLocale = (0, import_vue.computed)(() => catalog.intlLocaleFor(active.value));
-  const writable = !(0, import_vue.isReadonly)(locale);
+  const messages = (0, import_vue2.computed)(() => catalog.messagesFor(active.value));
+  const intlLocale = (0, import_vue2.computed)(() => catalog.intlLocaleFor(active.value));
+  const writable = !(0, import_vue2.isReadonly)(locale);
   return {
     locale,
     messages,
@@ -3267,20 +3310,47 @@ function createSuperAdminI18n(options = {}) {
 }
 function createOwnedLocale(options, catalog) {
   const initial = options.locale ?? catalog.defaultLocale;
-  if (options.persist === false) return (0, import_vue.ref)(initial);
+  if (options.persist === false) return (0, import_vue2.ref)(initial);
   const storage = options.storage ?? defaultKvStore();
   const key = `${options.storageKeyPrefix ?? ""}${SA_LOCALE_STORAGE_KEY}`;
   const stored = storage.get(key);
-  const locale = (0, import_vue.ref)(stored && catalog.has(stored) ? stored : initial);
-  (0, import_vue.watch)(locale, (next) => storage.set(key, next));
+  const locale = (0, import_vue2.ref)(stored && catalog.has(stored) ? stored : initial);
+  (0, import_vue2.watch)(locale, (next) => storage.set(key, next));
   return locale;
 }
 
-// src/quasar/notify.ts
-var import_vue2 = require("vue");
+// src/quasar/dark-bridge.ts
 var import_quasar = require("quasar");
+var import_vue3 = require("vue");
+function bindSaThemeToDocument(theme) {
+  const toQuasar = (0, import_vue3.watch)(
+    theme.resolved,
+    (resolved) => {
+      if (typeof document !== "undefined") {
+        document.documentElement.setAttribute("data-sa-theme", resolved);
+      }
+      import_quasar.Dark.set(resolved === "dark");
+    },
+    { immediate: true }
+  );
+  const fromQuasar = (0, import_vue3.watch)(
+    () => import_quasar.Dark.isActive,
+    (isDark) => {
+      const asScheme = isDark ? "dark" : "light";
+      if (theme.resolved.value !== asScheme) theme.scheme.value = asScheme;
+    }
+  );
+  return () => {
+    toQuasar();
+    fromQuasar();
+  };
+}
+
+// src/quasar/notify.ts
+var import_vue4 = require("vue");
+var import_quasar2 = require("quasar");
 var quasarNotify = (kind, message, options) => {
-  import_quasar.Notify.create({
+  import_quasar2.Notify.create({
     type: kind,
     message,
     position: "top",
@@ -3289,17 +3359,29 @@ var quasarNotify = (kind, message, options) => {
   });
 };
 function useSuperAdminNotify() {
-  return (0, import_vue2.inject)(SUPER_ADMIN_NOTIFY_KEY, quasarNotify);
+  return (0, import_vue4.inject)(SUPER_ADMIN_NOTIFY_KEY, quasarNotify);
 }
 
 // src/quasar/create-super-admin-app.ts
+var SA_PORTAL_CLASS = "sa-portal";
 var DEFAULT_QUASAR_OPTIONS = {
-  plugins: { Notify: import_quasar2.Notify, Dialog: import_quasar2.Dialog, Loading: import_quasar2.Loading },
+  plugins: { Notify: import_quasar3.Notify, Dialog: import_quasar3.Dialog, Loading: import_quasar3.Loading },
   config: { notify: { position: "top-right", timeout: 3e3 } }
 };
 function createSuperAdminApp(options) {
-  const app = (0, import_vue3.createApp)(options.rootComponent);
-  app.use(import_quasar2.Quasar, options.quasarOptions ?? DEFAULT_QUASAR_OPTIONS);
+  const app = (0, import_vue5.createApp)(options.rootComponent);
+  const quasarOptions = options.quasarOptions ?? DEFAULT_QUASAR_OPTIONS;
+  const config = quasarOptions.config;
+  const existingPortalClass = config?.globalNodes?.class;
+  app.use(import_quasar3.Quasar, {
+    ...quasarOptions,
+    config: {
+      ...quasarOptions.config,
+      globalNodes: {
+        class: [existingPortalClass, SA_PORTAL_CLASS].filter(Boolean).join(" ")
+      }
+    }
+  });
   const pinia = (0, import_pinia.createPinia)();
   app.use(pinia);
   const router = (0, import_vue_router.createRouter)({
@@ -3317,8 +3399,15 @@ function createSuperAdminApp(options) {
     manifestEndpoint: options.endpoints.manifestEndpoint ?? `${options.endpoints.apiBase}/manifest`
   };
   const i18n = createSuperAdminI18n(options.i18n);
+  const configuredDark = options.quasarOptions?.config?.dark;
+  const theme = createSaTheme({
+    ...options.theme,
+    scheme: options.theme?.scheme ?? (typeof configuredDark === "boolean" ? configuredDark ? "dark" : "light" : void 0)
+  });
+  const stopThemeBridge = bindSaThemeToDocument(theme);
   app.provide(SUPER_ADMIN_BRAND_KEY, { tag: "SuperAdmin", ...options.brand });
   app.provide(SUPER_ADMIN_I18N_KEY, i18n);
+  app.provide(SA_THEME_KEY, theme);
   app.provide(SUPER_ADMIN_ENDPOINTS_KEY, endpoints);
   app.provide(SUPER_ADMIN_EXTENSIONS_KEY, options.extensions ?? {});
   app.provide(SUPER_ADMIN_ACTIONS_KEY, options.actions ?? {});
@@ -3341,11 +3430,18 @@ function createSuperAdminApp(options) {
     router,
     pinia,
     i18n,
-    mount: (selector) => app.mount(selector)
+    theme,
+    mount: (selector) => app.mount(selector),
+    dispose: () => {
+      stopThemeBridge();
+      theme.dispose();
+    }
   };
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  SA_PORTAL_CLASS,
+  bindSaThemeToDocument,
   createSuperAdminApp,
   quasarNotify,
   useSuperAdminNotify

package/dist/quasar/index.d.cts

@@ -1,9 +1,9 @@
-import { Component, App } from 'vue';
+import { Component, App, WatchStopHandle } from 'vue';
 import { QuasarPluginOptions } from 'quasar';
 import { Pinia } from 'pinia';
 import { RouteRecordRaw, RouterHistory, Router } from 'vue-router';
 import { H as HttpClient } from '../catalog-DJcfm5N2.cjs';
-import { S as SuperAdminGuardOptions, a as SuperAdminBrand, b as SuperAdminEndpoints, E as ExtensionsMap, A as ActionsMap, c as SuperAdminLoginAdapter, U as UiNotify, I as InstallPlugin, d as SuperAdminI18nOptions, e as SuperAdminI18n } from '../use-super-admin-i18n-CgTuNi8h.cjs';
+import { S as SuperAdminGuardOptions, a as SuperAdminBrand, b as SuperAdminEndpoints, E as ExtensionsMap, A as ActionsMap, c as SuperAdminLoginAdapter, U as UiNotify, I as InstallPlugin, d as SuperAdminI18nOptions, e as SaThemeOptions, f as SuperAdminI18n, g as SaTheme } from '../use-sa-theme-B5t7oXph.cjs';
 import '@saasicat/types';
 
 interface CreateSuperAdminAppOptions extends SuperAdminGuardOptions {
@@ -66,6 +66,17 @@ interface CreateSuperAdminAppOptions extends SuperAdminGuardOptions {
      * runtime. Consumed via `useSuperAdminI18n()` / `useSaMessages()`.
      */
     i18n?: SuperAdminI18nOptions;
+    /**
+     * Optional: colour scheme. Default follows the operating system and
+     * remembers an explicit pick. The context is returned on the handle
+     * (`handle.theme`) — set `handle.theme.scheme.value = 'dark'` to switch at
+     * runtime, and read it anywhere via `useSaTheme()`.
+     *
+     * Whatever it resolves to is mirrored onto `<html data-sa-theme>` AND into
+     * Quasar's `Dark`, so the platform's surfaces and Quasar's own components
+     * never disagree.
+     */
+    theme?: SaThemeOptions;
 }
 interface SuperAdminAppHandle {
     app: App;
@@ -73,9 +84,27 @@ interface SuperAdminAppHandle {
     pinia: Pinia;
     /** i18n context of the shell — switch locale via `i18n.locale.value`. */
     i18n: SuperAdminI18n;
+    /** Colour scheme of the shell — switch via `theme.scheme.value`. */
+    theme: SaTheme;
     /** Mounts the app on a selector. Returns the root component instance. */
     mount: (selector: string | Element) => ReturnType<App['mount']>;
+    /**
+     * Releases what this helper attached to the DOCUMENT — the theme's
+     * `prefers-color-scheme` subscription and the bridge that mirrors it onto
+     * `data-sa-theme` and Quasar's `Dark`. Idempotent; it does not unmount the
+     * app, which is `handle.app.unmount()`.
+     *
+     * Only matters where a shell is torn down while the document survives: hot
+     * reload, a micro-frontend, a second shell in one page. Skip it and the old
+     * bridge keeps writing to the one document on the next OS theme change, and
+     * can overrule the scheme the new shell was given.
+     */
+    dispose: () => void;
 }
+/** Marks Quasar's teleported nodes so the theme can reach them. Exported so a
+ * test fixture can install the same config a real app gets — without it the
+ * `.sa-portal` rules are exercised by nothing. */
+declare const SA_PORTAL_CLASS = "sa-portal";
 /**
  * Universal bootstrap function for SuperAdmin apps. Replaces the `main.ts`
  * boilerplate duplicated per app today (Quasar + Pinia + Router + manifest
@@ -84,6 +113,22 @@ interface SuperAdminAppHandle {
  */
 declare function createSuperAdminApp(options: CreateSuperAdminAppOptions): SuperAdminAppHandle;
 
+/**
+ * Mirrors a theme context onto the document and Quasar. Returns the stop
+ * handle; `createSuperAdminApp()` wires this up for you.
+ *
+ * `immediate` is not optional: at bootstrap the stored pick is already resolved
+ * and nothing has painted yet, so a first-change-only watcher would render one
+ * frame in the wrong theme on every reload.
+ *
+ * That first tick MIRRORS, it does not negotiate — whatever `theme.resolved`
+ * says is written to Quasar, including `Dark.set(false)`. So a caller that
+ * bootstraps with Quasar already dark has to say so when it builds the theme,
+ * or its own choice is erased one line after it was applied.
+ * `createSuperAdminApp` does exactly that, seeding from `Dark.isActive`.
+ */
+declare function bindSaThemeToDocument(theme: SaTheme): WatchStopHandle;
+
 /**
  * Quasar-backed notify port: `position: 'top'` matches the convention the
  * standard pages used with their previous direct `$q.notify` calls.
@@ -92,4 +137,4 @@ declare const quasarNotify: UiNotify;
 /** Returns the app-provided notify port, falling back to the Quasar default. */
 declare function useSuperAdminNotify(): UiNotify;
 
-export { type CreateSuperAdminAppOptions, type SuperAdminAppHandle, createSuperAdminApp, quasarNotify, useSuperAdminNotify };
+export { type CreateSuperAdminAppOptions, SA_PORTAL_CLASS, type SuperAdminAppHandle, bindSaThemeToDocument, createSuperAdminApp, quasarNotify, useSuperAdminNotify };

package/dist/quasar/index.d.ts

@@ -1,9 +1,9 @@
-import { Component, App } from 'vue';
+import { Component, App, WatchStopHandle } from 'vue';
 import { QuasarPluginOptions } from 'quasar';
 import { Pinia } from 'pinia';
 import { RouteRecordRaw, RouterHistory, Router } from 'vue-router';
 import { H as HttpClient } from '../catalog-DJcfm5N2.js';
-import { S as SuperAdminGuardOptions, a as SuperAdminBrand, b as SuperAdminEndpoints, E as ExtensionsMap, A as ActionsMap, c as SuperAdminLoginAdapter, U as UiNotify, I as InstallPlugin, d as SuperAdminI18nOptions, e as SuperAdminI18n } from '../use-super-admin-i18n-CHNdsSlm.js';
+import { S as SuperAdminGuardOptions, a as SuperAdminBrand, b as SuperAdminEndpoints, E as ExtensionsMap, A as ActionsMap, c as SuperAdminLoginAdapter, U as UiNotify, I as InstallPlugin, d as SuperAdminI18nOptions, e as SaThemeOptions, f as SuperAdminI18n, g as SaTheme } from '../use-sa-theme-OUBlaqgl.js';
 import '@saasicat/types';
 
 interface CreateSuperAdminAppOptions extends SuperAdminGuardOptions {
@@ -66,6 +66,17 @@ interface CreateSuperAdminAppOptions extends SuperAdminGuardOptions {
      * runtime. Consumed via `useSuperAdminI18n()` / `useSaMessages()`.
      */
     i18n?: SuperAdminI18nOptions;
+    /**
+     * Optional: colour scheme. Default follows the operating system and
+     * remembers an explicit pick. The context is returned on the handle
+     * (`handle.theme`) — set `handle.theme.scheme.value = 'dark'` to switch at
+     * runtime, and read it anywhere via `useSaTheme()`.
+     *
+     * Whatever it resolves to is mirrored onto `<html data-sa-theme>` AND into
+     * Quasar's `Dark`, so the platform's surfaces and Quasar's own components
+     * never disagree.
+     */
+    theme?: SaThemeOptions;
 }
 interface SuperAdminAppHandle {
     app: App;
@@ -73,9 +84,27 @@ interface SuperAdminAppHandle {
     pinia: Pinia;
     /** i18n context of the shell — switch locale via `i18n.locale.value`. */
     i18n: SuperAdminI18n;
+    /** Colour scheme of the shell — switch via `theme.scheme.value`. */
+    theme: SaTheme;
     /** Mounts the app on a selector. Returns the root component instance. */
     mount: (selector: string | Element) => ReturnType<App['mount']>;
+    /**
+     * Releases what this helper attached to the DOCUMENT — the theme's
+     * `prefers-color-scheme` subscription and the bridge that mirrors it onto
+     * `data-sa-theme` and Quasar's `Dark`. Idempotent; it does not unmount the
+     * app, which is `handle.app.unmount()`.
+     *
+     * Only matters where a shell is torn down while the document survives: hot
+     * reload, a micro-frontend, a second shell in one page. Skip it and the old
+     * bridge keeps writing to the one document on the next OS theme change, and
+     * can overrule the scheme the new shell was given.
+     */
+    dispose: () => void;
 }
+/** Marks Quasar's teleported nodes so the theme can reach them. Exported so a
+ * test fixture can install the same config a real app gets — without it the
+ * `.sa-portal` rules are exercised by nothing. */
+declare const SA_PORTAL_CLASS = "sa-portal";
 /**
  * Universal bootstrap function for SuperAdmin apps. Replaces the `main.ts`
  * boilerplate duplicated per app today (Quasar + Pinia + Router + manifest
@@ -84,6 +113,22 @@ interface SuperAdminAppHandle {
  */
 declare function createSuperAdminApp(options: CreateSuperAdminAppOptions): SuperAdminAppHandle;
 
+/**
+ * Mirrors a theme context onto the document and Quasar. Returns the stop
+ * handle; `createSuperAdminApp()` wires this up for you.
+ *
+ * `immediate` is not optional: at bootstrap the stored pick is already resolved
+ * and nothing has painted yet, so a first-change-only watcher would render one
+ * frame in the wrong theme on every reload.
+ *
+ * That first tick MIRRORS, it does not negotiate — whatever `theme.resolved`
+ * says is written to Quasar, including `Dark.set(false)`. So a caller that
+ * bootstraps with Quasar already dark has to say so when it builds the theme,
+ * or its own choice is erased one line after it was applied.
+ * `createSuperAdminApp` does exactly that, seeding from `Dark.isActive`.
+ */
+declare function bindSaThemeToDocument(theme: SaTheme): WatchStopHandle;
+
 /**
  * Quasar-backed notify port: `position: 'top'` matches the convention the
  * standard pages used with their previous direct `$q.notify` calls.
@@ -92,4 +137,4 @@ declare const quasarNotify: UiNotify;
 /** Returns the app-provided notify port, falling back to the Quasar default. */
 declare function useSuperAdminNotify(): UiNotify;
 
-export { type CreateSuperAdminAppOptions, type SuperAdminAppHandle, createSuperAdminApp, quasarNotify, useSuperAdminNotify };
+export { type CreateSuperAdminAppOptions, SA_PORTAL_CLASS, type SuperAdminAppHandle, bindSaThemeToDocument, createSuperAdminApp, quasarNotify, useSuperAdminNotify };

package/dist/quasar/index.js

@@ -1,4 +1,5 @@
 import {
+  SA_THEME_KEY,
   SUPER_ADMIN_ACTIONS_KEY,
   SUPER_ADMIN_BRAND_KEY,
   SUPER_ADMIN_ENDPOINTS_KEY,
@@ -10,8 +11,9 @@ import {
   SUPER_ADMIN_MANIFEST_KEY,
   SUPER_ADMIN_NOTIFY_KEY,
   buildNavigationGuard,
+  createSaTheme,
   createSuperAdminI18n
-} from "../chunk-LY52T4N4.js";
+} from "../chunk-TQQMKWN6.js";
 import {
   defaultHttpClient
 } from "../chunk-F7NRM6KI.js";
@@ -25,6 +27,33 @@ import {
   createWebHistory
 } from "vue-router";
 
+// src/quasar/dark-bridge.ts
+import { Dark } from "quasar";
+import { watch } from "vue";
+function bindSaThemeToDocument(theme) {
+  const toQuasar = watch(
+    theme.resolved,
+    (resolved) => {
+      if (typeof document !== "undefined") {
+        document.documentElement.setAttribute("data-sa-theme", resolved);
+      }
+      Dark.set(resolved === "dark");
+    },
+    { immediate: true }
+  );
+  const fromQuasar = watch(
+    () => Dark.isActive,
+    (isDark) => {
+      const asScheme = isDark ? "dark" : "light";
+      if (theme.resolved.value !== asScheme) theme.scheme.value = asScheme;
+    }
+  );
+  return () => {
+    toQuasar();
+    fromQuasar();
+  };
+}
+
 // src/quasar/notify.ts
 import { inject } from "vue";
 import { Notify } from "quasar";
@@ -42,13 +71,25 @@ function useSuperAdminNotify() {
 }
 
 // src/quasar/create-super-admin-app.ts
+var SA_PORTAL_CLASS = "sa-portal";
 var DEFAULT_QUASAR_OPTIONS = {
   plugins: { Notify: Notify2, Dialog, Loading },
   config: { notify: { position: "top-right", timeout: 3e3 } }
 };
 function createSuperAdminApp(options) {
   const app = createApp(options.rootComponent);
-  app.use(Quasar, options.quasarOptions ?? DEFAULT_QUASAR_OPTIONS);
+  const quasarOptions = options.quasarOptions ?? DEFAULT_QUASAR_OPTIONS;
+  const config = quasarOptions.config;
+  const existingPortalClass = config?.globalNodes?.class;
+  app.use(Quasar, {
+    ...quasarOptions,
+    config: {
+      ...quasarOptions.config,
+      globalNodes: {
+        class: [existingPortalClass, SA_PORTAL_CLASS].filter(Boolean).join(" ")
+      }
+    }
+  });
   const pinia = createPinia();
   app.use(pinia);
   const router = createRouter({
@@ -66,8 +107,15 @@ function createSuperAdminApp(options) {
     manifestEndpoint: options.endpoints.manifestEndpoint ?? `${options.endpoints.apiBase}/manifest`
   };
   const i18n = createSuperAdminI18n(options.i18n);
+  const configuredDark = options.quasarOptions?.config?.dark;
+  const theme = createSaTheme({
+    ...options.theme,
+    scheme: options.theme?.scheme ?? (typeof configuredDark === "boolean" ? configuredDark ? "dark" : "light" : void 0)
+  });
+  const stopThemeBridge = bindSaThemeToDocument(theme);
   app.provide(SUPER_ADMIN_BRAND_KEY, { tag: "SuperAdmin", ...options.brand });
   app.provide(SUPER_ADMIN_I18N_KEY, i18n);
+  app.provide(SA_THEME_KEY, theme);
   app.provide(SUPER_ADMIN_ENDPOINTS_KEY, endpoints);
   app.provide(SUPER_ADMIN_EXTENSIONS_KEY, options.extensions ?? {});
   app.provide(SUPER_ADMIN_ACTIONS_KEY, options.actions ?? {});
@@ -90,10 +138,17 @@ function createSuperAdminApp(options) {
     router,
     pinia,
     i18n,
-    mount: (selector) => app.mount(selector)
+    theme,
+    mount: (selector) => app.mount(selector),
+    dispose: () => {
+      stopThemeBridge();
+      theme.dispose();
+    }
   };
 }
 export {
+  SA_PORTAL_CLASS,
+  bindSaThemeToDocument,
   createSuperAdminApp,
   quasarNotify,
   useSuperAdminNotify

package/dist/{use-super-admin-i18n-CgTuNi8h.d.cts → use-sa-theme-B5t7oXph.d.cts}

@@ -280,4 +280,54 @@ declare function useSuperAdminI18n(): SuperAdminI18n;
  */
 declare function useSaMessages<K extends keyof SaMessages>(namespace: K): ComputedRef<SaMessages[K]>;
 
-export { type ActionsMap as A, type ExtensionsMap as E, type InstallPlugin as I, type SuperAdminGuardOptions as S, type UiNotify as U, type SuperAdminBrand as a, type SuperAdminEndpoints as b, type SuperAdminLoginAdapter as c, type SuperAdminI18nOptions as d, type SuperAdminI18n as e, type ExtensionLoader as f, SA_LOCALE_STORAGE_KEY as g, SUPER_ADMIN_ACTIONS_KEY as h, SUPER_ADMIN_BRAND_KEY as i, SUPER_ADMIN_ENDPOINTS_KEY as j, SUPER_ADMIN_EXTENSIONS_KEY as k, SUPER_ADMIN_HTTP_KEY as l, SUPER_ADMIN_I18N_KEY as m, SUPER_ADMIN_LOGIN_ADAPTER_KEY as n, SUPER_ADMIN_MANIFEST_CLEAR_CACHE_KEY as o, SUPER_ADMIN_MANIFEST_KEY as p, SUPER_ADMIN_NOTIFY_KEY as q, type SuperAdminAuthGuardOptions as r, type SuperAdminLoginResult as s, type SuperAdminManifestGuardOptions as t, type UiNotifyKind as u, type UiNotifyOptions as v, buildNavigationGuard as w, createSuperAdminI18n as x, useSaMessages as y, useSuperAdminI18n as z };
+type SaColorScheme = 'light' | 'dark' | 'system';
+type SaResolvedScheme = 'light' | 'dark';
+interface SaTheme {
+    /** What the operator picked. Writable — assigning switches the theme. */
+    scheme: Ref<SaColorScheme>;
+    /** What that means right now: `'system'` resolved against the OS. */
+    resolved: ComputedRef<SaResolvedScheme>;
+    /**
+     * Releases the `prefers-color-scheme` subscription and the persistence
+     * watcher. Idempotent.
+     *
+     * Needed because this context outlives no component — nothing unmounts it.
+     * A second shell in the same document (hot reload, a micro-frontend, a
+     * second test file) would otherwise leave the first one subscribed, and the
+     * next change of the operating system's theme would drive TWO bridges, both
+     * writing `data-sa-theme` and Quasar's `Dark` onto the one document. The
+     * stale one can win, and then the new shell's explicit scheme is overruled
+     * by a context nobody holds a reference to any more.
+     */
+    dispose: () => void;
+}
+interface SaThemeOptions {
+    /** Starting scheme. Pass a `Ref` to keep the value in your own store. */
+    scheme?: SaColorScheme | Ref<SaColorScheme>;
+    /**
+     * Remember the operator's pick across reloads, default `true`. Ignored when
+     * `scheme` is a `Ref`: the app owns that value and persists it where it
+     * belongs. Same rule as the locale in `createSuperAdminI18n`.
+     */
+    persist?: boolean;
+    /** Injection seam for tests. */
+    storage?: KvStore;
+}
+/**
+ * Creates the theme context. `createSuperAdminApp()` makes one and the Quasar
+ * bridge mirrors it onto the document; call it directly only when bootstrapping
+ * by hand.
+ */
+declare function createSaTheme(options?: SaThemeOptions): SaTheme;
+declare const SA_THEME_KEY: InjectionKey<SaTheme>;
+/**
+ * The shell's theme context, or a shared unpersisted one outside a shell.
+ *
+ * Same shape as `useSuperAdminI18n()`, and for the same reason: a component
+ * mounted in isolation must render rather than throw, and the fallback must not
+ * write to real storage or two tests in one process would decide each other's
+ * outcome.
+ */
+declare function useSaTheme(): SaTheme;
+
+export { type ActionsMap as A, type UiNotifyOptions as B, buildNavigationGuard as C, createSaTheme as D, type ExtensionsMap as E, createSuperAdminI18n as F, useSaMessages as G, useSaTheme as H, type InstallPlugin as I, useSuperAdminI18n as J, type SuperAdminGuardOptions as S, type UiNotify as U, type SuperAdminBrand as a, type SuperAdminEndpoints as b, type SuperAdminLoginAdapter as c, type SuperAdminI18nOptions as d, type SaThemeOptions as e, type SuperAdminI18n as f, type SaTheme as g, type ExtensionLoader as h, SA_LOCALE_STORAGE_KEY as i, SA_THEME_KEY as j, SUPER_ADMIN_ACTIONS_KEY as k, SUPER_ADMIN_BRAND_KEY as l, SUPER_ADMIN_ENDPOINTS_KEY as m, SUPER_ADMIN_EXTENSIONS_KEY as n, SUPER_ADMIN_HTTP_KEY as o, SUPER_ADMIN_I18N_KEY as p, SUPER_ADMIN_LOGIN_ADAPTER_KEY as q, SUPER_ADMIN_MANIFEST_CLEAR_CACHE_KEY as r, SUPER_ADMIN_MANIFEST_KEY as s, SUPER_ADMIN_NOTIFY_KEY as t, type SaColorScheme as u, type SaResolvedScheme as v, type SuperAdminAuthGuardOptions as w, type SuperAdminLoginResult as x, type SuperAdminManifestGuardOptions as y, type UiNotifyKind as z };