@antelopejs/dms 0.4.8 → 0.5.0

package/dist/test/unit/utils/owned-registry.test.js

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const modules_1 = require("@antelopejs/interface-core/modules");
+const owned_registry_1 = require("@antelopejs/interface-dms/utils/owned-registry");
+const chai_1 = require("chai");
+function generation(module, index) {
+    return { module, owner: `${module}#${index}` };
+}
+function addAs(context, registry, value) {
+    (0, modules_1.RunWithModuleContext)(context, () => registry.add(value));
+}
+function destroy(context) {
+    (0, modules_1.RunWithModuleContext)(context, () => {
+        modules_1.Events.ModuleDestroyed.emit(context.module);
+    });
+}
+describe("[unit] utils/owned-registry", () => {
+    it("releases what a generation added when it is destroyed, and only that", () => {
+        const registry = new owned_registry_1.OwnedRegistry();
+        const reloaded = generation("owned-registry-reloaded", 1);
+        const other = generation("owned-registry-other", 1);
+        addAs(reloaded, registry, "reloaded");
+        addAs(other, registry, "other");
+        destroy(reloaded);
+        (0, chai_1.expect)(registry.values()).to.deep.equal(["other"]);
+        destroy(other);
+        (0, chai_1.expect)(registry.values()).to.deep.equal([]);
+    });
+    it("keeps what the next generation of the same module adds", () => {
+        const registry = new owned_registry_1.OwnedRegistry();
+        const first = generation("owned-registry-next", 1);
+        const next = generation("owned-registry-next", 2);
+        addAs(first, registry, "first");
+        destroy(first);
+        addAs(next, registry, "next");
+        (0, chai_1.expect)(registry.values()).to.deep.equal(["next"]);
+        destroy(next);
+    });
+    it("lists the live values in the order they were added", () => {
+        const registry = new owned_registry_1.OwnedRegistry();
+        const owner = generation("owned-registry-order", 1);
+        for (const value of ["first", "second", "third"]) {
+            addAs(owner, registry, value);
+        }
+        (0, chai_1.expect)(registry.values()).to.deep.equal(["first", "second", "third"]);
+        destroy(owner);
+    });
+    it("removes only the oldest registration a matcher accepts", () => {
+        const registry = new owned_registry_1.OwnedRegistry();
+        const owner = generation("owned-registry-remove", 1);
+        for (const value of ["twice", "once", "twice"]) {
+            addAs(owner, registry, value);
+        }
+        registry.remove((value) => value === "twice");
+        (0, chai_1.expect)(registry.values()).to.deep.equal(["once", "twice"]);
+        (0, chai_1.expect)(registry.has((value) => value === "once")).to.equal(true);
+        (0, chai_1.expect)(registry.has((value) => value === "never")).to.equal(false);
+        destroy(owner);
+    });
+});
+//# sourceMappingURL=owned-registry.test.js.map

