|
|
/** * @vue/compiler-dom v3.5.13 * (c) 2018-present Yuxi (Evan) You and Vue contributors * @license MIT **/ import { registerRuntimeHelpers, createSimpleExpression, createCompilerError, createObjectProperty, getConstantType, createCallExpression, TO_DISPLAY_STRING, transformModel as transformModel$1, findProp, hasDynamicKeyVBind, findDir, isStaticArgOf, transformOn as transformOn$1, isStaticExp, createCompoundExpression, checkCompatEnabled, noopDirectiveTransform, baseCompile, baseParse } from '@vue/compiler-core'; export * from '@vue/compiler-core'; import { isVoidTag, isHTMLTag, isSVGTag, isMathMLTag, parseStringStyle, capitalize, makeMap, extend } from '@vue/shared';
const V_MODEL_RADIO = Symbol(!!(process.env.NODE_ENV !== "production") ? `vModelRadio` : ``); const V_MODEL_CHECKBOX = Symbol( !!(process.env.NODE_ENV !== "production") ? `vModelCheckbox` : `` ); const V_MODEL_TEXT = Symbol(!!(process.env.NODE_ENV !== "production") ? `vModelText` : ``); const V_MODEL_SELECT = Symbol( !!(process.env.NODE_ENV !== "production") ? `vModelSelect` : `` ); const V_MODEL_DYNAMIC = Symbol( !!(process.env.NODE_ENV !== "production") ? `vModelDynamic` : `` ); const V_ON_WITH_MODIFIERS = Symbol( !!(process.env.NODE_ENV !== "production") ? `vOnModifiersGuard` : `` ); const V_ON_WITH_KEYS = Symbol( !!(process.env.NODE_ENV !== "production") ? `vOnKeysGuard` : `` ); const V_SHOW = Symbol(!!(process.env.NODE_ENV !== "production") ? `vShow` : ``); const TRANSITION = Symbol(!!(process.env.NODE_ENV !== "production") ? `Transition` : ``); const TRANSITION_GROUP = Symbol( !!(process.env.NODE_ENV !== "production") ? `TransitionGroup` : `` ); registerRuntimeHelpers({ [V_MODEL_RADIO]: `vModelRadio`, [V_MODEL_CHECKBOX]: `vModelCheckbox`, [V_MODEL_TEXT]: `vModelText`, [V_MODEL_SELECT]: `vModelSelect`, [V_MODEL_DYNAMIC]: `vModelDynamic`, [V_ON_WITH_MODIFIERS]: `withModifiers`, [V_ON_WITH_KEYS]: `withKeys`, [V_SHOW]: `vShow`, [TRANSITION]: `Transition`, [TRANSITION_GROUP]: `TransitionGroup` });
let decoder; function decodeHtmlBrowser(raw, asAttr = false) { if (!decoder) { decoder = document.createElement("div"); } if (asAttr) { decoder.innerHTML = `<div foo="${raw.replace(/"/g, """)}">`; return decoder.children[0].getAttribute("foo"); } else { decoder.innerHTML = raw; return decoder.textContent; } }
const parserOptions = { parseMode: "html", isVoidTag, isNativeTag: (tag) => isHTMLTag(tag) || isSVGTag(tag) || isMathMLTag(tag), isPreTag: (tag) => tag === "pre", isIgnoreNewlineTag: (tag) => tag === "pre" || tag === "textarea", decodeEntities: decodeHtmlBrowser , isBuiltInComponent: (tag) => { if (tag === "Transition" || tag === "transition") { return TRANSITION; } else if (tag === "TransitionGroup" || tag === "transition-group") { return TRANSITION_GROUP; } }, // https://html.spec.whatwg.org/multipage/parsing.html#tree-construction-dispatcher
getNamespace(tag, parent, rootNamespace) { let ns = parent ? parent.ns : rootNamespace; if (parent && ns === 2) { if (parent.tag === "annotation-xml") { if (tag === "svg") { return 1; } if (parent.props.some( (a) => a.type === 6 && a.name === "encoding" && a.value != null && (a.value.content === "text/html" || a.value.content === "application/xhtml+xml") )) { ns = 0; } } else if (/^m(?:[ions]|text)$/.test(parent.tag) && tag !== "mglyph" && tag !== "malignmark") { ns = 0; } } else if (parent && ns === 1) { if (parent.tag === "foreignObject" || parent.tag === "desc" || parent.tag === "title") { ns = 0; } } if (ns === 0) { if (tag === "svg") { return 1; } if (tag === "math") { return 2; } } return ns; } };
const transformStyle = (node) => { if (node.type === 1) { node.props.forEach((p, i) => { if (p.type === 6 && p.name === "style" && p.value) { node.props[i] = { type: 7, name: `bind`, arg: createSimpleExpression(`style`, true, p.loc), exp: parseInlineCSS(p.value.content, p.loc), modifiers: [], loc: p.loc }; } }); } }; const parseInlineCSS = (cssText, loc) => { const normalized = parseStringStyle(cssText); return createSimpleExpression( JSON.stringify(normalized), false, loc, 3 ); };
function createDOMCompilerError(code, loc) { return createCompilerError( code, loc, !!(process.env.NODE_ENV !== "production") || false ? DOMErrorMessages : void 0 ); } const DOMErrorCodes = { "X_V_HTML_NO_EXPRESSION": 53, "53": "X_V_HTML_NO_EXPRESSION", "X_V_HTML_WITH_CHILDREN": 54, "54": "X_V_HTML_WITH_CHILDREN", "X_V_TEXT_NO_EXPRESSION": 55, "55": "X_V_TEXT_NO_EXPRESSION", "X_V_TEXT_WITH_CHILDREN": 56, "56": "X_V_TEXT_WITH_CHILDREN", "X_V_MODEL_ON_INVALID_ELEMENT": 57, "57": "X_V_MODEL_ON_INVALID_ELEMENT", "X_V_MODEL_ARG_ON_ELEMENT": 58, "58": "X_V_MODEL_ARG_ON_ELEMENT", "X_V_MODEL_ON_FILE_INPUT_ELEMENT": 59, "59": "X_V_MODEL_ON_FILE_INPUT_ELEMENT", "X_V_MODEL_UNNECESSARY_VALUE": 60, "60": "X_V_MODEL_UNNECESSARY_VALUE", "X_V_SHOW_NO_EXPRESSION": 61, "61": "X_V_SHOW_NO_EXPRESSION", "X_TRANSITION_INVALID_CHILDREN": 62, "62": "X_TRANSITION_INVALID_CHILDREN", "X_IGNORED_SIDE_EFFECT_TAG": 63, "63": "X_IGNORED_SIDE_EFFECT_TAG", "__EXTEND_POINT__": 64, "64": "__EXTEND_POINT__" }; const DOMErrorMessages = { [53]: `v-html is missing expression.`, [54]: `v-html will override element children.`, [55]: `v-text is missing expression.`, [56]: `v-text will override element children.`, [57]: `v-model can only be used on <input>, <textarea> and <select> elements.`, [58]: `v-model argument is not supported on plain elements.`, [59]: `v-model cannot be used on file inputs since they are read-only. Use a v-on:change listener instead.`, [60]: `Unnecessary value binding used alongside v-model. It will interfere with v-model's behavior.`, [61]: `v-show is missing expression.`, [62]: `<Transition> expects exactly one child element or component.`, [63]: `Tags with side effect (<script> and <style>) are ignored in client component templates.` };
const transformVHtml = (dir, node, context) => { const { exp, loc } = dir; if (!exp) { context.onError( createDOMCompilerError(53, loc) ); } if (node.children.length) { context.onError( createDOMCompilerError(54, loc) ); node.children.length = 0; } return { props: [ createObjectProperty( createSimpleExpression(`innerHTML`, true, loc), exp || createSimpleExpression("", true) ) ] }; };
const transformVText = (dir, node, context) => { const { exp, loc } = dir; if (!exp) { context.onError( createDOMCompilerError(55, loc) ); } if (node.children.length) { context.onError( createDOMCompilerError(56, loc) ); node.children.length = 0; } return { props: [ createObjectProperty( createSimpleExpression(`textContent`, true), exp ? getConstantType(exp, context) > 0 ? exp : createCallExpression( context.helperString(TO_DISPLAY_STRING), [exp], loc ) : createSimpleExpression("", true) ) ] }; };
const transformModel = (dir, node, context) => { const baseResult = transformModel$1(dir, node, context); if (!baseResult.props.length || node.tagType === 1) { return baseResult; } if (dir.arg) { context.onError( createDOMCompilerError( 58, dir.arg.loc ) ); } function checkDuplicatedValue() { const value = findDir(node, "bind"); if (value && isStaticArgOf(value.arg, "value")) { context.onError( createDOMCompilerError( 60, value.loc ) ); } } const { tag } = node; const isCustomElement = context.isCustomElement(tag); if (tag === "input" || tag === "textarea" || tag === "select" || isCustomElement) { let directiveToUse = V_MODEL_TEXT; let isInvalidType = false; if (tag === "input" || isCustomElement) { const type = findProp(node, `type`); if (type) { if (type.type === 7) { directiveToUse = V_MODEL_DYNAMIC; } else if (type.value) { switch (type.value.content) { case "radio": directiveToUse = V_MODEL_RADIO; break; case "checkbox": directiveToUse = V_MODEL_CHECKBOX; break; case "file": isInvalidType = true; context.onError( createDOMCompilerError( 59, dir.loc ) ); break; default: !!(process.env.NODE_ENV !== "production") && checkDuplicatedValue(); break; } } } else if (hasDynamicKeyVBind(node)) { directiveToUse = V_MODEL_DYNAMIC; } else { !!(process.env.NODE_ENV !== "production") && checkDuplicatedValue(); } } else if (tag === "select") { directiveToUse = V_MODEL_SELECT; } else { !!(process.env.NODE_ENV !== "production") && checkDuplicatedValue(); } if (!isInvalidType) { baseResult.needRuntime = context.helper(directiveToUse); } } else { context.onError( createDOMCompilerError( 57, dir.loc ) ); } baseResult.props = baseResult.props.filter( (p) => !(p.key.type === 4 && p.key.content === "modelValue") ); return baseResult; };
const isEventOptionModifier = /* @__PURE__ */ makeMap(`passive,once,capture`); const isNonKeyModifier = /* @__PURE__ */ makeMap( // event propagation management
`stop,prevent,self,ctrl,shift,alt,meta,exact,middle` ); const maybeKeyModifier = /* @__PURE__ */ makeMap("left,right"); const isKeyboardEvent = /* @__PURE__ */ makeMap(`onkeyup,onkeydown,onkeypress`); const resolveModifiers = (key, modifiers, context, loc) => { const keyModifiers = []; const nonKeyModifiers = []; const eventOptionModifiers = []; for (let i = 0; i < modifiers.length; i++) { const modifier = modifiers[i].content; if (modifier === "native" && checkCompatEnabled( "COMPILER_V_ON_NATIVE", context, loc )) { eventOptionModifiers.push(modifier); } else if (isEventOptionModifier(modifier)) { eventOptionModifiers.push(modifier); } else { if (maybeKeyModifier(modifier)) { if (isStaticExp(key)) { if (isKeyboardEvent(key.content.toLowerCase())) { keyModifiers.push(modifier); } else { nonKeyModifiers.push(modifier); } } else { keyModifiers.push(modifier); nonKeyModifiers.push(modifier); } } else { if (isNonKeyModifier(modifier)) { nonKeyModifiers.push(modifier); } else { keyModifiers.push(modifier); } } } } return { keyModifiers, nonKeyModifiers, eventOptionModifiers }; }; const transformClick = (key, event) => { const isStaticClick = isStaticExp(key) && key.content.toLowerCase() === "onclick"; return isStaticClick ? createSimpleExpression(event, true) : key.type !== 4 ? createCompoundExpression([ `(`, key, `) === "onClick" ? "${event}" : (`, key, `)` ]) : key; }; const transformOn = (dir, node, context) => { return transformOn$1(dir, node, context, (baseResult) => { const { modifiers } = dir; if (!modifiers.length) return baseResult; let { key, value: handlerExp } = baseResult.props[0]; const { keyModifiers, nonKeyModifiers, eventOptionModifiers } = resolveModifiers(key, modifiers, context, dir.loc); if (nonKeyModifiers.includes("right")) { key = transformClick(key, `onContextmenu`); } if (nonKeyModifiers.includes("middle")) { key = transformClick(key, `onMouseup`); } if (nonKeyModifiers.length) { handlerExp = createCallExpression(context.helper(V_ON_WITH_MODIFIERS), [ handlerExp, JSON.stringify(nonKeyModifiers) ]); } if (keyModifiers.length && // if event name is dynamic, always wrap with keys guard
(!isStaticExp(key) || isKeyboardEvent(key.content.toLowerCase()))) { handlerExp = createCallExpression(context.helper(V_ON_WITH_KEYS), [ handlerExp, JSON.stringify(keyModifiers) ]); } if (eventOptionModifiers.length) { const modifierPostfix = eventOptionModifiers.map(capitalize).join(""); key = isStaticExp(key) ? createSimpleExpression(`${key.content}${modifierPostfix}`, true) : createCompoundExpression([`(`, key, `) + "${modifierPostfix}"`]); } return { props: [createObjectProperty(key, handlerExp)] }; }); };
const transformShow = (dir, node, context) => { const { exp, loc } = dir; if (!exp) { context.onError( createDOMCompilerError(61, loc) ); } return { props: [], needRuntime: context.helper(V_SHOW) }; };
const transformTransition = (node, context) => { if (node.type === 1 && node.tagType === 1) { const component = context.isBuiltInComponent(node.tag); if (component === TRANSITION) { return () => { if (!node.children.length) { return; } if (hasMultipleChildren(node)) { context.onError( createDOMCompilerError( 62, { start: node.children[0].loc.start, end: node.children[node.children.length - 1].loc.end, source: "" } ) ); } const child = node.children[0]; if (child.type === 1) { for (const p of child.props) { if (p.type === 7 && p.name === "show") { node.props.push({ type: 6, name: "persisted", nameLoc: node.loc, value: void 0, loc: node.loc }); } } } }; } } }; function hasMultipleChildren(node) { const children = node.children = node.children.filter( (c) => c.type !== 3 && !(c.type === 2 && !c.content.trim()) ); const child = children[0]; return children.length !== 1 || child.type === 11 || child.type === 9 && child.branches.some(hasMultipleChildren); }
const ignoreSideEffectTags = (node, context) => { if (node.type === 1 && node.tagType === 0 && (node.tag === "script" || node.tag === "style")) { !!(process.env.NODE_ENV !== "production") && context.onError( createDOMCompilerError( 63, node.loc ) ); context.removeNode(); } };
function isValidHTMLNesting(parent, child) { if (parent in onlyValidChildren) { return onlyValidChildren[parent].has(child); } if (child in onlyValidParents) { return onlyValidParents[child].has(parent); } if (parent in knownInvalidChildren) { if (knownInvalidChildren[parent].has(child)) return false; } if (child in knownInvalidParents) { if (knownInvalidParents[child].has(parent)) return false; } return true; } const headings = /* @__PURE__ */ new Set(["h1", "h2", "h3", "h4", "h5", "h6"]); const emptySet = /* @__PURE__ */ new Set([]); const onlyValidChildren = { head: /* @__PURE__ */ new Set([ "base", "basefront", "bgsound", "link", "meta", "title", "noscript", "noframes", "style", "script", "template" ]), optgroup: /* @__PURE__ */ new Set(["option"]), select: /* @__PURE__ */ new Set(["optgroup", "option", "hr"]), // table
table: /* @__PURE__ */ new Set(["caption", "colgroup", "tbody", "tfoot", "thead"]), tr: /* @__PURE__ */ new Set(["td", "th"]), colgroup: /* @__PURE__ */ new Set(["col"]), tbody: /* @__PURE__ */ new Set(["tr"]), thead: /* @__PURE__ */ new Set(["tr"]), tfoot: /* @__PURE__ */ new Set(["tr"]), // these elements can not have any children elements
script: emptySet, iframe: emptySet, option: emptySet, textarea: emptySet, style: emptySet, title: emptySet }; const onlyValidParents = { // sections
html: emptySet, body: /* @__PURE__ */ new Set(["html"]), head: /* @__PURE__ */ new Set(["html"]), // table
td: /* @__PURE__ */ new Set(["tr"]), colgroup: /* @__PURE__ */ new Set(["table"]), caption: /* @__PURE__ */ new Set(["table"]), tbody: /* @__PURE__ */ new Set(["table"]), tfoot: /* @__PURE__ */ new Set(["table"]), col: /* @__PURE__ */ new Set(["colgroup"]), th: /* @__PURE__ */ new Set(["tr"]), thead: /* @__PURE__ */ new Set(["table"]), tr: /* @__PURE__ */ new Set(["tbody", "thead", "tfoot"]), // data list
dd: /* @__PURE__ */ new Set(["dl", "div"]), dt: /* @__PURE__ */ new Set(["dl", "div"]), // other
figcaption: /* @__PURE__ */ new Set(["figure"]), // li: new Set(["ul", "ol"]),
summary: /* @__PURE__ */ new Set(["details"]), area: /* @__PURE__ */ new Set(["map"]) }; const knownInvalidChildren = { p: /* @__PURE__ */ new Set([ "address", "article", "aside", "blockquote", "center", "details", "dialog", "dir", "div", "dl", "fieldset", "figure", "footer", "form", "h1", "h2", "h3", "h4", "h5", "h6", "header", "hgroup", "hr", "li", "main", "nav", "menu", "ol", "p", "pre", "section", "table", "ul" ]), svg: /* @__PURE__ */ new Set([ "b", "blockquote", "br", "code", "dd", "div", "dl", "dt", "em", "embed", "h1", "h2", "h3", "h4", "h5", "h6", "hr", "i", "img", "li", "menu", "meta", "ol", "p", "pre", "ruby", "s", "small", "span", "strong", "sub", "sup", "table", "u", "ul", "var" ]) }; const knownInvalidParents = { a: /* @__PURE__ */ new Set(["a"]), button: /* @__PURE__ */ new Set(["button"]), dd: /* @__PURE__ */ new Set(["dd", "dt"]), dt: /* @__PURE__ */ new Set(["dd", "dt"]), form: /* @__PURE__ */ new Set(["form"]), li: /* @__PURE__ */ new Set(["li"]), h1: headings, h2: headings, h3: headings, h4: headings, h5: headings, h6: headings };
const validateHtmlNesting = (node, context) => { if (node.type === 1 && node.tagType === 0 && context.parent && context.parent.type === 1 && context.parent.tagType === 0 && !isValidHTMLNesting(context.parent.tag, node.tag)) { const error = new SyntaxError( `<${node.tag}> cannot be child of <${context.parent.tag}>, according to HTML specifications. This can cause hydration errors or potentially disrupt future functionality.` ); error.loc = node.loc; context.onWarn(error); } };
const DOMNodeTransforms = [ transformStyle, ...!!(process.env.NODE_ENV !== "production") ? [transformTransition, validateHtmlNesting] : [] ]; const DOMDirectiveTransforms = { cloak: noopDirectiveTransform, html: transformVHtml, text: transformVText, model: transformModel, // override compiler-core
on: transformOn, // override compiler-core
show: transformShow }; function compile(src, options = {}) { return baseCompile( src, extend({}, parserOptions, options, { nodeTransforms: [ // ignore <script> and <tag>
// this is not put inside DOMNodeTransforms because that list is used
// by compiler-ssr to generate vnode fallback branches
ignoreSideEffectTags, ...DOMNodeTransforms, ...options.nodeTransforms || [] ], directiveTransforms: extend( {}, DOMDirectiveTransforms, options.directiveTransforms || {} ), transformHoist: null }) ); } function parse(template, options = {}) { return baseParse(template, extend({}, parserOptions, options)); }
export { DOMDirectiveTransforms, DOMErrorCodes, DOMErrorMessages, DOMNodeTransforms, TRANSITION, TRANSITION_GROUP, V_MODEL_CHECKBOX, V_MODEL_DYNAMIC, V_MODEL_RADIO, V_MODEL_SELECT, V_MODEL_TEXT, V_ON_WITH_KEYS, V_ON_WITH_MODIFIERS, V_SHOW, compile, createDOMCompilerError, parse, parserOptions, transformStyle };
|