norma-library 0.6.2 → 0.6.4

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 (169) 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/UncontrolledTable/components/header/index.js +3 -1
  9. package/dist/esm/components/UncontrolledTable/components/header/index.js.map +1 -1
  10. package/dist/esm/components/UncontrolledTable/components/header/styles.js +1 -1
  11. package/dist/esm/components/UncontrolledTable/components/header/styles.js.map +1 -1
  12. package/dist/esm/components/UncontrolledTable/index.js +1 -1
  13. package/dist/esm/components/UncontrolledTable/index.js.map +1 -1
  14. package/dist/esm/components/UncontrolledTable/interface.d.ts +2 -0
  15. package/docs/index.md +118 -118
  16. package/package.json +136 -136
  17. package/src/components/Accordion.tsx +39 -39
  18. package/src/components/Avatar.tsx +17 -17
  19. package/src/components/Badge.tsx +14 -14
  20. package/src/components/Box/index.tsx +12 -12
  21. package/src/components/Box/interfaces.ts +3 -3
  22. package/src/components/Box/styles.tsx +22 -22
  23. package/src/components/Breadcrumb/index.tsx +27 -27
  24. package/src/components/Breadcrumb/interface.ts +8 -8
  25. package/src/components/Breadcrumb/styles.tsx +32 -32
  26. package/src/components/Button.tsx +26 -26
  27. package/src/components/Card.tsx +37 -37
  28. package/src/components/ChatMessage.tsx +87 -87
  29. package/src/components/ChatMessageBalloon/ChatMessageBalloon.style.ts +56 -56
  30. package/src/components/ChatMessageBalloon/ChatMessageBalloon.tsx +55 -55
  31. package/src/components/CheckBox.tsx +21 -21
  32. package/src/components/DateInput/index.tsx +34 -34
  33. package/src/components/DateInput/interface.ts +13 -13
  34. package/src/components/DateInput/styles.tsx +27 -27
  35. package/src/components/DatePicker.tsx +67 -67
  36. package/src/components/DropDown.tsx +24 -24
  37. package/src/components/IconButton.tsx +37 -37
  38. package/src/components/Icons.tsx +82 -82
  39. package/src/components/Modal.tsx +103 -103
  40. package/src/components/MultiSelectInput/components/MultiValue/index.tsx +44 -44
  41. package/src/components/MultiSelectInput/components/Option/index.tsx +62 -62
  42. package/src/components/MultiSelectInput/components/Option/styles.tsx +8 -8
  43. package/src/components/MultiSelectInput/index.tsx +60 -60
  44. package/src/components/MultiSelectInput/interfaces.ts +15 -15
  45. package/src/components/MultiSelectInput/styles.tsx +43 -43
  46. package/src/components/Paper.tsx +12 -12
  47. package/src/components/ProgressBar.tsx +71 -71
  48. package/src/components/RadioGroup.tsx +43 -43
  49. package/src/components/RangerSlider.tsx +65 -65
  50. package/src/components/Select.tsx +74 -74
  51. package/src/components/SelectInput/components/Option/index.tsx +61 -61
  52. package/src/components/SelectInput/components/Option/styles.tsx +8 -8
  53. package/src/components/SelectInput/index.tsx +45 -45
  54. package/src/components/SelectInput/interfaces.ts +15 -15
  55. package/src/components/SelectInput/styles.tsx +31 -31
  56. package/src/components/StatusModal/StatusModal.style.tsx +75 -75
  57. package/src/components/StatusModal/StatusModal.tsx +58 -58
  58. package/src/components/Svgs.tsx +506 -506
  59. package/src/components/Table/components/header/index.tsx +86 -86
  60. package/src/components/Table/components/header/styles.tsx +59 -59
  61. package/src/components/Table/components/index.tsx +8 -8
  62. package/src/components/Table/components/pagination/index.tsx +39 -39
  63. package/src/components/Table/components/pagination/styles.tsx +28 -28
  64. package/src/components/Table/components/tbody/index.tsx +30 -30
  65. package/src/components/Table/components/tbody/styles.tsx +4 -4
  66. package/src/components/Table/index.tsx +317 -317
  67. package/src/components/Table/interface.ts +23 -23
  68. package/src/components/Table/styles.tsx +117 -117
  69. package/src/components/Tabs.tsx +105 -105
  70. package/src/components/Tag.tsx +33 -33
  71. package/src/components/TextField.tsx +19 -19
  72. package/src/components/TextInput/index.tsx +37 -37
  73. package/src/components/TextInput/interface.ts +9 -9
  74. package/src/components/TextInput/styles.tsx +23 -23
  75. package/src/components/TimeLine.tsx +89 -89
  76. package/src/components/TimePicker.tsx +78 -78
  77. package/src/components/Typography/Text/index.tsx +20 -20
  78. package/src/components/Typography/Text/interfaces.ts +5 -5
  79. package/src/components/Typography/Text/styles.tsx +40 -40
  80. package/src/components/Typography/Title/index.tsx +22 -22
  81. package/src/components/Typography/Title/interfaces.ts +6 -6
  82. package/src/components/Typography/Title/styles.tsx +40 -40
  83. package/src/components/Typography/index.tsx +6 -6
  84. package/src/components/UncontrolledTable/components/header/index.tsx +72 -65
  85. package/src/components/UncontrolledTable/components/header/styles.tsx +65 -63
  86. package/src/components/UncontrolledTable/components/index.tsx +8 -8
  87. package/src/components/UncontrolledTable/components/pagination/index.tsx +43 -43
  88. package/src/components/UncontrolledTable/components/pagination/styles.tsx +28 -28
  89. package/src/components/UncontrolledTable/components/tbody/index.tsx +33 -33
  90. package/src/components/UncontrolledTable/components/tbody/styles.tsx +32 -32
  91. package/src/components/UncontrolledTable/index.tsx +222 -221
  92. package/src/components/UncontrolledTable/interface.ts +44 -43
  93. package/src/components/UncontrolledTable/styles.tsx +123 -123
  94. package/src/components/UncontrolledTabs/UncontrolledTabs.style.tsx +56 -56
  95. package/src/components/UncontrolledTabs/UncontrolledTabs.tsx +68 -68
  96. package/src/components/index.ts +24 -24
  97. package/src/helpers/alignments.ts +14 -14
  98. package/src/helpers/borders.ts +18 -18
  99. package/src/helpers/colors.ts +258 -258
  100. package/src/helpers/index.ts +5 -5
  101. package/src/helpers/radios.ts +24 -24
  102. package/src/helpers/sizes.ts +72 -72
  103. package/src/hooks/useClickOutside.tsx +18 -18
  104. package/src/index.ts +70 -70
  105. package/src/interfaces/Accordion.ts +12 -12
  106. package/src/interfaces/Avatar.tsx +15 -15
  107. package/src/interfaces/Badge.ts +19 -19
  108. package/src/interfaces/Button.ts +22 -22
  109. package/src/interfaces/Card.ts +11 -11
  110. package/src/interfaces/ChatMessage.ts +12 -12
  111. package/src/interfaces/ChatMessageBalloon.ts +17 -17
  112. package/src/interfaces/CheckBox.ts +27 -27
  113. package/src/interfaces/DatePicker.ts +13 -13
  114. package/src/interfaces/DropDown.ts +14 -14
  115. package/src/interfaces/IconButton.ts +22 -22
  116. package/src/interfaces/Icons.ts +17 -17
  117. package/src/interfaces/Modal.ts +18 -18
  118. package/src/interfaces/Paper.ts +12 -12
  119. package/src/interfaces/ProgressBar.ts +29 -29
  120. package/src/interfaces/RadioGroup.ts +23 -23
  121. package/src/interfaces/RangerSlider.ts +21 -21
  122. package/src/interfaces/Select.ts +17 -17
  123. package/src/interfaces/Tabs.ts +19 -19
  124. package/src/interfaces/Tag.ts +17 -17
  125. package/src/interfaces/TextField.ts +44 -44
  126. package/src/interfaces/TimeLine.ts +11 -11
  127. package/src/interfaces/TimePicker.ts +13 -13
  128. package/src/interfaces/index.ts +23 -23
  129. package/src/providers/NormaProvider.tsx +13 -13
  130. package/src/sample-data-2.json +178 -178
  131. package/src/sample-data.json +177 -177
  132. package/src/stories/Accordion.stories.tsx +65 -65
  133. package/src/stories/Avatar.stories.tsx +123 -123
  134. package/src/stories/Badge.stories.tsx +39 -39
  135. package/src/stories/Box.stories.tsx +35 -35
  136. package/src/stories/Breadcrumb.stories.tsx +44 -44
  137. package/src/stories/Button.stories.tsx +93 -93
  138. package/src/stories/Card.stories.tsx +39 -39
  139. package/src/stories/ChatMessage.stories.tsx +84 -84
  140. package/src/stories/ChatMessageBalloon.stories.tsx +108 -108
  141. package/src/stories/CheckBox.stories.tsx +88 -88
  142. package/src/stories/DateInput.stories.tsx +51 -51
  143. package/src/stories/DatePicker.stories.tsx +50 -50
  144. package/src/stories/DropDown.stories.tsx +57 -57
  145. package/src/stories/IconButton.stories.tsx +78 -78
  146. package/src/stories/Modal.stories.tsx +246 -246
  147. package/src/stories/ModalStatus.stories.tsx +46 -46
  148. package/src/stories/MultiSelectInput.stories.tsx +90 -90
  149. package/src/stories/Paper.stories.tsx +53 -53
  150. package/src/stories/ProgressBar.stories.tsx +116 -116
  151. package/src/stories/RadioGroup.stories.tsx +87 -87
  152. package/src/stories/RangerSlider.stories.tsx +149 -149
  153. package/src/stories/Select.stories.tsx +100 -100
  154. package/src/stories/SelectInput.stories.tsx +78 -78
  155. package/src/stories/Table.stories.tsx +372 -372
  156. package/src/stories/Tabs.stories.tsx +61 -61
  157. package/src/stories/Tag.stories.tsx +56 -56
  158. package/src/stories/Text.stories.tsx +37 -37
  159. package/src/stories/TextField.stories.tsx +310 -310
  160. package/src/stories/TextInput.stories.tsx +52 -52
  161. package/src/stories/TimeLine.stories.tsx +35 -35
  162. package/src/stories/TimePicker.stories.tsx +87 -87
  163. package/src/stories/Title.stories.tsx +43 -43
  164. package/src/stories/UncontrolledTable.stories.tsx +315 -305
  165. package/src/stories/UncontrolledTabs.stories.tsx +63 -63
  166. package/src/styles/globals.scss +17 -17
  167. package/src/types/index.ts +207 -207
  168. package/src/utils/styledBreakpoints.ts +25 -25
  169. package/vite.config.ts +15 -15
