feat(dropdown): remove method argument from open/close event (#1449)

- remove `method` argument from `open` and `close` event

BREAKING CHANGE: Dropdown `open` and `close` event arguments has changed

Author: mlmoravek

packages/docs/components/Dropdown.md

@@ -69,16 +69,16 @@ The component implements the W3C ARIA APG [Combobox Pattern](https://www.w3.org/
 
 ### Events
 
-| Event name         | Properties                                                              | Description                                      |
-| ------------------ | ----------------------------------------------------------------------- | ------------------------------------------------ |
-| update:model-value | **value** `unknown \| unknown[]` - updated modelValue prop              | modelValue prop two-way binding                  |
-| update:active      | **value** `boolean` - updated active prop                               | active prop two-way binding                      |
-| select             | **value** `unknown` - selected value                                    | on select event - fired before update:modelValue |
-| change             | **value** `unknown \| unknown[]` - selected value                       |
-| open               | **method** `string` - open method<br/>**event** `Event` - native event  | on open event                                    |
-| close              | **method** `string` - close method<br/>**event** `Event` - native event | on close event                                   |
-| scroll-start       |                                                                         | the list inside the dropdown reached the start   |
-| scroll-end         |                                                                         | the list inside the dropdown reached it's end    |
+| Event name         | Properties                                                 | Description                                      |
+| ------------------ | ---------------------------------------------------------- | ------------------------------------------------ |
+| update:model-value | **value** `unknown \| unknown[]` - updated modelValue prop | modelValue prop two-way binding                  |
+| update:active      | **value** `boolean` - updated active prop                  | active prop two-way binding                      |
+| select             | **value** `unknown` - selected value                       | on select event - fired before update:modelValue |
+| change             | **value** `unknown \| unknown[]` - selected value          |
+| open               | **event** `Event` - native event                           | on active state changes to true                  |
+| close              | **event** `Event` - native event                           | on active state changes to false                 |
+| scroll-start       |                                                            | the list inside the dropdown reached the start   |
+| scroll-end         |                                                            | the list inside the dropdown reached it's end    |
 
 ### Slots
 

packages/oruga/src/components/dropdown/Dropdown.vue

@@ -108,17 +108,15 @@ const emits = defineEmits<{
      */
     change: [value: ModelValue];
     /**
-     * on open event
-     * @param method {string} open method
+     * on active state changes to true
      * @param event {Event} - native event
      */
-    open: [method: string, event: Event];
+    open: [event: Event];
     /**
-     * on close event
-     * @param method {string} close method
+     * on active state changes to false
      * @param event {Event} - native event
      */
-    close: [method: string, event: Event];
+    close: [event: Event];
     /** the list inside the dropdown reached the start */
     "scroll-start": [];
     /** the list inside the dropdown reached it's end */
@@ -204,27 +202,29 @@ const hoverable = computed(() => props.triggers.includes("hover"));
 
 const toggleScroll = usePreventScrolling(props.clipScroll);
 
-// set infinite scroll handler
-if (isClient && props.scrollable)
-    useScrollEvents(
-        menuRef,
-        {
-            onScrollEnd: () => emits("scroll-end"),
-            onScrollStart: () => emits("scroll-start"),
-        },
-        { passive: true },
-    );
+if (isClient) {
+    // set infinite scroll handler
+    if (props.scrollable)
+        useScrollEvents(
+            menuRef,
+            {
+                onScrollEnd: () => emits("scroll-end"),
+                onScrollStart: () => emits("scroll-start"),
+            },
+            { passive: true },
+        );
 
-// set click outside handler
-if (isClient && props.closeOnOutside)
-    useClickOutside([menuRef, triggerRef], onClickedOutside, {
-        trigger: isActive,
-        passive: true,
-    });
+    // set click outside handler
+    if (props.closeOnOutside)
+        useClickOutside([menuRef, triggerRef], onClickedOutside, {
+            trigger: isActive,
+            passive: true,
+        });
 
-// set scroll page event
-if (isClient && props.closeOnScroll)
-    useEventListener(window, "scroll", onPageScroll, { passive: true });
+    // set scroll page event
+    if (props.closeOnScroll)
+        useEventListener(window, "scroll", onPageScroll, { passive: true });
+}
 
 watch(
     isActive,
@@ -258,76 +258,76 @@ watch(
 function onClickedOutside(event: Event): void {
     if (!isActive.value || props.inline) return;
     if (!props.closeOnOutside) return;
-    close("outside", event);
+    close(event);
 }
 
 /** Close dropdown if page get scrolled. */
 function onPageScroll(event: Event): void {
     if (!isActive.value || props.inline) return;
     if (!props.closeOnScroll) return;
-    close("scroll", event);
+    close(event);
 }
 
 function onTriggerClick(event: Event): void {
     // check if is mobile native and hoverable together
-    if (isMobileNative && hoverable.value) toggle("click", event);
+    if (isMobileNative && hoverable.value) toggle(event);
     // check normal click conditions
     if (!props.triggers.includes("click")) return;
-    toggle("click", event);
+    toggle(event);
 }
 
 function onTriggerContextMenu(event: Event): void {
     if (!props.triggers.includes("contextmenu")) return;
     event.preventDefault();
-    open("contextmenu", event);
+    open(event);
 }
 
 function onTriggerFocus(event: Event): void {
     if (!props.triggers.includes("focus")) return;
-    open("focus", event);
+    open(event);
 }
 
 function onTriggerHover(event: Event): void {
     if (isMobileNative) return;
     if (!props.triggers.includes("hover")) return;
-    open("hover", event);
+    open(event);
 }
 
 function onTriggerHoverLeave(event: Event): void {
     if (isMobileNative) return;
     if (!props.triggers.includes("hover")) return;
-    close("outside", event);
+    close(event);
 }
 
 /** Toggle dropdown if it's not disabled. */
-function toggle(method: string, event: Event): void {
+function toggle(event: Event): void {
     if (props.disabled) return;
-    if (!isActive.value) open(method, event);
-    else close(method, event);
+    if (!isActive.value) open(event);
+    else close(event);
 }
 
 let timer: ReturnType<typeof setTimeout> | undefined;
 
-function open(method: string, event: Event): void {
+function open(event: Event): void {
     if (props.disabled) return;
     if (isActive.value) return;
     if (props.delay) {
         timer = setTimeout(() => {
             isActive.value = true;
-            emits("open", method, event);
             timer = undefined;
+            emits("open", event);
         }, props.delay);
     } else {
         // if not active, toggle after clickOutside event
         // this fixes toggling programmatic
         nextTick(() => (isActive.value = true));
-        emits("open", method, event);
+        emits("open", event);
     }
 }
 
-function close(method: string, event: Event): void {
+function close(event: Event): void {
     if (!isActive.value) return;
-    emits("close", method, event);
+    emits("close", event);
 
     // select item when dropdown closed
     if (props.selectOnClose && focusedItem.value?.data.value)
@@ -383,7 +383,7 @@ function selectItem(item: DropdownChildItem<T>, event?: Event): void {
 
     triggerRef.value?.focus();
     if (props.keepOpen || !isActive.value || !event) return;
-    close("content", event);
+    close(event);
 }
 
 // #endregion --- Select Feature ---
@@ -425,12 +425,12 @@ function setFocus(item: DropdownChildItem<T>): void {
 }
 
 function onUpPressed(event: Event): void {
-    if (!isActive.value) return open("keydown", event);
+    if (!isActive.value) return open(event);
     moveFocus(-1);
 }
 
 function onDownPressed(event: Event): void {
-    if (!isActive.value) return open("keydown", event);
+    if (!isActive.value) return open(event);
     moveFocus(1);
 }
 
@@ -449,7 +449,7 @@ function onHomePressed(event: Event): void {
     if (target.tagName !== "INPUT" && target.tagName !== "TEXTAREA")
         event.preventDefault();
 
-    open("keydown", event);
+    open(event);
     if (!isNotEmpty.value) return;
     const item = getFirstViableItem(0, 1);
     setFocus(item);
@@ -462,14 +462,14 @@ function onEndPressed(event: Event): void {
     if (target.tagName !== "INPUT" && target.tagName !== "TEXTAREA")
         event.preventDefault();
 
-    open("keydown", event);
+    open(event);
     if (!isNotEmpty.value) return;
     const item = getFirstViableItem(childItems.value.length - 1, -1);
     setFocus(item);
 }
 
 function onEscape(event: Event): void {
-    close("escape", event);
+    close(event);
 }
 
 /**