Skip to content

Commit 98db17d

Browse files
developitdevelopit
committed
Add hooks and polyfill subpackages
1 parent 9982f7c commit 98db17d

File tree

9 files changed

+78
-138
lines changed

9 files changed

+78
-138
lines changed

‎.gitignore‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
1-
/dist
2-
/polyfill.js
3-
/polyfill.js.map
4-
/node_modules
5-
/npm-debug.log
1+
dist
2+
node_modules
3+
npm-debug.log
64
package-lock.json
75
.DS_Store

‎hook/index.js‎

Lines changed: 13 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -2,24 +2,19 @@ import delve from 'dlv';
22
import { useState, useCallback } from 'preact/hooks';
33

44
export default function useLinkState(initialState, eventPath) {
5-
const [state, setState] = useState(initialState);
5+
const [state, setState] = useState(initialState);
66

7-
const linkState = useCallback(
8-
e => {
9-
const t = (e && e.target) || this,
10-
v =
11-
typeof eventPath === 'string'
12-
? delve(e, eventPath)
13-
: t.nodeName
14-
? t.type.match(/^che|rad/)
15-
? t.checked
16-
: t.value
17-
: e;
7+
const linkState = useCallback(function(e) {
8+
const t = (e && e.target) || this;
9+
const v = typeof eventPath === 'string'
10+
? delve(e, eventPath)
11+
: (t && t.nodeName)
12+
? t.type.match(/^che|rad/)
13+
? t.checked
14+
: t.value
15+
: e;
16+
setState(v);
17+
}, [eventPath]);
1818

19-
setState(v);
20-
},
21-
[setState, eventPath]
22-
);
23-
24-
return [state, linkState, setState];
19+
return [state, linkState, setState];
2520
}

‎hook/package.json‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"name": "linkstate_hook",
3+
"main": "./dist/hook.js",
4+
"module": "./dist/hook.module.js",
5+
"peerDependencies": {
6+
"preact": "*",
7+
"linkstate": "*"
8+
}
9+
}

‎package.json‎

Lines changed: 31 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -3,24 +3,21 @@
33
"amdName": "linkState",
44
"version": "1.1.1",
55
"description": "Bind events to state. Works with Preact and React.",
6-
"main": "dist/linkstate.js",
7-
"module": "dist/linkstate.es.js",
8-
"jsnext:main": "dist/linkstate.es.js",
9-
"umd:main": "dist/linkstate.umd.js",
6+
"main": "./dist/linkstate.js",
7+
"module": "./dist/linkstate.module.js",
8+
"umd:main": "./dist/linkstate.umd.js",
9+
"unpkg": "./dist/linkstate.umd.js",
10+
"exports": {
11+
".": "./dist/linkstate.module.js",
12+
"./polyfill": "./dist/polyfill.module.js",
13+
"./hook": "./dist/hook.module.js",
14+
"./": "./"
15+
},
1016
"scripts": {
11-
"test": "eslint src test && mocha -r jsdom-global/register --compilers js:babel-register test/**/*.js",
12-
"build": "npm-run-all --silent clean -p transpile:* -s size",
13-
"clean": "rimraf dist && mkdirp dist",
14-
"transpile:umd": "rollup -c --environment FORMAT:umd",
15-
"transpile:cjs": "rollup -c --environment FORMAT:cjs",
16-
"transpile:es": "rollup -c --environment FORMAT:es",
17-
"transpile:polyfill": "rollup -c --environment FORMAT:cjs src/polyfill.js -o polyfill.js",
18-
"transpile:polyfill-umd": "rollup -c --environment FORMAT:umd src/polyfill.js -o dist/polyfill.umd.js",
19-
"minify:cjs": "uglifyjs $npm_package_main -cm toplevel -o $npm_package_main -p relative --in-source-map ${npm_package_main}.map --source-map ${npm_package_main}.map",
20-
"minify:umd": "uglifyjs $npm_package_umd_main -cm -o $npm_package_umd_main -p relative --in-source-map ${npm_package_umd_main}.map --source-map ${npm_package_umd_main}.map",
21-
"size": "echo \"Gzipped Size: $(strip-json-comments --no-whitespace $npm_package_main | gzip-size)\"",
17+
"test": "eslint src test && mocha -r jsdom-global/register -r esm test/**/*.js",
18+
"build": "microbundle -f es,cjs,umd && (cd hook && microbundle -f es,cjs,umd) && (cd polyfill && microbundle -f es,cjs,umd)",
2219
"prepublish": "npm run -s build",
23-
"release": "npm run build -s && git commit -am $npm_package_version && git tag $npm_package_version && git push --follow-tags && npm publish"
20+
"release": "npm run build -s && git commit -am $npm_package_version && git tag $npm_package_version && git push && git push --tags && npm publish"
2421
},
2522
"typings": "src/index.d.ts",
2623
"repository": "developit/linkstate",
@@ -39,57 +36,31 @@
3936
"files": [
4037
"src",
4138
"dist",
42-
"polyfill.js",
43-
"polyfill.js.map"
39+
"polyfill",
40+
"hook"
4441
],
45-
"babel": {
46-
"presets": [
47-
"es2015",
48-
"stage-0"
49-
]
50-
},
5142
"eslintConfig": {
52-
"parser": "babel-eslint",
53-
"extends": "eslint:recommended",
54-
"env": {
55-
"browser": true,
56-
"mocha": true,
57-
"node": true,
58-
"es6": true
59-
},
60-
"globals": {
61-
"expect": true
43+
"extends": "developit",
44+
"rules": {
45+
"jest/valid-expect": 0
6246
}
6347
},
6448
"devDependencies": {
65-
"babel-core": "^6.9.1",
66-
"babel-eslint": "^7.1.1",
67-
"babel-preset-es2015": "^6.9.0",
68-
"babel-preset-stage-0": "^6.5.0",
69-
"babel-register": "^6.9.0",
70-
"chai": "^3.5.0",
71-
"cross-env": "^3.1.4",
49+
"chai": "^4.2.0",
7250
"dlv": "^1.1.0",
73-
"eslint": "^3.13.1",
74-
"gzip-size-cli": "^1.0.0",
75-
"jsdom": "^9.12.0",
76-
"jsdom-global": "^2.1.1",
77-
"mkdirp": "^0.5.1",
78-
"mocha": "^3.2.0",
79-
"npm-run-all": "^2.1.1",
80-
"rimraf": "^2.5.2",
81-
"rollup": "^0.41.4",
82-
"rollup-plugin-alias": "^1.2.1",
83-
"rollup-plugin-buble": "^0.15.0",
84-
"rollup-plugin-node-resolve": "^3.0.0",
85-
"rollup-plugin-post-replace": "^1.0.0",
86-
"rollup-plugin-uglify": "^1.0.1",
87-
"sinon": "^1.17.4",
88-
"sinon-chai": "^2.8.0",
89-
"strip-json-comments-cli": "^1.0.1",
90-
"uglify-js": "^2.6.2"
51+
"eslint": "^7.13.0",
52+
"eslint-config-developit": "^1.2.0",
53+
"jsdom": "^16.4.0",
54+
"jsdom-global": "^3.0.2",
55+
"microbundle": "^0.12.4",
56+
"mocha": "^8.2.1",
57+
"sinon": "^9.2.1",
58+
"sinon-chai": "^3.5.0"
9159
},
9260
"peerDependencies": {
93-
"preact": ">=10"
61+
"preact": "*"
62+
},
63+
"dependencies": {
64+
"esm": "^3.2.25"
9465
}
9566
}

