@descope/sdk-mixins 0.0.0-next-cd745c61-20250421 → 0.0.0-next-bd24a0f1-20250505

package/dist/cjs/constants.js

@@ -0,0 +1,6 @@
+'use strict';
+
+const IS_LOCAL_STORAGE = typeof localStorage !== 'undefined';
+
+exports.IS_LOCAL_STORAGE = IS_LOCAL_STORAGE;
+//# sourceMappingURL=constants.js.map

package/dist/cjs/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../src/constants.ts"],"sourcesContent":["export const IS_LOCAL_STORAGE = typeof localStorage !== 'undefined';\n"],"names":[],"mappings":";;MAAa,gBAAgB,GAAG,OAAO,YAAY,KAAK;;;;"}

package/dist/cjs/index.js

@@ -0,0 +1,43 @@
+'use strict';
+
+var configMixin = require('./mixins/configMixin/configMixin.js');
+var createValidateAttributesMixin = require('./mixins/createValidateAttributesMixin/createValidateAttributesMixin.js');
+var debuggerMixin = require('./mixins/debuggerMixin/debuggerMixin.js');
+var descopeUiMixin = require('./mixins/descopeUiMixin/descopeUiMixin.js');
+var loggerMixin = require('./mixins/loggerMixin/loggerMixin.js');
+var modalMixin = require('./mixins/modalMixin/modalMixin.js');
+var notificationsMixin = require('./mixins/notificationsMixin/notificationsMixin.js');
+var observeAttributesMixin = require('./mixins/observeAttributesMixin/observeAttributesMixin.js');
+var staticResourcesMixin = require('./mixins/staticResourcesMixin/staticResourcesMixin.js');
+var themeMixin = require('./mixins/themeMixin/themeMixin.js');
+var createStateManagementMixin = require('./mixins/createStateManagementMixin.js');
+var formMixin = require('./mixins/formMixin.js');
+var initElementMixin = require('./mixins/initElementMixin.js');
+var initLifecycleMixin = require('./mixins/initLifecycleMixin.js');
+var projectIdMixin = require('./mixins/projectIdMixin.js');
+var baseUrlMixin = require('./mixins/baseUrlMixin.js');
+var cookieConfigMixin = require('./mixins/cookieConfigMixin.js');
+var injectNpmLibMixin = require('./mixins/injectNpmLibMixin/injectNpmLibMixin.js');
+
+
+
+exports.configMixin = configMixin.configMixin;
+exports.createValidateAttributesMixin = createValidateAttributesMixin.createValidateAttributesMixin;
+exports.debuggerMixin = debuggerMixin.debuggerMixin;
+exports.descopeUiMixin = descopeUiMixin.descopeUiMixin;
+exports.loggerMixin = loggerMixin.loggerMixin;
+exports.modalMixin = modalMixin.modalMixin;
+exports.notificationsMixin = notificationsMixin.notificationsMixin;
+exports.observeAttributesMixin = observeAttributesMixin.observeAttributesMixin;
+exports.getResourceUrl = staticResourcesMixin.getResourceUrl;
+exports.staticResourcesMixin = staticResourcesMixin.staticResourcesMixin;
+exports.themeMixin = themeMixin.themeMixin;
+exports.createStateManagementMixin = createStateManagementMixin.createStateManagementMixin;
+exports.formMixin = formMixin.formMixin;
+exports.initElementMixin = initElementMixin.initElementMixin;
+exports.initLifecycleMixin = initLifecycleMixin.initLifecycleMixin;
+exports.projectIdMixin = projectIdMixin.projectIdMixin;
+exports.baseUrlMixin = baseUrlMixin.baseUrlMixin;
+exports.cookieConfigMixin = cookieConfigMixin.cookieConfigMixin;
+exports.injectNpmLibMixin = injectNpmLibMixin.injectNpmLibMixin;
+//# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/mixins/baseUrlMixin.js

@@ -0,0 +1,14 @@
+'use strict';
+
+var sdkHelpers = require('@descope/sdk-helpers');
+
+const baseUrlMixin = sdkHelpers.createSingletonMixin((superclass) => {
+    return class BaseUrlMixinClass extends superclass {
+        get baseUrl() {
+            return this.getAttribute('base-url') || '';
+        }
+    };
+});
+
+exports.baseUrlMixin = baseUrlMixin;
+//# sourceMappingURL=baseUrlMixin.js.map

package/dist/cjs/mixins/baseUrlMixin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"baseUrlMixin.js","sources":["../../../src/mixins/baseUrlMixin.ts"],"sourcesContent":["import { createSingletonMixin } from '@descope/sdk-helpers';\n\nexport const baseUrlMixin = createSingletonMixin(\n  <T extends CustomElementConstructor>(superclass: T) => {\n    return class BaseUrlMixinClass extends superclass {\n      get baseUrl() {\n        return this.getAttribute('base-url') || '';\n      }\n    };\n  },\n);\n"],"names":["createSingletonMixin"],"mappings":";;;;MAEa,YAAY,GAAGA,+BAAoB,CAC9C,CAAqC,UAAa,KAAI;IACpD,OAAO,MAAM,iBAAkB,SAAQ,UAAU,CAAA;AAC/C,QAAA,IAAI,OAAO,GAAA;YACT,OAAO,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;SAC5C;KACF,CAAC;AACJ,CAAC;;;;"}

package/dist/cjs/mixins/configMixin/configMixin.js

@@ -0,0 +1,53 @@
+'use strict';
+
+var tslib = require('tslib');
+var sdkHelpers = require('@descope/sdk-helpers');
+var staticResourcesMixin = require('../staticResourcesMixin/staticResourcesMixin.js');
+var constants = require('./constants.js');
+var resetMixin = require('../resetMixin.js');
+var initLifecycleMixin = require('../initLifecycleMixin.js');
+
+const configMixin = sdkHelpers.createSingletonMixin((superclass) => {
+    var _ConfigMixinClass_instances, _ConfigMixinClass_configCacheClear, _ConfigMixinClass__configResource, _ConfigMixinClass_fetchConfig, _a;
+    const BaseClass = sdkHelpers.compose(staticResourcesMixin.staticResourcesMixin, resetMixin.resetMixin, initLifecycleMixin.initLifecycleMixin)(superclass);
+    return _a = class ConfigMixinClass extends BaseClass {
+            constructor() {
+                super(...arguments);
+                _ConfigMixinClass_instances.add(this);
+                _ConfigMixinClass__configResource.set(this, void 0);
+                _ConfigMixinClass_fetchConfig.set(this, async () => {
+                    try {
+                        const { body, headers, } = await this.fetchStaticResource(constants.CONFIG_FILENAME, 'json');
+                        return {
+                            projectConfig: body,
+                            executionContext: { geo: headers['x-geo'] },
+                        };
+                    }
+                    catch (e) {
+                        this.logger.error('Cannot fetch config file', 'make sure that your projectId & flowId are correct');
+                    }
+                    return undefined;
+                });
+            }
+            async init() {
+                await super.init();
+                this.onReset('config', tslib.__classPrivateFieldGet(this, _ConfigMixinClass_instances, "m", _ConfigMixinClass_configCacheClear).bind(this));
+            }
+            get config() {
+                if (!tslib.__classPrivateFieldGet(this, _ConfigMixinClass__configResource, "f")) {
+                    tslib.__classPrivateFieldSet(this, _ConfigMixinClass__configResource, tslib.__classPrivateFieldGet(this, _ConfigMixinClass_fetchConfig, "f").call(this), "f");
+                }
+                return tslib.__classPrivateFieldGet(this, _ConfigMixinClass__configResource, "f");
+            }
+        },
+        _ConfigMixinClass__configResource = new WeakMap(),
+        _ConfigMixinClass_fetchConfig = new WeakMap(),
+        _ConfigMixinClass_instances = new WeakSet(),
+        _ConfigMixinClass_configCacheClear = function _ConfigMixinClass_configCacheClear() {
+            tslib.__classPrivateFieldSet(this, _ConfigMixinClass__configResource, undefined, "f");
+        },
+        _a;
+});
+
+exports.configMixin = configMixin;
+//# sourceMappingURL=configMixin.js.map

