@cloudoperators/juno-ui-components 5.3.0 → 5.5.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.
- package/build/components/Button/Button.component.d.ts +1 -1
- package/build/components/Icon/Icon.component.d.ts +7 -1
- package/build/components/Icon/Icon.component.d.ts.map +1 -1
- package/build/components/Icon/Icon.stories.d.ts +6 -0
- package/build/components/Icon/Icon.stories.d.ts.map +1 -1
- package/build/components/PageHeader/PageHeader.component.d.ts +27 -7
- package/build/components/PageHeader/PageHeader.component.d.ts.map +1 -1
- package/build/components/PageHeader/PageHeader.stories.d.ts +3 -3
- package/build/components/PageHeader/PageHeader.stories.d.ts.map +1 -1
- package/build/index.js +4045 -3928
- package/build/juno-ui-components.css +1 -1
- package/build/theme.css +55 -1
- package/package.json +3 -14
package/build/theme.css
CHANGED
|
@@ -245,6 +245,13 @@
|
|
|
245
245
|
--color-theme-info: var(--color-info);
|
|
246
246
|
--color-theme-success: var(--color-success);
|
|
247
247
|
--color-theme-warning: var(--color-warning);
|
|
248
|
+
--color-theme-severity-critical: var(--color-severity-critical);
|
|
249
|
+
--color-theme-severity-very-high: var(--color-severity-very-high);
|
|
250
|
+
--color-theme-severity-high: var(--color-severity-high);
|
|
251
|
+
--color-theme-severity-medium: var(--color-severity-medium);
|
|
252
|
+
--color-theme-severity-low: var(--color-severity-low);
|
|
253
|
+
--color-theme-severity-none: var(--color-severity-none);
|
|
254
|
+
--color-theme-severity-unknown: var(--color-severity-unknown);
|
|
248
255
|
--color-theme-focus: var(--color-focus);
|
|
249
256
|
--color-theme-background-lvl-0: var(--color-background-lvl-0);
|
|
250
257
|
--color-theme-background-lvl-1: var(--color-background-lvl-1);
|
|
@@ -304,6 +311,7 @@
|
|
|
304
311
|
--color-theme-button-subdued: var(--color-button-subdued-text);
|
|
305
312
|
--color-theme-button-sundued-hover: var(--color-button-subdued-hover-text);
|
|
306
313
|
--color-theme-button-sundued-active: var(--color-button-subdued-active-text);
|
|
314
|
+
|
|
307
315
|
/* TODO Border Color */
|
|
308
316
|
--border-theme-button-subdued: 1px solid var(--color-button-subdued-border);
|
|
309
317
|
--border-theme-button-subdued-hover: var(--color-button-subdued-hover-border);
|
|
@@ -332,6 +340,7 @@
|
|
|
332
340
|
--background-color-theme-message-border-success: var(--color-message-success-border);
|
|
333
341
|
--background-color-theme-modal-backdrop: var(--color-modal-backdrop-bg);
|
|
334
342
|
--background-color-theme-panel: var(--color-panel-bg);
|
|
343
|
+
--background-color-theme-pageheader: var(--color-pageheader-background);
|
|
335
344
|
--background-color-theme-radio: var(--color-radio-bg);
|
|
336
345
|
--background-color-theme-radio-checked: var(--color-radio-checked-bg);
|
|
337
346
|
--background-color-theme-required: var(--color-required-bg);
|
|
@@ -365,6 +374,9 @@
|
|
|
365
374
|
--text-color-theme-textinput-autofill: var(--color-textinput-autofill-text);
|
|
366
375
|
--text-color-theme-textinput-autofill-label: var(--color-textinput-autofill-label);
|
|
367
376
|
--text-color-theme-checkbox-checked: var(--color-checkbox-checked-color);
|
|
377
|
+
--text-color-theme-pageheader-appname-active: var(--color-pageheader-appname-text-active);
|
|
378
|
+
--text-color-theme-pageheader-appname-default: var(--color-pageheader-appname-text-default);
|
|
379
|
+
--text-color-theme-pageheader-appname-hover: var(--color-pageheader-appname-text-hover);
|
|
368
380
|
--text-color-theme-sidenavigation-item-active: var(--color-sidenavigation-item-active);
|
|
369
381
|
|
|
370
382
|
/* Component Border Colors: */
|
|
@@ -392,6 +404,8 @@
|
|
|
392
404
|
|
|
393
405
|
--border-color-theme-panel: var(--color-panel-border);
|
|
394
406
|
|
|
407
|
+
--border-color-theme-pageheader: var(--color-pageheader-border);
|
|
408
|
+
|
|
395
409
|
--border-color-theme-switch-default: var(--color-switch-default-border);
|
|
396
410
|
--border-color-theme-switch-hover: var(--color-switch-hover-border);
|
|
397
411
|
|
|
@@ -452,6 +466,7 @@
|
|
|
452
466
|
--color-warning: rgb(255, 175, 0);
|
|
453
467
|
--color-danger: rgb(199, 0, 0);
|
|
454
468
|
--color-error: rgb(199, 0, 0);
|
|
469
|
+
|
|
455
470
|
--color-juno-text-light: rgb(150, 150, 150);
|
|
456
471
|
--color-juno-text-default: rgb(76, 76, 76);
|
|
457
472
|
--color-juno-text-high: rgb(64, 64, 64);
|
|
@@ -538,10 +553,24 @@
|
|
|
538
553
|
--color-button-primary-danger-active-bg: var(--color-juno-primary-danger-5);
|
|
539
554
|
|
|
540
555
|
/* LT Icon */
|
|
556
|
+
--color-severity-critical: rgb(165, 11, 11);
|
|
557
|
+
--color-severity-very-high: rgb(223, 0, 0);
|
|
558
|
+
--color-severity-high: rgb(244, 89, 0);
|
|
559
|
+
--color-severity-medium: rgb(243, 138, 0);
|
|
560
|
+
--color-severity-low: rgb(255, 229, 0);
|
|
561
|
+
--color-severity-none: var(--color-text-disabled);
|
|
562
|
+
--color-severity-unknown: var(--color-text-light);
|
|
563
|
+
|
|
541
564
|
--color-icon-danger: var(--danger);
|
|
542
565
|
--color-icon-info: var(--color-accent);
|
|
543
566
|
--color-icon-success: var(--color-sap-green);
|
|
544
567
|
--color-icon-warning: var(--color-warning);
|
|
568
|
+
--color-icon-severityCritical: var(--color-severity-critical);
|
|
569
|
+
--color-icon-severityVeryHigh: var(--color-severity-very-high);
|
|
570
|
+
--color-icon-severityHigh: var(--color-severity-high);
|
|
571
|
+
--color-icon-severityMedium: var(--color-severity-medium);
|
|
572
|
+
--color-icon-severityLow: var(--color-severity-low);
|
|
573
|
+
|
|
545
574
|
/* LT Message */
|
|
546
575
|
--color-message-danger-border: var(--color-danger);
|
|
547
576
|
--gradient-message-danger-bg: linear-gradient(90deg, rgb(255, 231, 224) 0%, rgb(255, 180, 158) 100%);
|
|
@@ -613,6 +642,12 @@
|
|
|
613
642
|
--color-codeblock-bar-border: var(--color-background-lvl-4);
|
|
614
643
|
/* LT Panel */
|
|
615
644
|
--color-panel-bg: rgb(252 252 252 / 0.8);
|
|
645
|
+
/* LT PageHeader */
|
|
646
|
+
--color-pageheader-background: var(--color-white);
|
|
647
|
+
--color-pageheader-border: var(--color-juno-grey-light-7);
|
|
648
|
+
--color-pageheader-appname-text-default: var(--color-text-highest);
|
|
649
|
+
--color-pageheader-appname-text-hover: var(--color-text-highest);
|
|
650
|
+
--color-pageheader-appname-text-active: var(--color-text-highest);
|
|
616
651
|
/* LT TabNavigation */
|
|
617
652
|
--color-tabnavigation-top-bg: var(--color-juno-grey-light-5);
|
|
618
653
|
--color-tabnavigation-content-bottom-border: var(--color-background-lvl-4);
|
|
@@ -746,10 +781,24 @@
|
|
|
746
781
|
--color-button-primary-danger-active-bg: var(--color-juno-primary-danger-5);
|
|
747
782
|
|
|
748
783
|
/* DT Icon */
|
|
784
|
+
--color-severity-critical: rgb(255, 18, 20);
|
|
785
|
+
--color-severity-very-high: rgb(255, 68, 16);
|
|
786
|
+
--color-severity-high: rgb(255, 110, 13);
|
|
787
|
+
--color-severity-medium: rgb(255, 164, 8);
|
|
788
|
+
--color-severity-low: rgb(255, 247, 1);
|
|
789
|
+
--color-severity-none: var(--color-text-disabled);
|
|
790
|
+
--color-severity-unknown: var(--color-text-light);
|
|
791
|
+
|
|
749
792
|
--color-icon-danger: var(--color-juno-danger);
|
|
750
793
|
--color-icon-info: var(--color-accent);
|
|
751
794
|
--color-icon-success: var(--color-sap-green-5);
|
|
752
795
|
--color-icon-warning: var(--color-warning);
|
|
796
|
+
--color-icon-severityCritical: var(--color-severity-critical);
|
|
797
|
+
--color-icon-severityVeryHigh: var(--color-severity-very-high);
|
|
798
|
+
--color-icon-severityHigh: var(--color-severity-high);
|
|
799
|
+
--color-icon-severityMedium: var(--color-severity-medium);
|
|
800
|
+
--color-icon-severityLow: var(--color-severity-low);
|
|
801
|
+
|
|
753
802
|
/* DT Message */
|
|
754
803
|
--color-message-danger-border: var(--color-danger);
|
|
755
804
|
--gradient-message-danger-bg: linear-gradient(90deg, rgb(57, 39, 38) 0%, rgb(124, 48, 30) 100%);
|
|
@@ -820,7 +869,12 @@
|
|
|
820
869
|
--color-codeblock-bar-border: var(--color-background-lvl-4);
|
|
821
870
|
/* DT Panel */
|
|
822
871
|
--color-panel-bg: rgb(from var(--color-juno-grey-blue-11) r g b / 0.75);
|
|
823
|
-
|
|
872
|
+
/* DT PageHeader */
|
|
873
|
+
--color-pageheader-background: var(--color-juno-grey-blue-11);
|
|
874
|
+
--color-pageheader-border: var(--color-juno-grey-blue-3);
|
|
875
|
+
--color-pageheader-appname-text-default: var(--color-text-highest);
|
|
876
|
+
--color-pageheader-appname-text-hover: var(--color-text-highest);
|
|
877
|
+
--color-pageheader-appname-text-active: var(--color-text-highest);
|
|
824
878
|
/* DT TabNavigation */
|
|
825
879
|
--color-tabnavigation-top-bg: var(--color-juno-grey-blue-8);
|
|
826
880
|
--color-tabnavigation-content-bottom-border: var(--color-background-lvl-4);
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@cloudoperators/juno-ui-components",
|
|
3
3
|
"private": false,
|
|
4
4
|
"source": "src/index.js",
|
|
5
|
-
"version": "5.
|
|
5
|
+
"version": "5.5.0",
|
|
6
6
|
"types": "build/index.d.ts",
|
|
7
7
|
"exports": {
|
|
8
8
|
"./index": "./build/index.js",
|
|
@@ -26,42 +26,31 @@
|
|
|
26
26
|
"pnpm": ">=8.0.0"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
|
+
"@babel/preset-env": "^7.28.3",
|
|
30
|
+
"@babel/preset-react": "^7.27.1",
|
|
29
31
|
"@floating-ui/react": "0.27.13",
|
|
30
32
|
"@headlessui/react": "2.2.4",
|
|
31
33
|
"@material-design-icons/svg": "0.14.15",
|
|
32
34
|
"@storybook/addon-docs": "^9.0.15",
|
|
33
35
|
"@storybook/addon-links": "^9.0.15",
|
|
34
36
|
"@storybook/react-vite": "^9.0.15",
|
|
35
|
-
"@svgr/webpack": "6.5.1",
|
|
36
|
-
"@tailwindcss/postcss": "^4.1.3",
|
|
37
37
|
"@tailwindcss/vite": "^4.1.11",
|
|
38
|
-
"@testing-library/dom": "10.4.0",
|
|
39
38
|
"@testing-library/jest-dom": "6.6.3",
|
|
40
39
|
"@testing-library/react": "16.3.0",
|
|
41
40
|
"@testing-library/user-event": "14.6.1",
|
|
42
41
|
"@types/react": "19.1.8",
|
|
43
42
|
"@types/react-dom": "19.1.6",
|
|
44
43
|
"@vitejs/plugin-react": "^4.6.0",
|
|
45
|
-
"add": "2.0.6",
|
|
46
|
-
"autoprefixer": "10.4.21",
|
|
47
|
-
"css-loader": "6.11.0",
|
|
48
44
|
"eslint-plugin-storybook": "^9.0.15",
|
|
49
45
|
"flatpickr": "4.6.13",
|
|
50
46
|
"focus-trap-react": "11.0.4",
|
|
51
|
-
"glob": "8.1.0",
|
|
52
47
|
"jsdom": "^26.1.0",
|
|
53
48
|
"node-sass-glob-importer": "3.0.2",
|
|
54
49
|
"react": "19.1.0",
|
|
55
50
|
"react-dom": "19.1.0",
|
|
56
51
|
"react-tabs": "6.1.0",
|
|
57
|
-
"react-test-renderer": "19.1.0",
|
|
58
|
-
"regenerator-runtime": "0.14.1",
|
|
59
|
-
"sass": "1.81.1",
|
|
60
|
-
"sass-loader": "12.6.0",
|
|
61
52
|
"storybook": "^9.0.15",
|
|
62
|
-
"style-loader": "3.3.4",
|
|
63
53
|
"tailwindcss": "^4.1.7",
|
|
64
|
-
"ts-loader": "9.5.2",
|
|
65
54
|
"typescript": "^5.8.3",
|
|
66
55
|
"vite": "^7.0.3",
|
|
67
56
|
"vite-plugin-dts": "^4.5.4",
|