From 4f234ecb1277d6064e746d5b909b7f132f4ffac6 Mon Sep 17 00:00:00 2001
From: Hiws <hiws@live.dk>
Date: Thu, 25 Mar 2021 05:03:19 +0100
Subject: [PATCH 1/2] Update method and docs

---
 src/components/modal/README.md  | 53 ++++++++++++++++++++++++++-------
 src/components/modal/index.d.ts |  2 +-
 src/components/modal/modal.js   |  4 +--
 3 files changed, 45 insertions(+), 14 deletions(-)

diff --git a/src/components/modal/README.md b/src/components/modal/README.md
index d6cd0cbe3e1..a71b67122e7 100644
--- a/src/components/modal/README.md
+++ b/src/components/modal/README.md
@@ -81,7 +81,7 @@ several methods, of which two are for showing and hiding modals:
 | Method                   | Description                            |
 | ------------------------ | -------------------------------------- |
 | `this.$bvModal.show(id)` | Show the modal with the specified `id` |
-| `this.$bvModal.hide(id)` | Hide the modal with the specified `id` |
+| `this.$bvModal.hide(id, trigger = "event")` | Hide the modal with the specified `id`, and optionally supply a `trigger` like `ok`. Which will cause the modal to close as if the `OK` button was clicked |
 
 Both methods return immediately after being called.
 
@@ -958,24 +958,31 @@ method to generate VNodes.
 <template>
   <div>
     <b-button @click="showMsgOk">Show OK message box with custom content</b-button>
+    Return value: {{ returnValue }}
   </div>
 </template>
 
 <script>
   export default {
+    data() {
+      return {
+        returnValue: ''
+      }
+    },
     methods: {
-      showMsgOk() {
+      async showMsgOk() {
         const h = this.$createElement
+        const modalId = "my-confirm-modal";
         // Using HTML string
         const titleVNode = h('div', { domProps: { innerHTML: 'Title from <i>HTML<i> string' } })
         // More complex structure
         const messageVNode = h('div', { class: ['foobar'] }, [
-          h('p', { class: ['text-center'] }, [
+          h('p', { staticClass: 'text-center' }, [
             ' Flashy ',
             h('strong', 'msgBoxOk'),
             ' message ',
           ]),
-          h('p', { class: ['text-center'] }, [h('b-spinner')]),
+          h('p', { staticClass: 'text-center' }, [h('b-spinner')]),
           h('b-img', {
             props: {
               src: 'https://picsum.photos/id/20/250/250',
@@ -983,14 +990,38 @@ method to generate VNodes.
               center: true,
               fluid: true, rounded: 'circle'
             }
-          })
+          }),
+          // You can use `$bvModal.hide` to hide the modal along with an optional trigger to create custom `ok` or `cancel`.
+          h('p', { staticClass: 'd-flex justify-content-around mt-2' }, [
+            h('b-button', {
+              props: { variant: 'danger' },
+              on: {
+                click: () => {
+                  this.$bvModal.hide(modalId, 'cancel')
+                }
+              }
+            }, 'Custom \'CANCEL\' button'),
+            h('b-button', {
+              props: { variant: 'primary' },
+              on: {
+                click: () => {
+                  this.$bvModal.hide(modalId, 'ok')
+                }
+              }
+            }, 'Custom \'OK\' button')
+          ])
         ])
         // We must pass the generated VNodes as arrays
-        this.$bvModal.msgBoxOk([messageVNode], {
-          title: [titleVNode],
-          buttonSize: 'sm',
-          centered: true, size: 'sm'
-        })
+        try {
+          this.returnValue = await this.$bvModal.msgBoxConfirm([messageVNode], {
+            id: modalId,
+            title: [titleVNode],
+            buttonSize: 'sm',
+            centered: true
+          })
+        } catch(err) {
+          // An error occurred
+        }        
       }
     }
   }
@@ -1190,4 +1221,4 @@ Notes on `v-b-modal` directive accessibility:
   then a `tabindex` of `0` will be added to the element to ensure accessibility, unless there is
   already a `tabindex` set.
 
-<!-- Component reference added automatically from component package.json -->
+<!-- Component reference added automatically from component package.json -->
\ No newline at end of file
diff --git a/src/components/modal/index.d.ts b/src/components/modal/index.d.ts
index 4b316aca023..e282e70a8fc 100644
--- a/src/components/modal/index.d.ts
+++ b/src/components/modal/index.d.ts
@@ -83,7 +83,7 @@ export interface BvModal {
   show: (id: string) => void
 
   // Hide a modal by id
-  hide: (id: string) => void
+  hide: (id: string, trigger?: string) => void
 }
 
 // --- Vue prototype injections ---
diff --git a/src/components/modal/modal.js b/src/components/modal/modal.js
index a66eabf0bda..ee0ed274f8b 100644
--- a/src/components/modal/modal.js
+++ b/src/components/modal/modal.js
@@ -697,9 +697,9 @@ export const BModal = /*#__PURE__*/ Vue.extend({
         this.show()
       }
     },
-    hideHandler(id) {
+    hideHandler(id, trigger = 'event') {
       if (id === this.modalId) {
-        this.hide('event')
+        this.hide(trigger)
       }
     },
     toggleHandler(id, triggerEl) {

From b2b5c7b5087d46cb1662ec69951dde6fba2a518c Mon Sep 17 00:00:00 2001
From: Hiws <hiws@live.dk>
Date: Thu, 25 Mar 2021 05:13:40 +0100
Subject: [PATCH 2/2] Update package.json

---
 src/components/modal/package.json | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/src/components/modal/package.json b/src/components/modal/package.json
index 28c2c692dc2..1cca2ba5a78 100644
--- a/src/components/modal/package.json
+++ b/src/components/modal/package.json
@@ -397,6 +397,11 @@
                 "arg": "modalId",
                 "type": "String",
                 "description": "ID of modal to hide"
+              },
+              {
+                "arg": "trigger",
+                "type": "String",
+                "description": "Specify which trigger the modal should use when hidden, like `ok`, `cancel` or event a custom trigger (optional)"
               }
             ]
           },