Skip to content

Commit 20c8fff

Browse files
TechQueryTechQuery
committed
[fix] several Type bugs
[optimize] upgrade SnabbDOM & other packages
1 parent 5da6c97 commit 20c8fff

7 files changed

Lines changed: 87 additions & 71 deletions

File tree

‎package.json‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "web-cell",
3-
"version": "2.1.0",
3+
"version": "2.1.2",
44
"description": "Web Components engine based on JSX & TypeScript",
55
"keywords": [
66
"web",
@@ -25,15 +25,15 @@
2525
"peerDependencies": {
2626
"@webcomponents/webcomponentsjs": "^2.4.3",
2727
"core-js": "^3.6.5",
28-
"jsdom": "^16.2.2",
29-
"web-utility": "^1.5.2"
28+
"jsdom": "^16.3.0",
29+
"web-utility": "^1.6.1"
3030
},
3131
"devDependencies": {
3232
"@types/core-js": "^2.5.3",
33-
"@types/jest": "^25.2.3",
33+
"@types/jest": "^26.0.4",
3434
"@types/jsdom": "^16.2.3",
35-
"@typescript-eslint/parser": "^3.4.0",
36-
"eslint": "^7.3.1",
35+
"@typescript-eslint/parser": "^3.6.1",
36+
"eslint": "^7.4.0",
3737
"eslint-config-prettier": "^6.11.0",
3838
"eslint-plugin-prettier": "^3.1.4",
3939
"husky": "^4.2.5",
@@ -42,11 +42,11 @@
4242
"open-cli": "^6.0.1",
4343
"parcel-bundler": "^1.12.4",
4444
"prettier": "^2.0.5",
45-
"snabbdom": "^0.7.4",
46-
"ts-jest": "^26.1.1",
47-
"typedoc": "^0.17.7",
48-
"typescript": "^3.9.5",
49-
"web-utility": "^1.5.2"
45+
"snabbdom": "^1.0.1",
46+
"ts-jest": "^26.1.2",
47+
"typedoc": "^0.17.8",
48+
"typescript": "^3.9.6",
49+
"web-utility": "^1.6.1"
5050
},
5151
"scripts": {
5252
"lint": "lint-staged",

‎source/WebCell.tsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ export interface WebCellClass<P extends WebCellProps = WebCellProps, S = {}>
6565

6666
export function mixin<P = WebCellProps, S = {}>(
6767
superClass = HTMLElement
68-
): WebCellClass {
68+
): WebCellClass<P, S> {
6969
class WebCell extends superClass implements WebCellComponent<P, S> {
7070
static tagName: string;
7171
static extends?: string;
@@ -92,7 +92,7 @@ export function mixin<P = WebCellProps, S = {}>(
9292
super();
9393

9494
const { renderTarget, eventDelegaters, style } = this
95-
.constructor as WebCellClass;
95+
.constructor as WebCellClass<P, S>;
9696

9797
const renderChildren = renderTarget === 'children';
9898

@@ -125,7 +125,7 @@ export function mixin<P = WebCellProps, S = {}>(
125125
}
126126

127127
render(props: P, state: S) {
128-
return (this.constructor as WebCellClass).renderTarget !==
128+
return (this.constructor as WebCellClass<P, S>).renderTarget !==
129129
'children' ? (
130130
<slot />
131131
) : (
@@ -186,7 +186,7 @@ export function mixin<P = WebCellProps, S = {}>(
186186
setProps(data: Partial<P>) {
187187
Object.assign(this.props, data);
188188

189-
const { attributes } = this.constructor as WebCellClass;
189+
const { attributes } = this.constructor as WebCellClass<P, S>;
190190

191191
if (attributes)
192192
var attributesChanged = new Promise<void>(resolve =>
@@ -204,10 +204,10 @@ export function mixin<P = WebCellProps, S = {}>(
204204
return this.updateAsync();
205205
}
206206

207-
setAttribute(name: string, value: string | number | boolean) {
207+
setAttribute(name: string, value: string) {
208208
super.setAttribute(name, value);
209209

210-
const { attributes } = this.constructor as WebCellClass;
210+
const { attributes } = this.constructor as WebCellClass<P, S>;
211211

212212
if (!attributes.includes(name)) return;
213213

‎source/decorator.ts‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,9 @@
1-
import { CSSObject, stringifyCSS, toHyphenCase } from './utility';
1+
import {
2+
CSSObject,
3+
stringifyCSS,
4+
toHyphenCase,
5+
DelegateEventHandler
6+
} from './utility';
27
import { WebCellClass, WebCellComponent } from './WebCell';
38

49
export interface ComponentMeta {
@@ -57,11 +62,16 @@ export interface DOMEventDelegater {
5762
}
5863

5964
export function on(type: string, selector: string) {
60-
return ({ constructor }: Object, method: string) => {
65+
return <T extends DelegateEventHandler>(
66+
{ constructor }: Object,
67+
method: string,
68+
meta: PropertyDescriptor
69+
) => {
6170
(constructor as WebCellClass).eventDelegaters.push({
6271
type,
6372
selector,
6473
method
6574
});
75+
return meta as PropertyDescriptor & { value: T };
6676
};
6777
}

‎source/renderer.ts‎

Lines changed: 18 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
1-
import { init } from 'snabbdom/src/snabbdom';
2-
import AttrsHelper from 'snabbdom/src/modules/attributes';
3-
import PropsHelper from 'snabbdom/src/modules/props';
4-
import DataHelper from 'snabbdom/src/modules/dataset';
5-
import ClassHelper from 'snabbdom/src/modules/class';
6-
import StyleHelper from 'snabbdom/src/modules/style';
7-
import EventHelper from 'snabbdom/src/modules/eventlisteners';
8-
import { VNode } from 'snabbdom/src/vnode';
9-
import toVNode from 'snabbdom/src/tovnode';
10-
import createElement, { VNodeChildElement } from 'snabbdom/src/h';
1+
import { init } from 'snabbdom/src/package/init';
2+
import { attributesModule } from 'snabbdom/src/package/modules/attributes';
3+
import { propsModule } from 'snabbdom/src/package/modules/props';
4+
import { datasetModule } from 'snabbdom/src/package/modules/dataset';
5+
import { classModule } from 'snabbdom/src/package/modules/class';
6+
import { styleModule } from 'snabbdom/src/package/modules/style';
7+
import { eventListenersModule } from 'snabbdom/src/package/modules/eventlisteners';
8+
import { VNode } from 'snabbdom/src/package/vnode';
9+
import { toVNode } from 'snabbdom/src/package/tovnode';
10+
import { VNodeChildElement, h as createElement } from 'snabbdom/src/package/h';
1111

1212
import {
1313
WebCellElement,
@@ -18,16 +18,16 @@ import {
1818
} from './utility';
1919
import { WebCellClass } from './WebCell';
2020

21-
export { VNode } from 'snabbdom/src/vnode';
22-
export { VNodeChildElement } from 'snabbdom/src/h';
21+
export { VNode } from 'snabbdom/src/package/vnode';
22+
export { VNodeChildElement } from 'snabbdom/src/package/h';
2323

2424
export const patch = init([
25-
AttrsHelper,
26-
PropsHelper,
27-
DataHelper,
28-
ClassHelper,
29-
StyleHelper,
30-
EventHelper
25+
attributesModule,
26+
propsModule,
27+
datasetModule,
28+
classModule,
29+
styleModule,
30+
eventListenersModule
3131
]);
3232

3333
function createVTree(root: ParentNode & Node, nodes: WebCellElement) {

‎source/utility/event.ts‎

Lines changed: 34 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,34 @@
1-
export type DelegateEventHandler = (
2-
event: Event,
3-
currentTarget: Element,
4-
detail: any
5-
) => any;
6-
7-
export function delegate(selector: string, handler: DelegateEventHandler) {
8-
return function(this: Node, event: Event) {
9-
var node,
10-
path = event.composedPath();
11-
12-
while ((node = path.shift()) && node !== event.currentTarget)
13-
if (node instanceof HTMLElement && node.matches(selector))
14-
return handler.call(
15-
this,
16-
event,
17-
node,
18-
(event as CustomEvent).detail
19-
);
20-
};
21-
}
22-
23-
export const documentReady = new Promise(resolve => {
24-
document.addEventListener('DOMContentLoaded', resolve);
25-
26-
self.addEventListener('load', resolve);
27-
28-
setTimeout(function check() {
29-
document.readyState === 'complete' ? resolve() : setTimeout(check);
30-
});
31-
});
1+
export type DelegateEventHandler<T = any> = (
2+
event: Event,
3+
currentTarget: Element,
4+
detail?: T
5+
) => any;
6+
7+
export function delegate<T>(
8+
selector: string,
9+
handler: DelegateEventHandler<T>
10+
) {
11+
return function (this: Node, event: Event) {
12+
var node,
13+
path = event.composedPath();
14+
15+
while ((node = path.shift()) && node !== event.currentTarget)
16+
if (node instanceof HTMLElement && node.matches(selector))
17+
return handler.call(
18+
this,
19+
event,
20+
node,
21+
(event as CustomEvent).detail
22+
);
23+
};
24+
}
25+
26+
export const documentReady = new Promise(resolve => {
27+
document.addEventListener('DOMContentLoaded', resolve);
28+
29+
self.addEventListener('load', resolve);
30+
31+
setTimeout(function check() {
32+
document.readyState === 'complete' ? resolve() : setTimeout(check);
33+
});
34+
});

‎source/utility/vDOM.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { HTMLProps } from 'web-utility/source/DOM-type';
2-
import { VNodeChildElement } from 'snabbdom/src/h';
2+
import { VNodeChildElement } from 'snabbdom/src/package/h';
33

44
export interface WebCellData extends HTMLProps {
55
key?: string | number;

‎test/Class.spec.tsx‎

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -101,8 +101,11 @@ describe('Class & Decorator', () => {
101101
name: string;
102102

103103
@on('click', 'h2')
104-
onClick(event: MouseEvent, target: HTMLElement, detail: any) {
105-
this.name = [event.type, target.tagName, detail] + '';
104+
onClick(
105+
{ type, detail }: CustomEvent<number>,
106+
{ tagName }: HTMLHeadingElement
107+
) {
108+
this.name = [type, tagName, detail] + '';
106109
}
107110

108111
render() {

0 commit comments

Comments
 (0)