@voyantjs/availability-react 0.107.0 → 0.108.0

package/dist/admin/index.d.ts

@@ -41,24 +41,27 @@ export interface CreateAvailabilityAdminExtensionOptions {
  * If the base nav ever drops the availability item, this extension is where
  * the entry moves.
  *
- * ROUTES: contributions are metadata only — the availability pages keep
- * their filter state component-local, so there are no URL search contracts.
- * The PAGES are package-owned: {@link AvailabilityIndexHost} (the slots
- * list + calendar landing page, with bulk update/delete running through
- * the typed batch mutation hooks in `@voyantjs/availability-react`) plus
- * the detail hosts {@link AvailabilitySlotDetailHost},
+ * ROUTES: contributions carry the FULL route implementation (packaged-admin
+ * RFC §4.2/§4.8) — lazy `page` module loaders, data loaders fed by the
+ * host-supplied {@link AdminRouteLoaderContext} (QueryClient + runtime +
+ * params), per-route SSR mode, and pending skeletons. Hosts bind them into
+ * their code-assembled admin route tree; no per-route host files needed.
+ * The pages stay code-split because each contribution's `page` dynamically
+ * imports the specific host/page module — never the admin barrel — so the
+ * heavy page chunks load on navigation, not with workspace chrome.
+ * {@link AvailabilityIndexHost} (the slots list + calendar landing page,
+ * with bulk update/delete running through the typed batch mutation hooks in
+ * `@voyantjs/availability-react`) mounts as a zero-prop page; the detail
+ * hosts {@link AvailabilitySlotDetailHost},
  * {@link AvailabilityRuleDetailHost} and
- * {@link AvailabilityStartTimeDetailHost} bind the operator-grade pages to
- * their data wiring (the shared availability provider context) and resolve
- * every cross-route link through the semantic destinations declared above.
- * `component:` is intentionally NOT attached to these contributions: the
- * contribution contract renders zero-prop pages (route components read
- * params via the router, per RFC §4.2), while the detail hosts take the
- * record id as a prop — host route files stay the thin binding layer
- * (`Route.useParams()` → host props) until the §4.2 code-based route
- * assembly lands. The index host's SSR loader binding stays app-side
- * ({@link ensureAvailabilityPageData} takes the app's cookie-forwarding
- * client), per the packaged-host recipe.
+ * {@link AvailabilityStartTimeDetailHost} read their record id from
+ * `AdminRoutePageProps` via the default-exported wrappers in `./pages/`.
+ * The index host's SSR loader binding is no longer app-side:
+ * {@link ensureAvailabilityPageData} runs in the contribution's own loader
+ * against the host runtime's cookie-forwarding fetcher. The pages keep
+ * their filter state component-local, so there are no URL search contracts,
+ * and every cross-route link resolves through the semantic destinations
+ * declared above.
  *
  * WIDGETS: none. {@link OptionResourceTemplatesPanel} (the per-option
  * resource templates editor the product editor embeds) ships from this

package/dist/admin/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/admin/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAwB,MAAM,iBAAiB,CAAA;AAW3E;;;;;;;GAOG;AACH,OAAO,QAAQ,iBAAiB,CAAC;IAC/B,UAAU,iBAAiB;QACzB,6DAA6D;QAC7D,uBAAuB,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAAA;QAC9C,gDAAgD;QAChD,8BAA8B,EAAE;YAAE,WAAW,EAAE,MAAM,CAAA;SAAE,CAAA;KACxD;CACF;AAKD,OAAO,EAAE,qBAAqB,EAAE,MAAM,8BAA8B,CAAA;AACpE,OAAO,EAAE,0BAA0B,EAAE,MAAM,6BAA6B,CAAA;AACxE,OAAO,EACL,4BAA4B,EAC5B,KAAK,iCAAiC,GACvC,MAAM,sCAAsC,CAAA;AAC7C,OAAO,EACL,0BAA0B,EAC1B,KAAK,+BAA+B,GACrC,MAAM,uBAAuB,CAAA;AAC9B,OAAO,EACL,0BAA0B,EAC1B,KAAK,+BAA+B,GACrC,MAAM,uBAAuB,CAAA;AAC9B,OAAO,EACL,+BAA+B,EAC/B,KAAK,oCAAoC,GAC1C,MAAM,6BAA6B,CAAA;AAEpC,MAAM,WAAW,uCAAuC;IACtD,gGAAgG;IAChG,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,2EAA2E;IAC3E,MAAM,CAAC,EAAE;QACP,YAAY,CAAC,EAAE,MAAM,CAAA;KACtB,CAAA;CACF;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,wBAAgB,gCAAgC,CAC9C,OAAO,GAAE,uCAA4C,GACpD,cAAc,CA6BhB"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/admin/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EAKpB,MAAM,iBAAiB,CAAA;AAoBxB;;;;;;;GAOG;AACH,OAAO,QAAQ,iBAAiB,CAAC;IAC/B,UAAU,iBAAiB;QACzB,6DAA6D;QAC7D,uBAAuB,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAAA;QAC9C,gDAAgD;QAChD,8BAA8B,EAAE;YAAE,WAAW,EAAE,MAAM,CAAA;SAAE,CAAA;KACxD;CACF;AAKD,OAAO,EAAE,qBAAqB,EAAE,MAAM,8BAA8B,CAAA;AACpE,OAAO,EAAE,0BAA0B,EAAE,MAAM,6BAA6B,CAAA;AACxE,OAAO,EACL,4BAA4B,EAC5B,KAAK,iCAAiC,GACvC,MAAM,sCAAsC,CAAA;AAC7C,OAAO,EACL,0BAA0B,EAC1B,KAAK,+BAA+B,GACrC,MAAM,uBAAuB,CAAA;AAC9B,OAAO,EACL,0BAA0B,EAC1B,KAAK,+BAA+B,GACrC,MAAM,uBAAuB,CAAA;AAC9B,OAAO,EACL,+BAA+B,EAC/B,KAAK,oCAAoC,GAC1C,MAAM,6BAA6B,CAAA;AAEpC,MAAM,WAAW,uCAAuC;IACtD,gGAAgG;IAChG,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,2EAA2E;IAC3E,MAAM,CAAC,EAAE;QACP,YAAY,CAAC,EAAE,MAAM,CAAA;KACtB,CAAA;CACF;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,wBAAgB,gCAAgC,CAC9C,OAAO,GAAE,uCAA4C,GACpD,cAAc,CA6EhB"}

