norma-library 0.4.8 → 0.5.0

package/src/stories/TimePicker.stories.tsx

@@ -1,113 +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/types/index.ts

@@ -16,107 +16,74 @@ import {
   SvgIconProps,
   ModalProps,
   CardProps as MuiCardProps,
-} from "@mui/material";
-
-import { TimelineProps as MuiTimeLineProps } from "@mui/lab";
-
-import { SwitchBaseProps as MuiSwitchBaseProps } from "@mui/material/internal/SwitchBase";
-
-import { iconsSVG } from "../components/Svgs";
-
-export type ColorVariant =
-  | "inherit"
-  | "primary"
-  | "secondary"
-  | "success"
-  | "error"
-  | "info"
-  | "warning";
-
-export type TextFieldColorVariant =
-  | "primary"
-  | "secondary"
-  | "error"
-  | "info"
-  | "success"
-  | "warning";
-
-export type CheckBoxColorVariant =
-  | "primary"
-  | "secondary"
-  | "error"
-  | "info"
-  | "success"
-  | "warning"
-  | "default";
-
-export type SizeVariant = "small" | "medium" | "large";
-export type ButtonVariant = "text" | "outlined" | "contained";
-export type DropVariant = "menu" | "selectedMenu";
-export type TagVariant = "outlined" | "contained";
-export type TabsVariant = "standard" | "scrollable" | "fullWidth";
-export type DatePickVariant = "responsive" | "desktop" | "mobile";
-export type ProgressVariant =
-  | "determinate"
-  | "indeterminate"
-  | "buffer"
-  | "query";
-
-export type MuiButtonBaseProps = Omit<
-  MuiButtonProps,
-  "sx" | "color" | "size" | "variant"
->;
+  TableProps as MuiTableProps,
+} from '@mui/material';
 
-export type MuiIconButtonBaseProps = Omit<
-  MuiIconButtonProps,
-  "sx" | "color" | "size" | "variant"
->;
+import { TimelineProps as MuiTimeLineProps } from '@mui/lab';
+
+import { SwitchBaseProps as MuiSwitchBaseProps } from '@mui/material/internal/SwitchBase';
+
+import { iconsSVG } from '../components/Svgs';
+
+export type ColorVariant = 'inherit' | 'primary' | 'secondary' | 'success' | 'error' | 'info' | 'warning';
+
+export type TextFieldColorVariant = 'primary' | 'secondary' | 'error' | 'info' | 'success' | 'warning';
+
+export type CheckBoxColorVariant = 'primary' | 'secondary' | 'error' | 'info' | 'success' | 'warning' | 'default';
+
+export type SizeVariant = 'small' | 'medium' | 'large';
+export type ButtonVariant = 'text' | 'outlined' | 'contained';
+export type DropVariant = 'menu' | 'selectedMenu';
+export type TagVariant = 'outlined' | 'contained';
+export type TabsVariant = 'standard' | 'scrollable' | 'fullWidth';
+export type DatePickVariant = 'responsive' | 'desktop' | 'mobile';
+export type ProgressVariant = 'determinate' | 'indeterminate' | 'buffer' | 'query';
+
+export type MuiButtonBaseProps = Omit<MuiButtonProps, 'sx' | 'color' | 'size' | 'variant'>;
+
+export type MuiIconButtonBaseProps = Omit<MuiIconButtonProps, 'sx' | 'color' | 'size' | 'variant'>;
 
 export type TextFieldValue = string | number;
-export type TextFieldVariant = "standard" | "outlined" | "filled";
-export type TextFieldSizeVariant = "small" | "medium";
-export type DirectionVariant = "vertical" | "horizontal";
-export type PaperVariant = "elevation" | "outlined";
-export type PositionVariant =
-  | "left"
-  | "right"
-  | "alternate"
-  | "alternate-reverse";
+export type TextFieldVariant = 'standard' | 'outlined' | 'filled';
+export type TextFieldSizeVariant = 'small' | 'medium';
+export type DirectionVariant = 'vertical' | 'horizontal';
+export type PaperVariant = 'elevation' | 'outlined';
+export type PositionVariant = 'left' | 'right' | 'alternate' | 'alternate-reverse';
 
 export type MuiTextFieldBaseProps = Omit<
   MuiTextFieldProps,
