@uxf/ui 11.94.0 → 11.95.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.
|
@@ -65,10 +65,11 @@ try {
|
|
|
65
65
|
const UXF_PREFIX = "--uxf-color-";
|
|
66
66
|
const ROOT_REGEXP = /:root\s*{\s*|}\s*$/g;
|
|
67
67
|
const PREFIX_REGEXP = /^\s*--/gm;
|
|
68
|
+
const HSL_REGEXP = /hsl\((\d+)\s*(\d+)\s*(\d+%)\)/g;
|
|
68
69
|
|
|
69
|
-
const cleanedPrimitives = primitives.replace(ROOT_REGEXP, "");
|
|
70
|
-
const cleanedColorsLight = colorsLight.replace(ROOT_REGEXP, "").replace(PREFIX_REGEXP, "" + UXF_PREFIX);
|
|
71
|
-
const cleanedColorsDark = colorsDark.replace(ROOT_REGEXP, "").replace(PREFIX_REGEXP, "" + UXF_PREFIX);
|
|
70
|
+
const cleanedPrimitives = primitives.replace(ROOT_REGEXP, "").replaceAll(HSL_REGEXP, "hsl($1 $2% $3)");
|
|
71
|
+
const cleanedColorsLight = colorsLight.replace(ROOT_REGEXP, "").replace(PREFIX_REGEXP, "" + UXF_PREFIX).replaceAll(HSL_REGEXP, "hsl($1 $2% $3)");
|
|
72
|
+
const cleanedColorsDark = colorsDark.replace(ROOT_REGEXP, "").replace(PREFIX_REGEXP, "" + UXF_PREFIX).replaceAll(HSL_REGEXP, "hsl($1 $2% $3)");
|
|
72
73
|
|
|
73
74
|
const mergedTokens = `/* this file is generated automatically, do not change anything manually in the contents of this file */
|
|
74
75
|
:root {
|
package/css/figma-colors.css
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/* this file is generated automatically, do not change anything manually in the contents of this file */
|
|
2
2
|
:root {
|
|
3
|
-
--base-black: hsl(0 0 0%);
|
|
4
|
-
--base-white: hsl(0 0 100%);
|
|
3
|
+
--base-black: hsl(0 0% 0%);
|
|
4
|
+
--base-white: hsl(0 0% 100%);
|
|
5
5
|
--bluedark-100: hsl(220 100% 91%);
|
|
6
6
|
--bluedark-200: hsl(221 100% 85%);
|
|
7
7
|
--bluedark-25: hsl(222 100% 98%);
|
|
@@ -93,7 +93,7 @@
|
|
|
93
93
|
--grayiron-200: hsl(240 6% 90%);
|
|
94
94
|
--grayiron-300: hsl(240 6% 83%);
|
|
95
95
|
--grayiron-400: hsl(240 6% 65%);
|
|
96
|
-
--grayiron-50: hsl(0 0 98%);
|
|
96
|
+
--grayiron-50: hsl(0 0% 98%);
|
|
97
97
|
--grayiron-500: hsl(240 5% 46%);
|
|
98
98
|
--grayiron-600: hsl(235 6% 34%);
|
|
99
99
|
--grayiron-700: hsl(240 5% 26%);
|
|
@@ -121,17 +121,17 @@
|
|
|
121
121
|
--grayneutral-700: hsl(215 18% 27%);
|
|
122
122
|
--grayneutral-800: hsl(212 28% 17%);
|
|
123
123
|
--grayneutral-900: hsl(218 39% 11%);
|
|
124
|
-
--graytrue-100: hsl(0 0 96%);
|
|
125
|
-
--graytrue-200: hsl(0 0 90%);
|
|
126
|
-
--graytrue-25: hsl(0 0 99%);
|
|
127
|
-
--graytrue-300: hsl(0 0 84%);
|
|
128
|
-
--graytrue-400: hsl(0 0 64%);
|
|
129
|
-
--graytrue-50: hsl(0 0 98%);
|
|
130
|
-
--graytrue-500: hsl(0 0 45%);
|
|
131
|
-
--graytrue-600: hsl(0 0 32%);
|
|
132
|
-
--graytrue-700: hsl(0 0 26%);
|
|
133
|
-
--graytrue-800: hsl(0 0 16%);
|
|
134
|
-
--graytrue-900: hsl(0 0 8%);
|
|
124
|
+
--graytrue-100: hsl(0 0% 96%);
|
|
125
|
+
--graytrue-200: hsl(0 0% 90%);
|
|
126
|
+
--graytrue-25: hsl(0 0% 99%);
|
|
127
|
+
--graytrue-300: hsl(0 0% 84%);
|
|
128
|
+
--graytrue-400: hsl(0 0% 64%);
|
|
129
|
+
--graytrue-50: hsl(0 0% 98%);
|
|
130
|
+
--graytrue-500: hsl(0 0% 45%);
|
|
131
|
+
--graytrue-600: hsl(0 0% 32%);
|
|
132
|
+
--graytrue-700: hsl(0 0% 26%);
|
|
133
|
+
--graytrue-800: hsl(0 0% 16%);
|
|
134
|
+
--graytrue-900: hsl(0 0% 8%);
|
|
135
135
|
--graywarm-100: hsl(60 5% 96%);
|
|
136
136
|
--graywarm-200: hsl(20 6% 90%);
|
|
137
137
|
--graywarm-25: hsl(60 20% 99%);
|
|
@@ -330,7 +330,7 @@
|
|
|
330
330
|
--uxf-color-base-surface-main-hover: var(--grayneutral-100);
|
|
331
331
|
--uxf-color-base-surface-popup: var(--base-white);
|
|
332
332
|
--uxf-color-base-surface-tooltip: var(--grayneutral-700);
|
|
333
|
-
--uxf-color-base-surface-inverted-default: hsl(0 0 100%);
|
|
333
|
+
--uxf-color-base-surface-inverted-default: hsl(0 0% 100%);
|
|
334
334
|
--uxf-color-base-surface-inverted-default-hover: hsl(0 0 100% / 0.9);
|
|
335
335
|
--uxf-color-base-surface-inverted-disabled: var(--grayneutral-300);
|
|
336
336
|
--uxf-color-base-surface-inverted-main: hsl(0 0 100% / 0.08);
|
|
@@ -368,13 +368,13 @@
|
|
|
368
368
|
--uxf-color-info-surface-muted-hover: var(--graycool-200);
|
|
369
369
|
--uxf-color-info-surface-subtle: var(--graycool-50);
|
|
370
370
|
--uxf-color-info-surface-subtle-hover: var(--graycool-100);
|
|
371
|
-
--uxf-color-inverted-border: hsl(0 0 100%);
|
|
372
|
-
--uxf-color-inverted-icon: hsl(0 0 100%);
|
|
373
|
-
--uxf-color-inverted-icon-on-muted: hsl(0 0 100%);
|
|
374
|
-
--uxf-color-inverted-text-default: hsl(0 0 100%);
|
|
375
|
-
--uxf-color-inverted-text-disabled: hsl(0 0 100%);
|
|
376
|
-
--uxf-color-inverted-text-muted: hsl(0 0 100%);
|
|
377
|
-
--uxf-color-inverted-text-on-muted: hsl(0 0 100%);
|
|
371
|
+
--uxf-color-inverted-border: hsl(0 0% 100%);
|
|
372
|
+
--uxf-color-inverted-icon: hsl(0 0% 100%);
|
|
373
|
+
--uxf-color-inverted-icon-on-muted: hsl(0 0% 100%);
|
|
374
|
+
--uxf-color-inverted-text-default: hsl(0 0% 100%);
|
|
375
|
+
--uxf-color-inverted-text-disabled: hsl(0 0% 100%);
|
|
376
|
+
--uxf-color-inverted-text-muted: hsl(0 0% 100%);
|
|
377
|
+
--uxf-color-inverted-text-on-muted: hsl(0 0% 100%);
|
|
378
378
|
--uxf-color-negative-border: var(--error-300);
|
|
379
379
|
--uxf-color-negative-icon: var(--error-600);
|
|
380
380
|
--uxf-color-negative-icon-on-muted: var(--error-700);
|
|
@@ -451,7 +451,7 @@
|
|
|
451
451
|
--uxf-color-base-surface-inverted-main: hsl(218 28% 17% / 0.08);
|
|
452
452
|
--uxf-color-base-surface-inverted-main-hover: hsl(218 28% 17% / 0.16);
|
|
453
453
|
--uxf-color-base-text-disabled: hsl(0 0 100% / 0.6);
|
|
454
|
-
--uxf-color-base-text-high-emphasis: hsl(0 0 100%);
|
|
454
|
+
--uxf-color-base-text-high-emphasis: hsl(0 0% 100%);
|
|
455
455
|
--uxf-color-base-text-link: var(--base-white);
|
|
456
456
|
--uxf-color-base-text-link-pressed: var(--base-white);
|
|
457
457
|
--uxf-color-base-text-low-emphasis: hsl(0 0 100% / 0.8);
|
|
@@ -483,13 +483,13 @@
|
|
|
483
483
|
--uxf-color-info-surface-muted-hover: var(--grayblue-700);
|
|
484
484
|
--uxf-color-info-surface-subtle: var(--grayblue-900);
|
|
485
485
|
--uxf-color-info-surface-subtle-hover: var(--grayblue-800);
|
|
486
|
-
--uxf-color-inverted-border: hsl(0 0 100%);
|
|
487
|
-
--uxf-color-inverted-icon: hsl(0 0 100%);
|
|
488
|
-
--uxf-color-inverted-icon-on-muted: hsl(0 0 100%);
|
|
489
|
-
--uxf-color-inverted-text-default: hsl(0 0 100%);
|
|
490
|
-
--uxf-color-inverted-text-disabled: hsl(0 0 100%);
|
|
491
|
-
--uxf-color-inverted-text-muted: hsl(0 0 100%);
|
|
492
|
-
--uxf-color-inverted-text-on-muted: hsl(0 0 100%);
|
|
486
|
+
--uxf-color-inverted-border: hsl(0 0% 100%);
|
|
487
|
+
--uxf-color-inverted-icon: hsl(0 0% 100%);
|
|
488
|
+
--uxf-color-inverted-icon-on-muted: hsl(0 0% 100%);
|
|
489
|
+
--uxf-color-inverted-text-default: hsl(0 0% 100%);
|
|
490
|
+
--uxf-color-inverted-text-disabled: hsl(0 0% 100%);
|
|
491
|
+
--uxf-color-inverted-text-muted: hsl(0 0% 100%);
|
|
492
|
+
--uxf-color-inverted-text-on-muted: hsl(0 0% 100%);
|
|
493
493
|
--uxf-color-negative-border: var(--error-600);
|
|
494
494
|
--uxf-color-negative-icon: var(--error-400);
|
|
495
495
|
--uxf-color-negative-icon-on-muted: var(--error-200);
|
|
@@ -506,8 +506,8 @@
|
|
|
506
506
|
--uxf-color-neutral-icon-on-muted: var(--grayneutral-200);
|
|
507
507
|
--uxf-color-neutral-text: var(--grayneutral-300);
|
|
508
508
|
--uxf-color-neutral-text-on-muted: var(--grayneutral-200);
|
|
509
|
-
--uxf-color-neutral-surface-bolder: hsl(0 0 100%);
|
|
510
|
-
--uxf-color-neutral-surface-bolder-hover: hsl(0 0 100%);
|
|
509
|
+
--uxf-color-neutral-surface-bolder: hsl(0 0% 100%);
|
|
510
|
+
--uxf-color-neutral-surface-bolder-hover: hsl(0 0% 100%);
|
|
511
511
|
--uxf-color-neutral-surface-default: var(--grayneutral-400);
|
|
512
512
|
--uxf-color-neutral-surface-default-hover: var(--grayneutral-300);
|
|
513
513
|
--uxf-color-neutral-surface-muted: var(--grayneutral-700);
|
package/css/lightbox.css
CHANGED
|
@@ -3,7 +3,10 @@
|
|
|
3
3
|
flex-direction: column;
|
|
4
4
|
inset: 0;
|
|
5
5
|
position: fixed;
|
|
6
|
-
|
|
6
|
+
|
|
7
|
+
&__overlay {
|
|
8
|
+
z-index: theme("zIndex.lightbox");
|
|
9
|
+
}
|
|
7
10
|
|
|
8
11
|
&__content {
|
|
9
12
|
flex-grow: 1;
|
|
@@ -24,6 +27,10 @@
|
|
|
24
27
|
object-fit: contain;
|
|
25
28
|
width: 100%;
|
|
26
29
|
z-index: 1;
|
|
30
|
+
|
|
31
|
+
.uxf-raster-image__img {
|
|
32
|
+
max-height: 90dvh;
|
|
33
|
+
}
|
|
27
34
|
}
|
|
28
35
|
|
|
29
36
|
&__buttons {
|
|
@@ -30,7 +30,7 @@ function LightboxDialog(props) {
|
|
|
30
30
|
return null;
|
|
31
31
|
}
|
|
32
32
|
return (react_2.default.createElement(react_1.FloatingPortal, null,
|
|
33
|
-
react_2.default.createElement(react_1.FloatingOverlay, { lockScroll: true },
|
|
33
|
+
react_2.default.createElement(react_1.FloatingOverlay, { className: "uxf-lightbox__overlay", lockScroll: true },
|
|
34
34
|
react_2.default.createElement(react_1.FloatingFocusManager, { context: floatingContext },
|
|
35
35
|
react_2.default.createElement("div", { ...getFloatingProps({ "aria-modal": true, className: "uxf-lightbox", ref: setFloating }) },
|
|
36
36
|
react_2.default.createElement("div", { "aria-hidden": true, className: "uxf-lightbox__backdrop", onClick: !props.isBackdropCloseDisabled ? props.onClose : undefined }),
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@uxf/ui",
|
|
3
|
-
"version": "11.
|
|
3
|
+
"version": "11.95.1",
|
|
4
4
|
"description": "",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -23,11 +23,11 @@
|
|
|
23
23
|
"dependencies": {
|
|
24
24
|
"@floating-ui/react": "0.27.16",
|
|
25
25
|
"@headlessui/react": "1.7.19",
|
|
26
|
-
"@uxf/core": "11.
|
|
27
|
-
"@uxf/core-react": "11.
|
|
26
|
+
"@uxf/core": "11.95.0",
|
|
27
|
+
"@uxf/core-react": "11.95.0",
|
|
28
28
|
"@uxf/datepicker": "11.94.0",
|
|
29
29
|
"@uxf/localize": "11.92.1",
|
|
30
|
-
"@uxf/styles": "11.
|
|
30
|
+
"@uxf/styles": "11.95.0",
|
|
31
31
|
"color2k": "2.0.3",
|
|
32
32
|
"dayjs": "1.11.19",
|
|
33
33
|
"react-dropzone": "14.3.8"
|