package/src/sample-data.json CHANGED
@@ -1,177 +1,177 @@
1
- [
2
- {
3
- "columns": [
4
- {
5
- "allowFiltering": true,
6
- "allowSorting": true,
7
- "field": "data",
8
- "format": "date",
9
- "headerText": "Data",
10
- "textAlign": "left",
11
- "width": "100%"
12
- },
13
- {
14
- "allowFiltering": true,
15
- "allowSorting": true,
16
- "field": "duration",
17
- "format": "time",
18
- "headerText": "Duração",
19
- "textAlign": "left",
20
- "width": "100%"
21
- },
22
- {
23
- "allowFiltering": true,
24
- "allowSorting": true,
25
- "field": "campanha",
26
- "format": "string",
27
- "headerText": "Campanha",
28
- "textAlign": "left",
29
- "width": "100%"
30
- },
31
- {
32
- "allowFiltering": true,
33
- "allowSorting": true,
34
- "field": "agente",
35
- "format": "string",
36
- "headerText": "Agente",
37
- "textAlign": "center",
38
- "width": "100%"
39
- },
40
- {
41
- "allowFiltering": true,
42
- "allowSorting": true,
43
- "field": "ani",
44
- "format": "number",
45
- "headerText": "ANI",
46
- "textAlign": "left",
47
- "width": "100%"
48
- },
49
- {
50
- "allowFiltering": true,
51
- "allowSorting": true,
52
- "field": "dnis",
53
- "format": "number",
54
- "headerText": "DNIS",
55
- "textAlign": "left",
56
- "width": "100%"
57
- },
58
- {
59
- "allowFiltering": true,
60
- "allowSorting": true,
61
- "field": "disposition",
62
- "format": "string",
63
- "headerText": "Tabulação",
64
- "textAlign": "left",
65
- "width": "100%"
66
- },
67
- {
68
- "allowFiltering": true,
69
- "allowSorting": true,
70
- "field": "origin",
71
- "format": "string",
72
- "headerText": "Origem",
73
- "textAlign": "left",
74
- "width": "100%"
75
- },
76
- {
77
- "allowFiltering": true,
78
- "allowSorting": true,
79
- "field": "id",
80
- "format": "number",
81
- "headerText": "ID",
82
- "textAlign": "left",
83
- "width": "100%"
84
- }
85
- ],
86
- "dataSource": [
87
- {
88
- "data": "01/05/2022",
89
- "duration": "08:18",
90
- "campanha": "Campanha 1",
91
- "agente": 16321,
92
- "ani": 50364908,
93
- "dnis": 123456,
94
- "disposition": "Tabulação 1",
95
- "origin": 12723,
96
- "id": 1
97
- },
98
- {
99
- "data": "01/05/2022",
100
- "duration": "00:18",
101
- "campanha": "Campanha 2",
102
- "agente": "16322",
103
- "ani": "50364909",
104
- "dnis": "123457",
105
- "disposition": "Tabulação 2",
106
- "origin": "12721",
107
- "id": 2
108
- },
109
- {
110
- "data": "03/05/2022",
111
- "duration": "03:13",
112
- "campanha": "Campanha 1",
113
- "agente": "16321",
114
- "ani": "50364908",
115
- "dnis": "123456",
116
- "disposition": "Tabulação 1",
117
- "origin": "12723",
118
- "id": 3
119
- },
120
- {
121
- "data": "01/05/2022",
122
- "duration": "09:19",
123
- "campanha": "Campanha 1",
124
- "agente": "16321",
125
- "ani": "50364908",
126
- "dnis": "123456",
127
- "disposition": "Tabulação 1",
128
- "origin": "12723",
129
- "id": 4
130
- },
131
- {
132
- "data": "02/05/2022",
133
- "duration": "02:59",
134
- "campanha": "Campanha 1",
135
- "agente": "16321",
136
- "ani": "50364908",
137
- "dnis": "123456",
138
- "disposition": "Tabulação 1",
139
- "origin": "12723",
140
- "id": 5
141
- },
142
- {
143
- "data": "04/05/2022",
144
- "duration": "05:02",
145
- "campanha": "Campanha 1",
146
- "agente": "16321",
147
- "ani": "50364908",
148
- "dnis": "123456",
149
- "disposition": "Tabulação 1",
150
- "origin": "12723",
151
- "id": 6
152
- },
153
- {
154
- "data": "21/05/2022",
155
- "duration": "06:02",
156
- "campanha": "Campanha 7",
157
- "agente": "16315",
158
- "ani": "50364909",
159
- "dnis": "123456",
160
- "disposition": "Tabulação 7",
161
- "origin": "12754",
162
- "id": 7
163
- },
164
- {
165
- "data": "23/05/2022",
166
- "duration": "04:04",
167
- "campanha": "Campanha 8",
168
- "agente": "16321",
169
- "ani": "50364908",
170
- "dnis": "123456",
171
- "disposition": "Tabulação 8",
172
- "origin": "12752",
173
- "id": 8
174
- }
175
- ]
176
- }
177
- ]
1
+ [
2
+ {
3
+ "columns": [
4
+ {
5
+ "allowFiltering": true,
6
+ "allowSorting": true,
7
+ "field": "data",
8
+ "format": "date",
9
+ "headerText": "Data",
10
+ "textAlign": "left",
11
+ "width": "100%"
12
+ },
13
+ {
14
+ "allowFiltering": true,
15
+ "allowSorting": true,
16
+ "field": "duration",
17
+ "format": "time",
18
+ "headerText": "Duração",
19
+ "textAlign": "left",
20
+ "width": "100%"
21
+ },
22
+ {
23
+ "allowFiltering": true,
24
+ "allowSorting": true,
25
+ "field": "campanha",
26
+ "format": "string",
27
+ "headerText": "Campanha",
28
+ "textAlign": "left",
29
+ "width": "100%"
30
+ },
31
+ {
32
+ "allowFiltering": true,
33
+ "allowSorting": true,
34
+ "field": "agente",
35
+ "format": "string",
36
+ "headerText": "Agente",
37
+ "textAlign": "center",
38
+ "width": "100%"
39
+ },
40
+ {
41
+ "allowFiltering": true,
42
+ "allowSorting": true,
43
+ "field": "ani",
44
+ "format": "number",
45
+ "headerText": "ANI",
46
+ "textAlign": "left",
47
+ "width": "100%"
48
+ },
49
+ {
50
+ "allowFiltering": true,
51
+ "allowSorting": true,
52
+ "field": "dnis",
53
+ "format": "number",
54
+ "headerText": "DNIS",
55
+ "textAlign": "left",
56
+ "width": "100%"
57
+ },
58
+ {
59
+ "allowFiltering": true,
60
+ "allowSorting": true,
61
+ "field": "disposition",
62
+ "format": "string",
63
+ "headerText": "Tabulação",
64
+ "textAlign": "left",
65
+ "width": "100%"
66
+ },
67
+ {
68
+ "allowFiltering": true,
69
+ "allowSorting": true,
70
+ "field": "origin",
71
+ "format": "string",
72
+ "headerText": "Origem",
73
+ "textAlign": "left",
74
+ "width": "100%"
75
+ },
76
+ {
77
+ "allowFiltering": true,
78
+ "allowSorting": true,
79
+ "field": "id",
80
+ "format": "number",
81
+ "headerText": "ID",
82
+ "textAlign": "left",
83
+ "width": "100%"
84
+ }
85
+ ],
86
+ "dataSource": [
87
+ {
88
+ "data": "01/05/2022",
89
+ "duration": "08:18",
90
+ "campanha": "Campanha 1",
91
+ "agente": 16321,
92
+ "ani": 50364908,
93
+ "dnis": 123456,
94
+ "disposition": "Tabulação 1",
95
+ "origin": 12723,
96
+ "id": 1
97
+ },
98
+ {
99
+ "data": "01/05/2022",
100
+ "duration": "00:18",
101
+ "campanha": "Campanha 2",
102
+ "agente": "16322",
103
+ "ani": "50364909",
104
+ "dnis": "123457",
105
+ "disposition": "Tabulação 2",
106
+ "origin": "12721",
107
+ "id": 2
108
+ },
109
+ {
110
+ "data": "03/05/2022",
111
+ "duration": "03:13",
112
+ "campanha": "Campanha 1",
113
+ "agente": "16321",
114
+ "ani": "50364908",
115
+ "dnis": "123456",
116
+ "disposition": "Tabulação 1",
117
+ "origin": "12723",
118
+ "id": 3
119
+ },
120
+ {
121
+ "data": "01/05/2022",
122
+ "duration": "09:19",
123
+ "campanha": "Campanha 1",
124
+ "agente": "16321",
125
+ "ani": "50364908",
126
+ "dnis": "123456",
127
+ "disposition": "Tabulação 1",
128
+ "origin": "12723",
129
+ "id": 4
130
+ },
131
+ {
132
+ "data": "02/05/2022",
133
+ "duration": "02:59",
134
+ "campanha": "Campanha 1",
135
+ "agente": "16321",
136
+ "ani": "50364908",
137
+ "dnis": "123456",
138
+ "disposition": "Tabulação 1",
139
+ "origin": "12723",
140
+ "id": 5
141
+ },
142
+ {
143
+ "data": "04/05/2022",
144
+ "duration": "05:02",
145
+ "campanha": "Campanha 1",
146
+ "agente": "16321",
147
+ "ani": "50364908",
148
+ "dnis": "123456",
149
+ "disposition": "Tabulação 1",
150
+ "origin": "12723",
151
+ "id": 6
152
+ },
153
+ {
154
+ "data": "21/05/2022",
155
+ "duration": "06:02",
156
+ "campanha": "Campanha 7",
157
+ "agente": "16315",
158
+ "ani": "50364909",
159
+ "dnis": "123456",
160
+ "disposition": "Tabulação 7",
161
+ "origin": "12754",
162
+ "id": 7
163
+ },
164
+ {
165
+ "data": "23/05/2022",
166
+ "duration": "04:04",
167
+ "campanha": "Campanha 8",
168
+ "agente": "16321",
169
+ "ani": "50364908",
170
+ "dnis": "123456",
171
+ "disposition": "Tabulação 8",
172
+ "origin": "12752",
173
+ "id": 8
174
+ }
175
+ ]
176
+ }
177
+ ]
package/src/stories/Accordion.stories.tsx CHANGED
@@ -1,65 +1,65 @@
1
- import React from 'react';
2
-
3
- import type { Meta, StoryObj } from '@storybook/react';
4
- import { Accordion } from '../components';
5
- import { DataAccordion } from '../types';
6
- import { Typography } from '@mui/material';
7
-
8
- const data: DataAccordion[] = [
9
- {
10
- label: 'Accordion 1',
11
- id: 'panel-1',
12
- children: (
13
- <Typography>
14
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit leo
15
- lobortis eget.
16
- </Typography>
17
- ),
18
- },
19
- {
20
- label: 'Accordion 2',
21
- id: 'panel-2',
22
- children: (
23
- <Typography>
24
- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit leo
25
- lobortis eget.
26
- </Typography>
27
- ),
28
- },
29
- ];
30
-
31
- const meta = {
32
- title: 'Display/Accordion',
33
- component: Accordion,
34
- parameters: {
35
- layout: 'centered',
36
- },
37
- tags: ['autodocs'],
38
- argTypes: {
39
- data: data,
40
- },
41
- } satisfies Meta<typeof Accordion>;
42
-
43
- export default meta;
44
-
45
- type Story = StoryObj<typeof meta>;
46
-
47
- export const AccordionBasic = () => {
48
- return (
49
- <div style={{ width: '480px', marginBottom: 30 }}>
50
- <Accordion data={data} />
51
- </div>
52
- );
53
- };
54
-
55
- AccordionBasic.storyName = 'Accordion Basic';
56
-
57
- export const AccordionExpanded = () => {
58
- return (
59
- <div style={{ width: '480px', marginBottom: 30 }}>
60
- <Accordion data={data} defaultExpanded="panel-1" />
61
- </div>
62
- );
63
- };
64
-
65
- AccordionExpanded.storyName = 'Accordion Expanded';
1
+ import React from 'react';
2
+
3
+ import type { Meta, StoryObj } from '@storybook/react';
4
+ import { Accordion } from '../components';
5
+ import { DataAccordion } from '../types';
6
+ import { Typography } from '@mui/material';
7
+
8
+ const data: DataAccordion[] = [
9
+ {
10
+ label: 'Accordion 1',
11
+ id: 'panel-1',
12
+ children: (
13
+ <Typography>
14
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit leo
15
+ lobortis eget.
16
+ </Typography>
17
+ ),
18
+ },
19
+ {
20
+ label: 'Accordion 2',
21
+ id: 'panel-2',
22
+ children: (
23
+ <Typography>
24
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse malesuada lacus ex, sit amet blandit leo
25
+ lobortis eget.
26
+ </Typography>
27
+ ),
28
+ },
29
+ ];
30
+
31
+ const meta = {
32
+ title: 'Display/Accordion',
33
+ component: Accordion,
34
+ parameters: {
35
+ layout: 'centered',
36
+ },
37
+ tags: ['autodocs'],
38
+ argTypes: {
39
+ data: data,
40
+ },
41
+ } satisfies Meta<typeof Accordion>;
42
+
43
+ export default meta;
44
+
45
+ type Story = StoryObj<typeof meta>;
46
+
47
+ export const AccordionBasic = () => {
48
+ return (
49
+ <div style={{ width: '480px', marginBottom: 30 }}>
50
+ <Accordion data={data} />
51
+ </div>
52
+ );
53
+ };
54
+
55
+ AccordionBasic.storyName = 'Accordion Basic';
56
+
57
+ export const AccordionExpanded = () => {
58
+ return (
59
+ <div style={{ width: '480px', marginBottom: 30 }}>
60
+ <Accordion data={data} defaultExpanded="panel-1" />
61
+ </div>
62
+ );
63
+ };
64
+
65
+ AccordionExpanded.storyName = 'Accordion Expanded';