@monkeyplus/flow 6.0.55 → 6.0.57

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@monkeyplus/flow",
-  "version": "6.0.55",
+  "version": "6.0.57",
   "description": "@monkeyplus/flow package-first runtime with Vite, Nitro, Vue and a workspace playground.",
   "license": "MIT",
   "publishConfig": {

package/server/lib/pages.d.ts

@@ -1,4 +1,4 @@
-import type { DynamicRouteEntry, FlowLocale, GetUrlOptions, HeadDefinition, PageDefinition, PageLocaleDefinition, PageUrlInfo } from '../../src/runtime/pages';
+import type { DynamicRouteEntry, FlowLocale, GetUrlOptions, HeadDefinition, PageDefinition, PageLocaleDefinition, PageUrlInfo, BreadcrumbItem } from '../../src/runtime/pages';
 export interface ResolvedPage {
     definition: PageDefinition;
     locale: FlowLocale;
@@ -13,8 +13,10 @@ export interface ResolvedPage {
      */
     seo: HeadDefinition;
     context: Record<string, unknown>;
+    breadcrumbs: BreadcrumbItem[];
 }
 export declare function getUrl(namePage: string, localeCode?: string, options?: GetUrlOptions): Promise<string | undefined>;
 export declare function getUrls(withLocale?: boolean, omitNoPublish?: boolean): Promise<(string | PageUrlInfo)[]>;
 export declare function resolvePage(pathname: string, request?: Request): Promise<ResolvedPage | undefined>;
 export declare function resolvePageByName(name: string, pathname: string, request?: Request): Promise<ResolvedPage | undefined>;
+export declare function resolveBreadcrumbs(pageName: string, pathname: string, localeCode: string, params: Record<string, string>, dynamic: DynamicRouteEntry | undefined, request: Request | undefined, visited?: Set<string>): Promise<BreadcrumbItem[]>;

package/server/lib/pages.mjs

@@ -31,7 +31,6 @@ function mergeHeadDefinitions(...heads) {
       }
     }
   }
-  console.log("mergeHeadDefinitions", result);
   return result;
 }
 const dynamicRouteCache = /* @__PURE__ */ new Map();
@@ -318,6 +317,7 @@ export async function resolvePage(pathname, request) {
     const assign = match.localePage.dynamic?.assign;
     const resolvedContext = mergeResolvedContext(context, layoutContext.context, dynamic, assign);
     const head = mergeHeadDefinitions(layoutContext.head.global, layoutContext.head.layout, pageHead);
+    const breadcrumbs = await resolveBreadcrumbs(match.definition.name, pathname, match.localeCode, match.params, dynamic, request);
     return {
       definition: match.definition,
       locale,
@@ -328,7 +328,8 @@ export async function resolvePage(pathname, request) {
       dynamic,
       head,
       seo: head,
-      context: resolvedContext
+      context: resolvedContext,
+      breadcrumbs
     };
   }
   return void 0;
@@ -351,6 +352,7 @@ export async function resolvePageByName(name, pathname, request) {
     const layoutContext = await resolveLayoutContext(definition, ctx);
     const context = localePage.context ? await localePage.context(ctx) : {};
     const head = mergeHeadDefinitions(layoutContext.head.global, layoutContext.head.layout, pageHead);
+    const breadcrumbs = await resolveBreadcrumbs(definition.name, pathname, localeCode, params, void 0, request);
     return {
       definition,
       locale,
@@ -360,8 +362,48 @@ export async function resolvePageByName(name, pathname, request) {
       params,
       head,
       seo: head,
-      context: mergeResolvedContext(context, layoutContext.context)
+      context: mergeResolvedContext(context, layoutContext.context),
+      breadcrumbs
     };
   }
   return void 0;
 }
+export async function resolveBreadcrumbs(pageName, pathname, localeCode, params, dynamic, request, visited = /* @__PURE__ */ new Set()) {
+  if (visited.has(pageName)) {
+    return [];
+  }
+  visited.add(pageName);
+  const definition = pageDefinitions.find((candidate) => candidate.name === pageName);
+  if (!definition) return [];
+  const localePage = definition.locales[localeCode];
+  if (!localePage || !localePage.breadcrumb) return [];
+  const locale = createLocale(localeCode);
+  const ctx = createContext(definition, locale, localePage, pathname, params, dynamic, request);
+  const result = await localePage.breadcrumb(ctx);
+  if (!result) return [];
+  let currentItems = [];
+  if (result.items) {
+    currentItems = result.items;
+  } else if (result.item) {
+    currentItems = [result.item];
+  }
+  for (const item of currentItems) {
+    if (!item.url || item.url === "#") {
+      item.url = await ctx.utils.getUrl(pageName, localeCode, { params });
+    }
+  }
+  let parentItems = [];
+  if (result.parent) {
+    let parentName = "";
+    let parentParams = params;
+    if (typeof result.parent === "string") {
+      parentName = result.parent;
+    } else {
+      parentName = result.parent.name;
+      parentParams = result.parent.params;
+    }
+    const parentPathname = await ctx.utils.getUrl(parentName, localeCode, { params: parentParams }) || "/";
+    parentItems = await resolveBreadcrumbs(parentName, parentPathname, localeCode, parentParams, void 0, request, visited);
+  }
+  return [...parentItems, ...currentItems];
+}

package/server/lib/render.mjs

@@ -103,7 +103,7 @@ async function renderBody(page) {
     page: page.definition,
     context: page.context,
     head: page.head,
-    seo: page.seo,
+    seo: page.head.seo,
     locale: page.locale,
     params: page.params,
     path: page.pathname
@@ -142,6 +142,7 @@ ${cleanTrace}`);
   };
   app.provide("context", context);
   app.provide("utils", utils);
+  app.provide("breadcrumbs", page.breadcrumbs);
   const head = createHead();
   head.use(UnheadSchemaOrg());
   head.push({
@@ -150,7 +151,6 @@ ${cleanTrace}`);
     }
   });
   head.push(normalizeSeoToHead(page.head, fallbackTitle, fallbackDescription));
