xmlui 0.9.16 → 0.9.18
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/dist/{apiInterceptorWorker-E5ylKYVg.mjs → apiInterceptorWorker-DtInaPQ_.mjs} +1 -1
- package/dist/{index-BjVxVHb3.mjs → index-BHUXwc-L.mjs} +48 -17
- package/dist/index.css +103 -46
- package/dist/scripts/src/components/App/AppLayoutContext.js +1 -0
- package/dist/scripts/src/components/App/AppNative.js +4 -0
- package/dist/scripts/src/components/NavGroup/NavGroupNative.js +2 -1
- package/dist/style.css +102 -45
- package/dist/xmlui-metadata.mjs +2 -1
- package/dist/xmlui-metadata.umd.js +2 -1
- package/dist/xmlui-standalone.umd.js +153 -65
- package/dist/xmlui.mjs +1 -1
- package/package.json +1 -1
|
@@ -12,7 +12,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
|
|
|
12
12
|
var _executor, _DeferredPromise_instances, decorate_fn, _a2;
|
|
13
13
|
import { delay as delay$1, HttpResponse, http } from "msw";
|
|
14
14
|
import { isArray, isObject as isObject$1, mapValues } from "lodash-es";
|
|
15
|
-
import { r as runEventHandlerCode, g as getDate, d as delay, m as miscellaneousUtils, a as dateFunctions, o as orderBy, T as ThrowStatementError } from "./index-
|
|
15
|
+
import { r as runEventHandlerCode, g as getDate, d as delay, m as miscellaneousUtils, a as dateFunctions, o as orderBy, T as ThrowStatementError } from "./index-BHUXwc-L.mjs";
|
|
16
16
|
import Dexie from "dexie";
|
|
17
17
|
var POSITIONALS_EXP = /(%?)(%([sdijo]))/g;
|
|
18
18
|
function serializePositional(positional, flag) {
|
|
@@ -3395,20 +3395,22 @@ function createUrlWithQueryParams(to2) {
|
|
|
3395
3395
|
return to2;
|
|
3396
3396
|
}
|
|
3397
3397
|
const themeVars$J = `'{"width-navPanel-App": "var(--xmlui-width-navPanel-App)", "boxShadow-header-App": "var(--xmlui-boxShadow-header-App)", "boxShadow-navPanel-App": "var(--xmlui-boxShadow-navPanel-App)", "backgroundColor-content-App": "var(--xmlui-backgroundColor-content-App)", "borderLeft-content-App": "var(--xmlui-borderLeft-content-App)", "maxWidth-content-App": "var(--xmlui-maxWidth-content-App)", "backgroundColor-AppHeader": "var(--xmlui-backgroundColor-AppHeader)", "borderBottom-AppHeader": "var(--xmlui-borderBottom-AppHeader)", "scroll-padding-block-Pages": "var(--xmlui-scroll-padding-block-Pages)"}'`;
|
|
3398
|
-
const wrapper$g = "
|
|
3399
|
-
const vertical$4 = "
|
|
3400
|
-
const contentWrapper$1 = "
|
|
3401
|
-
const navPanelWrapper = "
|
|
3402
|
-
const PagesWrapper = "
|
|
3403
|
-
const footerWrapper = "
|
|
3404
|
-
const sticky = "
|
|
3405
|
-
const horizontal$5 = "
|
|
3406
|
-
const verticalFullHeader = "
|
|
3407
|
-
const PagesWrapperInner = "
|
|
3408
|
-
const
|
|
3409
|
-
const
|
|
3410
|
-
const
|
|
3411
|
-
const
|
|
3398
|
+
const wrapper$g = "_wrapper_rebcu_13";
|
|
3399
|
+
const vertical$4 = "_vertical_rebcu_23";
|
|
3400
|
+
const contentWrapper$1 = "_contentWrapper_rebcu_27";
|
|
3401
|
+
const navPanelWrapper = "_navPanelWrapper_rebcu_33";
|
|
3402
|
+
const PagesWrapper = "_PagesWrapper_rebcu_37";
|
|
3403
|
+
const footerWrapper = "_footerWrapper_rebcu_41";
|
|
3404
|
+
const sticky = "_sticky_rebcu_44";
|
|
3405
|
+
const horizontal$5 = "_horizontal_rebcu_51";
|
|
3406
|
+
const verticalFullHeader = "_verticalFullHeader_rebcu_73";
|
|
3407
|
+
const PagesWrapperInner = "_PagesWrapperInner_rebcu_90";
|
|
3408
|
+
const verticalConstrained = "_verticalConstrained_rebcu_102";
|
|
3409
|
+
const header$2 = "_header_rebcu_108";
|
|
3410
|
+
const scrollWholePage = "_scrollWholePage_rebcu_135";
|
|
3411
|
+
const headerWrapper$1 = "_headerWrapper_rebcu_138";
|
|
3412
|
+
const content$2 = "_content_rebcu_27";
|
|
3413
|
+
const noScrollbarGutters = "_noScrollbarGutters_rebcu_204";
|
|
3412
3414
|
const styles$_ = {
|
|
3413
3415
|
themeVars: themeVars$J,
|
|
3414
3416
|
wrapper: wrapper$g,
|
|
@@ -3421,6 +3423,8 @@ const styles$_ = {
|
|
|
3421
3423
|
horizontal: horizontal$5,
|
|
3422
3424
|
verticalFullHeader,
|
|
3423
3425
|
PagesWrapperInner,
|
|
3426
|
+
verticalConstrained,
|
|
3427
|
+
header: header$2,
|
|
3424
3428
|
scrollWholePage,
|
|
3425
3429
|
headerWrapper: headerWrapper$1,
|
|
3426
3430
|
content: content$2,
|
|
@@ -4139,6 +4143,31 @@ function App({
|
|
|
4139
4143
|
}
|
|
4140
4144
|
);
|
|
4141
4145
|
break;
|
|
4146
|
+
case "vertical-constrained-width":
|
|
4147
|
+
content2 = /* @__PURE__ */ jsxs(
|
|
4148
|
+
"div",
|
|
4149
|
+
{
|
|
4150
|
+
className: classnames(wrapperBaseClasses, styles$_.verticalConstrained),
|
|
4151
|
+
style: styleWithHelpers,
|
|
4152
|
+
ref: scrollPageContainerRef,
|
|
4153
|
+
children: [
|
|
4154
|
+
/* @__PURE__ */ jsx(
|
|
4155
|
+
"header",
|
|
4156
|
+
{
|
|
4157
|
+
className: classnames(styles$_.headerWrapper, styles$_.sticky),
|
|
4158
|
+
ref: headerRefCallback,
|
|
4159
|
+
children: /* @__PURE__ */ jsx("div", { className: styles$_.header, style: { paddingInline: 0 }, children: header2 })
|
|
4160
|
+
}
|
|
4161
|
+
),
|
|
4162
|
+
/* @__PURE__ */ jsxs("div", { className: classnames(styles$_.content, styles$_.verticalConstrained), children: [
|
|
4163
|
+
navPanelVisible && /* @__PURE__ */ jsx("aside", { className: styles$_.navPanelWrapper, children: navPanel }),
|
|
4164
|
+
/* @__PURE__ */ jsx("main", { className: styles$_.contentWrapper, children: /* @__PURE__ */ jsx("div", { className: styles$_.PagesWrapper, ref: noScrollPageContainerRef, children: /* @__PURE__ */ jsx(ScrollContext.Provider, { value: scrollContainerRef, children: /* @__PURE__ */ jsx("div", { className: styles$_.PagesWrapperInner, style: pagesWrapperInnerStyle, children }) }) }) })
|
|
4165
|
+
] }),
|
|
4166
|
+
/* @__PURE__ */ jsx("div", { className: styles$_.footerWrapper, ref: footerRefCallback, children: footer })
|
|
4167
|
+
]
|
|
4168
|
+
}
|
|
4169
|
+
);
|
|
4170
|
+
break;
|
|
4142
4171
|
case "condensed":
|
|
4143
4172
|
case "condensed-sticky":
|
|
4144
4173
|
content2 = /* @__PURE__ */ jsxs(
|
|
@@ -4229,6 +4258,7 @@ function getAppLayoutOrientation(appLayout) {
|
|
|
4229
4258
|
case "vertical":
|
|
4230
4259
|
case "vertical-sticky":
|
|
4231
4260
|
case "vertical-full-header":
|
|
4261
|
+
case "vertical-constrained-width":
|
|
4232
4262
|
return "vertical";
|
|
4233
4263
|
default:
|
|
4234
4264
|
return "horizontal";
|
|
@@ -20621,7 +20651,7 @@ const NavGroup = forwardRef(function NavGroup2({
|
|
|
20621
20651
|
const { level } = useContext(NavGroupContext);
|
|
20622
20652
|
const appLayoutContext = useAppLayoutContext();
|
|
20623
20653
|
const navPanelContext = useContext(NavPanelContext);
|
|
20624
|
-
let inline = (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-sticky" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-full-header";
|
|
20654
|
+
let inline = (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-sticky" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-full-header" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-constrained-width";
|
|
20625
20655
|
if (navPanelContext !== null) {
|
|
20626
20656
|
inline = navPanelContext.inDrawer;
|
|
20627
20657
|
}
|
|
@@ -31615,7 +31645,7 @@ function IconProvider({ children }) {
|
|
|
31615
31645
|
/* @__PURE__ */ jsx("svg", { style: { display: "none" }, ref: spriteRootRef })
|
|
31616
31646
|
] });
|
|
31617
31647
|
}
|
|
31618
|
-
const version = "0.9.
|
|
31648
|
+
const version = "0.9.18";
|
|
31619
31649
|
const ApiInterceptorContext = createContext(null);
|
|
31620
31650
|
function useApiInterceptorContext() {
|
|
31621
31651
|
return useContext(ApiInterceptorContext);
|
|
@@ -35780,6 +35810,7 @@ function getTransitiveDependencies(directCompDepNames, components) {
|
|
|
35780
35810
|
populateTransitiveDeps(directCompDepNames);
|
|
35781
35811
|
return transitiveDeps;
|
|
35782
35812
|
function populateTransitiveDeps(directCompDepNames2) {
|
|
35813
|
+
if (!directCompDepNames2) return;
|
|
35783
35814
|
for (const directDep of directCompDepNames2) {
|
|
35784
35815
|
if (!transitiveDeps.has(directDep)) {
|
|
35785
35816
|
transitiveDeps.add(directDep);
|
|
@@ -35802,7 +35833,7 @@ function ApiInterceptorProvider({
|
|
|
35802
35833
|
let interceptorWorker;
|
|
35803
35834
|
(async () => {
|
|
35804
35835
|
if (process.env.VITE_MOCK_ENABLED) {
|
|
35805
|
-
const { createApiInterceptorWorker } = await import("./apiInterceptorWorker-
|
|
35836
|
+
const { createApiInterceptorWorker } = await import("./apiInterceptorWorker-DtInaPQ_.mjs");
|
|
35806
35837
|
if (interceptor) {
|
|
35807
35838
|
interceptorWorker = await createApiInterceptorWorker(interceptor, apiWorker);
|
|
35808
35839
|
if (!apiWorker) {
|
package/dist/index.css
CHANGED
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
@scope (#_ui-engine-theme-root) {
|
|
14
14
|
:scope {
|
|
15
15
|
line-height: 1.5;
|
|
16
|
-
font-feature-settings:
|
|
16
|
+
font-feature-settings: var(--xmlui-font-feature-settings);
|
|
17
17
|
font-variation-settings: normal;
|
|
18
18
|
-webkit-font-smoothing: antialiased;
|
|
19
19
|
-moz-osx-font-smoothing: grayscale;
|
|
@@ -968,7 +968,7 @@
|
|
|
968
968
|
* This function allows other CSS modules to get the value of the CSS variable specified in $componentVariable.
|
|
969
969
|
Optionally, you can provide a $fallbackValue to set the variable's value if that is not defined.
|
|
970
970
|
*/
|
|
971
|
-
.
|
|
971
|
+
._wrapper_rebcu_13 {
|
|
972
972
|
--footer-height: 0px;
|
|
973
973
|
--header-height: 0px;
|
|
974
974
|
width: 100%;
|
|
@@ -978,138 +978,195 @@
|
|
|
978
978
|
flex-direction: column;
|
|
979
979
|
isolation: isolate;
|
|
980
980
|
}
|
|
981
|
-
.
|
|
981
|
+
._wrapper_rebcu_13._vertical_rebcu_23 {
|
|
982
982
|
flex-direction: row;
|
|
983
983
|
overflow: initial;
|
|
984
984
|
}
|
|
985
|
-
.
|
|
985
|
+
._wrapper_rebcu_13._vertical_rebcu_23 ._contentWrapper_rebcu_27 {
|
|
986
986
|
overflow: auto;
|
|
987
987
|
scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
|
|
988
988
|
position: relative;
|
|
989
989
|
scrollbar-gutter: stable both-edges;
|
|
990
990
|
}
|
|
991
|
-
.
|
|
991
|
+
._wrapper_rebcu_13._vertical_rebcu_23 ._navPanelWrapper_rebcu_33 {
|
|
992
992
|
width: var(--xmlui-width-navPanel-App);
|
|
993
993
|
flex-shrink: 0;
|
|
994
994
|
}
|
|
995
|
-
.
|
|
995
|
+
._wrapper_rebcu_13._vertical_rebcu_23 ._PagesWrapper_rebcu_37 {
|
|
996
996
|
min-height: initial;
|
|
997
997
|
flex: 1;
|
|
998
998
|
}
|
|
999
|
-
.
|
|
999
|
+
._wrapper_rebcu_13._vertical_rebcu_23 ._footerWrapper_rebcu_41 {
|
|
1000
1000
|
position: static;
|
|
1001
1001
|
}
|
|
1002
|
-
.
|
|
1002
|
+
._wrapper_rebcu_13._vertical_rebcu_23._sticky_rebcu_44 ._contentWrapper_rebcu_27 {
|
|
1003
1003
|
scroll-padding-top: var(--header-height);
|
|
1004
1004
|
}
|
|
1005
|
-
.
|
|
1005
|
+
._wrapper_rebcu_13._vertical_rebcu_23._sticky_rebcu_44 ._footerWrapper_rebcu_41 {
|
|
1006
1006
|
position: sticky;
|
|
1007
1007
|
bottom: 0;
|
|
1008
1008
|
}
|
|
1009
|
-
.
|
|
1009
|
+
._wrapper_rebcu_13._horizontal_rebcu_51 {
|
|
1010
1010
|
overflow: auto;
|
|
1011
1011
|
scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
|
|
1012
1012
|
}
|
|
1013
|
-
.
|
|
1013
|
+
._wrapper_rebcu_13._horizontal_rebcu_51 ._PagesWrapper_rebcu_37 {
|
|
1014
1014
|
min-height: initial;
|
|
1015
1015
|
}
|
|
1016
|
-
.
|
|
1016
|
+
._wrapper_rebcu_13._horizontal_rebcu_51 ._footerWrapper_rebcu_41 {
|
|
1017
1017
|
position: static;
|
|
1018
1018
|
}
|
|
1019
|
-
.
|
|
1019
|
+
._wrapper_rebcu_13._horizontal_rebcu_51._sticky_rebcu_44 {
|
|
1020
1020
|
scroll-padding-top: var(--header-height);
|
|
1021
1021
|
min-height: 100%;
|
|
1022
1022
|
}
|
|
1023
|
-
.
|
|
1023
|
+
._wrapper_rebcu_13._horizontal_rebcu_51._sticky_rebcu_44 ._footerWrapper_rebcu_41 {
|
|
1024
1024
|
position: sticky;
|
|
1025
1025
|
bottom: 0;
|
|
1026
1026
|
}
|
|
1027
|
-
.
|
|
1027
|
+
._wrapper_rebcu_13._horizontal_rebcu_51 ._navPanelWrapper_rebcu_33 {
|
|
1028
1028
|
border-bottom: var(--xmlui-borderBottom-AppHeader);
|
|
1029
1029
|
justify-content: end;
|
|
1030
1030
|
}
|
|
1031
|
-
.
|
|
1031
|
+
._wrapper_rebcu_13._verticalFullHeader_rebcu_73 {
|
|
1032
1032
|
min-height: 100%;
|
|
1033
1033
|
height: 100%;
|
|
1034
1034
|
overflow: auto;
|
|
1035
1035
|
scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
|
|
1036
1036
|
}
|
|
1037
|
-
.
|
|
1037
|
+
._wrapper_rebcu_13._verticalFullHeader_rebcu_73 ._navPanelWrapper_rebcu_33 {
|
|
1038
1038
|
width: var(--xmlui-width-navPanel-App);
|
|
1039
1039
|
position: sticky;
|
|
1040
1040
|
height: calc(var(--containerHeight, 100vh) - var(--footer-height) - var(--header-height));
|
|
1041
1041
|
top: var(--header-height);
|
|
1042
1042
|
}
|
|
1043
|
-
.
|
|
1043
|
+
._wrapper_rebcu_13._verticalFullHeader_rebcu_73 ._PagesWrapper_rebcu_37 {
|
|
1044
1044
|
overflow: initial;
|
|
1045
1045
|
min-height: calc(var(--containerHeight, 100vh) - var(--header-height) - var(--footer-height));
|
|
1046
1046
|
height: 100%;
|
|
1047
1047
|
}
|
|
1048
|
-
.
|
|
1048
|
+
._wrapper_rebcu_13._verticalFullHeader_rebcu_73 ._PagesWrapperInner_rebcu_90 {
|
|
1049
1049
|
height: 100%;
|
|
1050
1050
|
}
|
|
1051
|
-
.
|
|
1051
|
+
._wrapper_rebcu_13._verticalFullHeader_rebcu_73 ._PagesWrapperInner_rebcu_90 > .xmlui-page-root {
|
|
1052
1052
|
height: 100%;
|
|
1053
1053
|
}
|
|
1054
|
-
.
|
|
1054
|
+
._wrapper_rebcu_13._verticalFullHeader_rebcu_73 ._footerWrapper_rebcu_41 {
|
|
1055
1055
|
position: sticky;
|
|
1056
1056
|
left: 0;
|
|
1057
1057
|
right: 0;
|
|
1058
1058
|
bottom: 0;
|
|
1059
1059
|
}
|
|
1060
|
-
.
|
|
1060
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 {
|
|
1061
|
+
min-height: 100%;
|
|
1062
|
+
height: 100%;
|
|
1063
|
+
overflow: auto;
|
|
1064
|
+
scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
|
|
1065
|
+
}
|
|
1066
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 ._header_rebcu_108 {
|
|
1067
|
+
max-width: var(--xmlui-maxWidth-content-App);
|
|
1068
|
+
margin: auto;
|
|
1069
|
+
}
|
|
1070
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 ._navPanelWrapper_rebcu_33 {
|
|
1071
|
+
width: var(--xmlui-width-navPanel-App);
|
|
1072
|
+
position: sticky;
|
|
1073
|
+
height: calc(var(--containerHeight, 100vh) - var(--footer-height) - var(--header-height));
|
|
1074
|
+
top: var(--header-height);
|
|
1075
|
+
}
|
|
1076
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 ._PagesWrapper_rebcu_37 {
|
|
1077
|
+
overflow: initial;
|
|
1078
|
+
min-height: calc(var(--containerHeight, 100vh) - var(--header-height) - var(--footer-height));
|
|
1079
|
+
height: 100%;
|
|
1080
|
+
}
|
|
1081
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 ._PagesWrapperInner_rebcu_90 {
|
|
1082
|
+
height: 100%;
|
|
1083
|
+
}
|
|
1084
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 ._PagesWrapperInner_rebcu_90 > .xmlui-page-root {
|
|
1085
|
+
height: 100%;
|
|
1086
|
+
}
|
|
1087
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 ._footerWrapper_rebcu_41 {
|
|
1088
|
+
position: sticky;
|
|
1089
|
+
left: 0;
|
|
1090
|
+
right: 0;
|
|
1091
|
+
bottom: 0;
|
|
1092
|
+
}
|
|
1093
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135 {
|
|
1061
1094
|
scrollbar-gutter: stable both-edges;
|
|
1062
1095
|
}
|
|
1063
|
-
.
|
|
1096
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135 ._headerWrapper_rebcu_138 {
|
|
1097
|
+
margin-inline: calc(-1 * var(--scrollbar-width));
|
|
1098
|
+
}
|
|
1099
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135 ._headerWrapper_rebcu_138 > div {
|
|
1100
|
+
padding-inline: var(--scrollbar-width);
|
|
1101
|
+
}
|
|
1102
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135 ._footerWrapper_rebcu_41 {
|
|
1064
1103
|
margin-inline: calc(-1 * var(--scrollbar-width));
|
|
1065
1104
|
}
|
|
1066
|
-
.
|
|
1105
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135 ._footerWrapper_rebcu_41 > div {
|
|
1067
1106
|
padding-inline: var(--scrollbar-width);
|
|
1068
1107
|
}
|
|
1069
|
-
.
|
|
1108
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalFullHeader_rebcu_73 {
|
|
1109
|
+
scroll-padding-top: var(--header-height);
|
|
1110
|
+
}
|
|
1111
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalFullHeader_rebcu_73 ._content_rebcu_27 {
|
|
1070
1112
|
margin-inline: calc(-1 * var(--scrollbar-width));
|
|
1071
1113
|
}
|
|
1072
|
-
.
|
|
1114
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalFullHeader_rebcu_73 ._contentWrapper_rebcu_27 {
|
|
1073
1115
|
padding-inline: var(--scrollbar-width);
|
|
1074
1116
|
}
|
|
1075
|
-
.
|
|
1117
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalConstrained_rebcu_102 {
|
|
1076
1118
|
scroll-padding-top: var(--header-height);
|
|
1077
1119
|
}
|
|
1078
|
-
.
|
|
1120
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalConstrained_rebcu_102 ._content_rebcu_27 {
|
|
1121
|
+
width: var(--xmlui-maxWidth-content-App);
|
|
1079
1122
|
margin-inline: calc(-1 * var(--scrollbar-width));
|
|
1123
|
+
margin: auto;
|
|
1080
1124
|
}
|
|
1081
|
-
.
|
|
1125
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalConstrained_rebcu_102 ._contentWrapper_rebcu_27 {
|
|
1082
1126
|
padding-inline: var(--scrollbar-width);
|
|
1083
1127
|
}
|
|
1084
|
-
.
|
|
1128
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalConstrained_rebcu_102 ._headerWrapper_rebcu_138 > div {
|
|
1129
|
+
width: var(--xmlui-maxWidth-content-App);
|
|
1130
|
+
}
|
|
1131
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalConstrained_rebcu_102 ._footerWrapper_rebcu_41 {
|
|
1132
|
+
margin-inline: calc(-1 * var(--scrollbar-width));
|
|
1133
|
+
}
|
|
1134
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalConstrained_rebcu_102 ._footerWrapper_rebcu_41 > div {
|
|
1135
|
+
padding-inline: var(--scrollbar-width);
|
|
1136
|
+
}
|
|
1137
|
+
._wrapper_rebcu_13:not(._scrollWholePage_rebcu_135) {
|
|
1085
1138
|
overflow: hidden;
|
|
1086
1139
|
}
|
|
1087
|
-
.
|
|
1140
|
+
._wrapper_rebcu_13:not(._scrollWholePage_rebcu_135) ._content_rebcu_27 {
|
|
1088
1141
|
min-height: 0;
|
|
1089
1142
|
height: 100%;
|
|
1090
1143
|
}
|
|
1091
|
-
.
|
|
1144
|
+
._wrapper_rebcu_13:not(._scrollWholePage_rebcu_135) ._contentWrapper_rebcu_27 {
|
|
1092
1145
|
overflow: initial;
|
|
1093
1146
|
}
|
|
1094
|
-
.
|
|
1147
|
+
._wrapper_rebcu_13:not(._scrollWholePage_rebcu_135)._verticalConstrained_rebcu_102 ._content_rebcu_27 {
|
|
1148
|
+
width: var(--xmlui-maxWidth-content-App);
|
|
1149
|
+
margin: auto;
|
|
1150
|
+
}
|
|
1151
|
+
._wrapper_rebcu_13:not(._scrollWholePage_rebcu_135) ._PagesWrapper_rebcu_37 {
|
|
1095
1152
|
overflow: auto;
|
|
1096
1153
|
scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
|
|
1097
1154
|
min-height: 0;
|
|
1098
1155
|
height: 100%;
|
|
1099
1156
|
scrollbar-gutter: stable both-edges;
|
|
1100
1157
|
}
|
|
1101
|
-
.
|
|
1158
|
+
._wrapper_rebcu_13:not(._scrollWholePage_rebcu_135) ._PagesWrapperInner_rebcu_90 {
|
|
1102
1159
|
min-height: 100%;
|
|
1103
1160
|
height: 0;
|
|
1104
1161
|
}
|
|
1105
|
-
.
|
|
1162
|
+
._wrapper_rebcu_13._noScrollbarGutters_rebcu_204 {
|
|
1106
1163
|
scrollbar-gutter: auto;
|
|
1107
1164
|
}
|
|
1108
|
-
.
|
|
1165
|
+
._wrapper_rebcu_13._noScrollbarGutters_rebcu_204 ._PagesWrapper_rebcu_37 {
|
|
1109
1166
|
scrollbar-gutter: auto;
|
|
1110
1167
|
}
|
|
1111
1168
|
|
|
1112
|
-
.
|
|
1169
|
+
._headerWrapper_rebcu_138 {
|
|
1113
1170
|
z-index: 1;
|
|
1114
1171
|
min-height: 0;
|
|
1115
1172
|
flex-shrink: 0;
|
|
@@ -1118,17 +1175,17 @@
|
|
|
1118
1175
|
box-shadow: var(--xmlui-boxShadow-header-App);
|
|
1119
1176
|
background-color: var(--xmlui-backgroundColor-AppHeader);
|
|
1120
1177
|
}
|
|
1121
|
-
.
|
|
1178
|
+
._headerWrapper_rebcu_138._sticky_rebcu_44 {
|
|
1122
1179
|
position: sticky;
|
|
1123
1180
|
}
|
|
1124
1181
|
|
|
1125
|
-
.
|
|
1182
|
+
._content_rebcu_27 {
|
|
1126
1183
|
display: flex;
|
|
1127
1184
|
flex-direction: row;
|
|
1128
1185
|
isolation: isolate;
|
|
1129
1186
|
}
|
|
1130
1187
|
|
|
1131
|
-
.
|
|
1188
|
+
._contentWrapper_rebcu_27 {
|
|
1132
1189
|
position: relative;
|
|
1133
1190
|
min-width: 0;
|
|
1134
1191
|
flex: 1;
|
|
@@ -1139,21 +1196,21 @@
|
|
|
1139
1196
|
border-left: var(--xmlui-borderLeft-content-App);
|
|
1140
1197
|
}
|
|
1141
1198
|
|
|
1142
|
-
.
|
|
1199
|
+
._navPanelWrapper_rebcu_33 {
|
|
1143
1200
|
display: flex;
|
|
1144
1201
|
position: sticky;
|
|
1145
1202
|
top: 0;
|
|
1146
1203
|
}
|
|
1147
|
-
.
|
|
1204
|
+
._navPanelWrapper_rebcu_33:empty {
|
|
1148
1205
|
display: none;
|
|
1149
1206
|
}
|
|
1150
1207
|
|
|
1151
|
-
.
|
|
1208
|
+
._PagesWrapper_rebcu_37 {
|
|
1152
1209
|
flex: 1;
|
|
1153
1210
|
isolation: isolate;
|
|
1154
1211
|
}
|
|
1155
1212
|
|
|
1156
|
-
.
|
|
1213
|
+
._PagesWrapperInner_rebcu_90 {
|
|
1157
1214
|
--page-padding-left: var(--xmlui-space-4);
|
|
1158
1215
|
--page-padding-right: var(--xmlui-space-4);
|
|
1159
1216
|
--page-padding-top: var(--xmlui-space-5);
|
|
@@ -1171,7 +1228,7 @@
|
|
|
1171
1228
|
display: flex;
|
|
1172
1229
|
flex-direction: column;
|
|
1173
1230
|
}
|
|
1174
|
-
.
|
|
1231
|
+
._PagesWrapperInner_rebcu_90 > .xmlui-page-root {
|
|
1175
1232
|
padding-top: var(--page-padding-top-override, var(--page-padding-top));
|
|
1176
1233
|
padding-bottom: var(--page-padding-bottom-override, var(--page-padding-bottom));
|
|
1177
1234
|
padding-right: var(--page-padding-right-override, var(--page-padding-right));
|
|
@@ -1183,7 +1240,7 @@
|
|
|
1183
1240
|
margin-right: calc(-1 * var(--page-padding-right));
|
|
1184
1241
|
}
|
|
1185
1242
|
|
|
1186
|
-
.
|
|
1243
|
+
._footerWrapper_rebcu_41 {
|
|
1187
1244
|
flex-shrink: 0;
|
|
1188
1245
|
}/*
|
|
1189
1246
|
* This file contains all CSS variables AppEngine uses for styling the UI, including individual visual components.
|
|
@@ -185,6 +185,9 @@ function App({ children, style, layout, loggedInUser, scrollWholePage, noScrollb
|
|
|
185
185
|
case "vertical-full-header":
|
|
186
186
|
content = ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(wrapperBaseClasses, App_module_scss_1.default.verticalFullHeader), style: styleWithHelpers, ref: scrollPageContainerRef, children: [(0, jsx_runtime_1.jsx)("header", { className: (0, classnames_1.default)(App_module_scss_1.default.headerWrapper, App_module_scss_1.default.sticky), ref: headerRefCallback, children: header }), (0, jsx_runtime_1.jsxs)("div", { className: App_module_scss_1.default.content, children: [navPanelVisible && (0, jsx_runtime_1.jsx)("aside", { className: App_module_scss_1.default.navPanelWrapper, children: navPanel }), (0, jsx_runtime_1.jsx)("main", { className: App_module_scss_1.default.contentWrapper, children: (0, jsx_runtime_1.jsx)("div", { className: App_module_scss_1.default.PagesWrapper, ref: noScrollPageContainerRef, children: (0, jsx_runtime_1.jsx)(ScrollContext_1.ScrollContext.Provider, { value: scrollContainerRef, children: (0, jsx_runtime_1.jsx)("div", { className: App_module_scss_1.default.PagesWrapperInner, style: pagesWrapperInnerStyle, children: children }) }) }) })] }), (0, jsx_runtime_1.jsx)("div", { className: App_module_scss_1.default.footerWrapper, ref: footerRefCallback, children: footer })] }));
|
|
187
187
|
break;
|
|
188
|
+
case "vertical-constrained-width":
|
|
189
|
+
content = ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(wrapperBaseClasses, App_module_scss_1.default.verticalConstrained), style: styleWithHelpers, ref: scrollPageContainerRef, children: [(0, jsx_runtime_1.jsx)("header", { className: (0, classnames_1.default)(App_module_scss_1.default.headerWrapper, App_module_scss_1.default.sticky), ref: headerRefCallback, children: (0, jsx_runtime_1.jsx)("div", { className: App_module_scss_1.default.header, style: { paddingInline: 0 }, children: header }) }), (0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(App_module_scss_1.default.content, App_module_scss_1.default.verticalConstrained), children: [navPanelVisible && (0, jsx_runtime_1.jsx)("aside", { className: App_module_scss_1.default.navPanelWrapper, children: navPanel }), (0, jsx_runtime_1.jsx)("main", { className: App_module_scss_1.default.contentWrapper, children: (0, jsx_runtime_1.jsx)("div", { className: App_module_scss_1.default.PagesWrapper, ref: noScrollPageContainerRef, children: (0, jsx_runtime_1.jsx)(ScrollContext_1.ScrollContext.Provider, { value: scrollContainerRef, children: (0, jsx_runtime_1.jsx)("div", { className: App_module_scss_1.default.PagesWrapperInner, style: pagesWrapperInnerStyle, children: children }) }) }) })] }), (0, jsx_runtime_1.jsx)("div", { className: App_module_scss_1.default.footerWrapper, ref: footerRefCallback, children: footer })] }));
|
|
190
|
+
break;
|
|
188
191
|
case "condensed":
|
|
189
192
|
case "condensed-sticky":
|
|
190
193
|
content = ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(wrapperBaseClasses, App_module_scss_1.default.horizontal, {
|
|
@@ -210,6 +213,7 @@ function getAppLayoutOrientation(appLayout) {
|
|
|
210
213
|
case "vertical":
|
|
211
214
|
case "vertical-sticky":
|
|
212
215
|
case "vertical-full-header":
|
|
216
|
+
case "vertical-constrained-width":
|
|
213
217
|
return "vertical";
|
|
214
218
|
default:
|
|
215
219
|
return "horizontal";
|
|
@@ -34,7 +34,8 @@ exports.NavGroup = (0, react_1.forwardRef)(function NavGroup({ node, style, labe
|
|
|
34
34
|
const navPanelContext = (0, react_1.useContext)(NavPanelNative_1.NavPanelContext);
|
|
35
35
|
let inline = (appLayoutContext === null || appLayoutContext === void 0 ? void 0 : appLayoutContext.layout) === "vertical" ||
|
|
36
36
|
(appLayoutContext === null || appLayoutContext === void 0 ? void 0 : appLayoutContext.layout) === "vertical-sticky" ||
|
|
37
|
-
(appLayoutContext === null || appLayoutContext === void 0 ? void 0 : appLayoutContext.layout) === "vertical-full-header"
|
|
37
|
+
(appLayoutContext === null || appLayoutContext === void 0 ? void 0 : appLayoutContext.layout) === "vertical-full-header" ||
|
|
38
|
+
(appLayoutContext === null || appLayoutContext === void 0 ? void 0 : appLayoutContext.layout) === "vertical-constrained-width";
|
|
38
39
|
if (navPanelContext !== null) {
|
|
39
40
|
inline = navPanelContext.inDrawer;
|
|
40
41
|
}
|
package/dist/style.css
CHANGED
|
@@ -1617,7 +1617,7 @@ See this source for details: https://css-tricks.com/line-clampin/
|
|
|
1617
1617
|
* This function allows other CSS modules to get the value of the CSS variable specified in $componentVariable.
|
|
1618
1618
|
Optionally, you can provide a $fallbackValue to set the variable's value if that is not defined.
|
|
1619
1619
|
*/
|
|
1620
|
-
.
|
|
1620
|
+
._wrapper_rebcu_13 {
|
|
1621
1621
|
--footer-height: 0px;
|
|
1622
1622
|
--header-height: 0px;
|
|
1623
1623
|
width: 100%;
|
|
@@ -1627,138 +1627,195 @@ See this source for details: https://css-tricks.com/line-clampin/
|
|
|
1627
1627
|
flex-direction: column;
|
|
1628
1628
|
isolation: isolate;
|
|
1629
1629
|
}
|
|
1630
|
-
.
|
|
1630
|
+
._wrapper_rebcu_13._vertical_rebcu_23 {
|
|
1631
1631
|
flex-direction: row;
|
|
1632
1632
|
overflow: initial;
|
|
1633
1633
|
}
|
|
1634
|
-
.
|
|
1634
|
+
._wrapper_rebcu_13._vertical_rebcu_23 ._contentWrapper_rebcu_27 {
|
|
1635
1635
|
overflow: auto;
|
|
1636
1636
|
scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
|
|
1637
1637
|
position: relative;
|
|
1638
1638
|
scrollbar-gutter: stable both-edges;
|
|
1639
1639
|
}
|
|
1640
|
-
.
|
|
1640
|
+
._wrapper_rebcu_13._vertical_rebcu_23 ._navPanelWrapper_rebcu_33 {
|
|
1641
1641
|
width: var(--xmlui-width-navPanel-App);
|
|
1642
1642
|
flex-shrink: 0;
|
|
1643
1643
|
}
|
|
1644
|
-
.
|
|
1644
|
+
._wrapper_rebcu_13._vertical_rebcu_23 ._PagesWrapper_rebcu_37 {
|
|
1645
1645
|
min-height: initial;
|
|
1646
1646
|
flex: 1;
|
|
1647
1647
|
}
|
|
1648
|
-
.
|
|
1648
|
+
._wrapper_rebcu_13._vertical_rebcu_23 ._footerWrapper_rebcu_41 {
|
|
1649
1649
|
position: static;
|
|
1650
1650
|
}
|
|
1651
|
-
.
|
|
1651
|
+
._wrapper_rebcu_13._vertical_rebcu_23._sticky_rebcu_44 ._contentWrapper_rebcu_27 {
|
|
1652
1652
|
scroll-padding-top: var(--header-height);
|
|
1653
1653
|
}
|
|
1654
|
-
.
|
|
1654
|
+
._wrapper_rebcu_13._vertical_rebcu_23._sticky_rebcu_44 ._footerWrapper_rebcu_41 {
|
|
1655
1655
|
position: sticky;
|
|
1656
1656
|
bottom: 0;
|
|
1657
1657
|
}
|
|
1658
|
-
.
|
|
1658
|
+
._wrapper_rebcu_13._horizontal_rebcu_51 {
|
|
1659
1659
|
overflow: auto;
|
|
1660
1660
|
scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
|
|
1661
1661
|
}
|
|
1662
|
-
.
|
|
1662
|
+
._wrapper_rebcu_13._horizontal_rebcu_51 ._PagesWrapper_rebcu_37 {
|
|
1663
1663
|
min-height: initial;
|
|
1664
1664
|
}
|
|
1665
|
-
.
|
|
1665
|
+
._wrapper_rebcu_13._horizontal_rebcu_51 ._footerWrapper_rebcu_41 {
|
|
1666
1666
|
position: static;
|
|
1667
1667
|
}
|
|
1668
|
-
.
|
|
1668
|
+
._wrapper_rebcu_13._horizontal_rebcu_51._sticky_rebcu_44 {
|
|
1669
1669
|
scroll-padding-top: var(--header-height);
|
|
1670
1670
|
min-height: 100%;
|
|
1671
1671
|
}
|
|
1672
|
-
.
|
|
1672
|
+
._wrapper_rebcu_13._horizontal_rebcu_51._sticky_rebcu_44 ._footerWrapper_rebcu_41 {
|
|
1673
1673
|
position: sticky;
|
|
1674
1674
|
bottom: 0;
|
|
1675
1675
|
}
|
|
1676
|
-
.
|
|
1676
|
+
._wrapper_rebcu_13._horizontal_rebcu_51 ._navPanelWrapper_rebcu_33 {
|
|
1677
1677
|
border-bottom: var(--xmlui-borderBottom-AppHeader);
|
|
1678
1678
|
justify-content: end;
|
|
1679
1679
|
}
|
|
1680
|
-
.
|
|
1680
|
+
._wrapper_rebcu_13._verticalFullHeader_rebcu_73 {
|
|
1681
1681
|
min-height: 100%;
|
|
1682
1682
|
height: 100%;
|
|
1683
1683
|
overflow: auto;
|
|
1684
1684
|
scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
|
|
1685
1685
|
}
|
|
1686
|
-
.
|
|
1686
|
+
._wrapper_rebcu_13._verticalFullHeader_rebcu_73 ._navPanelWrapper_rebcu_33 {
|
|
1687
1687
|
width: var(--xmlui-width-navPanel-App);
|
|
1688
1688
|
position: sticky;
|
|
1689
1689
|
height: calc(var(--containerHeight, 100vh) - var(--footer-height) - var(--header-height));
|
|
1690
1690
|
top: var(--header-height);
|
|
1691
1691
|
}
|
|
1692
|
-
.
|
|
1692
|
+
._wrapper_rebcu_13._verticalFullHeader_rebcu_73 ._PagesWrapper_rebcu_37 {
|
|
1693
1693
|
overflow: initial;
|
|
1694
1694
|
min-height: calc(var(--containerHeight, 100vh) - var(--header-height) - var(--footer-height));
|
|
1695
1695
|
height: 100%;
|
|
1696
1696
|
}
|
|
1697
|
-
.
|
|
1697
|
+
._wrapper_rebcu_13._verticalFullHeader_rebcu_73 ._PagesWrapperInner_rebcu_90 {
|
|
1698
1698
|
height: 100%;
|
|
1699
1699
|
}
|
|
1700
|
-
.
|
|
1700
|
+
._wrapper_rebcu_13._verticalFullHeader_rebcu_73 ._PagesWrapperInner_rebcu_90 > .xmlui-page-root {
|
|
1701
1701
|
height: 100%;
|
|
1702
1702
|
}
|
|
1703
|
-
.
|
|
1703
|
+
._wrapper_rebcu_13._verticalFullHeader_rebcu_73 ._footerWrapper_rebcu_41 {
|
|
1704
1704
|
position: sticky;
|
|
1705
1705
|
left: 0;
|
|
1706
1706
|
right: 0;
|
|
1707
1707
|
bottom: 0;
|
|
1708
1708
|
}
|
|
1709
|
-
.
|
|
1709
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 {
|
|
1710
|
+
min-height: 100%;
|
|
1711
|
+
height: 100%;
|
|
1712
|
+
overflow: auto;
|
|
1713
|
+
scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
|
|
1714
|
+
}
|
|
1715
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 ._header_rebcu_108 {
|
|
1716
|
+
max-width: var(--xmlui-maxWidth-content-App);
|
|
1717
|
+
margin: auto;
|
|
1718
|
+
}
|
|
1719
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 ._navPanelWrapper_rebcu_33 {
|
|
1720
|
+
width: var(--xmlui-width-navPanel-App);
|
|
1721
|
+
position: sticky;
|
|
1722
|
+
height: calc(var(--containerHeight, 100vh) - var(--footer-height) - var(--header-height));
|
|
1723
|
+
top: var(--header-height);
|
|
1724
|
+
}
|
|
1725
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 ._PagesWrapper_rebcu_37 {
|
|
1726
|
+
overflow: initial;
|
|
1727
|
+
min-height: calc(var(--containerHeight, 100vh) - var(--header-height) - var(--footer-height));
|
|
1728
|
+
height: 100%;
|
|
1729
|
+
}
|
|
1730
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 ._PagesWrapperInner_rebcu_90 {
|
|
1731
|
+
height: 100%;
|
|
1732
|
+
}
|
|
1733
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 ._PagesWrapperInner_rebcu_90 > .xmlui-page-root {
|
|
1734
|
+
height: 100%;
|
|
1735
|
+
}
|
|
1736
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 ._footerWrapper_rebcu_41 {
|
|
1737
|
+
position: sticky;
|
|
1738
|
+
left: 0;
|
|
1739
|
+
right: 0;
|
|
1740
|
+
bottom: 0;
|
|
1741
|
+
}
|
|
1742
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135 {
|
|
1710
1743
|
scrollbar-gutter: stable both-edges;
|
|
1711
1744
|
}
|
|
1712
|
-
.
|
|
1745
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135 ._headerWrapper_rebcu_138 {
|
|
1746
|
+
margin-inline: calc(-1 * var(--scrollbar-width));
|
|
1747
|
+
}
|
|
1748
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135 ._headerWrapper_rebcu_138 > div {
|
|
1749
|
+
padding-inline: var(--scrollbar-width);
|
|
1750
|
+
}
|
|
1751
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135 ._footerWrapper_rebcu_41 {
|
|
1713
1752
|
margin-inline: calc(-1 * var(--scrollbar-width));
|
|
1714
1753
|
}
|
|
1715
|
-
.
|
|
1754
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135 ._footerWrapper_rebcu_41 > div {
|
|
1716
1755
|
padding-inline: var(--scrollbar-width);
|
|
1717
1756
|
}
|
|
1718
|
-
.
|
|
1757
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalFullHeader_rebcu_73 {
|
|
1758
|
+
scroll-padding-top: var(--header-height);
|
|
1759
|
+
}
|
|
1760
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalFullHeader_rebcu_73 ._content_rebcu_27 {
|
|
1719
1761
|
margin-inline: calc(-1 * var(--scrollbar-width));
|
|
1720
1762
|
}
|
|
1721
|
-
.
|
|
1763
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalFullHeader_rebcu_73 ._contentWrapper_rebcu_27 {
|
|
1722
1764
|
padding-inline: var(--scrollbar-width);
|
|
1723
1765
|
}
|
|
1724
|
-
.
|
|
1766
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalConstrained_rebcu_102 {
|
|
1725
1767
|
scroll-padding-top: var(--header-height);
|
|
1726
1768
|
}
|
|
1727
|
-
.
|
|
1769
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalConstrained_rebcu_102 ._content_rebcu_27 {
|
|
1770
|
+
width: var(--xmlui-maxWidth-content-App);
|
|
1728
1771
|
margin-inline: calc(-1 * var(--scrollbar-width));
|
|
1772
|
+
margin: auto;
|
|
1729
1773
|
}
|
|
1730
|
-
.
|
|
1774
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalConstrained_rebcu_102 ._contentWrapper_rebcu_27 {
|
|
1731
1775
|
padding-inline: var(--scrollbar-width);
|
|
1732
1776
|
}
|
|
1733
|
-
.
|
|
1777
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalConstrained_rebcu_102 ._headerWrapper_rebcu_138 > div {
|
|
1778
|
+
width: var(--xmlui-maxWidth-content-App);
|
|
1779
|
+
}
|
|
1780
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalConstrained_rebcu_102 ._footerWrapper_rebcu_41 {
|
|
1781
|
+
margin-inline: calc(-1 * var(--scrollbar-width));
|
|
1782
|
+
}
|
|
1783
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalConstrained_rebcu_102 ._footerWrapper_rebcu_41 > div {
|
|
1784
|
+
padding-inline: var(--scrollbar-width);
|
|
1785
|
+
}
|
|
1786
|
+
._wrapper_rebcu_13:not(._scrollWholePage_rebcu_135) {
|
|
1734
1787
|
overflow: hidden;
|
|
1735
1788
|
}
|
|
1736
|
-
.
|
|
1789
|
+
._wrapper_rebcu_13:not(._scrollWholePage_rebcu_135) ._content_rebcu_27 {
|
|
1737
1790
|
min-height: 0;
|
|
1738
1791
|
height: 100%;
|
|
1739
1792
|
}
|
|
1740
|
-
.
|
|
1793
|
+
._wrapper_rebcu_13:not(._scrollWholePage_rebcu_135) ._contentWrapper_rebcu_27 {
|
|
1741
1794
|
overflow: initial;
|
|
1742
1795
|
}
|
|
1743
|
-
.
|
|
1796
|
+
._wrapper_rebcu_13:not(._scrollWholePage_rebcu_135)._verticalConstrained_rebcu_102 ._content_rebcu_27 {
|
|
1797
|
+
width: var(--xmlui-maxWidth-content-App);
|
|
1798
|
+
margin: auto;
|
|
1799
|
+
}
|
|
1800
|
+
._wrapper_rebcu_13:not(._scrollWholePage_rebcu_135) ._PagesWrapper_rebcu_37 {
|
|
1744
1801
|
overflow: auto;
|
|
1745
1802
|
scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
|
|
1746
1803
|
min-height: 0;
|
|
1747
1804
|
height: 100%;
|
|
1748
1805
|
scrollbar-gutter: stable both-edges;
|
|
1749
1806
|
}
|
|
1750
|
-
.
|
|
1807
|
+
._wrapper_rebcu_13:not(._scrollWholePage_rebcu_135) ._PagesWrapperInner_rebcu_90 {
|
|
1751
1808
|
min-height: 100%;
|
|
1752
1809
|
height: 0;
|
|
1753
1810
|
}
|
|
1754
|
-
.
|
|
1811
|
+
._wrapper_rebcu_13._noScrollbarGutters_rebcu_204 {
|
|
1755
1812
|
scrollbar-gutter: auto;
|
|
1756
1813
|
}
|
|
1757
|
-
.
|
|
1814
|
+
._wrapper_rebcu_13._noScrollbarGutters_rebcu_204 ._PagesWrapper_rebcu_37 {
|
|
1758
1815
|
scrollbar-gutter: auto;
|
|
1759
1816
|
}
|
|
1760
1817
|
|
|
1761
|
-
.
|
|
1818
|
+
._headerWrapper_rebcu_138 {
|
|
1762
1819
|
z-index: 1;
|
|
1763
1820
|
min-height: 0;
|
|
1764
1821
|
flex-shrink: 0;
|
|
@@ -1767,17 +1824,17 @@ See this source for details: https://css-tricks.com/line-clampin/
|
|
|
1767
1824
|
box-shadow: var(--xmlui-boxShadow-header-App);
|
|
1768
1825
|
background-color: var(--xmlui-backgroundColor-AppHeader);
|
|
1769
1826
|
}
|
|
1770
|
-
.
|
|
1827
|
+
._headerWrapper_rebcu_138._sticky_rebcu_44 {
|
|
1771
1828
|
position: sticky;
|
|
1772
1829
|
}
|
|
1773
1830
|
|
|
1774
|
-
.
|
|
1831
|
+
._content_rebcu_27 {
|
|
1775
1832
|
display: flex;
|
|
1776
1833
|
flex-direction: row;
|
|
1777
1834
|
isolation: isolate;
|
|
1778
1835
|
}
|
|
1779
1836
|
|
|
1780
|
-
.
|
|
1837
|
+
._contentWrapper_rebcu_27 {
|
|
1781
1838
|
position: relative;
|
|
1782
1839
|
min-width: 0;
|
|
1783
1840
|
flex: 1;
|
|
@@ -1788,21 +1845,21 @@ See this source for details: https://css-tricks.com/line-clampin/
|
|
|
1788
1845
|
border-left: var(--xmlui-borderLeft-content-App);
|
|
1789
1846
|
}
|
|
1790
1847
|
|
|
1791
|
-
.
|
|
1848
|
+
._navPanelWrapper_rebcu_33 {
|
|
1792
1849
|
display: flex;
|
|
1793
1850
|
position: sticky;
|
|
1794
1851
|
top: 0;
|
|
1795
1852
|
}
|
|
1796
|
-
.
|
|
1853
|
+
._navPanelWrapper_rebcu_33:empty {
|
|
1797
1854
|
display: none;
|
|
1798
1855
|
}
|
|
1799
1856
|
|
|
1800
|
-
.
|
|
1857
|
+
._PagesWrapper_rebcu_37 {
|
|
1801
1858
|
flex: 1;
|
|
1802
1859
|
isolation: isolate;
|
|
1803
1860
|
}
|
|
1804
1861
|
|
|
1805
|
-
.
|
|
1862
|
+
._PagesWrapperInner_rebcu_90 {
|
|
1806
1863
|
--page-padding-left: var(--xmlui-space-4);
|
|
1807
1864
|
--page-padding-right: var(--xmlui-space-4);
|
|
1808
1865
|
--page-padding-top: var(--xmlui-space-5);
|
|
@@ -1820,7 +1877,7 @@ See this source for details: https://css-tricks.com/line-clampin/
|
|
|
1820
1877
|
display: flex;
|
|
1821
1878
|
flex-direction: column;
|
|
1822
1879
|
}
|
|
1823
|
-
.
|
|
1880
|
+
._PagesWrapperInner_rebcu_90 > .xmlui-page-root {
|
|
1824
1881
|
padding-top: var(--page-padding-top-override, var(--page-padding-top));
|
|
1825
1882
|
padding-bottom: var(--page-padding-bottom-override, var(--page-padding-bottom));
|
|
1826
1883
|
padding-right: var(--page-padding-right-override, var(--page-padding-right));
|
|
@@ -1832,7 +1889,7 @@ See this source for details: https://css-tricks.com/line-clampin/
|
|
|
1832
1889
|
margin-right: calc(-1 * var(--page-padding-right));
|
|
1833
1890
|
}
|
|
1834
1891
|
|
|
1835
|
-
.
|
|
1892
|
+
._footerWrapper_rebcu_41 {
|
|
1836
1893
|
flex-shrink: 0;
|
|
1837
1894
|
}/*
|
|
1838
1895
|
* This file contains all CSS variables AppEngine uses for styling the UI, including individual visual components.
|
package/dist/xmlui-metadata.mjs
CHANGED
|
@@ -3359,6 +3359,7 @@ function getAppLayoutOrientation(appLayout) {
|
|
|
3359
3359
|
case "vertical":
|
|
3360
3360
|
case "vertical-sticky":
|
|
3361
3361
|
case "vertical-full-header":
|
|
3362
|
+
case "vertical-constrained-width":
|
|
3362
3363
|
return "vertical";
|
|
3363
3364
|
default:
|
|
3364
3365
|
return "horizontal";
|
|
@@ -15512,7 +15513,7 @@ forwardRef(function NavGroup2({
|
|
|
15512
15513
|
const { level } = useContext(NavGroupContext);
|
|
15513
15514
|
const appLayoutContext = useAppLayoutContext();
|
|
15514
15515
|
const navPanelContext = useContext(NavPanelContext);
|
|
15515
|
-
let inline = (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-sticky" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-full-header";
|
|
15516
|
+
let inline = (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-sticky" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-full-header" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-constrained-width";
|
|
15516
15517
|
if (navPanelContext !== null) {
|
|
15517
15518
|
inline = navPanelContext.inDrawer;
|
|
15518
15519
|
}
|
|
@@ -3356,6 +3356,7 @@
|
|
|
3356
3356
|
case "vertical":
|
|
3357
3357
|
case "vertical-sticky":
|
|
3358
3358
|
case "vertical-full-header":
|
|
3359
|
+
case "vertical-constrained-width":
|
|
3359
3360
|
return "vertical";
|
|
3360
3361
|
default:
|
|
3361
3362
|
return "horizontal";
|
|
@@ -15509,7 +15510,7 @@
|
|
|
15509
15510
|
const { level } = React.useContext(NavGroupContext);
|
|
15510
15511
|
const appLayoutContext = useAppLayoutContext();
|
|
15511
15512
|
const navPanelContext = React.useContext(NavPanelContext);
|
|
15512
|
-
let inline = (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-sticky" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-full-header";
|
|
15513
|
+
let inline = (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-sticky" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-full-header" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-constrained-width";
|
|
15513
15514
|
if (navPanelContext !== null) {
|
|
15514
15515
|
inline = navPanelContext.inDrawer;
|
|
15515
15516
|
}
|
|
@@ -30,7 +30,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
|
|
|
30
30
|
@scope (#_ui-engine-theme-root) {
|
|
31
31
|
:scope {
|
|
32
32
|
line-height: 1.5;
|
|
33
|
-
font-feature-settings:
|
|
33
|
+
font-feature-settings: var(--xmlui-font-feature-settings);
|
|
34
34
|
font-variation-settings: normal;
|
|
35
35
|
-webkit-font-smoothing: antialiased;
|
|
36
36
|
-moz-osx-font-smoothing: grayscale;
|
|
@@ -985,7 +985,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
|
|
|
985
985
|
* This function allows other CSS modules to get the value of the CSS variable specified in $componentVariable.
|
|
986
986
|
Optionally, you can provide a $fallbackValue to set the variable's value if that is not defined.
|
|
987
987
|
*/
|
|
988
|
-
.
|
|
988
|
+
._wrapper_rebcu_13 {
|
|
989
989
|
--footer-height: 0px;
|
|
990
990
|
--header-height: 0px;
|
|
991
991
|
width: 100%;
|
|
@@ -995,138 +995,195 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
|
|
|
995
995
|
flex-direction: column;
|
|
996
996
|
isolation: isolate;
|
|
997
997
|
}
|
|
998
|
-
.
|
|
998
|
+
._wrapper_rebcu_13._vertical_rebcu_23 {
|
|
999
999
|
flex-direction: row;
|
|
1000
1000
|
overflow: initial;
|
|
1001
1001
|
}
|
|
1002
|
-
.
|
|
1002
|
+
._wrapper_rebcu_13._vertical_rebcu_23 ._contentWrapper_rebcu_27 {
|
|
1003
1003
|
overflow: auto;
|
|
1004
1004
|
scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
|
|
1005
1005
|
position: relative;
|
|
1006
1006
|
scrollbar-gutter: stable both-edges;
|
|
1007
1007
|
}
|
|
1008
|
-
.
|
|
1008
|
+
._wrapper_rebcu_13._vertical_rebcu_23 ._navPanelWrapper_rebcu_33 {
|
|
1009
1009
|
width: var(--xmlui-width-navPanel-App);
|
|
1010
1010
|
flex-shrink: 0;
|
|
1011
1011
|
}
|
|
1012
|
-
.
|
|
1012
|
+
._wrapper_rebcu_13._vertical_rebcu_23 ._PagesWrapper_rebcu_37 {
|
|
1013
1013
|
min-height: initial;
|
|
1014
1014
|
flex: 1;
|
|
1015
1015
|
}
|
|
1016
|
-
.
|
|
1016
|
+
._wrapper_rebcu_13._vertical_rebcu_23 ._footerWrapper_rebcu_41 {
|
|
1017
1017
|
position: static;
|
|
1018
1018
|
}
|
|
1019
|
-
.
|
|
1019
|
+
._wrapper_rebcu_13._vertical_rebcu_23._sticky_rebcu_44 ._contentWrapper_rebcu_27 {
|
|
1020
1020
|
scroll-padding-top: var(--header-height);
|
|
1021
1021
|
}
|
|
1022
|
-
.
|
|
1022
|
+
._wrapper_rebcu_13._vertical_rebcu_23._sticky_rebcu_44 ._footerWrapper_rebcu_41 {
|
|
1023
1023
|
position: sticky;
|
|
1024
1024
|
bottom: 0;
|
|
1025
1025
|
}
|
|
1026
|
-
.
|
|
1026
|
+
._wrapper_rebcu_13._horizontal_rebcu_51 {
|
|
1027
1027
|
overflow: auto;
|
|
1028
1028
|
scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
|
|
1029
1029
|
}
|
|
1030
|
-
.
|
|
1030
|
+
._wrapper_rebcu_13._horizontal_rebcu_51 ._PagesWrapper_rebcu_37 {
|
|
1031
1031
|
min-height: initial;
|
|
1032
1032
|
}
|
|
1033
|
-
.
|
|
1033
|
+
._wrapper_rebcu_13._horizontal_rebcu_51 ._footerWrapper_rebcu_41 {
|
|
1034
1034
|
position: static;
|
|
1035
1035
|
}
|
|
1036
|
-
.
|
|
1036
|
+
._wrapper_rebcu_13._horizontal_rebcu_51._sticky_rebcu_44 {
|
|
1037
1037
|
scroll-padding-top: var(--header-height);
|
|
1038
1038
|
min-height: 100%;
|
|
1039
1039
|
}
|
|
1040
|
-
.
|
|
1040
|
+
._wrapper_rebcu_13._horizontal_rebcu_51._sticky_rebcu_44 ._footerWrapper_rebcu_41 {
|
|
1041
1041
|
position: sticky;
|
|
1042
1042
|
bottom: 0;
|
|
1043
1043
|
}
|
|
1044
|
-
.
|
|
1044
|
+
._wrapper_rebcu_13._horizontal_rebcu_51 ._navPanelWrapper_rebcu_33 {
|
|
1045
1045
|
border-bottom: var(--xmlui-borderBottom-AppHeader);
|
|
1046
1046
|
justify-content: end;
|
|
1047
1047
|
}
|
|
1048
|
-
.
|
|
1048
|
+
._wrapper_rebcu_13._verticalFullHeader_rebcu_73 {
|
|
1049
1049
|
min-height: 100%;
|
|
1050
1050
|
height: 100%;
|
|
1051
1051
|
overflow: auto;
|
|
1052
1052
|
scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
|
|
1053
1053
|
}
|
|
1054
|
-
.
|
|
1054
|
+
._wrapper_rebcu_13._verticalFullHeader_rebcu_73 ._navPanelWrapper_rebcu_33 {
|
|
1055
1055
|
width: var(--xmlui-width-navPanel-App);
|
|
1056
1056
|
position: sticky;
|
|
1057
1057
|
height: calc(var(--containerHeight, 100vh) - var(--footer-height) - var(--header-height));
|
|
1058
1058
|
top: var(--header-height);
|
|
1059
1059
|
}
|
|
1060
|
-
.
|
|
1060
|
+
._wrapper_rebcu_13._verticalFullHeader_rebcu_73 ._PagesWrapper_rebcu_37 {
|
|
1061
1061
|
overflow: initial;
|
|
1062
1062
|
min-height: calc(var(--containerHeight, 100vh) - var(--header-height) - var(--footer-height));
|
|
1063
1063
|
height: 100%;
|
|
1064
1064
|
}
|
|
1065
|
-
.
|
|
1065
|
+
._wrapper_rebcu_13._verticalFullHeader_rebcu_73 ._PagesWrapperInner_rebcu_90 {
|
|
1066
1066
|
height: 100%;
|
|
1067
1067
|
}
|
|
1068
|
-
.
|
|
1068
|
+
._wrapper_rebcu_13._verticalFullHeader_rebcu_73 ._PagesWrapperInner_rebcu_90 > .xmlui-page-root {
|
|
1069
1069
|
height: 100%;
|
|
1070
1070
|
}
|
|
1071
|
-
.
|
|
1071
|
+
._wrapper_rebcu_13._verticalFullHeader_rebcu_73 ._footerWrapper_rebcu_41 {
|
|
1072
1072
|
position: sticky;
|
|
1073
1073
|
left: 0;
|
|
1074
1074
|
right: 0;
|
|
1075
1075
|
bottom: 0;
|
|
1076
1076
|
}
|
|
1077
|
-
.
|
|
1077
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 {
|
|
1078
|
+
min-height: 100%;
|
|
1079
|
+
height: 100%;
|
|
1080
|
+
overflow: auto;
|
|
1081
|
+
scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
|
|
1082
|
+
}
|
|
1083
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 ._header_rebcu_108 {
|
|
1084
|
+
max-width: var(--xmlui-maxWidth-content-App);
|
|
1085
|
+
margin: auto;
|
|
1086
|
+
}
|
|
1087
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 ._navPanelWrapper_rebcu_33 {
|
|
1088
|
+
width: var(--xmlui-width-navPanel-App);
|
|
1089
|
+
position: sticky;
|
|
1090
|
+
height: calc(var(--containerHeight, 100vh) - var(--footer-height) - var(--header-height));
|
|
1091
|
+
top: var(--header-height);
|
|
1092
|
+
}
|
|
1093
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 ._PagesWrapper_rebcu_37 {
|
|
1094
|
+
overflow: initial;
|
|
1095
|
+
min-height: calc(var(--containerHeight, 100vh) - var(--header-height) - var(--footer-height));
|
|
1096
|
+
height: 100%;
|
|
1097
|
+
}
|
|
1098
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 ._PagesWrapperInner_rebcu_90 {
|
|
1099
|
+
height: 100%;
|
|
1100
|
+
}
|
|
1101
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 ._PagesWrapperInner_rebcu_90 > .xmlui-page-root {
|
|
1102
|
+
height: 100%;
|
|
1103
|
+
}
|
|
1104
|
+
._wrapper_rebcu_13._verticalConstrained_rebcu_102 ._footerWrapper_rebcu_41 {
|
|
1105
|
+
position: sticky;
|
|
1106
|
+
left: 0;
|
|
1107
|
+
right: 0;
|
|
1108
|
+
bottom: 0;
|
|
1109
|
+
}
|
|
1110
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135 {
|
|
1078
1111
|
scrollbar-gutter: stable both-edges;
|
|
1079
1112
|
}
|
|
1080
|
-
.
|
|
1113
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135 ._headerWrapper_rebcu_138 {
|
|
1114
|
+
margin-inline: calc(-1 * var(--scrollbar-width));
|
|
1115
|
+
}
|
|
1116
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135 ._headerWrapper_rebcu_138 > div {
|
|
1117
|
+
padding-inline: var(--scrollbar-width);
|
|
1118
|
+
}
|
|
1119
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135 ._footerWrapper_rebcu_41 {
|
|
1081
1120
|
margin-inline: calc(-1 * var(--scrollbar-width));
|
|
1082
1121
|
}
|
|
1083
|
-
.
|
|
1122
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135 ._footerWrapper_rebcu_41 > div {
|
|
1084
1123
|
padding-inline: var(--scrollbar-width);
|
|
1085
1124
|
}
|
|
1086
|
-
.
|
|
1125
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalFullHeader_rebcu_73 {
|
|
1126
|
+
scroll-padding-top: var(--header-height);
|
|
1127
|
+
}
|
|
1128
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalFullHeader_rebcu_73 ._content_rebcu_27 {
|
|
1087
1129
|
margin-inline: calc(-1 * var(--scrollbar-width));
|
|
1088
1130
|
}
|
|
1089
|
-
.
|
|
1131
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalFullHeader_rebcu_73 ._contentWrapper_rebcu_27 {
|
|
1090
1132
|
padding-inline: var(--scrollbar-width);
|
|
1091
1133
|
}
|
|
1092
|
-
.
|
|
1134
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalConstrained_rebcu_102 {
|
|
1093
1135
|
scroll-padding-top: var(--header-height);
|
|
1094
1136
|
}
|
|
1095
|
-
.
|
|
1137
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalConstrained_rebcu_102 ._content_rebcu_27 {
|
|
1138
|
+
width: var(--xmlui-maxWidth-content-App);
|
|
1139
|
+
margin-inline: calc(-1 * var(--scrollbar-width));
|
|
1140
|
+
margin: auto;
|
|
1141
|
+
}
|
|
1142
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalConstrained_rebcu_102 ._contentWrapper_rebcu_27 {
|
|
1143
|
+
padding-inline: var(--scrollbar-width);
|
|
1144
|
+
}
|
|
1145
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalConstrained_rebcu_102 ._headerWrapper_rebcu_138 > div {
|
|
1146
|
+
width: var(--xmlui-maxWidth-content-App);
|
|
1147
|
+
}
|
|
1148
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalConstrained_rebcu_102 ._footerWrapper_rebcu_41 {
|
|
1096
1149
|
margin-inline: calc(-1 * var(--scrollbar-width));
|
|
1097
1150
|
}
|
|
1098
|
-
.
|
|
1151
|
+
._wrapper_rebcu_13._scrollWholePage_rebcu_135._verticalConstrained_rebcu_102 ._footerWrapper_rebcu_41 > div {
|
|
1099
1152
|
padding-inline: var(--scrollbar-width);
|
|
1100
1153
|
}
|
|
1101
|
-
.
|
|
1154
|
+
._wrapper_rebcu_13:not(._scrollWholePage_rebcu_135) {
|
|
1102
1155
|
overflow: hidden;
|
|
1103
1156
|
}
|
|
1104
|
-
.
|
|
1157
|
+
._wrapper_rebcu_13:not(._scrollWholePage_rebcu_135) ._content_rebcu_27 {
|
|
1105
1158
|
min-height: 0;
|
|
1106
1159
|
height: 100%;
|
|
1107
1160
|
}
|
|
1108
|
-
.
|
|
1161
|
+
._wrapper_rebcu_13:not(._scrollWholePage_rebcu_135) ._contentWrapper_rebcu_27 {
|
|
1109
1162
|
overflow: initial;
|
|
1110
1163
|
}
|
|
1111
|
-
.
|
|
1164
|
+
._wrapper_rebcu_13:not(._scrollWholePage_rebcu_135)._verticalConstrained_rebcu_102 ._content_rebcu_27 {
|
|
1165
|
+
width: var(--xmlui-maxWidth-content-App);
|
|
1166
|
+
margin: auto;
|
|
1167
|
+
}
|
|
1168
|
+
._wrapper_rebcu_13:not(._scrollWholePage_rebcu_135) ._PagesWrapper_rebcu_37 {
|
|
1112
1169
|
overflow: auto;
|
|
1113
1170
|
scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
|
|
1114
1171
|
min-height: 0;
|
|
1115
1172
|
height: 100%;
|
|
1116
1173
|
scrollbar-gutter: stable both-edges;
|
|
1117
1174
|
}
|
|
1118
|
-
.
|
|
1175
|
+
._wrapper_rebcu_13:not(._scrollWholePage_rebcu_135) ._PagesWrapperInner_rebcu_90 {
|
|
1119
1176
|
min-height: 100%;
|
|
1120
1177
|
height: 0;
|
|
1121
1178
|
}
|
|
1122
|
-
.
|
|
1179
|
+
._wrapper_rebcu_13._noScrollbarGutters_rebcu_204 {
|
|
1123
1180
|
scrollbar-gutter: auto;
|
|
1124
1181
|
}
|
|
1125
|
-
.
|
|
1182
|
+
._wrapper_rebcu_13._noScrollbarGutters_rebcu_204 ._PagesWrapper_rebcu_37 {
|
|
1126
1183
|
scrollbar-gutter: auto;
|
|
1127
1184
|
}
|
|
1128
1185
|
|
|
1129
|
-
.
|
|
1186
|
+
._headerWrapper_rebcu_138 {
|
|
1130
1187
|
z-index: 1;
|
|
1131
1188
|
min-height: 0;
|
|
1132
1189
|
flex-shrink: 0;
|
|
@@ -1135,17 +1192,17 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
|
|
|
1135
1192
|
box-shadow: var(--xmlui-boxShadow-header-App);
|
|
1136
1193
|
background-color: var(--xmlui-backgroundColor-AppHeader);
|
|
1137
1194
|
}
|
|
1138
|
-
.
|
|
1195
|
+
._headerWrapper_rebcu_138._sticky_rebcu_44 {
|
|
1139
1196
|
position: sticky;
|
|
1140
1197
|
}
|
|
1141
1198
|
|
|
1142
|
-
.
|
|
1199
|
+
._content_rebcu_27 {
|
|
1143
1200
|
display: flex;
|
|
1144
1201
|
flex-direction: row;
|
|
1145
1202
|
isolation: isolate;
|
|
1146
1203
|
}
|
|
1147
1204
|
|
|
1148
|
-
.
|
|
1205
|
+
._contentWrapper_rebcu_27 {
|
|
1149
1206
|
position: relative;
|
|
1150
1207
|
min-width: 0;
|
|
1151
1208
|
flex: 1;
|
|
@@ -1156,21 +1213,21 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
|
|
|
1156
1213
|
border-left: var(--xmlui-borderLeft-content-App);
|
|
1157
1214
|
}
|
|
1158
1215
|
|
|
1159
|
-
.
|
|
1216
|
+
._navPanelWrapper_rebcu_33 {
|
|
1160
1217
|
display: flex;
|
|
1161
1218
|
position: sticky;
|
|
1162
1219
|
top: 0;
|
|
1163
1220
|
}
|
|
1164
|
-
.
|
|
1221
|
+
._navPanelWrapper_rebcu_33:empty {
|
|
1165
1222
|
display: none;
|
|
1166
1223
|
}
|
|
1167
1224
|
|
|
1168
|
-
.
|
|
1225
|
+
._PagesWrapper_rebcu_37 {
|
|
1169
1226
|
flex: 1;
|
|
1170
1227
|
isolation: isolate;
|
|
1171
1228
|
}
|
|
1172
1229
|
|
|
1173
|
-
.
|
|
1230
|
+
._PagesWrapperInner_rebcu_90 {
|
|
1174
1231
|
--page-padding-left: var(--xmlui-space-4);
|
|
1175
1232
|
--page-padding-right: var(--xmlui-space-4);
|
|
1176
1233
|
--page-padding-top: var(--xmlui-space-5);
|
|
@@ -1188,7 +1245,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
|
|
|
1188
1245
|
display: flex;
|
|
1189
1246
|
flex-direction: column;
|
|
1190
1247
|
}
|
|
1191
|
-
.
|
|
1248
|
+
._PagesWrapperInner_rebcu_90 > .xmlui-page-root {
|
|
1192
1249
|
padding-top: var(--page-padding-top-override, var(--page-padding-top));
|
|
1193
1250
|
padding-bottom: var(--page-padding-bottom-override, var(--page-padding-bottom));
|
|
1194
1251
|
padding-right: var(--page-padding-right-override, var(--page-padding-right));
|
|
@@ -1200,7 +1257,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
|
|
|
1200
1257
|
margin-right: calc(-1 * var(--page-padding-right));
|
|
1201
1258
|
}
|
|
1202
1259
|
|
|
1203
|
-
.
|
|
1260
|
+
._footerWrapper_rebcu_41 {
|
|
1204
1261
|
flex-shrink: 0;
|
|
1205
1262
|
}/*
|
|
1206
1263
|
* This file contains all CSS variables AppEngine uses for styling the UI, including individual visual components.
|
|
@@ -15931,7 +15988,7 @@ li .htmlOl {
|
|
|
15931
15988
|
});
|
|
15932
15989
|
}
|
|
15933
15990
|
}
|
|
15934
|
-
var define_process_env_default$a = { NODE_ENV: "production", VITE_MOCK_ENABLED: true, VITE_MOCK_WORKER_LOCATION: "mockApi.js", VITE_USED_COMPONENTS_Pdf: "false", VITE_USED_COMPONENTS_Chart: "false", VITE_USER_COMPONENTS_XmluiCodeHightlighter: "false", VITE_USED_COMPONENTS_Tree: "false", VITE_XMLUI_VERSION: "0.9.
|
|
15991
|
+
var define_process_env_default$a = { NODE_ENV: "production", VITE_MOCK_ENABLED: true, VITE_MOCK_WORKER_LOCATION: "mockApi.js", VITE_USED_COMPONENTS_Pdf: "false", VITE_USED_COMPONENTS_Chart: "false", VITE_USER_COMPONENTS_XmluiCodeHightlighter: "false", VITE_USED_COMPONENTS_Tree: "false", VITE_XMLUI_VERSION: "0.9.18 (built 4/25/2025)" };
|
|
15935
15992
|
class Mutation extends Removable {
|
|
15936
15993
|
constructor(config) {
|
|
15937
15994
|
super();
|
|
@@ -32294,20 +32351,22 @@ ${error2.errorObject}`;
|
|
|
32294
32351
|
}(reactExports.Component);
|
|
32295
32352
|
W$4.propTypes = { base: PropTypes.object, bodyAttributes: PropTypes.object, children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]), defaultTitle: PropTypes.string, defer: PropTypes.bool, encodeSpecialCharacters: PropTypes.bool, htmlAttributes: PropTypes.object, link: PropTypes.arrayOf(PropTypes.object), meta: PropTypes.arrayOf(PropTypes.object), noscript: PropTypes.arrayOf(PropTypes.object), onChangeClientState: PropTypes.func, script: PropTypes.arrayOf(PropTypes.object), style: PropTypes.arrayOf(PropTypes.object), title: PropTypes.string, titleAttributes: PropTypes.object, titleTemplate: PropTypes.string, prioritizeSeoTags: PropTypes.bool, helmetData: PropTypes.object }, W$4.defaultProps = { defer: true, encodeSpecialCharacters: true, prioritizeSeoTags: false }, W$4.displayName = "Helmet";
|
|
32296
32353
|
const themeVars$J = `'{"width-navPanel-App": "var(--xmlui-width-navPanel-App)", "boxShadow-header-App": "var(--xmlui-boxShadow-header-App)", "boxShadow-navPanel-App": "var(--xmlui-boxShadow-navPanel-App)", "backgroundColor-content-App": "var(--xmlui-backgroundColor-content-App)", "borderLeft-content-App": "var(--xmlui-borderLeft-content-App)", "maxWidth-content-App": "var(--xmlui-maxWidth-content-App)", "backgroundColor-AppHeader": "var(--xmlui-backgroundColor-AppHeader)", "borderBottom-AppHeader": "var(--xmlui-borderBottom-AppHeader)", "scroll-padding-block-Pages": "var(--xmlui-scroll-padding-block-Pages)"}'`;
|
|
32297
|
-
const wrapper$e = "
|
|
32298
|
-
const vertical$4 = "
|
|
32299
|
-
const contentWrapper$1 = "
|
|
32300
|
-
const navPanelWrapper = "
|
|
32301
|
-
const PagesWrapper = "
|
|
32302
|
-
const footerWrapper = "
|
|
32303
|
-
const sticky = "
|
|
32304
|
-
const horizontal$5 = "
|
|
32305
|
-
const verticalFullHeader = "
|
|
32306
|
-
const PagesWrapperInner = "
|
|
32307
|
-
const
|
|
32308
|
-
const
|
|
32309
|
-
const
|
|
32310
|
-
const
|
|
32354
|
+
const wrapper$e = "_wrapper_rebcu_13";
|
|
32355
|
+
const vertical$4 = "_vertical_rebcu_23";
|
|
32356
|
+
const contentWrapper$1 = "_contentWrapper_rebcu_27";
|
|
32357
|
+
const navPanelWrapper = "_navPanelWrapper_rebcu_33";
|
|
32358
|
+
const PagesWrapper = "_PagesWrapper_rebcu_37";
|
|
32359
|
+
const footerWrapper = "_footerWrapper_rebcu_41";
|
|
32360
|
+
const sticky = "_sticky_rebcu_44";
|
|
32361
|
+
const horizontal$5 = "_horizontal_rebcu_51";
|
|
32362
|
+
const verticalFullHeader = "_verticalFullHeader_rebcu_73";
|
|
32363
|
+
const PagesWrapperInner = "_PagesWrapperInner_rebcu_90";
|
|
32364
|
+
const verticalConstrained = "_verticalConstrained_rebcu_102";
|
|
32365
|
+
const header$2 = "_header_rebcu_108";
|
|
32366
|
+
const scrollWholePage = "_scrollWholePage_rebcu_135";
|
|
32367
|
+
const headerWrapper$1 = "_headerWrapper_rebcu_138";
|
|
32368
|
+
const content$4 = "_content_rebcu_27";
|
|
32369
|
+
const noScrollbarGutters = "_noScrollbarGutters_rebcu_204";
|
|
32311
32370
|
const styles$Y = {
|
|
32312
32371
|
themeVars: themeVars$J,
|
|
32313
32372
|
wrapper: wrapper$e,
|
|
@@ -32320,6 +32379,8 @@ ${error2.errorObject}`;
|
|
|
32320
32379
|
horizontal: horizontal$5,
|
|
32321
32380
|
verticalFullHeader,
|
|
32322
32381
|
PagesWrapperInner,
|
|
32382
|
+
verticalConstrained,
|
|
32383
|
+
header: header$2,
|
|
32323
32384
|
scrollWholePage,
|
|
32324
32385
|
headerWrapper: headerWrapper$1,
|
|
32325
32386
|
content: content$4,
|
|
@@ -35488,6 +35549,31 @@ ${error2.errorObject}`;
|
|
|
35488
35549
|
}
|
|
35489
35550
|
);
|
|
35490
35551
|
break;
|
|
35552
|
+
case "vertical-constrained-width":
|
|
35553
|
+
content2 = /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
35554
|
+
"div",
|
|
35555
|
+
{
|
|
35556
|
+
className: classNames(wrapperBaseClasses, styles$Y.verticalConstrained),
|
|
35557
|
+
style: styleWithHelpers,
|
|
35558
|
+
ref: scrollPageContainerRef,
|
|
35559
|
+
children: [
|
|
35560
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx(
|
|
35561
|
+
"header",
|
|
35562
|
+
{
|
|
35563
|
+
className: classNames(styles$Y.headerWrapper, styles$Y.sticky),
|
|
35564
|
+
ref: headerRefCallback,
|
|
35565
|
+
children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$Y.header, style: { paddingInline: 0 }, children: header2 })
|
|
35566
|
+
}
|
|
35567
|
+
),
|
|
35568
|
+
/* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: classNames(styles$Y.content, styles$Y.verticalConstrained), children: [
|
|
35569
|
+
navPanelVisible && /* @__PURE__ */ jsxRuntimeExports.jsx("aside", { className: styles$Y.navPanelWrapper, children: navPanel }),
|
|
35570
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("main", { className: styles$Y.contentWrapper, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$Y.PagesWrapper, ref: noScrollPageContainerRef, children: /* @__PURE__ */ jsxRuntimeExports.jsx(ScrollContext.Provider, { value: scrollContainerRef, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$Y.PagesWrapperInner, style: pagesWrapperInnerStyle, children }) }) }) })
|
|
35571
|
+
] }),
|
|
35572
|
+
/* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$Y.footerWrapper, ref: footerRefCallback, children: footer2 })
|
|
35573
|
+
]
|
|
35574
|
+
}
|
|
35575
|
+
);
|
|
35576
|
+
break;
|
|
35491
35577
|
case "condensed":
|
|
35492
35578
|
case "condensed-sticky":
|
|
35493
35579
|
content2 = /* @__PURE__ */ jsxRuntimeExports.jsxs(
|
|
@@ -35578,6 +35664,7 @@ ${error2.errorObject}`;
|
|
|
35578
35664
|
case "vertical":
|
|
35579
35665
|
case "vertical-sticky":
|
|
35580
35666
|
case "vertical-full-header":
|
|
35667
|
+
case "vertical-constrained-width":
|
|
35581
35668
|
return "vertical";
|
|
35582
35669
|
default:
|
|
35583
35670
|
return "horizontal";
|
|
@@ -98733,7 +98820,7 @@ For more information, see https://radix-ui.com/primitives/docs/components/${titl
|
|
|
98733
98820
|
const { level } = reactExports.useContext(NavGroupContext);
|
|
98734
98821
|
const appLayoutContext = useAppLayoutContext();
|
|
98735
98822
|
const navPanelContext = reactExports.useContext(NavPanelContext);
|
|
98736
|
-
let inline = (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-sticky" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-full-header";
|
|
98823
|
+
let inline = (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-sticky" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-full-header" || (appLayoutContext == null ? void 0 : appLayoutContext.layout) === "vertical-constrained-width";
|
|
98737
98824
|
if (navPanelContext !== null) {
|
|
98738
98825
|
inline = navPanelContext.inDrawer;
|
|
98739
98826
|
}
|
|
@@ -143884,7 +143971,7 @@ For more information, see https://radix-ui.com/primitives/docs/components/${titl
|
|
|
143884
143971
|
/* @__PURE__ */ jsxRuntimeExports.jsx("svg", { style: { display: "none" }, ref: spriteRootRef })
|
|
143885
143972
|
] });
|
|
143886
143973
|
}
|
|
143887
|
-
const version = "0.9.
|
|
143974
|
+
const version = "0.9.18";
|
|
143888
143975
|
const ApiInterceptorContext = reactExports.createContext(null);
|
|
143889
143976
|
function useApiInterceptorContext() {
|
|
143890
143977
|
return reactExports.useContext(ApiInterceptorContext);
|
|
@@ -148133,6 +148220,7 @@ For more information, see https://radix-ui.com/primitives/docs/components/${titl
|
|
|
148133
148220
|
populateTransitiveDeps(directCompDepNames);
|
|
148134
148221
|
return transitiveDeps;
|
|
148135
148222
|
function populateTransitiveDeps(directCompDepNames2) {
|
|
148223
|
+
if (!directCompDepNames2) return;
|
|
148136
148224
|
for (const directDep of directCompDepNames2) {
|
|
148137
148225
|
if (!transitiveDeps.has(directDep)) {
|
|
148138
148226
|
transitiveDeps.add(directDep);
|
|
@@ -148865,7 +148953,7 @@ For more information, see https://radix-ui.com/primitives/docs/components/${titl
|
|
|
148865
148953
|
ToneChangerButton: ToneChangerButtonMd,
|
|
148866
148954
|
Tree: TreeMd
|
|
148867
148955
|
};
|
|
148868
|
-
var define_process_env_default$2 = { VITE_XMLUI_VERSION: "0.9.
|
|
148956
|
+
var define_process_env_default$2 = { VITE_XMLUI_VERSION: "0.9.18 (built 4/25/2025)" };
|
|
148869
148957
|
const MAIN_FILE = "Main." + componentFileExtension;
|
|
148870
148958
|
const MAIN_CODE_BEHIND_FILE = "Main." + codeBehindFileExtension;
|
|
148871
148959
|
const CONFIG_FILE = "config.json";
|
|
@@ -153303,7 +153391,7 @@ For more information, see https://radix-ui.com/primitives/docs/components/${titl
|
|
|
153303
153391
|
function isResponseWithoutBody(status) {
|
|
153304
153392
|
return RESPONSE_STATUS_CODES_WITHOUT_BODY.has(status);
|
|
153305
153393
|
}
|
|
153306
|
-
var define_process_env_default$1 = { NODE_ENV: "production", VITE_MOCK_ENABLED: true, VITE_MOCK_WORKER_LOCATION: "mockApi.js", VITE_USED_COMPONENTS_Pdf: "false", VITE_USED_COMPONENTS_Chart: "false", VITE_USER_COMPONENTS_XmluiCodeHightlighter: "false", VITE_USED_COMPONENTS_Tree: "false", VITE_XMLUI_VERSION: "0.9.
|
|
153394
|
+
var define_process_env_default$1 = { NODE_ENV: "production", VITE_MOCK_ENABLED: true, VITE_MOCK_WORKER_LOCATION: "mockApi.js", VITE_USED_COMPONENTS_Pdf: "false", VITE_USED_COMPONENTS_Chart: "false", VITE_USER_COMPONENTS_XmluiCodeHightlighter: "false", VITE_USED_COMPONENTS_Tree: "false", VITE_XMLUI_VERSION: "0.9.18 (built 4/25/2025)" };
|
|
153307
153395
|
var __defProp$7 = Object.defineProperty;
|
|
153308
153396
|
var __export = (target2, all2) => {
|
|
153309
153397
|
for (var name2 in all2)
|
package/dist/xmlui.mjs
CHANGED