preact-render-to-string - npm Package Compare versions

Comparing version 3.1.1 to 3.2.0

dist/index.js

@@ -72,2 +72,13 @@ (function (global, factory) {
 
+	function hashToClassName(c) {
+		var str = '';
+		for (var prop in c) {
+			if (c[prop]) {
+				if (str) str += ' ';
+				str += prop;
+			}
+		}
+		return str;
+	}
+
 	var jsToCss = memoize(function (s) {
@@ -176,3 +187,6 @@ return s.replace(/([A-Z])/g, '-$1').toLowerCase();
 				}
-				if (name === 'style' && v && typeof v === 'object') {
+
+				if (name === 'class' && v && typeof v === 'object') {
+					v = hashToClassName(v);
+				} else if (name === 'style' && v && typeof v === 'object') {
 					v = styleObjToCss(v);
@@ -179,0 +193,0 @@ }

dist/jsx.js

@@ -84,2 +84,13 @@ (function (global, factory) {
 
+  function hashToClassName(c) {
+  	var str = '';
+  	for (var prop in c) {
+  		if (c[prop]) {
+  			if (str) str += ' ';
+  			str += prop;
+  		}
+  	}
+  	return str;
+  }
+
   var jsToCss = memoize(function (s) {
@@ -188,3 +199,6 @@ return s.replace(/([A-Z])/g, '-$1').toLowerCase();
   			}
-  			if (name === 'style' && v && typeof v === 'object') {
+
+  			if (name === 'class' && v && typeof v === 'object') {
+  				v = hashToClassName(v);
+  			} else if (name === 'style' && v && typeof v === 'object') {
   				v = styleObjToCss(v);
@@ -191,0 +205,0 @@ }

package.json

 {
   "name": "preact-render-to-string",
   "amdName": "preactRenderToString",
-  "version": "3.1.1",
+  "version": "3.2.0",
   "description": "Render JSX to an HTML string, with support for Preact components.",
@@ -49,3 +49,3 @@ "main": "dist/index.js",
     "mocha": "^3.0.0",
-    "preact": "^5.5.0",
+    "preact": "^6.1.0",
     "rollup": "^0.34.3",
@@ -52,0 +52,0 @@ "rollup-plugin-babel": "^2.6.1",

src/index.js

@@ -1,2 +0,2 @@
-import { objectKeys, encodeEntities, falsey, memoize, indent, isLargeString, styleObjToCss, assign, getNodeProps } from './util';
+import { objectKeys, encodeEntities, falsey, memoize, indent, isLargeString, styleObjToCss, hashToClassName, assign, getNodeProps } from './util';
 
@@ -126,3 +126,7 @@ const SHALLOW = { shallow: true };
 			}
-			if (name==='style' && v && typeof v==='object') {
+
+			if (name==='class' && v && typeof v==='object') {
+				v = hashToClassName(v);
+			}
+			else if (name==='style' && v && typeof v==='object') {
 				v = styleObjToCss(v);
@@ -129,0 +133,0 @@ }

src/util.js

@@ -33,2 +33,3 @@ // DOM properties that should NOT have "px" added when numeric
 
+// Convert an Object style to a CSSText string
 export function styleObjToCss(s) {
@@ -52,2 +53,15 @@ let str = '';
 
+
+// See https://github.com/developit/preact/blob/master/src/util.js#L61
+export function hashToClassName(c) {
+	let str = '';
+	for (let prop in c) {
+		if (c[prop]) {
+			if (str) str += ' ';
+			str += prop;
+		}
+	}
+	return str;
+}
+
 // Convert a JavaScript camel-case CSS property name to a CSS property name
@@ -54,0 +68,0 @@ export let jsToCss = memoize( s => s.replace(/([A-Z])/g,'-$1').toLowerCase() );

test/render.js

@@ -404,6 +404,14 @@ import { render, shallowRender } from '../src';
 
-		it('should prefer className over class', () => {
+		it('should prefer class over className', () => {
 			let rendered = render(<div class="foo" className="foo bar" />);
-			expect(rendered).to.equal('<div class="foo bar"></div>');
+			expect(rendered).to.equal('<div class="foo"></div>');
 		});
+
+		it('should stringify object classNames', () => {
+			let rendered = render(<div class={{ foo:1, bar:0, baz:true, buzz:false }} />);
+			expect(rendered, 'class').to.equal('<div class="foo baz"></div>');
+
+			rendered = render(<div className={{ foo:1, bar:0, baz:true, buzz:false }} />);
+			expect(rendered, 'className').to.equal('<div class="foo baz"></div>');
+		});
 	});
@@ -410,0 +418,0 @@

No alert changes

Improved metrics

Total package byte prevSize

124000

increased by2.35%

Lines of code

1738

increased by2.66%

No dependency changes