@entur/expand 3.3.27 → 3.3.29
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.
- package/CHANGELOG.md +466 -0
- package/dist/expand.cjs.development.js +68 -45
- package/dist/expand.cjs.development.js.map +1 -1
- package/dist/expand.cjs.production.min.js +1 -1
- package/dist/expand.cjs.production.min.js.map +1 -1
- package/dist/expand.esm.js +68 -45
- package/dist/expand.esm.js.map +1 -1
- package/dist/styles.css +1 -0
- package/package.json +11 -16
package/CHANGELOG.md
ADDED
|
@@ -0,0 +1,466 @@
|
|
|
1
|
+
# Change Log
|
|
2
|
+
|
|
3
|
+
All notable changes to this project will be documented in this file.
|
|
4
|
+
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
|
+
|
|
6
|
+
## [3.3.29](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.28...@entur/expand@3.3.29) (2023-01-19)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @entur/expand
|
|
9
|
+
|
|
10
|
+
## [3.3.28](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.25...@entur/expand@3.3.28) (2022-12-09)
|
|
11
|
+
|
|
12
|
+
**Note:** Version bump only for package @entur/expand
|
|
13
|
+
|
|
14
|
+
## [3.3.27](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.26...@entur/expand@3.3.27) (2022-11-24)
|
|
15
|
+
|
|
16
|
+
**Note:** Version bump only for package @entur/expand
|
|
17
|
+
|
|
18
|
+
## [3.3.26](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.25...@entur/expand@3.3.26) (2022-10-31)
|
|
19
|
+
|
|
20
|
+
**Note:** Version bump only for package @entur/expand
|
|
21
|
+
|
|
22
|
+
## [3.3.25](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.24...@entur/expand@3.3.25) (2022-10-31)
|
|
23
|
+
|
|
24
|
+
**Note:** Version bump only for package @entur/expand
|
|
25
|
+
|
|
26
|
+
## [3.3.24](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.23...@entur/expand@3.3.24) (2022-10-31)
|
|
27
|
+
|
|
28
|
+
**Note:** Version bump only for package @entur/expand
|
|
29
|
+
|
|
30
|
+
## [3.3.23](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.22...@entur/expand@3.3.23) (2022-10-20)
|
|
31
|
+
|
|
32
|
+
**Note:** Version bump only for package @entur/expand
|
|
33
|
+
|
|
34
|
+
## [3.3.22](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.21...@entur/expand@3.3.22) (2022-10-20)
|
|
35
|
+
|
|
36
|
+
**Note:** Version bump only for package @entur/expand
|
|
37
|
+
|
|
38
|
+
## [3.3.21](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.20...@entur/expand@3.3.21) (2022-10-12)
|
|
39
|
+
|
|
40
|
+
### Bug Fixes
|
|
41
|
+
|
|
42
|
+
- **expand:** change divs in button to be span ([29a238e](https://bitbucket.org/enturas/design-system/commits/29a238e698457bea8244cbdc3aceaf4f18892568))
|
|
43
|
+
- **expand:** make aria-controls not refere to unmounted element id ([92b0b4a](https://bitbucket.org/enturas/design-system/commits/92b0b4a4ff3b5be56d9ae1559cb61c800897a08f))
|
|
44
|
+
|
|
45
|
+
## [3.3.19](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.18...@entur/expand@3.3.19) (2022-08-31)
|
|
46
|
+
|
|
47
|
+
**Note:** Version bump only for package @entur/expand
|
|
48
|
+
|
|
49
|
+
## [3.3.18](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.17...@entur/expand@3.3.18) (2022-08-24)
|
|
50
|
+
|
|
51
|
+
**Note:** Version bump only for package @entur/expand
|
|
52
|
+
|
|
53
|
+
## [3.3.17](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.16...@entur/expand@3.3.17) (2022-08-09)
|
|
54
|
+
|
|
55
|
+
### Bug Fixes
|
|
56
|
+
|
|
57
|
+
- **Base Expandable Panel:** remove redundant CSS property ([062072f](https://bitbucket.org/enturas/design-system/commits/062072f5e301f51bd411625e19d647033fa926c7))
|
|
58
|
+
- **Expandable panel:** make BaseExpandablePanel focus stackable ([5770334](https://bitbucket.org/enturas/design-system/commits/57703343a80ff067b49cb0ec2aabda74d391d080))
|
|
59
|
+
|
|
60
|
+
## [3.3.16](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.15...@entur/expand@3.3.16) (2022-07-05)
|
|
61
|
+
|
|
62
|
+
**Note:** Version bump only for package @entur/expand
|
|
63
|
+
|
|
64
|
+
## [3.3.15](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.14...@entur/expand@3.3.15) (2022-06-24)
|
|
65
|
+
|
|
66
|
+
**Note:** Version bump only for package @entur/expand
|
|
67
|
+
|
|
68
|
+
## [3.3.14](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.13...@entur/expand@3.3.14) (2022-06-02)
|
|
69
|
+
|
|
70
|
+
**Note:** Version bump only for package @entur/expand
|
|
71
|
+
|
|
72
|
+
## [3.3.13](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.12...@entur/expand@3.3.13) (2022-05-13)
|
|
73
|
+
|
|
74
|
+
**Note:** Version bump only for package @entur/expand
|
|
75
|
+
|
|
76
|
+
## [3.3.12](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.11...@entur/expand@3.3.12) (2022-05-04)
|
|
77
|
+
|
|
78
|
+
**Note:** Version bump only for package @entur/expand
|
|
79
|
+
|
|
80
|
+
## [3.3.11](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.10...@entur/expand@3.3.11) (2022-04-27)
|
|
81
|
+
|
|
82
|
+
**Note:** Version bump only for package @entur/expand
|
|
83
|
+
|
|
84
|
+
## [3.3.10](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.9...@entur/expand@3.3.10) (2022-04-20)
|
|
85
|
+
|
|
86
|
+
**Note:** Version bump only for package @entur/expand
|
|
87
|
+
|
|
88
|
+
## [3.3.9](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.8...@entur/expand@3.3.9) (2022-04-19)
|
|
89
|
+
|
|
90
|
+
**Note:** Version bump only for package @entur/expand
|
|
91
|
+
|
|
92
|
+
## [3.3.8](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.7...@entur/expand@3.3.8) (2022-03-01)
|
|
93
|
+
|
|
94
|
+
**Note:** Version bump only for package @entur/expand
|
|
95
|
+
|
|
96
|
+
## [3.3.7](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.6...@entur/expand@3.3.7) (2022-02-09)
|
|
97
|
+
|
|
98
|
+
**Note:** Version bump only for package @entur/expand
|
|
99
|
+
|
|
100
|
+
## [3.3.6](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.5...@entur/expand@3.3.6) (2021-11-17)
|
|
101
|
+
|
|
102
|
+
**Note:** Version bump only for package @entur/expand
|
|
103
|
+
|
|
104
|
+
## [3.3.5](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.4...@entur/expand@3.3.5) (2021-09-23)
|
|
105
|
+
|
|
106
|
+
**Note:** Version bump only for package @entur/expand
|
|
107
|
+
|
|
108
|
+
## [3.3.4](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.3...@entur/expand@3.3.4) (2021-09-13)
|
|
109
|
+
|
|
110
|
+
**Note:** Version bump only for package @entur/expand
|
|
111
|
+
|
|
112
|
+
## [3.3.3](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.2...@entur/expand@3.3.3) (2021-09-07)
|
|
113
|
+
|
|
114
|
+
### Bug Fixes
|
|
115
|
+
|
|
116
|
+
- utilize reworked focus token ([586758f](https://bitbucket.org/enturas/design-system/commits/586758fc86eb5aa52116c63c14ef033eb2e8b12f))
|
|
117
|
+
- **useaccordion:** improve typings of hook ([a0e6406](https://bitbucket.org/enturas/design-system/commits/a0e6406f81748a3858910bbe12454a58c4507e42))
|
|
118
|
+
- fix lint warnings in test ([652dfc7](https://bitbucket.org/enturas/design-system/commits/652dfc7e176e02ff8bcd5df20ef125decba65318))
|
|
119
|
+
- update dependencies ([d99ee7b](https://bitbucket.org/enturas/design-system/commits/d99ee7b76446834b0f8602bacba4319de121e38a))
|
|
120
|
+
|
|
121
|
+
## [3.3.2](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.1...@entur/expand@3.3.2) (2021-07-16)
|
|
122
|
+
|
|
123
|
+
**Note:** Version bump only for package @entur/expand
|
|
124
|
+
|
|
125
|
+
## [3.3.1](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.3.0...@entur/expand@3.3.1) (2021-06-25)
|
|
126
|
+
|
|
127
|
+
### Bug Fixes
|
|
128
|
+
|
|
129
|
+
- update dependencies ([a937757](https://bitbucket.org/enturas/design-system/commits/a9377575fed93796a626e50c753da1bb2283335b))
|
|
130
|
+
|
|
131
|
+
# [3.3.0](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.29...@entur/expand@3.3.0) (2021-05-05)
|
|
132
|
+
|
|
133
|
+
### Features
|
|
134
|
+
|
|
135
|
+
- **expandable text:** add titleElement prop ([a8cdcdb](https://bitbucket.org/enturas/design-system/commits/a8cdcdb305308864e653a843fd3bd1964afc353f))
|
|
136
|
+
|
|
137
|
+
## [3.2.29](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.28...@entur/expand@3.2.29) (2021-04-23)
|
|
138
|
+
|
|
139
|
+
### Bug Fixes
|
|
140
|
+
|
|
141
|
+
- utilize new focus tokens ([17113ef](https://bitbucket.org/enturas/design-system/commits/17113ef3f791c86fa6e19e71680fd5acdbae4990))
|
|
142
|
+
|
|
143
|
+
## [3.2.28](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.27...@entur/expand@3.2.28) (2021-04-09)
|
|
144
|
+
|
|
145
|
+
**Note:** Version bump only for package @entur/expand
|
|
146
|
+
|
|
147
|
+
## [3.2.27](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.26...@entur/expand@3.2.27) (2021-03-02)
|
|
148
|
+
|
|
149
|
+
**Note:** Version bump only for package @entur/expand
|
|
150
|
+
|
|
151
|
+
## [3.2.26](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.25...@entur/expand@3.2.26) (2021-02-17)
|
|
152
|
+
|
|
153
|
+
**Note:** Version bump only for package @entur/expand
|
|
154
|
+
|
|
155
|
+
## [3.2.25](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.24...@entur/expand@3.2.25) (2021-01-29)
|
|
156
|
+
|
|
157
|
+
**Note:** Version bump only for package @entur/expand
|
|
158
|
+
|
|
159
|
+
## [3.2.24](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.23...@entur/expand@3.2.24) (2021-01-20)
|
|
160
|
+
|
|
161
|
+
**Note:** Version bump only for package @entur/expand
|
|
162
|
+
|
|
163
|
+
## [3.2.23](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.22...@entur/expand@3.2.23) (2021-01-13)
|
|
164
|
+
|
|
165
|
+
### Bug Fixes
|
|
166
|
+
|
|
167
|
+
- transpose grey colors for updated color tokens ([d6a444c](https://bitbucket.org/enturas/design-system/commits/d6a444c2c37339b9bac0702738ed52693367d344))
|
|
168
|
+
|
|
169
|
+
## [3.2.22](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.21...@entur/expand@3.2.22) (2021-01-05)
|
|
170
|
+
|
|
171
|
+
**Note:** Version bump only for package @entur/expand
|
|
172
|
+
|
|
173
|
+
## [3.2.21](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.20...@entur/expand@3.2.21) (2020-12-04)
|
|
174
|
+
|
|
175
|
+
**Note:** Version bump only for package @entur/expand
|
|
176
|
+
|
|
177
|
+
## [3.2.20](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.19...@entur/expand@3.2.20) (2020-11-10)
|
|
178
|
+
|
|
179
|
+
### Bug Fixes
|
|
180
|
+
|
|
181
|
+
- **expandabletext:** adjust padding for expandable text ([2c54d82](https://bitbucket.org/enturas/design-system/commits/2c54d8210722b736e3cc39a92f8ddb0540f70113))
|
|
182
|
+
|
|
183
|
+
## [3.2.19](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.18...@entur/expand@3.2.19) (2020-11-05)
|
|
184
|
+
|
|
185
|
+
**Note:** Version bump only for package @entur/expand
|
|
186
|
+
|
|
187
|
+
## [3.2.18](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.17...@entur/expand@3.2.18) (2020-10-23)
|
|
188
|
+
|
|
189
|
+
**Note:** Version bump only for package @entur/expand
|
|
190
|
+
|
|
191
|
+
## [3.2.17](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.16...@entur/expand@3.2.17) (2020-10-16)
|
|
192
|
+
|
|
193
|
+
**Note:** Version bump only for package @entur/expand
|
|
194
|
+
|
|
195
|
+
## [3.2.16](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.15...@entur/expand@3.2.16) (2020-10-09)
|
|
196
|
+
|
|
197
|
+
**Note:** Version bump only for package @entur/expand
|
|
198
|
+
|
|
199
|
+
## [3.2.15](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.14...@entur/expand@3.2.15) (2020-09-25)
|
|
200
|
+
|
|
201
|
+
**Note:** Version bump only for package @entur/expand
|
|
202
|
+
|
|
203
|
+
## [3.2.14](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.13...@entur/expand@3.2.14) (2020-09-14)
|
|
204
|
+
|
|
205
|
+
**Note:** Version bump only for package @entur/expand
|
|
206
|
+
|
|
207
|
+
## [3.2.13](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.12...@entur/expand@3.2.13) (2020-09-10)
|
|
208
|
+
|
|
209
|
+
### Bug Fixes
|
|
210
|
+
|
|
211
|
+
- **expandable panel:** adjust font size ([5e9080d](https://bitbucket.org/enturas/design-system/commits/5e9080dd9dfc438b4e2d6c8cfae9bff3f918b3e3))
|
|
212
|
+
- **expandable text button:** adjust heading size ([40d3064](https://bitbucket.org/enturas/design-system/commits/40d3064e34badaa76497cbbc84de6e4ddd43a401))
|
|
213
|
+
|
|
214
|
+
## [3.2.12](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.11...@entur/expand@3.2.12) (2020-09-02)
|
|
215
|
+
|
|
216
|
+
**Note:** Version bump only for package @entur/expand
|
|
217
|
+
|
|
218
|
+
## [3.2.11](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.10...@entur/expand@3.2.11) (2020-08-26)
|
|
219
|
+
|
|
220
|
+
**Note:** Version bump only for package @entur/expand
|
|
221
|
+
|
|
222
|
+
## [3.2.10](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.9...@entur/expand@3.2.10) (2020-08-19)
|
|
223
|
+
|
|
224
|
+
**Note:** Version bump only for package @entur/expand
|
|
225
|
+
|
|
226
|
+
## [3.2.9](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.8...@entur/expand@3.2.9) (2020-08-14)
|
|
227
|
+
|
|
228
|
+
### Bug Fixes
|
|
229
|
+
|
|
230
|
+
- **expandable text:** remove underline from expandableText ([2852a21](https://bitbucket.org/enturas/design-system/commits/2852a218d1c3caec9f9fb8293da78b8e448a0c52))
|
|
231
|
+
|
|
232
|
+
## [3.2.8](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.7...@entur/expand@3.2.8) (2020-08-11)
|
|
233
|
+
|
|
234
|
+
**Note:** Version bump only for package @entur/expand
|
|
235
|
+
|
|
236
|
+
## [3.2.7](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.6...@entur/expand@3.2.7) (2020-07-22)
|
|
237
|
+
|
|
238
|
+
**Note:** Version bump only for package @entur/expand
|
|
239
|
+
|
|
240
|
+
## [3.2.6](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.5...@entur/expand@3.2.6) (2020-07-16)
|
|
241
|
+
|
|
242
|
+
**Note:** Version bump only for package @entur/expand
|
|
243
|
+
|
|
244
|
+
## [3.2.5](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.4...@entur/expand@3.2.5) (2020-07-09)
|
|
245
|
+
|
|
246
|
+
### Bug Fixes
|
|
247
|
+
|
|
248
|
+
- increase border radius for expandable panels ([1202b7c](https://bitbucket.org/enturas/design-system/commits/1202b7cabf93dab86a5c85f30624e581cb345e16))
|
|
249
|
+
|
|
250
|
+
## [3.2.4](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.3...@entur/expand@3.2.4) (2020-07-03)
|
|
251
|
+
|
|
252
|
+
**Note:** Version bump only for package @entur/expand
|
|
253
|
+
|
|
254
|
+
## [3.2.3](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.2...@entur/expand@3.2.3) (2020-06-17)
|
|
255
|
+
|
|
256
|
+
**Note:** Version bump only for package @entur/expand
|
|
257
|
+
|
|
258
|
+
## [3.2.2](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.1...@entur/expand@3.2.2) (2020-05-27)
|
|
259
|
+
|
|
260
|
+
**Note:** Version bump only for package @entur/expand
|
|
261
|
+
|
|
262
|
+
## [3.2.1](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.2.0...@entur/expand@3.2.1) (2020-05-26)
|
|
263
|
+
|
|
264
|
+
**Note:** Version bump only for package @entur/expand
|
|
265
|
+
|
|
266
|
+
# [3.2.0](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.1.2...@entur/expand@3.2.0) (2020-05-20)
|
|
267
|
+
|
|
268
|
+
### Bug Fixes
|
|
269
|
+
|
|
270
|
+
- use the expand arrow component instead of icon ([44e955a](https://bitbucket.org/enturas/design-system/commits/44e955a636f0c42b72e19029c75c6324f90c5ac3))
|
|
271
|
+
|
|
272
|
+
### Features
|
|
273
|
+
|
|
274
|
+
- add expand arrow as its own component ([5fc6bea](https://bitbucket.org/enturas/design-system/commits/5fc6bea21d2568ced1af0c0f976df4b2efbff539))
|
|
275
|
+
|
|
276
|
+
## [3.1.2](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.1.1...@entur/expand@3.1.2) (2020-04-27)
|
|
277
|
+
|
|
278
|
+
**Note:** Version bump only for package @entur/expand
|
|
279
|
+
|
|
280
|
+
## [3.1.1](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.1.0...@entur/expand@3.1.1) (2020-04-23)
|
|
281
|
+
|
|
282
|
+
### Bug Fixes
|
|
283
|
+
|
|
284
|
+
- updated to use new focus styling where applicable ([d0a52c0](https://bitbucket.org/enturas/design-system/commits/d0a52c096b673c6647070a90dd79bef9003ee0ad))
|
|
285
|
+
|
|
286
|
+
# [3.1.0](https://bitbucket.org/enturas/design-system/compare/@entur/expand@3.0.0...@entur/expand@3.1.0) (2020-04-08)
|
|
287
|
+
|
|
288
|
+
### Features
|
|
289
|
+
|
|
290
|
+
- add contentStyle prop for all expandable components ([efaac0f](https://bitbucket.org/enturas/design-system/commits/efaac0fb1822a4e38137e96c73f1f76cf41b3416))
|
|
291
|
+
|
|
292
|
+
# [3.0.0](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.1.15...@entur/expand@3.0.0) (2020-03-25)
|
|
293
|
+
|
|
294
|
+
### Features
|
|
295
|
+
|
|
296
|
+
- fix onToggle for ExpandableText ([ff15631](https://bitbucket.org/enturas/design-system/commits/ff15631e89e38519aebf0292c9479a57eda88b80))
|
|
297
|
+
|
|
298
|
+
### BREAKING CHANGES
|
|
299
|
+
|
|
300
|
+
- ExpandableTextButton now takes in onToggle instead of using onClick directly
|
|
301
|
+
|
|
302
|
+
ISSUES CLOSED: ETU-1853
|
|
303
|
+
|
|
304
|
+
# [2.0.0](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.1.15...@entur/expand@2.0.0) (2020-03-25)
|
|
305
|
+
|
|
306
|
+
### Features
|
|
307
|
+
|
|
308
|
+
- fix onToggle for ExpandableText ([ff15631](https://bitbucket.org/enturas/design-system/commits/ff15631e89e38519aebf0292c9479a57eda88b80))
|
|
309
|
+
|
|
310
|
+
### BREAKING CHANGES
|
|
311
|
+
|
|
312
|
+
- ExpandableTextButton now takes in onToggle instead of using onClick directly
|
|
313
|
+
|
|
314
|
+
ISSUES CLOSED: ETU-1853
|
|
315
|
+
|
|
316
|
+
## [1.1.15](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.1.14...@entur/expand@1.1.15) (2020-03-20)
|
|
317
|
+
|
|
318
|
+
**Note:** Version bump only for package @entur/expand
|
|
319
|
+
|
|
320
|
+
## [1.1.14](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.1.13...@entur/expand@1.1.14) (2020-03-18)
|
|
321
|
+
|
|
322
|
+
**Note:** Version bump only for package @entur/expand
|
|
323
|
+
|
|
324
|
+
## [1.1.13](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.1.12...@entur/expand@1.1.13) (2020-03-05)
|
|
325
|
+
|
|
326
|
+
**Note:** Version bump only for package @entur/expand
|
|
327
|
+
|
|
328
|
+
## [1.1.12](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.1.11...@entur/expand@1.1.12) (2020-02-26)
|
|
329
|
+
|
|
330
|
+
**Note:** Version bump only for package @entur/expand
|
|
331
|
+
|
|
332
|
+
## [1.1.11](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.1.10...@entur/expand@1.1.11) (2020-02-20)
|
|
333
|
+
|
|
334
|
+
**Note:** Version bump only for package @entur/expand
|
|
335
|
+
|
|
336
|
+
## [1.1.10](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.1.9...@entur/expand@1.1.10) (2020-02-14)
|
|
337
|
+
|
|
338
|
+
### Bug Fixes
|
|
339
|
+
|
|
340
|
+
- reduce left-padding for expandable panels ([27144ef](https://bitbucket.org/enturas/design-system/commits/27144ef0969e57811ca9b1fb22c12d2143c44c98))
|
|
341
|
+
|
|
342
|
+
## [1.1.9](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.1.8...@entur/expand@1.1.9) (2020-02-12)
|
|
343
|
+
|
|
344
|
+
**Note:** Version bump only for package @entur/expand
|
|
345
|
+
|
|
346
|
+
## [1.1.8](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.1.7...@entur/expand@1.1.8) (2020-02-10)
|
|
347
|
+
|
|
348
|
+
### Bug Fixes
|
|
349
|
+
|
|
350
|
+
- fix rendering of expandable panels ([4784f7c](https://bitbucket.org/enturas/design-system/commits/4784f7c010c38c4b20d96d007dee64dfe15b8380))
|
|
351
|
+
|
|
352
|
+
## [1.1.7](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.1.6...@entur/expand@1.1.7) (2020-02-05)
|
|
353
|
+
|
|
354
|
+
### Bug Fixes
|
|
355
|
+
|
|
356
|
+
- remove test-files from build process ([e0b24af](https://bitbucket.org/enturas/design-system/commits/e0b24af05d5c2ad8de4ae587d83c389495235890))
|
|
357
|
+
|
|
358
|
+
## [1.1.6](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.1.5...@entur/expand@1.1.6) (2020-01-28)
|
|
359
|
+
|
|
360
|
+
**Note:** Version bump only for package @entur/expand
|
|
361
|
+
|
|
362
|
+
## [1.1.5](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.1.4...@entur/expand@1.1.5) (2020-01-27)
|
|
363
|
+
|
|
364
|
+
### Bug Fixes
|
|
365
|
+
|
|
366
|
+
- update expandable panels to comply with new typography ([6c8276f](https://bitbucket.org/enturas/design-system/commits/6c8276f8ced0eead81c936af8ec24b8665c0281e))
|
|
367
|
+
- **types:** place types in the correct place ([acace09](https://bitbucket.org/enturas/design-system/commits/acace09ec0e258c5cff3a65e13ab29d6603780d9))
|
|
368
|
+
|
|
369
|
+
## [1.1.4](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.1.3...@entur/expand@1.1.4) (2020-01-20)
|
|
370
|
+
|
|
371
|
+
**Note:** Version bump only for package @entur/expand
|
|
372
|
+
|
|
373
|
+
## [1.1.3](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.1.2...@entur/expand@1.1.3) (2020-01-14)
|
|
374
|
+
|
|
375
|
+
**Note:** Version bump only for package @entur/expand
|
|
376
|
+
|
|
377
|
+
## [1.1.2](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.1.1...@entur/expand@1.1.2) (2020-01-13)
|
|
378
|
+
|
|
379
|
+
**Note:** Version bump only for package @entur/expand
|
|
380
|
+
|
|
381
|
+
## [1.1.1](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.1.0...@entur/expand@1.1.1) (2020-01-08)
|
|
382
|
+
|
|
383
|
+
### Bug Fixes
|
|
384
|
+
|
|
385
|
+
- warn in development if the developer have forgotten the CSS ([e5c30fc](https://bitbucket.org/enturas/design-system/commits/e5c30fc08624ef22c02773892778abd92205c6b0))
|
|
386
|
+
|
|
387
|
+
# [1.1.0](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.0.3...@entur/expand@1.1.0) (2020-01-06)
|
|
388
|
+
|
|
389
|
+
### Features
|
|
390
|
+
|
|
391
|
+
- refactor expandable-text-button as seperate component, and expose it ([c5765b0](https://bitbucket.org/enturas/design-system/commits/c5765b0fde18c146ec3858ccb098490ffd48274b))
|
|
392
|
+
|
|
393
|
+
## [1.0.3](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.0.2...@entur/expand@1.0.3) (2019-12-10)
|
|
394
|
+
|
|
395
|
+
### Bug Fixes
|
|
396
|
+
|
|
397
|
+
- adding default prop as part of documentation ([1ef7510](https://bitbucket.org/enturas/design-system/commits/1ef75107362f6262429d7fe31519b4353eccc8de))
|
|
398
|
+
|
|
399
|
+
## [1.0.2](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.0.1...@entur/expand@1.0.2) (2019-11-29)
|
|
400
|
+
|
|
401
|
+
**Note:** Version bump only for package @entur/expand
|
|
402
|
+
|
|
403
|
+
## [1.0.1](https://bitbucket.org/enturas/design-system/compare/@entur/expand@1.0.0...@entur/expand@1.0.1) (2019-11-28)
|
|
404
|
+
|
|
405
|
+
### Bug Fixes
|
|
406
|
+
|
|
407
|
+
- **ExpandableText:** tweak design of the expandable text component ([2d5dc34](https://bitbucket.org/enturas/design-system/commits/2d5dc34972ccc3e0a40b8c6cd0b6d73809f0ba0f))
|
|
408
|
+
|
|
409
|
+
# [1.0.0](https://bitbucket.org/enturas/design-system/compare/@entur/expand@0.3.1...@entur/expand@1.0.0) (2019-11-22)
|
|
410
|
+
|
|
411
|
+
### Bug Fixes
|
|
412
|
+
|
|
413
|
+
- fixing potential duplication of props naming ([6efd896](https://bitbucket.org/enturas/design-system/commits/6efd896d381bca09bc047dbdaec6d2629a9571db))
|
|
414
|
+
- **ExpandableText:** move toggle arrow to right side of toggle text ([5bc75d7](https://bitbucket.org/enturas/design-system/commits/5bc75d72f06cf20d174745924c11cd4e24199dab))
|
|
415
|
+
- **ExpandableText:** remove possibility to control ExpandableText ([ff9cd6c](https://bitbucket.org/enturas/design-system/commits/ff9cd6ce50867ae000bb61f0f9901bbeb645fe40))
|
|
416
|
+
|
|
417
|
+
### Code Refactoring
|
|
418
|
+
|
|
419
|
+
- **ExpandableGroup:** rename to Accordion ([e5f1a96](https://bitbucket.org/enturas/design-system/commits/e5f1a9644be8184e80f849970f255fc3553b0d46))
|
|
420
|
+
|
|
421
|
+
### Features
|
|
422
|
+
|
|
423
|
+
- **Accordion:** add new component - AccordionItem ([e73072a](https://bitbucket.org/enturas/design-system/commits/e73072a704cb591413601c5c6c4d5442432e7f34))
|
|
424
|
+
- **types:** exporting all public types for public components ([4a277ab](https://bitbucket.org/enturas/design-system/commits/4a277ab266fdb32a6760821a07b1c6cc716bac85))
|
|
425
|
+
|
|
426
|
+
### BREAKING CHANGES
|
|
427
|
+
|
|
428
|
+
- **ExpandableText:** No longer possible to control the ExpandableText component
|
|
429
|
+
- **ExpandableGroup:** The export ExpandableGroup is renamed to Accordion
|
|
430
|
+
|
|
431
|
+
## [0.3.1](https://bitbucket.org/enturas/design-system/compare/@entur/expand@0.3.0...@entur/expand@0.3.1) (2019-11-18)
|
|
432
|
+
|
|
433
|
+
**Note:** Version bump only for package @entur/expand
|
|
434
|
+
|
|
435
|
+
# [0.3.0](https://bitbucket.org/enturas/design-system/compare/@entur/expand@0.2.2...@entur/expand@0.3.0) (2019-11-14)
|
|
436
|
+
|
|
437
|
+
### Bug Fixes
|
|
438
|
+
|
|
439
|
+
- fix a few padding issues ([017e79b](https://bitbucket.org/enturas/design-system/commits/017e79bf5df8ec38a2d791de2b8d9f9ea8fc0f5a))
|
|
440
|
+
- **class prefix:** fixing final class name prefixes ([bdcd590](https://bitbucket.org/enturas/design-system/commits/bdcd590407c0f3cc4a9cc02d294edcce6b106cc7))
|
|
441
|
+
- **css classnames:** fixing naming collisions with CSS classes ([a93ca43](https://bitbucket.org/enturas/design-system/commits/a93ca435d3a01d61d8f02694a672686b9e943a66))
|
|
442
|
+
- **ExpandablePanel:** fix how paddings are applied ([0e3dd23](https://bitbucket.org/enturas/design-system/commits/0e3dd23f98e1365ca55f1abd1a01741dd00c9f0a))
|
|
443
|
+
- **ExpandablePanel:** make expandable panels accept longer titles ([85a3329](https://bitbucket.org/enturas/design-system/commits/85a3329e7de390014182354786e3c01908131735))
|
|
444
|
+
- add missing dependencies to dependency arrays ([15f1e81](https://bitbucket.org/enturas/design-system/commits/15f1e81f5a3dfea3e60453195379d392e6d536a0))
|
|
445
|
+
- fix lint errors ([8539282](https://bitbucket.org/enturas/design-system/commits/8539282c04b01cc1459109cbc9c4111dfcdaa5f4))
|
|
446
|
+
|
|
447
|
+
### Features
|
|
448
|
+
|
|
449
|
+
- **ExpandableGroup:** add new component ExpandableGroup ([d070846](https://bitbucket.org/enturas/design-system/commits/d0708469b26de68237a0d6a139cd77ad86c60959))
|
|
450
|
+
- **ExpandableLink:** adding ExpandableLink as its own component ([03bea1f](https://bitbucket.org/enturas/design-system/commits/03bea1f37a6febc558c79501c0b149868881471a))
|
|
451
|
+
|
|
452
|
+
## [0.2.2](https://bitbucket.org/enturas/design-system/compare/@entur/expand@0.2.1...@entur/expand@0.2.2) (2019-11-07)
|
|
453
|
+
|
|
454
|
+
### Bug Fixes
|
|
455
|
+
|
|
456
|
+
- **Styling:** proper padding and inline icon ([119dea6](https://bitbucket.org/enturas/design-system/commits/119dea6a27bcdd0e5098f0abfc4eb2057464f16b))
|
|
457
|
+
|
|
458
|
+
## [0.2.1](https://bitbucket.org/enturas/design-system/compare/@entur/expand@0.2.0...@entur/expand@0.2.1) (2019-11-06)
|
|
459
|
+
|
|
460
|
+
**Note:** Version bump only for package @entur/expand
|
|
461
|
+
|
|
462
|
+
# 0.2.0 (2019-11-04)
|
|
463
|
+
|
|
464
|
+
### Features
|
|
465
|
+
|
|
466
|
+
- **Expand:** adding Expandable, ControlledExpandable component in expand package ([d469df0](https://bitbucket.org/enturas/design-system/commits/d469df03e3da6e70e206746debc5ec0a11d18af1))
|
|
@@ -18,35 +18,39 @@ function _extends() {
|
|
|
18
18
|
_extends = Object.assign || function (target) {
|
|
19
19
|
for (var i = 1; i < arguments.length; i++) {
|
|
20
20
|
var source = arguments[i];
|
|
21
|
+
|
|
21
22
|
for (var key in source) {
|
|
22
23
|
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
23
24
|
target[key] = source[key];
|
|
24
25
|
}
|
|
25
26
|
}
|
|
26
27
|
}
|
|
28
|
+
|
|
27
29
|
return target;
|
|
28
30
|
};
|
|
31
|
+
|
|
29
32
|
return _extends.apply(this, arguments);
|
|
30
33
|
}
|
|
31
|
-
|
|
32
|
-
if (obj == null) throw new TypeError("Cannot destructure undefined");
|
|
33
|
-
}
|
|
34
|
+
|
|
34
35
|
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
35
36
|
if (source == null) return {};
|
|
36
37
|
var target = {};
|
|
37
38
|
var sourceKeys = Object.keys(source);
|
|
38
39
|
var key, i;
|
|
40
|
+
|
|
39
41
|
for (i = 0; i < sourceKeys.length; i++) {
|
|
40
42
|
key = sourceKeys[i];
|
|
41
43
|
if (excluded.indexOf(key) >= 0) continue;
|
|
42
44
|
target[key] = source[key];
|
|
43
45
|
}
|
|
46
|
+
|
|
44
47
|
return target;
|
|
45
48
|
}
|
|
46
49
|
|
|
47
50
|
var AccordionContext = /*#__PURE__*/React__default["default"].createContext(null);
|
|
48
51
|
var Accordion = function Accordion(_ref) {
|
|
49
|
-
var rest = _extends({},
|
|
52
|
+
var rest = _extends({}, _ref);
|
|
53
|
+
|
|
50
54
|
var currentlyOpenState = React__default["default"].useState(null);
|
|
51
55
|
return React__default["default"].createElement(AccordionContext.Provider, _extends({
|
|
52
56
|
value: currentlyOpenState
|
|
@@ -54,13 +58,15 @@ var Accordion = function Accordion(_ref) {
|
|
|
54
58
|
};
|
|
55
59
|
var useAccordion = function useAccordion(_ref2) {
|
|
56
60
|
var id = _ref2.id,
|
|
57
|
-
|
|
61
|
+
defaultOpen = _ref2.defaultOpen;
|
|
58
62
|
var contextValue = React__default["default"].useContext(AccordionContext);
|
|
63
|
+
|
|
59
64
|
if (!contextValue) {
|
|
60
65
|
throw new Error('You need to wrap your AccordionItem inside an Accordion');
|
|
61
66
|
}
|
|
67
|
+
|
|
62
68
|
var openId = contextValue[0],
|
|
63
|
-
|
|
69
|
+
setOpenId = contextValue[1];
|
|
64
70
|
React__default["default"].useEffect(function () {
|
|
65
71
|
if (defaultOpen) {
|
|
66
72
|
setOpenId(id);
|
|
@@ -78,7 +84,8 @@ var useAccordion = function useAccordion(_ref2) {
|
|
|
78
84
|
var _excluded$6 = ["open"];
|
|
79
85
|
var BaseExpand = function BaseExpand(_ref) {
|
|
80
86
|
var open = _ref.open,
|
|
81
|
-
|
|
87
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$6);
|
|
88
|
+
|
|
82
89
|
return React__default["default"].createElement(reactCollapse.UnmountClosed, {
|
|
83
90
|
isOpened: open
|
|
84
91
|
}, React__default["default"].createElement("div", _extends({}, rest)));
|
|
@@ -87,9 +94,10 @@ var BaseExpand = function BaseExpand(_ref) {
|
|
|
87
94
|
var _excluded$5 = ["open", "className"];
|
|
88
95
|
var ExpandArrow = function ExpandArrow(_ref) {
|
|
89
96
|
var _ref$open = _ref.open,
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
97
|
+
open = _ref$open === void 0 ? false : _ref$open,
|
|
98
|
+
className = _ref.className,
|
|
99
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$5);
|
|
100
|
+
|
|
93
101
|
return React__default["default"].createElement(icons.DownArrowIcon, _extends({
|
|
94
102
|
className: classNames__default["default"](className, 'eds-expandable-arrow', {
|
|
95
103
|
'eds-expandable-arrow--open': open
|
|
@@ -100,13 +108,14 @@ var ExpandArrow = function ExpandArrow(_ref) {
|
|
|
100
108
|
var _excluded$4 = ["title", "children", "className", "id", "open", "onToggle", "contentStyle"];
|
|
101
109
|
var BaseExpandablePanel = function BaseExpandablePanel(_ref) {
|
|
102
110
|
var title = _ref.title,
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
111
|
+
children = _ref.children,
|
|
112
|
+
className = _ref.className,
|
|
113
|
+
id = _ref.id,
|
|
114
|
+
open = _ref.open,
|
|
115
|
+
onToggle = _ref.onToggle,
|
|
116
|
+
contentStyle = _ref.contentStyle,
|
|
117
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
|
|
118
|
+
|
|
110
119
|
return React__default["default"].createElement("div", {
|
|
111
120
|
className: classNames__default["default"]('eds-expandable-panel', className)
|
|
112
121
|
}, React__default["default"].createElement("button", _extends({
|
|
@@ -135,18 +144,21 @@ var BaseExpandablePanel = function BaseExpandablePanel(_ref) {
|
|
|
135
144
|
var _excluded$3 = ["defaultOpen", "id", "contentStyle"];
|
|
136
145
|
var AccordionItem = function AccordionItem(_ref) {
|
|
137
146
|
var _ref$defaultOpen = _ref.defaultOpen,
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
147
|
+
defaultOpen = _ref$defaultOpen === void 0 ? false : _ref$defaultOpen,
|
|
148
|
+
overrideId = _ref.id,
|
|
149
|
+
contentStyle = _ref.contentStyle,
|
|
150
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
|
|
151
|
+
|
|
142
152
|
var randomId = utils.useRandomId('eds-accordion-item');
|
|
143
153
|
var id = overrideId || randomId;
|
|
154
|
+
|
|
144
155
|
var _useAccordion = useAccordion({
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
156
|
+
id: id,
|
|
157
|
+
defaultOpen: defaultOpen
|
|
158
|
+
}),
|
|
159
|
+
isOpen = _useAccordion.isOpen,
|
|
160
|
+
toggle = _useAccordion.toggle;
|
|
161
|
+
|
|
150
162
|
return React__default["default"].createElement(BaseExpandablePanel, _extends({}, rest, {
|
|
151
163
|
contentStyle: contentStyle,
|
|
152
164
|
id: id,
|
|
@@ -158,13 +170,16 @@ var AccordionItem = function AccordionItem(_ref) {
|
|
|
158
170
|
var _excluded$2 = ["defaultOpen", "contentStyle"];
|
|
159
171
|
var ExpandablePanel = function ExpandablePanel(_ref) {
|
|
160
172
|
var _ref$defaultOpen = _ref.defaultOpen,
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
173
|
+
defaultOpen = _ref$defaultOpen === void 0 ? false : _ref$defaultOpen,
|
|
174
|
+
contentStyle = _ref.contentStyle,
|
|
175
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
|
|
176
|
+
|
|
164
177
|
var randomId = utils.useRandomId('eds-expandable');
|
|
178
|
+
|
|
165
179
|
var _React$useState = React__default["default"].useState(defaultOpen),
|
|
166
|
-
|
|
167
|
-
|
|
180
|
+
isOpen = _React$useState[0],
|
|
181
|
+
setOpen = _React$useState[1];
|
|
182
|
+
|
|
168
183
|
return React__default["default"].createElement(BaseExpandablePanel, _extends({
|
|
169
184
|
id: randomId,
|
|
170
185
|
open: isOpen,
|
|
@@ -180,11 +195,12 @@ var ExpandablePanel = function ExpandablePanel(_ref) {
|
|
|
180
195
|
var _excluded$1 = ["children", "open", "onToggle", "as"];
|
|
181
196
|
var ExpandableTextButton = function ExpandableTextButton(_ref) {
|
|
182
197
|
var children = _ref.children,
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
198
|
+
open = _ref.open,
|
|
199
|
+
onToggle = _ref.onToggle,
|
|
200
|
+
_ref$as = _ref.as,
|
|
201
|
+
Component = _ref$as === void 0 ? typography.Heading5 : _ref$as,
|
|
202
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
|
|
203
|
+
|
|
188
204
|
return React__default["default"].createElement("button", _extends({
|
|
189
205
|
className: "eds-expandable-text__trigger",
|
|
190
206
|
"aria-expanded": open,
|
|
@@ -202,17 +218,20 @@ var ExpandableTextButton = function ExpandableTextButton(_ref) {
|
|
|
202
218
|
var _excluded = ["title", "children", "defaultOpen", "contentStyle", "titleElement"];
|
|
203
219
|
var ExpandableText = function ExpandableText(_ref) {
|
|
204
220
|
var title = _ref.title,
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
221
|
+
children = _ref.children,
|
|
222
|
+
_ref$defaultOpen = _ref.defaultOpen,
|
|
223
|
+
defaultOpen = _ref$defaultOpen === void 0 ? false : _ref$defaultOpen,
|
|
224
|
+
contentStyle = _ref.contentStyle,
|
|
225
|
+
_ref$titleElement = _ref.titleElement,
|
|
226
|
+
titleElement = _ref$titleElement === void 0 ? 'Heading5' : _ref$titleElement,
|
|
227
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
228
|
+
|
|
212
229
|
var randomId = utils.useRandomId('eds-expandable-text');
|
|
230
|
+
|
|
213
231
|
var _React$useState = React__default["default"].useState(defaultOpen),
|
|
214
|
-
|
|
215
|
-
|
|
232
|
+
isOpen = _React$useState[0],
|
|
233
|
+
setOpen = _React$useState[1];
|
|
234
|
+
|
|
216
235
|
var Element = React__default["default"].useMemo(function () {
|
|
217
236
|
return GetTypographyComponent(titleElement);
|
|
218
237
|
}, [titleElement]);
|
|
@@ -232,14 +251,18 @@ var ExpandableText = function ExpandableText(_ref) {
|
|
|
232
251
|
style: contentStyle
|
|
233
252
|
}, rest), children));
|
|
234
253
|
};
|
|
254
|
+
|
|
235
255
|
function GetTypographyComponent(element) {
|
|
236
256
|
switch (element) {
|
|
237
257
|
case 'Heading5':
|
|
238
258
|
return typography.Heading5;
|
|
259
|
+
|
|
239
260
|
case 'Paragraph':
|
|
240
261
|
return typography.Paragraph;
|
|
262
|
+
|
|
241
263
|
case 'SubParagraph':
|
|
242
264
|
return typography.SubParagraph;
|
|
265
|
+
|
|
243
266
|
default:
|
|
244
267
|
return typography.Heading5;
|
|
245
268
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"expand.cjs.development.js","sources":["../src/Accordion.tsx","../src/BaseExpand.tsx","../src/ExpandArrow.tsx","../src/BaseExpandablePanel.tsx","../src/AccordionItem.tsx","../src/ExpandablePanel.tsx","../src/ExpandableTextButton.tsx","../src/ExpandableText.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\n\ntype Id = string | null;\ntype AccordionContextType = [Id, React.Dispatch<React.SetStateAction<Id>>];\nconst AccordionContext = React.createContext<AccordionContextType | null>(null);\n\nexport type AccordionProps = {\n /** To eller flere AccordionItem-komponenter */\n children: React.ReactNode;\n [key: string]: any;\n};\n\nexport const Accordion: React.FC<AccordionProps> = ({ ...rest }) => {\n const currentlyOpenState = React.useState<Id>(null);\n return <AccordionContext.Provider value={currentlyOpenState} {...rest} />;\n};\n\ntype UseAccordionArgs = {\n id: Id;\n defaultOpen?: boolean;\n};\n\nexport const useAccordion: ({ id, defaultOpen }: UseAccordionArgs) => {\n isOpen: boolean;\n toggle: () => void;\n} = ({ id, defaultOpen }: UseAccordionArgs) => {\n const contextValue = React.useContext(AccordionContext);\n if (!contextValue) {\n throw new Error('You need to wrap your AccordionItem inside an Accordion');\n }\n\n const [openId, setOpenId] = contextValue;\n\n React.useEffect(() => {\n if (defaultOpen) {\n setOpenId(id);\n }\n }, [defaultOpen, id, setOpenId]);\n\n const isOpen = openId === id;\n\n return {\n isOpen,\n toggle: () => setOpenId(isOpen ? null : id),\n };\n};\n","import React from 'react';\n\nimport { UnmountClosed } from 'react-collapse';\n\ntype BaseExpandProps = {\n /** Innholdet som skal være expandable */\n children: React.ReactNode;\n /** Boolean for om innholdet vises eller ikke */\n open: boolean;\n [key: string]: any;\n};\nexport const BaseExpand: React.FC<BaseExpandProps> = ({ open, ...rest }) => {\n return (\n <UnmountClosed isOpened={open}>\n <div {...rest} />\n </UnmountClosed>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { DownArrowIcon } from '@entur/icons';\nimport './ExpandArrow.scss';\n\ntype ExpandArrowProps = {\n /** Om innholdet er åpent eller ikke, som bestemmer retningen på pila\n * @default false\n */\n open?: boolean;\n /** Ekstra klassenavn */\n className?: string;\n [key: string]: any;\n};\n\nexport const ExpandArrow: React.FC<ExpandArrowProps> = ({\n open = false,\n className,\n ...rest\n}) => {\n return (\n <DownArrowIcon\n className={classNames(className, 'eds-expandable-arrow', {\n 'eds-expandable-arrow--open': open,\n })}\n {...rest}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport classNames from 'classnames';\nimport { Heading5 } from '@entur/typography';\nimport { BaseExpand } from './BaseExpand';\n\nimport './BaseExpandablePanel.scss';\nimport { ExpandArrow } from './ExpandArrow';\n\ntype BaseExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** IDen til expand-panelet */\n id: string;\n /** Prop for om innholdet er åpent */\n open: boolean;\n /** Funksjonen som styrer åpningen av BaseExpandablePanel */\n onToggle: () => void;\n /** Styling som sendes til innholdet av BaseExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const BaseExpandablePanel: React.FC<BaseExpandablePanelProps> = ({\n title,\n children,\n className,\n id,\n open,\n onToggle,\n contentStyle,\n ...rest\n}) => {\n return (\n <div className={classNames('eds-expandable-panel', className)}>\n <button\n type=\"button\"\n className=\"eds-expandable-panel__trigger\"\n onClick={onToggle}\n aria-expanded={open}\n aria-controls={open ? id : undefined}\n {...rest}\n >\n <span className=\"eds-expandable-panel__grid\">\n <Heading5 margin=\"none\" as=\"span\">\n {title}\n </Heading5>\n <span className=\"eds-expandable-panel__icon-container\">\n <ExpandArrow open={open} />\n </span>\n </span>\n </button>\n <BaseExpand\n className=\"eds-expandable-panel__content\"\n id={id}\n open={open}\n style={contentStyle}\n >\n {children}\n </BaseExpand>\n </div>\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\nimport { useAccordion } from './Accordion';\n\nexport type AccordionItemProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand AccordionItem skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Styling som sendes til innholdet av AccordionItem */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const AccordionItem: React.FC<AccordionItemProps> = ({\n defaultOpen = false,\n id: overrideId,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-accordion-item');\n const id = overrideId || randomId;\n const { isOpen, toggle } = useAccordion({ id, defaultOpen });\n\n return (\n <BaseExpandablePanel\n {...rest}\n contentStyle={contentStyle}\n id={id}\n onToggle={toggle}\n open={isOpen}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\n\nexport type ExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandablePanel skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Funksjonen som styrer åpningen av ExpandablePanel */\n onToggle?: () => void;\n /** Styling som sendes til innholdet av ExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const ExpandablePanel: React.FC<ExpandablePanelProps> = ({\n defaultOpen = false,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable');\n\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n return (\n <BaseExpandablePanel\n id={randomId}\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n contentStyle={contentStyle}\n {...rest}\n />\n );\n};\n","import React from 'react';\nimport { Heading5 } from '@entur/typography';\nimport { ExpandArrow } from './ExpandArrow';\n\nexport type ExandableTextButtonProps = {\n children: React.ReactNode;\n /** Prop for om innholdet er åpent */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableTextButton */\n onToggle: () => void;\n /** Den typografiske komponenten for tittelen\n * @default Heading5\n */\n as?: React.ElementType;\n [key: string]: any;\n};\n\nexport const ExpandableTextButton: React.FC<ExandableTextButtonProps> = ({\n children,\n open,\n onToggle,\n as: Component = Heading5,\n ...rest\n}) => {\n return (\n <button\n className=\"eds-expandable-text__trigger\"\n aria-expanded={open}\n type=\"button\"\n onClick={onToggle}\n {...rest}\n >\n <Component as=\"span\">{children}</Component>\n <ExpandArrow open={open} className=\"eds-expandable-text__arrow\" inline />\n </button>\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { ExpandableTextButton } from './ExpandableTextButton';\nimport { BaseExpand } from './BaseExpand';\nimport { Heading5, Paragraph, SubParagraph } from '@entur/typography';\nimport './ExpandableText.scss';\n\nexport type ExpandableTextProps = {\n /** Teksten som skal \"vises\" */\n title: string;\n /** Innholdet som skal vises under linken */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandableText skal ha som default (med mindre den er kontrollert)\n * @default false\n */\n defaultOpen?: boolean;\n /** Prop for om innholdet er åpent. Brukes hvis du vil kontrollere ExpandableText, sammen med onToggle */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableText */\n onToggle?: () => void;\n /**Styling som sendes til innholdet av ExpandableText */\n contentStyle?: CSSProperties;\n /** Hvilket typografisk element tittelen er\n * @default \"Heading5\"\n */\n titleElement?: 'Heading5' | 'Paragraph' | 'SubParagraph';\n [key: string]: any;\n};\n\nexport const ExpandableText: React.FC<ExpandableTextProps> = ({\n title,\n children,\n defaultOpen = false,\n contentStyle,\n titleElement = 'Heading5',\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable-text');\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n const Element: React.ElementType = React.useMemo(\n () => GetTypographyComponent(titleElement),\n [titleElement],\n );\n\n return (\n <>\n <ExpandableTextButton\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n aria-controls={isOpen ? randomId : undefined}\n as={Element}\n {...rest}\n >\n {title}\n </ExpandableTextButton>\n <BaseExpand\n className=\"eds-expandable-text__content\"\n id={randomId}\n open={isOpen}\n style={contentStyle}\n {...rest}\n >\n {children}\n </BaseExpand>\n </>\n );\n};\n\nfunction GetTypographyComponent(\n element: 'Heading5' | 'Paragraph' | 'SubParagraph',\n) {\n switch (element) {\n case 'Heading5':\n return Heading5;\n case 'Paragraph':\n return Paragraph;\n case 'SubParagraph':\n return SubParagraph;\n default:\n return Heading5;\n }\n}\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('expand', 'typography', 'icons');\n\nexport * from './Accordion';\nexport * from './AccordionItem';\nexport * from './ExpandablePanel';\nexport * from './BaseExpand';\nexport * from './ExpandableText';\nexport * from './ExpandableTextButton';\nexport * from './ExpandArrow';\n"],"names":["AccordionContext","React","createContext","Accordion","rest","currentlyOpenState","useState","Provider","value","useAccordion","id","defaultOpen","contextValue","useContext","Error","openId","setOpenId","useEffect","isOpen","toggle","BaseExpand","open","UnmountClosed","isOpened","ExpandArrow","className","DownArrowIcon","classNames","BaseExpandablePanel","title","children","onToggle","contentStyle","type","onClick","undefined","Heading5","margin","as","style","AccordionItem","overrideId","randomId","useRandomId","ExpandablePanel","setOpen","prev","ExpandableTextButton","Component","inline","ExpandableText","titleElement","Element","useMemo","GetTypographyComponent","element","Paragraph","SubParagraph","warnAboutMissingStyles"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"expand.cjs.development.js","sources":["../src/Accordion.tsx","../src/BaseExpand.tsx","../src/ExpandArrow.tsx","../src/BaseExpandablePanel.tsx","../src/AccordionItem.tsx","../src/ExpandablePanel.tsx","../src/ExpandableTextButton.tsx","../src/ExpandableText.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\n\ntype Id = string | null;\ntype AccordionContextType = [Id, React.Dispatch<React.SetStateAction<Id>>];\nconst AccordionContext = React.createContext<AccordionContextType | null>(null);\n\nexport type AccordionProps = {\n /** To eller flere AccordionItem-komponenter */\n children: React.ReactNode;\n [key: string]: any;\n};\n\nexport const Accordion: React.FC<AccordionProps> = ({ ...rest }) => {\n const currentlyOpenState = React.useState<Id>(null);\n return <AccordionContext.Provider value={currentlyOpenState} {...rest} />;\n};\n\ntype UseAccordionArgs = {\n id: Id;\n defaultOpen?: boolean;\n};\n\nexport const useAccordion: ({ id, defaultOpen }: UseAccordionArgs) => {\n isOpen: boolean;\n toggle: () => void;\n} = ({ id, defaultOpen }: UseAccordionArgs) => {\n const contextValue = React.useContext(AccordionContext);\n if (!contextValue) {\n throw new Error('You need to wrap your AccordionItem inside an Accordion');\n }\n\n const [openId, setOpenId] = contextValue;\n\n React.useEffect(() => {\n if (defaultOpen) {\n setOpenId(id);\n }\n }, [defaultOpen, id, setOpenId]);\n\n const isOpen = openId === id;\n\n return {\n isOpen,\n toggle: () => setOpenId(isOpen ? null : id),\n };\n};\n","import React from 'react';\n\nimport { UnmountClosed } from 'react-collapse';\n\ntype BaseExpandProps = {\n /** Innholdet som skal være expandable */\n children: React.ReactNode;\n /** Boolean for om innholdet vises eller ikke */\n open: boolean;\n [key: string]: any;\n};\nexport const BaseExpand: React.FC<BaseExpandProps> = ({ open, ...rest }) => {\n return (\n <UnmountClosed isOpened={open}>\n <div {...rest} />\n </UnmountClosed>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { DownArrowIcon } from '@entur/icons';\nimport './ExpandArrow.scss';\n\ntype ExpandArrowProps = {\n /** Om innholdet er åpent eller ikke, som bestemmer retningen på pila\n * @default false\n */\n open?: boolean;\n /** Ekstra klassenavn */\n className?: string;\n [key: string]: any;\n};\n\nexport const ExpandArrow: React.FC<ExpandArrowProps> = ({\n open = false,\n className,\n ...rest\n}) => {\n return (\n <DownArrowIcon\n className={classNames(className, 'eds-expandable-arrow', {\n 'eds-expandable-arrow--open': open,\n })}\n {...rest}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport classNames from 'classnames';\nimport { Heading5 } from '@entur/typography';\nimport { BaseExpand } from './BaseExpand';\n\nimport './BaseExpandablePanel.scss';\nimport { ExpandArrow } from './ExpandArrow';\n\ntype BaseExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** IDen til expand-panelet */\n id: string;\n /** Prop for om innholdet er åpent */\n open: boolean;\n /** Funksjonen som styrer åpningen av BaseExpandablePanel */\n onToggle: () => void;\n /** Styling som sendes til innholdet av BaseExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const BaseExpandablePanel: React.FC<BaseExpandablePanelProps> = ({\n title,\n children,\n className,\n id,\n open,\n onToggle,\n contentStyle,\n ...rest\n}) => {\n return (\n <div className={classNames('eds-expandable-panel', className)}>\n <button\n type=\"button\"\n className=\"eds-expandable-panel__trigger\"\n onClick={onToggle}\n aria-expanded={open}\n aria-controls={open ? id : undefined}\n {...rest}\n >\n <span className=\"eds-expandable-panel__grid\">\n <Heading5 margin=\"none\" as=\"span\">\n {title}\n </Heading5>\n <span className=\"eds-expandable-panel__icon-container\">\n <ExpandArrow open={open} />\n </span>\n </span>\n </button>\n <BaseExpand\n className=\"eds-expandable-panel__content\"\n id={id}\n open={open}\n style={contentStyle}\n >\n {children}\n </BaseExpand>\n </div>\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\nimport { useAccordion } from './Accordion';\n\nexport type AccordionItemProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand AccordionItem skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Styling som sendes til innholdet av AccordionItem */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const AccordionItem: React.FC<AccordionItemProps> = ({\n defaultOpen = false,\n id: overrideId,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-accordion-item');\n const id = overrideId || randomId;\n const { isOpen, toggle } = useAccordion({ id, defaultOpen });\n\n return (\n <BaseExpandablePanel\n {...rest}\n contentStyle={contentStyle}\n id={id}\n onToggle={toggle}\n open={isOpen}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\n\nexport type ExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandablePanel skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Funksjonen som styrer åpningen av ExpandablePanel */\n onToggle?: () => void;\n /** Styling som sendes til innholdet av ExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const ExpandablePanel: React.FC<ExpandablePanelProps> = ({\n defaultOpen = false,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable');\n\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n return (\n <BaseExpandablePanel\n id={randomId}\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n contentStyle={contentStyle}\n {...rest}\n />\n );\n};\n","import React from 'react';\nimport { Heading5 } from '@entur/typography';\nimport { ExpandArrow } from './ExpandArrow';\n\nexport type ExandableTextButtonProps = {\n children: React.ReactNode;\n /** Prop for om innholdet er åpent */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableTextButton */\n onToggle: () => void;\n /** Den typografiske komponenten for tittelen\n * @default Heading5\n */\n as?: React.ElementType;\n [key: string]: any;\n};\n\nexport const ExpandableTextButton: React.FC<ExandableTextButtonProps> = ({\n children,\n open,\n onToggle,\n as: Component = Heading5,\n ...rest\n}) => {\n return (\n <button\n className=\"eds-expandable-text__trigger\"\n aria-expanded={open}\n type=\"button\"\n onClick={onToggle}\n {...rest}\n >\n <Component as=\"span\">{children}</Component>\n <ExpandArrow open={open} className=\"eds-expandable-text__arrow\" inline />\n </button>\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { ExpandableTextButton } from './ExpandableTextButton';\nimport { BaseExpand } from './BaseExpand';\nimport { Heading5, Paragraph, SubParagraph } from '@entur/typography';\nimport './ExpandableText.scss';\n\nexport type ExpandableTextProps = {\n /** Teksten som skal \"vises\" */\n title: string;\n /** Innholdet som skal vises under linken */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandableText skal ha som default (med mindre den er kontrollert)\n * @default false\n */\n defaultOpen?: boolean;\n /** Prop for om innholdet er åpent. Brukes hvis du vil kontrollere ExpandableText, sammen med onToggle */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableText */\n onToggle?: () => void;\n /**Styling som sendes til innholdet av ExpandableText */\n contentStyle?: CSSProperties;\n /** Hvilket typografisk element tittelen er\n * @default \"Heading5\"\n */\n titleElement?: 'Heading5' | 'Paragraph' | 'SubParagraph';\n [key: string]: any;\n};\n\nexport const ExpandableText: React.FC<ExpandableTextProps> = ({\n title,\n children,\n defaultOpen = false,\n contentStyle,\n titleElement = 'Heading5',\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable-text');\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n const Element: React.ElementType = React.useMemo(\n () => GetTypographyComponent(titleElement),\n [titleElement],\n );\n\n return (\n <>\n <ExpandableTextButton\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n aria-controls={isOpen ? randomId : undefined}\n as={Element}\n {...rest}\n >\n {title}\n </ExpandableTextButton>\n <BaseExpand\n className=\"eds-expandable-text__content\"\n id={randomId}\n open={isOpen}\n style={contentStyle}\n {...rest}\n >\n {children}\n </BaseExpand>\n </>\n );\n};\n\nfunction GetTypographyComponent(\n element: 'Heading5' | 'Paragraph' | 'SubParagraph',\n) {\n switch (element) {\n case 'Heading5':\n return Heading5;\n case 'Paragraph':\n return Paragraph;\n case 'SubParagraph':\n return SubParagraph;\n default:\n return Heading5;\n }\n}\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('expand', 'typography', 'icons');\n\nexport * from './Accordion';\nexport * from './AccordionItem';\nexport * from './ExpandablePanel';\nexport * from './BaseExpand';\nexport * from './ExpandableText';\nexport * from './ExpandableTextButton';\nexport * from './ExpandArrow';\n"],"names":["AccordionContext","React","createContext","Accordion","rest","currentlyOpenState","useState","Provider","value","useAccordion","id","defaultOpen","contextValue","useContext","Error","openId","setOpenId","useEffect","isOpen","toggle","BaseExpand","open","UnmountClosed","isOpened","ExpandArrow","className","DownArrowIcon","classNames","BaseExpandablePanel","title","children","onToggle","contentStyle","type","onClick","undefined","Heading5","margin","as","style","AccordionItem","overrideId","randomId","useRandomId","ExpandablePanel","setOpen","prev","ExpandableTextButton","Component","inline","ExpandableText","titleElement","Element","useMemo","GetTypographyComponent","element","Paragraph","SubParagraph","warnAboutMissingStyles"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@entur/utils"),t=require("react"),n=require("classnames"),a=require("@entur/typography"),r=require("react-collapse"),l=require("@entur/icons");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=o(t),u=o(n);function c(){return c=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},c.apply(this,arguments)}function i(e,t){if(null==e)return{};var n,a,r={},l=Object.keys(e);for(a=0;a<l.length;a++)t.indexOf(n=l[a])>=0||(r[n]=e[n]);return r}var s=d.default.createContext(null),p=function(e){var t=e.id,n=e.defaultOpen,a=d.default.useContext(s);if(!a)throw new Error("You need to wrap your AccordionItem inside an Accordion");var r=a[0],l=a[1];d.default.useEffect((function(){n&&l(t)}),[n,t,l]);var o=r===t;return{isOpen:o,toggle:function(){return l(o?null:t)}}},f=["open"],m=function(e){var t=e.open,n=i(e,f);return d.default.createElement(r.UnmountClosed,{isOpened:t},d.default.createElement("div",c({},n)))},g=["open","className"],x=function(e){var t=e.open,n=void 0!==t&&t,a=e.className,r=i(e,g);return d.default.createElement(l.DownArrowIcon,c({className:u.default(a,"eds-expandable-arrow",{"eds-expandable-arrow--open":n})},r))},v=["title","children","className","id","open","onToggle","contentStyle"],E=function(e){var t=e.title,n=e.children,r=e.className,l=e.id,o=e.open,s=e.onToggle,p=e.contentStyle,f=i(e,v);return d.default.createElement("div",{className:u.default("eds-expandable-panel",r)},d.default.createElement("button",c({type:"button",className:"eds-expandable-panel__trigger",onClick:s,"aria-expanded":o,"aria-controls":o?l:void 0},f),d.default.createElement("span",{className:"eds-expandable-panel__grid"},d.default.createElement(a.Heading5,{margin:"none",as:"span"},t),d.default.createElement("span",{className:"eds-expandable-panel__icon-container"},d.default.createElement(x,{open:o})))),d.default.createElement(m,{className:"eds-expandable-panel__content",id:l,open:o,style:p},n))},b=["defaultOpen","id","contentStyle"],y=["defaultOpen","contentStyle"],h=["children","open","onToggle","as"],O=function(e){var t=e.children,n=e.open,r=e.onToggle,l=e.as,o=void 0===l?a.Heading5:l,u=i(e,h);return d.default.createElement("button",c({className:"eds-expandable-text__trigger","aria-expanded":n,type:"button",onClick:r},u),d.default.createElement(o,{as:"span"},t),d.default.createElement(x,{open:n,className:"eds-expandable-text__arrow",inline:!0}))},S=["title","children","defaultOpen","contentStyle","titleElement"];e.warnAboutMissingStyles("expand","typography","icons"),exports.Accordion=function(e){var t=c({},
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@entur/utils"),t=require("react"),n=require("classnames"),a=require("@entur/typography"),r=require("react-collapse"),l=require("@entur/icons");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=o(t),u=o(n);function c(){return c=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},c.apply(this,arguments)}function i(e,t){if(null==e)return{};var n,a,r={},l=Object.keys(e);for(a=0;a<l.length;a++)t.indexOf(n=l[a])>=0||(r[n]=e[n]);return r}var s=d.default.createContext(null),p=function(e){var t=e.id,n=e.defaultOpen,a=d.default.useContext(s);if(!a)throw new Error("You need to wrap your AccordionItem inside an Accordion");var r=a[0],l=a[1];d.default.useEffect((function(){n&&l(t)}),[n,t,l]);var o=r===t;return{isOpen:o,toggle:function(){return l(o?null:t)}}},f=["open"],m=function(e){var t=e.open,n=i(e,f);return d.default.createElement(r.UnmountClosed,{isOpened:t},d.default.createElement("div",c({},n)))},g=["open","className"],x=function(e){var t=e.open,n=void 0!==t&&t,a=e.className,r=i(e,g);return d.default.createElement(l.DownArrowIcon,c({className:u.default(a,"eds-expandable-arrow",{"eds-expandable-arrow--open":n})},r))},v=["title","children","className","id","open","onToggle","contentStyle"],E=function(e){var t=e.title,n=e.children,r=e.className,l=e.id,o=e.open,s=e.onToggle,p=e.contentStyle,f=i(e,v);return d.default.createElement("div",{className:u.default("eds-expandable-panel",r)},d.default.createElement("button",c({type:"button",className:"eds-expandable-panel__trigger",onClick:s,"aria-expanded":o,"aria-controls":o?l:void 0},f),d.default.createElement("span",{className:"eds-expandable-panel__grid"},d.default.createElement(a.Heading5,{margin:"none",as:"span"},t),d.default.createElement("span",{className:"eds-expandable-panel__icon-container"},d.default.createElement(x,{open:o})))),d.default.createElement(m,{className:"eds-expandable-panel__content",id:l,open:o,style:p},n))},b=["defaultOpen","id","contentStyle"],y=["defaultOpen","contentStyle"],h=["children","open","onToggle","as"],O=function(e){var t=e.children,n=e.open,r=e.onToggle,l=e.as,o=void 0===l?a.Heading5:l,u=i(e,h);return d.default.createElement("button",c({className:"eds-expandable-text__trigger","aria-expanded":n,type:"button",onClick:r},u),d.default.createElement(o,{as:"span"},t),d.default.createElement(x,{open:n,className:"eds-expandable-text__arrow",inline:!0}))},S=["title","children","defaultOpen","contentStyle","titleElement"];e.warnAboutMissingStyles("expand","typography","icons"),exports.Accordion=function(e){var t=c({},e),n=d.default.useState(null);return d.default.createElement(s.Provider,c({value:n},t))},exports.AccordionItem=function(t){var n=t.defaultOpen,a=void 0!==n&&n,r=t.id,l=t.contentStyle,o=i(t,b),u=e.useRandomId("eds-accordion-item"),s=r||u,f=p({id:s,defaultOpen:a});return d.default.createElement(E,c({},o,{contentStyle:l,id:s,onToggle:f.toggle,open:f.isOpen}))},exports.BaseExpand=m,exports.ExpandArrow=x,exports.ExpandablePanel=function(t){var n=t.defaultOpen,a=void 0!==n&&n,r=t.contentStyle,l=i(t,y),o=e.useRandomId("eds-expandable"),u=d.default.useState(a),s=u[1];return d.default.createElement(E,c({id:o,open:u[0],onToggle:function(){return s((function(e){return!e}))},contentStyle:r},l))},exports.ExpandableText=function(t){var n=t.title,r=t.children,l=t.defaultOpen,o=void 0!==l&&l,u=t.contentStyle,s=t.titleElement,p=void 0===s?"Heading5":s,f=i(t,S),g=e.useRandomId("eds-expandable-text"),x=d.default.useState(o),v=x[0],E=x[1],b=d.default.useMemo((function(){return function(e){switch(e){case"Heading5":default:return a.Heading5;case"Paragraph":return a.Paragraph;case"SubParagraph":return a.SubParagraph}}(p)}),[p]);return d.default.createElement(d.default.Fragment,null,d.default.createElement(O,c({open:v,onToggle:function(){return E((function(e){return!e}))},"aria-controls":v?g:void 0,as:b},f),n),d.default.createElement(m,c({className:"eds-expandable-text__content",id:g,open:v,style:u},f),r))},exports.ExpandableTextButton=O,exports.useAccordion=p;
|
|
2
2
|
//# sourceMappingURL=expand.cjs.production.min.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"expand.cjs.production.min.js","sources":["../src/Accordion.tsx","../src/BaseExpand.tsx","../src/ExpandArrow.tsx","../src/BaseExpandablePanel.tsx","../src/ExpandableTextButton.tsx","../src/index.tsx","../src/AccordionItem.tsx","../src/ExpandablePanel.tsx","../src/ExpandableText.tsx"],"sourcesContent":["import React from 'react';\n\ntype Id = string | null;\ntype AccordionContextType = [Id, React.Dispatch<React.SetStateAction<Id>>];\nconst AccordionContext = React.createContext<AccordionContextType | null>(null);\n\nexport type AccordionProps = {\n /** To eller flere AccordionItem-komponenter */\n children: React.ReactNode;\n [key: string]: any;\n};\n\nexport const Accordion: React.FC<AccordionProps> = ({ ...rest }) => {\n const currentlyOpenState = React.useState<Id>(null);\n return <AccordionContext.Provider value={currentlyOpenState} {...rest} />;\n};\n\ntype UseAccordionArgs = {\n id: Id;\n defaultOpen?: boolean;\n};\n\nexport const useAccordion: ({ id, defaultOpen }: UseAccordionArgs) => {\n isOpen: boolean;\n toggle: () => void;\n} = ({ id, defaultOpen }: UseAccordionArgs) => {\n const contextValue = React.useContext(AccordionContext);\n if (!contextValue) {\n throw new Error('You need to wrap your AccordionItem inside an Accordion');\n }\n\n const [openId, setOpenId] = contextValue;\n\n React.useEffect(() => {\n if (defaultOpen) {\n setOpenId(id);\n }\n }, [defaultOpen, id, setOpenId]);\n\n const isOpen = openId === id;\n\n return {\n isOpen,\n toggle: () => setOpenId(isOpen ? null : id),\n };\n};\n","import React from 'react';\n\nimport { UnmountClosed } from 'react-collapse';\n\ntype BaseExpandProps = {\n /** Innholdet som skal være expandable */\n children: React.ReactNode;\n /** Boolean for om innholdet vises eller ikke */\n open: boolean;\n [key: string]: any;\n};\nexport const BaseExpand: React.FC<BaseExpandProps> = ({ open, ...rest }) => {\n return (\n <UnmountClosed isOpened={open}>\n <div {...rest} />\n </UnmountClosed>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { DownArrowIcon } from '@entur/icons';\nimport './ExpandArrow.scss';\n\ntype ExpandArrowProps = {\n /** Om innholdet er åpent eller ikke, som bestemmer retningen på pila\n * @default false\n */\n open?: boolean;\n /** Ekstra klassenavn */\n className?: string;\n [key: string]: any;\n};\n\nexport const ExpandArrow: React.FC<ExpandArrowProps> = ({\n open = false,\n className,\n ...rest\n}) => {\n return (\n <DownArrowIcon\n className={classNames(className, 'eds-expandable-arrow', {\n 'eds-expandable-arrow--open': open,\n })}\n {...rest}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport classNames from 'classnames';\nimport { Heading5 } from '@entur/typography';\nimport { BaseExpand } from './BaseExpand';\n\nimport './BaseExpandablePanel.scss';\nimport { ExpandArrow } from './ExpandArrow';\n\ntype BaseExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** IDen til expand-panelet */\n id: string;\n /** Prop for om innholdet er åpent */\n open: boolean;\n /** Funksjonen som styrer åpningen av BaseExpandablePanel */\n onToggle: () => void;\n /** Styling som sendes til innholdet av BaseExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const BaseExpandablePanel: React.FC<BaseExpandablePanelProps> = ({\n title,\n children,\n className,\n id,\n open,\n onToggle,\n contentStyle,\n ...rest\n}) => {\n return (\n <div className={classNames('eds-expandable-panel', className)}>\n <button\n type=\"button\"\n className=\"eds-expandable-panel__trigger\"\n onClick={onToggle}\n aria-expanded={open}\n aria-controls={open ? id : undefined}\n {...rest}\n >\n <span className=\"eds-expandable-panel__grid\">\n <Heading5 margin=\"none\" as=\"span\">\n {title}\n </Heading5>\n <span className=\"eds-expandable-panel__icon-container\">\n <ExpandArrow open={open} />\n </span>\n </span>\n </button>\n <BaseExpand\n className=\"eds-expandable-panel__content\"\n id={id}\n open={open}\n style={contentStyle}\n >\n {children}\n </BaseExpand>\n </div>\n );\n};\n","import React from 'react';\nimport { Heading5 } from '@entur/typography';\nimport { ExpandArrow } from './ExpandArrow';\n\nexport type ExandableTextButtonProps = {\n children: React.ReactNode;\n /** Prop for om innholdet er åpent */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableTextButton */\n onToggle: () => void;\n /** Den typografiske komponenten for tittelen\n * @default Heading5\n */\n as?: React.ElementType;\n [key: string]: any;\n};\n\nexport const ExpandableTextButton: React.FC<ExandableTextButtonProps> = ({\n children,\n open,\n onToggle,\n as: Component = Heading5,\n ...rest\n}) => {\n return (\n <button\n className=\"eds-expandable-text__trigger\"\n aria-expanded={open}\n type=\"button\"\n onClick={onToggle}\n {...rest}\n >\n <Component as=\"span\">{children}</Component>\n <ExpandArrow open={open} className=\"eds-expandable-text__arrow\" inline />\n </button>\n );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('expand', 'typography', 'icons');\n\nexport * from './Accordion';\nexport * from './AccordionItem';\nexport * from './ExpandablePanel';\nexport * from './BaseExpand';\nexport * from './ExpandableText';\nexport * from './ExpandableTextButton';\nexport * from './ExpandArrow';\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\nimport { useAccordion } from './Accordion';\n\nexport type AccordionItemProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand AccordionItem skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Styling som sendes til innholdet av AccordionItem */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const AccordionItem: React.FC<AccordionItemProps> = ({\n defaultOpen = false,\n id: overrideId,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-accordion-item');\n const id = overrideId || randomId;\n const { isOpen, toggle } = useAccordion({ id, defaultOpen });\n\n return (\n <BaseExpandablePanel\n {...rest}\n contentStyle={contentStyle}\n id={id}\n onToggle={toggle}\n open={isOpen}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\n\nexport type ExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandablePanel skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Funksjonen som styrer åpningen av ExpandablePanel */\n onToggle?: () => void;\n /** Styling som sendes til innholdet av ExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const ExpandablePanel: React.FC<ExpandablePanelProps> = ({\n defaultOpen = false,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable');\n\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n return (\n <BaseExpandablePanel\n id={randomId}\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n contentStyle={contentStyle}\n {...rest}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { ExpandableTextButton } from './ExpandableTextButton';\nimport { BaseExpand } from './BaseExpand';\nimport { Heading5, Paragraph, SubParagraph } from '@entur/typography';\nimport './ExpandableText.scss';\n\nexport type ExpandableTextProps = {\n /** Teksten som skal \"vises\" */\n title: string;\n /** Innholdet som skal vises under linken */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandableText skal ha som default (med mindre den er kontrollert)\n * @default false\n */\n defaultOpen?: boolean;\n /** Prop for om innholdet er åpent. Brukes hvis du vil kontrollere ExpandableText, sammen med onToggle */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableText */\n onToggle?: () => void;\n /**Styling som sendes til innholdet av ExpandableText */\n contentStyle?: CSSProperties;\n /** Hvilket typografisk element tittelen er\n * @default \"Heading5\"\n */\n titleElement?: 'Heading5' | 'Paragraph' | 'SubParagraph';\n [key: string]: any;\n};\n\nexport const ExpandableText: React.FC<ExpandableTextProps> = ({\n title,\n children,\n defaultOpen = false,\n contentStyle,\n titleElement = 'Heading5',\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable-text');\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n const Element: React.ElementType = React.useMemo(\n () => GetTypographyComponent(titleElement),\n [titleElement],\n );\n\n return (\n <>\n <ExpandableTextButton\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n aria-controls={isOpen ? randomId : undefined}\n as={Element}\n {...rest}\n >\n {title}\n </ExpandableTextButton>\n <BaseExpand\n className=\"eds-expandable-text__content\"\n id={randomId}\n open={isOpen}\n style={contentStyle}\n {...rest}\n >\n {children}\n </BaseExpand>\n </>\n );\n};\n\nfunction GetTypographyComponent(\n element: 'Heading5' | 'Paragraph' | 'SubParagraph',\n) {\n switch (element) {\n case 'Heading5':\n return Heading5;\n case 'Paragraph':\n return Paragraph;\n case 'SubParagraph':\n return SubParagraph;\n default:\n return Heading5;\n }\n}\n"],"names":["AccordionContext","React","createContext","useAccordion","id","defaultOpen","contextValue","useContext","Error","openId","setOpenId","useEffect","isOpen","toggle","BaseExpand","open","rest","UnmountClosed","isOpened","ExpandArrow","className","DownArrowIcon","classNames","BaseExpandablePanel","title","children","onToggle","contentStyle","type","onClick","undefined","Heading5","margin","as","style","ExpandableTextButton","_ref$as","Component","inline","warnAboutMissingStyles","currentlyOpenState","useState","Provider","value","overrideId","randomId","useRandomId","setOpen","prev","_ref$defaultOpen","_ref$titleElement","titleElement","Element","useMemo","element","Paragraph","SubParagraph","GetTypographyComponent"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"expand.cjs.production.min.js","sources":["../src/Accordion.tsx","../src/BaseExpand.tsx","../src/ExpandArrow.tsx","../src/BaseExpandablePanel.tsx","../src/ExpandableTextButton.tsx","../src/index.tsx","../src/AccordionItem.tsx","../src/ExpandablePanel.tsx","../src/ExpandableText.tsx"],"sourcesContent":["import React from 'react';\n\ntype Id = string | null;\ntype AccordionContextType = [Id, React.Dispatch<React.SetStateAction<Id>>];\nconst AccordionContext = React.createContext<AccordionContextType | null>(null);\n\nexport type AccordionProps = {\n /** To eller flere AccordionItem-komponenter */\n children: React.ReactNode;\n [key: string]: any;\n};\n\nexport const Accordion: React.FC<AccordionProps> = ({ ...rest }) => {\n const currentlyOpenState = React.useState<Id>(null);\n return <AccordionContext.Provider value={currentlyOpenState} {...rest} />;\n};\n\ntype UseAccordionArgs = {\n id: Id;\n defaultOpen?: boolean;\n};\n\nexport const useAccordion: ({ id, defaultOpen }: UseAccordionArgs) => {\n isOpen: boolean;\n toggle: () => void;\n} = ({ id, defaultOpen }: UseAccordionArgs) => {\n const contextValue = React.useContext(AccordionContext);\n if (!contextValue) {\n throw new Error('You need to wrap your AccordionItem inside an Accordion');\n }\n\n const [openId, setOpenId] = contextValue;\n\n React.useEffect(() => {\n if (defaultOpen) {\n setOpenId(id);\n }\n }, [defaultOpen, id, setOpenId]);\n\n const isOpen = openId === id;\n\n return {\n isOpen,\n toggle: () => setOpenId(isOpen ? null : id),\n };\n};\n","import React from 'react';\n\nimport { UnmountClosed } from 'react-collapse';\n\ntype BaseExpandProps = {\n /** Innholdet som skal være expandable */\n children: React.ReactNode;\n /** Boolean for om innholdet vises eller ikke */\n open: boolean;\n [key: string]: any;\n};\nexport const BaseExpand: React.FC<BaseExpandProps> = ({ open, ...rest }) => {\n return (\n <UnmountClosed isOpened={open}>\n <div {...rest} />\n </UnmountClosed>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { DownArrowIcon } from '@entur/icons';\nimport './ExpandArrow.scss';\n\ntype ExpandArrowProps = {\n /** Om innholdet er åpent eller ikke, som bestemmer retningen på pila\n * @default false\n */\n open?: boolean;\n /** Ekstra klassenavn */\n className?: string;\n [key: string]: any;\n};\n\nexport const ExpandArrow: React.FC<ExpandArrowProps> = ({\n open = false,\n className,\n ...rest\n}) => {\n return (\n <DownArrowIcon\n className={classNames(className, 'eds-expandable-arrow', {\n 'eds-expandable-arrow--open': open,\n })}\n {...rest}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport classNames from 'classnames';\nimport { Heading5 } from '@entur/typography';\nimport { BaseExpand } from './BaseExpand';\n\nimport './BaseExpandablePanel.scss';\nimport { ExpandArrow } from './ExpandArrow';\n\ntype BaseExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** IDen til expand-panelet */\n id: string;\n /** Prop for om innholdet er åpent */\n open: boolean;\n /** Funksjonen som styrer åpningen av BaseExpandablePanel */\n onToggle: () => void;\n /** Styling som sendes til innholdet av BaseExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const BaseExpandablePanel: React.FC<BaseExpandablePanelProps> = ({\n title,\n children,\n className,\n id,\n open,\n onToggle,\n contentStyle,\n ...rest\n}) => {\n return (\n <div className={classNames('eds-expandable-panel', className)}>\n <button\n type=\"button\"\n className=\"eds-expandable-panel__trigger\"\n onClick={onToggle}\n aria-expanded={open}\n aria-controls={open ? id : undefined}\n {...rest}\n >\n <span className=\"eds-expandable-panel__grid\">\n <Heading5 margin=\"none\" as=\"span\">\n {title}\n </Heading5>\n <span className=\"eds-expandable-panel__icon-container\">\n <ExpandArrow open={open} />\n </span>\n </span>\n </button>\n <BaseExpand\n className=\"eds-expandable-panel__content\"\n id={id}\n open={open}\n style={contentStyle}\n >\n {children}\n </BaseExpand>\n </div>\n );\n};\n","import React from 'react';\nimport { Heading5 } from '@entur/typography';\nimport { ExpandArrow } from './ExpandArrow';\n\nexport type ExandableTextButtonProps = {\n children: React.ReactNode;\n /** Prop for om innholdet er åpent */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableTextButton */\n onToggle: () => void;\n /** Den typografiske komponenten for tittelen\n * @default Heading5\n */\n as?: React.ElementType;\n [key: string]: any;\n};\n\nexport const ExpandableTextButton: React.FC<ExandableTextButtonProps> = ({\n children,\n open,\n onToggle,\n as: Component = Heading5,\n ...rest\n}) => {\n return (\n <button\n className=\"eds-expandable-text__trigger\"\n aria-expanded={open}\n type=\"button\"\n onClick={onToggle}\n {...rest}\n >\n <Component as=\"span\">{children}</Component>\n <ExpandArrow open={open} className=\"eds-expandable-text__arrow\" inline />\n </button>\n );\n};\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('expand', 'typography', 'icons');\n\nexport * from './Accordion';\nexport * from './AccordionItem';\nexport * from './ExpandablePanel';\nexport * from './BaseExpand';\nexport * from './ExpandableText';\nexport * from './ExpandableTextButton';\nexport * from './ExpandArrow';\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\nimport { useAccordion } from './Accordion';\n\nexport type AccordionItemProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand AccordionItem skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Styling som sendes til innholdet av AccordionItem */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const AccordionItem: React.FC<AccordionItemProps> = ({\n defaultOpen = false,\n id: overrideId,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-accordion-item');\n const id = overrideId || randomId;\n const { isOpen, toggle } = useAccordion({ id, defaultOpen });\n\n return (\n <BaseExpandablePanel\n {...rest}\n contentStyle={contentStyle}\n id={id}\n onToggle={toggle}\n open={isOpen}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\n\nexport type ExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandablePanel skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Funksjonen som styrer åpningen av ExpandablePanel */\n onToggle?: () => void;\n /** Styling som sendes til innholdet av ExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const ExpandablePanel: React.FC<ExpandablePanelProps> = ({\n defaultOpen = false,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable');\n\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n return (\n <BaseExpandablePanel\n id={randomId}\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n contentStyle={contentStyle}\n {...rest}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { ExpandableTextButton } from './ExpandableTextButton';\nimport { BaseExpand } from './BaseExpand';\nimport { Heading5, Paragraph, SubParagraph } from '@entur/typography';\nimport './ExpandableText.scss';\n\nexport type ExpandableTextProps = {\n /** Teksten som skal \"vises\" */\n title: string;\n /** Innholdet som skal vises under linken */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandableText skal ha som default (med mindre den er kontrollert)\n * @default false\n */\n defaultOpen?: boolean;\n /** Prop for om innholdet er åpent. Brukes hvis du vil kontrollere ExpandableText, sammen med onToggle */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableText */\n onToggle?: () => void;\n /**Styling som sendes til innholdet av ExpandableText */\n contentStyle?: CSSProperties;\n /** Hvilket typografisk element tittelen er\n * @default \"Heading5\"\n */\n titleElement?: 'Heading5' | 'Paragraph' | 'SubParagraph';\n [key: string]: any;\n};\n\nexport const ExpandableText: React.FC<ExpandableTextProps> = ({\n title,\n children,\n defaultOpen = false,\n contentStyle,\n titleElement = 'Heading5',\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable-text');\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n const Element: React.ElementType = React.useMemo(\n () => GetTypographyComponent(titleElement),\n [titleElement],\n );\n\n return (\n <>\n <ExpandableTextButton\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n aria-controls={isOpen ? randomId : undefined}\n as={Element}\n {...rest}\n >\n {title}\n </ExpandableTextButton>\n <BaseExpand\n className=\"eds-expandable-text__content\"\n id={randomId}\n open={isOpen}\n style={contentStyle}\n {...rest}\n >\n {children}\n </BaseExpand>\n </>\n );\n};\n\nfunction GetTypographyComponent(\n element: 'Heading5' | 'Paragraph' | 'SubParagraph',\n) {\n switch (element) {\n case 'Heading5':\n return Heading5;\n case 'Paragraph':\n return Paragraph;\n case 'SubParagraph':\n return SubParagraph;\n default:\n return Heading5;\n }\n}\n"],"names":["AccordionContext","React","createContext","useAccordion","id","defaultOpen","contextValue","useContext","Error","openId","setOpenId","useEffect","isOpen","toggle","BaseExpand","open","rest","UnmountClosed","isOpened","ExpandArrow","className","DownArrowIcon","classNames","BaseExpandablePanel","title","children","onToggle","contentStyle","type","onClick","undefined","Heading5","margin","as","style","ExpandableTextButton","Component","inline","warnAboutMissingStyles","currentlyOpenState","useState","Provider","value","overrideId","randomId","useRandomId","setOpen","prev","titleElement","Element","useMemo","element","Paragraph","SubParagraph","GetTypographyComponent"],"mappings":"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"}
|
package/dist/expand.esm.js
CHANGED
|
@@ -9,35 +9,39 @@ function _extends() {
|
|
|
9
9
|
_extends = Object.assign || function (target) {
|
|
10
10
|
for (var i = 1; i < arguments.length; i++) {
|
|
11
11
|
var source = arguments[i];
|
|
12
|
+
|
|
12
13
|
for (var key in source) {
|
|
13
14
|
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
14
15
|
target[key] = source[key];
|
|
15
16
|
}
|
|
16
17
|
}
|
|
17
18
|
}
|
|
19
|
+
|
|
18
20
|
return target;
|
|
19
21
|
};
|
|
22
|
+
|
|
20
23
|
return _extends.apply(this, arguments);
|
|
21
24
|
}
|
|
22
|
-
|
|
23
|
-
if (obj == null) throw new TypeError("Cannot destructure undefined");
|
|
24
|
-
}
|
|
25
|
+
|
|
25
26
|
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
26
27
|
if (source == null) return {};
|
|
27
28
|
var target = {};
|
|
28
29
|
var sourceKeys = Object.keys(source);
|
|
29
30
|
var key, i;
|
|
31
|
+
|
|
30
32
|
for (i = 0; i < sourceKeys.length; i++) {
|
|
31
33
|
key = sourceKeys[i];
|
|
32
34
|
if (excluded.indexOf(key) >= 0) continue;
|
|
33
35
|
target[key] = source[key];
|
|
34
36
|
}
|
|
37
|
+
|
|
35
38
|
return target;
|
|
36
39
|
}
|
|
37
40
|
|
|
38
41
|
var AccordionContext = /*#__PURE__*/React.createContext(null);
|
|
39
42
|
var Accordion = function Accordion(_ref) {
|
|
40
|
-
var rest = _extends({},
|
|
43
|
+
var rest = _extends({}, _ref);
|
|
44
|
+
|
|
41
45
|
var currentlyOpenState = React.useState(null);
|
|
42
46
|
return React.createElement(AccordionContext.Provider, _extends({
|
|
43
47
|
value: currentlyOpenState
|
|
@@ -45,13 +49,15 @@ var Accordion = function Accordion(_ref) {
|
|
|
45
49
|
};
|
|
46
50
|
var useAccordion = function useAccordion(_ref2) {
|
|
47
51
|
var id = _ref2.id,
|
|
48
|
-
|
|
52
|
+
defaultOpen = _ref2.defaultOpen;
|
|
49
53
|
var contextValue = React.useContext(AccordionContext);
|
|
54
|
+
|
|
50
55
|
if (!contextValue) {
|
|
51
56
|
throw new Error('You need to wrap your AccordionItem inside an Accordion');
|
|
52
57
|
}
|
|
58
|
+
|
|
53
59
|
var openId = contextValue[0],
|
|
54
|
-
|
|
60
|
+
setOpenId = contextValue[1];
|
|
55
61
|
React.useEffect(function () {
|
|
56
62
|
if (defaultOpen) {
|
|
57
63
|
setOpenId(id);
|
|
@@ -69,7 +75,8 @@ var useAccordion = function useAccordion(_ref2) {
|
|
|
69
75
|
var _excluded$6 = ["open"];
|
|
70
76
|
var BaseExpand = function BaseExpand(_ref) {
|
|
71
77
|
var open = _ref.open,
|
|
72
|
-
|
|
78
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$6);
|
|
79
|
+
|
|
73
80
|
return React.createElement(UnmountClosed, {
|
|
74
81
|
isOpened: open
|
|
75
82
|
}, React.createElement("div", _extends({}, rest)));
|
|
@@ -78,9 +85,10 @@ var BaseExpand = function BaseExpand(_ref) {
|
|
|
78
85
|
var _excluded$5 = ["open", "className"];
|
|
79
86
|
var ExpandArrow = function ExpandArrow(_ref) {
|
|
80
87
|
var _ref$open = _ref.open,
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
88
|
+
open = _ref$open === void 0 ? false : _ref$open,
|
|
89
|
+
className = _ref.className,
|
|
90
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$5);
|
|
91
|
+
|
|
84
92
|
return React.createElement(DownArrowIcon, _extends({
|
|
85
93
|
className: classNames(className, 'eds-expandable-arrow', {
|
|
86
94
|
'eds-expandable-arrow--open': open
|
|
@@ -91,13 +99,14 @@ var ExpandArrow = function ExpandArrow(_ref) {
|
|
|
91
99
|
var _excluded$4 = ["title", "children", "className", "id", "open", "onToggle", "contentStyle"];
|
|
92
100
|
var BaseExpandablePanel = function BaseExpandablePanel(_ref) {
|
|
93
101
|
var title = _ref.title,
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
102
|
+
children = _ref.children,
|
|
103
|
+
className = _ref.className,
|
|
104
|
+
id = _ref.id,
|
|
105
|
+
open = _ref.open,
|
|
106
|
+
onToggle = _ref.onToggle,
|
|
107
|
+
contentStyle = _ref.contentStyle,
|
|
108
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$4);
|
|
109
|
+
|
|
101
110
|
return React.createElement("div", {
|
|
102
111
|
className: classNames('eds-expandable-panel', className)
|
|
103
112
|
}, React.createElement("button", _extends({
|
|
@@ -126,18 +135,21 @@ var BaseExpandablePanel = function BaseExpandablePanel(_ref) {
|
|
|
126
135
|
var _excluded$3 = ["defaultOpen", "id", "contentStyle"];
|
|
127
136
|
var AccordionItem = function AccordionItem(_ref) {
|
|
128
137
|
var _ref$defaultOpen = _ref.defaultOpen,
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
138
|
+
defaultOpen = _ref$defaultOpen === void 0 ? false : _ref$defaultOpen,
|
|
139
|
+
overrideId = _ref.id,
|
|
140
|
+
contentStyle = _ref.contentStyle,
|
|
141
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
|
|
142
|
+
|
|
133
143
|
var randomId = useRandomId('eds-accordion-item');
|
|
134
144
|
var id = overrideId || randomId;
|
|
145
|
+
|
|
135
146
|
var _useAccordion = useAccordion({
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
147
|
+
id: id,
|
|
148
|
+
defaultOpen: defaultOpen
|
|
149
|
+
}),
|
|
150
|
+
isOpen = _useAccordion.isOpen,
|
|
151
|
+
toggle = _useAccordion.toggle;
|
|
152
|
+
|
|
141
153
|
return React.createElement(BaseExpandablePanel, _extends({}, rest, {
|
|
142
154
|
contentStyle: contentStyle,
|
|
143
155
|
id: id,
|
|
@@ -149,13 +161,16 @@ var AccordionItem = function AccordionItem(_ref) {
|
|
|
149
161
|
var _excluded$2 = ["defaultOpen", "contentStyle"];
|
|
150
162
|
var ExpandablePanel = function ExpandablePanel(_ref) {
|
|
151
163
|
var _ref$defaultOpen = _ref.defaultOpen,
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
164
|
+
defaultOpen = _ref$defaultOpen === void 0 ? false : _ref$defaultOpen,
|
|
165
|
+
contentStyle = _ref.contentStyle,
|
|
166
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$2);
|
|
167
|
+
|
|
155
168
|
var randomId = useRandomId('eds-expandable');
|
|
169
|
+
|
|
156
170
|
var _React$useState = React.useState(defaultOpen),
|
|
157
|
-
|
|
158
|
-
|
|
171
|
+
isOpen = _React$useState[0],
|
|
172
|
+
setOpen = _React$useState[1];
|
|
173
|
+
|
|
159
174
|
return React.createElement(BaseExpandablePanel, _extends({
|
|
160
175
|
id: randomId,
|
|
161
176
|
open: isOpen,
|
|
@@ -171,11 +186,12 @@ var ExpandablePanel = function ExpandablePanel(_ref) {
|
|
|
171
186
|
var _excluded$1 = ["children", "open", "onToggle", "as"];
|
|
172
187
|
var ExpandableTextButton = function ExpandableTextButton(_ref) {
|
|
173
188
|
var children = _ref.children,
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
189
|
+
open = _ref.open,
|
|
190
|
+
onToggle = _ref.onToggle,
|
|
191
|
+
_ref$as = _ref.as,
|
|
192
|
+
Component = _ref$as === void 0 ? Heading5 : _ref$as,
|
|
193
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded$1);
|
|
194
|
+
|
|
179
195
|
return React.createElement("button", _extends({
|
|
180
196
|
className: "eds-expandable-text__trigger",
|
|
181
197
|
"aria-expanded": open,
|
|
@@ -193,17 +209,20 @@ var ExpandableTextButton = function ExpandableTextButton(_ref) {
|
|
|
193
209
|
var _excluded = ["title", "children", "defaultOpen", "contentStyle", "titleElement"];
|
|
194
210
|
var ExpandableText = function ExpandableText(_ref) {
|
|
195
211
|
var title = _ref.title,
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
212
|
+
children = _ref.children,
|
|
213
|
+
_ref$defaultOpen = _ref.defaultOpen,
|
|
214
|
+
defaultOpen = _ref$defaultOpen === void 0 ? false : _ref$defaultOpen,
|
|
215
|
+
contentStyle = _ref.contentStyle,
|
|
216
|
+
_ref$titleElement = _ref.titleElement,
|
|
217
|
+
titleElement = _ref$titleElement === void 0 ? 'Heading5' : _ref$titleElement,
|
|
218
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
219
|
+
|
|
203
220
|
var randomId = useRandomId('eds-expandable-text');
|
|
221
|
+
|
|
204
222
|
var _React$useState = React.useState(defaultOpen),
|
|
205
|
-
|
|
206
|
-
|
|
223
|
+
isOpen = _React$useState[0],
|
|
224
|
+
setOpen = _React$useState[1];
|
|
225
|
+
|
|
207
226
|
var Element = React.useMemo(function () {
|
|
208
227
|
return GetTypographyComponent(titleElement);
|
|
209
228
|
}, [titleElement]);
|
|
@@ -223,14 +242,18 @@ var ExpandableText = function ExpandableText(_ref) {
|
|
|
223
242
|
style: contentStyle
|
|
224
243
|
}, rest), children));
|
|
225
244
|
};
|
|
245
|
+
|
|
226
246
|
function GetTypographyComponent(element) {
|
|
227
247
|
switch (element) {
|
|
228
248
|
case 'Heading5':
|
|
229
249
|
return Heading5;
|
|
250
|
+
|
|
230
251
|
case 'Paragraph':
|
|
231
252
|
return Paragraph;
|
|
253
|
+
|
|
232
254
|
case 'SubParagraph':
|
|
233
255
|
return SubParagraph;
|
|
256
|
+
|
|
234
257
|
default:
|
|
235
258
|
return Heading5;
|
|
236
259
|
}
|
package/dist/expand.esm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"expand.esm.js","sources":["../src/Accordion.tsx","../src/BaseExpand.tsx","../src/ExpandArrow.tsx","../src/BaseExpandablePanel.tsx","../src/AccordionItem.tsx","../src/ExpandablePanel.tsx","../src/ExpandableTextButton.tsx","../src/ExpandableText.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\n\ntype Id = string | null;\ntype AccordionContextType = [Id, React.Dispatch<React.SetStateAction<Id>>];\nconst AccordionContext = React.createContext<AccordionContextType | null>(null);\n\nexport type AccordionProps = {\n /** To eller flere AccordionItem-komponenter */\n children: React.ReactNode;\n [key: string]: any;\n};\n\nexport const Accordion: React.FC<AccordionProps> = ({ ...rest }) => {\n const currentlyOpenState = React.useState<Id>(null);\n return <AccordionContext.Provider value={currentlyOpenState} {...rest} />;\n};\n\ntype UseAccordionArgs = {\n id: Id;\n defaultOpen?: boolean;\n};\n\nexport const useAccordion: ({ id, defaultOpen }: UseAccordionArgs) => {\n isOpen: boolean;\n toggle: () => void;\n} = ({ id, defaultOpen }: UseAccordionArgs) => {\n const contextValue = React.useContext(AccordionContext);\n if (!contextValue) {\n throw new Error('You need to wrap your AccordionItem inside an Accordion');\n }\n\n const [openId, setOpenId] = contextValue;\n\n React.useEffect(() => {\n if (defaultOpen) {\n setOpenId(id);\n }\n }, [defaultOpen, id, setOpenId]);\n\n const isOpen = openId === id;\n\n return {\n isOpen,\n toggle: () => setOpenId(isOpen ? null : id),\n };\n};\n","import React from 'react';\n\nimport { UnmountClosed } from 'react-collapse';\n\ntype BaseExpandProps = {\n /** Innholdet som skal være expandable */\n children: React.ReactNode;\n /** Boolean for om innholdet vises eller ikke */\n open: boolean;\n [key: string]: any;\n};\nexport const BaseExpand: React.FC<BaseExpandProps> = ({ open, ...rest }) => {\n return (\n <UnmountClosed isOpened={open}>\n <div {...rest} />\n </UnmountClosed>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { DownArrowIcon } from '@entur/icons';\nimport './ExpandArrow.scss';\n\ntype ExpandArrowProps = {\n /** Om innholdet er åpent eller ikke, som bestemmer retningen på pila\n * @default false\n */\n open?: boolean;\n /** Ekstra klassenavn */\n className?: string;\n [key: string]: any;\n};\n\nexport const ExpandArrow: React.FC<ExpandArrowProps> = ({\n open = false,\n className,\n ...rest\n}) => {\n return (\n <DownArrowIcon\n className={classNames(className, 'eds-expandable-arrow', {\n 'eds-expandable-arrow--open': open,\n })}\n {...rest}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport classNames from 'classnames';\nimport { Heading5 } from '@entur/typography';\nimport { BaseExpand } from './BaseExpand';\n\nimport './BaseExpandablePanel.scss';\nimport { ExpandArrow } from './ExpandArrow';\n\ntype BaseExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** IDen til expand-panelet */\n id: string;\n /** Prop for om innholdet er åpent */\n open: boolean;\n /** Funksjonen som styrer åpningen av BaseExpandablePanel */\n onToggle: () => void;\n /** Styling som sendes til innholdet av BaseExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const BaseExpandablePanel: React.FC<BaseExpandablePanelProps> = ({\n title,\n children,\n className,\n id,\n open,\n onToggle,\n contentStyle,\n ...rest\n}) => {\n return (\n <div className={classNames('eds-expandable-panel', className)}>\n <button\n type=\"button\"\n className=\"eds-expandable-panel__trigger\"\n onClick={onToggle}\n aria-expanded={open}\n aria-controls={open ? id : undefined}\n {...rest}\n >\n <span className=\"eds-expandable-panel__grid\">\n <Heading5 margin=\"none\" as=\"span\">\n {title}\n </Heading5>\n <span className=\"eds-expandable-panel__icon-container\">\n <ExpandArrow open={open} />\n </span>\n </span>\n </button>\n <BaseExpand\n className=\"eds-expandable-panel__content\"\n id={id}\n open={open}\n style={contentStyle}\n >\n {children}\n </BaseExpand>\n </div>\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\nimport { useAccordion } from './Accordion';\n\nexport type AccordionItemProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand AccordionItem skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Styling som sendes til innholdet av AccordionItem */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const AccordionItem: React.FC<AccordionItemProps> = ({\n defaultOpen = false,\n id: overrideId,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-accordion-item');\n const id = overrideId || randomId;\n const { isOpen, toggle } = useAccordion({ id, defaultOpen });\n\n return (\n <BaseExpandablePanel\n {...rest}\n contentStyle={contentStyle}\n id={id}\n onToggle={toggle}\n open={isOpen}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\n\nexport type ExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandablePanel skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Funksjonen som styrer åpningen av ExpandablePanel */\n onToggle?: () => void;\n /** Styling som sendes til innholdet av ExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const ExpandablePanel: React.FC<ExpandablePanelProps> = ({\n defaultOpen = false,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable');\n\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n return (\n <BaseExpandablePanel\n id={randomId}\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n contentStyle={contentStyle}\n {...rest}\n />\n );\n};\n","import React from 'react';\nimport { Heading5 } from '@entur/typography';\nimport { ExpandArrow } from './ExpandArrow';\n\nexport type ExandableTextButtonProps = {\n children: React.ReactNode;\n /** Prop for om innholdet er åpent */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableTextButton */\n onToggle: () => void;\n /** Den typografiske komponenten for tittelen\n * @default Heading5\n */\n as?: React.ElementType;\n [key: string]: any;\n};\n\nexport const ExpandableTextButton: React.FC<ExandableTextButtonProps> = ({\n children,\n open,\n onToggle,\n as: Component = Heading5,\n ...rest\n}) => {\n return (\n <button\n className=\"eds-expandable-text__trigger\"\n aria-expanded={open}\n type=\"button\"\n onClick={onToggle}\n {...rest}\n >\n <Component as=\"span\">{children}</Component>\n <ExpandArrow open={open} className=\"eds-expandable-text__arrow\" inline />\n </button>\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { ExpandableTextButton } from './ExpandableTextButton';\nimport { BaseExpand } from './BaseExpand';\nimport { Heading5, Paragraph, SubParagraph } from '@entur/typography';\nimport './ExpandableText.scss';\n\nexport type ExpandableTextProps = {\n /** Teksten som skal \"vises\" */\n title: string;\n /** Innholdet som skal vises under linken */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandableText skal ha som default (med mindre den er kontrollert)\n * @default false\n */\n defaultOpen?: boolean;\n /** Prop for om innholdet er åpent. Brukes hvis du vil kontrollere ExpandableText, sammen med onToggle */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableText */\n onToggle?: () => void;\n /**Styling som sendes til innholdet av ExpandableText */\n contentStyle?: CSSProperties;\n /** Hvilket typografisk element tittelen er\n * @default \"Heading5\"\n */\n titleElement?: 'Heading5' | 'Paragraph' | 'SubParagraph';\n [key: string]: any;\n};\n\nexport const ExpandableText: React.FC<ExpandableTextProps> = ({\n title,\n children,\n defaultOpen = false,\n contentStyle,\n titleElement = 'Heading5',\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable-text');\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n const Element: React.ElementType = React.useMemo(\n () => GetTypographyComponent(titleElement),\n [titleElement],\n );\n\n return (\n <>\n <ExpandableTextButton\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n aria-controls={isOpen ? randomId : undefined}\n as={Element}\n {...rest}\n >\n {title}\n </ExpandableTextButton>\n <BaseExpand\n className=\"eds-expandable-text__content\"\n id={randomId}\n open={isOpen}\n style={contentStyle}\n {...rest}\n >\n {children}\n </BaseExpand>\n </>\n );\n};\n\nfunction GetTypographyComponent(\n element: 'Heading5' | 'Paragraph' | 'SubParagraph',\n) {\n switch (element) {\n case 'Heading5':\n return Heading5;\n case 'Paragraph':\n return Paragraph;\n case 'SubParagraph':\n return SubParagraph;\n default:\n return Heading5;\n }\n}\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('expand', 'typography', 'icons');\n\nexport * from './Accordion';\nexport * from './AccordionItem';\nexport * from './ExpandablePanel';\nexport * from './BaseExpand';\nexport * from './ExpandableText';\nexport * from './ExpandableTextButton';\nexport * from './ExpandArrow';\n"],"names":["AccordionContext","React","createContext","Accordion","rest","currentlyOpenState","useState","Provider","value","useAccordion","id","defaultOpen","contextValue","useContext","Error","openId","setOpenId","useEffect","isOpen","toggle","BaseExpand","open","UnmountClosed","isOpened","ExpandArrow","className","DownArrowIcon","classNames","BaseExpandablePanel","title","children","onToggle","contentStyle","type","onClick","undefined","Heading5","margin","as","style","AccordionItem","overrideId","randomId","useRandomId","ExpandablePanel","setOpen","prev","ExpandableTextButton","Component","inline","ExpandableText","titleElement","Element","useMemo","GetTypographyComponent","element","Paragraph","SubParagraph","warnAboutMissingStyles"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"expand.esm.js","sources":["../src/Accordion.tsx","../src/BaseExpand.tsx","../src/ExpandArrow.tsx","../src/BaseExpandablePanel.tsx","../src/AccordionItem.tsx","../src/ExpandablePanel.tsx","../src/ExpandableTextButton.tsx","../src/ExpandableText.tsx","../src/index.tsx"],"sourcesContent":["import React from 'react';\n\ntype Id = string | null;\ntype AccordionContextType = [Id, React.Dispatch<React.SetStateAction<Id>>];\nconst AccordionContext = React.createContext<AccordionContextType | null>(null);\n\nexport type AccordionProps = {\n /** To eller flere AccordionItem-komponenter */\n children: React.ReactNode;\n [key: string]: any;\n};\n\nexport const Accordion: React.FC<AccordionProps> = ({ ...rest }) => {\n const currentlyOpenState = React.useState<Id>(null);\n return <AccordionContext.Provider value={currentlyOpenState} {...rest} />;\n};\n\ntype UseAccordionArgs = {\n id: Id;\n defaultOpen?: boolean;\n};\n\nexport const useAccordion: ({ id, defaultOpen }: UseAccordionArgs) => {\n isOpen: boolean;\n toggle: () => void;\n} = ({ id, defaultOpen }: UseAccordionArgs) => {\n const contextValue = React.useContext(AccordionContext);\n if (!contextValue) {\n throw new Error('You need to wrap your AccordionItem inside an Accordion');\n }\n\n const [openId, setOpenId] = contextValue;\n\n React.useEffect(() => {\n if (defaultOpen) {\n setOpenId(id);\n }\n }, [defaultOpen, id, setOpenId]);\n\n const isOpen = openId === id;\n\n return {\n isOpen,\n toggle: () => setOpenId(isOpen ? null : id),\n };\n};\n","import React from 'react';\n\nimport { UnmountClosed } from 'react-collapse';\n\ntype BaseExpandProps = {\n /** Innholdet som skal være expandable */\n children: React.ReactNode;\n /** Boolean for om innholdet vises eller ikke */\n open: boolean;\n [key: string]: any;\n};\nexport const BaseExpand: React.FC<BaseExpandProps> = ({ open, ...rest }) => {\n return (\n <UnmountClosed isOpened={open}>\n <div {...rest} />\n </UnmountClosed>\n );\n};\n","import React from 'react';\nimport classNames from 'classnames';\nimport { DownArrowIcon } from '@entur/icons';\nimport './ExpandArrow.scss';\n\ntype ExpandArrowProps = {\n /** Om innholdet er åpent eller ikke, som bestemmer retningen på pila\n * @default false\n */\n open?: boolean;\n /** Ekstra klassenavn */\n className?: string;\n [key: string]: any;\n};\n\nexport const ExpandArrow: React.FC<ExpandArrowProps> = ({\n open = false,\n className,\n ...rest\n}) => {\n return (\n <DownArrowIcon\n className={classNames(className, 'eds-expandable-arrow', {\n 'eds-expandable-arrow--open': open,\n })}\n {...rest}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport classNames from 'classnames';\nimport { Heading5 } from '@entur/typography';\nimport { BaseExpand } from './BaseExpand';\n\nimport './BaseExpandablePanel.scss';\nimport { ExpandArrow } from './ExpandArrow';\n\ntype BaseExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** IDen til expand-panelet */\n id: string;\n /** Prop for om innholdet er åpent */\n open: boolean;\n /** Funksjonen som styrer åpningen av BaseExpandablePanel */\n onToggle: () => void;\n /** Styling som sendes til innholdet av BaseExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const BaseExpandablePanel: React.FC<BaseExpandablePanelProps> = ({\n title,\n children,\n className,\n id,\n open,\n onToggle,\n contentStyle,\n ...rest\n}) => {\n return (\n <div className={classNames('eds-expandable-panel', className)}>\n <button\n type=\"button\"\n className=\"eds-expandable-panel__trigger\"\n onClick={onToggle}\n aria-expanded={open}\n aria-controls={open ? id : undefined}\n {...rest}\n >\n <span className=\"eds-expandable-panel__grid\">\n <Heading5 margin=\"none\" as=\"span\">\n {title}\n </Heading5>\n <span className=\"eds-expandable-panel__icon-container\">\n <ExpandArrow open={open} />\n </span>\n </span>\n </button>\n <BaseExpand\n className=\"eds-expandable-panel__content\"\n id={id}\n open={open}\n style={contentStyle}\n >\n {children}\n </BaseExpand>\n </div>\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\nimport { useAccordion } from './Accordion';\n\nexport type AccordionItemProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand AccordionItem skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Styling som sendes til innholdet av AccordionItem */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const AccordionItem: React.FC<AccordionItemProps> = ({\n defaultOpen = false,\n id: overrideId,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-accordion-item');\n const id = overrideId || randomId;\n const { isOpen, toggle } = useAccordion({ id, defaultOpen });\n\n return (\n <BaseExpandablePanel\n {...rest}\n contentStyle={contentStyle}\n id={id}\n onToggle={toggle}\n open={isOpen}\n />\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { BaseExpandablePanel } from './BaseExpandablePanel';\n\nexport type ExpandablePanelProps = {\n /** Teksten som skal stå i panelet */\n title: React.ReactNode;\n /** Innholdet som skal vises under panelet */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandablePanel skal ha som default\n * @default false\n */\n defaultOpen?: boolean;\n /** Funksjonen som styrer åpningen av ExpandablePanel */\n onToggle?: () => void;\n /** Styling som sendes til innholdet av ExpandablePanel */\n contentStyle?: CSSProperties;\n [key: string]: any;\n};\nexport const ExpandablePanel: React.FC<ExpandablePanelProps> = ({\n defaultOpen = false,\n contentStyle,\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable');\n\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n return (\n <BaseExpandablePanel\n id={randomId}\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n contentStyle={contentStyle}\n {...rest}\n />\n );\n};\n","import React from 'react';\nimport { Heading5 } from '@entur/typography';\nimport { ExpandArrow } from './ExpandArrow';\n\nexport type ExandableTextButtonProps = {\n children: React.ReactNode;\n /** Prop for om innholdet er åpent */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableTextButton */\n onToggle: () => void;\n /** Den typografiske komponenten for tittelen\n * @default Heading5\n */\n as?: React.ElementType;\n [key: string]: any;\n};\n\nexport const ExpandableTextButton: React.FC<ExandableTextButtonProps> = ({\n children,\n open,\n onToggle,\n as: Component = Heading5,\n ...rest\n}) => {\n return (\n <button\n className=\"eds-expandable-text__trigger\"\n aria-expanded={open}\n type=\"button\"\n onClick={onToggle}\n {...rest}\n >\n <Component as=\"span\">{children}</Component>\n <ExpandArrow open={open} className=\"eds-expandable-text__arrow\" inline />\n </button>\n );\n};\n","import React, { CSSProperties } from 'react';\nimport { useRandomId } from '@entur/utils';\nimport { ExpandableTextButton } from './ExpandableTextButton';\nimport { BaseExpand } from './BaseExpand';\nimport { Heading5, Paragraph, SubParagraph } from '@entur/typography';\nimport './ExpandableText.scss';\n\nexport type ExpandableTextProps = {\n /** Teksten som skal \"vises\" */\n title: string;\n /** Innholdet som skal vises under linken */\n children: React.ReactNode;\n /** Hvilken tilstand ExpandableText skal ha som default (med mindre den er kontrollert)\n * @default false\n */\n defaultOpen?: boolean;\n /** Prop for om innholdet er åpent. Brukes hvis du vil kontrollere ExpandableText, sammen med onToggle */\n open?: boolean;\n /** Funksjonen som styrer åpningen av ExpandableText */\n onToggle?: () => void;\n /**Styling som sendes til innholdet av ExpandableText */\n contentStyle?: CSSProperties;\n /** Hvilket typografisk element tittelen er\n * @default \"Heading5\"\n */\n titleElement?: 'Heading5' | 'Paragraph' | 'SubParagraph';\n [key: string]: any;\n};\n\nexport const ExpandableText: React.FC<ExpandableTextProps> = ({\n title,\n children,\n defaultOpen = false,\n contentStyle,\n titleElement = 'Heading5',\n ...rest\n}) => {\n const randomId = useRandomId('eds-expandable-text');\n const [isOpen, setOpen] = React.useState(defaultOpen);\n\n const Element: React.ElementType = React.useMemo(\n () => GetTypographyComponent(titleElement),\n [titleElement],\n );\n\n return (\n <>\n <ExpandableTextButton\n open={isOpen}\n onToggle={() => setOpen(prev => !prev)}\n aria-controls={isOpen ? randomId : undefined}\n as={Element}\n {...rest}\n >\n {title}\n </ExpandableTextButton>\n <BaseExpand\n className=\"eds-expandable-text__content\"\n id={randomId}\n open={isOpen}\n style={contentStyle}\n {...rest}\n >\n {children}\n </BaseExpand>\n </>\n );\n};\n\nfunction GetTypographyComponent(\n element: 'Heading5' | 'Paragraph' | 'SubParagraph',\n) {\n switch (element) {\n case 'Heading5':\n return Heading5;\n case 'Paragraph':\n return Paragraph;\n case 'SubParagraph':\n return SubParagraph;\n default:\n return Heading5;\n }\n}\n","import { warnAboutMissingStyles } from '@entur/utils';\nimport './index.scss';\n\nwarnAboutMissingStyles('expand', 'typography', 'icons');\n\nexport * from './Accordion';\nexport * from './AccordionItem';\nexport * from './ExpandablePanel';\nexport * from './BaseExpand';\nexport * from './ExpandableText';\nexport * from './ExpandableTextButton';\nexport * from './ExpandArrow';\n"],"names":["AccordionContext","React","createContext","Accordion","rest","currentlyOpenState","useState","Provider","value","useAccordion","id","defaultOpen","contextValue","useContext","Error","openId","setOpenId","useEffect","isOpen","toggle","BaseExpand","open","UnmountClosed","isOpened","ExpandArrow","className","DownArrowIcon","classNames","BaseExpandablePanel","title","children","onToggle","contentStyle","type","onClick","undefined","Heading5","margin","as","style","AccordionItem","overrideId","randomId","useRandomId","ExpandablePanel","setOpen","prev","ExpandableTextButton","Component","inline","ExpandableText","titleElement","Element","useMemo","GetTypographyComponent","element","Paragraph","SubParagraph","warnAboutMissingStyles"],"mappings":"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"}
|
package/dist/styles.css
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@entur/expand",
|
|
3
|
-
"version": "3.3.
|
|
3
|
+
"version": "3.3.29",
|
|
4
4
|
"license": "EUPL-1.2",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/expand.esm.js",
|
|
@@ -17,30 +17,25 @@
|
|
|
17
17
|
"access": "public"
|
|
18
18
|
},
|
|
19
19
|
"scripts": {
|
|
20
|
-
"start": "
|
|
21
|
-
"build": "
|
|
22
|
-
"test": "
|
|
23
|
-
"lint": "
|
|
20
|
+
"start": "dts watch --noClean",
|
|
21
|
+
"build": "dts build",
|
|
22
|
+
"test": "dts test",
|
|
23
|
+
"lint": "dts lint"
|
|
24
24
|
},
|
|
25
25
|
"peerDependencies": {
|
|
26
26
|
"react": ">=16.8.0",
|
|
27
27
|
"react-dom": ">=16.8.0"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@entur/icons": "^5.
|
|
31
|
-
"@entur/tokens": "^3.4.
|
|
32
|
-
"@entur/typography": "^1.7.
|
|
33
|
-
"@entur/utils": "^0.4.
|
|
30
|
+
"@entur/icons": "^5.4.1",
|
|
31
|
+
"@entur/tokens": "^3.4.4",
|
|
32
|
+
"@entur/typography": "^1.7.4",
|
|
33
|
+
"@entur/utils": "^0.4.9",
|
|
34
34
|
"classnames": "^2.3.1",
|
|
35
35
|
"react-collapse": "^5.1.0"
|
|
36
36
|
},
|
|
37
37
|
"devDependencies": {
|
|
38
|
-
"@types/react-collapse": "^5.0.1"
|
|
39
|
-
"dts-cli": "^1.1.6",
|
|
40
|
-
"jest": "^27.0.0",
|
|
41
|
-
"jest-watch-typeahead": "^2.2.0",
|
|
42
|
-
"ts-jest": "^27.0.0",
|
|
43
|
-
"typescript": "^4.8.0"
|
|
38
|
+
"@types/react-collapse": "^5.0.1"
|
|
44
39
|
},
|
|
45
|
-
"gitHead": "
|
|
40
|
+
"gitHead": "de71e205560a699e2dce301e133966dc9348c459"
|
|
46
41
|
}
|