package/dist/cjs/mixins/configMixin/configMixin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"configMixin.js","sources":["../../../../src/mixins/configMixin/configMixin.ts"],"sourcesContent":["/* eslint-disable no-underscore-dangle */\nimport { compose, createSingletonMixin } from '@descope/sdk-helpers';\nimport { staticResourcesMixin } from '../staticResourcesMixin';\nimport { CONFIG_FILENAME } from './constants';\nimport { Config, ProjectConfiguration } from './types';\nimport { resetMixin } from '../resetMixin';\nimport { initLifecycleMixin } from '../initLifecycleMixin';\n\nexport const configMixin = createSingletonMixin(\n  <T extends CustomElementConstructor>(superclass: T) => {\n    const BaseClass = compose(\n      staticResourcesMixin,\n      resetMixin,\n      initLifecycleMixin,\n    )(superclass);\n\n    return class ConfigMixinClass extends BaseClass {\n      async init() {\n        await super.init();\n        this.onReset('config', this.#configCacheClear.bind(this));\n      }\n\n      get config() {\n        if (!this.#_configResource) {\n          this.#_configResource = this.#fetchConfig();\n        }\n\n        return this.#_configResource;\n      }\n\n      #configCacheClear() {\n        this.#_configResource = undefined;\n      }\n\n      #_configResource: Promise<Config>;\n\n      #fetchConfig: () => Promise<Config> = async () => {\n        try {\n          const {\n            body,\n            headers,\n          }: { body: ProjectConfiguration; headers: Record<string, any> } =\n            await (<any>this.fetchStaticResource(CONFIG_FILENAME, 'json'));\n          return {\n            projectConfig: body as ProjectConfiguration,\n            executionContext: { geo: headers['x-geo'] },\n          };\n        } catch (e) {\n          this.logger.error(\n            'Cannot fetch config file',\n            'make sure that your projectId & flowId are correct',\n          );\n        }\n\n        return undefined;\n      };\n    };\n  },\n);\n"],"names":["createSingletonMixin","compose","staticResourcesMixin","resetMixin","initLifecycleMixin","CONFIG_FILENAME","__classPrivateFieldGet","__classPrivateFieldSet"],"mappings":";;;;;;;;;MAQa,WAAW,GAAGA,+BAAoB,CAC7C,CAAqC,UAAa,KAAI;;AACpD,IAAA,MAAM,SAAS,GAAGC,kBAAO,CACvBC,yCAAoB,EACpBC,qBAAU,EACVC,qCAAkB,CACnB,CAAC,UAAU,CAAC,CAAC;IAEd,OAAO,EAAA,GAAA,MAAM,gBAAiB,SAAQ,SAAS,CAAA;AAAxC,YAAA,WAAA,GAAA;;;gBAkBL,iCAAkC,CAAA,GAAA,CAAA,IAAA,EAAA,KAAA,CAAA,CAAA,CAAA;gBAElC,6BAAsC,CAAA,GAAA,CAAA,IAAA,EAAA,YAAW;AAC/C,oBAAA,IAAI;AACF,wBAAA,MAAM,EACJ,IAAI,EACJ,OAAO,GACR,GACC,MAAY,IAAI,CAAC,mBAAmB,CAACC,yBAAe,EAAE,MAAM,CAAE,CAAC;wBACjE,OAAO;AACL,4BAAA,aAAa,EAAE,IAA4B;4BAC3C,gBAAgB,EAAE,EAAE,GAAG,EAAE,OAAO,CAAC,OAAO,CAAC,EAAE;yBAC5C,CAAC;qBACH;oBAAC,OAAO,CAAC,EAAE;wBACV,IAAI,CAAC,MAAM,CAAC,KAAK,CACf,0BAA0B,EAC1B,oDAAoD,CACrD,CAAC;qBACH;AAED,oBAAA,OAAO,SAAS,CAAC;AACnB,iBAAC,CAAC,CAAA;aACH;AAvCC,YAAA,MAAM,IAAI,GAAA;AACR,gBAAA,MAAM,KAAK,CAAC,IAAI,EAAE,CAAC;AACnB,gBAAA,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAEC,4BAAA,CAAA,IAAI,EAAkB,2BAAA,EAAA,GAAA,EAAA,kCAAA,CAAA,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;aAC3D;AAED,YAAA,IAAI,MAAM,GAAA;AACR,gBAAA,IAAI,CAACA,4BAAA,CAAA,IAAI,EAAA,iCAAA,EAAA,GAAA,CAAiB,EAAE;oBAC1BC,4BAAA,CAAA,IAAI,qCAAoBD,4BAAA,CAAA,IAAI,qCAAa,CAAjB,IAAA,CAAA,IAAI,CAAe,EAAA,GAAA,CAAA,CAAC;iBAC7C;gBAED,OAAOA,4BAAA,CAAA,IAAI,EAAA,iCAAA,EAAA,GAAA,CAAiB,CAAC;aAC9B;AA4BF,SAAA;;;;;AAzBG,YAAAC,4BAAA,CAAA,IAAI,EAAA,iCAAA,EAAoB,SAAS,EAAA,GAAA,CAAA,CAAC;SACnC;AAwBD,QAAA,EAAA,CAAA;AACJ,CAAC;;;;"}

package/dist/cjs/mixins/configMixin/constants.js

@@ -0,0 +1,6 @@
+'use strict';
+
+const CONFIG_FILENAME = 'config.json';
+
+exports.CONFIG_FILENAME = CONFIG_FILENAME;
+//# sourceMappingURL=constants.js.map

package/dist/cjs/mixins/configMixin/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../../../src/mixins/configMixin/constants.ts"],"sourcesContent":["export const CONFIG_FILENAME = 'config.json';\n"],"names":[],"mappings":";;AAAO,MAAM,eAAe,GAAG;;;;"}

package/dist/cjs/mixins/cookieConfigMixin.js

@@ -0,0 +1,14 @@
+'use strict';
+
+var sdkHelpers = require('@descope/sdk-helpers');
+
+const cookieConfigMixin = sdkHelpers.createSingletonMixin((superclass) => {
+    return class CookieConfigMixinClass extends superclass {
+        get refreshCookieName() {
+            return this.getAttribute('refresh-cookie-name') || '';
+        }
+    };
+});
+
+exports.cookieConfigMixin = cookieConfigMixin;
+//# sourceMappingURL=cookieConfigMixin.js.map

