aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/atoms/forms/field.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/atoms/forms/field.tsx')
-rw-r--r--src/components/atoms/forms/field.tsx111
1 files changed, 0 insertions, 111 deletions
diff --git a/src/components/atoms/forms/field.tsx b/src/components/atoms/forms/field.tsx
deleted file mode 100644
index a4553e3..0000000
--- a/src/components/atoms/forms/field.tsx
+++ /dev/null
@@ -1,111 +0,0 @@
-import {
- ChangeEvent,
- forwardRef,
- ForwardRefRenderFunction,
- SetStateAction,
-} from 'react';
-import styles from './forms.module.scss';
-
-export type FieldType =
- | 'datetime-local'
- | 'email'
- | 'number'
- | 'search'
- | 'tel'
- | 'text'
- | 'textarea'
- | 'time'
- | 'url';
-
-export type FieldProps = {
- /**
- * One or more ids that refers to the field name.
- */
- 'aria-labelledby'?: string;
- /**
- * Add classnames to the field.
- */
- className?: string;
- /**
- * Field state. Either enabled (false) or disabled (true).
- */
- disabled?: boolean;
- /**
- * Field id attribute.
- */
- id: string;
- /**
- * Field maximum value.
- */
- max?: number | string;
- /**
- * Field minimum value.
- */
- min?: number | string;
- /**
- * Field name attribute.
- */
- name: string;
- /**
- * Placeholder value.
- */
- placeholder?: string;
- /**
- * True if the field is required. Default: false.
- */
- required?: boolean;
- /**
- * Callback function to set field value.
- */
- setValue: (value: SetStateAction<string>) => void;
- /**
- * Field incremental values that are valid.
- */
- step?: number | string;
- /**
- * Field type. Default: text.
- */
- type: FieldType;
- /**
- * Field value.
- */
- value: string;
-};
-
-const FieldWithRef: ForwardRefRenderFunction<HTMLInputElement, FieldProps> = (
- { className = '', setValue, type, ...props },
- ref
-) => {
- /**
- * Update select value when an option is selected.
- * @param e - The option change event.
- */
- const updateValue = (
- e: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>
- ) => {
- setValue(e.target.value);
- };
-
- return type === 'textarea' ? (
- <textarea
- {...props}
- className={`${styles.field} ${styles['field--textarea']} ${className}`}
- onChange={updateValue}
- />
- ) : (
- <input
- {...props}
- className={`${styles.field} ${className}`}
- onChange={updateValue}
- ref={ref}
- type={type}
- />
- );
-};
-
-/**
- * Field component.
- *
- * Render either an input or a textarea.
- */
-export const Field = forwardRef(FieldWithRef);