jsxte - npm Package Compare versions

Comparing version 3.1.3 to 3.1.4

CHANGELOG.md

@@ -0,1 +1,9 @@
+## 3.1.4 (September 16, 2023)
+
+### Bug Fixes
+
+- #### fix: self closing tags ([#203](https://github.com/ncpa0/jsxte/pull/203))
+
+  Fixed the issue with the html renderer always producing a separate closing tag, even in cases where the tag could be self closing.
+
 ## 3.1.3 (September 5, 2023)
@@ -2,0 +10,0 @@

dist/legacy/html-parser/jsx-elem-to-html.js

@@ -30,2 +30,3 @@ "use strict";
 var import_join = require("../utilities/join.js");
+var import_self_closing_tag_list = require("../utilities/self-closing-tag-list.js");
 var import_attribute_to_html_tag_string = require("./attribute-to-html-tag-string.js");
@@ -108,2 +109,3 @@ var import_get_html_struct = require("./get-html-struct.js");
     } else {
+      const isSelfClosingTag = htmlStruct.children.length === 0 && import_self_closing_tag_list.SELF_CLOSING_TAG_LIST.includes(htmlStruct.tag);
       const inlineTag = htmlStruct.children.length === 0 || htmlStruct.children.every(isTextNode);
@@ -115,3 +117,7 @@ const indentPadding = " ".repeat(currentIndent);
       );
-      const startTag = `${indentPadding}<${htmlStruct.tag}` + (attrString.length ? " " : "") + (0, import_join.join)((0, import_attribute_to_html_tag_string.mapAttributesToHtmlTagString)(htmlStruct.attributes), " ") + ">";
+      const separator = attrString.length ? " " : "";
+      if (isSelfClosingTag) {
+        return `${indentPadding}<${htmlStruct.tag}` + separator + (0, import_join.join)((0, import_attribute_to_html_tag_string.mapAttributesToHtmlTagString)(htmlStruct.attributes), " ") + separator + "/>";
+      }
+      const startTag = `${indentPadding}<${htmlStruct.tag}` + separator + (0, import_join.join)((0, import_attribute_to_html_tag_string.mapAttributesToHtmlTagString)(htmlStruct.attributes), " ") + ">";
       const endTag = `${inlineTag ? "" : indentPadding}</${htmlStruct.tag}>`;
@@ -196,2 +202,3 @@ const children = [];
     } else {
+      const isSelfClosingTag = htmlStruct.children.length === 0 && import_self_closing_tag_list.SELF_CLOSING_TAG_LIST.includes(htmlStruct.tag);
       const inlineTag = htmlStruct.children.length === 0 || htmlStruct.children.every(isTextNode);
@@ -203,3 +210,7 @@ const indentPadding = " ".repeat(currentIndent);
       );
-      const startTag = `${indentPadding}<${htmlStruct.tag}` + (attrString.length ? " " : "") + attrString + ">";
+      const separator = attrString.length ? " " : "";
+      if (isSelfClosingTag) {
+        return `${indentPadding}<${htmlStruct.tag}` + separator + (0, import_join.join)((0, import_attribute_to_html_tag_string.mapAttributesToHtmlTagString)(htmlStruct.attributes), " ") + separator + "/>";
+      }
+      const startTag = `${indentPadding}<${htmlStruct.tag}` + separator + attrString + ">";
       const endTag = `${inlineTag ? "" : indentPadding}</${htmlStruct.tag}>`;
@@ -206,0 +217,0 @@ const children = [];

dist/legacy/string-template-parser/jsx-elem-to-strings.js

@@ -29,2 +29,3 @@ "use strict";
 var import_jsx_runtime = require("../jsx-runtime.js");
+var import_self_closing_tag_list = require("../utilities/self-closing-tag-list.js");
 var import_interpolate = require("./interpolate.js");