-  | "onChange"
-  | "onBlur"
-  | "onFocus"
-  | "defaultValue"
-  | "size"
-  | "value"
-  | "id"
-  | "fullWidth"
-  | "helperText"
-  | "type"
-  | "InputProps"
-  | "InputLabelProps"
-  | "autoComplete"
-  | "label"
-  | "helperText"
-  | "InputLabelProps"
-  | "margin"
-  | "maxRows"
-  | "minRows"
-  | "multiline"
-  | "name"
-  | "placeholder"
-  | "rows"
-  | "select"
-  | "SelectProps"
-  | "sx"
-  | "autoFocus"
-  | "error"
-  | "classes"
-  | "children"
-  | "color"
-  | "variant"
+  | 'onChange'
+  | 'onBlur'
+  | 'onFocus'
+  | 'defaultValue'
+  | 'size'
+  | 'value'
+  | 'id'
+  | 'fullWidth'
+  | 'helperText'
+  | 'type'
+  | 'InputProps'
+  | 'InputLabelProps'
+  | 'autoComplete'
+  | 'label'
+  | 'helperText'
+  | 'InputLabelProps'
+  | 'margin'
+  | 'maxRows'
+  | 'minRows'
+  | 'multiline'
+  | 'name'
+  | 'placeholder'
+  | 'rows'
+  | 'select'
+  | 'SelectProps'
+  | 'sx'
+  | 'autoFocus'
+  | 'error'
+  | 'classes'
+  | 'children'
+  | 'color'
+  | 'variant'
 >;
 
 // eslint-disable-next-line @typescript-eslint/no-empty-interface
@@ -125,73 +92,44 @@ export interface CheckboxPropsSizeOverrides {}
 // eslint-disable-next-line @typescript-eslint/no-empty-interface
 export interface CheckboxPropsColorOverrides {}
 
-export type MuiCheckBoxBaseProps = Omit<MuiCheckBoxProps, "sx">;
-export type MuiModalBaseProps = Omit<ModalProps, "sx">;
-export type MuiCardBaseProps = Omit<MuiCardProps, "sx">;
-export type MuiDropDownBaseProps = Omit<MuiDropDownProps, "sx" | "variant">;
-export type MuiTagBaseProps = Omit<MuiChipProps, "sx" | "color">;
-export type MuiRangerSliderBaseProps = Omit<MuiSliderProps, "sx" | "color">;
-export type MuiProgressBarBaseProps = Omit<
-  MuiLinearProgressProps,
-  "sx" | "ref"
->;
-export type MuiTabsBaseProps = Omit<
-  MuiTabsProps,
-  "sx" | "children" | "onChange" | "variant" | "value"
->;
-export type MuiAccordionBaseProps = Omit<
-  MuiAccordionProps,
-  "sx" | "children" | "defaultExpanded" | "onChange"
->;
-export type MuiSelectBaseProps = Omit<
-  MuiSelectProps,
-  "sx" | "value" | "onClose" | "onOpen" | "input" | "label"
->;
+export type MuiCheckBoxBaseProps = Omit<MuiCheckBoxProps, 'sx'>;
+export type MuiModalBaseProps = Omit<ModalProps, 'sx'>;
+export type MuiCardBaseProps = Omit<MuiCardProps, 'sx'>;
+export type MuiDropDownBaseProps = Omit<MuiDropDownProps, 'sx' | 'variant'>;
+export type MuiTagBaseProps = Omit<MuiChipProps, 'sx' | 'color'>;
+export type MuiRangerSliderBaseProps = Omit<MuiSliderProps, 'sx' | 'color'>;
+export type MuiProgressBarBaseProps = Omit<MuiLinearProgressProps, 'sx' | 'ref'>;
+export type MuiTabsBaseProps = Omit<MuiTabsProps, 'sx' | 'children' | 'onChange' | 'variant' | 'value'>;
+export type MuiAccordionBaseProps = Omit<MuiAccordionProps, 'sx' | 'children' | 'defaultExpanded' | 'onChange'>;
+export type MuiSelectBaseProps = Omit<MuiSelectProps, 'sx' | 'value' | 'onClose' | 'onOpen' | 'input' | 'label'>;
 
