@ebrains/react 0.4.0-alpha.0 → 0.6.0-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (85) hide show
  1. package/analytics-44b1416b.esm.js +55 -0
  2. package/color-2554aad6.esm.js +122 -0
  3. package/color-primary-palette_6.entry.esm.js +106 -106
  4. package/correct-use-of-colors.entry.esm.js +33 -33
  5. package/eds-accordion_13.entry.esm.js +1064 -0
  6. package/eds-alert.entry.esm.js +104 -0
  7. package/eds-block-break.entry.esm.js +22 -0
  8. package/eds-breadcrumb.entry.esm.js +182 -0
  9. package/eds-card-project.entry.esm.js +12 -11
  10. package/eds-card-tags.entry.esm.js +1 -1
  11. package/eds-card-tool.entry.esm.js +5 -6
  12. package/eds-card-wrapper.entry.esm.js +4 -4
  13. package/eds-code-block.entry.esm.js +8 -8
  14. package/eds-components-section.entry.esm.js +14 -2
  15. package/eds-cookies-preference.entry.esm.js +47 -0
  16. package/eds-docs-palettes.entry.esm.js +1 -1
  17. package/eds-docs-tokens.entry.esm.js +1 -1
  18. package/eds-dropdown_2.entry.esm.js +235 -0
  19. package/eds-footer.entry.esm.js +102 -0
  20. package/eds-form.entry.esm.js +410 -0
  21. package/eds-frame.entry.esm.js +117 -0
  22. package/eds-fullscreen-menu.entry.esm.js +143 -0
  23. package/eds-header.entry.esm.js +130 -0
  24. package/eds-icon-arrow-diagonal.entry.esm.js +1 -1
  25. package/eds-icon-arrow-right.entry.esm.js +1 -1
  26. package/eds-icon-bluesky.entry.esm.js +1 -1
  27. package/eds-icon-chevron-down.entry.esm.js +1 -1
  28. package/eds-icon-chevron-left.entry.esm.js +1 -1
  29. package/eds-icon-chevron-right.entry.esm.js +1 -1
  30. package/eds-icon-chevron-up.entry.esm.js +1 -1
  31. package/eds-icon-close.entry.esm.js +1 -1
  32. package/eds-icon-copy.entry.esm.js +1 -1
  33. package/eds-icon-eu.entry.esm.js +1 -1
  34. package/eds-icon-facebook.entry.esm.js +1 -1
  35. package/eds-icon-gitlab.entry.esm.js +1 -1
  36. package/eds-icon-linkedin.entry.esm.js +1 -1
  37. package/eds-icon-loader.entry.esm.js +1 -1
  38. package/eds-icon-mastodon.entry.esm.js +1 -1
  39. package/eds-icon-menu.entry.esm.js +1 -1
  40. package/eds-icon-more.entry.esm.js +1 -1
  41. package/eds-icon-search.entry.esm.js +1 -1
  42. package/eds-icon-success.entry.esm.js +1 -1
  43. package/eds-icon-twitter.entry.esm.js +1 -1
  44. package/eds-icon-user.entry.esm.js +1 -1
  45. package/eds-icon-youtube.entry.esm.js +1 -1
  46. package/eds-input_7.entry.esm.js +529 -0
  47. package/eds-link.entry.esm.js +204 -0
  48. package/eds-login.entry.esm.js +66 -45
  49. package/eds-logo-variations.entry.esm.js +1 -1
  50. package/eds-logo.entry.esm.js +87 -0
  51. package/eds-modal.entry.esm.js +129 -0
  52. package/eds-navigator.entry.esm.js +5 -5
  53. package/eds-pagination_2.entry.esm.js +15 -16
  54. package/eds-progress-bar.entry.esm.js +7 -2
  55. package/eds-rating.entry.esm.js +28 -18
  56. package/eds-section-core_2.entry.esm.js +5 -5
  57. package/eds-social-networks.entry.esm.js +74 -0
  58. package/eds-steps.entry.esm.js +98 -0
  59. package/eds-svg-repository.entry.esm.js +1 -1
  60. package/eds-switch.entry.esm.js +58 -0
  61. package/eds-tab.entry.esm.js +1 -1
  62. package/eds-tabs-content.entry.esm.js +5 -5
  63. package/eds-tabs.entry.esm.js +4 -4
  64. package/eds-timeline.entry.esm.js +4 -4
  65. package/eds-tooltip.entry.esm.js +4 -5
  66. package/eds-trl.entry.esm.js +2 -2
  67. package/eds-user.entry.esm.js +118 -0
  68. package/eds-vertical-stepper.entry.esm.js +81 -0
  69. package/incorrect-use-of-colors.entry.esm.js +7 -7
  70. package/index.esm.js +1 -1
  71. package/index.esm2.js +63 -9
  72. package/{keycloak-13893af6.esm.js → keycloak-d502ec16.esm.js} +219 -168
  73. package/logo-space.entry.esm.js +4 -4
  74. package/logo-variations-horizontal_2.entry.esm.js +26 -26
  75. package/logo-wrong-usage.entry.esm.js +37 -37
  76. package/package.json +1 -1
  77. package/src/components.d.ts +3 -0
  78. package/token-list_3.entry.esm.js +5 -5
  79. package/token-ratios.entry.esm.js +3 -3
  80. package/token-spacing.entry.esm.js +26 -26
  81. package/token-typography.entry.esm.js +2 -2
  82. package/color-bb472c37.esm.js +0 -423
  83. package/eds-accordion_33.entry.esm.js +0 -369
  84. package/eds-card-section.entry.esm.js +0 -70
  85. package/eds-matomo-notice.entry.esm.js +0 -129
