norma-library 0.6.65 → 0.6.66

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (165) hide show
  1. package/.babelrc.json +18 -18
  2. package/.prettierignore +10 -10
  3. package/.prettierrc.json +20 -20
  4. package/.storybook/main.ts +20 -20
  5. package/.storybook/preview.ts +15 -15
  6. package/README.md +43 -43
  7. package/commitlint.config.js +1 -1
  8. package/dist/esm/components/Card.js +3 -3
  9. package/dist/esm/components/Card.js.map +1 -1
  10. package/docs/index.md +118 -118
  11. package/package.json +136 -136
  12. package/src/components/Accordion.tsx +39 -39
  13. package/src/components/Avatar.tsx +17 -17
  14. package/src/components/Badge.tsx +14 -14
  15. package/src/components/Box/index.tsx +12 -12
  16. package/src/components/Box/interfaces.ts +3 -3
  17. package/src/components/Box/styles.tsx +22 -22
  18. package/src/components/Breadcrumb/index.tsx +27 -27
  19. package/src/components/Breadcrumb/interface.ts +8 -8
  20. package/src/components/Breadcrumb/styles.tsx +32 -32
  21. package/src/components/Button.tsx +26 -26
  22. package/src/components/Card.tsx +38 -38
  23. package/src/components/ChatMessage.tsx +87 -87
  24. package/src/components/ChatMessageBalloon/ChatMessageBalloon.style.ts +56 -56
  25. package/src/components/ChatMessageBalloon/ChatMessageBalloon.tsx +55 -55
  26. package/src/components/CheckBox.tsx +21 -21
  27. package/src/components/DateInput/index.tsx +34 -34
  28. package/src/components/DateInput/interface.ts +13 -13
  29. package/src/components/DateInput/styles.tsx +27 -27
  30. package/src/components/DatePicker.tsx +67 -67
  31. package/src/components/DropDown.tsx +24 -24
  32. package/src/components/IconButton.tsx +37 -37
  33. package/src/components/Icons.tsx +82 -82
  34. package/src/components/Modal.tsx +103 -103
  35. package/src/components/MultiSelectInput/components/MultiValue/index.tsx +44 -44
  36. package/src/components/MultiSelectInput/components/Option/index.tsx +62 -62
  37. package/src/components/MultiSelectInput/components/Option/styles.tsx +8 -8
  38. package/src/components/MultiSelectInput/index.tsx +60 -60
  39. package/src/components/MultiSelectInput/interfaces.ts +15 -15
  40. package/src/components/MultiSelectInput/styles.tsx +43 -43
  41. package/src/components/Paper.tsx +12 -12
  42. package/src/components/ProgressBar.tsx +71 -71
  43. package/src/components/RadioGroup.tsx +43 -43
  44. package/src/components/RangerSlider.tsx +65 -65
  45. package/src/components/Select.tsx +74 -74
  46. package/src/components/SelectInput/components/Option/index.tsx +61 -61
  47. package/src/components/SelectInput/components/Option/styles.tsx +8 -8
  48. package/src/components/SelectInput/index.tsx +45 -45
  49. package/src/components/SelectInput/interfaces.ts +15 -15
  50. package/src/components/SelectInput/styles.tsx +31 -31
  51. package/src/components/StatusModal/StatusModal.style.tsx +75 -75
  52. package/src/components/StatusModal/StatusModal.tsx +58 -58
  53. package/src/components/Svgs.tsx +506 -506
  54. package/src/components/Table/components/header/index.tsx +86 -86
  55. package/src/components/Table/components/header/styles.tsx +59 -59
  56. package/src/components/Table/components/index.tsx +8 -8
  57. package/src/components/Table/components/pagination/index.tsx +39 -39
  58. package/src/components/Table/components/pagination/styles.tsx +28 -28
  59. package/src/components/Table/components/tbody/index.tsx +30 -30
  60. package/src/components/Table/components/tbody/styles.tsx +4 -4
  61. package/src/components/Table/index.tsx +317 -317
  62. package/src/components/Table/interface.ts +23 -23
  63. package/src/components/Table/styles.tsx +117 -117
  64. package/src/components/Tabs.tsx +105 -105
  65. package/src/components/Tag.tsx +33 -33
  66. package/src/components/TextField.tsx +19 -19
  67. package/src/components/TextInput/index.tsx +37 -37
  68. package/src/components/TextInput/interface.ts +9 -9
  69. package/src/components/TextInput/styles.tsx +23 -23
  70. package/src/components/TimeLine.tsx +89 -89
  71. package/src/components/TimePicker.tsx +78 -78
  72. package/src/components/Typography/Text/index.tsx +20 -20
  73. package/src/components/Typography/Text/interfaces.ts +5 -5
  74. package/src/components/Typography/Text/styles.tsx +40 -40
  75. package/src/components/Typography/Title/index.tsx +22 -22
  76. package/src/components/Typography/Title/interfaces.ts +6 -6
  77. package/src/components/Typography/Title/styles.tsx +40 -40
  78. package/src/components/Typography/index.tsx +6 -6
  79. package/src/components/UncontrolledTable/components/header/index.tsx +72 -72
  80. package/src/components/UncontrolledTable/components/header/styles.tsx +66 -66
  81. package/src/components/UncontrolledTable/components/index.tsx +8 -8
  82. package/src/components/UncontrolledTable/components/pagination/index.tsx +43 -43
  83. package/src/components/UncontrolledTable/components/pagination/styles.tsx +28 -28
  84. package/src/components/UncontrolledTable/components/tbody/index.tsx +33 -33
  85. package/src/components/UncontrolledTable/components/tbody/styles.tsx +32 -32
  86. package/src/components/UncontrolledTable/index.tsx +223 -223
  87. package/src/components/UncontrolledTable/interface.ts +46 -46
  88. package/src/components/UncontrolledTable/styles.tsx +123 -123
  89. package/src/components/UncontrolledTabs/UncontrolledTabs.style.tsx +58 -58
  90. package/src/components/UncontrolledTabs/UncontrolledTabs.tsx +71 -71
  91. package/src/components/UncontrolledTabs/UncontrolledTabsInfo.style.ts +8 -8
  92. package/src/components/index.ts +24 -24
  93. package/src/helpers/alignments.ts +14 -14
  94. package/src/helpers/borders.ts +18 -18
  95. package/src/helpers/colors.ts +264 -264
  96. package/src/helpers/index.ts +5 -5
  97. package/src/helpers/radios.ts +24 -24
  98. package/src/helpers/sizes.ts +72 -72
  99. package/src/hooks/useClickOutside.tsx +18 -18
  100. package/src/index.ts +70 -70
  101. package/src/interfaces/Accordion.ts +12 -12
  102. package/src/interfaces/Avatar.tsx +15 -15
  103. package/src/interfaces/Badge.ts +19 -19
  104. package/src/interfaces/Button.ts +19 -19
  105. package/src/interfaces/Card.ts +11 -11
  106. package/src/interfaces/ChatMessage.ts +12 -12
  107. package/src/interfaces/ChatMessageBalloon.ts +17 -17
  108. package/src/interfaces/CheckBox.ts +27 -27
  109. package/src/interfaces/DatePicker.ts +13 -13
  110. package/src/interfaces/DropDown.ts +14 -14
  111. package/src/interfaces/IconButton.ts +22 -22
  112. package/src/interfaces/Icons.ts +17 -17
  113. package/src/interfaces/Modal.ts +18 -18
  114. package/src/interfaces/Paper.ts +12 -12
  115. package/src/interfaces/ProgressBar.ts +29 -29
  116. package/src/interfaces/RadioGroup.ts +23 -23
  117. package/src/interfaces/RangerSlider.ts +21 -21
  118. package/src/interfaces/Select.ts +17 -17
  119. package/src/interfaces/Tabs.ts +19 -19
  120. package/src/interfaces/Tag.ts +17 -17
  121. package/src/interfaces/TextField.ts +44 -44
  122. package/src/interfaces/TimeLine.ts +11 -11
  123. package/src/interfaces/TimePicker.ts +13 -13
  124. package/src/interfaces/index.ts +23 -23
  125. package/src/providers/NormaProvider.tsx +13 -13
  126. package/src/sample-data-2.json +178 -178
  127. package/src/sample-data.json +177 -177
  128. package/src/stories/Accordion.stories.tsx +65 -65
  129. package/src/stories/Avatar.stories.tsx +123 -123
  130. package/src/stories/Badge.stories.tsx +39 -39
  131. package/src/stories/Box.stories.tsx +35 -35
  132. package/src/stories/Breadcrumb.stories.tsx +44 -44
  133. package/src/stories/Button.stories.tsx +93 -93
  134. package/src/stories/Card.stories.tsx +39 -39
  135. package/src/stories/ChatMessage.stories.tsx +84 -84
  136. package/src/stories/ChatMessageBalloon.stories.tsx +108 -108
  137. package/src/stories/CheckBox.stories.tsx +88 -88
  138. package/src/stories/DateInput.stories.tsx +51 -51
  139. package/src/stories/DatePicker.stories.tsx +50 -50
  140. package/src/stories/DropDown.stories.tsx +57 -57
  141. package/src/stories/IconButton.stories.tsx +78 -78
  142. package/src/stories/Modal.stories.tsx +246 -246
  143. package/src/stories/ModalStatus.stories.tsx +46 -46
  144. package/src/stories/MultiSelectInput.stories.tsx +90 -90
  145. package/src/stories/Paper.stories.tsx +53 -53
  146. package/src/stories/ProgressBar.stories.tsx +116 -116
  147. package/src/stories/RadioGroup.stories.tsx +87 -87
  148. package/src/stories/RangerSlider.stories.tsx +149 -149
  149. package/src/stories/Select.stories.tsx +100 -100
  150. package/src/stories/SelectInput.stories.tsx +78 -78
  151. package/src/stories/Table.stories.tsx +372 -372
  152. package/src/stories/Tabs.stories.tsx +61 -61
  153. package/src/stories/Tag.stories.tsx +56 -56
  154. package/src/stories/Text.stories.tsx +37 -37
  155. package/src/stories/TextField.stories.tsx +310 -310
  156. package/src/stories/TextInput.stories.tsx +52 -52
  157. package/src/stories/TimeLine.stories.tsx +35 -35
  158. package/src/stories/TimePicker.stories.tsx +87 -87
  159. package/src/stories/Title.stories.tsx +43 -43
  160. package/src/stories/UncontrolledTable.stories.tsx +315 -315
  161. package/src/stories/UncontrolledTabs.stories.tsx +74 -74
  162. package/src/styles/globals.scss +17 -17
  163. package/src/types/index.ts +207 -207
  164. package/src/utils/styledBreakpoints.ts +25 -25
  165. package/vite.config.ts +15 -15
