@thi.ng/hdom - npm Package Compare versions

Comparing version 4.0.3 to 4.0.4

api.d.ts

@@ -27,3 +27,5 @@ import { IObjectOf } from "@thi.ng/api/api";
     /**
-     * If true (default), text content will be wrapped in `<span>`
+     * If true (default), all text content will be wrapped in `<span>`
+     * elements. Spans will never be created inside <option>, <textarea>
+     * or <text> elements.
      */
@@ -33,9 +35,9 @@ span?: boolean;
      * If true (default false), the first frame will only be used to
-     * inject event listeners.
+     * inject event listeners, using the `hydrateDOM()` function.
      *
      * *Important:* Enabling this option assumes that an equivalent DOM
-     * (minus listeners) already exists (i.e. generated via SSR) when
-     * hdom's `start()` function is called. Any other discrepancies
-     * between the pre-existing DOM and the hdom trees will cause
-     * undefined behavior.
+     * (minus event listeners) already exists (e.g. generated via SSR /
+     * hiccup's `serialize()`) when hdom's `start()` function is called.
+     * Any other discrepancies between the pre-existing DOM and the hdom
+     * trees will cause undefined behavior.
      */
@@ -42,0 +44,0 @@ hydrate?: boolean;

CHANGELOG.md

@@ -6,2 +6,10 @@ # Change Log
 
+<a name="4.0.4"></a>
+## [4.0.4](https://github.com/thi-ng/umbrella/compare/@thi.ng/hdom@[e-mail]/hdom@4.0.4) (2018-09-03)
+
+
+
+
+**Note:** Version bump only for package @thi.ng/hdom
+
 <a name="4.0.3"></a>
@@ -8,0 +16,0 @@ ## [4.0.3](https://github.com/thi-ng/umbrella/compare/@thi.ng/hdom@[e-mail]/hdom@4.0.3) (2018-09-01)

package.json

 {
     "name": "@thi.ng/hdom",
-    "version": "4.0.3",
+    "version": "4.0.4",
     "description": "Lightweight vanilla ES6 UI component & virtual DOM system",
@@ -5,0 +5,0 @@ "main": "./index.js",

README.md

@@ -344,12 +344,14 @@ # @thi.ng/hdom
 Main user function of this package. For most use cases, this function
-should be the only one required in user code. It takes a parent DOM
-element (or ID), hiccup tree (array, function or component object w/
-life cycle methods) and an optional arbitrary context object. Starts RAF
-update loop, in each iteration first normalizing given tree, then
-computing diff to previous frame's tree and applying any changes to the
-real DOM. The optional `context` arg can be used for passing global
-config data or state down into the hiccup component tree. Any embedded
-component function in the tree will receive this context object as first
-argument, as will life cycle methods in component objects. See [context
-description](#user-context) further below.
+should be the only one required in user code. It takes an hiccup tree
+(array, function or component object w/ life cycle methods) and an
+optional object of [DOM update
+options](https://github.com/thi-ng/umbrella/tree/master/packages/hdom/src/api.ts#L19)
+(also see below). Starts RAF update loop, in each iteration first
+normalizing given tree, then computing diff to previous frame's tree and
+applying any changes to the real DOM. The `ctx` option can be used for
+passing arbitrary config data or state down into the hiccup component
+tree. Any embedded component function in the tree will receive this
+context object as first argument, as will life cycle methods in
+component objects. See [context description](#user-context) further
+below.
 
@@ -375,5 +377,48 @@ **Selective updates**: No updates will be applied if the given hiccup
 
-Returns a function, which when called, immediately cancels the update
-loop.
+`start` returns a function, which when called, immediately cancels the
+update loop.
 
+#### `HDOMOpts` config options
+
+Config options object passed to hdom's `start()` or
+[@thi.ng/transducers-hdom](https://github.com/thi-ng/umbrella/tree/master/packages/transducers-hdom)'s
+`updateDOM()`:
+
+```ts
+interface HDOMOpts {
+    /**
+     * Root element or ID (default: "app").
+     */
+    root?: Element | string;
+    /**
+     * Arbitrary user context object, passed to all component functions
+     * embedded in the tree.
+     */
+    ctx?: any;
+    /**
+     * If true (default), all text content will be wrapped in `<span>`
+     * elements. Spans will never be created inside <option>, <textarea>
+     * or <text> elements.
+     */
+    span?: boolean;
+    /**
+     * If true (default false), the first frame will only be used to
+     * inject event listeners, using the `hydrateDOM()` function.
+     *
+     * *Important:* Enabling this option assumes that an equivalent DOM
+     * (minus event listeners) already exists (e.g. generated via SSR /
+     * hiccup's `serialize()`) when hdom's `start()` function is called.
+     * Any other discrepancies between the pre-existing DOM and the hdom
+     * trees will cause undefined behavior.
+     */
+    hydrate?: boolean;
+    /**
+     * If true (default), the hdom component tree will be first
+     * normalized before diffing (using `normalizeTree()`). Unless you
+     * know what you're doing, it's best to leave this enabled.
+     */
+    normalize?: boolean;
+}
+```
+
 #### `normalizeTree(tree: any, ctx?: any): any`
@@ -380,0 +425,0 @@

start.d.ts

 import { HDOMOpts } from "./api";
 /**
- * Takes a parent DOM element (or ID), hiccup tree (array, function or
- * component object w/ lifecycle methods) and an optional context
- * object. Starts RAF update loop, computing diff to previous frame's
- * tree and applying any changes to the real DOM.
+ * Takes an hiccup tree (array, function or component object w/ life
+ * cycle methods) and an optional object of DOM update options. Starts
+ * RAF update loop, in each iteration first normalizing given tree, then
+ * computing diff to previous frame's tree and applying any changes to
+ * the real DOM. The `ctx` option can be used for passing arbitrary
+ * config data or state down into the hiccup component tree. Any
+ * embedded component function in the tree will receive this context
+ * object as first argument, as will life cycle methods in component
+ * objects.
  *
- * The optional `context` arg can be used for passing global config data
- * or state down into the hiccup component tree. Any embedded component
- * function in the tree will receive this context object as first
- * argument, as will life cycle methods in component objects.
- *
  * **Selective updates**: No updates will be applied if the given hiccup
@@ -14,0 +14,0 @@ * tree is `undefined` or `null` or a root component function returns no

start.js

@@ -8,12 +8,12 @@ "use strict";
 /**
- * Takes a parent DOM element (or ID), hiccup tree (array, function or
- * component object w/ lifecycle methods) and an optional context
- * object. Starts RAF update loop, computing diff to previous frame's
- * tree and applying any changes to the real DOM.
+ * Takes an hiccup tree (array, function or component object w/ life
+ * cycle methods) and an optional object of DOM update options. Starts
+ * RAF update loop, in each iteration first normalizing given tree, then
+ * computing diff to previous frame's tree and applying any changes to
+ * the real DOM. The `ctx` option can be used for passing arbitrary
+ * config data or state down into the hiccup component tree. Any
+ * embedded component function in the tree will receive this context
+ * object as first argument, as will life cycle methods in component
+ * objects.
  *
- * The optional `context` arg can be used for passing global config data
- * or state down into the hiccup component tree. Any embedded component
- * function in the tree will receive this context object as first
- * argument, as will life cycle methods in component objects.
- *
  * **Selective updates**: No updates will be applied if the given hiccup
@@ -20,0 +20,0 @@ * tree is `undefined` or `null` or a root component function returns no

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

87103

increased by2.25%

Lines of code

892

increased by0.22%

Number of lines in readme file

664

increased by7.27%

No dependency changes