@descope/sdk-mixins 0.4.0 → 0.5.0

package/dist/index.d.ts

@@ -56,8 +56,8 @@ interface ProjectConfiguration {
 declare const configMixin: <T extends CustomElementConstructor>(superclass: T) => {
     new (...params: any[]): {
         readonly config: any;
-        "__#12334@#_configResource": any;
-        "__#12334@#fetchConfig": () => Promise<{
+        "__#12363@#_configResource": any;
+        "__#12363@#fetchConfig": () => Promise<{
             projectConfig: ProjectConfiguration;
             executionContext: {
                 geo: string;
@@ -396,14 +396,14 @@ declare const configMixin: <T extends CustomElementConstructor>(superclass: T) =
         blur(): void;
         focus(options?: FocusOptions): void;
         readonly projectId: string;
-        "__#12333@#handleError"(attrName: string, newValue: string): void;
+        "__#12362@#handleError"(attrName: string, newValue: string): void;
         init(): Promise<void>;
-        "__#12332@#observeMappings": {};
+        "__#12361@#observeMappings": {};
         observeAttribute(attrName: string, onAttrChange: (attrName: string, value: string) => void): () => any;
         observeAttributes(attrs: string[], cb: (attrName: string, value: string) => void): () => void;
-        "__#12331@#isInit": boolean;
-        "__#12330@#logger": Logger;
-        "__#12330@#wrapLogger": ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger);
+        "__#12360@#isInit": boolean;
+        "__#12359@#logger": Logger;
+        "__#12359@#wrapLogger": ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger);
         get logger(): Logger;
         set logger(logger: Partial<Logger>);
         onLogEvent: ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void);
@@ -413,12 +413,12 @@ declare const configMixin: <T extends CustomElementConstructor>(superclass: T) =
 declare const createValidateAttributesMixin: {
     (mappings: Record<string, CheckValueFn | string>): <T extends CustomElementConstructor>(superclass: T) => {
         new (...args: any): {
-            "__#12333@#handleError"(attrName: string, newValue: string | null): void;
+            "__#12362@#handleError"(attrName: string, newValue: string | null): void;
             init(): Promise<void>;
-            "__#12332@#observeMappings": {};
+            "__#12361@#observeMappings": {};
             observeAttribute(attrName: string, onAttrChange: (attrName: string, value: string) => void): () => any;
             observeAttributes(attrs: string[], cb: (attrName: string, value: string) => void): () => void;
-            "__#12331@#isInit": boolean;
+            "__#12360@#isInit": boolean;
             connectedCallback: (() => void) & (() => void) & (() => void);
             accessKey: string;
             readonly accessKeyLabel: string;
@@ -745,8 +745,8 @@ declare const createValidateAttributesMixin: {
             tabIndex: number;
             blur(): void;
             focus(options?: FocusOptions): void;
-            "__#12330@#logger": Logger;
-            "__#12330@#wrapLogger": ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger);
+            "__#12359@#logger": Logger;
+            "__#12359@#wrapLogger": ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger);
             get logger(): Logger;
             set logger(logger: Partial<Logger>);
             onLogEvent: ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void);
@@ -760,8 +760,8 @@ declare const logLevels: readonly ["error", "warn", "info", "debug"];
 type LogLevel = (typeof logLevels)[number];
 declare const loggerMixin: <T extends CustomElementConstructor>(superclass: T) => {
     new (...params: any[]): {
-        "__#12330@#logger": Logger;
-        "__#12330@#wrapLogger"(logger: Partial<Logger>): Logger;
+        "__#12359@#logger": Logger;
+        "__#12359@#wrapLogger"(logger: Partial<Logger>): Logger;
         get logger(): Logger;
         set logger(logger: Partial<Logger>);
         onLogEvent(logLevel: LogLevel, data: any[]): void;
@@ -1101,19 +1101,19 @@ type DebuggerMessage = {
 
 declare const debuggerMixin: <T extends CustomElementConstructor>(superclass: T) => {
     new (...params: any[]): {
-        "__#12336@#debuggerEle": (HTMLElement & {
+        "__#12365@#debuggerEle": (HTMLElement & {
             updateData: (data: DebuggerMessage | DebuggerMessage[]) => void;
         }) | null;
-        "__#12336@#disableDebugger"(): void;
-        "__#12336@#enableDebugger"(): Promise<void>;
+        "__#12365@#disableDebugger"(): void;
+        "__#12365@#enableDebugger"(): Promise<void>;
         attributeChangedCallback: (attrName: string, oldValue: string | null, newValue: string | null) => void;
         readonly debug: boolean;
-        "__#12336@#handleDebugMode"(): void;
+        "__#12365@#handleDebugMode"(): void;
         onLogEvent(logLevel: LogLevel, args: any[]): void;
         init(): Promise<void>;
-        "__#12336@#updateDebuggerMessages"(title: string, description: string): void;
-        "__#12330@#logger": Logger;
-        "__#12330@#wrapLogger"(logger: Partial<Logger>): Logger;
+        "__#12365@#updateDebuggerMessages"(title: string, description: string): void;
+        "__#12359@#logger": Logger;
+        "__#12359@#wrapLogger"(logger: Partial<Logger>): Logger;
         get logger(): Logger;
         set logger(logger: Partial<Logger>);
         accessKey: string;
@@ -1441,7 +1441,7 @@ declare const debuggerMixin: <T extends CustomElementConstructor>(superclass: T)
         tabIndex: number;
         blur(): void;
         focus(options?: FocusOptions): void;
-        "__#12331@#isInit": boolean;
+        "__#12360@#isInit": boolean;
     };
 } & T;
 
@@ -1449,21 +1449,21 @@ type ErrorCb = (error: string) => void;
 type LoadCb = () => void;
 declare const descopeUiMixin: <T extends CustomElementConstructor>(superclass: T) => {
     new (...params: any[]): {
-        "__#12337@#errorCbsSym": symbol;
-        "__#12337@#loadCbsSym": symbol;
-        "__#12337@#getComponentsVersion"(): Promise<any>;
-        "__#12337@#exposeAlternateEvents"(scriptEle: HTMLScriptElement): void;
-        "__#12337@#handleFallbackScript"(errorCbs: ErrorCb[], loadCbs: LoadCb[], elemId: string, scriptUrl: string): Promise<void>;
-        "__#12337@#registerEvents"(scriptEle: HTMLScriptElement): void;
-        "__#12337@#getDescopeUiLoadingScript"(): Promise<HTMLElement>;
-        "__#12337@#descopeUi": Promise<any>;
+        "__#12366@#errorCbsSym": symbol;
+        "__#12366@#loadCbsSym": symbol;
+        "__#12366@#getComponentsVersion"(): Promise<any>;
+        "__#12366@#exposeAlternateEvents"(scriptEle: HTMLScriptElement): void;
+        "__#12366@#handleFallbackScript"(errorCbs: ErrorCb[], loadCbs: LoadCb[], elemId: string, scriptUrl: string): Promise<void>;
+        "__#12366@#registerEvents"(scriptEle: HTMLScriptElement): void;
+        "__#12366@#getDescopeUiLoadingScript"(): Promise<HTMLElement>;
+        "__#12366@#descopeUi": Promise<any>;
         readonly descopeUi: Promise<any>;
-        "__#12337@#loadDescopeUiComponent"(componentName: string): Promise<any>;
+        "__#12366@#loadDescopeUiComponent"(componentName: string): Promise<any>;
         loadDescopeUiComponents(templateOrComponentNames: HTMLTemplateElement | string[]): Promise<any[]>;
-        "__#12337@#getDescopeUi"(): Promise<unknown>;
+        "__#12366@#getDescopeUi"(): Promise<unknown>;
         readonly config: any;
-        "__#12334@#_configResource": any;
-        "__#12334@#fetchConfig": () => Promise<{
+        "__#12363@#_configResource": any;
+        "__#12363@#fetchConfig": () => Promise<{
             projectConfig: ProjectConfiguration;
             executionContext: {
                 geo: string;
@@ -1802,14 +1802,14 @@ declare const descopeUiMixin: <T extends CustomElementConstructor>(superclass: T
         blur(): void;
         focus(options?: FocusOptions): void;
         readonly projectId: string;
-        "__#12333@#handleError"(attrName: string, newValue: string): void;
+        "__#12362@#handleError"(attrName: string, newValue: string): void;
         init(): Promise<void>;
-        "__#12332@#observeMappings": {};
+        "__#12361@#observeMappings": {};
         observeAttribute(attrName: string, onAttrChange: (attrName: string, value: string) => void): () => any;
         observeAttributes(attrs: string[], cb: (attrName: string, value: string) => void): () => void;
-        "__#12331@#isInit": boolean;
-        "__#12330@#logger": Logger;
-        "__#12330@#wrapLogger": ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger);
+        "__#12360@#isInit": boolean;
+        "__#12359@#logger": Logger;
+        "__#12359@#wrapLogger": ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger);
         get logger(): Logger;
         set logger(logger: Partial<Logger>);
         onLogEvent: ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void);
@@ -1818,7 +1818,7 @@ declare const descopeUiMixin: <T extends CustomElementConstructor>(superclass: T
 
 declare const modalMixin: <T extends CustomElementConstructor>(superclass: T) => {
     new (...params: any[]): {
-        "__#12341@#ModalDriverWrapper": {
+        "__#12370@#ModalDriverWrapper": {
             new (refOrRefFn: Element | (() => HTMLElement), config: {
                 logger: {
                     error(...data: any[]): void;
@@ -1828,7 +1828,7 @@ declare const modalMixin: <T extends CustomElementConstructor>(superclass: T) =>
                 };
             }): {
                 setContent(template: HTMLTemplateElement): void;
-                "__#12340@#private": any;
+                "__#12369@#private": any;
                 beforeOpen: () => void | Promise<void>;
                 afterClose: () => void;
                 nodeName: string;
@@ -1836,7 +1836,7 @@ declare const modalMixin: <T extends CustomElementConstructor>(superclass: T) =>
                 open(): Promise<void>;
                 reset(): void;
                 remove(): void;
-                "__#12338@#private": any;
+                "__#12367@#private": any;
                 logger: {
                     error(...data: any[]): void;
                     warn(...data: any[]): void;
@@ -1849,21 +1849,21 @@ declare const modalMixin: <T extends CustomElementConstructor>(superclass: T) =>
         };
         createModal(config?: Record<string, string>): ModalDriver;
         init(): Promise<void>;
-        "__#12337@#errorCbsSym": symbol;
-        "__#12337@#loadCbsSym": symbol;
-        "__#12337@#getComponentsVersion"(): Promise<any>;
-        "__#12337@#exposeAlternateEvents"(scriptEle: HTMLScriptElement): void;
-        "__#12337@#handleFallbackScript"(errorCbs: ((error: string) => void)[], loadCbs: (() => void)[], elemId: string, scriptUrl: string): Promise<void>;
-        "__#12337@#registerEvents"(scriptEle: HTMLScriptElement): void;
-        "__#12337@#getDescopeUiLoadingScript"(): Promise<HTMLElement>;
-        "__#12337@#descopeUi": Promise<any>;
+        "__#12366@#errorCbsSym": symbol;
+        "__#12366@#loadCbsSym": symbol;
+        "__#12366@#getComponentsVersion"(): Promise<any>;
+        "__#12366@#exposeAlternateEvents"(scriptEle: HTMLScriptElement): void;
+        "__#12366@#handleFallbackScript"(errorCbs: ((error: string) => void)[], loadCbs: (() => void)[], elemId: string, scriptUrl: string): Promise<void>;
+        "__#12366@#registerEvents"(scriptEle: HTMLScriptElement): void;
+        "__#12366@#getDescopeUiLoadingScript"(): Promise<HTMLElement>;
+        "__#12366@#descopeUi": Promise<any>;
         readonly descopeUi: Promise<any>;
-        "__#12337@#loadDescopeUiComponent"(componentName: string): Promise<any>;
+        "__#12366@#loadDescopeUiComponent"(componentName: string): Promise<any>;
         loadDescopeUiComponents(templateOrComponentNames: HTMLTemplateElement | string[]): Promise<any[]>;
-        "__#12337@#getDescopeUi"(): Promise<unknown>;
+        "__#12366@#getDescopeUi"(): Promise<unknown>;
         readonly config: any;
-        "__#12334@#_configResource": any;
-        "__#12334@#fetchConfig": () => Promise<{
+        "__#12363@#_configResource": any;
+        "__#12363@#fetchConfig": () => Promise<{
             projectConfig: ProjectConfiguration;
             executionContext: {
                 geo: string;
@@ -2202,13 +2202,13 @@ declare const modalMixin: <T extends CustomElementConstructor>(superclass: T) =>
         blur(): void;
         focus(options?: FocusOptions): void;
         readonly projectId: string;
-        "__#12333@#handleError"(attrName: string, newValue: string): void;
-        "__#12332@#observeMappings": {};
+        "__#12362@#handleError"(attrName: string, newValue: string): void;
+        "__#12361@#observeMappings": {};
         observeAttribute(attrName: string, onAttrChange: (attrName: string, value: string) => void): () => any;
         observeAttributes(attrs: string[], cb: (attrName: string, value: string) => void): () => void;
-        "__#12331@#isInit": boolean;
-        "__#12330@#logger": Logger;
-        "__#12330@#wrapLogger": ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger);
+        "__#12360@#isInit": boolean;
+        "__#12359@#logger": Logger;
+        "__#12359@#wrapLogger": ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger);
         get logger(): Logger;
         set logger(logger: Partial<Logger>);
         onLogEvent: ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void);
@@ -2219,7 +2219,7 @@ declare const modalMixin: <T extends CustomElementConstructor>(superclass: T) =>
 
 declare const notificationsMixin: <T extends CustomElementConstructor>(superclass: T) => {
     new (...params: any[]): {
-        "__#12342@#NotificationDriverWrapper": {
+        "__#12371@#NotificationDriverWrapper": {
             new (refOrRefFn: Element | (() => HTMLElement), config: {
                 logger: {
                     error(...data: any[]): void;
@@ -2233,7 +2233,7 @@ declare const notificationsMixin: <T extends CustomElementConstructor>(superclas
                 close(): void;
                 show(): void;
                 remove(): void;
-                "__#12338@#private": any;
+                "__#12367@#private": any;
                 logger: {
                     error(...data: any[]): void;
                     warn(...data: any[]): void;
@@ -2259,7 +2259,7 @@ declare const notificationsMixin: <T extends CustomElementConstructor>(superclas
             close(): void;
             show(): void;
             remove(): void;
-            "__#12338@#private": any;
+            "__#12367@#private": any;
             logger: {
                 error(...data: any[]): void;
                 warn(...data: any[]): void;
@@ -2270,21 +2270,21 @@ declare const notificationsMixin: <T extends CustomElementConstructor>(superclas
             readonly ele: Element;
         };
         init(): Promise<void>;
-        "__#12337@#errorCbsSym": symbol;
-        "__#12337@#loadCbsSym": symbol;
-        "__#12337@#getComponentsVersion"(): Promise<any>;
-        "__#12337@#exposeAlternateEvents"(scriptEle: HTMLScriptElement): void;
-        "__#12337@#handleFallbackScript"(errorCbs: ((error: string) => void)[], loadCbs: (() => void)[], elemId: string, scriptUrl: string): Promise<void>;
-        "__#12337@#registerEvents"(scriptEle: HTMLScriptElement): void;
-        "__#12337@#getDescopeUiLoadingScript"(): Promise<HTMLElement>;
-        "__#12337@#descopeUi": Promise<any>;
+        "__#12366@#errorCbsSym": symbol;
+        "__#12366@#loadCbsSym": symbol;
+        "__#12366@#getComponentsVersion"(): Promise<any>;
+        "__#12366@#exposeAlternateEvents"(scriptEle: HTMLScriptElement): void;
+        "__#12366@#handleFallbackScript"(errorCbs: ((error: string) => void)[], loadCbs: (() => void)[], elemId: string, scriptUrl: string): Promise<void>;
+        "__#12366@#registerEvents"(scriptEle: HTMLScriptElement): void;
+        "__#12366@#getDescopeUiLoadingScript"(): Promise<HTMLElement>;
+        "__#12366@#descopeUi": Promise<any>;
         readonly descopeUi: Promise<any>;
-        "__#12337@#loadDescopeUiComponent"(componentName: string): Promise<any>;
+        "__#12366@#loadDescopeUiComponent"(componentName: string): Promise<any>;
         loadDescopeUiComponents(templateOrComponentNames: HTMLTemplateElement | string[]): Promise<any[]>;
-        "__#12337@#getDescopeUi"(): Promise<unknown>;
+        "__#12366@#getDescopeUi"(): Promise<unknown>;
         readonly config: any;
-        "__#12334@#_configResource": any;
-        "__#12334@#fetchConfig": () => Promise<{
+        "__#12363@#_configResource": any;
+        "__#12363@#fetchConfig": () => Promise<{
             projectConfig: ProjectConfiguration;
             executionContext: {
                 geo: string;
@@ -2623,13 +2623,13 @@ declare const notificationsMixin: <T extends CustomElementConstructor>(superclas
         blur(): void;
         focus(options?: FocusOptions): void;
         readonly projectId: string;
-        "__#12333@#handleError"(attrName: string, newValue: string): void;
-        "__#12332@#observeMappings": {};
+        "__#12362@#handleError"(attrName: string, newValue: string): void;
+        "__#12361@#observeMappings": {};
         observeAttribute(attrName: string, onAttrChange: (attrName: string, value: string) => void): () => any;
         observeAttributes(attrs: string[], cb: (attrName: string, value: string) => void): () => void;
-        "__#12331@#isInit": boolean;
-        "__#12330@#logger": Logger;
-        "__#12330@#wrapLogger": ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger);
+        "__#12360@#isInit": boolean;
+        "__#12359@#logger": Logger;
+        "__#12359@#wrapLogger": ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger);
         get logger(): Logger;
         set logger(logger: Partial<Logger>);
         onLogEvent: ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void);
@@ -2641,11 +2641,11 @@ declare const notificationsMixin: <T extends CustomElementConstructor>(superclas
 type OnAttrChange = (attrName: string, value: string | null) => void;
 declare const observeAttributesMixin: <T extends CustomElementConstructor>(superclass: T) => {
     new (...params: any[]): {
-        "__#12332@#observeMappings": {};
+        "__#12361@#observeMappings": {};
         init(): Promise<void>;
         observeAttribute(attrName: string, onAttrChange: OnAttrChange): () => any;
         observeAttributes(attrs: string[], cb: OnAttrChange): () => void;
-        "__#12331@#isInit": boolean;
+        "__#12360@#isInit": boolean;
         connectedCallback: (() => void) & (() => void);
         accessKey: string;
         readonly accessKeyLabel: string;
@@ -2972,8 +2972,8 @@ declare const observeAttributesMixin: <T extends CustomElementConstructor>(super
         tabIndex: number;
         blur(): void;
         focus(options?: FocusOptions): void;
-        "__#12330@#logger": Logger;
-        "__#12330@#wrapLogger"(logger: Partial<Logger>): Logger;
+        "__#12359@#logger": Logger;
+        "__#12359@#wrapLogger"(logger: Partial<Logger>): Logger;
         get logger(): Logger;
         set logger(logger: Partial<Logger>);
         onLogEvent(logLevel: "error" | "warn" | "info" | "debug", data: any[]): void;
@@ -3322,14 +3322,14 @@ declare const staticResourcesMixin: <T extends CustomElementConstructor>(supercl
         blur(): void;
         focus(options?: FocusOptions): void;
         readonly projectId: string;
-        "__#12333@#handleError"(attrName: string, newValue: string): void;
+        "__#12362@#handleError"(attrName: string, newValue: string): void;
         init(): Promise<void>;
-        "__#12332@#observeMappings": {};
+        "__#12361@#observeMappings": {};
         observeAttribute(attrName: string, onAttrChange: (attrName: string, value: string) => void): () => any;
         observeAttributes(attrs: string[], cb: (attrName: string, value: string) => void): () => void;
-        "__#12331@#isInit": boolean;
-        "__#12330@#logger": Logger;
-        "__#12330@#wrapLogger": ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger);
+        "__#12360@#isInit": boolean;
+        "__#12359@#logger": Logger;
+        "__#12359@#wrapLogger": ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger);
         get logger(): Logger;
         set logger(logger: Partial<Logger>);
         onLogEvent: ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void);
@@ -3339,24 +3339,27 @@ declare const staticResourcesMixin: <T extends CustomElementConstructor>(supercl
 type ThemeOptions = 'light' | 'dark' | 'os';
 declare const themeMixin: <T extends CustomElementConstructor>(superclass: T) => {
     new (...params: any[]): {
-        "__#12343@#globalStyleTag": HTMLStyleElement;
+        "__#12372@#globalStyleTag": HTMLStyleElement;
         readonly theme: ThemeOptions;
         readonly styleId: string;
-        "__#12343@#_themeResource": Promise<void | Record<string, any>>;
-        "__#12343@#fetchTheme"(): Promise<Record<string, any>>;
-        readonly "__#12343@#themeResource": Promise<void | Record<string, any>>;
-        "__#12343@#loadGlobalStyle"(): Promise<void>;
-        "__#12343@#loadComponentsStyle"(): Promise<void>;
-        "__#12343@#getFontsConfig"(): Promise<Record<string, {
+        "__#12372@#_themeResource": Promise<void | Record<string, any>>;
+        "__#12372@#fetchTheme"(): Promise<Record<string, any>>;
+        readonly "__#12372@#themeResource": Promise<void | Record<string, any>>;
+        "__#12372@#loadGlobalStyle"(): Promise<void>;
+        "__#12372@#loadComponentsStyle"(): Promise<void>;
+        "__#12372@#getFontsConfig"(): Promise<Record<string, {
             url?: string;
         }>>;
-        "__#12343@#loadFonts"(): Promise<void>;
-        "__#12343@#applyTheme"(): Promise<void>;
+        "__#12372@#loadFonts"(): Promise<void>;
+        "__#12372@#applyTheme"(): Promise<void>;
+        "__#12372@#onThemeChange": () => void;
+        "__#12372@#loadTheme"(): void;
+        "__#12372@#toggleOsThemeChangeListener": (listen: boolean) => void;
         init(): Promise<void>;
-        "__#12332@#observeMappings": {} & {} & {} & {} & {};
+        "__#12361@#observeMappings": {} & {} & {} & {} & {};
         observeAttribute: ((attrName: string, onAttrChange: (attrName: string, value: string) => void) => () => any) & ((attrName: string, onAttrChange: (attrName: string, value: string) => void) => () => any) & ((attrName: string, onAttrChange: (attrName: string, value: string) => void) => () => any) & ((attrName: string, onAttrChange: (attrName: string, value: string) => void) => () => any) & ((attrName: string, onAttrChange: (attrName: string, value: string) => void) => () => any);
         observeAttributes: ((attrs: string[], cb: (attrName: string, value: string) => void) => () => void) & ((attrs: string[], cb: (attrName: string, value: string) => void) => () => void) & ((attrs: string[], cb: (attrName: string, value: string) => void) => () => void) & ((attrs: string[], cb: (attrName: string, value: string) => void) => () => void) & ((attrs: string[], cb: (attrName: string, value: string) => void) => () => void);
-        "__#12331@#isInit": boolean;
+        "__#12360@#isInit": boolean;
         connectedCallback: (() => void) & (() => void) & (() => void) & (() => void) & (() => void) & (() => void) & (() => void) & (() => void) & (() => void) & (() => void) & (() => void);
         accessKey: string;
         readonly accessKeyLabel: string;
@@ -3683,16 +3686,16 @@ declare const themeMixin: <T extends CustomElementConstructor>(superclass: T) =>
         tabIndex: number;
         blur(): void;
         focus(options?: FocusOptions): void;
-        "__#12330@#logger": Logger;
-        "__#12330@#wrapLogger": ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger);
+        "__#12359@#logger": Logger;
+        "__#12359@#wrapLogger": ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger);
         get logger(): Logger;
         set logger(logger: Partial<Logger>);
         onLogEvent: ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void);
         contentRootElement: HTMLElement;
         rootElement: HTMLElement;
         readonly config: any;
-        "__#12334@#_configResource": any;
-        "__#12334@#fetchConfig": (() => Promise<{
+        "__#12363@#_configResource": any;
+        "__#12363@#fetchConfig": (() => Promise<{
             projectConfig: ProjectConfiguration;
             executionContext: {
                 geo: string;
@@ -3716,19 +3719,19 @@ declare const themeMixin: <T extends CustomElementConstructor>(superclass: T) =>
         readonly baseStaticUrl: string;
         readonly baseUrl: string;
         readonly projectId: string;
-        "__#12333@#handleError": ((attrName: string, newValue: string) => void) & ((attrName: string, newValue: string) => void) & ((attrName: string, newValue: string) => void) & ((attrName: string, newValue: string) => void);
-        "__#12337@#errorCbsSym": symbol;
-        "__#12337@#loadCbsSym": symbol;
-        "__#12337@#getComponentsVersion"(): Promise<any>;
-        "__#12337@#exposeAlternateEvents"(scriptEle: HTMLScriptElement): void;
-        "__#12337@#handleFallbackScript"(errorCbs: ((error: string) => void)[], loadCbs: (() => void)[], elemId: string, scriptUrl: string): Promise<void>;
-        "__#12337@#registerEvents"(scriptEle: HTMLScriptElement): void;
-        "__#12337@#getDescopeUiLoadingScript"(): Promise<HTMLElement>;
-        "__#12337@#descopeUi": Promise<any>;
+        "__#12362@#handleError": ((attrName: string, newValue: string) => void) & ((attrName: string, newValue: string) => void) & ((attrName: string, newValue: string) => void) & ((attrName: string, newValue: string) => void);
+        "__#12366@#errorCbsSym": symbol;
+        "__#12366@#loadCbsSym": symbol;
+        "__#12366@#getComponentsVersion"(): Promise<any>;
+        "__#12366@#exposeAlternateEvents"(scriptEle: HTMLScriptElement): void;
+        "__#12366@#handleFallbackScript"(errorCbs: ((error: string) => void)[], loadCbs: (() => void)[], elemId: string, scriptUrl: string): Promise<void>;
+        "__#12366@#registerEvents"(scriptEle: HTMLScriptElement): void;
+        "__#12366@#getDescopeUiLoadingScript"(): Promise<HTMLElement>;
+        "__#12366@#descopeUi": Promise<any>;
         readonly descopeUi: Promise<any>;
-        "__#12337@#loadDescopeUiComponent"(componentName: string): Promise<any>;
+        "__#12366@#loadDescopeUiComponent"(componentName: string): Promise<any>;
         loadDescopeUiComponents(templateOrComponentNames: HTMLTemplateElement | string[]): Promise<any[]>;
-        "__#12337@#getDescopeUi"(): Promise<unknown>;
+        "__#12366@#getDescopeUi"(): Promise<unknown>;
     };
 } & T;
 
@@ -3738,8 +3741,8 @@ declare const createStateManagementMixin: <State, CaseReducers extends SliceCase
     new (...args: any): {
         actions: _reduxjs_toolkit.CaseReducerActions<CaseReducers, Name> & AsyncActions;
         subscribe: <SelectorR = State extends Draft<infer S> ? S : State>(cb: (state: SelectorR) => void, selector?: (state: State) => SelectorR) => Unsubscribe;
-        "__#12330@#logger": Logger;
-        "__#12330@#wrapLogger"(logger: Partial<Logger>): Logger;
+        "__#12359@#logger": Logger;
+        "__#12359@#wrapLogger"(logger: Partial<Logger>): Logger;
         get logger(): Logger;
         set logger(logger: Partial<Logger>);
         onLogEvent(logLevel: "error" | "warn" | "info" | "debug", data: any[]): void;
@@ -4083,8 +4086,8 @@ declare const formMixin: <T extends CustomElementConstructor>(superclass: T) =>
         getFormFieldNames(rootEle: ElementOrEmpty): string[];
         disableFormField(rootEle: ElementOrEmpty, name: string): void;
         removeFormField(rootEle: ElementOrEmpty, name: string): void;
-        "__#12330@#logger": Logger;
-        "__#12330@#wrapLogger"(logger: Partial<Logger>): Logger;
+        "__#12359@#logger": Logger;
+        "__#12359@#wrapLogger"(logger: Partial<Logger>): Logger;
         get logger(): Logger;
         set logger(logger: Partial<Logger>);
         onLogEvent(logLevel: "error" | "warn" | "info" | "debug", data: any[]): void;
@@ -4752,7 +4755,7 @@ declare const initElementMixin: <T extends CustomElementConstructor>(superclass:
 
 declare const initLifecycleMixin: <T extends CustomElementConstructor>(superclass: T) => {
     new (...params: any[]): {
-        "__#12331@#isInit": boolean;
+        "__#12360@#isInit": boolean;
         connectedCallback(): void;
         init(): Promise<void>;
         accessKey: string;
@@ -5086,12 +5089,12 @@ declare const initLifecycleMixin: <T extends CustomElementConstructor>(superclas
 declare const projectIdMixin: <T extends CustomElementConstructor>(superclass: T) => {
     new (...args: any): {
         readonly projectId: string;
-        "__#12333@#handleError"(attrName: string, newValue: string): void;
+        "__#12362@#handleError"(attrName: string, newValue: string): void;
         init(): Promise<void>;
-        "__#12332@#observeMappings": {};
+        "__#12361@#observeMappings": {};
         observeAttribute(attrName: string, onAttrChange: (attrName: string, value: string) => void): () => any;
         observeAttributes(attrs: string[], cb: (attrName: string, value: string) => void): () => void;
-        "__#12331@#isInit": boolean;
+        "__#12360@#isInit": boolean;
         connectedCallback: (() => void) & (() => void) & (() => void);
         accessKey: string;
         readonly accessKeyLabel: string;
@@ -5418,8 +5421,8 @@ declare const projectIdMixin: <T extends CustomElementConstructor>(superclass: T
         tabIndex: number;
         blur(): void;
         focus(options?: FocusOptions): void;
-        "__#12330@#logger": Logger;
-        "__#12330@#wrapLogger": ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger);
+        "__#12359@#logger": Logger;
+        "__#12359@#wrapLogger": ((logger: Partial<Logger>) => Logger) & ((logger: Partial<Logger>) => Logger);
         get logger(): Logger;
         set logger(logger: Partial<Logger>);
         onLogEvent: ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void) & ((logLevel: "error" | "warn" | "info" | "debug", data: any[]) => void);

package/dist/index.esm.js

@@ -618,7 +618,7 @@ const themeValidation = (_, theme) => (theme || false) &&
     theme !== 'dark' &&
     'Supported theme values are "light", "dark", or leave empty for using the OS theme';
 const themeMixin = createSingletonMixin((superclass) => {
-    var _ThemeMixinClass_instances, _ThemeMixinClass_globalStyleTag, _ThemeMixinClass__themeResource, _ThemeMixinClass_fetchTheme, _ThemeMixinClass_themeResource_get, _ThemeMixinClass_loadGlobalStyle, _ThemeMixinClass_loadComponentsStyle, _ThemeMixinClass_getFontsConfig, _ThemeMixinClass_loadFonts, _ThemeMixinClass_applyTheme, _a;
+    var _ThemeMixinClass_instances, _ThemeMixinClass_globalStyleTag, _ThemeMixinClass__themeResource, _ThemeMixinClass_fetchTheme, _ThemeMixinClass_themeResource_get, _ThemeMixinClass_loadGlobalStyle, _ThemeMixinClass_loadComponentsStyle, _ThemeMixinClass_getFontsConfig, _ThemeMixinClass_loadFonts, _ThemeMixinClass_applyTheme, _ThemeMixinClass_onThemeChange, _ThemeMixinClass_loadTheme, _ThemeMixinClass_toggleOsThemeChangeListener, _a;
     const BaseClass = compose(createValidateAttributesMixin({ theme: themeValidation }), staticResourcesMixin, initLifecycleMixin, descopeUiMixin, configMixin, initElementMixin, observeAttributesMixin)(superclass);
     return _a = class ThemeMixinClass extends BaseClass {
             constructor() {
@@ -626,6 +626,17 @@ const themeMixin = createSingletonMixin((superclass) => {
                 _ThemeMixinClass_instances.add(this);
                 _ThemeMixinClass_globalStyleTag.set(this, void 0);
                 _ThemeMixinClass__themeResource.set(this, void 0);
+                _ThemeMixinClass_onThemeChange.set(this, () => {
+                    __classPrivateFieldGet(this, _ThemeMixinClass_instances, "m", _ThemeMixinClass_loadTheme).call(this);
+                    __classPrivateFieldGet(this, _ThemeMixinClass_toggleOsThemeChangeListener, "f").call(this, this.getAttribute('theme') === 'os');
+                });
+                // add or remove os theme change listener
+                _ThemeMixinClass_toggleOsThemeChangeListener.set(this, (listen) => {
+                    var _b, _c, _d;
+                    const method = listen ? 'addEventListener' : 'removeEventListener';
+                    (_d = (_c = (_b = window
+                        .matchMedia) === null || _b === void 0 ? void 0 : _b.call(window, '(prefers-color-scheme: dark)')) === null || _c === void 0 ? void 0 : _c[method]) === null || _d === void 0 ? void 0 : _d.call(_c, 'change', () => __classPrivateFieldGet(this, _ThemeMixinClass_instances, "m", _ThemeMixinClass_loadTheme).call(this));
+                });
             }
             get theme() {
                 var _b, _c;
@@ -645,12 +656,8 @@ const themeMixin = createSingletonMixin((superclass) => {
                 await ((_b = super.init) === null || _b === void 0 ? void 0 : _b.call(this));
                 __classPrivateFieldGet(this, _ThemeMixinClass_instances, "m", _ThemeMixinClass_loadGlobalStyle).call(this);
                 __classPrivateFieldGet(this, _ThemeMixinClass_instances, "m", _ThemeMixinClass_loadComponentsStyle).call(this);
-                __classPrivateFieldGet(this, _ThemeMixinClass_instances, "m", _ThemeMixinClass_loadFonts).call(this);
-                __classPrivateFieldGet(this, _ThemeMixinClass_instances, "m", _ThemeMixinClass_applyTheme).call(this);
-                this.observeAttributes(['theme'], () => {
-                    __classPrivateFieldGet(this, _ThemeMixinClass_instances, "m", _ThemeMixinClass_loadFonts).call(this);
-                    __classPrivateFieldGet(this, _ThemeMixinClass_instances, "m", _ThemeMixinClass_applyTheme).call(this);
-                });
+                __classPrivateFieldGet(this, _ThemeMixinClass_onThemeChange, "f").call(this);
+                this.observeAttributes(['theme'], __classPrivateFieldGet(this, _ThemeMixinClass_onThemeChange, "f"));
                 this.observeAttributes(['style-id'], () => {
                     __classPrivateFieldSet(this, _ThemeMixinClass__themeResource, null, "f");
                     __classPrivateFieldGet(this, _ThemeMixinClass_instances, "m", _ThemeMixinClass_loadFonts).call(this);
@@ -661,6 +668,8 @@ const themeMixin = createSingletonMixin((superclass) => {
         },
         _ThemeMixinClass_globalStyleTag = new WeakMap(),
         _ThemeMixinClass__themeResource = new WeakMap(),
+        _ThemeMixinClass_onThemeChange = new WeakMap(),
+        _ThemeMixinClass_toggleOsThemeChangeListener = new WeakMap(),
         _ThemeMixinClass_instances = new WeakSet(),
         _ThemeMixinClass_fetchTheme = async function _ThemeMixinClass_fetchTheme() {
             try {
@@ -756,6 +765,10 @@ const themeMixin = createSingletonMixin((superclass) => {
                 descopeUi.componentsThemeManager.currentThemeName = this.theme;
             }
         },
+        _ThemeMixinClass_loadTheme = function _ThemeMixinClass_loadTheme() {
+            __classPrivateFieldGet(this, _ThemeMixinClass_instances, "m", _ThemeMixinClass_loadFonts).call(this);
+            __classPrivateFieldGet(this, _ThemeMixinClass_instances, "m", _ThemeMixinClass_applyTheme).call(this);
+        },
         _a;
 });