package/dist/cjs/mixins/cookieConfigMixin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cookieConfigMixin.js","sources":["../../../src/mixins/cookieConfigMixin.ts"],"sourcesContent":["import { createSingletonMixin } from '@descope/sdk-helpers';\n\nexport const cookieConfigMixin = createSingletonMixin(\n  <T extends CustomElementConstructor>(superclass: T) => {\n    return class CookieConfigMixinClass extends superclass {\n      get refreshCookieName() {\n        return this.getAttribute('refresh-cookie-name') || '';\n      }\n    };\n  },\n);\n"],"names":["createSingletonMixin"],"mappings":";;;;MAEa,iBAAiB,GAAGA,+BAAoB,CACnD,CAAqC,UAAa,KAAI;IACpD,OAAO,MAAM,sBAAuB,SAAQ,UAAU,CAAA;AACpD,QAAA,IAAI,iBAAiB,GAAA;YACnB,OAAO,IAAI,CAAC,YAAY,CAAC,qBAAqB,CAAC,IAAI,EAAE,CAAC;SACvD;KACF,CAAC;AACJ,CAAC;;;;"}

package/dist/cjs/mixins/createStateManagementMixin.js

@@ -0,0 +1,47 @@
+'use strict';
+
+var sdkHelpers = require('@descope/sdk-helpers');
+var toolkit = require('@reduxjs/toolkit');
+var loggerMixin = require('./loggerMixin/loggerMixin.js');
+
+/* eslint-disable no-param-reassign */
+const createStateManagementMixin = (options) => sdkHelpers.createSingletonMixin((superclass) => {
+    const slice = toolkit.createSlice(options);
+    const allActions = Object.assign(Object.assign({}, slice.actions), options.asyncActions);
+    return class StateManagementMixinClass extends sdkHelpers.compose(loggerMixin.loggerMixin)(superclass) {
+        constructor(...args) {
+            super(...args);
+            const store = toolkit.configureStore({
+                reducer: slice.reducer,
+                middleware: (getDefaultMiddleware) => getDefaultMiddleware({
+                    thunk: {
+                        extraArgument: this,
+                    },
+                    serializableCheck: false,
+                }),
+                // change to true if we want to debug redux
+                devTools: false,
+            });
+            const wrapAction = (action) => (async (...arg) => {
+                const result = await store.dispatch(action(...arg));
+                // we want to unwrap the result, so in case of an error we can log it
+                try {
+                    toolkit.unwrapResult(result);
+                }
+                catch (e) {
+                    this.logger.error(e.message, result.type, e.stack);
+                }
+                return result;
+            });
+            const actions = Object.keys(allActions).reduce((acc, actionName) => {
+                acc[actionName] = wrapAction(allActions[actionName]);
+                return acc;
+            }, {});
+            this.actions = actions;
+            this.subscribe = (cb, selector = (state) => state) => store.subscribe(() => cb(selector(store.getState())));
+        }
+    };
+});
+
+exports.createStateManagementMixin = createStateManagementMixin;
+//# sourceMappingURL=createStateManagementMixin.js.map

package/dist/cjs/mixins/createStateManagementMixin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createStateManagementMixin.js","sources":["../../../src/mixins/createStateManagementMixin.ts"],"sourcesContent":["/* eslint-disable no-param-reassign */\nimport { compose, createSingletonMixin } from '@descope/sdk-helpers';\nimport type {\n  CreateSliceOptions,\n  Draft,\n  SliceCaseReducers,\n  SliceSelectors,\n} from '@reduxjs/toolkit';\nimport { configureStore, createSlice, unwrapResult } from '@reduxjs/toolkit';\nimport type { Unsubscribe } from 'redux'; //  workaround for https://github.com/microsoft/TypeScript/issues/42873\nimport { loggerMixin } from './loggerMixin';\n\nexport const createStateManagementMixin = <\n  State,\n  CaseReducers extends SliceCaseReducers<State>,\n  Name extends string,\n  Selectors extends SliceSelectors<State>,\n  ReducerPath extends string = Name,\n  AsyncActions extends Record<string, any> = {},\n>(\n  options: CreateSliceOptions<\n    State,\n    CaseReducers,\n    Name,\n    ReducerPath,\n    Selectors\n  > & { asyncActions?: AsyncActions },\n) =>\n  createSingletonMixin(<T extends CustomElementConstructor>(superclass: T) => {\n    const slice = createSlice(options);\n\n    const allActions = { ...slice.actions, ...options.asyncActions };\n\n    return class StateManagementMixinClass extends compose(loggerMixin)(\n      superclass,\n    ) {\n      actions: typeof allActions;\n\n      subscribe: <SelectorR = State extends Draft<infer S> ? S : State>(\n        cb: (state: SelectorR) => void,\n        selector?: (state: State) => SelectorR,\n      ) => Unsubscribe;\n\n      constructor(...args: any) {\n        super(...args);\n\n        const store = configureStore({\n          reducer: slice.reducer,\n          middleware: (getDefaultMiddleware) =>\n            getDefaultMiddleware({\n              thunk: {\n                extraArgument: this,\n              },\n              serializableCheck: false,\n            }),\n          // change to true if we want to debug redux\n          devTools: false,\n        });\n\n        const wrapAction = <F extends (...args: any[]) => any>(action: F) =>\n          (async (...arg: any[]) => {\n            const result = await store.dispatch(action(...arg));\n\n            // we want to unwrap the result, so in case of an error we can log it\n            try {\n              unwrapResult(result);\n            } catch (e) {\n              this.logger.error(e.message, result.type, e.stack);\n            }\n\n            return result;\n          }) as F;\n\n        const actions = Object.keys(allActions).reduce((acc, actionName) => {\n          acc[actionName] = wrapAction(allActions[actionName]);\n\n          return acc;\n        }, {}) as typeof slice.actions & typeof options.asyncActions;\n\n        this.actions = actions;\n\n        this.subscribe = (cb, selector = (state) => state as any) =>\n          store.subscribe(() => cb(selector(store.getState())));\n      }\n    };\n  });\n"],"names":["createSingletonMixin","createSlice","compose","loggerMixin","configureStore","unwrapResult"],"mappings":";;;;;;AAAA;AAYO,MAAM,0BAA0B,GAAG,CAQxC,OAMmC,KAEnCA,+BAAoB,CAAC,CAAqC,UAAa,KAAI;AACzE,IAAA,MAAM,KAAK,GAAGC,mBAAW,CAAC,OAAO,CAAC,CAAC;IAEnC,MAAM,UAAU,GAAQ,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,KAAK,CAAC,OAAO,GAAK,OAAO,CAAC,YAAY,CAAE,CAAC;IAEjE,OAAO,MAAM,yBAA0B,SAAQC,kBAAO,CAACC,uBAAW,CAAC,CACjE,UAAU,CACX,CAAA;AAQC,QAAA,WAAA,CAAY,GAAG,IAAS,EAAA;AACtB,YAAA,KAAK,CAAC,GAAG,IAAI,CAAC,CAAC;YAEf,MAAM,KAAK,GAAGC,sBAAc,CAAC;gBAC3B,OAAO,EAAE,KAAK,CAAC,OAAO;AACtB,gBAAA,UAAU,EAAE,CAAC,oBAAoB,KAC/B,oBAAoB,CAAC;AACnB,oBAAA,KAAK,EAAE;AACL,wBAAA,aAAa,EAAE,IAAI;AACpB,qBAAA;AACD,oBAAA,iBAAiB,EAAE,KAAK;iBACzB,CAAC;;AAEJ,gBAAA,QAAQ,EAAE,KAAK;AAChB,aAAA,CAAC,CAAC;AAEH,YAAA,MAAM,UAAU,GAAG,CAAoC,MAAS,MAC7D,OAAO,GAAG,GAAU,KAAI;AACvB,gBAAA,MAAM,MAAM,GAAG,MAAM,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC;;AAGpD,gBAAA,IAAI;oBACFC,oBAAY,CAAC,MAAM,CAAC,CAAC;iBACtB;gBAAC,OAAO,CAAC,EAAE;AACV,oBAAA,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,EAAE,MAAM,CAAC,IAAI,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC;iBACpD;AAED,gBAAA,OAAO,MAAM,CAAC;AAChB,aAAC,CAAM,CAAC;AAEV,YAAA,MAAM,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,UAAU,KAAI;gBACjE,GAAG,CAAC,UAAU,CAAC,GAAG,UAAU,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC;AAErD,gBAAA,OAAO,GAAG,CAAC;aACZ,EAAE,EAAE,CAAuD,CAAC;AAE7D,YAAA,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;AAEvB,YAAA,IAAI,CAAC,SAAS,GAAG,CAAC,EAAE,EAAE,QAAA,GAAW,CAAC,KAAK,KAAK,KAAY,KACtD,KAAK,CAAC,SAAS,CAAC,MAAM,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAC;SACzD;KACF,CAAC;AACJ,CAAC;;;;"}

