Property 'hide' does not exist on type on build

I am new to quasar framework.

I have created one component & used it modal popup. I have followed this

Dialog is opening using below.

methods: {
  openStoreModal(store:Store) {
    this.$q.dialog({
      component: StoreComponent,
      parent: this,
      title: store.name,
      store: store,
    });
  }
}

Html of custom dialog component.

Html

<template>
  <q-dialog
    ref="dialog"
    @hide="onDialogHide"
  >
    <q-card 
      class="q-dialog-plugin"
      style="width: 700px; max-width: 80vw;"
    >

and inside custom dialog component

methods: {
  show() {
    this.$refs.dialog.show();
  },
  hide() {
    this.$refs.dialog.hide();
  },
  onDialogHide() {
    this.$emit('hide');
  },
  onCloseClick() {
    this.hide();
  }
}

I am getting this error on build.

What am i missing here?