@hitachivantara/uikit-react-core 5.95.1 → 5.96.1

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.
@@ -0,0 +1,761 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
+ const uikitStyles = require("@hitachivantara/uikit-styles");
4
+ const ld = (c1, c2) => `light-dark(${c1}, ${c2})`;
5
+ const semaColors = ["positive", "warning", "negative", "info"];
6
+ const notificationMap = {
7
+ success: "positive",
8
+ warning: "warning",
9
+ error: "negative",
10
+ default: "info",
11
+ info: "info",
12
+ accent: "accent"
13
+ };
14
+ const inputColors = {
15
+ bg: ld("#FFFFFF", "#020617")
16
+ };
17
+ const popperStyles = {
18
+ backgroundColor: uikitStyles.theme.colors.bgContainer,
19
+ border: `1px solid ${uikitStyles.theme.colors.borderSubtle}`,
20
+ borderRadius: uikitStyles.theme.radii.large,
21
+ boxShadow: `0px 0px 6px 0px rgba(65, 65, 65, 0.08)`
22
+ };
23
+ const pentahoPlus = uikitStyles.mergeTheme(uikitStyles.pentahoPlus, {
24
+ components: {
25
+ HvLoading: {
26
+ classes: {
27
+ loadingBar: {
28
+ borderRadius: 1
29
+ }
30
+ }
31
+ },
32
+ HvBadge: {
33
+ classes: {
34
+ badgePosition: {
35
+ color: ld(uikitStyles.theme.colors.textLight, uikitStyles.theme.colors.textDark),
36
+ "&[data-color='textSubtle']:not(.HvBadge-badgePosition:empty)": {
37
+ color: uikitStyles.theme.colors.textSubtle,
38
+ backgroundColor: uikitStyles.theme.colors.bgPageSecondary
39
+ },
40
+ "&[data-color='primary']:not(.HvBadge-badgePosition:empty)": {
41
+ color: uikitStyles.theme.colors.primary,
42
+ backgroundColor: uikitStyles.theme.colors.primaryDimmed
43
+ }
44
+ }
45
+ }
46
+ },
47
+ HvCallout: {
48
+ classes: {
49
+ root: { outline: "1px solid var(--icolor, currentcolor)" },
50
+ ...Object.fromEntries(
51
+ Object.entries(notificationMap).map(([variant, color]) => [
52
+ variant,
53
+ {
54
+ backgroundColor: uikitStyles.theme.colors[`${color}Dimmed`],
55
+ "--icolor": uikitStyles.theme.colors[color],
56
+ "--outline": uikitStyles.theme.colors[`${color}Border`],
57
+ "--bg": uikitStyles.theme.colors[`${color}Subtle`],
58
+ "--title": uikitStyles.theme.colors[`${color}Deep`]
59
+ }
60
+ ])
61
+ ),
62
+ message: {
63
+ "&&": {
64
+ color: uikitStyles.theme.colors.secondary
65
+ }
66
+ },
67
+ messageIcon: {
68
+ alignSelf: "start",
69
+ borderRadius: uikitStyles.theme.radii.round,
70
+ color: "var(--icolor)",
71
+ outline: `1px solid var(--outline)`,
72
+ backgroundColor: "var(--bg)"
73
+ },
74
+ messageTitle: {
75
+ color: "var(--title)"
76
+ },
77
+ actionClose: {
78
+ color: uikitStyles.theme.colors.secondary
79
+ }
80
+ }
81
+ },
82
+ HvSnackbar: {
83
+ anchorOrigin: { vertical: "bottom", horizontal: "center" }
84
+ },
85
+ HvSnackbarProvider: {
86
+ anchorOrigin: { vertical: "bottom", horizontal: "center" }
87
+ },
88
+ HvBaseCheckBox: {
89
+ classes: {
90
+ root: {
91
+ borderRadius: uikitStyles.theme.radii.base
92
+ }
93
+ }
94
+ },
95
+ HvCheckBoxIcon: {
96
+ classes: {
97
+ root: {
98
+ borderRadius: uikitStyles.theme.radii.base
99
+ },
100
+ checked: {
101
+ "--bg-color": uikitStyles.theme.colors.primary,
102
+ color: uikitStyles.theme.colors.atmo1
103
+ }
104
+ }
105
+ },
106
+ HvBaseRadio: {
107
+ classes: {
108
+ root: {
109
+ borderRadius: uikitStyles.theme.radii.base
110
+ }
111
+ }
112
+ },
113
+ HvRadioIcon: {
114
+ classes: {
115
+ checked: {
116
+ "--bg-color": uikitStyles.theme.colors.primary
117
+ }
118
+ }
119
+ },
120
+ HvBaseSwitch: {
121
+ classes: {
122
+ root: {
123
+ borderRadius: uikitStyles.theme.radii.base,
124
+ "&:hover": {
125
+ backgroundColor: uikitStyles.theme.colors.bgHover
126
+ },
127
+ "& .HvBaseSwitch-switchBase": {
128
+ "& .HvBaseSwitch-thumb": {
129
+ borderColor: "transparent",
130
+ boxShadow: `0px 1px 1px 0px ${uikitStyles.theme.alpha(uikitStyles.slate[700], 0.16)}`
131
+ },
132
+ "+.HvBaseSwitch-track": {
133
+ height: 14,
134
+ backgroundColor: uikitStyles.theme.colors.textDimmed,
135
+ borderColor: uikitStyles.theme.colors.textSubtle
136
+ },
137
+ "&.HvBaseSwitch-checked": {
138
+ "& .HvBaseSwitch-thumb": {
139
+ border: `1px solid ${uikitStyles.theme.colors.bgContainer}`
140
+ },
141
+ "+.HvBaseSwitch-track": {
142
+ borderColor: uikitStyles.theme.colors.primaryStrong
143
+ }
144
+ },
145
+ "&.HvBaseSwitch-disabled": {
146
+ "& .HvBaseSwitch-thumb": {
147
+ backgroundColor: uikitStyles.theme.colors.borderDisabled,
148
+ borderColor: uikitStyles.theme.colors.borderDisabled
149
+ },
150
+ "+.HvBaseSwitch-track": {
151
+ borderColor: uikitStyles.theme.colors.borderDisabled,
152
+ backgroundColor: uikitStyles.theme.colors.bgDisabled
153
+ }
154
+ }
155
+ }
156
+ }
157
+ }
158
+ },
159
+ HvSelect: {
160
+ classes: {
161
+ root: {
162
+ borderRadius: uikitStyles.theme.radii.round,
163
+ "&& .HvButton-secondarySubtle": {
164
+ borderColor: uikitStyles.theme.colors.textDimmed,
165
+ backgroundColor: inputColors.bg
166
+ }
167
+ },
168
+ select: {
169
+ borderRadius: uikitStyles.theme.radii.round
170
+ },
171
+ panel: {
172
+ ...popperStyles
173
+ },
174
+ popper: {
175
+ "&[data-popper-placement*='bottom'] .HvSelect-panel": {
176
+ borderRadius: uikitStyles.theme.radii.large,
177
+ top: 1
178
+ },
179
+ "&[data-popper-placement*='top'] .HvSelect-panel": {
180
+ borderRadius: uikitStyles.theme.radii.large,
181
+ top: -1
182
+ }
183
+ }
184
+ }
185
+ },
186
+ HvSuggestions: {
187
+ classes: {
188
+ list: {
189
+ ...popperStyles
190
+ }
191
+ }
192
+ },
193
+ HvTagsInput: {
194
+ classes: {
195
+ tagsList: {
196
+ backgroundColor: inputColors.bg,
197
+ padding: uikitStyles.theme.space.xxs
198
+ },
199
+ singleLine: {
200
+ height: 32
201
+ }
202
+ }
203
+ },
204
+ HvTag: {
205
+ showSelectIcon: false,
206
+ size: "sm",
207
+ classes: {
208
+ root: {
209
+ outline: `1px solid ${uikitStyles.theme.colors.border}`,
210
+ outlineOffset: -1,
211
+ borderRadius: uikitStyles.theme.radii.round,
212
+ ":where(:not([data-color],.HvTag-disabled))": {
213
+ color: uikitStyles.theme.colors.text,
214
+ "--tagColor": uikitStyles.theme.colors.bgContainer
215
+ },
216
+ ":where([data-color]:not(.HvTag-disabled))": {
217
+ ":not([data-color$=_20],[data-color^=cat])": {
218
+ color: "var(--tagColor)",
219
+ backgroundColor: uikitStyles.theme.mix("var(--tagColor)", "8%", "white"),
220
+ outlineColor: uikitStyles.theme.mix("var(--tagColor)", "30%", "white"),
221
+ "&.HvTag-clickable:is(:hover,:focus-visible)": {
222
+ backgroundColor: uikitStyles.theme.mix("var(--tagColor)", "20%", "white")
223
+ }
224
+ },
225
+ ...Object.fromEntries(
226
+ semaColors.map((color) => [
227
+ [`&[data-color=${color}]`],
228
+ {
229
+ color: uikitStyles.theme.colors[`${color}Strong`],
230
+ backgroundColor: uikitStyles.theme.colors[`${color}Dimmed`],
231
+ outlineColor: uikitStyles.theme.colors[`${color}Border`],
232
+ "&.HvTag-clickable:has(:hover,:focus-visible)": {
233
+ backgroundColor: uikitStyles.theme.colors[`${color}Subtle`]
234
+ }
235
+ }
236
+ ])
237
+ )
238
+ }
239
+ },
240
+ hasIcon: {
241
+ paddingLeft: uikitStyles.theme.space.xs
242
+ },
243
+ xs: { borderRadius: uikitStyles.theme.radii.base },
244
+ sm: { borderRadius: uikitStyles.theme.radii.base },
245
+ md: { borderRadius: uikitStyles.theme.radii.round },
246
+ label: {
247
+ paddingLeft: 8,
248
+ paddingRight: 8
249
+ },
250
+ deleteIcon: {
251
+ borderRadius: "inherit",
252
+ marginRight: 4
253
+ },
254
+ clickable: {
255
+ ":hover": {
256
+ backgroundColor: uikitStyles.theme.colors.bgHover
257
+ }
258
+ },
259
+ selected: {
260
+ "&&": {
261
+ outlineColor: "currentcolor"
262
+ }
263
+ },
264
+ disabled: {
265
+ color: uikitStyles.theme.colors.textDisabled,
266
+ outlineColor: "transparent",
267
+ "&,:hover": {
268
+ backgroundColor: uikitStyles.theme.colors.bgDisabled
269
+ }
270
+ }
271
+ }
272
+ },
273
+ HvIconContainer: {
274
+ classes: {
275
+ root: {
276
+ padding: 0
277
+ },
278
+ xs: { fontSize: 16, padding: 0 },
279
+ sm: { fontSize: 20, padding: 2 },
280
+ md: { fontSize: 26, padding: 3 },
281
+ lg: { fontSize: 36, padding: 6 },
282
+ xl: { fontSize: 48, padding: 8 }
283
+ }
284
+ },
285
+ HvInlineEditor: {
286
+ classes: {
287
+ button: {
288
+ borderRadius: 2,
289
+ "&:focus": {
290
+ borderColor: uikitStyles.theme.colors.secondary
291
+ }
292
+ },
293
+ inputRoot: {
294
+ borderRadius: 2
295
+ }
296
+ }
297
+ },
298
+ HvButtonBase: {
299
+ classes: {
300
+ root: {
301
+ ":where(:not(.HvButtonBase-disabled))": {
302
+ ":hover": { backgroundColor: uikitStyles.theme.colors.primaryDimmed },
303
+ ":active": { backgroundColor: uikitStyles.theme.colors.primarySubtle }
304
+ }
305
+ }
306
+ }
307
+ },
308
+ HvButton: {
309
+ radius: "full",
310
+ classes: {
311
+ root: {
312
+ ":where(:not(.HvButton-disabled,.HvButton-contained))": {
313
+ "&[data-color=positive]": { color: uikitStyles.theme.colors.positive },
314
+ "&[data-color=warning]": { color: uikitStyles.theme.colors.warning },
315
+ "&[data-color=negative]": { color: uikitStyles.theme.colors.negative },
316
+ ":hover": { backgroundColor: uikitStyles.theme.colors.primaryDimmed },
317
+ ":active": { backgroundColor: uikitStyles.theme.colors.primarySubtle }
318
+ }
319
+ },
320
+ contained: {
321
+ ":where(:not(.HvButton-disabled))": {
322
+ color: "#FFFFFF",
323
+ "&[data-color=primary]": {
324
+ backgroundColor: uikitStyles.theme.colors.primary,
325
+ ":hover": { backgroundColor: uikitStyles.theme.colors.primaryStrong },
326
+ ":active": { backgroundColor: uikitStyles.theme.colors.primaryDeep }
327
+ },
328
+ "&[data-color=positive]": {
329
+ ":hover": { backgroundColor: uikitStyles.theme.colors.positiveDeep },
330
+ ":active": { backgroundColor: uikitStyles.theme.colors.positiveStrong }
331
+ },
332
+ "&[data-color=warning]": {
333
+ ":hover": { backgroundColor: uikitStyles.theme.colors.warningDeep },
334
+ ":active": { backgroundColor: uikitStyles.theme.colors.warningStrong }
335
+ },
336
+ "&[data-color=negative]": {
337
+ ":hover": { backgroundColor: uikitStyles.theme.colors.negativeDeep },
338
+ ":active": { backgroundColor: uikitStyles.theme.colors.negativeStrong }
339
+ }
340
+ }
341
+ },
342
+ subtle: {
343
+ borderColor: uikitStyles.theme.alpha("currentcolor", 0.4),
344
+ ":where(:not(.HvButton-disabled))": {
345
+ "&[data-color=primary]": {
346
+ borderColor: uikitStyles.theme.colors.primarySubtle,
347
+ backgroundColor: uikitStyles.theme.colors.primaryDimmed
348
+ },
349
+ "&[data-color=secondary]": {
350
+ borderColor: uikitStyles.theme.colors.border,
351
+ backgroundColor: uikitStyles.theme.colors.bgContainerSecondary
352
+ },
353
+ ":hover": {
354
+ backgroundColor: uikitStyles.theme.colors.primaryDimmed
355
+ },
356
+ ":active": {
357
+ borderColor: "transparent",
358
+ backgroundColor: uikitStyles.theme.colors.primarySubtle
359
+ },
360
+ "&[data-color=positive]": {
361
+ borderColor: uikitStyles.theme.colors.positiveBorder,
362
+ backgroundColor: uikitStyles.theme.colors.positiveDimmed,
363
+ ":hover": { backgroundColor: uikitStyles.theme.colors.positiveSubtle },
364
+ ":active": {
365
+ backgroundColor: uikitStyles.theme.colors.positiveBorder
366
+ }
367
+ },
368
+ "&[data-color=warning]": {
369
+ borderColor: uikitStyles.theme.colors.warningBorder,
370
+ backgroundColor: uikitStyles.theme.colors.warningDimmed,
371
+ ":hover": { backgroundColor: uikitStyles.theme.colors.warningSubtle },
372
+ ":active": { backgroundColor: uikitStyles.theme.colors.warningBorder }
373
+ },
374
+ "&[data-color=negative]": {
375
+ borderColor: uikitStyles.theme.colors.negativeBorder,
376
+ backgroundColor: uikitStyles.theme.colors.negativeDimmed,
377
+ ":hover": { backgroundColor: uikitStyles.theme.colors.negativeSubtle },
378
+ ":active": {
379
+ backgroundColor: uikitStyles.theme.colors.negativeBorder
380
+ }
381
+ }
382
+ }
383
+ },
384
+ ghost: {
385
+ ":where(:not(.HvButton-disabled))": {
386
+ "&[data-color=positive]": {
387
+ ":hover": { backgroundColor: uikitStyles.theme.colors.positiveDimmed },
388
+ ":active": { backgroundColor: uikitStyles.theme.colors.positiveSubtle }
389
+ },
390
+ "&[data-color=warning]": {
391
+ ":hover": { backgroundColor: uikitStyles.theme.colors.warningDimmed },
392
+ ":active": { backgroundColor: uikitStyles.theme.colors.warningSubtle }
393
+ },
394
+ "&[data-color=negative]": {
395
+ ":hover": { backgroundColor: uikitStyles.theme.colors.negativeDimmed },
396
+ ":active": { backgroundColor: uikitStyles.theme.colors.negativeSubtle }
397
+ }
398
+ }
399
+ },
400
+ disabled: {
401
+ color: uikitStyles.theme.colors.textDisabled,
402
+ ":not(.HvButton-ghost)": {
403
+ borderColor: "transparent",
404
+ "&,:hover,:active": {
405
+ backgroundColor: uikitStyles.theme.colors.bgDisabled
406
+ }
407
+ }
408
+ }
409
+ }
410
+ },
411
+ HvMultiButton: {
412
+ classes: {
413
+ multiple: {
414
+ borderRadius: uikitStyles.theme.radii.full,
415
+ borderColor: uikitStyles.theme.colors.border,
416
+ "& .HvMultiButton-button": {
417
+ borderColor: "inherit",
418
+ ...uikitStyles.theme.typography.body,
419
+ "&.HvMultiButton-selected": {
420
+ color: uikitStyles.theme.colors.primary,
421
+ backgroundColor: uikitStyles.theme.colors.primaryDimmed
422
+ },
423
+ "&:not(.HvMultiButton-firstButton, .HvMultiButton-lastButton)": {
424
+ borderRadius: 0
425
+ }
426
+ }
427
+ },
428
+ vertical: {
429
+ borderRadius: uikitStyles.theme.radii.large,
430
+ borderColor: uikitStyles.theme.colors.border
431
+ }
432
+ }
433
+ },
434
+ HvDropdownButton: {
435
+ classes: {
436
+ disabled: {
437
+ backgroundColor: uikitStyles.theme.colors.bgDisabled,
438
+ borderColor: uikitStyles.theme.colors.bgDisabled,
439
+ "&.HvButton-subtle": {
440
+ borderColor: uikitStyles.theme.colors.bgDisabled,
441
+ "&,:hover": {
442
+ backgroundColor: uikitStyles.theme.colors.bgDisabled
443
+ }
444
+ },
445
+ "&.HvButton-ghost": {
446
+ borderColor: uikitStyles.theme.colors.bgDisabled,
447
+ "&,:hover": {
448
+ backgroundColor: uikitStyles.theme.colors.bgDisabled
449
+ }
450
+ }
451
+ }
452
+ }
453
+ },
454
+ HvHeader: {
455
+ classes: {
456
+ root: {
457
+ borderBottom: `1px solid ${uikitStyles.theme.colors.atmo3}`,
458
+ boxShadow: "none"
459
+ }
460
+ }
461
+ },
462
+ HvHeaderBrand: {
463
+ classes: {
464
+ separator: {
465
+ backgroundColor: uikitStyles.theme.colors.atmo4,
466
+ margin: uikitStyles.theme.spacing(0, "md"),
467
+ height: 32
468
+ }
469
+ }
470
+ },
471
+ HvHeaderMenuBarBar: {
472
+ classes: {
473
+ active: {
474
+ boxShadow: "none",
475
+ borderBottom: `1px solid ${uikitStyles.theme.colors.atmo3}`
476
+ },
477
+ list: {
478
+ "& li:hover > .HvHeader-MenuBar-hidden": {
479
+ boxShadow: "none",
480
+ borderBottom: `1px solid ${uikitStyles.theme.colors.atmo3}`
481
+ },
482
+ "& li:focus-within > .HvHeader-MenuBar-hidden": {
483
+ boxShadow: "none",
484
+ borderBottom: `1px solid ${uikitStyles.theme.colors.atmo3}`
485
+ }
486
+ }
487
+ }
488
+ },
489
+ HvVerticalNavigation: {
490
+ classes: {
491
+ root: {
492
+ width: 280,
493
+ color: uikitStyles.theme.colors.base_light,
494
+ backgroundColor: uikitStyles.slate[900],
495
+ borderRight: `1px solid ${uikitStyles.slate[500]}`,
496
+ "& > :not(nav:first-of-type)": {
497
+ borderTop: `1px solid ${uikitStyles.slate[500]}`
498
+ },
499
+ "& > :only-child": {
500
+ padding: uikitStyles.theme.space.sm,
501
+ "& .HvVerticalNavigationSlider-listContainer": { padding: 0 }
502
+ }
503
+ },
504
+ slider: {
505
+ "& > div:first-of-type": {
506
+ borderBottom: `1px solid ${uikitStyles.slate[500]}`
507
+ }
508
+ }
509
+ }
510
+ },
511
+ HvVerticalNavigationAction: {
512
+ classes: {
513
+ action: {
514
+ borderRadius: uikitStyles.theme.radii.round,
515
+ "&:hover, &:focus": {
516
+ backgroundColor: uikitStyles.slate[700]
517
+ }
518
+ }
519
+ }
520
+ },
521
+ HvVerticalNavigationSlider: {
522
+ classes: {
523
+ root: {
524
+ minHeight: "32px",
525
+ borderLeft: "unset",
526
+ borderRadius: uikitStyles.theme.radii.round,
527
+ "&.HvIsFocused": {
528
+ backgroundColor: uikitStyles.slate[700]
529
+ },
530
+ "&.HvListItem-interactive:not(.HvListItem-disabled):not(.HvListItem-selected):hover": {
531
+ backgroundColor: uikitStyles.slate[700]
532
+ }
533
+ },
534
+ listItemDisabled: {
535
+ color: uikitStyles.neutral[500],
536
+ backgroundColor: uikitStyles.neutral[800],
537
+ "& .HvListItem-startAdornment": { backgroundColor: "transparent" },
538
+ "& .HvListItem-endAdornment": { backgroundColor: "transparent" }
539
+ },
540
+ listItemSelected: {
541
+ background: uikitStyles.blue[800],
542
+ borderLeft: "unset"
543
+ },
544
+ listItemFocus: {
545
+ background: uikitStyles.slate[700]
546
+ },
547
+ listContainer: {
548
+ padding: uikitStyles.theme.space.sm
549
+ }
550
+ }
551
+ },
552
+ HvVerticalNavigationTreeViewItem: {
553
+ classes: {
554
+ content: {
555
+ borderLeft: "unset",
556
+ borderRadius: uikitStyles.theme.radii.round,
557
+ ".HvVerticalNavigationTreeViewItem-selected>&": {
558
+ background: uikitStyles.blue[800],
559
+ borderLeft: "unset"
560
+ },
561
+ ":not(.HvVerticalNavigationTreeViewItem-disabled>&):not(.HvVerticalNavigationTreeViewItem-selected>&)": {
562
+ "&:hover, &:focus-visible, &.focus-visible": {
563
+ background: uikitStyles.slate[700]
564
+ }
565
+ },
566
+ ".HvVerticalNavigationTreeViewItem-focused>&": {
567
+ background: uikitStyles.slate[700]
568
+ }
569
+ },
570
+ disabled: {
571
+ "& .HvVerticalNavigationTreeViewItem-label": {
572
+ color: uikitStyles.neutral[500]
573
+ },
574
+ "& .HvVerticalNavigationTreeViewItem-content": {
575
+ background: uikitStyles.neutral[800]
576
+ }
577
+ },
578
+ icon: {
579
+ "& .HvAvatar-root": {
580
+ borderRadius: uikitStyles.theme.radii.round
581
+ }
582
+ }
583
+ }
584
+ },
585
+ HvCard: {
586
+ classes: {
587
+ root: {
588
+ outlineColor: uikitStyles.theme.colors.borderSubtle,
589
+ "--rb": uikitStyles.theme.radii.large,
590
+ // default non-semantic card
591
+ "&[data-color=sema0]": {
592
+ overflow: "hidden",
593
+ height: "fit-content",
594
+ "--rt": uikitStyles.theme.radii.large,
595
+ "& .HvCard-semanticContainer": {
596
+ display: "none"
597
+ }
598
+ },
599
+ "& > :last-child:not(.HvCardMedia-root)": {
600
+ paddingBottom: uikitStyles.theme.space.sm
601
+ },
602
+ "& .HvActionBar-root": {
603
+ padding: uikitStyles.theme.spacing("xs", "sm"),
604
+ borderTop: "none"
605
+ }
606
+ },
607
+ selectable: {
608
+ ":hover": {
609
+ outlineColor: uikitStyles.theme.colors.bgHover,
610
+ backgroundColor: uikitStyles.theme.colors.primaryDimmed
611
+ }
612
+ },
613
+ selected: {
614
+ outlineColor: uikitStyles.theme.colors.primaryDeep
615
+ },
616
+ semanticBar: {
617
+ "--bar-height": "2px",
618
+ borderRadius: `${uikitStyles.theme.radii.base} ${uikitStyles.theme.radii.base} 0 0`
619
+ }
620
+ }
621
+ },
622
+ HvCardHeader: {
623
+ classes: {
624
+ root: {
625
+ flexDirection: "row-reverse",
626
+ padding: uikitStyles.theme.spacing("xs", "sm"),
627
+ gap: 0
628
+ }
629
+ }
630
+ },
631
+ HvCardContent: {
632
+ classes: {
633
+ content: {
634
+ padding: uikitStyles.theme.spacing("xs", "sm"),
635
+ "&:last-child": {
636
+ paddingBottom: uikitStyles.theme.space.xs
637
+ }
638
+ }
639
+ }
640
+ },
641
+ HvFooter: {
642
+ name: "Pentaho+"
643
+ },
644
+ HvTabs: {
645
+ classes: {
646
+ floating: {
647
+ "& .HvTab-root": {
648
+ marginTop: 0,
649
+ zIndex: 1,
650
+ "&:is(.HvTab-selected)": {
651
+ borderColor: "transparent",
652
+ backgroundColor: "transparent"
653
+ },
654
+ "&:hover": {
655
+ borderRadius: uikitStyles.theme.radii.full
656
+ },
657
+ "::after": {
658
+ display: "none"
659
+ }
660
+ },
661
+ "& .HvTabs-indicator": {
662
+ height: "100%",
663
+ backgroundColor: uikitStyles.theme.colors.bgContainer,
664
+ border: `1px solid ${uikitStyles.theme.colors.primary}`,
665
+ borderRadius: uikitStyles.theme.radii.full
666
+ },
667
+ "& .HvTabs-flexContainer": {
668
+ display: "inline-flex",
669
+ backgroundColor: uikitStyles.theme.colors.bgPageSecondary,
670
+ borderRadius: uikitStyles.theme.radii.full,
671
+ marginLeft: 0
672
+ }
673
+ }
674
+ }
675
+ },
676
+ HvLabel: {
677
+ classes: {
678
+ root: {
679
+ "& span[aria-hidden]": {
680
+ color: uikitStyles.theme.form.errorColor
681
+ }
682
+ }
683
+ }
684
+ },
685
+ HvBaseInput: {
686
+ classes: {
687
+ root: {
688
+ borderColor: uikitStyles.theme.colors.textDimmed,
689
+ backgroundColor: inputColors.bg
690
+ },
691
+ disabled: {
692
+ backgroundColor: uikitStyles.theme.colors.bgDisabled
693
+ }
694
+ }
695
+ },
696
+ HvInput: {
697
+ classes: {
698
+ label: {
699
+ "& span[aria-hidden]::before": {
700
+ content: '" "'
701
+ }
702
+ },
703
+ inputRoot: {
704
+ ":has([type=search])": {
705
+ borderRadius: uikitStyles.theme.radii.full
706
+ }
707
+ },
708
+ inputExtension: {
709
+ backgroundColor: "transparent",
710
+ height: 0,
711
+ boxShadow: "none"
712
+ }
713
+ }
714
+ },
715
+ HvBaseDropdown: {
716
+ classes: {
717
+ header: {
718
+ borderColor: uikitStyles.theme.colors.textDimmed,
719
+ backgroundColor: inputColors.bg
720
+ },
721
+ headerOpen: {
722
+ "&,:hover": {
723
+ borderColor: uikitStyles.theme.colors.textDimmed
724
+ }
725
+ },
726
+ panel: {
727
+ "&[data-popper-placement*='top'],&[data-popper-placement*='bottom']": {
728
+ ...popperStyles
729
+ }
730
+ }
731
+ }
732
+ },
733
+ HvDropDownMenu: {
734
+ classes: {
735
+ root: {
736
+ "--r": "calc(var(--HvButton-height) / 2)"
737
+ },
738
+ iconSelected: {
739
+ "&[data-color=secondary]": {
740
+ borderColor: uikitStyles.theme.colors.textDimmed
741
+ }
742
+ }
743
+ }
744
+ },
745
+ HvNumberInput: {
746
+ classes: {
747
+ root: {
748
+ ".HvBaseInput-disabled .HvInput-adornmentsBox": {
749
+ backgroundColor: uikitStyles.theme.colors.bgDisabled
750
+ }
751
+ },
752
+ adornmentsBox: {
753
+ backgroundColor: uikitStyles.theme.colors.bgContainer,
754
+ borderLeft: `1px solid ${uikitStyles.theme.colors.border}`,
755
+ borderRadius: uikitStyles.theme.radii.none
756
+ }
757
+ }
758
+ }
759
+ }
760
+ });
761
+ exports.pentahoPlus = pentahoPlus;