@jskit-ai/crud-ui-generator 0.1.48 → 0.1.49

package/package.descriptor.mjs

@@ -1,7 +1,7 @@
 export default Object.freeze({
   packageVersion: 1,
   packageId: "@jskit-ai/crud-ui-generator",
-  version: "0.1.48",
+  version: "0.1.49",
   kind: "generator",
   description: "Generate CRUD route trees from resource validators at an explicit route root relative to src/pages/.",
   options: {
@@ -64,15 +64,7 @@ export default Object.freeze({
       inputType: "text",
       defaultValue: "",
       promptLabel: "Link placement",
-      promptHint: "Optional target override for the generated list-page link placement (format: host:position)."
-    },
-    "link-component-token": {
-      required: false,
-      inputType: "text",
-      defaultValue: "",
-      promptLabel: "Link component token",
-      promptHint:
-        "Optional component token override for the generated list-page link placement (example: local.main.ui.tab-link-item)."
+      promptHint: "Optional semantic target override for the generated list-page link placement (format: area.slot)."
     },
     namespace: {
       required: false,
@@ -119,7 +111,6 @@ export default Object.freeze({
           "id-param",
           "parent-title",
           "link-placement",
-          "link-component-token",
           "namespace",
           "force"
         ],
@@ -180,7 +171,7 @@ export default Object.freeze({
   mutations: {
     dependencies: {
       runtime: {
-        "@jskit-ai/users-web": "0.1.80"
+        "@jskit-ai/users-web": "0.1.81"
       },
       dev: {}
     },
@@ -365,7 +356,7 @@ export default Object.freeze({
         position: "bottom",
         skipIfContains: "__JSKIT_UI_MENU_MARKER__",
         value:
-          "\n// __JSKIT_UI_MENU_MARKER__\n{\n  addPlacement({\n    id: \"__JSKIT_UI_MENU_PLACEMENT_ID__\",\n    target: \"__JSKIT_UI_MENU_PLACEMENT_TARGET__\",\n    surfaces: [\"__JSKIT_UI_SURFACE_ID__\"],\n    order: 155,\n    componentToken: \"__JSKIT_UI_MENU_COMPONENT_TOKEN__\",\n    props: {\n      label: \"__JSKIT_UI_MENU_LABEL__\",\n      icon: \"__JSKIT_UI_MENU_ICON__\",\n      surface: \"__JSKIT_UI_SURFACE_ID__\",\n      scopedSuffix: \"__JSKIT_UI_MENU_WORKSPACE_SUFFIX__\",\n      unscopedSuffix: \"__JSKIT_UI_MENU_NON_WORKSPACE_SUFFIX__\",\n__JSKIT_UI_MENU_TO_PROP_LINE__    },\n__JSKIT_UI_MENU_WHEN_LINE__  });\n}\n",
+          "\n// __JSKIT_UI_MENU_MARKER__\n{\n  addPlacement({\n    id: \"__JSKIT_UI_MENU_PLACEMENT_ID__\",\n    target: \"__JSKIT_UI_MENU_PLACEMENT_TARGET__\",\n__JSKIT_UI_MENU_OWNER_LINE__    kind: \"link\",\n    surfaces: [\"__JSKIT_UI_SURFACE_ID__\"],\n    order: 155,\n    props: {\n      label: \"__JSKIT_UI_MENU_LABEL__\",\n      icon: \"__JSKIT_UI_MENU_ICON__\",\n      surface: \"__JSKIT_UI_SURFACE_ID__\",\n      scopedSuffix: \"__JSKIT_UI_MENU_WORKSPACE_SUFFIX__\",\n      unscopedSuffix: \"__JSKIT_UI_MENU_NON_WORKSPACE_SUFFIX__\",\n__JSKIT_UI_MENU_TO_PROP_LINE__    },\n__JSKIT_UI_MENU_WHEN_LINE__  });\n}\n",
         reason: "Append generated CRUD list-page placement.",
         category: "crud-ui-generator",
         id: "crud-ui-placement-menu",

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@jskit-ai/crud-ui-generator",
-  "version": "0.1.48",
+  "version": "0.1.49",
   "type": "module",
   "scripts": {
     "test": "node --test"
   },
   "dependencies": {
-    "@jskit-ai/crud-core": "0.1.73",
-    "@jskit-ai/kernel": "0.1.65",
-    "@jskit-ai/resource-crud-core": "0.1.10"
+    "@jskit-ai/crud-core": "0.1.74",
+    "@jskit-ai/kernel": "0.1.66",
+    "@jskit-ai/resource-crud-core": "0.1.11"
   },
   "exports": {
     "./server/buildTemplateContext": "./src/server/buildTemplateContext.js"

package/src/server/buildTemplateContext.js

@@ -475,6 +475,14 @@ function resolveMenuToPropLine(linkTo = "") {
   return `      to: ${JSON.stringify(linkTo)},\n`;
 }
 
+function resolveMenuOwnerLine(owner = "") {
+  const normalizedOwner = normalizeText(owner);
+  if (!normalizedOwner) {
+    return "";
+  }
+  return `    owner: ${JSON.stringify(normalizedOwner)},\n`;
+}
+
 function resolveCrudRelativePath(namespace = "") {
   return `/${requireCrudNamespace(namespace, {
     context: "crud-ui-generator resource namespace"
@@ -650,7 +658,6 @@ async function buildUiTemplateContext({ appRoot, options } = {}) {
       pageTarget,
       targetFile: listTargetFile,
       placement: options?.["link-placement"],
-      componentToken: options?.["link-component-token"],
       context: "crud-ui-generator"
     })
     : null;
@@ -727,7 +734,7 @@ async function buildUiTemplateContext({ appRoot, options } = {}) {
     __JSKIT_UI_MENU_MARKER__: menuMarker,
     __JSKIT_UI_MENU_PLACEMENT_ID__: String(pageLinkTarget?.pageTarget?.placementId || ""),
     __JSKIT_UI_MENU_PLACEMENT_TARGET__: String(pageLinkTarget?.placementTarget?.id || ""),
-    __JSKIT_UI_MENU_COMPONENT_TOKEN__: String(pageLinkTarget?.componentToken || ""),
+    __JSKIT_UI_MENU_OWNER_LINE__: resolveMenuOwnerLine(pageLinkTarget?.placementTarget?.owner || ""),
     __JSKIT_UI_MENU_ICON__: DEFAULT_GENERATED_LINK_ICON,
     __JSKIT_UI_MENU_WORKSPACE_SUFFIX__: String(pageLinkTarget?.pageTarget?.routeUrlSuffix || ""),
     __JSKIT_UI_MENU_NON_WORKSPACE_SUFFIX__: String(pageLinkTarget?.pageTarget?.routeUrlSuffix || ""),

package/test/buildTemplateContext.test.js

@@ -27,6 +27,67 @@ async function linkTestPackage(appRoot, packageName, packageDir) {
   await symlink(packageDir, targetPath, "dir");
 }
 
+function renderTopologyVariant(outlet, { linkRenderer = "" } = {}) {
+  const rendererLines = linkRenderer
+    ? `,
+      renderers: {
+        link: "${linkRenderer}"
+      }`
+    : "";
+  return `{
+      outlet: "${outlet}"${rendererLines}
+    }`;
+}
+
+function renderTopologyEntry({
+  id = "",
+  owner = "",
+  surfaces = ["*"],
+  defaultPlacement = false,
+  outlet = "",
+  linkRenderer = ""
+} = {}) {
+  const ownerLine = owner ? `    owner: "${owner}",\n` : "";
+  const defaultLine = defaultPlacement ? "    default: true,\n" : "";
+  return `  {
+    id: "${id}",
+${ownerLine}    surfaces: ${JSON.stringify(surfaces)},
+${defaultLine}    variants: {
+      compact: ${renderTopologyVariant(outlet, { linkRenderer })},
+      medium: ${renderTopologyVariant(outlet, { linkRenderer })},
+      expanded: ${renderTopologyVariant(outlet, { linkRenderer })}
+    }
+  }`;
+}
+
+async function writePlacementTopology(appRoot, entries = []) {
+  const defaultEntries = [
+    renderTopologyEntry({
+      id: "shell.primary-nav",
+      surfaces: ["*"],
+      defaultPlacement: true,
+      outlet: "shell-layout:primary-menu",
+      linkRenderer: "local.main.ui.surface-aware-menu-link-item"
+    }),
+    renderTopologyEntry({
+      id: "shell.secondary-nav",
+      surfaces: ["*"],
+      outlet: "shell-layout:secondary-menu",
+      linkRenderer: "local.main.ui.surface-aware-menu-link-item"
+    })
+  ];
+  await writeFile(
+    path.join(appRoot, "src", "placementTopology.js"),
+    `export default {
+  placements: [
+${[...defaultEntries, ...entries].join(",\n")}
+  ]
+};
+`,
+    "utf8"
+  );
+}
+
 async function withTempApp(run) {
   const appRoot = await mkdtemp(path.join(tmpdir(), "crud-ui-generator-"));
   try {
@@ -54,17 +115,14 @@ async function withTempApp(run) {
     <ShellOutlet
       target="shell-layout:primary-menu"
       default
-      default-link-component-token="local.main.ui.surface-aware-menu-link-item"
-    />
-    <ShellOutlet
-      target="shell-layout:secondary-menu"
-      default-link-component-token="local.main.ui.surface-aware-menu-link-item"
     />
+    <ShellOutlet target="shell-layout:secondary-menu" />
   </div>
 </template>
 `,
       "utf8"
     );
+    await writePlacementTopology(appRoot);
     return await run(appRoot);
   } finally {
     await rm(appRoot, { recursive: true, force: true });
@@ -614,8 +672,8 @@ test("buildUiTemplateContext resolves list placement from the app default shell
     });
 
     assert.equal(context.__JSKIT_UI_MENU_PLACEMENT_ID__, "ui-generator.page.admin.customers.link");
-    assert.equal(context.__JSKIT_UI_MENU_PLACEMENT_TARGET__, "shell-layout:primary-menu");
-    assert.equal(context.__JSKIT_UI_MENU_COMPONENT_TOKEN__, "local.main.ui.surface-aware-menu-link-item");
+    assert.equal(context.__JSKIT_UI_MENU_PLACEMENT_TARGET__, "shell.primary-nav");
+    assert.equal(context.__JSKIT_UI_MENU_OWNER_LINE__, "");
     assert.equal(context.__JSKIT_UI_MENU_WORKSPACE_SUFFIX__, "/customers");
     assert.equal(context.__JSKIT_UI_MENU_NON_WORKSPACE_SUFFIX__, "/customers");
     assert.equal(context.__JSKIT_UI_MENU_TO_PROP_LINE__, "");
@@ -627,6 +685,15 @@ test("buildUiTemplateContext resolves list placement from the app default shell
 test("buildUiTemplateContext infers tab placement and relative link-to from the nearest parent subpages host", async () => {
   await withTempApp(async (appRoot) => {
     await writeResource(appRoot, RESOURCE_FILE, FULL_RESOURCE_SOURCE);
+    await writePlacementTopology(appRoot, [
+      renderTopologyEntry({
+        id: "page.section-nav",
+        owner: "catalog",
+        surfaces: ["admin"],
+        outlet: "catalog:sub-pages",
+        linkRenderer: "local.main.ui.surface-aware-menu-link-item"
+      })
+    ]);
     await writeFileInApp(
       appRoot,
       "src/pages/admin/catalog/index.vue",
@@ -648,8 +715,8 @@ test("buildUiTemplateContext infers tab placement and relative link-to from the
       })
     });
 
-    assert.equal(context.__JSKIT_UI_MENU_PLACEMENT_TARGET__, "catalog:sub-pages");
-    assert.equal(context.__JSKIT_UI_MENU_COMPONENT_TOKEN__, "local.main.ui.surface-aware-menu-link-item");
+    assert.equal(context.__JSKIT_UI_MENU_PLACEMENT_TARGET__, "page.section-nav");
+    assert.equal(context.__JSKIT_UI_MENU_OWNER_LINE__, "    owner: \"catalog\",\n");
     assert.equal(context.__JSKIT_UI_MENU_ICON__, "mdi-view-list-outline");
     assert.equal(context.__JSKIT_UI_MENU_TO_PROP_LINE__, "      to: \"./products\",\n");
     assert.equal(context.__JSKIT_UI_MENU_WORKSPACE_SUFFIX__, "/catalog/products");
@@ -659,15 +726,21 @@ test("buildUiTemplateContext infers tab placement and relative link-to from the
 test("buildUiTemplateContext prefers an outlet-declared default link token and omits fragile relative to output", async () => {
   await withTempApp(async (appRoot) => {
     await writeResource(appRoot, RESOURCE_FILE, FULL_RESOURCE_SOURCE);
+    await writePlacementTopology(appRoot, [
+      renderTopologyEntry({
+        id: "page.section-nav",
+        owner: "admin-settings",
+        surfaces: ["admin"],
+        outlet: "admin-settings:primary-menu",
+        linkRenderer: "local.main.ui.surface-aware-menu-link-item"
+      })
+    ]);
     await writeFileInApp(
       appRoot,
       "src/pages/admin/settings.vue",
       `<template>
   <section>
-    <ShellOutlet
-      target="admin-settings:primary-menu"
-      default-link-component-token="local.main.ui.surface-aware-menu-link-item"
-    />
+    <ShellOutlet target="admin-settings:primary-menu" />
     <RouterView />
   </section>
 </template>
@@ -681,8 +754,8 @@ test("buildUiTemplateContext prefers an outlet-declared default link token and o
       })
     });
 
-    assert.equal(context.__JSKIT_UI_MENU_PLACEMENT_TARGET__, "admin-settings:primary-menu");
-    assert.equal(context.__JSKIT_UI_MENU_COMPONENT_TOKEN__, "local.main.ui.surface-aware-menu-link-item");
+    assert.equal(context.__JSKIT_UI_MENU_PLACEMENT_TARGET__, "page.section-nav");
+    assert.equal(context.__JSKIT_UI_MENU_OWNER_LINE__, "    owner: \"admin-settings\",\n");
     assert.equal(context.__JSKIT_UI_MENU_TO_PROP_LINE__, "");
   });
 });
@@ -694,12 +767,12 @@ test("buildUiTemplateContext honors explicit link-placement override", async ()
     const context = await buildUiTemplateContext({
       appRoot,
       options: createOptions({
-        "link-placement": "shell-layout:secondary-menu"
+        "link-placement": "shell.secondary-nav"
       })
     });
 
-    assert.equal(context.__JSKIT_UI_MENU_PLACEMENT_TARGET__, "shell-layout:secondary-menu");
-    assert.equal(context.__JSKIT_UI_MENU_COMPONENT_TOKEN__, "local.main.ui.surface-aware-menu-link-item");
+    assert.equal(context.__JSKIT_UI_MENU_PLACEMENT_TARGET__, "shell.secondary-nav");
+    assert.equal(context.__JSKIT_UI_MENU_OWNER_LINE__, "");
   });
 });