-  console.log("head", head);
   app.use(head);
   installFlowVuePlugins(app);
   return {
@@ -169,7 +169,8 @@ export async function renderDocument(page, clientAssets) {
     title: fallbackTitle,
     locale: page.locale,
     mode,
-    images: getFlowImageBootPayload()
+    images: getFlowImageBootPayload(),
+    breadcrumbs: page.breadcrumbs
   };
   const rendered = await renderBody(page);
   const body = stripVueFragmentMarkers(rendered.body);

package/src/public/index.d.ts

@@ -1,6 +1,6 @@
 export type { ContentDirectoryNode, ContentEntry, ContentFileNode, ContentTreeNode, } from '../../modules/content/query.ts';
 export type { FlowBootPayload } from '../runtime/boot.ts';
-export { useContext, useGlobal, useLocale, usePage, useSeo, useSharedContext, useUtils, useView, } from '../runtime/composables.ts';
+export { useContext, useGlobal, useHead, useLocale, usePage, useSeo, useSharedContext, useUrl, useUtils, useView, useBreadcrumb, } from '../runtime/composables.ts';
 export { defineFlowConfig, defineFlowModule, resolveFlowConfig } from '../runtime/config.ts';
 export type { FlowConfig, UserFlowConfig, } from '../runtime/config.ts';
 export { useSchemaOrg } from '../runtime/head.ts';

package/src/public/index.mjs

@@ -1,12 +1,15 @@
 export {
   useContext,
   useGlobal,
+  useHead,
   useLocale,
   usePage,
   useSeo,
   useSharedContext,
+  useUrl,
   useUtils,
-  useView
+  useView,
+  useBreadcrumb
 } from "../runtime/composables.mjs";
 export { defineFlowConfig, defineFlowModule, resolveFlowConfig } from "../runtime/config.mjs";
 export { useSchemaOrg } from "../runtime/head.mjs";

package/src/public/vite.mjs

@@ -343,6 +343,9 @@ export function createFlowViteConfig(options = {}) {
   const { imports: userImports, ...userAutoImport } = options.userFlowConfig?.autoImport || {};
   const uiOptions = options.userFlowConfig?.ui || {};
   return defineConfig({
+    define: {
+      "import.meta.env.FLOW_SITE_URL": JSON.stringify(flowConfig.siteUrl || "")
+    },
     plugins: [
       createFlowVirtualServerModules(projectRoot, flowConfig),
       createFlowVirtualClientPages(projectRoot),
@@ -378,12 +381,15 @@ export function createFlowViteConfig(options = {}) {
                 "useSchemaOrg",
                 "useContext",
                 "useSeo",
+                "useHead",
                 "useUtils",
                 "useSharedContext",
                 "useGlobal",
+                "useUrl",
                 "useLocale",
                 "usePage",
-                "useView"
+                "useView",
+                "useBreadcrumb"
               ],
               ...mappedNitroImports
             },

package/src/runtime/boot.d.ts

@@ -1,17 +0,0 @@
-import type { FlowImageMeta, FlowImageOptions } from '../../modules/images/runtime/types.ts';
-import type { FlowHydrationMode, FlowLocale } from './pages';
-export interface FlowImageBootPayload {
-    all: Record<string, FlowImageMeta>;
-    options: FlowImageOptions;
-    generateOutput: boolean;
-    strapiURL?: string;
-}
-export interface FlowBootPayload {
-    path: string;
-    bundle: string;
-    template: string;
-    title: string;
-    locale: FlowLocale;
-    mode: FlowHydrationMode;
-    images?: FlowImageBootPayload;
-}

package/src/runtime/composables.d.ts

@@ -1,9 +1,18 @@
-import type { FlowLocale, PageContextUtils, PageDefinition } from './pages.ts';
+import type { BreadcrumbItem, FlowLocale, PageContextUtils, PageDefinition } from './pages.ts';
 export declare function useContext<T = any>(): T;
-export declare function useSeo<T = any>(): T;
+export declare function useSeo(): any;
+export declare function useHead<T = any>(): T;
 export declare function useUtils(): PageContextUtils;
 export declare function useSharedContext<T = any>(): T;
 export declare function useGlobal<T = any>(): T;
 export declare function useLocale(): FlowLocale;
 export declare function usePage(): PageDefinition;
 export declare function useView(): PageDefinition['view'];
+export interface UrlInfo {
+    pathname: string;
+    siteUrl?: string;
+    href: string;
+    joinUrl: (...params: string[]) => string;
+}
+export declare function useUrl(): UrlInfo;
+export declare function useBreadcrumb(): BreadcrumbItem[];

package/src/runtime/composables.mjs

@@ -1,3 +1,4 @@
+import { joinURL } from "ufo";
 import { inject } from "vue";
 export function useContext() {
   const ctx = inject("context", {});
@@ -10,6 +11,10 @@ export function useSeo() {
   const ctx = inject("context", {});
   return ctx.seo || {};
 }
+export function useHead() {
+  const ctx = inject("context", {});
+  return ctx.head || {};
+}
 export function useUtils() {
   return inject("utils", {});
 }
@@ -33,3 +38,24 @@ export function useView() {
   const ctx = inject("context", {});
   return { ...ctx.page?.view || {} };
 }
+export function useUrl() {
+  const ctx = inject("context", {});
+  const pathname = ctx.path || "/";
+  const siteUrl = import.meta.env.FLOW_SITE_URL || void 0;
+  let href = pathname || "/";
+  if (siteUrl) {
+    const base = siteUrl.endsWith("/") ? siteUrl.slice(0, -1) : siteUrl;
+    const path = href.startsWith("/") ? href : `/${href}`;
+    href = base + path;
+  }
+  return {
+    pathname,
+    siteUrl,
+    href,
+    joinUrl: (...params) => joinURL(siteUrl || "", ...params)
+  };
+}
+export function useBreadcrumb() {
+  const breadcrumbs = inject("breadcrumbs", []);
+  return breadcrumbs;
+}

package/src/runtime/islands.mjs

@@ -61,6 +61,7 @@ async function hydrateIsland(element, boot) {
   const imageUtils = createBootImageUtils(boot);
   app.use(getClientHead());
   app.provide("utils", imageUtils);
+  app.provide("breadcrumbs", boot?.breadcrumbs || []);
   installFlowVuePlugins(app);
   app.mount(element);
   element.dataset.flowIslandHydrated = "true";

package/src/runtime/pages.d.ts

@@ -1,4 +1,4 @@
-import type { UseHeadInput } from '@unhead/vue';
+import type { UseHeadInput, UseSeoMetaInput } from '@unhead/vue';
 export type MaybePromise<T> = T | Promise<T>;
 export interface FlowLocale {
     code: string;
@@ -36,7 +36,9 @@ export interface LegacySeoDefinition {
      */
     facebook?: boolean;
 }
-export type HeadDefinition = UseHeadInput & LegacySeoDefinition;
+export type HeadDefinition = UseHeadInput & LegacySeoDefinition & {
+    seo: UseSeoMetaInput;
+};
 /**
  * @deprecated Use HeadDefinition.
  */
@@ -105,6 +107,19 @@ export interface PageContextInput {
     utils: PageContextUtils;
     preview?: boolean;
 }
+export interface BreadcrumbItem {
+    title: string;
+    caption?: string;
+    url?: string;
+}
+export interface BreadcrumbDefinition {
+    parent?: string | {
+        name: string;
+        params: Record<string, string>;
+    };
+    item?: BreadcrumbItem;
+    items?: BreadcrumbItem[];
+}
 export interface PageLocaleDefinition {
     url: string;
     head?: (ctx: PageContextInput) => MaybePromise<HeadDefinition>;
@@ -113,6 +128,7 @@ export interface PageLocaleDefinition {
      */
     seo?: (ctx: PageContextInput) => MaybePromise<HeadDefinition>;
     context?: (ctx: PageContextInput) => MaybePromise<Record<string, unknown>>;
+    breadcrumb?: (ctx: PageContextInput) => MaybePromise<BreadcrumbDefinition>;
     dynamic?: DynamicRouteOptions;
 }
 export interface PageDefinition {

package/src/runtime/virtual.d.ts

@@ -123,4 +123,4 @@ declare module 'virtual:flow/bases' {
   const bases: Record<string, string>;
 
   export default bases;
-}
+}