package/dist/cjs/mixins/createValidateAttributesMixin/commonValidators.js

@@ -0,0 +1,7 @@
+'use strict';
+
+const missingAttrValidator = (attrName, value) => !value &&
+    `${attrName} cannot be empty, please make sure to set this attribute`;
+
+exports.missingAttrValidator = missingAttrValidator;
+//# sourceMappingURL=commonValidators.js.map

package/dist/cjs/mixins/createValidateAttributesMixin/commonValidators.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"commonValidators.js","sources":["../../../../src/mixins/createValidateAttributesMixin/commonValidators.ts"],"sourcesContent":["export const missingAttrValidator = (attrName: string, value: string | null) =>\n  !value &&\n  `${attrName} cannot be empty, please make sure to set this attribute`;\n"],"names":[],"mappings":";;AAAO,MAAM,oBAAoB,GAAG,CAAC,QAAgB,EAAE,KAAoB,KACzE,CAAC,KAAK;IACN,CAAG,EAAA,QAAQ;;;;"}

package/dist/cjs/mixins/createValidateAttributesMixin/createValidateAttributesMixin.js

@@ -0,0 +1,40 @@
+'use strict';
+
+var tslib = require('tslib');
+var sdkHelpers = require('@descope/sdk-helpers');
+var observeAttributesMixin = require('../observeAttributesMixin/observeAttributesMixin.js');
+var initLifecycleMixin = require('../initLifecycleMixin.js');
+var loggerMixin = require('../loggerMixin/loggerMixin.js');
+var commonValidators = require('./commonValidators.js');
+
+const createValidateAttributesMixin = (mappings) => (superclass) => {
+    var _ValidateAttributesMixinClass_instances, _ValidateAttributesMixinClass_handleError, _a;
+    const BaseClass = sdkHelpers.compose(loggerMixin.loggerMixin, initLifecycleMixin.initLifecycleMixin, observeAttributesMixin.observeAttributesMixin)(superclass);
+    const mappingsNames = Object.keys(mappings);
+    return _a = class ValidateAttributesMixinClass extends BaseClass {
+            constructor(...args) {
+                super(...args);
+                _ValidateAttributesMixinClass_instances.add(this);
+                this.observeAttributes(mappingsNames, tslib.__classPrivateFieldGet(this, _ValidateAttributesMixinClass_instances, "m", _ValidateAttributesMixinClass_handleError).bind(this));
+            }
+            async init() {
+                var _b;
+                // check attributes initial values
+                mappingsNames.forEach((attr) => tslib.__classPrivateFieldGet(this, _ValidateAttributesMixinClass_instances, "m", _ValidateAttributesMixinClass_handleError).call(this, attr, this.getAttribute(attr)));
+                await ((_b = super.init) === null || _b === void 0 ? void 0 : _b.call(this));
+            }
+        },
+        _ValidateAttributesMixinClass_instances = new WeakSet(),
+        _ValidateAttributesMixinClass_handleError = function _ValidateAttributesMixinClass_handleError(attrName, newValue) {
+            const onError = mappings[attrName];
+            const error = typeof onError === 'function' ? onError(attrName, newValue) : onError;
+            if (error) {
+                this.logger.error(error);
+            }
+        },
+        _a;
+};
+createValidateAttributesMixin.missingAttrValidator = commonValidators.missingAttrValidator;
+
+exports.createValidateAttributesMixin = createValidateAttributesMixin;
+//# sourceMappingURL=createValidateAttributesMixin.js.map

