aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/atoms/forms/select.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/atoms/forms/select.tsx')
-rw-r--r--src/components/atoms/forms/select.tsx32
1 files changed, 6 insertions, 26 deletions
diff --git a/src/components/atoms/forms/select.tsx b/src/components/atoms/forms/select.tsx
index dbe9b37..14f85dc 100644
--- a/src/components/atoms/forms/select.tsx
+++ b/src/components/atoms/forms/select.tsx
@@ -1,4 +1,4 @@
-import { ChangeEvent, FC, SetStateAction } from 'react';
+import { ChangeEvent, FC, SelectHTMLAttributes, SetStateAction } from 'react';
import styles from './forms.module.scss';
export type SelectOptions = {
@@ -16,19 +16,7 @@ export type SelectOptions = {
value: string;
};
-export type SelectProps = {
- /**
- * One or more ids that refers to the select field name.
- */
- 'aria-labelledby'?: string;
- /**
- * Add classnames to the select field.
- */
- className?: string;
- /**
- * Field state. Either enabled (false) or disabled (true).
- */
- disabled?: boolean;
+export type SelectProps = SelectHTMLAttributes<HTMLSelectElement> & {
/**
* Field id attribute.
*/
@@ -42,10 +30,6 @@ export type SelectProps = {
*/
options: SelectOptions[];
/**
- * True if the field is required. Default: false.
- */
- required?: boolean;
- /**
* Callback function to set field value.
*/
setValue: (value: SetStateAction<string>) => void;
@@ -60,12 +44,14 @@ export type SelectProps = {
*
* Render a HTML select element.
*/
-const Select: FC<SelectProps> = ({
+export const Select: FC<SelectProps> = ({
className = '',
options,
setValue,
...props
}) => {
+ const selectClass = `${styles.field} ${styles['field--select']} ${className}`;
+
/**
* Update select value when an option is selected.
* @param e - The option change event.
@@ -86,14 +72,8 @@ const Select: FC<SelectProps> = ({
));
return (
- <select
- className={`${styles.field} ${styles['field--select']} ${className}`}
- onChange={updateValue}
- {...props}
- >
+ <select {...props} className={selectClass} onChange={updateValue}>
{getOptions()}
</select>
);
};
-
-export default Select;