@lwc/template-compiler 7.0.2 → 7.0.3-alpha.0

package/dist/index.cjs.js

@@ -12961,15 +12961,15 @@ function parseStyleText(cssText) {
     }
     return styleMap;
 }
-const IMPORTANT_FLAG = /\s*!\s*important\s*$/i;
 // Given a map of CSS property keys to values, return an array AST like:
 // ['color', 'blue', false]    // { color: 'blue' }
 // ['background', 'red', true] // { background: 'red !important' }
 function styleMapToStyleDeclsAST(styleMap) {
     const styles = Object.entries(styleMap).map(([key, value]) => {
-        const important = IMPORTANT_FLAG.test(value);
+        const important = value.endsWith('!important');
         if (important) {
-            value = value.replace(IMPORTANT_FLAG, '').trim();
+            // trim off the trailing "!important" (10 chars)
+            value = value.substring(0, value.length - 10).trim();
         }
         return [key, value, important];
     });
@@ -13010,6 +13010,9 @@ function isStaticNode(node, apiVersion) {
     result &&= attributes.every(({ name, value }) => {
         const isStaticSafeLiteral = isLiteral(value) &&
             name !== 'slot' &&
+            // check for ScopedId
+            name !== 'id' &&
+            !isIdReferencingAttribute(name) &&
             // svg href needs sanitization.
             !isSvgUseHref(nodeName, name, namespace) &&
             // Check for ScopedFragId
@@ -13158,7 +13161,7 @@ function serializeAttrs(element, codeGen) {
      */
     const attrs = [];
     let hasClassAttr = false;
-    const collector = ({ name, value, hasExpression, isIdOrIdRef, }) => {
+    const collector = ({ name, value, hasExpression, }) => {
         let v = typeof value === 'string' ? templateStringEscape(value) : value;
         if (name === 'class') {
             hasClassAttr = true;
@@ -13179,15 +13182,9 @@ function serializeAttrs(element, codeGen) {
             v = String(v.toLowerCase() !== 'false');
         }
         if (typeof v === 'string') {
-            // IDs/IDRefs must be handled dynamically at runtime due to synthetic shadow scoping.
-            // Skip serializing here and handle it as if it were a dynamic attribute instead.
-            // Note that, to maintain backwards compatibility with the non-static output, we treat the valueless
-            // "boolean" format (e.g. `<div id>`) as the empty string, which is semantically equivalent.
-            // TODO [#3658]: `disableSyntheticShadowSupport` should also disable this dynamic behavior
-            const needsPlaceholder = hasExpression || isIdOrIdRef;
             // Inject a placeholder where the staticPartId will go when an expression occurs.
             // This is only needed for SSR to inject the expression value during serialization.
-            attrs.push(needsPlaceholder ? `\${"${v}"}` : ` ${name}="${shared.htmlEscape(v, true)}"`);
+            attrs.push(hasExpression ? `\${"${v}"}` : ` ${name}="${shared.htmlEscape(v, true)}"`);
         }
         else {
             attrs.push(` ${name}`);
@@ -13195,20 +13192,13 @@ function serializeAttrs(element, codeGen) {
     };
     element.attributes
         .map((attr) => {
-        const { name, value } = attr;
-        const hasExpression = isExpression$1(value);
-        // IDs/IDRefs must be handled dynamically at runtime due to synthetic shadow scoping.
-        // Note that for backwards compat we only consider non-booleans to be dynamic IDs/IDRefs
-        // TODO [#3658]: `disableSyntheticShadowSupport` should also disable this dynamic behavior
-        const isIdOrIdRef = (name === 'id' || isIdReferencingAttribute(name)) &&
-            (isExpression$1(value) || isStringLiteral(value));
+        const hasExpression = isExpression$1(attr.value);
         return {
             hasExpression,
-            isIdOrIdRef,
-            name,
-            value: hasExpression || isIdOrIdRef
+            name: attr.name,
+            value: hasExpression
                 ? codeGen.getStaticExpressionToken(attr)
-                : value.value,
+                : attr.value.value,
         };
     })
         .forEach(collector);
@@ -13621,7 +13611,7 @@ class CodeGen {
     }
     genClassExpression(value) {
         let classExpression = this.bindExpression(value);
-        const isClassNameObjectBindingEnabled = shared.isAPIFeatureEnabled(10 /* APIFeature.TEMPLATE_CLASS_NAME_OBJECT_BINDING */, this.state.config.apiVersion);
+        const isClassNameObjectBindingEnabled = shared.isAPIFeatureEnabled(11 /* APIFeature.TEMPLATE_CLASS_NAME_OBJECT_BINDING */, this.state.config.apiVersion);
         if (isClassNameObjectBindingEnabled) {
             classExpression = this.genNormalizeClassName(classExpression);
         }
@@ -13911,12 +13901,7 @@ class CodeGen {
                 const attributeExpressions = [];
                 for (const attribute of elm.attributes) {
                     const { name, value } = attribute;
-                    // IDs/IDRefs must be handled dynamically at runtime due to synthetic shadow scoping.
-                    // Note that for backwards compat we only consider non-booleans to be dynamic IDs/IDRefs
-                    // TODO [#3658]: `disableSyntheticShadowSupport` should also disable this dynamic behavior
-                    const isIdOrIdRef = (name === 'id' || isIdReferencingAttribute(name)) &&
-                        (isExpression$1(value) || isStringLiteral(value));
-                    if (isExpression$1(value) || isIdOrIdRef) {
+                    if (isExpression$1(value)) {
                         let partToken = '';
                         if (name === 'style') {
                             partToken = `${"s" /* STATIC_PART_TOKEN_ID.STYLE */}${partId}`;
@@ -13927,7 +13912,6 @@ class CodeGen {
                             databag.push(property$1(identifier('className'), this.genClassExpression(value)));
                         }
                         else {
-                            // non-class, non-style (i.e. generic attribute or ID/IDRef)
                             partToken = `${"a" /* STATIC_PART_TOKEN_ID.ATTRIBUTE */}${partId}:${name}`;
                             attributeExpressions.push(property$1(literal$1(name), bindAttributeExpression(attribute, elm, this, false)));
                         }
@@ -14696,5 +14680,5 @@ exports.default = compile;
 exports.kebabcaseToCamelcase = kebabcaseToCamelcase;
 exports.parse = parse;
 exports.toPropertyName = toPropertyName;
-/** version: 7.0.2 */
+/** version: 7.0.0 */
 //# sourceMappingURL=index.cjs.js.map