diff --git a/compiled/facebook-www/REVISION b/compiled/facebook-www/REVISION index ce080b6608bd2..a04e537a0e130 100644 --- a/compiled/facebook-www/REVISION +++ b/compiled/facebook-www/REVISION @@ -1 +1 @@ -90fa6be2509f68fa05897324e6adbab57de30c0f +1ef9912cc096fa471019a54eff4999b36856288c diff --git a/compiled/facebook-www/React-dev.modern.js b/compiled/facebook-www/React-dev.modern.js index 90ec4ab8a17ee..8f54a4f964213 100644 --- a/compiled/facebook-www/React-dev.modern.js +++ b/compiled/facebook-www/React-dev.modern.js @@ -27,7 +27,7 @@ if ( } "use strict"; -var ReactVersion = "18.3.0-www-modern-ab94a8a5"; +var ReactVersion = "18.3.0-www-modern-0b6784ca"; // ATTENTION // When adding new symbols to this file, diff --git a/compiled/facebook-www/ReactART-dev.classic.js b/compiled/facebook-www/ReactART-dev.classic.js index 12b9eb8db1732..4609abd8d99d2 100644 --- a/compiled/facebook-www/ReactART-dev.classic.js +++ b/compiled/facebook-www/ReactART-dev.classic.js @@ -69,7 +69,7 @@ function _assertThisInitialized(self) { return self; } -var ReactVersion = "18.3.0-www-classic-4fdc00d9"; +var ReactVersion = "18.3.0-www-classic-38982954"; var LegacyRoot = 0; var ConcurrentRoot = 1; diff --git a/compiled/facebook-www/ReactART-prod.modern.js b/compiled/facebook-www/ReactART-prod.modern.js index 47cb758b598bc..b48dfd5f5765f 100644 --- a/compiled/facebook-www/ReactART-prod.modern.js +++ b/compiled/facebook-www/ReactART-prod.modern.js @@ -9737,7 +9737,7 @@ var slice = Array.prototype.slice, return null; }, bundleType: 0, - version: "18.3.0-www-modern-52b1a95d", + version: "18.3.0-www-modern-6c430f83", rendererPackageName: "react-art" }; var internals$jscomp$inline_1324 = { @@ -9768,7 +9768,7 @@ var internals$jscomp$inline_1324 = { scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-modern-52b1a95d" + reconcilerVersion: "18.3.0-www-modern-6c430f83" }; if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) { var hook$jscomp$inline_1325 = __REACT_DEVTOOLS_GLOBAL_HOOK__; diff --git a/compiled/facebook-www/ReactDOM-dev.classic.js b/compiled/facebook-www/ReactDOM-dev.classic.js index c78072e494a4c..a76ee4e17e2d3 100644 --- a/compiled/facebook-www/ReactDOM-dev.classic.js +++ b/compiled/facebook-www/ReactDOM-dev.classic.js @@ -3073,6 +3073,28 @@ function setValueForAttribute(node, name, value) { node.setAttribute(name, enableTrustedTypesIntegration ? value : "" + value); } } +function setValueForKnownAttribute(node, name, value) { + if (value === null) { + node.removeAttribute(name); + return; + } + + switch (typeof value) { + case "undefined": + case "function": + case "symbol": + case "boolean": { + node.removeAttribute(name); + return; + } + } + + { + checkAttributeStringCoercion(value, name); + } + + node.setAttribute(name, enableTrustedTypesIntegration ? value : "" + value); +} function setValueForNamespacedAttribute(node, namespace, name, value) { if (value === null) { node.removeAttribute(name); @@ -4936,87 +4958,81 @@ function warnValidStyle(name, value) { /** * CSS properties which accept numbers but are not in units of "px". */ +var unitlessNumbers = new Set([ + "animationIterationCount", + "aspectRatio", + "borderImageOutset", + "borderImageSlice", + "borderImageWidth", + "boxFlex", + "boxFlexGroup", + "boxOrdinalGroup", + "columnCount", + "columns", + "flex", + "flexGrow", + "flexPositive", + "flexShrink", + "flexNegative", + "flexOrder", + "gridArea", + "gridRow", + "gridRowEnd", + "gridRowSpan", + "gridRowStart", + "gridColumn", + "gridColumnEnd", + "gridColumnSpan", + "gridColumnStart", + "fontWeight", + "lineClamp", + "lineHeight", + "opacity", + "order", + "orphans", + "scale", + "tabSize", + "widows", + "zIndex", + "zoom", + "fillOpacity", // SVG-related properties + "floodOpacity", + "stopOpacity", + "strokeDasharray", + "strokeDashoffset", + "strokeMiterlimit", + "strokeOpacity", + "strokeWidth", + "MozAnimationIterationCount", // Known Prefixed Properties + "MozBoxFlex", // TODO: Remove these since they shouldn't be used in modern code + "MozBoxFlexGroup", + "MozLineClamp", + "msAnimationIterationCount", + "msFlex", + "msZoom", + "msFlexGrow", + "msFlexNegative", + "msFlexOrder", + "msFlexPositive", + "msFlexShrink", + "msGridColumn", + "msGridColumnSpan", + "msGridRow", + "msGridRowSpan", + "WebkitAnimationIterationCount", + "WebkitBoxFlex", + "WebKitBoxFlexGroup", + "WebkitBoxOrdinalGroup", + "WebkitColumnCount", + "WebkitColumns", + "WebkitFlex", + "WebkitFlexGrow", + "WebkitFlexPositive", + "WebkitFlexShrink", + "WebkitLineClamp" +]); function isUnitlessNumber(name) { - switch (name) { - case "animationIterationCount": - case "aspectRatio": - case "borderImageOutset": - case "borderImageSlice": - case "borderImageWidth": - case "boxFlex": - case "boxFlexGroup": - case "boxOrdinalGroup": - case "columnCount": - case "columns": - case "flex": - case "flexGrow": - case "flexPositive": - case "flexShrink": - case "flexNegative": - case "flexOrder": - case "gridArea": - case "gridRow": - case "gridRowEnd": - case "gridRowSpan": - case "gridRowStart": - case "gridColumn": - case "gridColumnEnd": - case "gridColumnSpan": - case "gridColumnStart": - case "fontWeight": - case "lineClamp": - case "lineHeight": - case "opacity": - case "order": - case "orphans": - case "scale": - case "tabSize": - case "widows": - case "zIndex": - case "zoom": - case "fillOpacity": // SVG-related properties - - case "floodOpacity": - case "stopOpacity": - case "strokeDasharray": - case "strokeDashoffset": - case "strokeMiterlimit": - case "strokeOpacity": - case "strokeWidth": - case "MozAnimationIterationCount": // Known Prefixed Properties - - case "MozBoxFlex": // TODO: Remove these since they shouldn't be used in modern code - - case "MozBoxFlexGroup": - case "MozLineClamp": - case "msAnimationIterationCount": - case "msFlex": - case "msZoom": - case "msFlexGrow": - case "msFlexNegative": - case "msFlexOrder": - case "msFlexPositive": - case "msFlexShrink": - case "msGridColumn": - case "msGridColumnSpan": - case "msGridRow": - case "msGridRowSpan": - case "WebkitAnimationIterationCount": - case "WebkitBoxFlex": - case "WebKitBoxFlexGroup": - case "WebkitBoxOrdinalGroup": - case "WebkitColumnCount": - case "WebkitColumns": - case "WebkitFlex": - case "WebkitFlexGrow": - case "WebkitFlexPositive": - case "WebkitFlexShrink": - case "WebkitLineClamp": - return true; - - default: - return false; - } + return unitlessNumbers.has(name); } /** @@ -5253,6 +5269,91 @@ function isCustomElement(tagName, props) { } } +var aliases = new Map([ + ["acceptCharset", "accept-charset"], + ["htmlFor", "for"], + ["httpEquiv", "http-equiv"], // HTML and SVG attributes, but the SVG attribute is case sensitive.], + ["crossOrigin", "crossorigin"], // This is a list of all SVG attributes that need special casing. + // Regular attributes that just accept strings.], + ["accentHeight", "accent-height"], + ["alignmentBaseline", "alignment-baseline"], + ["arabicForm", "arabic-form"], + ["baselineShift", "baseline-shift"], + ["capHeight", "cap-height"], + ["clipPath", "clip-path"], + ["clipRule", "clip-rule"], + ["colorInterpolation", "color-interpolation"], + ["colorInterpolationFilters", "color-interpolation-filters"], + ["colorProfile", "color-profile"], + ["colorRendering", "color-rendering"], + ["dominantBaseline", "dominant-baseline"], + ["enableBackground", "enable-background"], + ["fillOpacity", "fill-opacity"], + ["fillRule", "fill-rule"], + ["floodColor", "flood-color"], + ["floodOpacity", "flood-opacity"], + ["fontFamily", "font-family"], + ["fontSize", "font-size"], + ["fontSizeAdjust", "font-size-adjust"], + ["fontStretch", "font-stretch"], + ["fontStyle", "font-style"], + ["fontVariant", "font-variant"], + ["fontWeight", "font-weight"], + ["glyphName", "glyph-name"], + ["glyphOrientationHorizontal", "glyph-orientation-horizontal"], + ["glyphOrientationVertical", "glyph-orientation-vertical"], + ["horizAdvX", "horiz-adv-x"], + ["horizOriginX", "horiz-origin-x"], + ["imageRendering", "image-rendering"], + ["letterSpacing", "letter-spacing"], + ["lightingColor", "lighting-color"], + ["markerEnd", "marker-end"], + ["markerMid", "marker-mid"], + ["markerStart", "marker-start"], + ["overlinePosition", "overline-position"], + ["overlineThickness", "overline-thickness"], + ["paintOrder", "paint-order"], + ["panose-1", "panose-1"], + ["pointerEvents", "pointer-events"], + ["renderingIntent", "rendering-intent"], + ["shapeRendering", "shape-rendering"], + ["stopColor", "stop-color"], + ["stopOpacity", "stop-opacity"], + ["strikethroughPosition", "strikethrough-position"], + ["strikethroughThickness", "strikethrough-thickness"], + ["strokeDasharray", "stroke-dasharray"], + ["strokeDashoffset", "stroke-dashoffset"], + ["strokeLinecap", "stroke-linecap"], + ["strokeLinejoin", "stroke-linejoin"], + ["strokeMiterlimit", "stroke-miterlimit"], + ["strokeOpacity", "stroke-opacity"], + ["strokeWidth", "stroke-width"], + ["textAnchor", "text-anchor"], + ["textDecoration", "text-decoration"], + ["textRendering", "text-rendering"], + ["transformOrigin", "transform-origin"], + ["underlinePosition", "underline-position"], + ["underlineThickness", "underline-thickness"], + ["unicodeBidi", "unicode-bidi"], + ["unicodeRange", "unicode-range"], + ["unitsPerEm", "units-per-em"], + ["vAlphabetic", "v-alphabetic"], + ["vHanging", "v-hanging"], + ["vIdeographic", "v-ideographic"], + ["vMathematical", "v-mathematical"], + ["vectorEffect", "vector-effect"], + ["vertAdvY", "vert-adv-y"], + ["vertOriginX", "vert-origin-x"], + ["vertOriginY", "vert-origin-y"], + ["wordSpacing", "word-spacing"], + ["writingMode", "writing-mode"], + ["xmlnsXlink", "xmlns:xlink"], + ["xHeight", "x-height"] +]); +function getAttributeAlias(name) { + return aliases.get(name) || name; +} + // When adding attributes to the HTML or SVG allowed attribute list, be sure to // also add them to this module to ensure casing and incorrect name // warnings. @@ -33326,7 +33427,7 @@ function createFiberRoot( return root; } -var ReactVersion = "18.3.0-www-classic-e70b8dd2"; +var ReactVersion = "18.3.0-www-classic-5877ee71"; function createPortal$1( children, @@ -37795,41 +37896,6 @@ var xmlNamespace = "http://www.w3.org/XML/1998/namespace"; function setProp(domElement, tag, key, value, props) { switch (key) { - case "style": { - setValueForStyles(domElement, value); - break; - } - - case "dangerouslySetInnerHTML": { - if (value != null) { - if (typeof value !== "object" || !("__html" in value)) { - throw new Error( - "`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. " + - "Please visit https://reactjs.org/link/dangerously-set-inner-html " + - "for more information." - ); - } - - var nextHtml = value.__html; - - if (nextHtml != null) { - if (props.children != null) { - throw new Error( - "Can only set one of `children` or `props.dangerouslySetInnerHTML`." - ); - } - - if (disableIEWorkarounds) { - domElement.innerHTML = nextHtml; - } else { - setInnerHTML$1(domElement, nextHtml); - } - } - } - - break; - } - case "children": { if (typeof value === "string") { // Avoid setting initial textContent when the text is empty. In IE11 setting @@ -37852,61 +37918,30 @@ function setProp(domElement, tag, key, value, props) { break; } + // These are very common props and therefore are in the beginning of the switch. + // TODO: aria-label is a very common prop but allows booleans so is not like the others + // but should ideally go in this list too. - case "onScroll": { - if (value != null) { - if (typeof value !== "function") { - warnForInvalidEventListener(key, value); - } - - listenToNonDelegatedEvent("scroll", domElement); - } - - break; - } - - case "onClick": { - // TODO: This cast may not be sound for SVG, MathML or custom elements. - if (value != null) { - if (typeof value !== "function") { - warnForInvalidEventListener(key, value); - } - - trapClickOnNonInteractiveElement(domElement); - } - - break; - } - // Note: `option.selected` is not updated if `select.multiple` is - // disabled with `removeAttribute`. We have special logic for handling this. - - case "multiple": { - domElement.multiple = - value && typeof value !== "function" && typeof value !== "symbol"; + case "className": + setValueForKnownAttribute(domElement, "class", value); break; - } - case "muted": { - domElement.muted = - value && typeof value !== "function" && typeof value !== "symbol"; + case "tabIndex": + // This has to be case sensitive in SVG. + setValueForKnownAttribute(domElement, "tabindex", value); break; - } - case "suppressContentEditableWarning": - case "suppressHydrationWarning": - case "defaultValue": // Reserved - - case "defaultChecked": - case "innerHTML": { - // Noop + case "dir": + case "role": + case "viewBox": + case "width": + case "height": { + setValueForKnownAttribute(domElement, key, value); break; } - case "autoFocus": { - // We polyfill it separately on the client during commit. - // We could have excluded it in the property list instead of - // adding a special case here, but then it wouldn't be emitted - // on server rendering (but we *do* want to emit it in SSR). + case "style": { + setValueForStyles(domElement, value); break; } // These attributes accept URLs. These must not allow javascript: URLS. @@ -37967,6 +38002,93 @@ function setProp(domElement, tag, key, value, props) { break; } + case "onClick": { + // TODO: This cast may not be sound for SVG, MathML or custom elements. + if (value != null) { + if (typeof value !== "function") { + warnForInvalidEventListener(key, value); + } + + trapClickOnNonInteractiveElement(domElement); + } + + break; + } + + case "onScroll": { + if (value != null) { + if (typeof value !== "function") { + warnForInvalidEventListener(key, value); + } + + listenToNonDelegatedEvent("scroll", domElement); + } + + break; + } + + case "dangerouslySetInnerHTML": { + if (value != null) { + if (typeof value !== "object" || !("__html" in value)) { + throw new Error( + "`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. " + + "Please visit https://reactjs.org/link/dangerously-set-inner-html " + + "for more information." + ); + } + + var nextHtml = value.__html; + + if (nextHtml != null) { + if (props.children != null) { + throw new Error( + "Can only set one of `children` or `props.dangerouslySetInnerHTML`." + ); + } + + if (disableIEWorkarounds) { + domElement.innerHTML = nextHtml; + } else { + setInnerHTML$1(domElement, nextHtml); + } + } + } + + break; + } + // Note: `option.selected` is not updated if `select.multiple` is + // disabled with `removeAttribute`. We have special logic for handling this. + + case "multiple": { + domElement.multiple = + value && typeof value !== "function" && typeof value !== "symbol"; + break; + } + + case "muted": { + domElement.muted = + value && typeof value !== "function" && typeof value !== "symbol"; + break; + } + + case "suppressContentEditableWarning": + case "suppressHydrationWarning": + case "defaultValue": // Reserved + + case "defaultChecked": + case "innerHTML": { + // Noop + break; + } + + case "autoFocus": { + // We polyfill it separately on the client during commit. + // We could have excluded it in the property list instead of + // adding a special case here, but then it wouldn't be emitted + // on server rendering (but we *do* want to emit it in SSR). + break; + } + case "xlinkHref": { if ( value == null || @@ -38125,331 +38247,6 @@ function setProp(domElement, tag, key, value, props) { break; } - // A few React string attributes have a different name. - // This is a mapping from React prop names to the attribute names. - - case "acceptCharset": - setValueForAttribute(domElement, "accept-charset", value); - break; - - case "className": - setValueForAttribute(domElement, "class", value); - break; - - case "htmlFor": - setValueForAttribute(domElement, "for", value); - break; - - case "httpEquiv": - setValueForAttribute(domElement, "http-equiv", value); - break; - // HTML and SVG attributes, but the SVG attribute is case sensitive. - - case "tabIndex": - setValueForAttribute(domElement, "tabindex", value); - break; - - case "crossOrigin": - setValueForAttribute(domElement, "crossorigin", value); - break; - // This is a list of all SVG attributes that need special casing. - // Regular attributes that just accept strings. - - case "accentHeight": - setValueForAttribute(domElement, "accent-height", value); - break; - - case "alignmentBaseline": - setValueForAttribute(domElement, "alignment-baseline", value); - break; - - case "arabicForm": - setValueForAttribute(domElement, "arabic-form", value); - break; - - case "baselineShift": - setValueForAttribute(domElement, "baseline-shift", value); - break; - - case "capHeight": - setValueForAttribute(domElement, "cap-height", value); - break; - - case "clipPath": - setValueForAttribute(domElement, "clip-path", value); - break; - - case "clipRule": - setValueForAttribute(domElement, "clip-rule", value); - break; - - case "colorInterpolation": - setValueForAttribute(domElement, "color-interpolation", value); - break; - - case "colorInterpolationFilters": - setValueForAttribute(domElement, "color-interpolation-filters", value); - break; - - case "colorProfile": - setValueForAttribute(domElement, "color-profile", value); - break; - - case "colorRendering": - setValueForAttribute(domElement, "color-rendering", value); - break; - - case "dominantBaseline": - setValueForAttribute(domElement, "dominant-baseline", value); - break; - - case "enableBackground": - setValueForAttribute(domElement, "enable-background", value); - break; - - case "fillOpacity": - setValueForAttribute(domElement, "fill-opacity", value); - break; - - case "fillRule": - setValueForAttribute(domElement, "fill-rule", value); - break; - - case "floodColor": - setValueForAttribute(domElement, "flood-color", value); - break; - - case "floodOpacity": - setValueForAttribute(domElement, "flood-opacity", value); - break; - - case "fontFamily": - setValueForAttribute(domElement, "font-family", value); - break; - - case "fontSize": - setValueForAttribute(domElement, "font-size", value); - break; - - case "fontSizeAdjust": - setValueForAttribute(domElement, "font-size-adjust", value); - break; - - case "fontStretch": - setValueForAttribute(domElement, "font-stretch", value); - break; - - case "fontStyle": - setValueForAttribute(domElement, "font-style", value); - break; - - case "fontVariant": - setValueForAttribute(domElement, "font-variant", value); - break; - - case "fontWeight": - setValueForAttribute(domElement, "font-weight", value); - break; - - case "glyphName": - setValueForAttribute(domElement, "glyph-name", value); - break; - - case "glyphOrientationHorizontal": - setValueForAttribute(domElement, "glyph-orientation-horizontal", value); - break; - - case "glyphOrientationVertical": - setValueForAttribute(domElement, "glyph-orientation-vertical", value); - break; - - case "horizAdvX": - setValueForAttribute(domElement, "horiz-adv-x", value); - break; - - case "horizOriginX": - setValueForAttribute(domElement, "horiz-origin-x", value); - break; - - case "imageRendering": - setValueForAttribute(domElement, "image-rendering", value); - break; - - case "letterSpacing": - setValueForAttribute(domElement, "letter-spacing", value); - break; - - case "lightingColor": - setValueForAttribute(domElement, "lighting-color", value); - break; - - case "markerEnd": - setValueForAttribute(domElement, "marker-end", value); - break; - - case "markerMid": - setValueForAttribute(domElement, "marker-mid", value); - break; - - case "markerStart": - setValueForAttribute(domElement, "marker-start", value); - break; - - case "overlinePosition": - setValueForAttribute(domElement, "overline-position", value); - break; - - case "overlineThickness": - setValueForAttribute(domElement, "overline-thickness", value); - break; - - case "paintOrder": - setValueForAttribute(domElement, "paint-order", value); - break; - - case "panose-1": - setValueForAttribute(domElement, "panose-1", value); - break; - - case "pointerEvents": - setValueForAttribute(domElement, "pointer-events", value); - break; - - case "renderingIntent": - setValueForAttribute(domElement, "rendering-intent", value); - break; - - case "shapeRendering": - setValueForAttribute(domElement, "shape-rendering", value); - break; - - case "stopColor": - setValueForAttribute(domElement, "stop-color", value); - break; - - case "stopOpacity": - setValueForAttribute(domElement, "stop-opacity", value); - break; - - case "strikethroughPosition": - setValueForAttribute(domElement, "strikethrough-position", value); - break; - - case "strikethroughThickness": - setValueForAttribute(domElement, "strikethrough-thickness", value); - break; - - case "strokeDasharray": - setValueForAttribute(domElement, "stroke-dasharray", value); - break; - - case "strokeDashoffset": - setValueForAttribute(domElement, "stroke-dashoffset", value); - break; - - case "strokeLinecap": - setValueForAttribute(domElement, "stroke-linecap", value); - break; - - case "strokeLinejoin": - setValueForAttribute(domElement, "stroke-linejoin", value); - break; - - case "strokeMiterlimit": - setValueForAttribute(domElement, "stroke-miterlimit", value); - break; - - case "strokeOpacity": - setValueForAttribute(domElement, "stroke-opacity", value); - break; - - case "strokeWidth": - setValueForAttribute(domElement, "stroke-width", value); - break; - - case "textAnchor": - setValueForAttribute(domElement, "text-anchor", value); - break; - - case "textDecoration": - setValueForAttribute(domElement, "text-decoration", value); - break; - - case "textRendering": - setValueForAttribute(domElement, "text-rendering", value); - break; - - case "transformOrigin": - setValueForAttribute(domElement, "transform-origin", value); - break; - - case "underlinePosition": - setValueForAttribute(domElement, "underline-position", value); - break; - - case "underlineThickness": - setValueForAttribute(domElement, "underline-thickness", value); - break; - - case "unicodeBidi": - setValueForAttribute(domElement, "unicode-bidi", value); - break; - - case "unicodeRange": - setValueForAttribute(domElement, "unicode-range", value); - break; - - case "unitsPerEm": - setValueForAttribute(domElement, "units-per-em", value); - break; - - case "vAlphabetic": - setValueForAttribute(domElement, "v-alphabetic", value); - break; - - case "vHanging": - setValueForAttribute(domElement, "v-hanging", value); - break; - - case "vIdeographic": - setValueForAttribute(domElement, "v-ideographic", value); - break; - - case "vMathematical": - setValueForAttribute(domElement, "v-mathematical", value); - break; - - case "vectorEffect": - setValueForAttribute(domElement, "vector-effect", value); - break; - - case "vertAdvY": - setValueForAttribute(domElement, "vert-adv-y", value); - break; - - case "vertOriginX": - setValueForAttribute(domElement, "vert-origin-x", value); - break; - - case "vertOriginY": - setValueForAttribute(domElement, "vert-origin-y", value); - break; - - case "wordSpacing": - setValueForAttribute(domElement, "word-spacing", value); - break; - - case "writingMode": - setValueForAttribute(domElement, "writing-mode", value); - break; - - case "xmlnsXlink": - setValueForAttribute(domElement, "xmlns:xlink", value); - break; - - case "xHeight": - setValueForAttribute(domElement, "x-height", value); - break; case "xlinkActuate": setValueForNamespacedAttribute( @@ -38555,7 +38352,8 @@ function setProp(domElement, tag, key, value, props) { warnForInvalidEventListener(key, value); } } else { - setValueForAttribute(domElement, key, value); + var attributeName = getAttributeAlias(key); + setValueForAttribute(domElement, attributeName, value); } } } @@ -38676,6 +38474,18 @@ function setInitialProperties(domElement, tag, props) { } // TODO: Make sure that we check isMounted before firing any of these events. switch (tag) { + case "div": + case "span": + case "svg": + case "path": + case "a": + case "g": + case "p": + case "li": { + // Fast track the most common tag types + break; + } + case "input": { initWrapperState$2(domElement, props); // We listen to this event in case to ensure emulated bubble // listeners still fire for the invalid event. @@ -38694,6 +38504,24 @@ function setInitialProperties(domElement, tag, props) { } switch (propKey) { + case "type": { + // Fast path since 'type' is very common on inputs + if ( + propValue != null && + typeof propValue !== "function" && + typeof propValue !== "symbol" && + typeof propValue !== "boolean" + ) { + { + checkAttributeStringCoercion(propValue, propKey); + } + + domElement.setAttribute(propKey, propValue); + } + + break; + } + case "checked": { var node = domElement; var checked = @@ -38949,36 +38777,46 @@ function setInitialProperties(domElement, tag, props) { return; } - } - if (isCustomElement(tag)) { - for (var _propKey5 in props) { - if (!props.hasOwnProperty(_propKey5)) { - continue; - } + default: { + if (isCustomElement(tag)) { + for (var _propKey5 in props) { + if (!props.hasOwnProperty(_propKey5)) { + continue; + } - var _propValue5 = props[_propKey5]; + var _propValue5 = props[_propKey5]; - if (_propValue5 == null) { - continue; - } + if (_propValue5 == null) { + continue; + } - setPropOnCustomElement(domElement, tag, _propKey5, _propValue5, props); - } - } else { - for (var _propKey6 in props) { - if (!props.hasOwnProperty(_propKey6)) { - continue; + setPropOnCustomElement( + domElement, + tag, + _propKey5, + _propValue5, + props + ); + } + + return; } + } + } - var _propValue6 = props[_propKey6]; + for (var _propKey6 in props) { + if (!props.hasOwnProperty(_propKey6)) { + continue; + } - if (_propValue6 == null) { - continue; - } + var _propValue6 = props[_propKey6]; - setProp(domElement, tag, _propKey6, _propValue6, props); + if (_propValue6 == null) { + continue; } + + setProp(domElement, tag, _propKey6, _propValue6, props); } } // Calculate the diff between the two objects. @@ -39112,6 +38950,18 @@ function updateProperties( nextProps ) { switch (tag) { + case "div": + case "span": + case "svg": + case "path": + case "a": + case "g": + case "p": + case "li": { + // Fast track the most common tag types + break; + } + case "input": { // Update checked *before* name. // In the middle of an update, it is possible to have multiple checked. @@ -39296,26 +39146,30 @@ function updateProperties( return; } - } // Apply the diff. - if (isCustomElement(tag)) { - for (var _i5 = 0; _i5 < updatePayload.length; _i5 += 2) { - var _propKey11 = updatePayload[_i5]; - var _propValue11 = updatePayload[_i5 + 1]; - setPropOnCustomElement( - domElement, - tag, - _propKey11, - _propValue11, - nextProps - ); - } - } else { - for (var _i6 = 0; _i6 < updatePayload.length; _i6 += 2) { - var _propKey12 = updatePayload[_i6]; - var _propValue12 = updatePayload[_i6 + 1]; - setProp(domElement, tag, _propKey12, _propValue12, nextProps); + default: { + if (isCustomElement(tag)) { + for (var _i5 = 0; _i5 < updatePayload.length; _i5 += 2) { + var _propKey11 = updatePayload[_i5]; + var _propValue11 = updatePayload[_i5 + 1]; + setPropOnCustomElement( + domElement, + tag, + _propKey11, + _propValue11, + nextProps + ); + } + + return; + } } + } // Apply the diff. + + for (var _i6 = 0; _i6 < updatePayload.length; _i6 += 2) { + var _propKey12 = updatePayload[_i6]; + var _propValue12 = updatePayload[_i6 + 1]; + setProp(domElement, tag, _propKey12, _propValue12, nextProps); } } @@ -39856,6 +39710,20 @@ function diffHydratedGenericElement( continue; + case "className": + hydrateAttribute(domElement, propKey, "class", value, extraAttributes); + continue; + + case "tabIndex": + hydrateAttribute( + domElement, + propKey, + "tabindex", + value, + extraAttributes + ); + continue; + case "style": extraAttributes.delete(propKey); diffHydratedStyles(domElement, value); @@ -40068,786 +39936,6 @@ function diffHydratedGenericElement( ); continue; } - // A few React string attributes have a different name. - // This is a mapping from React prop names to the attribute names. - - case "acceptCharset": - hydrateAttribute( - domElement, - propKey, - "accept-charset", - value, - extraAttributes - ); - continue; - - case "className": - hydrateAttribute(domElement, propKey, "class", value, extraAttributes); - continue; - - case "htmlFor": - hydrateAttribute(domElement, propKey, "for", value, extraAttributes); - continue; - - case "httpEquiv": - hydrateAttribute( - domElement, - propKey, - "http-equiv", - value, - extraAttributes - ); - continue; - - case "tabIndex": - hydrateAttribute( - domElement, - propKey, - "tabindex", - value, - extraAttributes - ); - continue; - - case "crossOrigin": - hydrateAttribute( - domElement, - propKey, - "crossorigin", - value, - extraAttributes - ); - continue; - - case "accentHeight": - hydrateAttribute( - domElement, - propKey, - "accent-height", - value, - extraAttributes - ); - continue; - - case "alignmentBaseline": - hydrateAttribute( - domElement, - propKey, - "alignment-baseline", - value, - extraAttributes - ); - continue; - - case "arabicForm": - hydrateAttribute( - domElement, - propKey, - "arabic-form", - value, - extraAttributes - ); - continue; - - case "baselineShift": - hydrateAttribute( - domElement, - propKey, - "baseline-shift", - value, - extraAttributes - ); - continue; - - case "capHeight": - hydrateAttribute( - domElement, - propKey, - "cap-height", - value, - extraAttributes - ); - continue; - - case "clipPath": - hydrateAttribute( - domElement, - propKey, - "clip-path", - value, - extraAttributes - ); - continue; - - case "clipRule": - hydrateAttribute( - domElement, - propKey, - "clip-rule", - value, - extraAttributes - ); - continue; - - case "colorInterpolation": - hydrateAttribute( - domElement, - propKey, - "color-interpolation", - value, - extraAttributes - ); - continue; - - case "colorInterpolationFilters": - hydrateAttribute( - domElement, - propKey, - "color-interpolation-filters", - value, - extraAttributes - ); - continue; - - case "colorProfile": - hydrateAttribute( - domElement, - propKey, - "color-profile", - value, - extraAttributes - ); - continue; - - case "colorRendering": - hydrateAttribute( - domElement, - propKey, - "color-rendering", - value, - extraAttributes - ); - continue; - - case "dominantBaseline": - hydrateAttribute( - domElement, - propKey, - "dominant-baseline", - value, - extraAttributes - ); - continue; - - case "enableBackground": - hydrateAttribute( - domElement, - propKey, - "enable-background", - value, - extraAttributes - ); - continue; - - case "fillOpacity": - hydrateAttribute( - domElement, - propKey, - "fill-opacity", - value, - extraAttributes - ); - continue; - - case "fillRule": - hydrateAttribute( - domElement, - propKey, - "fill-rule", - value, - extraAttributes - ); - continue; - - case "floodColor": - hydrateAttribute( - domElement, - propKey, - "flood-color", - value, - extraAttributes - ); - continue; - - case "floodOpacity": - hydrateAttribute( - domElement, - propKey, - "flood-opacity", - value, - extraAttributes - ); - continue; - - case "fontFamily": - hydrateAttribute( - domElement, - propKey, - "font-family", - value, - extraAttributes - ); - continue; - - case "fontSize": - hydrateAttribute( - domElement, - propKey, - "font-size", - value, - extraAttributes - ); - continue; - - case "fontSizeAdjust": - hydrateAttribute( - domElement, - propKey, - "font-size-adjust", - value, - extraAttributes - ); - continue; - - case "fontStretch": - hydrateAttribute( - domElement, - propKey, - "font-stretch", - value, - extraAttributes - ); - continue; - - case "fontStyle": - hydrateAttribute( - domElement, - propKey, - "font-style", - value, - extraAttributes - ); - continue; - - case "fontVariant": - hydrateAttribute( - domElement, - propKey, - "font-variant", - value, - extraAttributes - ); - continue; - - case "fontWeight": - hydrateAttribute( - domElement, - propKey, - "font-weight", - value, - extraAttributes - ); - continue; - - case "glyphName": - hydrateAttribute( - domElement, - propKey, - "glyph-name", - value, - extraAttributes - ); - continue; - - case "glyphOrientationHorizontal": - hydrateAttribute( - domElement, - propKey, - "glyph-orientation-horizontal", - value, - extraAttributes - ); - continue; - - case "glyphOrientationVertical": - hydrateAttribute( - domElement, - propKey, - "glyph-orientation-vertical", - value, - extraAttributes - ); - continue; - - case "horizAdvX": - hydrateAttribute( - domElement, - propKey, - "horiz-adv-x", - value, - extraAttributes - ); - continue; - - case "horizOriginX": - hydrateAttribute( - domElement, - propKey, - "horiz-origin-x", - value, - extraAttributes - ); - continue; - - case "imageRendering": - hydrateAttribute( - domElement, - propKey, - "image-rendering", - value, - extraAttributes - ); - continue; - - case "letterSpacing": - hydrateAttribute( - domElement, - propKey, - "letter-spacing", - value, - extraAttributes - ); - continue; - - case "lightingColor": - hydrateAttribute( - domElement, - propKey, - "lighting-color", - value, - extraAttributes - ); - continue; - - case "markerEnd": - hydrateAttribute( - domElement, - propKey, - "marker-end", - value, - extraAttributes - ); - continue; - - case "markerMid": - hydrateAttribute( - domElement, - propKey, - "marker-mid", - value, - extraAttributes - ); - continue; - - case "markerStart": - hydrateAttribute( - domElement, - propKey, - "marker-start", - value, - extraAttributes - ); - continue; - - case "overlinePosition": - hydrateAttribute( - domElement, - propKey, - "overline-position", - value, - extraAttributes - ); - continue; - - case "overlineThickness": - hydrateAttribute( - domElement, - propKey, - "overline-thickness", - value, - extraAttributes - ); - continue; - - case "paintOrder": - hydrateAttribute( - domElement, - propKey, - "paint-order", - value, - extraAttributes - ); - continue; - - case "panose-1": - hydrateAttribute( - domElement, - propKey, - "panose-1", - value, - extraAttributes - ); - continue; - - case "pointerEvents": - hydrateAttribute( - domElement, - propKey, - "pointer-events", - value, - extraAttributes - ); - continue; - - case "renderingIntent": - hydrateAttribute( - domElement, - propKey, - "rendering-intent", - value, - extraAttributes - ); - continue; - - case "shapeRendering": - hydrateAttribute( - domElement, - propKey, - "shape-rendering", - value, - extraAttributes - ); - continue; - - case "stopColor": - hydrateAttribute( - domElement, - propKey, - "stop-color", - value, - extraAttributes - ); - continue; - - case "stopOpacity": - hydrateAttribute( - domElement, - propKey, - "stop-opacity", - value, - extraAttributes - ); - continue; - - case "strikethroughPosition": - hydrateAttribute( - domElement, - propKey, - "strikethrough-position", - value, - extraAttributes - ); - continue; - - case "strikethroughThickness": - hydrateAttribute( - domElement, - propKey, - "strikethrough-thickness", - value, - extraAttributes - ); - continue; - - case "strokeDasharray": - hydrateAttribute( - domElement, - propKey, - "stroke-dasharray", - value, - extraAttributes - ); - continue; - - case "strokeDashoffset": - hydrateAttribute( - domElement, - propKey, - "stroke-dashoffset", - value, - extraAttributes - ); - continue; - - case "strokeLinecap": - hydrateAttribute( - domElement, - propKey, - "stroke-linecap", - value, - extraAttributes - ); - continue; - - case "strokeLinejoin": - hydrateAttribute( - domElement, - propKey, - "stroke-linejoin", - value, - extraAttributes - ); - continue; - - case "strokeMiterlimit": - hydrateAttribute( - domElement, - propKey, - "stroke-miterlimit", - value, - extraAttributes - ); - continue; - - case "strokeOpacity": - hydrateAttribute( - domElement, - propKey, - "stroke-opacity", - value, - extraAttributes - ); - continue; - - case "strokeWidth": - hydrateAttribute( - domElement, - propKey, - "stroke-width", - value, - extraAttributes - ); - continue; - - case "textAnchor": - hydrateAttribute( - domElement, - propKey, - "text-anchor", - value, - extraAttributes - ); - continue; - - case "textDecoration": - hydrateAttribute( - domElement, - propKey, - "text-decoration", - value, - extraAttributes - ); - continue; - - case "textRendering": - hydrateAttribute( - domElement, - propKey, - "text-rendering", - value, - extraAttributes - ); - continue; - - case "transformOrigin": - hydrateAttribute( - domElement, - propKey, - "transform-origin", - value, - extraAttributes - ); - continue; - - case "underlinePosition": - hydrateAttribute( - domElement, - propKey, - "underline-position", - value, - extraAttributes - ); - continue; - - case "underlineThickness": - hydrateAttribute( - domElement, - propKey, - "underline-thickness", - value, - extraAttributes - ); - continue; - - case "unicodeBidi": - hydrateAttribute( - domElement, - propKey, - "unicode-bidi", - value, - extraAttributes - ); - continue; - - case "unicodeRange": - hydrateAttribute( - domElement, - propKey, - "unicode-range", - value, - extraAttributes - ); - continue; - - case "unitsPerEm": - hydrateAttribute( - domElement, - propKey, - "units-per-em", - value, - extraAttributes - ); - continue; - - case "vAlphabetic": - hydrateAttribute( - domElement, - propKey, - "v-alphabetic", - value, - extraAttributes - ); - continue; - - case "vHanging": - hydrateAttribute( - domElement, - propKey, - "v-hanging", - value, - extraAttributes - ); - continue; - - case "vIdeographic": - hydrateAttribute( - domElement, - propKey, - "v-ideographic", - value, - extraAttributes - ); - continue; - - case "vMathematical": - hydrateAttribute( - domElement, - propKey, - "v-mathematical", - value, - extraAttributes - ); - continue; - - case "vectorEffect": - hydrateAttribute( - domElement, - propKey, - "vector-effect", - value, - extraAttributes - ); - continue; - - case "vertAdvY": - hydrateAttribute( - domElement, - propKey, - "vert-adv-y", - value, - extraAttributes - ); - continue; - - case "vertOriginX": - hydrateAttribute( - domElement, - propKey, - "vert-origin-x", - value, - extraAttributes - ); - continue; - - case "vertOriginY": - hydrateAttribute( - domElement, - propKey, - "vert-origin-y", - value, - extraAttributes - ); - continue; - - case "wordSpacing": - hydrateAttribute( - domElement, - propKey, - "word-spacing", - value, - extraAttributes - ); - continue; - - case "writingMode": - hydrateAttribute( - domElement, - propKey, - "writing-mode", - value, - extraAttributes - ); - continue; - - case "xmlnsXlink": - hydrateAttribute( - domElement, - propKey, - "xmlns:xlink", - value, - extraAttributes - ); - continue; case "xHeight": hydrateAttribute( @@ -40960,6 +40048,7 @@ function diffHydratedGenericElement( continue; } + var attributeName = getAttributeAlias(propKey); var isMismatchDueToBadCasing = false; var ownNamespaceDev = parentNamespaceDev; @@ -40968,7 +40057,7 @@ function diffHydratedGenericElement( } if (ownNamespaceDev === HTML_NAMESPACE) { - extraAttributes.delete(propKey.toLowerCase()); + extraAttributes.delete(attributeName.toLowerCase()); } else { var standardName = getPossibleStandardName(propKey); @@ -40982,10 +40071,14 @@ function diffHydratedGenericElement( extraAttributes.delete(standardName); } - extraAttributes.delete(propKey); + extraAttributes.delete(attributeName); } - var _serverValue4 = getValueForAttribute(domElement, propKey, value); + var _serverValue4 = getValueForAttribute( + domElement, + attributeName, + value + ); if (!isMismatchDueToBadCasing) { warnForPropDifference(propKey, _serverValue4, value); diff --git a/compiled/facebook-www/ReactDOM-dev.modern.js b/compiled/facebook-www/ReactDOM-dev.modern.js index 843b3d8a43874..b45be66a4f11c 100644 --- a/compiled/facebook-www/ReactDOM-dev.modern.js +++ b/compiled/facebook-www/ReactDOM-dev.modern.js @@ -2635,6 +2635,28 @@ function setValueForAttribute(node, name, value) { node.setAttribute(name, enableTrustedTypesIntegration ? value : "" + value); } } +function setValueForKnownAttribute(node, name, value) { + if (value === null) { + node.removeAttribute(name); + return; + } + + switch (typeof value) { + case "undefined": + case "function": + case "symbol": + case "boolean": { + node.removeAttribute(name); + return; + } + } + + { + checkAttributeStringCoercion(value, name); + } + + node.setAttribute(name, enableTrustedTypesIntegration ? value : "" + value); +} function setValueForNamespacedAttribute(node, namespace, name, value) { if (value === null) { node.removeAttribute(name); @@ -4752,87 +4774,81 @@ function warnValidStyle(name, value) { /** * CSS properties which accept numbers but are not in units of "px". */ +var unitlessNumbers = new Set([ + "animationIterationCount", + "aspectRatio", + "borderImageOutset", + "borderImageSlice", + "borderImageWidth", + "boxFlex", + "boxFlexGroup", + "boxOrdinalGroup", + "columnCount", + "columns", + "flex", + "flexGrow", + "flexPositive", + "flexShrink", + "flexNegative", + "flexOrder", + "gridArea", + "gridRow", + "gridRowEnd", + "gridRowSpan", + "gridRowStart", + "gridColumn", + "gridColumnEnd", + "gridColumnSpan", + "gridColumnStart", + "fontWeight", + "lineClamp", + "lineHeight", + "opacity", + "order", + "orphans", + "scale", + "tabSize", + "widows", + "zIndex", + "zoom", + "fillOpacity", // SVG-related properties + "floodOpacity", + "stopOpacity", + "strokeDasharray", + "strokeDashoffset", + "strokeMiterlimit", + "strokeOpacity", + "strokeWidth", + "MozAnimationIterationCount", // Known Prefixed Properties + "MozBoxFlex", // TODO: Remove these since they shouldn't be used in modern code + "MozBoxFlexGroup", + "MozLineClamp", + "msAnimationIterationCount", + "msFlex", + "msZoom", + "msFlexGrow", + "msFlexNegative", + "msFlexOrder", + "msFlexPositive", + "msFlexShrink", + "msGridColumn", + "msGridColumnSpan", + "msGridRow", + "msGridRowSpan", + "WebkitAnimationIterationCount", + "WebkitBoxFlex", + "WebKitBoxFlexGroup", + "WebkitBoxOrdinalGroup", + "WebkitColumnCount", + "WebkitColumns", + "WebkitFlex", + "WebkitFlexGrow", + "WebkitFlexPositive", + "WebkitFlexShrink", + "WebkitLineClamp" +]); function isUnitlessNumber(name) { - switch (name) { - case "animationIterationCount": - case "aspectRatio": - case "borderImageOutset": - case "borderImageSlice": - case "borderImageWidth": - case "boxFlex": - case "boxFlexGroup": - case "boxOrdinalGroup": - case "columnCount": - case "columns": - case "flex": - case "flexGrow": - case "flexPositive": - case "flexShrink": - case "flexNegative": - case "flexOrder": - case "gridArea": - case "gridRow": - case "gridRowEnd": - case "gridRowSpan": - case "gridRowStart": - case "gridColumn": - case "gridColumnEnd": - case "gridColumnSpan": - case "gridColumnStart": - case "fontWeight": - case "lineClamp": - case "lineHeight": - case "opacity": - case "order": - case "orphans": - case "scale": - case "tabSize": - case "widows": - case "zIndex": - case "zoom": - case "fillOpacity": // SVG-related properties - - case "floodOpacity": - case "stopOpacity": - case "strokeDasharray": - case "strokeDashoffset": - case "strokeMiterlimit": - case "strokeOpacity": - case "strokeWidth": - case "MozAnimationIterationCount": // Known Prefixed Properties - - case "MozBoxFlex": // TODO: Remove these since they shouldn't be used in modern code - - case "MozBoxFlexGroup": - case "MozLineClamp": - case "msAnimationIterationCount": - case "msFlex": - case "msZoom": - case "msFlexGrow": - case "msFlexNegative": - case "msFlexOrder": - case "msFlexPositive": - case "msFlexShrink": - case "msGridColumn": - case "msGridColumnSpan": - case "msGridRow": - case "msGridRowSpan": - case "WebkitAnimationIterationCount": - case "WebkitBoxFlex": - case "WebKitBoxFlexGroup": - case "WebkitBoxOrdinalGroup": - case "WebkitColumnCount": - case "WebkitColumns": - case "WebkitFlex": - case "WebkitFlexGrow": - case "WebkitFlexPositive": - case "WebkitFlexShrink": - case "WebkitLineClamp": - return true; - - default: - return false; - } + return unitlessNumbers.has(name); } /** @@ -5069,6 +5085,91 @@ function isCustomElement(tagName, props) { } } +var aliases = new Map([ + ["acceptCharset", "accept-charset"], + ["htmlFor", "for"], + ["httpEquiv", "http-equiv"], // HTML and SVG attributes, but the SVG attribute is case sensitive.], + ["crossOrigin", "crossorigin"], // This is a list of all SVG attributes that need special casing. + // Regular attributes that just accept strings.], + ["accentHeight", "accent-height"], + ["alignmentBaseline", "alignment-baseline"], + ["arabicForm", "arabic-form"], + ["baselineShift", "baseline-shift"], + ["capHeight", "cap-height"], + ["clipPath", "clip-path"], + ["clipRule", "clip-rule"], + ["colorInterpolation", "color-interpolation"], + ["colorInterpolationFilters", "color-interpolation-filters"], + ["colorProfile", "color-profile"], + ["colorRendering", "color-rendering"], + ["dominantBaseline", "dominant-baseline"], + ["enableBackground", "enable-background"], + ["fillOpacity", "fill-opacity"], + ["fillRule", "fill-rule"], + ["floodColor", "flood-color"], + ["floodOpacity", "flood-opacity"], + ["fontFamily", "font-family"], + ["fontSize", "font-size"], + ["fontSizeAdjust", "font-size-adjust"], + ["fontStretch", "font-stretch"], + ["fontStyle", "font-style"], + ["fontVariant", "font-variant"], + ["fontWeight", "font-weight"], + ["glyphName", "glyph-name"], + ["glyphOrientationHorizontal", "glyph-orientation-horizontal"], + ["glyphOrientationVertical", "glyph-orientation-vertical"], + ["horizAdvX", "horiz-adv-x"], + ["horizOriginX", "horiz-origin-x"], + ["imageRendering", "image-rendering"], + ["letterSpacing", "letter-spacing"], + ["lightingColor", "lighting-color"], + ["markerEnd", "marker-end"], + ["markerMid", "marker-mid"], + ["markerStart", "marker-start"], + ["overlinePosition", "overline-position"], + ["overlineThickness", "overline-thickness"], + ["paintOrder", "paint-order"], + ["panose-1", "panose-1"], + ["pointerEvents", "pointer-events"], + ["renderingIntent", "rendering-intent"], + ["shapeRendering", "shape-rendering"], + ["stopColor", "stop-color"], + ["stopOpacity", "stop-opacity"], + ["strikethroughPosition", "strikethrough-position"], + ["strikethroughThickness", "strikethrough-thickness"], + ["strokeDasharray", "stroke-dasharray"], + ["strokeDashoffset", "stroke-dashoffset"], + ["strokeLinecap", "stroke-linecap"], + ["strokeLinejoin", "stroke-linejoin"], + ["strokeMiterlimit", "stroke-miterlimit"], + ["strokeOpacity", "stroke-opacity"], + ["strokeWidth", "stroke-width"], + ["textAnchor", "text-anchor"], + ["textDecoration", "text-decoration"], + ["textRendering", "text-rendering"], + ["transformOrigin", "transform-origin"], + ["underlinePosition", "underline-position"], + ["underlineThickness", "underline-thickness"], + ["unicodeBidi", "unicode-bidi"], + ["unicodeRange", "unicode-range"], + ["unitsPerEm", "units-per-em"], + ["vAlphabetic", "v-alphabetic"], + ["vHanging", "v-hanging"], + ["vIdeographic", "v-ideographic"], + ["vMathematical", "v-mathematical"], + ["vectorEffect", "vector-effect"], + ["vertAdvY", "vert-adv-y"], + ["vertOriginX", "vert-origin-x"], + ["vertOriginY", "vert-origin-y"], + ["wordSpacing", "word-spacing"], + ["writingMode", "writing-mode"], + ["xmlnsXlink", "xmlns:xlink"], + ["xHeight", "x-height"] +]); +function getAttributeAlias(name) { + return aliases.get(name) || name; +} + // When adding attributes to the HTML or SVG allowed attribute list, be sure to // also add them to this module to ensure casing and incorrect name // warnings. @@ -33165,7 +33266,7 @@ function createFiberRoot( return root; } -var ReactVersion = "18.3.0-www-modern-52b1a95d"; +var ReactVersion = "18.3.0-www-modern-6c430f83"; function createPortal$1( children, @@ -38322,41 +38423,6 @@ var xmlNamespace = "http://www.w3.org/XML/1998/namespace"; function setProp(domElement, tag, key, value, props) { switch (key) { - case "style": { - setValueForStyles(domElement, value); - break; - } - - case "dangerouslySetInnerHTML": { - if (value != null) { - if (typeof value !== "object" || !("__html" in value)) { - throw new Error( - "`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. " + - "Please visit https://reactjs.org/link/dangerously-set-inner-html " + - "for more information." - ); - } - - var nextHtml = value.__html; - - if (nextHtml != null) { - if (props.children != null) { - throw new Error( - "Can only set one of `children` or `props.dangerouslySetInnerHTML`." - ); - } - - if (disableIEWorkarounds) { - domElement.innerHTML = nextHtml; - } else { - setInnerHTML$1(domElement, nextHtml); - } - } - } - - break; - } - case "children": { if (typeof value === "string") { // Avoid setting initial textContent when the text is empty. In IE11 setting @@ -38379,61 +38445,30 @@ function setProp(domElement, tag, key, value, props) { break; } + // These are very common props and therefore are in the beginning of the switch. + // TODO: aria-label is a very common prop but allows booleans so is not like the others + // but should ideally go in this list too. - case "onScroll": { - if (value != null) { - if (typeof value !== "function") { - warnForInvalidEventListener(key, value); - } - - listenToNonDelegatedEvent("scroll", domElement); - } - - break; - } - - case "onClick": { - // TODO: This cast may not be sound for SVG, MathML or custom elements. - if (value != null) { - if (typeof value !== "function") { - warnForInvalidEventListener(key, value); - } - - trapClickOnNonInteractiveElement(domElement); - } - - break; - } - // Note: `option.selected` is not updated if `select.multiple` is - // disabled with `removeAttribute`. We have special logic for handling this. - - case "multiple": { - domElement.multiple = - value && typeof value !== "function" && typeof value !== "symbol"; + case "className": + setValueForKnownAttribute(domElement, "class", value); break; - } - case "muted": { - domElement.muted = - value && typeof value !== "function" && typeof value !== "symbol"; + case "tabIndex": + // This has to be case sensitive in SVG. + setValueForKnownAttribute(domElement, "tabindex", value); break; - } - case "suppressContentEditableWarning": - case "suppressHydrationWarning": - case "defaultValue": // Reserved - - case "defaultChecked": - case "innerHTML": { - // Noop + case "dir": + case "role": + case "viewBox": + case "width": + case "height": { + setValueForKnownAttribute(domElement, key, value); break; } - case "autoFocus": { - // We polyfill it separately on the client during commit. - // We could have excluded it in the property list instead of - // adding a special case here, but then it wouldn't be emitted - // on server rendering (but we *do* want to emit it in SSR). + case "style": { + setValueForStyles(domElement, value); break; } // These attributes accept URLs. These must not allow javascript: URLS. @@ -38494,6 +38529,93 @@ function setProp(domElement, tag, key, value, props) { break; } + case "onClick": { + // TODO: This cast may not be sound for SVG, MathML or custom elements. + if (value != null) { + if (typeof value !== "function") { + warnForInvalidEventListener(key, value); + } + + trapClickOnNonInteractiveElement(domElement); + } + + break; + } + + case "onScroll": { + if (value != null) { + if (typeof value !== "function") { + warnForInvalidEventListener(key, value); + } + + listenToNonDelegatedEvent("scroll", domElement); + } + + break; + } + + case "dangerouslySetInnerHTML": { + if (value != null) { + if (typeof value !== "object" || !("__html" in value)) { + throw new Error( + "`props.dangerouslySetInnerHTML` must be in the form `{__html: ...}`. " + + "Please visit https://reactjs.org/link/dangerously-set-inner-html " + + "for more information." + ); + } + + var nextHtml = value.__html; + + if (nextHtml != null) { + if (props.children != null) { + throw new Error( + "Can only set one of `children` or `props.dangerouslySetInnerHTML`." + ); + } + + if (disableIEWorkarounds) { + domElement.innerHTML = nextHtml; + } else { + setInnerHTML$1(domElement, nextHtml); + } + } + } + + break; + } + // Note: `option.selected` is not updated if `select.multiple` is + // disabled with `removeAttribute`. We have special logic for handling this. + + case "multiple": { + domElement.multiple = + value && typeof value !== "function" && typeof value !== "symbol"; + break; + } + + case "muted": { + domElement.muted = + value && typeof value !== "function" && typeof value !== "symbol"; + break; + } + + case "suppressContentEditableWarning": + case "suppressHydrationWarning": + case "defaultValue": // Reserved + + case "defaultChecked": + case "innerHTML": { + // Noop + break; + } + + case "autoFocus": { + // We polyfill it separately on the client during commit. + // We could have excluded it in the property list instead of + // adding a special case here, but then it wouldn't be emitted + // on server rendering (but we *do* want to emit it in SSR). + break; + } + case "xlinkHref": { if ( value == null || @@ -38652,331 +38774,6 @@ function setProp(domElement, tag, key, value, props) { break; } - // A few React string attributes have a different name. - // This is a mapping from React prop names to the attribute names. - - case "acceptCharset": - setValueForAttribute(domElement, "accept-charset", value); - break; - - case "className": - setValueForAttribute(domElement, "class", value); - break; - - case "htmlFor": - setValueForAttribute(domElement, "for", value); - break; - - case "httpEquiv": - setValueForAttribute(domElement, "http-equiv", value); - break; - // HTML and SVG attributes, but the SVG attribute is case sensitive. - - case "tabIndex": - setValueForAttribute(domElement, "tabindex", value); - break; - - case "crossOrigin": - setValueForAttribute(domElement, "crossorigin", value); - break; - // This is a list of all SVG attributes that need special casing. - // Regular attributes that just accept strings. - - case "accentHeight": - setValueForAttribute(domElement, "accent-height", value); - break; - - case "alignmentBaseline": - setValueForAttribute(domElement, "alignment-baseline", value); - break; - - case "arabicForm": - setValueForAttribute(domElement, "arabic-form", value); - break; - - case "baselineShift": - setValueForAttribute(domElement, "baseline-shift", value); - break; - - case "capHeight": - setValueForAttribute(domElement, "cap-height", value); - break; - - case "clipPath": - setValueForAttribute(domElement, "clip-path", value); - break; - - case "clipRule": - setValueForAttribute(domElement, "clip-rule", value); - break; - - case "colorInterpolation": - setValueForAttribute(domElement, "color-interpolation", value); - break; - - case "colorInterpolationFilters": - setValueForAttribute(domElement, "color-interpolation-filters", value); - break; - - case "colorProfile": - setValueForAttribute(domElement, "color-profile", value); - break; - - case "colorRendering": - setValueForAttribute(domElement, "color-rendering", value); - break; - - case "dominantBaseline": - setValueForAttribute(domElement, "dominant-baseline", value); - break; - - case "enableBackground": - setValueForAttribute(domElement, "enable-background", value); - break; - - case "fillOpacity": - setValueForAttribute(domElement, "fill-opacity", value); - break; - - case "fillRule": - setValueForAttribute(domElement, "fill-rule", value); - break; - - case "floodColor": - setValueForAttribute(domElement, "flood-color", value); - break; - - case "floodOpacity": - setValueForAttribute(domElement, "flood-opacity", value); - break; - - case "fontFamily": - setValueForAttribute(domElement, "font-family", value); - break; - - case "fontSize": - setValueForAttribute(domElement, "font-size", value); - break; - - case "fontSizeAdjust": - setValueForAttribute(domElement, "font-size-adjust", value); - break; - - case "fontStretch": - setValueForAttribute(domElement, "font-stretch", value); - break; - - case "fontStyle": - setValueForAttribute(domElement, "font-style", value); - break; - - case "fontVariant": - setValueForAttribute(domElement, "font-variant", value); - break; - - case "fontWeight": - setValueForAttribute(domElement, "font-weight", value); - break; - - case "glyphName": - setValueForAttribute(domElement, "glyph-name", value); - break; - - case "glyphOrientationHorizontal": - setValueForAttribute(domElement, "glyph-orientation-horizontal", value); - break; - - case "glyphOrientationVertical": - setValueForAttribute(domElement, "glyph-orientation-vertical", value); - break; - - case "horizAdvX": - setValueForAttribute(domElement, "horiz-adv-x", value); - break; - - case "horizOriginX": - setValueForAttribute(domElement, "horiz-origin-x", value); - break; - - case "imageRendering": - setValueForAttribute(domElement, "image-rendering", value); - break; - - case "letterSpacing": - setValueForAttribute(domElement, "letter-spacing", value); - break; - - case "lightingColor": - setValueForAttribute(domElement, "lighting-color", value); - break; - - case "markerEnd": - setValueForAttribute(domElement, "marker-end", value); - break; - - case "markerMid": - setValueForAttribute(domElement, "marker-mid", value); - break; - - case "markerStart": - setValueForAttribute(domElement, "marker-start", value); - break; - - case "overlinePosition": - setValueForAttribute(domElement, "overline-position", value); - break; - - case "overlineThickness": - setValueForAttribute(domElement, "overline-thickness", value); - break; - - case "paintOrder": - setValueForAttribute(domElement, "paint-order", value); - break; - - case "panose-1": - setValueForAttribute(domElement, "panose-1", value); - break; - - case "pointerEvents": - setValueForAttribute(domElement, "pointer-events", value); - break; - - case "renderingIntent": - setValueForAttribute(domElement, "rendering-intent", value); - break; - - case "shapeRendering": - setValueForAttribute(domElement, "shape-rendering", value); - break; - - case "stopColor": - setValueForAttribute(domElement, "stop-color", value); - break; - - case "stopOpacity": - setValueForAttribute(domElement, "stop-opacity", value); - break; - - case "strikethroughPosition": - setValueForAttribute(domElement, "strikethrough-position", value); - break; - - case "strikethroughThickness": - setValueForAttribute(domElement, "strikethrough-thickness", value); - break; - - case "strokeDasharray": - setValueForAttribute(domElement, "stroke-dasharray", value); - break; - - case "strokeDashoffset": - setValueForAttribute(domElement, "stroke-dashoffset", value); - break; - - case "strokeLinecap": - setValueForAttribute(domElement, "stroke-linecap", value); - break; - - case "strokeLinejoin": - setValueForAttribute(domElement, "stroke-linejoin", value); - break; - - case "strokeMiterlimit": - setValueForAttribute(domElement, "stroke-miterlimit", value); - break; - - case "strokeOpacity": - setValueForAttribute(domElement, "stroke-opacity", value); - break; - - case "strokeWidth": - setValueForAttribute(domElement, "stroke-width", value); - break; - - case "textAnchor": - setValueForAttribute(domElement, "text-anchor", value); - break; - - case "textDecoration": - setValueForAttribute(domElement, "text-decoration", value); - break; - - case "textRendering": - setValueForAttribute(domElement, "text-rendering", value); - break; - - case "transformOrigin": - setValueForAttribute(domElement, "transform-origin", value); - break; - - case "underlinePosition": - setValueForAttribute(domElement, "underline-position", value); - break; - - case "underlineThickness": - setValueForAttribute(domElement, "underline-thickness", value); - break; - - case "unicodeBidi": - setValueForAttribute(domElement, "unicode-bidi", value); - break; - - case "unicodeRange": - setValueForAttribute(domElement, "unicode-range", value); - break; - - case "unitsPerEm": - setValueForAttribute(domElement, "units-per-em", value); - break; - - case "vAlphabetic": - setValueForAttribute(domElement, "v-alphabetic", value); - break; - - case "vHanging": - setValueForAttribute(domElement, "v-hanging", value); - break; - - case "vIdeographic": - setValueForAttribute(domElement, "v-ideographic", value); - break; - - case "vMathematical": - setValueForAttribute(domElement, "v-mathematical", value); - break; - - case "vectorEffect": - setValueForAttribute(domElement, "vector-effect", value); - break; - - case "vertAdvY": - setValueForAttribute(domElement, "vert-adv-y", value); - break; - - case "vertOriginX": - setValueForAttribute(domElement, "vert-origin-x", value); - break; - - case "vertOriginY": - setValueForAttribute(domElement, "vert-origin-y", value); - break; - - case "wordSpacing": - setValueForAttribute(domElement, "word-spacing", value); - break; - - case "writingMode": - setValueForAttribute(domElement, "writing-mode", value); - break; - - case "xmlnsXlink": - setValueForAttribute(domElement, "xmlns:xlink", value); - break; - - case "xHeight": - setValueForAttribute(domElement, "x-height", value); - break; case "xlinkActuate": setValueForNamespacedAttribute( @@ -39082,7 +38879,8 @@ function setProp(domElement, tag, key, value, props) { warnForInvalidEventListener(key, value); } } else { - setValueForAttribute(domElement, key, value); + var attributeName = getAttributeAlias(key); + setValueForAttribute(domElement, attributeName, value); } } } @@ -39203,6 +39001,18 @@ function setInitialProperties(domElement, tag, props) { } // TODO: Make sure that we check isMounted before firing any of these events. switch (tag) { + case "div": + case "span": + case "svg": + case "path": + case "a": + case "g": + case "p": + case "li": { + // Fast track the most common tag types + break; + } + case "input": { initWrapperState$2(domElement, props); // We listen to this event in case to ensure emulated bubble // listeners still fire for the invalid event. @@ -39221,6 +39031,24 @@ function setInitialProperties(domElement, tag, props) { } switch (propKey) { + case "type": { + // Fast path since 'type' is very common on inputs + if ( + propValue != null && + typeof propValue !== "function" && + typeof propValue !== "symbol" && + typeof propValue !== "boolean" + ) { + { + checkAttributeStringCoercion(propValue, propKey); + } + + domElement.setAttribute(propKey, propValue); + } + + break; + } + case "checked": { var node = domElement; var checked = @@ -39476,36 +39304,46 @@ function setInitialProperties(domElement, tag, props) { return; } - } - if (isCustomElement(tag)) { - for (var _propKey5 in props) { - if (!props.hasOwnProperty(_propKey5)) { - continue; - } + default: { + if (isCustomElement(tag)) { + for (var _propKey5 in props) { + if (!props.hasOwnProperty(_propKey5)) { + continue; + } - var _propValue5 = props[_propKey5]; + var _propValue5 = props[_propKey5]; - if (_propValue5 == null) { - continue; - } + if (_propValue5 == null) { + continue; + } - setPropOnCustomElement(domElement, tag, _propKey5, _propValue5, props); - } - } else { - for (var _propKey6 in props) { - if (!props.hasOwnProperty(_propKey6)) { - continue; + setPropOnCustomElement( + domElement, + tag, + _propKey5, + _propValue5, + props + ); + } + + return; } + } + } - var _propValue6 = props[_propKey6]; + for (var _propKey6 in props) { + if (!props.hasOwnProperty(_propKey6)) { + continue; + } - if (_propValue6 == null) { - continue; - } + var _propValue6 = props[_propKey6]; - setProp(domElement, tag, _propKey6, _propValue6, props); + if (_propValue6 == null) { + continue; } + + setProp(domElement, tag, _propKey6, _propValue6, props); } } // Calculate the diff between the two objects. @@ -39639,6 +39477,18 @@ function updateProperties( nextProps ) { switch (tag) { + case "div": + case "span": + case "svg": + case "path": + case "a": + case "g": + case "p": + case "li": { + // Fast track the most common tag types + break; + } + case "input": { // Update checked *before* name. // In the middle of an update, it is possible to have multiple checked. @@ -39823,26 +39673,30 @@ function updateProperties( return; } - } // Apply the diff. - if (isCustomElement(tag)) { - for (var _i5 = 0; _i5 < updatePayload.length; _i5 += 2) { - var _propKey11 = updatePayload[_i5]; - var _propValue11 = updatePayload[_i5 + 1]; - setPropOnCustomElement( - domElement, - tag, - _propKey11, - _propValue11, - nextProps - ); - } - } else { - for (var _i6 = 0; _i6 < updatePayload.length; _i6 += 2) { - var _propKey12 = updatePayload[_i6]; - var _propValue12 = updatePayload[_i6 + 1]; - setProp(domElement, tag, _propKey12, _propValue12, nextProps); + default: { + if (isCustomElement(tag)) { + for (var _i5 = 0; _i5 < updatePayload.length; _i5 += 2) { + var _propKey11 = updatePayload[_i5]; + var _propValue11 = updatePayload[_i5 + 1]; + setPropOnCustomElement( + domElement, + tag, + _propKey11, + _propValue11, + nextProps + ); + } + + return; + } } + } // Apply the diff. + + for (var _i6 = 0; _i6 < updatePayload.length; _i6 += 2) { + var _propKey12 = updatePayload[_i6]; + var _propValue12 = updatePayload[_i6 + 1]; + setProp(domElement, tag, _propKey12, _propValue12, nextProps); } } @@ -40383,6 +40237,20 @@ function diffHydratedGenericElement( continue; + case "className": + hydrateAttribute(domElement, propKey, "class", value, extraAttributes); + continue; + + case "tabIndex": + hydrateAttribute( + domElement, + propKey, + "tabindex", + value, + extraAttributes + ); + continue; + case "style": extraAttributes.delete(propKey); diffHydratedStyles(domElement, value); @@ -40595,786 +40463,6 @@ function diffHydratedGenericElement( ); continue; } - // A few React string attributes have a different name. - // This is a mapping from React prop names to the attribute names. - - case "acceptCharset": - hydrateAttribute( - domElement, - propKey, - "accept-charset", - value, - extraAttributes - ); - continue; - - case "className": - hydrateAttribute(domElement, propKey, "class", value, extraAttributes); - continue; - - case "htmlFor": - hydrateAttribute(domElement, propKey, "for", value, extraAttributes); - continue; - - case "httpEquiv": - hydrateAttribute( - domElement, - propKey, - "http-equiv", - value, - extraAttributes - ); - continue; - - case "tabIndex": - hydrateAttribute( - domElement, - propKey, - "tabindex", - value, - extraAttributes - ); - continue; - - case "crossOrigin": - hydrateAttribute( - domElement, - propKey, - "crossorigin", - value, - extraAttributes - ); - continue; - - case "accentHeight": - hydrateAttribute( - domElement, - propKey, - "accent-height", - value, - extraAttributes - ); - continue; - - case "alignmentBaseline": - hydrateAttribute( - domElement, - propKey, - "alignment-baseline", - value, - extraAttributes - ); - continue; - - case "arabicForm": - hydrateAttribute( - domElement, - propKey, - "arabic-form", - value, - extraAttributes - ); - continue; - - case "baselineShift": - hydrateAttribute( - domElement, - propKey, - "baseline-shift", - value, - extraAttributes - ); - continue; - - case "capHeight": - hydrateAttribute( - domElement, - propKey, - "cap-height", - value, - extraAttributes - ); - continue; - - case "clipPath": - hydrateAttribute( - domElement, - propKey, - "clip-path", - value, - extraAttributes - ); - continue; - - case "clipRule": - hydrateAttribute( - domElement, - propKey, - "clip-rule", - value, - extraAttributes - ); - continue; - - case "colorInterpolation": - hydrateAttribute( - domElement, - propKey, - "color-interpolation", - value, - extraAttributes - ); - continue; - - case "colorInterpolationFilters": - hydrateAttribute( - domElement, - propKey, - "color-interpolation-filters", - value, - extraAttributes - ); - continue; - - case "colorProfile": - hydrateAttribute( - domElement, - propKey, - "color-profile", - value, - extraAttributes - ); - continue; - - case "colorRendering": - hydrateAttribute( - domElement, - propKey, - "color-rendering", - value, - extraAttributes - ); - continue; - - case "dominantBaseline": - hydrateAttribute( - domElement, - propKey, - "dominant-baseline", - value, - extraAttributes - ); - continue; - - case "enableBackground": - hydrateAttribute( - domElement, - propKey, - "enable-background", - value, - extraAttributes - ); - continue; - - case "fillOpacity": - hydrateAttribute( - domElement, - propKey, - "fill-opacity", - value, - extraAttributes - ); - continue; - - case "fillRule": - hydrateAttribute( - domElement, - propKey, - "fill-rule", - value, - extraAttributes - ); - continue; - - case "floodColor": - hydrateAttribute( - domElement, - propKey, - "flood-color", - value, - extraAttributes - ); - continue; - - case "floodOpacity": - hydrateAttribute( - domElement, - propKey, - "flood-opacity", - value, - extraAttributes - ); - continue; - - case "fontFamily": - hydrateAttribute( - domElement, - propKey, - "font-family", - value, - extraAttributes - ); - continue; - - case "fontSize": - hydrateAttribute( - domElement, - propKey, - "font-size", - value, - extraAttributes - ); - continue; - - case "fontSizeAdjust": - hydrateAttribute( - domElement, - propKey, - "font-size-adjust", - value, - extraAttributes - ); - continue; - - case "fontStretch": - hydrateAttribute( - domElement, - propKey, - "font-stretch", - value, - extraAttributes - ); - continue; - - case "fontStyle": - hydrateAttribute( - domElement, - propKey, - "font-style", - value, - extraAttributes - ); - continue; - - case "fontVariant": - hydrateAttribute( - domElement, - propKey, - "font-variant", - value, - extraAttributes - ); - continue; - - case "fontWeight": - hydrateAttribute( - domElement, - propKey, - "font-weight", - value, - extraAttributes - ); - continue; - - case "glyphName": - hydrateAttribute( - domElement, - propKey, - "glyph-name", - value, - extraAttributes - ); - continue; - - case "glyphOrientationHorizontal": - hydrateAttribute( - domElement, - propKey, - "glyph-orientation-horizontal", - value, - extraAttributes - ); - continue; - - case "glyphOrientationVertical": - hydrateAttribute( - domElement, - propKey, - "glyph-orientation-vertical", - value, - extraAttributes - ); - continue; - - case "horizAdvX": - hydrateAttribute( - domElement, - propKey, - "horiz-adv-x", - value, - extraAttributes - ); - continue; - - case "horizOriginX": - hydrateAttribute( - domElement, - propKey, - "horiz-origin-x", - value, - extraAttributes - ); - continue; - - case "imageRendering": - hydrateAttribute( - domElement, - propKey, - "image-rendering", - value, - extraAttributes - ); - continue; - - case "letterSpacing": - hydrateAttribute( - domElement, - propKey, - "letter-spacing", - value, - extraAttributes - ); - continue; - - case "lightingColor": - hydrateAttribute( - domElement, - propKey, - "lighting-color", - value, - extraAttributes - ); - continue; - - case "markerEnd": - hydrateAttribute( - domElement, - propKey, - "marker-end", - value, - extraAttributes - ); - continue; - - case "markerMid": - hydrateAttribute( - domElement, - propKey, - "marker-mid", - value, - extraAttributes - ); - continue; - - case "markerStart": - hydrateAttribute( - domElement, - propKey, - "marker-start", - value, - extraAttributes - ); - continue; - - case "overlinePosition": - hydrateAttribute( - domElement, - propKey, - "overline-position", - value, - extraAttributes - ); - continue; - - case "overlineThickness": - hydrateAttribute( - domElement, - propKey, - "overline-thickness", - value, - extraAttributes - ); - continue; - - case "paintOrder": - hydrateAttribute( - domElement, - propKey, - "paint-order", - value, - extraAttributes - ); - continue; - - case "panose-1": - hydrateAttribute( - domElement, - propKey, - "panose-1", - value, - extraAttributes - ); - continue; - - case "pointerEvents": - hydrateAttribute( - domElement, - propKey, - "pointer-events", - value, - extraAttributes - ); - continue; - - case "renderingIntent": - hydrateAttribute( - domElement, - propKey, - "rendering-intent", - value, - extraAttributes - ); - continue; - - case "shapeRendering": - hydrateAttribute( - domElement, - propKey, - "shape-rendering", - value, - extraAttributes - ); - continue; - - case "stopColor": - hydrateAttribute( - domElement, - propKey, - "stop-color", - value, - extraAttributes - ); - continue; - - case "stopOpacity": - hydrateAttribute( - domElement, - propKey, - "stop-opacity", - value, - extraAttributes - ); - continue; - - case "strikethroughPosition": - hydrateAttribute( - domElement, - propKey, - "strikethrough-position", - value, - extraAttributes - ); - continue; - - case "strikethroughThickness": - hydrateAttribute( - domElement, - propKey, - "strikethrough-thickness", - value, - extraAttributes - ); - continue; - - case "strokeDasharray": - hydrateAttribute( - domElement, - propKey, - "stroke-dasharray", - value, - extraAttributes - ); - continue; - - case "strokeDashoffset": - hydrateAttribute( - domElement, - propKey, - "stroke-dashoffset", - value, - extraAttributes - ); - continue; - - case "strokeLinecap": - hydrateAttribute( - domElement, - propKey, - "stroke-linecap", - value, - extraAttributes - ); - continue; - - case "strokeLinejoin": - hydrateAttribute( - domElement, - propKey, - "stroke-linejoin", - value, - extraAttributes - ); - continue; - - case "strokeMiterlimit": - hydrateAttribute( - domElement, - propKey, - "stroke-miterlimit", - value, - extraAttributes - ); - continue; - - case "strokeOpacity": - hydrateAttribute( - domElement, - propKey, - "stroke-opacity", - value, - extraAttributes - ); - continue; - - case "strokeWidth": - hydrateAttribute( - domElement, - propKey, - "stroke-width", - value, - extraAttributes - ); - continue; - - case "textAnchor": - hydrateAttribute( - domElement, - propKey, - "text-anchor", - value, - extraAttributes - ); - continue; - - case "textDecoration": - hydrateAttribute( - domElement, - propKey, - "text-decoration", - value, - extraAttributes - ); - continue; - - case "textRendering": - hydrateAttribute( - domElement, - propKey, - "text-rendering", - value, - extraAttributes - ); - continue; - - case "transformOrigin": - hydrateAttribute( - domElement, - propKey, - "transform-origin", - value, - extraAttributes - ); - continue; - - case "underlinePosition": - hydrateAttribute( - domElement, - propKey, - "underline-position", - value, - extraAttributes - ); - continue; - - case "underlineThickness": - hydrateAttribute( - domElement, - propKey, - "underline-thickness", - value, - extraAttributes - ); - continue; - - case "unicodeBidi": - hydrateAttribute( - domElement, - propKey, - "unicode-bidi", - value, - extraAttributes - ); - continue; - - case "unicodeRange": - hydrateAttribute( - domElement, - propKey, - "unicode-range", - value, - extraAttributes - ); - continue; - - case "unitsPerEm": - hydrateAttribute( - domElement, - propKey, - "units-per-em", - value, - extraAttributes - ); - continue; - - case "vAlphabetic": - hydrateAttribute( - domElement, - propKey, - "v-alphabetic", - value, - extraAttributes - ); - continue; - - case "vHanging": - hydrateAttribute( - domElement, - propKey, - "v-hanging", - value, - extraAttributes - ); - continue; - - case "vIdeographic": - hydrateAttribute( - domElement, - propKey, - "v-ideographic", - value, - extraAttributes - ); - continue; - - case "vMathematical": - hydrateAttribute( - domElement, - propKey, - "v-mathematical", - value, - extraAttributes - ); - continue; - - case "vectorEffect": - hydrateAttribute( - domElement, - propKey, - "vector-effect", - value, - extraAttributes - ); - continue; - - case "vertAdvY": - hydrateAttribute( - domElement, - propKey, - "vert-adv-y", - value, - extraAttributes - ); - continue; - - case "vertOriginX": - hydrateAttribute( - domElement, - propKey, - "vert-origin-x", - value, - extraAttributes - ); - continue; - - case "vertOriginY": - hydrateAttribute( - domElement, - propKey, - "vert-origin-y", - value, - extraAttributes - ); - continue; - - case "wordSpacing": - hydrateAttribute( - domElement, - propKey, - "word-spacing", - value, - extraAttributes - ); - continue; - - case "writingMode": - hydrateAttribute( - domElement, - propKey, - "writing-mode", - value, - extraAttributes - ); - continue; - - case "xmlnsXlink": - hydrateAttribute( - domElement, - propKey, - "xmlns:xlink", - value, - extraAttributes - ); - continue; case "xHeight": hydrateAttribute( @@ -41487,6 +40575,7 @@ function diffHydratedGenericElement( continue; } + var attributeName = getAttributeAlias(propKey); var isMismatchDueToBadCasing = false; var ownNamespaceDev = parentNamespaceDev; @@ -41495,7 +40584,7 @@ function diffHydratedGenericElement( } if (ownNamespaceDev === HTML_NAMESPACE) { - extraAttributes.delete(propKey.toLowerCase()); + extraAttributes.delete(attributeName.toLowerCase()); } else { var standardName = getPossibleStandardName(propKey); @@ -41509,10 +40598,14 @@ function diffHydratedGenericElement( extraAttributes.delete(standardName); } - extraAttributes.delete(propKey); + extraAttributes.delete(attributeName); } - var _serverValue4 = getValueForAttribute(domElement, propKey, value); + var _serverValue4 = getValueForAttribute( + domElement, + attributeName, + value + ); if (!isMismatchDueToBadCasing) { warnForPropDifference(propKey, _serverValue4, value); diff --git a/compiled/facebook-www/ReactDOM-prod.classic.js b/compiled/facebook-www/ReactDOM-prod.classic.js index 23077495b06f7..2c87c81d74e87 100644 --- a/compiled/facebook-www/ReactDOM-prod.classic.js +++ b/compiled/facebook-www/ReactDOM-prod.classic.js @@ -739,6 +739,20 @@ function setValueForAttribute(node, name, value) { ); } } +function setValueForKnownAttribute(node, name, value) { + if (null === value) node.removeAttribute(name); + else { + switch (typeof value) { + case "undefined": + case "function": + case "symbol": + case "boolean": + node.removeAttribute(name); + return; + } + node.setAttribute(name, enableTrustedTypesIntegration ? value : "" + value); + } +} function setValueForNamespacedAttribute(node, namespace, name, value) { if (null === value) node.removeAttribute(name); else { @@ -1170,6 +1184,11 @@ function setTextContent(node, text) { } node.textContent = text; } +var unitlessNumbers = new Set( + "animationIterationCount aspectRatio borderImageOutset borderImageSlice borderImageWidth boxFlex boxFlexGroup boxOrdinalGroup columnCount columns flex flexGrow flexPositive flexShrink flexNegative flexOrder gridArea gridRow gridRowEnd gridRowSpan gridRowStart gridColumn gridColumnEnd gridColumnSpan gridColumnStart fontWeight lineClamp lineHeight opacity order orphans scale tabSize widows zIndex zoom fillOpacity floodOpacity stopOpacity strokeDasharray strokeDashoffset strokeMiterlimit strokeOpacity strokeWidth MozAnimationIterationCount MozBoxFlex MozBoxFlexGroup MozLineClamp msAnimationIterationCount msFlex msZoom msFlexGrow msFlexNegative msFlexOrder msFlexPositive msFlexShrink msGridColumn msGridColumnSpan msGridRow msGridRowSpan WebkitAnimationIterationCount WebkitBoxFlex WebKitBoxFlexGroup WebkitBoxOrdinalGroup WebkitColumnCount WebkitColumns WebkitFlex WebkitFlexGrow WebkitFlexPositive WebkitFlexShrink WebkitLineClamp".split( + " " + ) +); function setValueForStyles(node, styles) { if (null != styles && "object" !== typeof styles) throw Error(formatProdErrorMessage(62)); @@ -1178,100 +1197,21 @@ function setValueForStyles(node, styles) { if (styles.hasOwnProperty(styleName)) { var value = styles[styleName], isCustomProperty = 0 === styleName.indexOf("--"); - if (null == value || "boolean" === typeof value || "" === value) - isCustomProperty + null == value || "boolean" === typeof value || "" === value + ? isCustomProperty ? node.setProperty(styleName, "") : "float" === styleName ? (node.cssFloat = "") - : (node[styleName] = ""); - else if (isCustomProperty) node.setProperty(styleName, value); - else { - if ((isCustomProperty = "number" === typeof value && 0 !== value)) { - a: switch (styleName) { - case "animationIterationCount": - case "aspectRatio": - case "borderImageOutset": - case "borderImageSlice": - case "borderImageWidth": - case "boxFlex": - case "boxFlexGroup": - case "boxOrdinalGroup": - case "columnCount": - case "columns": - case "flex": - case "flexGrow": - case "flexPositive": - case "flexShrink": - case "flexNegative": - case "flexOrder": - case "gridArea": - case "gridRow": - case "gridRowEnd": - case "gridRowSpan": - case "gridRowStart": - case "gridColumn": - case "gridColumnEnd": - case "gridColumnSpan": - case "gridColumnStart": - case "fontWeight": - case "lineClamp": - case "lineHeight": - case "opacity": - case "order": - case "orphans": - case "scale": - case "tabSize": - case "widows": - case "zIndex": - case "zoom": - case "fillOpacity": - case "floodOpacity": - case "stopOpacity": - case "strokeDasharray": - case "strokeDashoffset": - case "strokeMiterlimit": - case "strokeOpacity": - case "strokeWidth": - case "MozAnimationIterationCount": - case "MozBoxFlex": - case "MozBoxFlexGroup": - case "MozLineClamp": - case "msAnimationIterationCount": - case "msFlex": - case "msZoom": - case "msFlexGrow": - case "msFlexNegative": - case "msFlexOrder": - case "msFlexPositive": - case "msFlexShrink": - case "msGridColumn": - case "msGridColumnSpan": - case "msGridRow": - case "msGridRowSpan": - case "WebkitAnimationIterationCount": - case "WebkitBoxFlex": - case "WebKitBoxFlexGroup": - case "WebkitBoxOrdinalGroup": - case "WebkitColumnCount": - case "WebkitColumns": - case "WebkitFlex": - case "WebkitFlexGrow": - case "WebkitFlexPositive": - case "WebkitFlexShrink": - case "WebkitLineClamp": - isCustomProperty = !0; - break a; - default: - isCustomProperty = !1; - } - isCustomProperty = !isCustomProperty; - } - isCustomProperty - ? (node[styleName] = value + "px") - : "float" === styleName + : (node[styleName] = "") + : isCustomProperty + ? node.setProperty(styleName, value) + : "number" !== typeof value || + 0 === value || + unitlessNumbers.has(styleName) + ? "float" === styleName ? (node.cssFloat = value) - : (node[styleName] = ("" + value).trim()); - } + : (node[styleName] = ("" + value).trim()) + : (node[styleName] = value + "px"); } } function isCustomElement(tagName) { @@ -1290,8 +1230,88 @@ function isCustomElement(tagName) { return !0; } } -var isJavaScriptProtocol = - /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i; +var aliases = new Map([ + ["acceptCharset", "accept-charset"], + ["htmlFor", "for"], + ["httpEquiv", "http-equiv"], + ["crossOrigin", "crossorigin"], + ["accentHeight", "accent-height"], + ["alignmentBaseline", "alignment-baseline"], + ["arabicForm", "arabic-form"], + ["baselineShift", "baseline-shift"], + ["capHeight", "cap-height"], + ["clipPath", "clip-path"], + ["clipRule", "clip-rule"], + ["colorInterpolation", "color-interpolation"], + ["colorInterpolationFilters", "color-interpolation-filters"], + ["colorProfile", "color-profile"], + ["colorRendering", "color-rendering"], + ["dominantBaseline", "dominant-baseline"], + ["enableBackground", "enable-background"], + ["fillOpacity", "fill-opacity"], + ["fillRule", "fill-rule"], + ["floodColor", "flood-color"], + ["floodOpacity", "flood-opacity"], + ["fontFamily", "font-family"], + ["fontSize", "font-size"], + ["fontSizeAdjust", "font-size-adjust"], + ["fontStretch", "font-stretch"], + ["fontStyle", "font-style"], + ["fontVariant", "font-variant"], + ["fontWeight", "font-weight"], + ["glyphName", "glyph-name"], + ["glyphOrientationHorizontal", "glyph-orientation-horizontal"], + ["glyphOrientationVertical", "glyph-orientation-vertical"], + ["horizAdvX", "horiz-adv-x"], + ["horizOriginX", "horiz-origin-x"], + ["imageRendering", "image-rendering"], + ["letterSpacing", "letter-spacing"], + ["lightingColor", "lighting-color"], + ["markerEnd", "marker-end"], + ["markerMid", "marker-mid"], + ["markerStart", "marker-start"], + ["overlinePosition", "overline-position"], + ["overlineThickness", "overline-thickness"], + ["paintOrder", "paint-order"], + ["panose-1", "panose-1"], + ["pointerEvents", "pointer-events"], + ["renderingIntent", "rendering-intent"], + ["shapeRendering", "shape-rendering"], + ["stopColor", "stop-color"], + ["stopOpacity", "stop-opacity"], + ["strikethroughPosition", "strikethrough-position"], + ["strikethroughThickness", "strikethrough-thickness"], + ["strokeDasharray", "stroke-dasharray"], + ["strokeDashoffset", "stroke-dashoffset"], + ["strokeLinecap", "stroke-linecap"], + ["strokeLinejoin", "stroke-linejoin"], + ["strokeMiterlimit", "stroke-miterlimit"], + ["strokeOpacity", "stroke-opacity"], + ["strokeWidth", "stroke-width"], + ["textAnchor", "text-anchor"], + ["textDecoration", "text-decoration"], + ["textRendering", "text-rendering"], + ["transformOrigin", "transform-origin"], + ["underlinePosition", "underline-position"], + ["underlineThickness", "underline-thickness"], + ["unicodeBidi", "unicode-bidi"], + ["unicodeRange", "unicode-range"], + ["unitsPerEm", "units-per-em"], + ["vAlphabetic", "v-alphabetic"], + ["vHanging", "v-hanging"], + ["vIdeographic", "v-ideographic"], + ["vMathematical", "v-mathematical"], + ["vectorEffect", "vector-effect"], + ["vertAdvY", "vert-adv-y"], + ["vertOriginX", "vert-origin-x"], + ["vertOriginY", "vert-origin-y"], + ["wordSpacing", "word-spacing"], + ["writingMode", "writing-mode"], + ["xmlnsXlink", "xmlns:xlink"], + ["xHeight", "x-height"] + ]), + isJavaScriptProtocol = + /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i; function sanitizeURL(url) { return isJavaScriptProtocol.test("" + url) ? "javascript:throw new Error('React has blocked a javascript: URL as a security precaution.')" @@ -12555,19 +12575,19 @@ function getTargetInstForChangeEvent(domEventName, targetInst) { } var isInputEventSupported = !1; if (canUseDOM) { - var JSCompiler_inline_result$jscomp$336; + var JSCompiler_inline_result$jscomp$335; if (canUseDOM) { - var isSupported$jscomp$inline_1566 = "oninput" in document; - if (!isSupported$jscomp$inline_1566) { - var element$jscomp$inline_1567 = document.createElement("div"); - element$jscomp$inline_1567.setAttribute("oninput", "return;"); - isSupported$jscomp$inline_1566 = - "function" === typeof element$jscomp$inline_1567.oninput; + var isSupported$jscomp$inline_1568 = "oninput" in document; + if (!isSupported$jscomp$inline_1568) { + var element$jscomp$inline_1569 = document.createElement("div"); + element$jscomp$inline_1569.setAttribute("oninput", "return;"); + isSupported$jscomp$inline_1568 = + "function" === typeof element$jscomp$inline_1569.oninput; } - JSCompiler_inline_result$jscomp$336 = isSupported$jscomp$inline_1566; - } else JSCompiler_inline_result$jscomp$336 = !1; + JSCompiler_inline_result$jscomp$335 = isSupported$jscomp$inline_1568; + } else JSCompiler_inline_result$jscomp$335 = !1; isInputEventSupported = - JSCompiler_inline_result$jscomp$336 && + JSCompiler_inline_result$jscomp$335 && (!document.documentMode || 9 < document.documentMode); } function stopWatchingForValueChange() { @@ -12876,20 +12896,20 @@ function registerSimpleEvent(domEventName, reactName) { registerTwoPhaseEvent(reactName, [domEventName]); } for ( - var i$jscomp$inline_1607 = 0; - i$jscomp$inline_1607 < simpleEventPluginEvents.length; - i$jscomp$inline_1607++ + var i$jscomp$inline_1609 = 0; + i$jscomp$inline_1609 < simpleEventPluginEvents.length; + i$jscomp$inline_1609++ ) { - var eventName$jscomp$inline_1608 = - simpleEventPluginEvents[i$jscomp$inline_1607], - domEventName$jscomp$inline_1609 = - eventName$jscomp$inline_1608.toLowerCase(), - capitalizedEvent$jscomp$inline_1610 = - eventName$jscomp$inline_1608[0].toUpperCase() + - eventName$jscomp$inline_1608.slice(1); + var eventName$jscomp$inline_1610 = + simpleEventPluginEvents[i$jscomp$inline_1609], + domEventName$jscomp$inline_1611 = + eventName$jscomp$inline_1610.toLowerCase(), + capitalizedEvent$jscomp$inline_1612 = + eventName$jscomp$inline_1610[0].toUpperCase() + + eventName$jscomp$inline_1610.slice(1); registerSimpleEvent( - domEventName$jscomp$inline_1609, - "on" + capitalizedEvent$jscomp$inline_1610 + domEventName$jscomp$inline_1611, + "on" + capitalizedEvent$jscomp$inline_1612 ); } registerSimpleEvent(ANIMATION_END, "onAnimationEnd"); @@ -13723,9 +13743,57 @@ function normalizeMarkupForTextOrAttribute(markup) { function noop$1() {} function setProp(domElement, tag, key, value, props) { switch (key) { + case "children": + "string" === typeof value + ? "body" === tag || + ("textarea" === tag && "" === value) || + setTextContent(domElement, value) + : "number" === typeof value && + "body" !== tag && + setTextContent(domElement, "" + value); + break; + case "className": + setValueForKnownAttribute(domElement, "class", value); + break; + case "tabIndex": + setValueForKnownAttribute(domElement, "tabindex", value); + break; + case "dir": + case "role": + case "viewBox": + case "width": + case "height": + setValueForKnownAttribute(domElement, key, value); + break; case "style": setValueForStyles(domElement, value); break; + case "src": + case "href": + case "action": + if ("" === value) { + domElement.removeAttribute(key); + break; + } + case "formAction": + if ( + null == value || + "function" === typeof value || + "symbol" === typeof value || + "boolean" === typeof value + ) { + domElement.removeAttribute(key); + break; + } + value = sanitizeURL(enableTrustedTypesIntegration ? value : "" + value); + domElement.setAttribute(key, value); + break; + case "onClick": + null != value && (domElement.onclick = noop$1); + break; + case "onScroll": + null != value && listenToNonDelegatedEvent("scroll", domElement); + break; case "dangerouslySetInnerHTML": if (null != value) { if ("object" !== typeof value || !("__html" in value)) @@ -13739,21 +13807,6 @@ function setProp(domElement, tag, key, value, props) { } } break; - case "children": - "string" === typeof value - ? "body" === tag || - ("textarea" === tag && "" === value) || - setTextContent(domElement, value) - : "number" === typeof value && - "body" !== tag && - setTextContent(domElement, "" + value); - break; - case "onScroll": - null != value && listenToNonDelegatedEvent("scroll", domElement); - break; - case "onClick": - null != value && (domElement.onclick = noop$1); - break; case "multiple": domElement.multiple = value && "function" !== typeof value && "symbol" !== typeof value; @@ -13770,26 +13823,6 @@ function setProp(domElement, tag, key, value, props) { break; case "autoFocus": break; - case "src": - case "href": - case "action": - if ("" === value) { - domElement.removeAttribute(key); - break; - } - case "formAction": - if ( - null == value || - "function" === typeof value || - "symbol" === typeof value || - "boolean" === typeof value - ) { - domElement.removeAttribute(key); - break; - } - props = sanitizeURL(enableTrustedTypesIntegration ? value : "" + value); - domElement.setAttribute(key, props); - break; case "xlinkHref": if ( null == value || @@ -13877,246 +13910,6 @@ function setProp(domElement, tag, key, value, props) { ? domElement.removeAttribute(key) : domElement.setAttribute(key, value); break; - case "acceptCharset": - setValueForAttribute(domElement, "accept-charset", value); - break; - case "className": - setValueForAttribute(domElement, "class", value); - break; - case "htmlFor": - setValueForAttribute(domElement, "for", value); - break; - case "httpEquiv": - setValueForAttribute(domElement, "http-equiv", value); - break; - case "tabIndex": - setValueForAttribute(domElement, "tabindex", value); - break; - case "crossOrigin": - setValueForAttribute(domElement, "crossorigin", value); - break; - case "accentHeight": - setValueForAttribute(domElement, "accent-height", value); - break; - case "alignmentBaseline": - setValueForAttribute(domElement, "alignment-baseline", value); - break; - case "arabicForm": - setValueForAttribute(domElement, "arabic-form", value); - break; - case "baselineShift": - setValueForAttribute(domElement, "baseline-shift", value); - break; - case "capHeight": - setValueForAttribute(domElement, "cap-height", value); - break; - case "clipPath": - setValueForAttribute(domElement, "clip-path", value); - break; - case "clipRule": - setValueForAttribute(domElement, "clip-rule", value); - break; - case "colorInterpolation": - setValueForAttribute(domElement, "color-interpolation", value); - break; - case "colorInterpolationFilters": - setValueForAttribute(domElement, "color-interpolation-filters", value); - break; - case "colorProfile": - setValueForAttribute(domElement, "color-profile", value); - break; - case "colorRendering": - setValueForAttribute(domElement, "color-rendering", value); - break; - case "dominantBaseline": - setValueForAttribute(domElement, "dominant-baseline", value); - break; - case "enableBackground": - setValueForAttribute(domElement, "enable-background", value); - break; - case "fillOpacity": - setValueForAttribute(domElement, "fill-opacity", value); - break; - case "fillRule": - setValueForAttribute(domElement, "fill-rule", value); - break; - case "floodColor": - setValueForAttribute(domElement, "flood-color", value); - break; - case "floodOpacity": - setValueForAttribute(domElement, "flood-opacity", value); - break; - case "fontFamily": - setValueForAttribute(domElement, "font-family", value); - break; - case "fontSize": - setValueForAttribute(domElement, "font-size", value); - break; - case "fontSizeAdjust": - setValueForAttribute(domElement, "font-size-adjust", value); - break; - case "fontStretch": - setValueForAttribute(domElement, "font-stretch", value); - break; - case "fontStyle": - setValueForAttribute(domElement, "font-style", value); - break; - case "fontVariant": - setValueForAttribute(domElement, "font-variant", value); - break; - case "fontWeight": - setValueForAttribute(domElement, "font-weight", value); - break; - case "glyphName": - setValueForAttribute(domElement, "glyph-name", value); - break; - case "glyphOrientationHorizontal": - setValueForAttribute(domElement, "glyph-orientation-horizontal", value); - break; - case "glyphOrientationVertical": - setValueForAttribute(domElement, "glyph-orientation-vertical", value); - break; - case "horizAdvX": - setValueForAttribute(domElement, "horiz-adv-x", value); - break; - case "horizOriginX": - setValueForAttribute(domElement, "horiz-origin-x", value); - break; - case "imageRendering": - setValueForAttribute(domElement, "image-rendering", value); - break; - case "letterSpacing": - setValueForAttribute(domElement, "letter-spacing", value); - break; - case "lightingColor": - setValueForAttribute(domElement, "lighting-color", value); - break; - case "markerEnd": - setValueForAttribute(domElement, "marker-end", value); - break; - case "markerMid": - setValueForAttribute(domElement, "marker-mid", value); - break; - case "markerStart": - setValueForAttribute(domElement, "marker-start", value); - break; - case "overlinePosition": - setValueForAttribute(domElement, "overline-position", value); - break; - case "overlineThickness": - setValueForAttribute(domElement, "overline-thickness", value); - break; - case "paintOrder": - setValueForAttribute(domElement, "paint-order", value); - break; - case "panose-1": - setValueForAttribute(domElement, "panose-1", value); - break; - case "pointerEvents": - setValueForAttribute(domElement, "pointer-events", value); - break; - case "renderingIntent": - setValueForAttribute(domElement, "rendering-intent", value); - break; - case "shapeRendering": - setValueForAttribute(domElement, "shape-rendering", value); - break; - case "stopColor": - setValueForAttribute(domElement, "stop-color", value); - break; - case "stopOpacity": - setValueForAttribute(domElement, "stop-opacity", value); - break; - case "strikethroughPosition": - setValueForAttribute(domElement, "strikethrough-position", value); - break; - case "strikethroughThickness": - setValueForAttribute(domElement, "strikethrough-thickness", value); - break; - case "strokeDasharray": - setValueForAttribute(domElement, "stroke-dasharray", value); - break; - case "strokeDashoffset": - setValueForAttribute(domElement, "stroke-dashoffset", value); - break; - case "strokeLinecap": - setValueForAttribute(domElement, "stroke-linecap", value); - break; - case "strokeLinejoin": - setValueForAttribute(domElement, "stroke-linejoin", value); - break; - case "strokeMiterlimit": - setValueForAttribute(domElement, "stroke-miterlimit", value); - break; - case "strokeOpacity": - setValueForAttribute(domElement, "stroke-opacity", value); - break; - case "strokeWidth": - setValueForAttribute(domElement, "stroke-width", value); - break; - case "textAnchor": - setValueForAttribute(domElement, "text-anchor", value); - break; - case "textDecoration": - setValueForAttribute(domElement, "text-decoration", value); - break; - case "textRendering": - setValueForAttribute(domElement, "text-rendering", value); - break; - case "transformOrigin": - setValueForAttribute(domElement, "transform-origin", value); - break; - case "underlinePosition": - setValueForAttribute(domElement, "underline-position", value); - break; - case "underlineThickness": - setValueForAttribute(domElement, "underline-thickness", value); - break; - case "unicodeBidi": - setValueForAttribute(domElement, "unicode-bidi", value); - break; - case "unicodeRange": - setValueForAttribute(domElement, "unicode-range", value); - break; - case "unitsPerEm": - setValueForAttribute(domElement, "units-per-em", value); - break; - case "vAlphabetic": - setValueForAttribute(domElement, "v-alphabetic", value); - break; - case "vHanging": - setValueForAttribute(domElement, "v-hanging", value); - break; - case "vIdeographic": - setValueForAttribute(domElement, "v-ideographic", value); - break; - case "vMathematical": - setValueForAttribute(domElement, "v-mathematical", value); - break; - case "vectorEffect": - setValueForAttribute(domElement, "vector-effect", value); - break; - case "vertAdvY": - setValueForAttribute(domElement, "vert-adv-y", value); - break; - case "vertOriginX": - setValueForAttribute(domElement, "vert-origin-x", value); - break; - case "vertOriginY": - setValueForAttribute(domElement, "vert-origin-y", value); - break; - case "wordSpacing": - setValueForAttribute(domElement, "word-spacing", value); - break; - case "writingMode": - setValueForAttribute(domElement, "writing-mode", value); - break; - case "xmlnsXlink": - setValueForAttribute(domElement, "xmlns:xlink", value); - break; - case "xHeight": - setValueForAttribute(domElement, "x-height", value); - break; case "xlinkActuate": setValueForNamespacedAttribute( domElement, @@ -14193,10 +13986,13 @@ function setProp(domElement, tag, key, value, props) { case "textContent": if (enableCustomElementPropertySupport) break; default: - (!(2 < key.length) || + if ( + !(2 < key.length) || ("o" !== key[0] && "O" !== key[0]) || - ("n" !== key[1] && "N" !== key[1])) && - setValueForAttribute(domElement, key, value); + ("n" !== key[1] && "N" !== key[1]) + ) + (key = aliases.get(key) || key), + setValueForAttribute(domElement, key, value); } } function setPropOnCustomElement(domElement, tag, key, value, props) { @@ -14271,6 +14067,15 @@ function setPropOnCustomElement(domElement, tag, key, value, props) { } function setInitialProperties(domElement, tag, props) { switch (tag) { + case "div": + case "span": + case "svg": + case "path": + case "a": + case "g": + case "p": + case "li": + break; case "input": initWrapperState$2(domElement, props); listenToNonDelegatedEvent("invalid", domElement); @@ -14279,6 +14084,13 @@ function setInitialProperties(domElement, tag, props) { var propValue = props[propKey]; if (null != propValue) switch (propKey) { + case "type": + null != propValue && + "function" !== typeof propValue && + "symbol" !== typeof propValue && + "boolean" !== typeof propValue && + domElement.setAttribute(propKey, propValue); + break; case "checked": var node = domElement; propValue = @@ -14307,16 +14119,16 @@ function setInitialProperties(domElement, tag, props) { case "select": domElement._wrapperState = { wasMultiple: !!props.multiple }; listenToNonDelegatedEvent("invalid", domElement); - for (var propKey$196 in props) + for (propValue in props) if ( - props.hasOwnProperty(propKey$196) && - ((propKey = props[propKey$196]), null != propKey) + props.hasOwnProperty(propValue) && + ((propKey = props[propValue]), null != propKey) ) - switch (propKey$196) { + switch (propValue) { case "value": break; default: - setProp(domElement, tag, propKey$196, propKey, props); + setProp(domElement, tag, propValue, propKey, props); } domElement.multiple = !!props.multiple; tag = props.value; @@ -14416,18 +14228,26 @@ function setInitialProperties(domElement, tag, props) { setProp(domElement, tag, propKey$202, propKey, props); } return; + default: + if (isCustomElement(tag)) { + for (var propKey$204 in props) + props.hasOwnProperty(propKey$204) && + ((propKey = props[propKey$204]), + null != propKey && + setPropOnCustomElement( + domElement, + tag, + propKey$204, + propKey, + props + )); + return; + } } - if (isCustomElement(tag)) - for (node in props) - props.hasOwnProperty(node) && - ((propKey = props[node]), - null != propKey && - setPropOnCustomElement(domElement, tag, node, propKey, props)); - else - for (propValue in props) - props.hasOwnProperty(propValue) && - ((propKey = props[propValue]), - null != propKey && setProp(domElement, tag, propValue, propKey, props)); + for (node in props) + props.hasOwnProperty(node) && + ((propKey = props[node]), + null != propKey && setProp(domElement, tag, node, propKey, props)); } function updateProperties( domElement, @@ -14437,6 +14257,15 @@ function updateProperties( nextProps ) { switch (tag) { + case "div": + case "span": + case "svg": + case "path": + case "a": + case "g": + case "p": + case "li": + break; case "input": "radio" === nextProps.type && null != nextProps.name && @@ -14567,25 +14396,27 @@ function updateProperties( setProp(domElement, tag, propValue, propKey, nextProps); } return; + default: + if (isCustomElement(tag)) { + for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) + setPropOnCustomElement( + domElement, + tag, + updatePayload[lastProps], + updatePayload[lastProps + 1], + nextProps + ); + return; + } } - if (isCustomElement(tag)) - for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) - setPropOnCustomElement( - domElement, - tag, - updatePayload[lastProps], - updatePayload[lastProps + 1], - nextProps - ); - else - for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) - setProp( - domElement, - tag, - updatePayload[lastProps], - updatePayload[lastProps + 1], - nextProps - ); + for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) + setProp( + domElement, + tag, + updatePayload[lastProps], + updatePayload[lastProps + 1], + nextProps + ); } var Dispatcher$1 = Internals.Dispatcher, eventsEnabled = null, @@ -16253,17 +16084,17 @@ Internals.Events = [ restoreStateIfNeeded, batchedUpdates$1 ]; -var devToolsConfig$jscomp$inline_1812 = { +var devToolsConfig$jscomp$inline_1827 = { findFiberByHostInstance: getClosestInstanceFromNode, bundleType: 0, - version: "18.3.0-www-classic-ab47ddec", + version: "18.3.0-www-classic-253ebf19", rendererPackageName: "react-dom" }; -var internals$jscomp$inline_2195 = { - bundleType: devToolsConfig$jscomp$inline_1812.bundleType, - version: devToolsConfig$jscomp$inline_1812.version, - rendererPackageName: devToolsConfig$jscomp$inline_1812.rendererPackageName, - rendererConfig: devToolsConfig$jscomp$inline_1812.rendererConfig, +var internals$jscomp$inline_2196 = { + bundleType: devToolsConfig$jscomp$inline_1827.bundleType, + version: devToolsConfig$jscomp$inline_1827.version, + rendererPackageName: devToolsConfig$jscomp$inline_1827.rendererPackageName, + rendererConfig: devToolsConfig$jscomp$inline_1827.rendererConfig, overrideHookState: null, overrideHookStateDeletePath: null, overrideHookStateRenamePath: null, @@ -16279,26 +16110,26 @@ var internals$jscomp$inline_2195 = { return null === fiber ? null : fiber.stateNode; }, findFiberByHostInstance: - devToolsConfig$jscomp$inline_1812.findFiberByHostInstance || + devToolsConfig$jscomp$inline_1827.findFiberByHostInstance || emptyFindFiberByHostInstance, findHostInstancesForRefresh: null, scheduleRefresh: null, scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-classic-ab47ddec" + reconcilerVersion: "18.3.0-www-classic-253ebf19" }; if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) { - var hook$jscomp$inline_2196 = __REACT_DEVTOOLS_GLOBAL_HOOK__; + var hook$jscomp$inline_2197 = __REACT_DEVTOOLS_GLOBAL_HOOK__; if ( - !hook$jscomp$inline_2196.isDisabled && - hook$jscomp$inline_2196.supportsFiber + !hook$jscomp$inline_2197.isDisabled && + hook$jscomp$inline_2197.supportsFiber ) try { - (rendererID = hook$jscomp$inline_2196.inject( - internals$jscomp$inline_2195 + (rendererID = hook$jscomp$inline_2197.inject( + internals$jscomp$inline_2196 )), - (injectedHook = hook$jscomp$inline_2196); + (injectedHook = hook$jscomp$inline_2197); } catch (err) {} } assign(Internals, { @@ -16526,4 +16357,4 @@ exports.unstable_renderSubtreeIntoContainer = function ( ); }; exports.unstable_runWithPriority = runWithPriority; -exports.version = "18.3.0-www-classic-ab47ddec"; +exports.version = "18.3.0-www-classic-253ebf19"; diff --git a/compiled/facebook-www/ReactDOM-prod.modern.js b/compiled/facebook-www/ReactDOM-prod.modern.js index 424eea2501910..b97bf80d7a4b8 100644 --- a/compiled/facebook-www/ReactDOM-prod.modern.js +++ b/compiled/facebook-www/ReactDOM-prod.modern.js @@ -557,6 +557,20 @@ function setValueForAttribute(node, name, value) { ); } } +function setValueForKnownAttribute(node, name, value) { + if (null === value) node.removeAttribute(name); + else { + switch (typeof value) { + case "undefined": + case "function": + case "symbol": + case "boolean": + node.removeAttribute(name); + return; + } + node.setAttribute(name, enableTrustedTypesIntegration ? value : "" + value); + } +} function setValueForNamespacedAttribute(node, namespace, name, value) { if (null === value) node.removeAttribute(name); else { @@ -1009,6 +1023,11 @@ function setTextContent(node, text) { } node.textContent = text; } +var unitlessNumbers = new Set( + "animationIterationCount aspectRatio borderImageOutset borderImageSlice borderImageWidth boxFlex boxFlexGroup boxOrdinalGroup columnCount columns flex flexGrow flexPositive flexShrink flexNegative flexOrder gridArea gridRow gridRowEnd gridRowSpan gridRowStart gridColumn gridColumnEnd gridColumnSpan gridColumnStart fontWeight lineClamp lineHeight opacity order orphans scale tabSize widows zIndex zoom fillOpacity floodOpacity stopOpacity strokeDasharray strokeDashoffset strokeMiterlimit strokeOpacity strokeWidth MozAnimationIterationCount MozBoxFlex MozBoxFlexGroup MozLineClamp msAnimationIterationCount msFlex msZoom msFlexGrow msFlexNegative msFlexOrder msFlexPositive msFlexShrink msGridColumn msGridColumnSpan msGridRow msGridRowSpan WebkitAnimationIterationCount WebkitBoxFlex WebKitBoxFlexGroup WebkitBoxOrdinalGroup WebkitColumnCount WebkitColumns WebkitFlex WebkitFlexGrow WebkitFlexPositive WebkitFlexShrink WebkitLineClamp".split( + " " + ) +); function setValueForStyles(node, styles) { if (null != styles && "object" !== typeof styles) throw Error(formatProdErrorMessage(62)); @@ -1017,100 +1036,21 @@ function setValueForStyles(node, styles) { if (styles.hasOwnProperty(styleName)) { var value = styles[styleName], isCustomProperty = 0 === styleName.indexOf("--"); - if (null == value || "boolean" === typeof value || "" === value) - isCustomProperty + null == value || "boolean" === typeof value || "" === value + ? isCustomProperty ? node.setProperty(styleName, "") : "float" === styleName ? (node.cssFloat = "") - : (node[styleName] = ""); - else if (isCustomProperty) node.setProperty(styleName, value); - else { - if ((isCustomProperty = "number" === typeof value && 0 !== value)) { - a: switch (styleName) { - case "animationIterationCount": - case "aspectRatio": - case "borderImageOutset": - case "borderImageSlice": - case "borderImageWidth": - case "boxFlex": - case "boxFlexGroup": - case "boxOrdinalGroup": - case "columnCount": - case "columns": - case "flex": - case "flexGrow": - case "flexPositive": - case "flexShrink": - case "flexNegative": - case "flexOrder": - case "gridArea": - case "gridRow": - case "gridRowEnd": - case "gridRowSpan": - case "gridRowStart": - case "gridColumn": - case "gridColumnEnd": - case "gridColumnSpan": - case "gridColumnStart": - case "fontWeight": - case "lineClamp": - case "lineHeight": - case "opacity": - case "order": - case "orphans": - case "scale": - case "tabSize": - case "widows": - case "zIndex": - case "zoom": - case "fillOpacity": - case "floodOpacity": - case "stopOpacity": - case "strokeDasharray": - case "strokeDashoffset": - case "strokeMiterlimit": - case "strokeOpacity": - case "strokeWidth": - case "MozAnimationIterationCount": - case "MozBoxFlex": - case "MozBoxFlexGroup": - case "MozLineClamp": - case "msAnimationIterationCount": - case "msFlex": - case "msZoom": - case "msFlexGrow": - case "msFlexNegative": - case "msFlexOrder": - case "msFlexPositive": - case "msFlexShrink": - case "msGridColumn": - case "msGridColumnSpan": - case "msGridRow": - case "msGridRowSpan": - case "WebkitAnimationIterationCount": - case "WebkitBoxFlex": - case "WebKitBoxFlexGroup": - case "WebkitBoxOrdinalGroup": - case "WebkitColumnCount": - case "WebkitColumns": - case "WebkitFlex": - case "WebkitFlexGrow": - case "WebkitFlexPositive": - case "WebkitFlexShrink": - case "WebkitLineClamp": - isCustomProperty = !0; - break a; - default: - isCustomProperty = !1; - } - isCustomProperty = !isCustomProperty; - } - isCustomProperty - ? (node[styleName] = value + "px") - : "float" === styleName + : (node[styleName] = "") + : isCustomProperty + ? node.setProperty(styleName, value) + : "number" !== typeof value || + 0 === value || + unitlessNumbers.has(styleName) + ? "float" === styleName ? (node.cssFloat = value) - : (node[styleName] = ("" + value).trim()); - } + : (node[styleName] = ("" + value).trim()) + : (node[styleName] = value + "px"); } } function isCustomElement(tagName) { @@ -1129,8 +1069,88 @@ function isCustomElement(tagName) { return !0; } } -var isJavaScriptProtocol = - /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i; +var aliases = new Map([ + ["acceptCharset", "accept-charset"], + ["htmlFor", "for"], + ["httpEquiv", "http-equiv"], + ["crossOrigin", "crossorigin"], + ["accentHeight", "accent-height"], + ["alignmentBaseline", "alignment-baseline"], + ["arabicForm", "arabic-form"], + ["baselineShift", "baseline-shift"], + ["capHeight", "cap-height"], + ["clipPath", "clip-path"], + ["clipRule", "clip-rule"], + ["colorInterpolation", "color-interpolation"], + ["colorInterpolationFilters", "color-interpolation-filters"], + ["colorProfile", "color-profile"], + ["colorRendering", "color-rendering"], + ["dominantBaseline", "dominant-baseline"], + ["enableBackground", "enable-background"], + ["fillOpacity", "fill-opacity"], + ["fillRule", "fill-rule"], + ["floodColor", "flood-color"], + ["floodOpacity", "flood-opacity"], + ["fontFamily", "font-family"], + ["fontSize", "font-size"], + ["fontSizeAdjust", "font-size-adjust"], + ["fontStretch", "font-stretch"], + ["fontStyle", "font-style"], + ["fontVariant", "font-variant"], + ["fontWeight", "font-weight"], + ["glyphName", "glyph-name"], + ["glyphOrientationHorizontal", "glyph-orientation-horizontal"], + ["glyphOrientationVertical", "glyph-orientation-vertical"], + ["horizAdvX", "horiz-adv-x"], + ["horizOriginX", "horiz-origin-x"], + ["imageRendering", "image-rendering"], + ["letterSpacing", "letter-spacing"], + ["lightingColor", "lighting-color"], + ["markerEnd", "marker-end"], + ["markerMid", "marker-mid"], + ["markerStart", "marker-start"], + ["overlinePosition", "overline-position"], + ["overlineThickness", "overline-thickness"], + ["paintOrder", "paint-order"], + ["panose-1", "panose-1"], + ["pointerEvents", "pointer-events"], + ["renderingIntent", "rendering-intent"], + ["shapeRendering", "shape-rendering"], + ["stopColor", "stop-color"], + ["stopOpacity", "stop-opacity"], + ["strikethroughPosition", "strikethrough-position"], + ["strikethroughThickness", "strikethrough-thickness"], + ["strokeDasharray", "stroke-dasharray"], + ["strokeDashoffset", "stroke-dashoffset"], + ["strokeLinecap", "stroke-linecap"], + ["strokeLinejoin", "stroke-linejoin"], + ["strokeMiterlimit", "stroke-miterlimit"], + ["strokeOpacity", "stroke-opacity"], + ["strokeWidth", "stroke-width"], + ["textAnchor", "text-anchor"], + ["textDecoration", "text-decoration"], + ["textRendering", "text-rendering"], + ["transformOrigin", "transform-origin"], + ["underlinePosition", "underline-position"], + ["underlineThickness", "underline-thickness"], + ["unicodeBidi", "unicode-bidi"], + ["unicodeRange", "unicode-range"], + ["unitsPerEm", "units-per-em"], + ["vAlphabetic", "v-alphabetic"], + ["vHanging", "v-hanging"], + ["vIdeographic", "v-ideographic"], + ["vMathematical", "v-mathematical"], + ["vectorEffect", "vector-effect"], + ["vertAdvY", "vert-adv-y"], + ["vertOriginX", "vert-origin-x"], + ["vertOriginY", "vert-origin-y"], + ["wordSpacing", "word-spacing"], + ["writingMode", "writing-mode"], + ["xmlnsXlink", "xmlns:xlink"], + ["xHeight", "x-height"] + ]), + isJavaScriptProtocol = + /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i; function sanitizeURL(url) { return isJavaScriptProtocol.test("" + url) ? "javascript:throw new Error('React has blocked a javascript: URL as a security precaution.')" @@ -12797,19 +12817,19 @@ function getTargetInstForChangeEvent(domEventName, targetInst) { } var isInputEventSupported = !1; if (canUseDOM) { - var JSCompiler_inline_result$jscomp$333; + var JSCompiler_inline_result$jscomp$332; if (canUseDOM) { - var isSupported$jscomp$inline_1558 = "oninput" in document; - if (!isSupported$jscomp$inline_1558) { - var element$jscomp$inline_1559 = document.createElement("div"); - element$jscomp$inline_1559.setAttribute("oninput", "return;"); - isSupported$jscomp$inline_1558 = - "function" === typeof element$jscomp$inline_1559.oninput; + var isSupported$jscomp$inline_1560 = "oninput" in document; + if (!isSupported$jscomp$inline_1560) { + var element$jscomp$inline_1561 = document.createElement("div"); + element$jscomp$inline_1561.setAttribute("oninput", "return;"); + isSupported$jscomp$inline_1560 = + "function" === typeof element$jscomp$inline_1561.oninput; } - JSCompiler_inline_result$jscomp$333 = isSupported$jscomp$inline_1558; - } else JSCompiler_inline_result$jscomp$333 = !1; + JSCompiler_inline_result$jscomp$332 = isSupported$jscomp$inline_1560; + } else JSCompiler_inline_result$jscomp$332 = !1; isInputEventSupported = - JSCompiler_inline_result$jscomp$333 && + JSCompiler_inline_result$jscomp$332 && (!document.documentMode || 9 < document.documentMode); } function stopWatchingForValueChange() { @@ -13118,20 +13138,20 @@ function registerSimpleEvent(domEventName, reactName) { registerTwoPhaseEvent(reactName, [domEventName]); } for ( - var i$jscomp$inline_1599 = 0; - i$jscomp$inline_1599 < simpleEventPluginEvents.length; - i$jscomp$inline_1599++ + var i$jscomp$inline_1601 = 0; + i$jscomp$inline_1601 < simpleEventPluginEvents.length; + i$jscomp$inline_1601++ ) { - var eventName$jscomp$inline_1600 = - simpleEventPluginEvents[i$jscomp$inline_1599], - domEventName$jscomp$inline_1601 = - eventName$jscomp$inline_1600.toLowerCase(), - capitalizedEvent$jscomp$inline_1602 = - eventName$jscomp$inline_1600[0].toUpperCase() + - eventName$jscomp$inline_1600.slice(1); + var eventName$jscomp$inline_1602 = + simpleEventPluginEvents[i$jscomp$inline_1601], + domEventName$jscomp$inline_1603 = + eventName$jscomp$inline_1602.toLowerCase(), + capitalizedEvent$jscomp$inline_1604 = + eventName$jscomp$inline_1602[0].toUpperCase() + + eventName$jscomp$inline_1602.slice(1); registerSimpleEvent( - domEventName$jscomp$inline_1601, - "on" + capitalizedEvent$jscomp$inline_1602 + domEventName$jscomp$inline_1603, + "on" + capitalizedEvent$jscomp$inline_1604 ); } registerSimpleEvent(ANIMATION_END, "onAnimationEnd"); @@ -13965,9 +13985,57 @@ function normalizeMarkupForTextOrAttribute(markup) { function noop$1() {} function setProp(domElement, tag, key, value, props) { switch (key) { + case "children": + "string" === typeof value + ? "body" === tag || + ("textarea" === tag && "" === value) || + setTextContent(domElement, value) + : "number" === typeof value && + "body" !== tag && + setTextContent(domElement, "" + value); + break; + case "className": + setValueForKnownAttribute(domElement, "class", value); + break; + case "tabIndex": + setValueForKnownAttribute(domElement, "tabindex", value); + break; + case "dir": + case "role": + case "viewBox": + case "width": + case "height": + setValueForKnownAttribute(domElement, key, value); + break; case "style": setValueForStyles(domElement, value); break; + case "src": + case "href": + case "action": + if ("" === value) { + domElement.removeAttribute(key); + break; + } + case "formAction": + if ( + null == value || + "function" === typeof value || + "symbol" === typeof value || + "boolean" === typeof value + ) { + domElement.removeAttribute(key); + break; + } + value = sanitizeURL(enableTrustedTypesIntegration ? value : "" + value); + domElement.setAttribute(key, value); + break; + case "onClick": + null != value && (domElement.onclick = noop$1); + break; + case "onScroll": + null != value && listenToNonDelegatedEvent("scroll", domElement); + break; case "dangerouslySetInnerHTML": if (null != value) { if ("object" !== typeof value || !("__html" in value)) @@ -13981,21 +14049,6 @@ function setProp(domElement, tag, key, value, props) { } } break; - case "children": - "string" === typeof value - ? "body" === tag || - ("textarea" === tag && "" === value) || - setTextContent(domElement, value) - : "number" === typeof value && - "body" !== tag && - setTextContent(domElement, "" + value); - break; - case "onScroll": - null != value && listenToNonDelegatedEvent("scroll", domElement); - break; - case "onClick": - null != value && (domElement.onclick = noop$1); - break; case "multiple": domElement.multiple = value && "function" !== typeof value && "symbol" !== typeof value; @@ -14012,26 +14065,6 @@ function setProp(domElement, tag, key, value, props) { break; case "autoFocus": break; - case "src": - case "href": - case "action": - if ("" === value) { - domElement.removeAttribute(key); - break; - } - case "formAction": - if ( - null == value || - "function" === typeof value || - "symbol" === typeof value || - "boolean" === typeof value - ) { - domElement.removeAttribute(key); - break; - } - props = sanitizeURL(enableTrustedTypesIntegration ? value : "" + value); - domElement.setAttribute(key, props); - break; case "xlinkHref": if ( null == value || @@ -14119,246 +14152,6 @@ function setProp(domElement, tag, key, value, props) { ? domElement.removeAttribute(key) : domElement.setAttribute(key, value); break; - case "acceptCharset": - setValueForAttribute(domElement, "accept-charset", value); - break; - case "className": - setValueForAttribute(domElement, "class", value); - break; - case "htmlFor": - setValueForAttribute(domElement, "for", value); - break; - case "httpEquiv": - setValueForAttribute(domElement, "http-equiv", value); - break; - case "tabIndex": - setValueForAttribute(domElement, "tabindex", value); - break; - case "crossOrigin": - setValueForAttribute(domElement, "crossorigin", value); - break; - case "accentHeight": - setValueForAttribute(domElement, "accent-height", value); - break; - case "alignmentBaseline": - setValueForAttribute(domElement, "alignment-baseline", value); - break; - case "arabicForm": - setValueForAttribute(domElement, "arabic-form", value); - break; - case "baselineShift": - setValueForAttribute(domElement, "baseline-shift", value); - break; - case "capHeight": - setValueForAttribute(domElement, "cap-height", value); - break; - case "clipPath": - setValueForAttribute(domElement, "clip-path", value); - break; - case "clipRule": - setValueForAttribute(domElement, "clip-rule", value); - break; - case "colorInterpolation": - setValueForAttribute(domElement, "color-interpolation", value); - break; - case "colorInterpolationFilters": - setValueForAttribute(domElement, "color-interpolation-filters", value); - break; - case "colorProfile": - setValueForAttribute(domElement, "color-profile", value); - break; - case "colorRendering": - setValueForAttribute(domElement, "color-rendering", value); - break; - case "dominantBaseline": - setValueForAttribute(domElement, "dominant-baseline", value); - break; - case "enableBackground": - setValueForAttribute(domElement, "enable-background", value); - break; - case "fillOpacity": - setValueForAttribute(domElement, "fill-opacity", value); - break; - case "fillRule": - setValueForAttribute(domElement, "fill-rule", value); - break; - case "floodColor": - setValueForAttribute(domElement, "flood-color", value); - break; - case "floodOpacity": - setValueForAttribute(domElement, "flood-opacity", value); - break; - case "fontFamily": - setValueForAttribute(domElement, "font-family", value); - break; - case "fontSize": - setValueForAttribute(domElement, "font-size", value); - break; - case "fontSizeAdjust": - setValueForAttribute(domElement, "font-size-adjust", value); - break; - case "fontStretch": - setValueForAttribute(domElement, "font-stretch", value); - break; - case "fontStyle": - setValueForAttribute(domElement, "font-style", value); - break; - case "fontVariant": - setValueForAttribute(domElement, "font-variant", value); - break; - case "fontWeight": - setValueForAttribute(domElement, "font-weight", value); - break; - case "glyphName": - setValueForAttribute(domElement, "glyph-name", value); - break; - case "glyphOrientationHorizontal": - setValueForAttribute(domElement, "glyph-orientation-horizontal", value); - break; - case "glyphOrientationVertical": - setValueForAttribute(domElement, "glyph-orientation-vertical", value); - break; - case "horizAdvX": - setValueForAttribute(domElement, "horiz-adv-x", value); - break; - case "horizOriginX": - setValueForAttribute(domElement, "horiz-origin-x", value); - break; - case "imageRendering": - setValueForAttribute(domElement, "image-rendering", value); - break; - case "letterSpacing": - setValueForAttribute(domElement, "letter-spacing", value); - break; - case "lightingColor": - setValueForAttribute(domElement, "lighting-color", value); - break; - case "markerEnd": - setValueForAttribute(domElement, "marker-end", value); - break; - case "markerMid": - setValueForAttribute(domElement, "marker-mid", value); - break; - case "markerStart": - setValueForAttribute(domElement, "marker-start", value); - break; - case "overlinePosition": - setValueForAttribute(domElement, "overline-position", value); - break; - case "overlineThickness": - setValueForAttribute(domElement, "overline-thickness", value); - break; - case "paintOrder": - setValueForAttribute(domElement, "paint-order", value); - break; - case "panose-1": - setValueForAttribute(domElement, "panose-1", value); - break; - case "pointerEvents": - setValueForAttribute(domElement, "pointer-events", value); - break; - case "renderingIntent": - setValueForAttribute(domElement, "rendering-intent", value); - break; - case "shapeRendering": - setValueForAttribute(domElement, "shape-rendering", value); - break; - case "stopColor": - setValueForAttribute(domElement, "stop-color", value); - break; - case "stopOpacity": - setValueForAttribute(domElement, "stop-opacity", value); - break; - case "strikethroughPosition": - setValueForAttribute(domElement, "strikethrough-position", value); - break; - case "strikethroughThickness": - setValueForAttribute(domElement, "strikethrough-thickness", value); - break; - case "strokeDasharray": - setValueForAttribute(domElement, "stroke-dasharray", value); - break; - case "strokeDashoffset": - setValueForAttribute(domElement, "stroke-dashoffset", value); - break; - case "strokeLinecap": - setValueForAttribute(domElement, "stroke-linecap", value); - break; - case "strokeLinejoin": - setValueForAttribute(domElement, "stroke-linejoin", value); - break; - case "strokeMiterlimit": - setValueForAttribute(domElement, "stroke-miterlimit", value); - break; - case "strokeOpacity": - setValueForAttribute(domElement, "stroke-opacity", value); - break; - case "strokeWidth": - setValueForAttribute(domElement, "stroke-width", value); - break; - case "textAnchor": - setValueForAttribute(domElement, "text-anchor", value); - break; - case "textDecoration": - setValueForAttribute(domElement, "text-decoration", value); - break; - case "textRendering": - setValueForAttribute(domElement, "text-rendering", value); - break; - case "transformOrigin": - setValueForAttribute(domElement, "transform-origin", value); - break; - case "underlinePosition": - setValueForAttribute(domElement, "underline-position", value); - break; - case "underlineThickness": - setValueForAttribute(domElement, "underline-thickness", value); - break; - case "unicodeBidi": - setValueForAttribute(domElement, "unicode-bidi", value); - break; - case "unicodeRange": - setValueForAttribute(domElement, "unicode-range", value); - break; - case "unitsPerEm": - setValueForAttribute(domElement, "units-per-em", value); - break; - case "vAlphabetic": - setValueForAttribute(domElement, "v-alphabetic", value); - break; - case "vHanging": - setValueForAttribute(domElement, "v-hanging", value); - break; - case "vIdeographic": - setValueForAttribute(domElement, "v-ideographic", value); - break; - case "vMathematical": - setValueForAttribute(domElement, "v-mathematical", value); - break; - case "vectorEffect": - setValueForAttribute(domElement, "vector-effect", value); - break; - case "vertAdvY": - setValueForAttribute(domElement, "vert-adv-y", value); - break; - case "vertOriginX": - setValueForAttribute(domElement, "vert-origin-x", value); - break; - case "vertOriginY": - setValueForAttribute(domElement, "vert-origin-y", value); - break; - case "wordSpacing": - setValueForAttribute(domElement, "word-spacing", value); - break; - case "writingMode": - setValueForAttribute(domElement, "writing-mode", value); - break; - case "xmlnsXlink": - setValueForAttribute(domElement, "xmlns:xlink", value); - break; - case "xHeight": - setValueForAttribute(domElement, "x-height", value); - break; case "xlinkActuate": setValueForNamespacedAttribute( domElement, @@ -14435,10 +14228,13 @@ function setProp(domElement, tag, key, value, props) { case "textContent": if (enableCustomElementPropertySupport) break; default: - (!(2 < key.length) || + if ( + !(2 < key.length) || ("o" !== key[0] && "O" !== key[0]) || - ("n" !== key[1] && "N" !== key[1])) && - setValueForAttribute(domElement, key, value); + ("n" !== key[1] && "N" !== key[1]) + ) + (key = aliases.get(key) || key), + setValueForAttribute(domElement, key, value); } } function setPropOnCustomElement(domElement, tag, key, value, props) { @@ -14513,6 +14309,15 @@ function setPropOnCustomElement(domElement, tag, key, value, props) { } function setInitialProperties(domElement, tag, props) { switch (tag) { + case "div": + case "span": + case "svg": + case "path": + case "a": + case "g": + case "p": + case "li": + break; case "input": initWrapperState$2(domElement, props); listenToNonDelegatedEvent("invalid", domElement); @@ -14521,6 +14326,13 @@ function setInitialProperties(domElement, tag, props) { var propValue = props[propKey]; if (null != propValue) switch (propKey) { + case "type": + null != propValue && + "function" !== typeof propValue && + "symbol" !== typeof propValue && + "boolean" !== typeof propValue && + domElement.setAttribute(propKey, propValue); + break; case "checked": var node = domElement; propValue = @@ -14549,16 +14361,16 @@ function setInitialProperties(domElement, tag, props) { case "select": domElement._wrapperState = { wasMultiple: !!props.multiple }; listenToNonDelegatedEvent("invalid", domElement); - for (var propKey$201 in props) + for (propValue in props) if ( - props.hasOwnProperty(propKey$201) && - ((propKey = props[propKey$201]), null != propKey) + props.hasOwnProperty(propValue) && + ((propKey = props[propValue]), null != propKey) ) - switch (propKey$201) { + switch (propValue) { case "value": break; default: - setProp(domElement, tag, propKey$201, propKey, props); + setProp(domElement, tag, propValue, propKey, props); } domElement.multiple = !!props.multiple; tag = props.value; @@ -14658,18 +14470,26 @@ function setInitialProperties(domElement, tag, props) { setProp(domElement, tag, propKey$207, propKey, props); } return; + default: + if (isCustomElement(tag)) { + for (var propKey$209 in props) + props.hasOwnProperty(propKey$209) && + ((propKey = props[propKey$209]), + null != propKey && + setPropOnCustomElement( + domElement, + tag, + propKey$209, + propKey, + props + )); + return; + } } - if (isCustomElement(tag)) - for (node in props) - props.hasOwnProperty(node) && - ((propKey = props[node]), - null != propKey && - setPropOnCustomElement(domElement, tag, node, propKey, props)); - else - for (propValue in props) - props.hasOwnProperty(propValue) && - ((propKey = props[propValue]), - null != propKey && setProp(domElement, tag, propValue, propKey, props)); + for (node in props) + props.hasOwnProperty(node) && + ((propKey = props[node]), + null != propKey && setProp(domElement, tag, node, propKey, props)); } function updateProperties( domElement, @@ -14679,6 +14499,15 @@ function updateProperties( nextProps ) { switch (tag) { + case "div": + case "span": + case "svg": + case "path": + case "a": + case "g": + case "p": + case "li": + break; case "input": "radio" === nextProps.type && null != nextProps.name && @@ -14809,25 +14638,27 @@ function updateProperties( setProp(domElement, tag, propValue, propKey, nextProps); } return; + default: + if (isCustomElement(tag)) { + for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) + setPropOnCustomElement( + domElement, + tag, + updatePayload[lastProps], + updatePayload[lastProps + 1], + nextProps + ); + return; + } } - if (isCustomElement(tag)) - for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) - setPropOnCustomElement( - domElement, - tag, - updatePayload[lastProps], - updatePayload[lastProps + 1], - nextProps - ); - else - for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) - setProp( - domElement, - tag, - updatePayload[lastProps], - updatePayload[lastProps + 1], - nextProps - ); + for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) + setProp( + domElement, + tag, + updatePayload[lastProps], + updatePayload[lastProps + 1], + nextProps + ); } var Dispatcher$1 = Internals.Dispatcher, eventsEnabled = null, @@ -15780,17 +15611,17 @@ Internals.Events = [ restoreStateIfNeeded, batchedUpdates$1 ]; -var devToolsConfig$jscomp$inline_1770 = { +var devToolsConfig$jscomp$inline_1785 = { findFiberByHostInstance: getClosestInstanceFromNode, bundleType: 0, - version: "18.3.0-www-modern-22680fca", + version: "18.3.0-www-modern-70a54143", rendererPackageName: "react-dom" }; -var internals$jscomp$inline_2158 = { - bundleType: devToolsConfig$jscomp$inline_1770.bundleType, - version: devToolsConfig$jscomp$inline_1770.version, - rendererPackageName: devToolsConfig$jscomp$inline_1770.rendererPackageName, - rendererConfig: devToolsConfig$jscomp$inline_1770.rendererConfig, +var internals$jscomp$inline_2159 = { + bundleType: devToolsConfig$jscomp$inline_1785.bundleType, + version: devToolsConfig$jscomp$inline_1785.version, + rendererPackageName: devToolsConfig$jscomp$inline_1785.rendererPackageName, + rendererConfig: devToolsConfig$jscomp$inline_1785.rendererConfig, overrideHookState: null, overrideHookStateDeletePath: null, overrideHookStateRenamePath: null, @@ -15807,26 +15638,26 @@ var internals$jscomp$inline_2158 = { return null === fiber ? null : fiber.stateNode; }, findFiberByHostInstance: - devToolsConfig$jscomp$inline_1770.findFiberByHostInstance || + devToolsConfig$jscomp$inline_1785.findFiberByHostInstance || emptyFindFiberByHostInstance, findHostInstancesForRefresh: null, scheduleRefresh: null, scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-modern-22680fca" + reconcilerVersion: "18.3.0-www-modern-70a54143" }; if ("undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__) { - var hook$jscomp$inline_2159 = __REACT_DEVTOOLS_GLOBAL_HOOK__; + var hook$jscomp$inline_2160 = __REACT_DEVTOOLS_GLOBAL_HOOK__; if ( - !hook$jscomp$inline_2159.isDisabled && - hook$jscomp$inline_2159.supportsFiber + !hook$jscomp$inline_2160.isDisabled && + hook$jscomp$inline_2160.supportsFiber ) try { - (rendererID = hook$jscomp$inline_2159.inject( - internals$jscomp$inline_2158 + (rendererID = hook$jscomp$inline_2160.inject( + internals$jscomp$inline_2159 )), - (injectedHook = hook$jscomp$inline_2159); + (injectedHook = hook$jscomp$inline_2160); } catch (err) {} } exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals; @@ -15983,4 +15814,4 @@ exports.unstable_createEventHandle = function (type, options) { return eventHandle; }; exports.unstable_runWithPriority = runWithPriority; -exports.version = "18.3.0-www-modern-22680fca"; +exports.version = "18.3.0-www-modern-70a54143"; diff --git a/compiled/facebook-www/ReactDOM-profiling.classic.js b/compiled/facebook-www/ReactDOM-profiling.classic.js index d482180fa0006..f24f16a7f1b29 100644 --- a/compiled/facebook-www/ReactDOM-profiling.classic.js +++ b/compiled/facebook-www/ReactDOM-profiling.classic.js @@ -883,6 +883,20 @@ function setValueForAttribute(node, name, value) { ); } } +function setValueForKnownAttribute(node, name, value) { + if (null === value) node.removeAttribute(name); + else { + switch (typeof value) { + case "undefined": + case "function": + case "symbol": + case "boolean": + node.removeAttribute(name); + return; + } + node.setAttribute(name, enableTrustedTypesIntegration ? value : "" + value); + } +} function setValueForNamespacedAttribute(node, namespace, name, value) { if (null === value) node.removeAttribute(name); else { @@ -1314,6 +1328,11 @@ function setTextContent(node, text) { } node.textContent = text; } +var unitlessNumbers = new Set( + "animationIterationCount aspectRatio borderImageOutset borderImageSlice borderImageWidth boxFlex boxFlexGroup boxOrdinalGroup columnCount columns flex flexGrow flexPositive flexShrink flexNegative flexOrder gridArea gridRow gridRowEnd gridRowSpan gridRowStart gridColumn gridColumnEnd gridColumnSpan gridColumnStart fontWeight lineClamp lineHeight opacity order orphans scale tabSize widows zIndex zoom fillOpacity floodOpacity stopOpacity strokeDasharray strokeDashoffset strokeMiterlimit strokeOpacity strokeWidth MozAnimationIterationCount MozBoxFlex MozBoxFlexGroup MozLineClamp msAnimationIterationCount msFlex msZoom msFlexGrow msFlexNegative msFlexOrder msFlexPositive msFlexShrink msGridColumn msGridColumnSpan msGridRow msGridRowSpan WebkitAnimationIterationCount WebkitBoxFlex WebKitBoxFlexGroup WebkitBoxOrdinalGroup WebkitColumnCount WebkitColumns WebkitFlex WebkitFlexGrow WebkitFlexPositive WebkitFlexShrink WebkitLineClamp".split( + " " + ) +); function setValueForStyles(node, styles) { if (null != styles && "object" !== typeof styles) throw Error(formatProdErrorMessage(62)); @@ -1322,100 +1341,21 @@ function setValueForStyles(node, styles) { if (styles.hasOwnProperty(styleName)) { var value = styles[styleName], isCustomProperty = 0 === styleName.indexOf("--"); - if (null == value || "boolean" === typeof value || "" === value) - isCustomProperty + null == value || "boolean" === typeof value || "" === value + ? isCustomProperty ? node.setProperty(styleName, "") : "float" === styleName ? (node.cssFloat = "") - : (node[styleName] = ""); - else if (isCustomProperty) node.setProperty(styleName, value); - else { - if ((isCustomProperty = "number" === typeof value && 0 !== value)) { - a: switch (styleName) { - case "animationIterationCount": - case "aspectRatio": - case "borderImageOutset": - case "borderImageSlice": - case "borderImageWidth": - case "boxFlex": - case "boxFlexGroup": - case "boxOrdinalGroup": - case "columnCount": - case "columns": - case "flex": - case "flexGrow": - case "flexPositive": - case "flexShrink": - case "flexNegative": - case "flexOrder": - case "gridArea": - case "gridRow": - case "gridRowEnd": - case "gridRowSpan": - case "gridRowStart": - case "gridColumn": - case "gridColumnEnd": - case "gridColumnSpan": - case "gridColumnStart": - case "fontWeight": - case "lineClamp": - case "lineHeight": - case "opacity": - case "order": - case "orphans": - case "scale": - case "tabSize": - case "widows": - case "zIndex": - case "zoom": - case "fillOpacity": - case "floodOpacity": - case "stopOpacity": - case "strokeDasharray": - case "strokeDashoffset": - case "strokeMiterlimit": - case "strokeOpacity": - case "strokeWidth": - case "MozAnimationIterationCount": - case "MozBoxFlex": - case "MozBoxFlexGroup": - case "MozLineClamp": - case "msAnimationIterationCount": - case "msFlex": - case "msZoom": - case "msFlexGrow": - case "msFlexNegative": - case "msFlexOrder": - case "msFlexPositive": - case "msFlexShrink": - case "msGridColumn": - case "msGridColumnSpan": - case "msGridRow": - case "msGridRowSpan": - case "WebkitAnimationIterationCount": - case "WebkitBoxFlex": - case "WebKitBoxFlexGroup": - case "WebkitBoxOrdinalGroup": - case "WebkitColumnCount": - case "WebkitColumns": - case "WebkitFlex": - case "WebkitFlexGrow": - case "WebkitFlexPositive": - case "WebkitFlexShrink": - case "WebkitLineClamp": - isCustomProperty = !0; - break a; - default: - isCustomProperty = !1; - } - isCustomProperty = !isCustomProperty; - } - isCustomProperty - ? (node[styleName] = value + "px") - : "float" === styleName + : (node[styleName] = "") + : isCustomProperty + ? node.setProperty(styleName, value) + : "number" !== typeof value || + 0 === value || + unitlessNumbers.has(styleName) + ? "float" === styleName ? (node.cssFloat = value) - : (node[styleName] = ("" + value).trim()); - } + : (node[styleName] = ("" + value).trim()) + : (node[styleName] = value + "px"); } } function isCustomElement(tagName) { @@ -1434,8 +1374,88 @@ function isCustomElement(tagName) { return !0; } } -var isJavaScriptProtocol = - /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i; +var aliases = new Map([ + ["acceptCharset", "accept-charset"], + ["htmlFor", "for"], + ["httpEquiv", "http-equiv"], + ["crossOrigin", "crossorigin"], + ["accentHeight", "accent-height"], + ["alignmentBaseline", "alignment-baseline"], + ["arabicForm", "arabic-form"], + ["baselineShift", "baseline-shift"], + ["capHeight", "cap-height"], + ["clipPath", "clip-path"], + ["clipRule", "clip-rule"], + ["colorInterpolation", "color-interpolation"], + ["colorInterpolationFilters", "color-interpolation-filters"], + ["colorProfile", "color-profile"], + ["colorRendering", "color-rendering"], + ["dominantBaseline", "dominant-baseline"], + ["enableBackground", "enable-background"], + ["fillOpacity", "fill-opacity"], + ["fillRule", "fill-rule"], + ["floodColor", "flood-color"], + ["floodOpacity", "flood-opacity"], + ["fontFamily", "font-family"], + ["fontSize", "font-size"], + ["fontSizeAdjust", "font-size-adjust"], + ["fontStretch", "font-stretch"], + ["fontStyle", "font-style"], + ["fontVariant", "font-variant"], + ["fontWeight", "font-weight"], + ["glyphName", "glyph-name"], + ["glyphOrientationHorizontal", "glyph-orientation-horizontal"], + ["glyphOrientationVertical", "glyph-orientation-vertical"], + ["horizAdvX", "horiz-adv-x"], + ["horizOriginX", "horiz-origin-x"], + ["imageRendering", "image-rendering"], + ["letterSpacing", "letter-spacing"], + ["lightingColor", "lighting-color"], + ["markerEnd", "marker-end"], + ["markerMid", "marker-mid"], + ["markerStart", "marker-start"], + ["overlinePosition", "overline-position"], + ["overlineThickness", "overline-thickness"], + ["paintOrder", "paint-order"], + ["panose-1", "panose-1"], + ["pointerEvents", "pointer-events"], + ["renderingIntent", "rendering-intent"], + ["shapeRendering", "shape-rendering"], + ["stopColor", "stop-color"], + ["stopOpacity", "stop-opacity"], + ["strikethroughPosition", "strikethrough-position"], + ["strikethroughThickness", "strikethrough-thickness"], + ["strokeDasharray", "stroke-dasharray"], + ["strokeDashoffset", "stroke-dashoffset"], + ["strokeLinecap", "stroke-linecap"], + ["strokeLinejoin", "stroke-linejoin"], + ["strokeMiterlimit", "stroke-miterlimit"], + ["strokeOpacity", "stroke-opacity"], + ["strokeWidth", "stroke-width"], + ["textAnchor", "text-anchor"], + ["textDecoration", "text-decoration"], + ["textRendering", "text-rendering"], + ["transformOrigin", "transform-origin"], + ["underlinePosition", "underline-position"], + ["underlineThickness", "underline-thickness"], + ["unicodeBidi", "unicode-bidi"], + ["unicodeRange", "unicode-range"], + ["unitsPerEm", "units-per-em"], + ["vAlphabetic", "v-alphabetic"], + ["vHanging", "v-hanging"], + ["vIdeographic", "v-ideographic"], + ["vMathematical", "v-mathematical"], + ["vectorEffect", "vector-effect"], + ["vertAdvY", "vert-adv-y"], + ["vertOriginX", "vert-origin-x"], + ["vertOriginY", "vert-origin-y"], + ["wordSpacing", "word-spacing"], + ["writingMode", "writing-mode"], + ["xmlnsXlink", "xmlns:xlink"], + ["xHeight", "x-height"] + ]), + isJavaScriptProtocol = + /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i; function sanitizeURL(url) { return isJavaScriptProtocol.test("" + url) ? "javascript:throw new Error('React has blocked a javascript: URL as a security precaution.')" @@ -13330,19 +13350,19 @@ function getTargetInstForChangeEvent(domEventName, targetInst) { } var isInputEventSupported = !1; if (canUseDOM) { - var JSCompiler_inline_result$jscomp$357; + var JSCompiler_inline_result$jscomp$356; if (canUseDOM) { - var isSupported$jscomp$inline_1645 = "oninput" in document; - if (!isSupported$jscomp$inline_1645) { - var element$jscomp$inline_1646 = document.createElement("div"); - element$jscomp$inline_1646.setAttribute("oninput", "return;"); - isSupported$jscomp$inline_1645 = - "function" === typeof element$jscomp$inline_1646.oninput; + var isSupported$jscomp$inline_1647 = "oninput" in document; + if (!isSupported$jscomp$inline_1647) { + var element$jscomp$inline_1648 = document.createElement("div"); + element$jscomp$inline_1648.setAttribute("oninput", "return;"); + isSupported$jscomp$inline_1647 = + "function" === typeof element$jscomp$inline_1648.oninput; } - JSCompiler_inline_result$jscomp$357 = isSupported$jscomp$inline_1645; - } else JSCompiler_inline_result$jscomp$357 = !1; + JSCompiler_inline_result$jscomp$356 = isSupported$jscomp$inline_1647; + } else JSCompiler_inline_result$jscomp$356 = !1; isInputEventSupported = - JSCompiler_inline_result$jscomp$357 && + JSCompiler_inline_result$jscomp$356 && (!document.documentMode || 9 < document.documentMode); } function stopWatchingForValueChange() { @@ -13651,20 +13671,20 @@ function registerSimpleEvent(domEventName, reactName) { registerTwoPhaseEvent(reactName, [domEventName]); } for ( - var i$jscomp$inline_1686 = 0; - i$jscomp$inline_1686 < simpleEventPluginEvents.length; - i$jscomp$inline_1686++ + var i$jscomp$inline_1688 = 0; + i$jscomp$inline_1688 < simpleEventPluginEvents.length; + i$jscomp$inline_1688++ ) { - var eventName$jscomp$inline_1687 = - simpleEventPluginEvents[i$jscomp$inline_1686], - domEventName$jscomp$inline_1688 = - eventName$jscomp$inline_1687.toLowerCase(), - capitalizedEvent$jscomp$inline_1689 = - eventName$jscomp$inline_1687[0].toUpperCase() + - eventName$jscomp$inline_1687.slice(1); + var eventName$jscomp$inline_1689 = + simpleEventPluginEvents[i$jscomp$inline_1688], + domEventName$jscomp$inline_1690 = + eventName$jscomp$inline_1689.toLowerCase(), + capitalizedEvent$jscomp$inline_1691 = + eventName$jscomp$inline_1689[0].toUpperCase() + + eventName$jscomp$inline_1689.slice(1); registerSimpleEvent( - domEventName$jscomp$inline_1688, - "on" + capitalizedEvent$jscomp$inline_1689 + domEventName$jscomp$inline_1690, + "on" + capitalizedEvent$jscomp$inline_1691 ); } registerSimpleEvent(ANIMATION_END, "onAnimationEnd"); @@ -14498,9 +14518,57 @@ function normalizeMarkupForTextOrAttribute(markup) { function noop$1() {} function setProp(domElement, tag, key, value, props) { switch (key) { + case "children": + "string" === typeof value + ? "body" === tag || + ("textarea" === tag && "" === value) || + setTextContent(domElement, value) + : "number" === typeof value && + "body" !== tag && + setTextContent(domElement, "" + value); + break; + case "className": + setValueForKnownAttribute(domElement, "class", value); + break; + case "tabIndex": + setValueForKnownAttribute(domElement, "tabindex", value); + break; + case "dir": + case "role": + case "viewBox": + case "width": + case "height": + setValueForKnownAttribute(domElement, key, value); + break; case "style": setValueForStyles(domElement, value); break; + case "src": + case "href": + case "action": + if ("" === value) { + domElement.removeAttribute(key); + break; + } + case "formAction": + if ( + null == value || + "function" === typeof value || + "symbol" === typeof value || + "boolean" === typeof value + ) { + domElement.removeAttribute(key); + break; + } + value = sanitizeURL(enableTrustedTypesIntegration ? value : "" + value); + domElement.setAttribute(key, value); + break; + case "onClick": + null != value && (domElement.onclick = noop$1); + break; + case "onScroll": + null != value && listenToNonDelegatedEvent("scroll", domElement); + break; case "dangerouslySetInnerHTML": if (null != value) { if ("object" !== typeof value || !("__html" in value)) @@ -14514,21 +14582,6 @@ function setProp(domElement, tag, key, value, props) { } } break; - case "children": - "string" === typeof value - ? "body" === tag || - ("textarea" === tag && "" === value) || - setTextContent(domElement, value) - : "number" === typeof value && - "body" !== tag && - setTextContent(domElement, "" + value); - break; - case "onScroll": - null != value && listenToNonDelegatedEvent("scroll", domElement); - break; - case "onClick": - null != value && (domElement.onclick = noop$1); - break; case "multiple": domElement.multiple = value && "function" !== typeof value && "symbol" !== typeof value; @@ -14545,26 +14598,6 @@ function setProp(domElement, tag, key, value, props) { break; case "autoFocus": break; - case "src": - case "href": - case "action": - if ("" === value) { - domElement.removeAttribute(key); - break; - } - case "formAction": - if ( - null == value || - "function" === typeof value || - "symbol" === typeof value || - "boolean" === typeof value - ) { - domElement.removeAttribute(key); - break; - } - props = sanitizeURL(enableTrustedTypesIntegration ? value : "" + value); - domElement.setAttribute(key, props); - break; case "xlinkHref": if ( null == value || @@ -14652,246 +14685,6 @@ function setProp(domElement, tag, key, value, props) { ? domElement.removeAttribute(key) : domElement.setAttribute(key, value); break; - case "acceptCharset": - setValueForAttribute(domElement, "accept-charset", value); - break; - case "className": - setValueForAttribute(domElement, "class", value); - break; - case "htmlFor": - setValueForAttribute(domElement, "for", value); - break; - case "httpEquiv": - setValueForAttribute(domElement, "http-equiv", value); - break; - case "tabIndex": - setValueForAttribute(domElement, "tabindex", value); - break; - case "crossOrigin": - setValueForAttribute(domElement, "crossorigin", value); - break; - case "accentHeight": - setValueForAttribute(domElement, "accent-height", value); - break; - case "alignmentBaseline": - setValueForAttribute(domElement, "alignment-baseline", value); - break; - case "arabicForm": - setValueForAttribute(domElement, "arabic-form", value); - break; - case "baselineShift": - setValueForAttribute(domElement, "baseline-shift", value); - break; - case "capHeight": - setValueForAttribute(domElement, "cap-height", value); - break; - case "clipPath": - setValueForAttribute(domElement, "clip-path", value); - break; - case "clipRule": - setValueForAttribute(domElement, "clip-rule", value); - break; - case "colorInterpolation": - setValueForAttribute(domElement, "color-interpolation", value); - break; - case "colorInterpolationFilters": - setValueForAttribute(domElement, "color-interpolation-filters", value); - break; - case "colorProfile": - setValueForAttribute(domElement, "color-profile", value); - break; - case "colorRendering": - setValueForAttribute(domElement, "color-rendering", value); - break; - case "dominantBaseline": - setValueForAttribute(domElement, "dominant-baseline", value); - break; - case "enableBackground": - setValueForAttribute(domElement, "enable-background", value); - break; - case "fillOpacity": - setValueForAttribute(domElement, "fill-opacity", value); - break; - case "fillRule": - setValueForAttribute(domElement, "fill-rule", value); - break; - case "floodColor": - setValueForAttribute(domElement, "flood-color", value); - break; - case "floodOpacity": - setValueForAttribute(domElement, "flood-opacity", value); - break; - case "fontFamily": - setValueForAttribute(domElement, "font-family", value); - break; - case "fontSize": - setValueForAttribute(domElement, "font-size", value); - break; - case "fontSizeAdjust": - setValueForAttribute(domElement, "font-size-adjust", value); - break; - case "fontStretch": - setValueForAttribute(domElement, "font-stretch", value); - break; - case "fontStyle": - setValueForAttribute(domElement, "font-style", value); - break; - case "fontVariant": - setValueForAttribute(domElement, "font-variant", value); - break; - case "fontWeight": - setValueForAttribute(domElement, "font-weight", value); - break; - case "glyphName": - setValueForAttribute(domElement, "glyph-name", value); - break; - case "glyphOrientationHorizontal": - setValueForAttribute(domElement, "glyph-orientation-horizontal", value); - break; - case "glyphOrientationVertical": - setValueForAttribute(domElement, "glyph-orientation-vertical", value); - break; - case "horizAdvX": - setValueForAttribute(domElement, "horiz-adv-x", value); - break; - case "horizOriginX": - setValueForAttribute(domElement, "horiz-origin-x", value); - break; - case "imageRendering": - setValueForAttribute(domElement, "image-rendering", value); - break; - case "letterSpacing": - setValueForAttribute(domElement, "letter-spacing", value); - break; - case "lightingColor": - setValueForAttribute(domElement, "lighting-color", value); - break; - case "markerEnd": - setValueForAttribute(domElement, "marker-end", value); - break; - case "markerMid": - setValueForAttribute(domElement, "marker-mid", value); - break; - case "markerStart": - setValueForAttribute(domElement, "marker-start", value); - break; - case "overlinePosition": - setValueForAttribute(domElement, "overline-position", value); - break; - case "overlineThickness": - setValueForAttribute(domElement, "overline-thickness", value); - break; - case "paintOrder": - setValueForAttribute(domElement, "paint-order", value); - break; - case "panose-1": - setValueForAttribute(domElement, "panose-1", value); - break; - case "pointerEvents": - setValueForAttribute(domElement, "pointer-events", value); - break; - case "renderingIntent": - setValueForAttribute(domElement, "rendering-intent", value); - break; - case "shapeRendering": - setValueForAttribute(domElement, "shape-rendering", value); - break; - case "stopColor": - setValueForAttribute(domElement, "stop-color", value); - break; - case "stopOpacity": - setValueForAttribute(domElement, "stop-opacity", value); - break; - case "strikethroughPosition": - setValueForAttribute(domElement, "strikethrough-position", value); - break; - case "strikethroughThickness": - setValueForAttribute(domElement, "strikethrough-thickness", value); - break; - case "strokeDasharray": - setValueForAttribute(domElement, "stroke-dasharray", value); - break; - case "strokeDashoffset": - setValueForAttribute(domElement, "stroke-dashoffset", value); - break; - case "strokeLinecap": - setValueForAttribute(domElement, "stroke-linecap", value); - break; - case "strokeLinejoin": - setValueForAttribute(domElement, "stroke-linejoin", value); - break; - case "strokeMiterlimit": - setValueForAttribute(domElement, "stroke-miterlimit", value); - break; - case "strokeOpacity": - setValueForAttribute(domElement, "stroke-opacity", value); - break; - case "strokeWidth": - setValueForAttribute(domElement, "stroke-width", value); - break; - case "textAnchor": - setValueForAttribute(domElement, "text-anchor", value); - break; - case "textDecoration": - setValueForAttribute(domElement, "text-decoration", value); - break; - case "textRendering": - setValueForAttribute(domElement, "text-rendering", value); - break; - case "transformOrigin": - setValueForAttribute(domElement, "transform-origin", value); - break; - case "underlinePosition": - setValueForAttribute(domElement, "underline-position", value); - break; - case "underlineThickness": - setValueForAttribute(domElement, "underline-thickness", value); - break; - case "unicodeBidi": - setValueForAttribute(domElement, "unicode-bidi", value); - break; - case "unicodeRange": - setValueForAttribute(domElement, "unicode-range", value); - break; - case "unitsPerEm": - setValueForAttribute(domElement, "units-per-em", value); - break; - case "vAlphabetic": - setValueForAttribute(domElement, "v-alphabetic", value); - break; - case "vHanging": - setValueForAttribute(domElement, "v-hanging", value); - break; - case "vIdeographic": - setValueForAttribute(domElement, "v-ideographic", value); - break; - case "vMathematical": - setValueForAttribute(domElement, "v-mathematical", value); - break; - case "vectorEffect": - setValueForAttribute(domElement, "vector-effect", value); - break; - case "vertAdvY": - setValueForAttribute(domElement, "vert-adv-y", value); - break; - case "vertOriginX": - setValueForAttribute(domElement, "vert-origin-x", value); - break; - case "vertOriginY": - setValueForAttribute(domElement, "vert-origin-y", value); - break; - case "wordSpacing": - setValueForAttribute(domElement, "word-spacing", value); - break; - case "writingMode": - setValueForAttribute(domElement, "writing-mode", value); - break; - case "xmlnsXlink": - setValueForAttribute(domElement, "xmlns:xlink", value); - break; - case "xHeight": - setValueForAttribute(domElement, "x-height", value); - break; case "xlinkActuate": setValueForNamespacedAttribute( domElement, @@ -14968,10 +14761,13 @@ function setProp(domElement, tag, key, value, props) { case "textContent": if (enableCustomElementPropertySupport) break; default: - (!(2 < key.length) || + if ( + !(2 < key.length) || ("o" !== key[0] && "O" !== key[0]) || - ("n" !== key[1] && "N" !== key[1])) && - setValueForAttribute(domElement, key, value); + ("n" !== key[1] && "N" !== key[1]) + ) + (key = aliases.get(key) || key), + setValueForAttribute(domElement, key, value); } } function setPropOnCustomElement(domElement, tag, key, value, props) { @@ -15046,6 +14842,15 @@ function setPropOnCustomElement(domElement, tag, key, value, props) { } function setInitialProperties(domElement, tag, props) { switch (tag) { + case "div": + case "span": + case "svg": + case "path": + case "a": + case "g": + case "p": + case "li": + break; case "input": initWrapperState$2(domElement, props); listenToNonDelegatedEvent("invalid", domElement); @@ -15054,6 +14859,13 @@ function setInitialProperties(domElement, tag, props) { var propValue = props[propKey]; if (null != propValue) switch (propKey) { + case "type": + null != propValue && + "function" !== typeof propValue && + "symbol" !== typeof propValue && + "boolean" !== typeof propValue && + domElement.setAttribute(propKey, propValue); + break; case "checked": var node = domElement; propValue = @@ -15082,16 +14894,16 @@ function setInitialProperties(domElement, tag, props) { case "select": domElement._wrapperState = { wasMultiple: !!props.multiple }; listenToNonDelegatedEvent("invalid", domElement); - for (var propKey$217 in props) + for (propValue in props) if ( - props.hasOwnProperty(propKey$217) && - ((propKey = props[propKey$217]), null != propKey) + props.hasOwnProperty(propValue) && + ((propKey = props[propValue]), null != propKey) ) - switch (propKey$217) { + switch (propValue) { case "value": break; default: - setProp(domElement, tag, propKey$217, propKey, props); + setProp(domElement, tag, propValue, propKey, props); } domElement.multiple = !!props.multiple; tag = props.value; @@ -15191,18 +15003,26 @@ function setInitialProperties(domElement, tag, props) { setProp(domElement, tag, propKey$223, propKey, props); } return; + default: + if (isCustomElement(tag)) { + for (var propKey$225 in props) + props.hasOwnProperty(propKey$225) && + ((propKey = props[propKey$225]), + null != propKey && + setPropOnCustomElement( + domElement, + tag, + propKey$225, + propKey, + props + )); + return; + } } - if (isCustomElement(tag)) - for (node in props) - props.hasOwnProperty(node) && - ((propKey = props[node]), - null != propKey && - setPropOnCustomElement(domElement, tag, node, propKey, props)); - else - for (propValue in props) - props.hasOwnProperty(propValue) && - ((propKey = props[propValue]), - null != propKey && setProp(domElement, tag, propValue, propKey, props)); + for (node in props) + props.hasOwnProperty(node) && + ((propKey = props[node]), + null != propKey && setProp(domElement, tag, node, propKey, props)); } function updateProperties( domElement, @@ -15212,6 +15032,15 @@ function updateProperties( nextProps ) { switch (tag) { + case "div": + case "span": + case "svg": + case "path": + case "a": + case "g": + case "p": + case "li": + break; case "input": "radio" === nextProps.type && null != nextProps.name && @@ -15342,25 +15171,27 @@ function updateProperties( setProp(domElement, tag, propValue, propKey, nextProps); } return; + default: + if (isCustomElement(tag)) { + for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) + setPropOnCustomElement( + domElement, + tag, + updatePayload[lastProps], + updatePayload[lastProps + 1], + nextProps + ); + return; + } } - if (isCustomElement(tag)) - for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) - setPropOnCustomElement( - domElement, - tag, - updatePayload[lastProps], - updatePayload[lastProps + 1], - nextProps - ); - else - for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) - setProp( - domElement, - tag, - updatePayload[lastProps], - updatePayload[lastProps + 1], - nextProps - ); + for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) + setProp( + domElement, + tag, + updatePayload[lastProps], + updatePayload[lastProps + 1], + nextProps + ); } var Dispatcher$1 = Internals.Dispatcher, eventsEnabled = null, @@ -17028,10 +16859,10 @@ Internals.Events = [ restoreStateIfNeeded, batchedUpdates$1 ]; -var devToolsConfig$jscomp$inline_1891 = { +var devToolsConfig$jscomp$inline_1906 = { findFiberByHostInstance: getClosestInstanceFromNode, bundleType: 0, - version: "18.3.0-www-classic-4f35a26c", + version: "18.3.0-www-classic-0703872e", rendererPackageName: "react-dom" }; (function (internals) { @@ -17049,10 +16880,10 @@ var devToolsConfig$jscomp$inline_1891 = { } catch (err) {} return hook.checkDCE ? !0 : !1; })({ - bundleType: devToolsConfig$jscomp$inline_1891.bundleType, - version: devToolsConfig$jscomp$inline_1891.version, - rendererPackageName: devToolsConfig$jscomp$inline_1891.rendererPackageName, - rendererConfig: devToolsConfig$jscomp$inline_1891.rendererConfig, + bundleType: devToolsConfig$jscomp$inline_1906.bundleType, + version: devToolsConfig$jscomp$inline_1906.version, + rendererPackageName: devToolsConfig$jscomp$inline_1906.rendererPackageName, + rendererConfig: devToolsConfig$jscomp$inline_1906.rendererConfig, overrideHookState: null, overrideHookStateDeletePath: null, overrideHookStateRenamePath: null, @@ -17068,14 +16899,14 @@ var devToolsConfig$jscomp$inline_1891 = { return null === fiber ? null : fiber.stateNode; }, findFiberByHostInstance: - devToolsConfig$jscomp$inline_1891.findFiberByHostInstance || + devToolsConfig$jscomp$inline_1906.findFiberByHostInstance || emptyFindFiberByHostInstance, findHostInstancesForRefresh: null, scheduleRefresh: null, scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-classic-4f35a26c" + reconcilerVersion: "18.3.0-www-classic-0703872e" }); assign(Internals, { ReactBrowserEventEmitter: { @@ -17302,7 +17133,7 @@ exports.unstable_renderSubtreeIntoContainer = function ( ); }; exports.unstable_runWithPriority = runWithPriority; -exports.version = "18.3.0-www-classic-4f35a26c"; +exports.version = "18.3.0-www-classic-0703872e"; /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */ if ( diff --git a/compiled/facebook-www/ReactDOM-profiling.modern.js b/compiled/facebook-www/ReactDOM-profiling.modern.js index fda59c4ba8ec3..7f4dc395d855a 100644 --- a/compiled/facebook-www/ReactDOM-profiling.modern.js +++ b/compiled/facebook-www/ReactDOM-profiling.modern.js @@ -701,6 +701,20 @@ function setValueForAttribute(node, name, value) { ); } } +function setValueForKnownAttribute(node, name, value) { + if (null === value) node.removeAttribute(name); + else { + switch (typeof value) { + case "undefined": + case "function": + case "symbol": + case "boolean": + node.removeAttribute(name); + return; + } + node.setAttribute(name, enableTrustedTypesIntegration ? value : "" + value); + } +} function setValueForNamespacedAttribute(node, namespace, name, value) { if (null === value) node.removeAttribute(name); else { @@ -1153,6 +1167,11 @@ function setTextContent(node, text) { } node.textContent = text; } +var unitlessNumbers = new Set( + "animationIterationCount aspectRatio borderImageOutset borderImageSlice borderImageWidth boxFlex boxFlexGroup boxOrdinalGroup columnCount columns flex flexGrow flexPositive flexShrink flexNegative flexOrder gridArea gridRow gridRowEnd gridRowSpan gridRowStart gridColumn gridColumnEnd gridColumnSpan gridColumnStart fontWeight lineClamp lineHeight opacity order orphans scale tabSize widows zIndex zoom fillOpacity floodOpacity stopOpacity strokeDasharray strokeDashoffset strokeMiterlimit strokeOpacity strokeWidth MozAnimationIterationCount MozBoxFlex MozBoxFlexGroup MozLineClamp msAnimationIterationCount msFlex msZoom msFlexGrow msFlexNegative msFlexOrder msFlexPositive msFlexShrink msGridColumn msGridColumnSpan msGridRow msGridRowSpan WebkitAnimationIterationCount WebkitBoxFlex WebKitBoxFlexGroup WebkitBoxOrdinalGroup WebkitColumnCount WebkitColumns WebkitFlex WebkitFlexGrow WebkitFlexPositive WebkitFlexShrink WebkitLineClamp".split( + " " + ) +); function setValueForStyles(node, styles) { if (null != styles && "object" !== typeof styles) throw Error(formatProdErrorMessage(62)); @@ -1161,100 +1180,21 @@ function setValueForStyles(node, styles) { if (styles.hasOwnProperty(styleName)) { var value = styles[styleName], isCustomProperty = 0 === styleName.indexOf("--"); - if (null == value || "boolean" === typeof value || "" === value) - isCustomProperty + null == value || "boolean" === typeof value || "" === value + ? isCustomProperty ? node.setProperty(styleName, "") : "float" === styleName ? (node.cssFloat = "") - : (node[styleName] = ""); - else if (isCustomProperty) node.setProperty(styleName, value); - else { - if ((isCustomProperty = "number" === typeof value && 0 !== value)) { - a: switch (styleName) { - case "animationIterationCount": - case "aspectRatio": - case "borderImageOutset": - case "borderImageSlice": - case "borderImageWidth": - case "boxFlex": - case "boxFlexGroup": - case "boxOrdinalGroup": - case "columnCount": - case "columns": - case "flex": - case "flexGrow": - case "flexPositive": - case "flexShrink": - case "flexNegative": - case "flexOrder": - case "gridArea": - case "gridRow": - case "gridRowEnd": - case "gridRowSpan": - case "gridRowStart": - case "gridColumn": - case "gridColumnEnd": - case "gridColumnSpan": - case "gridColumnStart": - case "fontWeight": - case "lineClamp": - case "lineHeight": - case "opacity": - case "order": - case "orphans": - case "scale": - case "tabSize": - case "widows": - case "zIndex": - case "zoom": - case "fillOpacity": - case "floodOpacity": - case "stopOpacity": - case "strokeDasharray": - case "strokeDashoffset": - case "strokeMiterlimit": - case "strokeOpacity": - case "strokeWidth": - case "MozAnimationIterationCount": - case "MozBoxFlex": - case "MozBoxFlexGroup": - case "MozLineClamp": - case "msAnimationIterationCount": - case "msFlex": - case "msZoom": - case "msFlexGrow": - case "msFlexNegative": - case "msFlexOrder": - case "msFlexPositive": - case "msFlexShrink": - case "msGridColumn": - case "msGridColumnSpan": - case "msGridRow": - case "msGridRowSpan": - case "WebkitAnimationIterationCount": - case "WebkitBoxFlex": - case "WebKitBoxFlexGroup": - case "WebkitBoxOrdinalGroup": - case "WebkitColumnCount": - case "WebkitColumns": - case "WebkitFlex": - case "WebkitFlexGrow": - case "WebkitFlexPositive": - case "WebkitFlexShrink": - case "WebkitLineClamp": - isCustomProperty = !0; - break a; - default: - isCustomProperty = !1; - } - isCustomProperty = !isCustomProperty; - } - isCustomProperty - ? (node[styleName] = value + "px") - : "float" === styleName + : (node[styleName] = "") + : isCustomProperty + ? node.setProperty(styleName, value) + : "number" !== typeof value || + 0 === value || + unitlessNumbers.has(styleName) + ? "float" === styleName ? (node.cssFloat = value) - : (node[styleName] = ("" + value).trim()); - } + : (node[styleName] = ("" + value).trim()) + : (node[styleName] = value + "px"); } } function isCustomElement(tagName) { @@ -1273,8 +1213,88 @@ function isCustomElement(tagName) { return !0; } } -var isJavaScriptProtocol = - /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i; +var aliases = new Map([ + ["acceptCharset", "accept-charset"], + ["htmlFor", "for"], + ["httpEquiv", "http-equiv"], + ["crossOrigin", "crossorigin"], + ["accentHeight", "accent-height"], + ["alignmentBaseline", "alignment-baseline"], + ["arabicForm", "arabic-form"], + ["baselineShift", "baseline-shift"], + ["capHeight", "cap-height"], + ["clipPath", "clip-path"], + ["clipRule", "clip-rule"], + ["colorInterpolation", "color-interpolation"], + ["colorInterpolationFilters", "color-interpolation-filters"], + ["colorProfile", "color-profile"], + ["colorRendering", "color-rendering"], + ["dominantBaseline", "dominant-baseline"], + ["enableBackground", "enable-background"], + ["fillOpacity", "fill-opacity"], + ["fillRule", "fill-rule"], + ["floodColor", "flood-color"], + ["floodOpacity", "flood-opacity"], + ["fontFamily", "font-family"], + ["fontSize", "font-size"], + ["fontSizeAdjust", "font-size-adjust"], + ["fontStretch", "font-stretch"], + ["fontStyle", "font-style"], + ["fontVariant", "font-variant"], + ["fontWeight", "font-weight"], + ["glyphName", "glyph-name"], + ["glyphOrientationHorizontal", "glyph-orientation-horizontal"], + ["glyphOrientationVertical", "glyph-orientation-vertical"], + ["horizAdvX", "horiz-adv-x"], + ["horizOriginX", "horiz-origin-x"], + ["imageRendering", "image-rendering"], + ["letterSpacing", "letter-spacing"], + ["lightingColor", "lighting-color"], + ["markerEnd", "marker-end"], + ["markerMid", "marker-mid"], + ["markerStart", "marker-start"], + ["overlinePosition", "overline-position"], + ["overlineThickness", "overline-thickness"], + ["paintOrder", "paint-order"], + ["panose-1", "panose-1"], + ["pointerEvents", "pointer-events"], + ["renderingIntent", "rendering-intent"], + ["shapeRendering", "shape-rendering"], + ["stopColor", "stop-color"], + ["stopOpacity", "stop-opacity"], + ["strikethroughPosition", "strikethrough-position"], + ["strikethroughThickness", "strikethrough-thickness"], + ["strokeDasharray", "stroke-dasharray"], + ["strokeDashoffset", "stroke-dashoffset"], + ["strokeLinecap", "stroke-linecap"], + ["strokeLinejoin", "stroke-linejoin"], + ["strokeMiterlimit", "stroke-miterlimit"], + ["strokeOpacity", "stroke-opacity"], + ["strokeWidth", "stroke-width"], + ["textAnchor", "text-anchor"], + ["textDecoration", "text-decoration"], + ["textRendering", "text-rendering"], + ["transformOrigin", "transform-origin"], + ["underlinePosition", "underline-position"], + ["underlineThickness", "underline-thickness"], + ["unicodeBidi", "unicode-bidi"], + ["unicodeRange", "unicode-range"], + ["unitsPerEm", "units-per-em"], + ["vAlphabetic", "v-alphabetic"], + ["vHanging", "v-hanging"], + ["vIdeographic", "v-ideographic"], + ["vMathematical", "v-mathematical"], + ["vectorEffect", "vector-effect"], + ["vertAdvY", "vert-adv-y"], + ["vertOriginX", "vert-origin-x"], + ["vertOriginY", "vert-origin-y"], + ["wordSpacing", "word-spacing"], + ["writingMode", "writing-mode"], + ["xmlnsXlink", "xmlns:xlink"], + ["xHeight", "x-height"] + ]), + isJavaScriptProtocol = + /^[\u0000-\u001F ]*j[\r\n\t]*a[\r\n\t]*v[\r\n\t]*a[\r\n\t]*s[\r\n\t]*c[\r\n\t]*r[\r\n\t]*i[\r\n\t]*p[\r\n\t]*t[\r\n\t]*:/i; function sanitizeURL(url) { return isJavaScriptProtocol.test("" + url) ? "javascript:throw new Error('React has blocked a javascript: URL as a security precaution.')" @@ -13566,19 +13586,19 @@ function getTargetInstForChangeEvent(domEventName, targetInst) { } var isInputEventSupported = !1; if (canUseDOM) { - var JSCompiler_inline_result$jscomp$354; + var JSCompiler_inline_result$jscomp$353; if (canUseDOM) { - var isSupported$jscomp$inline_1637 = "oninput" in document; - if (!isSupported$jscomp$inline_1637) { - var element$jscomp$inline_1638 = document.createElement("div"); - element$jscomp$inline_1638.setAttribute("oninput", "return;"); - isSupported$jscomp$inline_1637 = - "function" === typeof element$jscomp$inline_1638.oninput; + var isSupported$jscomp$inline_1639 = "oninput" in document; + if (!isSupported$jscomp$inline_1639) { + var element$jscomp$inline_1640 = document.createElement("div"); + element$jscomp$inline_1640.setAttribute("oninput", "return;"); + isSupported$jscomp$inline_1639 = + "function" === typeof element$jscomp$inline_1640.oninput; } - JSCompiler_inline_result$jscomp$354 = isSupported$jscomp$inline_1637; - } else JSCompiler_inline_result$jscomp$354 = !1; + JSCompiler_inline_result$jscomp$353 = isSupported$jscomp$inline_1639; + } else JSCompiler_inline_result$jscomp$353 = !1; isInputEventSupported = - JSCompiler_inline_result$jscomp$354 && + JSCompiler_inline_result$jscomp$353 && (!document.documentMode || 9 < document.documentMode); } function stopWatchingForValueChange() { @@ -13887,20 +13907,20 @@ function registerSimpleEvent(domEventName, reactName) { registerTwoPhaseEvent(reactName, [domEventName]); } for ( - var i$jscomp$inline_1678 = 0; - i$jscomp$inline_1678 < simpleEventPluginEvents.length; - i$jscomp$inline_1678++ + var i$jscomp$inline_1680 = 0; + i$jscomp$inline_1680 < simpleEventPluginEvents.length; + i$jscomp$inline_1680++ ) { - var eventName$jscomp$inline_1679 = - simpleEventPluginEvents[i$jscomp$inline_1678], - domEventName$jscomp$inline_1680 = - eventName$jscomp$inline_1679.toLowerCase(), - capitalizedEvent$jscomp$inline_1681 = - eventName$jscomp$inline_1679[0].toUpperCase() + - eventName$jscomp$inline_1679.slice(1); + var eventName$jscomp$inline_1681 = + simpleEventPluginEvents[i$jscomp$inline_1680], + domEventName$jscomp$inline_1682 = + eventName$jscomp$inline_1681.toLowerCase(), + capitalizedEvent$jscomp$inline_1683 = + eventName$jscomp$inline_1681[0].toUpperCase() + + eventName$jscomp$inline_1681.slice(1); registerSimpleEvent( - domEventName$jscomp$inline_1680, - "on" + capitalizedEvent$jscomp$inline_1681 + domEventName$jscomp$inline_1682, + "on" + capitalizedEvent$jscomp$inline_1683 ); } registerSimpleEvent(ANIMATION_END, "onAnimationEnd"); @@ -14734,9 +14754,57 @@ function normalizeMarkupForTextOrAttribute(markup) { function noop$1() {} function setProp(domElement, tag, key, value, props) { switch (key) { + case "children": + "string" === typeof value + ? "body" === tag || + ("textarea" === tag && "" === value) || + setTextContent(domElement, value) + : "number" === typeof value && + "body" !== tag && + setTextContent(domElement, "" + value); + break; + case "className": + setValueForKnownAttribute(domElement, "class", value); + break; + case "tabIndex": + setValueForKnownAttribute(domElement, "tabindex", value); + break; + case "dir": + case "role": + case "viewBox": + case "width": + case "height": + setValueForKnownAttribute(domElement, key, value); + break; case "style": setValueForStyles(domElement, value); break; + case "src": + case "href": + case "action": + if ("" === value) { + domElement.removeAttribute(key); + break; + } + case "formAction": + if ( + null == value || + "function" === typeof value || + "symbol" === typeof value || + "boolean" === typeof value + ) { + domElement.removeAttribute(key); + break; + } + value = sanitizeURL(enableTrustedTypesIntegration ? value : "" + value); + domElement.setAttribute(key, value); + break; + case "onClick": + null != value && (domElement.onclick = noop$1); + break; + case "onScroll": + null != value && listenToNonDelegatedEvent("scroll", domElement); + break; case "dangerouslySetInnerHTML": if (null != value) { if ("object" !== typeof value || !("__html" in value)) @@ -14750,21 +14818,6 @@ function setProp(domElement, tag, key, value, props) { } } break; - case "children": - "string" === typeof value - ? "body" === tag || - ("textarea" === tag && "" === value) || - setTextContent(domElement, value) - : "number" === typeof value && - "body" !== tag && - setTextContent(domElement, "" + value); - break; - case "onScroll": - null != value && listenToNonDelegatedEvent("scroll", domElement); - break; - case "onClick": - null != value && (domElement.onclick = noop$1); - break; case "multiple": domElement.multiple = value && "function" !== typeof value && "symbol" !== typeof value; @@ -14781,26 +14834,6 @@ function setProp(domElement, tag, key, value, props) { break; case "autoFocus": break; - case "src": - case "href": - case "action": - if ("" === value) { - domElement.removeAttribute(key); - break; - } - case "formAction": - if ( - null == value || - "function" === typeof value || - "symbol" === typeof value || - "boolean" === typeof value - ) { - domElement.removeAttribute(key); - break; - } - props = sanitizeURL(enableTrustedTypesIntegration ? value : "" + value); - domElement.setAttribute(key, props); - break; case "xlinkHref": if ( null == value || @@ -14888,246 +14921,6 @@ function setProp(domElement, tag, key, value, props) { ? domElement.removeAttribute(key) : domElement.setAttribute(key, value); break; - case "acceptCharset": - setValueForAttribute(domElement, "accept-charset", value); - break; - case "className": - setValueForAttribute(domElement, "class", value); - break; - case "htmlFor": - setValueForAttribute(domElement, "for", value); - break; - case "httpEquiv": - setValueForAttribute(domElement, "http-equiv", value); - break; - case "tabIndex": - setValueForAttribute(domElement, "tabindex", value); - break; - case "crossOrigin": - setValueForAttribute(domElement, "crossorigin", value); - break; - case "accentHeight": - setValueForAttribute(domElement, "accent-height", value); - break; - case "alignmentBaseline": - setValueForAttribute(domElement, "alignment-baseline", value); - break; - case "arabicForm": - setValueForAttribute(domElement, "arabic-form", value); - break; - case "baselineShift": - setValueForAttribute(domElement, "baseline-shift", value); - break; - case "capHeight": - setValueForAttribute(domElement, "cap-height", value); - break; - case "clipPath": - setValueForAttribute(domElement, "clip-path", value); - break; - case "clipRule": - setValueForAttribute(domElement, "clip-rule", value); - break; - case "colorInterpolation": - setValueForAttribute(domElement, "color-interpolation", value); - break; - case "colorInterpolationFilters": - setValueForAttribute(domElement, "color-interpolation-filters", value); - break; - case "colorProfile": - setValueForAttribute(domElement, "color-profile", value); - break; - case "colorRendering": - setValueForAttribute(domElement, "color-rendering", value); - break; - case "dominantBaseline": - setValueForAttribute(domElement, "dominant-baseline", value); - break; - case "enableBackground": - setValueForAttribute(domElement, "enable-background", value); - break; - case "fillOpacity": - setValueForAttribute(domElement, "fill-opacity", value); - break; - case "fillRule": - setValueForAttribute(domElement, "fill-rule", value); - break; - case "floodColor": - setValueForAttribute(domElement, "flood-color", value); - break; - case "floodOpacity": - setValueForAttribute(domElement, "flood-opacity", value); - break; - case "fontFamily": - setValueForAttribute(domElement, "font-family", value); - break; - case "fontSize": - setValueForAttribute(domElement, "font-size", value); - break; - case "fontSizeAdjust": - setValueForAttribute(domElement, "font-size-adjust", value); - break; - case "fontStretch": - setValueForAttribute(domElement, "font-stretch", value); - break; - case "fontStyle": - setValueForAttribute(domElement, "font-style", value); - break; - case "fontVariant": - setValueForAttribute(domElement, "font-variant", value); - break; - case "fontWeight": - setValueForAttribute(domElement, "font-weight", value); - break; - case "glyphName": - setValueForAttribute(domElement, "glyph-name", value); - break; - case "glyphOrientationHorizontal": - setValueForAttribute(domElement, "glyph-orientation-horizontal", value); - break; - case "glyphOrientationVertical": - setValueForAttribute(domElement, "glyph-orientation-vertical", value); - break; - case "horizAdvX": - setValueForAttribute(domElement, "horiz-adv-x", value); - break; - case "horizOriginX": - setValueForAttribute(domElement, "horiz-origin-x", value); - break; - case "imageRendering": - setValueForAttribute(domElement, "image-rendering", value); - break; - case "letterSpacing": - setValueForAttribute(domElement, "letter-spacing", value); - break; - case "lightingColor": - setValueForAttribute(domElement, "lighting-color", value); - break; - case "markerEnd": - setValueForAttribute(domElement, "marker-end", value); - break; - case "markerMid": - setValueForAttribute(domElement, "marker-mid", value); - break; - case "markerStart": - setValueForAttribute(domElement, "marker-start", value); - break; - case "overlinePosition": - setValueForAttribute(domElement, "overline-position", value); - break; - case "overlineThickness": - setValueForAttribute(domElement, "overline-thickness", value); - break; - case "paintOrder": - setValueForAttribute(domElement, "paint-order", value); - break; - case "panose-1": - setValueForAttribute(domElement, "panose-1", value); - break; - case "pointerEvents": - setValueForAttribute(domElement, "pointer-events", value); - break; - case "renderingIntent": - setValueForAttribute(domElement, "rendering-intent", value); - break; - case "shapeRendering": - setValueForAttribute(domElement, "shape-rendering", value); - break; - case "stopColor": - setValueForAttribute(domElement, "stop-color", value); - break; - case "stopOpacity": - setValueForAttribute(domElement, "stop-opacity", value); - break; - case "strikethroughPosition": - setValueForAttribute(domElement, "strikethrough-position", value); - break; - case "strikethroughThickness": - setValueForAttribute(domElement, "strikethrough-thickness", value); - break; - case "strokeDasharray": - setValueForAttribute(domElement, "stroke-dasharray", value); - break; - case "strokeDashoffset": - setValueForAttribute(domElement, "stroke-dashoffset", value); - break; - case "strokeLinecap": - setValueForAttribute(domElement, "stroke-linecap", value); - break; - case "strokeLinejoin": - setValueForAttribute(domElement, "stroke-linejoin", value); - break; - case "strokeMiterlimit": - setValueForAttribute(domElement, "stroke-miterlimit", value); - break; - case "strokeOpacity": - setValueForAttribute(domElement, "stroke-opacity", value); - break; - case "strokeWidth": - setValueForAttribute(domElement, "stroke-width", value); - break; - case "textAnchor": - setValueForAttribute(domElement, "text-anchor", value); - break; - case "textDecoration": - setValueForAttribute(domElement, "text-decoration", value); - break; - case "textRendering": - setValueForAttribute(domElement, "text-rendering", value); - break; - case "transformOrigin": - setValueForAttribute(domElement, "transform-origin", value); - break; - case "underlinePosition": - setValueForAttribute(domElement, "underline-position", value); - break; - case "underlineThickness": - setValueForAttribute(domElement, "underline-thickness", value); - break; - case "unicodeBidi": - setValueForAttribute(domElement, "unicode-bidi", value); - break; - case "unicodeRange": - setValueForAttribute(domElement, "unicode-range", value); - break; - case "unitsPerEm": - setValueForAttribute(domElement, "units-per-em", value); - break; - case "vAlphabetic": - setValueForAttribute(domElement, "v-alphabetic", value); - break; - case "vHanging": - setValueForAttribute(domElement, "v-hanging", value); - break; - case "vIdeographic": - setValueForAttribute(domElement, "v-ideographic", value); - break; - case "vMathematical": - setValueForAttribute(domElement, "v-mathematical", value); - break; - case "vectorEffect": - setValueForAttribute(domElement, "vector-effect", value); - break; - case "vertAdvY": - setValueForAttribute(domElement, "vert-adv-y", value); - break; - case "vertOriginX": - setValueForAttribute(domElement, "vert-origin-x", value); - break; - case "vertOriginY": - setValueForAttribute(domElement, "vert-origin-y", value); - break; - case "wordSpacing": - setValueForAttribute(domElement, "word-spacing", value); - break; - case "writingMode": - setValueForAttribute(domElement, "writing-mode", value); - break; - case "xmlnsXlink": - setValueForAttribute(domElement, "xmlns:xlink", value); - break; - case "xHeight": - setValueForAttribute(domElement, "x-height", value); - break; case "xlinkActuate": setValueForNamespacedAttribute( domElement, @@ -15204,10 +14997,13 @@ function setProp(domElement, tag, key, value, props) { case "textContent": if (enableCustomElementPropertySupport) break; default: - (!(2 < key.length) || + if ( + !(2 < key.length) || ("o" !== key[0] && "O" !== key[0]) || - ("n" !== key[1] && "N" !== key[1])) && - setValueForAttribute(domElement, key, value); + ("n" !== key[1] && "N" !== key[1]) + ) + (key = aliases.get(key) || key), + setValueForAttribute(domElement, key, value); } } function setPropOnCustomElement(domElement, tag, key, value, props) { @@ -15282,6 +15078,15 @@ function setPropOnCustomElement(domElement, tag, key, value, props) { } function setInitialProperties(domElement, tag, props) { switch (tag) { + case "div": + case "span": + case "svg": + case "path": + case "a": + case "g": + case "p": + case "li": + break; case "input": initWrapperState$2(domElement, props); listenToNonDelegatedEvent("invalid", domElement); @@ -15290,6 +15095,13 @@ function setInitialProperties(domElement, tag, props) { var propValue = props[propKey]; if (null != propValue) switch (propKey) { + case "type": + null != propValue && + "function" !== typeof propValue && + "symbol" !== typeof propValue && + "boolean" !== typeof propValue && + domElement.setAttribute(propKey, propValue); + break; case "checked": var node = domElement; propValue = @@ -15318,16 +15130,16 @@ function setInitialProperties(domElement, tag, props) { case "select": domElement._wrapperState = { wasMultiple: !!props.multiple }; listenToNonDelegatedEvent("invalid", domElement); - for (var propKey$222 in props) + for (propValue in props) if ( - props.hasOwnProperty(propKey$222) && - ((propKey = props[propKey$222]), null != propKey) + props.hasOwnProperty(propValue) && + ((propKey = props[propValue]), null != propKey) ) - switch (propKey$222) { + switch (propValue) { case "value": break; default: - setProp(domElement, tag, propKey$222, propKey, props); + setProp(domElement, tag, propValue, propKey, props); } domElement.multiple = !!props.multiple; tag = props.value; @@ -15427,18 +15239,26 @@ function setInitialProperties(domElement, tag, props) { setProp(domElement, tag, propKey$228, propKey, props); } return; + default: + if (isCustomElement(tag)) { + for (var propKey$230 in props) + props.hasOwnProperty(propKey$230) && + ((propKey = props[propKey$230]), + null != propKey && + setPropOnCustomElement( + domElement, + tag, + propKey$230, + propKey, + props + )); + return; + } } - if (isCustomElement(tag)) - for (node in props) - props.hasOwnProperty(node) && - ((propKey = props[node]), - null != propKey && - setPropOnCustomElement(domElement, tag, node, propKey, props)); - else - for (propValue in props) - props.hasOwnProperty(propValue) && - ((propKey = props[propValue]), - null != propKey && setProp(domElement, tag, propValue, propKey, props)); + for (node in props) + props.hasOwnProperty(node) && + ((propKey = props[node]), + null != propKey && setProp(domElement, tag, node, propKey, props)); } function updateProperties( domElement, @@ -15448,6 +15268,15 @@ function updateProperties( nextProps ) { switch (tag) { + case "div": + case "span": + case "svg": + case "path": + case "a": + case "g": + case "p": + case "li": + break; case "input": "radio" === nextProps.type && null != nextProps.name && @@ -15578,25 +15407,27 @@ function updateProperties( setProp(domElement, tag, propValue, propKey, nextProps); } return; + default: + if (isCustomElement(tag)) { + for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) + setPropOnCustomElement( + domElement, + tag, + updatePayload[lastProps], + updatePayload[lastProps + 1], + nextProps + ); + return; + } } - if (isCustomElement(tag)) - for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) - setPropOnCustomElement( - domElement, - tag, - updatePayload[lastProps], - updatePayload[lastProps + 1], - nextProps - ); - else - for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) - setProp( - domElement, - tag, - updatePayload[lastProps], - updatePayload[lastProps + 1], - nextProps - ); + for (lastProps = 0; lastProps < updatePayload.length; lastProps += 2) + setProp( + domElement, + tag, + updatePayload[lastProps], + updatePayload[lastProps + 1], + nextProps + ); } var Dispatcher$1 = Internals.Dispatcher, eventsEnabled = null, @@ -16549,10 +16380,10 @@ Internals.Events = [ restoreStateIfNeeded, batchedUpdates$1 ]; -var devToolsConfig$jscomp$inline_1849 = { +var devToolsConfig$jscomp$inline_1864 = { findFiberByHostInstance: getClosestInstanceFromNode, bundleType: 0, - version: "18.3.0-www-modern-e957d901", + version: "18.3.0-www-modern-b3a052f6", rendererPackageName: "react-dom" }; (function (internals) { @@ -16570,10 +16401,10 @@ var devToolsConfig$jscomp$inline_1849 = { } catch (err) {} return hook.checkDCE ? !0 : !1; })({ - bundleType: devToolsConfig$jscomp$inline_1849.bundleType, - version: devToolsConfig$jscomp$inline_1849.version, - rendererPackageName: devToolsConfig$jscomp$inline_1849.rendererPackageName, - rendererConfig: devToolsConfig$jscomp$inline_1849.rendererConfig, + bundleType: devToolsConfig$jscomp$inline_1864.bundleType, + version: devToolsConfig$jscomp$inline_1864.version, + rendererPackageName: devToolsConfig$jscomp$inline_1864.rendererPackageName, + rendererConfig: devToolsConfig$jscomp$inline_1864.rendererConfig, overrideHookState: null, overrideHookStateDeletePath: null, overrideHookStateRenamePath: null, @@ -16590,14 +16421,14 @@ var devToolsConfig$jscomp$inline_1849 = { return null === fiber ? null : fiber.stateNode; }, findFiberByHostInstance: - devToolsConfig$jscomp$inline_1849.findFiberByHostInstance || + devToolsConfig$jscomp$inline_1864.findFiberByHostInstance || emptyFindFiberByHostInstance, findHostInstancesForRefresh: null, scheduleRefresh: null, scheduleRoot: null, setRefreshHandler: null, getCurrentFiber: null, - reconcilerVersion: "18.3.0-www-modern-e957d901" + reconcilerVersion: "18.3.0-www-modern-b3a052f6" }); exports.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED = Internals; exports.createPortal = function (children, container) { @@ -16753,7 +16584,7 @@ exports.unstable_createEventHandle = function (type, options) { return eventHandle; }; exports.unstable_runWithPriority = runWithPriority; -exports.version = "18.3.0-www-modern-e957d901"; +exports.version = "18.3.0-www-modern-b3a052f6"; /* global __REACT_DEVTOOLS_GLOBAL_HOOK__ */ if ( diff --git a/compiled/facebook-www/ReactDOMServer-dev.classic.js b/compiled/facebook-www/ReactDOMServer-dev.classic.js index c56c70ef412e2..986a654bec7fc 100644 --- a/compiled/facebook-www/ReactDOMServer-dev.classic.js +++ b/compiled/facebook-www/ReactDOMServer-dev.classic.js @@ -19,7 +19,7 @@ if (__DEV__) { var React = require("react"); var ReactDOM = require("react-dom"); -var ReactVersion = "18.3.0-www-classic-9f7eed7c"; +var ReactVersion = "18.3.0-www-classic-1fceba31"; // This refers to a WWW module. var warningWWW = require("warning"); @@ -280,87 +280,166 @@ function isAttributeNameSafe(attributeName) { /** * CSS properties which accept numbers but are not in units of "px". */ +var unitlessNumbers = new Set([ + "animationIterationCount", + "aspectRatio", + "borderImageOutset", + "borderImageSlice", + "borderImageWidth", + "boxFlex", + "boxFlexGroup", + "boxOrdinalGroup", + "columnCount", + "columns", + "flex", + "flexGrow", + "flexPositive", + "flexShrink", + "flexNegative", + "flexOrder", + "gridArea", + "gridRow", + "gridRowEnd", + "gridRowSpan", + "gridRowStart", + "gridColumn", + "gridColumnEnd", + "gridColumnSpan", + "gridColumnStart", + "fontWeight", + "lineClamp", + "lineHeight", + "opacity", + "order", + "orphans", + "scale", + "tabSize", + "widows", + "zIndex", + "zoom", + "fillOpacity", // SVG-related properties + "floodOpacity", + "stopOpacity", + "strokeDasharray", + "strokeDashoffset", + "strokeMiterlimit", + "strokeOpacity", + "strokeWidth", + "MozAnimationIterationCount", // Known Prefixed Properties + "MozBoxFlex", // TODO: Remove these since they shouldn't be used in modern code + "MozBoxFlexGroup", + "MozLineClamp", + "msAnimationIterationCount", + "msFlex", + "msZoom", + "msFlexGrow", + "msFlexNegative", + "msFlexOrder", + "msFlexPositive", + "msFlexShrink", + "msGridColumn", + "msGridColumnSpan", + "msGridRow", + "msGridRowSpan", + "WebkitAnimationIterationCount", + "WebkitBoxFlex", + "WebKitBoxFlexGroup", + "WebkitBoxOrdinalGroup", + "WebkitColumnCount", + "WebkitColumns", + "WebkitFlex", + "WebkitFlexGrow", + "WebkitFlexPositive", + "WebkitFlexShrink", + "WebkitLineClamp" +]); function isUnitlessNumber(name) { - switch (name) { - case "animationIterationCount": - case "aspectRatio": - case "borderImageOutset": - case "borderImageSlice": - case "borderImageWidth": - case "boxFlex": - case "boxFlexGroup": - case "boxOrdinalGroup": - case "columnCount": - case "columns": - case "flex": - case "flexGrow": - case "flexPositive": - case "flexShrink": - case "flexNegative": - case "flexOrder": - case "gridArea": - case "gridRow": - case "gridRowEnd": - case "gridRowSpan": - case "gridRowStart": - case "gridColumn": - case "gridColumnEnd": - case "gridColumnSpan": - case "gridColumnStart": - case "fontWeight": - case "lineClamp": - case "lineHeight": - case "opacity": - case "order": - case "orphans": - case "scale": - case "tabSize": - case "widows": - case "zIndex": - case "zoom": - case "fillOpacity": // SVG-related properties - - case "floodOpacity": - case "stopOpacity": - case "strokeDasharray": - case "strokeDashoffset": - case "strokeMiterlimit": - case "strokeOpacity": - case "strokeWidth": - case "MozAnimationIterationCount": // Known Prefixed Properties - - case "MozBoxFlex": // TODO: Remove these since they shouldn't be used in modern code - - case "MozBoxFlexGroup": - case "MozLineClamp": - case "msAnimationIterationCount": - case "msFlex": - case "msZoom": - case "msFlexGrow": - case "msFlexNegative": - case "msFlexOrder": - case "msFlexPositive": - case "msFlexShrink": - case "msGridColumn": - case "msGridColumnSpan": - case "msGridRow": - case "msGridRowSpan": - case "WebkitAnimationIterationCount": - case "WebkitBoxFlex": - case "WebKitBoxFlexGroup": - case "WebkitBoxOrdinalGroup": - case "WebkitColumnCount": - case "WebkitColumns": - case "WebkitFlex": - case "WebkitFlexGrow": - case "WebkitFlexPositive": - case "WebkitFlexShrink": - case "WebkitLineClamp": - return true; - - default: - return false; - } + return unitlessNumbers.has(name); +} + +var aliases = new Map([ + ["acceptCharset", "accept-charset"], + ["htmlFor", "for"], + ["httpEquiv", "http-equiv"], // HTML and SVG attributes, but the SVG attribute is case sensitive.], + ["crossOrigin", "crossorigin"], // This is a list of all SVG attributes that need special casing. + // Regular attributes that just accept strings.], + ["accentHeight", "accent-height"], + ["alignmentBaseline", "alignment-baseline"], + ["arabicForm", "arabic-form"], + ["baselineShift", "baseline-shift"], + ["capHeight", "cap-height"], + ["clipPath", "clip-path"], + ["clipRule", "clip-rule"], + ["colorInterpolation", "color-interpolation"], + ["colorInterpolationFilters", "color-interpolation-filters"], + ["colorProfile", "color-profile"], + ["colorRendering", "color-rendering"], + ["dominantBaseline", "dominant-baseline"], + ["enableBackground", "enable-background"], + ["fillOpacity", "fill-opacity"], + ["fillRule", "fill-rule"], + ["floodColor", "flood-color"], + ["floodOpacity", "flood-opacity"], + ["fontFamily", "font-family"], + ["fontSize", "font-size"], + ["fontSizeAdjust", "font-size-adjust"], + ["fontStretch", "font-stretch"], + ["fontStyle", "font-style"], + ["fontVariant", "font-variant"], + ["fontWeight", "font-weight"], + ["glyphName", "glyph-name"], + ["glyphOrientationHorizontal", "glyph-orientation-horizontal"], + ["glyphOrientationVertical", "glyph-orientation-vertical"], + ["horizAdvX", "horiz-adv-x"], + ["horizOriginX", "horiz-origin-x"], + ["imageRendering", "image-rendering"], + ["letterSpacing", "letter-spacing"], + ["lightingColor", "lighting-color"], + ["markerEnd", "marker-end"], + ["markerMid", "marker-mid"], + ["markerStart", "marker-start"], + ["overlinePosition", "overline-position"], + ["overlineThickness", "overline-thickness"], + ["paintOrder", "paint-order"], + ["panose-1", "panose-1"], + ["pointerEvents", "pointer-events"], + ["renderingIntent", "rendering-intent"], + ["shapeRendering", "shape-rendering"], + ["stopColor", "stop-color"], + ["stopOpacity", "stop-opacity"], + ["strikethroughPosition", "strikethrough-position"], + ["strikethroughThickness", "strikethrough-thickness"], + ["strokeDasharray", "stroke-dasharray"], + ["strokeDashoffset", "stroke-dashoffset"], + ["strokeLinecap", "stroke-linecap"], + ["strokeLinejoin", "stroke-linejoin"], + ["strokeMiterlimit", "stroke-miterlimit"], + ["strokeOpacity", "stroke-opacity"], + ["strokeWidth", "stroke-width"], + ["textAnchor", "text-anchor"], + ["textDecoration", "text-decoration"], + ["textRendering", "text-rendering"], + ["transformOrigin", "transform-origin"], + ["underlinePosition", "underline-position"], + ["underlineThickness", "underline-thickness"], + ["unicodeBidi", "unicode-bidi"], + ["unicodeRange", "unicode-range"], + ["unitsPerEm", "units-per-em"], + ["vAlphabetic", "v-alphabetic"], + ["vHanging", "v-hanging"], + ["vIdeographic", "v-ideographic"], + ["vMathematical", "v-mathematical"], + ["vectorEffect", "vector-effect"], + ["vertAdvY", "vert-adv-y"], + ["vertOriginX", "vert-origin-x"], + ["vertOriginY", "vert-origin-y"], + ["wordSpacing", "word-spacing"], + ["writingMode", "writing-mode"], + ["xmlnsXlink", "xmlns:xlink"], + ["xHeight", "x-height"] +]); +function getAttributeAlias(name) { + return aliases.get(name) || name; } var hasReadOnlyValue = { @@ -2741,25 +2820,30 @@ function pushStringAttribute(target, name, value) { function pushAttribute(target, name, value) { // not null or undefined switch (name) { - case "style": { - pushStyleAttribute(target, value); - return; + // These are very common props and therefore are in the beginning of the switch. + // TODO: aria-label is a very common prop but allows booleans so is not like the others + // but should ideally go in this list too. + case "className": { + pushStringAttribute(target, "class", value); + break; } - case "defaultValue": - case "defaultChecked": // These shouldn't be set as attributes on generic HTML elements. - - case "innerHTML": // Must use dangerouslySetInnerHTML instead. + case "tabIndex": { + pushStringAttribute(target, "tabindex", value); + break; + } - case "suppressContentEditableWarning": - case "suppressHydrationWarning": - // Ignored. These are built-in to React on the client. - return; + case "dir": + case "role": + case "viewBox": + case "width": + case "height": { + pushStringAttribute(target, name, value); + break; + } - case "autoFocus": - case "multiple": - case "muted": { - pushBooleanAttribute(target, name.toLowerCase(), value); + case "style": { + pushStyleAttribute(target, value); return; } @@ -2820,6 +2904,23 @@ function pushAttribute(target, name, value) { return; } + case "defaultValue": + case "defaultChecked": // These shouldn't be set as attributes on generic HTML elements. + + case "innerHTML": // Must use dangerouslySetInnerHTML instead. + + case "suppressContentEditableWarning": + case "suppressHydrationWarning": + // Ignored. These are built-in to React on the client. + return; + + case "autoFocus": + case "multiple": + case "muted": { + pushBooleanAttribute(target, name.toLowerCase(), value); + return; + } + case "xlinkHref": { if ( typeof value === "function" || @@ -2969,367 +3070,42 @@ function pushAttribute(target, name, value) { return; } - // A few React string attributes have a different name. - // This is a mapping from React prop names to the attribute names. - - case "acceptCharset": - pushStringAttribute(target, "accept-charset", value); - return; - - case "className": - pushStringAttribute(target, "class", value); - return; - - case "htmlFor": - pushStringAttribute(target, "for", value); - return; - - case "httpEquiv": - pushStringAttribute(target, "http-equiv", value); - return; - // HTML and SVG attributes, but the SVG attribute is case sensitive. - - case "tabIndex": - pushStringAttribute(target, "tabindex", value); - return; - - case "crossOrigin": - pushStringAttribute(target, "crossorigin", value); - return; - // This is a list of all SVG attributes that need special casing. - // Regular attributes that just accept strings. - - case "accentHeight": - pushStringAttribute(target, "accent-height", value); - return; - - case "alignmentBaseline": - pushStringAttribute(target, "alignment-baseline", value); - return; - - case "arabicForm": - pushStringAttribute(target, "arabic-form", value); - return; - - case "baselineShift": - pushStringAttribute(target, "baseline-shift", value); - return; - - case "capHeight": - pushStringAttribute(target, "cap-height", value); - return; - - case "clipPath": - pushStringAttribute(target, "clip-path", value); - return; - - case "clipRule": - pushStringAttribute(target, "clip-rule", value); - return; - - case "colorInterpolation": - pushStringAttribute(target, "color-interpolation", value); - return; - - case "colorInterpolationFilters": - pushStringAttribute(target, "color-interpolation-filters", value); - return; - - case "colorProfile": - pushStringAttribute(target, "color-profile", value); - return; - - case "colorRendering": - pushStringAttribute(target, "color-rendering", value); - return; - - case "dominantBaseline": - pushStringAttribute(target, "dominant-baseline", value); - return; - - case "enableBackground": - pushStringAttribute(target, "enable-background", value); - return; - - case "fillOpacity": - pushStringAttribute(target, "fill-opacity", value); - return; - - case "fillRule": - pushStringAttribute(target, "fill-rule", value); - return; - - case "floodColor": - pushStringAttribute(target, "flood-color", value); - return; - - case "floodOpacity": - pushStringAttribute(target, "flood-opacity", value); - return; - - case "fontFamily": - pushStringAttribute(target, "font-family", value); - return; - - case "fontSize": - pushStringAttribute(target, "font-size", value); - return; - - case "fontSizeAdjust": - pushStringAttribute(target, "font-size-adjust", value); - return; - - case "fontStretch": - pushStringAttribute(target, "font-stretch", value); - return; - - case "fontStyle": - pushStringAttribute(target, "font-style", value); - return; - - case "fontVariant": - pushStringAttribute(target, "font-variant", value); - return; - - case "fontWeight": - pushStringAttribute(target, "font-weight", value); - return; - - case "glyphName": - pushStringAttribute(target, "glyph-name", value); - return; - - case "glyphOrientationHorizontal": - pushStringAttribute(target, "glyph-orientation-horizontal", value); - return; - - case "glyphOrientationVertical": - pushStringAttribute(target, "glyph-orientation-vertical", value); - return; - - case "horizAdvX": - pushStringAttribute(target, "horiz-adv-x", value); - return; - - case "horizOriginX": - pushStringAttribute(target, "horiz-origin-x", value); - return; - - case "imageRendering": - pushStringAttribute(target, "image-rendering", value); - return; - - case "letterSpacing": - pushStringAttribute(target, "letter-spacing", value); - return; - - case "lightingColor": - pushStringAttribute(target, "lighting-color", value); - return; - - case "markerEnd": - pushStringAttribute(target, "marker-end", value); - return; - - case "markerMid": - pushStringAttribute(target, "marker-mid", value); - return; - - case "markerStart": - pushStringAttribute(target, "marker-start", value); - return; - - case "overlinePosition": - pushStringAttribute(target, "overline-position", value); - return; - - case "overlineThickness": - pushStringAttribute(target, "overline-thickness", value); - return; - - case "paintOrder": - pushStringAttribute(target, "paint-order", value); - return; - - case "panose-1": - pushStringAttribute(target, "panose-1", value); - return; - - case "pointerEvents": - pushStringAttribute(target, "pointer-events", value); - return; - - case "renderingIntent": - pushStringAttribute(target, "rendering-intent", value); - return; - - case "shapeRendering": - pushStringAttribute(target, "shape-rendering", value); - return; - - case "stopColor": - pushStringAttribute(target, "stop-color", value); - return; - - case "stopOpacity": - pushStringAttribute(target, "stop-opacity", value); - return; - - case "strikethroughPosition": - pushStringAttribute(target, "strikethrough-position", value); - return; - - case "strikethroughThickness": - pushStringAttribute(target, "strikethrough-thickness", value); - return; - - case "strokeDasharray": - pushStringAttribute(target, "stroke-dasharray", value); - return; - - case "strokeDashoffset": - pushStringAttribute(target, "stroke-dashoffset", value); - return; - - case "strokeLinecap": - pushStringAttribute(target, "stroke-linecap", value); - return; - - case "strokeLinejoin": - pushStringAttribute(target, "stroke-linejoin", value); - return; - - case "strokeMiterlimit": - pushStringAttribute(target, "stroke-miterlimit", value); - return; - - case "strokeOpacity": - pushStringAttribute(target, "stroke-opacity", value); - return; - - case "strokeWidth": - pushStringAttribute(target, "stroke-width", value); - return; - - case "textAnchor": - pushStringAttribute(target, "text-anchor", value); - return; - - case "textDecoration": - pushStringAttribute(target, "text-decoration", value); - return; - - case "textRendering": - pushStringAttribute(target, "text-rendering", value); - return; - - case "transformOrigin": - pushStringAttribute(target, "transform-origin", value); - return; - - case "underlinePosition": - pushStringAttribute(target, "underline-position", value); - return; - - case "underlineThickness": - pushStringAttribute(target, "underline-thickness", value); - return; - - case "unicodeBidi": - pushStringAttribute(target, "unicode-bidi", value); - return; - - case "unicodeRange": - pushStringAttribute(target, "unicode-range", value); - return; - - case "unitsPerEm": - pushStringAttribute(target, "units-per-em", value); - return; - - case "vAlphabetic": - pushStringAttribute(target, "v-alphabetic", value); - return; - - case "vHanging": - pushStringAttribute(target, "v-hanging", value); - return; - - case "vIdeographic": - pushStringAttribute(target, "v-ideographic", value); - return; - - case "vMathematical": - pushStringAttribute(target, "v-mathematical", value); - return; - - case "vectorEffect": - pushStringAttribute(target, "vector-effect", value); - return; - - case "vertAdvY": - pushStringAttribute(target, "vert-adv-y", value); - return; - - case "vertOriginX": - pushStringAttribute(target, "vert-origin-x", value); - return; - - case "vertOriginY": - pushStringAttribute(target, "vert-origin-y", value); - return; - - case "wordSpacing": - pushStringAttribute(target, "word-spacing", value); - return; - - case "writingMode": - pushStringAttribute(target, "writing-mode", value); - return; - - case "xmlnsXlink": - pushStringAttribute(target, "xmlns:xlink", value); - return; - - case "xHeight": - pushStringAttribute(target, "x-height", value); - return; case "xlinkActuate": pushStringAttribute(target, "xlink:actuate", value); - break; + return; case "xlinkArcrole": pushStringAttribute(target, "xlink:arcrole", value); - break; + return; case "xlinkRole": pushStringAttribute(target, "xlink:role", value); - break; + return; case "xlinkShow": pushStringAttribute(target, "xlink:show", value); - break; + return; case "xlinkTitle": pushStringAttribute(target, "xlink:title", value); - break; + return; case "xlinkType": pushStringAttribute(target, "xlink:type", value); - break; + return; case "xmlBase": pushStringAttribute(target, "xml:base", value); - break; + return; case "xmlLang": pushStringAttribute(target, "xml:lang", value); - break; + return; case "xmlSpace": pushStringAttribute(target, "xml:space", value); - break; + return; default: if ( @@ -3342,7 +3118,9 @@ function pushAttribute(target, name, value) { return; } - if (isAttributeNameSafe(name)) { + var attributeName = getAttributeAlias(name); + + if (isAttributeNameSafe(attributeName)) { // shouldRemoveAttribute switch (typeof value) { case "function": @@ -3351,7 +3129,7 @@ function pushAttribute(target, name, value) { return; case "boolean": { - var prefix = name.toLowerCase().slice(0, 5); + var prefix = attributeName.toLowerCase().slice(0, 5); if (prefix !== "data-" && prefix !== "aria-") { return; @@ -3361,7 +3139,7 @@ function pushAttribute(target, name, value) { target.push( attributeSeparator, - stringToChunk(name), + stringToChunk(attributeName), attributeAssign, stringToChunk(escapeTextForBrowser(value)), attributeEnd @@ -5087,7 +4865,18 @@ function pushStartInstance( } switch (type) { + case "div": + case "span": + case "svg": + case "path": + case "a": + case "g": + case "p": + case "li": + // Fast track very common tags + break; // Special tags + case "select": return pushStartSelect(target, props); @@ -5207,15 +4996,14 @@ function pushStartInstance( } default: { - if (type.indexOf("-") === -1) { - // Generic element - return pushStartGenericElement(target, props, type); - } else { + if (type.indexOf("-") !== -1) { // Custom element return pushStartCustomElement(target, props, type); } } - } + } // Generic element + + return pushStartGenericElement(target, props, type); } var endTag1 = stringToPrecomputedChunk(""); diff --git a/compiled/facebook-www/ReactDOMServer-dev.modern.js b/compiled/facebook-www/ReactDOMServer-dev.modern.js index cc008193ee5b4..038389dc73193 100644 --- a/compiled/facebook-www/ReactDOMServer-dev.modern.js +++ b/compiled/facebook-www/ReactDOMServer-dev.modern.js @@ -19,7 +19,7 @@ if (__DEV__) { var React = require("react"); var ReactDOM = require("react-dom"); -var ReactVersion = "18.3.0-www-modern-7d6639b3"; +var ReactVersion = "18.3.0-www-modern-8b1abfff"; // This refers to a WWW module. var warningWWW = require("warning"); @@ -280,87 +280,166 @@ function isAttributeNameSafe(attributeName) { /** * CSS properties which accept numbers but are not in units of "px". */ +var unitlessNumbers = new Set([ + "animationIterationCount", + "aspectRatio", + "borderImageOutset", + "borderImageSlice", + "borderImageWidth", + "boxFlex", + "boxFlexGroup", + "boxOrdinalGroup", + "columnCount", + "columns", + "flex", + "flexGrow", + "flexPositive", + "flexShrink", + "flexNegative", + "flexOrder", + "gridArea", + "gridRow", + "gridRowEnd", + "gridRowSpan", + "gridRowStart", + "gridColumn", + "gridColumnEnd", + "gridColumnSpan", + "gridColumnStart", + "fontWeight", + "lineClamp", + "lineHeight", + "opacity", + "order", + "orphans", + "scale", + "tabSize", + "widows", + "zIndex", + "zoom", + "fillOpacity", // SVG-related properties + "floodOpacity", + "stopOpacity", + "strokeDasharray", + "strokeDashoffset", + "strokeMiterlimit", + "strokeOpacity", + "strokeWidth", + "MozAnimationIterationCount", // Known Prefixed Properties + "MozBoxFlex", // TODO: Remove these since they shouldn't be used in modern code + "MozBoxFlexGroup", + "MozLineClamp", + "msAnimationIterationCount", + "msFlex", + "msZoom", + "msFlexGrow", + "msFlexNegative", + "msFlexOrder", + "msFlexPositive", + "msFlexShrink", + "msGridColumn", + "msGridColumnSpan", + "msGridRow", + "msGridRowSpan", + "WebkitAnimationIterationCount", + "WebkitBoxFlex", + "WebKitBoxFlexGroup", + "WebkitBoxOrdinalGroup", + "WebkitColumnCount", + "WebkitColumns", + "WebkitFlex", + "WebkitFlexGrow", + "WebkitFlexPositive", + "WebkitFlexShrink", + "WebkitLineClamp" +]); function isUnitlessNumber(name) { - switch (name) { - case "animationIterationCount": - case "aspectRatio": - case "borderImageOutset": - case "borderImageSlice": - case "borderImageWidth": - case "boxFlex": - case "boxFlexGroup": - case "boxOrdinalGroup": - case "columnCount": - case "columns": - case "flex": - case "flexGrow": - case "flexPositive": - case "flexShrink": - case "flexNegative": - case "flexOrder": - case "gridArea": - case "gridRow": - case "gridRowEnd": - case "gridRowSpan": - case "gridRowStart": - case "gridColumn": - case "gridColumnEnd": - case "gridColumnSpan": - case "gridColumnStart": - case "fontWeight": - case "lineClamp": - case "lineHeight": - case "opacity": - case "order": - case "orphans": - case "scale": - case "tabSize": - case "widows": - case "zIndex": - case "zoom": - case "fillOpacity": // SVG-related properties - - case "floodOpacity": - case "stopOpacity": - case "strokeDasharray": - case "strokeDashoffset": - case "strokeMiterlimit": - case "strokeOpacity": - case "strokeWidth": - case "MozAnimationIterationCount": // Known Prefixed Properties - - case "MozBoxFlex": // TODO: Remove these since they shouldn't be used in modern code - - case "MozBoxFlexGroup": - case "MozLineClamp": - case "msAnimationIterationCount": - case "msFlex": - case "msZoom": - case "msFlexGrow": - case "msFlexNegative": - case "msFlexOrder": - case "msFlexPositive": - case "msFlexShrink": - case "msGridColumn": - case "msGridColumnSpan": - case "msGridRow": - case "msGridRowSpan": - case "WebkitAnimationIterationCount": - case "WebkitBoxFlex": - case "WebKitBoxFlexGroup": - case "WebkitBoxOrdinalGroup": - case "WebkitColumnCount": - case "WebkitColumns": - case "WebkitFlex": - case "WebkitFlexGrow": - case "WebkitFlexPositive": - case "WebkitFlexShrink": - case "WebkitLineClamp": - return true; - - default: - return false; - } + return unitlessNumbers.has(name); +} + +var aliases = new Map([ + ["acceptCharset", "accept-charset"], + ["htmlFor", "for"], + ["httpEquiv", "http-equiv"], // HTML and SVG attributes, but the SVG attribute is case sensitive.], + ["crossOrigin", "crossorigin"], // This is a list of all SVG attributes that need special casing. + // Regular attributes that just accept strings.], + ["accentHeight", "accent-height"], + ["alignmentBaseline", "alignment-baseline"], + ["arabicForm", "arabic-form"], + ["baselineShift", "baseline-shift"], + ["capHeight", "cap-height"], + ["clipPath", "clip-path"], + ["clipRule", "clip-rule"], + ["colorInterpolation", "color-interpolation"], + ["colorInterpolationFilters", "color-interpolation-filters"], + ["colorProfile", "color-profile"], + ["colorRendering", "color-rendering"], + ["dominantBaseline", "dominant-baseline"], + ["enableBackground", "enable-background"], + ["fillOpacity", "fill-opacity"], + ["fillRule", "fill-rule"], + ["floodColor", "flood-color"], + ["floodOpacity", "flood-opacity"], + ["fontFamily", "font-family"], + ["fontSize", "font-size"], + ["fontSizeAdjust", "font-size-adjust"], + ["fontStretch", "font-stretch"], + ["fontStyle", "font-style"], + ["fontVariant", "font-variant"], + ["fontWeight", "font-weight"], + ["glyphName", "glyph-name"], + ["glyphOrientationHorizontal", "glyph-orientation-horizontal"], + ["glyphOrientationVertical", "glyph-orientation-vertical"], + ["horizAdvX", "horiz-adv-x"], + ["horizOriginX", "horiz-origin-x"], + ["imageRendering", "image-rendering"], + ["letterSpacing", "letter-spacing"], + ["lightingColor", "lighting-color"], + ["markerEnd", "marker-end"], + ["markerMid", "marker-mid"], + ["markerStart", "marker-start"], + ["overlinePosition", "overline-position"], + ["overlineThickness", "overline-thickness"], + ["paintOrder", "paint-order"], + ["panose-1", "panose-1"], + ["pointerEvents", "pointer-events"], + ["renderingIntent", "rendering-intent"], + ["shapeRendering", "shape-rendering"], + ["stopColor", "stop-color"], + ["stopOpacity", "stop-opacity"], + ["strikethroughPosition", "strikethrough-position"], + ["strikethroughThickness", "strikethrough-thickness"], + ["strokeDasharray", "stroke-dasharray"], + ["strokeDashoffset", "stroke-dashoffset"], + ["strokeLinecap", "stroke-linecap"], + ["strokeLinejoin", "stroke-linejoin"], + ["strokeMiterlimit", "stroke-miterlimit"], + ["strokeOpacity", "stroke-opacity"], + ["strokeWidth", "stroke-width"], + ["textAnchor", "text-anchor"], + ["textDecoration", "text-decoration"], + ["textRendering", "text-rendering"], + ["transformOrigin", "transform-origin"], + ["underlinePosition", "underline-position"], + ["underlineThickness", "underline-thickness"], + ["unicodeBidi", "unicode-bidi"], + ["unicodeRange", "unicode-range"], + ["unitsPerEm", "units-per-em"], + ["vAlphabetic", "v-alphabetic"], + ["vHanging", "v-hanging"], + ["vIdeographic", "v-ideographic"], + ["vMathematical", "v-mathematical"], + ["vectorEffect", "vector-effect"], + ["vertAdvY", "vert-adv-y"], + ["vertOriginX", "vert-origin-x"], + ["vertOriginY", "vert-origin-y"], + ["wordSpacing", "word-spacing"], + ["writingMode", "writing-mode"], + ["xmlnsXlink", "xmlns:xlink"], + ["xHeight", "x-height"] +]); +function getAttributeAlias(name) { + return aliases.get(name) || name; } var hasReadOnlyValue = { @@ -2741,25 +2820,30 @@ function pushStringAttribute(target, name, value) { function pushAttribute(target, name, value) { // not null or undefined switch (name) { - case "style": { - pushStyleAttribute(target, value); - return; + // These are very common props and therefore are in the beginning of the switch. + // TODO: aria-label is a very common prop but allows booleans so is not like the others + // but should ideally go in this list too. + case "className": { + pushStringAttribute(target, "class", value); + break; } - case "defaultValue": - case "defaultChecked": // These shouldn't be set as attributes on generic HTML elements. - - case "innerHTML": // Must use dangerouslySetInnerHTML instead. + case "tabIndex": { + pushStringAttribute(target, "tabindex", value); + break; + } - case "suppressContentEditableWarning": - case "suppressHydrationWarning": - // Ignored. These are built-in to React on the client. - return; + case "dir": + case "role": + case "viewBox": + case "width": + case "height": { + pushStringAttribute(target, name, value); + break; + } - case "autoFocus": - case "multiple": - case "muted": { - pushBooleanAttribute(target, name.toLowerCase(), value); + case "style": { + pushStyleAttribute(target, value); return; } @@ -2820,6 +2904,23 @@ function pushAttribute(target, name, value) { return; } + case "defaultValue": + case "defaultChecked": // These shouldn't be set as attributes on generic HTML elements. + + case "innerHTML": // Must use dangerouslySetInnerHTML instead. + + case "suppressContentEditableWarning": + case "suppressHydrationWarning": + // Ignored. These are built-in to React on the client. + return; + + case "autoFocus": + case "multiple": + case "muted": { + pushBooleanAttribute(target, name.toLowerCase(), value); + return; + } + case "xlinkHref": { if ( typeof value === "function" || @@ -2969,367 +3070,42 @@ function pushAttribute(target, name, value) { return; } - // A few React string attributes have a different name. - // This is a mapping from React prop names to the attribute names. - - case "acceptCharset": - pushStringAttribute(target, "accept-charset", value); - return; - - case "className": - pushStringAttribute(target, "class", value); - return; - - case "htmlFor": - pushStringAttribute(target, "for", value); - return; - - case "httpEquiv": - pushStringAttribute(target, "http-equiv", value); - return; - // HTML and SVG attributes, but the SVG attribute is case sensitive. - - case "tabIndex": - pushStringAttribute(target, "tabindex", value); - return; - - case "crossOrigin": - pushStringAttribute(target, "crossorigin", value); - return; - // This is a list of all SVG attributes that need special casing. - // Regular attributes that just accept strings. - - case "accentHeight": - pushStringAttribute(target, "accent-height", value); - return; - - case "alignmentBaseline": - pushStringAttribute(target, "alignment-baseline", value); - return; - - case "arabicForm": - pushStringAttribute(target, "arabic-form", value); - return; - - case "baselineShift": - pushStringAttribute(target, "baseline-shift", value); - return; - - case "capHeight": - pushStringAttribute(target, "cap-height", value); - return; - - case "clipPath": - pushStringAttribute(target, "clip-path", value); - return; - - case "clipRule": - pushStringAttribute(target, "clip-rule", value); - return; - - case "colorInterpolation": - pushStringAttribute(target, "color-interpolation", value); - return; - - case "colorInterpolationFilters": - pushStringAttribute(target, "color-interpolation-filters", value); - return; - - case "colorProfile": - pushStringAttribute(target, "color-profile", value); - return; - - case "colorRendering": - pushStringAttribute(target, "color-rendering", value); - return; - - case "dominantBaseline": - pushStringAttribute(target, "dominant-baseline", value); - return; - - case "enableBackground": - pushStringAttribute(target, "enable-background", value); - return; - - case "fillOpacity": - pushStringAttribute(target, "fill-opacity", value); - return; - - case "fillRule": - pushStringAttribute(target, "fill-rule", value); - return; - - case "floodColor": - pushStringAttribute(target, "flood-color", value); - return; - - case "floodOpacity": - pushStringAttribute(target, "flood-opacity", value); - return; - - case "fontFamily": - pushStringAttribute(target, "font-family", value); - return; - - case "fontSize": - pushStringAttribute(target, "font-size", value); - return; - - case "fontSizeAdjust": - pushStringAttribute(target, "font-size-adjust", value); - return; - - case "fontStretch": - pushStringAttribute(target, "font-stretch", value); - return; - - case "fontStyle": - pushStringAttribute(target, "font-style", value); - return; - - case "fontVariant": - pushStringAttribute(target, "font-variant", value); - return; - - case "fontWeight": - pushStringAttribute(target, "font-weight", value); - return; - - case "glyphName": - pushStringAttribute(target, "glyph-name", value); - return; - - case "glyphOrientationHorizontal": - pushStringAttribute(target, "glyph-orientation-horizontal", value); - return; - - case "glyphOrientationVertical": - pushStringAttribute(target, "glyph-orientation-vertical", value); - return; - - case "horizAdvX": - pushStringAttribute(target, "horiz-adv-x", value); - return; - - case "horizOriginX": - pushStringAttribute(target, "horiz-origin-x", value); - return; - - case "imageRendering": - pushStringAttribute(target, "image-rendering", value); - return; - - case "letterSpacing": - pushStringAttribute(target, "letter-spacing", value); - return; - - case "lightingColor": - pushStringAttribute(target, "lighting-color", value); - return; - - case "markerEnd": - pushStringAttribute(target, "marker-end", value); - return; - - case "markerMid": - pushStringAttribute(target, "marker-mid", value); - return; - - case "markerStart": - pushStringAttribute(target, "marker-start", value); - return; - - case "overlinePosition": - pushStringAttribute(target, "overline-position", value); - return; - - case "overlineThickness": - pushStringAttribute(target, "overline-thickness", value); - return; - - case "paintOrder": - pushStringAttribute(target, "paint-order", value); - return; - - case "panose-1": - pushStringAttribute(target, "panose-1", value); - return; - - case "pointerEvents": - pushStringAttribute(target, "pointer-events", value); - return; - - case "renderingIntent": - pushStringAttribute(target, "rendering-intent", value); - return; - - case "shapeRendering": - pushStringAttribute(target, "shape-rendering", value); - return; - - case "stopColor": - pushStringAttribute(target, "stop-color", value); - return; - - case "stopOpacity": - pushStringAttribute(target, "stop-opacity", value); - return; - - case "strikethroughPosition": - pushStringAttribute(target, "strikethrough-position", value); - return; - - case "strikethroughThickness": - pushStringAttribute(target, "strikethrough-thickness", value); - return; - - case "strokeDasharray": - pushStringAttribute(target, "stroke-dasharray", value); - return; - - case "strokeDashoffset": - pushStringAttribute(target, "stroke-dashoffset", value); - return; - - case "strokeLinecap": - pushStringAttribute(target, "stroke-linecap", value); - return; - - case "strokeLinejoin": - pushStringAttribute(target, "stroke-linejoin", value); - return; - - case "strokeMiterlimit": - pushStringAttribute(target, "stroke-miterlimit", value); - return; - - case "strokeOpacity": - pushStringAttribute(target, "stroke-opacity", value); - return; - - case "strokeWidth": - pushStringAttribute(target, "stroke-width", value); - return; - - case "textAnchor": - pushStringAttribute(target, "text-anchor", value); - return; - - case "textDecoration": - pushStringAttribute(target, "text-decoration", value); - return; - - case "textRendering": - pushStringAttribute(target, "text-rendering", value); - return; - - case "transformOrigin": - pushStringAttribute(target, "transform-origin", value); - return; - - case "underlinePosition": - pushStringAttribute(target, "underline-position", value); - return; - - case "underlineThickness": - pushStringAttribute(target, "underline-thickness", value); - return; - - case "unicodeBidi": - pushStringAttribute(target, "unicode-bidi", value); - return; - - case "unicodeRange": - pushStringAttribute(target, "unicode-range", value); - return; - - case "unitsPerEm": - pushStringAttribute(target, "units-per-em", value); - return; - - case "vAlphabetic": - pushStringAttribute(target, "v-alphabetic", value); - return; - - case "vHanging": - pushStringAttribute(target, "v-hanging", value); - return; - - case "vIdeographic": - pushStringAttribute(target, "v-ideographic", value); - return; - - case "vMathematical": - pushStringAttribute(target, "v-mathematical", value); - return; - - case "vectorEffect": - pushStringAttribute(target, "vector-effect", value); - return; - - case "vertAdvY": - pushStringAttribute(target, "vert-adv-y", value); - return; - - case "vertOriginX": - pushStringAttribute(target, "vert-origin-x", value); - return; - - case "vertOriginY": - pushStringAttribute(target, "vert-origin-y", value); - return; - - case "wordSpacing": - pushStringAttribute(target, "word-spacing", value); - return; - - case "writingMode": - pushStringAttribute(target, "writing-mode", value); - return; - - case "xmlnsXlink": - pushStringAttribute(target, "xmlns:xlink", value); - return; - - case "xHeight": - pushStringAttribute(target, "x-height", value); - return; case "xlinkActuate": pushStringAttribute(target, "xlink:actuate", value); - break; + return; case "xlinkArcrole": pushStringAttribute(target, "xlink:arcrole", value); - break; + return; case "xlinkRole": pushStringAttribute(target, "xlink:role", value); - break; + return; case "xlinkShow": pushStringAttribute(target, "xlink:show", value); - break; + return; case "xlinkTitle": pushStringAttribute(target, "xlink:title", value); - break; + return; case "xlinkType": pushStringAttribute(target, "xlink:type", value); - break; + return; case "xmlBase": pushStringAttribute(target, "xml:base", value); - break; + return; case "xmlLang": pushStringAttribute(target, "xml:lang", value); - break; + return; case "xmlSpace": pushStringAttribute(target, "xml:space", value); - break; + return; default: if ( @@ -3342,7 +3118,9 @@ function pushAttribute(target, name, value) { return; } - if (isAttributeNameSafe(name)) { + var attributeName = getAttributeAlias(name); + + if (isAttributeNameSafe(attributeName)) { // shouldRemoveAttribute switch (typeof value) { case "function": @@ -3351,7 +3129,7 @@ function pushAttribute(target, name, value) { return; case "boolean": { - var prefix = name.toLowerCase().slice(0, 5); + var prefix = attributeName.toLowerCase().slice(0, 5); if (prefix !== "data-" && prefix !== "aria-") { return; @@ -3361,7 +3139,7 @@ function pushAttribute(target, name, value) { target.push( attributeSeparator, - stringToChunk(name), + stringToChunk(attributeName), attributeAssign, stringToChunk(escapeTextForBrowser(value)), attributeEnd @@ -5087,7 +4865,18 @@ function pushStartInstance( } switch (type) { + case "div": + case "span": + case "svg": + case "path": + case "a": + case "g": + case "p": + case "li": + // Fast track very common tags + break; // Special tags + case "select": return pushStartSelect(target, props); @@ -5207,15 +4996,14 @@ function pushStartInstance( } default: { - if (type.indexOf("-") === -1) { - // Generic element - return pushStartGenericElement(target, props, type); - } else { + if (type.indexOf("-") !== -1) { // Custom element return pushStartCustomElement(target, props, type); } } - } + } // Generic element + + return pushStartGenericElement(target, props, type); } var endTag1 = stringToPrecomputedChunk(""); diff --git a/compiled/facebook-www/ReactDOMServer-prod.classic.js b/compiled/facebook-www/ReactDOMServer-prod.classic.js index cb280ebb3828e..d00c32d8e9560 100644 --- a/compiled/facebook-www/ReactDOMServer-prod.classic.js +++ b/compiled/facebook-www/ReactDOMServer-prod.classic.js @@ -52,7 +52,92 @@ function isAttributeNameSafe(attributeName) { illegalAttributeNameCache[attributeName] = !0; return !1; } -var matchHtmlRegExp = /["'&<>]/; +var unitlessNumbers = new Set( + "animationIterationCount aspectRatio borderImageOutset borderImageSlice borderImageWidth boxFlex boxFlexGroup boxOrdinalGroup columnCount columns flex flexGrow flexPositive flexShrink flexNegative flexOrder gridArea gridRow gridRowEnd gridRowSpan gridRowStart gridColumn gridColumnEnd gridColumnSpan gridColumnStart fontWeight lineClamp lineHeight opacity order orphans scale tabSize widows zIndex zoom fillOpacity floodOpacity stopOpacity strokeDasharray strokeDashoffset strokeMiterlimit strokeOpacity strokeWidth MozAnimationIterationCount MozBoxFlex MozBoxFlexGroup MozLineClamp msAnimationIterationCount msFlex msZoom msFlexGrow msFlexNegative msFlexOrder msFlexPositive msFlexShrink msGridColumn msGridColumnSpan msGridRow msGridRowSpan WebkitAnimationIterationCount WebkitBoxFlex WebKitBoxFlexGroup WebkitBoxOrdinalGroup WebkitColumnCount WebkitColumns WebkitFlex WebkitFlexGrow WebkitFlexPositive WebkitFlexShrink WebkitLineClamp".split( + " " + ) + ), + aliases = new Map([ + ["acceptCharset", "accept-charset"], + ["htmlFor", "for"], + ["httpEquiv", "http-equiv"], + ["crossOrigin", "crossorigin"], + ["accentHeight", "accent-height"], + ["alignmentBaseline", "alignment-baseline"], + ["arabicForm", "arabic-form"], + ["baselineShift", "baseline-shift"], + ["capHeight", "cap-height"], + ["clipPath", "clip-path"], + ["clipRule", "clip-rule"], + ["colorInterpolation", "color-interpolation"], + ["colorInterpolationFilters", "color-interpolation-filters"], + ["colorProfile", "color-profile"], + ["colorRendering", "color-rendering"], + ["dominantBaseline", "dominant-baseline"], + ["enableBackground", "enable-background"], + ["fillOpacity", "fill-opacity"], + ["fillRule", "fill-rule"], + ["floodColor", "flood-color"], + ["floodOpacity", "flood-opacity"], + ["fontFamily", "font-family"], + ["fontSize", "font-size"], + ["fontSizeAdjust", "font-size-adjust"], + ["fontStretch", "font-stretch"], + ["fontStyle", "font-style"], + ["fontVariant", "font-variant"], + ["fontWeight", "font-weight"], + ["glyphName", "glyph-name"], + ["glyphOrientationHorizontal", "glyph-orientation-horizontal"], + ["glyphOrientationVertical", "glyph-orientation-vertical"], + ["horizAdvX", "horiz-adv-x"], + ["horizOriginX", "horiz-origin-x"], + ["imageRendering", "image-rendering"], + ["letterSpacing", "letter-spacing"], + ["lightingColor", "lighting-color"], + ["markerEnd", "marker-end"], + ["markerMid", "marker-mid"], + ["markerStart", "marker-start"], + ["overlinePosition", "overline-position"], + ["overlineThickness", "overline-thickness"], + ["paintOrder", "paint-order"], + ["panose-1", "panose-1"], + ["pointerEvents", "pointer-events"], + ["renderingIntent", "rendering-intent"], + ["shapeRendering", "shape-rendering"], + ["stopColor", "stop-color"], + ["stopOpacity", "stop-opacity"], + ["strikethroughPosition", "strikethrough-position"], + ["strikethroughThickness", "strikethrough-thickness"], + ["strokeDasharray", "stroke-dasharray"], + ["strokeDashoffset", "stroke-dashoffset"], + ["strokeLinecap", "stroke-linecap"], + ["strokeLinejoin", "stroke-linejoin"], + ["strokeMiterlimit", "stroke-miterlimit"], + ["strokeOpacity", "stroke-opacity"], + ["strokeWidth", "stroke-width"], + ["textAnchor", "text-anchor"], + ["textDecoration", "text-decoration"], + ["textRendering", "text-rendering"], + ["transformOrigin", "transform-origin"], + ["underlinePosition", "underline-position"], + ["underlineThickness", "underline-thickness"], + ["unicodeBidi", "unicode-bidi"], + ["unicodeRange", "unicode-range"], + ["unitsPerEm", "units-per-em"], + ["vAlphabetic", "v-alphabetic"], + ["vHanging", "v-hanging"], + ["vIdeographic", "v-ideographic"], + ["vMathematical", "v-mathematical"], + ["vectorEffect", "vector-effect"], + ["vertAdvY", "vert-adv-y"], + ["vertOriginX", "vert-origin-x"], + ["vertOriginY", "vert-origin-y"], + ["wordSpacing", "word-spacing"], + ["writingMode", "writing-mode"], + ["xmlnsXlink", "xmlns:xlink"], + ["xHeight", "x-height"] + ]), + matchHtmlRegExp = /["'&<>]/; function escapeTextForBrowser(text) { if ("boolean" === typeof text || "number" === typeof text) return "" + text; text = "" + text; @@ -169,101 +254,22 @@ function pushStyleAttribute(target, style) { if (0 === styleName.indexOf("--")) { var nameChunk = escapeTextForBrowser(styleName); styleValue = escapeTextForBrowser(("" + styleValue).trim()); - } else if ( - ((nameChunk = styleNameCache.get(styleName)), - void 0 === nameChunk && - ((nameChunk = escapeTextForBrowser( - styleName - .replace(uppercasePattern, "-$1") - .toLowerCase() - .replace(msPattern, "-ms-") - )), - styleNameCache.set(styleName, nameChunk)), - "number" === typeof styleValue) - ) { - var JSCompiler_temp; - if ((JSCompiler_temp = 0 !== styleValue)) { - a: switch (styleName) { - case "animationIterationCount": - case "aspectRatio": - case "borderImageOutset": - case "borderImageSlice": - case "borderImageWidth": - case "boxFlex": - case "boxFlexGroup": - case "boxOrdinalGroup": - case "columnCount": - case "columns": - case "flex": - case "flexGrow": - case "flexPositive": - case "flexShrink": - case "flexNegative": - case "flexOrder": - case "gridArea": - case "gridRow": - case "gridRowEnd": - case "gridRowSpan": - case "gridRowStart": - case "gridColumn": - case "gridColumnEnd": - case "gridColumnSpan": - case "gridColumnStart": - case "fontWeight": - case "lineClamp": - case "lineHeight": - case "opacity": - case "order": - case "orphans": - case "scale": - case "tabSize": - case "widows": - case "zIndex": - case "zoom": - case "fillOpacity": - case "floodOpacity": - case "stopOpacity": - case "strokeDasharray": - case "strokeDashoffset": - case "strokeMiterlimit": - case "strokeOpacity": - case "strokeWidth": - case "MozAnimationIterationCount": - case "MozBoxFlex": - case "MozBoxFlexGroup": - case "MozLineClamp": - case "msAnimationIterationCount": - case "msFlex": - case "msZoom": - case "msFlexGrow": - case "msFlexNegative": - case "msFlexOrder": - case "msFlexPositive": - case "msFlexShrink": - case "msGridColumn": - case "msGridColumnSpan": - case "msGridRow": - case "msGridRowSpan": - case "WebkitAnimationIterationCount": - case "WebkitBoxFlex": - case "WebKitBoxFlexGroup": - case "WebkitBoxOrdinalGroup": - case "WebkitColumnCount": - case "WebkitColumns": - case "WebkitFlex": - case "WebkitFlexGrow": - case "WebkitFlexPositive": - case "WebkitFlexShrink": - case "WebkitLineClamp": - JSCompiler_temp = !0; - break a; - default: - JSCompiler_temp = !1; - } - JSCompiler_temp = !JSCompiler_temp; - } - styleValue = JSCompiler_temp ? styleValue + "px" : "" + styleValue; - } else styleValue = escapeTextForBrowser(("" + styleValue).trim()); + } else + (nameChunk = styleNameCache.get(styleName)), + void 0 === nameChunk && + ((nameChunk = escapeTextForBrowser( + styleName + .replace(uppercasePattern, "-$1") + .toLowerCase() + .replace(msPattern, "-ms-") + )), + styleNameCache.set(styleName, nameChunk)), + (styleValue = + "number" === typeof styleValue + ? 0 === styleValue || unitlessNumbers.has(styleName) + ? "" + styleValue + : styleValue + "px" + : escapeTextForBrowser(("" + styleValue).trim())); isFirst ? ((isFirst = !1), target.push(' style="', nameChunk, ":", styleValue)) @@ -286,19 +292,21 @@ function pushStringAttribute(target, name, value) { } function pushAttribute(target, name, value) { switch (name) { - case "style": - pushStyleAttribute(target, value); + case "className": + pushStringAttribute(target, "class", value); break; - case "defaultValue": - case "defaultChecked": - case "innerHTML": - case "suppressContentEditableWarning": - case "suppressHydrationWarning": + case "tabIndex": + pushStringAttribute(target, "tabindex", value); break; - case "autoFocus": - case "multiple": - case "muted": - pushBooleanAttribute(target, name.toLowerCase(), value); + case "dir": + case "role": + case "viewBox": + case "width": + case "height": + pushStringAttribute(target, name, value); + break; + case "style": + pushStyleAttribute(target, value); break; case "src": case "href": @@ -315,6 +323,17 @@ function pushAttribute(target, name, value) { value = sanitizeURL("" + value); target.push(" ", name, '="', escapeTextForBrowser(value), '"'); break; + case "defaultValue": + case "defaultChecked": + case "innerHTML": + case "suppressContentEditableWarning": + case "suppressHydrationWarning": + break; + case "autoFocus": + case "multiple": + case "muted": + pushBooleanAttribute(target, name.toLowerCase(), value); + break; case "xlinkHref": if ( "function" === typeof value || @@ -322,8 +341,8 @@ function pushAttribute(target, name, value) { "boolean" === typeof value ) break; - name = sanitizeURL("" + value); - target.push(" ", "xlink:href", '="', escapeTextForBrowser(name), '"'); + value = sanitizeURL("" + value); + target.push(" ", "xlink:href", '="', escapeTextForBrowser(value), '"'); break; case "contentEditable": case "spellCheck": @@ -390,246 +409,6 @@ function pushAttribute(target, name, value) { isNaN(value) || target.push(" ", name, '="', escapeTextForBrowser(value), '"'); break; - case "acceptCharset": - pushStringAttribute(target, "accept-charset", value); - break; - case "className": - pushStringAttribute(target, "class", value); - break; - case "htmlFor": - pushStringAttribute(target, "for", value); - break; - case "httpEquiv": - pushStringAttribute(target, "http-equiv", value); - break; - case "tabIndex": - pushStringAttribute(target, "tabindex", value); - break; - case "crossOrigin": - pushStringAttribute(target, "crossorigin", value); - break; - case "accentHeight": - pushStringAttribute(target, "accent-height", value); - break; - case "alignmentBaseline": - pushStringAttribute(target, "alignment-baseline", value); - break; - case "arabicForm": - pushStringAttribute(target, "arabic-form", value); - break; - case "baselineShift": - pushStringAttribute(target, "baseline-shift", value); - break; - case "capHeight": - pushStringAttribute(target, "cap-height", value); - break; - case "clipPath": - pushStringAttribute(target, "clip-path", value); - break; - case "clipRule": - pushStringAttribute(target, "clip-rule", value); - break; - case "colorInterpolation": - pushStringAttribute(target, "color-interpolation", value); - break; - case "colorInterpolationFilters": - pushStringAttribute(target, "color-interpolation-filters", value); - break; - case "colorProfile": - pushStringAttribute(target, "color-profile", value); - break; - case "colorRendering": - pushStringAttribute(target, "color-rendering", value); - break; - case "dominantBaseline": - pushStringAttribute(target, "dominant-baseline", value); - break; - case "enableBackground": - pushStringAttribute(target, "enable-background", value); - break; - case "fillOpacity": - pushStringAttribute(target, "fill-opacity", value); - break; - case "fillRule": - pushStringAttribute(target, "fill-rule", value); - break; - case "floodColor": - pushStringAttribute(target, "flood-color", value); - break; - case "floodOpacity": - pushStringAttribute(target, "flood-opacity", value); - break; - case "fontFamily": - pushStringAttribute(target, "font-family", value); - break; - case "fontSize": - pushStringAttribute(target, "font-size", value); - break; - case "fontSizeAdjust": - pushStringAttribute(target, "font-size-adjust", value); - break; - case "fontStretch": - pushStringAttribute(target, "font-stretch", value); - break; - case "fontStyle": - pushStringAttribute(target, "font-style", value); - break; - case "fontVariant": - pushStringAttribute(target, "font-variant", value); - break; - case "fontWeight": - pushStringAttribute(target, "font-weight", value); - break; - case "glyphName": - pushStringAttribute(target, "glyph-name", value); - break; - case "glyphOrientationHorizontal": - pushStringAttribute(target, "glyph-orientation-horizontal", value); - break; - case "glyphOrientationVertical": - pushStringAttribute(target, "glyph-orientation-vertical", value); - break; - case "horizAdvX": - pushStringAttribute(target, "horiz-adv-x", value); - break; - case "horizOriginX": - pushStringAttribute(target, "horiz-origin-x", value); - break; - case "imageRendering": - pushStringAttribute(target, "image-rendering", value); - break; - case "letterSpacing": - pushStringAttribute(target, "letter-spacing", value); - break; - case "lightingColor": - pushStringAttribute(target, "lighting-color", value); - break; - case "markerEnd": - pushStringAttribute(target, "marker-end", value); - break; - case "markerMid": - pushStringAttribute(target, "marker-mid", value); - break; - case "markerStart": - pushStringAttribute(target, "marker-start", value); - break; - case "overlinePosition": - pushStringAttribute(target, "overline-position", value); - break; - case "overlineThickness": - pushStringAttribute(target, "overline-thickness", value); - break; - case "paintOrder": - pushStringAttribute(target, "paint-order", value); - break; - case "panose-1": - pushStringAttribute(target, "panose-1", value); - break; - case "pointerEvents": - pushStringAttribute(target, "pointer-events", value); - break; - case "renderingIntent": - pushStringAttribute(target, "rendering-intent", value); - break; - case "shapeRendering": - pushStringAttribute(target, "shape-rendering", value); - break; - case "stopColor": - pushStringAttribute(target, "stop-color", value); - break; - case "stopOpacity": - pushStringAttribute(target, "stop-opacity", value); - break; - case "strikethroughPosition": - pushStringAttribute(target, "strikethrough-position", value); - break; - case "strikethroughThickness": - pushStringAttribute(target, "strikethrough-thickness", value); - break; - case "strokeDasharray": - pushStringAttribute(target, "stroke-dasharray", value); - break; - case "strokeDashoffset": - pushStringAttribute(target, "stroke-dashoffset", value); - break; - case "strokeLinecap": - pushStringAttribute(target, "stroke-linecap", value); - break; - case "strokeLinejoin": - pushStringAttribute(target, "stroke-linejoin", value); - break; - case "strokeMiterlimit": - pushStringAttribute(target, "stroke-miterlimit", value); - break; - case "strokeOpacity": - pushStringAttribute(target, "stroke-opacity", value); - break; - case "strokeWidth": - pushStringAttribute(target, "stroke-width", value); - break; - case "textAnchor": - pushStringAttribute(target, "text-anchor", value); - break; - case "textDecoration": - pushStringAttribute(target, "text-decoration", value); - break; - case "textRendering": - pushStringAttribute(target, "text-rendering", value); - break; - case "transformOrigin": - pushStringAttribute(target, "transform-origin", value); - break; - case "underlinePosition": - pushStringAttribute(target, "underline-position", value); - break; - case "underlineThickness": - pushStringAttribute(target, "underline-thickness", value); - break; - case "unicodeBidi": - pushStringAttribute(target, "unicode-bidi", value); - break; - case "unicodeRange": - pushStringAttribute(target, "unicode-range", value); - break; - case "unitsPerEm": - pushStringAttribute(target, "units-per-em", value); - break; - case "vAlphabetic": - pushStringAttribute(target, "v-alphabetic", value); - break; - case "vHanging": - pushStringAttribute(target, "v-hanging", value); - break; - case "vIdeographic": - pushStringAttribute(target, "v-ideographic", value); - break; - case "vMathematical": - pushStringAttribute(target, "v-mathematical", value); - break; - case "vectorEffect": - pushStringAttribute(target, "vector-effect", value); - break; - case "vertAdvY": - pushStringAttribute(target, "vert-adv-y", value); - break; - case "vertOriginX": - pushStringAttribute(target, "vert-origin-x", value); - break; - case "vertOriginY": - pushStringAttribute(target, "vert-origin-y", value); - break; - case "wordSpacing": - pushStringAttribute(target, "word-spacing", value); - break; - case "writingMode": - pushStringAttribute(target, "writing-mode", value); - break; - case "xmlnsXlink": - pushStringAttribute(target, "xmlns:xlink", value); - break; - case "xHeight": - pushStringAttribute(target, "x-height", value); - break; case "xlinkActuate": pushStringAttribute(target, "xlink:actuate", value); break; @@ -659,21 +438,21 @@ function pushAttribute(target, name, value) { break; default: if ( - (!(2 < name.length) || - ("o" !== name[0] && "O" !== name[0]) || - ("n" !== name[1] && "N" !== name[1])) && - isAttributeNameSafe(name) - ) { - switch (typeof value) { - case "function": - case "symbol": - return; - case "boolean": - var prefix = name.toLowerCase().slice(0, 5); - if ("data-" !== prefix && "aria-" !== prefix) return; + !(2 < name.length) || + ("o" !== name[0] && "O" !== name[0]) || + ("n" !== name[1] && "N" !== name[1]) + ) + if (((name = aliases.get(name) || name), isAttributeNameSafe(name))) { + switch (typeof value) { + case "function": + case "symbol": + return; + case "boolean": + var prefix = name.toLowerCase().slice(0, 5); + if ("data-" !== prefix && "aria-" !== prefix) return; + } + target.push(" ", name, '="', escapeTextForBrowser(value), '"'); } - target.push(" ", name, '="', escapeTextForBrowser(value), '"'); - } } } function pushInnerHTML(target, innerHTML, children) { @@ -920,6 +699,15 @@ function pushStartInstance( textEmbedded ) { switch (type) { + case "div": + case "span": + case "svg": + case "path": + case "a": + case "g": + case "p": + case "li": + break; case "select": target.push(startChunkForTag("select")); resources = textEmbedded = null; @@ -1328,7 +1116,7 @@ function pushStartInstance( case "font-face-format": case "font-face-name": case "missing-glyph": - return pushStartGenericElement(target, props, type); + break; case "head": return ( 2 > formatContext.insertionMode && null === responseState.headChunks @@ -1354,59 +1142,60 @@ function pushStartInstance( target ); default: - if (-1 === type.indexOf("-")) - return pushStartGenericElement(target, props, type); - target.push(startChunkForTag(type)); - resources = textEmbedded = null; - for (var propKey$jscomp$3 in props) - if ( - hasOwnProperty.call(props, propKey$jscomp$3) && - ((propValue = props[propKey$jscomp$3]), - !( - null == propValue || - (enableCustomElementPropertySupport && - ("function" === typeof propValue || - "object" === typeof propValue)) || - (enableCustomElementPropertySupport && !1 === propValue) - )) - ) - switch ( - (enableCustomElementPropertySupport && - !0 === propValue && - (propValue = ""), - enableCustomElementPropertySupport && - "className" === propKey$jscomp$3 && - (propKey$jscomp$3 = "class"), - propKey$jscomp$3) - ) { - case "children": - textEmbedded = propValue; - break; - case "dangerouslySetInnerHTML": - resources = propValue; - break; - case "style": - pushStyleAttribute(target, propValue); - break; - case "suppressContentEditableWarning": - case "suppressHydrationWarning": - break; - default: - isAttributeNameSafe(propKey$jscomp$3) && - "function" !== typeof propValue && - "symbol" !== typeof propValue && - target.push( - " ", - propKey$jscomp$3, - '="', - escapeTextForBrowser(propValue), - '"' - ); - } - target.push(">"); - pushInnerHTML(target, resources, textEmbedded); - return textEmbedded; + if (-1 !== type.indexOf("-")) { + target.push(startChunkForTag(type)); + resources = textEmbedded = null; + for (var propKey$jscomp$3 in props) + if ( + hasOwnProperty.call(props, propKey$jscomp$3) && + ((propValue = props[propKey$jscomp$3]), + !( + null == propValue || + (enableCustomElementPropertySupport && + ("function" === typeof propValue || + "object" === typeof propValue)) || + (enableCustomElementPropertySupport && !1 === propValue) + )) + ) + switch ( + (enableCustomElementPropertySupport && + !0 === propValue && + (propValue = ""), + enableCustomElementPropertySupport && + "className" === propKey$jscomp$3 && + (propKey$jscomp$3 = "class"), + propKey$jscomp$3) + ) { + case "children": + textEmbedded = propValue; + break; + case "dangerouslySetInnerHTML": + resources = propValue; + break; + case "style": + pushStyleAttribute(target, propValue); + break; + case "suppressContentEditableWarning": + case "suppressHydrationWarning": + break; + default: + isAttributeNameSafe(propKey$jscomp$3) && + "function" !== typeof propValue && + "symbol" !== typeof propValue && + target.push( + " ", + propKey$jscomp$3, + '="', + escapeTextForBrowser(propValue), + '"' + ); + } + target.push(">"); + pushInnerHTML(target, resources, textEmbedded); + return textEmbedded; + } } + return pushStartGenericElement(target, props, type); } function writeStartPendingSuspenseBoundary(destination, responseState, id) { destination.push('\x3c!--$?--\x3e