-export type MuiPaperBaseProps = Omit<MuiPaperProps, "sx">;
+export type MuiPaperBaseProps = Omit<MuiPaperProps, 'sx'>;
 
-export type MuiDatePickerBaseProps = Omit<MuiTextFieldProps, "sx">;
+export type MuiDatePickerBaseProps = Omit<MuiTextFieldProps, 'sx'>;
 
-export type MuiAvatarBaseProps = Omit<
-  MuiAvatarProps,
-  "sx" | "src" | "children" | "variant" | "sizes"
->;
+export type MuiDataGridBaseProps = Omit<MuiTableProps, 'sx'>;
 
-export type MuiTimeLineBaseProps = Omit<
-  MuiTimeLineProps,
-  "sx" | "position" | "children" | "ref"
->;
+export type MuiAvatarBaseProps = Omit<MuiAvatarProps, 'sx' | 'src' | 'children' | 'variant' | 'sizes'>;
+
+export type MuiTimeLineBaseProps = Omit<MuiTimeLineProps, 'sx' | 'position' | 'children' | 'ref'>;
 
 export type MuiBadgeBaseProps = Omit<
   MuiBadgeProps,
-  | "sx"
-  | "color"
-  | "children"
-  | "invisible"
-  | "variant"
-  | "className"
-  | "badgeContent"
+  'sx' | 'color' | 'children' | 'invisible' | 'variant' | 'className' | 'badgeContent'
 >;
 
-export type IconScale =
-  | "xsmall"
-  | "small"
-  | "medium"
-  | "large"
-  | "xlarge"
-  | "2xlarge"
-  | "3xlarge";
+export type IconScale = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | '2xlarge' | '3xlarge';
 
 export type IconColors =
-  | "inherit"
-  | "primary"
-  | "secondary"
-  | "error"
-  | "info"
-  | "success"
-  | "warning"
-  | "white"
-  | "black";
+  | 'inherit'
+  | 'primary'
+  | 'secondary'
+  | 'error'
+  | 'info'
+  | 'success'
+  | 'warning'
+  | 'white'
+  | 'black';
 
 export const scaleSize: Record<IconScale, number> = {
   xsmall: 14,
@@ -199,8 +137,8 @@ export const scaleSize: Record<IconScale, number> = {
   medium: 24,
   large: 28,
   xlarge: 32,
-  "2xlarge": 36,
-  "3xlarge": 40,
+  '2xlarge': 36,
+  '3xlarge': 40,
 };
 
 export type SVGIconProps = {
@@ -212,7 +150,7 @@ export type IconKey = keyof typeof iconsSVG;
 
 export type MuiRadioBaseProps = Omit<
   MuiSwitchBaseProps,
-  "checkedIcon" | "color" | "icon" | "type" | "checked" | "size"
+  'checkedIcon' | 'color' | 'icon' | 'type' | 'checked' | 'size'
 >;
 
 export type OptionsRadios = {

package/tsconfig.json

@@ -1,6 +1,6 @@
 {
   "include": ["src"],
-  "exclude": ["dist", "node_modules", "src/stories"],
+  "exclude": ["dist", "node_modules", "src/stories", ".docz", "docs"],
   "compilerOptions": {
     "module": "esnext",
     "lib": ["dom", "esnext"],