hybrids - npm Package Compare versions

Comparing version 8.0.9 to 8.0.10

docs/CHANGELOG.md

@@ -5,2 +5,12 @@ # Changelog
 
+### [8.0.10](https://github.com/hybridsjs/hybrids/compare/v8.0.9...v8.0.10) (2022-07-15)
+
+
+### Bug Fixes
+
+* **html:** apend style element in nested templates ([f8135f6](https://github.com/hybridsjs/hybrids/commit/f8135f6001a72ee4f1ae03c2a4b4bfff67f9865b))
+* **localize:** clean up whitespace inside of the text ([84ef932](https://github.com/hybridsjs/hybrids/commit/84ef932bd13d07b997c0b6bab574ffd2019c139a))
+* **localize:** detect is localize enabled, reordered expressions in message ([7b5db37](https://github.com/hybridsjs/hybrids/commit/7b5db372ee999faafab9e8f9eb8c63436c0fc963))
+* **localize:** simplify exclude strings regexp ([eb39de8](https://github.com/hybridsjs/hybrids/commit/eb39de826929f43ed4ed0260672384887a3de4fe))
+
 ### [8.0.9](https://github.com/hybridsjs/hybrids/compare/v8.0.8...v8.0.9) (2022-07-08)
@@ -7,0 +17,0 @@

package.json

 {
   "name": "hybrids",
-  "version": "8.0.9",
+  "version": "8.0.10",
   "description": "A JavaScript framework for creating fully-featured web applications, components libraries, and single web components with unique declarative and functional architecture",
@@ -5,0 +5,0 @@ "type": "module",

scripts/extract.js

@@ -43,6 +43,10 @@ import sax from "./sax.js";
 
-const REGEXP_ONLY_EXPRESSIONS = /^[${}0-9 \t\n\f\r]+$/;
+const REGEXP_ONLY_EXPRESSIONS = /^[^A-Za-z]+$/;
 const REGEXP_WHITESPACE = /^\s*$/;
 const DISABLED_TAGS = ["script", "style"];
 
+function clean(text) {
+  return text && text.trim().replace(/\s+/g, " ");
+}
+
 function getMessages(template, strict) {
@@ -53,5 +57,5 @@ if (strict) {
       {
-        key: `${key.trim()}${context ? ` | ${context}` : ""}`,
-        message: key.trim(),
-        description: description && description.trim(),
+        key: `${clean(key)}${context ? ` | ${context}` : ""}`,
+        message: clean(key),
+        description: description && clean(description),
       },
@@ -79,3 +83,3 @@ ];
         let offset = 0;
-        let key = text.trim().replace(/\${(\d+)}/g, () => `\${${offset++}}`);
+        let key = clean(text).replace(/\${(\d+)}/g, () => `\${${offset++}}`);
         const m = {
@@ -88,4 +92,6 @@ key,
           const [description, context] = prevChild.text.split("|");
-          m.key = `${m.key.trim()}${context ? ` | ${context.trim()}` : ""}`;
-          m.description = description.trim();
+          m.key = `${m.key}${context ? ` | ${clean(context)}` : ""}`;
+          if (description.trim()) {
+            m.description = clean(description);
+          }
         }
@@ -92,0 +98,0 @@

src/localize.js

@@ -29,2 +29,6 @@ import { compileTemplate } from "./template/core.js";
 
+export function isLocalizeEnabled() {
+  return translate !== null || dictionary.size;
+}
+
 export function clear() {
@@ -31,0 +35,0 @@ languages.delete("default");

src/template/core.js

 import global from "../global.js";
 import { stringifyElement, probablyDevMode } from "../utils.js";
-import { get as getMessage } from "../localize.js";
+import { get as getMessage, isLocalizeEnabled } from "../localize.js";
 
-import { getMeta, getPlaceholder, removeTemplate } from "./utils.js";
+import {
+  getMeta,
+  getPlaceholder,
+  getTemplateEnd,
+  removeTemplate,
+} from "./utils.js";
 
@@ -13,3 +18,3 @@ import resolveValue from "./resolvers/value.js";
 const PLACEHOLDER_REGEXP_ALL = new RegExp(PLACEHOLDER_REGEXP_TEXT, "g");
-const PLACEHOLDER_REGEXP_ONLY = /^[${}0-9 \t\n\f\r]+$/;
+const PLACEHOLDER_REGEXP_ONLY = /^[^A-Za-z]+$/;
 
@@ -111,5 +116,3 @@ function createSignature(parts) {
 function setupStyleUpdater(target) {
-  const hasAdoptedStyleSheets = !!target.adoptedStyleSheets;
-
-  if (hasAdoptedStyleSheets) {
+  if (target.adoptedStyleSheets) {
     let prevStyleSheets;
@@ -154,3 +157,8 @@ return (styleSheets) => {
         styleEl = global.document.createElement("style");
-        target.appendChild(styleEl);
+        target = getTemplateEnd(target);
+        if (target.nodeType === global.Node.TEXT_NODE) {
+          target.parentNode.insertBefore(styleEl, target.nextSibling);
+        } else {
+          target.appendChild(styleEl);
+        }
       }
@@ -163,3 +171,3 @@ const result = [...styleSheets].join("\n/*------*/\n");
     } else if (styleEl) {
-      target.removeChild(styleEl);
+      styleEl.parentNode.removeChild(styleEl);
       styleEl = null;
@@ -172,3 +180,3 @@ }
   const template = global.document.createElement("template");
-  const parts = [];
+  const parts = {};
 
@@ -219,14 +227,19 @@ const signature = isMsg ? rawParts : createSignature(rawParts);
       } else {
-        if (!isMsg && !noTranslate && !text.match(/^\s*$/)) {
-          let offset = -1;
+        if (
+          isLocalizeEnabled() &&
+          !isMsg &&
+          !noTranslate &&
+          !text.match(/^\s*$/)
+        ) {
+          let offset;
           const key = text.trim();
-          const compiledKey = key.replace(
-            PLACEHOLDER_REGEXP_ALL,
-            (_, index) => {
-              if (offset === -1) offset = Number(index);
-              return `\${${Number(index) - offset}}`;
-            },
-          );
+          const localizedKey = key
+            .replace(/\s+/g, " ")
+            .replace(PLACEHOLDER_REGEXP_ALL, (_, index) => {
+              index = Number(index);
+              if (offset === undefined) offset = index;
+              return `\${${index - offset}}`;
+            });
 
-          if (!compiledKey.match(PLACEHOLDER_REGEXP_ONLY)) {
+          if (!localizedKey.match(PLACEHOLDER_REGEXP_ONLY)) {
             let context =
@@ -240,10 +253,13 @@ node.previousSibling &&
               compileIndex -= 1;
-              context = (context.textContent.split("|")[1] || "").trim();
+              context = (context.textContent.split("|")[1] || "")
+                .trim()
+                .replace(/\s+/g, " ");
             }
 
-            const value = getMessage(compiledKey, context).replace(
+            const resultKey = getMessage(localizedKey, context).replace(
               /\${(\d+)}/g,
               (_, index) => getPlaceholder(Number(index) + offset),
             );
-            text = text.replace(key, value);
+
+            text = text.replace(key, resultKey);
             node.textContent = text;
@@ -380,2 +396,4 @@ }
 
+  const partsKeys = Object.keys(parts);
+
   return function updateTemplateInstance(host, target, args, styleSheets) {
@@ -387,7 +405,7 @@ let meta = getMeta(target);
       const renderWalker = createWalker(fragment);
-      const clonedParts = parts.slice(0);
       const markers = [];
 
       let renderIndex = 0;
-      let currentPart = clonedParts.shift();
+      let keyIndex = 0;
+      let currentPart = parts[partsKeys[keyIndex]];
 
@@ -398,4 +416,9 @@ while (renderWalker.nextNode()) {
         while (currentPart && currentPart[0] === renderIndex) {
-          markers.push([node, currentPart[1]]);
-          currentPart = clonedParts.shift();
+          markers.push({
+            index: partsKeys[keyIndex],
+            node,
+            fn: currentPart[1],
+          });
+          keyIndex += 1;
+          currentPart = parts[partsKeys[keyIndex]];
         }
@@ -433,16 +456,11 @@
 
-    const prevArgs = meta.prevArgs;
-    meta.prevArgs = args;
+    meta.markers.forEach((marker) => {
+      const value = args[marker.index];
+      const prevValue = meta.prevArgs && meta.prevArgs[marker.index];
 
-    for (let index = 0; index < meta.markers.length; index += 1) {
-      const value = args[index];
-      const prevValue = prevArgs && prevArgs[index];
-
       // eslint-disable-next-line no-continue
-      if (prevArgs && value === prevValue) continue;
+      if (meta.prevArgs && value === prevValue) return;
 
-      const [node, marker] = meta.markers[index];
-
       try {
-        marker(host, node, value, prevValue);
+        marker.fn(host, marker.node, value, prevValue);
       } catch (error) {
@@ -453,3 +471,3 @@ // eslint-disable-next-line no-console
             host,
-          )}\n${beautifyTemplateLog(signature, index)}`,
+          )}\n${beautifyTemplateLog(signature, marker.index)}`,
         );
@@ -459,4 +477,6 @@
       }
-    }
+    });
+
+    meta.prevArgs = args;
   };
 }

No alert changes

Improved metrics

Total package byte prevSize

418868

increased by0.33%

Lines of code

6327

increased by0.44%

No dependency changes