feat: inherit attrs to Textarea + fix Input label color (#245)

* feat: add more attributes to Textarea

* refactor: use `inheritAttrs` option to simplify code

* fix: `Input` label color in dark mode

src/components/FwbInput/composables/useInputClasses.ts

@@ -55,7 +55,7 @@ export function useInputClasses (props: UseInputClassesProps): {
       ? 'text-green-700 dark:text-green-500'
       : vs === validationStatusMap.Error
         ? 'text-red-700 dark:text-red-500'
-        : 'text-gray-900 dark:text-gray-300'
+        : 'text-gray-900 dark:text-white'
 
     return twMerge(baseLabelClasses, classByStatus)
   })

src/components/FwbTextarea/FwbTextarea.vue

@@ -4,8 +4,9 @@
     <span :class="wrapperClasses">
       <textarea
         v-model="model"
-        :rows="rows"
+        v-bind="$attrs"
         :class="textareaClasses"
+        :rows="rows"
         :placeholder="placeholder"
       />
       <span
@@ -23,13 +24,17 @@ import { computed } from 'vue'
 import { useTextareaClasses } from './composables/useTextareaClasses'
 
 interface TextareaProps {
-  modelValue?: string;
-  label?: string;
-  rows?: number;
-  custom?: boolean;
-  placeholder?: string;
+  modelValue?: string
+  label?: string
+  rows?: number
+  custom?: boolean
+  placeholder?: string
 }
 
+defineOptions({
+  inheritAttrs: false,
+})
+
 const props = withDefaults(defineProps<TextareaProps>(), {
   modelValue: '',
   label: 'Your message',
@@ -48,10 +53,5 @@ const model = computed({
   },
 })
 
-const {
-  textareaClasses,
-  labelClasses,
-  wrapperClasses,
-  footerClasses,
-} = useTextareaClasses(props.custom)
+const { textareaClasses, labelClasses, wrapperClasses, footerClasses } = useTextareaClasses(props.custom)
 </script>