package/dist/test/unit/utils/owned-registry.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"owned-registry.test.js","sourceRoot":"","sources":["../../../../src/test/unit/utils/owned-registry.test.ts"],"names":[],"mappings":";;AAAA,gEAI4C;AAC5C,mFAA+E;AAC/E,+BAA8B;AAE9B,SAAS,UAAU,CAAC,MAAc,EAAE,KAAa;IAC/C,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,MAAM,IAAI,KAAK,EAAE,EAAE,CAAC;AACjD,CAAC;AAED,SAAS,KAAK,CACZ,OAA+B,EAC/B,QAA0B,EAC1B,KAAQ;IAER,IAAA,8BAAoB,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC;AAC3D,CAAC;AAID,SAAS,OAAO,CAAC,OAA+B;IAC9C,IAAA,8BAAoB,EAAC,OAAO,EAAE,GAAG,EAAE;QACjC,gBAAM,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;IAC9C,CAAC,CAAC,CAAC;AACL,CAAC;AAED,QAAQ,CAAC,6BAA6B,EAAE,GAAG,EAAE;IAC3C,EAAE,CAAC,sEAAsE,EAAE,GAAG,EAAE;QAC9E,MAAM,QAAQ,GAAG,IAAI,8BAAa,EAAU,CAAC;QAC7C,MAAM,QAAQ,GAAG,UAAU,CAAC,yBAAyB,EAAE,CAAC,CAAC,CAAC;QAC1D,MAAM,KAAK,GAAG,UAAU,CAAC,sBAAsB,EAAE,CAAC,CAAC,CAAC;QACpD,KAAK,CAAC,QAAQ,EAAE,QAAQ,EAAE,UAAU,CAAC,CAAC;QACtC,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC;QAEhC,OAAO,CAAC,QAAQ,CAAC,CAAC;QAClB,IAAA,aAAM,EAAC,QAAQ,CAAC,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC;QAEnD,OAAO,CAAC,KAAK,CAAC,CAAC;QACf,IAAA,aAAM,EAAC,QAAQ,CAAC,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IAC9C,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,wDAAwD,EAAE,GAAG,EAAE;QAChE,MAAM,QAAQ,GAAG,IAAI,8BAAa,EAAU,CAAC;QAC7C,MAAM,KAAK,GAAG,UAAU,CAAC,qBAAqB,EAAE,CAAC,CAAC,CAAC;QACnD,MAAM,IAAI,GAAG,UAAU,CAAC,qBAAqB,EAAE,CAAC,CAAC,CAAC;QAClD,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC;QAChC,OAAO,CAAC,KAAK,CAAC,CAAC;QAEf,KAAK,CAAC,IAAI,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAC;QAE9B,IAAA,aAAM,EAAC,QAAQ,CAAC,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;QAClD,OAAO,CAAC,IAAI,CAAC,CAAC;IAChB,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,oDAAoD,EAAE,GAAG,EAAE;QAC5D,MAAM,QAAQ,GAAG,IAAI,8BAAa,EAAU,CAAC;QAC7C,MAAM,KAAK,GAAG,UAAU,CAAC,sBAAsB,EAAE,CAAC,CAAC,CAAC;QACpD,KAAK,MAAM,KAAK,IAAI,CAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,CAAC,EAAE,CAAC;YACjD,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC;QAChC,CAAC;QAED,IAAA,aAAM,EAAC,QAAQ,CAAC,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,OAAO,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC;QACtE,OAAO,CAAC,KAAK,CAAC,CAAC;IACjB,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,wDAAwD,EAAE,GAAG,EAAE;QAChE,MAAM,QAAQ,GAAG,IAAI,8BAAa,EAAU,CAAC;QAC7C,MAAM,KAAK,GAAG,UAAU,CAAC,uBAAuB,EAAE,CAAC,CAAC,CAAC;QACrD,KAAK,MAAM,KAAK,IAAI,CAAC,OAAO,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,CAAC;YAC/C,KAAK,CAAC,KAAK,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC;QAChC,CAAC;QAED,QAAQ,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,KAAK,OAAO,CAAC,CAAC;QAE9C,IAAA,aAAM,EAAC,QAAQ,CAAC,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;QAC3D,IAAA,aAAM,EAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QACjE,IAAA,aAAM,EAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QACnE,OAAO,CAAC,KAAK,CAAC,CAAC;IACjB,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}

package/dist/validation/auth.schema.d.ts

