@descope/sdk-mixins 0.12.0 → 0.13.1

package/dist/cjs/index.js

@@ -17,6 +17,9 @@ 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');
+var injectStyleMixin = require('./mixins/injectStyleMixin.js');
+var cspNonceMixin = require('./mixins/cspNonceMixin.js');
 
 
 
@@ -38,4 +41,7 @@ exports.initLifecycleMixin = initLifecycleMixin.initLifecycleMixin;
 exports.projectIdMixin = projectIdMixin.projectIdMixin;
 exports.baseUrlMixin = baseUrlMixin.baseUrlMixin;
 exports.cookieConfigMixin = cookieConfigMixin.cookieConfigMixin;
+exports.injectNpmLibMixin = injectNpmLibMixin.injectNpmLibMixin;
+exports.injectStyleMixin = injectStyleMixin.injectStyleMixin;
+exports.cspNonceMixin = cspNonceMixin.cspNonceMixin;
 //# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map

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

package/dist/cjs/mixins/cspNonceMixin.js

@@ -0,0 +1,34 @@
+'use strict';
+
+var tslib = require('tslib');
+var sdkHelpers = require('@descope/sdk-helpers');
+var initLifecycleMixin = require('./initLifecycleMixin.js');
+var observeAttributesMixin = require('./observeAttributesMixin/observeAttributesMixin.js');
+
+const cspNonceMixin = sdkHelpers.createSingletonMixin((superclass) => {
+    var _CspNonceMixinClass_instances, _CspNonceMixinClass_setNonce, _a;
+    const BaseClass = sdkHelpers.compose(initLifecycleMixin.initLifecycleMixin, observeAttributesMixin.observeAttributesMixin)(superclass);
+    return _a = class CspNonceMixinClass extends BaseClass {
+            constructor() {
+                super(...arguments);
+                _CspNonceMixinClass_instances.add(this);
+            }
+            get nonce() {
+                return this.getAttribute('nonce') || '';
+            }
+            async init() {
+                var _b;
+                await ((_b = super.init) === null || _b === void 0 ? void 0 : _b.call(this));
+                this.observeAttribute('nonce', tslib.__classPrivateFieldGet(this, _CspNonceMixinClass_instances, "m", _CspNonceMixinClass_setNonce).bind(this));
+                tslib.__classPrivateFieldGet(this, _CspNonceMixinClass_instances, "m", _CspNonceMixinClass_setNonce).call(this);
+            }
+        },
+        _CspNonceMixinClass_instances = new WeakSet(),
+        _CspNonceMixinClass_setNonce = function _CspNonceMixinClass_setNonce() {
+            window.DESCOPE_NONCE = this.nonce;
+        },
+        _a;
+});
+
+exports.cspNonceMixin = cspNonceMixin;
+//# sourceMappingURL=cspNonceMixin.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"cspNonceMixin.js","sources":["../../../src/mixins/cspNonceMixin.ts"],"sourcesContent":["import { compose, createSingletonMixin } from '@descope/sdk-helpers';\nimport { initLifecycleMixin } from './initLifecycleMixin';\nimport { observeAttributesMixin } from './observeAttributesMixin';\n\nexport const cspNonceMixin = createSingletonMixin(\n  <T extends CustomElementConstructor>(superclass: T) => {\n    const BaseClass = compose(\n      initLifecycleMixin,\n      observeAttributesMixin,\n    )(superclass);\n\n    return class CspNonceMixinClass extends BaseClass {\n      get nonce(): string {\n        return this.getAttribute('nonce') || '';\n      }\n\n      #setNonce() {\n        (window as any).DESCOPE_NONCE = this.nonce;\n      }\n\n      async init() {\n        await super.init?.();\n\n        this.observeAttribute('nonce', this.#setNonce.bind(this));\n        this.#setNonce();\n      }\n    };\n  },\n);\n"],"names":["createSingletonMixin","compose","initLifecycleMixin","observeAttributesMixin","__classPrivateFieldGet"],"mappings":";;;;;;;MAIa,aAAa,GAAGA,+BAAoB,CAC/C,CAAqC,UAAa,KAAI;;IACpD,MAAM,SAAS,GAAGC,kBAAO,CACvBC,qCAAkB,EAClBC,6CAAsB,CACvB,CAAC,UAAU,CAAC,CAAC;IAEd,OAAO,EAAA,GAAA,MAAM,kBAAmB,SAAQ,SAAS,CAAA;AAA1C,YAAA,WAAA,GAAA;;;aAeN;AAdC,YAAA,IAAI,KAAK,GAAA;gBACP,OAAO,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;aACzC;AAMD,YAAA,MAAM,IAAI,GAAA;;AACR,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;AAErB,gBAAA,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAEC,4BAAA,CAAA,IAAI,EAAU,6BAAA,EAAA,GAAA,EAAA,4BAAA,CAAA,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;AAC1D,gBAAAA,4BAAA,CAAA,IAAI,EAAA,6BAAA,EAAA,GAAA,EAAA,4BAAA,CAAU,CAAd,IAAA,CAAA,IAAI,CAAY,CAAC;aAClB;AACF,SAAA;;;AATI,YAAA,MAAc,CAAC,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC;SAC5C;AAQD,QAAA,EAAA,CAAA;AACJ,CAAC;;;;"}

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

@@ -5,6 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var tslib = require('tslib');
 var sdkHelpers = require('@descope/sdk-helpers');
 var helpers = require('./helpers.js');
