norma-library 0.6.6 → 0.6.61

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 (166) 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/helpers/colors.d.ts +72 -0
  9. package/dist/esm/helpers/colors.js +66 -27
  10. package/dist/esm/helpers/colors.js.map +1 -1
  11. package/docs/index.md +118 -118
  12. package/package.json +136 -136
  13. package/src/components/Accordion.tsx +39 -39
  14. package/src/components/Avatar.tsx +17 -17
  15. package/src/components/Badge.tsx +14 -14
  16. package/src/components/Box/index.tsx +12 -12
  17. package/src/components/Box/interfaces.ts +3 -3
  18. package/src/components/Box/styles.tsx +22 -22
  19. package/src/components/Breadcrumb/index.tsx +27 -27
  20. package/src/components/Breadcrumb/interface.ts +8 -8
  21. package/src/components/Breadcrumb/styles.tsx +32 -32
  22. package/src/components/Button.tsx +26 -26
  23. package/src/components/Card.tsx +37 -37
  24. package/src/components/ChatMessage.tsx +87 -87
  25. package/src/components/ChatMessageBalloon/ChatMessageBalloon.style.ts +56 -56
  26. package/src/components/ChatMessageBalloon/ChatMessageBalloon.tsx +55 -55
  27. package/src/components/CheckBox.tsx +21 -21
  28. package/src/components/DateInput/index.tsx +34 -34
  29. package/src/components/DateInput/interface.ts +13 -13
  30. package/src/components/DateInput/styles.tsx +27 -27
  31. package/src/components/DatePicker.tsx +67 -67
  32. package/src/components/DropDown.tsx +24 -24
  33. package/src/components/IconButton.tsx +37 -37
  34. package/src/components/Icons.tsx +82 -82
  35. package/src/components/Modal.tsx +103 -103
  36. package/src/components/MultiSelectInput/components/MultiValue/index.tsx +44 -44
  37. package/src/components/MultiSelectInput/components/Option/index.tsx +62 -62
  38. package/src/components/MultiSelectInput/components/Option/styles.tsx +8 -8
  39. package/src/components/MultiSelectInput/index.tsx +60 -60
  40. package/src/components/MultiSelectInput/interfaces.ts +15 -15
  41. package/src/components/MultiSelectInput/styles.tsx +43 -43
  42. package/src/components/Paper.tsx +12 -12
  43. package/src/components/ProgressBar.tsx +71 -71
  44. package/src/components/RadioGroup.tsx +43 -43
  45. package/src/components/RangerSlider.tsx +65 -65
  46. package/src/components/Select.tsx +74 -74
  47. package/src/components/SelectInput/components/Option/index.tsx +61 -61
  48. package/src/components/SelectInput/components/Option/styles.tsx +8 -8
  49. package/src/components/SelectInput/index.tsx +45 -45
  50. package/src/components/SelectInput/interfaces.ts +15 -15
  51. package/src/components/SelectInput/styles.tsx +31 -31
  52. package/src/components/StatusModal/StatusModal.style.tsx +75 -75
  53. package/src/components/StatusModal/StatusModal.tsx +58 -58
  54. package/src/components/Svgs.tsx +506 -506
  55. package/src/components/Table/components/header/index.tsx +86 -86
  56. package/src/components/Table/components/header/styles.tsx +59 -59
  57. package/src/components/Table/components/index.tsx +8 -8
  58. package/src/components/Table/components/pagination/index.tsx +39 -39
  59. package/src/components/Table/components/pagination/styles.tsx +28 -28
  60. package/src/components/Table/components/tbody/index.tsx +30 -30
  61. package/src/components/Table/components/tbody/styles.tsx +4 -4
  62. package/src/components/Table/index.tsx +317 -317
  63. package/src/components/Table/interface.ts +23 -23
  64. package/src/components/Table/styles.tsx +117 -117
  65. package/src/components/Tabs.tsx +105 -105
  66. package/src/components/Tag.tsx +33 -33
  67. package/src/components/TextField.tsx +19 -19
  68. package/src/components/TextInput/index.tsx +37 -37
  69. package/src/components/TextInput/interface.ts +9 -9
  70. package/src/components/TextInput/styles.tsx +23 -23
  71. package/src/components/TimeLine.tsx +89 -89
  72. package/src/components/TimePicker.tsx +78 -78
  73. package/src/components/Typography/Text/index.tsx +20 -20
  74. package/src/components/Typography/Text/interfaces.ts +5 -5
  75. package/src/components/Typography/Text/styles.tsx +40 -40
  76. package/src/components/Typography/Title/index.tsx +22 -22
  77. package/src/components/Typography/Title/interfaces.ts +6 -6
  78. package/src/components/Typography/Title/styles.tsx +40 -40
  79. package/src/components/Typography/index.tsx +6 -6
  80. package/src/components/UncontrolledTable/components/header/index.tsx +72 -72
  81. package/src/components/UncontrolledTable/components/header/styles.tsx +66 -66
  82. package/src/components/UncontrolledTable/components/index.tsx +8 -8
  83. package/src/components/UncontrolledTable/components/pagination/index.tsx +43 -43
  84. package/src/components/UncontrolledTable/components/pagination/styles.tsx +28 -28
  85. package/src/components/UncontrolledTable/components/tbody/index.tsx +33 -33
  86. package/src/components/UncontrolledTable/components/tbody/styles.tsx +32 -32
  87. package/src/components/UncontrolledTable/index.tsx +223 -223
  88. package/src/components/UncontrolledTable/interface.ts +46 -46
  89. package/src/components/UncontrolledTable/styles.tsx +123 -123
  90. package/src/components/UncontrolledTabs/UncontrolledTabs.style.tsx +58 -58
  91. package/src/components/UncontrolledTabs/UncontrolledTabs.tsx +71 -71
  92. package/src/components/UncontrolledTabs/UncontrolledTabsInfo.style.ts +8 -8
  93. package/src/components/index.ts +24 -24
  94. package/src/helpers/alignments.ts +14 -14
  95. package/src/helpers/borders.ts +18 -18
  96. package/src/helpers/colors.ts +298 -258
  97. package/src/helpers/index.ts +5 -5
  98. package/src/helpers/radios.ts +24 -24
  99. package/src/helpers/sizes.ts +72 -72
  100. package/src/hooks/useClickOutside.tsx +18 -18
  101. package/src/index.ts +70 -70
  102. package/src/interfaces/Accordion.ts +12 -12
  103. package/src/interfaces/Avatar.tsx +15 -15
  104. package/src/interfaces/Badge.ts +19 -19
  105. package/src/interfaces/Button.ts +22 -22
  106. package/src/interfaces/Card.ts +11 -11
  107. package/src/interfaces/ChatMessage.ts +12 -12
  108. package/src/interfaces/ChatMessageBalloon.ts +17 -17
  109. package/src/interfaces/CheckBox.ts +27 -27
  110. package/src/interfaces/DatePicker.ts +13 -13
  111. package/src/interfaces/DropDown.ts +14 -14
  112. package/src/interfaces/IconButton.ts +22 -22
  113. package/src/interfaces/Icons.ts +17 -17
  114. package/src/interfaces/Modal.ts +18 -18
  115. package/src/interfaces/Paper.ts +12 -12
  116. package/src/interfaces/ProgressBar.ts +29 -29
  117. package/src/interfaces/RadioGroup.ts +23 -23
  118. package/src/interfaces/RangerSlider.ts +21 -21
  119. package/src/interfaces/Select.ts +17 -17
  120. package/src/interfaces/Tabs.ts +19 -19
  121. package/src/interfaces/Tag.ts +17 -17
  122. package/src/interfaces/TextField.ts +44 -44
  123. package/src/interfaces/TimeLine.ts +11 -11
  124. package/src/interfaces/TimePicker.ts +13 -13
  125. package/src/interfaces/index.ts +23 -23
  126. package/src/providers/NormaProvider.tsx +13 -13
  127. package/src/sample-data-2.json +178 -178
  128. package/src/sample-data.json +177 -177
  129. package/src/stories/Accordion.stories.tsx +65 -65
  130. package/src/stories/Avatar.stories.tsx +123 -123
  131. package/src/stories/Badge.stories.tsx +39 -39
  132. package/src/stories/Box.stories.tsx +35 -35
  133. package/src/stories/Breadcrumb.stories.tsx +44 -44
  134. package/src/stories/Button.stories.tsx +93 -93
  135. package/src/stories/Card.stories.tsx +39 -39
  136. package/src/stories/ChatMessage.stories.tsx +84 -84
  137. package/src/stories/ChatMessageBalloon.stories.tsx +108 -108
  138. package/src/stories/CheckBox.stories.tsx +88 -88
  139. package/src/stories/DateInput.stories.tsx +51 -51
  140. package/src/stories/DatePicker.stories.tsx +50 -50
  141. package/src/stories/DropDown.stories.tsx +57 -57
  142. package/src/stories/IconButton.stories.tsx +78 -78
  143. package/src/stories/Modal.stories.tsx +246 -246
  144. package/src/stories/ModalStatus.stories.tsx +46 -46
  145. package/src/stories/MultiSelectInput.stories.tsx +90 -90
  146. package/src/stories/Paper.stories.tsx +53 -53
  147. package/src/stories/ProgressBar.stories.tsx +116 -116
  148. package/src/stories/RadioGroup.stories.tsx +87 -87
  149. package/src/stories/RangerSlider.stories.tsx +149 -149
  150. package/src/stories/Select.stories.tsx +100 -100
  151. package/src/stories/SelectInput.stories.tsx +78 -78
  152. package/src/stories/Table.stories.tsx +372 -372
  153. package/src/stories/Tabs.stories.tsx +61 -61
  154. package/src/stories/Tag.stories.tsx +56 -56
  155. package/src/stories/Text.stories.tsx +37 -37
  156. package/src/stories/TextField.stories.tsx +310 -310
  157. package/src/stories/TextInput.stories.tsx +52 -52
  158. package/src/stories/TimeLine.stories.tsx +35 -35
  159. package/src/stories/TimePicker.stories.tsx +87 -87
  160. package/src/stories/Title.stories.tsx +43 -43
  161. package/src/stories/UncontrolledTable.stories.tsx +315 -315
  162. package/src/stories/UncontrolledTabs.stories.tsx +74 -74
  163. package/src/styles/globals.scss +17 -17
  164. package/src/types/index.ts +207 -207
  165. package/src/utils/styledBreakpoints.ts +25 -25
  166. 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
  }