diff options
| author | Armand Philippot <git@armandphilippot.com> | 2023-10-05 18:58:30 +0200 |
|---|---|---|
| committer | Armand Philippot <git@armandphilippot.com> | 2023-11-11 18:14:41 +0100 |
| commit | fb860884857da73ee5b5e897745301cdf1d770a2 (patch) | |
| tree | 3aaf3c192b3375a7e1bf2dbf9daa866be357a2f5 /src/components/atoms/forms/fields/input | |
| parent | e97325a2c174a87c29593d1b42b9a1cc1eaf11af (diff) | |
refactor(components): make form components compliant with Eslint rules
Diffstat (limited to 'src/components/atoms/forms/fields/input')
| -rw-r--r-- | src/components/atoms/forms/fields/input/input.stories.tsx | 34 | ||||
| -rw-r--r-- | src/components/atoms/forms/fields/input/input.test.tsx | 6 | ||||
| -rw-r--r-- | src/components/atoms/forms/fields/input/input.tsx | 9 |
3 files changed, 21 insertions, 28 deletions
diff --git a/src/components/atoms/forms/fields/input/input.stories.tsx b/src/components/atoms/forms/fields/input/input.stories.tsx index 35657f8..4744bc5 100644 --- a/src/components/atoms/forms/fields/input/input.stories.tsx +++ b/src/components/atoms/forms/fields/input/input.stories.tsx @@ -1,5 +1,5 @@ -import { ComponentMeta, ComponentStory } from '@storybook/react'; -import { ChangeEvent, useCallback, useState } from 'react'; +import type { ComponentMeta, ComponentStory } from '@storybook/react'; +import { type ChangeEvent, useCallback, useState } from 'react'; import { Input } from './input'; /** @@ -187,50 +187,50 @@ const Template: ComponentStory<typeof Input> = ({ }; /** - * Input Story - DateTime + * Input Story - DateTimeField */ -export const DateTime = Template.bind({}); -DateTime.args = { +export const DateTimeField = Template.bind({}); +DateTimeField.args = { id: 'field-storybook', name: 'field-storybook', type: 'datetime-local', }; /** - * Input Story - Email + * Input Story - EmailField */ -export const Email = Template.bind({}); -Email.args = { +export const EmailField = Template.bind({}); +EmailField.args = { id: 'field-storybook', name: 'field-storybook', type: 'email', }; /** - * Input Story - Numeric + * Input Story - NumericField */ -export const Numeric = Template.bind({}); -Numeric.args = { +export const NumericField = Template.bind({}); +NumericField.args = { id: 'field-storybook', name: 'field-storybook', type: 'number', }; /** - * Input Story - Text + * Input Story - TextField */ -export const Text = Template.bind({}); -Text.args = { +export const TextField = Template.bind({}); +TextField.args = { id: 'field-storybook', name: 'field-storybook', type: 'text', }; /** - * Input Story - Time + * Input Story - TimeField */ -export const Time = Template.bind({}); -Time.args = { +export const TimeField = Template.bind({}); +TimeField.args = { id: 'field-storybook', name: 'field-storybook', type: 'time', diff --git a/src/components/atoms/forms/fields/input/input.test.tsx b/src/components/atoms/forms/fields/input/input.test.tsx index a5c4898..e97237d 100644 --- a/src/components/atoms/forms/fields/input/input.test.tsx +++ b/src/components/atoms/forms/fields/input/input.test.tsx @@ -1,5 +1,5 @@ import { describe, expect, it } from '@jest/globals'; -import { render, screen } from '../../../../../../tests/utils'; +import { render, screen as rtlScreen } from '@testing-library/react'; import { Input } from './input'; const doNothing = () => { @@ -17,7 +17,7 @@ describe('Input', () => { value="" /> ); - expect(screen.getByRole('textbox')).toHaveAttribute('type', 'text'); + expect(rtlScreen.getByRole('textbox')).toHaveAttribute('type', 'text'); }); it('renders a search input', () => { @@ -30,6 +30,6 @@ describe('Input', () => { value="" /> ); - expect(screen.getByRole('searchbox')).toHaveAttribute('type', 'search'); + expect(rtlScreen.getByRole('searchbox')).toHaveAttribute('type', 'search'); }); }); diff --git a/src/components/atoms/forms/fields/input/input.tsx b/src/components/atoms/forms/fields/input/input.tsx index 0f0736c..c47534f 100644 --- a/src/components/atoms/forms/fields/input/input.tsx +++ b/src/components/atoms/forms/fields/input/input.tsx @@ -8,7 +8,7 @@ import styles from '../fields.module.scss'; export type InputProps = Omit< InputHTMLAttributes<HTMLInputElement>, - 'disabled' | 'hidden' | 'readonly' | 'required' | 'type' + 'disabled' | 'readonly' | 'required' | 'type' > & Required<Pick<InputHTMLAttributes<HTMLInputElement>, 'id' | 'name'>> & { /** @@ -18,12 +18,6 @@ export type InputProps = Omit< */ isDisabled?: boolean; /** - * Should the field be hidden? - * - * @default false - */ - isHidden?: boolean; - /** * Should the field be readonly? * * @default false @@ -45,7 +39,6 @@ const InputWithRef = ( { className = '', isDisabled = false, - isHidden = false, isReadOnly = false, isRequired = false, ...props |
