@patternfly/react-core 4.221.0 → 4.221.3
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 +24 -0
- package/dist/esm/components/DataList/DataList.d.ts +9 -0
- package/dist/esm/components/DataList/DataList.d.ts.map +1 -1
- package/dist/esm/components/DataList/DataList.js +3 -2
- package/dist/esm/components/DataList/DataList.js.map +1 -1
- package/dist/esm/components/DataList/DataListItem.d.ts +2 -0
- package/dist/esm/components/DataList/DataListItem.d.ts.map +1 -1
- package/dist/esm/components/DataList/DataListItem.js +13 -6
- package/dist/esm/components/DataList/DataListItem.js.map +1 -1
- package/dist/esm/components/Select/Select.d.ts +2 -0
- package/dist/esm/components/Select/Select.d.ts.map +1 -1
- package/dist/esm/components/Select/Select.js +8 -7
- package/dist/esm/components/Select/Select.js.map +1 -1
- package/dist/js/components/DataList/DataList.d.ts +9 -0
- package/dist/js/components/DataList/DataList.d.ts.map +1 -1
- package/dist/js/components/DataList/DataList.js +3 -2
- package/dist/js/components/DataList/DataList.js.map +1 -1
- package/dist/js/components/DataList/DataListItem.d.ts +2 -0
- package/dist/js/components/DataList/DataListItem.d.ts.map +1 -1
- package/dist/js/components/DataList/DataListItem.js +13 -6
- package/dist/js/components/DataList/DataListItem.js.map +1 -1
- package/dist/js/components/Select/Select.d.ts +2 -0
- package/dist/js/components/Select/Select.d.ts.map +1 -1
- package/dist/js/components/Select/Select.js +8 -7
- package/dist/js/components/Select/Select.js.map +1 -1
- package/dist/styles/assets/images/icon-github.hbs +4 -0
- package/dist/styles/assets/images/icon-google.hbs +4 -0
- package/dist/styles/assets/images/icon-red-hat.hbs +1 -0
- package/dist/styles/base-no-reset.css +93 -4
- package/dist/styles/base.css +93 -4
- package/dist/umd/react-core.css +790 -8
- package/dist/umd/react-core.js +110 -53
- package/dist/umd/react-core.min.css +790 -8
- package/dist/umd/react-core.min.js +4 -4
- package/package.json +6 -6
- package/src/components/DataList/DataList.tsx +12 -0
- package/src/components/DataList/DataListItem.tsx +32 -3
- package/src/components/DataList/__tests__/DataList.test.tsx +130 -0
- package/src/components/DataList/examples/DataList.md +1 -0
- package/src/components/DataList/examples/DataListSelectableRows.tsx +5 -0
- package/src/components/Select/Select.tsx +8 -2
- package/src/demos/PrimaryDetail.md +1 -1
package/dist/styles/base.css
CHANGED
|
@@ -100,6 +100,7 @@
|
|
|
100
100
|
--pf-global--palette--light-green-500: #6ca100;
|
|
101
101
|
--pf-global--palette--light-green-600: #486b00;
|
|
102
102
|
--pf-global--palette--light-green-700: #253600;
|
|
103
|
+
--pf-global--palette--orange-50: #fff6ec;
|
|
103
104
|
--pf-global--palette--orange-100: #f4b678;
|
|
104
105
|
--pf-global--palette--orange-200: #ef9234;
|
|
105
106
|
--pf-global--palette--orange-300: #ec7a08;
|
|
@@ -123,6 +124,7 @@
|
|
|
123
124
|
--pf-global--palette--red-500: #2c0000;
|
|
124
125
|
--pf-global--palette--white: #fff;
|
|
125
126
|
--pf-global--BackgroundColor--100: #fff;
|
|
127
|
+
--pf-global--BackgroundColor--150: #fafafa;
|
|
126
128
|
--pf-global--BackgroundColor--200: #f0f0f0;
|
|
127
129
|
--pf-global--BackgroundColor--light-100: #fff;
|
|
128
130
|
--pf-global--BackgroundColor--light-200: #fafafa;
|
|
@@ -298,6 +300,89 @@
|
|
|
298
300
|
--pf-global--FontFamily--monospace: var(--pf-global--FontFamily--redhatVF--monospace);
|
|
299
301
|
}
|
|
300
302
|
|
|
303
|
+
:root:where(.pf-theme-dark) {
|
|
304
|
+
--pf-global--palette--black-50: #e0e0e0;
|
|
305
|
+
--pf-global--palette--black-100: #c6c7c8;
|
|
306
|
+
--pf-global--palette--black-200: #aaabac;
|
|
307
|
+
--pf-global--palette--black-300: #868789;
|
|
308
|
+
--pf-global--palette--black-400: #57585a;
|
|
309
|
+
--pf-global--palette--black-500: #444548;
|
|
310
|
+
--pf-global--palette--black-600: #36373a;
|
|
311
|
+
--pf-global--palette--black-700: #26292d;
|
|
312
|
+
--pf-global--palette--black-800: #1b1d21;
|
|
313
|
+
--pf-global--palette--black-900: #0f1214;
|
|
314
|
+
--pf-global--palette--red-9999: #fe5142;
|
|
315
|
+
--pf-global--palette--red-8888: #fe6a5d;
|
|
316
|
+
--pf-global--palette--blue-300: #1fa7f8;
|
|
317
|
+
--pf-global--BackgroundColor--100: #1b1d21;
|
|
318
|
+
--pf-global--BackgroundColor--150: #212427;
|
|
319
|
+
--pf-global--BackgroundColor--200: #0f1214;
|
|
320
|
+
--pf-global--BackgroundColor--300: #26292d;
|
|
321
|
+
--pf-global--BackgroundColor--400: #36373a;
|
|
322
|
+
--pf-global--BorderColor--100: #444548;
|
|
323
|
+
--pf-global--BorderColor--200: #444548;
|
|
324
|
+
--pf-global--BorderColor--300: #57585a;
|
|
325
|
+
--pf-global--BorderColor--400: #aaabac;
|
|
326
|
+
--pf-global--Color--100: #e0e0e0;
|
|
327
|
+
--pf-global--Color--200: #aaabac;
|
|
328
|
+
--pf-global--active-color--100: #1fa7f8;
|
|
329
|
+
--pf-global--primary-color--100: #1fa7f8;
|
|
330
|
+
--pf-global--primary-color--300: #06c;
|
|
331
|
+
--pf-global--success-color--100: #5ba352;
|
|
332
|
+
--pf-global--warning-color--100: #f0ab00;
|
|
333
|
+
--pf-global--warning-color--200: #f4c145;
|
|
334
|
+
--pf-global--danger-color--100: #fe5142;
|
|
335
|
+
--pf-global--danger-color--200: #fe6a5d;
|
|
336
|
+
--pf-global--link--Color: #1fa7f8;
|
|
337
|
+
--pf-global--link--Color--hover: #73bcf7;
|
|
338
|
+
--pf-global--disabled-color--100: #57585a;
|
|
339
|
+
--pf-global--disabled-color--200: #444548;
|
|
340
|
+
--pf-global--disabled-color--300: #aaabac;
|
|
341
|
+
--pf-global--icon--Color--light: #aaabac;
|
|
342
|
+
--pf-global--icon--Color--dark: #aaabac;
|
|
343
|
+
--pf-global--Color--dark-100: #e0e0e0;
|
|
344
|
+
--pf-global--Color--dark-200: #aaabac;
|
|
345
|
+
--pf-global--Color--light-100: #e0e0e0;
|
|
346
|
+
--pf-global--Color--light-200: #aaabac;
|
|
347
|
+
--pf-global--Color--light-300: #3c3f42;
|
|
348
|
+
--pf-global--BorderColor--dark-100: #444548;
|
|
349
|
+
--pf-global--BorderColor--light-100: #444548;
|
|
350
|
+
--pf-global--primary-color--light-100: #1fa7f8;
|
|
351
|
+
--pf-global--primary-color--dark-100: #1fa7f8;
|
|
352
|
+
--pf-global--link--Color--light: #1fa7f8;
|
|
353
|
+
--pf-global--link--Color--light--hover: #73bcf7;
|
|
354
|
+
--pf-global--link--Color--dark: #1fa7f8;
|
|
355
|
+
--pf-global--link--Color--dark--hover: #73bcf7;
|
|
356
|
+
--pf-global--BackgroundColor--light-100: #1b1d21;
|
|
357
|
+
--pf-global--BackgroundColor--light-200: #0f1214;
|
|
358
|
+
--pf-global--BackgroundColor--light-300: #26292d;
|
|
359
|
+
--pf-global--BackgroundColor--dark-100: #1b1d21;
|
|
360
|
+
--pf-global--BackgroundColor--dark-200: #0f1214;
|
|
361
|
+
--pf-global--BackgroundColor--dark-300: #26292d;
|
|
362
|
+
--pf-global--BackgroundColor--dark-400: #36373a;
|
|
363
|
+
--pf-global--BoxShadow--sm: 0 0.0625rem 0.125rem 0 rgba(3, 3, 3, 0.48), 0 0 0.125rem 0 rgba(3, 3, 3, 0.24);
|
|
364
|
+
--pf-global--BoxShadow--sm-top: 0 -0.125rem 0.25rem -0.0625rem rgba(3, 3, 3, 0.64);
|
|
365
|
+
--pf-global--BoxShadow--sm-right: 0.125rem 0 0.25rem -0.0625rem rgba(3, 3, 3, 0.64);
|
|
366
|
+
--pf-global--BoxShadow--sm-bottom: 0 0.125rem 0.25rem -0.0625rem rgba(3, 3, 3, 0.64);
|
|
367
|
+
--pf-global--BoxShadow--sm-left: -0.125rem 0 0.25rem -0.0625rem rgba(3, 3, 3, 0.64);
|
|
368
|
+
--pf-global--BoxShadow--md: 0 0.25rem 0.5rem 0rem rgba(3, 3, 3, 0.48), 0 0 0.25rem 0 rgba(3, 3, 3, 0.24);
|
|
369
|
+
--pf-global--BoxShadow--md-top: 0 -0.5rem 0.5rem -0.375rem rgba(3, 3, 3, 0.72);
|
|
370
|
+
--pf-global--BoxShadow--md-right: 0.5rem 0 0.5rem -0.375rem rgba(3, 3, 3, 0.72);
|
|
371
|
+
--pf-global--BoxShadow--md-bottom: 0 0.5rem 0.5rem -0.375rem rgba(3, 3, 3, 0.72);
|
|
372
|
+
--pf-global--BoxShadow--md-left: -0.5rem 0 0.5rem -0.375rem rgba(3, 3, 3, 0.72);
|
|
373
|
+
--pf-global--BoxShadow--lg: 0 0.5rem 1rem 0 rgba(3, 3, 3, 0.64), 0 0 0.375rem 0 rgba(3, 3, 3, 0.32);
|
|
374
|
+
--pf-global--BoxShadow--lg-top: 0 -0.75rem 0.75rem -0.5rem rgba(3, 3, 3, 0.72);
|
|
375
|
+
--pf-global--BoxShadow--lg-right: 0.75rem 0 0.75rem -0.5rem rgba(3, 3, 3, 0.72);
|
|
376
|
+
--pf-global--BoxShadow--lg-bottom: 0 0.75rem 0.75rem -0.5rem rgba(3, 3, 3, 0.72);
|
|
377
|
+
--pf-global--BoxShadow--lg-left: -0.75rem 0 0.75rem -0.5rem rgba(3, 3, 3, 0.72);
|
|
378
|
+
--pf-global--BoxShadow--xl: 0 1rem 2rem 0 rgba(3, 3, 3, 0.64), 0 0 0.5rem 0 rgba(3, 3, 3, 0.4);
|
|
379
|
+
--pf-global--BoxShadow--xl-top: 0 -1rem 1rem -0.5rem rgba(3, 3, 3, 0.8);
|
|
380
|
+
--pf-global--BoxShadow--xl-right: 1rem 0 1rem -0.5rem rgba(3, 3, 3, 0.8);
|
|
381
|
+
--pf-global--BoxShadow--xl-bottom: 0 1rem 1rem -0.5rem rgba(3, 3, 3, 0.8);
|
|
382
|
+
--pf-global--BoxShadow--xl-left: -1rem 0 1rem -0.5rem rgba(3, 3, 3, 0.8);
|
|
383
|
+
--pf-global--BoxShadow--inset: inset 0 0 0.625rem 0 #030303;
|
|
384
|
+
}
|
|
385
|
+
|
|
301
386
|
@font-face {
|
|
302
387
|
font-family: "RedHatDisplay";
|
|
303
388
|
src: url("./assets/fonts/RedHatDisplay/RedHatDisplay-Regular.woff2") format("woff2"), url("./assets/fonts/RedHatDisplay/RedHatDisplay-Regular.woff") format("woff");
|
|
@@ -728,6 +813,10 @@ a {
|
|
|
728
813
|
font-weight: var(--pf-global--FontWeight--semi-bold);
|
|
729
814
|
}
|
|
730
815
|
|
|
816
|
+
:root:where(.pf-theme-dark) {
|
|
817
|
+
color-scheme: dark;
|
|
818
|
+
}
|
|
819
|
+
|
|
731
820
|
.pf-t-dark.pf-m-transparent {
|
|
732
821
|
background-color: transparent;
|
|
733
822
|
}
|
|
@@ -741,11 +830,11 @@ a {
|
|
|
741
830
|
}
|
|
742
831
|
|
|
743
832
|
.pf-t-dark.pf-m-opaque-100 {
|
|
744
|
-
background-color: #
|
|
833
|
+
background-color: #1b1d21;
|
|
745
834
|
}
|
|
746
835
|
|
|
747
836
|
.pf-t-dark.pf-m-opaque-200 {
|
|
748
|
-
background-color: #
|
|
837
|
+
background-color: #0f1214;
|
|
749
838
|
}
|
|
750
839
|
|
|
751
840
|
.pf-t-light.pf-m-transparent {
|
|
@@ -757,11 +846,11 @@ a {
|
|
|
757
846
|
}
|
|
758
847
|
|
|
759
848
|
.pf-t-light.pf-m-opaque-200 {
|
|
760
|
-
background-color: #
|
|
849
|
+
background-color: #c6c7c8;
|
|
761
850
|
}
|
|
762
851
|
|
|
763
852
|
.pf-t-light.pf-m-opaque-300 {
|
|
764
|
-
background-color: #
|
|
853
|
+
background-color: #aaabac;
|
|
765
854
|
}
|
|
766
855
|
|
|
767
856
|
@font-face {
|