@nylas/web-elements 1.0.0-prealpha1

package/dist/components/nylas-mailbox-toolbar-button.js.map

@@ -0,0 +1 @@
+{"file":"nylas-mailbox-toolbar-button.js","mappings":"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","names":["NylasMailboxToolbarButton"],"sources":["src/components/mailbox/nylas-mailbox-toolbar-button/nylas-mailbox-toolbar-button.scss?tag=nylas-mailbox-toolbar-button&encapsulation=shadow","src/components/mailbox/nylas-mailbox-toolbar-button/nylas-mailbox-toolbar-button.tsx"],"sourcesContent":[":host {\n  display: block;\n}\n\nsp-button {\n  border-radius: var(--nylas-border-radius);\n  background-color: var(--nylas-color-primary-400);\n  color: var(--nylas-color-primary-900);\n  fill: var(--nylas-color-primary-900);\n\n  &:hover {\n    background-color: var(--nylas-color-primary-500);\n  }\n\n  &:disabled {\n    background-color: var(--nylas-color-primary-200);\n    color: var(--nylas-color-primary-600);\n    cursor: not-allowed;\n  }\n}\n","import { RegisterComponent } from '@/common/register-component';\nimport { MethodKeys } from '@/common/types';\nimport { NylasMailboxConnectorInterface } from '@/connector/connector-interface';\nimport { debug } from '@/utils/utils';\nimport { Component, Element, Host, Prop, h } from '@stencil/core';\nimport { ObservableMap } from '@stencil/store';\n\nexport type Stores = Record<string, ObservableMap<any>>;\nexport type PublicMethodsOfNylasMailboxConnector = Pick<NylasMailboxConnectorInterface, MethodKeys<NylasMailboxConnectorInterface>>;\nexport type PropertyPaths<T> = T extends object\n  ? {\n      [K in keyof T]: T[K] extends Function ? `${K & string}` : `${K & string}.${PropertyPaths<T[K]>}`;\n    }[keyof T]\n  : '';\nexport type MethodsOfNylasMailboxConnector = PropertyPaths<NylasMailboxConnectorInterface>;\n\n@Component({\n  tag: 'nylas-mailbox-toolbar-button',\n  styleUrl: 'nylas-mailbox-toolbar-button.scss',\n  shadow: true,\n})\nexport class NylasMailboxToolbarButton {\n  @Element() private host!: HTMLNylasMailboxToolbarButtonElement;\n\n  /**\n   * The name of the mailbox connector method to call.\n   */\n  @Prop({ attribute: 'method' }) readonly method!: MethodsOfNylasMailboxConnector;\n\n  /**\n   * The value of the state to compare against to check if the data is loading, error, or ready.\n   */\n  @Prop({ attribute: 'data-state' }) readonly dataState?: string;\n\n  /**\n   * If true, then the component will render the icon only.\n   */\n  @Prop() readonly iconOnly: boolean = false;\n\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 mailboxConnector?: NylasMailboxConnectorInterface;\n\n  constructor() {}\n\n  connectedCallback() {}\n\n  disconnectedCallback() {}\n\n  async componentWillLoad() {\n    debug(`[nylas-if-state] Component will load`);\n  }\n\n  async componentDidLoad() {\n    debug(`[nylas-if-state] Component did load`);\n  }\n\n  /**\n   * The click handler for the button.\n   */\n  private onClick = async () => {\n    const method = this.method as unknown as string;\n    debug(`[nylas-mailbox-toolbar-button] onClick`, { method, mailboxConnector: this.mailboxConnector });\n    if (this.mailboxConnector && method) {\n      const methodToCall = this.callMethod(this.mailboxConnector, method);\n      if (methodToCall) {\n        await methodToCall();\n      }\n    }\n  };\n\n  /**\n   * Traverses the object to find the method.\n   * @param obj The object to traverse.\n   * @param accessString The string to access the method.\n   * @returns The method if it exists, undefined otherwise.\n   */\n  private callMethod(obj: any, accessString: string): (() => void) | undefined {\n    // Split the string into parts\n    const parts = accessString.split('.');\n\n    // Traverse the object to find the method\n    let current = obj;\n    for (const part of parts.slice(0, -1)) {\n      current = current[part];\n      if (!current) {\n        return undefined;\n      }\n    }\n\n    // Get the method\n    const methodName = parts[parts.length - 1];\n    const method = current[methodName];\n\n    // Check if the method is a function\n    if (typeof method === 'function') {\n      return method.bind(current);\n    }\n\n    return undefined;\n  }\n\n  /**\n   * Renders the slot based on the state.\n   * @param state The state of the data.\n   */\n  private renderByState(state: boolean) {\n    return state ? <slot name=\"loading\">Loading...</slot> : <slot>Click</slot>;\n  }\n\n  /**\n   * Checks if the slot exists.\n   * @param name The name of the slot.\n   * @returns True if the slot exists, false otherwise.\n   */\n  private hasSlot(name: string) {\n    return !!this.host.querySelector(`[slot=\"${name}\"]`);\n  }\n\n  @RegisterComponent({\n    name: 'nylas-mailbox-toolbar-button',\n    connectorToProp: 'mailboxConnector',\n    fireRegisterEvent: true,\n  })\n  render() {\n    let state = false;\n    const store = this.mailboxConnector?.nylasMailboxStore;\n    if (typeof store !== 'undefined') {\n      const storeKey = String(this.dataState) as keyof typeof store.state;\n      state = this.dataState ? store.get(storeKey) === 'loading' : false;\n    }\n    const key = state ? `state-loading` : 'state-ready';\n    return (\n      <Host>\n        <sp-theme scale=\"medium\" color=\"dark\">\n          <sp-button onClick={this.onClick} disabled={state} key={key} icon-only={this.iconOnly} label={this.renderByState(state)}>\n            {this.hasSlot('icon') && (\n              <div slot=\"icon\" class={'slot'}>\n                <slot name=\"icon\" />\n              </div>\n            )}\n            {!this.iconOnly && this.renderByState(state)}\n          </sp-button>\n        </sp-theme>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/nylas-mailbox.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface NylasMailbox extends Components.NylasMailbox, HTMLElement {}
+export const NylasMailbox: {
+    prototype: NylasMailbox;
+    new (): NylasMailbox;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/nylas-mailbox.js

@@ -0,0 +1,219 @@
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { N as NylasBaseProvider, e as es } from './index.es.js';
+import { d as debug } from './utils.js';
+import { N as NylasAuthConnector, a as NylasThreadsConnector, b as NylasMessagesConnector, c as NylasFoldersConnector, C as CreateNylasAuthStore, d as CreateNylasMailboxStore, H as HashRouter } from './mailbox-store.js';
+
+class NylasMailboxConnector {
+    constructor(router, nylasAuth, nylasAuthStore, nylasStore) {
+        this.router = router;
+        this.nylasAuth = nylasAuth;
+        this.nylasAuthStore = nylasAuthStore;
+        this.nylasMailboxStore = nylasStore;
+    }
+    init() {
+        debug('NylasMailboxConnector init');
+    }
+    get mailboxStore() {
+        return this.nylasMailboxStore;
+    }
+    get authStore() {
+        return this.nylasAuthStore;
+    }
+    get auth() {
+        if (this._authConnector) {
+            return this._authConnector;
+        }
+        this._authConnector = new NylasAuthConnector(this.nylasAuth, this.nylasAuthStore);
+        return this._authConnector;
+    }
+    get threads() {
+        if (this._threadConnector) {
+            return this._threadConnector;
+        }
+        this._threadConnector = new NylasThreadsConnector(this.nylasAuth, this.nylasAuthStore, this.nylasMailboxStore, this.router);
+        return this._threadConnector;
+    }
+    get messages() {
+        if (this._messageConnector) {
+            return this._messageConnector;
+        }
+        this._messageConnector = new NylasMessagesConnector(this.nylasAuth, this.nylasAuthStore, this.nylasMailboxStore);
+        return this._messageConnector;
+    }
+    get folders() {
+        if (this._foldersConnector) {
+            return this._foldersConnector;
+        }
+        this._foldersConnector = new 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$1 = proxyCustomElement(class NylasMailbox extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.init = createEvent(this, "init", 7);
+        this.loggedIn = createEvent(this, "loggedIn", 7);
+        this.loggedOut = 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() {
+        debug('[nylas-mailbox] connectedCallback');
+    }
+    async componentWillLoad() {
+        this.stores = {
+            auth: CreateNylasAuthStore(this.defaultAuthStoreState),
+            mailbox: CreateNylasMailboxStore(this.defaultMailboxStoreState),
+        };
+        this.baseProvider = new NylasBaseProvider(this.host, this.stores, this.automaticComponentRegistration, this.eventOverrides);
+        this.router = new HashRouter();
+        this.nylasAuth = 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 = this.baseProvider?.getStore('mailbox');
+        if (!mailboxStore) {
+            throw new Error('Mailbox store is not defined');
+        }
+        this.nylasMailboxConnector = new NylasMailboxConnector(this.router, this.nylasAuth, authStore, mailboxStore);
+        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 (h(Host, { key: '08e87a3218f672e8944102d626b690aefb3bab3f' }, h("slot", { key: '05ab1ca1539a00ea199bb9cb25c8b96af8d6ab66' })));
+    }
+    get host() { return this; }
+    static get style() { return NylasMailboxStyle0; }
+}, [1, "nylas-mailbox", {
+        "automaticComponentRegistration": [4, "automatic-component-registration"],
+        "eventOverrides": [16],
+        "authConfig": [16],
+        "defaultAuthStoreState": [16],
+        "defaultMailboxStoreState": [16],
+        "getMailboxStore": [64],
+        "getAuthStore": [64],
+        "getNylasAuth": [64],
+        "getNylasMailboxConnector": [64]
+    }, [[0, "registerComponent", "registerComponentHandler"], [0, "unregisterComponent", "unregisterComponentHandler"]]]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["nylas-mailbox"];
+    components.forEach(tagName => { switch (tagName) {
+        case "nylas-mailbox":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, NylasMailbox$1);
+            }
+            break;
+    } });
+}
+
+const NylasMailbox = NylasMailbox$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { NylasMailbox, defineCustomElement };
+
+//# sourceMappingURL=nylas-mailbox.js.map

package/dist/components/nylas-mailbox.js.map

@@ -0,0 +1 @@
+{"file":"nylas-mailbox.js","mappings":"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","names":["NylasMailbox","NylasAuth"],"sources":["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":["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/components/nylas-notification.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface NylasNotification extends Components.NylasNotification, HTMLElement {}
+export const NylasNotification: {
+    prototype: NylasNotification;
+    new (): NylasNotification;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/nylas-notification.js

@@ -0,0 +1,8 @@
+import { N as NylasNotification$1, d as defineCustomElement$1 } from './nylas-notification2.js';
+
+const NylasNotification = NylasNotification$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { NylasNotification, defineCustomElement };
+
+//# sourceMappingURL=nylas-notification.js.map

package/dist/components/nylas-notification.js.map

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

package/dist/components/nylas-notification2.js

@@ -0,0 +1,90 @@
+import { proxyCustomElement, HTMLElement, h, Host, Fragment } from '@stencil/core/internal/client';
+import { d as debug } from './utils.js';
+import { d as defineCustomElement$2 } from './close.js';
+import { d as defineCustomElement$1 } from './warning.js';
+
+const nylasNotificationCss = ":host{display:block;position:absolute;top:1.5rem;right:1.5rem}.notif{display:flex;width:280px;padding:16px;align-items:flex-start;gap:16px;border-radius:8px;border:1.5px solid var(--nylas-error);background:var(--nylas-base-0)}.notif .content{display:flex;flex-direction:row;gap:8px}.notif .content .message{font-size:14px;font-weight:400;color:var(--nylas-base-800)}.notif .content .message .title{font-size:16px;font-weight:600;color:var(--nylas-base-950);display:inline-block}.notif .content .message .description{font-size:14px;font-weight:400;color:var(--nylas-base-800);display:inline-block}.notif .content .icon.error{color:var(--nylas-error)}.notif.nylasSchedulerError{border-color:var(--nylas-error)}.notif.nylasSchedulerWarning{border-color:var(--nylas-warning)}.notif.nylasSchedulerInfo{border-color:var(--nylas-info)}.notif.nylasSchedulerSuccess{border-color:var(--nylas-success)}.notif .dismiss-btn{background:none;border:none;color:var(--nylas-base-950);cursor:pointer;position:absolute;right:0.5rem;top:0.5rem}";
+const NylasNotificationStyle0 = nylasNotificationCss;
+
+const NylasNotification = proxyCustomElement(class NylasNotification extends HTMLElement {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.ttl = 5000;
+        this.allowedCategories = ['invalid_session', 'api', 'validation', 'internal'];
+        this.notifications = [];
+    }
+    onError(event) {
+        debug(`[nylas-notification] Error: ${event.detail.title}`);
+        this.handleNotification(event);
+    }
+    onWarning(event) {
+        debug(`[nylas-notification] Warning: ${event.detail.title}`);
+        this.handleNotification(event);
+    }
+    onInfo(event) {
+        debug(`[nylas-notification] Info: ${event.detail.title}`);
+        this.handleNotification(event);
+    }
+    onSuccess(event) {
+        debug(`[nylas-notification] Success: ${event.detail.title}`);
+        this.handleNotification(event);
+    }
+    handleNotification(event) {
+        if (event.defaultPrevented) {
+            debug(`[nylas-notification] Event default prevented`);
+            return;
+        }
+        if (this.ttl === 0) {
+            debug(`[nylas-notification] TTL is 0`);
+            return;
+        }
+        if (this.allowedCategories.length > 0 && !this.allowedCategories.includes(event.detail.category)) {
+            debug(`[nylas-notification] Category not allowed`);
+            return;
+        }
+        this.notifications = [...this.notifications, { ...event.detail }];
+        window.setTimeout(() => {
+            this.notifications = this.notifications.filter(notif => notif.id !== event.detail.id);
+        }, this.ttl);
+    }
+    dismissNotification(id) {
+        this.notifications = this.notifications.filter(notif => notif.id !== id);
+    }
+    render() {
+        return (h(Host, { key: 'abda5c2bf1feeda4561e4890dccf507062394cc5' }, h(Fragment, { key: '9eced3033f89523cf7a074d4e1c0d1ecec51b933' }, this.notifications.map(notif => (h("div", { class: `notif ${notif.type}`, key: notif.id }, h("div", { class: "content" }, h("span", { class: `icon ${notif.type}` }, (notif.type === 'error' || notif.type === 'warning') && h("warning-icon", null)), h("span", { class: "message" }, h("span", { class: "title" }, notif.title), notif.description && h("span", { class: "description" }, notif.description))), h("button", { class: "dismiss-btn", onClick: () => this.dismissNotification(notif.id) }, h("close-icon", null))))), h("slot", { key: 'a36441dda5f17822b9954f71aa35e8dae759e2dc' }))));
+    }
+    static get style() { return NylasNotificationStyle0; }
+}, [1, "nylas-notification", {
+        "ttl": [2],
+        "allowedCategories": [16],
+        "notifications": [32]
+    }, [[16, "nylasSchedulerError", "onError"], [16, "nylasSchedulerWarning", "onWarning"], [16, "nylasSchedulerInfo", "onInfo"], [16, "nylasSchedulerSuccess", "onSuccess"]]]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["nylas-notification", "close-icon", "warning-icon"];
+    components.forEach(tagName => { switch (tagName) {
+        case "nylas-notification":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, NylasNotification);
+            }
+            break;
+        case "close-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "warning-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+
+export { NylasNotification as N, defineCustomElement as d };
+
+//# sourceMappingURL=nylas-notification2.js.map

package/dist/components/nylas-notification2.js.map

@@ -0,0 +1 @@
+{"file":"nylas-notification2.js","mappings":"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","names":[],"sources":["src/components/scheduler/nylas-notification/nylas-notification.scss?tag=nylas-notification&encapsulation=shadow","src/components/scheduler/nylas-notification/nylas-notification.tsx"],"sourcesContent":[":host {\n  display: block;\n  position: absolute;\n  top: 1.5rem;\n  right: 1.5rem;\n}\n.notif {\n  display: flex;\n  width: 280px;\n  padding: 16px;\n  align-items: flex-start;\n  gap: 16px;\n  border-radius: 8px;\n  border: 1.5px solid var(--nylas-error);\n  background: var(--nylas-base-0);\n  .content {\n    display: flex;\n    flex-direction: row;\n    gap: 8px;\n    .message {\n      font-size: 14px;\n      font-weight: 400;\n      color: var(--nylas-base-800);\n      .title {\n        font-size: 16px;\n        font-weight: 600;\n        color: var(--nylas-base-950);\n        display: inline-block;\n      }\n      .description {\n        font-size: 14px;\n        font-weight: 400;\n        color: var(--nylas-base-800);\n        display: inline-block;\n      }\n    }\n    .icon {\n      &.error {\n        color: var(--nylas-error);\n      }\n    }\n  }\n  &.nylasSchedulerError {\n    border-color: var(--nylas-error);\n  }\n  &.nylasSchedulerWarning {\n    border-color: var(--nylas-warning);\n  }\n  &.nylasSchedulerInfo {\n    border-color: var(--nylas-info);\n  }\n  &.nylasSchedulerSuccess {\n    border-color: var(--nylas-success);\n  }\n\n  .dismiss-btn {\n    background: none;\n    border: none;\n    color: var(--nylas-base-950);\n    cursor: pointer;\n    position: absolute;\n    right: 0.5rem;\n    top: 0.5rem;\n  }\n}\n","import { Notification } from '@nylas/core';\nimport { Component, Fragment, Host, Listen, Prop, State, h } from '@stencil/core';\nimport { debug } from '@/utils/utils';\n\n@Component({\n  tag: 'nylas-notification',\n  styleUrl: 'nylas-notification.scss',\n  shadow: true,\n})\nexport class NylasNotification {\n  @Prop() ttl: number = 5000;\n  @Prop() allowedCategories: string[] = ['invalid_session', 'api', 'validation', 'internal'];\n\n  @State() notifications: Notification[] = [];\n\n  @Listen('nylasSchedulerError', { target: 'body' })\n  onError(event: CustomEvent<Notification>) {\n    debug(`[nylas-notification] Error: ${event.detail.title}`);\n    this.handleNotification(event);\n  }\n\n  @Listen('nylasSchedulerWarning', { target: 'body' })\n  onWarning(event: CustomEvent<Notification>) {\n    debug(`[nylas-notification] Warning: ${event.detail.title}`);\n    this.handleNotification(event);\n  }\n\n  @Listen('nylasSchedulerInfo', { target: 'body' })\n  onInfo(event: CustomEvent<Notification>) {\n    debug(`[nylas-notification] Info: ${event.detail.title}`);\n    this.handleNotification(event);\n  }\n\n  @Listen('nylasSchedulerSuccess', { target: 'body' })\n  onSuccess(event: CustomEvent<Notification>) {\n    debug(`[nylas-notification] Success: ${event.detail.title}`);\n    this.handleNotification(event);\n  }\n\n  private handleNotification(event: CustomEvent<Notification>) {\n    if (event.defaultPrevented) {\n      debug(`[nylas-notification] Event default prevented`);\n      return;\n    }\n    if (this.ttl === 0) {\n      debug(`[nylas-notification] TTL is 0`);\n      return;\n    }\n    if (this.allowedCategories.length > 0 && !this.allowedCategories.includes(event.detail.category)) {\n      debug(`[nylas-notification] Category not allowed`);\n      return;\n    }\n\n    this.notifications = [...this.notifications, { ...event.detail }];\n    window.setTimeout(() => {\n      this.notifications = this.notifications.filter(notif => notif.id !== event.detail.id);\n    }, this.ttl);\n  }\n\n  private dismissNotification(id: string) {\n    this.notifications = this.notifications.filter(notif => notif.id !== id);\n  }\n\n  render() {\n    return (\n      <Host>\n        <Fragment>\n          {this.notifications.map(notif => (\n            <div class={`notif ${notif.type}`} key={notif.id}>\n              <div class=\"content\">\n                <span class={`icon ${notif.type}`}>{(notif.type === 'error' || notif.type === 'warning') && <warning-icon />}</span>\n                <span class=\"message\">\n                  <span class=\"title\">{notif.title}</span>\n                  {notif.description && <span class=\"description\">{notif.description}</span>}\n                </span>\n              </div>\n              <button class=\"dismiss-btn\" onClick={() => this.dismissNotification(notif.id)}>\n                <close-icon />\n              </button>\n            </div>\n          ))}\n          <slot />\n        </Fragment>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/nylas-open-hours-picker.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface NylasOpenHoursPicker extends Components.NylasOpenHoursPicker, HTMLElement {}
+export const NylasOpenHoursPicker: {
+    prototype: NylasOpenHoursPicker;
+    new (): NylasOpenHoursPicker;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;