How to use the @stencil/core.Method function in @stencil/core

resolve();
    });
  }

  private lazyLoadAllContent(): Promise {
    const promises = [];

    for (let i = 0; i < this.length; i++) {
      promises.push(this.lazyLoadContent(i));
    }

    return Promise.all(promises);
  }

  @Method()
  isMobile(): Promise {
    return new Promise((resolve) => {
      resolve(isMobile());
    });
  }

  /* END: Utils */

  /* BEGIN: Reveal */

  @Watch('reveal')
  async onRevealChange() {
    if (!this.reveal) {
      await this.revealAllContent();
    } else {
      await this.redoRevealContent();

}

  /**
   * @hidden
   */
  @Method()
  _register(menu: Menu) {
    if (this.menus.indexOf(menu) < 0) {
      this.menus.push(menu);
    }
  }

  /**
   * @hidden
   */
  @Method()
  _unregister(menu: Menu) {
    const index = this.menus.indexOf(menu);
    if (index > -1) {
      this.menus.splice(index, 1);
    }
  }

  /**
   * @hidden
   */
  @Method()
  _setActiveMenu(menu: Menu) {
    // if this menu should be enabled
    // then find all the other menus on this same side
    // and automatically disable other same side menus
    const side = menu.side;

emitter: DeckdeckgoEventEmitter.DECK,
        length: this.length,
        deck: this.deck,
        mobile: isMobile()
      });

      resolve();
    });
  }

  @Method()
  async updateSlides() {
    await this.sendSlidesToApp(DeckdeckgoEventType.DECK_UPDATE);
  }

  @Method()
  async updateSlide(index: number, slide: DeckdeckgoSlideDefinition) {
    return new Promise((resolve) => {
      if (!this.deck || !this.deck.slides || this.deck.slides.length <= index || index < 0) {
        resolve();
        return;
      }

      this.deck.slides[index] = slide;

      if (!slide) {
        resolve();
        return;
      }

      this.communicationService.emit({
        type: DeckdeckgoEventType.SLIDE_UPDATE,

emitter: DeckdeckgoEventEmitter.DECK,
      index: index,
      speed: speed
    });
  }

  @Method()
  async play() {
    this.communicationService.emit({
      type: DeckdeckgoEventType.SLIDE_ACTION,
      emitter: DeckdeckgoEventEmitter.DECK,
      action: DeckdeckgoSlideAction.PLAY
    });
  }

  @Method()
  async pause() {
    this.communicationService.emit({
      type: DeckdeckgoEventType.SLIDE_ACTION,
      emitter: DeckdeckgoEventEmitter.DECK,
      action: DeckdeckgoSlideAction.PAUSE
    });
  }

  private clear(): Promise {
    return new Promise((resolve) => {
      this.ctx.beginPath();
      this.ctx.clearRect(-1 * this.leftOffset, 0, this.width, this.height);
      this.ctx.stroke();
      this.ctx.closePath();

      this.drawables = [];

this.reduxState = this.fieldSelector(reduxState, this.name);
    this.submitting = reduxState.submitting;

    this.formValueChangeHandler = formValueChangeHandler;
  }

  @autobind
  private fieldValueChangeHandler(value: string): void {
    const validation: AppFormError = this.validate(value);

    this.formValueChangeHandler(this.name, value, validation ? validation.message : '');

    this.onValueChange(value);
  }

  @Method()
  public validate(value: string | boolean = this.reduxState.value): AppFormError {
    return {
      field: this.name,
      message: this.validators.reduce((err: string, validator: AppFormValidator) => {
        if (err.length > 0) {
          return err;
        }

        return validator(value);
      }, '')
    };
  }

  public render(): JSX.Element {
    if (this.reduxState === null) {
      return null;

if (this.duration > 0) {
      this.durationTimeout = setTimeout(() => this.dismiss(), this.duration);
    }
  }

  /**
   * Dismiss the picker overlay after it has been presented.
   *
   * @param data Any data to emit in the dismiss events.
   * @param role The role of the element that is dismissing the picker.
   * This can be useful in a button handler for determining which button was
   * clicked to dismiss the picker.
   * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
   */
  @Method()
  dismiss(data?: any, role?: string): Promise {
    if (this.durationTimeout) {
      clearTimeout(this.durationTimeout);
    }
    return dismiss(this, data, role, 'pickerLeave', iosLeaveAnimation, iosLeaveAnimation);
  }

  /**
   * Returns a promise that resolves when the picker did dismiss.
   */
  @Method()
  onDidDismiss(): Promise {
    return eventMethod(this.el, 'ionPickerDidDismiss');
  }

  /**

}

  /**
   * Returns a promise that resolves when the alert did dismiss.
   *
   */
  @Method()
  onDidDismiss(): Promise {
    return eventMethod(this.el, 'ionAlertDidDismiss');
  }

  /**
   * Returns a promise that resolves when the alert will dismiss.
   *
   */
  @Method()
  onWillDismiss(): Promise {
    return eventMethod(this.el, 'ionAlertWillDismiss');
  }

  private rbClick(selectedInput: AlertInput) {
    for (const input of this.processedInputs) {
      input.checked = input === selectedInput;
    }
    this.activeId = selectedInput.id;
    if (selectedInput.handler) {
      selectedInput.handler(selectedInput);
    }
    this.el.forceUpdate();
  }

  private cbClick(selectedInput: AlertInput) {

async reset() {
    this.animation.reset();
  }

  @Method()
  async update(value: number) {
    this.animation.update(value);
  }

  @Method()
  async restart() {
    this.animation.reset();
    this.animation.start();
  }

  @Method()
  async pauseResume() {
    this.animation.pauseResume();
  }

  render() {
    return (
      <div class="c-counter">
        <span class="c-counter__prefix">
          
        </span>
        <span class="c-counter__amount">
        <span class="c-counter__suffix">
          
        </span>
      </span></div>
    );

this.clientWidth = this.el.clientWidth;

    if (this.activeTabIndex > 0) {
      requestAnimationFrame(() => {
        this.alignIndicator(this.activeTabIndex);
      });
    }
  }

  componentWillUpdate() {
    this.debug('componentWillUpdate');
    this.updateThresholds();
  }

  /** @internal */
  @Method()
  setActiveTab(index: number, align?: boolean, animate?: boolean): Promise {
    this.activeTabIndex = index;
    this.markButtonActive(this.buttons[index]);

    if (align) {
      this.alignIndicator(index, animate);
    }

    return Promise.resolve();
  }

  /** @internal */
  @Method()
  setSelectedTab(index: number, animate?: boolean): Promise {
    this.alignIndicator(index, animate);
    return Promise.resolve();

message.footer = new Date().toLocaleString('en-US', {
      hour: 'numeric', minute: 'numeric', hour12: true
    });
    this.mapInputTextToHtmlElements(text)
      .map(element => message.appendChild(element));
    this.pane.appendChild(message);
    this.conversation.scrollToBottom();
    return message;
  }

  @Method()
  async scrollToBottom() {
    return this.conversation.scrollToBottom();
  }

  @Method()
  async addOutgoingMessage(text: string) {
    return this.addMessage('outgoing', text)
  }

  @Method()
  async addIncomingMessage(text: string) {
    return this.addMessage('incoming', text)
  }

  @Method()
  async addCard({text, image}: {text?: string, image?: string}): Promise {
    const card = document.createElement('ion-card');
    card.setAttribute('style', 'background: white;');
    if (image) {
      const imgElement = document.createElement('img');
      imgElement.src = image;