@nylas/web-elements 1.0.0-prealpha1

package/dist/cjs/nylas-if-state_3.cjs.entry.js

@@ -0,0 +1,409 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-34e64e2d.js');
+const registerComponent = require('./register-component-f76b61a6.js');
+const utils = require('./utils-f91d4c73.js');
+const index_es = require('./index.es-e78884f5.js');
+const mailboxStore = require('./mailbox-store-0b1636fa.js');
+require('./index-e869130c.js');
+
+const nylasIfStateCss = ":host{display:block}div{height:inherit}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.fade-in{animation:fadeIn 1.5s}.fade-out{animation:fadeOut 1.5s}@keyframes slideIn{0%{transform:translateY(100%)}100%{transform:translateY(0)}}@keyframes slideOut{0%{transform:translateY(0)}100%{transform:translateY(100%)}}.slide-in{animation:slideIn 1.5s}.slide-out{animation:slideOut 1.5s}@keyframes swipeIn{0%{transform:translateX(100%)}100%{transform:translateX(0)}}@keyframes swipeOut{0%{transform:translateX(0)}100%{transform:translateX(100%)}}.swipe-in{animation:swipeIn 1.5s}.swipe-out{animation:swipeOut 1.5s}";
+const NylasIfStateStyle0 = nylasIfStateCss;
+
+var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
+        r = Reflect.decorate(decorators, target, key, desc);
+    else
+        for (var i = decorators.length - 1; i >= 0; i--)
+            if (d = decorators[i])
+                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata$1 = (undefined && undefined.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
+        return Reflect.metadata(k, v);
+};
+const NylasIfState = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.state = undefined;
+        this.isStateSet = undefined;
+        this.isBoolean = undefined;
+        this.getStore = undefined;
+        this.transition = 'none';
+        this.show = false;
+        this.classes = {};
+        this.initTransition = this.initTransition.bind(this);
+    }
+    connectedCallback() { }
+    disconnectedCallback() { }
+    async componentWillLoad() {
+        utils.debug(`[nylas-if-state] Component will load`);
+        this.watchStore(true);
+    }
+    async componentDidLoad() {
+        utils.debug(`[nylas-if-state] Component did load`);
+    }
+    shouldRender() {
+        const [storeName, stateName] = this.state ? this.state.split('.') : ['', ''];
+        const getStore = this.getStore;
+        if (typeof getStore === 'undefined') {
+            utils.debug(`[nylas-if-state] Store name: ${storeName} | State name: ${stateName}`, { getStore });
+            return false;
+        }
+        const store = getStore(storeName);
+        if (typeof store === 'undefined') {
+            utils.debug(`[nylas-if-state] Store name: ${storeName} | State name: ${stateName}`, { store });
+            return false;
+        }
+        const state = store.state[stateName];
+        if (typeof this.isStateSet === 'boolean') {
+            return ((this.isStateSet === false && (typeof state === 'undefined' || state === null || state.length === 0)) ||
+                (this.isStateSet === true && typeof state !== 'undefined' && state !== null));
+        }
+        if (typeof this.isBoolean === 'boolean') {
+            return (this.isBoolean === true && typeof state !== 'undefined' && state === true) || (this.isBoolean === false && typeof state !== 'undefined' && state === false);
+        }
+        return false;
+    }
+    onGetStoreChange() {
+        this.watchStore(true);
+    }
+    watchStore(immediate = false) {
+        const [storeName, stateName] = this.state ? this.state.split('.') : ['', ''];
+        const getStore = this.getStore;
+        if (typeof getStore === 'undefined') {
+            utils.debug(`[nylas-if-state] Store name: ${storeName} | State name: ${stateName}`, { getStore });
+            return null;
+        }
+        const store = getStore(storeName);
+        if (typeof store === 'undefined') {
+            utils.debug(`[nylas-if-state] Store name: ${storeName} | State name: ${stateName}`, { store });
+            return null;
+        }
+        if (immediate === true) {
+            this.initTransition();
+        }
+        store.onChange(stateName, this.initTransition);
+    }
+    initTransition() {
+        const show = this.shouldRender();
+        switch (this.transition) {
+            case 'fade':
+            case 'slide':
+            case 'swipe':
+                this.classes = {
+                    [`${this.transition}-in`]: show,
+                    [`${this.transition}-out`]: !show,
+                };
+                setTimeout(() => {
+                    this.show = show;
+                }, 150);
+                break;
+            default:
+                this.show = this.shouldRender();
+                break;
+        }
+    }
+    render() {
+        return (index.h(index.Host, { key: '91d17bc89a09742106ef3bd9365c5ce48cf14e86' }, index.h("div", { key: '9d0070be4bf5d9a5f405fc4a0733e6d832fa669a', class: this.classes }, this.show && index.h("slot", null))));
+    }
+    static get watchers() { return {
+        "getStore": ["onGetStoreChange"]
+    }; }
+};
+__decorate$1([
+    registerComponent.RegisterComponent({
+        name: 'nylas-if-state',
+        getStoresToProp: 'getStore',
+        fireRegisterEvent: true,
+    }),
+    __metadata$1("design:type", Function),
+    __metadata$1("design:paramtypes", []),
+    __metadata$1("design:returntype", void 0)
+], NylasIfState.prototype, "render", null);
+NylasIfState.style = NylasIfStateStyle0;
+
+const nylasLoginCss = ":host{font-family:'Arial', sans-serif;background:var(--nylas-color-primary-50);color:var(--nylas-color-primary-800);margin:0;display:contents}input{box-sizing:border-box}.login-container{display:flex;justify-content:center;align-items:center;height:100%}.login-box{width:300px;padding:20px;box-shadow:0 4px 8px rgba(0, 0, 0, 0.1);border-radius:var(--nylas-border-radius-2x);background:var(--nylas-color-primary-50);text-align:center}.login-box h1{margin-top:0;margin-bottom:0.5em}.login-box p{margin-bottom:1em}.login-methods button{display:block;width:100%;padding:10px 10px 10px 50px;margin-bottom:10px;border:none;border-radius:var(--nylas-border-radius);border:1px solid var(--nylas-color-primary-300);background:var(--nylas-color-primary-100);color:var(--nylas-color-primary-600);cursor:pointer;transition:background 0.3s ease;position:relative;text-align:left}.login-methods button svg{position:absolute;left:16px;top:50%;transform:translateY(-50%)}.login-methods button:hover{background:var(--nylas-color-primary-200);}.login-form label{display:block;margin-bottom:5px;text-align:left}.login-form input{width:100%;padding:10px;margin-bottom:10px;border:1px solid var(--nylas-color-primary-200);border-radius:var(--nylas-border-radius);background:var(--nylas-color-primary-100);color:var(--nylas-color-primary-800);}.login-form button{width:100%;padding:10px;border:none;border-radius:var(--nylas-border-radius);background:var(--nylas-color-primary-500);color:var(--nylas-color-primary-50);cursor:pointer;transition:background 0.3s ease}.login-form button:hover{background:var(--nylas-color-primary-600);}";
+const NylasLoginStyle0 = nylasLoginCss;
+
+var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
+        r = Reflect.decorate(decorators, target, key, desc);
+    else
+        for (var i = decorators.length - 1; i >= 0; i--)
+            if (d = decorators[i])
+                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (undefined && undefined.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
+        return Reflect.metadata(k, v);
+};
+const NylasLogin = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.buttonClick = index.createEvent(this, "buttonClick", 7);
+        this._handleLoginRedirect = async () => {
+            const url = await this.nylasConnector?.auth.getHostedAuthRedirectURL(this.scopes);
+            const event = this.buttonClick.emit({ url });
+            if (event.defaultPrevented) {
+                return;
+            }
+            if (url) {
+                window.location.href = url;
+            }
+        };
+        this._onGoogleButtonClick = async (event) => {
+            event.preventDefault();
+            const url = await this.nylasConnector?.auth.getHostedAuthRedirectURL(this.scopes, undefined, 'google');
+            if (url) {
+                window.location.href = url;
+            }
+        };
+        this._onMicrosoftButtonClick = async (event) => {
+            event.preventDefault();
+            const url = await this.nylasConnector?.auth.getHostedAuthRedirectURL(this.scopes, undefined, 'microsoft');
+            if (url) {
+                window.location.href = url;
+            }
+        };
+        this._onFormSubmit = async (event) => {
+            event.preventDefault();
+            const url = await this.nylasConnector?.auth.getHostedAuthRedirectURL(this.scopes, this.email);
+            if (url) {
+                window.location.href = url;
+            }
+        };
+        this.isAuthenticated = false;
+        this.nylasConnector = undefined;
+        this.scopes = undefined;
+        this.loginMethod = 'redirect';
+        this.companyName = 'Nylas';
+        this.logoUrl = 'https://www.nylas.com/wp-content/uploads/main-logo.svg';
+        this.logoWidth = 'min-content';
+        this.providers = 'google,microsoft';
+        this.buttonText = 'Login';
+        this.email = '';
+    }
+    connectedCallback() { }
+    disconnectedCallback() { }
+    componentWillLoad() { }
+    async componentDidLoad() {
+        const exchangedToken = await this.nylasConnector?.auth.manageHostedAuthCodeExchange(window.location.href);
+        if (exchangedToken) {
+            window.history.replaceState({}, document.title, window.location.pathname);
+        }
+    }
+    render() {
+        const splitProviders = this.providers?.split(',') || [];
+        return (index.h(index.Host, { key: '734ebbbe5cf2ba3c08943a665a4724f59705da5b' }, this.loginMethod === 'redirect' && (index.h("div", { class: "redirect-container" }, !this.isAuthenticated && (index.h("sp-button", { part: "button", onClick: this._handleLoginRedirect }, this.buttonText)))), this.loginMethod === 'emebded' && (index.h("main", { class: "login-container" }, index.h("section", { class: "login-box" }, index.h("header", null, index.h("img", { src: this.logoUrl, alt: `${this.companyName} logo`, width: '100%', style: {
+                minWidth: this.logoWidth,
+            } }), index.h("h1", null, "Welcome")), index.h("p", null, "Log in to your account to continue to ", this.companyName), index.h("div", { class: "login-methods" }, splitProviders.includes('google') && (index.h("button", { class: "login-google", onClick: this._onGoogleButtonClick }, index.h("svg", { xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", role: "img", width: "18", height: "18", preserveAspectRatio: "xMidYMid meet", viewBox: "0 0 256 262" }, index.h("path", { fill: "#4285F4", d: "M255.6 131.6c0-8.2-.8-16.2-2.2-23.9H130v45.3h70.3c-3 16.1-12.4 29.7-26.3 38.9v32.4h42.6c25-23 39.4-56.7 39.4-97.7z" }), index.h("path", { fill: "#34A853", d: "M130 262c35.3 0 64.9-11.7 86.5-31.7l-42.6-32.4c-11.7 7.9-26.7 12.6-43.9 12.6-33.7 0-62.3-22.7-72.5-53.4H14.5v33.3A130.3 130.3 0 00130 262z" }), index.h("path", { fill: "#FBBC05", d: "M57.5 158.1a72.7 72.7 0 010-54.2V70.6H14.5a130.4 130.4 0 000 120.8l43-33.3z" }), index.h("path", { fill: "#EA4335", d: "M130 51.6c19 0 36 6.5 49.4 19.2l37-36C195 13.1 165.2 0 130 0A130.3 130.3 0 0014.5 70.6l43 33.3c10.2-30.7 38.8-53.3 72.5-53.3z" })), "Continue with Google")), splitProviders.includes('microsoft') && (index.h("button", { class: "login-microsoft", onClick: this._onMicrosoftButtonClick }, index.h("svg", { xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", role: "img", width: "18", height: "18", preserveAspectRatio: "xMidYMid meet", viewBox: "0 0 448 512" }, index.h("path", { fill: "#F3F3F3", d: "M0 32v192h192V32H0zm256 0v192h192V32H256zm192 256v192h-192V288h192zM0 224v192h192V224H0z" })), "Continue with Microsoft"))), index.h("form", { class: "login-form", method: "POST", onSubmit: this._onFormSubmit }, index.h("label", { htmlFor: "email" }, "Email"), index.h("input", { type: "email", id: "email", name: "email", required: true, value: this.email }), index.h("button", { type: "submit" }, "Next")))))));
+    }
+};
+__decorate([
+    registerComponent.RegisterComponent({
+        name: 'nylas-login',
+        connectorToProp: 'nylasConnector',
+        stateToProps: new Map([['auth.isAuthenticated', 'isAuthenticated']]),
+        fireRegisterEvent: true,
+    }),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], NylasLogin.prototype, "render", null);
+NylasLogin.style = NylasLoginStyle0;
+
+class NylasMailboxConnector {
+    constructor(router, nylasAuth, nylasAuthStore, nylasStore) {
+        this.router = router;
+        this.nylasAuth = nylasAuth;
+        this.nylasAuthStore = nylasAuthStore;
+        this.nylasMailboxStore = nylasStore;
+    }
+    init() {
+        utils.debug('NylasMailboxConnector init');
+    }
+    get mailboxStore() {
+        return this.nylasMailboxStore;
+    }
+    get authStore() {
+        return this.nylasAuthStore;
+    }
+    get auth() {
+        if (this._authConnector) {
+            return this._authConnector;
+        }
+        this._authConnector = new mailboxStore.NylasAuthConnector(this.nylasAuth, this.nylasAuthStore);
+        return this._authConnector;
+    }
+    get threads() {
+        if (this._threadConnector) {
+            return this._threadConnector;
+        }
+        this._threadConnector = new mailboxStore.NylasThreadsConnector(this.nylasAuth, this.nylasAuthStore, this.nylasMailboxStore, this.router);
+        return this._threadConnector;
+    }
+    get messages() {
+        if (this._messageConnector) {
+            return this._messageConnector;
+        }
+        this._messageConnector = new mailboxStore.NylasMessagesConnector(this.nylasAuth, this.nylasAuthStore, this.nylasMailboxStore);
+        return this._messageConnector;
+    }
+    get folders() {
+        if (this._foldersConnector) {
+            return this._foldersConnector;
+        }
+        this._foldersConnector = new mailboxStore.NylasFoldersConnector(this.nylasAuth, this.nylasAuthStore, this.nylasMailboxStore);
+        return this._foldersConnector;
+    }
+    getAuth() {
+        return this.nylasAuth;
+    }
+    resetStores() {
+        this.nylasMailboxStore.reset();
+        this.nylasAuthStore.reset();
+    }
+    async logout() {
+        await this.nylasAuth.logout();
+        this.resetStores();
+    }
+}
+
+const nylasMailboxCss = ":host{display:contents}";
+const NylasMailboxStyle0 = nylasMailboxCss;
+
+const NylasMailbox = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.init = index.createEvent(this, "init", 7);
+        this.loggedIn = index.createEvent(this, "loggedIn", 7);
+        this.loggedOut = index.createEvent(this, "loggedOut", 7);
+        this.handleAuthChange = async (isAuthenticated) => {
+            if (isAuthenticated) {
+                this.loggedIn.emit(this.host);
+            }
+            else {
+                const loggedOutEvent = this.loggedOut.emit(this.host);
+                if (!loggedOutEvent.defaultPrevented) {
+                    await this.nylasMailboxConnector?.logout();
+                }
+            }
+        };
+        this.automaticComponentRegistration = true;
+        this.eventOverrides = {};
+        this.authConfig = undefined;
+        this.defaultAuthStoreState = undefined;
+        this.defaultMailboxStoreState = undefined;
+    }
+    connectedCallback() {
+        utils.debug('[nylas-mailbox] connectedCallback');
+    }
+    async componentWillLoad() {
+        this.stores = {
+            auth: mailboxStore.CreateNylasAuthStore(this.defaultAuthStoreState),
+            mailbox: mailboxStore.CreateNylasMailboxStore(this.defaultMailboxStoreState),
+        };
+        this.baseProvider = new index_es.NylasBaseProvider(this.host, this.stores, this.automaticComponentRegistration, this.eventOverrides);
+        this.router = new mailboxStore.HashRouter();
+        this.nylasAuth = index_es.es({
+            apiUri: 'https://api.us.nylas.com',
+            elementsApiUri: 'https://elements.us.nylas.com',
+            storageType: 'indexeddb',
+            clientId: 'YOUR_CLIENT_ID',
+            defaultScopes: [],
+            redirectURI: '/',
+            ...this.authConfig,
+        });
+        const authStore = this.baseProvider?.getStore('auth');
+        if (!authStore) {
+            throw new Error('Auth store is not defined');
+        }
+        const mailboxStore$1 = this.baseProvider?.getStore('mailbox');
+        if (!mailboxStore$1) {
+            throw new Error('Mailbox store is not defined');
+        }
+        this.nylasMailboxConnector = new NylasMailboxConnector(this.router, this.nylasAuth, authStore, mailboxStore$1);
+        const initEvent = this.init.emit(this.host);
+        if (!initEvent.defaultPrevented) {
+            await this.nylasMailboxConnector?.auth.validateSession();
+        }
+        this.router?.addRouteChangeListener(`/thread/:threadId`, async (_route, _path, routeParams) => {
+            const threadId = routeParams.threadId;
+            const thread = await this.nylasMailboxConnector?.threads.getThread(threadId);
+            if (thread) {
+                this.nylasMailboxConnector?.mailboxStore.set('selectedThread', thread);
+            }
+        });
+        this.router?.addRouteChangeListener(`/`, async (_route, _path, _routeParams) => {
+            if (!authStore.state.isAuthenticated) {
+                return;
+            }
+            this.nylasMailboxConnector?.threads.unSelectThread();
+            this.nylasMailboxConnector?.folders.getFolders();
+            const queryParams = window.location.hash.split('?')[1];
+            if (queryParams) {
+                const params = new URLSearchParams(queryParams);
+                const searchQuery = params.get('query');
+                if (searchQuery) {
+                    await this.nylasMailboxConnector?.threads.getThreads({
+                        search_query_native: searchQuery,
+                        page_token: undefined,
+                    });
+                }
+            }
+            else {
+                this.nylasMailboxConnector?.threads.getThreads();
+            }
+        });
+        this.router?.init();
+        this.handleAuthChange(authStore.state.isAuthenticated);
+        this.baseProvider?.componentWillLoad(this.nylasMailboxConnector);
+    }
+    async componentDidLoad() {
+        const authStore = this.baseProvider?.getStore('auth');
+        if (!authStore) {
+            throw new Error('Auth store is not defined');
+        }
+        authStore.onChange('isAuthenticated', this.handleAuthChange);
+        this.baseProvider?.componentDidLoad();
+    }
+    componentDisconnected() {
+        this.baseProvider?.componentDisconnected();
+    }
+    async registerComponentHandler(event) {
+        this.baseProvider?.registerComponent(event.detail);
+    }
+    async unregisterComponentHandler(event) {
+        this.baseProvider?.unregisterComponent(event.detail);
+    }
+    async getMailboxStore() {
+        return this.baseProvider?.getStore('mailbox');
+    }
+    async getAuthStore() {
+        return this.baseProvider?.getStore('auth');
+    }
+    async getNylasAuth() {
+        return this.nylasAuth;
+    }
+    async getNylasMailboxConnector() {
+        return this.nylasMailboxConnector;
+    }
+    render() {
+        return (index.h(index.Host, { key: '08e87a3218f672e8944102d626b690aefb3bab3f' }, index.h("slot", { key: '05ab1ca1539a00ea199bb9cb25c8b96af8d6ab66' })));
+    }
+    get host() { return index.getElement(this); }
+};
+NylasMailbox.style = NylasMailboxStyle0;
+
+exports.nylas_if_state = NylasIfState;
+exports.nylas_login = NylasLogin;
+exports.nylas_mailbox = NylasMailbox;
+
+//# sourceMappingURL=nylas-if-state_3.cjs.entry.js.map

package/dist/cjs/nylas-if-state_3.cjs.entry.js.map

@@ -0,0 +1 @@
+{"file":"nylas-if-state.nylas-login.nylas-mailbox.entry.cjs.js","mappings":"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","names":["debug","h","Host","__decorate","RegisterComponent","NylasAuthConnector","NylasThreadsConnector","NylasMessagesConnector","NylasFoldersConnector","CreateNylasAuthStore","CreateNylasMailboxStore","NylasBaseProvider","HashRouter","NylasAuth","mailboxStore"],"sources":["src/components/nylas-if-state/nylas-if-state.css?tag=nylas-if-state&encapsulation=shadow","src/components/nylas-if-state/nylas-if-state.tsx","src/components/nylas-login/nylas-login.css?tag=nylas-login&encapsulation=shadow","src/components/nylas-login/nylas-login.tsx","src/connector/nylas-mailbox-connector/index.ts","src/components/mailbox/nylas-mailbox/nylas-mailbox.css?tag=nylas-mailbox&encapsulation=shadow","src/components/mailbox/nylas-mailbox/nylas-mailbox.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\ndiv {\n  height: inherit;\n}\n\n@keyframes fadeIn {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n@keyframes fadeOut {\n  0% {\n    opacity: 1;\n  }\n  100% {\n    opacity: 0;\n  }\n}\n.fade-in {\n  animation: fadeIn 1.5s;\n}\n\n.fade-out {\n  animation: fadeOut 1.5s;\n}\n\n@keyframes slideIn {\n  0% {\n    transform: translateY(100%);\n  }\n  100% {\n    transform: translateY(0);\n  }\n}\n\n@keyframes slideOut {\n  0% {\n    transform: translateY(0);\n  }\n  100% {\n    transform: translateY(100%);\n  }\n}\n\n.slide-in {\n  animation: slideIn 1.5s;\n}\n\n.slide-out {\n  animation: slideOut 1.5s;\n}\n\n@keyframes swipeIn {\n  0% {\n    transform: translateX(100%);\n  }\n  100% {\n    transform: translateX(0);\n  }\n}\n\n@keyframes swipeOut {\n  0% {\n    transform: translateX(0);\n  }\n  100% {\n    transform: translateX(100%);\n  }\n}\n\n.swipe-in {\n  animation: swipeIn 1.5s;\n}\n\n.swipe-out {\n  animation: swipeOut 1.5s;\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { debug } from '@/utils/utils';\nimport { Component, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { ObservableMap } from '@stencil/store';\n\nexport type Stores = Record<string, ObservableMap<any>>;\n\nexport type Transitions = 'none' | 'fade' | 'slide' | 'swipe';\n\n@Component({\n  tag: 'nylas-if-state',\n  styleUrl: 'nylas-if-state.css',\n  shadow: true,\n})\nexport class NylasIfState {\n  /**\n   * The name of the state to watch.\n   */\n  @Prop() readonly state?: string;\n  /**\n   * If true, then the component will render if the state is set (empty or not set).\n   * This prop is used with the `state` prop.\n   */\n  @Prop() readonly isStateSet?: boolean;\n  /**\n   * If true, then the component will render if the state is true.\n   * This prop is used with the `state` prop.\n   */\n  @Prop() readonly isBoolean?: boolean;\n  @Prop() readonly getStore?: <K extends keyof Stores>(name: K) => Stores[K];\n  @Prop() readonly transition: Transitions = 'none';\n\n  @State() show: boolean = false;\n  @State() classes: Record<string, boolean> = {};\n\n  constructor() {\n    this.initTransition = this.initTransition.bind(this);\n  }\n\n  connectedCallback() {}\n\n  disconnectedCallback() {}\n\n  async componentWillLoad() {\n    debug(`[nylas-if-state] Component will load`);\n    this.watchStore(true);\n  }\n\n  async componentDidLoad() {\n    debug(`[nylas-if-state] Component did load`);\n  }\n\n  private shouldRender() {\n    // If a period exists in the state name, then we need to split the state name into the store name and the state name.\n    // For example, if the state name is `nylas.scheduler.selectableDates`, then the store name is `nylas` and the state name is `scheduler.selectableDates`.\n    const [storeName, stateName] = this.state ? this.state.split('.') : ['', ''];\n    const getStore = this.getStore;\n    if (typeof getStore === 'undefined') {\n      debug(`[nylas-if-state] Store name: ${storeName} | State name: ${stateName}`, { getStore });\n      return false;\n    }\n\n    const store = getStore(storeName as keyof Stores);\n    if (typeof store === 'undefined') {\n      debug(`[nylas-if-state] Store name: ${storeName} | State name: ${stateName}`, { store });\n      return false;\n    }\n\n    const state = store.state[stateName as string];\n\n    if (typeof this.isStateSet === 'boolean') {\n      return (\n        (this.isStateSet === false && (typeof state === 'undefined' || state === null || state.length === 0)) ||\n        (this.isStateSet === true && typeof state !== 'undefined' && state !== null)\n      );\n    }\n\n    if (typeof this.isBoolean === 'boolean') {\n      return (this.isBoolean === true && typeof state !== 'undefined' && state === true) || (this.isBoolean === false && typeof state !== 'undefined' && state === false);\n    }\n\n    return false;\n  }\n\n  @Watch('getStore')\n  onGetStoreChange() {\n    this.watchStore(true);\n  }\n\n  private watchStore(immediate: boolean = false) {\n    // If a period exists in the state name, then we need to split the state name into the store name and the state name.\n    // For example, if the state name is `nylas.scheduler.selectableDates`, then the store name is `nylas` and the state name is `scheduler.selectableDates`.\n    const [storeName, stateName] = this.state ? this.state.split('.') : ['', ''];\n    const getStore = this.getStore;\n    if (typeof getStore === 'undefined') {\n      debug(`[nylas-if-state] Store name: ${storeName} | State name: ${stateName}`, { getStore });\n      return null;\n    }\n\n    const store = getStore(storeName as keyof Stores);\n    if (typeof store === 'undefined') {\n      debug(`[nylas-if-state] Store name: ${storeName} | State name: ${stateName}`, { store });\n      return null;\n    }\n\n    if (immediate === true) {\n      this.initTransition();\n    }\n\n    store.onChange(stateName as string, this.initTransition);\n  }\n\n  private initTransition() {\n    const show = this.shouldRender();\n    switch (this.transition) {\n      case 'fade':\n      case 'slide':\n      case 'swipe':\n        this.classes = {\n          [`${this.transition}-in`]: show,\n          [`${this.transition}-out`]: !show,\n        };\n        setTimeout(() => {\n          this.show = show;\n        }, 150);\n        break;\n      default:\n        this.show = this.shouldRender();\n        break;\n    }\n  }\n\n  @RegisterComponent({\n    name: 'nylas-if-state',\n    getStoresToProp: 'getStore',\n    fireRegisterEvent: true,\n  })\n  render() {\n    return (\n      <Host>\n        <div class={this.classes}>{this.show && <slot></slot>}</div>\n      </Host>\n    );\n  }\n}\n",":host {\n  font-family: 'Arial', sans-serif;\n  background: var(--nylas-color-primary-50); /* Closest to #f0f0f0 */\n  color: var(--nylas-color-primary-800); /* Closest to #333 */\n  margin: 0;\n  display: contents;\n}\n\ninput {\n  box-sizing: border-box;\n}\n\n.login-container {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 100%;\n}\n\n.login-box {\n  width: 300px;\n  padding: 20px;\n  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);\n  border-radius: var(--nylas-border-radius-2x);\n  background: var(--nylas-color-primary-50); /* Assuming white background */\n  text-align: center;\n}\n\n.login-box h1 {\n  margin-top: 0;\n  margin-bottom: 0.5em;\n}\n\n.login-box p {\n  margin-bottom: 1em;\n}\n\n.login-methods button {\n  display: block;\n  width: 100%;\n  padding: 10px 10px 10px 50px;\n  margin-bottom: 10px;\n  border: none;\n  border-radius: var(--nylas-border-radius);\n  border: 1px solid var(--nylas-color-primary-300); /* Closest to #b1b1b1 */\n  background: var(--nylas-color-primary-100); /* Closest to #f1f1f1 */\n  color: var(--nylas-color-primary-600); /* Closest to #5f6368 */\n  cursor: pointer;\n  transition: background 0.3s ease;\n  position: relative;\n  text-align: left;\n}\n\n.login-methods button svg {\n  position: absolute;\n  left: 16px;\n  top: 50%;\n  transform: translateY(-50%);\n}\n\n.login-methods button:hover {\n  background: var(--nylas-color-primary-200); /* Closest to #e2e2e2 */\n}\n\n.login-form label {\n  display: block;\n  margin-bottom: 5px;\n  text-align: left;\n}\n\n.login-form input {\n  width: 100%;\n  padding: 10px;\n  margin-bottom: 10px;\n  border: 1px solid var(--nylas-color-primary-200); /* Closest to #ddd */\n  border-radius: var(--nylas-border-radius);\n  background: var(--nylas-color-primary-100); /* Closest to #f1f1f1 */\n  color: var(--nylas-color-primary-800); /* Closest to #333 */\n}\n\n.login-form button {\n  width: 100%;\n  padding: 10px;\n  border: none;\n  border-radius: var(--nylas-border-radius);\n  background: var(--nylas-color-primary-500); /* Closest to #007bff */\n  color: var(--nylas-color-primary-50); /* Assuming white text */\n  cursor: pointer;\n  transition: background 0.3s ease;\n}\n\n.login-form button:hover {\n  background: var(--nylas-color-primary-600); /* Closest to #0056b3 */\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { NylasAuthConnectorInterface } from '@/connector/connector-interface';\nimport { Component, Event, EventEmitter, Host, Prop, State, h } from '@stencil/core';\nimport { ObservableMap } from '@stencil/store';\nimport { NylasAuthStoreState } from '../../components';\n\n@Component({\n  tag: 'nylas-login',\n  styleUrl: 'nylas-login.css',\n  shadow: true,\n})\nexport class NylasLogin {\n  @Prop() readonly isAuthenticated: boolean = false;\n  @Prop() readonly nylasConnector?: NylasAuthConnectorInterface;\n  @Prop() readonly scopes?: string[];\n  @Prop() readonly loginMethod: 'redirect' | 'emebded' = 'redirect';\n  @Prop() readonly companyName: string = 'Nylas';\n  @Prop() readonly logoUrl: string = 'https://www.nylas.com/wp-content/uploads/main-logo.svg';\n  @Prop() readonly logoWidth?: string = 'min-content';\n  @Prop() readonly providers?: string = 'google,microsoft';\n  @Prop() readonly buttonText: string = 'Login';\n\n  @Event() buttonClick!: EventEmitter<{ url?: string }>;\n\n  @State() email: string = '';\n\n  connectedCallback() {}\n\n  disconnectedCallback() {}\n\n  componentWillLoad() {}\n\n  async componentDidLoad() {\n    const exchangedToken = await this.nylasConnector?.auth.manageHostedAuthCodeExchange(window.location.href);\n    if (exchangedToken) {\n      // Remove the code query param from the user's browser url\n      window.history.replaceState({}, document.title, window.location.pathname);\n    }\n  }\n\n  private _handleLoginRedirect = async () => {\n    const url = await this.nylasConnector?.auth.getHostedAuthRedirectURL(this.scopes);\n\n    const event = this.buttonClick.emit({ url });\n    if (event.defaultPrevented) {\n      return;\n    }\n\n    if (url) {\n      window.location.href = url;\n    }\n  };\n\n  private _onGoogleButtonClick = async (event: Event) => {\n    // Prevent the form from submitting\n    event.preventDefault();\n\n    const url = await this.nylasConnector?.auth.getHostedAuthRedirectURL(this.scopes, undefined, 'google');\n    if (url) {\n      window.location.href = url;\n    }\n  };\n\n  private _onMicrosoftButtonClick = async (event: Event) => {\n    // Prevent the form from submitting\n    event.preventDefault();\n\n    const url = await this.nylasConnector?.auth.getHostedAuthRedirectURL(this.scopes, undefined, 'microsoft');\n    if (url) {\n      window.location.href = url;\n    }\n  };\n\n  private _onFormSubmit = async (event: Event) => {\n    // Prevent the form from submitting\n    event.preventDefault();\n\n    const url = await this.nylasConnector?.auth.getHostedAuthRedirectURL(this.scopes, this.email);\n    if (url) {\n      window.location.href = url;\n    }\n  };\n\n  @RegisterComponent<\n    NylasLogin,\n    NylasAuthConnectorInterface,\n    {\n      auth: ObservableMap<NylasAuthStoreState>;\n    }\n  >({\n    name: 'nylas-login',\n    connectorToProp: 'nylasConnector',\n    stateToProps: new Map([['auth.isAuthenticated', 'isAuthenticated']]),\n    fireRegisterEvent: true,\n  })\n  render() {\n    const splitProviders = this.providers?.split(',') || [];\n    return (\n      <Host>\n        {this.loginMethod === 'redirect' && (\n          <div class=\"redirect-container\">\n            {!this.isAuthenticated && (\n              <sp-button part=\"button\" onClick={this._handleLoginRedirect}>\n                {this.buttonText}\n              </sp-button>\n            )}\n          </div>\n        )}\n        {this.loginMethod === 'emebded' && (\n          <main class=\"login-container\">\n            <section class=\"login-box\">\n              <header>\n                <img\n                  src={this.logoUrl}\n                  alt={`${this.companyName} logo`}\n                  width={'100%'}\n                  style={{\n                    minWidth: this.logoWidth,\n                  }}\n                />\n                <h1>Welcome</h1>\n              </header>\n              <p>Log in to your account to continue to {this.companyName}</p>\n              <div class=\"login-methods\">\n                {splitProviders.includes('google') && (\n                  <button class=\"login-google\" onClick={this._onGoogleButtonClick}>\n                    <svg xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" role=\"img\" width=\"18\" height=\"18\" preserveAspectRatio=\"xMidYMid meet\" viewBox=\"0 0 256 262\">\n                      <path fill=\"#4285F4\" d=\"M255.6 131.6c0-8.2-.8-16.2-2.2-23.9H130v45.3h70.3c-3 16.1-12.4 29.7-26.3 38.9v32.4h42.6c25-23 39.4-56.7 39.4-97.7z\" />\n                      <path\n                        fill=\"#34A853\"\n                        d=\"M130 262c35.3 0 64.9-11.7 86.5-31.7l-42.6-32.4c-11.7 7.9-26.7 12.6-43.9 12.6-33.7 0-62.3-22.7-72.5-53.4H14.5v33.3A130.3 130.3 0 00130 262z\"\n                      />\n                      <path fill=\"#FBBC05\" d=\"M57.5 158.1a72.7 72.7 0 010-54.2V70.6H14.5a130.4 130.4 0 000 120.8l43-33.3z\" />\n                      <path fill=\"#EA4335\" d=\"M130 51.6c19 0 36 6.5 49.4 19.2l37-36C195 13.1 165.2 0 130 0A130.3 130.3 0 0014.5 70.6l43 33.3c10.2-30.7 38.8-53.3 72.5-53.3z\" />\n                    </svg>\n                    Continue with Google\n                  </button>\n                )}\n                {splitProviders.includes('microsoft') && (\n                  <button class=\"login-microsoft\" onClick={this._onMicrosoftButtonClick}>\n                    <svg xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" role=\"img\" width=\"18\" height=\"18\" preserveAspectRatio=\"xMidYMid meet\" viewBox=\"0 0 448 512\">\n                      <path fill=\"#F3F3F3\" d=\"M0 32v192h192V32H0zm256 0v192h192V32H256zm192 256v192h-192V288h192zM0 224v192h192V224H0z\" />\n                    </svg>\n                    Continue with Microsoft\n                  </button>\n                )}\n                {/* <button class=\"login-all\">View all providers</button> */}\n              </div>\n              <form class=\"login-form\" method=\"POST\" onSubmit={this._onFormSubmit}>\n                <label htmlFor=\"email\">Email</label>\n                <input type=\"email\" id=\"email\" name=\"email\" required value={this.email} />\n                <button type=\"submit\">Next</button>\n              </form>\n            </section>\n          </main>\n        )}\n      </Host>\n    );\n  }\n}\n","import { RouterInterface } from '@/routers/router-interface';\nimport { NylasAuthStoreType } from '@/stores/auth-store';\nimport { NylasMailboxStoreType } from '@/stores/mailbox-store';\nimport { debug } from '@/utils/utils';\nimport type { NylasAuthType } from '@nylas/core';\nimport { NylasMailboxConnectorInterface } from '../connector-interface';\nimport { NylasAuthConnector } from '../shared/api/auth';\nimport { NylasMessagesConnector } from '../shared/api/messages';\nimport { NylasThreadsConnector } from '../shared/api/threads';\nimport { NylasFoldersConnector } from '../shared/api/folders';\n\n/**\n * Base class for the Nylas connector.\n */\nexport class NylasMailboxConnector implements NylasMailboxConnectorInterface {\n  public nylasAuth: NylasAuthType;\n  public nylasMailboxStore: NylasMailboxStoreType;\n  public nylasAuthStore: NylasAuthStoreType;\n  public router: RouterInterface;\n\n  private _authConnector: NylasAuthConnector | undefined;\n  private _threadConnector: NylasThreadsConnector | undefined;\n  private _messageConnector: NylasMessagesConnector | undefined;\n  private _foldersConnector: NylasFoldersConnector | undefined;\n\n  constructor(router: RouterInterface, nylasAuth: NylasAuthType, nylasAuthStore: NylasAuthStoreType, nylasStore: NylasMailboxStoreType) {\n    this.router = router;\n    this.nylasAuth = nylasAuth;\n    this.nylasAuthStore = nylasAuthStore;\n    this.nylasMailboxStore = nylasStore;\n  }\n\n  public init() {\n    debug('NylasMailboxConnector init');\n  }\n\n  public get mailboxStore() {\n    return this.nylasMailboxStore;\n  }\n\n  public get authStore() {\n    return this.nylasAuthStore;\n  }\n\n  public get auth() {\n    if (this._authConnector) {\n      return this._authConnector;\n    }\n    this._authConnector = new NylasAuthConnector(this.nylasAuth, this.nylasAuthStore);\n    return this._authConnector;\n  }\n\n  public get threads() {\n    if (this._threadConnector) {\n      return this._threadConnector;\n    }\n    this._threadConnector = new NylasThreadsConnector(this.nylasAuth, this.nylasAuthStore, this.nylasMailboxStore, this.router);\n    return this._threadConnector;\n  }\n\n  public get messages() {\n    if (this._messageConnector) {\n      return this._messageConnector;\n    }\n    this._messageConnector = new NylasMessagesConnector(this.nylasAuth, this.nylasAuthStore, this.nylasMailboxStore);\n    return this._messageConnector;\n  }\n\n  public get folders() {\n    if (this._foldersConnector) {\n      return this._foldersConnector;\n    }\n    this._foldersConnector = new NylasFoldersConnector(this.nylasAuth, this.nylasAuthStore, this.nylasMailboxStore);\n    return this._foldersConnector;\n  }\n\n  public getAuth() {\n    return this.nylasAuth;\n  }\n\n  public resetStores() {\n    this.nylasMailboxStore.reset();\n    this.nylasAuthStore.reset();\n  }\n\n  public async logout() {\n    await this.nylasAuth.logout();\n    this.resetStores();\n  }\n}\n\nexport type PublicMethods<T> = {\n  [K in keyof T]: T[K] extends Function ? (string extends K ? never : K) : never;\n}[keyof T];\n\nexport type NylasMailboxConnectorPublicMethods = PublicMethods<NylasMailboxConnector>;\n",":host {\n  display: contents;\n}\n","import { NylasBaseProvider } from '@/common/abstract-provider';\nimport { RegisteredComponent } from '@/common/register-component';\nimport type { EventOverride } from '@/common/component-types';\nimport { NylasMailboxConnector } from '@/connector/nylas-mailbox-connector';\nimport { HashRouter } from '@/routers/hash-router';\nimport { RouterInterface } from '@/routers/router-interface';\nimport { CreateNylasAuthStore, NylasAuthStoreState, NylasAuthStoreType } from '@/stores/auth-store';\nimport { CreateNylasMailboxStore, NylasMailboxStoreState, NylasMailboxStoreType } from '@/stores/mailbox-store';\nimport { AuthConfg, NylasAuth, NylasAuthType } from '@nylas/core';\nimport { Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, h } from '@stencil/core';\nimport { debug } from '@/utils/utils';\n\n/**\n * The Nylas Mailbox component.\n * This component is used as a provider for all other Nylas Mailbox components.\n * It is responsible for managing the NylasAuth and NylasMailboxConnector instances.\n * It also manages the state of the NylasAuth and NylasMailboxStore instances.\n * @example\n * <nylas-mailbox\n *  auth-config={{\n *  clientId: 'YOUR_CLIENT_ID',\n *  }}\n * default-auth-store-state={{\n * threadQueryParams: {\n *  limit: 10,\n * }}\n * >\n *  <nylas-mailbox-thread-list></nylas-mailbox-thread-list>\n * </nylas-mailbox>\n */\n@Component({\n  tag: 'nylas-mailbox',\n  styleUrl: 'nylas-mailbox.css',\n  shadow: true,\n})\nexport class NylasMailbox {\n  /**\n   * Stores to be used by the provider.\n   */\n  private stores?: {\n    auth: NylasAuthStoreType;\n    mailbox: NylasMailboxStoreType;\n  };\n\n  /**\n   * This is a base provide that defines the common methods and properties\n   * that all providers should have.\n   *\n   * Because stencil does not support abstract classes, we have to use a\n   * property to store the base provider instance.\n   */\n  private baseProvider?: NylasBaseProvider<Exclude<typeof this.stores, undefined>>;\n\n  /**\n   * The Nylas Auth instance.\n   * Used to manage all things authentication with Nylas.\n   */\n  private nylasAuth?: NylasAuthType;\n\n  /**\n   * A router instance.\n   */\n  private router?: RouterInterface;\n\n  /**\n   * The Nylas Mailbox Connector instance.\n   * The branins of the provider. It manages data fetching and state synchronization.\n   */\n  private nylasMailboxConnector?: NylasMailboxConnector;\n\n  /**\n   * The host element.\n   * Used to manage the host element of the provider.\n   */\n  @Element() private host!: HTMLNylasMailboxElement;\n\n  /**\n   * Automatically register components that have the `@RegisterComponent` decorator.\n   * If this is set to false, you will need to manually register components using the\n   * `registerComponent` method.\n   */\n  @Prop() readonly automaticComponentRegistration: boolean = true;\n\n  /**\n   * This provides a way to override the default event handlers.\n   */\n  @Prop() eventOverrides: EventOverride<Exclude<typeof this.nylasMailboxConnector, undefined>> = {};\n\n  /**\n   * The Nylas Auth configuration.\n   * Used to manage all things authentication with Nylas.\n   */\n  @Prop({ attribute: 'auth-config' }) readonly authConfig?: AuthConfg;\n\n  /**\n   * The default auth store state.\n   * Used to set the initial state of the auth store.\n   */\n  @Prop({ attribute: 'default-auth-store-state' }) readonly defaultAuthStoreState?: NylasAuthStoreState;\n\n  /**\n   * The default mailbox store state.\n   * Used to set the initial state of the mailbox store.\n   */\n  @Prop({ attribute: 'default-mailbox-store-state' }) readonly defaultMailboxStoreState?: NylasMailboxStoreState;\n\n  /**\n   * This event is fired when the provider is initialized.\n   * It can be used to set the initial state of the provider,\n   * or to prevent the provider from firing some default behavior.\n   */\n  @Event({ cancelable: true }) readonly init!: EventEmitter<HTMLNylasMailboxElement>;\n\n  /**\n   * This event is fired when the the NyalsAuth isAuthenticated state changes\n   * to true.\n   */\n  @Event({ cancelable: true }) readonly loggedIn!: EventEmitter<HTMLNylasMailboxElement>;\n\n  /**\n   * This event is fired when the the NyalsAuth isAuthenticated state changes\n   * to true.\n   */\n  @Event({ cancelable: true }) readonly loggedOut!: EventEmitter<HTMLNylasMailboxElement>;\n\n  connectedCallback() {\n    debug('[nylas-mailbox] connectedCallback');\n  }\n\n  async componentWillLoad() {\n    this.stores = {\n      auth: CreateNylasAuthStore(this.defaultAuthStoreState),\n      mailbox: CreateNylasMailboxStore(this.defaultMailboxStoreState),\n    };\n\n    this.baseProvider = new NylasBaseProvider(this.host, this.stores, this.automaticComponentRegistration, this.eventOverrides);\n\n    /**\n     * Create the router instance.\n     * This will be used to manage the routing of the provider.\n     */\n    this.router = new HashRouter();\n\n    /**\n     * Create the NylasAuth instance.\n     * This will be used to manage all things authentication with Nylas.\n     */\n    this.nylasAuth = NylasAuth({\n      apiUri: 'https://api.us.nylas.com',\n      elementsApiUri: 'https://elements.us.nylas.com',\n      storageType: 'indexeddb',\n      clientId: 'YOUR_CLIENT_ID',\n      defaultScopes: [],\n      redirectURI: '/',\n      ...this.authConfig,\n    });\n\n    const authStore = this.baseProvider?.getStore('auth');\n    if (!authStore) {\n      throw new Error('Auth store is not defined');\n    }\n\n    const mailboxStore = this.baseProvider?.getStore('mailbox');\n    if (!mailboxStore) {\n      throw new Error('Mailbox store is not defined');\n    }\n\n    this.nylasMailboxConnector = new NylasMailboxConnector(this.router, this.nylasAuth, authStore, mailboxStore);\n\n    const initEvent = this.init.emit(this.host);\n    if (!initEvent.defaultPrevented) {\n      /**\n       * By default, on init, we will validate the session.\n       * This will check if the user is logged in and if the session is still valid.\n       * If the session is not valid, the user will be logged out.\n       */\n      await this.nylasMailboxConnector?.auth.validateSession();\n    }\n\n    // Handle our router\n    this.router?.addRouteChangeListener(`/thread/:threadId`, async (_route, _path, routeParams) => {\n      const threadId = routeParams.threadId;\n      const thread = await this.nylasMailboxConnector?.threads.getThread(threadId);\n      if (thread) {\n        this.nylasMailboxConnector?.mailboxStore.set('selectedThread', thread);\n      }\n    });\n    this.router?.addRouteChangeListener(`/`, async (_route, _path, _routeParams) => {\n      if (!authStore.state.isAuthenticated) {\n        return;\n      }\n      // Reset the selected thread\n      this.nylasMailboxConnector?.threads.unSelectThread();\n      this.nylasMailboxConnector?.folders.getFolders();\n\n      // If we have a query param, search for threads\n      const queryParams = window.location.hash.split('?')[1];\n      if (queryParams) {\n        const params = new URLSearchParams(queryParams);\n        const searchQuery = params.get('query');\n        if (searchQuery) {\n          await this.nylasMailboxConnector?.threads.getThreads({\n            search_query_native: searchQuery,\n            page_token: undefined,\n          });\n        }\n      } else {\n        this.nylasMailboxConnector?.threads.getThreads();\n      }\n    });\n\n    /**\n     * Initialize the router.\n     * This will be used to manage the routing of the provider.\n     */\n    this.router?.init();\n\n    /**\n     * Listen for changes in the NylasAuth isAuthenticated state.\n     * This is used to fire the loggedIn and loggedOut events.\n     */\n    this.handleAuthChange(authStore.state.isAuthenticated);\n    this.baseProvider?.componentWillLoad(this.nylasMailboxConnector);\n  }\n\n  async componentDidLoad() {\n    const authStore = this.baseProvider?.getStore('auth');\n    if (!authStore) {\n      throw new Error('Auth store is not defined');\n    }\n\n    authStore.onChange('isAuthenticated', this.handleAuthChange);\n    this.baseProvider?.componentDidLoad();\n  }\n\n  componentDisconnected() {\n    this.baseProvider?.componentDisconnected();\n  }\n\n  /**\n   * This is a custom event handler that is used to register a component with the provider.\n   * It is used by components that have the `@RegisterComponent` decorator.\n   * @param event A custom event that contains the component to register\n   * @returns Promise<void>\n   */\n  @Listen('registerComponent')\n  async registerComponentHandler(event: CustomEvent<RegisteredComponent<any, any>>): Promise<void> {\n    this.baseProvider?.registerComponent(event.detail);\n  }\n\n  /**\n   * This is a custom event handler that is used to unregister a component with the provider.\n   * It is used by components that have the `@RegisterComponent` decorator.\n   * @param event A custom event that contains the component to unregister\n   * @returns Promise<void>\n   */\n  @Listen('unregisterComponent')\n  async unregisterComponentHandler(event: CustomEvent<RegisteredComponent<any, any>>): Promise<void> {\n    this.baseProvider?.unregisterComponent(event.detail);\n  }\n\n  /**\n   * This method is used to retrieve the mailboxStore instance\n   * @returns The mailboxStore instance\n   */\n  @Method()\n  async getMailboxStore(): Promise<NylasMailboxStoreType | undefined> {\n    return this.baseProvider?.getStore('mailbox');\n  }\n\n  /**\n   * This method is used to retrieve the authStore instance\n   * @returns The authStore instance\n   */\n  @Method()\n  async getAuthStore(): Promise<NylasAuthStoreType | undefined> {\n    return this.baseProvider?.getStore('auth');\n  }\n\n  /**\n   * This method is used to retrieve the NylasAuth instance\n   * @returns The NylasAuth instance\n   */\n  @Method()\n  async getNylasAuth(): Promise<NylasAuthType | undefined> {\n    return this.nylasAuth;\n  }\n\n  /**\n   * This method is used to retrieve the NylasMailboxConnector instance\n   * @returns The NylasMailboxConnector instance\n   */\n  @Method()\n  async getNylasMailboxConnector() {\n    return this.nylasMailboxConnector;\n  }\n\n  /**\n   * This method is used to handle changes in the NylasAuth isAuthenticated state\n   * @param isAuthenticated isAuthenticated state\n   * @returns void\n   */\n  private handleAuthChange = async (isAuthenticated: boolean) => {\n    if (isAuthenticated) {\n      this.loggedIn.emit(this.host);\n    } else {\n      const loggedOutEvent = this.loggedOut.emit(this.host);\n      if (!loggedOutEvent.defaultPrevented) {\n        await this.nylasMailboxConnector?.logout();\n      }\n    }\n  };\n\n  render() {\n    return (\n      <Host>\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/nylas-list-folders.cjs.entry.js

@@ -0,0 +1,120 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-34e64e2d.js');
+const registerComponent = require('./register-component-f76b61a6.js');
+const utils = require('./utils-f91d4c73.js');
+
+const nylasListFoldersCss = ":host{display:block}.folders{display:flex;flex-direction:column;align-items:self-start}.folders .folder{border:1px solid var(--nylas-color-primary-100);padding:0.5rem 0.75rem;margin-bottom:0.5rem;justify-content:left;width:100%;min-width:200px;border-radius:var(--nylas-border-radius);background-color:var(--nylas-color-primary-50)}.folders .folder:last-child{margin-bottom:0}.folders .folder.selected{background-color:var(--nylas-color-primary-100)}.folders .folder .icon{margin-right:0.5rem;stroke:var(--nylas-color-primary-900);fill:none}hr{width:100%;margin:1rem 0;border:0;border-top:1px solid var(--nylas-color-primary-100)}";
+const NylasListFoldersStyle0 = nylasListFoldersCss;
+
+var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
+        r = Reflect.decorate(decorators, target, key, desc);
+    else
+        for (var i = decorators.length - 1; i >= 0; i--)
+            if (d = decorators[i])
+                r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (undefined && undefined.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
+        return Reflect.metadata(k, v);
+};
+const NylasListFolders = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.folderSelected = index.createEvent(this, "folderSelected", 7);
+        this.folderSelectedHandler = (folder) => {
+            this.folderSelected?.emit(folder);
+        };
+        this.folders = undefined;
+        this.selectedFolder = undefined;
+        this.defaultFolders = undefined;
+        this.otherFolders = undefined;
+    }
+    connectedCallback() { }
+    disconnectedCallback() { }
+    async componentWillLoad() {
+        utils.debug(`[nylas-list-folders] Component will load`);
+    }
+    async componentDidLoad() {
+        utils.debug(`[nylas-list-folders] Component did load`);
+    }
+    watchFolders(newFolders) {
+        utils.debug(`[nylas-list-folders] watchFolders`, { newFolders });
+        const defaultFolders = ['inbox', 'drafts', 'sent', 'starred', 'spam', 'archive', 'trash'];
+        this.defaultFolders = defaultFolders
+            .filter(folderName => newFolders.find(folder => folder.name?.toLowerCase() === folderName.toLowerCase()))
+            .map(folderName => newFolders.find(folder => folder.name?.toLowerCase() === folderName.toLowerCase()))
+            .filter(folder => typeof folder !== 'undefined')
+            .sort((a, b) => defaultFolders.indexOf(a?.name ?? '') - defaultFolders.indexOf(b?.name ?? ''));
+        this.otherFolders = newFolders
+            .filter(folder => !defaultFolders.find(folderName => folder.name?.toLowerCase() === folderName.toLowerCase()))
+            .sort((a, b) => (a.name ?? '').localeCompare(b.name ?? ''));
+    }
+    formatFolderName(folder) {
+        return utils.toTitleCase(folder.name?.replace('CATEGORY_', '') ?? 'Unknown');
+    }
+    getFolderIcon(folder) {
+        switch (folder.name?.toLowerCase()) {
+            case 'inbox':
+                return index.h("inbox-icon", null);
+            case 'drafts':
+                return index.h("drafts-icon", null);
+            case 'sent':
+                return index.h("sent-icon", null);
+            case 'starred':
+                return index.h("star-icon", null);
+            case 'spam':
+                return index.h("spam-icon", null);
+            case 'archive':
+                return index.h("archive-icon", null);
+            case 'trash':
+                return index.h("trash-icon", null);
+            default:
+                return index.h("folder-icon", null);
+        }
+    }
+    render() {
+        return (index.h(index.Host, { key: '68480d02623588939b4223197e10c567d0ee8bf7' }, index.h("div", { key: '840ceb51b17a2681b8c1b5717a26513afbb0db02', class: "folders" }, this.defaultFolders?.map(folder => (index.h("sp-button", { onClick: () => this.folderSelectedHandler(folder), class: {
+                folder: true,
+                selected: utils.formatFolderName(folder.name ?? 'inbox').toLowerCase() === this.selectedFolder?.toLowerCase(),
+            } }, index.h("div", { slot: "icon", class: "icon" }, this.getFolderIcon(folder)), this.formatFolderName(folder))))), this.otherFolders && (index.h(index.Fragment, null, index.h("hr", null), index.h("div", { class: "folders" }, this.otherFolders?.map(folder => (index.h("sp-button", { onClick: () => this.folderSelectedHandler(folder), class: {
+                folder: true,
+                selected: utils.formatFolderName(folder.name ?? 'inbox').toLowerCase() === this.selectedFolder?.toLowerCase(),
+            } }, index.h("div", { slot: "icon", class: "icon" }, this.getFolderIcon(folder)), this.formatFolderName(folder)))))))));
+    }
+    static get watchers() { return {
+        "folders": ["watchFolders"]
+    }; }
+};
+__decorate([
+    registerComponent.RegisterComponent({
+        name: 'nylas-pagination',
+        stateToProps: new Map([
+            ['mailbox.folders', 'folders'],
+            ['mailbox.selectedFolder', 'selectedFolder'],
+        ]),
+        eventToProps: {
+            folderSelected: async (_event, nylasConnector) => {
+                utils.debug(`[nylas-list-folders] folderSelected event`, { _event });
+                await nylasConnector.threads.getThreads({
+                    page_token: undefined,
+                    in: utils.formatFolderName(_event.detail.id ?? 'inbox'),
+                });
+            },
+        },
+        fireRegisterEvent: true,
+    }),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+], NylasListFolders.prototype, "render", null);
+NylasListFolders.style = NylasListFoldersStyle0;
+
+exports.nylas_list_folders = NylasListFolders;
+
+//# sourceMappingURL=nylas-list-folders.cjs.entry.js.map