norma-library 0.6.2 → 0.6.4

package/src/stories/TextInput.stories.tsx

@@ -1,53 +1,53 @@
-import React from 'react';
-import TextInput from '../components/TextInput';
-
-export default {
-  title: 'Form/TextInput',
-  component: TextInput,
-  tags: ['autodocs'],
-  parameters: {
-    layout: 'centered',
-  },
-  argTypes: { 
-    className: {
-      description: 'Adicione uma classe.',
-    },
-    label: {
-      description: 'Adicione uma label.'
-    },
-    value: {
-      description: 'Adicione um valor.'
-    },
-    onChange: {
-      description: 'Função para capturar o valor quando alterado.'
-    },
-    disabled: {
-      description: 'Habilita ou desabilita.'
-    },
-    placeholder: {
-      description: 'Adicione um placeholder.'
-    },
-    name: {
-      description: 'Adiciona um name'
-    },
-    type: {
-      description: 'Adiciona um type',
-      options: ['text', 'password'],
-      control: { type: 'radio' }
-    }
-  }
-
-}
-
-export const Default = (args) => <TextInput {...args} />
-
-Default.args = {
-  className: '',
-  label: 'Data:',
-  onChange: '',
-  disabled: false,
-  value: 'Valor do input',
-  placeholder: 'Digite algo...',
-  name: '',
-  type: '' 
+import React from 'react';
+import TextInput from '../components/TextInput';
+
+export default {
+  title: 'Form/TextInput',
+  component: TextInput,
+  tags: ['autodocs'],
+  parameters: {
+    layout: 'centered',
+  },
+  argTypes: { 
+    className: {
+      description: 'Adicione uma classe.',
+    },
+    label: {
+      description: 'Adicione uma label.'
+    },
+    value: {
+      description: 'Adicione um valor.'
+    },
+    onChange: {
+      description: 'Função para capturar o valor quando alterado.'
+    },
+    disabled: {
+      description: 'Habilita ou desabilita.'
+    },
+    placeholder: {
+      description: 'Adicione um placeholder.'
+    },
+    name: {
+      description: 'Adiciona um name'
+    },
+    type: {
+      description: 'Adiciona um type',
+      options: ['text', 'password'],
+      control: { type: 'radio' }
+    }
+  }
+
+}
+
+export const Default = (args) => <TextInput {...args} />
+
+Default.args = {
+  className: '',
+  label: 'Data:',
+  onChange: '',
+  disabled: false,
+  value: 'Valor do input',
+  placeholder: 'Digite algo...',
+  name: '',
+  type: '' 
 }

package/src/stories/TimeLine.stories.tsx

@@ -1,35 +1,35 @@
-import React from 'react';
-
-import type { Meta } from '@storybook/react';
-import { TimeLine } from '../components';
-import { Stack } from '@mui/material';
-
-const meta = {
-  title: 'Display/TimeLine',
-  component: TimeLine,
-  parameters: {
-    layout: 'centered',
-  },
-  tags: ['autodocs'],
-  argTypes: {},
-} satisfies Meta<typeof TimeLine>;
-
-export default meta;
-
-export const TimeLineBasic = () => {
-  return (
-    <>
-      <TimeLine />
-    </>
-  );
-};
-
-export const TimeLineColors = () => {
-  return (
-    <Stack direction="row" spacing={2}>
-      {['primary', 'secondary', 'inherit', 'error', 'info', 'success', 'warning'].map((color, key) => (
-        <TimeLine color={color} key={key} />
-      ))}
-    </Stack>
-  );
-};
+import React from 'react';
+
+import type { Meta } from '@storybook/react';
+import { TimeLine } from '../components';
+import { Stack } from '@mui/material';
+
+const meta = {
+  title: 'Display/TimeLine',
+  component: TimeLine,
+  parameters: {
+    layout: 'centered',
+  },
+  tags: ['autodocs'],
+  argTypes: {},
+} satisfies Meta<typeof TimeLine>;
+
+export default meta;
+
+export const TimeLineBasic = () => {
+  return (
+    <>
+      <TimeLine />
+    </>
+  );
+};
+
+export const TimeLineColors = () => {
+  return (
+    <Stack direction="row" spacing={2}>
+      {['primary', 'secondary', 'inherit', 'error', 'info', 'success', 'warning'].map((color, key) => (
+        <TimeLine color={color} key={key} />
+      ))}
+    </Stack>
+  );
+};

package/src/stories/TimePicker.stories.tsx

@@ -1,87 +1,87 @@
-import React from 'react';
-import { DemoContainer } from '@mui/x-date-pickers/internals/demo';
-import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
-import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
-import { TimePicker } from '@mui/x-date-pickers/TimePicker';
-import { MobileTimePicker } from '@mui/x-date-pickers/MobileTimePicker';
-import { DesktopTimePicker } from '@mui/x-date-pickers/DesktopTimePicker';
-import type { Meta } from '@storybook/react';
-import dayjs, { Dayjs } from 'dayjs';
-import utc from 'dayjs/plugin/utc';
-import timezone from 'dayjs/plugin/timezone';
-
-import 'dayjs/locale/pt-br';
-import 'dayjs/locale/en';
-import 'dayjs/locale/es';
-
-dayjs.extend(utc);
-dayjs.extend(timezone);
-
-const meta = {
-  title: 'Form/TimePicker',
-  component: TimePicker,
-  parameters: {
-    layout: 'centered',
-  },
-  tags: ['autodocs'],
-  argTypes: {},
-} satisfies Meta<typeof TimePicker>;
-
-export default meta;
-
-export const BasicDatePicker = () => (
-  <LocalizationProvider dateAdapter={AdapterDayjs}>
-    <DemoContainer components={['TimePicker']}>
-      <TimePicker label="TimePicker" />
-    </DemoContainer>
-  </LocalizationProvider>
-);
-
-BasicDatePicker.storyName = 'TimePicker Basic';
-
-export const TimePickerVariants = () => (
-  <LocalizationProvider dateAdapter={AdapterDayjs}>
-    <DemoContainer components={['TimePicker', 'MobileTimePicker', 'DesktopTimePicker']}>
-      <div style={{ width: '480px', marginBottom: 30 }}>
-        <TimePicker sx={{ minWidth: 275 }} label="TimePicker Responsive" timezone="America/Sao_Paulo" />
-      </div>
-      <div style={{ width: '480px', marginBottom: 30 }}>
-        <MobileTimePicker sx={{ minWidth: 275 }} label="TimePicker Mobile" timezone="America/Sao_Paulo" />
-      </div>
-      <div style={{ width: '480px', marginBottom: 30 }}>
-        <DesktopTimePicker sx={{ minWidth: 275 }} label="TimePicker Desktop" timezone="America/Sao_Paulo" />
-      </div>
-    </DemoContainer>
-  </LocalizationProvider>
-);
-
-TimePickerVariants.storyName = 'TimePicker Variants';
-
-export const TimePickerLanguage = () => (
-  <>
-    <div style={{ width: '480px', marginBottom: 30 }}>
-      <LocalizationProvider dateAdapter={AdapterDayjs} adapterLocale={'pt-br'}>
-        <DemoContainer components={['TimePicker']}>
-          <TimePicker sx={{ minWidth: 275 }} label="TimePicker Brazil" timezone="America/Sao_Paulo" />
-        </DemoContainer>
-      </LocalizationProvider>
-    </div>
-
-    <div style={{ width: '480px', marginBottom: 30 }}>
-      <LocalizationProvider dateAdapter={AdapterDayjs} adapterLocale={'en'}>
-        <DemoContainer components={['TimePicker']}>
-          <TimePicker sx={{ minWidth: 275 }} label="TimePicker English" timezone="America/Sao_Paulo" />
-        </DemoContainer>
-      </LocalizationProvider>
-    </div>
-    <div style={{ width: '480px', marginBottom: 30 }}>
-      <LocalizationProvider dateAdapter={AdapterDayjs} adapterLocale={'es'}>
-        <DemoContainer components={['TimePicker']}>
-          <TimePicker sx={{ minWidth: 275 }} label="TimePicker Spain" timezone="America/Sao_Paulo" />
-        </DemoContainer>
-      </LocalizationProvider>
-    </div>
-  </>
-);
-
-TimePickerLanguage.storyName = 'TimePicker Languages';
+import React from 'react';
+import { DemoContainer } from '@mui/x-date-pickers/internals/demo';
+import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
+import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
+import { TimePicker } from '@mui/x-date-pickers/TimePicker';
+import { MobileTimePicker } from '@mui/x-date-pickers/MobileTimePicker';
+import { DesktopTimePicker } from '@mui/x-date-pickers/DesktopTimePicker';
+import type { Meta } from '@storybook/react';
+import dayjs, { Dayjs } from 'dayjs';
+import utc from 'dayjs/plugin/utc';
+import timezone from 'dayjs/plugin/timezone';
+
+import 'dayjs/locale/pt-br';
+import 'dayjs/locale/en';
+import 'dayjs/locale/es';
+
+dayjs.extend(utc);
+dayjs.extend(timezone);
+
+const meta = {
+  title: 'Form/TimePicker',
+  component: TimePicker,
+  parameters: {
+    layout: 'centered',
+  },
+  tags: ['autodocs'],
+  argTypes: {},
+} satisfies Meta<typeof TimePicker>;
+
+export default meta;
+
+export const BasicDatePicker = () => (
+  <LocalizationProvider dateAdapter={AdapterDayjs}>
+    <DemoContainer components={['TimePicker']}>
+      <TimePicker label="TimePicker" />
+    </DemoContainer>
+  </LocalizationProvider>
+);
+
+BasicDatePicker.storyName = 'TimePicker Basic';
+
+export const TimePickerVariants = () => (
+  <LocalizationProvider dateAdapter={AdapterDayjs}>
+    <DemoContainer components={['TimePicker', 'MobileTimePicker', 'DesktopTimePicker']}>
+      <div style={{ width: '480px', marginBottom: 30 }}>
+        <TimePicker sx={{ minWidth: 275 }} label="TimePicker Responsive" timezone="America/Sao_Paulo" />
+      </div>
+      <div style={{ width: '480px', marginBottom: 30 }}>
+        <MobileTimePicker sx={{ minWidth: 275 }} label="TimePicker Mobile" timezone="America/Sao_Paulo" />
+      </div>
+      <div style={{ width: '480px', marginBottom: 30 }}>
+        <DesktopTimePicker sx={{ minWidth: 275 }} label="TimePicker Desktop" timezone="America/Sao_Paulo" />
+      </div>
+    </DemoContainer>
+  </LocalizationProvider>
+);
+
+TimePickerVariants.storyName = 'TimePicker Variants';
+
+export const TimePickerLanguage = () => (
+  <>
+    <div style={{ width: '480px', marginBottom: 30 }}>
+      <LocalizationProvider dateAdapter={AdapterDayjs} adapterLocale={'pt-br'}>
+        <DemoContainer components={['TimePicker']}>
+          <TimePicker sx={{ minWidth: 275 }} label="TimePicker Brazil" timezone="America/Sao_Paulo" />
+        </DemoContainer>
+      </LocalizationProvider>
+    </div>
+
+    <div style={{ width: '480px', marginBottom: 30 }}>
+      <LocalizationProvider dateAdapter={AdapterDayjs} adapterLocale={'en'}>
+        <DemoContainer components={['TimePicker']}>
+          <TimePicker sx={{ minWidth: 275 }} label="TimePicker English" timezone="America/Sao_Paulo" />
+        </DemoContainer>
+      </LocalizationProvider>
+    </div>
+    <div style={{ width: '480px', marginBottom: 30 }}>
+      <LocalizationProvider dateAdapter={AdapterDayjs} adapterLocale={'es'}>
+        <DemoContainer components={['TimePicker']}>
+          <TimePicker sx={{ minWidth: 275 }} label="TimePicker Spain" timezone="America/Sao_Paulo" />
+        </DemoContainer>
+      </LocalizationProvider>
+    </div>
+  </>
+);
+
+TimePickerLanguage.storyName = 'TimePicker Languages';

package/src/stories/Title.stories.tsx

@@ -1,44 +1,44 @@
-import React from "react"
-import Title from '../components/Typography/Title';
-
-export default {
-  title: 'Tipografia/Title',
-  component: Title,
-  tags: ['autodocs'],
-  parameters: {
-    layout: 'centered',
-  },
-  argTypes: {
-    as: {
-      description: 'Adiciona a tag do titulo.',
-      options: ['h1', 'h2', 'h3', 'h4', 'h5'],
-      control: { type: 'radio' }
-    },
-    children: {
-      description: 'Adiciona um children.'
-    },
-    className: {
-      description: 'Adicione uma classe.',
-    },
-    size: {
-      description: 'Adicione um tamanho.',
-      options: ['small', 'medium', 'large'],
-      control: { type: 'radio' }
-    },
-    type: {
-      description: 'Adicione um tipo.',
-      options: ['default', 'secondary', 'success', 'warning', 'danger', 'info'],
-      control: { type: 'radio' }
-    },
-  }
-}
-
-export const Default = (args) => <Title {...args} />
-
-Default.args = {
-  as: 'h1',
-  children: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry.',
-  className: '',
-  size: 'default',
-  type: ''
+import React from "react"
+import Title from '../components/Typography/Title';
+
+export default {
+  title: 'Tipografia/Title',
+  component: Title,
+  tags: ['autodocs'],
+  parameters: {
+    layout: 'centered',
+  },
+  argTypes: {
+    as: {
+      description: 'Adiciona a tag do titulo.',
+      options: ['h1', 'h2', 'h3', 'h4', 'h5'],
+      control: { type: 'radio' }
+    },
+    children: {
+      description: 'Adiciona um children.'
+    },
+    className: {
+      description: 'Adicione uma classe.',
+    },
+    size: {
+      description: 'Adicione um tamanho.',
+      options: ['small', 'medium', 'large'],
+      control: { type: 'radio' }
+    },
+    type: {
+      description: 'Adicione um tipo.',
+      options: ['default', 'secondary', 'success', 'warning', 'danger', 'info'],
+      control: { type: 'radio' }
+    },
+  }
+}
+
+export const Default = (args) => <Title {...args} />
+
+Default.args = {
+  as: 'h1',
+  children: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry.',
+  className: '',
+  size: 'default',
+  type: ''
 }