package/dist/admin/index.js

@@ -1,4 +1,7 @@
-import { defineAdminExtension } from "@voyantjs/admin";
+import { adminRoutePageModule, defineAdminExtension, } from "@voyantjs/admin";
+import { AvailabilityPageSkeleton, AvailabilityRuleDetailSkeleton, AvailabilitySlotDetailSkeleton, AvailabilityStartTimeDetailSkeleton, } from "../components/availability-skeletons.js";
+import { defaultFetcher } from "../index.js";
+import { ensureAvailabilityPageData } from "./availability-page-data.js";
 // Packaged admin hosts (packaged-admin RFC Phase 3): the operator-grade
 // availability pages bound to their data wiring + semantic-destination
 // navigation. Host route files only bind route params onto these.
@@ -18,24 +21,27 @@ export { AvailabilityStartTimeDetailHost, } from "./start-time-detail-host.js";
  * If the base nav ever drops the availability item, this extension is where
  * the entry moves.
  *
- * ROUTES: contributions are metadata only — the availability pages keep
- * their filter state component-local, so there are no URL search contracts.
- * The PAGES are package-owned: {@link AvailabilityIndexHost} (the slots
- * list + calendar landing page, with bulk update/delete running through
- * the typed batch mutation hooks in `@voyantjs/availability-react`) plus
- * the detail hosts {@link AvailabilitySlotDetailHost},
+ * ROUTES: contributions carry the FULL route implementation (packaged-admin
+ * RFC §4.2/§4.8) — lazy `page` module loaders, data loaders fed by the
+ * host-supplied {@link AdminRouteLoaderContext} (QueryClient + runtime +
+ * params), per-route SSR mode, and pending skeletons. Hosts bind them into
+ * their code-assembled admin route tree; no per-route host files needed.
+ * The pages stay code-split because each contribution's `page` dynamically
+ * imports the specific host/page module — never the admin barrel — so the
+ * heavy page chunks load on navigation, not with workspace chrome.
+ * {@link AvailabilityIndexHost} (the slots list + calendar landing page,
+ * with bulk update/delete running through the typed batch mutation hooks in
+ * `@voyantjs/availability-react`) mounts as a zero-prop page; the detail
+ * hosts {@link AvailabilitySlotDetailHost},
  * {@link AvailabilityRuleDetailHost} and
