vue-feedback-dialog

Feedback dialog for Vue/Vuetify

Demo

Icon (right bottom corner fixed):

Info screen:

Input screen:

Install

Install Vuetify See documentation
Install component:

npm install @dsb-norge/vue-feedback-dialog --save

Usage

Setup

Import in component (or use global):

import VueFeedbackDialog from '@dsb-norge/vue-feedback-dialog'

components: {
    VueFeedbackDialog
}

<VueFeedbackDialog
    :messages="messages"
    :options="options"
    @feedback="handleFeedback"
/>

Messages format: (optional)

      messages: [
        {
          header: 'Maintenance 23.02.20', (h5)
          info: 'Describing text' (p)
        },
        {
          header: 'Down time 10.05.20', (h5)
          info: 'Describing text' (p)
        }
      ]

Options format: (optional)

    defaultOptions: {
        text: {
            headerInfo: 'Information: ',
            headerDialog: 'Report error or suggestion: ',
            dialogLeftControlText: 'Back',
            infoLeftControlText: 'Close',
            dialogRightControlText: 'Send',
            infoRightControlText: 'Report bug',
            reporter: 'Reporter',
            reporterError: 'This field is required',
            description: 'Description...',
            descriptionError: 'This field is required',
            email: 'Email',
            emailError: 'Invalid email address'
        },
        layout: {
            color: '#34495e',
            border: '#34495e',
            background: '#FFF'
        }
    }

Options

Name	Type	Default
headerInfo	String	Information: (h4)
headerDialog	String	Report error or suggestion: (h4)
dialogLeftControlText	String	Back
infoLeftControlText	String	Close
dialogRightControlText	String	Send
infoRightControlText	String	Report bug
reporter	String	Reporter
reporterError	String	This field is required
description	String	Description...
descriptionError	String	This field is required
email	String	Email
emailError	String	Invalid email address
color	String	#34495e
border	String	#34495e
background	String	#FFF

Props

Name	Type	Description
options	Object	Options object as described above
messages	Array	Info messages to user
meta	String	Additional meta information, ie: App version, date time etc

Events

Name	Description
feedback	Triggered on send, user click send on input form

Value in feedback event:

    {
        reporter: this.reporter,
        description: this.description,
        path: window.location.href,
        email: this.email,
        meta: this.meta
    }

Feedback only mode

If no messages is provided only the feedback form will be visible.

Build:

Compile and build for production

npm run build

Publish to NPM

# Do some work...

# x.x.1 -> x.x.2
npm version patch

# x.1.0 -> x.2.0
npm version minor

# 1.0.0 -> 2.0.0
npm version major

All these will:

Set the version number in package.json
Build the plugin
Commit version to git and push upstream
Publish the plugin to NPM registry

Dependency Dashboard

This issue provides visibility into Renovate updates and their statuses. Learn more

Edited/Blocked

These updates have been manually edited so Renovate will no longer make changes. To discard all commits and start over, click on a checkbox.

Update frontend - minor and patch (@vue/cli-plugin-babel, @vue/cli-service, sass, sass-loader, vue-cli-plugin-vuetify, vuetify)

Open

These updates have all been created already. Click a checkbox below to force a retry/rebase of any.

Update dependency sass-loader to v13

Ignored or Blocked

These are blocked by an existing closed PR and will not be recreated unless you click a checkbox below.

Pin dependencies (@vue/cli-plugin-babel, @vue/cli-service, sass, sass-loader, vue, vue-cli-plugin-vuetify, vue-template-compiler, vuetify, vuetify-loader)
Update dependency @vue/cli-plugin-babel to v5
Update dependency @vue/cli-service to v5
Update dependency vue to v3

Detected dependencies

npm

package.json

@vue/cli-plugin-babel ^4.5.15

@vue/cli-service ^4.5.15

sass ^1.32.13

sass-loader ^10.2.0

vue ^2.6.14

vue-cli-plugin-vuetify ^2.4.5

vue-template-compiler ^2.6.14

vuetify ^2.6.3

vuetify-loader ^1.7.3

Check this box to trigger a request for Renovate to run again on this repository

dsb-norge / vue-feedback-dialog Goto Github PK