+var injectStyleMixin = require('../injectStyleMixin.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;
@@ -133,10 +134,10 @@ const style = `
     flex-shrink:0;
   }
 `;
-class Debugger extends HTMLElement {
+const BaseClass = sdkHelpers.compose(injectStyleMixin.injectStyleMixin)(HTMLElement);
+class Debugger extends BaseClass {
     constructor() {
-        var _a, _b;
-        var _c;
+        var _a;
         super();
         _Debugger_instances.add(this);
         _Debugger_messagesState.set(this, new sdkHelpers.State({ messages: [] }));
@@ -148,13 +149,7 @@ class Debugger extends HTMLElement {
         });
         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,
-        ];
+        this.injectStyle(style);
         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");

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

@@ -1 +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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"}
+{"version":3,"file":"debugger-wc.js","sources":["../../../../src/mixins/debuggerMixin/debugger-wc.ts"],"sourcesContent":["/* eslint-disable no-param-reassign */\nimport { compose, State } from '@descope/sdk-helpers';\nimport {\n  addOnResize,\n  dragElement,\n  limitCoordinateToScreenBoundaries,\n} from './helpers';\nimport { DebuggerMessage } from './types';\nimport { injectStyleMixin } from '../injectStyleMixin';\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\nconst BaseClass = compose(injectStyleMixin)(HTMLElement);\n\nclass Debugger extends BaseClass {\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    this.injectStyle(style);\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":["compose","injectStyleMixin","State","__classPrivateFieldGet","__classPrivateFieldSet","dragElement","addOnResize","limitCoordinateToScreenBoundaries"],"mappings":"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"}

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

@@ -2,24 +2,13 @@
 
 var constants = require('../../constants.js');
 
-const DESCOPE_UI_SCRIPT_ID = 'load-descope-ui';
-const DESCOPE_UI_FALLBACK_SCRIPT_ID = 'load-descope-ui-fallback-script';
-const DESCOPE_UI_FALLBACK_2_SCRIPT_ID = 'load-descope-ui-fallback-script-2';
 const UI_COMPONENTS_URL_KEY = 'base.ui.components.url';
-const UI_COMPONENTS_URL = (constants.IS_LOCAL_STORAGE && localStorage.getItem(UI_COMPONENTS_URL_KEY)) ||
-    'https://descopecdn.com/npm/@descope/web-components-ui@<version>/dist/umd/index.js';
-const UI_COMPONENTS_FALLBACK_URL = (constants.IS_LOCAL_STORAGE && localStorage.getItem(UI_COMPONENTS_URL_KEY)) ||
-    'https://static.descope.com/npm/@descope/web-components-ui@<version>/dist/umd/index.js';
-const UI_COMPONENTS_FALLBACK_2_URL = (constants.IS_LOCAL_STORAGE && localStorage.getItem(UI_COMPONENTS_URL_KEY)) ||
-    'https://cdn.jsdelivr.net/npm/@descope/web-components-ui@<version>/dist/umd/index.js';
-const UI_COMPONENTS_URL_VERSION_PLACEHOLDER = '<version>';
+const LOCAL_STORAGE_OVERRIDE = constants.IS_LOCAL_STORAGE && localStorage.getItem(UI_COMPONENTS_URL_KEY);
+const JS_FILE_PATH = 'dist/umd/index.js';
+const WEB_COMPONENTS_UI_LIB_NAME = '@descope/web-components-ui';
 
-exports.DESCOPE_UI_FALLBACK_2_SCRIPT_ID = DESCOPE_UI_FALLBACK_2_SCRIPT_ID;
-exports.DESCOPE_UI_FALLBACK_SCRIPT_ID = DESCOPE_UI_FALLBACK_SCRIPT_ID;
-exports.DESCOPE_UI_SCRIPT_ID = DESCOPE_UI_SCRIPT_ID;
-exports.UI_COMPONENTS_FALLBACK_2_URL = UI_COMPONENTS_FALLBACK_2_URL;
-exports.UI_COMPONENTS_FALLBACK_URL = UI_COMPONENTS_FALLBACK_URL;
-exports.UI_COMPONENTS_URL = UI_COMPONENTS_URL;
+exports.JS_FILE_PATH = JS_FILE_PATH;
+exports.LOCAL_STORAGE_OVERRIDE = LOCAL_STORAGE_OVERRIDE;
 exports.UI_COMPONENTS_URL_KEY = UI_COMPONENTS_URL_KEY;
-exports.UI_COMPONENTS_URL_VERSION_PLACEHOLDER = UI_COMPONENTS_URL_VERSION_PLACEHOLDER;
+exports.WEB_COMPONENTS_UI_LIB_NAME = WEB_COMPONENTS_UI_LIB_NAME;
 //# sourceMappingURL=constants.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sources":["../../../../src/mixins/descopeUiMixin/constants.ts"],"sourcesContent":["import { IS_LOCAL_STORAGE } from '../../constants';\n\nexport const DESCOPE_UI_SCRIPT_ID = 'load-descope-ui';\nexport const DESCOPE_UI_FALLBACK_SCRIPT_ID = 'load-descope-ui-fallback-script';\nexport const DESCOPE_UI_FALLBACK_2_SCRIPT_ID =\n  'load-descope-ui-fallback-script-2';\n\nexport const UI_COMPONENTS_URL_KEY = 'base.ui.components.url';\n\nexport const UI_COMPONENTS_URL =\n  (IS_LOCAL_STORAGE && localStorage.getItem(UI_COMPONENTS_URL_KEY)) ||\n  'https://descopecdn.com/npm/@descope/web-components-ui@<version>/dist/umd/index.js';\n\nexport const UI_COMPONENTS_FALLBACK_URL =\n  (IS_LOCAL_STORAGE && localStorage.getItem(UI_COMPONENTS_URL_KEY)) ||\n  'https://static.descope.com/npm/@descope/web-components-ui@<version>/dist/umd/index.js';\n\nexport const UI_COMPONENTS_FALLBACK_2_URL =\n  (IS_LOCAL_STORAGE && localStorage.getItem(UI_COMPONENTS_URL_KEY)) ||\n  'https://cdn.jsdelivr.net/npm/@descope/web-components-ui@<version>/dist/umd/index.js';\n\nexport const UI_COMPONENTS_URL_VERSION_PLACEHOLDER = '<version>';\n"],"names":["IS_LOCAL_STORAGE"],"mappings":";;;;AAEO,MAAM,oBAAoB,GAAG,kBAAkB;AAC/C,MAAM,6BAA6B,GAAG,kCAAkC;AACxE,MAAM,+BAA+B,GAC1C,oCAAoC;AAE/B,MAAM,qBAAqB,GAAG,yBAAyB;AAEvD,MAAM,iBAAiB,GAC5B,CAACA,0BAAgB,IAAI,YAAY,CAAC,OAAO,CAAC,qBAAqB,CAAC;AAChE,IAAA,oFAAoF;AAE/E,MAAM,0BAA0B,GACrC,CAACA,0BAAgB,IAAI,YAAY,CAAC,OAAO,CAAC,qBAAqB,CAAC;AAChE,IAAA,wFAAwF;AAEnF,MAAM,4BAA4B,GACvC,CAACA,0BAAgB,IAAI,YAAY,CAAC,OAAO,CAAC,qBAAqB,CAAC;AAChE,IAAA,sFAAsF;AAEjF,MAAM,qCAAqC,GAAG;;;;;;;;;;;"}
+{"version":3,"file":"constants.js","sources":["../../../../src/mixins/descopeUiMixin/constants.ts"],"sourcesContent":["import { IS_LOCAL_STORAGE } from '../../constants';\n\nexport const UI_COMPONENTS_URL_KEY = 'base.ui.components.url';\nexport const LOCAL_STORAGE_OVERRIDE =\n  IS_LOCAL_STORAGE && localStorage.getItem(UI_COMPONENTS_URL_KEY);\nexport const JS_FILE_PATH = 'dist/umd/index.js';\nexport const WEB_COMPONENTS_UI_LIB_NAME = '@descope/web-components-ui';\n"],"names":["IS_LOCAL_STORAGE"],"mappings":";;;;AAEO,MAAM,qBAAqB,GAAG,yBAAyB;AACvD,MAAM,sBAAsB,GACjCA,0BAAgB,IAAI,YAAY,CAAC,OAAO,CAAC,qBAAqB,EAAE;AAC3D,MAAM,YAAY,GAAG,oBAAoB;AACzC,MAAM,0BAA0B,GAAG;;;;;;;"}

package/dist/cjs/mixins/descopeUiMixin/descopeUiMixin.js

@@ -3,19 +3,18 @@
 var tslib = require('tslib');
 var sdkHelpers = require('@descope/sdk-helpers');
 var configMixin = require('../configMixin/configMixin.js');
+var injectNpmLibMixin = require('../injectNpmLibMixin/injectNpmLibMixin.js');
 var loggerMixin = require('../loggerMixin/loggerMixin.js');
-var constants = require('./constants.js');
 var helpers = require('./helpers.js');
+var constants = require('./constants.js');
 
 const descopeUiMixin = sdkHelpers.createSingletonMixin((superclass) => {
-    var _DescopeUiMixinClass_instances, _DescopeUiMixinClass_errorCbsSym, _DescopeUiMixinClass_loadCbsSym, _DescopeUiMixinClass_getComponentsVersion, _DescopeUiMixinClass_exposeAlternateEvents, _DescopeUiMixinClass_handleFallbackScript, _DescopeUiMixinClass_registerEvents, _DescopeUiMixinClass_getDescopeUiLoadingScript, _DescopeUiMixinClass_descopeUi, _DescopeUiMixinClass_loadDescopeUiComponent, _DescopeUiMixinClass_getDescopeUi, _a;
-    const BaseClass = sdkHelpers.compose(loggerMixin.loggerMixin, configMixin.configMixin)(superclass);
+    var _DescopeUiMixinClass_instances, _DescopeUiMixinClass_getComponentsVersion, _DescopeUiMixinClass_descopeUi, _DescopeUiMixinClass_loadDescopeUiComponent, _DescopeUiMixinClass_getDescopeUi, _a;
+    const BaseClass = sdkHelpers.compose(loggerMixin.loggerMixin, configMixin.configMixin, injectNpmLibMixin.injectNpmLibMixin)(superclass);
     return _a = class DescopeUiMixinClass extends BaseClass {
             constructor() {
                 super(...arguments);
                 _DescopeUiMixinClass_instances.add(this);
-                _DescopeUiMixinClass_errorCbsSym.set(this, Symbol('errorCbs'));
-                _DescopeUiMixinClass_loadCbsSym.set(this, Symbol('loadCbs'));
                 _DescopeUiMixinClass_descopeUi.set(this, void 0);
             }
             get descopeUi() {
@@ -30,12 +29,7 @@ const descopeUiMixin = sdkHelpers.createSingletonMixin((superclass) => {
                     : helpers.getDescopeUiComponentsList(templateOrComponentNames);
                 return Promise.all(descopeUiComponentsList.map((componentName) => tslib.__classPrivateFieldGet(this, _DescopeUiMixinClass_instances, "m", _DescopeUiMixinClass_loadDescopeUiComponent).call(this, componentName)));
             }
-            get baseCdnUrl() {
-                return this.getAttribute('base-cdn-url');
-            }
         },
-        _DescopeUiMixinClass_errorCbsSym = new WeakMap(),
-        _DescopeUiMixinClass_loadCbsSym = new WeakMap(),
         _DescopeUiMixinClass_descopeUi = new WeakMap(),
         _DescopeUiMixinClass_instances = new WeakSet(),
         _DescopeUiMixinClass_getComponentsVersion = 
@@ -52,64 +46,6 @@ const descopeUiMixin = sdkHelpers.createSingletonMixin((superclass) => {
             }
             return componentsVersion;
         },
-        _DescopeUiMixinClass_exposeAlternateEvents = function _DescopeUiMixinClass_exposeAlternateEvents(scriptEle) {
-            const errorCbsSym = tslib.__classPrivateFieldGet(this, _DescopeUiMixinClass_errorCbsSym, "f");
-            const loadCbsSym = tslib.__classPrivateFieldGet(this, _DescopeUiMixinClass_loadCbsSym, "f");
-            // eslint-disable-next-line no-param-reassign
-            scriptEle[errorCbsSym] = [];
-            // eslint-disable-next-line no-param-reassign
-            scriptEle[loadCbsSym] = [];
-            Object.defineProperty(scriptEle, 'onerror', {
-                set(cb) {
-                    scriptEle[errorCbsSym].push(cb);
-                },
-            });
-            Object.defineProperty(scriptEle, 'onload', {
-                set(cb) {
-                    scriptEle[loadCbsSym].push(cb);
-                },
-            });
-        },
-        _DescopeUiMixinClass_handleFallbackScript = async function _DescopeUiMixinClass_handleFallbackScript(errorCbs, loadCbs, elemId, scriptUrl) {
-            this.logger.debug('Trying to load DescopeUI from a fallback URL');
-            const fallbackScriptEle = helpers.setupScript(elemId);
-            document.body.append(fallbackScriptEle);
-            fallbackScriptEle.addEventListener('error', () => {
-                errorCbs.forEach((cb) => cb(`Cannot load DescopeUI from fallback URL, Make sure this URL is valid and return the correct script: "${fallbackScriptEle.src}"`));
-            });
-            fallbackScriptEle.addEventListener('load', () => {
-                loadCbs.forEach((cb) => cb());
-            });
-            fallbackScriptEle.src = helpers.generateScriptUrl(scriptUrl, await tslib.__classPrivateFieldGet(this, _DescopeUiMixinClass_instances, "m", _DescopeUiMixinClass_getComponentsVersion).call(this));
-        },
-        _DescopeUiMixinClass_registerEvents = function _DescopeUiMixinClass_registerEvents(scriptEle) {
-            scriptEle.addEventListener('error', () => {
-                scriptEle[tslib.__classPrivateFieldGet(this, _DescopeUiMixinClass_errorCbsSym, "f")].forEach((cb) => cb(`Cannot load DescopeUI from main URL, Make sure this URL is valid and return the correct script: "${scriptEle.src}"`));
-                // in case we could not load DescopeUI from the main URL, we are trying to load it from a fallback URL
-                tslib.__classPrivateFieldGet(this, _DescopeUiMixinClass_instances, "m", _DescopeUiMixinClass_handleFallbackScript).call(this, [
-                    // we are adding a second fallback
-                    tslib.__classPrivateFieldGet(this, _DescopeUiMixinClass_instances, "m", _DescopeUiMixinClass_handleFallbackScript).bind(this, scriptEle[tslib.__classPrivateFieldGet(this, _DescopeUiMixinClass_errorCbsSym, "f")], scriptEle[tslib.__classPrivateFieldGet(this, _DescopeUiMixinClass_loadCbsSym, "f")], constants.DESCOPE_UI_FALLBACK_2_SCRIPT_ID, constants.UI_COMPONENTS_FALLBACK_2_URL),
-                    ...scriptEle[tslib.__classPrivateFieldGet(this, _DescopeUiMixinClass_errorCbsSym, "f")],
-                ], scriptEle[tslib.__classPrivateFieldGet(this, _DescopeUiMixinClass_loadCbsSym, "f")], constants.DESCOPE_UI_FALLBACK_SCRIPT_ID, constants.UI_COMPONENTS_FALLBACK_URL);
-            });
-            scriptEle.addEventListener('load', () => {
-                scriptEle[tslib.__classPrivateFieldGet(this, _DescopeUiMixinClass_loadCbsSym, "f")].forEach((cb) => cb());
-            });
-        },
-        _DescopeUiMixinClass_getDescopeUiLoadingScript = async function _DescopeUiMixinClass_getDescopeUiLoadingScript() {
-            if (!document.querySelector(`script#${constants.DESCOPE_UI_SCRIPT_ID}`)) {
-                this.logger.debug('DescopeUI loading script does not exist, creating it', this);
-                const scriptEle = helpers.setupScript(constants.DESCOPE_UI_SCRIPT_ID);
-                document.body.append(scriptEle);
-                tslib.__classPrivateFieldGet(this, _DescopeUiMixinClass_instances, "m", _DescopeUiMixinClass_exposeAlternateEvents).call(this, scriptEle);
-                tslib.__classPrivateFieldGet(this, _DescopeUiMixinClass_instances, "m", _DescopeUiMixinClass_registerEvents).call(this, scriptEle);
-                scriptEle.src = helpers.generateScriptUrl(this.baseCdnUrl || constants.UI_COMPONENTS_URL, await tslib.__classPrivateFieldGet(this, _DescopeUiMixinClass_instances, "m", _DescopeUiMixinClass_getComponentsVersion).call(this));
-            }
-            else {
-                this.logger.debug('DescopeUI loading script already exists', this);
-            }
-            return document.getElementById(constants.DESCOPE_UI_SCRIPT_ID);
-        },
         _DescopeUiMixinClass_loadDescopeUiComponent = async function _DescopeUiMixinClass_loadDescopeUiComponent(componentName) {
             const isComponentAlreadyDefined = !!customElements.get(componentName);
             if (isComponentAlreadyDefined) {
@@ -139,27 +75,19 @@ const descopeUiMixin = sdkHelpers.createSingletonMixin((superclass) => {
             }
             return undefined;
         },
-        _DescopeUiMixinClass_getDescopeUi = function _DescopeUiMixinClass_getDescopeUi() {
-            return new Promise((res) => {
-                if (globalThis.DescopeUI) {
-                    res(globalThis.DescopeUI);
-                }
-                tslib.__classPrivateFieldGet(this, _DescopeUiMixinClass_instances, "m", _DescopeUiMixinClass_getDescopeUiLoadingScript).call(this).then((scriptEle) => {
-                    // eslint-disable-next-line no-param-reassign
-                    scriptEle.onerror = this.logger.error;
-                    // eslint-disable-next-line no-param-reassign
-                    scriptEle.onload = () => {
-                        this.logger.debug('DescopeUI was loaded');
-                        res(globalThis.DescopeUI);
-                    };
-                    // in case the load event was dispatched before we registered, we have a fallback
-                    setTimeout(() => {
-                        if (globalThis.DescopeUI) {
-                            res(globalThis.DescopeUI);
-                        }
-                    });
-                });
-            });
+        _DescopeUiMixinClass_getDescopeUi = async function _DescopeUiMixinClass_getDescopeUi() {
+            if (globalThis.DescopeUI) {
+                return globalThis.DescopeUI;
+            }
+            try {
+                await this.injectNpmLib(constants.WEB_COMPONENTS_UI_LIB_NAME, await tslib.__classPrivateFieldGet(this, _DescopeUiMixinClass_instances, "m", _DescopeUiMixinClass_getComponentsVersion).call(this), constants.JS_FILE_PATH, [constants.LOCAL_STORAGE_OVERRIDE]);
+                this.logger.debug('DescopeUI was loaded');
+                return globalThis.DescopeUI;
+            }
+            catch (error) {
+                this.logger.error(error);
+                throw new Error('DescopeUI was not loaded');
+            }
         },
         _a;
 });

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

@@ -1 +1 @@
-{"version":3,"file":"descopeUiMixin.js","sources":["../../../../src/mixins/descopeUiMixin/descopeUiMixin.ts"],"sourcesContent":["import { compose, createSingletonMixin } from '@descope/sdk-helpers';\nimport { configMixin } from '../configMixin';\nimport { loggerMixin } from '../loggerMixin';\nimport {\n  DESCOPE_UI_FALLBACK_2_SCRIPT_ID,\n  DESCOPE_UI_FALLBACK_SCRIPT_ID,\n  DESCOPE_UI_SCRIPT_ID,\n  UI_COMPONENTS_FALLBACK_2_URL,\n  UI_COMPONENTS_FALLBACK_URL,\n  UI_COMPONENTS_URL,\n} from './constants';\nimport {\n  generateScriptUrl,\n  getDescopeUiComponentsList,\n  setupScript,\n} from './helpers';\n\ntype ErrorCb = (error: string) => void;\ntype LoadCb = () => void;\n\nexport const descopeUiMixin = createSingletonMixin(\n  <T extends CustomElementConstructor>(superclass: T) => {\n    const BaseClass = compose(loggerMixin, configMixin)(superclass);\n\n    return class DescopeUiMixinClass extends BaseClass {\n      #errorCbsSym = Symbol('errorCbs');\n\n      #loadCbsSym = Symbol('loadCbs');\n\n      // eslint-disable-next-line class-methods-use-this\n      async #getComponentsVersion() {\n        const config = await this.config;\n        const componentsVersion = config?.projectConfig?.componentsVersion;\n\n        if (!componentsVersion) {\n          this.logger.error('Could not get components version');\n        } else {\n          this.logger.debug(`Got component version \"${componentsVersion}\"`);\n        }\n\n        return componentsVersion;\n      }\n\n      // in order to allow only single load of DescopeUI across different instances,\n      // and also allow fallback in case the components cannot be loaded from descope domain\n      // we are managing an alternative way to register to the script events\n      #exposeAlternateEvents(scriptEle: HTMLScriptElement) {\n        const errorCbsSym = this.#errorCbsSym;\n        const loadCbsSym = this.#loadCbsSym;\n\n        // eslint-disable-next-line no-param-reassign\n        scriptEle[errorCbsSym] = [];\n        // eslint-disable-next-line no-param-reassign\n        scriptEle[loadCbsSym] = [];\n\n        Object.defineProperty(scriptEle, 'onerror', {\n          set(cb: ErrorCb) {\n            scriptEle[errorCbsSym].push(cb);\n          },\n        });\n\n        Object.defineProperty(scriptEle, 'onload', {\n          set(cb: LoadCb) {\n            scriptEle[loadCbsSym].push(cb);\n          },\n        });\n      }\n\n      async #handleFallbackScript(\n        errorCbs: ErrorCb[],\n        loadCbs: LoadCb[],\n        elemId: string,\n        scriptUrl: string,\n      ) {\n        this.logger.debug('Trying to load DescopeUI from a fallback URL');\n        const fallbackScriptEle = setupScript(elemId);\n        document.body.append(fallbackScriptEle);\n\n        fallbackScriptEle.addEventListener('error', () => {\n          errorCbs.forEach((cb: ErrorCb) =>\n            cb(\n              `Cannot load DescopeUI from fallback URL, Make sure this URL is valid and return the correct script: \"${fallbackScriptEle.src}\"`,\n            ),\n          );\n        });\n\n        fallbackScriptEle.addEventListener('load', () => {\n          loadCbs.forEach((cb: LoadCb) => cb());\n        });\n\n        fallbackScriptEle.src = generateScriptUrl(\n          scriptUrl,\n          await this.#getComponentsVersion(),\n        );\n      }\n\n      #registerEvents(scriptEle: HTMLScriptElement) {\n        scriptEle.addEventListener('error', () => {\n          scriptEle[this.#errorCbsSym].forEach((cb: ErrorCb) =>\n            cb(\n              `Cannot load DescopeUI from main URL, Make sure this URL is valid and return the correct script: \"${scriptEle.src}\"`,\n            ),\n          );\n\n          // in case we could not load DescopeUI from the main URL, we are trying to load it from a fallback URL\n          this.#handleFallbackScript(\n            [\n              // we are adding a second fallback\n              this.#handleFallbackScript.bind(\n                this,\n                scriptEle[this.#errorCbsSym],\n                scriptEle[this.#loadCbsSym],\n                DESCOPE_UI_FALLBACK_2_SCRIPT_ID,\n                UI_COMPONENTS_FALLBACK_2_URL,\n              ),\n              ...scriptEle[this.#errorCbsSym],\n            ],\n            scriptEle[this.#loadCbsSym],\n            DESCOPE_UI_FALLBACK_SCRIPT_ID,\n            UI_COMPONENTS_FALLBACK_URL,\n          );\n        });\n\n        scriptEle.addEventListener('load', () => {\n          scriptEle[this.#loadCbsSym].forEach((cb: LoadCb) => cb());\n        });\n      }\n\n      async #getDescopeUiLoadingScript() {\n        if (!document.querySelector(`script#${DESCOPE_UI_SCRIPT_ID}`)) {\n          this.logger.debug(\n            'DescopeUI loading script does not exist, creating it',\n            this,\n          );\n\n          const scriptEle = setupScript(DESCOPE_UI_SCRIPT_ID);\n\n          document.body.append(scriptEle);\n\n          this.#exposeAlternateEvents(scriptEle);\n          this.#registerEvents(scriptEle);\n\n          scriptEle.src = generateScriptUrl(\n            this.baseCdnUrl || UI_COMPONENTS_URL,\n            await this.#getComponentsVersion(),\n          );\n        } else {\n          this.logger.debug('DescopeUI loading script already exists', this);\n        }\n\n        return document.getElementById(DESCOPE_UI_SCRIPT_ID);\n      }\n\n      #descopeUi: Promise<any>;\n\n      get descopeUi() {\n        if (!this.#descopeUi) {\n          this.#descopeUi = this.#getDescopeUi();\n        }\n\n        return this.#descopeUi;\n      }\n\n      async #loadDescopeUiComponent(componentName: string) {\n        const isComponentAlreadyDefined = !!customElements.get(componentName);\n\n        if (isComponentAlreadyDefined) {\n          this.logger.debug(\n            `Loading component \"${componentName}\" is skipped as it is already defined`,\n          );\n          return undefined;\n        }\n\n        const descopeUI = await this.descopeUi;\n\n        if (!descopeUI[componentName]) {\n          this.logger.error(\n            `Cannot load UI component \"${componentName}\"`,\n            `Descope UI does not have a component named \"${componentName}\", available components are: \"${Object.keys(\n              descopeUI,\n            ).join(', ')}\"`,\n          );\n          return undefined;\n        }\n\n        try {\n          // eslint-disable-next-line @typescript-eslint/return-await\n          return await descopeUI[componentName]();\n        } catch (e) {\n          // this error is thrown when trying to register a component which is already registered\n          // when running 2 flows on the same page, it might happen that the register fn is called twice\n          // in case it happens, we are silently ignore the error\n          if (e.name === 'NotSupportedError') {\n            // eslint-disable-next-line no-console\n            console.debug(\n              `Encountered an error while attempting to define the \"${componentName}\" component, it is likely that this component is already defined`,\n            );\n          } else {\n            throw e;\n          }\n        }\n\n        return undefined;\n      }\n\n      async loadDescopeUiComponents(\n        templateOrComponentNames: HTMLTemplateElement | string[],\n      ) {\n        const descopeUiComponentsList = Array.isArray(templateOrComponentNames)\n          ? templateOrComponentNames\n          : getDescopeUiComponentsList(templateOrComponentNames);\n\n        return Promise.all(\n          descopeUiComponentsList.map((componentName: string) =>\n            this.#loadDescopeUiComponent(componentName),\n          ),\n        );\n      }\n\n      #getDescopeUi() {\n        return new Promise((res) => {\n          if (globalThis.DescopeUI) {\n            res(globalThis.DescopeUI);\n          }\n\n          this.#getDescopeUiLoadingScript().then((scriptEle) => {\n            // eslint-disable-next-line no-param-reassign\n            scriptEle!.onerror = this.logger.error;\n            // eslint-disable-next-line no-param-reassign\n            scriptEle!.onload = () => {\n              this.logger.debug('DescopeUI was loaded');\n              res(globalThis.DescopeUI);\n            };\n\n            // in case the load event was dispatched before we registered, we have a fallback\n            setTimeout(() => {\n              if (globalThis.DescopeUI) {\n                res(globalThis.DescopeUI);\n              }\n            });\n          });\n        });\n      }\n\n      get baseCdnUrl() {\n        return this.getAttribute('base-cdn-url');\n      }\n    };\n  },\n);\n"],"names":["createSingletonMixin","compose","loggerMixin","configMixin","__classPrivateFieldGet","__classPrivateFieldSet","getDescopeUiComponentsList","setupScript","generateScriptUrl","DESCOPE_UI_FALLBACK_2_SCRIPT_ID","UI_COMPONENTS_FALLBACK_2_URL","DESCOPE_UI_FALLBACK_SCRIPT_ID","UI_COMPONENTS_FALLBACK_URL","DESCOPE_UI_SCRIPT_ID","UI_COMPONENTS_URL"],"mappings":"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"}
+{"version":3,"file":"descopeUiMixin.js","sources":["../../../../src/mixins/descopeUiMixin/descopeUiMixin.ts"],"sourcesContent":["import { compose, createSingletonMixin } from '@descope/sdk-helpers';\nimport { configMixin } from '../configMixin';\nimport { injectNpmLibMixin } from '../injectNpmLibMixin';\nimport { loggerMixin } from '../loggerMixin';\nimport { getDescopeUiComponentsList } from './helpers';\nimport {\n  JS_FILE_PATH,\n  LOCAL_STORAGE_OVERRIDE,\n  WEB_COMPONENTS_UI_LIB_NAME,\n} from './constants';\n\nexport const descopeUiMixin = createSingletonMixin(\n  <T extends CustomElementConstructor>(superclass: T) => {\n    const BaseClass = compose(\n      loggerMixin,\n      configMixin,\n      injectNpmLibMixin,\n    )(superclass);\n\n    return class DescopeUiMixinClass extends BaseClass {\n      // eslint-disable-next-line class-methods-use-this\n      async #getComponentsVersion() {\n        const config = await this.config;\n        const componentsVersion = config?.projectConfig?.componentsVersion;\n\n        if (!componentsVersion) {\n          this.logger.error('Could not get components version');\n        } else {\n          this.logger.debug(`Got component version \"${componentsVersion}\"`);\n        }\n\n        return componentsVersion;\n      }\n\n      #descopeUi: Promise<any>;\n\n      get descopeUi() {\n        if (!this.#descopeUi) {\n          this.#descopeUi = this.#getDescopeUi();\n        }\n\n        return this.#descopeUi;\n      }\n\n      async #loadDescopeUiComponent(componentName: string) {\n        const isComponentAlreadyDefined = !!customElements.get(componentName);\n\n        if (isComponentAlreadyDefined) {\n          this.logger.debug(\n            `Loading component \"${componentName}\" is skipped as it is already defined`,\n          );\n          return undefined;\n        }\n\n        const descopeUI = await this.descopeUi;\n\n        if (!descopeUI[componentName]) {\n          this.logger.error(\n            `Cannot load UI component \"${componentName}\"`,\n            `Descope UI does not have a component named \"${componentName}\", available components are: \"${Object.keys(\n              descopeUI,\n            ).join(', ')}\"`,\n          );\n          return undefined;\n        }\n\n        try {\n          // eslint-disable-next-line @typescript-eslint/return-await\n          return await descopeUI[componentName]();\n        } catch (e) {\n          // this error is thrown when trying to register a component which is already registered\n          // when running 2 flows on the same page, it might happen that the register fn is called twice\n          // in case it happens, we are silently ignore the error\n          if (e.name === 'NotSupportedError') {\n            // eslint-disable-next-line no-console\n            console.debug(\n              `Encountered an error while attempting to define the \"${componentName}\" component, it is likely that this component is already defined`,\n            );\n          } else {\n            throw e;\n          }\n        }\n\n        return undefined;\n      }\n\n      async #getDescopeUi() {\n        if (globalThis.DescopeUI) {\n          return globalThis.DescopeUI;\n        }\n\n        try {\n          await this.injectNpmLib(\n            WEB_COMPONENTS_UI_LIB_NAME,\n            await this.#getComponentsVersion(),\n            JS_FILE_PATH,\n            [LOCAL_STORAGE_OVERRIDE],\n          );\n          this.logger.debug('DescopeUI was loaded');\n          return globalThis.DescopeUI;\n        } catch (error) {\n          this.logger.error(error);\n          throw new Error('DescopeUI was not loaded');\n        }\n      }\n\n      async loadDescopeUiComponents(\n        templateOrComponentNames: HTMLTemplateElement | string[],\n      ) {\n        const descopeUiComponentsList = Array.isArray(templateOrComponentNames)\n          ? templateOrComponentNames\n          : getDescopeUiComponentsList(templateOrComponentNames);\n\n        return Promise.all(\n          descopeUiComponentsList.map((componentName: string) =>\n            this.#loadDescopeUiComponent(componentName),\n          ),\n        );\n      }\n    };\n  },\n);\n"],"names":["createSingletonMixin","compose","loggerMixin","configMixin","injectNpmLibMixin","__classPrivateFieldGet","__classPrivateFieldSet","getDescopeUiComponentsList","WEB_COMPONENTS_UI_LIB_NAME","JS_FILE_PATH","LOCAL_STORAGE_OVERRIDE"],"mappings":"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"}

package/dist/cjs/mixins/descopeUiMixin/helpers.js

@@ -1,18 +1,8 @@
 'use strict';
 
-var constants = require('./constants.js');
-
-const setupScript = (id) => {
-    const scriptEle = document.createElement('script');
-    scriptEle.id = id;
-    return scriptEle;
-};
-const generateScriptUrl = (urlTemplate, componentsVersion) => urlTemplate.replace(constants.UI_COMPONENTS_URL_VERSION_PLACEHOLDER, componentsVersion);
 const getDescopeUiComponentsList = (template) => [
     ...Array.from(template.content.querySelectorAll('*')).reduce((acc, el) => el.localName.startsWith('descope-') ? acc.add(el.localName) : acc, new Set()),
 ];
 
-exports.generateScriptUrl = generateScriptUrl;
 exports.getDescopeUiComponentsList = getDescopeUiComponentsList;
-exports.setupScript = setupScript;
 //# sourceMappingURL=helpers.js.map

package/dist/cjs/mixins/descopeUiMixin/helpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.js","sources":["../../../../src/mixins/descopeUiMixin/helpers.ts"],"sourcesContent":["import { UI_COMPONENTS_URL_VERSION_PLACEHOLDER } from './constants';\n\nexport const setupScript = (id: string) => {\n  const scriptEle = document.createElement('script');\n  scriptEle.id = id;\n\n  return scriptEle;\n};\n\nexport const generateScriptUrl = (\n  urlTemplate: string,\n  componentsVersion: string,\n) =>\n  urlTemplate.replace(UI_COMPONENTS_URL_VERSION_PLACEHOLDER, componentsVersion);\n\nexport const getDescopeUiComponentsList = (template: HTMLTemplateElement) => [\n  ...Array.from(template.content.querySelectorAll('*')).reduce<Set<string>>(\n    (acc, el: Element) =>\n      el.localName.startsWith('descope-') ? acc.add(el.localName) : acc,\n    new Set(),\n  ),\n];\n"],"names":["UI_COMPONENTS_URL_VERSION_PLACEHOLDER"],"mappings":";;;;AAEa,MAAA,WAAW,GAAG,CAAC,EAAU,KAAI;IACxC,MAAM,SAAS,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;AACnD,IAAA,SAAS,CAAC,EAAE,GAAG,EAAE,CAAC;AAElB,IAAA,OAAO,SAAS,CAAC;AACnB,EAAE;AAEW,MAAA,iBAAiB,GAAG,CAC/B,WAAmB,EACnB,iBAAyB,KAEzB,WAAW,CAAC,OAAO,CAACA,+CAAqC,EAAE,iBAAiB,EAAE;MAEnE,0BAA0B,GAAG,CAAC,QAA6B,KAAK;IAC3E,GAAG,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC,MAAM,CAC1D,CAAC,GAAG,EAAE,EAAW,KACf,EAAE,CAAC,SAAS,CAAC,UAAU,CAAC,UAAU,CAAC,GAAG,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,SAAS,CAAC,GAAG,GAAG,EACnE,IAAI,GAAG,EAAE,CACV;;;;;;;"}
+{"version":3,"file":"helpers.js","sources":["../../../../src/mixins/descopeUiMixin/helpers.ts"],"sourcesContent":["export const setupScript = (id: string) => {\n  const scriptEle = document.createElement('script');\n  scriptEle.id = id;\n\n  return scriptEle;\n};\n\nexport const getDescopeUiComponentsList = (template: HTMLTemplateElement) => [\n  ...Array.from(template.content.querySelectorAll('*')).reduce<Set<string>>(\n    (acc, el: Element) =>\n      el.localName.startsWith('descope-') ? acc.add(el.localName) : acc,\n    new Set(),\n  ),\n];\n"],"names":[],"mappings":";;MAOa,0BAA0B,GAAG,CAAC,QAA6B,KAAK;IAC3E,GAAG,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,gBAAgB,CAAC,GAAG,CAAC,CAAC,CAAC,MAAM,CAC1D,CAAC,GAAG,EAAE,EAAW,KACf,EAAE,CAAC,SAAS,CAAC,UAAU,CAAC,UAAU,CAAC,GAAG,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,SAAS,CAAC,GAAG,GAAG,EACnE,IAAI,GAAG,EAAE,CACV;;;;;"}

package/dist/cjs/mixins/initElementMixin.js

@@ -1,21 +1,23 @@
 'use strict';
 
 var sdkHelpers = require('@descope/sdk-helpers');
+var injectStyleMixin = require('./injectStyleMixin.js');
+var redux = require('redux');
 
 const CONTENT_ROOT_ID = 'content-root';
 const ROOT_ID = 'root';
-const initElementMixin = sdkHelpers.createSingletonMixin((superclass) => class InitElementMixinClass extends superclass {
-    constructor(...rest) {
-        var _a, _b, _c;
-        var _d;
-        super(...rest);
-        this.attachShadow({ mode: 'open' }).innerHTML = `
+const initElementMixin = sdkHelpers.createSingletonMixin((superclass) => {
+    const BaseClass = redux.compose(injectStyleMixin.injectStyleMixin)(superclass);
+    return class InitElementMixinClass extends BaseClass {
+        constructor(...rest) {
+            var _a, _b;
+            super(...rest);
+            this.attachShadow({ mode: 'open' }).innerHTML = `
           <div id="${ROOT_ID}">
             <div id="${CONTENT_ROOT_ID}"></div>
           </div>
           `;
-        const sheet = new CSSStyleSheet();
-        sheet.replaceSync(`
+            this.injectStyle(`
             #${ROOT_ID}, #${CONTENT_ROOT_ID} {
               height: 100%;
             }
@@ -24,15 +26,11 @@ const initElementMixin = sdkHelpers.createSingletonMixin((superclass) => class I
               height: fit-content;
             }
           `);
-        (_a = (_d = this.shadowRoot).adoptedStyleSheets) !== null && _a !== void 0 ? _a : (_d.adoptedStyleSheets = []);
-        this.shadowRoot.adoptedStyleSheets = [
-            ...this.shadowRoot.adoptedStyleSheets,
-            sheet,
-        ];
-        this.contentRootElement =
-            (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.getElementById(CONTENT_ROOT_ID);
-        this.rootElement = (_c = this.shadowRoot) === null || _c === void 0 ? void 0 : _c.getElementById(ROOT_ID);
-    }
+            this.contentRootElement =
+                (_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.getElementById(CONTENT_ROOT_ID);
+            this.rootElement = (_b = this.shadowRoot) === null || _b === void 0 ? void 0 : _b.getElementById(ROOT_ID);
+        }
+    };
 });
 
 exports.initElementMixin = initElementMixin;

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

@@ -1 +1 @@
-{"version":3,"file":"initElementMixin.js","sources":["../../../src/mixins/initElementMixin.ts"],"sourcesContent":["import { createSingletonMixin } from '@descope/sdk-helpers';\n\nconst CONTENT_ROOT_ID = 'content-root';\nconst ROOT_ID = 'root';\n\nexport const initElementMixin = createSingletonMixin(\n  <T extends CustomElementConstructor>(superclass: T) =>\n    class InitElementMixinClass extends superclass {\n      // the content of contentRootElement is being replaced dynamically\n      // do not place content which is not dynamic inside\n      contentRootElement: HTMLElement;\n\n      rootElement: HTMLElement;\n\n      constructor(...rest) {\n        super(...rest);\n\n        this.attachShadow({ mode: 'open' }).innerHTML = `\n          <div id=\"${ROOT_ID}\">\n            <div id=\"${CONTENT_ROOT_ID}\"></div>\n          </div>\n          `;\n\n        const sheet = new CSSStyleSheet();\n        sheet.replaceSync(`\n            #${ROOT_ID}, #${CONTENT_ROOT_ID} {\n              height: 100%;\n            }\n            #${ROOT_ID} {\n              position: relative;\n              height: fit-content;\n            }\n          `);\n\n        this.shadowRoot.adoptedStyleSheets ??= [];\n        this.shadowRoot.adoptedStyleSheets = [\n          ...this.shadowRoot.adoptedStyleSheets,\n          sheet,\n        ];\n\n        this.contentRootElement =\n          this.shadowRoot?.getElementById(CONTENT_ROOT_ID)!;\n        this.rootElement = this.shadowRoot?.getElementById(ROOT_ID)!;\n      }\n    },\n);\n"],"names":["createSingletonMixin"],"mappings":";;;;AAEA,MAAM,eAAe,GAAG,cAAc,CAAC;AACvC,MAAM,OAAO,GAAG,MAAM,CAAC;AAEhB,MAAM,gBAAgB,GAAGA,+BAAoB,CAClD,CAAqC,UAAa,KAChD,MAAM,qBAAsB,SAAQ,UAAU,CAAA;AAO5C,IAAA,WAAA,CAAY,GAAG,IAAI,EAAA;;;AACjB,QAAA,KAAK,CAAC,GAAG,IAAI,CAAC,CAAC;QAEf,IAAI,CAAC,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,CAAC,SAAS,GAAG,CAAA;qBACnC,OAAO,CAAA;uBACL,eAAe,CAAA;;WAE3B,CAAC;AAEJ,QAAA,MAAM,KAAK,GAAG,IAAI,aAAa,EAAE,CAAC;QAClC,KAAK,CAAC,WAAW,CAAC,CAAA;AACX,aAAA,EAAA,OAAO,MAAM,eAAe,CAAA;;;eAG5B,OAAO,CAAA;;;;AAIX,UAAA,CAAA,CAAC,CAAC;QAEL,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,IAAI,CAAC,UAAU,EAAC,kBAAkB,MAAlB,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,IAAA,EAAA,CAAA,kBAAkB,GAAK,EAAE,CAAC,CAAA;AAC1C,QAAA,IAAI,CAAC,UAAU,CAAC,kBAAkB,GAAG;AACnC,YAAA,GAAG,IAAI,CAAC,UAAU,CAAC,kBAAkB;YACrC,KAAK;SACN,CAAC;AAEF,QAAA,IAAI,CAAC,kBAAkB;YACrB,CAAA,EAAA,GAAA,IAAI,CAAC,UAAU,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAE,cAAc,CAAC,eAAe,CAAE,CAAC;AACpD,QAAA,IAAI,CAAC,WAAW,GAAG,CAAA,EAAA,GAAA,IAAI,CAAC,UAAU,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAE,cAAc,CAAC,OAAO,CAAE,CAAC;KAC9D;AACF,CAAA;;;;"}
+{"version":3,"file":"initElementMixin.js","sources":["../../../src/mixins/initElementMixin.ts"],"sourcesContent":["import { createSingletonMixin } from '@descope/sdk-helpers';\nimport { injectStyleMixin } from './injectStyleMixin';\nimport { compose } from 'redux';\n\nconst CONTENT_ROOT_ID = 'content-root';\nconst ROOT_ID = 'root';\n\nexport const initElementMixin = createSingletonMixin(\n  <T extends CustomElementConstructor>(superclass: T) => {\n    const BaseClass = compose(injectStyleMixin)(superclass);\n    return class InitElementMixinClass extends BaseClass {\n      // the content of contentRootElement is being replaced dynamically\n      // do not place content which is not dynamic inside\n      contentRootElement: HTMLElement;\n\n      rootElement: HTMLElement;\n\n      constructor(...rest) {\n        super(...rest);\n\n        this.attachShadow({ mode: 'open' }).innerHTML = `\n          <div id=\"${ROOT_ID}\">\n            <div id=\"${CONTENT_ROOT_ID}\"></div>\n          </div>\n          `;\n\n        this.injectStyle(`\n            #${ROOT_ID}, #${CONTENT_ROOT_ID} {\n              height: 100%;\n            }\n            #${ROOT_ID} {\n              position: relative;\n              height: fit-content;\n            }\n          `);\n\n        this.contentRootElement =\n          this.shadowRoot?.getElementById(CONTENT_ROOT_ID)!;\n        this.rootElement = this.shadowRoot?.getElementById(ROOT_ID)!;\n      }\n    };\n  },\n);\n"],"names":["createSingletonMixin","compose","injectStyleMixin"],"mappings":";;;;;;AAIA,MAAM,eAAe,GAAG,cAAc,CAAC;AACvC,MAAM,OAAO,GAAG,MAAM,CAAC;MAEV,gBAAgB,GAAGA,+BAAoB,CAClD,CAAqC,UAAa,KAAI;IACpD,MAAM,SAAS,GAAGC,aAAO,CAACC,iCAAgB,CAAC,CAAC,UAAU,CAAC,CAAC;IACxD,OAAO,MAAM,qBAAsB,SAAQ,SAAS,CAAA;AAOlD,QAAA,WAAA,CAAY,GAAG,IAAI,EAAA;;AACjB,YAAA,KAAK,CAAC,GAAG,IAAI,CAAC,CAAC;YAEf,IAAI,CAAC,YAAY,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,CAAC,SAAS,GAAG,CAAA;qBACnC,OAAO,CAAA;uBACL,eAAe,CAAA;;WAE3B,CAAC;YAEJ,IAAI,CAAC,WAAW,CAAC,CAAA;AACV,aAAA,EAAA,OAAO,MAAM,eAAe,CAAA;;;eAG5B,OAAO,CAAA;;;;AAIX,UAAA,CAAA,CAAC,CAAC;AAEL,YAAA,IAAI,CAAC,kBAAkB;gBACrB,CAAA,EAAA,GAAA,IAAI,CAAC,UAAU,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAE,cAAc,CAAC,eAAe,CAAE,CAAC;AACpD,YAAA,IAAI,CAAC,WAAW,GAAG,CAAA,EAAA,GAAA,IAAI,CAAC,UAAU,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAE,cAAc,CAAC,OAAO,CAAE,CAAC;SAC9D;KACF,CAAC;AACJ,CAAC;;;;"}

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

@@ -0,0 +1,10 @@
+'use strict';
+
+const BASE_URLS = [
+    'https://descopecdn.com',
+    'https://static.descope.com',
+    'https://cdn.jsdelivr.net',
+];
+
+exports.BASE_URLS = BASE_URLS;
+//# sourceMappingURL=constants.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../../../src/mixins/injectNpmLibMixin/constants.ts"],"sourcesContent":["export const BASE_URLS = [\n  'https://descopecdn.com',\n  'https://static.descope.com',\n  'https://cdn.jsdelivr.net',\n];\n"],"names":[],"mappings":";;AAAa,MAAA,SAAS,GAAG;IACvB,wBAAwB;IACxB,4BAA4B;IAC5B,0BAA0B;;;;;"}