UNPKG

hono

Version:

Web framework built on Web Standards

140 lines (139 loc) 4.67 kB
// src/jsx/intrinsic-element/components.ts import { JSXNode, getNameSpaceContext } from "../base.js"; import { useContext } from "../context.js"; import { raw } from "../../helper/html/index.js"; import { dataPrecedenceAttr, deDupeKeyMap } from "./common.js"; import { PERMALINK } from "../constants.js"; import { toArray } from "../children.js"; var metaTagMap = /* @__PURE__ */ new WeakMap(); var insertIntoHead = (tagName, tag, props, precedence) => ({ buffer, context }) => { if (!buffer) { return; } const map = metaTagMap.get(context) || {}; metaTagMap.set(context, map); const tags = map[tagName] ||= []; let duped = false; const deDupeKeys = deDupeKeyMap[tagName]; if (deDupeKeys.length > 0) { LOOP: for (const [, tagProps] of tags) { for (const key of deDupeKeys) { if ((tagProps?.[key] ?? null) === props?.[key]) { duped = true; break LOOP; } } } } if (duped) { buffer[0] = buffer[0].replaceAll(tag, ""); } else if (deDupeKeys.length > 0) { tags.push([tag, props, precedence]); } else { tags.unshift([tag, props, precedence]); } if (buffer[0].indexOf("</head>") !== -1) { let insertTags; if (precedence === void 0) { insertTags = tags.map(([tag2]) => tag2); } else { const precedences = []; insertTags = tags.map(([tag2, , precedence2]) => { let order = precedences.indexOf(precedence2); if (order === -1) { precedences.push(precedence2); order = precedences.length - 1; } return [tag2, order]; }).sort((a, b) => a[1] - b[1]).map(([tag2]) => tag2); } insertTags.forEach((tag2) => { buffer[0] = buffer[0].replaceAll(tag2, ""); }); buffer[0] = buffer[0].replace(/(?=<\/head>)/, insertTags.join("")); } }; var returnWithoutSpecialBehavior = (tag, children, props) => raw(new JSXNode(tag, props, toArray(children ?? [])).toString()); var documentMetadataTag = (tag, children, props, sort) => { if ("itemProp" in props) { return returnWithoutSpecialBehavior(tag, children, props); } let { precedence, blocking, ...restProps } = props; precedence = sort ? precedence ?? "" : void 0; if (sort) { restProps[dataPrecedenceAttr] = precedence; } const string = new JSXNode(tag, restProps, toArray(children || [])).toString(); if (string instanceof Promise) { return string.then( (resString) => raw(string, [ ...resString.callbacks || [], insertIntoHead(tag, resString, restProps, precedence) ]) ); } else { return raw(string, [insertIntoHead(tag, string, restProps, precedence)]); } }; var title = ({ children, ...props }) => { const nameSpaceContext = getNameSpaceContext(); if (nameSpaceContext && useContext(nameSpaceContext) === "svg") { new JSXNode("title", props, toArray(children ?? [])); } return documentMetadataTag("title", children, props, false); }; var script = ({ children, ...props }) => { if (["src", "async"].some((k) => !props[k])) { return returnWithoutSpecialBehavior("script", children, props); } return documentMetadataTag("script", children, props, false); }; var style = ({ children, ...props }) => { if (!["href", "precedence"].every((k) => k in props)) { return returnWithoutSpecialBehavior("style", children, props); } props["data-href"] = props.href; delete props.href; return documentMetadataTag("style", children, props, true); }; var link = ({ children, ...props }) => { if (["onLoad", "onError"].some((k) => k in props) || props.rel === "stylesheet" && (!("precedence" in props) || "disabled" in props)) { return returnWithoutSpecialBehavior("link", children, props); } return documentMetadataTag("link", children, props, "precedence" in props); }; var meta = ({ children, ...props }) => { return documentMetadataTag("meta", children, props, false); }; var newJSXNode = (tag, { children, ...props }) => new JSXNode(tag, props, toArray(children ?? [])); var form = (props) => { if (typeof props.action === "function") { props.action = PERMALINK in props.action ? props.action[PERMALINK] : void 0; } return newJSXNode("form", props); }; var formActionableElement = (tag, props) => { if (typeof props.formAction === "function") { props.formAction = PERMALINK in props.formAction ? props.formAction[PERMALINK] : void 0; } return newJSXNode(tag, props); }; var input = (props) => formActionableElement("input", props); var button = (props) => formActionableElement("button", props); export { button, form, input, link, meta, script, style, title };