package/dist/cjs/mixins/createValidateAttributesMixin/createValidateAttributesMixin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createValidateAttributesMixin.js","sources":["../../../../src/mixins/createValidateAttributesMixin/createValidateAttributesMixin.ts"],"sourcesContent":["import { compose } from '@descope/sdk-helpers';\nimport { observeAttributesMixin } from '../observeAttributesMixin';\nimport { initLifecycleMixin } from '../initLifecycleMixin';\nimport { loggerMixin } from '../loggerMixin';\nimport { missingAttrValidator } from './commonValidators';\n\nconst createValidateAttributesMixin =\n  (mappings: Record<string, CheckValueFn | string>) =>\n  <T extends CustomElementConstructor>(superclass: T) => {\n    const BaseClass = compose(\n      loggerMixin,\n      initLifecycleMixin,\n      observeAttributesMixin,\n    )(superclass);\n    const mappingsNames = Object.keys(mappings);\n\n    return class ValidateAttributesMixinClass extends BaseClass {\n      #handleError(attrName: string, newValue: string | null) {\n        const onError = mappings[attrName];\n\n        const error =\n          typeof onError === 'function' ? onError(attrName, newValue) : onError;\n\n        if (error) {\n          this.logger.error(error);\n        }\n      }\n\n      constructor(...args: any) {\n        super(...args);\n\n        this.observeAttributes(mappingsNames, this.#handleError.bind(this));\n      }\n\n      async init() {\n        // check attributes initial values\n        mappingsNames.forEach((attr) =>\n          this.#handleError(attr, this.getAttribute(attr)),\n        );\n        await super.init?.();\n      }\n    };\n  };\n\ncreateValidateAttributesMixin.missingAttrValidator = missingAttrValidator;\n\nexport type CheckValueFn = (\n  attrName: string,\n  value: string | null,\n) => false | string;\n\nexport { createValidateAttributesMixin };\n"],"names":["compose","loggerMixin","initLifecycleMixin","observeAttributesMixin","__classPrivateFieldGet","missingAttrValidator"],"mappings":";;;;;;;;;AAMM,MAAA,6BAA6B,GACjC,CAAC,QAA+C,KAChD,CAAqC,UAAa,KAAI;;AACpD,IAAA,MAAM,SAAS,GAAGA,kBAAO,CACvBC,uBAAW,EACXC,qCAAkB,EAClBC,6CAAsB,CACvB,CAAC,UAAU,CAAC,CAAC;IACd,MAAM,aAAa,GAAG,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IAE5C,OAAO,EAAA,GAAA,MAAM,4BAA6B,SAAQ,SAAS,CAAA;AAYzD,YAAA,WAAA,CAAY,GAAG,IAAS,EAAA;AACtB,gBAAA,KAAK,CAAC,GAAG,IAAI,CAAC,CAAC;;AAEf,gBAAA,IAAI,CAAC,iBAAiB,CAAC,aAAa,EAAEC,4BAAA,CAAA,IAAI,EAAa,uCAAA,EAAA,GAAA,EAAA,yCAAA,CAAA,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;aACrE;AAED,YAAA,MAAM,IAAI,GAAA;;;gBAER,aAAa,CAAC,OAAO,CAAC,CAAC,IAAI,KACzBA,4BAAA,CAAA,IAAI,EAAa,uCAAA,EAAA,GAAA,EAAA,yCAAA,CAAA,CAAA,IAAA,CAAjB,IAAI,EAAc,IAAI,EAAE,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC,CACjD,CAAC;AACF,gBAAA,OAAM,CAAA,EAAA,GAAA,KAAK,CAAC,IAAI,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,IAAA,CAAA,IAAA,CAAI,CAAA,CAAC;aACtB;AACF,SAAA;;AAxBc,QAAA,yCAAA,GAAA,SAAA,yCAAA,CAAA,QAAgB,EAAE,QAAuB,EAAA;AACpD,YAAA,MAAM,OAAO,GAAG,QAAQ,CAAC,QAAQ,CAAC,CAAC;AAEnC,YAAA,MAAM,KAAK,GACT,OAAO,OAAO,KAAK,UAAU,GAAG,OAAO,CAAC,QAAQ,EAAE,QAAQ,CAAC,GAAG,OAAO,CAAC;YAExE,IAAI,KAAK,EAAE;AACT,gBAAA,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;aAC1B;SACF;AAeD,QAAA,EAAA,CAAA;AACJ,EAAE;AAEJ,6BAA6B,CAAC,oBAAoB,GAAGC,qCAAoB;;;;"}

package/dist/cjs/mixins/debuggerMixin/debugger-wc.js

@@ -0,0 +1,237 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var sdkHelpers = require('@descope/sdk-helpers');
+var helpers = require('./helpers.js');
+
+var _Debugger_instances, _Debugger_messagesState, _Debugger_rootEle, _Debugger_contentEle, _Debugger_headerEle, _Debugger_eventsCbRefs, _Debugger_onNewMessages, _Debugger_renderMessages, _Debugger_setCollapsibleMessages, _Debugger_onWindowResize;
+const INITIAL_POS_THRESHOLD = 32;
+const INITIAL_WIDTH = 300;
+const INITIAL_HEIGHT = 200;
+const MIN_SIZE = 200;
+const template = document.createElement('template');
+template.innerHTML = `
+<div style="top:${INITIAL_POS_THRESHOLD}px; left:${window.innerWidth - INITIAL_WIDTH - INITIAL_POS_THRESHOLD}px;" class="debugger">
+  <div class="header">
+    <span>Debugger messages</span>
+  </div>
+  <div class="content">
+    <div class="empty-state">
+      No errors detected 👀
+    </div>
+  </div>
+</div>
+`;
+const icon = `<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.99984 13.167L8.99984 10.167L11.9998 13.167L13.1665 12.0003L10.1665 9.00033L13.1665 6.00033L11.9998 4.83366L8.99984 7.83366L5.99984 4.83366L4.83317 6.00033L7.83317 9.00033L4.83317 12.0003L5.99984 13.167ZM8.99984 17.3337C7.84706 17.3337 6.76373 17.1148 5.74984 16.677C4.73595 16.2398 3.854 15.6462 3.104 14.8962C2.354 14.1462 1.76039 13.2642 1.32317 12.2503C0.885393 11.2364 0.666504 10.1531 0.666504 9.00033C0.666504 7.84755 0.885393 6.76421 1.32317 5.75033C1.76039 4.73644 2.354 3.85449 3.104 3.10449C3.854 2.35449 4.73595 1.7606 5.74984 1.32283C6.76373 0.885603 7.84706 0.666992 8.99984 0.666992C10.1526 0.666992 11.2359 0.885603 12.2498 1.32283C13.2637 1.7606 14.1457 2.35449 14.8957 3.10449C15.6457 3.85449 16.2393 4.73644 16.6765 5.75033C17.1143 6.76421 17.3332 7.84755 17.3332 9.00033C17.3332 10.1531 17.1143 11.2364 16.6765 12.2503C16.2393 13.2642 15.6457 14.1462 14.8957 14.8962C14.1457 15.6462 13.2637 16.2398 12.2498 16.677C11.2359 17.1148 10.1526 17.3337 8.99984 17.3337ZM8.99984 15.667C10.8609 15.667 12.4373 15.0212 13.729 13.7295C15.0207 12.4378 15.6665 10.8614 15.6665 9.00033C15.6665 7.13921 15.0207 5.56283 13.729 4.27116C12.4373 2.97949 10.8609 2.33366 8.99984 2.33366C7.13873 2.33366 5.56234 2.97949 4.27067 4.27116C2.979 5.56283 2.33317 7.13921 2.33317 9.00033C2.33317 10.8614 2.979 12.4378 4.27067 13.7295C5.56234 15.0212 7.13873 15.667 8.99984 15.667Z" fill="#ED404A"/>
+</svg>
+`;
+const style = `
+.debugger {
+    all: initial;
+    width: ${INITIAL_WIDTH}px;
+    height: ${INITIAL_HEIGHT}px;
+    background-color: #FAFAFA;
+    position: fixed;
+    font-family: "Helvetica Neue", sans-serif;
+    box-shadow: rgba(0, 0, 0, 0.1) 0px 5px 10px;
+    border-radius: 8px;
+    overflow: hidden;
+    border: 1px solid lightgrey;
+    pointer-events: initial;
+    display: flex;
+    flex-direction: column;
+    min-width: ${MIN_SIZE}px;
+    max-width: 600px;
+    max-height: calc(100% - ${INITIAL_POS_THRESHOLD * 2}px);
+    min-height: ${MIN_SIZE}px;
+    resize: both;
+  }
+
+  .header {
+    padding: 8px 16px;
+    display: flex;
+    align-items: center;
+    background-color: #EEEEEE;
+    cursor: move;
+    border-bottom: 1px solid #e0e0e0;
+  }
+
+  .content {
+    font-size: 14px;
+    flex-grow: 1;
+    overflow: auto;
+  }
+
+  .msg {
+    border-bottom: 1px solid lightgrey;
+    padding: 8px 16px;
+    display: flex;
+    gap: 5px;
+    background-color: #FAFAFA;
+  }
+
+  .msg.collapsible {
+    cursor: pointer;
+  }
+
+  .empty-state {
+    padding: 8px 16px;
+    background-color: #FAFAFA;
+  }
+
+
+  .msg.collapsible:not(.collapsed) {
+    background-color: #F5F5F5;
+  }
+
+  .msg_title {
+    padding-bottom: 5px;
+    display: flex;
+    gap: 8px;
+    font-weight: 500;
+  }
+
+  .msg svg {
+    padding: 1px;
+    flex-shrink: 0;
+    margin-top: -2px;
+  }
+
+  .msg_content {
+    overflow: hidden;
+    flex-grow: 1;
+    margin-right:5px;
+  }
+
+  .msg_desc {
+    color: #646464;
+    cursor: initial;
+    word-wrap: break-word;
+  }
+
+  .msg.collapsed .msg_desc {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .msg.collapsible.collapsed .chevron {
+    transform: rotate(-45deg) translateX(-2px);
+  }
+
+  .msg.collapsible .chevron {
+    content: "";
+    width:6px;
+    height:6px;
+    border-bottom: 2px solid grey;
+    border-right: 2px solid grey;
+    transform: rotate(45deg) translateX(-1px);
+    margin: 5px;
+    flex-shrink:0;
+  }
+`;
+class Debugger extends HTMLElement {
+    constructor() {
+        var _a, _b;
+        var _c;
+        super();
+        _Debugger_instances.add(this);
+        _Debugger_messagesState.set(this, new sdkHelpers.State({ messages: [] }));
+        _Debugger_rootEle.set(this, void 0);
+        _Debugger_contentEle.set(this, void 0);
+        _Debugger_headerEle.set(this, void 0);
+        _Debugger_eventsCbRefs.set(this, {
+            resize: tslib.__classPrivateFieldGet(this, _Debugger_instances, "m", _Debugger_onWindowResize).bind(this),
+        });
+        this.attachShadow({ mode: 'open' });
+        (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.appendChild(template.content.cloneNode(true));
+        const sheet = new CSSStyleSheet();
+        sheet.replaceSync(style);
+        (_b = (_c = this.shadowRoot).adoptedStyleSheets) !== null && _b !== void 0 ? _b : (_c.adoptedStyleSheets = []);
+        this.shadowRoot.adoptedStyleSheets = [
+            ...this.shadowRoot.adoptedStyleSheets,
+            sheet,
+        ];
+        tslib.__classPrivateFieldSet(this, _Debugger_rootEle, this.shadowRoot.querySelector('.debugger'), "f");
+        tslib.__classPrivateFieldSet(this, _Debugger_contentEle, tslib.__classPrivateFieldGet(this, _Debugger_rootEle, "f").querySelector('.content'), "f");
+        tslib.__classPrivateFieldSet(this, _Debugger_headerEle, tslib.__classPrivateFieldGet(this, _Debugger_rootEle, "f").querySelector('.header'), "f");
+    }
+    updateData(data) {
+        tslib.__classPrivateFieldGet(this, _Debugger_messagesState, "f").update((state) => ({
+            messages: state.messages.concat(data),
+        }));
+    }
+    connectedCallback() {
+        helpers.dragElement(tslib.__classPrivateFieldGet(this, _Debugger_rootEle, "f"), tslib.__classPrivateFieldGet(this, _Debugger_headerEle, "f"), {
+            top: 'all',
+            bottom: 100,
+            left: 100,
+            right: 100,
+        });
+        window.addEventListener('resize', tslib.__classPrivateFieldGet(this, _Debugger_eventsCbRefs, "f").resize);
+        helpers.addOnResize(tslib.__classPrivateFieldGet(this, _Debugger_rootEle, "f"));
+        tslib.__classPrivateFieldGet(this, _Debugger_rootEle, "f").onresize = tslib.__classPrivateFieldGet(this, _Debugger_instances, "m", _Debugger_setCollapsibleMessages).bind(this);
+        tslib.__classPrivateFieldGet(this, _Debugger_messagesState, "f").subscribe(tslib.__classPrivateFieldGet(this, _Debugger_instances, "m", _Debugger_onNewMessages).bind(this));
+    }
+    disconnectedCallback() {
+        tslib.__classPrivateFieldGet(this, _Debugger_messagesState, "f").unsubscribeAll();
+        window.removeEventListener('resize', tslib.__classPrivateFieldGet(this, _Debugger_eventsCbRefs, "f").resize);
+    }
+}
+_Debugger_messagesState = new WeakMap(), _Debugger_rootEle = new WeakMap(), _Debugger_contentEle = new WeakMap(), _Debugger_headerEle = new WeakMap(), _Debugger_eventsCbRefs = new WeakMap(), _Debugger_instances = new WeakSet(), _Debugger_onNewMessages = function _Debugger_onNewMessages(data) {
+    tslib.__classPrivateFieldGet(this, _Debugger_instances, "m", _Debugger_renderMessages).call(this, data);
+    tslib.__classPrivateFieldGet(this, _Debugger_instances, "m", _Debugger_setCollapsibleMessages).call(this);
+}, _Debugger_renderMessages = function _Debugger_renderMessages(data) {
+    tslib.__classPrivateFieldGet(this, _Debugger_contentEle, "f").innerHTML = data.messages
+        .map((message) => `
+    <div class="msg">
+      ${icon}
+      <div class="msg_content">
+        <div class="msg_title">
+          ${message.title}
+        </div>
+        <div class="msg_desc">
+          ${message.description || ''}
+        </div>
+      </div>
+      <div class="chevron"></div>
+    </div>
+  `)
+        .join('');
+}, _Debugger_setCollapsibleMessages = function _Debugger_setCollapsibleMessages() {
+    tslib.__classPrivateFieldGet(this, _Debugger_contentEle, "f").querySelectorAll('.msg').forEach((element) => {
+        const ele = element;
+        const descEle = ele.querySelector('.msg_desc');
+        const lineHeight = 20;
+        const isScroll = descEle.scrollWidth > descEle.clientWidth;
+        const isMultiLine = descEle.clientHeight > lineHeight;
+        const isCollapsible = isScroll || isMultiLine;
+        if (isCollapsible) {
+            ele.classList.add('collapsible');
+            ele.onclick = (e) => {
+                // message description should not toggle collapse
+                if (!e.target.classList.contains('msg_desc')) {
+                    ele.classList.toggle('collapsed');
+                }
+            };
+        }
+        else {
+            ele.classList.remove('collapsible');
+            ele.onclick = null;
+        }
+    });
+}, _Debugger_onWindowResize = function _Debugger_onWindowResize() {
+    // when window is resizing we want to make sure debugger is still visible
+    const [left, top] = helpers.limitCoordinateToScreenBoundaries(tslib.__classPrivateFieldGet(this, _Debugger_rootEle, "f"), Number.parseInt(tslib.__classPrivateFieldGet(this, _Debugger_rootEle, "f").style.left, 10), Number.parseInt(tslib.__classPrivateFieldGet(this, _Debugger_rootEle, "f").style.top, 10), { top: 'all', bottom: 100, left: 100, right: 100 });
+    tslib.__classPrivateFieldGet(this, _Debugger_rootEle, "f").style.top = `${top}px`;
+    tslib.__classPrivateFieldGet(this, _Debugger_rootEle, "f").style.left = `${left}px`;
+};
+if (!customElements.get('descope-debugger')) {
+    customElements.define('descope-debugger', Debugger);
+}
+
+exports.default = Debugger;
+//# sourceMappingURL=debugger-wc.js.map

package/dist/cjs/mixins/debuggerMixin/debugger-wc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"debugger-wc.js","sources":["../../../../src/mixins/debuggerMixin/debugger-wc.ts"],"sourcesContent":["/* eslint-disable no-param-reassign */\nimport { State } from '@descope/sdk-helpers';\nimport {\n  addOnResize,\n  dragElement,\n  limitCoordinateToScreenBoundaries,\n} from './helpers';\nimport { DebuggerMessage } from './types';\n\nconst INITIAL_POS_THRESHOLD = 32;\nconst INITIAL_WIDTH = 300;\nconst INITIAL_HEIGHT = 200;\nconst MIN_SIZE = 200;\n\nconst template = document.createElement('template');\ntemplate.innerHTML = `\n<div style=\"top:${INITIAL_POS_THRESHOLD}px; left:${\n  window.innerWidth - INITIAL_WIDTH - INITIAL_POS_THRESHOLD\n}px;\" class=\"debugger\">\n  <div class=\"header\">\n    <span>Debugger messages</span>\n  </div>\n  <div class=\"content\">\n    <div class=\"empty-state\">\n      No errors detected 👀\n    </div>\n  </div>\n</div>\n`;\n\nconst icon = `<svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M5.99984 13.167L8.99984 10.167L11.9998 13.167L13.1665 12.0003L10.1665 9.00033L13.1665 6.00033L11.9998 4.83366L8.99984 7.83366L5.99984 4.83366L4.83317 6.00033L7.83317 9.00033L4.83317 12.0003L5.99984 13.167ZM8.99984 17.3337C7.84706 17.3337 6.76373 17.1148 5.74984 16.677C4.73595 16.2398 3.854 15.6462 3.104 14.8962C2.354 14.1462 1.76039 13.2642 1.32317 12.2503C0.885393 11.2364 0.666504 10.1531 0.666504 9.00033C0.666504 7.84755 0.885393 6.76421 1.32317 5.75033C1.76039 4.73644 2.354 3.85449 3.104 3.10449C3.854 2.35449 4.73595 1.7606 5.74984 1.32283C6.76373 0.885603 7.84706 0.666992 8.99984 0.666992C10.1526 0.666992 11.2359 0.885603 12.2498 1.32283C13.2637 1.7606 14.1457 2.35449 14.8957 3.10449C15.6457 3.85449 16.2393 4.73644 16.6765 5.75033C17.1143 6.76421 17.3332 7.84755 17.3332 9.00033C17.3332 10.1531 17.1143 11.2364 16.6765 12.2503C16.2393 13.2642 15.6457 14.1462 14.8957 14.8962C14.1457 15.6462 13.2637 16.2398 12.2498 16.677C11.2359 17.1148 10.1526 17.3337 8.99984 17.3337ZM8.99984 15.667C10.8609 15.667 12.4373 15.0212 13.729 13.7295C15.0207 12.4378 15.6665 10.8614 15.6665 9.00033C15.6665 7.13921 15.0207 5.56283 13.729 4.27116C12.4373 2.97949 10.8609 2.33366 8.99984 2.33366C7.13873 2.33366 5.56234 2.97949 4.27067 4.27116C2.979 5.56283 2.33317 7.13921 2.33317 9.00033C2.33317 10.8614 2.979 12.4378 4.27067 13.7295C5.56234 15.0212 7.13873 15.667 8.99984 15.667Z\" fill=\"#ED404A\"/>\n</svg>\n`;\n\nconst style = `\n.debugger {\n    all: initial;\n    width: ${INITIAL_WIDTH}px;\n    height: ${INITIAL_HEIGHT}px;\n    background-color: #FAFAFA;\n    position: fixed;\n    font-family: \"Helvetica Neue\", sans-serif;\n    box-shadow: rgba(0, 0, 0, 0.1) 0px 5px 10px;\n    border-radius: 8px;\n    overflow: hidden;\n    border: 1px solid lightgrey;\n    pointer-events: initial;\n    display: flex;\n    flex-direction: column;\n    min-width: ${MIN_SIZE}px;\n    max-width: 600px;\n    max-height: calc(100% - ${INITIAL_POS_THRESHOLD * 2}px);\n    min-height: ${MIN_SIZE}px;\n    resize: both;\n  }\n\n  .header {\n    padding: 8px 16px;\n    display: flex;\n    align-items: center;\n    background-color: #EEEEEE;\n    cursor: move;\n    border-bottom: 1px solid #e0e0e0;\n  }\n\n  .content {\n    font-size: 14px;\n    flex-grow: 1;\n    overflow: auto;\n  }\n\n  .msg {\n    border-bottom: 1px solid lightgrey;\n    padding: 8px 16px;\n    display: flex;\n    gap: 5px;\n    background-color: #FAFAFA;\n  }\n\n  .msg.collapsible {\n    cursor: pointer;\n  }\n\n  .empty-state {\n    padding: 8px 16px;\n    background-color: #FAFAFA;\n  }\n\n\n  .msg.collapsible:not(.collapsed) {\n    background-color: #F5F5F5;\n  }\n\n  .msg_title {\n    padding-bottom: 5px;\n    display: flex;\n    gap: 8px;\n    font-weight: 500;\n  }\n\n  .msg svg {\n    padding: 1px;\n    flex-shrink: 0;\n    margin-top: -2px;\n  }\n\n  .msg_content {\n    overflow: hidden;\n    flex-grow: 1;\n    margin-right:5px;\n  }\n\n  .msg_desc {\n    color: #646464;\n    cursor: initial;\n    word-wrap: break-word;\n  }\n\n  .msg.collapsed .msg_desc {\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .msg.collapsible.collapsed .chevron {\n    transform: rotate(-45deg) translateX(-2px);\n  }\n\n  .msg.collapsible .chevron {\n    content: \"\";\n    width:6px;\n    height:6px;\n    border-bottom: 2px solid grey;\n    border-right: 2px solid grey;\n    transform: rotate(45deg) translateX(-1px);\n    margin: 5px;\n    flex-shrink:0;\n  }\n`;\n\ntype MessagesState = { messages: DebuggerMessage[] };\n\nclass Debugger extends HTMLElement {\n  #messagesState = new State<MessagesState>({ messages: [] });\n\n  #rootEle: HTMLDivElement;\n\n  #contentEle: HTMLDivElement;\n\n  #headerEle: HTMLDivElement;\n\n  #eventsCbRefs = {\n    resize: this.#onWindowResize.bind(this),\n  };\n\n  constructor() {\n    super();\n\n    this.attachShadow({ mode: 'open' });\n    this.shadowRoot?.appendChild(template.content.cloneNode(true));\n    const sheet = new CSSStyleSheet();\n    sheet.replaceSync(style);\n    this.shadowRoot.adoptedStyleSheets ??= [];\n    this.shadowRoot.adoptedStyleSheets = [\n      ...this.shadowRoot.adoptedStyleSheets,\n      sheet,\n    ];\n\n    this.#rootEle =\n      this.shadowRoot!.querySelector<HTMLDivElement>('.debugger')!;\n    this.#contentEle = this.#rootEle.querySelector<HTMLDivElement>('.content')!;\n    this.#headerEle = this.#rootEle.querySelector<HTMLDivElement>('.header')!;\n  }\n\n  updateData(data: DebuggerMessage | DebuggerMessage[]) {\n    this.#messagesState.update((state) => ({\n      messages: state.messages.concat(data),\n    }));\n  }\n\n  #onNewMessages(data: MessagesState) {\n    this.#renderMessages(data);\n    this.#setCollapsibleMessages();\n  }\n\n  #renderMessages(data: MessagesState) {\n    this.#contentEle.innerHTML = data.messages\n      .map(\n        (message) => `\n    <div class=\"msg\">\n      ${icon}\n      <div class=\"msg_content\">\n        <div class=\"msg_title\">\n          ${message.title}\n        </div>\n        <div class=\"msg_desc\">\n          ${message.description || ''}\n        </div>\n      </div>\n      <div class=\"chevron\"></div>\n    </div>\n  `,\n      )\n      .join('');\n  }\n\n  #setCollapsibleMessages() {\n    this.#contentEle.querySelectorAll('.msg').forEach((element: Element) => {\n      const ele = element as HTMLElement;\n      const descEle = ele.querySelector('.msg_desc');\n      const lineHeight = 20;\n      const isScroll = descEle!.scrollWidth > descEle!.clientWidth;\n      const isMultiLine = descEle!.clientHeight > lineHeight;\n      const isCollapsible = isScroll || isMultiLine;\n\n      if (isCollapsible) {\n        ele.classList.add('collapsible');\n        ele.onclick = (e: MouseEvent) => {\n          // message description should not toggle collapse\n          if (!(e.target as HTMLElement).classList.contains('msg_desc')) {\n            ele.classList.toggle('collapsed');\n          }\n        };\n      } else {\n        ele.classList.remove('collapsible');\n        ele.onclick = null;\n      }\n    });\n  }\n\n  #onWindowResize() {\n    // when window is resizing we want to make sure debugger is still visible\n    const [left, top] = limitCoordinateToScreenBoundaries(\n      this.#rootEle,\n      Number.parseInt(this.#rootEle.style.left, 10),\n      Number.parseInt(this.#rootEle.style.top, 10),\n      { top: 'all', bottom: 100, left: 100, right: 100 },\n    );\n    this.#rootEle.style.top = `${top}px`;\n    this.#rootEle.style.left = `${left}px`;\n  }\n\n  connectedCallback() {\n    dragElement(this.#rootEle, this.#headerEle, {\n      top: 'all',\n      bottom: 100,\n      left: 100,\n      right: 100,\n    });\n\n    window.addEventListener('resize', this.#eventsCbRefs.resize);\n\n    addOnResize(this.#rootEle);\n    this.#rootEle.onresize = this.#setCollapsibleMessages.bind(this);\n\n    this.#messagesState.subscribe(this.#onNewMessages.bind(this));\n  }\n\n  disconnectedCallback() {\n    this.#messagesState.unsubscribeAll();\n    window.removeEventListener('resize', this.#eventsCbRefs.resize);\n  }\n}\n\nif (!customElements.get('descope-debugger')) {\n  customElements.define('descope-debugger', Debugger);\n}\n\nexport default Debugger;\n"],"names":["State","__classPrivateFieldGet","__classPrivateFieldSet","dragElement","addOnResize","limitCoordinateToScreenBoundaries"],"mappings":"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"}

package/dist/cjs/mixins/debuggerMixin/debuggerMixin.js

@@ -0,0 +1,73 @@
+'use strict';
+
+var tslib = require('tslib');
+var sdkHelpers = require('@descope/sdk-helpers');
+var initLifecycleMixin = require('../initLifecycleMixin.js');
+var loggerMixin = require('../loggerMixin/loggerMixin.js');
+
+const debuggerMixin = sdkHelpers.createSingletonMixin((superclass) => { var _DebuggerMixinClass_instances, _DebuggerMixinClass_debuggerEle, _DebuggerMixinClass_disableDebugger, _DebuggerMixinClass_enableDebugger, _DebuggerMixinClass_handleDebugMode, _DebuggerMixinClass_updateDebuggerMessages, _a; return _a = class DebuggerMixinClass extends sdkHelpers.compose(initLifecycleMixin.initLifecycleMixin, loggerMixin.loggerMixin)(superclass) {
+        constructor() {
+            super(...arguments);
+            _DebuggerMixinClass_instances.add(this);
+            _DebuggerMixinClass_debuggerEle.set(this, void 0);
+            this.attributeChangedCallback = (attrName, oldValue, newValue) => {
+                var _b;
+                (_b = super.attributeChangedCallback) === null || _b === void 0 ? void 0 : _b.call(this, attrName, oldValue, newValue);
+                if (attrName === 'debug') {
+                    tslib.__classPrivateFieldGet(this, _DebuggerMixinClass_instances, "m", _DebuggerMixinClass_handleDebugMode).call(this);
+                }
+            };
+        }
+        get debug() {
+            return this.getAttribute('debug') === 'true';
+        }
+        onLogEvent(logLevel, args) {
+            var _b;
+            (_b = super.onLogEvent) === null || _b === void 0 ? void 0 : _b.call(this, logLevel, args);
+            if (logLevel === 'error') {
+                tslib.__classPrivateFieldGet(this, _DebuggerMixinClass_instances, "m", _DebuggerMixinClass_updateDebuggerMessages).call(this, args[0] || 'Error', args[1]);
+            }
+        }
+        async init() {
+            var _b;
+            await ((_b = super.init) === null || _b === void 0 ? void 0 : _b.call(this));
+            tslib.__classPrivateFieldGet(this, _DebuggerMixinClass_instances, "m", _DebuggerMixinClass_handleDebugMode).call(this);
+        }
+    },
+    _DebuggerMixinClass_debuggerEle = new WeakMap(),
+    _DebuggerMixinClass_instances = new WeakSet(),
+    _DebuggerMixinClass_disableDebugger = function _DebuggerMixinClass_disableDebugger() {
+        var _b;
+        (_b = tslib.__classPrivateFieldGet(this, _DebuggerMixinClass_debuggerEle, "f")) === null || _b === void 0 ? void 0 : _b.remove();
+        tslib.__classPrivateFieldSet(this, _DebuggerMixinClass_debuggerEle, null, "f");
+    },
+    _DebuggerMixinClass_enableDebugger = async function _DebuggerMixinClass_enableDebugger() {
+        tslib.__classPrivateFieldSet(this, _DebuggerMixinClass_debuggerEle, document.createElement('descope-debugger'), "f");
+        Object.assign(tslib.__classPrivateFieldGet(this, _DebuggerMixinClass_debuggerEle, "f").style, {
+            position: 'fixed',
+            top: '0',
+            right: '0',
+            height: '100vh',
+            width: '100vw',
+            pointerEvents: 'none',
+            zIndex: 99999,
+        });
+        // we are importing the debugger dynamically so we won't load it when it's not needed
+        await Promise.resolve().then(function () { return require('./debugger-wc.js'); });
+        document.body.appendChild(tslib.__classPrivateFieldGet(this, _DebuggerMixinClass_debuggerEle, "f"));
+    },
+    _DebuggerMixinClass_handleDebugMode = function _DebuggerMixinClass_handleDebugMode() {
+        if (this.debug)
+            tslib.__classPrivateFieldGet(this, _DebuggerMixinClass_instances, "m", _DebuggerMixinClass_enableDebugger).call(this);
+        else
+            tslib.__classPrivateFieldGet(this, _DebuggerMixinClass_instances, "m", _DebuggerMixinClass_disableDebugger).call(this);
+    },
+    _DebuggerMixinClass_updateDebuggerMessages = function _DebuggerMixinClass_updateDebuggerMessages(title, description) {
+        var _b;
+        if (title)
+            (_b = tslib.__classPrivateFieldGet(this, _DebuggerMixinClass_debuggerEle, "f")) === null || _b === void 0 ? void 0 : _b.updateData({ title, description });
+    },
+    _a; });
+
+exports.debuggerMixin = debuggerMixin;
+//# sourceMappingURL=debuggerMixin.js.map