diff options
Diffstat (limited to 'src/components/Form/Select')
| -rw-r--r-- | src/components/Form/Select/Select.module.scss | 23 | ||||
| -rw-r--r-- | src/components/Form/Select/Select.tsx | 56 |
2 files changed, 0 insertions, 79 deletions
diff --git a/src/components/Form/Select/Select.module.scss b/src/components/Form/Select/Select.module.scss deleted file mode 100644 index d4a40eb..0000000 --- a/src/components/Form/Select/Select.module.scss +++ /dev/null @@ -1,23 +0,0 @@ -@use "@styles/abstracts/functions" as fun; - -.wrapper { - padding: fun.convert-px(3) var(--spacing-xs); - background: var(--color-bg-tertiary); - border: fun.convert-px(2) solid var(--color-border); - box-shadow: fun.convert-px(3) fun.convert-px(3) 0 0 var(--color-shadow); - cursor: pointer; - transition: all 0.3s ease-in-out 0s; - - &:hover { - box-shadow: fun.convert-px(4) fun.convert-px(4) 0 fun.convert-px(1) - var(--color-shadow); - transform: translate(#{fun.convert-px(-2)}, #{fun.convert-px(-2)}); - } - - &:focus { - background: var(--color-bg); - border-color: var(--color-primary); - box-shadow: 0 0 0 0 var(--color-shadow); - transform: translate(#{fun.convert-px(3)}, #{fun.convert-px(3)}); - } -} diff --git a/src/components/Form/Select/Select.tsx b/src/components/Form/Select/Select.tsx deleted file mode 100644 index feab991..0000000 --- a/src/components/Form/Select/Select.tsx +++ /dev/null @@ -1,56 +0,0 @@ -import { ChangeEvent, ReactElement, SetStateAction } from 'react'; -import styles from './Select.module.scss'; - -type SelectOptions = { - id: string; - name: string; - value: string; -}; - -const Select = ({ - options, - id, - name, - value, - setValue, - required = false, - label, -}: { - options: SelectOptions[]; - id: string; - name: string; - value: string; - setValue: (value: SetStateAction<string>) => void; - required?: boolean; - label?: ReactElement; -}) => { - const getOptions = () => { - return options.map((option) => ( - <option key={option.id} value={option.value}> - {option.name} - </option> - )); - }; - - const handleChange = (event: ChangeEvent<HTMLSelectElement>) => { - setValue(event.target.value); - }; - - return ( - <> - {label} - <select - name={name} - id={id} - value={value} - onChange={handleChange} - required={required} - className={styles.wrapper} - > - {getOptions()} - </select> - </> - ); -}; - -export default Select; |
