From 6ff73c2865522fed10ebc893340b4bee45b6e235 Mon Sep 17 00:00:00 2001
From: Shinichi Okada <147320+shinokada@users.noreply.github.com>
Date: Sun, 30 Jun 2024 15:24:32 +0200
Subject: [PATCH] fix: add headerClass and footerClass to Textarea, #1380

---
 .changeset/shiny-carrots-sleep.md | 5 +++++
 src/lib/forms/Textarea.svelte     | 8 +++++---
 2 files changed, 10 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/shiny-carrots-sleep.md

diff --git a/.changeset/shiny-carrots-sleep.md b/.changeset/shiny-carrots-sleep.md
new file mode 100644
index 000000000..37fe3a716
--- /dev/null
+++ b/.changeset/shiny-carrots-sleep.md
@@ -0,0 +1,5 @@
+---
+'flowbite-svelte': patch
+---
+
+fix: add headerClass and footerClass to Textarea, #1380
diff --git a/src/lib/forms/Textarea.svelte b/src/lib/forms/Textarea.svelte
index 138948b5e..21e99f80a 100644
--- a/src/lib/forms/Textarea.svelte
+++ b/src/lib/forms/Textarea.svelte
@@ -9,6 +9,8 @@
   export let wrappedClass: string = 'block w-full text-sm border-0 px-0 bg-inherit dark:bg-inherit focus:outline-none focus:ring-0 disabled:cursor-not-allowed disabled:opacity-50';
   export let unWrappedClass: string = 'p-2.5 text-sm focus:ring-primary-500 border-gray-300 focus:border-primary-500 dark:focus:ring-primary-500 dark:focus:border-primary-500 disabled:cursor-not-allowed disabled:opacity-50';
   export let innerWrappedClass: string = 'py-2 px-4 bg-white dark:bg-gray-800';
+  export let headerClass: string = ''
+  export let footerClass: string = '';
   let wrapped: boolean;
   $: wrapped = $$slots.header || $$slots.footer;
 
@@ -18,7 +20,7 @@
   let textareaClass: string;
   $: textareaClass = wrapped ? wrappedClass : twMerge(wrapperClass, unWrappedClass);
 
-  const headerClass = (header: boolean) => twMerge(header ? 'border-b' : 'border-t', 'py-2 px-3 border-gray-200', background ? 'dark:border-gray-500' : 'dark:border-gray-600');
+  const headerCls = (header: boolean) => twMerge(header ? 'border-b' : 'border-t', 'py-2 px-3 border-gray-200', background ? 'dark:border-gray-500' : 'dark:border-gray-600', header ? headerClass : footerClass);
 
   let innerWrapperClass: string;
   $: innerWrapperClass = twMerge(innerWrappedClass, $$slots.footer ? '' : 'rounded-b-lg', $$slots.header ? '' : 'rounded-t-lg');
@@ -26,7 +28,7 @@
 
 <Wrapper show={wrapped} class={wrapperClass}>
   {#if $$slots.header}
-    <div class={headerClass(true)}>
+    <div class={headerCls(true)}>
       <slot name="header"></slot>
     </div>
   {/if}
@@ -34,7 +36,7 @@
     <textarea bind:value on:blur on:change on:click on:contextmenu on:focus on:input on:keydown on:keypress on:keyup on:mouseenter on:mouseleave on:mouseover on:paste on:select {...$$restProps} class={textareaClass}></textarea>
   </Wrapper>
   {#if $$slots.footer}
-    <div class={headerClass(false)}>
+    <div class={headerCls(false)}>
       <slot name="footer"></slot>
     </div>
   {/if}