feat: ✨ Add select

package.json

@@ -5,7 +5,7 @@
     "name": "Marcelo Ludovino",
     "email": "marcelo.docutec@gmail.com"
   },
-  "version": "0.0.8",
+  "version": "0.0.10",
   "type": "module",
   "engines": {
     "node": ">=18.0.0"

src/components/atoms/Select/index.tsx

@@ -0,0 +1,26 @@
+import { FC } from 'react'
+
+import { MenuItem } from '@mui/material'
+import MuiSelect, { SelectProps } from '@mui/material/Select'
+
+export interface MuiSelectProps extends SelectProps {
+  options: string[]
+}
+
+export const Select: FC<MuiSelectProps> = ({
+  options,
+  label = '',
+  ...props
+}) => {
+  return (
+    <MuiSelect {...props}>
+      {options.map(option => {
+        return (
+          <MenuItem value={option} key={option}>
+            {option}
+          </MenuItem>
+        )
+      })}
+    </MuiSelect>
+  )
+}

src/stories/Select.stories.tsx

@@ -0,0 +1,40 @@
+import type { Meta, StoryFn } from '@storybook/react'
+
+import { Select } from '../components/atoms/Select'
+
+export default {
+  title: 'Atoms/Select',
+  component: Select,
+  tags: ['autodocs'],
+  argTypes: {},
+} as Meta<typeof Select>
+
+type Story = StoryFn<typeof Select>
+
+const Template: Story = args => {
+  return (
+    <Select
+      {...args}
+      options={['Ambos', 'Activo', 'Inactivo', 'Lorem ipsum dolor sit amet']}
+      label='Estado'
+    />
+  )
+}
+
+export const Standard = Template.bind({})
+Standard.args = {
+  variant: 'standard',
+  defaultValue: 'Ambos',
+}
+
+export const Outlined = Template.bind({})
+Outlined.args = {
+  variant: 'outlined',
+  defaultValue: 'Ambos',
+}
+
+export const DefaultLongText = Template.bind({})
+DefaultLongText.args = {
+  variant: 'outlined',
+  defaultValue: 'Lorem ipsum dolor sit amet',
+}