From 4458656be5547fc9505a5c4758bea4818ada408b Mon Sep 17 00:00:00 2001
From: Benjamin Canac <canacb1@gmail.com>
Date: Mon, 29 May 2023 21:59:59 +0200
Subject: [PATCH] chore(Notification)!: rename to `closeButton` and
 `actionButton` for consistency

---
 docs/content/1.getting-started/3.theming.md      |  2 +-
 docs/content/5.overlays/6.notification.md        | 10 +++++-----
 src/runtime/app.config.ts                        |  4 ++--
 src/runtime/components/overlays/Notification.vue | 10 +++++-----
 src/runtime/types/notification.d.ts              |  2 +-
 5 files changed, 14 insertions(+), 14 deletions(-)

diff --git a/docs/content/1.getting-started/3.theming.md b/docs/content/1.getting-started/3.theming.md
index 412eca94..63799e9f 100644
--- a/docs/content/1.getting-started/3.theming.md
+++ b/docs/content/1.getting-started/3.theming.md
@@ -176,7 +176,7 @@ export default defineAppConfig({
     },
     notification: {
       default: {
-        close: {
+        closeButton: {
           icon: 'i-octicon-x-24'
         }
       }
diff --git a/docs/content/5.overlays/6.notification.md b/docs/content/5.overlays/6.notification.md
index 728f6e49..224ef67d 100644
--- a/docs/content/5.overlays/6.notification.md
+++ b/docs/content/5.overlays/6.notification.md
@@ -187,9 +187,9 @@ function onCallback () {
 
 ### Close
 
-Use the `close` prop to hide or customize the close button on the Notification.
+Use the `close-button` prop to hide or customize the close button on the Notification.
 
-You can pass all the props of the [Button](/elements/button) component to customize it through the `close` prop or globally through `ui.notifications.default.close`.
+You can pass all the props of the [Button](/elements/button) component to customize it through the `close-button` prop or globally through `ui.notifications.default.closeButton`.
 
 ::component-card
 ---
@@ -198,7 +198,7 @@ baseProps:
   title: 'Notification'
   timeout: 0
 props:
-  close:
+  closeButton:
     icon: 'i-heroicons-archive-box-x-mark'
     color: 'primary'
     variant: 'outline'
@@ -207,7 +207,7 @@ props:
     ui:
       rounded: 'rounded-full'
 excludedProps:
-  - close
+  - closeButton
 ---
 ::
 
@@ -230,7 +230,7 @@ const toast = useToast()
 ```
 ::
 
-Like for `close`, you can pass all the props of the [Button](/elements/button) component inside the action or globally through `ui.notifications.default.action`.
+Like for `closeButton`, you can pass all the props of the [Button](/elements/button) component inside the action or globally through `ui.notifications.default.actionButton`.
 
 ::component-card
 ---
diff --git a/src/runtime/app.config.ts b/src/runtime/app.config.ts
index 1aff3cd6..fc5d2a17 100644
--- a/src/runtime/app.config.ts
+++ b/src/runtime/app.config.ts
@@ -744,13 +744,13 @@ const notification = {
   default: {
     color: 'primary',
     icon: null,
-    close: {
+    closeButton: {
       icon: 'i-heroicons-x-mark-20-solid',
       color: 'gray',
       variant: 'link',
       padded: false
     },
-    action: {
+    actionButton: {
       size: 'xs',
       color: 'white'
     }
diff --git a/src/runtime/components/overlays/Notification.vue b/src/runtime/components/overlays/Notification.vue
index 249d78e6..aa771671 100644
--- a/src/runtime/components/overlays/Notification.vue
+++ b/src/runtime/components/overlays/Notification.vue
@@ -16,15 +16,15 @@
               </p>
 
               <div v-if="description && actions.length" class="mt-3 flex items-center gap-2">
-                <UButton v-for="(action, index) of actions" :key="index" v-bind="{ ...ui.default.action, ...action }" @click.stop="onAction(action)" />
+                <UButton v-for="(action, index) of actions" :key="index" v-bind="{ ...ui.default.actionButton, ...action }" @click.stop="onAction(action)" />
               </div>
             </div>
             <div class="flex-shrink-0 flex items-center gap-3">
               <div v-if="!description && actions.length" class="flex items-center gap-2">
-                <UButton v-for="(action, index) of actions" :key="index" v-bind="{ ...ui.default.action, ...action }" @click.stop="onAction(action)" />
+                <UButton v-for="(action, index) of actions" :key="index" v-bind="{ ...ui.default.actionButton, ...action }" @click.stop="onAction(action)" />
               </div>
 
-              <UButton v-if="close" v-bind="{ ...ui.default.close, ...close }" @click.stop="onClose" />
+              <UButton v-if="closeButton" v-bind="{ ...ui.default.closeButton, ...closeButton }" @click.stop="onClose" />
             </div>
           </div>
         </div>
@@ -80,9 +80,9 @@ export default defineComponent({
       type: Object as PropType<Partial<Avatar>>,
       default: null
     },
-    close: {
+    closeButton: {
       type: Object as PropType<Partial<Button>>,
-      default: () => appConfig.ui.notification.default.close
+      default: () => appConfig.ui.notification.default.closeButton
     },
     timeout: {
       type: Number,
diff --git a/src/runtime/types/notification.d.ts b/src/runtime/types/notification.d.ts
index 3add0e10..8ee8fec3 100644
--- a/src/runtime/types/notification.d.ts
+++ b/src/runtime/types/notification.d.ts
@@ -12,7 +12,7 @@ export interface Notification {
   description: string
   icon?: string
   avatar?: Partial<Avatar>
-  close?: Partial<Button>
+  closeButton?: Partial<Button>
   timeout: number
   actions?: NotificationAction[]
   click?: Function