UNPKG

@vercel/microfrontends

Version:

Defines configuration and utilities for microfrontends development

3 lines 6.77 kB
"use client"; "use strict";var I=Object.create;var C=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)C(t,n,{get:e[n],enumerable:!0})},v=(t,e,n,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of D(e))!B.call(t,o)&&o!==n&&C(t,o,{get:()=>e[o],enumerable:!(i=z(e,o))||i.enumerable});return t};var _=(t,e,n)=>(n=t!=null?I(J(t)):{},v(e||!t||!t.__esModule?C(n,"default",{value:t,enumerable:!0}):n,t)),U=t=>v(C({},"__esModule",{value:!0}),t);var K={};V(K,{Link:()=>A,PrefetchCrossZoneLinks:()=>q,PrefetchCrossZoneLinksContext:()=>P,PrefetchCrossZoneLinksProvider:()=>G,useZoneForHref:()=>T});module.exports=U(K);var H=_(require("next/link.js"),1),g=require("react");var h=require("react");var N=require("path-to-regexp"),R=new Map,W=t=>{let e=R.get(t);if(e)return e;let n=(0,N.pathToRegexp)(t);return R.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=[],s=[];for(let r of i.routing)if(r.flag){if(n?.removeFlaggedPaths)continue;r.group&&delete r.group,o.push(r)}else s.push(...r.paths);s.length>0&&o.push({paths:s}),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,s]of Object.entries(this.applications))if(s.routing){for(let r of s.routing)for(let a of r.paths)if(W(a).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,b=new Map,k=t=>{let e=S.get(t||"");if(e)return e;let n=u.fromEnv(t);return S.set(t||"",n),n},E=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 m(t){let[e,n]=(0,h.useState)(()=>L??k(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=b.get(t||"");if(r!==void 0)return r;let f=k(t).hasFlaggedPaths;return b.set(t||"",f),!!f},[t]),[o,s]=(0,h.useState)(i);return(0,h.useEffect)(()=>{i&&(E||(E=X()),E.then(r=>{r&&n(a=>a.isEqual(r)?a:r)}).finally(()=>{s(!1)}))},[i]),{clientConfig:e,isLoading:o}}var O=_(require("next/script.js"),1),d=require("react");var w=require("react/jsx-runtime"),y="data-prefetch",l={anyZone:"[data-zone]",external:'[data-zone="null"]',sameZone:'[data-zone="same"]',prefetch:`[${y}]`},M={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 F(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:F(e.parentElement)}function q({prerenderEagerness:t="conservative"}){let{isLoading:e}=m(process.env.NEXT_PUBLIC_MFE_CLIENT_CONFIG),[n,i]=(0,d.useState)([]);return(0,d.useEffect)(()=>{if(e)return;let s=new IntersectionObserver(r=>{r.forEach(a=>{a.isIntersecting&&!a.target.hasAttribute(y)&&F(a.target)&&a.target.setAttribute(y,"true")})},{root:null,rootMargin:"0px",threshold:.1});return n.forEach(r=>s.observe(r)),()=>{s.disconnect()}},[e,n]),(0,d.useEffect)(()=>{if(e)return;let s=new MutationObserver(r=>{r.some(f=>f.type==="childList"&&f.addedNodes.length>0||f.type==="attributes"&&f.attributeName==="href")&&i(Array.from(document.querySelectorAll(`a${l.anyZone}:not(${l.prefetch}):not(${l.sameZone}):not(${l.external})`)))});return s.observe(document.body,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["href"]}),()=>{s.disconnect()}},[e]),e?null:(0,w.jsx)(O.default,{dangerouslySetInnerHTML:{__html:JSON.stringify({prefetch:[{eagerness:"moderate",where:M},{eagerness:"immediate",where:$}],prerender:[{eagerness:t,where:M}]})},id:"prefetch-zones-links",type:"speculationrules"})}var c=require("react"),p=require("react/jsx-runtime"),P=(0,c.createContext)({prefetchHref:()=>{}});function G({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(a=>a.has(r)?a:new Set(a).add(r))})},[]),s=(0,c.useMemo)(()=>({prefetchHref:o}),[o]);return i.current?(0,p.jsxs)(P.Provider,{value:s,children:[t,[...e].map(r=>(0,p.jsx)("link",{as:"fetch",href:r,rel:"preload"},r))]}):(0,p.jsx)(p.Fragment,{children:t})}var x=require("react/jsx-runtime"),j=process.env.NEXT_PUBLIC_MFE_CURRENT_APPLICATION_HASH;function T(t){let{clientConfig:e,isLoading:n}=m(process.env.NEXT_PUBLIC_MFE_CLIENT_CONFIG),{isRelativePath:i,zoneOfHref:o}=(0,g.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?j!==o:!1),isLoading:n}}var A=(0,g.forwardRef)(({children:t,...e},n)=>{let{prefetchHref:i}=(0,g.useContext)(P),{zoneOfHref:o,isDifferentZone:s,isLoading:r}=T(e.href);function a(){e.href&&i(e.href)}if(s&&o!==null){let{prefetch:f,...Z}=e;return(0,x.jsx)("a",{...Z,"data-zone":o,onFocus:e.prefetch!==!1?a:void 0,onMouseOver:e.prefetch!==!1?a:void 0,children:t})}return(0,x.jsx)(H.default,{...e,"data-zone":o?"same":"null",prefetch:e.prefetch??(r?!1:void 0),ref:n,children:t})});A.displayName="MicrofrontendsLink";0&&(module.exports={Link,PrefetchCrossZoneLinks,PrefetchCrossZoneLinksContext,PrefetchCrossZoneLinksProvider,useZoneForHref}); //# sourceMappingURL=client.cjs.map