feat: initial

Author: Djaler

.eslintignore

@@ -0,0 +1,4 @@
+/dist/
+/coverage/
+/reports/
+/stryker-tmp/

.eslintrc.js

@@ -0,0 +1,12 @@
+module.exports = {
+    root: true,
+    extends: ['@djaler/typescript'],
+    parserOptions: {
+        project: './tsconfig.lint.json',
+    },
+    settings: {
+        'import/resolver': {
+            typescript: {},
+        },
+    },
+};

.gitattributes

@@ -0,0 +1,2 @@
+*.js text eol=lf
+*.ts text eol=lf

.github/workflows/checks.yml

@@ -0,0 +1,69 @@
+name: Checks
+
+on:
+  push:
+    branches: [ master ]
+  pull_request:
+    branches: [ master ]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Check out Git repository
+        uses: actions/checkout@v2
+      - name: Set up Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: 12
+      - name: Install dependencies
+        uses: pnpm/[email protected]
+        with:
+          version: 5
+          run_install: true
+      - name: Run build
+        run: npm run build
+
+  lint:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Check out Git repository
+        uses: actions/checkout@v2
+      - name: Set up Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: 12
+      - name: Install dependencies
+        uses: pnpm/[email protected]
+        with:
+          version: 5
+          run_install: true
+      - name: Run linter
+        uses: samuelmeuli/lint-action@v1
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          eslint: true
+
+  test:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Check out Git repository
+        uses: actions/checkout@v2
+      - name: Set up Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: 12
+      - name: Install dependencies
+        uses: pnpm/[email protected]
+        with:
+          version: 5
+          run_install: true
+      - name: Run tests
+        uses: mattallty/[email protected]
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          test-command: "npm run test"

.github/workflows/mutation-test.yml

@@ -0,0 +1,26 @@
+name: Mutation Test
+
+on:
+  push:
+    branches: [ master ]
+
+jobs:
+  mutation-test:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Check out Git repository
+        uses: actions/checkout@v2
+      - name: Set up Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: 12
+      - name: Install dependencies
+        uses: pnpm/[email protected]
+        with:
+          version: 5
+          run_install: true
+      - name: Run Stryker
+        run: npm run stryker -- --reporters dashboard --dashboard.reportType full
+        env:
+          STRYKER_DASHBOARD_API_KEY: ${{ secrets.STRYKER_DASHBOARD_API_KEY  }}

.github/workflows/release.yml

@@ -0,0 +1,27 @@
+name: Release
+
+on:
+  push:
+    tags:
+      - 'v*'
+
+jobs:
+  publish:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Check out Git repository
+        uses: actions/checkout@v2
+      - name: Set up Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: 12
+      - name: Install dependencies
+        uses: pnpm/[email protected]
+        with:
+          version: 5
+          run_install: true
+      - name: Publish package
+        uses: JS-DevTools/npm-publish@v1
+        with:
+          token: ${{ secrets.NPM_TOKEN }}

.gitignore

@@ -0,0 +1,6 @@
+node_modules/
+coverage/
+reports/
+dist/
+stryker-tmp/
+.idea/

.npmrc

@@ -0,0 +1 @@
+shamefully-hoist=true

README.md

@@ -0,0 +1,96 @@
+[![Mutation testing badge](https://img.shields.io/endpoint?style=for-the-badge&url=https%3A%2F%2Fbadge-api.stryker-mutator.io%2Fgithub.com%2FDjaler%2Fvue-promise-dialogs%2Fmaster)](https://dashboard.stryker-mutator.io/reports/github.com/Djaler/vue-promise-dialogs/master)
+
+# Vue Promise Dialogs
+
+> A tiny & modern library that allows you to work with dialogs as with asynchronous functions.
+
+## Why?
+
+Because many dialogs work exactly as promises. 
+They are opened (called) and then closed with some result (resolved) or canceled (rejected).
+
+## Install
+
+```sh
+npm install --save vue-promise-dialogs
+```
+
+Or for a CDN version, you can use it on [unpkg.com](https://unpkg.com/vue-promise-dialogs)
+
+## Usage
+
+Main requirements:
+
+1. You should mount exactly one `PromiseDialogsWrapper` somewhere in your application root.
+2. The dialog component should accept `params` props.
+3. The dialog component should emit `resolve` or `reject` events when the user makes a decision.
+
+```ts
+import { createPromiseDialog } from "vue-promise-dialogs"
+
+const BooleanDialog = Vue.extend({
+    template: `
+      <div class="dialog">
+          <p>{{ params.text }}</p>
+          <button name="true" @click="$emit('resolve', true)">True</button>
+          <button name="false" @click="$emit('resolve', false)">False</button>
+          <button name="cancel" @click="$emit('reject', 'cancel')">Cancel</button>
+      </div>
+    `,
+    props: {
+        params: {
+            type: Object,
+            required: true,
+        },
+    },
+});
+
+// First type argument is the type of params prop that will be passed to component
+// Second type argument is the type of value with which the promise will be fulfilled
+const openDialog = createPromiseDialog<{ text: string }, boolean>(BooleanDialog);
+
+// When you call this function, dialog will be mounted to `PromiseDialogsWrapper`.
+// When user press any button and resolve/reject event emitted, promise will be settled and dialog will be destroyed.
+const result: boolean = await openDialog({ text: 'Some text' });
+```
+
+### Vue Class Component Example
+
+If you're using Vue Class Component to define your dialog components, you can extend them from `BasePromiseDialog`.
+This will allow you to avoid defining type arguments in `createPromiseDialog`.
+`BasePromiseDialog` already defines `params` prop and methods `resolve`/`reject`, so you don't have to.
+
+```ts
+import { Component } from "vue-class-component"
+import { BasePromiseDialog, createPromiseDialog } from "vue-promise-dialogs"
+
+@Component({
+    template: `
+      <div class="dialog">
+          <p>{{ params.text }}</p>
+          <button name="true" @click="onTrue">True</button>
+          <button name="false" @click="onFalse">False</button>
+          <button name="cancel" @click="onCancel">Cancel</button>
+      </div>
+    `,
+})
+// You need to extend your component from BasePromiseDialog with correct type arguments
+class BooleanDialog extends BasePromiseDialog<{ text: string }, boolean> {
+    onTrue() {
+        this.resolve(true);
+    }
+
+    onFalse() {
+        this.resolve(true);
+    }
+
+    onCancel() {
+        this.reject('cancel');
+    }
+}
+
+// You don't have to specify type arguments because they are inferenced from BooleanDialog
+const openDialog = createPromiseDialog(BooleanDialog);
+
+const result: boolean = await openDialog({ text: 'Some text' });
+```

jest.config.js

@@ -0,0 +1,14 @@
+const { pathsToModuleNameMapper } = require('ts-jest/utils');
+const { compilerOptions } = require('./tsconfig');
+
+module.exports = {
+    preset: 'ts-jest/presets/js-with-ts',
+    collectCoverageFrom: ['src/**'],
+    moduleNameMapper: {
+        ...pathsToModuleNameMapper(compilerOptions.paths, { prefix: '<rootDir>/' }),
+        vue$: require.resolve('vue/dist/vue.common.js'),
+    },
+    testMatch: [
+        '<rootDir>/tests/**/*.spec.ts',
+    ],
+};