From f68fc1367019e09c23cd63cf54afbf02c5e8ff6c Mon Sep 17 00:00:00 2001
From: letoast <ciroman@gmail.com>
Date: Mon, 9 Jan 2023 23:06:57 +0100
Subject: [PATCH] feat: add on:input to textarea

---
 src/lib/forms/Textarea.svelte         |  1 +
 src/routes/forms/textarea.md          | 17 +++++++++--------
 src/routes/props/FooterCopyright.json |  2 +-
 src/routes/props/NavUl.json           |  2 +-
 4 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/src/lib/forms/Textarea.svelte b/src/lib/forms/Textarea.svelte
index 8524fba257..fdee535d91 100644
--- a/src/lib/forms/Textarea.svelte
+++ b/src/lib/forms/Textarea.svelte
@@ -59,6 +59,7 @@
       on:click
       on:contextmenu
       on:focus
+      on:input
       on:keydown
       on:keypress
       on:keyup
diff --git a/src/routes/forms/textarea.md b/src/routes/forms/textarea.md
index 875d574184..08f04901da 100644
--- a/src/routes/forms/textarea.md
+++ b/src/routes/forms/textarea.md
@@ -10,7 +10,7 @@ description: Use the textarea component as a multi-line text field input and use
 
 <script>
   import { Htwo, ExampleDiv, GitHubSource, CompoDescription, TableProp, TableDefaultRow, MetaTag } from '../utils'
-  
+
   import { Heading, Breadcrumb, BreadcrumbItem, Badge, A } from '$lib'
   import { props as items } from '../props/Textarea.json'
   let propHeader = ['Name', 'Type', 'Default']
@@ -38,7 +38,7 @@ The textarea component is a multi-line text field input that can be used to rece
 
 ```html
 <script>
-  import { Textarea } from 'flowbite-svelte' 
+  import { Textarea } from 'flowbite-svelte';
 </script>
 ```
 
@@ -48,7 +48,7 @@ Get started with the default example of a textarea component below.
 
 ```svelte example
 <script>
-  import { Textarea, Label } from 'flowbite-svelte' 
+  import { Textarea, Label } from 'flowbite-svelte'
 </script>
 
 <Label for="textarea-id" class="mb-2">Your message</Label>
@@ -61,7 +61,7 @@ If you want to add other actions as buttons alongside your textarea component, s
 
 ```svelte example
 <script>
-  import { Textarea, Toolbar, ToolbarGroup, ToolbarButton, Button } from 'flowbite-svelte' 
+  import { Textarea, Toolbar, ToolbarGroup, ToolbarButton, Button } from 'flowbite-svelte'
 </script>
 
 <form>
@@ -83,13 +83,14 @@ If you want to add other actions as buttons alongside your textarea component, s
   <Button>Publish post</Button>
 </form>
 ```
+
 <Htwo label="Comment box" />
 
 Most often the textarea component is used as the main text field input element in comment sections. Use this example to also apply a helper text and buttons below the textarea itself.
 
 ```svelte example class="space-y-4"
 <script>
-  import { Textarea, Toolbar, ToolbarGroup, ToolbarButton, Button } from 'flowbite-svelte' 
+  import { Textarea, Toolbar, ToolbarGroup, ToolbarButton, Button } from 'flowbite-svelte'
 </script>
 
 <form>
@@ -113,7 +114,7 @@ If you want to build a chatroom component you will usually want to use a textare
 
 ```svelte example class="space-y-4"
 <script>
-  import { Textarea, Alert, CloseButton } from 'flowbite-svelte' 
+  import { Textarea, Alert, CloseButton } from 'flowbite-svelte'
 </script>
 
 <form>
@@ -140,9 +141,8 @@ If you want to build a chatroom component you will usually want to use a textare
 
 The component has the following props, type, and default values. See <A href="/pages/types">types page</A> for type information.
 
-
 <TableProp header={propHeader} {divClass} {theadClass}>
-  <TableDefaultRow {items} rowState='hover' />
+<TableDefaultRow {items} rowState='hover' />
 </TableProp>
 
 <Htwo label="Forwarded Events" />
@@ -152,6 +152,7 @@ The component has the following props, type, and default values. See <A href="/p
 <Badge large={true}>on:change</Badge>
 <Badge large={true}>on:click</Badge>
 <Badge large={true}>on:focus</Badge>
+<Badge large={true}>on:input</Badge>
 <Badge large={true}>on:keydown</Badge>
 <Badge large={true}>on:keypress</Badge>
 <Badge large={true}>on:keyup</Badge>
diff --git a/src/routes/props/FooterCopyright.json b/src/routes/props/FooterCopyright.json
index 1d7ebfa2c0..1ceb5dbfa3 100644
--- a/src/routes/props/FooterCopyright.json
+++ b/src/routes/props/FooterCopyright.json
@@ -1 +1 @@
-{"props":[["spanClass","string ","'block text-sm text-gray-500 sm:text-center dark:text-gray-400'"],["aClass","string ","'hover:underline'"],["year","number ","new Date().getFullYear()"],["href","string ","''"],["by","string ","''"],["target","string | undefined ","undefined"],["copyrightMessage","string ","All Rights Reserved."]]}
+{"props":[["spanClass","string ","'block text-sm text-gray-500 sm:text-center dark:text-gray-400'"],["aClass","string ","'hover:underline'"],["year","number ","new Date().getFullYear()"],["href","string ","''"],["by","string ","''"],["target","string | undefined ","undefined"],["copyrightMessage","string ","'All Rights Reserved.'"]]}
\ No newline at end of file
diff --git a/src/routes/props/NavUl.json b/src/routes/props/NavUl.json
index 180636f04e..85ea7243ed 100644
--- a/src/routes/props/NavUl.json
+++ b/src/routes/props/NavUl.json
@@ -1 +1 @@
-{"props":[["divClass","string ","'w-full md:block md:w-auto'"],["ulClass","string ","'flex flex-col p-4 mt-4 md:flex-row md:space-x-8 md:mt-0 md:text-sm md:font-medium'"],["hidden","boolean ","true"]]}
\ No newline at end of file
+{"props":[["divClass","string ","'w-full md:block md:w-auto'"],["ulClass","string ","'flex flex-col p-4 mt-4 md:flex-row md:space-x-8 md:mt-0 md:text-sm md:font-medium'"],["hidden","boolean ","true"],["slideParams","SlideParams ","{ delay: 250, duration: 500, easing: quintOut }"]]}
\ No newline at end of file