- * {@link AvailabilityStartTimeDetailHost} bind the operator-grade pages to
- * their data wiring (the shared availability provider context) and resolve
- * every cross-route link through the semantic destinations declared above.
- * `component:` is intentionally NOT attached to these contributions: the
- * contribution contract renders zero-prop pages (route components read
- * params via the router, per RFC §4.2), while the detail hosts take the
- * record id as a prop — host route files stay the thin binding layer
- * (`Route.useParams()` → host props) until the §4.2 code-based route
- * assembly lands. The index host's SSR loader binding stays app-side
- * ({@link ensureAvailabilityPageData} takes the app's cookie-forwarding
- * client), per the packaged-host recipe.
+ * {@link AvailabilityStartTimeDetailHost} read their record id from
+ * `AdminRoutePageProps` via the default-exported wrappers in `./pages/`.
+ * The index host's SSR loader binding is no longer app-side:
+ * {@link ensureAvailabilityPageData} runs in the contribution's own loader
+ * against the host runtime's cookie-forwarding fetcher. The pages keep
+ * their filter state component-local, so there are no URL search contracts,
+ * and every cross-route link resolves through the semantic destinations
+ * declared above.
  *
  * WIDGETS: none. {@link OptionResourceTemplatesPanel} (the per-option
  * resource templates editor the product editor embeds) ships from this
@@ -52,22 +58,75 @@ export function createAvailabilityAdminExtension(options = {}) {
                 id: "availability-index",
                 path: basePath,
                 title: availability,
+                ssr: "data-only",
+                page: () => import("./availability-index-host.js").then((module) => adminRoutePageModule(module.AvailabilityIndexHost)),
+                // Awaits only what the slots tab + the products picker need for
+                // first paint; the slot dialog's rules/start-times dimensions
+                // prefetch in the background.
+                loader: ({ queryClient, runtime }) => ensureAvailabilityPageData(queryClient, loaderClient(runtime)),
+                pendingComponent: AvailabilityPageSkeleton,
             },
             {
                 id: "availability-slot-detail",
                 path: `${basePath}/$id`,
                 title: availability,
+                page: () => import("./pages/availability-slot-detail-page.js"),
+                loader: async ({ queryClient, runtime, params }) => {
+                    const id = params.id;
+                    if (!id)
+                        return;
+                    // Dynamic import on purpose: the loader helper lives in the slot
+                    // detail page module, and a static import here would pin that
+                    // module into the host's workspace-chrome chunk, defeating the
+                    // route's code-split. The loader and the page resolve the same
+                    // chunk, fetched once.
+                    const { loadAvailabilitySlotDetailPage } = await import("../components/availability-slot-detail-page.js");
+                    return loadAvailabilitySlotDetailPage(queryClient, loaderClient(runtime), id);
+                },
+                pendingComponent: AvailabilitySlotDetailSkeleton,
             },
             {
                 id: "availability-rule-detail",
                 path: `${basePath}/rules/$id`,
                 title: availability,
+                page: () => import("./pages/availability-rule-detail-page.js"),
+                loader: async ({ queryClient, runtime, params }) => {
+                    const id = params.id;
+                    if (!id)
+                        return;
+                    // Dynamic import on purpose — see the slot detail loader above.
+                    const { loadAvailabilityRuleDetailPage } = await import("../components/availability-rule-detail-page.js");
+                    return loadAvailabilityRuleDetailPage(queryClient, loaderClient(runtime), id);
+                },
+                pendingComponent: AvailabilityRuleDetailSkeleton,
             },
             {
                 id: "availability-start-time-detail",
                 path: `${basePath}/start-times/$id`,
                 title: availability,
+                page: () => import("./pages/availability-start-time-detail-page.js"),
+                loader: async ({ queryClient, runtime, params }) => {
+                    const id = params.id;
+                    if (!id)
+                        return;
+                    // Dynamic import on purpose — see the slot detail loader above.
+                    const { loadAvailabilityStartTimeDetailPage } = await import("../components/availability-start-time-detail-page.js");
+                    return loadAvailabilityStartTimeDetailPage(queryClient, loaderClient(runtime), id);
+                },
+                pendingComponent: AvailabilityStartTimeDetailSkeleton,
             },
         ],
     });
 }
