1737 lines
59 KiB
JavaScript
1737 lines
59 KiB
JavaScript
import { escape } from 'html-escaper';
|
|
|
|
const OnlyResponseCanBeReturned = {
|
|
name: "OnlyResponseCanBeReturned",
|
|
title: "Invalid type returned by Astro page.",
|
|
message: (route, returnedValue) => `Route \`${route ? route : ""}\` returned a \`${returnedValue}\`. Only a [Response](https://developer.mozilla.org/en-US/docs/Web/API/Response) can be returned from Astro files.`,
|
|
hint: "See https://docs.astro.build/en/guides/server-side-rendering/#response for more information."
|
|
};
|
|
const MissingMediaQueryDirective = {
|
|
name: "MissingMediaQueryDirective",
|
|
title: "Missing value for `client:media` directive.",
|
|
message: 'Media query not provided for `client:media` directive. A media query similar to `client:media="(max-width: 600px)"` must be provided'
|
|
};
|
|
const NoMatchingRenderer = {
|
|
name: "NoMatchingRenderer",
|
|
title: "No matching renderer found.",
|
|
message: (componentName, componentExtension, plural, validRenderersCount) => `Unable to render \`${componentName}\`.
|
|
|
|
${validRenderersCount > 0 ? `There ${plural ? "are" : "is"} ${validRenderersCount} renderer${plural ? "s" : ""} configured in your \`astro.config.mjs\` file,
|
|
but ${plural ? "none were" : "it was not"} able to server-side render \`${componentName}\`.` : `No valid renderer was found ${componentExtension ? `for the \`.${componentExtension}\` file extension.` : `for this file extension.`}`}`,
|
|
hint: (probableRenderers) => `Did you mean to enable the ${probableRenderers} integration?
|
|
|
|
See https://docs.astro.build/en/core-concepts/framework-components/ for more information on how to install and configure integrations.`
|
|
};
|
|
const NoClientEntrypoint = {
|
|
name: "NoClientEntrypoint",
|
|
title: "No client entrypoint specified in renderer.",
|
|
message: (componentName, clientDirective, rendererName) => `\`${componentName}\` component has a \`client:${clientDirective}\` directive, but no client entrypoint was provided by \`${rendererName}\`.`,
|
|
hint: "See https://docs.astro.build/en/reference/integrations-reference/#addrenderer-option for more information on how to configure your renderer."
|
|
};
|
|
const NoClientOnlyHint = {
|
|
name: "NoClientOnlyHint",
|
|
title: "Missing hint on client:only directive.",
|
|
message: (componentName) => `Unable to render \`${componentName}\`. When using the \`client:only\` hydration strategy, Astro needs a hint to use the correct renderer.`,
|
|
hint: (probableRenderers) => `Did you mean to pass \`client:only="${probableRenderers}"\`? See https://docs.astro.build/en/reference/directives-reference/#clientonly for more information on client:only`
|
|
};
|
|
const InvalidComponentArgs = {
|
|
name: "InvalidComponentArgs",
|
|
title: "Invalid component arguments.",
|
|
message: (name) => `Invalid arguments passed to${name ? ` <${name}>` : ""} component.`,
|
|
hint: "Astro components cannot be rendered directly via function call, such as `Component()` or `{items.map(Component)}`."
|
|
};
|
|
const AstroGlobUsedOutside = {
|
|
name: "AstroGlobUsedOutside",
|
|
title: "Astro.glob() used outside of an Astro file.",
|
|
message: (globStr) => `\`Astro.glob(${globStr})\` can only be used in \`.astro\` files. \`import.meta.glob(${globStr})\` can be used instead to achieve a similar result.`,
|
|
hint: "See Vite's documentation on `import.meta.glob` for more information: https://vitejs.dev/guide/features.html#glob-import"
|
|
};
|
|
const AstroGlobNoMatch = {
|
|
name: "AstroGlobNoMatch",
|
|
title: "Astro.glob() did not match any files.",
|
|
message: (globStr) => `\`Astro.glob(${globStr})\` did not return any matching files. Check the pattern for typos.`
|
|
};
|
|
|
|
function normalizeLF(code) {
|
|
return code.replace(/\r\n|\r(?!\n)|\n/g, "\n");
|
|
}
|
|
|
|
function codeFrame(src, loc) {
|
|
if (!loc || loc.line === void 0 || loc.column === void 0) {
|
|
return "";
|
|
}
|
|
const lines = normalizeLF(src).split("\n").map((ln) => ln.replace(/\t/g, " "));
|
|
const visibleLines = [];
|
|
for (let n = -2; n <= 2; n++) {
|
|
if (lines[loc.line + n])
|
|
visibleLines.push(loc.line + n);
|
|
}
|
|
let gutterWidth = 0;
|
|
for (const lineNo of visibleLines) {
|
|
let w = `> ${lineNo}`;
|
|
if (w.length > gutterWidth)
|
|
gutterWidth = w.length;
|
|
}
|
|
let output = "";
|
|
for (const lineNo of visibleLines) {
|
|
const isFocusedLine = lineNo === loc.line - 1;
|
|
output += isFocusedLine ? "> " : " ";
|
|
output += `${lineNo + 1} | ${lines[lineNo]}
|
|
`;
|
|
if (isFocusedLine)
|
|
output += `${Array.from({ length: gutterWidth }).join(" ")} | ${Array.from({
|
|
length: loc.column
|
|
}).join(" ")}^
|
|
`;
|
|
}
|
|
return output;
|
|
}
|
|
|
|
class AstroError extends Error {
|
|
constructor(props, ...params) {
|
|
super(...params);
|
|
this.type = "AstroError";
|
|
const { name, title, message, stack, location, hint, frame } = props;
|
|
this.title = title;
|
|
this.name = name;
|
|
if (message)
|
|
this.message = message;
|
|
this.stack = stack ? stack : this.stack;
|
|
this.loc = location;
|
|
this.hint = hint;
|
|
this.frame = frame;
|
|
}
|
|
setLocation(location) {
|
|
this.loc = location;
|
|
}
|
|
setName(name) {
|
|
this.name = name;
|
|
}
|
|
setMessage(message) {
|
|
this.message = message;
|
|
}
|
|
setHint(hint) {
|
|
this.hint = hint;
|
|
}
|
|
setFrame(source, location) {
|
|
this.frame = codeFrame(source, location);
|
|
}
|
|
static is(err) {
|
|
return err.type === "AstroError";
|
|
}
|
|
}
|
|
|
|
function validateArgs(args) {
|
|
if (args.length !== 3)
|
|
return false;
|
|
if (!args[0] || typeof args[0] !== "object")
|
|
return false;
|
|
return true;
|
|
}
|
|
function baseCreateComponent(cb, moduleId, propagation) {
|
|
var _a;
|
|
const name = ((_a = moduleId == null ? void 0 : moduleId.split("/").pop()) == null ? void 0 : _a.replace(".astro", "")) ?? "";
|
|
const fn = (...args) => {
|
|
if (!validateArgs(args)) {
|
|
throw new AstroError({
|
|
...InvalidComponentArgs,
|
|
message: InvalidComponentArgs.message(name)
|
|
});
|
|
}
|
|
return cb(...args);
|
|
};
|
|
Object.defineProperty(fn, "name", { value: name, writable: false });
|
|
fn.isAstroComponentFactory = true;
|
|
fn.moduleId = moduleId;
|
|
fn.propagation = propagation;
|
|
return fn;
|
|
}
|
|
function createComponentWithOptions(opts) {
|
|
const cb = baseCreateComponent(opts.factory, opts.moduleId, opts.propagation);
|
|
return cb;
|
|
}
|
|
function createComponent(arg1, moduleId, propagation) {
|
|
if (typeof arg1 === "function") {
|
|
return baseCreateComponent(arg1, moduleId, propagation);
|
|
} else {
|
|
return createComponentWithOptions(arg1);
|
|
}
|
|
}
|
|
|
|
const ASTRO_VERSION = "2.10.7";
|
|
|
|
function createAstroGlobFn() {
|
|
const globHandler = (importMetaGlobResult) => {
|
|
if (typeof importMetaGlobResult === "string") {
|
|
throw new AstroError({
|
|
...AstroGlobUsedOutside,
|
|
message: AstroGlobUsedOutside.message(JSON.stringify(importMetaGlobResult))
|
|
});
|
|
}
|
|
let allEntries = [...Object.values(importMetaGlobResult)];
|
|
if (allEntries.length === 0) {
|
|
throw new AstroError({
|
|
...AstroGlobNoMatch,
|
|
message: AstroGlobNoMatch.message(JSON.stringify(importMetaGlobResult))
|
|
});
|
|
}
|
|
return Promise.all(allEntries.map((fn) => fn()));
|
|
};
|
|
return globHandler;
|
|
}
|
|
function createAstro(site) {
|
|
return {
|
|
site: site ? new URL(site) : void 0,
|
|
generator: `Astro v${ASTRO_VERSION}`,
|
|
glob: createAstroGlobFn()
|
|
};
|
|
}
|
|
|
|
function serializeListValue(value) {
|
|
const hash = {};
|
|
push(value);
|
|
return Object.keys(hash).join(" ");
|
|
function push(item) {
|
|
if (item && typeof item.forEach === "function")
|
|
item.forEach(push);
|
|
else if (item === Object(item))
|
|
Object.keys(item).forEach((name) => {
|
|
if (item[name])
|
|
push(name);
|
|
});
|
|
else {
|
|
item = item === false || item == null ? "" : String(item).trim();
|
|
if (item) {
|
|
item.split(/\s+/).forEach((name) => {
|
|
hash[name] = true;
|
|
});
|
|
}
|
|
}
|
|
}
|
|
}
|
|
function isPromise(value) {
|
|
return !!value && typeof value === "object" && typeof value.then === "function";
|
|
}
|
|
|
|
const escapeHTML = escape;
|
|
class HTMLString extends String {
|
|
get [Symbol.toStringTag]() {
|
|
return "HTMLString";
|
|
}
|
|
}
|
|
const markHTMLString = (value) => {
|
|
if (value instanceof HTMLString) {
|
|
return value;
|
|
}
|
|
if (typeof value === "string") {
|
|
return new HTMLString(value);
|
|
}
|
|
return value;
|
|
};
|
|
function isHTMLString(value) {
|
|
return Object.prototype.toString.call(value) === "[object HTMLString]";
|
|
}
|
|
|
|
const PROP_TYPE = {
|
|
Value: 0,
|
|
JSON: 1,
|
|
// Actually means Array
|
|
RegExp: 2,
|
|
Date: 3,
|
|
Map: 4,
|
|
Set: 5,
|
|
BigInt: 6,
|
|
URL: 7,
|
|
Uint8Array: 8,
|
|
Uint16Array: 9,
|
|
Uint32Array: 10
|
|
};
|
|
function serializeArray(value, metadata = {}, parents = /* @__PURE__ */ new WeakSet()) {
|
|
if (parents.has(value)) {
|
|
throw new Error(`Cyclic reference detected while serializing props for <${metadata.displayName} client:${metadata.hydrate}>!
|
|
|
|
Cyclic references cannot be safely serialized for client-side usage. Please remove the cyclic reference.`);
|
|
}
|
|
parents.add(value);
|
|
const serialized = value.map((v) => {
|
|
return convertToSerializedForm(v, metadata, parents);
|
|
});
|
|
parents.delete(value);
|
|
return serialized;
|
|
}
|
|
function serializeObject(value, metadata = {}, parents = /* @__PURE__ */ new WeakSet()) {
|
|
if (parents.has(value)) {
|
|
throw new Error(`Cyclic reference detected while serializing props for <${metadata.displayName} client:${metadata.hydrate}>!
|
|
|
|
Cyclic references cannot be safely serialized for client-side usage. Please remove the cyclic reference.`);
|
|
}
|
|
parents.add(value);
|
|
const serialized = Object.fromEntries(
|
|
Object.entries(value).map(([k, v]) => {
|
|
return [k, convertToSerializedForm(v, metadata, parents)];
|
|
})
|
|
);
|
|
parents.delete(value);
|
|
return serialized;
|
|
}
|
|
function convertToSerializedForm(value, metadata = {}, parents = /* @__PURE__ */ new WeakSet()) {
|
|
const tag = Object.prototype.toString.call(value);
|
|
switch (tag) {
|
|
case "[object Date]": {
|
|
return [PROP_TYPE.Date, value.toISOString()];
|
|
}
|
|
case "[object RegExp]": {
|
|
return [PROP_TYPE.RegExp, value.source];
|
|
}
|
|
case "[object Map]": {
|
|
return [PROP_TYPE.Map, serializeArray(Array.from(value), metadata, parents)];
|
|
}
|
|
case "[object Set]": {
|
|
return [PROP_TYPE.Set, serializeArray(Array.from(value), metadata, parents)];
|
|
}
|
|
case "[object BigInt]": {
|
|
return [PROP_TYPE.BigInt, value.toString()];
|
|
}
|
|
case "[object URL]": {
|
|
return [PROP_TYPE.URL, value.toString()];
|
|
}
|
|
case "[object Array]": {
|
|
return [PROP_TYPE.JSON, serializeArray(value, metadata, parents)];
|
|
}
|
|
case "[object Uint8Array]": {
|
|
return [PROP_TYPE.Uint8Array, Array.from(value)];
|
|
}
|
|
case "[object Uint16Array]": {
|
|
return [PROP_TYPE.Uint16Array, Array.from(value)];
|
|
}
|
|
case "[object Uint32Array]": {
|
|
return [PROP_TYPE.Uint32Array, Array.from(value)];
|
|
}
|
|
default: {
|
|
if (value !== null && typeof value === "object") {
|
|
return [PROP_TYPE.Value, serializeObject(value, metadata, parents)];
|
|
} else if (value === void 0) {
|
|
return [PROP_TYPE.Value];
|
|
} else {
|
|
return [PROP_TYPE.Value, value];
|
|
}
|
|
}
|
|
}
|
|
}
|
|
function serializeProps(props, metadata) {
|
|
const serialized = JSON.stringify(serializeObject(props, metadata));
|
|
return serialized;
|
|
}
|
|
|
|
const transitionDirectivesToCopyOnIsland = Object.freeze([
|
|
"data-astro-transition-scope",
|
|
"data-astro-transition-persist"
|
|
]);
|
|
function extractDirectives(inputProps, clientDirectives) {
|
|
let extracted = {
|
|
isPage: false,
|
|
hydration: null,
|
|
props: {}
|
|
};
|
|
for (const [key, value] of Object.entries(inputProps)) {
|
|
if (key.startsWith("server:")) {
|
|
if (key === "server:root") {
|
|
extracted.isPage = true;
|
|
}
|
|
}
|
|
if (key.startsWith("client:")) {
|
|
if (!extracted.hydration) {
|
|
extracted.hydration = {
|
|
directive: "",
|
|
value: "",
|
|
componentUrl: "",
|
|
componentExport: { value: "" }
|
|
};
|
|
}
|
|
switch (key) {
|
|
case "client:component-path": {
|
|
extracted.hydration.componentUrl = value;
|
|
break;
|
|
}
|
|
case "client:component-export": {
|
|
extracted.hydration.componentExport.value = value;
|
|
break;
|
|
}
|
|
case "client:component-hydration": {
|
|
break;
|
|
}
|
|
case "client:display-name": {
|
|
break;
|
|
}
|
|
default: {
|
|
extracted.hydration.directive = key.split(":")[1];
|
|
extracted.hydration.value = value;
|
|
if (!clientDirectives.has(extracted.hydration.directive)) {
|
|
const hydrationMethods = Array.from(clientDirectives.keys()).map((d) => `client:${d}`).join(", ");
|
|
throw new Error(
|
|
`Error: invalid hydration directive "${key}". Supported hydration methods: ${hydrationMethods}`
|
|
);
|
|
}
|
|
if (extracted.hydration.directive === "media" && typeof extracted.hydration.value !== "string") {
|
|
throw new AstroError(MissingMediaQueryDirective);
|
|
}
|
|
break;
|
|
}
|
|
}
|
|
} else if (key === "class:list") {
|
|
if (value) {
|
|
extracted.props[key.slice(0, -5)] = serializeListValue(value);
|
|
}
|
|
} else {
|
|
extracted.props[key] = value;
|
|
}
|
|
}
|
|
for (const sym of Object.getOwnPropertySymbols(inputProps)) {
|
|
extracted.props[sym] = inputProps[sym];
|
|
}
|
|
return extracted;
|
|
}
|
|
async function generateHydrateScript(scriptOptions, metadata) {
|
|
const { renderer, result, astroId, props, attrs } = scriptOptions;
|
|
const { hydrate, componentUrl, componentExport } = metadata;
|
|
if (!componentExport.value) {
|
|
throw new Error(
|
|
`Unable to resolve a valid export for "${metadata.displayName}"! Please open an issue at https://astro.build/issues!`
|
|
);
|
|
}
|
|
const island = {
|
|
children: "",
|
|
props: {
|
|
// This is for HMR, probably can avoid it in prod
|
|
uid: astroId
|
|
}
|
|
};
|
|
if (attrs) {
|
|
for (const [key, value] of Object.entries(attrs)) {
|
|
island.props[key] = escapeHTML(value);
|
|
}
|
|
}
|
|
island.props["component-url"] = await result.resolve(decodeURI(componentUrl));
|
|
if (renderer.clientEntrypoint) {
|
|
island.props["component-export"] = componentExport.value;
|
|
island.props["renderer-url"] = await result.resolve(decodeURI(renderer.clientEntrypoint));
|
|
island.props["props"] = escapeHTML(serializeProps(props, metadata));
|
|
}
|
|
island.props["ssr"] = "";
|
|
island.props["client"] = hydrate;
|
|
let beforeHydrationUrl = await result.resolve("astro:scripts/before-hydration.js");
|
|
if (beforeHydrationUrl.length) {
|
|
island.props["before-hydration-url"] = beforeHydrationUrl;
|
|
}
|
|
island.props["opts"] = escapeHTML(
|
|
JSON.stringify({
|
|
name: metadata.displayName,
|
|
value: metadata.hydrateArgs || ""
|
|
})
|
|
);
|
|
transitionDirectivesToCopyOnIsland.forEach((name) => {
|
|
if (props[name]) {
|
|
island.props[name] = props[name];
|
|
}
|
|
});
|
|
return island;
|
|
}
|
|
|
|
/**
|
|
* shortdash - https://github.com/bibig/node-shorthash
|
|
*
|
|
* @license
|
|
*
|
|
* (The MIT License)
|
|
*
|
|
* Copyright (c) 2013 Bibig <bibig@me.com>
|
|
*
|
|
* Permission is hereby granted, free of charge, to any person
|
|
* obtaining a copy of this software and associated documentation
|
|
* files (the "Software"), to deal in the Software without
|
|
* restriction, including without limitation the rights to use,
|
|
* copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
* copies of the Software, and to permit persons to whom the
|
|
* Software is furnished to do so, subject to the following
|
|
* conditions:
|
|
*
|
|
* The above copyright notice and this permission notice shall be
|
|
* included in all copies or substantial portions of the Software.
|
|
*
|
|
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
|
* EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
|
|
* OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
|
* NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
|
|
* HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
|
|
* WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
|
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
|
|
* OTHER DEALINGS IN THE SOFTWARE.
|
|
*/
|
|
const dictionary = "0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXY";
|
|
const binary = dictionary.length;
|
|
function bitwise(str) {
|
|
let hash = 0;
|
|
if (str.length === 0)
|
|
return hash;
|
|
for (let i = 0; i < str.length; i++) {
|
|
const ch = str.charCodeAt(i);
|
|
hash = (hash << 5) - hash + ch;
|
|
hash = hash & hash;
|
|
}
|
|
return hash;
|
|
}
|
|
function shorthash(text) {
|
|
let num;
|
|
let result = "";
|
|
let integer = bitwise(text);
|
|
const sign = integer < 0 ? "Z" : "";
|
|
integer = Math.abs(integer);
|
|
while (integer >= binary) {
|
|
num = integer % binary;
|
|
integer = Math.floor(integer / binary);
|
|
result = dictionary[num] + result;
|
|
}
|
|
if (integer > 0) {
|
|
result = dictionary[integer] + result;
|
|
}
|
|
return sign + result;
|
|
}
|
|
|
|
function isAstroComponentFactory(obj) {
|
|
return obj == null ? false : obj.isAstroComponentFactory === true;
|
|
}
|
|
function isAPropagatingComponent(result, factory) {
|
|
let hint = factory.propagation || "none";
|
|
if (factory.moduleId && result.componentMetadata.has(factory.moduleId) && hint === "none") {
|
|
hint = result.componentMetadata.get(factory.moduleId).propagation;
|
|
}
|
|
return hint === "in-tree" || hint === "self";
|
|
}
|
|
|
|
const headAndContentSym = Symbol.for("astro.headAndContent");
|
|
function isHeadAndContent(obj) {
|
|
return typeof obj === "object" && !!obj[headAndContentSym];
|
|
}
|
|
|
|
var astro_island_prebuilt_default = `(()=>{var d;{let p={0:t=>u(t),1:t=>l(t),2:t=>new RegExp(t),3:t=>new Date(t),4:t=>new Map(l(t)),5:t=>new Set(l(t)),6:t=>BigInt(t),7:t=>new URL(t),8:t=>new Uint8Array(t),9:t=>new Uint16Array(t),10:t=>new Uint32Array(t)},h=t=>{let[e,n]=t;return e in p?p[e](n):void 0},l=t=>t.map(h),u=t=>typeof t!="object"||t===null?t:Object.fromEntries(Object.entries(t).map(([e,n])=>[e,h(n)]));customElements.get("astro-island")||customElements.define("astro-island",(d=class extends HTMLElement{constructor(){super(...arguments);this.hydrate=async()=>{var i;if(!this.hydrator||!this.isConnected)return;let e=(i=this.parentElement)==null?void 0:i.closest("astro-island[ssr]");if(e){e.addEventListener("astro:hydrate",this.hydrate,{once:!0});return}let n=this.querySelectorAll("astro-slot"),o={},a=this.querySelectorAll("template[data-astro-template]");for(let r of a){let s=r.closest(this.tagName);s!=null&&s.isSameNode(this)&&(o[r.getAttribute("data-astro-template")||"default"]=r.innerHTML,r.remove())}for(let r of n){let s=r.closest(this.tagName);s!=null&&s.isSameNode(this)&&(o[r.getAttribute("name")||"default"]=r.innerHTML)}let c;try{c=this.hasAttribute("props")?u(JSON.parse(this.getAttribute("props"))):{}}catch(r){let s=this.getAttribute("component-url")||"<unknown>",y=this.getAttribute("component-export");throw y&&(s+=\` (export \${y})\`),console.error(\`[hydrate] Error parsing props for component \${s}\`,this.getAttribute("props"),r),r}await this.hydrator(this)(this.Component,c,o,{client:this.getAttribute("client")}),this.removeAttribute("ssr"),this.dispatchEvent(new CustomEvent("astro:hydrate"))}}connectedCallback(){!this.hasAttribute("await-children")||this.firstChild?this.childrenConnectedCallback():new MutationObserver((e,n)=>{n.disconnect(),setTimeout(()=>this.childrenConnectedCallback(),0)}).observe(this,{childList:!0})}async childrenConnectedCallback(){let e=this.getAttribute("before-hydration-url");e&&await import(e),this.start()}start(){let e=JSON.parse(this.getAttribute("opts")),n=this.getAttribute("client");if(Astro[n]===void 0){window.addEventListener(\`astro:\${n}\`,()=>this.start(),{once:!0});return}Astro[n](async()=>{let o=this.getAttribute("renderer-url"),[a,{default:c}]=await Promise.all([import(this.getAttribute("component-url")),o?import(o):()=>()=>{}]),i=this.getAttribute("component-export")||"default";if(!i.includes("."))this.Component=a[i];else{this.Component=a;for(let r of i.split("."))this.Component=this.Component[r]}return this.hydrator=c,this.hydrate},e,this)}attributeChangedCallback(){this.hydrate()}},d.observedAttributes=["props"],d))}})();`;
|
|
|
|
const ISLAND_STYLES = `<style>astro-island,astro-slot,astro-static-slot{display:contents}</style>`;
|
|
function determineIfNeedsHydrationScript(result) {
|
|
if (result._metadata.hasHydrationScript) {
|
|
return false;
|
|
}
|
|
return result._metadata.hasHydrationScript = true;
|
|
}
|
|
function determinesIfNeedsDirectiveScript(result, directive) {
|
|
if (result._metadata.hasDirectives.has(directive)) {
|
|
return false;
|
|
}
|
|
result._metadata.hasDirectives.add(directive);
|
|
return true;
|
|
}
|
|
function getDirectiveScriptText(result, directive) {
|
|
const clientDirectives = result.clientDirectives;
|
|
const clientDirective = clientDirectives.get(directive);
|
|
if (!clientDirective) {
|
|
throw new Error(`Unknown directive: ${directive}`);
|
|
}
|
|
return clientDirective;
|
|
}
|
|
function getPrescripts(result, type, directive) {
|
|
switch (type) {
|
|
case "both":
|
|
return `${ISLAND_STYLES}<script>${getDirectiveScriptText(
|
|
result,
|
|
directive
|
|
)};${astro_island_prebuilt_default}</script>`;
|
|
case "directive":
|
|
return `<script>${getDirectiveScriptText(result, directive)}</script>`;
|
|
}
|
|
return "";
|
|
}
|
|
|
|
const voidElementNames = /^(area|base|br|col|command|embed|hr|img|input|keygen|link|meta|param|source|track|wbr)$/i;
|
|
const htmlBooleanAttributes = /^(allowfullscreen|async|autofocus|autoplay|controls|default|defer|disabled|disablepictureinpicture|disableremoteplayback|formnovalidate|hidden|loop|nomodule|novalidate|open|playsinline|readonly|required|reversed|scoped|seamless|itemscope)$/i;
|
|
const htmlEnumAttributes = /^(contenteditable|draggable|spellcheck|value)$/i;
|
|
const svgEnumAttributes = /^(autoReverse|externalResourcesRequired|focusable|preserveAlpha)$/i;
|
|
const STATIC_DIRECTIVES = /* @__PURE__ */ new Set(["set:html", "set:text"]);
|
|
const toIdent = (k) => k.trim().replace(/(?:(?!^)\b\w|\s+|[^\w]+)/g, (match, index) => {
|
|
if (/[^\w]|\s/.test(match))
|
|
return "";
|
|
return index === 0 ? match : match.toUpperCase();
|
|
});
|
|
const toAttributeString = (value, shouldEscape = true) => shouldEscape ? String(value).replace(/&/g, "&").replace(/"/g, """) : value;
|
|
const kebab = (k) => k.toLowerCase() === k ? k : k.replace(/[A-Z]/g, (match) => `-${match.toLowerCase()}`);
|
|
const toStyleString = (obj) => Object.entries(obj).map(([k, v]) => {
|
|
if (k[0] !== "-" && k[1] !== "-")
|
|
return `${kebab(k)}:${v}`;
|
|
if (kebab(k) !== k)
|
|
return `${kebab(k)}:var(${k});${k}:${v}`;
|
|
return `${k}:${v}`;
|
|
}).join(";");
|
|
function defineScriptVars(vars) {
|
|
var _a;
|
|
let output = "";
|
|
for (const [key, value] of Object.entries(vars)) {
|
|
output += `const ${toIdent(key)} = ${(_a = JSON.stringify(value)) == null ? void 0 : _a.replace(
|
|
/<\/script>/g,
|
|
"\\x3C/script>"
|
|
)};
|
|
`;
|
|
}
|
|
return markHTMLString(output);
|
|
}
|
|
function formatList(values) {
|
|
if (values.length === 1) {
|
|
return values[0];
|
|
}
|
|
return `${values.slice(0, -1).join(", ")} or ${values[values.length - 1]}`;
|
|
}
|
|
function addAttribute(value, key, shouldEscape = true) {
|
|
if (value == null) {
|
|
return "";
|
|
}
|
|
if (value === false) {
|
|
if (htmlEnumAttributes.test(key) || svgEnumAttributes.test(key)) {
|
|
return markHTMLString(` ${key}="false"`);
|
|
}
|
|
return "";
|
|
}
|
|
if (STATIC_DIRECTIVES.has(key)) {
|
|
console.warn(`[astro] The "${key}" directive cannot be applied dynamically at runtime. It will not be rendered as an attribute.
|
|
|
|
Make sure to use the static attribute syntax (\`${key}={value}\`) instead of the dynamic spread syntax (\`{...{ "${key}": value }}\`).`);
|
|
return "";
|
|
}
|
|
if (key === "class:list") {
|
|
const listValue = toAttributeString(serializeListValue(value), shouldEscape);
|
|
if (listValue === "") {
|
|
return "";
|
|
}
|
|
return markHTMLString(` ${key.slice(0, -5)}="${listValue}"`);
|
|
}
|
|
if (key === "style" && !(value instanceof HTMLString)) {
|
|
if (Array.isArray(value) && value.length === 2) {
|
|
return markHTMLString(
|
|
` ${key}="${toAttributeString(`${toStyleString(value[0])};${value[1]}`, shouldEscape)}"`
|
|
);
|
|
}
|
|
if (typeof value === "object") {
|
|
return markHTMLString(` ${key}="${toAttributeString(toStyleString(value), shouldEscape)}"`);
|
|
}
|
|
}
|
|
if (key === "className") {
|
|
return markHTMLString(` class="${toAttributeString(value, shouldEscape)}"`);
|
|
}
|
|
if (value === true && (key.startsWith("data-") || htmlBooleanAttributes.test(key))) {
|
|
return markHTMLString(` ${key}`);
|
|
} else {
|
|
return markHTMLString(` ${key}="${toAttributeString(value, shouldEscape)}"`);
|
|
}
|
|
}
|
|
function internalSpreadAttributes(values, shouldEscape = true) {
|
|
let output = "";
|
|
for (const [key, value] of Object.entries(values)) {
|
|
output += addAttribute(value, key, shouldEscape);
|
|
}
|
|
return markHTMLString(output);
|
|
}
|
|
function renderElement$1(name, { props: _props, children = "" }, shouldEscape = true) {
|
|
const { lang: _, "data-astro-id": astroId, "define:vars": defineVars, ...props } = _props;
|
|
if (defineVars) {
|
|
if (name === "style") {
|
|
delete props["is:global"];
|
|
delete props["is:scoped"];
|
|
}
|
|
if (name === "script") {
|
|
delete props.hoist;
|
|
children = defineScriptVars(defineVars) + "\n" + children;
|
|
}
|
|
}
|
|
if ((children == null || children == "") && voidElementNames.test(name)) {
|
|
return `<${name}${internalSpreadAttributes(props, shouldEscape)} />`;
|
|
}
|
|
return `<${name}${internalSpreadAttributes(props, shouldEscape)}>${children}</${name}>`;
|
|
}
|
|
|
|
const uniqueElements = (item, index, all) => {
|
|
const props = JSON.stringify(item.props);
|
|
const children = item.children;
|
|
return index === all.findIndex((i) => JSON.stringify(i.props) === props && i.children == children);
|
|
};
|
|
function renderAllHeadContent(result) {
|
|
result._metadata.hasRenderedHead = true;
|
|
const styles = Array.from(result.styles).filter(uniqueElements).map(
|
|
(style) => style.props.rel === "stylesheet" ? renderElement$1("link", style) : renderElement$1("style", style)
|
|
);
|
|
result.styles.clear();
|
|
const scripts = Array.from(result.scripts).filter(uniqueElements).map((script) => {
|
|
return renderElement$1("script", script, false);
|
|
});
|
|
const links = Array.from(result.links).filter(uniqueElements).map((link) => renderElement$1("link", link, false));
|
|
let content = links.join("\n") + styles.join("\n") + scripts.join("\n");
|
|
if (result._metadata.extraHead.length > 0) {
|
|
for (const part of result._metadata.extraHead) {
|
|
content += part;
|
|
}
|
|
}
|
|
return markHTMLString(content);
|
|
}
|
|
function* renderHead() {
|
|
yield { type: "head" };
|
|
}
|
|
function* maybeRenderHead() {
|
|
yield { type: "maybe-head" };
|
|
}
|
|
|
|
const slotString = Symbol.for("astro:slot-string");
|
|
class SlotString extends HTMLString {
|
|
constructor(content, instructions) {
|
|
super(content);
|
|
this.instructions = instructions;
|
|
this[slotString] = true;
|
|
}
|
|
}
|
|
function isSlotString(str) {
|
|
return !!str[slotString];
|
|
}
|
|
function renderSlot(result, slotted, fallback) {
|
|
if (!slotted && fallback) {
|
|
return renderSlot(result, fallback);
|
|
}
|
|
return {
|
|
async render(destination) {
|
|
await renderChild(destination, typeof slotted === "function" ? slotted(result) : slotted);
|
|
}
|
|
};
|
|
}
|
|
async function renderSlotToString(result, slotted, fallback) {
|
|
let content = "";
|
|
let instructions = null;
|
|
const temporaryDestination = {
|
|
write(chunk) {
|
|
if (chunk instanceof Response)
|
|
return;
|
|
if (typeof chunk === "object" && "type" in chunk && typeof chunk.type === "string") {
|
|
if (instructions === null) {
|
|
instructions = [];
|
|
}
|
|
instructions.push(chunk);
|
|
} else {
|
|
content += chunkToString(result, chunk);
|
|
}
|
|
}
|
|
};
|
|
const renderInstance = renderSlot(result, slotted, fallback);
|
|
await renderInstance.render(temporaryDestination);
|
|
return markHTMLString(new SlotString(content, instructions));
|
|
}
|
|
async function renderSlots(result, slots = {}) {
|
|
let slotInstructions = null;
|
|
let children = {};
|
|
if (slots) {
|
|
await Promise.all(
|
|
Object.entries(slots).map(
|
|
([key, value]) => renderSlotToString(result, value).then((output) => {
|
|
if (output.instructions) {
|
|
if (slotInstructions === null) {
|
|
slotInstructions = [];
|
|
}
|
|
slotInstructions.push(...output.instructions);
|
|
}
|
|
children[key] = output;
|
|
})
|
|
)
|
|
);
|
|
}
|
|
return { slotInstructions, children };
|
|
}
|
|
|
|
const Fragment = Symbol.for("astro:fragment");
|
|
const Renderer = Symbol.for("astro:renderer");
|
|
new TextEncoder();
|
|
const decoder = new TextDecoder();
|
|
function stringifyChunk(result, chunk) {
|
|
if (typeof chunk.type === "string") {
|
|
const instruction = chunk;
|
|
switch (instruction.type) {
|
|
case "directive": {
|
|
const { hydration } = instruction;
|
|
let needsHydrationScript = hydration && determineIfNeedsHydrationScript(result);
|
|
let needsDirectiveScript = hydration && determinesIfNeedsDirectiveScript(result, hydration.directive);
|
|
let prescriptType = needsHydrationScript ? "both" : needsDirectiveScript ? "directive" : null;
|
|
if (prescriptType) {
|
|
let prescripts = getPrescripts(result, prescriptType, hydration.directive);
|
|
return markHTMLString(prescripts);
|
|
} else {
|
|
return "";
|
|
}
|
|
}
|
|
case "head": {
|
|
if (result._metadata.hasRenderedHead) {
|
|
return "";
|
|
}
|
|
return renderAllHeadContent(result);
|
|
}
|
|
case "maybe-head": {
|
|
if (result._metadata.hasRenderedHead || result._metadata.headInTree) {
|
|
return "";
|
|
}
|
|
return renderAllHeadContent(result);
|
|
}
|
|
default: {
|
|
if (chunk instanceof Response) {
|
|
return "";
|
|
}
|
|
throw new Error(`Unknown chunk type: ${chunk.type}`);
|
|
}
|
|
}
|
|
} else {
|
|
if (isSlotString(chunk)) {
|
|
let out = "";
|
|
const c = chunk;
|
|
if (c.instructions) {
|
|
for (const instr of c.instructions) {
|
|
out += stringifyChunk(result, instr);
|
|
}
|
|
}
|
|
out += chunk.toString();
|
|
return out;
|
|
}
|
|
return chunk.toString();
|
|
}
|
|
}
|
|
function chunkToString(result, chunk) {
|
|
if (ArrayBuffer.isView(chunk)) {
|
|
return decoder.decode(chunk);
|
|
} else {
|
|
return stringifyChunk(result, chunk);
|
|
}
|
|
}
|
|
function isRenderInstance(obj) {
|
|
return !!obj && typeof obj === "object" && "render" in obj && typeof obj.render === "function";
|
|
}
|
|
|
|
async function renderChild(destination, child) {
|
|
child = await child;
|
|
if (child instanceof SlotString) {
|
|
destination.write(child);
|
|
} else if (isHTMLString(child)) {
|
|
destination.write(child);
|
|
} else if (Array.isArray(child)) {
|
|
for (const c of child) {
|
|
await renderChild(destination, c);
|
|
}
|
|
} else if (typeof child === "function") {
|
|
await renderChild(destination, child());
|
|
} else if (typeof child === "string") {
|
|
destination.write(markHTMLString(escapeHTML(child)));
|
|
} else if (!child && child !== 0) ; else if (isRenderInstance(child)) {
|
|
await child.render(destination);
|
|
} else if (isRenderTemplateResult(child)) {
|
|
await child.render(destination);
|
|
} else if (isAstroComponentInstance(child)) {
|
|
await child.render(destination);
|
|
} else if (ArrayBuffer.isView(child)) {
|
|
destination.write(child);
|
|
} else if (typeof child === "object" && (Symbol.asyncIterator in child || Symbol.iterator in child)) {
|
|
for await (const value of child) {
|
|
await renderChild(destination, value);
|
|
}
|
|
} else {
|
|
destination.write(child);
|
|
}
|
|
}
|
|
|
|
var _a$1;
|
|
const astroComponentInstanceSym = Symbol.for("astro.componentInstance");
|
|
class AstroComponentInstance {
|
|
constructor(result, props, slots, factory) {
|
|
this[_a$1] = true;
|
|
this.result = result;
|
|
this.props = props;
|
|
this.factory = factory;
|
|
this.slotValues = {};
|
|
for (const name in slots) {
|
|
const value = slots[name](result);
|
|
this.slotValues[name] = () => value;
|
|
}
|
|
}
|
|
async init(result) {
|
|
if (this.returnValue !== void 0)
|
|
return this.returnValue;
|
|
this.returnValue = this.factory(result, this.props, this.slotValues);
|
|
return this.returnValue;
|
|
}
|
|
async render(destination) {
|
|
if (this.returnValue === void 0) {
|
|
await this.init(this.result);
|
|
}
|
|
let value = this.returnValue;
|
|
if (isPromise(value)) {
|
|
value = await value;
|
|
}
|
|
if (isHeadAndContent(value)) {
|
|
await value.content.render(destination);
|
|
} else {
|
|
await renderChild(destination, value);
|
|
}
|
|
}
|
|
}
|
|
_a$1 = astroComponentInstanceSym;
|
|
function validateComponentProps(props, displayName) {
|
|
if (props != null) {
|
|
for (const prop of Object.keys(props)) {
|
|
if (prop.startsWith("client:")) {
|
|
console.warn(
|
|
`You are attempting to render <${displayName} ${prop} />, but ${displayName} is an Astro component. Astro components do not render in the client and should not have a hydration directive. Please use a framework component for client rendering.`
|
|
);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
function createAstroComponentInstance(result, displayName, factory, props, slots = {}) {
|
|
validateComponentProps(props, displayName);
|
|
const instance = new AstroComponentInstance(result, props, slots, factory);
|
|
if (isAPropagatingComponent(result, factory) && !result._metadata.propagators.has(factory)) {
|
|
result._metadata.propagators.set(factory, instance);
|
|
}
|
|
return instance;
|
|
}
|
|
function isAstroComponentInstance(obj) {
|
|
return typeof obj === "object" && !!obj[astroComponentInstanceSym];
|
|
}
|
|
|
|
var _a;
|
|
const renderTemplateResultSym = Symbol.for("astro.renderTemplateResult");
|
|
class RenderTemplateResult {
|
|
constructor(htmlParts, expressions) {
|
|
this[_a] = true;
|
|
this.htmlParts = htmlParts;
|
|
this.error = void 0;
|
|
this.expressions = expressions.map((expression) => {
|
|
if (isPromise(expression)) {
|
|
return Promise.resolve(expression).catch((err) => {
|
|
if (!this.error) {
|
|
this.error = err;
|
|
throw err;
|
|
}
|
|
});
|
|
}
|
|
return expression;
|
|
});
|
|
}
|
|
async render(destination) {
|
|
for (let i = 0; i < this.htmlParts.length; i++) {
|
|
const html = this.htmlParts[i];
|
|
const exp = this.expressions[i];
|
|
destination.write(markHTMLString(html));
|
|
if (exp || exp === 0) {
|
|
await renderChild(destination, exp);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
_a = renderTemplateResultSym;
|
|
function isRenderTemplateResult(obj) {
|
|
return typeof obj === "object" && !!obj[renderTemplateResultSym];
|
|
}
|
|
function renderTemplate(htmlParts, ...expressions) {
|
|
return new RenderTemplateResult(htmlParts, expressions);
|
|
}
|
|
|
|
async function renderToString(result, componentFactory, props, children, isPage = false, route) {
|
|
const templateResult = await callComponentAsTemplateResultOrResponse(
|
|
result,
|
|
componentFactory,
|
|
props,
|
|
children,
|
|
route
|
|
);
|
|
if (templateResult instanceof Response)
|
|
return templateResult;
|
|
let str = "";
|
|
let renderedFirstPageChunk = false;
|
|
const destination = {
|
|
write(chunk) {
|
|
if (isPage && !renderedFirstPageChunk) {
|
|
renderedFirstPageChunk = true;
|
|
if (!/<!doctype html/i.test(String(chunk))) {
|
|
const doctype = result.compressHTML ? "<!DOCTYPE html>" : "<!DOCTYPE html>\n";
|
|
str += doctype;
|
|
}
|
|
}
|
|
if (chunk instanceof Response)
|
|
return;
|
|
str += chunkToString(result, chunk);
|
|
}
|
|
};
|
|
await templateResult.render(destination);
|
|
return str;
|
|
}
|
|
async function callComponentAsTemplateResultOrResponse(result, componentFactory, props, children, route) {
|
|
const factoryResult = await componentFactory(result, props, children);
|
|
if (factoryResult instanceof Response) {
|
|
return factoryResult;
|
|
} else if (!isRenderTemplateResult(factoryResult)) {
|
|
throw new AstroError({
|
|
...OnlyResponseCanBeReturned,
|
|
message: OnlyResponseCanBeReturned.message(route == null ? void 0 : route.route, typeof factoryResult),
|
|
location: {
|
|
file: route == null ? void 0 : route.component
|
|
}
|
|
});
|
|
}
|
|
return isHeadAndContent(factoryResult) ? factoryResult.content : factoryResult;
|
|
}
|
|
|
|
function componentIsHTMLElement(Component) {
|
|
return typeof HTMLElement !== "undefined" && HTMLElement.isPrototypeOf(Component);
|
|
}
|
|
async function renderHTMLElement(result, constructor, props, slots) {
|
|
const name = getHTMLElementName(constructor);
|
|
let attrHTML = "";
|
|
for (const attr in props) {
|
|
attrHTML += ` ${attr}="${toAttributeString(await props[attr])}"`;
|
|
}
|
|
return markHTMLString(
|
|
`<${name}${attrHTML}>${await renderSlotToString(result, slots == null ? void 0 : slots.default)}</${name}>`
|
|
);
|
|
}
|
|
function getHTMLElementName(constructor) {
|
|
const definedName = customElements.getName(constructor);
|
|
if (definedName)
|
|
return definedName;
|
|
const assignedName = constructor.name.replace(/^HTML|Element$/g, "").replace(/[A-Z]/g, "-$&").toLowerCase().replace(/^-/, "html-");
|
|
return assignedName;
|
|
}
|
|
|
|
const needsHeadRenderingSymbol = Symbol.for("astro.needsHeadRendering");
|
|
const rendererAliases = /* @__PURE__ */ new Map([["solid", "solid-js"]]);
|
|
function guessRenderers(componentUrl) {
|
|
const extname = componentUrl == null ? void 0 : componentUrl.split(".").pop();
|
|
switch (extname) {
|
|
case "svelte":
|
|
return ["@astrojs/svelte"];
|
|
case "vue":
|
|
return ["@astrojs/vue"];
|
|
case "jsx":
|
|
case "tsx":
|
|
return ["@astrojs/react", "@astrojs/preact", "@astrojs/solid-js", "@astrojs/vue (jsx)"];
|
|
default:
|
|
return [
|
|
"@astrojs/react",
|
|
"@astrojs/preact",
|
|
"@astrojs/solid-js",
|
|
"@astrojs/vue",
|
|
"@astrojs/svelte",
|
|
"@astrojs/lit"
|
|
];
|
|
}
|
|
}
|
|
function isFragmentComponent(Component) {
|
|
return Component === Fragment;
|
|
}
|
|
function isHTMLComponent(Component) {
|
|
return Component && Component["astro:html"] === true;
|
|
}
|
|
const ASTRO_SLOT_EXP = /\<\/?astro-slot\b[^>]*>/g;
|
|
const ASTRO_STATIC_SLOT_EXP = /\<\/?astro-static-slot\b[^>]*>/g;
|
|
function removeStaticAstroSlot(html, supportsAstroStaticSlot) {
|
|
const exp = supportsAstroStaticSlot ? ASTRO_STATIC_SLOT_EXP : ASTRO_SLOT_EXP;
|
|
return html.replace(exp, "");
|
|
}
|
|
async function renderFrameworkComponent(result, displayName, Component, _props, slots = {}) {
|
|
var _a, _b, _c;
|
|
if (!Component && !_props["client:only"]) {
|
|
throw new Error(
|
|
`Unable to render ${displayName} because it is ${Component}!
|
|
Did you forget to import the component or is it possible there is a typo?`
|
|
);
|
|
}
|
|
const { renderers, clientDirectives } = result;
|
|
const metadata = {
|
|
astroStaticSlot: true,
|
|
displayName
|
|
};
|
|
const { hydration, isPage, props } = extractDirectives(_props, clientDirectives);
|
|
let html = "";
|
|
let attrs = void 0;
|
|
if (hydration) {
|
|
metadata.hydrate = hydration.directive;
|
|
metadata.hydrateArgs = hydration.value;
|
|
metadata.componentExport = hydration.componentExport;
|
|
metadata.componentUrl = hydration.componentUrl;
|
|
}
|
|
const probableRendererNames = guessRenderers(metadata.componentUrl);
|
|
const validRenderers = renderers.filter((r) => r.name !== "astro:jsx");
|
|
const { children, slotInstructions } = await renderSlots(result, slots);
|
|
let renderer;
|
|
if (metadata.hydrate !== "only") {
|
|
let isTagged = false;
|
|
try {
|
|
isTagged = Component && Component[Renderer];
|
|
} catch {
|
|
}
|
|
if (isTagged) {
|
|
const rendererName = Component[Renderer];
|
|
renderer = renderers.find(({ name }) => name === rendererName);
|
|
}
|
|
if (!renderer) {
|
|
let error;
|
|
for (const r of renderers) {
|
|
try {
|
|
if (await r.ssr.check.call({ result }, Component, props, children)) {
|
|
renderer = r;
|
|
break;
|
|
}
|
|
} catch (e) {
|
|
error ??= e;
|
|
}
|
|
}
|
|
if (!renderer && error) {
|
|
throw error;
|
|
}
|
|
}
|
|
if (!renderer && typeof HTMLElement === "function" && componentIsHTMLElement(Component)) {
|
|
const output = await renderHTMLElement(
|
|
result,
|
|
Component,
|
|
_props,
|
|
slots
|
|
);
|
|
return {
|
|
render(destination) {
|
|
destination.write(output);
|
|
}
|
|
};
|
|
}
|
|
} else {
|
|
if (metadata.hydrateArgs) {
|
|
const passedName = metadata.hydrateArgs;
|
|
const rendererName = rendererAliases.has(passedName) ? rendererAliases.get(passedName) : passedName;
|
|
renderer = renderers.find(
|
|
({ name }) => name === `@astrojs/${rendererName}` || name === rendererName
|
|
);
|
|
}
|
|
if (!renderer && validRenderers.length === 1) {
|
|
renderer = validRenderers[0];
|
|
}
|
|
if (!renderer) {
|
|
const extname = (_a = metadata.componentUrl) == null ? void 0 : _a.split(".").pop();
|
|
renderer = renderers.filter(
|
|
({ name }) => name === `@astrojs/${extname}` || name === extname
|
|
)[0];
|
|
}
|
|
}
|
|
if (!renderer) {
|
|
if (metadata.hydrate === "only") {
|
|
throw new AstroError({
|
|
...NoClientOnlyHint,
|
|
message: NoClientOnlyHint.message(metadata.displayName),
|
|
hint: NoClientOnlyHint.hint(
|
|
probableRendererNames.map((r) => r.replace("@astrojs/", "")).join("|")
|
|
)
|
|
});
|
|
} else if (typeof Component !== "string") {
|
|
const matchingRenderers = validRenderers.filter(
|
|
(r) => probableRendererNames.includes(r.name)
|
|
);
|
|
const plural = validRenderers.length > 1;
|
|
if (matchingRenderers.length === 0) {
|
|
throw new AstroError({
|
|
...NoMatchingRenderer,
|
|
message: NoMatchingRenderer.message(
|
|
metadata.displayName,
|
|
(_b = metadata == null ? void 0 : metadata.componentUrl) == null ? void 0 : _b.split(".").pop(),
|
|
plural,
|
|
validRenderers.length
|
|
),
|
|
hint: NoMatchingRenderer.hint(
|
|
formatList(probableRendererNames.map((r) => "`" + r + "`"))
|
|
)
|
|
});
|
|
} else if (matchingRenderers.length === 1) {
|
|
renderer = matchingRenderers[0];
|
|
({ html, attrs } = await renderer.ssr.renderToStaticMarkup.call(
|
|
{ result },
|
|
Component,
|
|
props,
|
|
children,
|
|
metadata
|
|
));
|
|
} else {
|
|
throw new Error(`Unable to render ${metadata.displayName}!
|
|
|
|
This component likely uses ${formatList(probableRendererNames)},
|
|
but Astro encountered an error during server-side rendering.
|
|
|
|
Please ensure that ${metadata.displayName}:
|
|
1. Does not unconditionally access browser-specific globals like \`window\` or \`document\`.
|
|
If this is unavoidable, use the \`client:only\` hydration directive.
|
|
2. Does not conditionally return \`null\` or \`undefined\` when rendered on the server.
|
|
|
|
If you're still stuck, please open an issue on GitHub or join us at https://astro.build/chat.`);
|
|
}
|
|
}
|
|
} else {
|
|
if (metadata.hydrate === "only") {
|
|
html = await renderSlotToString(result, slots == null ? void 0 : slots.fallback);
|
|
} else {
|
|
({ html, attrs } = await renderer.ssr.renderToStaticMarkup.call(
|
|
{ result },
|
|
Component,
|
|
props,
|
|
children,
|
|
metadata
|
|
));
|
|
}
|
|
}
|
|
if (renderer && !renderer.clientEntrypoint && renderer.name !== "@astrojs/lit" && metadata.hydrate) {
|
|
throw new AstroError({
|
|
...NoClientEntrypoint,
|
|
message: NoClientEntrypoint.message(
|
|
displayName,
|
|
metadata.hydrate,
|
|
renderer.name
|
|
)
|
|
});
|
|
}
|
|
if (!html && typeof Component === "string") {
|
|
const Tag = sanitizeElementName(Component);
|
|
const childSlots = Object.values(children).join("");
|
|
const renderTemplateResult = renderTemplate`<${Tag}${internalSpreadAttributes(
|
|
props
|
|
)}${markHTMLString(
|
|
childSlots === "" && voidElementNames.test(Tag) ? `/>` : `>${childSlots}</${Tag}>`
|
|
)}`;
|
|
html = "";
|
|
const destination = {
|
|
write(chunk) {
|
|
if (chunk instanceof Response)
|
|
return;
|
|
html += chunkToString(result, chunk);
|
|
}
|
|
};
|
|
await renderTemplateResult.render(destination);
|
|
}
|
|
if (!hydration) {
|
|
return {
|
|
render(destination) {
|
|
var _a2;
|
|
if (slotInstructions) {
|
|
for (const instruction of slotInstructions) {
|
|
destination.write(instruction);
|
|
}
|
|
}
|
|
if (isPage || (renderer == null ? void 0 : renderer.name) === "astro:jsx") {
|
|
destination.write(html);
|
|
} else if (html && html.length > 0) {
|
|
destination.write(
|
|
markHTMLString(
|
|
removeStaticAstroSlot(html, ((_a2 = renderer == null ? void 0 : renderer.ssr) == null ? void 0 : _a2.supportsAstroStaticSlot) ?? false)
|
|
)
|
|
);
|
|
}
|
|
}
|
|
};
|
|
}
|
|
const astroId = shorthash(
|
|
`<!--${metadata.componentExport.value}:${metadata.componentUrl}-->
|
|
${html}
|
|
${serializeProps(
|
|
props,
|
|
metadata
|
|
)}`
|
|
);
|
|
const island = await generateHydrateScript(
|
|
{ renderer, result, astroId, props, attrs },
|
|
metadata
|
|
);
|
|
let unrenderedSlots = [];
|
|
if (html) {
|
|
if (Object.keys(children).length > 0) {
|
|
for (const key of Object.keys(children)) {
|
|
let tagName = ((_c = renderer == null ? void 0 : renderer.ssr) == null ? void 0 : _c.supportsAstroStaticSlot) ? !!metadata.hydrate ? "astro-slot" : "astro-static-slot" : "astro-slot";
|
|
let expectedHTML = key === "default" ? `<${tagName}>` : `<${tagName} name="${key}">`;
|
|
if (!html.includes(expectedHTML)) {
|
|
unrenderedSlots.push(key);
|
|
}
|
|
}
|
|
}
|
|
} else {
|
|
unrenderedSlots = Object.keys(children);
|
|
}
|
|
const template = unrenderedSlots.length > 0 ? unrenderedSlots.map(
|
|
(key) => `<template data-astro-template${key !== "default" ? `="${key}"` : ""}>${children[key]}</template>`
|
|
).join("") : "";
|
|
island.children = `${html ?? ""}${template}`;
|
|
if (island.children) {
|
|
island.props["await-children"] = "";
|
|
}
|
|
return {
|
|
render(destination) {
|
|
if (slotInstructions) {
|
|
for (const instruction of slotInstructions) {
|
|
destination.write(instruction);
|
|
}
|
|
}
|
|
destination.write({ type: "directive", hydration });
|
|
destination.write(markHTMLString(renderElement$1("astro-island", island, false)));
|
|
}
|
|
};
|
|
}
|
|
function sanitizeElementName(tag) {
|
|
const unsafe = /[&<>'"\s]+/g;
|
|
if (!unsafe.test(tag))
|
|
return tag;
|
|
return tag.trim().split(unsafe)[0].trim();
|
|
}
|
|
async function renderFragmentComponent(result, slots = {}) {
|
|
const children = await renderSlotToString(result, slots == null ? void 0 : slots.default);
|
|
return {
|
|
render(destination) {
|
|
if (children == null)
|
|
return;
|
|
destination.write(children);
|
|
}
|
|
};
|
|
}
|
|
async function renderHTMLComponent(result, Component, _props, slots = {}) {
|
|
const { slotInstructions, children } = await renderSlots(result, slots);
|
|
const html = Component({ slots: children });
|
|
const hydrationHtml = slotInstructions ? slotInstructions.map((instr) => chunkToString(result, instr)).join("") : "";
|
|
return {
|
|
render(destination) {
|
|
destination.write(markHTMLString(hydrationHtml + html));
|
|
}
|
|
};
|
|
}
|
|
function renderAstroComponent(result, displayName, Component, props, slots = {}) {
|
|
const instance = createAstroComponentInstance(result, displayName, Component, props, slots);
|
|
const bufferChunks = [];
|
|
const bufferDestination = {
|
|
write: (chunk) => bufferChunks.push(chunk)
|
|
};
|
|
const renderPromise = instance.render(bufferDestination);
|
|
return {
|
|
async render(destination) {
|
|
for (const chunk of bufferChunks) {
|
|
destination.write(chunk);
|
|
}
|
|
bufferChunks.length = 0;
|
|
bufferDestination.write = (chunk) => destination.write(chunk);
|
|
await renderPromise;
|
|
}
|
|
};
|
|
}
|
|
async function renderComponent(result, displayName, Component, props, slots = {}) {
|
|
if (isPromise(Component)) {
|
|
Component = await Component;
|
|
}
|
|
if (isFragmentComponent(Component)) {
|
|
return await renderFragmentComponent(result, slots);
|
|
}
|
|
if (isHTMLComponent(Component)) {
|
|
return await renderHTMLComponent(result, Component, props, slots);
|
|
}
|
|
if (isAstroComponentFactory(Component)) {
|
|
return renderAstroComponent(result, displayName, Component, props, slots);
|
|
}
|
|
return await renderFrameworkComponent(result, displayName, Component, props, slots);
|
|
}
|
|
async function renderComponentToString(result, displayName, Component, props, slots = {}, isPage = false, route) {
|
|
let str = "";
|
|
let renderedFirstPageChunk = false;
|
|
let head = "";
|
|
if (nonAstroPageNeedsHeadInjection(Component)) {
|
|
for (const headChunk of maybeRenderHead()) {
|
|
head += chunkToString(result, headChunk);
|
|
}
|
|
}
|
|
try {
|
|
const destination = {
|
|
write(chunk) {
|
|
if (isPage && !renderedFirstPageChunk) {
|
|
renderedFirstPageChunk = true;
|
|
if (!/<!doctype html/i.test(String(chunk))) {
|
|
const doctype = result.compressHTML ? "<!DOCTYPE html>" : "<!DOCTYPE html>\n";
|
|
str += doctype + head;
|
|
}
|
|
}
|
|
if (chunk instanceof Response)
|
|
return;
|
|
str += chunkToString(result, chunk);
|
|
}
|
|
};
|
|
const renderInstance = await renderComponent(result, displayName, Component, props, slots);
|
|
await renderInstance.render(destination);
|
|
} catch (e) {
|
|
if (AstroError.is(e) && !e.loc) {
|
|
e.setLocation({
|
|
file: route == null ? void 0 : route.component
|
|
});
|
|
}
|
|
throw e;
|
|
}
|
|
return str;
|
|
}
|
|
function nonAstroPageNeedsHeadInjection(pageComponent) {
|
|
return !!(pageComponent == null ? void 0 : pageComponent[needsHeadRenderingSymbol]);
|
|
}
|
|
|
|
const ClientOnlyPlaceholder = "astro-client-only";
|
|
class Skip {
|
|
constructor(vnode) {
|
|
this.vnode = vnode;
|
|
this.count = 0;
|
|
}
|
|
increment() {
|
|
this.count++;
|
|
}
|
|
haveNoTried() {
|
|
return this.count === 0;
|
|
}
|
|
isCompleted() {
|
|
return this.count > 2;
|
|
}
|
|
}
|
|
Skip.symbol = Symbol("astro:jsx:skip");
|
|
let originalConsoleError;
|
|
let consoleFilterRefs = 0;
|
|
async function renderJSX(result, vnode) {
|
|
switch (true) {
|
|
case vnode instanceof HTMLString:
|
|
if (vnode.toString().trim() === "") {
|
|
return "";
|
|
}
|
|
return vnode;
|
|
case typeof vnode === "string":
|
|
return markHTMLString(escapeHTML(vnode));
|
|
case typeof vnode === "function":
|
|
return vnode;
|
|
case (!vnode && vnode !== 0):
|
|
return "";
|
|
case Array.isArray(vnode):
|
|
return markHTMLString(
|
|
(await Promise.all(vnode.map((v) => renderJSX(result, v)))).join("")
|
|
);
|
|
}
|
|
let skip;
|
|
if (vnode.props) {
|
|
if (vnode.props[Skip.symbol]) {
|
|
skip = vnode.props[Skip.symbol];
|
|
} else {
|
|
skip = new Skip(vnode);
|
|
}
|
|
} else {
|
|
skip = new Skip(vnode);
|
|
}
|
|
return renderJSXVNode(result, vnode, skip);
|
|
}
|
|
async function renderJSXVNode(result, vnode, skip) {
|
|
if (isVNode(vnode)) {
|
|
switch (true) {
|
|
case !vnode.type: {
|
|
throw new Error(`Unable to render ${result.pathname} because it contains an undefined Component!
|
|
Did you forget to import the component or is it possible there is a typo?`);
|
|
}
|
|
case vnode.type === Symbol.for("astro:fragment"):
|
|
return renderJSX(result, vnode.props.children);
|
|
case vnode.type.isAstroComponentFactory: {
|
|
let props = {};
|
|
let slots = {};
|
|
for (const [key, value] of Object.entries(vnode.props ?? {})) {
|
|
if (key === "children" || value && typeof value === "object" && value["$$slot"]) {
|
|
slots[key === "children" ? "default" : key] = () => renderJSX(result, value);
|
|
} else {
|
|
props[key] = value;
|
|
}
|
|
}
|
|
const str = await renderToString(result, vnode.type, props, slots);
|
|
if (str instanceof Response) {
|
|
throw str;
|
|
}
|
|
const html = markHTMLString(str);
|
|
return html;
|
|
}
|
|
case (!vnode.type && vnode.type !== 0):
|
|
return "";
|
|
case (typeof vnode.type === "string" && vnode.type !== ClientOnlyPlaceholder):
|
|
return markHTMLString(await renderElement(result, vnode.type, vnode.props ?? {}));
|
|
}
|
|
if (vnode.type) {
|
|
let extractSlots2 = function(child) {
|
|
if (Array.isArray(child)) {
|
|
return child.map((c) => extractSlots2(c));
|
|
}
|
|
if (!isVNode(child)) {
|
|
_slots.default.push(child);
|
|
return;
|
|
}
|
|
if ("slot" in child.props) {
|
|
_slots[child.props.slot] = [..._slots[child.props.slot] ?? [], child];
|
|
delete child.props.slot;
|
|
return;
|
|
}
|
|
_slots.default.push(child);
|
|
};
|
|
if (typeof vnode.type === "function" && vnode.type["astro:renderer"]) {
|
|
skip.increment();
|
|
}
|
|
if (typeof vnode.type === "function" && vnode.props["server:root"]) {
|
|
const output2 = await vnode.type(vnode.props ?? {});
|
|
return await renderJSX(result, output2);
|
|
}
|
|
if (typeof vnode.type === "function") {
|
|
if (skip.haveNoTried() || skip.isCompleted()) {
|
|
useConsoleFilter();
|
|
try {
|
|
const output2 = await vnode.type(vnode.props ?? {});
|
|
let renderResult;
|
|
if (output2 == null ? void 0 : output2[AstroJSX]) {
|
|
renderResult = await renderJSXVNode(result, output2, skip);
|
|
return renderResult;
|
|
} else if (!output2) {
|
|
renderResult = await renderJSXVNode(result, output2, skip);
|
|
return renderResult;
|
|
}
|
|
} catch (e) {
|
|
if (skip.isCompleted()) {
|
|
throw e;
|
|
}
|
|
skip.increment();
|
|
} finally {
|
|
finishUsingConsoleFilter();
|
|
}
|
|
} else {
|
|
skip.increment();
|
|
}
|
|
}
|
|
const { children = null, ...props } = vnode.props ?? {};
|
|
const _slots = {
|
|
default: []
|
|
};
|
|
extractSlots2(children);
|
|
for (const [key, value] of Object.entries(props)) {
|
|
if (value["$$slot"]) {
|
|
_slots[key] = value;
|
|
delete props[key];
|
|
}
|
|
}
|
|
const slotPromises = [];
|
|
const slots = {};
|
|
for (const [key, value] of Object.entries(_slots)) {
|
|
slotPromises.push(
|
|
renderJSX(result, value).then((output2) => {
|
|
if (output2.toString().trim().length === 0)
|
|
return;
|
|
slots[key] = () => output2;
|
|
})
|
|
);
|
|
}
|
|
await Promise.all(slotPromises);
|
|
props[Skip.symbol] = skip;
|
|
let output;
|
|
if (vnode.type === ClientOnlyPlaceholder && vnode.props["client:only"]) {
|
|
output = await renderComponentToString(
|
|
result,
|
|
vnode.props["client:display-name"] ?? "",
|
|
null,
|
|
props,
|
|
slots
|
|
);
|
|
} else {
|
|
output = await renderComponentToString(
|
|
result,
|
|
typeof vnode.type === "function" ? vnode.type.name : vnode.type,
|
|
vnode.type,
|
|
props,
|
|
slots
|
|
);
|
|
}
|
|
return markHTMLString(output);
|
|
}
|
|
}
|
|
return markHTMLString(`${vnode}`);
|
|
}
|
|
async function renderElement(result, tag, { children, ...props }) {
|
|
return markHTMLString(
|
|
`<${tag}${spreadAttributes(props)}${markHTMLString(
|
|
(children == null || children == "") && voidElementNames.test(tag) ? `/>` : `>${children == null ? "" : await renderJSX(result, prerenderElementChildren(tag, children))}</${tag}>`
|
|
)}`
|
|
);
|
|
}
|
|
function prerenderElementChildren(tag, children) {
|
|
if (typeof children === "string" && (tag === "style" || tag === "script")) {
|
|
return markHTMLString(children);
|
|
} else {
|
|
return children;
|
|
}
|
|
}
|
|
function useConsoleFilter() {
|
|
consoleFilterRefs++;
|
|
if (!originalConsoleError) {
|
|
originalConsoleError = console.error;
|
|
try {
|
|
console.error = filteredConsoleError;
|
|
} catch (error) {
|
|
}
|
|
}
|
|
}
|
|
function finishUsingConsoleFilter() {
|
|
consoleFilterRefs--;
|
|
}
|
|
function filteredConsoleError(msg, ...rest) {
|
|
if (consoleFilterRefs > 0 && typeof msg === "string") {
|
|
const isKnownReactHookError = msg.includes("Warning: Invalid hook call.") && msg.includes("https://reactjs.org/link/invalid-hook-call");
|
|
if (isKnownReactHookError)
|
|
return;
|
|
}
|
|
originalConsoleError(msg, ...rest);
|
|
}
|
|
|
|
typeof process === "object" && Object.prototype.toString.call(process) === "[object process]";
|
|
|
|
function spreadAttributes(values = {}, _name, { class: scopedClassName } = {}) {
|
|
let output = "";
|
|
if (scopedClassName) {
|
|
if (typeof values.class !== "undefined") {
|
|
values.class += ` ${scopedClassName}`;
|
|
} else if (typeof values["class:list"] !== "undefined") {
|
|
values["class:list"] = [values["class:list"], scopedClassName];
|
|
} else {
|
|
values.class = scopedClassName;
|
|
}
|
|
}
|
|
for (const [key, value] of Object.entries(values)) {
|
|
output += addAttribute(value, key, true);
|
|
}
|
|
return markHTMLString(output);
|
|
}
|
|
|
|
const AstroJSX = "astro:jsx";
|
|
const Empty = Symbol("empty");
|
|
const toSlotName = (slotAttr) => slotAttr;
|
|
function isVNode(vnode) {
|
|
return vnode && typeof vnode === "object" && vnode[AstroJSX];
|
|
}
|
|
function transformSlots(vnode) {
|
|
if (typeof vnode.type === "string")
|
|
return vnode;
|
|
const slots = {};
|
|
if (isVNode(vnode.props.children)) {
|
|
const child = vnode.props.children;
|
|
if (!isVNode(child))
|
|
return;
|
|
if (!("slot" in child.props))
|
|
return;
|
|
const name = toSlotName(child.props.slot);
|
|
slots[name] = [child];
|
|
slots[name]["$$slot"] = true;
|
|
delete child.props.slot;
|
|
delete vnode.props.children;
|
|
}
|
|
if (Array.isArray(vnode.props.children)) {
|
|
vnode.props.children = vnode.props.children.map((child) => {
|
|
if (!isVNode(child))
|
|
return child;
|
|
if (!("slot" in child.props))
|
|
return child;
|
|
const name = toSlotName(child.props.slot);
|
|
if (Array.isArray(slots[name])) {
|
|
slots[name].push(child);
|
|
} else {
|
|
slots[name] = [child];
|
|
slots[name]["$$slot"] = true;
|
|
}
|
|
delete child.props.slot;
|
|
return Empty;
|
|
}).filter((v) => v !== Empty);
|
|
}
|
|
Object.assign(vnode.props, slots);
|
|
}
|
|
function markRawChildren(child) {
|
|
if (typeof child === "string")
|
|
return markHTMLString(child);
|
|
if (Array.isArray(child))
|
|
return child.map((c) => markRawChildren(c));
|
|
return child;
|
|
}
|
|
function transformSetDirectives(vnode) {
|
|
if (!("set:html" in vnode.props || "set:text" in vnode.props))
|
|
return;
|
|
if ("set:html" in vnode.props) {
|
|
const children = markRawChildren(vnode.props["set:html"]);
|
|
delete vnode.props["set:html"];
|
|
Object.assign(vnode.props, { children });
|
|
return;
|
|
}
|
|
if ("set:text" in vnode.props) {
|
|
const children = vnode.props["set:text"];
|
|
delete vnode.props["set:text"];
|
|
Object.assign(vnode.props, { children });
|
|
return;
|
|
}
|
|
}
|
|
function createVNode(type, props) {
|
|
const vnode = {
|
|
[Renderer]: "astro:jsx",
|
|
[AstroJSX]: true,
|
|
type,
|
|
props: props ?? {}
|
|
};
|
|
transformSetDirectives(vnode);
|
|
transformSlots(vnode);
|
|
return vnode;
|
|
}
|
|
|
|
const slotName = (str) => str.trim().replace(/[-_]([a-z])/g, (_, w) => w.toUpperCase());
|
|
async function check(Component, props, { default: children = null, ...slotted } = {}) {
|
|
if (typeof Component !== "function")
|
|
return false;
|
|
const slots = {};
|
|
for (const [key, value] of Object.entries(slotted)) {
|
|
const name = slotName(key);
|
|
slots[name] = value;
|
|
}
|
|
try {
|
|
const result = await Component({ ...props, ...slots, children });
|
|
return result[AstroJSX];
|
|
} catch (e) {
|
|
const error = e;
|
|
if (Component[Symbol.for("mdx-component")]) {
|
|
throw createFormattedError({
|
|
message: error.message,
|
|
title: error.name,
|
|
hint: `This issue often occurs when your MDX component encounters runtime errors.`,
|
|
name: error.name,
|
|
stack: error.stack
|
|
});
|
|
}
|
|
}
|
|
return false;
|
|
}
|
|
async function renderToStaticMarkup(Component, props = {}, { default: children = null, ...slotted } = {}) {
|
|
const slots = {};
|
|
for (const [key, value] of Object.entries(slotted)) {
|
|
const name = slotName(key);
|
|
slots[name] = value;
|
|
}
|
|
const { result } = this;
|
|
const html = await renderJSX(result, createVNode(Component, { ...props, ...slots, children }));
|
|
return { html };
|
|
}
|
|
function createFormattedError({ message, name, stack, hint }) {
|
|
const error = new Error(message);
|
|
error.name = name;
|
|
error.stack = stack;
|
|
error.hint = hint;
|
|
return error;
|
|
}
|
|
var server_default = {
|
|
check,
|
|
renderToStaticMarkup
|
|
};
|
|
|
|
export { Fragment as F, createComponent as a, addAttribute as b, createAstro as c, renderHead as d, renderSlot as e, renderComponent as f, createVNode as g, server_default as h, maybeRenderHead as m, renderTemplate as r, spreadAttributes as s };
|