@@ -1,423 +0,0 @@
1
- import { c as cva } from './index-39c58238.esm.js';
2
-
3
- [['eds-header', {
4
- 'home-url': '/',
5
- 'user-feature': 'false',
6
- 'keycloak-url': 'http://localhost:8080',
7
- 'keycloak-realm': 'nigeor-realm',
8
- 'keycloak-client-id': 'stencil-app',
9
- links: JSON.stringify([{
10
- label: 'About',
11
- url: '/about'
12
- }, {
13
- label: 'Focus Areas',
14
- url: '/focus-areas'
15
- }, {
16
- label: 'News & Events',
17
- url: '/news-and-events'
18
- }, {
19
- label: 'Contact',
20
- url: '/contact'
21
- }])
22
- }], ['eds-block-break', {}], ['eds-footer', {}], ['eds-block-break', {}], ['eds-tabs', {
23
- tabs: JSON.stringify([{
24
- label: 'Home',
25
- url: '#',
26
- active: true,
27
- ariaLabel: 'Home Tab'
28
- }, {
29
- label: 'Profile',
30
- url: '#',
31
- active: false,
32
- ariaLabel: 'Profile Tab'
33
- }, {
34
- label: 'Settings',
35
- url: '#',
36
- active: false,
37
- ariaLabel: 'Settings Tab'
38
- }])
39
- }], ['eds-block-break', {}], ['eds-card-section', {
40
- cards: JSON.stringify([{
41
- title: 'Card 1',
42
- description: 'Description 1',
43
- tags: 'tag1, tag2',
44
- url: '/link1'
45
- }, {
46
- title: 'Card 2',
47
- description: 'Description 2',
48
- tags: 'tag3',
49
- url: '/link2'
50
- }]),
51
- cols: '4'
52
- }], ['eds-block-break', {}], ['eds-link', {
53
- label: 'Main Link Click Me',
54
- url: 'https://example.com',
55
- intent: 'primary'
56
- }], ['eds-block-break', {}], ['eds-avatar', {
57
- 'first-name': 'John',
58
- 'last-name': 'Doe'
59
- }], ['eds-block-break', {}], ['eds-breadcrumb', {
60
- items: JSON.stringify([{
61
- label: 'Home',
62
- url: '/'
63
- }, {
64
- label: 'Products',
65
- url: '/products'
66
- }, {
67
- label: 'Electronics',
68
- url: '/products/electronics'
69
- }, {
70
- label: 'Laptops',
71
- url: '/products/electronics/laptops'
72
- }]),
73
- intent: 'primary'
74
- }], ['eds-block-break', {}], ['eds-card-generic', {
75
- 'card-title': 'The Future of AI in Healthcare',
76
- url: 'https://example.com/ai-healthcare',
77
- description: 'Explore how AI is transforming the healthcare industry with cutting-edge technologies and research.',
78
- avatar: 'https://files.ebrains.eu/img/686e0edc-f3be-4d79-aa02-373c32c08d65/ebrains-logo-high-resolution.png?fit=max&q=80&fm=webp&crop=879%2C879%2C597%2C0&w=200',
79
- 'short-abbreviation': 'AI',
80
- 'heading-level': 'h2',
81
- tags: 'Technology,AI,Healthcare',
82
- tiny: 'false',
83
- bg: 'true',
84
- 'with-hover': 'true'
85
- }], ['eds-block-break', {}], ['eds-code-block', {
86
- code: 'Hello',
87
- language: 'javascript'
88
- }], ['eds-block-break', {}], ['eds-dropdown', {
89
- 'aria-label': 'More options',
90
- 'rounded-btn': 'true',
91
- 'dropdown-pos': 'right',
92
- 'dropdown-offset': 'true'
93
- }], ['eds-block-break', {}], ['eds-form', {
94
- name: 'extended-form',
95
- endpoint: 'http://127.0.0.1:5000/api/data',
96
- fields: JSON.stringify([{
97
- name: 'username',
98
- label: 'Username',
99
- type: 'text',
100
- required: true,
101
- maxlength: 10
102
- }, {
103
- name: 'email',
104
- label: 'Email',
105
- type: 'email',
106
- required: true
107
- }, {
108
- name: 'number',
109
- label: 'Number',
110
- type: 'number',
111
- required: true
112
- }, {
113
- name: 'password',
114
- label: 'Password',
115
- type: 'password',
116
- required: true,
117
- maxlength: 50
118
- }, {
119
- name: 'date',
120
- label: 'Date',
121
- type: 'date',
122
- required: true
123
- }, {
124
- name: 'file',
125
- label: 'File',
126
- type: 'file',
127
- required: false
128
- }, {
129
- name: 'hiddenField',
130
- type: 'hidden',
131
- value: 'hiddenValue'
132
- }, {
133
- name: 'bio',
134
- label: 'Biography',
135
- type: 'textarea',
136
- required: true,
137
- maxlength: 300
138
- }, {
139
- name: 'role',
140
- label: 'Role',
141
- type: 'select',
142
- required: true,
143
- options: [{
144
- label: 'Admin',
145
- value: 'admin'
146
- }, {
147
- label: 'Editor',
148
- value: 'editor'
149
- }, {
150
- label: 'Viewer',
151
- value: 'viewer'
152
- }]
153
- }, {
154
- name: 'preferences',
155
- type: 'checkbox',
156
- label: 'Select your preferences',
157
- options: [{
158
- value: 'option1',
159
- label: 'Option 1'
160
- }, {
161
- value: 'option2',
162
- label: 'Option 2'
163
- }, {
164
- value: 'option3',
165
- label: 'Option 3'
166
- }],
167
- required: true
168
- }, {
169
- name: 'gender',
170
- type: 'radio',
171
- label: 'Select your gender',
172
- options: [{
173
- value: 'female',
174
- label: 'Female'
175
- }, {
176
- value: 'male',
177
- label: 'Male'
178
- }],
179
- required: true
180
- }, {
181
- name: 'newsletter',
182
- label: 'newsletter',
183
- type: 'checkbox',
184
- value: 'subscribe',
185
- required: true
186
- }, {
187
- name: 'range',
188
- label: 'Range bar',
189
- type: 'range',
190
- min: '0',
191
- max: '10',
192
- step: '1',
193
- required: true
194
- }]),
195
- 'success-message': 'Form submitted successfully!',
196
- 'error-message': 'Please fix the errors in the form.',
197
- 'submit-btn': 'true',
198
- 'small-alert': 'false',
199
- 'set-form-url': 'true'
200
- }], ['eds-block-break', {}], ['eds-img', {
201
- src: 'https://files.ebrains.eu/img/f999348c-beaa-40f8-ba60-230316d4a947/EBRAINS-BernsteinConference01.jpg',
202
- alt: 'EBRAINS Bernstein Conference',
203
- width: '400',
204
- height: '225',
205
- srcset: 'https://files.ebrains.eu/img/f999348c-beaa-40f8-ba60-230316d4a947/EBRAINS-BernsteinConference01.jpg 720w, https://files.ebrains.eu/img/f999348c-beaa-40f8-ba60-230316d4a947/EBRAINS-BernsteinConference01.jpg 1080w, https://files.ebrains.eu/img/f999348c-beaa-40f8-ba60-230316d4a947/EBRAINS-BernsteinConference01.jpg 1440w',
206
- sizes: '(max-width: 600px) 100vw, (max-width: 1200px) 50vw, 33vw',
207
- formats: JSON.stringify([{
208
- type: 'image/webp',
209
- srcset: 'https://files.ebrains.eu/img/f999348c-beaa-40f8-ba60-230316d4a947/EBRAINS-BernsteinConference01.webp 720w, https://files.ebrains.eu/img/f999348c-beaa-40f8-ba60-230316d4a947/EBRAINS-BernsteinConference01.webp 1080w'
210
- }, {
211
- type: 'image/jpeg',
212
- srcset: 'https://files.ebrains.eu/img/f999348c-beaa-40f8-ba60-230316d4a947/EBRAINS-BernsteinConference01.jpg 720w, https://files.ebrains.eu/img/f999348c-beaa-40f8-ba60-230316d4a947/EBRAINS-BernsteinConference01.jpg 1080w'
213
- }]),
214
- lazyload: 'true',
215
- 'with-bg': 'true'
216
- }], ['eds-block-break', {}], ['eds-input-field', {
217
- name: 'username',
218
- 'input-id': 'username',
219
- label: 'Username',
220
- placeholder: 'Enter your username',
221
- required: 'true',
222
- hint: 'Your unique username',
223
- message: 'This field is required',
224
- 'error-message': 'Invalid username',
225
- type: 'text'
226
- }], ['eds-block-break', {}], ['eds-pagination', {
227
- 'current-page': '1',
228
- 'last-page': '10',
229
- 'per-page': '5',
230
- total: '50',
231
- mode: 'default'
232
- }], ['eds-block-break', {}], ['eds-progress-bar', {
233
- value: '75'
234
- }], ['eds-table', {
235
- data: JSON.stringify([{
236
- Property: 'username',
237
- Type: 'string',
238
- Required: 'Yes'
239
- }, {
240
- Property: 'password',
241
- Type: 'string',
242
- Required: 'Yes'
243
- }, {
244
- Property: 'email',
245
- Type: 'string',
246
- Required: 'No'
247
- }]),
248
- config: JSON.stringify({
249
- Type: {
250
- format: 'uppercase'
251
- },
252
- Property: {
253
- format: 'code'
254
- },
255
- Required: {
256
- hidden: true
257
- }
258
- })
259
- }], ['eds-block-break', {}], ['eds-tag', {
260
- label: 'Default Tag',
261
- intent: 'default'
262
- }]];
263
-
264
- // Helper function to check if Matomo is initialized
265
- function isMatomoAvailable() {
266
- return typeof window !== 'undefined' && typeof window._paq !== 'undefined';
267
- }
268
- // General function to push data to Matomo
269
- function pushToMatomo(action, ...args) {
270
- //console.log('Pushing Matomo')
271
- if (isMatomoAvailable()) {
272
- window._paq.push([action, ...args]);
273
- } else {
274
- console.warn('Matomo is not available or not initialized.');
275
- }
276
- }
277
- // Function to send analytics data
278
- function sendAnalytics(eventData) {
279
- var _a;
280
- if (!isMatomoAvailable()) {
281
- console.warn('Matomo is not available or not initialized.');
282
- //console.log({ ...eventData });
283
- return;
284
- }
285
- // Conditionally build the name field
286
- const nameParts = [];
287
- if ((_a = eventData.parentContext) === null || _a === void 0 ? void 0 : _a.componentName) {
288
- nameParts.push(eventData.parentContext.componentName);
289
- }
290
- nameParts.push(eventData.tag || 'unknown-tag');
291
- nameParts.push(eventData.name || 'unknown-name');
292
- const name = nameParts.join('/');
293
- //console.log('trackEvent', eventData.category, eventData.action, name)
294
- pushToMatomo('trackEvent', eventData.category, eventData.action, name);
295
- console.log(Object.assign({}, eventData));
296
- }
297
- // Function to opt-in the user
298
- function matomoOptIn() {
299
- if (isMatomoAvailable()) {
300
- window._paq.push(['rememberConsentGiven']);
301
- console.log('User has opted in to tracking');
302
- }
303
- }
304
- const GRADIANT_TOKENS = ['green', 'yellow', 'among-blue', 'purple'];
305
- const gradientBGColorVariants = cva([], {
306
- variants: {
307
- color: GRADIANT_TOKENS.reduce((acc, token) => Object.assign(Object.assign({}, acc), {
308
- [token]: ''
309
- }), {}),
310
- direction: {
311
- top: '',
312
- bottom: ''
313
- },
314
- pseudo: {
315
- true: 'before:effect-opacity effect-bg-behind',
316
- false: ''
317
- },
318
- hover: {
319
- true: 'before:opacity-0 hover:before:opacity-100',
320
- false: ''
321
- }
322
- },
323
- compoundVariants: [
324
- // region GREEN
325
- {
326
- color: 'green',
327
- direction: 'top',
328
- pseudo: true,
329
- className: 'before:bg-gradient-01-top'
330
- }, {
331
- color: 'green',
332
- pseudo: true,
333
- direction: 'bottom',
334
- className: 'before:bg-gradient-01-bottom'
335
- }, {
336
- color: 'green',
337
- direction: 'top',
338
- pseudo: false,
339
- className: 'bg-gradient-01-top'
340
- }, {
341
- color: 'green',
342
- pseudo: false,
343
- direction: 'bottom',
344
- className: 'bg-gradient-01-bottom'
345
- },
346
- // endregion
347
- // region YELLOW
348
- {
349
- color: 'yellow',
350
- direction: 'top',
351
- pseudo: true,
352
- className: 'before:bg-gradient-02-top'
353
- }, {
354
- color: 'yellow',
355
- direction: 'bottom',
356
- pseudo: true,
357
- className: 'before:bg-gradient-02-bottom'
358
- }, {
359
- color: 'yellow',
360
- direction: 'top',
361
- pseudo: false,
362
- className: 'bg-gradient-02-top'
363
- }, {
364
- color: 'yellow',
365
- direction: 'bottom',
366
- pseudo: false,
367
- className: 'bg-gradient-02-bottom'
368
- },
369
- // endregion
370
- // region PURPLE
371
- {
372
- color: 'purple',
373
- direction: 'top',
374
- pseudo: true,
375
- class: 'before:bg-gradient-03-top'
376
- }, {
377
- color: 'purple',
378
- direction: 'bottom',
379
- pseudo: true,
380
- class: 'before:bg-gradient-03-bottom'
381
- }, {
382
- color: 'purple',
383
- direction: 'top',
384
- pseudo: false,
385
- class: 'bg-gradient-03-top'
386
- }, {
387
- color: 'purple',
388
- direction: 'bottom',
389
- pseudo: false,
390
- class: 'bg-gradient-03-bottom'
391
- },
392
- // endregion
393
- // region AMONG-BLUE
394
- {
395
- color: 'among-blue',
396
- direction: 'top',
397
- pseudo: true,
398
- class: 'before:bg-gradient-04-top'
399
- }, {
400
- color: 'among-blue',
401
- direction: 'bottom',
402
- pseudo: true,
403
- class: 'before:bg-gradient-04-bottom'
404
- }, {
405
- color: 'among-blue',
406
- direction: 'top',
407
- pseudo: false,
408
- class: 'bg-gradient-04-top'
409
- }, {
410
- color: 'among-blue',
411
- direction: 'bottom',
412
- pseudo: false,
413
- class: 'bg-gradient-04-bottom'
414
- }
415
- // endregion
416
- ],
417
- defaultVariants: {
418
- direction: 'top',
419
- pseudo: true
420
- }
421
- });
422
-
423
- export { gradientBGColorVariants as g, matomoOptIn as m, sendAnalytics as s };