Skip to content

gitart-group/gitart-manage-vue-dialog

Repository files navigation

gitart-manage-vue-dialog

The dialog utilities allow you to manage dialogs consistently without putting the components in the template. Or even launch dialogs from a store.

Works with any dialog component. The component should have modelValue prop that is used to open and close the dialog.

You can import all these properties from the gitart-manage-vue-dialog module.

  • gitartDialogInjectionKey - vue injection key for the dialog controller
  • gitartDialogPlugin - vue plugin. Usage below
  • GDialogSpawn - component to use with plugin. Usage below
  • IGDialog - read the codebase for more information
  • IGDialogItem - read the codebase for more information
  • useDialogConfirm - read the codebase for more information
  • useDialogReturnData - read the codebase for more information
  • useGDialog - helper to use the dialog controller. Usage below

Installation

App.vue

import { GDialogSpawn } from 'gitart-manage-vue-dialog'
<GDialogSpawn />

main.ts

import { gitartDialogPlugin } from 'gitart-manage-vue-dialog'

app.use(gitartDialogPlugin)

Usage

You can receive the dialog controller by injection or by using the useGDialog function.

  import { gitartDialogInjectionKey } from 'gitart-manage-vue-dialog'

  const $dialog = inject(gitartDialogInjectionKey)!

  const openDialog = () => {
    $dialog.addDialog({
      component: MyDialog,
      props: {
        title: 'My dialog',
      },
    })
  }
  import { useGDialog } from 'gitart-manage-vue-dialog'

  const $dialog = useGDialog()

  const openDialog = () => {
    $dialog.addDialog({
      component: MyDialog,
      props: {
        title: 'My dialog',
      },
    })
  }

$dialog has the following methods and properties:

  • addDialog - add a dialog to the queue
  • dialogs - list of dialogs
  • removeDialog - remove a dialog from the queue

About

Dialog management utilities

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published