diff --git a/src/components/NcButton/NcButton.vue b/src/components/NcButton/NcButton.vue
index a1d4a95734..7659573a47 100644
--- a/src/components/NcButton/NcButton.vue
+++ b/src/components/NcButton/NcButton.vue
@@ -686,9 +686,7 @@ export default defineComponent({
hasIcon
? h('span', {
class: 'button-vue__icon',
- attrs: {
- 'aria-hidden': 'true',
- },
+ 'aria-hidden': 'true',
},
[this.$slots.icon?.()],
)
diff --git a/src/components/NcDialog/NcDialog.vue b/src/components/NcDialog/NcDialog.vue
index 5db3d09ea6..579baea812 100644
--- a/src/components/NcDialog/NcDialog.vue
+++ b/src/components/NcDialog/NcDialog.vue
@@ -95,6 +95,7 @@ Note that this is not possible if the dialog contains a navigation!
name="Choose a name"
v-model:open="showDialog"
@submit="currentName = newName"
+ @reset="newName = ''"
@closing="newName = ''">
+ @click="(_, result) => handleButtonClose(button, result)" />
@@ -383,7 +388,7 @@ export default defineComponent({
},
/**
- * Optionally pass additionaly classes which will be set on the navigation for custom styling
+ * Optionally pass additional classes which will be set on the navigation for custom styling
* @default ''
* @example
* ```html
@@ -427,7 +432,7 @@ export default defineComponent({
},
/**
- * Optionally pass additionaly classes which will be set on the content wrapper for custom styling
+ * Optionally pass additional classes which will be set on the content wrapper for custom styling
* @default ''
*/
contentClasses: {
@@ -437,7 +442,7 @@ export default defineComponent({
},
/**
- * Optionally pass additionaly classes which will be set on the dialog itself
+ * Optionally pass additional classes which will be set on the dialog itself
* (the default `class` attribute will be set on the modal wrapper)
* @default ''
*/
@@ -516,6 +521,16 @@ export default defineComponent({
/** Forwarded HTMLFormElement submit event (only if `is-form` is set) */
emit('submit', event)
},
+ /**
+ * @param {Event} event Form submit event
+ */
+ reset(event) {
+ event.preventDefault()
+ /**
+ * Forwarded HTMLFormElement reset event (only if `is-form` is set).
+ */
+ emit('reset', event)
+ },
}
: {},
)
@@ -528,12 +543,14 @@ export default defineComponent({
// Because NcModal does not emit `close` when show prop is changed
/**
* Handle clicking a dialog button -> should close
- * @param {MouseEvent} event The click event
+ * @param {MouseEvent} button The button that was clicked
* @param {unknown} result Result of the callback function
*/
- const handleButtonClose = (event, result) => {
- // Skip close if invalid dialog
- if (dialogTagName.value === 'form' && !dialogElement.value.reportValidity()) {
+ function handleButtonClose(button, result) {
+ // Skip close on submit if invalid dialog
+ if (button.nativeType === 'submit'
+ && dialogTagName.value === 'form'
+ && !dialogElement.value.reportValidity()) {
return
}
handleClosing(result)
diff --git a/src/components/NcDialogButton/NcDialogButton.vue b/src/components/NcDialogButton/NcDialogButton.vue
index 609b13baa5..ad3b124fcc 100644
--- a/src/components/NcDialogButton/NcDialogButton.vue
+++ b/src/components/NcDialogButton/NcDialogButton.vue
@@ -28,16 +28,18 @@ Dialog button component used by NcDialog in the actions slot to display the butt