@apollo-elements/fast/bases/apollo-element.js

👩‍🚀🌛 FastElements for Apollo GraphQL 🚀👨‍🚀

import { __decorate } from "tslib";
import { FASTElement, observable } from '@microsoft/fast-element';
import { ApolloElementEvent } from '@apollo-elements/core/events';
import { controlled } from '@apollo-elements/core/decorators';
import { hosted } from './decorators';
/**
 * `ApolloElement`
 *
 * 🚀 Single-operation custom-element base class for Apollo FAST elements.
 *
 * See [`ApolloElementInterface`](https://apolloelements.dev/api/core/interfaces/element) for more information on events
 *
 * @element
 */

export class ApolloElement extends FASTElement {
  constructor() {
    super(...arguments);
    this.readyToReceiveDocument = false;
    /** @summary The Apollo Client instance */

    this.client = window.__APOLLO_CLIENT__ ?? null;
    /**
     * @summary Operation document.
     * GraphQL operation document i.e. query, subscription, or mutation.
     * Must be a parsed GraphQL `DocumentNode`
     */

    this.document = null;
    /** @summary Whether a request is in flight. */

    this.loading = false;
    /** @summary Latest Data. */

    this.data = null;
    /** @summary Operation variables. */

    this.variables = null;
    /** @summary Latest error */

    this.error = null;
    /** @summary Latest errors */

    this.errors = [];
  }

  connectedCallback() {
    this.readyToReceiveDocument = true;
    super.connectedCallback();
    this.dispatchEvent(new ApolloElementEvent('apollo-element-connected', this));
  }

  disconnectedCallback() {
    this.readyToReceiveDocument = false;
    this.dispatchEvent(new ApolloElementEvent('apollo-element-disconnected', this));
    window.dispatchEvent(new ApolloElementEvent('apollo-element-disconnected', this));
    super.disconnectedCallback?.();
    /* c8 ignore start */
    // manual testing showed that both cases were hit
  }

}

__decorate([observable, hosted(), controlled()], ApolloElement.prototype, "client", void 0);

__decorate([hosted(), controlled()], ApolloElement.prototype, "document", void 0);

__decorate([hosted({
  path: 'options'
}), controlled({
  path: 'options'
})], ApolloElement.prototype, "context", void 0);

__decorate([controlled({
  onSet(v) {
    this.toggleAttribute('loading', v);
  }

})], ApolloElement.prototype, "loading", void 0);

__decorate([hosted(), controlled()], ApolloElement.prototype, "data", void 0);

__decorate([hosted(), controlled()], ApolloElement.prototype, "variables", void 0);

__decorate([hosted(), controlled()], ApolloElement.prototype, "error", void 0);

__decorate([hosted(), controlled()], ApolloElement.prototype, "errors", void 0);
//# sourceMappingURL=apollo-element.js.map