feat: export everything from 'snabbdom'

ISSUES CLOSED: #913, #748
BREAKING CHANGE:
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
pull/948/head
Jan van Brügge 4 years ago
parent a1e505370d
commit 7af7e3f684
No known key found for this signature in database
GPG Key ID: 88E0BF7B7A546481

@ -62,12 +62,7 @@ performance, small size and all the features listed below.
## 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';
const patch = init([ // Init patch function with chosen modules
classModule, // makes it easy to toggle classes
@ -109,8 +104,8 @@ patch(vnode, newVnode) // Snabbdom efficiently updates the old view to the new s
* [`init`](#init)
* [`patch`](#patch)
* [Unmounting](#unmounting)
* [`snabbdom/h`](#snabbdomh)
* [`snabbdom/tovnode`](#snabbdomtovnode)
* [`h`](#h)
* [`tovnode`](#tovnode)
* [Hooks](#hooks)
* [Overview](#overview)
* [Usage](#usage)
@ -157,8 +152,7 @@ takes a list of modules and returns a `patch` function that uses the
specified set of modules.
```mjs
import { classModule } from 'snabbdom/modules/class'
import { styleModule } from 'snabbdom/modules/style'
import { classModule, styleModule } from 'snabbdom'
const patch = init([classModule, styleModule])
```
@ -194,14 +188,14 @@ patch(oldVnode, h('!', { hooks: { post: () => { /* patch complete */ } } }))
Of course, then there is still a single comment node at the mount point.
### `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
array of children.
```mjs
import { h } from 'snabbdom/h'
import { h } from 'snabbdom'
const vnode = h('div', { style: { color: '#000' } }, [
h('h1', 'Headline'),
@ -209,19 +203,13 @@ const vnode = h('div', { style: { color: '#000' } }, [
])
```
### `snabbdom/tovnode`
### `tovnode`
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'
const patch = init([ // Init patch function with chosen modules
classModule, // makes it easy to toggle classes

@ -2,27 +2,7 @@
"name": "snabbdom",
"version": "2.1.0",
"description": "A virtual DOM library with focus on simplicity, modularity, powerful features and performance.",
"type": "module",
"exports": {
"./init": "./build/init.js",
"./h": "./build/h.js",
"./helpers/attachto": "./build/helpers/attachto.js",
"./hooks": "./build/hooks.js",
"./htmldomapi": "./build/htmldomapi.js",
"./is": "./build/is.js",
"./jsx": "./build/jsx.js",
"./modules/attributes": "./build/modules/attributes.js",
"./modules/class": "./build/modules/class.js",
"./modules/dataset": "./build/modules/dataset.js",
"./modules/eventlisteners": "./build/modules/eventlisteners.js",
"./modules/hero": "./build/modules/hero.js",
"./modules/module": "./build/modules/module.js",
"./modules/props": "./build/modules/props.js",
"./modules/style": "./build/modules/style.js",
"./thunk": "./build/thunk.js",
"./tovnode": "./build/tovnode.js",
"./vnode": "./build/vnode.js"
},
"module": "build/index.js",
"devDependencies": {
"@babel/core": "7.12.16",
"@babel/preset-env": "7.12.16",

@ -0,0 +1,30 @@
// core
export { DOMAPI, htmlDomApi } from './htmldomapi';
export { init } from './init';
export { ThunkData, Thunk, ThunkFn, thunk } from './thunk';
export { Key, VNode, VNodeData, vnode } from './vnode';
// helpers
export { AttachData, attachTo } from './helpers/attachto';
export { array, primitive } from './is';
export { toVNode } from './tovnode';
export {
VNodes,
VNodeChildElement,
ArrayOrElement,
VNodeChildren,
h,
} from './h';
// types
export * from './hooks';
export { Module } from './modules/module';
// modules
export { Attrs, attributesModule } from './modules/attributes';
export { Classes, classModule } from './modules/class';
export { Dataset, datasetModule } from './modules/dataset';
export { On, eventListenersModule } from './modules/eventlisteners';
export { Hero, heroModule } from './modules/hero';
export { Props, propsModule } from './modules/props';
export { VNodeStyle, styleModule } from './modules/style';

@ -9,5 +9,5 @@
"target": "es6",
"outDir": "build"
},
"include": ["./src/**/*"]
"include": ["./src/index.ts"]
}

Loading…
Cancel
Save