Merge pull request #239 from smartive-education/feature/form-4

fix(input, textarea): add missing attribute name
ost-cas-fee-adv-22-23 · Mar 9, 2023 · c000bc9 · c000bc9
2 parents 1c077bc + 8fe8da6
commit c000bc9
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 1 deletion.
diff --git a/packages/design-system-component-library-yeahyeahyeah/components/form/InputForm.tsx b/packages/design-system-component-library-yeahyeahyeah/components/form/InputForm.tsx
@@ -3,6 +3,7 @@ import tw, { styled } from 'twin.macro';
 import { Eye, Cancel } from '../icon/index';
 
 export interface IFormInputProps {
+  name: string;
   label?: string;
   labelSize?: 'default' | 'small';
   editType: 'input' | 'textarea';
@@ -21,6 +22,7 @@ export const InputForm: React.FC<IFormInputProps> = ({
   labelSize = 'default',
   editType = 'textarea',
   required = true,
+  name,
   type = 'text',
   placeholder = 'Placeholder',
   errorMessage,
@@ -60,6 +62,7 @@ export const InputForm: React.FC<IFormInputProps> = ({
           <FormInlineWrapperStyles>
             <InputStyles
               id={id}
+              name={name}
               placeholder={placeholder}
               type={buttonType}
               required={required}
@@ -83,6 +86,7 @@ export const InputForm: React.FC<IFormInputProps> = ({
           {label}
           <TextArea
             id={id}
+            name={name}
             placeholder={placeholder}
             required={required}
             maxLength={500}

diff --git a/packages/design-system-component-library-yeahyeahyeah/stories/form/InputForm.stories.tsx b/packages/design-system-component-library-yeahyeahyeah/stories/form/InputForm.stories.tsx
@@ -53,7 +53,7 @@ const Template: ComponentStory<typeof InputForm> = (args: IFormInputProps) => {
         inputValue={inputValue}
         errorMessage={errorMessage}
         onPressEnter={handlePressEnter}
-        data-testid={'label'}
+        data-testid="label"
       />
     </>
   );
@@ -62,6 +62,9 @@ const Template: ComponentStory<typeof InputForm> = (args: IFormInputProps) => {
 export const FormInputStory = Template.bind({});
 
 FormInputStory.argTypes = {
+  name: {
+    control: 'text',
+  },
   editType: {
     control: false,
     table: {
@@ -107,6 +110,7 @@ FormInputStory.argTypes = {
 };
 
 FormInputStory.args = {
+  name: '',
   editType: 'input',
   label: 'Label',
   required: false,
@@ -138,6 +142,9 @@ FormInputStory.storyName = 'InputForm';
 export const TextAreaStory = Template.bind({});
 
 TextAreaStory.argTypes = {
+  name: {
+    control: 'text',
+  },
   editType: {
     control: false,
     table: {
@@ -183,6 +190,7 @@ TextAreaStory.argTypes = {
 };
 
 TextAreaStory.args = {
+  name: '',
   editType: 'textarea',
   label: 'Label',
   required: false,