@@ -42,14 +42,14 @@ export declare const authSchema: {
         code: string;
         state: string;
         state_cookie: string;
-        invite?: string | undefined;
         language?: string | undefined;
+        invite?: string | undefined;
     }, {
         code: string;
         state: string;
         state_cookie: string;
-        invite?: string | undefined;
         language?: string | undefined;
+        invite?: string | undefined;
     }>;
     refresh: z.ZodObject<{
         token: z.ZodString;

package/frontend-vue/layers/dms-layout/app/composables/layout/usePageFillHeight.ts

@@ -0,0 +1,37 @@
+import type { InjectionKey, Ref } from "vue";
+
+const PAGE_FILL_HEIGHT_KEY: InjectionKey<Readonly<Ref<boolean>>> = Symbol(
+  "dms:page-fill-height",
+);
+
+/**
+ * The flex column a page filling the panel (`DefaultLayout({ fillHeight })`)
+ * is laid out in, from the scrolling panel body down to the component that
+ * takes the height left.
+ */
+export const PAGE_FILL_HEIGHT_CLASSES = {
+  /**
+   * The page region, the panel body's only child. The minimum height sits
+   * here rather than on the component that fills: a floor set lower down
+   * overflows this region, and the panel then scrolls past its own bottom
+   * padding.
+   */
+  region: "flex min-h-[30rem] flex-1 flex-col",
+  /** The page stack, and the component wrapper that takes the height left. */
+  column: "flex min-h-0 flex-1 flex-col",
+} as const;
+
+/**
+ * Lets the page rendered in a layout's slot know whether the layout gives it
+ * the height of the panel.
+ */
+export const providePageFillHeight = (fillHeight: Readonly<Ref<boolean>>) => {
+  provide(PAGE_FILL_HEIGHT_KEY, fillHeight);
+};
+
+/**
+ * Whether the layout rendering the page asked it to fill the panel height.
+ * `false` under a layout that does not provide it.
+ */
+export const usePageFillHeight = (): Readonly<Ref<boolean>> =>
+  inject(PAGE_FILL_HEIGHT_KEY, () => ref(false), true);

package/frontend-vue/layers/dms-layout/app/custom-layouts/DefaultLayout.vue

@@ -8,6 +8,7 @@ import DashboardBanners from "../build/components/layout/DashboardBanners.vue";
 interface Props {
   fullWidth?: boolean;
   hideHeader?: boolean;
+  fillHeight?: boolean;
   icon?: string;
   title?: string;
   description?: string;
@@ -16,10 +17,17 @@ interface Props {
 const props = withDefaults(defineProps<Props>(), {
   fullWidth: true,
   hideHeader: false,
+  fillHeight: false,
   icon: "i-ph-file",
   title: undefined,
   description: undefined,
 });
+
+providePageFillHeight(toRef(props, "fillHeight"));
+
+const regionClass = computed(() =>
+  props.fillHeight ? PAGE_FILL_HEIGHT_CLASSES.region : undefined,
+);
 </script>
 
 <template>
@@ -37,6 +45,7 @@ const props = withDefaults(defineProps<Props>(), {
           data-dms-page-region
           data-dms-page-content
           :full-width="props.fullWidth"
+          :class="regionClass"
         >
           <PageHeader
             v-if="props.title && !props.hideHeader"

package/frontend-vue/layers/dms-layout/app/pages/[...slug].vue

@@ -339,6 +339,17 @@ const components = computed(() =>
   }),
 );
 
+// A page filling the panel (`DefaultLayout({ fillHeight })`) gives the height
+// left under its header to its last component; the ones above it keep theirs.
+const fillHeight = usePageFillHeight();
+const fillColumnClass = PAGE_FILL_HEIGHT_CLASSES.column;
+const stackClass = computed(() =>
+  fillHeight.value ? fillColumnClass : undefined,
+);
+const fillingComponentId = computed(() =>
+  fillHeight.value ? components.value.at(-1)?.id : undefined,
+);
+
 // --- Live-edit highlight ---------------------------------------------------
 // When the active page's layout changes in place (DMS dev hot-reload, same
 // route), animate the components that changed. Added/removed components are
@@ -457,12 +468,16 @@ if (import.meta.env.DEV) {
     tag="div"
     name="dms-fresh"
     class="dms-page-stack space-y-6"
+    :class="stackClass"
     :css="animateLayout"
   >
     <div
       v-for="component in components"
       :key="component.id"
-      :class="{ 'dms-fresh-modified': freshComponentIds.has(component.id) }"
+      :class="[
+        { 'dms-fresh-modified': freshComponentIds.has(component.id) },
+        component.id === fillingComponentId && fillColumnClass,
+      ]"
     >
       <DmsRecursiveComponent
         :component="component"

package/frontend-vue/package.json

@@ -10,6 +10,9 @@
   },
   "license": "Apache-2.0",
   "packageManager": "pnpm@10.6.5",
+  "engines": {
+    "@antelopejs/dms-frontend": ">=0.3.1 <0.4.0"
+  },
   "scripts": {
     "typecheck": "ajs dms verify-source --layer \"$PWD\" --local-package @antelopejs/dms=.. --local-package @antelopejs/interface-dms=../../interface-dms",
     "test": "vitest run",
@@ -58,7 +61,7 @@
     "zod": "^3.24.2"
   },
   "devDependencies": {
-    "@antelopejs/core": ">=1.9.1 <2",
+    "@antelopejs/core": ">=1.10.1 <2",
     "@antelopejs/dms-frontend": ">=0.3.2 <1.0.0",
     "@eslint/js": "^8.57.0",
     "@inertiajs/vue3": "^3.7.0",

package/frontend-vue/pnpm-lock.yaml

@@ -121,11 +121,11 @@ importers:
         version: 3.25.76
     devDependencies:
       '@antelopejs/core':
-        specifier: '>=1.9.1 <2'
-        version: 1.9.1(@types/node@24.8.1)
+        specifier: '>=1.10.1 <2'
+        version: 1.10.1(@types/node@24.8.1)
       '@antelopejs/dms-frontend':
         specifier: '>=0.3.2 <1.0.0'
-        version: 0.3.2(@antelopejs/core@1.9.1(@types/node@24.8.1))
+        version: 0.3.2(@antelopejs/core@1.10.1(@types/node@24.8.1))
       '@eslint/js':
         specifier: ^8.57.0
         version: 8.57.0
@@ -196,8 +196,8 @@ packages:
     resolution: {integrity: sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==}
     engines: {node: '>=10'}
 
-  '@antelopejs/core@1.9.1':
-    resolution: {integrity: sha512-MPLJak0rPluV4lgsdsO5ba03sgTxIGSncajBcoaoppuppQmksdpaemojIHiVLJ4LiG0iiH21Roaed8XXy1XkYQ==}
+  '@antelopejs/core@1.10.1':
+    resolution: {integrity: sha512-NcC6N8Aq14Ph7GRto0lpdRdgUKZAu3ZHDlAF5hXGFZPKKoNm8Da9i4nyB/NI4Sgx3rbE0/KoqCcHpTtQJgrAYg==}
     hasBin: true
 
   '@antelopejs/dms-frontend@0.3.2':
@@ -4312,7 +4312,7 @@ snapshots:
 
   '@alloc/quick-lru@5.2.0': {}
 
-  '@antelopejs/core@1.9.1(@types/node@24.8.1)':
+  '@antelopejs/core@1.10.1(@types/node@24.8.1)':
     dependencies:
       '@antelopejs/interface-core': 0.1.1
       '@types/proper-lockfile': 4.1.4
@@ -4331,7 +4331,7 @@ snapshots:
     transitivePeerDependencies:
       - '@types/node'
 
-  '@antelopejs/dms-frontend@0.3.2(@antelopejs/core@1.9.1(@types/node@24.8.1))':
+  '@antelopejs/dms-frontend@0.3.2(@antelopejs/core@1.10.1(@types/node@24.8.1))':
     dependencies:
       boxen: 5.1.2
       chalk: 4.1.2
@@ -4342,7 +4342,7 @@ snapshots:
       semver: 7.8.5
       unzipper: 0.12.5
     optionalDependencies:
-      '@antelopejs/core': 1.9.1(@types/node@24.8.1)
+      '@antelopejs/core': 1.10.1(@types/node@24.8.1)
       '@oxc-parser/binding-darwin-arm64': 0.95.0
       '@oxc-parser/binding-darwin-x64': 0.95.0
       '@oxc-parser/binding-linux-arm64-gnu': 0.95.0

package/frontend-vue/tests/page-fill-height.test.ts

@@ -0,0 +1,352 @@
+// @vitest-environment jsdom
+import {
+  computed,
+  createApp,
+  createSSRApp,
+  h,
+  inject,
+  nextTick,
+  onMounted,
+  onUnmounted,
+  provide,
+  reactive,
+  ref,
+  Suspense,
+  toRef,
+  watch,
+  type App,
+  type Component,
+  type FunctionalComponent,
+} from "vue";
+import { renderToString } from "vue/server-renderer";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import DefaultLayout from "../layers/dms-layout/app/custom-layouts/DefaultLayout.vue";
+import CatchAllPage from "../layers/dms-layout/app/pages/[...slug].vue";
+import {
+  PAGE_FILL_HEIGHT_CLASSES,
+  providePageFillHeight,
+  usePageFillHeight,
+} from "../layers/dms-layout/app/composables/layout/usePageFillHeight";
+
+vi.mock(
+  "../layers/dms-layout/app/build/components/layout/DashboardSidebar.vue",
+  () => ({ default: () => null }),
+);
+vi.mock(
+  "../layers/dms-layout/app/build/components/layout/DashboardHeader.vue",
+  () => ({ default: () => null }),
+);
+vi.mock(
+  "../layers/dms-layout/app/build/components/layout/DashboardBanners.vue",
+  () => ({ default: () => null }),
+);
+
+interface PageLayoutFixture {
+  components: Record<string, { componentName: string }>;
+}
+
+const route = reactive({ path: "/tools/explorer", query: {} });
+const pageLayout = ref<PageLayoutFixture | null>(null);
+
+// The markup `DefaultLayout` and `pages/[...slug].vue` rendered for a
+// two-component page before `fillHeight` existed, with the stubs below.
+const FLOW_PAGE_MARKUP =
+  "<div data-dms-persistent-shell data-group><!---->" +
+  "<div data-panel><!--[--><!----><!----><!--]-->" +
+  "<div data-body>" +
+  '<div class="w-full max-w-none" data-dms-page-region data-dms-page-content><!--[-->' +
+  '<section class="flex gap-4 items-start pt-6 pb-7">' +
+  '<div class="rounded-lg bg-primary/10 shrink-0 ring ring-primary/20 flex items-center justify-center size-12"><i class="text-primary"></i></div>' +
+  '<div class="flex-1 min-w-0">' +
+  '<h1 class="text-highlighted text-[22px] font-semibold leading-tight tracking-tight"><!--[-->Explorer<!--]--></h1><!--v-if--></div><!--[--><!--]--></section><!--[-->' +
+  '<div class="dms-page-stack space-y-6">' +
+  '<div class="">' +
+  '<section data-component="stats" page-id="tools.explorer"></section></div>' +
+  '<div class="">' +
+  '<section data-component="explorer" page-id="tools.explorer"></section></div></div><!--]--><!--]--></div></div><!--[--><!----><!--]--></div></div>';
+
+function withComponents(...ids: string[]): PageLayoutFixture {
+  return {
+    components: Object.fromEntries(
+      ids.map((id) => [id, { componentName: `tool-${id}` }]),
+    ),
+  };
+}
+
+// Functional stubs hand non-class attributes on only when told to: these two
+// spread them, so the markers the layout sets stay in the markup.
+const Group: FunctionalComponent = (_, { attrs, slots }) =>
+  h("div", { ...attrs, "data-group": "" }, slots.default?.());
+Group.inheritAttrs = false;
+
+const Panel: FunctionalComponent = (_, { slots }) =>
+  h("div", { "data-panel": "" }, [
+    slots.header?.(),
+    h("div", { "data-body": "" }, slots.body?.()),
+    slots.footer?.(),
+  ]);
+
+// Nuxt UI merges its container classes with the ones it is given; the stub
+// keeps the given ones next to one of its own, so a lost class shows.
+const Container: FunctionalComponent = (_, { attrs, slots }) =>
+  h("div", { ...attrs, class: ["w-full", attrs.class] }, slots.default?.());
+Container.inheritAttrs = false;
+
+const PageComponent: FunctionalComponent<{ componentId: string }> = (props) =>
+  h("section", { "data-component": props.componentId });
+PageComponent.props = ["componentId"];
+
+const FillHeightProbe: FunctionalComponent = () =>
+  h("output", String(usePageFillHeight().value));
+
+function installRuntime(): void {
+  const runtime: Record<string, unknown> = {
+    computed,
+    inject,
+    onMounted,
+    onUnmounted,
+    provide,
+    ref,
+    toRef,
+    watch,
+    HTTP_FORBIDDEN: 403,
+    HTTP_INTERNAL_SERVER_ERROR: 500,
+    HTTP_NOT_FOUND: 404,
+    PAGE_FILL_HEIGHT_CLASSES,
+    providePageFillHeight,
+    usePageFillHeight,
+    createError: vi.fn(),
+    defineDmsPageMeta: vi.fn(),
+    firstAccessiblePagePath: vi.fn(),
+    navigateDms: vi.fn(),
+    preloadPageLayoutComponents: vi.fn(),
+    providePageRealtime: vi.fn(),
+    resolveDmsComponent: () => "div",
+    runCustomValidation: vi.fn(),
+    showError: vi.fn(),
+    validateRequiredQueryParams: vi.fn(),
+    useDefinedFunctions: () => ({ getFunction: () => undefined }),
+    useDevReloading: () => ref(false),
+    useDmsRoute: () => route,
+    useHomepage: () => "/",
+    usePageLayout: async () => ({ pageLayout }),
+    usePageRealtime: () => ({}),
+    usePermissions: () => ({
+      permissions: ref([]),
+      refreshIfStale: async () => {},
+    }),
+    useSessionRecovery: () => ({
+      loggedIn: ref(true),
+      reconcileSession: async () => {},
+      redirectToAuth: async () => {},
+    }),
+    useSiteLayout: () => ({
+      siteLayout: ref({ pages: {} }),
+      siteLayoutTree: ref([]),
+      loadingError: ref(null),
+      loadSiteLayout: async () => {},
+      refresh: async () => {},
+      refreshIfStale: async () => {},
+      findMatchingRoute: () => ({
+        metadata: { fullId: "tools.explorer", hasAccess: true },
+        params: {},
+      }),
+    }),
+    useTranslation: () => ({ processI18n: (value: string) => value }),
+  };
+  Object.entries(runtime).forEach(([name, value]) =>
+    vi.stubGlobal(name, value),
+  );
+}
+
+function withStubs(app: App): App {
+  app.component("UDashboardGroup", Group);
+  app.component("UDashboardPanel", Panel);
+  app.component("UContainer", Container);
+  app.component("UIcon", () => h("i"));
+  app.component("DmsAppWidgetsDock", () => null);
+  app.component("DmsRecursiveComponent", PageComponent);
+  return app;
+}
+
+function renderInLayout(
+  layoutProps: Record<string, unknown>,
+  page: Component,
+): Promise<string> {
+  const root = () =>
+    h(
+      DefaultLayout,
+      { title: "Explorer", ...layoutProps },
+      { default: () => h(page) },
+    );
+  return renderToString(withStubs(createSSRApp(root)));
+}
+
+function parse(markup: string): HTMLElement {
+  const host = document.createElement("div");
+  host.innerHTML = markup;
+  return host;
+}
+
+function classesOf(element: Element | null | undefined): string[] {
+  return element?.getAttribute("class")?.split(" ").filter(Boolean) ?? [];
+}
+
+function expectClasses(element: Element | null | undefined, classes: string) {
+  expect(classesOf(element)).toEqual(
+    expect.arrayContaining(classes.split(" ")),
+  );
+}
+
+function expectNoFillClasses(element: Element | null | undefined) {
+  const fillClasses = new Set(
+    `${PAGE_FILL_HEIGHT_CLASSES.region} ${PAGE_FILL_HEIGHT_CLASSES.column}`.split(
+      " ",
+    ),
+  );
+  expect(classesOf(element).filter((name) => fillClasses.has(name))).toEqual(
+    [],
+  );
+}
+
+beforeEach(() => {
+  installRuntime();
+  route.path = "/tools/explorer";
+  pageLayout.value = withComponents("stats", "explorer");
+});
+
+afterEach(() => {
+  vi.unstubAllGlobals();
+});
+
+describe("usePageFillHeight", () => {
+  it("reads false under a layout that does not provide it", async () => {
+    const markup = await renderToString(createSSRApp(FillHeightProbe));
+    expect(markup).toBe("<output>false</output>");
+  });
+
+  it("follows the layout that provides it", async () => {
+    const fillHeight = ref(true);
+    const app = withStubs(
+      createApp(() =>
+        h(
+          DefaultLayout,
+          { fillHeight: fillHeight.value },
+          { default: () => h(FillHeightProbe) },
+        ),
+      ),
+    );
+    const host = document.createElement("div");
+    app.mount(host);
+    expect(host.querySelector("output")?.textContent).toBe("true");
+    fillHeight.value = false;
+    await nextTick();
+    expect(host.querySelector("output")?.textContent).toBe("false");
+    app.unmount();
+  });
+});
+
+describe("DefaultLayout without fillHeight", () => {
+  it("renders the page exactly as it did before the option existed", async () => {
+    expect(await renderInLayout({}, CatchAllPage)).toBe(FLOW_PAGE_MARKUP);
+  });
+
+  it("tells the page it does not fill the panel", async () => {
+    const markup = await renderInLayout({}, FillHeightProbe);
+    expect(parse(markup).querySelector("output")?.textContent).toBe("false");
+  });
+});
+
+describe("DefaultLayout with fillHeight", () => {
+  it("makes the page region a flex column with a minimum height", async () => {
+    const host = parse(
+      await renderInLayout({ fillHeight: true }, CatchAllPage),
+    );
+    const region = host.querySelector("[data-dms-page-content]");
+    expectClasses(region, PAGE_FILL_HEIGHT_CLASSES.region);
+    expectClasses(region, "w-full max-w-none");
+  });
+
+  it("keeps the page header a plain item of that column", async () => {
+    const host = parse(
+      await renderInLayout({ fillHeight: true }, CatchAllPage),
+    );
+    const header = host.querySelector("[data-dms-page-content] > section");
+    expect(classesOf(header)).toEqual([
+      "flex",
+      "gap-4",
+      "items-start",
+      "pt-6",
+      "pb-7",
+    ]);
+  });
+
+  it("gives the height left to the last component only", async () => {
+    const host = parse(
+      await renderInLayout({ fillHeight: true }, CatchAllPage),
+    );
+    const stack = host.querySelector(".dms-page-stack");
+    const [stats, explorer] = Array.from(stack?.children ?? []);
+    expectClasses(
+      stack,
+      `dms-page-stack space-y-6 ${PAGE_FILL_HEIGHT_CLASSES.column}`,
+    );
+    expectNoFillClasses(stats);
+    expectClasses(explorer, PAGE_FILL_HEIGHT_CLASSES.column);
+    expect(
+      explorer
+        ?.querySelector("[data-component]")
+        ?.getAttribute("data-component"),
+    ).toBe("explorer");
+  });
+
+  it("fills with the only component of a single-component page", async () => {
+    pageLayout.value = withComponents("explorer");
+    const host = parse(
+      await renderInLayout({ fillHeight: true }, CatchAllPage),
+    );
+    const wrappers = host.querySelectorAll(".dms-page-stack > div");
+    expect(wrappers).toHaveLength(1);
+    expectClasses(wrappers[0], PAGE_FILL_HEIGHT_CLASSES.column);
+  });
+
+  it("tells a custom page, rendered straight in the slot, to fill", async () => {
+    const markup = await renderInLayout({ fillHeight: true }, FillHeightProbe);
+    expect(parse(markup).querySelector("output")?.textContent).toBe("true");
+  });
+
+  it("drops the fill classes when a navigation lands on a page without the option", async () => {
+    const fillHeight = ref(true);
+    const app = withStubs(
+      createApp(() =>
+        h(
+          DefaultLayout,
+          { title: "Explorer", fillHeight: fillHeight.value },
+          {
+            default: () =>
+              h(Suspense, null, { default: () => h(CatchAllPage) }),
+          },
+        ),
+      ),
+    );
+    const host = document.createElement("div");
+    app.mount(host);
+    await vi.waitFor(() =>
+      expect(host.querySelector(".dms-page-stack")).not.toBeNull(),
+    );
+    expectClasses(
+      host.querySelector(".dms-page-stack"),
+      PAGE_FILL_HEIGHT_CLASSES.column,
+    );
+
+    fillHeight.value = false;
+    await nextTick();
+
+    expectNoFillClasses(host.querySelector("[data-dms-page-content]"));
+    expectNoFillClasses(host.querySelector(".dms-page-stack"));
+    host
+      .querySelectorAll(".dms-page-stack > div")
+      .forEach((wrapper) => expectNoFillClasses(wrapper));
+    app.unmount();
+  });
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antelopejs/dms",
-  "version": "0.4.8",
+  "version": "0.5.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/AntelopeJS/dms.git"
@@ -36,7 +36,7 @@
     "@antelopejs/interface-data-api": ">=0.1.9 <1.0.0",
     "@antelopejs/interface-database": ">=0.1.8 <1.0.0",
     "@antelopejs/interface-database-decorators": ">=0.1.7 <1.0.0",
-    "@antelopejs/interface-dms": ">=0.2.6 <1.0.0",
+    "@antelopejs/interface-dms": ">=0.3.1 <0.4.0",
     "@antelopejs/interface-email": ">=0.0.5 <1.0.0",
     "@antelopejs/interface-file-storage": ">=0.1.3 <1.0.0",
     "archiver": "^7.0.1",
@@ -52,7 +52,7 @@
     "zod": "~3.24.2"
   },
   "devDependencies": {
-    "@antelopejs/core": ">=1.9.1 <2",
+    "@antelopejs/core": ">=1.10.1 <2",
     "@antelopejs/tooling-configs": ">=0.0.6 <1.0.0",
     "@types/archiver": "^6.0.4",
     "@types/chai": "^4.3.20",
@@ -94,7 +94,7 @@
     "@antelopejs/interface-redis": ">=0.0.8 <1.0.0"
   },
   "peerDependencies": {
-    "@antelopejs/core": ">=1.9.1 <2"
+    "@antelopejs/core": ">=1.10.1 <2"
   },
   "peerDependenciesMeta": {
     "@antelopejs/core": {

package/skills/dms-module/REFERENCE.md

@@ -19,7 +19,8 @@ first-party modules follow `dms-<name>` purely for discoverability.
         pages/                      # @RegisterPage classes + category.ts (see dms-pages)
         routes/                     # HTTP controllers feeding the components
         implementations/<name>/index.ts  # implementation of the module's own interface
-      frontend-vue/                 # Vue module: dms.frontend.ts, app/, i18n/locales/
+      frontend-vue/                 # Vue module: dms.frontend.ts, app/, i18n/locales/,
+                                    # package.json (engines: the loader releases it supports)
       package.json / tsconfig.json
     interface-<name>/               # the module's OWN interface, its own published package
       src/index.ts                  # (rare — many modules ship none)

package/skills/dms-module/SKILL.md

@@ -77,6 +77,11 @@ export function destroy(): void { /* deactivate subscriptions */ }
 register — it returns the module's root `CategoryInfo`. `AddFrontendModule` is what surfaces the
 module's frontend; without it the module is backend-only.
 
+`renderer` names the framework (Vue 3), not a loader release. The `@antelopejs/dms-frontend`
+releases the frontend module runs on go in the frontend module's own `package.json`, as
+`"engines": { "@antelopejs/dms-frontend": ">=0.3.2 <0.4.0" }`: the loader refuses the module
+outside that range. Cap it below the next loader minor while the loader is 0.x.
+
 ## Navigation & access — module pages are owner-only
 
 Three constraints are enforced at registration: a page's `category` must **descend from the