Improve types in docs

docs/assets/plugins/metadata/metadata.js

@@ -58,7 +58,7 @@
         <tr>
           <td><code>${escapeHtml(event.event)}</code></td>
           <td>${escapeHtml(event.docs)}</td>
-          <td><code>CustomEvent&lt;${escapeHtml(event.detail)}&gt;</code></td>
+          <td><code style="white-space: normal;">CustomEvent&lt;${escapeHtml(event.detail)}&gt;</code></td>
         </tr>
         `
           )

src/components.d.ts

@@ -1933,7 +1933,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when the form is submitted. This event will not be emitted if any form control inside of it is in an invalid state, unless the form has the `novalidate` attribute. Note that there is never a need to prevent this event, since it doen't send a GET or POST request like native forms. To "prevent" submission, use a conditional around the XHR request you use to submit the form's data with.
          */
-        "onSl-submit"?: (event: CustomEvent<any>) => void;
+        "onSl-submit"?: (event: CustomEvent<{ formData: FormData; formControls: HTMLElement[] }>) => void;
     }
     interface SlFormatBytes {
         /**
@@ -2155,7 +2155,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when a menu item is selected.
          */
-        "onSl-select"?: (event: CustomEvent<any>) => void;
+        "onSl-select"?: (event: CustomEvent<{ item: HTMLSlMenuItemElement }>) => void;
     }
     interface SlMenuDivider {
     }
@@ -2457,11 +2457,11 @@ declare namespace LocalJSX {
         /**
           * Emitted when a tab is hidden.
          */
-        "onSl-tab-hide"?: (event: CustomEvent<any>) => void;
+        "onSl-tab-hide"?: (event: CustomEvent<{ name: string }>) => void;
         /**
           * Emitted when a tab is shown.
          */
-        "onSl-tab-show"?: (event: CustomEvent<any>) => void;
+        "onSl-tab-show"?: (event: CustomEvent<{ name: string }>) => void;
         /**
           * The placement of the tabs.
          */

src/components/form/form.tsx

@@ -34,7 +34,7 @@ export class Form {
    * event, since it doen't send a GET or POST request like native forms. To "prevent" submission, use a conditional
    * around the XHR request you use to submit the form's data with.
    */
-  @Event({ eventName: 'sl-submit' }) slSubmit: EventEmitter;
+  @Event({ eventName: 'sl-submit' }) slSubmit: EventEmitter<{ formData: FormData; formControls: HTMLElement[] }>;
 
   connectedCallback() {
     this.formControls = [

src/components/menu/menu.tsx

@@ -29,7 +29,7 @@ export class Menu {
   @Event({ eventName: 'sl-blur' }) slBlur: EventEmitter;
 
   /** Emitted when a menu item is selected. */
-  @Event({ eventName: 'sl-select' }) slSelect: EventEmitter;
+  @Event({ eventName: 'sl-select' }) slSelect: EventEmitter<{ item: HTMLSlMenuItemElement }>;
 
   connectedCallback() {
     this.handleBlur = this.handleBlur.bind(this);

src/components/tab-group/tab-group.tsx

@@ -46,10 +46,10 @@ export class TabGroup {
   }
 
   /** Emitted when a tab is shown. */
-  @Event({ eventName: 'sl-tab-show' }) slTabShow: EventEmitter;
+  @Event({ eventName: 'sl-tab-show' }) slTabShow: EventEmitter<{ name: string }>;
 
   /** Emitted when a tab is hidden. */
-  @Event({ eventName: 'sl-tab-hide' }) slTabHide: EventEmitter;
+  @Event({ eventName: 'sl-tab-hide' }) slTabHide: EventEmitter<{ name: string }>;
 
   connectedCallback() {
     this.handleClick = this.handleClick.bind(this);