improvement: adding propstable for Textarea

Author: lloydaf

src/components/Datepicker/docs/Datepicker.mdx

@@ -10,8 +10,8 @@ import { DatepickerSingleInput as DatePicker } from '../DatepickerSingleInput';
 import { ControlledDatepickerSingleInput } from './ControlledDatepickerSingleInput';
 import { ControlledDatepickerRangeInput } from './ControlledDatepickerRangeInput';
 import { DatepickerOnModal } from './DatepickerOnModal';
-import { DatePickerSingleInputPropsTable } from './DatePickerSingleInputPropsTable'
-import { DatePickerRangeInputPropsTable } from './DatePickerRangeInputPropsTable'
+import { DatepickerSingleInputPropsTable } from './DatepickerSingleInputPropsTable'
+import { DatepickerRangeInputPropsTable } from './DatepickerRangeInputPropsTable'
 
 # Datepicker
 
@@ -21,15 +21,15 @@ import { DatePickerRangeInputPropsTable } from './DatePickerRangeInputPropsTable
 
 ### Single datepicker props
 
-<DatePickerSingleInputPropsTable />
+<DatepickerSingleInputPropsTable />
 
 ## Range
 
 <ControlledDatepickerRangeInput label="Date Range" />
 
 ### Range datepicker props
 
-<DatePickerRangeInputPropsTable />
+<DatepickerRangeInputPropsTable />
 
 ## Datepicker on Modal
 

src/components/Datepicker/docs/DatePickerRangeInputPropsTable.tsx renamed to src/components/Datepicker/docs/DatepickerRangeInputPropsTable.tsx

@@ -2,7 +2,7 @@ import React, { FC } from 'react';
 
 import { PropsTable } from '../../../docs/PropsTable';
 
-export const DatePickerRangeInputPropsTable: FC = () => {
+export const DatepickerRangeInputPropsTable: FC = () => {
     const props = [
         {
             name: 'startPlaceholder',

src/components/Datepicker/docs/DatePickerSingleInputPropsTable.tsx renamed to src/components/Datepicker/docs/DatepickerSingleInputPropsTable.tsx

@@ -2,7 +2,7 @@ import React, { FC } from 'react';
 
 import { PropsTable } from '../../../docs/PropsTable';
 
-export const DatePickerSingleInputPropsTable: FC = () => {
+export const DatepickerSingleInputPropsTable: FC = () => {
     const props = [
         {
             name: 'placeholder',

src/components/Textarea/docs/Textarea.mdx

@@ -9,11 +9,17 @@ import { ControlledTextarea } from './ControlledTextarea';
 import { Textarea } from '../Textarea';
 import { ItemWrapper } from '../../../../docs/components/ItemWrapper.ts';
 import { StyledSystemLinks } from '../../../docs/StyledSystemLinks'
+import { TextareaPropsTable } from './TextareaPropsTable'
+
 
 # Textarea
 
 <StyledSystemLinks component="Textarea" supportedProps={ ['margin', 'height', 'width'] }/>
 
+## Properties
+
+<TextareaPropsTable />
+
 ## Playground
 
 <Playground>

src/components/Textarea/docs/TextareaPropsTable.tsx

@@ -0,0 +1,39 @@
+import React, { FC } from 'react';
+
+import { PropsTable } from '../../../docs/PropsTable';
+
+export const TextareaPropsTable: FC = () => {
+    const props = [
+        {
+            name: 'variant',
+            type: "'boxed' | 'bottom-lined'",
+            description: 'The variant of the component.'
+        },
+        {
+            name: 'size',
+            type: "'small' | 'medium'",
+            description: 'The size of the component.'
+        },
+        {
+            name: 'inverted',
+            type: 'boolean',
+            description: 'Determines whether the component follows the inverted color scheme.'
+        },
+        {
+            name: 'label',
+            type: 'string',
+            description: 'Label for the input.'
+        },
+        {
+            name: 'placeholder',
+            type: 'string',
+            description: 'Placeholder for the component.'
+        },
+        {
+            name: 'error',
+            type: 'boolean',
+            description: 'Determines the error state of the component.'
+        }
+    ];
+    return <PropsTable props={props} />;
+};