2197 lines
80 KiB
JavaScript
2197 lines
80 KiB
JavaScript
import { bold } from 'kleur/colors';
|
|
import { escape } from 'html-escaper';
|
|
import { clsx } from 'clsx';
|
|
|
|
const ClientAddressNotAvailable = {
|
|
name: "ClientAddressNotAvailable",
|
|
title: "`Astro.clientAddress` is not available in current adapter.",
|
|
message: (adapterName) => `\`Astro.clientAddress\` is not available in the \`${adapterName}\` adapter. File an issue with the adapter to add support.`
|
|
};
|
|
const StaticClientAddressNotAvailable = {
|
|
name: "StaticClientAddressNotAvailable",
|
|
title: "`Astro.clientAddress` is not available in static mode.",
|
|
message: "`Astro.clientAddress` is only available when using `output: 'server'` or `output: 'hybrid'`. Update your Astro config if you need SSR features.",
|
|
hint: "See https://docs.astro.build/en/guides/server-side-rendering/ for more information on how to enable SSR."
|
|
};
|
|
const NoMatchingStaticPathFound = {
|
|
name: "NoMatchingStaticPathFound",
|
|
title: "No static path found for requested path.",
|
|
message: (pathName) => `A \`getStaticPaths()\` route pattern was matched, but no matching static path was found for requested path \`${pathName}\`.`,
|
|
hint: (possibleRoutes) => `Possible dynamic routes being matched: ${possibleRoutes.join(", ")}.`
|
|
};
|
|
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 InvalidGetStaticPathsEntry = {
|
|
name: "InvalidGetStaticPathsEntry",
|
|
title: "Invalid entry inside getStaticPath's return value",
|
|
message: (entryType) => `Invalid entry returned by getStaticPaths. Expected an object, got \`${entryType}\``,
|
|
hint: "If you're using a `.map` call, you might be looking for `.flatMap()` instead. See https://docs.astro.build/en/reference/api-reference/#getstaticpaths for more information on getStaticPaths."
|
|
};
|
|
const InvalidGetStaticPathsReturn = {
|
|
name: "InvalidGetStaticPathsReturn",
|
|
title: "Invalid value returned by getStaticPaths.",
|
|
message: (returnType) => `Invalid type returned by \`getStaticPaths\`. Expected an \`array\`, got \`${returnType}\``,
|
|
hint: "See https://docs.astro.build/en/reference/api-reference/#getstaticpaths for more information on getStaticPaths."
|
|
};
|
|
const GetStaticPathsExpectedParams = {
|
|
name: "GetStaticPathsExpectedParams",
|
|
title: "Missing params property on `getStaticPaths` route.",
|
|
message: "Missing or empty required `params` property on `getStaticPaths` route.",
|
|
hint: "See https://docs.astro.build/en/reference/api-reference/#getstaticpaths for more information on getStaticPaths."
|
|
};
|
|
const GetStaticPathsInvalidRouteParam = {
|
|
name: "GetStaticPathsInvalidRouteParam",
|
|
title: "Invalid value for `getStaticPaths` route parameter.",
|
|
message: (key, value, valueType) => `Invalid getStaticPaths route parameter for \`${key}\`. Expected undefined, a string or a number, received \`${valueType}\` (\`${value}\`)`,
|
|
hint: "See https://docs.astro.build/en/reference/api-reference/#getstaticpaths for more information on getStaticPaths."
|
|
};
|
|
const GetStaticPathsRequired = {
|
|
name: "GetStaticPathsRequired",
|
|
title: "`getStaticPaths()` function required for dynamic routes.",
|
|
message: "`getStaticPaths()` function is required for dynamic routes. Make sure that you `export` a `getStaticPaths` function from your dynamic route.",
|
|
hint: `See https://docs.astro.build/en/core-concepts/routing/#dynamic-routes for more information on dynamic routes.
|
|
|
|
Alternatively, set \`output: "server"\` or \`output: "hybrid"\` in your Astro config file to switch to a non-static server build. This error can also occur if using \`export const prerender = true;\`.
|
|
See https://docs.astro.build/en/guides/server-side-rendering/ for more information on non-static rendering.`
|
|
};
|
|
const ReservedSlotName = {
|
|
name: "ReservedSlotName",
|
|
title: "Invalid slot name.",
|
|
message: (slotName) => `Unable to create a slot named \`${slotName}\`. \`${slotName}\` is a reserved slot name. Please update the name of this slot.`
|
|
};
|
|
const NoMatchingImport = {
|
|
name: "NoMatchingImport",
|
|
title: "No import found for component.",
|
|
message: (componentName) => `Could not render \`${componentName}\`. No matching import has been found for \`${componentName}\`.`,
|
|
hint: "Please make sure the component is properly imported."
|
|
};
|
|
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 PageNumberParamNotFound = {
|
|
name: "PageNumberParamNotFound",
|
|
title: "Page number param not found.",
|
|
message: (paramName) => `[paginate()] page number param \`${paramName}\` not found in your filepath.`,
|
|
hint: "Rename your file to `[page].astro` or `[...page].astro`."
|
|
};
|
|
const ImageMissingAlt = {
|
|
name: "ImageMissingAlt",
|
|
title: 'Image missing required "alt" property.',
|
|
message: 'Image missing "alt" property. "alt" text is required to describe important images on the page.',
|
|
hint: 'Use an empty string ("") for decorative images.'
|
|
};
|
|
const InvalidImageService = {
|
|
name: "InvalidImageService",
|
|
title: "Error while loading image service.",
|
|
message: "There was an error loading the configured image service. Please see the stack trace for more information."
|
|
};
|
|
const MissingImageDimension = {
|
|
name: "MissingImageDimension",
|
|
title: "Missing image dimensions",
|
|
message: (missingDimension, imageURL) => `Missing ${missingDimension === "both" ? "width and height attributes" : `${missingDimension} attribute`} for ${imageURL}. When using remote images, both dimensions are always required in order to avoid CLS.`,
|
|
hint: "If your image is inside your `src` folder, you probably meant to import it instead. See [the Imports guide for more information](https://docs.astro.build/en/guides/imports/#other-assets)."
|
|
};
|
|
const UnsupportedImageFormat = {
|
|
name: "UnsupportedImageFormat",
|
|
title: "Unsupported image format",
|
|
message: (format, imagePath, supportedFormats) => `Received unsupported format \`${format}\` from \`${imagePath}\`. Currently only ${supportedFormats.join(
|
|
", "
|
|
)} are supported by our image services.`,
|
|
hint: "Using an `img` tag directly instead of the `Image` component might be what you're looking for."
|
|
};
|
|
const UnsupportedImageConversion = {
|
|
name: "UnsupportedImageConversion",
|
|
title: "Unsupported image conversion",
|
|
message: "Converting between vector (such as SVGs) and raster (such as PNGs and JPEGs) images is not currently supported."
|
|
};
|
|
const PrerenderDynamicEndpointPathCollide = {
|
|
name: "PrerenderDynamicEndpointPathCollide",
|
|
title: "Prerendered dynamic endpoint has path collision.",
|
|
message: (pathname) => `Could not render \`${pathname}\` with an \`undefined\` param as the generated path will collide during prerendering. Prevent passing \`undefined\` as \`params\` for the endpoint's \`getStaticPaths()\` function, or add an additional extension to the endpoint's filename.`,
|
|
hint: (filename) => `Rename \`${filename}\` to \`${filename.replace(/\.(js|ts)/, (m) => `.json` + m)}\``
|
|
};
|
|
const ExpectedImage = {
|
|
name: "ExpectedImage",
|
|
title: "Expected src to be an image.",
|
|
message: (src, typeofOptions, fullOptions) => `Expected \`src\` property for \`getImage\` or \`<Image />\` to be either an ESM imported image or a string with the path of a remote image. Received \`${src}\` (type: \`${typeofOptions}\`).
|
|
|
|
Full serialized options received: \`${fullOptions}\`.`,
|
|
hint: "This error can often happen because of a wrong path. Make sure the path to your image is correct. If you're passing an async function, make sure to call and await it."
|
|
};
|
|
const ExpectedImageOptions = {
|
|
name: "ExpectedImageOptions",
|
|
title: "Expected image options.",
|
|
message: (options) => `Expected getImage() parameter to be an object. Received \`${options}\`.`
|
|
};
|
|
const IncompatibleDescriptorOptions = {
|
|
name: "IncompatibleDescriptorOptions",
|
|
title: "Cannot set both `densities` and `widths`",
|
|
message: "Only one of `densities` or `widths` can be specified. In most cases, you'll probably want to use only `widths` if you require specific widths.",
|
|
hint: "Those attributes are used to construct a `srcset` attribute, which cannot have both `x` and `w` descriptors."
|
|
};
|
|
const ResponseSentError = {
|
|
name: "ResponseSentError",
|
|
title: "Unable to set response.",
|
|
message: "The response has already been sent to the browser and cannot be altered."
|
|
};
|
|
const MiddlewareNoDataOrNextCalled = {
|
|
name: "MiddlewareNoDataOrNextCalled",
|
|
title: "The middleware didn't return a `Response`.",
|
|
message: "Make sure your middleware returns a `Response` object, either directly or by returning the `Response` from calling the `next` function."
|
|
};
|
|
const MiddlewareNotAResponse = {
|
|
name: "MiddlewareNotAResponse",
|
|
title: "The middleware returned something that is not a `Response` object.",
|
|
message: "Any data returned from middleware must be a valid `Response` object."
|
|
};
|
|
const LocalsNotAnObject = {
|
|
name: "LocalsNotAnObject",
|
|
title: "Value assigned to `locals` is not accepted.",
|
|
message: "`locals` can only be assigned to an object. Other values like numbers, strings, etc. are not accepted.",
|
|
hint: "If you tried to remove some information from the `locals` object, try to use `delete` or set the property to `undefined`."
|
|
};
|
|
const LocalImageUsedWrongly = {
|
|
name: "LocalImageUsedWrongly",
|
|
title: "Local images must be imported.",
|
|
message: (imageFilePath) => `\`Image\`'s and \`getImage\`'s \`src\` parameter must be an imported image or an URL, it cannot be a string filepath. Received \`${imageFilePath}\`.`,
|
|
hint: "If you want to use an image from your `src` folder, you need to either import it or if the image is coming from a content collection, use the [image() schema helper](https://docs.astro.build/en/guides/images/#images-in-content-collections) See https://docs.astro.build/en/guides/images/#src-required for more information on the `src` property."
|
|
};
|
|
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.`
|
|
};
|
|
const MissingSharp = {
|
|
name: "MissingSharp",
|
|
title: "Could not find Sharp.",
|
|
message: "Could not find Sharp. Please install Sharp (`sharp`) manually into your project or migrate to another image service.",
|
|
hint: "See Sharp's installation instructions for more information: https://sharp.pixelplumbing.com/install. If you are not relying on `astro:assets` to optimize, transform, or process any images, you can configure a passthrough image service instead of installing Sharp. See https://docs.astro.build/en/reference/errors/missing-sharp for more information.\n\nSee https://docs.astro.build/en/guides/images/#default-image-service for more information on how to migrate to another image service."
|
|
};
|
|
const CantRenderPage = {
|
|
name: "CantRenderPage",
|
|
title: "Astro can't render the route.",
|
|
message: "Astro cannot find any content to render for this route. There is no file or redirect associated with this route.",
|
|
hint: "If you expect to find a route here, this may be an Astro bug. Please file an issue/restart the dev server"
|
|
};
|
|
|
|
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 {
|
|
loc;
|
|
title;
|
|
hint;
|
|
frame;
|
|
type = "AstroError";
|
|
constructor(props, options) {
|
|
const { name, title, message, stack, location, hint, frame } = props;
|
|
super(message, options);
|
|
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) {
|
|
const name = moduleId?.split("/").pop()?.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 = "4.2.1";
|
|
|
|
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()
|
|
};
|
|
}
|
|
|
|
async function renderEndpoint(mod, context, ssr, logger) {
|
|
const { request, url } = context;
|
|
const method = request.method.toUpperCase();
|
|
const handler = mod[method] ?? mod["ALL"];
|
|
if (!ssr && ssr === false && method !== "GET") {
|
|
logger.warn(
|
|
"router",
|
|
`${url.pathname} ${bold(
|
|
method
|
|
)} requests are not available for a static site. Update your config to \`output: 'server'\` or \`output: 'hybrid'\` to enable.`
|
|
);
|
|
}
|
|
if (typeof handler !== "function") {
|
|
logger.warn(
|
|
"router",
|
|
`No API Route handler exists for the method "${method}" for the route ${url.pathname}.
|
|
Found handlers: ${Object.keys(mod).map((exp) => JSON.stringify(exp)).join(", ")}
|
|
` + ("all" in mod ? `One of the exported handlers is "all" (lowercase), did you mean to export 'ALL'?
|
|
` : "")
|
|
);
|
|
return new Response(null, {
|
|
status: 404,
|
|
headers: {
|
|
"X-Astro-Response": "Not-Found"
|
|
}
|
|
});
|
|
}
|
|
return handler.call(mod, context);
|
|
}
|
|
|
|
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 AstroJSX = "astro:jsx";
|
|
function isVNode(vnode) {
|
|
return vnode && typeof vnode === "object" && vnode[AstroJSX];
|
|
}
|
|
|
|
const RenderInstructionSymbol = Symbol.for("astro:render");
|
|
function createRenderInstruction(instruction) {
|
|
return Object.defineProperty(instruction, RenderInstructionSymbol, {
|
|
value: true
|
|
});
|
|
}
|
|
function isRenderInstruction(chunk) {
|
|
return chunk && typeof chunk === "object" && chunk[RenderInstructionSymbol];
|
|
}
|
|
|
|
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: {},
|
|
propsWithoutTransitionAttributes: {}
|
|
};
|
|
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 {
|
|
extracted.props[key] = value;
|
|
if (!transitionDirectivesToCopyOnIsland.includes(key)) {
|
|
extracted.propsWithoutTransitionAttributes[key] = value;
|
|
}
|
|
}
|
|
}
|
|
for (const sym of Object.getOwnPropertySymbols(inputProps)) {
|
|
extracted.props[sym] = inputProps[sym];
|
|
extracted.propsWithoutTransitionAttributes[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 AstroError({
|
|
...NoMatchingImport,
|
|
message: NoMatchingImport.message(metadata.displayName)
|
|
});
|
|
}
|
|
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 b=Object.defineProperty;var f=(c,o,i)=>o in c?b(c,o,{enumerable:!0,configurable:!0,writable:!0,value:i}):c[o]=i;var l=(c,o,i)=>(f(c,typeof o!="symbol"?o+"":o,i),i);var p;{let c={0:t=>m(t),1:t=>i(t),2:t=>new RegExp(t),3:t=>new Date(t),4:t=>new Map(i(t)),5:t=>new Set(i(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)},o=t=>{let[e,r]=t;return e in c?c[e](r):void 0},i=t=>t.map(o),m=t=>typeof t!="object"||t===null?t:Object.fromEntries(Object.entries(t).map(([e,r])=>[e,o(r)]));customElements.get("astro-island")||customElements.define("astro-island",(p=class extends HTMLElement{constructor(){super(...arguments);l(this,"Component");l(this,"hydrator");l(this,"hydrate",async()=>{var d;if(!this.hydrator||!this.isConnected)return;let e=(d=this.parentElement)==null?void 0:d.closest("astro-island[ssr]");if(e){e.addEventListener("astro:hydrate",this.hydrate,{once:!0});return}let r=this.querySelectorAll("astro-slot"),a={},h=this.querySelectorAll("template[data-astro-template]");for(let n of h){let s=n.closest(this.tagName);s!=null&&s.isSameNode(this)&&(a[n.getAttribute("data-astro-template")||"default"]=n.innerHTML,n.remove())}for(let n of r){let s=n.closest(this.tagName);s!=null&&s.isSameNode(this)&&(a[n.getAttribute("name")||"default"]=n.innerHTML)}let u;try{u=this.hasAttribute("props")?m(JSON.parse(this.getAttribute("props"))):{}}catch(n){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"),n),n}await this.hydrator(this)(this.Component,u,a,{client:this.getAttribute("client")}),this.removeAttribute("ssr"),this.dispatchEvent(new CustomEvent("astro:hydrate"))});l(this,"unmount",()=>{this.isConnected||this.dispatchEvent(new CustomEvent("astro:unmount"))})}disconnectedCallback(){document.removeEventListener("astro:after-swap",this.unmount),document.addEventListener("astro:after-swap",this.unmount,{once:!0})}connectedCallback(){if(!this.hasAttribute("await-children")||document.readyState==="interactive"||document.readyState==="complete")this.childrenConnectedCallback();else{let e=()=>{document.removeEventListener("DOMContentLoaded",e),r.disconnect(),this.childrenConnectedCallback()},r=new MutationObserver(()=>{var a;((a=this.lastChild)==null?void 0:a.nodeType)===Node.COMMENT_NODE&&this.lastChild.nodeValue==="astro:end"&&(this.lastChild.remove(),e())});r.observe(this,{childList:!0}),document.addEventListener("DOMContentLoaded",e)}}async childrenConnectedCallback(){let e=this.getAttribute("before-hydration-url");e&&await import(e),this.start()}start(){let e=JSON.parse(this.getAttribute("opts")),r=this.getAttribute("client");if(Astro[r]===void 0){window.addEventListener(\`astro:\${r}\`,()=>this.start(),{once:!0});return}Astro[r](async()=>{let a=this.getAttribute("renderer-url"),[h,{default:u}]=await Promise.all([import(this.getAttribute("component-url")),a?import(a):()=>()=>{}]),d=this.getAttribute("component-export")||"default";if(!d.includes("."))this.Component=h[d];else{this.Component=h;for(let n of d.split("."))this.Component=this.Component[n]}return this.hydrator=u,this.hydrate},e,this)}attributeChangedCallback(){this.hydrate()}},l(p,"observedAttributes",["props"]),p))}})();`;
|
|
|
|
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).filter(([_, v]) => typeof v === "string" && v.trim() || typeof v === "number").map(([k, v]) => {
|
|
if (k[0] !== "-" && k[1] !== "-")
|
|
return `${kebab(k)}:${v}`;
|
|
return `${k}:${v}`;
|
|
}).join(";");
|
|
function defineScriptVars(vars) {
|
|
let output = "";
|
|
for (const [key, value] of Object.entries(vars)) {
|
|
output += `const ${toIdent(key)} = ${JSON.stringify(value)?.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(clsx(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}>`;
|
|
}
|
|
function renderToBufferDestination(bufferRenderFunction) {
|
|
const bufferChunks = [];
|
|
const bufferDestination = {
|
|
write: (chunk) => bufferChunks.push(chunk)
|
|
};
|
|
const renderPromise = bufferRenderFunction(bufferDestination);
|
|
return {
|
|
async renderToFinalDestination(destination) {
|
|
for (const chunk of bufferChunks) {
|
|
destination.write(chunk);
|
|
}
|
|
bufferDestination.write = (chunk) => destination.write(chunk);
|
|
await renderPromise;
|
|
}
|
|
};
|
|
}
|
|
|
|
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 = styles.join("\n") + links.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 createRenderInstruction({ type: "head" });
|
|
}
|
|
function* maybeRenderHead() {
|
|
yield createRenderInstruction({ type: "maybe-head" });
|
|
}
|
|
|
|
const slotString = Symbol.for("astro:slot-string");
|
|
class SlotString extends HTMLString {
|
|
instructions;
|
|
[slotString];
|
|
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");
|
|
const encoder = new TextEncoder();
|
|
const decoder = new TextDecoder();
|
|
function stringifyChunk(result, chunk) {
|
|
if (isRenderInstruction(chunk)) {
|
|
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 || result.partial) {
|
|
return "";
|
|
}
|
|
return renderAllHeadContent(result);
|
|
}
|
|
case "maybe-head": {
|
|
if (result._metadata.hasRenderedHead || result._metadata.headInTree || result.partial) {
|
|
return "";
|
|
}
|
|
return renderAllHeadContent(result);
|
|
}
|
|
case "renderer-hydration-script": {
|
|
const { rendererSpecificHydrationScripts } = result._metadata;
|
|
const { rendererName } = instruction;
|
|
if (!rendererSpecificHydrationScripts.has(rendererName)) {
|
|
rendererSpecificHydrationScripts.add(rendererName);
|
|
return instruction.render();
|
|
}
|
|
return "";
|
|
}
|
|
default: {
|
|
throw new Error(`Unknown chunk type: ${chunk.type}`);
|
|
}
|
|
}
|
|
} else if (chunk instanceof Response) {
|
|
return "";
|
|
} 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 chunkToByteArray(result, chunk) {
|
|
if (ArrayBuffer.isView(chunk)) {
|
|
return chunk;
|
|
} else {
|
|
const stringified = stringifyChunk(result, chunk);
|
|
return encoder.encode(stringified.toString());
|
|
}
|
|
}
|
|
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)) {
|
|
const childRenders = child.map((c) => {
|
|
return renderToBufferDestination((bufferDestination) => {
|
|
return renderChild(bufferDestination, c);
|
|
});
|
|
});
|
|
for (const childRender of childRenders) {
|
|
if (!childRender)
|
|
continue;
|
|
await childRender.renderToFinalDestination(destination);
|
|
}
|
|
} 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);
|
|
}
|
|
}
|
|
|
|
const astroComponentInstanceSym = Symbol.for("astro.componentInstance");
|
|
class AstroComponentInstance {
|
|
[astroComponentInstanceSym] = true;
|
|
result;
|
|
props;
|
|
slotValues;
|
|
factory;
|
|
returnValue;
|
|
constructor(result, props, slots, factory) {
|
|
this.result = result;
|
|
this.props = props;
|
|
this.factory = factory;
|
|
this.slotValues = {};
|
|
for (const name in slots) {
|
|
let didRender = false;
|
|
let value = slots[name](result);
|
|
this.slotValues[name] = () => {
|
|
if (!didRender) {
|
|
didRender = true;
|
|
return value;
|
|
}
|
|
return slots[name](result);
|
|
};
|
|
}
|
|
}
|
|
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);
|
|
}
|
|
}
|
|
}
|
|
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.add(instance);
|
|
}
|
|
return instance;
|
|
}
|
|
function isAstroComponentInstance(obj) {
|
|
return typeof obj === "object" && !!obj[astroComponentInstanceSym];
|
|
}
|
|
|
|
const renderTemplateResultSym = Symbol.for("astro.renderTemplateResult");
|
|
class RenderTemplateResult {
|
|
[renderTemplateResultSym] = true;
|
|
htmlParts;
|
|
expressions;
|
|
error;
|
|
constructor(htmlParts, expressions) {
|
|
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) {
|
|
const expRenders = this.expressions.map((exp) => {
|
|
return renderToBufferDestination((bufferDestination) => {
|
|
if (exp || exp === 0) {
|
|
return renderChild(bufferDestination, exp);
|
|
}
|
|
});
|
|
});
|
|
for (let i = 0; i < this.htmlParts.length; i++) {
|
|
const html = this.htmlParts[i];
|
|
const expRender = expRenders[i];
|
|
destination.write(markHTMLString(html));
|
|
if (expRender) {
|
|
await expRender.renderToFinalDestination(destination);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
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 (!result.partial && !/<!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 renderToReadableStream(result, componentFactory, props, children, isPage = false, route) {
|
|
const templateResult = await callComponentAsTemplateResultOrResponse(
|
|
result,
|
|
componentFactory,
|
|
props,
|
|
children,
|
|
route
|
|
);
|
|
if (templateResult instanceof Response)
|
|
return templateResult;
|
|
let renderedFirstPageChunk = false;
|
|
if (isPage) {
|
|
await bufferHeadContent(result);
|
|
}
|
|
return new ReadableStream({
|
|
start(controller) {
|
|
const destination = {
|
|
write(chunk) {
|
|
if (isPage && !renderedFirstPageChunk) {
|
|
renderedFirstPageChunk = true;
|
|
if (!result.partial && !/<!doctype html/i.test(String(chunk))) {
|
|
const doctype = result.compressHTML ? "<!DOCTYPE html>" : "<!DOCTYPE html>\n";
|
|
controller.enqueue(encoder.encode(doctype));
|
|
}
|
|
}
|
|
if (chunk instanceof Response) {
|
|
throw new AstroError({
|
|
...ResponseSentError
|
|
});
|
|
}
|
|
const bytes = chunkToByteArray(result, chunk);
|
|
controller.enqueue(bytes);
|
|
}
|
|
};
|
|
(async () => {
|
|
try {
|
|
await templateResult.render(destination);
|
|
controller.close();
|
|
} catch (e) {
|
|
if (AstroError.is(e) && !e.loc) {
|
|
e.setLocation({
|
|
file: route?.component
|
|
});
|
|
}
|
|
setTimeout(() => controller.error(e), 0);
|
|
}
|
|
})();
|
|
}
|
|
});
|
|
}
|
|
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?.route, typeof factoryResult),
|
|
location: {
|
|
file: route?.component
|
|
}
|
|
});
|
|
}
|
|
return isHeadAndContent(factoryResult) ? factoryResult.content : factoryResult;
|
|
}
|
|
async function bufferHeadContent(result) {
|
|
const iterator = result._metadata.propagators.values();
|
|
while (true) {
|
|
const { value, done } = iterator.next();
|
|
if (done) {
|
|
break;
|
|
}
|
|
const returnValue = await value.init(result);
|
|
if (isHeadAndContent(returnValue)) {
|
|
result._metadata.extraHead.push(returnValue.head);
|
|
}
|
|
}
|
|
}
|
|
|
|
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?.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?.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 = {}) {
|
|
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, propsWithoutTransitionAttributes } = 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 = metadata.componentUrl?.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,
|
|
metadata?.componentUrl?.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,
|
|
propsWithoutTransitionAttributes,
|
|
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?.fallback);
|
|
} else {
|
|
({ html, attrs } = await renderer.ssr.renderToStaticMarkup.call(
|
|
{ result },
|
|
Component,
|
|
propsWithoutTransitionAttributes,
|
|
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) {
|
|
if (slotInstructions) {
|
|
for (const instruction of slotInstructions) {
|
|
destination.write(instruction);
|
|
}
|
|
}
|
|
if (isPage || renderer?.name === "astro:jsx") {
|
|
destination.write(html);
|
|
} else if (html && html.length > 0) {
|
|
destination.write(
|
|
markHTMLString(
|
|
removeStaticAstroSlot(html, renderer?.ssr?.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 = renderer?.ssr?.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"] = "";
|
|
island.children += `<!--astro:end-->`;
|
|
}
|
|
return {
|
|
render(destination) {
|
|
if (slotInstructions) {
|
|
for (const instruction of slotInstructions) {
|
|
destination.write(instruction);
|
|
}
|
|
}
|
|
destination.write(createRenderInstruction({ type: "directive", hydration }));
|
|
if (hydration.directive !== "only" && renderer?.ssr.renderHydrationScript) {
|
|
destination.write(
|
|
createRenderInstruction({
|
|
type: "renderer-hydration-script",
|
|
rendererName: renderer.name,
|
|
render: renderer.ssr.renderHydrationScript
|
|
})
|
|
);
|
|
}
|
|
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?.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);
|
|
return {
|
|
async render(destination) {
|
|
await instance.render(destination);
|
|
}
|
|
};
|
|
}
|
|
async function renderComponent(result, displayName, Component, props, slots = {}) {
|
|
if (isPromise(Component)) {
|
|
Component = await Component;
|
|
}
|
|
if (isFragmentComponent(Component)) {
|
|
return await renderFragmentComponent(result, slots);
|
|
}
|
|
props = normalizeProps(props);
|
|
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);
|
|
}
|
|
function normalizeProps(props) {
|
|
if (props["class:list"] !== void 0) {
|
|
const value = props["class:list"];
|
|
delete props["class:list"];
|
|
props["class"] = clsx(props["class"], value);
|
|
if (props["class"] === "") {
|
|
delete props["class"];
|
|
}
|
|
}
|
|
return props;
|
|
}
|
|
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 (!result.partial && !/<!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?.component
|
|
});
|
|
}
|
|
throw e;
|
|
}
|
|
return str;
|
|
}
|
|
function nonAstroPageNeedsHeadInjection(pageComponent) {
|
|
return !!pageComponent?.[needsHeadRenderingSymbol];
|
|
}
|
|
|
|
const ClientOnlyPlaceholder = "astro-client-only";
|
|
class Skip {
|
|
constructor(vnode) {
|
|
this.vnode = vnode;
|
|
this.count = 0;
|
|
}
|
|
count;
|
|
increment() {
|
|
this.count++;
|
|
}
|
|
haveNoTried() {
|
|
return this.count === 0;
|
|
}
|
|
isCompleted() {
|
|
return this.count > 2;
|
|
}
|
|
static 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?.[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);
|
|
}
|
|
|
|
async function renderPage(result, componentFactory, props, children, streaming, route) {
|
|
if (!isAstroComponentFactory(componentFactory)) {
|
|
result._metadata.headInTree = result.componentMetadata.get(componentFactory.moduleId)?.containsHead ?? false;
|
|
const pageProps = { ...props ?? {}, "server:root": true };
|
|
const str = await renderComponentToString(
|
|
result,
|
|
componentFactory.name,
|
|
componentFactory,
|
|
pageProps,
|
|
{},
|
|
true,
|
|
route
|
|
);
|
|
const bytes = encoder.encode(str);
|
|
return new Response(bytes, {
|
|
headers: new Headers([
|
|
["Content-Type", "text/html; charset=utf-8"],
|
|
["Content-Length", bytes.byteLength.toString()]
|
|
])
|
|
});
|
|
}
|
|
result._metadata.headInTree = result.componentMetadata.get(componentFactory.moduleId)?.containsHead ?? false;
|
|
let body;
|
|
if (streaming) {
|
|
body = await renderToReadableStream(result, componentFactory, props, children, true, route);
|
|
} else {
|
|
body = await renderToString(result, componentFactory, props, children, true, route);
|
|
}
|
|
if (body instanceof Response)
|
|
return body;
|
|
const init = result.response;
|
|
const headers = new Headers(init.headers);
|
|
if (!streaming && typeof body === "string") {
|
|
body = encoder.encode(body);
|
|
headers.set("Content-Length", body.byteLength.toString());
|
|
}
|
|
if (route?.component.endsWith(".md")) {
|
|
headers.set("Content-Type", "text/html; charset=utf-8");
|
|
}
|
|
const response = new Response(body, { ...init, headers });
|
|
return response;
|
|
}
|
|
|
|
const EASE_IN_OUT_QUART = "cubic-bezier(0.76, 0, 0.24, 1)";
|
|
function slide({
|
|
duration
|
|
} = {}) {
|
|
return {
|
|
forwards: {
|
|
old: [
|
|
{
|
|
name: "astroFadeOut",
|
|
duration: duration ?? "90ms",
|
|
easing: EASE_IN_OUT_QUART,
|
|
fillMode: "both"
|
|
},
|
|
{
|
|
name: "astroSlideToLeft",
|
|
duration: duration ?? "220ms",
|
|
easing: EASE_IN_OUT_QUART,
|
|
fillMode: "both"
|
|
}
|
|
],
|
|
new: [
|
|
{
|
|
name: "astroFadeIn",
|
|
duration: duration ?? "210ms",
|
|
easing: EASE_IN_OUT_QUART,
|
|
delay: duration ? void 0 : "30ms",
|
|
fillMode: "both"
|
|
},
|
|
{
|
|
name: "astroSlideFromRight",
|
|
duration: duration ?? "220ms",
|
|
easing: EASE_IN_OUT_QUART,
|
|
fillMode: "both"
|
|
}
|
|
]
|
|
},
|
|
backwards: {
|
|
old: [{ name: "astroFadeOut" }, { name: "astroSlideToRight" }],
|
|
new: [{ name: "astroFadeIn" }, { name: "astroSlideFromLeft" }]
|
|
}
|
|
};
|
|
}
|
|
function fade({
|
|
duration
|
|
} = {}) {
|
|
const anim = {
|
|
old: {
|
|
name: "astroFadeOut",
|
|
duration: duration ?? 180,
|
|
easing: EASE_IN_OUT_QUART,
|
|
fillMode: "both"
|
|
},
|
|
new: {
|
|
name: "astroFadeIn",
|
|
duration: duration ?? 180,
|
|
easing: EASE_IN_OUT_QUART,
|
|
fillMode: "both"
|
|
}
|
|
};
|
|
return {
|
|
forwards: anim,
|
|
backwards: anim
|
|
};
|
|
}
|
|
|
|
const transitionNameMap = /* @__PURE__ */ new WeakMap();
|
|
function incrementTransitionNumber(result) {
|
|
let num = 1;
|
|
if (transitionNameMap.has(result)) {
|
|
num = transitionNameMap.get(result) + 1;
|
|
}
|
|
transitionNameMap.set(result, num);
|
|
return num;
|
|
}
|
|
function createTransitionScope(result, hash) {
|
|
const num = incrementTransitionNumber(result);
|
|
return `astro-${hash}-${num}`;
|
|
}
|
|
function toValidIdent(name) {
|
|
return name.replace(/[^a-zA-Z0-9\-\_]/g, "_").replace(/^\_+|\_+$/g, "");
|
|
}
|
|
const getAnimations = (name) => {
|
|
if (name === "fade")
|
|
return fade();
|
|
if (name === "slide")
|
|
return slide();
|
|
if (typeof name === "object")
|
|
return name;
|
|
};
|
|
const addPairs = (animations, stylesheet) => {
|
|
for (const [direction, images] of Object.entries(animations)) {
|
|
for (const [image, rules] of Object.entries(images)) {
|
|
stylesheet.addAnimationPair(direction, image, rules);
|
|
}
|
|
}
|
|
};
|
|
function renderTransition(result, hash, animationName, transitionName) {
|
|
if (!animationName)
|
|
animationName = "fade";
|
|
const scope = createTransitionScope(result, hash);
|
|
const name = transitionName ? toValidIdent(transitionName) : scope;
|
|
const sheet = new ViewTransitionStyleSheet(scope, name);
|
|
const animations = getAnimations(animationName);
|
|
if (animations) {
|
|
addPairs(animations, sheet);
|
|
} else if (animationName === "none") {
|
|
sheet.addFallback("old", "animation: none; mix-blend-mode: normal;");
|
|
sheet.addModern("old", "animation: none; opacity: 0; mix-blend-mode: normal;");
|
|
sheet.addAnimationRaw("new", "animation: none; mix-blend-mode: normal;");
|
|
}
|
|
result._metadata.extraHead.push(markHTMLString(`<style>${sheet.toString()}</style>`));
|
|
return scope;
|
|
}
|
|
class ViewTransitionStyleSheet {
|
|
constructor(scope, name) {
|
|
this.scope = scope;
|
|
this.name = name;
|
|
}
|
|
modern = [];
|
|
fallback = [];
|
|
toString() {
|
|
const { scope, name } = this;
|
|
const [modern, fallback] = [this.modern, this.fallback].map((rules) => rules.join(""));
|
|
return [
|
|
`[data-astro-transition-scope="${scope}"] { view-transition-name: ${name}; }`,
|
|
this.layer(modern),
|
|
fallback
|
|
].join("");
|
|
}
|
|
layer(cssText) {
|
|
return cssText ? `@layer astro { ${cssText} }` : "";
|
|
}
|
|
addRule(target, cssText) {
|
|
this[target].push(cssText);
|
|
}
|
|
addAnimationRaw(image, animation) {
|
|
this.addModern(image, animation);
|
|
this.addFallback(image, animation);
|
|
}
|
|
addModern(image, animation) {
|
|
const { name } = this;
|
|
this.addRule("modern", `::view-transition-${image}(${name}) { ${animation} }`);
|
|
}
|
|
addFallback(image, animation) {
|
|
const { scope } = this;
|
|
this.addRule(
|
|
"fallback",
|
|
// Two selectors here, the second in case there is an animation on the root.
|
|
`[data-astro-transition-fallback="${image}"] [data-astro-transition-scope="${scope}"],
|
|
[data-astro-transition-fallback="${image}"][data-astro-transition-scope="${scope}"] { ${animation} }`
|
|
);
|
|
}
|
|
addAnimationPair(direction, image, rules) {
|
|
const { scope, name } = this;
|
|
const animation = stringifyAnimation(rules);
|
|
const prefix = direction === "backwards" ? `[data-astro-transition=back]` : direction === "forwards" ? "" : `[data-astro-transition=${direction}]`;
|
|
this.addRule("modern", `${prefix}::view-transition-${image}(${name}) { ${animation} }`);
|
|
this.addRule(
|
|
"fallback",
|
|
`${prefix}[data-astro-transition-fallback="${image}"] [data-astro-transition-scope="${scope}"],
|
|
${prefix}[data-astro-transition-fallback="${image}"][data-astro-transition-scope="${scope}"] { ${animation} }`
|
|
);
|
|
}
|
|
}
|
|
function addAnimationProperty(builder, prop, value) {
|
|
let arr = builder[prop];
|
|
if (Array.isArray(arr)) {
|
|
arr.push(value.toString());
|
|
} else {
|
|
builder[prop] = [value.toString()];
|
|
}
|
|
}
|
|
function animationBuilder() {
|
|
return {
|
|
toString() {
|
|
let out = "";
|
|
for (let k in this) {
|
|
let value = this[k];
|
|
if (Array.isArray(value)) {
|
|
out += `
|
|
${k}: ${value.join(", ")};`;
|
|
}
|
|
}
|
|
return out;
|
|
}
|
|
};
|
|
}
|
|
function stringifyAnimation(anim) {
|
|
if (Array.isArray(anim)) {
|
|
return stringifyAnimations(anim);
|
|
} else {
|
|
return stringifyAnimations([anim]);
|
|
}
|
|
}
|
|
function stringifyAnimations(anims) {
|
|
const builder = animationBuilder();
|
|
for (const anim of anims) {
|
|
if (anim.duration) {
|
|
addAnimationProperty(builder, "animation-duration", toTimeValue(anim.duration));
|
|
}
|
|
if (anim.easing) {
|
|
addAnimationProperty(builder, "animation-timing-function", anim.easing);
|
|
}
|
|
if (anim.direction) {
|
|
addAnimationProperty(builder, "animation-direction", anim.direction);
|
|
}
|
|
if (anim.delay) {
|
|
addAnimationProperty(builder, "animation-delay", anim.delay);
|
|
}
|
|
if (anim.fillMode) {
|
|
addAnimationProperty(builder, "animation-fill-mode", anim.fillMode);
|
|
}
|
|
addAnimationProperty(builder, "animation-name", anim.name);
|
|
}
|
|
return builder.toString();
|
|
}
|
|
function toTimeValue(num) {
|
|
return typeof num === "number" ? num + "ms" : num;
|
|
}
|
|
|
|
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);
|
|
}
|
|
|
|
export { AstroError as A, renderSlotToString as B, ClientAddressNotAvailable as C, renderJSX as D, ExpectedImage as E, chunkToString as F, GetStaticPathsRequired as G, CantRenderPage as H, IncompatibleDescriptorOptions as I, renderPage as J, LocalImageUsedWrongly as L, MissingImageDimension as M, NoMatchingStaticPathFound as N, PageNumberParamNotFound as P, ResponseSentError as R, StaticClientAddressNotAvailable as S, UnsupportedImageFormat as U, UnsupportedImageConversion as a, MissingSharp as b, createAstro as c, createComponent as d, addAttribute as e, renderSlot as f, renderTransition as g, renderComponent as h, renderHead as i, InvalidImageService as j, ExpectedImageOptions as k, ImageMissingAlt as l, maybeRenderHead as m, MiddlewareNoDataOrNextCalled as n, MiddlewareNotAResponse as o, InvalidGetStaticPathsReturn as p, InvalidGetStaticPathsEntry as q, renderTemplate as r, spreadAttributes as s, GetStaticPathsExpectedParams as t, GetStaticPathsInvalidRouteParam as u, PrerenderDynamicEndpointPathCollide as v, LocalsNotAnObject as w, ASTRO_VERSION as x, renderEndpoint as y, ReservedSlotName as z };
|