From 4f23b491633534014aaa3fc99d96fbc59ed37975 Mon Sep 17 00:00:00 2001
From: Cory LaViska <cory@abeautifulsite.net>
Date: Thu, 15 Oct 2020 16:34:09 -0400
Subject: [PATCH] Improve types in docs

---
 docs/assets/plugins/metadata/metadata.js | 2 +-
 src/components.d.ts                      | 8 ++++----
 src/components/form/form.tsx             | 2 +-
 src/components/menu/menu.tsx             | 2 +-
 src/components/tab-group/tab-group.tsx   | 4 ++--
 5 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/docs/assets/plugins/metadata/metadata.js b/docs/assets/plugins/metadata/metadata.js
index 753d295f..9bb7e3ab 100644
--- a/docs/assets/plugins/metadata/metadata.js
+++ b/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>
         `
           )
diff --git a/src/components.d.ts b/src/components.d.ts
index f74f7b36..f07630e9 100644
--- a/src/components.d.ts
+++ b/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.
          */
diff --git a/src/components/form/form.tsx b/src/components/form/form.tsx
index d6347540..931394a1 100644
--- a/src/components/form/form.tsx
+++ b/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 = [
diff --git a/src/components/menu/menu.tsx b/src/components/menu/menu.tsx
index 5dbf1d2d..a160575e 100644
--- a/src/components/menu/menu.tsx
+++ b/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);
diff --git a/src/components/tab-group/tab-group.tsx b/src/components/tab-group/tab-group.tsx
index 43e528ea..39efe8cc 100644
--- a/src/components/tab-group/tab-group.tsx
+++ b/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);