Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
snabbdom - npm Package Compare versions
Comparing version 2.1.0 to 3.0.0
262
CHANGELOG.md
@@ -0,1 +1,39 @@ | ||
| # [3.0.0](https://github.com/snabbdom/snabbdom/compare/v2.1.0...v3.0.0) (2021-03-28) | ||
| ### Bug Fixes | ||
| * node similarity checking ([#949](https://github.com/snabbdom/snabbdom/issues/949)) ([d669054](https://github.com/snabbdom/snabbdom/commit/d66905438dc6866b2a7ab21d719c45a156d1252e)) | ||
| * remove the hero module ([#953](https://github.com/snabbdom/snabbdom/issues/953)) ([30b7df6](https://github.com/snabbdom/snabbdom/commit/30b7df61ab45c2c4b1c52e36b07274011eb1d9af)), closes [#517](https://github.com/snabbdom/snabbdom/issues/517) | ||
| * **package:** rm script mark-pr-head-as-trusted ([d74b847](https://github.com/snabbdom/snabbdom/commit/d74b8478cd4fb7cd59305beb92b4ee4d4186906f)) | ||
| ### Features | ||
| * add JSX namespace to jsx factory ([5d5fc5a](https://github.com/snabbdom/snabbdom/commit/5d5fc5a362384b3d6377b2671a20f16d89e1006b)) | ||
| * allow symbols as keys ([#954](https://github.com/snabbdom/snabbdom/issues/954)) ([ad80c6e](https://github.com/snabbdom/snabbdom/commit/ad80c6ea530a058501465cfcb45698e380ceb96a)), closes [#124](https://github.com/snabbdom/snabbdom/issues/124) | ||
| * export everything from 'snabbdom' ([7af7e3f](https://github.com/snabbdom/snabbdom/commit/7af7e3f684f0854a3466a94ac4d1bb7737993875)), closes [#913](https://github.com/snabbdom/snabbdom/issues/913) [#748](https://github.com/snabbdom/snabbdom/issues/748) | ||
| * mark the snabbdom package as side effect free ([8524013](https://github.com/snabbdom/snabbdom/commit/852401345e9b0e66ae5b450915067488ceb0aae1)) | ||
| * offer esm and commonjs bundles ([ebf6915](https://github.com/snabbdom/snabbdom/commit/ebf6915794fc4b13a149f8d762372d7b412ab469)) | ||
| ### BREAKING CHANGES | ||
| * Snabbdom does not export the hero module any more. If you require this | ||
| module, copy the code from examples/hero/hero.js and add it to your | ||
| project | ||
| * The imports of snabbdom functions have changed. Every file in the | ||
| project had to be imported on its own, e.g. | ||
| ``` | ||
| import { h } from 'snabbdom/h' | ||
| import { VNode } from 'snabbdom/vnode' | ||
| ``` | ||
| Now, the main snabbdom package exports all of the public API like | ||
| ``` | ||
| import { h, VNode } from 'snabbdom' | ||
| ``` | ||
| This means consumers of the snabbdom package need to update their | ||
| imports. The change makes the use of the `exports` field in | ||
| `package.json` unnecessary, which caused issues for TypeScript users | ||
| # Changelog | ||
@@ -7,112 +45,105 @@ | ||
| ### Features | ||
| * **eventlisteners:** add types for VNode in listener ([63b1b6c](https://github.com/snabbdom/snabbdom/commit/63b1b6c22e49d06b1fb509a14d321ec19f324bb5)), closes [#796](https://github.com/snabbdom/snabbdom/issues/796) | ||
| * **eventlisteners:** relax custom event listener type ([15ce059](https://github.com/snabbdom/snabbdom/commit/15ce059e2b5e80d1975168fff2d2a44f71bd5cbb)), closes [#850](https://github.com/snabbdom/snabbdom/issues/850) | ||
| - **eventlisteners:** add types for VNode in listener ([63b1b6c](https://github.com/snabbdom/snabbdom/commit/63b1b6c22e49d06b1fb509a14d321ec19f324bb5)), closes [#796](https://github.com/snabbdom/snabbdom/issues/796) | ||
| - **eventlisteners:** relax custom event listener type ([15ce059](https://github.com/snabbdom/snabbdom/commit/15ce059e2b5e80d1975168fff2d2a44f71bd5cbb)), closes [#850](https://github.com/snabbdom/snabbdom/issues/850) | ||
| ## [2.0.0](https://github.com/snabbdom/snabbdom/compare/v1.0.1...v2.0.0) (2020-09-10) | ||
| ### ⚠ BREAKING CHANGES | ||
| * **eventlisteners:** loaded/carrying event listeners are no longer supported. | ||
| - **eventlisteners:** loaded/carrying event listeners are no longer supported. | ||
| ### Features | ||
| * **eventlisteners:** add missing mult. listeners type ([5a89efe](https://github.com/snabbdom/snabbdom/commit/5a89efe01580d50f15649c19a444745867c5c0d4)), closes [#794](https://github.com/snabbdom/snabbdom/issues/794) | ||
| * **eventlisteners:** remove loaded listeners feature ([6e0ff8e](https://github.com/snabbdom/snabbdom/commit/6e0ff8e8141c70891e55e41a3107d6d4de0bc754)), closes [#802](https://github.com/snabbdom/snabbdom/issues/802) [#802](https://github.com/snabbdom/snabbdom/issues/802) | ||
| - **eventlisteners:** add missing mult. listeners type ([5a89efe](https://github.com/snabbdom/snabbdom/commit/5a89efe01580d50f15649c19a444745867c5c0d4)), closes [#794](https://github.com/snabbdom/snabbdom/issues/794) | ||
| - **eventlisteners:** remove loaded listeners feature ([6e0ff8e](https://github.com/snabbdom/snabbdom/commit/6e0ff8e8141c70891e55e41a3107d6d4de0bc754)), closes [#802](https://github.com/snabbdom/snabbdom/issues/802) [#802](https://github.com/snabbdom/snabbdom/issues/802) | ||
| ### Bug Fixes | ||
| * **deps:** add regenertor-runtime to devDeps ([2a2964c](https://github.com/snabbdom/snabbdom/commit/2a2964c3eb47cd2f5a7ae88f49b2afe9ea299d7e)), closes [#813](https://github.com/snabbdom/snabbdom/issues/813) | ||
| * **docs:** gitter badge url ([7e19849](https://github.com/snabbdom/snabbdom/commit/7e198493c11f6d4afa8b03d727083d661e85ec0e)) | ||
| * **examples:** example import paths ([8111f62](https://github.com/snabbdom/snabbdom/commit/8111f6234a70840673412da6cd37a726a7c839f8)), closes [#761](https://github.com/snabbdom/snabbdom/issues/761) | ||
| * **examples:** totalHeight 0 on remove last element reorder animation ([afa77c0](https://github.com/snabbdom/snabbdom/commit/afa77c04d4ab959a5f2bb5853e5dd821c744843f)) | ||
| * **package:** remove directories field ([c7a2a93](https://github.com/snabbdom/snabbdom/commit/c7a2a93f5a2ed63bd76130e5e3d3769a9f1c1c58)) | ||
| * **package:** update urls paldepind -> snabbdom ([f94185a](https://github.com/snabbdom/snabbdom/commit/f94185a5bbb31018af48b77449e74f58339fe404)), closes [#775](https://github.com/snabbdom/snabbdom/issues/775) | ||
| - **deps:** add regenertor-runtime to devDeps ([2a2964c](https://github.com/snabbdom/snabbdom/commit/2a2964c3eb47cd2f5a7ae88f49b2afe9ea299d7e)), closes [#813](https://github.com/snabbdom/snabbdom/issues/813) | ||
| - **docs:** gitter badge url ([7e19849](https://github.com/snabbdom/snabbdom/commit/7e198493c11f6d4afa8b03d727083d661e85ec0e)) | ||
| - **examples:** example import paths ([8111f62](https://github.com/snabbdom/snabbdom/commit/8111f6234a70840673412da6cd37a726a7c839f8)), closes [#761](https://github.com/snabbdom/snabbdom/issues/761) | ||
| - **examples:** totalHeight 0 on remove last element reorder animation ([afa77c0](https://github.com/snabbdom/snabbdom/commit/afa77c04d4ab959a5f2bb5853e5dd821c744843f)) | ||
| - **package:** remove directories field ([c7a2a93](https://github.com/snabbdom/snabbdom/commit/c7a2a93f5a2ed63bd76130e5e3d3769a9f1c1c58)) | ||
| - **package:** update urls paldepind -> snabbdom ([f94185a](https://github.com/snabbdom/snabbdom/commit/f94185a5bbb31018af48b77449e74f58339fe404)), closes [#775](https://github.com/snabbdom/snabbdom/issues/775) | ||
| ### [1.0.1](https://github.com/paldepind/snabbdom/compare/v1.0.0...v1.0.1) (2020-06-18) | ||
| ### User facing changes | ||
| * **package:** fix ./snabbdom related files and exports fields errors ([89b917b](https://github.com/paldepind/snabbdom/commit/89b917bb3f3f8986390e3e400327a9087533d928)) | ||
| - **package:** fix ./snabbdom related files and exports fields errors ([89b917b](https://github.com/paldepind/snabbdom/commit/89b917bb3f3f8986390e3e400327a9087533d928)) | ||
| ## [1.0.0](https://github.com/paldepind/snabbdom/compare/v0.7.4...v1.0.0) (2020-06-18) | ||
| ### ⚠ BREAKING CHANGES | ||
| * **exports:** The main export path, 'snabbdom' was replaced with | ||
| the export path 'snabbdom/init'. This new export path includes only | ||
| the named export `init`. | ||
| * **exports:** No default exports exist. All exports are named. | ||
| * **exports:** the import path `snabbdom/snabbdom.bundle` is removed. | ||
| * **typescript:** Types exported by this package have re-declared | ||
| the global `Element.setAttribute` and `Element.setAttributeNS` to | ||
| accept `number` and `boolean` for the `value` parameter. This | ||
| change removes that re-declaration and thus the only valid value is | ||
| `string`. If your code provides `number` and/or `boolean`, then it | ||
| may now fail to compile. | ||
| * **props:** props module does not attempt to delete node | ||
| properties. This may affect you if you are using the props module | ||
| to add non-native (custom) properties to DOM nodes. Instead, it is | ||
| recommended to use _data-* attributes_. | ||
| https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes | ||
| * CommonJS modules are no longer provided. | ||
| * import paths in ES modules include file name | ||
| extensions. | ||
| * Compiled to ES2015 (was ES5). | ||
| * UMD bundles are no longer provided. | ||
| - **exports:** The main export path, 'snabbdom' was replaced with | ||
| the export path 'snabbdom/init'. This new export path includes only | ||
| the named export `init`. | ||
| - **exports:** No default exports exist. All exports are named. | ||
| - **exports:** the import path `snabbdom/snabbdom.bundle` is removed. | ||
| - **typescript:** Types exported by this package have re-declared | ||
| the global `Element.setAttribute` and `Element.setAttributeNS` to | ||
| accept `number` and `boolean` for the `value` parameter. This | ||
| change removes that re-declaration and thus the only valid value is | ||
| `string`. If your code provides `number` and/or `boolean`, then it | ||
| may now fail to compile. | ||
| - **props:** props module does not attempt to delete node | ||
| properties. This may affect you if you are using the props module | ||
| to add non-native (custom) properties to DOM nodes. Instead, it is | ||
| recommended to use _data-\* attributes_. | ||
| https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes | ||
| - CommonJS modules are no longer provided. | ||
| - import paths in ES modules include file name | ||
| extensions. | ||
| - Compiled to ES2015 (was ES5). | ||
| - UMD bundles are no longer provided. | ||
| ### Internal changes | ||
| * **commitlint:** add type auto and scope deps for renovate ([b56a0ac](https://github.com/paldepind/snabbdom/commit/b56a0ac796a3c27644f8332278a7cbb9d24a95c6)) | ||
| * **commitlint:** fix and enable in CI ([f8cf5cc](https://github.com/paldepind/snabbdom/commit/f8cf5ccba402cbbf6982da681db8707fd12fc8d4)), closes [#662](https://github.com/paldepind/snabbdom/issues/662) | ||
| * **deps:** update dependency @typescript-eslint/eslint-plugin to v3.3.0 ([9448e42](https://github.com/paldepind/snabbdom/commit/9448e4267cf077890deb0deb32c3200e4d19a213)) | ||
| * **deps:** update dependency tsconfigs to v5 ([eb1ec8c](https://github.com/paldepind/snabbdom/commit/eb1ec8c280544a322fc9844c255b8ec5c8e004c6)) | ||
| * **deps:** update dependency typescript to v3.9.5 ([5e24b20](https://github.com/paldepind/snabbdom/commit/5e24b20a52a8c20ed82e3fc7d20977262016731a)) | ||
| * **docs:** lint code examples ([41cb359](https://github.com/paldepind/snabbdom/commit/41cb3596e8898399545f02ff8205a1d45f62f391)) | ||
| * **eslint:** lint cjs files ([d581217](https://github.com/paldepind/snabbdom/commit/d58121755f4e2da50ad82e52818b66333ae10a37)) | ||
| * **format:** sort file lists ([e77615b](https://github.com/paldepind/snabbdom/commit/e77615b16bd60fbd1963528a2c46e7dfbbb77e0e)), closes [#673](https://github.com/paldepind/snabbdom/issues/673) | ||
| * **git:** ignore each test artifact specifically ([b34e9a9](https://github.com/paldepind/snabbdom/commit/b34e9a9d3a8096c2c5cd7eebeafba0e52ed08a75)) | ||
| * **package:** consistent values in files field ([6fe56f8](https://github.com/paldepind/snabbdom/commit/6fe56f8538f6e0073d458d7a8e21c8d469c0a9df)), closes [#672](https://github.com/paldepind/snabbdom/issues/672) | ||
| * **relic:** remove @types/assert ([2846189](https://github.com/paldepind/snabbdom/commit/28461899bdce0c2134dca92298e40c1ecf7be363)) | ||
| * **typescript:** package and tests are two projects ([8a71211](https://github.com/paldepind/snabbdom/commit/8a71211b4a38616c9d90bc9214e116d1b3e869b5)) | ||
| * **vscode:** eslint.validate short forms ([ba3e85b](https://github.com/paldepind/snabbdom/commit/ba3e85bf90f77254fad08435d484e19f836c6783)) | ||
| * **vscode:** use workspace typescript ([eabbd2f](https://github.com/paldepind/snabbdom/commit/eabbd2f056b40e5e9376ccf94c9a6f9177bd020a)) | ||
| - **commitlint:** add type auto and scope deps for renovate ([b56a0ac](https://github.com/paldepind/snabbdom/commit/b56a0ac796a3c27644f8332278a7cbb9d24a95c6)) | ||
| - **commitlint:** fix and enable in CI ([f8cf5cc](https://github.com/paldepind/snabbdom/commit/f8cf5ccba402cbbf6982da681db8707fd12fc8d4)), closes [#662](https://github.com/paldepind/snabbdom/issues/662) | ||
| - **deps:** update dependency @typescript-eslint/eslint-plugin to v3.3.0 ([9448e42](https://github.com/paldepind/snabbdom/commit/9448e4267cf077890deb0deb32c3200e4d19a213)) | ||
| - **deps:** update dependency tsconfigs to v5 ([eb1ec8c](https://github.com/paldepind/snabbdom/commit/eb1ec8c280544a322fc9844c255b8ec5c8e004c6)) | ||
| - **deps:** update dependency typescript to v3.9.5 ([5e24b20](https://github.com/paldepind/snabbdom/commit/5e24b20a52a8c20ed82e3fc7d20977262016731a)) | ||
| - **docs:** lint code examples ([41cb359](https://github.com/paldepind/snabbdom/commit/41cb3596e8898399545f02ff8205a1d45f62f391)) | ||
| - **eslint:** lint cjs files ([d581217](https://github.com/paldepind/snabbdom/commit/d58121755f4e2da50ad82e52818b66333ae10a37)) | ||
| - **format:** sort file lists ([e77615b](https://github.com/paldepind/snabbdom/commit/e77615b16bd60fbd1963528a2c46e7dfbbb77e0e)), closes [#673](https://github.com/paldepind/snabbdom/issues/673) | ||
| - **git:** ignore each test artifact specifically ([b34e9a9](https://github.com/paldepind/snabbdom/commit/b34e9a9d3a8096c2c5cd7eebeafba0e52ed08a75)) | ||
| - **package:** consistent values in files field ([6fe56f8](https://github.com/paldepind/snabbdom/commit/6fe56f8538f6e0073d458d7a8e21c8d469c0a9df)), closes [#672](https://github.com/paldepind/snabbdom/issues/672) | ||
| - **relic:** remove @types/assert ([2846189](https://github.com/paldepind/snabbdom/commit/28461899bdce0c2134dca92298e40c1ecf7be363)) | ||
| - **typescript:** package and tests are two projects ([8a71211](https://github.com/paldepind/snabbdom/commit/8a71211b4a38616c9d90bc9214e116d1b3e869b5)) | ||
| - **vscode:** eslint.validate short forms ([ba3e85b](https://github.com/paldepind/snabbdom/commit/ba3e85bf90f77254fad08435d484e19f836c6783)) | ||
| - **vscode:** use workspace typescript ([eabbd2f](https://github.com/paldepind/snabbdom/commit/eabbd2f056b40e5e9376ccf94c9a6f9177bd020a)) | ||
| ### User facing changes | ||
| * **docs:** enable eslint rule array-bracket-spacing ([77e54e9](https://github.com/paldepind/snabbdom/commit/77e54e9105394d4e6d21647a38adfb80ea567ee2)) | ||
| * **docs:** enable eslint rule import/first ([17cf7ae](https://github.com/paldepind/snabbdom/commit/17cf7ae931185d8ab1ac1e4f8b7042677e03db8d)) | ||
| * **docs:** enable eslint rule import/newline-after-import ([cd3a5cf](https://github.com/paldepind/snabbdom/commit/cd3a5cf17ee33c738d17adcb78a8c254e96653b9)) | ||
| * **docs:** enable eslint rule indent ([e2861bb](https://github.com/paldepind/snabbdom/commit/e2861bb1bd68c63c99c30907bb331c21f27cb248)) | ||
| * **docs:** enable eslint rule key-spacing ([349b686](https://github.com/paldepind/snabbdom/commit/349b686bd8cfc24a2845fbab62081a15e5b42d0f)) | ||
| * **docs:** enable eslint rule max-statements-per-line ([a128a23](https://github.com/paldepind/snabbdom/commit/a128a23ac3182677d10d1979213c92dcf04294ea)) | ||
| * **docs:** enable eslint rule no-multi-spaces ([8179381](https://github.com/paldepind/snabbdom/commit/8179381a775acea73d0064c77d643944cf684947)), closes [#692](https://github.com/paldepind/snabbdom/issues/692) | ||
| * **docs:** enable eslint rule object-curly-spacing ([8b8fbd5](https://github.com/paldepind/snabbdom/commit/8b8fbd5e34fdc3a99ce67635cc44f5ef9e3cf30c)) | ||
| * **docs:** enable eslint rule quote-props ([37512fe](https://github.com/paldepind/snabbdom/commit/37512fe8ee02cf374cf3d9a62c0f6e3203be2f28)) | ||
| * **docs:** enable eslint rule quotes ([2d455b5](https://github.com/paldepind/snabbdom/commit/2d455b52dcabc2f8e52082536e635a66e98eb650)) | ||
| * **docs:** enable eslint rule semi ([f4e7885](https://github.com/paldepind/snabbdom/commit/f4e7885663e645aeb728470d5e1f159365f94f1b)) | ||
| * **docs:** enable eslint rule space-before-blocks ([9f2d2d7](https://github.com/paldepind/snabbdom/commit/9f2d2d7a1687c7169dff775724a811e1dd7ccd8b)) | ||
| * **docs:** enable eslint rule space-before-function-paren ([23e7b87](https://github.com/paldepind/snabbdom/commit/23e7b87c64b5d587acae5ce7bd899ec0d071958e)) | ||
| * **docs:** enable eslint rules object-*-newline ([9a45b5b](https://github.com/paldepind/snabbdom/commit/9a45b5b22aba0fbed97431e99268a173995de4a1)) | ||
| * **docs:** fix wrong module import paths ([3b6baee](https://github.com/paldepind/snabbdom/commit/3b6baee049f44cbc55cc2b0131c2c551e9c1b452)), closes [#691](https://github.com/paldepind/snabbdom/issues/691) | ||
| * **docs:** provide a release changelog ([616df35](https://github.com/paldepind/snabbdom/commit/616df35909f1d639d562418ea32122625104b00c)), closes [#670](https://github.com/paldepind/snabbdom/issues/670) | ||
| * **exports:** main export provided ([3becd84](https://github.com/paldepind/snabbdom/commit/3becd84cc1dcfb84e2ee292eab18aae36e415040)), closes [#682](https://github.com/paldepind/snabbdom/issues/682) | ||
| * **exports:** only named exports ([fefd141](https://github.com/paldepind/snabbdom/commit/fefd141f5f3567bb6dccbd6c43ce81f285f985bd)), closes [#522](https://github.com/paldepind/snabbdom/issues/522) [#523](https://github.com/paldepind/snabbdom/issues/523) | ||
| * **exports:** relative values in exports field ([187088e](https://github.com/paldepind/snabbdom/commit/187088ee0ebfaed2e84a992bdde50d207131ec29)), closes [#674](https://github.com/paldepind/snabbdom/issues/674) | ||
| * **exports:** remove package.json main field ([3122eec](https://github.com/paldepind/snabbdom/commit/3122eec9b98ffdf52fd31ceb2ced17c219e25042)), closes [#680](https://github.com/paldepind/snabbdom/issues/680) | ||
| * **exports:** remove the /snabbdom.bundle path ([c862993](https://github.com/paldepind/snabbdom/commit/c8629933599b3fdf3ea774f3ce67517908b79d8d)) | ||
| * **exports:** replaced main export path with init ([09f2d1c](https://github.com/paldepind/snabbdom/commit/09f2d1ca5a16fd0b402209d90e58b97998efacef)), closes [#522](https://github.com/paldepind/snabbdom/issues/522) | ||
| * **package:** no module field ([2b30e25](https://github.com/paldepind/snabbdom/commit/2b30e25f0d261d2d7f37127bda0c235b0a5acf57)), closes [#681](https://github.com/paldepind/snabbdom/issues/681) | ||
| * **props:** do not attempt to delete node properties ([6f316c1](https://github.com/paldepind/snabbdom/commit/6f316c141b43ccb1c2c355ab8d0c499984154ef1)), closes [#623](https://github.com/paldepind/snabbdom/issues/623) [#283](https://github.com/paldepind/snabbdom/issues/283) [#415](https://github.com/paldepind/snabbdom/issues/415) [#307](https://github.com/paldepind/snabbdom/issues/307) [#151](https://github.com/paldepind/snabbdom/issues/151) [#416](https://github.com/paldepind/snabbdom/issues/416) | ||
| * **typescript:** do not redeclare Element.setAttribute(NS) ([0620b5e](https://github.com/paldepind/snabbdom/commit/0620b5eda03cd124d4bd743660cb376b0d75a0a3)), closes [#615](https://github.com/paldepind/snabbdom/issues/615) | ||
| * do not provide UMD bundles ([8e24bbf](https://github.com/paldepind/snabbdom/commit/8e24bbf016ff5cc0afb2759ec2e4b745921ee453)), closes [#498](https://github.com/paldepind/snabbdom/issues/498) [#514](https://github.com/paldepind/snabbdom/issues/514) [#481](https://github.com/paldepind/snabbdom/issues/481) | ||
| * only esm and correct import paths ([dad44f0](https://github.com/paldepind/snabbdom/commit/dad44f0d632d344ca13ee8430d941c26a53d5c2a)), closes [#516](https://github.com/paldepind/snabbdom/issues/516) [#437](https://github.com/paldepind/snabbdom/issues/437) [#263](https://github.com/paldepind/snabbdom/issues/263) | ||
| - **docs:** enable eslint rule array-bracket-spacing ([77e54e9](https://github.com/paldepind/snabbdom/commit/77e54e9105394d4e6d21647a38adfb80ea567ee2)) | ||
| - **docs:** enable eslint rule import/first ([17cf7ae](https://github.com/paldepind/snabbdom/commit/17cf7ae931185d8ab1ac1e4f8b7042677e03db8d)) | ||
| - **docs:** enable eslint rule import/newline-after-import ([cd3a5cf](https://github.com/paldepind/snabbdom/commit/cd3a5cf17ee33c738d17adcb78a8c254e96653b9)) | ||
| - **docs:** enable eslint rule indent ([e2861bb](https://github.com/paldepind/snabbdom/commit/e2861bb1bd68c63c99c30907bb331c21f27cb248)) | ||
| - **docs:** enable eslint rule key-spacing ([349b686](https://github.com/paldepind/snabbdom/commit/349b686bd8cfc24a2845fbab62081a15e5b42d0f)) | ||
| - **docs:** enable eslint rule max-statements-per-line ([a128a23](https://github.com/paldepind/snabbdom/commit/a128a23ac3182677d10d1979213c92dcf04294ea)) | ||
| - **docs:** enable eslint rule no-multi-spaces ([8179381](https://github.com/paldepind/snabbdom/commit/8179381a775acea73d0064c77d643944cf684947)), closes [#692](https://github.com/paldepind/snabbdom/issues/692) | ||
| - **docs:** enable eslint rule object-curly-spacing ([8b8fbd5](https://github.com/paldepind/snabbdom/commit/8b8fbd5e34fdc3a99ce67635cc44f5ef9e3cf30c)) | ||
| - **docs:** enable eslint rule quote-props ([37512fe](https://github.com/paldepind/snabbdom/commit/37512fe8ee02cf374cf3d9a62c0f6e3203be2f28)) | ||
| - **docs:** enable eslint rule quotes ([2d455b5](https://github.com/paldepind/snabbdom/commit/2d455b52dcabc2f8e52082536e635a66e98eb650)) | ||
| - **docs:** enable eslint rule semi ([f4e7885](https://github.com/paldepind/snabbdom/commit/f4e7885663e645aeb728470d5e1f159365f94f1b)) | ||
| - **docs:** enable eslint rule space-before-blocks ([9f2d2d7](https://github.com/paldepind/snabbdom/commit/9f2d2d7a1687c7169dff775724a811e1dd7ccd8b)) | ||
| - **docs:** enable eslint rule space-before-function-paren ([23e7b87](https://github.com/paldepind/snabbdom/commit/23e7b87c64b5d587acae5ce7bd899ec0d071958e)) | ||
| - **docs:** enable eslint rules object-\*-newline ([9a45b5b](https://github.com/paldepind/snabbdom/commit/9a45b5b22aba0fbed97431e99268a173995de4a1)) | ||
| - **docs:** fix wrong module import paths ([3b6baee](https://github.com/paldepind/snabbdom/commit/3b6baee049f44cbc55cc2b0131c2c551e9c1b452)), closes [#691](https://github.com/paldepind/snabbdom/issues/691) | ||
| - **docs:** provide a release changelog ([616df35](https://github.com/paldepind/snabbdom/commit/616df35909f1d639d562418ea32122625104b00c)), closes [#670](https://github.com/paldepind/snabbdom/issues/670) | ||
| - **exports:** main export provided ([3becd84](https://github.com/paldepind/snabbdom/commit/3becd84cc1dcfb84e2ee292eab18aae36e415040)), closes [#682](https://github.com/paldepind/snabbdom/issues/682) | ||
| - **exports:** only named exports ([fefd141](https://github.com/paldepind/snabbdom/commit/fefd141f5f3567bb6dccbd6c43ce81f285f985bd)), closes [#522](https://github.com/paldepind/snabbdom/issues/522) [#523](https://github.com/paldepind/snabbdom/issues/523) | ||
| - **exports:** relative values in exports field ([187088e](https://github.com/paldepind/snabbdom/commit/187088ee0ebfaed2e84a992bdde50d207131ec29)), closes [#674](https://github.com/paldepind/snabbdom/issues/674) | ||
| - **exports:** remove package.json main field ([3122eec](https://github.com/paldepind/snabbdom/commit/3122eec9b98ffdf52fd31ceb2ced17c219e25042)), closes [#680](https://github.com/paldepind/snabbdom/issues/680) | ||
| - **exports:** remove the /snabbdom.bundle path ([c862993](https://github.com/paldepind/snabbdom/commit/c8629933599b3fdf3ea774f3ce67517908b79d8d)) | ||
| - **exports:** replaced main export path with init ([09f2d1c](https://github.com/paldepind/snabbdom/commit/09f2d1ca5a16fd0b402209d90e58b97998efacef)), closes [#522](https://github.com/paldepind/snabbdom/issues/522) | ||
| - **package:** no module field ([2b30e25](https://github.com/paldepind/snabbdom/commit/2b30e25f0d261d2d7f37127bda0c235b0a5acf57)), closes [#681](https://github.com/paldepind/snabbdom/issues/681) | ||
| - **props:** do not attempt to delete node properties ([6f316c1](https://github.com/paldepind/snabbdom/commit/6f316c141b43ccb1c2c355ab8d0c499984154ef1)), closes [#623](https://github.com/paldepind/snabbdom/issues/623) [#283](https://github.com/paldepind/snabbdom/issues/283) [#415](https://github.com/paldepind/snabbdom/issues/415) [#307](https://github.com/paldepind/snabbdom/issues/307) [#151](https://github.com/paldepind/snabbdom/issues/151) [#416](https://github.com/paldepind/snabbdom/issues/416) | ||
| - **typescript:** do not redeclare Element.setAttribute(NS) ([0620b5e](https://github.com/paldepind/snabbdom/commit/0620b5eda03cd124d4bd743660cb376b0d75a0a3)), closes [#615](https://github.com/paldepind/snabbdom/issues/615) | ||
| - do not provide UMD bundles ([8e24bbf](https://github.com/paldepind/snabbdom/commit/8e24bbf016ff5cc0afb2759ec2e4b745921ee453)), closes [#498](https://github.com/paldepind/snabbdom/issues/498) [#514](https://github.com/paldepind/snabbdom/issues/514) [#481](https://github.com/paldepind/snabbdom/issues/481) | ||
| - only esm and correct import paths ([dad44f0](https://github.com/paldepind/snabbdom/commit/dad44f0d632d344ca13ee8430d941c26a53d5c2a)), closes [#516](https://github.com/paldepind/snabbdom/issues/516) [#437](https://github.com/paldepind/snabbdom/issues/437) [#263](https://github.com/paldepind/snabbdom/issues/263) | ||
@@ -125,3 +156,3 @@ ## [v0.7.2] - 2018-09-02 | ||
| - In some cases and browsers the style module would cause elements to not be removed correctly #367. Thanks to @jvanbruegge for fixing this tricky bug. | ||
| ## [v0.7.0] - 2017-07-27 | ||
@@ -149,5 +180,6 @@ | ||
| ## Bugfixes | ||
| - `toVNode` now handles `DocumentFragment` which makes it possible to patch into a fragment. #320. Thanks to @staltz. | ||
| - Custom boolean attributes are handled correctly. #314. Thanks to @caridy. | ||
| - Type improvement. `VNode` key property can be `undefined` #290. Thanks to @yarom82. | ||
| - Type improvement. `VNode` key property can be `undefined` #290. Thanks to @yarom82. | ||
| - Data attributes are checked for existence before deleting. Old behavior caused error in Safari. #313. Thanks to @FeliciousX. | ||
@@ -158,3 +190,3 @@ | ||
| - New handling of boolean attributes. #314. Thanks to @caridy. | ||
| ## [v0.6.9] - 2017-05-19 | ||
@@ -165,3 +197,3 @@ | ||
| - Fix style delayed and remove to be optional in TypeScript, https://github.com/snabbdom/snabbdom/issues/295 | ||
| ## [v0.6.8] - 2017-05-16 | ||
@@ -171,6 +203,6 @@ | ||
| - Fix error when class is set by vdom selector in SVG, https://github.com/snabbdom/snabbdom/issues/217. Thanks to @caesarsol | ||
| - Fix hyperscript to support undefined or null children in TypeScript, https://github.com/snabbdom/snabbdom/issues/226. Thanks to @ornicar | ||
| - Fix thunk function so it is not called redundantly, https://github.com/snabbdom/snabbdom/pull/273. Thanks to @caesarsol | ||
| - Improve TypeScript types of VNode props, https://github.com/snabbdom/snabbdom/issues/264 and https://github.com/snabbdom/snabbdom/issues/264. Thanks to @mightyiam | ||
| - Fix error when class is set by vdom selector in SVG, https://github.com/snabbdom/snabbdom/issues/217. Thanks to @caesarsol | ||
| - Fix hyperscript to support undefined or null children in TypeScript, https://github.com/snabbdom/snabbdom/issues/226. Thanks to @ornicar | ||
| - Fix thunk function so it is not called redundantly, https://github.com/snabbdom/snabbdom/pull/273. Thanks to @caesarsol | ||
| - Improve TypeScript types of VNode props, https://github.com/snabbdom/snabbdom/issues/264 and https://github.com/snabbdom/snabbdom/issues/264. Thanks to @mightyiam | ||
| - Fix toVNode() for comment nodes, lacking some fields, https://github.com/snabbdom/snabbdom/pull/266. Thanks to @staltz | ||
@@ -180,9 +212,10 @@ | ||
| - Improvement for attribute patching, https://github.com/snabbdom/snabbdom/issues/257. Thanks to @diervo | ||
| - Improvement for attribute patching, https://github.com/snabbdom/snabbdom/issues/257. Thanks to @diervo | ||
| ## [v0.6.6] - 2017-03-07 | ||
| ## Bug fixes | ||
| - The attributes module sets boolean attributes correctly according to the specificaiton. https://github.com/snabbdom/snabbdom/issues/254. Thanks to @PerWiklander for reporting the bug. | ||
| ## [v0.6.5] - 2017-02-25 | ||
@@ -193,7 +226,7 @@ | ||
| ## Bug fixes | ||
| - Fix `toVNode()` to handle text nodes correctly, https://github.com/snabbdom/snabbdom/issues/252. Thanks to @Steelfish | ||
| - Fix `toVNode()` to handle text nodes correctly, https://github.com/snabbdom/snabbdom/issues/252. Thanks to @Steelfish | ||
| - Fix dataset module to support old browsers, such as IE10. Thanks @staltz | ||
| - Fix "create element" workflow to align with "update element" workflow, https://github.com/snabbdom/snabbdom/pull/234. Thanks @caridy | ||
| - Fix "create element" workflow to align with "update element" workflow, https://github.com/snabbdom/snabbdom/pull/234. Thanks @caridy | ||
| ## [v0.6.4] - 2017-02-09 | ||
@@ -209,4 +242,4 @@ | ||
| ``` js | ||
| h('!', 'Will show as a comment') | ||
| ```js | ||
| h("!", "Will show as a comment"); | ||
| ``` | ||
@@ -216,3 +249,3 @@ | ||
| ``` html | ||
| ```html | ||
| <!-- Will show as a comment --> | ||
@@ -227,6 +260,6 @@ ``` | ||
| ``` js | ||
| import {toVNode} from 'snabbdom/tovnode' | ||
| ```js | ||
| import { toVNode } from "snabbdom/tovnode"; | ||
| // ... | ||
| patch(toVNode(element), vnode) | ||
| patch(toVNode(element), vnode); | ||
| ``` | ||
@@ -237,18 +270,18 @@ | ||
| ## Bug fixes | ||
| - Fix compatibility issue of String.prototype.startsWith in the Style Module. https://github.com/snabbdom/snabbdom/pull/228 Thanks to @zhulongzheng | ||
| - Support for `null`/`undefined` children without crashing. https://github.com/snabbdom/snabbdom/issues/226 Thanks to @nunocastromartins | ||
| - Fix compatibility issue of String.prototype.startsWith in the Style Module. https://github.com/snabbdom/snabbdom/pull/228 Thanks to @zhulongzheng | ||
| - Support for `null`/`undefined` children without crashing. https://github.com/snabbdom/snabbdom/issues/226 Thanks to @nunocastromartins | ||
| ## [v0.6.3] - 2017-01-16 | ||
| ## Bugfixes | ||
| - Fix the export of the `Module` interface for TypeScript projects depending on snabbdom. | ||
| - Fix the export of the `Module` interface for TypeScript projects depending on snabbdom. | ||
| ## [v0.6.2] - 2017-01-16 | ||
| ## Bugfixes | ||
| - Fix the export of the `Hooks` interface for TypeScript projects depending on snabbdom. | ||
| - Fix the export of the `Hooks` interface for TypeScript projects depending on snabbdom. | ||
| ## [v0.6.1] - 2017-01-05 | ||
@@ -261,2 +294,3 @@ | ||
| ## New features | ||
| - Complete TypeScript support. Thanks to @staltz. | ||
@@ -267,2 +301,3 @@ - Support for CSS variables. #195. Thanks to @jlesquembre. | ||
| ## Bugfixes | ||
| - Fix custom element creation when tag name begins with 'svg'. #213. Thanks to @tdumitrescu. | ||
@@ -277,15 +312,13 @@ - Fix bug related to updating one child with same key but different selector. #188. Thanks to @zhulongzheng. | ||
| ``` js | ||
| ```js | ||
| var h = require("snabbdom/h"); // The old way | ||
| var h = require("snabbdom/h").h; // The new way | ||
| var h = require("snabbdom/h").default; // Alternative new way | ||
| var {h} = require("snabbdom/h"); // Using destructuring | ||
| var { h } = require("snabbdom/h"); // Using destructuring | ||
| ``` | ||
| ## [v0.6.0] - 2017-01-05 | ||
| Deprecated. Use [version 0.6.1](https://github.com/snabbdom/snabbdom/releases/tag/v0.6.1) instead. | ||
| Deprecated. Use [version 0.6.1](https://github.com/snabbdom/snabbdom/releases/tag/v0.6.1) instead. | ||
| ## v0.5.0 - 2016-05-16 | ||
@@ -297,4 +330,3 @@ | ||
| [Unreleased]: https://github.com/snabbdom/snabbdom/compare/v0.7.2...HEAD | ||
| [unreleased]: https://github.com/snabbdom/snabbdom/compare/v0.7.2...HEAD | ||
| [v0.7.2]: https://github.com/snabbdom/snabbdom/compare/v0.7.0...v0.7.2 | ||
@@ -301,0 +333,0 @@ [v0.7.0]: https://github.com/snabbdom/snabbdom/compare/v0.6.9...v0.7.0 |
279
package.json
| { | ||
| "name": "snabbdom", | ||
| "version": "2.1.0", | ||
| "version": "3.0.0", | ||
| "description": "A virtual DOM library with focus on simplicity, modularity, powerful features and performance.", | ||
| "type": "module", | ||
| "exports": { | ||
| "./init": "./build/package/init.js", | ||
| "./h": "./build/package/h.js", | ||
| "./helpers/attachto": "./build/package/helpers/attachto.js", | ||
| "./hooks": "./build/package/hooks.js", | ||
| "./htmldomapi": "./build/package/htmldomapi.js", | ||
| "./is": "./build/package/is.js", | ||
| "./jsx": "./build/package/jsx.js", | ||
| "./modules/attributes": "./build/package/modules/attributes.js", | ||
| "./modules/class": "./build/package/modules/class.js", | ||
| "./modules/dataset": "./build/package/modules/dataset.js", | ||
| "./modules/eventlisteners": "./build/package/modules/eventlisteners.js", | ||
| "./modules/hero": "./build/package/modules/hero.js", | ||
| "./modules/module": "./build/package/modules/module.js", | ||
| "./modules/props": "./build/package/modules/props.js", | ||
| "./modules/style": "./build/package/modules/style.js", | ||
| "./thunk": "./build/package/thunk.js", | ||
| "./tovnode": "./build/package/tovnode.js", | ||
| "./vnode": "./build/package/vnode.js" | ||
| "homepage": "https://github.com/snabbdom/snabbdom#readme", | ||
| "repository": { | ||
| "type": "git", | ||
| "url": "git+https://github.com/snabbdom/snabbdom.git" | ||
| }, | ||
| "keywords": [ | ||
| "virtual", | ||
| "dom", | ||
| "light", | ||
| "kiss", | ||
| "performance" | ||
| ], | ||
| "author": "Simon Friis Vindum", | ||
| "license": "MIT", | ||
| "bugs": { | ||
| "url": "https://github.com/snabbdom/snabbdom/issues" | ||
| }, | ||
| "engines": { | ||
| "node": ">=8.3.0" | ||
| }, | ||
| "main": "build/snabbdom.cjs.js", | ||
| "module": "build/index.js", | ||
| "sideEffects": false, | ||
| "scripts": { | ||
| "build": "tsc && npm run bundle:cjs", | ||
| "bundle:cjs": "rollup build/index.js --format cjs --file build/snabbdom.cjs.js", | ||
| "format": "prettier --write .", | ||
| "prepare": "husky install", | ||
| "lint": "eslint --ext .ts,.tsx,.js --ignore-path .gitignore .", | ||
| "unit": "cross-env FILES_PATTERN=\"test/unit/*.ts,test/unit/*.tsx\" karma start karma.conf.js", | ||
| "benchmark": "cross-env FILES_PATTERN=\"test-bundles/benchmark/**/*.js\" karma start karma.conf.cjs --concurrency=1", | ||
| "release": "release-it", | ||
| "test:ci": "npm test && cross-env ES5=true npm run unit", | ||
| "test": "npm run build && npm run lint && npm run unit" | ||
| }, | ||
| "devDependencies": { | ||
| "@babel/core": "7.11.6", | ||
| "@babel/preset-env": "7.11.5", | ||
| "@commitlint/cli": "11.0.0", | ||
| "@commitlint/config-conventional": "11.0.0", | ||
| "@commitlint/travis-cli": "11.0.0", | ||
| "@types/chai": "4.2.12", | ||
| "@types/faker": "5.1.0", | ||
| "@release-it/conventional-changelog": "^2.0.1", | ||
| "@types/chai": "4.2.15", | ||
| "@types/faker": "5.1.7", | ||
| "@types/lodash.shuffle": "4.2.6", | ||
| "@types/mathjs": "6.0.5", | ||
| "@types/mocha": "8.0.3", | ||
| "@typescript-eslint/eslint-plugin": "4.1.0", | ||
| "babel-loader": "8.1.0", | ||
| "@types/mathjs": "6.0.11", | ||
| "@types/mocha": "8.2.2", | ||
| "@typescript-eslint/eslint-plugin": "4.19.0", | ||
| "@typescript-eslint/parser": "^4.19.0", | ||
| "benchmark": "2.1.4", | ||
| "chai": "4.2.0", | ||
| "chai": "4.3.4", | ||
| "chalk": "4.1.0", | ||
| "core-js": "3.6.5", | ||
| "cross-env": "7.0.2", | ||
| "editorconfig-checker": "3.2.0", | ||
| "eslint": "7.9.0", | ||
| "eslint-config-standard-with-typescript": "19.0.1", | ||
| "eslint-plugin-import": "2.22.0", | ||
| "eslint-plugin-markdown": "2.0.0-rc.0", | ||
| "commithelper": "^1.1.1", | ||
| "conventional-changelog-angular": "^5.0.12", | ||
| "core-js": "3.9.1", | ||
| "cross-env": "7.0.3", | ||
| "eslint": "7.23.0", | ||
| "eslint-config-prettier": "^8.1.0", | ||
| "eslint-plugin-import": "2.22.1", | ||
| "eslint-plugin-markdown": "2.0.0", | ||
| "eslint-plugin-node": "11.1.0", | ||
| "eslint-plugin-promise": "4.2.1", | ||
| "eslint-plugin-standard": "4.0.1", | ||
| "faker": "5.1.0", | ||
| "globby": "11.0.1", | ||
| "husky": "4.3.0", | ||
| "is-path-inside": "3.0.2", | ||
| "karma": "5.2.2", | ||
| "faker": "5.5.1", | ||
| "husky": "5.2.0", | ||
| "karma": "6.3.1", | ||
| "karma-browserstack-launcher": "1.6.0", | ||
| "karma-chrome-launcher": "3.1.0", | ||
| "karma-firefox-launcher": "1.3.0", | ||
| "karma-firefox-launcher": "2.1.0", | ||
| "karma-mocha": "2.0.1", | ||
| "karma-mocha-reporter": "2.2.5", | ||
| "latest-snabbdom-release": "npm:snabbdom@2.0.0", | ||
| "karma-typescript": "^5.5.1", | ||
| "latest-snabbdom-release": "npm:snabbdom@2.1.0", | ||
| "lint-staged": "^10.5.4", | ||
| "lodash.shuffle": "4.2.0", | ||
| "mathjs": "7.2.0", | ||
| "meow": "7.1.1", | ||
| "mocha": "8.1.3", | ||
| "nodegit": "0.27.0", | ||
| "npm-run-all": "4.1.5", | ||
| "mathjs": "9.3.0", | ||
| "mocha": "8.3.2", | ||
| "p-map-series": "2.1.0", | ||
| "p-reduce": "2.1.0", | ||
| "regenerator-runtime": "0.13.7", | ||
| "remark-cli": "8.0.1", | ||
| "remark-toc": "7.0.0", | ||
| "standard-version": "9.0.0", | ||
| "tsconfigs": "5.0.0", | ||
| "prettier": "^2.2.1", | ||
| "release-it": "^14.5.0", | ||
| "rollup": "^2.43.1", | ||
| "tty-table": "4.1.3", | ||
| "ttypescript": "1.5.12", | ||
| "typescript": "4.0.2", | ||
| "webpack": "4.44.1", | ||
| "webpack-cli": "3.3.12" | ||
| "typescript": "4.2.3" | ||
| }, | ||
| "scripts": { | ||
| "mark-pr-head-as-trusted": "node --unhandled-rejections=strict mark-pr-head-as-trusted.cjs", | ||
| "docs": "remark . --output", | ||
| "check-clean": "git diff --exit-code", | ||
| "lint:js": "eslint --ext .ts,.tsx,.cjs,.md,.mjs --ignore-path .gitignore .", | ||
| "lint:editorconfig": "editorconfig-checker", | ||
| "lint": "run-s lint:editorconfig lint:js", | ||
| "unit": "cross-env FILES_PATTERN=\"test-bundles/unit/**/*.js\" karma start karma.conf.cjs", | ||
| "benchmark": "cross-env FILES_PATTERN=\"test-bundles/benchmark/**/*.js\" karma start karma.conf.cjs --concurrency=1", | ||
| "make-release-commit": "standard-version", | ||
| "test": "run-s lint compile bundle-tests unit", | ||
| "compile": "ttsc --build src/test/tsconfig.json", | ||
| "bundle-tests": "webpack --config tests.webpack.config.cjs", | ||
| "prepublishOnly": "npm run compile" | ||
| "prettier": {}, | ||
| "lint-staged": { | ||
| "*.(ts|tsx|js|md)": "prettier --write" | ||
| }, | ||
| "repository": { | ||
| "type": "git", | ||
| "url": "git+https://github.com/snabbdom/snabbdom.git" | ||
| "release-it": { | ||
| "git": { | ||
| "commitMessage": "chore(release): v${version}" | ||
| }, | ||
| "github": { | ||
| "release": true | ||
| }, | ||
| "plugins": { | ||
| "@release-it/conventional-changelog": { | ||
| "preset": "angular", | ||
| "infile": "CHANGELOG.md" | ||
| } | ||
| } | ||
| }, | ||
| "keywords": [ | ||
| "virtual", | ||
| "dom", | ||
| "light", | ||
| "kiss", | ||
| "performance" | ||
| ], | ||
| "author": "Simon Friis Vindum", | ||
| "license": "MIT", | ||
| "bugs": { | ||
| "url": "https://github.com/snabbdom/snabbdom/issues" | ||
| }, | ||
| "remarkConfig": { | ||
| "plugins": [ | ||
| [ | ||
| "toc", | ||
| { | ||
| "tight": true | ||
| } | ||
| "commithelper": { | ||
| "scopeOverrides": { | ||
| "chore": [ | ||
| "tools", | ||
| "refactor", | ||
| "release", | ||
| "test", | ||
| "deps", | ||
| "docs", | ||
| "examples" | ||
| ] | ||
| ], | ||
| "settings": { | ||
| "listItemIndent": "1", | ||
| "bullet": "*", | ||
| "tablePipeAlign": false | ||
| } | ||
| }, | ||
| "homepage": "https://github.com/snabbdom/snabbdom#readme", | ||
| "husky": { | ||
| "hooks": { | ||
| "commit-msg": "commitlint --config commitlint.config.json -E HUSKY_GIT_PARAMS", | ||
| "pre-commit": "run-s docs check-clean test" | ||
| } | ||
| }, | ||
| "files": [ | ||
| "/build/package/h.d.ts", | ||
| "/build/package/h.js", | ||
| "/build/package/h.js.map", | ||
| "/build/package/helpers/attachto.d.ts", | ||
| "/build/package/helpers/attachto.js", | ||
| "/build/package/helpers/attachto.js.map", | ||
| "/build/package/hooks.d.ts", | ||
| "/build/package/hooks.js", | ||
| "/build/package/hooks.js.map", | ||
| "/build/package/htmldomapi.d.ts", | ||
| "/build/package/htmldomapi.js", | ||
| "/build/package/htmldomapi.js.map", | ||
| "/build/package/init.d.ts", | ||
| "/build/package/init.js", | ||
| "/build/package/init.js.map", | ||
| "/build/package/is.d.ts", | ||
| "/build/package/is.js", | ||
| "/build/package/is.js.map", | ||
| "/build/package/jsx-global.d.ts", | ||
| "/build/package/jsx.d.ts", | ||
| "/build/package/jsx.js", | ||
| "/build/package/jsx.js.map", | ||
| "/build/package/modules/attributes.d.ts", | ||
| "/build/package/modules/attributes.js", | ||
| "/build/package/modules/attributes.js.map", | ||
| "/build/package/modules/class.d.ts", | ||
| "/build/package/modules/class.js", | ||
| "/build/package/modules/class.js.map", | ||
| "/build/package/modules/dataset.d.ts", | ||
| "/build/package/modules/dataset.js", | ||
| "/build/package/modules/dataset.js.map", | ||
| "/build/package/modules/eventlisteners.d.ts", | ||
| "/build/package/modules/eventlisteners.js", | ||
| "/build/package/modules/eventlisteners.js.map", | ||
| "/build/package/modules/hero.d.ts", | ||
| "/build/package/modules/hero.js", | ||
| "/build/package/modules/hero.js.map", | ||
| "/build/package/modules/module.d.ts", | ||
| "/build/package/modules/module.js", | ||
| "/build/package/modules/module.js.map", | ||
| "/build/package/modules/props.d.ts", | ||
| "/build/package/modules/props.js", | ||
| "/build/package/modules/props.js.map", | ||
| "/build/package/modules/style.d.ts", | ||
| "/build/package/modules/style.js", | ||
| "/build/package/modules/style.js.map", | ||
| "/build/package/thunk.d.ts", | ||
| "/build/package/thunk.js", | ||
| "/build/package/thunk.js.map", | ||
| "/build/package/tovnode.d.ts", | ||
| "/build/package/tovnode.js", | ||
| "/build/package/tovnode.js.map", | ||
| "/build/package/vnode.d.ts", | ||
| "/build/package/vnode.js", | ||
| "/build/package/vnode.js.map", | ||
| "/src/package/h.ts", | ||
| "/src/package/helpers/attachto.ts", | ||
| "/src/package/hooks.ts", | ||
| "/src/package/htmldomapi.ts", | ||
| "/src/package/init.ts", | ||
| "/src/package/is.ts", | ||
| "/src/package/jsx-global.ts", | ||
| "/src/package/jsx.ts", | ||
| "/src/package/modules/attributes.ts", | ||
| "/src/package/modules/class.ts", | ||
| "/src/package/modules/dataset.ts", | ||
| "/src/package/modules/eventlisteners.ts", | ||
| "/src/package/modules/hero.ts", | ||
| "/src/package/modules/module.ts", | ||
| "/src/package/modules/props.ts", | ||
| "/src/package/modules/style.ts", | ||
| "/src/package/thunk.ts", | ||
| "/src/package/tovnode.ts", | ||
| "/src/package/vnode.ts" | ||
| ] | ||
| } | ||
| } |
680
README.md
@@ -1,2 +0,2 @@ | ||
| <img alt="Snabbdom" src="logo.png" width="356px"> | ||
| <img alt="Snabbdom" src="readme-title.svg" width="356px"> | ||
@@ -6,3 +6,3 @@ A virtual DOM library with focus on simplicity, modularity, powerful features | ||
| * * * | ||
| --- | ||
@@ -20,3 +20,3 @@ [](https://opensource.org/licenses/MIT) | ||
| * * * | ||
| --- | ||
@@ -42,23 +42,23 @@ ## Introduction | ||
| * Core features | ||
| * About 200 SLOC – you could easily read through the entire core and fully | ||
| - Core features | ||
| - About 200 SLOC – you could easily read through the entire core and fully | ||
| understand how it works. | ||
| * Extendable through modules. | ||
| * A rich set of hooks available, both per vnode and globally for modules, | ||
| - Extendable through modules. | ||
| - A rich set of hooks available, both per vnode and globally for modules, | ||
| to hook into any part of the diff and patch process. | ||
| * Splendid performance. Snabbdom is among the fastest virtual DOM libraries. | ||
| * Patch function with a function signature equivalent to a reduce/scan | ||
| function. Allows for easier integration with a FRP library. | ||
| * Features in modules | ||
| * `h` function for easily creating virtual DOM nodes. | ||
| * [SVG _just works_ with the `h` helper](#svg). | ||
| * Features for doing complex CSS animations. | ||
| * Powerful event listener functionality. | ||
| * [Thunks](#thunks) to optimize the diff and patch process even further. | ||
| * Third party features | ||
| * JSX support thanks to [snabbdom-pragma](https://github.com/Swizz/snabbdom-pragma). | ||
| * Server-side HTML output provided by [snabbdom-to-html](https://github.com/acstll/snabbdom-to-html). | ||
| * Compact virtual DOM creation with [snabbdom-helpers](https://github.com/krainboltgreene/snabbdom-helpers). | ||
| * Template string support using [snabby](https://github.com/jamen/snabby). | ||
| * Virtual DOM assertion with [snabbdom-looks-like](https://github.com/jvanbruegge/snabbdom-looks-like) | ||
| - Splendid performance. Snabbdom is among the fastest virtual DOM libraries. | ||
| - Patch function with a function signature equivalent to a reduce/scan | ||
| function. Allows for easier integration with a FRP library. | ||
| - Features in modules | ||
| - `h` function for easily creating virtual DOM nodes. | ||
| - [SVG _just works_ with the `h` helper](#svg). | ||
| - Features for doing complex CSS animations. | ||
| - Powerful event listener functionality. | ||
| - [Thunks](#thunks) to optimize the diff and patch process even further. | ||
| - [JSX support, including TypeScript types](#jsx) | ||
| - Third party features | ||
| - Server-side HTML output provided by [snabbdom-to-html](https://github.com/acstll/snabbdom-to-html). | ||
| - Compact virtual DOM creation with [snabbdom-helpers](https://github.com/krainboltgreene/snabbdom-helpers). | ||
| - Template string support using [snabby](https://github.com/jamen/snabby). | ||
| - Virtual DOM assertion with [snabbdom-looks-like](https://github.com/jvanbruegge/snabbdom-looks-like) | ||
@@ -68,10 +68,13 @@ ## Example | ||
| ```mjs | ||
| import { init } from 'snabbdom/init' | ||
| import { classModule } from 'snabbdom/modules/class' | ||
| import { propsModule } from 'snabbdom/modules/props' | ||
| import { styleModule } from 'snabbdom/modules/style' | ||
| import { eventListenersModule } from 'snabbdom/modules/eventlisteners' | ||
| import { h } from 'snabbdom/h' // helper function for creating vnodes | ||
| import { | ||
| init, | ||
| classModule, | ||
| propsModule, | ||
| styleModule, | ||
| eventListenersModule, | ||
| h, | ||
| } from "snabbdom"; | ||
| var patch = init([ // Init patch function with chosen modules | ||
| const patch = init([ | ||
| // Init patch function with chosen modules | ||
| classModule, // makes it easy to toggle classes | ||
@@ -81,21 +84,29 @@ propsModule, // for setting properties on DOM elements | ||
| eventListenersModule, // attaches event listeners | ||
| ]) | ||
| ]); | ||
| var container = document.getElementById('container') | ||
| const container = document.getElementById("container"); | ||
| var vnode = h('div#container.two.classes', { on: { click: someFn } }, [ | ||
| h('span', { style: { fontWeight: 'bold' } }, 'This is bold'), | ||
| ' and this is just normal text', | ||
| h('a', { props: { href: '/foo' } }, 'I\'ll take you places!') | ||
| ]) | ||
| const vnode = h("div#container.two.classes", { on: { click: someFn } }, [ | ||
| h("span", { style: { fontWeight: "bold" } }, "This is bold"), | ||
| " and this is just normal text", | ||
| h("a", { props: { href: "/foo" } }, "I'll take you places!"), | ||
| ]); | ||
| // Patch into empty DOM element – this modifies the DOM as a side effect | ||
| patch(container, vnode) | ||
| patch(container, vnode); | ||
| var newVnode = h('div#container.two.classes', { on: { click: anotherEventHandler } }, [ | ||
| h('span', { style: { fontWeight: 'normal', fontStyle: 'italic' } }, 'This is now italic type'), | ||
| ' and this is still just normal text', | ||
| h('a', { props: { href: '/bar' } }, 'I\'ll take you places!') | ||
| ]) | ||
| const newVnode = h( | ||
| "div#container.two.classes", | ||
| { on: { click: anotherEventHandler } }, | ||
| [ | ||
| h( | ||
| "span", | ||
| { style: { fontWeight: "normal", fontStyle: "italic" } }, | ||
| "This is now italic type" | ||
| ), | ||
| " and this is still just normal text", | ||
| h("a", { props: { href: "/bar" } }, "I'll take you places!"), | ||
| ] | ||
| ); | ||
| // Second `patch` invocation | ||
| patch(vnode, newVnode) // Snabbdom efficiently updates the old view to the new state | ||
| patch(vnode, newVnode); // Snabbdom efficiently updates the old view to the new state | ||
| ``` | ||
@@ -105,48 +116,51 @@ | ||
| * [Animated reordering of elements](http://snabbdom.github.io/snabbdom/examples/reorder-animation/) | ||
| * [Hero transitions](http://snabbdom.github.io/snabbdom/examples/hero/) | ||
| * [SVG Carousel](http://snabbdom.github.io/snabbdom/examples/carousel-svg/) | ||
| - [Animated reordering of elements](http://snabbdom.github.io/snabbdom/examples/reorder-animation/) | ||
| - [Hero transitions](http://snabbdom.github.io/snabbdom/examples/hero/) | ||
| - [SVG Carousel](http://snabbdom.github.io/snabbdom/examples/carousel-svg/) | ||
| * * * | ||
| --- | ||
| ## Table of contents | ||
| * [Core documentation](#core-documentation) | ||
| * [`init`](#init) | ||
| * [`patch`](#patch) | ||
| * [Unmounting](#unmounting) | ||
| * [`snabbdom/h`](#snabbdomh) | ||
| * [`snabbdom/tovnode`](#snabbdomtovnode) | ||
| * [Hooks](#hooks) | ||
| * [Overview](#overview) | ||
| * [Usage](#usage) | ||
| * [The `init` hook](#the-init-hook) | ||
| * [The `insert` hook](#the-insert-hook) | ||
| * [The `remove` hook](#the-remove-hook) | ||
| * [The `destroy` hook](#the-destroy-hook) | ||
| * [Creating modules](#creating-modules) | ||
| * [Modules documentation](#modules-documentation) | ||
| * [The class module](#the-class-module) | ||
| * [The props module](#the-props-module) | ||
| * [The attributes module](#the-attributes-module) | ||
| * [The dataset module](#the-dataset-module) | ||
| * [The style module](#the-style-module) | ||
| * [Custom properties (CSS variables)](#custom-properties-css-variables) | ||
| * [Delayed properties](#delayed-properties) | ||
| * [Set properties on `remove`](#set-properties-on-remove) | ||
| * [Set properties on `destroy`](#set-properties-on-destroy) | ||
| * [The eventlisteners module](#the-eventlisteners-module) | ||
| * [SVG](#svg) | ||
| * [Classes in SVG Elements](#classes-in-svg-elements) | ||
| * [Thunks](#thunks) | ||
| * [Virtual Node](#virtual-node) | ||
| * [sel : String](#sel--string) | ||
| * [data : Object](#data--object) | ||
| * [children : Array<vnode>](#children--arrayvnode) | ||
| * [text : string](#text--string) | ||
| * [elm : Element](#elm--element) | ||
| * [key : string | number](#key--string--number) | ||
| * [Structuring applications](#structuring-applications) | ||
| * [Common errors](#common-errors) | ||
| * [Opportunity for community feedback](#opportunity-for-community-feedback) | ||
| - [Core documentation](#core-documentation) | ||
| - [`init`](#init) | ||
| - [`patch`](#patch) | ||
| - [Unmounting](#unmounting) | ||
| - [`h`](#h) | ||
| - [`tovnode`](#tovnode) | ||
| - [Hooks](#hooks) | ||
| - [Overview](#overview) | ||
| - [Usage](#usage) | ||
| - [The `init` hook](#the-init-hook) | ||
| - [The `insert` hook](#the-insert-hook) | ||
| - [The `remove` hook](#the-remove-hook) | ||
| - [The `destroy` hook](#the-destroy-hook) | ||
| - [Creating modules](#creating-modules) | ||
| - [Modules documentation](#modules-documentation) | ||
| - [The class module](#the-class-module) | ||
| - [The props module](#the-props-module) | ||
| - [The attributes module](#the-attributes-module) | ||
| - [The dataset module](#the-dataset-module) | ||
| - [The style module](#the-style-module) | ||
| - [Custom properties (CSS variables)](#custom-properties-css-variables) | ||
| - [Delayed properties](#delayed-properties) | ||
| - [Set properties on `remove`](#set-properties-on-remove) | ||
| - [Set properties on `destroy`](#set-properties-on-destroy) | ||
| - [The eventlisteners module](#the-eventlisteners-module) | ||
| - [SVG](#svg) | ||
| - [Classes in SVG Elements](#classes-in-svg-elements) | ||
| - [Thunks](#thunks) | ||
| - [JSX](#jsx) | ||
| - [TypeScript](#typescript) | ||
| - [Babel](#babel) | ||
| - [Virtual Node](#virtual-node) | ||
| - [sel : String](#sel--string) | ||
| - [data : Object](#data--object) | ||
| - [children : Array<vnode>](#children--arrayvnode) | ||
| - [text : string](#text--string) | ||
| - [elm : Element](#elm--element) | ||
| - [key : string | number](#key--string--number) | ||
| - [Structuring applications](#structuring-applications) | ||
| - [Common errors](#common-errors) | ||
| - [Opportunity for community feedback](#opportunity-for-community-feedback) | ||
@@ -166,6 +180,5 @@ ## Core documentation | ||
| ```mjs | ||
| import { classModule } from 'snabbdom/modules/class' | ||
| import { styleModule } from 'snabbdom/modules/style' | ||
| import { classModule, styleModule } from "snabbdom"; | ||
| var patch = init([classModule, styleModule]) | ||
| const patch = init([classModule, styleModule]); | ||
| ``` | ||
@@ -191,3 +204,3 @@ | ||
| ```mjs | ||
| patch(oldVnode, newVnode) | ||
| patch(oldVnode, newVnode); | ||
| ``` | ||
@@ -200,3 +213,12 @@ | ||
| ```mjs | ||
| patch(oldVnode, h('!', { hooks: { post: () => { /* patch complete */ } } })) | ||
| patch( | ||
| oldVnode, | ||
| h("!", { | ||
| hooks: { | ||
| post: () => { | ||
| /* patch complete */ | ||
| }, | ||
| }, | ||
| }) | ||
| ); | ||
| ``` | ||
@@ -206,5 +228,5 @@ | ||
| ### `snabbdom/h` | ||
| ### `h` | ||
| It is recommended that you use `snabbdom/h` to create vnodes. `h` accepts a | ||
| It is recommended that you use `h` to create vnodes. It accepts a | ||
| tag/selector as a string, an optional data object and an optional string or | ||
@@ -214,25 +236,28 @@ array of children. | ||
| ```mjs | ||
| import { h } from 'snabbdom/h' | ||
| import { h } from "snabbdom"; | ||
| var vnode = h('div', { style: { color: '#000' } }, [ | ||
| h('h1', 'Headline'), | ||
| h('p', 'A paragraph'), | ||
| ]) | ||
| const vnode = h("div", { style: { color: "#000" } }, [ | ||
| h("h1", "Headline"), | ||
| h("p", "A paragraph"), | ||
| ]); | ||
| ``` | ||
| ### `snabbdom/tovnode` | ||
| ### `tovnode` | ||
| Converts a DOM node into a virtual node. Especially good for patching over an pre-existing, | ||
| Converts a DOM node into a virtual node. Especially good for patching over an pre-existing, | ||
| server-side generated content. | ||
| ```mjs | ||
| import { init } from 'snabbdom/init' | ||
| import { classModule } from 'snabbdom/modules/class' | ||
| import { propsModule } from 'snabbdom/modules/props' | ||
| import { styleModule } from 'snabbdom/modules/style' | ||
| import { eventListenersModule } from 'snabbdom/modules/eventlisteners' | ||
| import { h } from 'snabbdom/h' // helper function for creating vnodes | ||
| import { toVNode } from 'snabbdom/tovnode' | ||
| import { | ||
| init, | ||
| classModule, | ||
| propsModule, | ||
| styleModule, | ||
| eventListenersModule, | ||
| h, | ||
| toVNode, | ||
| } from "snabbdom"; | ||
| var patch = init([ // Init patch function with chosen modules | ||
| const patch = init([ | ||
| // Init patch function with chosen modules | ||
| classModule, // makes it easy to toggle classes | ||
@@ -242,10 +267,10 @@ propsModule, // for setting properties on DOM elements | ||
| eventListenersModule, // attaches event listeners | ||
| ]) | ||
| ]); | ||
| var newVNode = h('div', { style: { color: '#000' } }, [ | ||
| h('h1', 'Headline'), | ||
| h('p', 'A paragraph'), | ||
| ]) | ||
| const newVNode = h("div", { style: { color: "#000" } }, [ | ||
| h("h1", "Headline"), | ||
| h("p", "A paragraph"), | ||
| ]); | ||
| patch(toVNode(document.querySelector('.container')), newVNode) | ||
| patch(toVNode(document.querySelector(".container")), newVNode); | ||
| ``` | ||
@@ -262,14 +287,14 @@ | ||
| | Name | Triggered when | Arguments to callback | | ||
| | - | - | - | | ||
| | `pre` | the patch process begins | none | | ||
| | `init` | a vnode has been added | `vnode` | | ||
| | `create` | a DOM element has been created based on a vnode | `emptyVnode, vnode` | | ||
| | `insert` | an element has been inserted into the DOM | `vnode` | | ||
| | `prepatch` | an element is about to be patched | `oldVnode, vnode` | | ||
| | `update` | an element is being updated | `oldVnode, vnode` | | ||
| | `postpatch` | an element has been patched | `oldVnode, vnode` | | ||
| | `destroy` | an element is directly or indirectly being removed | `vnode` | | ||
| | `remove` | an element is directly being removed from the DOM | `vnode, removeCallback` | | ||
| | `post` | the patch process is done | none | | ||
| | Name | Triggered when | Arguments to callback | | ||
| | ----------- | -------------------------------------------------- | ----------------------- | | ||
| | `pre` | the patch process begins | none | | ||
| | `init` | a vnode has been added | `vnode` | | ||
| | `create` | a DOM element has been created based on a vnode | `emptyVnode, vnode` | | ||
| | `insert` | an element has been inserted into the DOM | `vnode` | | ||
| | `prepatch` | an element is about to be patched | `oldVnode, vnode` | | ||
| | `update` | an element is being updated | `oldVnode, vnode` | | ||
| | `postpatch` | an element has been patched | `oldVnode, vnode` | | ||
| | `destroy` | an element is directly or indirectly being removed | `vnode` | | ||
| | `remove` | an element is directly being removed from the DOM | `vnode, removeCallback` | | ||
| | `post` | the patch process is done | none | | ||
@@ -289,8 +314,10 @@ The following hooks are available for modules: `pre`, `create`, | ||
| ```mjs | ||
| h('div.row', { | ||
| h("div.row", { | ||
| key: movie.rank, | ||
| hook: { | ||
| insert: (vnode) => { movie.elmHeight = vnode.elm.offsetHeight } | ||
| } | ||
| }) | ||
| insert: (vnode) => { | ||
| movie.elmHeight = vnode.elm.offsetHeight; | ||
| }, | ||
| }, | ||
| }); | ||
| ``` | ||
@@ -336,6 +363,6 @@ | ||
| ```mjs | ||
| var vnode1 = h('div', [h('div', [h('span', 'Hello')])]) | ||
| var vnode2 = h('div', []) | ||
| patch(container, vnode1) | ||
| patch(vnode1, vnode2) | ||
| const vnode1 = h("div", [h("div", [h("span", "Hello")])]); | ||
| const vnode2 = h("div", []); | ||
| patch(container, vnode1); | ||
| patch(vnode1, vnode2); | ||
| ``` | ||
@@ -357,3 +384,3 @@ | ||
| ```mjs | ||
| var myModule = { | ||
| const myModule = { | ||
| create: function (oldVnode, vnode) { | ||
@@ -364,4 +391,4 @@ // invoked whenever a new virtual node is created | ||
| // invoked whenever a virtual node is updated | ||
| } | ||
| } | ||
| }, | ||
| }; | ||
| ``` | ||
@@ -385,3 +412,3 @@ | ||
| ```mjs | ||
| h('a', { class: { active: true, selected: false } }, 'Toggle') | ||
| h("a", { class: { active: true, selected: false } }, "Toggle"); | ||
| ``` | ||
@@ -394,3 +421,3 @@ | ||
| ```mjs | ||
| h('a', { props: { href: '/foo' } }, 'Go to Foo') | ||
| h("a", { props: { href: "/foo" } }, "Go to Foo"); | ||
| ``` | ||
@@ -411,3 +438,3 @@ | ||
| ```mjs | ||
| h('a', { attrs: { href: '/foo' } }, 'Go to Foo') | ||
| h("a", { attrs: { href: "/foo" } }, "Go to Foo"); | ||
| ``` | ||
@@ -435,3 +462,3 @@ | ||
| ```mjs | ||
| h('button', { dataset: { action: 'reset' } }, 'Reset') | ||
| h("button", { dataset: { action: "reset" } }, "Reset"); | ||
| ``` | ||
@@ -445,5 +472,13 @@ | ||
| ```mjs | ||
| h('span', { | ||
| style: { border: '1px solid #bada55', color: '#c0ffee', fontWeight: 'bold' } | ||
| }, 'Say my name, and every colour illuminates') | ||
| h( | ||
| "span", | ||
| { | ||
| style: { | ||
| border: "1px solid #bada55", | ||
| color: "#c0ffee", | ||
| fontWeight: "bold", | ||
| }, | ||
| }, | ||
| "Say my name, and every colour illuminates" | ||
| ); | ||
| ``` | ||
@@ -456,5 +491,9 @@ | ||
| ```mjs | ||
| h('div', { | ||
| style: { position: shouldFollow ? 'fixed' : '' } | ||
| }, 'I, I follow, I follow you') | ||
| h( | ||
| "div", | ||
| { | ||
| style: { position: shouldFollow ? "fixed" : "" }, | ||
| }, | ||
| "I, I follow, I follow you" | ||
| ); | ||
| ``` | ||
@@ -468,5 +507,9 @@ | ||
| ```mjs | ||
| h('div', { | ||
| style: { '--warnColor': 'yellow' } | ||
| }, 'Warning') | ||
| h( | ||
| "div", | ||
| { | ||
| style: { "--warnColor": "yellow" }, | ||
| }, | ||
| "Warning" | ||
| ); | ||
| ``` | ||
@@ -480,5 +523,13 @@ | ||
| ```mjs | ||
| h('span', { | ||
| style: { opacity: '0', transition: 'opacity 1s', delayed: { opacity: '1' } } | ||
| }, 'Imma fade right in!') | ||
| h( | ||
| "span", | ||
| { | ||
| style: { | ||
| opacity: "0", | ||
| transition: "opacity 1s", | ||
| delayed: { opacity: "1" }, | ||
| }, | ||
| }, | ||
| "Imma fade right in!" | ||
| ); | ||
| ``` | ||
@@ -498,9 +549,13 @@ | ||
| ```mjs | ||
| h('span', { | ||
| style: { | ||
| opacity: '1', | ||
| transition: 'opacity 1s', | ||
| remove: { opacity: '0' } | ||
| } | ||
| }, 'It\'s better to fade out than to burn away') | ||
| h( | ||
| "span", | ||
| { | ||
| style: { | ||
| opacity: "1", | ||
| transition: "opacity 1s", | ||
| remove: { opacity: "0" }, | ||
| }, | ||
| }, | ||
| "It's better to fade out than to burn away" | ||
| ); | ||
| ``` | ||
@@ -515,9 +570,13 @@ | ||
| ```mjs | ||
| h('span', { | ||
| style: { | ||
| opacity: '1', | ||
| transition: 'opacity 1s', | ||
| destroy: { opacity: '0' } | ||
| } | ||
| }, 'It\'s better to fade out than to burn away') | ||
| h( | ||
| "span", | ||
| { | ||
| style: { | ||
| opacity: "1", | ||
| transition: "opacity 1s", | ||
| destroy: { opacity: "0" }, | ||
| }, | ||
| }, | ||
| "It's better to fade out than to burn away" | ||
| ); | ||
| ``` | ||
@@ -538,6 +597,6 @@ | ||
| ```mjs | ||
| function clickHandler (ev) { | ||
| console.log('got clicked') | ||
| function clickHandler(ev) { | ||
| console.log("got clicked"); | ||
| } | ||
| h('div', { on: { click: clickHandler } }) | ||
| h("div", { on: { click: clickHandler } }); | ||
| ``` | ||
@@ -559,10 +618,10 @@ | ||
| ```mjs | ||
| function clickHandler (number) { | ||
| console.log('button ' + number + ' was clicked!') | ||
| function clickHandler(number) { | ||
| console.log("button " + number + " was clicked!"); | ||
| } | ||
| h('div', [ | ||
| h('a', { on: { click: [clickHandler, 1] } }), | ||
| h('a', { on: { click: [clickHandler, 2] } }), | ||
| h('a', { on: { click: [clickHandler, 3] } }), | ||
| ]) | ||
| h("div", [ | ||
| h("a", { on: { click: [clickHandler, 1] } }), | ||
| h("a", { on: { click: [clickHandler, 2] } }), | ||
| h("a", { on: { click: [clickHandler, 3] } }), | ||
| ]); | ||
| ``` | ||
@@ -574,9 +633,9 @@ | ||
| stopPropagation = function (ev) { | ||
| ev.stopPropagation() | ||
| } | ||
| ev.stopPropagation(); | ||
| }; | ||
| sendValue = function (func, ev, vnode) { | ||
| func(vnode.elm.value) | ||
| } | ||
| func(vnode.elm.value); | ||
| }; | ||
| h('a', { on: { click: [[sendValue, console.log], stopPropagation] } }) | ||
| h("a", { on: { click: [[sendValue, console.log], stopPropagation] } }); | ||
| ``` | ||
@@ -597,19 +656,21 @@ | ||
| // Does not work | ||
| var sharedHandler = { | ||
| change: function (e) { console.log('you chose: ' + e.target.value) } | ||
| } | ||
| h('div', [ | ||
| h('input', { | ||
| props: { type: 'radio', name: 'test', value: '0' }, | ||
| on: sharedHandler | ||
| const sharedHandler = { | ||
| change: function (e) { | ||
| console.log("you chose: " + e.target.value); | ||
| }, | ||
| }; | ||
| h("div", [ | ||
| h("input", { | ||
| props: { type: "radio", name: "test", value: "0" }, | ||
| on: sharedHandler, | ||
| }), | ||
| h('input', { | ||
| props: { type: 'radio', name: 'test', value: '1' }, | ||
| on: sharedHandler | ||
| h("input", { | ||
| props: { type: "radio", name: "test", value: "1" }, | ||
| on: sharedHandler, | ||
| }), | ||
| h('input', { | ||
| props: { type: 'radio', name: 'test', value: '2' }, | ||
| on: sharedHandler | ||
| }) | ||
| ]) | ||
| h("input", { | ||
| props: { type: "radio", name: "test", value: "2" }, | ||
| on: sharedHandler, | ||
| }), | ||
| ]); | ||
| ``` | ||
@@ -622,19 +683,19 @@ | ||
| // Works | ||
| var sharedHandler = function (e) { | ||
| console.log('you chose: ' + e.target.value) | ||
| } | ||
| h('div', [ | ||
| h('input', { | ||
| props: { type: 'radio', name: 'test', value: '0' }, | ||
| on: { change: sharedHandler } | ||
| const sharedHandler = function (e) { | ||
| console.log("you chose: " + e.target.value); | ||
| }; | ||
| h("div", [ | ||
| h("input", { | ||
| props: { type: "radio", name: "test", value: "0" }, | ||
| on: { change: sharedHandler }, | ||
| }), | ||
| h('input', { | ||
| props: { type: 'radio', name: 'test', value: '1' }, | ||
| on: { change: sharedHandler } | ||
| h("input", { | ||
| props: { type: "radio", name: "test", value: "1" }, | ||
| on: { change: sharedHandler }, | ||
| }), | ||
| h('input', { | ||
| props: { type: 'radio', name: 'test', value: '2' }, | ||
| on: { change: sharedHandler } | ||
| }) | ||
| ]) | ||
| h("input", { | ||
| props: { type: "radio", name: "test", value: "2" }, | ||
| on: { change: sharedHandler }, | ||
| }), | ||
| ]); | ||
| ``` | ||
@@ -649,7 +710,16 @@ | ||
| ```mjs | ||
| var vnode = h('div', [ | ||
| h('svg', { attrs: { width: 100, height: 100 } }, [ | ||
| h('circle', { attrs: { cx: 50, cy: 50, r: 40, stroke: 'green', 'stroke-width': 4, fill: 'yellow' } }) | ||
| ]) | ||
| ]) | ||
| const vnode = h("div", [ | ||
| h("svg", { attrs: { width: 100, height: 100 } }, [ | ||
| h("circle", { | ||
| attrs: { | ||
| cx: 50, | ||
| cy: 50, | ||
| r: 40, | ||
| stroke: "green", | ||
| "stroke-width": 4, | ||
| fill: "yellow", | ||
| }, | ||
| }), | ||
| ]), | ||
| ]); | ||
| ``` | ||
@@ -686,4 +756,4 @@ | ||
| ```mjs | ||
| function numberView (n) { | ||
| return h('div', 'Number is: ' + n) | ||
| function numberView(n) { | ||
| return h("div", "Number is: " + n); | ||
| } | ||
@@ -698,4 +768,4 @@ ``` | ||
| ```mjs | ||
| function render (state) { | ||
| return thunk('num', numberView, [state.number]) | ||
| function render(state) { | ||
| return thunk("num", numberView, [state.number]); | ||
| } | ||
@@ -714,2 +784,58 @@ ``` | ||
| ## JSX | ||
| ### TypeScript | ||
| Add the following options to your `tsconfig.json`: | ||
| ```json | ||
| { | ||
| "compilerOptions": { | ||
| "jsx": "react", | ||
| "jsxFactory": "jsx" | ||
| } | ||
| } | ||
| ``` | ||
| Then make sure that you use the `.tsx` file extension and import the `jsx` function at the top of the file: | ||
| ```tsx | ||
| import { jsx, VNode } from "snabbdom"; | ||
| const node: VNode = ( | ||
| <div> | ||
| <span>I was created with JSX</span> | ||
| </div> | ||
| ); | ||
| ``` | ||
| ### Babel | ||
| Add the following options to your babel configuration: | ||
| ```json | ||
| { | ||
| "plugins": [ | ||
| [ | ||
| "@babel/plugin-transform-react-jsx", | ||
| { | ||
| "pragma": "jsx" | ||
| } | ||
| ] | ||
| ] | ||
| } | ||
| ``` | ||
| Then make sure that you use the `.jsx` file extension and import the `jsx` function at the top of the file: | ||
| ```jsx | ||
| import { jsx } from "snabbdom"; | ||
| const node = ( | ||
| <div> | ||
| <span>I was created with JSX</span> | ||
| </div> | ||
| ); | ||
| ``` | ||
| ## Virtual Node | ||
@@ -719,8 +845,8 @@ | ||
| * [sel](#sel--string) | ||
| * [data](#data--object) | ||
| * [children](#children--array) | ||
| * [text](#text--string) | ||
| * [elm](#elm--element) | ||
| * [key](#key--string--number) | ||
| - [sel](#sel--string) | ||
| - [data](#data--object) | ||
| - [children](#children--array) | ||
| - [text](#text--string) | ||
| - [elm](#elm--element) | ||
| - [key](#key--string--number) | ||
@@ -730,4 +856,3 @@ ### sel : String | ||
| The `.sel` property of a virtual node is the CSS selector passed to | ||
| [`h()`](#snabbdomh) during creation. For example: `h('div#container', | ||
| {}, [...])` will create a a virtual node which has `div#container` as | ||
| [`h()`](#snabbdomh) during creation. For example: `h('div#container', {}, [...])` will create a a virtual node which has `div#container` as | ||
| its `.sel` property. | ||
@@ -749,5 +874,5 @@ | ||
| props: { | ||
| className: 'container' | ||
| } | ||
| }) | ||
| className: "container", | ||
| }, | ||
| }); | ||
| ``` | ||
@@ -770,10 +895,10 @@ | ||
| { | ||
| sel: 'h1', | ||
| sel: "h1", | ||
| data: {}, | ||
| children: undefined, | ||
| text: 'Hello, World', | ||
| text: "Hello, World", | ||
| elm: Element, | ||
| key: undefined, | ||
| } | ||
| ] | ||
| }, | ||
| ]; | ||
| ``` | ||
@@ -822,28 +947,29 @@ | ||
| * [functional-frontend-architecture](https://github.com/paldepind/functional-frontend-architecture) – | ||
| - [functional-frontend-architecture](https://github.com/paldepind/functional-frontend-architecture) – | ||
| a repository containing several example applications that | ||
| demonstrates an architecture that uses Snabbdom. | ||
| * [Cycle.js](https://cycle.js.org/) – | ||
| "A functional and reactive JavaScript framework for cleaner code" | ||
| uses Snabbdom | ||
| * [Vue.js](http://vuejs.org/) use a fork of snabbdom. | ||
| * [scheme-todomvc](https://github.com/amirouche/scheme-todomvc/) build | ||
| redux-like architecture on top of snabbdom bindings. | ||
| * [kaiju](https://github.com/AlexGalays/kaiju) - | ||
| - [Cycle.js](https://cycle.js.org/) – | ||
| "A functional and reactive JavaScript framework for cleaner code" | ||
| uses Snabbdom | ||
| - [Vue.js](http://vuejs.org/) use a fork of snabbdom. | ||
| - [scheme-todomvc](https://github.com/amirouche/scheme-todomvc/) build | ||
| redux-like architecture on top of snabbdom bindings. | ||
| - [kaiju](https://github.com/AlexGalays/kaiju) - | ||
| Stateful components and observables on top of snabbdom | ||
| * [Tweed](https://tweedjs.github.io) – | ||
| - [Tweed](https://tweedjs.github.io) – | ||
| An Object Oriented approach to reactive interfaces. | ||
| * [Cyclow](http://cyclow.js.org) - | ||
| - [Cyclow](http://cyclow.js.org) - | ||
| "A reactive frontend framework for JavaScript" | ||
| uses Snabbdom | ||
| * [Tung](https://github.com/Reon90/tung) – | ||
| - [Tung](https://github.com/Reon90/tung) – | ||
| A JavaScript library for rendering html. Tung helps to divide html and JavaScript development. | ||
| * [sprotty](https://github.com/theia-ide/sprotty) - "A web-based diagramming framework" uses Snabbdom. | ||
| * [Mark Text](https://github.com/marktext/marktext) - "Realtime preview Markdown Editor" build on Snabbdom. | ||
| * [puddles](https://github.com/flintinatux/puddles) - | ||
| - [sprotty](https://github.com/theia-ide/sprotty) - "A web-based diagramming framework" uses Snabbdom. | ||
| - [Mark Text](https://github.com/marktext/marktext) - "Realtime preview Markdown Editor" build on Snabbdom. | ||
| - [puddles](https://github.com/flintinatux/puddles) - | ||
| "Tiny vdom app framework. Pure Redux. No boilerplate." - Built with :heart: on Snabbdom. | ||
| * [Backbone.VDOMView](https://github.com/jcbrand/backbone.vdomview) - A [Backbone](http://backbonejs.org/) View with VirtualDOM capability via Snabbdom. | ||
| * [Rosmaro Snabbdom starter](https://github.com/lukaszmakuch/rosmaro-snabbdom-starter) - Building user interfaces with state machines and Snabbdom. | ||
| * [Pureact](https://github.com/irony/pureact) - "65 lines implementation of React incl Redux and hooks with only one dependency - Snabbdom" | ||
| * [Snabberb](https://github.com/tobymao/snabberb) - A minimalistic Ruby framework using [Opal](https://github.com/opal/opal) and Snabbdom for building reactive views. | ||
| - [Backbone.VDOMView](https://github.com/jcbrand/backbone.vdomview) - A [Backbone](http://backbonejs.org/) View with VirtualDOM capability via Snabbdom. | ||
| - [Rosmaro Snabbdom starter](https://github.com/lukaszmakuch/rosmaro-snabbdom-starter) - Building user interfaces with state machines and Snabbdom. | ||
| - [Pureact](https://github.com/irony/pureact) - "65 lines implementation of React incl Redux and hooks with only one dependency - Snabbdom" | ||
| - [Snabberb](https://github.com/tobymao/snabberb) - A minimalistic Ruby framework using [Opal](https://github.com/opal/opal) and Snabbdom for building reactive views. | ||
| - [WebCell](https://github.com/EasyWebApp/WebCell) - Web Components engine based on JSX & TypeScript | ||
@@ -863,15 +989,15 @@ Be sure to share it if you're building an application in another way | ||
| ```mjs | ||
| var sharedNode = h('div', {}, 'Selected') | ||
| var vnode1 = h('div', [ | ||
| h('div', {}, ['One']), | ||
| h('div', {}, ['Two']), | ||
| h('div', {}, [sharedNode]), | ||
| ]) | ||
| var vnode2 = h('div', [ | ||
| h('div', {}, ['One']), | ||
| h('div', {}, [sharedNode]), | ||
| h('div', {}, ['Three']), | ||
| ]) | ||
| patch(container, vnode1) | ||
| patch(vnode1, vnode2) | ||
| const sharedNode = h("div", {}, "Selected"); | ||
| const vnode1 = h("div", [ | ||
| h("div", {}, ["One"]), | ||
| h("div", {}, ["Two"]), | ||
| h("div", {}, [sharedNode]), | ||
| ]); | ||
| const vnode2 = h("div", [ | ||
| h("div", {}, ["One"]), | ||
| h("div", {}, [sharedNode]), | ||
| h("div", {}, ["Three"]), | ||
| ]); | ||
| patch(container, vnode1); | ||
| patch(vnode1, vnode2); | ||
| ``` | ||
@@ -882,7 +1008,7 @@ | ||
| ```mjs | ||
| var vnode2 = h('div', [ | ||
| h('div', {}, ['One']), | ||
| h('div', {}, [{ ...sharedNode }]), | ||
| h('div', {}, ['Three']), | ||
| ]) | ||
| const vnode2 = h("div", [ | ||
| h("div", {}, ["One"]), | ||
| h("div", {}, [{ ...sharedNode }]), | ||
| h("div", {}, ["Three"]), | ||
| ]); | ||
| ``` | ||
@@ -893,8 +1019,8 @@ | ||
| ```mjs | ||
| var sharedNode = () => h('div', {}, 'Selected') | ||
| var vnode1 = h('div', [ | ||
| h('div', {}, ['One']), | ||
| h('div', {}, ['Two']), | ||
| h('div', {}, [sharedNode()]), | ||
| ]) | ||
| const sharedNode = () => h("div", {}, "Selected"); | ||
| const vnode1 = h("div", [ | ||
| h("div", {}, ["One"]), | ||
| h("div", {}, ["Two"]), | ||
| h("div", {}, [sharedNode()]), | ||
| ]); | ||
| ``` | ||
@@ -901,0 +1027,0 @@ |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
New author
Supply chain riskA new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.
Found 1 instance in 1 package
Environment variable access
Supply chain riskPackage accesses environment variables, which may be a sign of credential stuffing or data theft.
Found 5 instances in 1 package
Fixed alerts
License Policy Violation
LicenseThis 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
- increased by121.54%
419733
- Dev dependency count
- decreased by-24.07%
41
- Number of package files
- increased by55.13%
121
- Lines of code
- increased by245.3%
8712
- Number of lines in readme file
- increased by14.62%
988
Worsened metrics
- Number of low supply chain risk alerts
- increased byInfinity%
6
- Number of medium supply chain risk alerts
- increased byInfinity%
2
- Is type module
No
No dependency changes