src/polyfill.js renamed to polyfill/index.js

File renamed without changes.

‎polyfill/package.json‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"name": "linkstate_polyfill",
3+
"main": "./dist/polyfill.js",
4+
"module": "./dist/polyfill.module.js",
5+
"peerDependencies": {
6+
"preact": "*",
7+
"linkstate": "*"
8+
}
9+
}

‎rollup.config.js‎

Lines changed: 0 additions & 48 deletions
This file was deleted.

‎src/index.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
import delve from 'dlv';
22

3+
/** @typedef {import('preact').AnyComponent} Component */
4+
35
/** Create an Event handler function that sets a given state property.
46
* @param {Component} component The component whose state should be updated
57
* @param {string} key A dot-notated key path to update in the component's state

‎test/index.js‎

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -50,12 +50,12 @@ describe('linkstate', () => {
5050
});
5151

5252
expect(component.setState).to.have.been.calledOnce;
53-
expect(component.setState).to.have.been.calledWith({'testStateKey': 'newValue'});
53+
expect(component.setState).to.have.been.calledWith({ testStateKey: 'newValue' });
5454

5555
linkFunction.call(element);
5656

5757
expect(component.setState).to.have.been.calledTwice;
58-
expect(component.setState.secondCall).to.have.been.calledWith({'testStateKey': 'newValue'});
58+
expect(component.setState.secondCall).to.have.been.calledWith({ testStateKey: 'newValue' });
5959
});
6060

6161
it('should use checked attribute on checkbox input when no eventPath is supplied', () => {
@@ -69,7 +69,7 @@ describe('linkstate', () => {
6969
});
7070

7171
expect(component.setState).to.have.been.calledOnce;
72-
expect(component.setState).to.have.been.calledWith({'testStateKey': true});
72+
expect(component.setState).to.have.been.calledWith({ testStateKey: true });
7373
});
7474

7575
it('should use checked attribute on radio input when no eventPath is supplied', () => {
@@ -83,7 +83,7 @@ describe('linkstate', () => {
8383
});
8484

8585
expect(component.setState).to.have.been.calledOnce;
86-
expect(component.setState).to.have.been.calledWith({'testStateKey': true});
86+
expect(component.setState).to.have.been.calledWith({ testStateKey: true });
8787
});
8888

8989

@@ -93,30 +93,34 @@ describe('linkstate', () => {
9393
element.type= 'text';
9494
element.value = 'newValue';
9595

96+
// @ts-ignore-next
9697
linkFunction({
9798
currentTarget: element,
9899
target: element
99100
});
100101

101102
expect(component.setState).to.have.been.calledOnce;
102-
expect(component.setState).to.have.been.calledWith({nested: {state: {key: 'newValue'}}});
103+
expect(component.setState).to.have.been.calledWith({ nested: { state: { key: 'newValue' } } });
103104
});
104105

105106
});
106107

107108
describe('linkState with eventPath argument', () => {
108109
before( () => {
109110
linkFunction = linkState(component,'testStateKey', 'nested.path');
111+
});
112+
113+
it('should be a function', () => {
110114
expect(linkFunction).to.be.a('function');
111115
});
112116

113117
it('should give precedence to nested.path on event over nested.path on component', () => {
114-
let event = {nested: {path: 'nestedPathValueFromEvent'}};
118+
let event = { nested: { path: 'nestedPathValueFromEvent' } };
115119

116120
linkFunction.call(component, event);
117121

118122
expect(component.setState).to.have.been.calledOnce;
119-
expect(component.setState).to.have.been.calledWith({'testStateKey': 'nestedPathValueFromEvent'});
123+
expect(component.setState).to.have.been.calledWith({ testStateKey: 'nestedPathValueFromEvent' });
120124
});
121125
});
122126
});

0 commit comments

Comments
 (0)