@@ -1,61 +1,61 @@
1
- import React from 'react';
2
-
3
- import type { Meta, StoryObj } from '@storybook/react';
4
- import { Tabs } from '../components';
5
- import { DataTabs } from '../types';
6
- import { Typography } from '@mui/material';
7
-
8
- const data: DataTabs[] = [
9
- {
10
- label: 'Tab 1',
11
- id: 'panel-1',
12
- children: (
13
- <Typography>
14
- Tab 1 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet
15
- blandit leo lobortis eget.
16
- </Typography>
17
- ),
18
- },
19
- {
20
- label: 'Tab 2',
21
- id: 'panel-2',
22
- children: (
23
- <Typography>
24
- Tab 2 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet
25
- blandit leo lobortis eget.
26
- </Typography>
27
- ),
28
- },
29
- ];
30
-
31
- const meta = {
32
- title: 'Display/Tabs',
33
- component: Tabs,
34
- parameters: {
35
- layout: 'centered',
36
- },
37
- tags: ['autodocs'],
38
- argTypes: {
39
- data: data,
40
- },
41
- } satisfies Meta<typeof Tabs>;
42
-
43
- export default meta;
44
-
45
- type Story = StoryObj<typeof meta>;
46
-
47
- export const Playground: Story = {
48
- args: {
49
- data: data,
50
- },
51
- };
52
-
53
- export const TabsBasic = () => {
54
- return (
55
- <div style={{ width: '480px', marginBottom: 30 }}>
56
- <Tabs data={data} onChange={(e, value) => console.log(e, value)} />
57
- </div>
58
- );
59
- };
60
-
61
- TabsBasic.storyName = 'Tabs Basic';
1
+ import React from 'react';
2
+
3
+ import type { Meta, StoryObj } from '@storybook/react';
4
+ import { Tabs } from '../components';
5
+ import { DataTabs } from '../types';
6
+ import { Typography } from '@mui/material';
7
+
8
+ const data: DataTabs[] = [
9
+ {
10
+ label: 'Tab 1',
11
+ id: 'panel-1',
12
+ children: (
13
+ <Typography>
14
+ Tab 1 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet
15
+ blandit leo lobortis eget.
16
+ </Typography>
17
+ ),
18
+ },
19
+ {
20
+ label: 'Tab 2',
21
+ id: 'panel-2',
22
+ children: (
23
+ <Typography>
24
+ Tab 2 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet
25
+ blandit leo lobortis eget.
26
+ </Typography>
27
+ ),
28
+ },
29
+ ];
30
+
31
+ const meta = {
32
+ title: 'Display/Tabs',
33
+ component: Tabs,
34
+ parameters: {
35
+ layout: 'centered',
36
+ },
37
+ tags: ['autodocs'],
38
+ argTypes: {
39
+ data: data,
40
+ },
41
+ } satisfies Meta<typeof Tabs>;
42
+
43
+ export default meta;
44
+
45
+ type Story = StoryObj<typeof meta>;
46
+
47
+ export const Playground: Story = {
48
+ args: {
49
+ data: data,
50
+ },
51
+ };
52
+
53
+ export const TabsBasic = () => {
54
+ return (
55
+ <div style={{ width: '480px', marginBottom: 30 }}>
56
+ <Tabs data={data} onChange={(e, value) => console.log(e, value)} />
57
+ </div>
58
+ );
59
+ };
60
+
61
+ TabsBasic.storyName = 'Tabs Basic';
@@ -1,56 +1,56 @@
1
- import React from 'react';
2
-
3
- import type { Meta } from '@storybook/react';
4
- import { Tag } from '../components';
5
- import { ColorVariant, TextFieldSizeVariant } from '../types';
6
-
7
- const colors: ColorVariant[] = ['inherit', 'primary', 'secondary', 'success', 'error', 'info', 'warning'];
8
-
9
- const sizes: TextFieldSizeVariant[] = ['small', 'medium'];
10
-
11
- const meta = {
12
- title: 'Display/Tag',
13
- component: Tag,
14
- parameters: {
15
- layout: 'centered',
16
- },
17
- tags: ['autodocs'],
18
- argTypes: {},
19
- } satisfies Meta<typeof Tag>;
20
-
21
- export default meta;
22
-
23
- export const TagBasic = () => {
24
- return (
25
- <>
26
- <Tag label="Chip Filled" color="primary" style={{ margin: 5 }} />
27
- <Tag label="Chip Outlined" outlined style={{ margin: 5 }} />
28
- </>
29
- );
30
- };
31
-
32
- export const TagColors = () => {
33
- return (
34
- <>
35
- {colors.map((color, key) => (
36
- <div>
37
- <Tag label="Chip Filled" color={color} style={{ margin: 5 }} />
38
- <Tag label="Chip Outlined" color={color} outlined style={{ margin: 5 }} />
39
- </div>
40
- ))}
41
- </>
42
- );
43
- };
44
-
45
- export const TagSizes = () => {
46
- return (
47
- <>
48
- {sizes.map((size, key) => (
49
- <div>
50
- <Tag label="Chip Filled" size={size} style={{ margin: 5 }} />
51
- <Tag label="Chip Outlined" size={size} outlined={true} style={{ margin: 5 }} />
52
- </div>
53
- ))}
54
- </>
55
- );
56
- };
1
+ import React from 'react';
2
+
3
+ import type { Meta } from '@storybook/react';
4
+ import { Tag } from '../components';
5
+ import { ColorVariant, TextFieldSizeVariant } from '../types';
6
+
7
+ const colors: ColorVariant[] = ['inherit', 'primary', 'secondary', 'success', 'error', 'info', 'warning'];
8
+
9
+ const sizes: TextFieldSizeVariant[] = ['small', 'medium'];
10
+
11
+ const meta = {
12
+ title: 'Display/Tag',
13
+ component: Tag,
14
+ parameters: {
15
+ layout: 'centered',
16
+ },
17
+ tags: ['autodocs'],
18
+ argTypes: {},
19
+ } satisfies Meta<typeof Tag>;
20
+
21
+ export default meta;
22
+
23
+ export const TagBasic = () => {
24
+ return (
25
+ <>
26
+ <Tag label="Chip Filled" color="primary" style={{ margin: 5 }} />
27
+ <Tag label="Chip Outlined" outlined style={{ margin: 5 }} />
28
+ </>
29
+ );
30
+ };
31
+
32
+ export const TagColors = () => {
33
+ return (
34
+ <>
35
+ {colors.map((color, key) => (
36
+ <div>
37
+ <Tag label="Chip Filled" color={color} style={{ margin: 5 }} />
38
+ <Tag label="Chip Outlined" color={color} outlined style={{ margin: 5 }} />
39
+ </div>
40
+ ))}
41
+ </>
42
+ );
43
+ };
44
+
45
+ export const TagSizes = () => {
46
+ return (
47
+ <>
48
+ {sizes.map((size, key) => (
49
+ <div>
50
+ <Tag label="Chip Filled" size={size} style={{ margin: 5 }} />
51
+ <Tag label="Chip Outlined" size={size} outlined={true} style={{ margin: 5 }} />
52
+ </div>
53
+ ))}
54
+ </>
55
+ );
56
+ };
@@ -1,38 +1,38 @@
1
- import React from "react"
2
- import Text from '../components/Typography/Text';
3
-
4
- export default {
5
- title: 'Tipografia/Text',
6
- component: Text,
7
- tags: ['autodocs'],
8
- parameters: {
9
- layout: 'centered',
10
- },
11
- argTypes: {
12
- children: {
13
- description: 'Adiciona um children.'
14
- },
15
- className: {
16
- description: 'Adicione uma classe.',
17
- },
18
- size: {
19
- description: 'Adicione um tamanho.',
20
- options: ['small', 'medium', 'large'],
21
- control: { type: 'radio' }
22
- },
23
- type: {
24
- description: 'Adicione um tipo.',
25
- options: ['default', 'secondary', 'success', 'warning', 'danger', 'info'],
26
- control: { type: 'radio' }
27
- },
28
- }
29
- }
30
-
31
- export const Default = (args) => <Text {...args} />
32
-
33
- Default.args = {
34
- children: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry.',
35
- className: '',
36
- size: 'default',
37
- type: ''
1
+ import React from "react"
2
+ import Text from '../components/Typography/Text';
3
+
4
+ export default {
5
+ title: 'Tipografia/Text',
6
+ component: Text,
7
+ tags: ['autodocs'],
8
+ parameters: {
9
+ layout: 'centered',
10
+ },
11
+ argTypes: {
12
+ children: {
13
+ description: 'Adiciona um children.'
14
+ },
15
+ className: {
16
+ description: 'Adicione uma classe.',
17
+ },
18
+ size: {
19
+ description: 'Adicione um tamanho.',
20
+ options: ['small', 'medium', 'large'],
21
+ control: { type: 'radio' }
22
+ },
23
+ type: {
24
+ description: 'Adicione um tipo.',
25
+ options: ['default', 'secondary', 'success', 'warning', 'danger', 'info'],
26
+ control: { type: 'radio' }
27
+ },
28
+ }
29
+ }
30
+
31
+ export const Default = (args) => <Text {...args} />
32
+
33
+ Default.args = {
34
+ children: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry.',
35
+ className: '',
36
+ size: 'default',
37
+ type: ''
38
38
  }