xmlui 0.9.16 → 0.9.17

package/dist/{apiInterceptorWorker-E5ylKYVg.mjs → apiInterceptorWorker-D94b73xQ.mjs}

@@ -12,7 +12,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
 var _executor, _DeferredPromise_instances, decorate_fn, _a2;
 import { delay as delay$1, HttpResponse, http } from "msw";
 import { isArray, isObject as isObject$1, mapValues } from "lodash-es";
-import { r as runEventHandlerCode, g as getDate, d as delay, m as miscellaneousUtils, a as dateFunctions, o as orderBy, T as ThrowStatementError } from "./index-BjVxVHb3.mjs";
+import { r as runEventHandlerCode, g as getDate, d as delay, m as miscellaneousUtils, a as dateFunctions, o as orderBy, T as ThrowStatementError } from "./index-B6kr6jsm.mjs";
 import Dexie from "dexie";
 var POSITIONALS_EXP = /(%?)(%([sdijo]))/g;
 function serializePositional(positional, flag) {

package/dist/{index-BjVxVHb3.mjs → index-B6kr6jsm.mjs}

@@ -3394,21 +3394,23 @@ function createUrlWithQueryParams(to2) {
   }
   return to2;
 }
-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)"}'`;
-const wrapper$g = "_wrapper_qcc08_13";
-const vertical$4 = "_vertical_qcc08_23";
-const contentWrapper$1 = "_contentWrapper_qcc08_27";
-const navPanelWrapper = "_navPanelWrapper_qcc08_33";
-const PagesWrapper = "_PagesWrapper_qcc08_37";
-const footerWrapper = "_footerWrapper_qcc08_41";
-const sticky = "_sticky_qcc08_44";
-const horizontal$5 = "_horizontal_qcc08_51";
-const verticalFullHeader = "_verticalFullHeader_qcc08_73";
-const PagesWrapperInner = "_PagesWrapperInner_qcc08_90";
-const scrollWholePage = "_scrollWholePage_qcc08_102";
-const headerWrapper$1 = "_headerWrapper_qcc08_105";
-const content$2 = "_content_qcc08_27";
-const noScrollbarGutters = "_noScrollbarGutters_qcc08_147";
+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)", "maxWidth-App": "var(--xmlui-maxWidth-App)", "backgroundColor-AppHeader": "var(--xmlui-backgroundColor-AppHeader)", "borderBottom-AppHeader": "var(--xmlui-borderBottom-AppHeader)", "scroll-padding-block-Pages": "var(--xmlui-scroll-padding-block-Pages)"}'`;
+const wrapper$g = "_wrapper_1c9ty_13";
+const vertical$4 = "_vertical_1c9ty_23";
+const contentWrapper$1 = "_contentWrapper_1c9ty_27";
+const navPanelWrapper = "_navPanelWrapper_1c9ty_33";
+const PagesWrapper = "_PagesWrapper_1c9ty_37";
+const footerWrapper = "_footerWrapper_1c9ty_41";
+const sticky = "_sticky_1c9ty_44";
+const horizontal$5 = "_horizontal_1c9ty_51";
+const verticalFullHeader = "_verticalFullHeader_1c9ty_73";
+const PagesWrapperInner = "_PagesWrapperInner_1c9ty_90";
+const verticalConstrained = "_verticalConstrained_1c9ty_102";
+const header$2 = "_header_1c9ty_108";
+const scrollWholePage = "_scrollWholePage_1c9ty_135";
+const headerWrapper$1 = "_headerWrapper_1c9ty_138";
+const content$2 = "_content_1c9ty_27";
+const noScrollbarGutters = "_noScrollbarGutters_1c9ty_200";
 const styles$_ = {
   themeVars: themeVars$J,
   wrapper: wrapper$g,
@@ -3421,6 +3423,8 @@ const styles$_ = {
   horizontal: horizontal$5,
   verticalFullHeader,
   PagesWrapperInner,
+  verticalConstrained,
+  header: header$2,
   scrollWholePage,
   headerWrapper: headerWrapper$1,
   content: content$2,
@@ -4139,6 +4143,31 @@ function App({
         }
       );
       break;
+    case "vertical-constrained-width":
+      content2 = /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: classnames(wrapperBaseClasses, styles$_.verticalConstrained),
+          style: styleWithHelpers,
+          ref: scrollPageContainerRef,
+          children: [
+            /* @__PURE__ */ jsx(
+              "header",
+              {
+                className: classnames(styles$_.headerWrapper, styles$_.sticky),
+                ref: headerRefCallback,
+                children: /* @__PURE__ */ jsx("div", { className: styles$_.header, style: { paddingInline: 0 }, children: header2 })
+              }
+            ),
+            /* @__PURE__ */ jsxs("div", { className: styles$_.content, children: [
+              navPanelVisible && /* @__PURE__ */ jsx("aside", { className: styles$_.navPanelWrapper, children: navPanel }),
+              /* @__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 }) }) }) })
+            ] }),
+            /* @__PURE__ */ jsx("div", { className: styles$_.footerWrapper, ref: footerRefCallback, children: footer })
+          ]
+        }
+      );
+      break;
     case "condensed":
     case "condensed-sticky":
       content2 = /* @__PURE__ */ jsxs(
@@ -4229,6 +4258,7 @@ function getAppLayoutOrientation(appLayout) {
     case "vertical":
     case "vertical-sticky":
     case "vertical-full-header":
+    case "vertical-constrained-width":
       return "vertical";
     default:
       return "horizontal";
@@ -31615,7 +31645,7 @@ function IconProvider({ children }) {
     /* @__PURE__ */ jsx("svg", { style: { display: "none" }, ref: spriteRootRef })
   ] });
 }
-const version = "0.9.16";
+const version = "0.9.17";
 const ApiInterceptorContext = createContext(null);
 function useApiInterceptorContext() {
   return useContext(ApiInterceptorContext);
@@ -35802,7 +35832,7 @@ function ApiInterceptorProvider({
       let interceptorWorker;
       (async () => {
         if (process.env.VITE_MOCK_ENABLED) {
-          const { createApiInterceptorWorker } = await import("./apiInterceptorWorker-E5ylKYVg.mjs");
+          const { createApiInterceptorWorker } = await import("./apiInterceptorWorker-D94b73xQ.mjs");
           if (interceptor) {
             interceptorWorker = await createApiInterceptorWorker(interceptor, apiWorker);
             if (!apiWorker) {

package/dist/index.css

@@ -968,7 +968,7 @@
  * This function allows other CSS modules to get the value of the CSS variable specified in $componentVariable.
  Optionally, you can provide a $fallbackValue to set the variable's value if that is not defined.
  */
-._wrapper_qcc08_13 {
+._wrapper_1c9ty_13 {
   --footer-height: 0px;
   --header-height: 0px;
   width: 100%;
@@ -978,138 +978,191 @@
   flex-direction: column;
   isolation: isolate;
 }
-._wrapper_qcc08_13._vertical_qcc08_23 {
+._wrapper_1c9ty_13._vertical_1c9ty_23 {
   flex-direction: row;
   overflow: initial;
 }
-._wrapper_qcc08_13._vertical_qcc08_23 ._contentWrapper_qcc08_27 {
+._wrapper_1c9ty_13._vertical_1c9ty_23 ._contentWrapper_1c9ty_27 {
   overflow: auto;
   scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
   position: relative;
   scrollbar-gutter: stable both-edges;
 }
-._wrapper_qcc08_13._vertical_qcc08_23 ._navPanelWrapper_qcc08_33 {
+._wrapper_1c9ty_13._vertical_1c9ty_23 ._navPanelWrapper_1c9ty_33 {
   width: var(--xmlui-width-navPanel-App);
   flex-shrink: 0;
 }
-._wrapper_qcc08_13._vertical_qcc08_23 ._PagesWrapper_qcc08_37 {
+._wrapper_1c9ty_13._vertical_1c9ty_23 ._PagesWrapper_1c9ty_37 {
   min-height: initial;
   flex: 1;
 }
-._wrapper_qcc08_13._vertical_qcc08_23 ._footerWrapper_qcc08_41 {
+._wrapper_1c9ty_13._vertical_1c9ty_23 ._footerWrapper_1c9ty_41 {
   position: static;
 }
-._wrapper_qcc08_13._vertical_qcc08_23._sticky_qcc08_44 ._contentWrapper_qcc08_27 {
+._wrapper_1c9ty_13._vertical_1c9ty_23._sticky_1c9ty_44 ._contentWrapper_1c9ty_27 {
   scroll-padding-top: var(--header-height);
 }
-._wrapper_qcc08_13._vertical_qcc08_23._sticky_qcc08_44 ._footerWrapper_qcc08_41 {
+._wrapper_1c9ty_13._vertical_1c9ty_23._sticky_1c9ty_44 ._footerWrapper_1c9ty_41 {
   position: sticky;
   bottom: 0;
 }
-._wrapper_qcc08_13._horizontal_qcc08_51 {
+._wrapper_1c9ty_13._horizontal_1c9ty_51 {
   overflow: auto;
   scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
 }
-._wrapper_qcc08_13._horizontal_qcc08_51 ._PagesWrapper_qcc08_37 {
+._wrapper_1c9ty_13._horizontal_1c9ty_51 ._PagesWrapper_1c9ty_37 {
   min-height: initial;
 }
-._wrapper_qcc08_13._horizontal_qcc08_51 ._footerWrapper_qcc08_41 {
+._wrapper_1c9ty_13._horizontal_1c9ty_51 ._footerWrapper_1c9ty_41 {
   position: static;
 }
-._wrapper_qcc08_13._horizontal_qcc08_51._sticky_qcc08_44 {
+._wrapper_1c9ty_13._horizontal_1c9ty_51._sticky_1c9ty_44 {
   scroll-padding-top: var(--header-height);
   min-height: 100%;
 }
-._wrapper_qcc08_13._horizontal_qcc08_51._sticky_qcc08_44 ._footerWrapper_qcc08_41 {
+._wrapper_1c9ty_13._horizontal_1c9ty_51._sticky_1c9ty_44 ._footerWrapper_1c9ty_41 {
   position: sticky;
   bottom: 0;
 }
-._wrapper_qcc08_13._horizontal_qcc08_51 ._navPanelWrapper_qcc08_33 {
+._wrapper_1c9ty_13._horizontal_1c9ty_51 ._navPanelWrapper_1c9ty_33 {
   border-bottom: var(--xmlui-borderBottom-AppHeader);
   justify-content: end;
 }
-._wrapper_qcc08_13._verticalFullHeader_qcc08_73 {
+._wrapper_1c9ty_13._verticalFullHeader_1c9ty_73 {
   min-height: 100%;
   height: 100%;
   overflow: auto;
   scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
 }
-._wrapper_qcc08_13._verticalFullHeader_qcc08_73 ._navPanelWrapper_qcc08_33 {
+._wrapper_1c9ty_13._verticalFullHeader_1c9ty_73 ._navPanelWrapper_1c9ty_33 {
   width: var(--xmlui-width-navPanel-App);
   position: sticky;
   height: calc(var(--containerHeight, 100vh) - var(--footer-height) - var(--header-height));
   top: var(--header-height);
 }
-._wrapper_qcc08_13._verticalFullHeader_qcc08_73 ._PagesWrapper_qcc08_37 {
+._wrapper_1c9ty_13._verticalFullHeader_1c9ty_73 ._PagesWrapper_1c9ty_37 {
   overflow: initial;
   min-height: calc(var(--containerHeight, 100vh) - var(--header-height) - var(--footer-height));
   height: 100%;
 }
-._wrapper_qcc08_13._verticalFullHeader_qcc08_73 ._PagesWrapperInner_qcc08_90 {
+._wrapper_1c9ty_13._verticalFullHeader_1c9ty_73 ._PagesWrapperInner_1c9ty_90 {
   height: 100%;
 }
-._wrapper_qcc08_13._verticalFullHeader_qcc08_73 ._PagesWrapperInner_qcc08_90 > .xmlui-page-root {
+._wrapper_1c9ty_13._verticalFullHeader_1c9ty_73 ._PagesWrapperInner_1c9ty_90 > .xmlui-page-root {
   height: 100%;
 }
-._wrapper_qcc08_13._verticalFullHeader_qcc08_73 ._footerWrapper_qcc08_41 {
+._wrapper_1c9ty_13._verticalFullHeader_1c9ty_73 ._footerWrapper_1c9ty_41 {
   position: sticky;
   left: 0;
   right: 0;
   bottom: 0;
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102 {
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 {
+  min-height: 100%;
+  height: 100%;
+  overflow: auto;
+  scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
+}
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 ._header_1c9ty_108 {
+  max-width: var(--xmlui-maxWidth-App);
+  margin: auto;
+}
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 ._navPanelWrapper_1c9ty_33 {
+  width: var(--xmlui-width-navPanel-App);
+  position: sticky;
+  height: calc(var(--containerHeight, 100vh) - var(--footer-height) - var(--header-height));
+  top: var(--header-height);
+}
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 ._PagesWrapper_1c9ty_37 {
+  overflow: initial;
+  min-height: calc(var(--containerHeight, 100vh) - var(--header-height) - var(--footer-height));
+  height: 100%;
+}
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 ._PagesWrapperInner_1c9ty_90 {
+  height: 100%;
+}
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 ._PagesWrapperInner_1c9ty_90 > .xmlui-page-root {
+  height: 100%;
+}
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 ._footerWrapper_1c9ty_41 {
+  position: sticky;
+  left: 0;
+  right: 0;
+  bottom: 0;
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135 {
   scrollbar-gutter: stable both-edges;
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102 ._headerWrapper_qcc08_105 {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135 ._headerWrapper_1c9ty_138 {
   margin-inline: calc(-1 * var(--scrollbar-width));
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102 ._headerWrapper_qcc08_105 > div {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135 ._headerWrapper_1c9ty_138 > div {
   padding-inline: var(--scrollbar-width);
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102 ._footerWrapper_qcc08_41 {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135 ._footerWrapper_1c9ty_41 {
   margin-inline: calc(-1 * var(--scrollbar-width));
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102 ._footerWrapper_qcc08_41 > div {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135 ._footerWrapper_1c9ty_41 > div {
   padding-inline: var(--scrollbar-width);
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102._verticalFullHeader_qcc08_73 {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalFullHeader_1c9ty_73 {
   scroll-padding-top: var(--header-height);
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102._verticalFullHeader_qcc08_73 ._content_qcc08_27 {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalFullHeader_1c9ty_73 ._content_1c9ty_27 {
+  margin-inline: calc(-1 * var(--scrollbar-width));
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalFullHeader_1c9ty_73 ._contentWrapper_1c9ty_27 {
+  padding-inline: var(--scrollbar-width);
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalConstrained_1c9ty_102 {
+  scroll-padding-top: var(--header-height);
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalConstrained_1c9ty_102 ._content_1c9ty_27 {
+  width: var(--xmlui-maxWidth-App);
+  margin-inline: calc(-1 * var(--scrollbar-width));
+  margin: auto;
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalConstrained_1c9ty_102 ._contentWrapper_1c9ty_27 {
+  padding-inline: var(--scrollbar-width);
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalConstrained_1c9ty_102 ._headerWrapper_1c9ty_138 > div {
+  width: var(--xmlui-maxWidth-App);
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalConstrained_1c9ty_102 ._footerWrapper_1c9ty_41 {
   margin-inline: calc(-1 * var(--scrollbar-width));
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102._verticalFullHeader_qcc08_73 ._contentWrapper_qcc08_27 {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalConstrained_1c9ty_102 ._footerWrapper_1c9ty_41 > div {
   padding-inline: var(--scrollbar-width);
 }
-._wrapper_qcc08_13:not(._scrollWholePage_qcc08_102) {
+._wrapper_1c9ty_13:not(._scrollWholePage_1c9ty_135) {
   overflow: hidden;
 }
-._wrapper_qcc08_13:not(._scrollWholePage_qcc08_102) ._content_qcc08_27 {
+._wrapper_1c9ty_13:not(._scrollWholePage_1c9ty_135) ._content_1c9ty_27 {
   min-height: 0;
   height: 100%;
 }
-._wrapper_qcc08_13:not(._scrollWholePage_qcc08_102) ._contentWrapper_qcc08_27 {
+._wrapper_1c9ty_13:not(._scrollWholePage_1c9ty_135) ._contentWrapper_1c9ty_27 {
   overflow: initial;
 }
-._wrapper_qcc08_13:not(._scrollWholePage_qcc08_102) ._PagesWrapper_qcc08_37 {
+._wrapper_1c9ty_13:not(._scrollWholePage_1c9ty_135) ._PagesWrapper_1c9ty_37 {
   overflow: auto;
   scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
   min-height: 0;
   height: 100%;
   scrollbar-gutter: stable both-edges;
 }
-._wrapper_qcc08_13:not(._scrollWholePage_qcc08_102) ._PagesWrapperInner_qcc08_90 {
+._wrapper_1c9ty_13:not(._scrollWholePage_1c9ty_135) ._PagesWrapperInner_1c9ty_90 {
   min-height: 100%;
   height: 0;
 }
-._wrapper_qcc08_13._noScrollbarGutters_qcc08_147 {
+._wrapper_1c9ty_13._noScrollbarGutters_1c9ty_200 {
   scrollbar-gutter: auto;
 }
-._wrapper_qcc08_13._noScrollbarGutters_qcc08_147 ._PagesWrapper_qcc08_37 {
+._wrapper_1c9ty_13._noScrollbarGutters_1c9ty_200 ._PagesWrapper_1c9ty_37 {
   scrollbar-gutter: auto;
 }
 
-._headerWrapper_qcc08_105 {
+._headerWrapper_1c9ty_138 {
   z-index: 1;
   min-height: 0;
   flex-shrink: 0;
@@ -1118,17 +1171,17 @@
   box-shadow: var(--xmlui-boxShadow-header-App);
   background-color: var(--xmlui-backgroundColor-AppHeader);
 }
-._headerWrapper_qcc08_105._sticky_qcc08_44 {
+._headerWrapper_1c9ty_138._sticky_1c9ty_44 {
   position: sticky;
 }
 
-._content_qcc08_27 {
+._content_1c9ty_27 {
   display: flex;
   flex-direction: row;
   isolation: isolate;
 }
 
-._contentWrapper_qcc08_27 {
+._contentWrapper_1c9ty_27 {
   position: relative;
   min-width: 0;
   flex: 1;
@@ -1139,21 +1192,21 @@
   border-left: var(--xmlui-borderLeft-content-App);
 }
 
-._navPanelWrapper_qcc08_33 {
+._navPanelWrapper_1c9ty_33 {
   display: flex;
   position: sticky;
   top: 0;
 }
-._navPanelWrapper_qcc08_33:empty {
+._navPanelWrapper_1c9ty_33:empty {
   display: none;
 }
 
-._PagesWrapper_qcc08_37 {
+._PagesWrapper_1c9ty_37 {
   flex: 1;
   isolation: isolate;
 }
 
-._PagesWrapperInner_qcc08_90 {
+._PagesWrapperInner_1c9ty_90 {
   --page-padding-left: var(--xmlui-space-4);
   --page-padding-right: var(--xmlui-space-4);
   --page-padding-top: var(--xmlui-space-5);
@@ -1171,7 +1224,7 @@
   display: flex;
   flex-direction: column;
 }
-._PagesWrapperInner_qcc08_90 > .xmlui-page-root {
+._PagesWrapperInner_1c9ty_90 > .xmlui-page-root {
   padding-top: var(--page-padding-top-override, var(--page-padding-top));
   padding-bottom: var(--page-padding-bottom-override, var(--page-padding-bottom));
   padding-right: var(--page-padding-right-override, var(--page-padding-right));
@@ -1183,7 +1236,7 @@
   margin-right: calc(-1 * var(--page-padding-right));
 }
 
-._footerWrapper_qcc08_41 {
+._footerWrapper_1c9ty_41 {
   flex-shrink: 0;
 }/*
  * This file contains all CSS variables AppEngine uses for styling the UI, including individual visual components.

package/dist/scripts/src/components/App/AppLayoutContext.js

@@ -7,6 +7,7 @@ const appLayoutNames = [
     "vertical",
     "vertical-sticky",
     "vertical-full-header",
+    "vertical-constrained-width",
     "condensed",
     "condensed-sticky",
     "horizontal",

package/dist/scripts/src/components/App/AppNative.js

@@ -185,6 +185,9 @@ function App({ children, style, layout, loggedInUser, scrollWholePage, noScrollb
         case "vertical-full-header":
             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 })] }));
             break;
+        case "vertical-constrained-width":
+            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: 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 })] }));
+            break;
         case "condensed":
         case "condensed-sticky":
             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) {
         case "vertical":
         case "vertical-sticky":
         case "vertical-full-header":
+        case "vertical-constrained-width":
             return "vertical";
         default:
             return "horizontal";

package/dist/style.css

@@ -1617,7 +1617,7 @@ See this source for details: https://css-tricks.com/line-clampin/
  * This function allows other CSS modules to get the value of the CSS variable specified in $componentVariable.
  Optionally, you can provide a $fallbackValue to set the variable's value if that is not defined.
  */
-._wrapper_qcc08_13 {
+._wrapper_1c9ty_13 {
   --footer-height: 0px;
   --header-height: 0px;
   width: 100%;
@@ -1627,138 +1627,191 @@ See this source for details: https://css-tricks.com/line-clampin/
   flex-direction: column;
   isolation: isolate;
 }
-._wrapper_qcc08_13._vertical_qcc08_23 {
+._wrapper_1c9ty_13._vertical_1c9ty_23 {
   flex-direction: row;
   overflow: initial;
 }
-._wrapper_qcc08_13._vertical_qcc08_23 ._contentWrapper_qcc08_27 {
+._wrapper_1c9ty_13._vertical_1c9ty_23 ._contentWrapper_1c9ty_27 {
   overflow: auto;
   scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
   position: relative;
   scrollbar-gutter: stable both-edges;
 }
-._wrapper_qcc08_13._vertical_qcc08_23 ._navPanelWrapper_qcc08_33 {
+._wrapper_1c9ty_13._vertical_1c9ty_23 ._navPanelWrapper_1c9ty_33 {
   width: var(--xmlui-width-navPanel-App);
   flex-shrink: 0;
 }
-._wrapper_qcc08_13._vertical_qcc08_23 ._PagesWrapper_qcc08_37 {
+._wrapper_1c9ty_13._vertical_1c9ty_23 ._PagesWrapper_1c9ty_37 {
   min-height: initial;
   flex: 1;
 }
-._wrapper_qcc08_13._vertical_qcc08_23 ._footerWrapper_qcc08_41 {
+._wrapper_1c9ty_13._vertical_1c9ty_23 ._footerWrapper_1c9ty_41 {
   position: static;
 }
-._wrapper_qcc08_13._vertical_qcc08_23._sticky_qcc08_44 ._contentWrapper_qcc08_27 {
+._wrapper_1c9ty_13._vertical_1c9ty_23._sticky_1c9ty_44 ._contentWrapper_1c9ty_27 {
   scroll-padding-top: var(--header-height);
 }
-._wrapper_qcc08_13._vertical_qcc08_23._sticky_qcc08_44 ._footerWrapper_qcc08_41 {
+._wrapper_1c9ty_13._vertical_1c9ty_23._sticky_1c9ty_44 ._footerWrapper_1c9ty_41 {
   position: sticky;
   bottom: 0;
 }
-._wrapper_qcc08_13._horizontal_qcc08_51 {
+._wrapper_1c9ty_13._horizontal_1c9ty_51 {
   overflow: auto;
   scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
 }
-._wrapper_qcc08_13._horizontal_qcc08_51 ._PagesWrapper_qcc08_37 {
+._wrapper_1c9ty_13._horizontal_1c9ty_51 ._PagesWrapper_1c9ty_37 {
   min-height: initial;
 }
-._wrapper_qcc08_13._horizontal_qcc08_51 ._footerWrapper_qcc08_41 {
+._wrapper_1c9ty_13._horizontal_1c9ty_51 ._footerWrapper_1c9ty_41 {
   position: static;
 }
-._wrapper_qcc08_13._horizontal_qcc08_51._sticky_qcc08_44 {
+._wrapper_1c9ty_13._horizontal_1c9ty_51._sticky_1c9ty_44 {
   scroll-padding-top: var(--header-height);
   min-height: 100%;
 }
-._wrapper_qcc08_13._horizontal_qcc08_51._sticky_qcc08_44 ._footerWrapper_qcc08_41 {
+._wrapper_1c9ty_13._horizontal_1c9ty_51._sticky_1c9ty_44 ._footerWrapper_1c9ty_41 {
   position: sticky;
   bottom: 0;
 }
-._wrapper_qcc08_13._horizontal_qcc08_51 ._navPanelWrapper_qcc08_33 {
+._wrapper_1c9ty_13._horizontal_1c9ty_51 ._navPanelWrapper_1c9ty_33 {
   border-bottom: var(--xmlui-borderBottom-AppHeader);
   justify-content: end;
 }
-._wrapper_qcc08_13._verticalFullHeader_qcc08_73 {
+._wrapper_1c9ty_13._verticalFullHeader_1c9ty_73 {
   min-height: 100%;
   height: 100%;
   overflow: auto;
   scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
 }
-._wrapper_qcc08_13._verticalFullHeader_qcc08_73 ._navPanelWrapper_qcc08_33 {
+._wrapper_1c9ty_13._verticalFullHeader_1c9ty_73 ._navPanelWrapper_1c9ty_33 {
   width: var(--xmlui-width-navPanel-App);
   position: sticky;
   height: calc(var(--containerHeight, 100vh) - var(--footer-height) - var(--header-height));
   top: var(--header-height);
 }
-._wrapper_qcc08_13._verticalFullHeader_qcc08_73 ._PagesWrapper_qcc08_37 {
+._wrapper_1c9ty_13._verticalFullHeader_1c9ty_73 ._PagesWrapper_1c9ty_37 {
   overflow: initial;
   min-height: calc(var(--containerHeight, 100vh) - var(--header-height) - var(--footer-height));
   height: 100%;
 }
-._wrapper_qcc08_13._verticalFullHeader_qcc08_73 ._PagesWrapperInner_qcc08_90 {
+._wrapper_1c9ty_13._verticalFullHeader_1c9ty_73 ._PagesWrapperInner_1c9ty_90 {
   height: 100%;
 }
-._wrapper_qcc08_13._verticalFullHeader_qcc08_73 ._PagesWrapperInner_qcc08_90 > .xmlui-page-root {
+._wrapper_1c9ty_13._verticalFullHeader_1c9ty_73 ._PagesWrapperInner_1c9ty_90 > .xmlui-page-root {
   height: 100%;
 }
-._wrapper_qcc08_13._verticalFullHeader_qcc08_73 ._footerWrapper_qcc08_41 {
+._wrapper_1c9ty_13._verticalFullHeader_1c9ty_73 ._footerWrapper_1c9ty_41 {
   position: sticky;
   left: 0;
   right: 0;
   bottom: 0;
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102 {
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 {
+  min-height: 100%;
+  height: 100%;
+  overflow: auto;
+  scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
+}
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 ._header_1c9ty_108 {
+  max-width: var(--xmlui-maxWidth-App);
+  margin: auto;
+}
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 ._navPanelWrapper_1c9ty_33 {
+  width: var(--xmlui-width-navPanel-App);
+  position: sticky;
+  height: calc(var(--containerHeight, 100vh) - var(--footer-height) - var(--header-height));
+  top: var(--header-height);
+}
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 ._PagesWrapper_1c9ty_37 {
+  overflow: initial;
+  min-height: calc(var(--containerHeight, 100vh) - var(--header-height) - var(--footer-height));
+  height: 100%;
+}
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 ._PagesWrapperInner_1c9ty_90 {
+  height: 100%;
+}
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 ._PagesWrapperInner_1c9ty_90 > .xmlui-page-root {
+  height: 100%;
+}
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 ._footerWrapper_1c9ty_41 {
+  position: sticky;
+  left: 0;
+  right: 0;
+  bottom: 0;
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135 {
   scrollbar-gutter: stable both-edges;
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102 ._headerWrapper_qcc08_105 {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135 ._headerWrapper_1c9ty_138 {
   margin-inline: calc(-1 * var(--scrollbar-width));
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102 ._headerWrapper_qcc08_105 > div {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135 ._headerWrapper_1c9ty_138 > div {
   padding-inline: var(--scrollbar-width);
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102 ._footerWrapper_qcc08_41 {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135 ._footerWrapper_1c9ty_41 {
   margin-inline: calc(-1 * var(--scrollbar-width));
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102 ._footerWrapper_qcc08_41 > div {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135 ._footerWrapper_1c9ty_41 > div {
   padding-inline: var(--scrollbar-width);
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102._verticalFullHeader_qcc08_73 {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalFullHeader_1c9ty_73 {
   scroll-padding-top: var(--header-height);
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102._verticalFullHeader_qcc08_73 ._content_qcc08_27 {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalFullHeader_1c9ty_73 ._content_1c9ty_27 {
+  margin-inline: calc(-1 * var(--scrollbar-width));
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalFullHeader_1c9ty_73 ._contentWrapper_1c9ty_27 {
+  padding-inline: var(--scrollbar-width);
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalConstrained_1c9ty_102 {
+  scroll-padding-top: var(--header-height);
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalConstrained_1c9ty_102 ._content_1c9ty_27 {
+  width: var(--xmlui-maxWidth-App);
+  margin-inline: calc(-1 * var(--scrollbar-width));
+  margin: auto;
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalConstrained_1c9ty_102 ._contentWrapper_1c9ty_27 {
+  padding-inline: var(--scrollbar-width);
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalConstrained_1c9ty_102 ._headerWrapper_1c9ty_138 > div {
+  width: var(--xmlui-maxWidth-App);
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalConstrained_1c9ty_102 ._footerWrapper_1c9ty_41 {
   margin-inline: calc(-1 * var(--scrollbar-width));
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102._verticalFullHeader_qcc08_73 ._contentWrapper_qcc08_27 {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalConstrained_1c9ty_102 ._footerWrapper_1c9ty_41 > div {
   padding-inline: var(--scrollbar-width);
 }
-._wrapper_qcc08_13:not(._scrollWholePage_qcc08_102) {
+._wrapper_1c9ty_13:not(._scrollWholePage_1c9ty_135) {
   overflow: hidden;
 }
-._wrapper_qcc08_13:not(._scrollWholePage_qcc08_102) ._content_qcc08_27 {
+._wrapper_1c9ty_13:not(._scrollWholePage_1c9ty_135) ._content_1c9ty_27 {
   min-height: 0;
   height: 100%;
 }
-._wrapper_qcc08_13:not(._scrollWholePage_qcc08_102) ._contentWrapper_qcc08_27 {
+._wrapper_1c9ty_13:not(._scrollWholePage_1c9ty_135) ._contentWrapper_1c9ty_27 {
   overflow: initial;
 }
-._wrapper_qcc08_13:not(._scrollWholePage_qcc08_102) ._PagesWrapper_qcc08_37 {
+._wrapper_1c9ty_13:not(._scrollWholePage_1c9ty_135) ._PagesWrapper_1c9ty_37 {
   overflow: auto;
   scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
   min-height: 0;
   height: 100%;
   scrollbar-gutter: stable both-edges;
 }
-._wrapper_qcc08_13:not(._scrollWholePage_qcc08_102) ._PagesWrapperInner_qcc08_90 {
+._wrapper_1c9ty_13:not(._scrollWholePage_1c9ty_135) ._PagesWrapperInner_1c9ty_90 {
   min-height: 100%;
   height: 0;
 }
-._wrapper_qcc08_13._noScrollbarGutters_qcc08_147 {
+._wrapper_1c9ty_13._noScrollbarGutters_1c9ty_200 {
   scrollbar-gutter: auto;
 }
-._wrapper_qcc08_13._noScrollbarGutters_qcc08_147 ._PagesWrapper_qcc08_37 {
+._wrapper_1c9ty_13._noScrollbarGutters_1c9ty_200 ._PagesWrapper_1c9ty_37 {
   scrollbar-gutter: auto;
 }
 
-._headerWrapper_qcc08_105 {
+._headerWrapper_1c9ty_138 {
   z-index: 1;
   min-height: 0;
   flex-shrink: 0;
@@ -1767,17 +1820,17 @@ See this source for details: https://css-tricks.com/line-clampin/
   box-shadow: var(--xmlui-boxShadow-header-App);
   background-color: var(--xmlui-backgroundColor-AppHeader);
 }
-._headerWrapper_qcc08_105._sticky_qcc08_44 {
+._headerWrapper_1c9ty_138._sticky_1c9ty_44 {
   position: sticky;
 }
 
-._content_qcc08_27 {
+._content_1c9ty_27 {
   display: flex;
   flex-direction: row;
   isolation: isolate;
 }
 
-._contentWrapper_qcc08_27 {
+._contentWrapper_1c9ty_27 {
   position: relative;
   min-width: 0;
   flex: 1;
@@ -1788,21 +1841,21 @@ See this source for details: https://css-tricks.com/line-clampin/
   border-left: var(--xmlui-borderLeft-content-App);
 }
 
-._navPanelWrapper_qcc08_33 {
+._navPanelWrapper_1c9ty_33 {
   display: flex;
   position: sticky;
   top: 0;
 }
-._navPanelWrapper_qcc08_33:empty {
+._navPanelWrapper_1c9ty_33:empty {
   display: none;
 }
 
-._PagesWrapper_qcc08_37 {
+._PagesWrapper_1c9ty_37 {
   flex: 1;
   isolation: isolate;
 }
 
-._PagesWrapperInner_qcc08_90 {
+._PagesWrapperInner_1c9ty_90 {
   --page-padding-left: var(--xmlui-space-4);
   --page-padding-right: var(--xmlui-space-4);
   --page-padding-top: var(--xmlui-space-5);
@@ -1820,7 +1873,7 @@ See this source for details: https://css-tricks.com/line-clampin/
   display: flex;
   flex-direction: column;
 }
-._PagesWrapperInner_qcc08_90 > .xmlui-page-root {
+._PagesWrapperInner_1c9ty_90 > .xmlui-page-root {
   padding-top: var(--page-padding-top-override, var(--page-padding-top));
   padding-bottom: var(--page-padding-bottom-override, var(--page-padding-bottom));
   padding-right: var(--page-padding-right-override, var(--page-padding-right));
@@ -1832,7 +1885,7 @@ See this source for details: https://css-tricks.com/line-clampin/
   margin-right: calc(-1 * var(--page-padding-right));
 }
 
-._footerWrapper_qcc08_41 {
+._footerWrapper_1c9ty_41 {
   flex-shrink: 0;
 }/*
  * This file contains all CSS variables AppEngine uses for styling the UI, including individual visual components.

package/dist/xmlui-metadata.mjs

@@ -3090,7 +3090,7 @@ const ThemeMd = createMetadata({
   },
   opaque: true
 });
-const themeVars$I = `'{"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)"}'`;
+const themeVars$I = `'{"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)", "maxWidth-App": "var(--xmlui-maxWidth-App)", "backgroundColor-AppHeader": "var(--xmlui-backgroundColor-AppHeader)", "borderBottom-AppHeader": "var(--xmlui-borderBottom-AppHeader)", "scroll-padding-block-Pages": "var(--xmlui-scroll-padding-block-Pages)"}'`;
 const styles$L = {
   themeVars: themeVars$I
 };
@@ -3359,6 +3359,7 @@ function getAppLayoutOrientation(appLayout) {
     case "vertical":
     case "vertical-sticky":
     case "vertical-full-header":
+    case "vertical-constrained-width":
       return "vertical";
     default:
       return "horizontal";

package/dist/xmlui-metadata.umd.js

@@ -3087,7 +3087,7 @@
     },
     opaque: true
   });
-  const themeVars$I = `'{"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)"}'`;
+  const themeVars$I = `'{"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)", "maxWidth-App": "var(--xmlui-maxWidth-App)", "backgroundColor-AppHeader": "var(--xmlui-backgroundColor-AppHeader)", "borderBottom-AppHeader": "var(--xmlui-borderBottom-AppHeader)", "scroll-padding-block-Pages": "var(--xmlui-scroll-padding-block-Pages)"}'`;
   const styles$L = {
     themeVars: themeVars$I
   };
@@ -3356,6 +3356,7 @@
       case "vertical":
       case "vertical-sticky":
       case "vertical-full-header":
+      case "vertical-constrained-width":
         return "vertical";
       default:
         return "horizontal";

package/dist/xmlui-standalone.umd.js

@@ -985,7 +985,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
  * This function allows other CSS modules to get the value of the CSS variable specified in $componentVariable.
  Optionally, you can provide a $fallbackValue to set the variable's value if that is not defined.
  */
-._wrapper_qcc08_13 {
+._wrapper_1c9ty_13 {
   --footer-height: 0px;
   --header-height: 0px;
   width: 100%;
@@ -995,138 +995,191 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
   flex-direction: column;
   isolation: isolate;
 }
-._wrapper_qcc08_13._vertical_qcc08_23 {
+._wrapper_1c9ty_13._vertical_1c9ty_23 {
   flex-direction: row;
   overflow: initial;
 }
-._wrapper_qcc08_13._vertical_qcc08_23 ._contentWrapper_qcc08_27 {
+._wrapper_1c9ty_13._vertical_1c9ty_23 ._contentWrapper_1c9ty_27 {
   overflow: auto;
   scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
   position: relative;
   scrollbar-gutter: stable both-edges;
 }
-._wrapper_qcc08_13._vertical_qcc08_23 ._navPanelWrapper_qcc08_33 {
+._wrapper_1c9ty_13._vertical_1c9ty_23 ._navPanelWrapper_1c9ty_33 {
   width: var(--xmlui-width-navPanel-App);
   flex-shrink: 0;
 }
-._wrapper_qcc08_13._vertical_qcc08_23 ._PagesWrapper_qcc08_37 {
+._wrapper_1c9ty_13._vertical_1c9ty_23 ._PagesWrapper_1c9ty_37 {
   min-height: initial;
   flex: 1;
 }
-._wrapper_qcc08_13._vertical_qcc08_23 ._footerWrapper_qcc08_41 {
+._wrapper_1c9ty_13._vertical_1c9ty_23 ._footerWrapper_1c9ty_41 {
   position: static;
 }
-._wrapper_qcc08_13._vertical_qcc08_23._sticky_qcc08_44 ._contentWrapper_qcc08_27 {
+._wrapper_1c9ty_13._vertical_1c9ty_23._sticky_1c9ty_44 ._contentWrapper_1c9ty_27 {
   scroll-padding-top: var(--header-height);
 }
-._wrapper_qcc08_13._vertical_qcc08_23._sticky_qcc08_44 ._footerWrapper_qcc08_41 {
+._wrapper_1c9ty_13._vertical_1c9ty_23._sticky_1c9ty_44 ._footerWrapper_1c9ty_41 {
   position: sticky;
   bottom: 0;
 }
-._wrapper_qcc08_13._horizontal_qcc08_51 {
+._wrapper_1c9ty_13._horizontal_1c9ty_51 {
   overflow: auto;
   scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
 }
-._wrapper_qcc08_13._horizontal_qcc08_51 ._PagesWrapper_qcc08_37 {
+._wrapper_1c9ty_13._horizontal_1c9ty_51 ._PagesWrapper_1c9ty_37 {
   min-height: initial;
 }
-._wrapper_qcc08_13._horizontal_qcc08_51 ._footerWrapper_qcc08_41 {
+._wrapper_1c9ty_13._horizontal_1c9ty_51 ._footerWrapper_1c9ty_41 {
   position: static;
 }
-._wrapper_qcc08_13._horizontal_qcc08_51._sticky_qcc08_44 {
+._wrapper_1c9ty_13._horizontal_1c9ty_51._sticky_1c9ty_44 {
   scroll-padding-top: var(--header-height);
   min-height: 100%;
 }
-._wrapper_qcc08_13._horizontal_qcc08_51._sticky_qcc08_44 ._footerWrapper_qcc08_41 {
+._wrapper_1c9ty_13._horizontal_1c9ty_51._sticky_1c9ty_44 ._footerWrapper_1c9ty_41 {
   position: sticky;
   bottom: 0;
 }
-._wrapper_qcc08_13._horizontal_qcc08_51 ._navPanelWrapper_qcc08_33 {
+._wrapper_1c9ty_13._horizontal_1c9ty_51 ._navPanelWrapper_1c9ty_33 {
   border-bottom: var(--xmlui-borderBottom-AppHeader);
   justify-content: end;
 }
-._wrapper_qcc08_13._verticalFullHeader_qcc08_73 {
+._wrapper_1c9ty_13._verticalFullHeader_1c9ty_73 {
   min-height: 100%;
   height: 100%;
   overflow: auto;
   scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
 }
-._wrapper_qcc08_13._verticalFullHeader_qcc08_73 ._navPanelWrapper_qcc08_33 {
+._wrapper_1c9ty_13._verticalFullHeader_1c9ty_73 ._navPanelWrapper_1c9ty_33 {
   width: var(--xmlui-width-navPanel-App);
   position: sticky;
   height: calc(var(--containerHeight, 100vh) - var(--footer-height) - var(--header-height));
   top: var(--header-height);
 }
-._wrapper_qcc08_13._verticalFullHeader_qcc08_73 ._PagesWrapper_qcc08_37 {
+._wrapper_1c9ty_13._verticalFullHeader_1c9ty_73 ._PagesWrapper_1c9ty_37 {
   overflow: initial;
   min-height: calc(var(--containerHeight, 100vh) - var(--header-height) - var(--footer-height));
   height: 100%;
 }
-._wrapper_qcc08_13._verticalFullHeader_qcc08_73 ._PagesWrapperInner_qcc08_90 {
+._wrapper_1c9ty_13._verticalFullHeader_1c9ty_73 ._PagesWrapperInner_1c9ty_90 {
   height: 100%;
 }
-._wrapper_qcc08_13._verticalFullHeader_qcc08_73 ._PagesWrapperInner_qcc08_90 > .xmlui-page-root {
+._wrapper_1c9ty_13._verticalFullHeader_1c9ty_73 ._PagesWrapperInner_1c9ty_90 > .xmlui-page-root {
   height: 100%;
 }
-._wrapper_qcc08_13._verticalFullHeader_qcc08_73 ._footerWrapper_qcc08_41 {
+._wrapper_1c9ty_13._verticalFullHeader_1c9ty_73 ._footerWrapper_1c9ty_41 {
   position: sticky;
   left: 0;
   right: 0;
   bottom: 0;
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102 {
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 {
+  min-height: 100%;
+  height: 100%;
+  overflow: auto;
+  scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
+}
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 ._header_1c9ty_108 {
+  max-width: var(--xmlui-maxWidth-App);
+  margin: auto;
+}
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 ._navPanelWrapper_1c9ty_33 {
+  width: var(--xmlui-width-navPanel-App);
+  position: sticky;
+  height: calc(var(--containerHeight, 100vh) - var(--footer-height) - var(--header-height));
+  top: var(--header-height);
+}
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 ._PagesWrapper_1c9ty_37 {
+  overflow: initial;
+  min-height: calc(var(--containerHeight, 100vh) - var(--header-height) - var(--footer-height));
+  height: 100%;
+}
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 ._PagesWrapperInner_1c9ty_90 {
+  height: 100%;
+}
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 ._PagesWrapperInner_1c9ty_90 > .xmlui-page-root {
+  height: 100%;
+}
+._wrapper_1c9ty_13._verticalConstrained_1c9ty_102 ._footerWrapper_1c9ty_41 {
+  position: sticky;
+  left: 0;
+  right: 0;
+  bottom: 0;
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135 {
   scrollbar-gutter: stable both-edges;
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102 ._headerWrapper_qcc08_105 {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135 ._headerWrapper_1c9ty_138 {
   margin-inline: calc(-1 * var(--scrollbar-width));
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102 ._headerWrapper_qcc08_105 > div {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135 ._headerWrapper_1c9ty_138 > div {
   padding-inline: var(--scrollbar-width);
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102 ._footerWrapper_qcc08_41 {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135 ._footerWrapper_1c9ty_41 {
   margin-inline: calc(-1 * var(--scrollbar-width));
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102 ._footerWrapper_qcc08_41 > div {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135 ._footerWrapper_1c9ty_41 > div {
   padding-inline: var(--scrollbar-width);
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102._verticalFullHeader_qcc08_73 {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalFullHeader_1c9ty_73 {
   scroll-padding-top: var(--header-height);
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102._verticalFullHeader_qcc08_73 ._content_qcc08_27 {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalFullHeader_1c9ty_73 ._content_1c9ty_27 {
   margin-inline: calc(-1 * var(--scrollbar-width));
 }
-._wrapper_qcc08_13._scrollWholePage_qcc08_102._verticalFullHeader_qcc08_73 ._contentWrapper_qcc08_27 {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalFullHeader_1c9ty_73 ._contentWrapper_1c9ty_27 {
   padding-inline: var(--scrollbar-width);
 }
-._wrapper_qcc08_13:not(._scrollWholePage_qcc08_102) {
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalConstrained_1c9ty_102 {
+  scroll-padding-top: var(--header-height);
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalConstrained_1c9ty_102 ._content_1c9ty_27 {
+  width: var(--xmlui-maxWidth-App);
+  margin-inline: calc(-1 * var(--scrollbar-width));
+  margin: auto;
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalConstrained_1c9ty_102 ._contentWrapper_1c9ty_27 {
+  padding-inline: var(--scrollbar-width);
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalConstrained_1c9ty_102 ._headerWrapper_1c9ty_138 > div {
+  width: var(--xmlui-maxWidth-App);
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalConstrained_1c9ty_102 ._footerWrapper_1c9ty_41 {
+  margin-inline: calc(-1 * var(--scrollbar-width));
+}
+._wrapper_1c9ty_13._scrollWholePage_1c9ty_135._verticalConstrained_1c9ty_102 ._footerWrapper_1c9ty_41 > div {
+  padding-inline: var(--scrollbar-width);
+}
+._wrapper_1c9ty_13:not(._scrollWholePage_1c9ty_135) {
   overflow: hidden;
 }
-._wrapper_qcc08_13:not(._scrollWholePage_qcc08_102) ._content_qcc08_27 {
+._wrapper_1c9ty_13:not(._scrollWholePage_1c9ty_135) ._content_1c9ty_27 {
   min-height: 0;
   height: 100%;
 }
-._wrapper_qcc08_13:not(._scrollWholePage_qcc08_102) ._contentWrapper_qcc08_27 {
+._wrapper_1c9ty_13:not(._scrollWholePage_1c9ty_135) ._contentWrapper_1c9ty_27 {
   overflow: initial;
 }
-._wrapper_qcc08_13:not(._scrollWholePage_qcc08_102) ._PagesWrapper_qcc08_37 {
+._wrapper_1c9ty_13:not(._scrollWholePage_1c9ty_135) ._PagesWrapper_1c9ty_37 {
   overflow: auto;
   scroll-padding-block: var(--xmlui-scroll-padding-block-Pages);
   min-height: 0;
   height: 100%;
   scrollbar-gutter: stable both-edges;
 }
-._wrapper_qcc08_13:not(._scrollWholePage_qcc08_102) ._PagesWrapperInner_qcc08_90 {
+._wrapper_1c9ty_13:not(._scrollWholePage_1c9ty_135) ._PagesWrapperInner_1c9ty_90 {
   min-height: 100%;
   height: 0;
 }
-._wrapper_qcc08_13._noScrollbarGutters_qcc08_147 {
+._wrapper_1c9ty_13._noScrollbarGutters_1c9ty_200 {
   scrollbar-gutter: auto;
 }
-._wrapper_qcc08_13._noScrollbarGutters_qcc08_147 ._PagesWrapper_qcc08_37 {
+._wrapper_1c9ty_13._noScrollbarGutters_1c9ty_200 ._PagesWrapper_1c9ty_37 {
   scrollbar-gutter: auto;
 }
 
-._headerWrapper_qcc08_105 {
+._headerWrapper_1c9ty_138 {
   z-index: 1;
   min-height: 0;
   flex-shrink: 0;
@@ -1135,17 +1188,17 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
   box-shadow: var(--xmlui-boxShadow-header-App);
   background-color: var(--xmlui-backgroundColor-AppHeader);
 }
-._headerWrapper_qcc08_105._sticky_qcc08_44 {
+._headerWrapper_1c9ty_138._sticky_1c9ty_44 {
   position: sticky;
 }
 
-._content_qcc08_27 {
+._content_1c9ty_27 {
   display: flex;
   flex-direction: row;
   isolation: isolate;
 }
 
-._contentWrapper_qcc08_27 {
+._contentWrapper_1c9ty_27 {
   position: relative;
   min-width: 0;
   flex: 1;
@@ -1156,21 +1209,21 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
   border-left: var(--xmlui-borderLeft-content-App);
 }
 
-._navPanelWrapper_qcc08_33 {
+._navPanelWrapper_1c9ty_33 {
   display: flex;
   position: sticky;
   top: 0;
 }
-._navPanelWrapper_qcc08_33:empty {
+._navPanelWrapper_1c9ty_33:empty {
   display: none;
 }
 
-._PagesWrapper_qcc08_37 {
+._PagesWrapper_1c9ty_37 {
   flex: 1;
   isolation: isolate;
 }
 
-._PagesWrapperInner_qcc08_90 {
+._PagesWrapperInner_1c9ty_90 {
   --page-padding-left: var(--xmlui-space-4);
   --page-padding-right: var(--xmlui-space-4);
   --page-padding-top: var(--xmlui-space-5);
@@ -1188,7 +1241,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
   display: flex;
   flex-direction: column;
 }
-._PagesWrapperInner_qcc08_90 > .xmlui-page-root {
+._PagesWrapperInner_1c9ty_90 > .xmlui-page-root {
   padding-top: var(--page-padding-top-override, var(--page-padding-top));
   padding-bottom: var(--page-padding-bottom-override, var(--page-padding-bottom));
   padding-right: var(--page-padding-right-override, var(--page-padding-right));
@@ -1200,7 +1253,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
   margin-right: calc(-1 * var(--page-padding-right));
 }
 
-._footerWrapper_qcc08_41 {
+._footerWrapper_1c9ty_41 {
   flex-shrink: 0;
 }/*
  * This file contains all CSS variables AppEngine uses for styling the UI, including individual visual components.
@@ -15931,7 +15984,7 @@ li .htmlOl {
       });
     }
   }
-  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.16 (built 4/24/2025)" };
+  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.17 (built 4/24/2025)" };
   class Mutation extends Removable {
     constructor(config) {
       super();
@@ -32293,21 +32346,23 @@ ${error2.errorObject}`;
     }, r2;
   }(reactExports.Component);
   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";
-  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)"}'`;
-  const wrapper$e = "_wrapper_qcc08_13";
-  const vertical$4 = "_vertical_qcc08_23";
-  const contentWrapper$1 = "_contentWrapper_qcc08_27";
-  const navPanelWrapper = "_navPanelWrapper_qcc08_33";
-  const PagesWrapper = "_PagesWrapper_qcc08_37";
-  const footerWrapper = "_footerWrapper_qcc08_41";
-  const sticky = "_sticky_qcc08_44";
-  const horizontal$5 = "_horizontal_qcc08_51";
-  const verticalFullHeader = "_verticalFullHeader_qcc08_73";
-  const PagesWrapperInner = "_PagesWrapperInner_qcc08_90";
-  const scrollWholePage = "_scrollWholePage_qcc08_102";
-  const headerWrapper$1 = "_headerWrapper_qcc08_105";
-  const content$4 = "_content_qcc08_27";
-  const noScrollbarGutters = "_noScrollbarGutters_qcc08_147";
+  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)", "maxWidth-App": "var(--xmlui-maxWidth-App)", "backgroundColor-AppHeader": "var(--xmlui-backgroundColor-AppHeader)", "borderBottom-AppHeader": "var(--xmlui-borderBottom-AppHeader)", "scroll-padding-block-Pages": "var(--xmlui-scroll-padding-block-Pages)"}'`;
+  const wrapper$e = "_wrapper_1c9ty_13";
+  const vertical$4 = "_vertical_1c9ty_23";
+  const contentWrapper$1 = "_contentWrapper_1c9ty_27";
+  const navPanelWrapper = "_navPanelWrapper_1c9ty_33";
+  const PagesWrapper = "_PagesWrapper_1c9ty_37";
+  const footerWrapper = "_footerWrapper_1c9ty_41";
+  const sticky = "_sticky_1c9ty_44";
+  const horizontal$5 = "_horizontal_1c9ty_51";
+  const verticalFullHeader = "_verticalFullHeader_1c9ty_73";
+  const PagesWrapperInner = "_PagesWrapperInner_1c9ty_90";
+  const verticalConstrained = "_verticalConstrained_1c9ty_102";
+  const header$2 = "_header_1c9ty_108";
+  const scrollWholePage = "_scrollWholePage_1c9ty_135";
+  const headerWrapper$1 = "_headerWrapper_1c9ty_138";
+  const content$4 = "_content_1c9ty_27";
+  const noScrollbarGutters = "_noScrollbarGutters_1c9ty_200";
   const styles$Y = {
     themeVars: themeVars$J,
     wrapper: wrapper$e,
@@ -32320,6 +32375,8 @@ ${error2.errorObject}`;
     horizontal: horizontal$5,
     verticalFullHeader,
     PagesWrapperInner,
+    verticalConstrained,
+    header: header$2,
     scrollWholePage,
     headerWrapper: headerWrapper$1,
     content: content$4,
@@ -35488,6 +35545,31 @@ ${error2.errorObject}`;
           }
         );
         break;
+      case "vertical-constrained-width":
+        content2 = /* @__PURE__ */ jsxRuntimeExports.jsxs(
+          "div",
+          {
+            className: classNames(wrapperBaseClasses, styles$Y.verticalConstrained),
+            style: styleWithHelpers,
+            ref: scrollPageContainerRef,
+            children: [
+              /* @__PURE__ */ jsxRuntimeExports.jsx(
+                "header",
+                {
+                  className: classNames(styles$Y.headerWrapper, styles$Y.sticky),
+                  ref: headerRefCallback,
+                  children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$Y.header, style: { paddingInline: 0 }, children: header2 })
+                }
+              ),
+              /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$Y.content, children: [
+                navPanelVisible && /* @__PURE__ */ jsxRuntimeExports.jsx("aside", { className: styles$Y.navPanelWrapper, children: navPanel }),
+                /* @__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 }) }) }) })
+              ] }),
+              /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: styles$Y.footerWrapper, ref: footerRefCallback, children: footer2 })
+            ]
+          }
+        );
+        break;
       case "condensed":
       case "condensed-sticky":
         content2 = /* @__PURE__ */ jsxRuntimeExports.jsxs(
@@ -35578,6 +35660,7 @@ ${error2.errorObject}`;
       case "vertical":
       case "vertical-sticky":
       case "vertical-full-header":
+      case "vertical-constrained-width":
         return "vertical";
       default:
         return "horizontal";
@@ -143884,7 +143967,7 @@ For more information, see https://radix-ui.com/primitives/docs/components/${titl
       /* @__PURE__ */ jsxRuntimeExports.jsx("svg", { style: { display: "none" }, ref: spriteRootRef })
     ] });
   }
-  const version = "0.9.16";
+  const version = "0.9.17";
   const ApiInterceptorContext = reactExports.createContext(null);
   function useApiInterceptorContext() {
     return reactExports.useContext(ApiInterceptorContext);
@@ -148865,7 +148948,7 @@ For more information, see https://radix-ui.com/primitives/docs/components/${titl
     ToneChangerButton: ToneChangerButtonMd,
     Tree: TreeMd
   };
-  var define_process_env_default$2 = { VITE_XMLUI_VERSION: "0.9.16 (built 4/24/2025)" };
+  var define_process_env_default$2 = { VITE_XMLUI_VERSION: "0.9.17 (built 4/24/2025)" };
   const MAIN_FILE = "Main." + componentFileExtension;
   const MAIN_CODE_BEHIND_FILE = "Main." + codeBehindFileExtension;
   const CONFIG_FILE = "config.json";
@@ -153303,7 +153386,7 @@ For more information, see https://radix-ui.com/primitives/docs/components/${titl
   function isResponseWithoutBody(status) {
     return RESPONSE_STATUS_CODES_WITHOUT_BODY.has(status);
   }
-  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.16 (built 4/24/2025)" };
+  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.17 (built 4/24/2025)" };
   var __defProp$7 = Object.defineProperty;
   var __export = (target2, all2) => {
     for (var name2 in all2)

package/dist/xmlui.mjs

@@ -1,4 +1,4 @@
-import { A, B, E, I, i, h, S, b, k, l, c, e, f, j, p, s, t, n, q, v, u } from "./index-BjVxVHb3.mjs";
+import { A, B, E, I, i, h, S, b, k, l, c, e, f, j, p, s, t, n, q, v, u } from "./index-B6kr6jsm.mjs";
 export {
   A as AppRoot,
   B as Button,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xmlui",
-  "version": "0.9.16",
+  "version": "0.9.17",
   "sideEffects": false,
   "scripts": {
     "start-test-bed": "cd src/testing/infrastructure && xmlui start",