@@ -124,7 +125,5 @@ var import_map_attribute_name = require("./map-attribute-name.js");
     } else {
+      const isSelfClosingTag = children.length === 0 && import_self_closing_tag_list.SELF_CLOSING_TAG_LIST.includes(element.tag);
       const results = [[], []];
-      const part1 = `<${element.tag}`;
-      const part2 = ">";
-      const part3 = `</${element.tag}>`;
-      results[0].push(part1);
+      results[0].push(`<${element.tag}`);
       const attrList = Object.entries(attributes);
@@ -143,15 +142,19 @@ for (let index = 0; index < attrList.length; index++) {
       }
-      concatToLastStringOrPush(results, part2);
-      for (let i = 0; i < children.length; i++) {
-        const child = children[i];
-        const [[first, ...strings], tagParams] = jsxElemToTagFuncArgsSync(
-          child,
-          options,
-          componentApi
-        );
-        concatToLastStringOrPush(results, first);
-        results[0] = results[0].concat(strings);
-        results[1] = results[1].concat(tagParams);
+      if (isSelfClosingTag) {
+        concatToLastStringOrPush(results, "/>");
+      } else {
+        concatToLastStringOrPush(results, ">");
+        for (let i = 0; i < children.length; i++) {
+          const child = children[i];
+          const [[first, ...strings], tagParams] = jsxElemToTagFuncArgsSync(
+            child,
+            options,
+            componentApi
+          );
+          concatToLastStringOrPush(results, first);
+          results[0] = results[0].concat(strings);
+          results[1] = results[1].concat(tagParams);
+        }
+        concatToLastStringOrPush(results, `</${element.tag}>`);
       }
-      concatToLastStringOrPush(results, part3);
       return results;
@@ -158,0 +161,0 @@ }

package.json

 {
   "name": "jsxte",
-  "version": "3.1.3",
+  "version": "3.1.4",
   "description": "JSX-based html templating engine for browsers or Node environments.",
@@ -46,7 +46,7 @@ "license": "MIT",
     "@types/jest": "~29.5.4",
-    "@typescript-eslint/eslint-plugin": "~6.5.0",
+    "@typescript-eslint/eslint-plugin": "~6.7.0",
     "@typescript-eslint/parser": "~6.6.0",
     "axios": "~1.5.0",
     "esbuild": "~0.19.2",
-    "eslint": "~8.48.0",
+    "eslint": "~8.49.0",
     "eslint-config-prettier": "~9.0.0",
@@ -53,0 +53,0 @@ "eslint-plugin-prettier": "~5.0.0",

README.md

@@ -193,37 +193,7 @@ # JSX Template Engine
 
-It is possible to incorporate a Provider/Consumer pattern with the ContextMap API.
+Context also provides a Provider and a Consumer components.
 
 ```tsx
-const makeContextWithProvider = <T,>() => {
-  const ctx = defineContext<T>();
+const MyContext = defineContext<string>();
 
-  const Provider: JSXTE.Component<{
-    value: T;
-  }> = (props, componentApi) => {
-    componentApi.ctx.set(ctx, props.value);
-    return <>{props.children}</>;
-  };
-
-  const Consumer: JSXTE.Component<{
-    render: (value?: T) => JSX.Element;
-  }> = (props, componentApi) => {
-    if (componentApi.ctx.has(ctx)) {
-      const value = componentApi.ctx.getOrFail(ctx);
-      return <>{props.render(value)}</>;
-    } else {
-      return <>{props.render()}</>;
-    }
-  };
-
-  return {
-    context: ctx,
-    Provider,
-    Consumer,
-  };
-};
-
-// Use it
-
-const MyContext = makeContextWithProvider<string>();
-
 const App: JSXTE.Component = () => {
@@ -230,0 +200,0 @@ return (

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

282497

increased by2.06%

Number of package files

323

increased by1.25%

Lines of code

7067

increased by2.07%

Worsened metrics

Number of lines in readme file

423

decreased by-6.62%

No dependency changes