+/**
+ * Bridge the host-supplied {@link AdminRouteRuntime} (optional fetcher) to
+ * the required-fetcher client contract the availability loaders take.
+ *
+ * Note: the operator's detail route files built this client with the
+ * package `defaultFetcher` (a plain `credentials: "include"` fetch); the
+ * contribution uses the host runtime's cookie-forwarding fetcher instead,
+ * so detail SSR prefetches authenticate — an intentional improvement.
+ */
+function loaderClient(runtime) {
+    return { baseUrl: runtime.baseUrl, fetcher: runtime.fetcher ?? defaultFetcher };
+}

package/dist/admin/pages/availability-rule-detail-page.d.ts

@@ -0,0 +1,9 @@
+import type { AdminRoutePageProps } from "@voyantjs/admin";
+/**
+ * Param-taking page for the `availability-rule-detail` contribution: reads
+ * the rule id off {@link AdminRoutePageProps} and binds it onto the packaged
+ * host. Resolved lazily through the contribution's `page` loader so the
+ * detail page lands in its own chunk.
+ */
+export default function AvailabilityRuleDetailRoutePage({ params }: AdminRoutePageProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=availability-rule-detail-page.d.ts.map

package/dist/admin/pages/availability-rule-detail-page.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"availability-rule-detail-page.d.ts","sourceRoot":"","sources":["../../../src/admin/pages/availability-rule-detail-page.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAA;AAI1D;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,+BAA+B,CAAC,EAAE,MAAM,EAAE,EAAE,mBAAmB,2CAEtF"}

package/dist/admin/pages/availability-rule-detail-page.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { AvailabilityRuleDetailHost } from "../rule-detail-host.js";
+/**
+ * Param-taking page for the `availability-rule-detail` contribution: reads
+ * the rule id off {@link AdminRoutePageProps} and binds it onto the packaged
+ * host. Resolved lazily through the contribution's `page` loader so the
+ * detail page lands in its own chunk.
+ */
+export default function AvailabilityRuleDetailRoutePage({ params }) {
+    return _jsx(AvailabilityRuleDetailHost, { ruleId: params.id ?? "" });
+}

package/dist/admin/pages/availability-slot-detail-page.d.ts

@@ -0,0 +1,9 @@
+import type { AdminRoutePageProps } from "@voyantjs/admin";
+/**
+ * Param-taking page for the `availability-slot-detail` contribution: reads
+ * the slot id off {@link AdminRoutePageProps} and binds it onto the packaged
+ * host. Resolved lazily through the contribution's `page` loader so the
+ * detail page lands in its own chunk.
+ */
+export default function AvailabilitySlotDetailRoutePage({ params }: AdminRoutePageProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=availability-slot-detail-page.d.ts.map

package/dist/admin/pages/availability-slot-detail-page.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"availability-slot-detail-page.d.ts","sourceRoot":"","sources":["../../../src/admin/pages/availability-slot-detail-page.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAA;AAI1D;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,+BAA+B,CAAC,EAAE,MAAM,EAAE,EAAE,mBAAmB,2CAEtF"}

package/dist/admin/pages/availability-slot-detail-page.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { AvailabilitySlotDetailHost } from "../slot-detail-host.js";
+/**
+ * Param-taking page for the `availability-slot-detail` contribution: reads
+ * the slot id off {@link AdminRoutePageProps} and binds it onto the packaged
+ * host. Resolved lazily through the contribution's `page` loader so the
+ * detail page lands in its own chunk.
+ */
+export default function AvailabilitySlotDetailRoutePage({ params }) {
+    return _jsx(AvailabilitySlotDetailHost, { slotId: params.id ?? "" });
+}

package/dist/admin/pages/availability-start-time-detail-page.d.ts

@@ -0,0 +1,9 @@
+import type { AdminRoutePageProps } from "@voyantjs/admin";
+/**
+ * Param-taking page for the `availability-start-time-detail` contribution:
+ * reads the start time id off {@link AdminRoutePageProps} and binds it onto
+ * the packaged host. Resolved lazily through the contribution's `page`
+ * loader so the detail page lands in its own chunk.
+ */
+export default function AvailabilityStartTimeDetailRoutePage({ params }: AdminRoutePageProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=availability-start-time-detail-page.d.ts.map

package/dist/admin/pages/availability-start-time-detail-page.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"availability-start-time-detail-page.d.ts","sourceRoot":"","sources":["../../../src/admin/pages/availability-start-time-detail-page.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAA;AAI1D;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,oCAAoC,CAAC,EAAE,MAAM,EAAE,EAAE,mBAAmB,2CAE3F"}

package/dist/admin/pages/availability-start-time-detail-page.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { AvailabilityStartTimeDetailHost } from "../start-time-detail-host.js";
+/**
+ * Param-taking page for the `availability-start-time-detail` contribution:
+ * reads the start time id off {@link AdminRoutePageProps} and binds it onto
+ * the packaged host. Resolved lazily through the contribution's `page`
+ * loader so the detail page lands in its own chunk.
+ */
+export default function AvailabilityStartTimeDetailRoutePage({ params }) {
+    return _jsx(AvailabilityStartTimeDetailHost, { startTimeId: params.id ?? "" });
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@voyantjs/availability-react",
-  "version": "0.107.0",
+  "version": "0.108.0",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
@@ -73,12 +73,12 @@
     "react-hook-form": "^7.72.1",
     "sonner": "^2.0.7",
     "zod": "^4.0.0",
-    "@voyantjs/admin": "^0.107.0",
-    "@voyantjs/allocation-ui": "^0.108.0",
-    "@voyantjs/availability": "^0.107.0",
-    "@voyantjs/bookings-react": "^0.110.0",
-    "@voyantjs/extras-react": "^0.110.0",
-    "@voyantjs/products-react": "^0.110.0",
+    "@voyantjs/admin": "^0.108.0",
+    "@voyantjs/allocation-ui": "^0.109.0",
+    "@voyantjs/availability": "^0.108.0",
+    "@voyantjs/bookings-react": "^0.111.0",
+    "@voyantjs/extras-react": "^0.111.0",
+    "@voyantjs/products-react": "^0.111.0",
     "@voyantjs/ui": "^0.106.0"
   },
   "peerDependenciesMeta": {
@@ -130,13 +130,13 @@
     "typescript": "^6.0.2",
     "vitest": "^4.1.2",
     "zod": "^4.3.6",
-    "@voyantjs/admin": "^0.107.0",
-    "@voyantjs/allocation-ui": "^0.108.0",
-    "@voyantjs/availability": "^0.107.0",
-    "@voyantjs/bookings-react": "^0.110.0",
-    "@voyantjs/extras-react": "^0.110.0",
+    "@voyantjs/admin": "^0.108.0",
+    "@voyantjs/allocation-ui": "^0.109.0",
+    "@voyantjs/availability": "^0.108.0",
+    "@voyantjs/bookings-react": "^0.111.0",
+    "@voyantjs/extras-react": "^0.111.0",
     "@voyantjs/i18n": "^0.106.0",
-    "@voyantjs/products-react": "^0.110.0",
+    "@voyantjs/products-react": "^0.111.0",
     "@voyantjs/react": "^0.104.1",
     "@voyantjs/ui": "^0.106.0",
     "@voyantjs/voyant-typescript-config": "^0.1.0"