UNPKG

@vercel/microfrontends

Version:

Defines configuration and utilities for microfrontends development

3 lines 6.95 kB
"use client"; "use strict";var I=Object.create;var m=Object.defineProperty;var z=Object.getOwnPropertyDescriptor;var D=Object.getOwnPropertyNames;var J=Object.getPrototypeOf,B=Object.prototype.hasOwnProperty;var V=(t,e)=>{for(var n in e)m(t,n,{get:e[n],enumerable:!0})},_=(t,e,n,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of D(e))!B.call(t,o)&&o!==n&&m(t,o,{get:()=>e[o],enumerable:!(i=z(e,o))||i.enumerable});return t};var b=(t,e,n)=>(n=t!=null?I(J(t)):{},_(e||!t||!t.__esModule?m(n,"default",{value:t,enumerable:!0}):n,t)),U=t=>_(m({},"__esModule",{value:!0}),t);var Q={};V(Q,{Link:()=>Z,PrefetchCrossZoneLinks:()=>q,PrefetchCrossZoneLinksContext:()=>E,PrefetchCrossZoneLinksProvider:()=>j,useZoneForHref:()=>A});module.exports=U(Q);var T=b(require("next/link.js"),1),C=require("react");var h=require("react");var R=require("path-to-regexp"),N=new Map,W=t=>{let e=N.get(t);if(e)return e;let n=(0,R.pathToRegexp)(t);return N.set(t,n),n},u=class{constructor(e,n){this.pathCache={};this.hasFlaggedPaths=e.hasFlaggedPaths??!1;for(let i of Object.values(e.applications))if(i.routing){i.routing.some(r=>r.flag)&&(this.hasFlaggedPaths=!0);let o=[],a=[];for(let r of i.routing)if(r.flag){if(n?.removeFlaggedPaths)continue;r.group&&delete r.group,o.push(r)}else a.push(...r.paths);a.length>0&&o.push({paths:a}),i.routing=o}this.serialized=e,this.hasFlaggedPaths&&(this.serialized.hasFlaggedPaths=this.hasFlaggedPaths),this.applications=e.applications}static fromEnv(e){if(!e)throw new Error("Could not construct MicrofrontendConfigClient: configuration is empty or undefined. Did you set up your application with `withMicrofrontends`? Is the local proxy running and this application is being accessed via the proxy port? See https://vercel.com/docs/microfrontends/local-development#setting-up-microfrontends-proxy");return new u(JSON.parse(e))}isEqual(e){return this===e||JSON.stringify(this.applications)===JSON.stringify(e.applications)}getApplicationNameForPath(e){if(!e.startsWith("/"))throw new Error("Path must start with a /");if(this.pathCache[e])return this.pathCache[e];let n=new URL(e,"https://example.com").pathname;for(let[o,a]of Object.entries(this.applications))if(a.routing){for(let r of a.routing)for(let s of r.paths)if(W(s).test(n))return this.pathCache[e]=o,o}let i=Object.entries(this.applications).find(([,o])=>o.default);return i?(this.pathCache[e]=i[0],i[0]):null}serialize(){return this.serialized}};var S=new Map,k=new Map,M=t=>{let e=S.get(t||"");if(e)return e;let n=u.fromEnv(t);return S.set(t||"",n),n},y=null,L=null;async function X(){try{let t=await fetch("/.well-known/vercel/microfrontends/client-config");if(t.status!==200)return null;let e=await t.json(),n=new u(e.config);return L=n,n}catch{return null}}function P(t){let[e,n]=(0,h.useState)(()=>L??M(t)),i=(0,h.useMemo)(()=>{if(process.env.NODE_ENV==="test"&&process.env.MFE_FORCE_CLIENT_CONFIG_FROM_SERVER!=="1"||L)return!1;let r=k.get(t||"");if(r!==void 0)return r;let f=M(t).hasFlaggedPaths;return k.set(t||"",f),!!f},[t]),[o,a]=(0,h.useState)(i);return(0,h.useEffect)(()=>{i&&(y||(y=X()),y.then(r=>{r&&n(s=>s.isEqual(r)?s:r)}).finally(()=>{a(!1)}))},[i]),{clientConfig:e,isLoading:o}}var F=b(require("next/script.js"),1),p=require("react");var H=require("react/jsx-runtime"),v="data-prefetch",l={anyZone:"[data-zone]",external:'[data-zone="null"]',sameZone:'[data-zone="same"]',prefetch:`[${v}]`},O={and:[{href_matches:"/*"},{selector_matches:l.anyZone},{not:{selector_matches:l.sameZone}},{not:{selector_matches:l.external}}]},$={and:[{href_matches:"/*"},{selector_matches:l.anyZone},{not:{selector_matches:l.sameZone}},{not:{selector_matches:l.external}},{selector_matches:l.prefetch}]};function w(t){if(!t)return!0;if("checkVisibility"in t)return t.checkVisibility({opacityProperty:!0});let e=t,n=window.getComputedStyle(e);return n.display==="none"||n.visibility==="hidden"||n.opacity==="0"?!1:w(e.parentElement)}function q({prerenderEagerness:t="conservative"}){let{isLoading:e}=P(process.env.NEXT_PUBLIC_MFE_CLIENT_CONFIG),[n,i]=(0,p.useState)([]),o=(0,p.useRef)(G());if((0,p.useEffect)(()=>{if(e)return;let r=new IntersectionObserver(s=>{s.forEach(f=>{f.isIntersecting&&!f.target.hasAttribute(v)&&w(f.target)&&f.target.setAttribute(v,"true")})},{root:null,rootMargin:"0px",threshold:.1});return n.forEach(s=>r.observe(s)),()=>{r.disconnect()}},[e,n]),(0,p.useEffect)(()=>{if(e)return;let r=new MutationObserver(s=>{s.some(g=>g.type==="childList"&&g.addedNodes.length>0||g.type==="attributes"&&g.attributeName==="href")&&i(Array.from(document.querySelectorAll(`a${l.anyZone}:not(${l.prefetch}):not(${l.sameZone}):not(${l.external})`)))});return r.observe(document.body,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["href"]}),()=>{r.disconnect()}},[e]),e)return null;let a={prefetch:[{eagerness:"moderate",where:O},{eagerness:"immediate",where:$}],...o.current?{prerender:[{eagerness:t,where:O}]}:{}};return(0,H.jsx)(F.default,{dangerouslySetInnerHTML:{__html:JSON.stringify(a)},id:"prefetch-zones-links",type:"speculationrules"})}function G(){if(typeof navigator>"u")return!0;let t=navigator.userAgent.match(/Chrome\/(\d+)/);return t?Number(t[1])!==147:!0}var c=require("react"),d=require("react/jsx-runtime"),E=(0,c.createContext)({prefetchHref:()=>{}});function j({children:t}){let[e,n]=(0,c.useState)(new Set),i=(0,c.useRef)(typeof navigator<"u"&&(navigator.userAgent.includes("Firefox")||navigator.userAgent.includes("Safari")&&!navigator.userAgent.includes("Chrome"))),o=(0,c.useCallback)(r=>{(0,c.startTransition)(()=>{n(s=>s.has(r)?s:new Set(s).add(r))})},[]),a=(0,c.useMemo)(()=>({prefetchHref:o}),[o]);return i.current?(0,d.jsxs)(E.Provider,{value:a,children:[t,[...e].map(r=>(0,d.jsx)("link",{as:"fetch",href:r,rel:"preload"},r))]}):(0,d.jsx)(d.Fragment,{children:t})}var x=require("react/jsx-runtime"),K=process.env.NEXT_PUBLIC_MFE_CURRENT_APPLICATION_HASH;function A(t){let{clientConfig:e,isLoading:n}=P(process.env.NEXT_PUBLIC_MFE_CLIENT_CONFIG),{isRelativePath:i,zoneOfHref:o}=(0,C.useMemo)(()=>{let r=typeof t=="string"&&t.startsWith("/");return{isRelativePath:r,zoneOfHref:r?e.getApplicationNameForPath(t):null}},[e,t]);return typeof t=="string"&&!t.length?{zoneOfHref:null,isDifferentZone:!1,isLoading:!1}:{zoneOfHref:o,isDifferentZone:!i||(o?K!==o:!1),isLoading:n}}var Z=(0,C.forwardRef)(({children:t,...e},n)=>{let{prefetchHref:i}=(0,C.useContext)(E),{zoneOfHref:o,isDifferentZone:a,isLoading:r}=A(e.href);function s(){e.href&&i(e.href)}if(a&&o!==null){let{prefetch:f,...g}=e;return(0,x.jsx)("a",{...g,"data-zone":o,onFocus:e.prefetch!==!1?s:void 0,onMouseOver:e.prefetch!==!1?s:void 0,children:t})}return(0,x.jsx)(T.default,{...e,"data-zone":o?"same":"null",prefetch:e.prefetch??(r?!1:void 0),ref:n,children:t})});Z.displayName="MicrofrontendsLink";0&&(module.exports={Link,PrefetchCrossZoneLinks,PrefetchCrossZoneLinksContext,PrefetchCrossZoneLinksProvider,useZoneForHref}); //# sourceMappingURL=client.cjs.map