chore(component): remove unnecessary event in the post-closebutton (#6152)

## 📄 Description
Remove the `postCLick` event since we con simply use `click`.
This event is not yet released this I simply updated the related
changeset file.

---

## 📝 Checklist

- ✅ My code follows the style guidelines of this project
- 🛠️ I have performed a self-review of my own code
- 📄 I have made corresponding changes to the documentation
- ⚠️ My changes generate no new warnings or errors
- 🧪 I have added tests that prove my fix is effective or that my feature
works
- ✔️ New and existing unit tests pass locally with my changes

Author: alizedebray

.changeset/spicy-radios-behave.md

@@ -1,5 +1,5 @@
 ---
-'@swisspost/design-system-components': minor
+'@swisspost/design-system-components': patch
 ---
 
-Added a `postClick` event and accessibility checks to the `post-closebutton` component.
+Added accessibility checks to the `post-closebutton` component.

packages/components/eslint.config.js

@@ -96,6 +96,7 @@ export default [
       'semi': ['error', 'always'],
       'react/jsx-no-bind': 'off',
       '@stencil-community/strict-boolean-conditions': 'off',
+      '@stencil-community/prefer-vdom-listener': 'off',
       '@stencil-community/required-prefix': ['error', ['post-']],
       '@stencil-community/class-pattern': [
         'error',

packages/components/src/components.d.ts

@@ -532,10 +532,6 @@ export interface PostCardControlCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLPostCardControlElement;
 }
-export interface PostClosebuttonCustomEvent<T> extends CustomEvent<T> {
-    detail: T;
-    target: HTMLPostClosebuttonElement;
-}
 export interface PostCollapsibleCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLPostCollapsibleElement;
@@ -639,18 +635,7 @@ declare global {
         prototype: HTMLPostCardControlElement;
         new (): HTMLPostCardControlElement;
     };
-    interface HTMLPostClosebuttonElementEventMap {
-        "postClick": void;
-    }
     interface HTMLPostClosebuttonElement extends Components.PostClosebutton, HTMLStencilElement {
-        addEventListener<K extends keyof HTMLPostClosebuttonElementEventMap>(type: K, listener: (this: HTMLPostClosebuttonElement, ev: PostClosebuttonCustomEvent<HTMLPostClosebuttonElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLPostClosebuttonElementEventMap>(type: K, listener: (this: HTMLPostClosebuttonElement, ev: PostClosebuttonCustomEvent<HTMLPostClosebuttonElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
     }
     var HTMLPostClosebuttonElement: {
         prototype: HTMLPostClosebuttonElement;
@@ -1060,10 +1045,6 @@ declare namespace LocalJSX {
         "value"?: string;
     }
     interface PostClosebutton {
-        /**
-          * An event emitted when the close button is clicked. It has no payload.
-         */
-        "onPostClick"?: (event: PostClosebuttonCustomEvent<void>) => void;
     }
     interface PostCollapsible {
         /**

packages/components/src/components/post-banner/post-banner.tsx

@@ -77,7 +77,7 @@ export class PostBanner {
     this.postDismissed.emit();
   }
 
-  @Listen('postClick')
+  @Listen('click')
   @EventFrom('post-closebutton')
   onCloseButtonClick(): void {
     void this.dismiss();

packages/components/src/components/post-closebutton/post-closebutton.tsx

@@ -1,4 +1,4 @@
-import { Component, Element, Event, EventEmitter, h, Host } from '@stencil/core';
+import { Component, Element, h, Host } from '@stencil/core';
 import { version } from '@root/package.json';
 
 /**
@@ -12,12 +12,6 @@ import { version } from '@root/package.json';
 export class PostClosebutton {
   @Element() host: HTMLPostClosebuttonElement;
 
-  /**
-   * An event emitted when the close button is clicked.
-   * It has no payload.
-   */
-  @Event() postClick: EventEmitter<void>;
-
   componentDidLoad() {
     this.checkHiddenLabel();
   }
@@ -31,7 +25,7 @@ export class PostClosebutton {
   render() {
     return (
       <Host data-version={version}>
-        <button class="btn btn-icon-close" type="button" onClick={() => this.postClick.emit()}>
+        <button class="btn btn-icon-close" type="button">
           <post-icon aria-hidden="true" name="closex"></post-icon>
           <span class="visually-hidden">
             <slot onSlotchange={() => this.checkHiddenLabel()}></slot>

packages/components/src/components/post-closebutton/readme.md

@@ -5,13 +5,6 @@
 <!-- Auto Generated Below -->
 
 
-## Events
-
-| Event       | Description                                                           | Type                |
-| ----------- | --------------------------------------------------------------------- | ------------------- |
-| `postClick` | An event emitted when the close button is clicked. It has no payload. | `CustomEvent<void>` |
-
-
 ## Slots
 
 | Slot        | Description                                                 |

packages/components/src/utils/event-from.ts

@@ -7,17 +7,17 @@
  * @returns true if the event should be processed, false otherwise
  */
 function shouldProcessEvent(
-  event: CustomEvent,
+  event: Event,
   tag: string,
   host: HTMLElement,
   ignoreNestedComponents: boolean
 ): boolean {
-  if (!(event instanceof CustomEvent && event.target instanceof HTMLElement)) return false;
+  if (!(event instanceof Event && event.target instanceof HTMLElement)) return false;
 
   const eventTarget = event.target;
-  
+
   if (eventTarget.localName !== tag) return false;
-  
+
   if (ignoreNestedComponents) {
     // Find the closest parent with the same tag as the host
     const closestParentWithSameTag = findClosestParentWithTag(eventTarget, host.localName);
@@ -34,7 +34,7 @@ function shouldProcessEvent(
  * @param option.ignoreNestedComponents - Whether to ignore events from nested components
  */
 export function EventFrom(
-  tag: string, 
+  tag: string,
   option: { ignoreNestedComponents: boolean } = { ignoreNestedComponents: true }
 ) {
   return function (
@@ -44,19 +44,19 @@ export function EventFrom(
   ) {
     if (descriptor) {
       const originalMethod = descriptor.value;
-      
-      descriptor.value = function (event: CustomEvent) {
+
+      descriptor.value = function (event: Event) {
         if (!shouldProcessEvent(event, tag, this.host, option.ignoreNestedComponents)) {
           return;
         }
 
         return originalMethod.call(this, event);
       };
     } else {
-      // Creates a hidden storage property for the original method using a 
+      // Creates a hidden storage property for the original method using a
       // modified key format (__[property]_original) to avoid naming conflicts
       const privateKey = `__${propertyKey}_original`;
-      
+
       // Create hidden storage for original method
       Object.defineProperty(target, privateKey, {
         writable: true,
@@ -71,10 +71,10 @@ export function EventFrom(
         },
 
         // Setter wraps original method with extra code
-        set(originalFunction: (event: CustomEvent) => void) {
+        set(originalFunction: (event: Event) => void) {
           if (typeof originalFunction === 'function') {
             // Store original and add new behavior
-            this[privateKey] = (event: CustomEvent) => {
+            this[privateKey] = (event: Event) => {
               if (!shouldProcessEvent(event, tag, this.host, option.ignoreNestedComponents)) {
                 return;
               }
@@ -101,7 +101,7 @@ export function EventFrom(
  */
 function findClosestParentWithTag(element: Element, tagName: string): Element | null {
   let current: Element | null = element;
-  
+
   while (current) {
     if (current.localName === tagName) {
       return current;
@@ -110,16 +110,16 @@ function findClosestParentWithTag(element: Element, tagName: string): Element |
     // Check regular parent first
     if (current.parentElement) {
       current = current.parentElement;
-    } 
+    }
     // If no parentElement, check if we're in a shadow root
     else if (current.parentNode instanceof ShadowRoot) {
       current = current.parentNode.host;
-    } 
+    }
     // No more parents to check
     else {
       current = null;
     }
   }
-  
+
   return null;
 }