@viewfly/platform-browser 1.0.0-alpha.2 → 1.0.0-alpha.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/{jsx-dom.d.ts → index.d.ts} +201 -63
- package/bundles/index.esm.js +7 -2
- package/bundles/index.js +7 -2
- package/package.json +8 -5
- package/rollup-d.config.ts +14 -0
- package/bundles/create-app.d.ts +0 -17
- package/bundles/create-portal.d.ts +0 -34
- package/bundles/dom-renderer.d.ts +0 -27
- package/bundles/html-renderer.d.ts +0 -56
- package/bundles/public-api.d.ts +0 -5
|
@@ -1,5 +1,142 @@
|
|
|
1
|
+
import { NativeNode, ViewFlyNode, Application, Config, NativeRenderer, JSX, ClassNames } from '@viewfly/core';
|
|
1
2
|
import * as CSS from 'csstype';
|
|
2
|
-
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* 创建一个 Viewfly 实例
|
|
6
|
+
* @param root 应用根节点
|
|
7
|
+
* @param autoUpdate 是否自动更新视图,默认为 true,当值为 false 时,Viewfly
|
|
8
|
+
* 只会首次渲染,直到手动调用 app 的 render() 方法,这在单元测试中非常有用,
|
|
9
|
+
* 我们无需等待 Viewfly 默认的异步调度,实现同步更新视图
|
|
10
|
+
* ```tsx
|
|
11
|
+
* const app = createApp(<App/>, false).mount(document.getElementById('app'))
|
|
12
|
+
*
|
|
13
|
+
* // do something...
|
|
14
|
+
*
|
|
15
|
+
* app.render() // 手动更新视图
|
|
16
|
+
* ```
|
|
17
|
+
*/
|
|
18
|
+
declare function createApp<T extends NativeNode>(root: ViewFlyNode, autoUpdate?: boolean): Application<T>;
|
|
19
|
+
declare function createApp<T extends NativeNode>(root: ViewFlyNode, config?: Partial<Omit<Config, 'root'>>): Application<T>;
|
|
20
|
+
|
|
21
|
+
/**
|
|
22
|
+
* 用于创建脱离当前 DOM 树的子节点,常用于弹窗等
|
|
23
|
+
* @param childRender
|
|
24
|
+
* @param host
|
|
25
|
+
* @example
|
|
26
|
+
* ```tsx
|
|
27
|
+
* function App() {
|
|
28
|
+
* const number = createSignal(0)
|
|
29
|
+
*
|
|
30
|
+
* setInterval(() => {
|
|
31
|
+
* number.set(number() + 1)
|
|
32
|
+
* }, 1000)
|
|
33
|
+
*
|
|
34
|
+
* const ModalPortal = function (props) {
|
|
35
|
+
* return createPortal(() => {
|
|
36
|
+
* return <div class="modal">parent data is {props.text}</div>
|
|
37
|
+
* }, document.body)
|
|
38
|
+
* }
|
|
39
|
+
* return () => {
|
|
40
|
+
* return (
|
|
41
|
+
* <div>
|
|
42
|
+
* <div>data is {number()}</div>
|
|
43
|
+
* <ModalPortal text={number()}/>
|
|
44
|
+
* </div>
|
|
45
|
+
* )
|
|
46
|
+
* }
|
|
47
|
+
* }
|
|
48
|
+
* ```
|
|
49
|
+
*/
|
|
50
|
+
declare function createPortal<T extends NativeNode>(childRender: () => ViewFlyNode, host: T): {
|
|
51
|
+
$portalHost: T;
|
|
52
|
+
$render: () => ViewFlyNode;
|
|
53
|
+
};
|
|
54
|
+
|
|
55
|
+
declare class VDOMNode {
|
|
56
|
+
parent: VDOMElement | null;
|
|
57
|
+
remove(): void;
|
|
58
|
+
}
|
|
59
|
+
declare class VDOMElement extends VDOMNode {
|
|
60
|
+
name: string;
|
|
61
|
+
props: Map<string, any>;
|
|
62
|
+
children: Array<VDOMElement | VDOMText>;
|
|
63
|
+
style: Map<string, any>;
|
|
64
|
+
className: string;
|
|
65
|
+
constructor(name: string);
|
|
66
|
+
}
|
|
67
|
+
declare class VDOMText extends VDOMNode {
|
|
68
|
+
text: string;
|
|
69
|
+
constructor(text: string);
|
|
70
|
+
}
|
|
71
|
+
/**
|
|
72
|
+
* 用于生成模拟轻量 DOM 节点的渲染器
|
|
73
|
+
*/
|
|
74
|
+
declare class HTMLRenderer extends NativeRenderer<VDOMElement, VDOMText> {
|
|
75
|
+
createElement(name: string): VDOMElement;
|
|
76
|
+
createTextNode(textContent: string): VDOMText;
|
|
77
|
+
setProperty(node: VDOMElement, key: string, value: any): void;
|
|
78
|
+
appendChild(parent: VDOMElement, newChild: VDOMElement | VDOMText): void;
|
|
79
|
+
prependChild(parent: VDOMElement, newChild: VDOMElement | VDOMText): void;
|
|
80
|
+
removeProperty(node: VDOMElement, key: string): void;
|
|
81
|
+
setStyle(target: VDOMElement, key: string, value: any): void;
|
|
82
|
+
removeStyle(target: VDOMElement, key: string): void;
|
|
83
|
+
setClass(target: VDOMElement, value: string): void;
|
|
84
|
+
listen(): void;
|
|
85
|
+
unListen(): void;
|
|
86
|
+
remove(node: VDOMElement | VDOMText): void;
|
|
87
|
+
cleanChildren(node: VDOMElement): void;
|
|
88
|
+
syncTextContent(target: VDOMText, content: string): void;
|
|
89
|
+
insertAfter(newNode: VDOMElement | VDOMText, ref: VDOMElement | VDOMText): void;
|
|
90
|
+
}
|
|
91
|
+
/**
|
|
92
|
+
* 轻量 DOM 转换为 HTML 字符串的转换器
|
|
93
|
+
*/
|
|
94
|
+
declare class OutputTranslator {
|
|
95
|
+
static singleTags: string[];
|
|
96
|
+
static simpleXSSFilter: {
|
|
97
|
+
text(text: string): string;
|
|
98
|
+
attrName(text: string): string;
|
|
99
|
+
attrValue(text: string): string;
|
|
100
|
+
};
|
|
101
|
+
private singleTagTest;
|
|
102
|
+
/**
|
|
103
|
+
* 将虚拟 DOM 转换为 HTML 字符串的方法
|
|
104
|
+
* @param vDom 虚拟 DOM 节点
|
|
105
|
+
*/
|
|
106
|
+
transform(vDom: VDOMElement): string;
|
|
107
|
+
private vDomToHTMLString;
|
|
108
|
+
private replaceEmpty;
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
declare class DomRenderer extends NativeRenderer<HTMLElement, Text> {
|
|
112
|
+
static NAMESPACES: {
|
|
113
|
+
svg: string;
|
|
114
|
+
html: string;
|
|
115
|
+
xml: string;
|
|
116
|
+
xlink: string;
|
|
117
|
+
xmlns: string;
|
|
118
|
+
};
|
|
119
|
+
propMap: Record<string, Record<string, string>>;
|
|
120
|
+
createElement(name: string, isSvg: boolean): HTMLElement;
|
|
121
|
+
createTextNode(textContent: string): Text;
|
|
122
|
+
appendChild(parent: HTMLElement, newChild: any): void;
|
|
123
|
+
prependChild(parent: HTMLElement, newChild: HTMLElement | Text): void;
|
|
124
|
+
insertAfter(newNode: HTMLElement | Text, ref: HTMLElement | Text): void;
|
|
125
|
+
remove(node: HTMLElement | Text): void;
|
|
126
|
+
cleanChildren(node: HTMLElement): void;
|
|
127
|
+
setProperty(node: HTMLElement, key: string, value: any, isSvg: boolean): void;
|
|
128
|
+
removeProperty(node: HTMLElement, key: string, isSvg: boolean): void;
|
|
129
|
+
setClass(target: HTMLElement, className: string): void;
|
|
130
|
+
setStyle(target: HTMLElement, key: string, value: any): void;
|
|
131
|
+
removeStyle(target: HTMLElement, key: string): void;
|
|
132
|
+
listen<T = any>(node: HTMLElement, type: string, callback: (ev: T) => any): void;
|
|
133
|
+
unListen(node: HTMLElement, type: string, callback: (ev: any) => any): void;
|
|
134
|
+
syncTextContent(target: Text, content: string): void;
|
|
135
|
+
private normalizedEventType;
|
|
136
|
+
private insertBefore;
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
interface CSSProperties extends CSS.Properties<string | number>, CSS.PropertiesHyphen<string | number> {
|
|
3
140
|
/**
|
|
4
141
|
* The index signature was removed to enable closed typing for style
|
|
5
142
|
* using CSSType. You're able to use type assertion or module augmentation
|
|
@@ -198,10 +335,10 @@ interface AriaAttributes {
|
|
|
198
335
|
/** Defines the human readable text alternative of aria-valuenow for a range widget. */
|
|
199
336
|
'aria-valuetext'?: string;
|
|
200
337
|
}
|
|
201
|
-
|
|
202
|
-
|
|
338
|
+
type StyleValue = string | CSSProperties | null;
|
|
339
|
+
interface HTMLAttributes<T> extends AriaAttributes, EventHandlers<Events>, JSX.RefAttributes<T> {
|
|
203
340
|
innerHTML?: string;
|
|
204
|
-
class?:
|
|
341
|
+
class?: ClassNames;
|
|
205
342
|
style?: StyleValue;
|
|
206
343
|
accesskey?: string;
|
|
207
344
|
contenteditable?: Booleanish | 'inherit';
|
|
@@ -246,7 +383,7 @@ export interface HTMLAttributes<T> extends AriaAttributes, EventHandlers<Events>
|
|
|
246
383
|
[k: string]: any;
|
|
247
384
|
}
|
|
248
385
|
type HTMLAttributeReferrerPolicy = '' | 'no-referrer' | 'no-referrer-when-downgrade' | 'origin' | 'origin-when-cross-origin' | 'same-origin' | 'strict-origin' | 'strict-origin-when-cross-origin' | 'unsafe-url';
|
|
249
|
-
|
|
386
|
+
interface AnchorHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
250
387
|
download?: any;
|
|
251
388
|
href?: string;
|
|
252
389
|
hreflang?: string;
|
|
@@ -257,7 +394,7 @@ export interface AnchorHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
|
257
394
|
type?: string;
|
|
258
395
|
referrerpolicy?: HTMLAttributeReferrerPolicy;
|
|
259
396
|
}
|
|
260
|
-
|
|
397
|
+
interface AreaHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
261
398
|
alt?: string;
|
|
262
399
|
coords?: string;
|
|
263
400
|
download?: any;
|
|
@@ -269,16 +406,16 @@ export interface AreaHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
|
269
406
|
shape?: string;
|
|
270
407
|
target?: string;
|
|
271
408
|
}
|
|
272
|
-
|
|
409
|
+
interface AudioHTMLAttributes<T> extends MediaHTMLAttributes<T> {
|
|
273
410
|
}
|
|
274
|
-
|
|
411
|
+
interface BaseHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
275
412
|
href?: string;
|
|
276
413
|
target?: string;
|
|
277
414
|
}
|
|
278
|
-
|
|
415
|
+
interface BlockquoteHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
279
416
|
cite?: string;
|
|
280
417
|
}
|
|
281
|
-
|
|
418
|
+
interface ButtonHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
282
419
|
autofocus?: Booleanish;
|
|
283
420
|
disabled?: Booleanish;
|
|
284
421
|
form?: string;
|
|
@@ -291,42 +428,42 @@ export interface ButtonHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
|
291
428
|
type?: 'submit' | 'reset' | 'button';
|
|
292
429
|
value?: string | string[] | number;
|
|
293
430
|
}
|
|
294
|
-
|
|
431
|
+
interface CanvasHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
295
432
|
height?: Numberish;
|
|
296
433
|
width?: Numberish;
|
|
297
434
|
}
|
|
298
|
-
|
|
435
|
+
interface ColHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
299
436
|
span?: Numberish;
|
|
300
437
|
width?: Numberish;
|
|
301
438
|
}
|
|
302
|
-
|
|
439
|
+
interface ColgroupHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
303
440
|
span?: Numberish;
|
|
304
441
|
}
|
|
305
|
-
|
|
442
|
+
interface DataHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
306
443
|
value?: string | string[] | number;
|
|
307
444
|
}
|
|
308
|
-
|
|
445
|
+
interface DetailsHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
309
446
|
open?: Booleanish;
|
|
310
447
|
}
|
|
311
|
-
|
|
448
|
+
interface DelHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
312
449
|
cite?: string;
|
|
313
450
|
datetime?: string;
|
|
314
451
|
}
|
|
315
|
-
|
|
452
|
+
interface DialogHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
316
453
|
open?: Booleanish;
|
|
317
454
|
}
|
|
318
|
-
|
|
455
|
+
interface EmbedHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
319
456
|
height?: Numberish;
|
|
320
457
|
src?: string;
|
|
321
458
|
type?: string;
|
|
322
459
|
width?: Numberish;
|
|
323
460
|
}
|
|
324
|
-
|
|
461
|
+
interface FieldsetHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
325
462
|
disabled?: Booleanish;
|
|
326
463
|
form?: string;
|
|
327
464
|
name?: string;
|
|
328
465
|
}
|
|
329
|
-
|
|
466
|
+
interface FormHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
330
467
|
acceptcharset?: string;
|
|
331
468
|
action?: string;
|
|
332
469
|
autocomplete?: string;
|
|
@@ -336,10 +473,10 @@ export interface FormHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
|
336
473
|
novalidate?: Booleanish;
|
|
337
474
|
target?: string;
|
|
338
475
|
}
|
|
339
|
-
|
|
476
|
+
interface HtmlHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
340
477
|
manifest?: string;
|
|
341
478
|
}
|
|
342
|
-
|
|
479
|
+
interface IframeHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
343
480
|
allow?: string;
|
|
344
481
|
allowfullscreen?: Booleanish;
|
|
345
482
|
allowtransparency?: Booleanish;
|
|
@@ -356,7 +493,7 @@ export interface IframeHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
|
356
493
|
srcdoc?: string;
|
|
357
494
|
width?: Numberish;
|
|
358
495
|
}
|
|
359
|
-
|
|
496
|
+
interface ImgHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
360
497
|
alt?: string;
|
|
361
498
|
crossorigin?: 'anonymous' | 'use-credentials' | '';
|
|
362
499
|
decoding?: 'async' | 'auto' | 'sync';
|
|
@@ -368,11 +505,11 @@ export interface ImgHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
|
368
505
|
usemap?: string;
|
|
369
506
|
width?: Numberish;
|
|
370
507
|
}
|
|
371
|
-
|
|
508
|
+
interface InsHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
372
509
|
cite?: string;
|
|
373
510
|
datetime?: string;
|
|
374
511
|
}
|
|
375
|
-
|
|
512
|
+
interface InputHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
376
513
|
accept?: string;
|
|
377
514
|
alt?: string;
|
|
378
515
|
autocomplete?: string;
|
|
@@ -407,7 +544,7 @@ export interface InputHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
|
407
544
|
value?: any;
|
|
408
545
|
width?: Numberish;
|
|
409
546
|
}
|
|
410
|
-
|
|
547
|
+
interface KeygenHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
411
548
|
autofocus?: Booleanish;
|
|
412
549
|
challenge?: string;
|
|
413
550
|
disabled?: Booleanish;
|
|
@@ -416,14 +553,14 @@ export interface KeygenHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
|
416
553
|
keyparams?: string;
|
|
417
554
|
name?: string;
|
|
418
555
|
}
|
|
419
|
-
|
|
556
|
+
interface LabelHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
420
557
|
for?: string;
|
|
421
558
|
form?: string;
|
|
422
559
|
}
|
|
423
|
-
|
|
560
|
+
interface LiHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
424
561
|
value?: string | string[] | number;
|
|
425
562
|
}
|
|
426
|
-
|
|
563
|
+
interface LinkHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
427
564
|
as?: string;
|
|
428
565
|
crossorigin?: string;
|
|
429
566
|
href?: string;
|
|
@@ -435,13 +572,13 @@ export interface LinkHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
|
435
572
|
sizes?: string;
|
|
436
573
|
type?: string;
|
|
437
574
|
}
|
|
438
|
-
|
|
575
|
+
interface MapHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
439
576
|
name?: string;
|
|
440
577
|
}
|
|
441
|
-
|
|
578
|
+
interface MenuHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
442
579
|
type?: string;
|
|
443
580
|
}
|
|
444
|
-
|
|
581
|
+
interface MediaHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
445
582
|
autoplay?: Booleanish;
|
|
446
583
|
controls?: Booleanish;
|
|
447
584
|
controlslist?: string;
|
|
@@ -453,13 +590,13 @@ export interface MediaHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
|
453
590
|
preload?: string;
|
|
454
591
|
src?: string;
|
|
455
592
|
}
|
|
456
|
-
|
|
593
|
+
interface MetaHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
457
594
|
charset?: string;
|
|
458
595
|
content?: string;
|
|
459
596
|
httpequiv?: string;
|
|
460
597
|
name?: string;
|
|
461
598
|
}
|
|
462
|
-
|
|
599
|
+
interface MeterHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
463
600
|
form?: string;
|
|
464
601
|
high?: Numberish;
|
|
465
602
|
low?: Numberish;
|
|
@@ -468,10 +605,10 @@ export interface MeterHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
|
468
605
|
optimum?: Numberish;
|
|
469
606
|
value?: string | string[] | number;
|
|
470
607
|
}
|
|
471
|
-
|
|
608
|
+
interface QuoteHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
472
609
|
cite?: string;
|
|
473
610
|
}
|
|
474
|
-
|
|
611
|
+
interface ObjectHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
475
612
|
classid?: string;
|
|
476
613
|
data?: string;
|
|
477
614
|
form?: string;
|
|
@@ -482,35 +619,35 @@ export interface ObjectHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
|
482
619
|
width?: Numberish;
|
|
483
620
|
wmode?: string;
|
|
484
621
|
}
|
|
485
|
-
|
|
622
|
+
interface OlHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
486
623
|
reversed?: Booleanish;
|
|
487
624
|
start?: Numberish;
|
|
488
625
|
type?: '1' | 'a' | 'A' | 'i' | 'I';
|
|
489
626
|
}
|
|
490
|
-
|
|
627
|
+
interface OptgroupHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
491
628
|
disabled?: Booleanish;
|
|
492
629
|
label?: string;
|
|
493
630
|
}
|
|
494
|
-
|
|
631
|
+
interface OptionHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
495
632
|
disabled?: Booleanish;
|
|
496
633
|
label?: string;
|
|
497
634
|
selected?: Booleanish;
|
|
498
635
|
value?: string;
|
|
499
636
|
}
|
|
500
|
-
|
|
637
|
+
interface OutputHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
501
638
|
for?: string;
|
|
502
639
|
form?: string;
|
|
503
640
|
name?: string;
|
|
504
641
|
}
|
|
505
|
-
|
|
642
|
+
interface ParamHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
506
643
|
name?: string;
|
|
507
644
|
value?: string | string[] | number;
|
|
508
645
|
}
|
|
509
|
-
|
|
646
|
+
interface ProgressHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
510
647
|
max?: Numberish;
|
|
511
648
|
value?: string | string[] | number;
|
|
512
649
|
}
|
|
513
|
-
|
|
650
|
+
interface ScriptHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
514
651
|
async?: Booleanish;
|
|
515
652
|
charset?: string;
|
|
516
653
|
crossorigin?: string;
|
|
@@ -522,7 +659,7 @@ export interface ScriptHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
|
522
659
|
src?: string;
|
|
523
660
|
type?: string;
|
|
524
661
|
}
|
|
525
|
-
|
|
662
|
+
interface SelectHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
526
663
|
autocomplete?: string;
|
|
527
664
|
autofocus?: Booleanish;
|
|
528
665
|
disabled?: Booleanish;
|
|
@@ -533,25 +670,25 @@ export interface SelectHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
|
533
670
|
size?: Numberish;
|
|
534
671
|
value?: string;
|
|
535
672
|
}
|
|
536
|
-
|
|
673
|
+
interface SourceHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
537
674
|
media?: string;
|
|
538
675
|
sizes?: string;
|
|
539
676
|
src?: string;
|
|
540
677
|
srcset?: string;
|
|
541
678
|
type?: string;
|
|
542
679
|
}
|
|
543
|
-
|
|
680
|
+
interface StyleHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
544
681
|
media?: string;
|
|
545
682
|
nonce?: string;
|
|
546
683
|
scoped?: Booleanish;
|
|
547
684
|
type?: string;
|
|
548
685
|
}
|
|
549
|
-
|
|
686
|
+
interface TableHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
550
687
|
cellpadding?: Numberish;
|
|
551
688
|
cellspacing?: Numberish;
|
|
552
689
|
summary?: string;
|
|
553
690
|
}
|
|
554
|
-
|
|
691
|
+
interface TextareaHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
555
692
|
autocomplete?: string;
|
|
556
693
|
autofocus?: Booleanish;
|
|
557
694
|
cols?: Numberish;
|
|
@@ -568,7 +705,7 @@ export interface TextareaHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
|
568
705
|
value?: string | string[] | number;
|
|
569
706
|
wrap?: string;
|
|
570
707
|
}
|
|
571
|
-
|
|
708
|
+
interface TdHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
572
709
|
align?: 'left' | 'center' | 'right' | 'justify' | 'char';
|
|
573
710
|
colspan?: Numberish;
|
|
574
711
|
headers?: string;
|
|
@@ -576,31 +713,31 @@ export interface TdHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
|
576
713
|
scope?: string;
|
|
577
714
|
valign?: 'top' | 'middle' | 'bottom' | 'baseline';
|
|
578
715
|
}
|
|
579
|
-
|
|
716
|
+
interface ThHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
580
717
|
align?: 'left' | 'center' | 'right' | 'justify' | 'char';
|
|
581
718
|
colspan?: Numberish;
|
|
582
719
|
headers?: string;
|
|
583
720
|
rowspan?: Numberish;
|
|
584
721
|
scope?: string;
|
|
585
722
|
}
|
|
586
|
-
|
|
723
|
+
interface TimeHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
587
724
|
datetime?: string;
|
|
588
725
|
}
|
|
589
|
-
|
|
726
|
+
interface TrackHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
590
727
|
default?: Booleanish;
|
|
591
728
|
kind?: string;
|
|
592
729
|
label?: string;
|
|
593
730
|
src?: string;
|
|
594
731
|
srclang?: string;
|
|
595
732
|
}
|
|
596
|
-
|
|
733
|
+
interface VideoHTMLAttributes<T> extends MediaHTMLAttributes<T> {
|
|
597
734
|
height?: Numberish;
|
|
598
735
|
playsinline?: Booleanish;
|
|
599
736
|
poster?: string;
|
|
600
737
|
width?: Numberish;
|
|
601
738
|
disablePictureInPicture?: Booleanish;
|
|
602
739
|
}
|
|
603
|
-
|
|
740
|
+
interface WebViewHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
604
741
|
allowfullscreen?: Booleanish;
|
|
605
742
|
allowpopups?: Booleanish;
|
|
606
743
|
autoFocus?: Booleanish;
|
|
@@ -619,13 +756,13 @@ export interface WebViewHTMLAttributes<T> extends HTMLAttributes<T> {
|
|
|
619
756
|
useragent?: string;
|
|
620
757
|
webpreferences?: string;
|
|
621
758
|
}
|
|
622
|
-
|
|
759
|
+
interface SVGAttributes<T> extends AriaAttributes, EventHandlers<Events>, JSX.RefAttributes<T> {
|
|
623
760
|
innerHTML?: string;
|
|
624
761
|
/**
|
|
625
762
|
* SVG Styling Attributes
|
|
626
763
|
* @see https://www.w3.org/TR/SVG/styling.html#ElementSpecificStyling
|
|
627
764
|
*/
|
|
628
|
-
class?:
|
|
765
|
+
class?: ClassNames;
|
|
629
766
|
style?: string | CSSProperties;
|
|
630
767
|
color?: string;
|
|
631
768
|
height?: Numberish;
|
|
@@ -878,7 +1015,7 @@ export interface SVGAttributes<T> extends AriaAttributes, EventHandlers<Events>,
|
|
|
878
1015
|
z?: Numberish;
|
|
879
1016
|
zoomAndPan?: string;
|
|
880
1017
|
}
|
|
881
|
-
|
|
1018
|
+
interface DOMElements {
|
|
882
1019
|
a: AnchorHTMLAttributes<HTMLAnchorElement>;
|
|
883
1020
|
abbr: HTMLAttributes<HTMLElement>;
|
|
884
1021
|
address: HTMLAttributes<HTMLElement>;
|
|
@@ -992,7 +1129,7 @@ export interface DOMElements {
|
|
|
992
1129
|
wbr: HTMLAttributes<HTMLElement>;
|
|
993
1130
|
webview: WebViewHTMLAttributes<HTMLElement>;
|
|
994
1131
|
}
|
|
995
|
-
|
|
1132
|
+
interface SVGElements {
|
|
996
1133
|
svg: SVGAttributes<SVGElement>;
|
|
997
1134
|
animate: SVGAttributes<SVGAnimateElement>;
|
|
998
1135
|
animateMotion: SVGAttributes<SVGAnimateMotionElement>;
|
|
@@ -1052,9 +1189,9 @@ export interface SVGElements {
|
|
|
1052
1189
|
use: SVGAttributes<SVGUseElement>;
|
|
1053
1190
|
view: SVGAttributes<SVGViewElement>;
|
|
1054
1191
|
}
|
|
1055
|
-
|
|
1192
|
+
interface NativeElements extends DOMElements, SVGElements {
|
|
1056
1193
|
}
|
|
1057
|
-
|
|
1194
|
+
interface Events {
|
|
1058
1195
|
onCopy: ClipboardEvent;
|
|
1059
1196
|
onCut: ClipboardEvent;
|
|
1060
1197
|
onPaste: ClipboardEvent;
|
|
@@ -1141,10 +1278,11 @@ export interface Events {
|
|
|
1141
1278
|
type EventHandlers<E> = {
|
|
1142
1279
|
[K in keyof E]?: E[K] extends (...args: any) => any ? E[K] : (payload: E[K]) => void;
|
|
1143
1280
|
};
|
|
1144
|
-
declare
|
|
1145
|
-
namespace
|
|
1281
|
+
declare module '@viewfly/core' {
|
|
1282
|
+
namespace JSX {
|
|
1146
1283
|
interface IntrinsicElements extends NativeElements {
|
|
1147
1284
|
}
|
|
1148
1285
|
}
|
|
1149
1286
|
}
|
|
1150
|
-
|
|
1287
|
+
|
|
1288
|
+
export { type AnchorHTMLAttributes, type AreaHTMLAttributes, type AudioHTMLAttributes, type BaseHTMLAttributes, type BlockquoteHTMLAttributes, type ButtonHTMLAttributes, type CSSProperties, type CanvasHTMLAttributes, type ColHTMLAttributes, type ColgroupHTMLAttributes, type DOMElements, type DataHTMLAttributes, type DelHTMLAttributes, type DetailsHTMLAttributes, type DialogHTMLAttributes, DomRenderer, type EmbedHTMLAttributes, type Events, type FieldsetHTMLAttributes, type FormHTMLAttributes, type HTMLAttributes, HTMLRenderer, type HtmlHTMLAttributes, type IframeHTMLAttributes, type ImgHTMLAttributes, type InputHTMLAttributes, type InsHTMLAttributes, type KeygenHTMLAttributes, type LabelHTMLAttributes, type LiHTMLAttributes, type LinkHTMLAttributes, type MapHTMLAttributes, type MediaHTMLAttributes, type MenuHTMLAttributes, type MetaHTMLAttributes, type MeterHTMLAttributes, type NativeElements, type ObjectHTMLAttributes, type OlHTMLAttributes, type OptgroupHTMLAttributes, type OptionHTMLAttributes, type OutputHTMLAttributes, OutputTranslator, type ParamHTMLAttributes, type ProgressHTMLAttributes, type QuoteHTMLAttributes, type SVGAttributes, type SVGElements, type ScriptHTMLAttributes, type SelectHTMLAttributes, type SourceHTMLAttributes, type StyleHTMLAttributes, type StyleValue, type TableHTMLAttributes, type TdHTMLAttributes, type TextareaHTMLAttributes, type ThHTMLAttributes, type TimeHTMLAttributes, type TrackHTMLAttributes, VDOMElement, VDOMNode, VDOMText, type VideoHTMLAttributes, type WebViewHTMLAttributes, createApp, createPortal };
|
package/bundles/index.esm.js
CHANGED
|
@@ -95,14 +95,19 @@ class DomRenderer extends NativeRenderer {
|
|
|
95
95
|
target.style[key] = '';
|
|
96
96
|
}
|
|
97
97
|
listen(node, type, callback) {
|
|
98
|
-
|
|
98
|
+
const normalizedType = this.normalizedEventType(type);
|
|
99
|
+
node.addEventListener(normalizedType, callback);
|
|
99
100
|
}
|
|
100
101
|
unListen(node, type, callback) {
|
|
101
|
-
|
|
102
|
+
const normalizedType = this.normalizedEventType(type);
|
|
103
|
+
node.removeEventListener(normalizedType, callback);
|
|
102
104
|
}
|
|
103
105
|
syncTextContent(target, content) {
|
|
104
106
|
target.textContent = content;
|
|
105
107
|
}
|
|
108
|
+
normalizedEventType(type) {
|
|
109
|
+
return type.substring(2).toLowerCase();
|
|
110
|
+
}
|
|
106
111
|
insertBefore(newNode, ref) {
|
|
107
112
|
if (ref.parentNode) {
|
|
108
113
|
ref.parentNode.insertBefore(newNode, ref);
|
package/bundles/index.js
CHANGED
|
@@ -97,14 +97,19 @@ class DomRenderer extends core.NativeRenderer {
|
|
|
97
97
|
target.style[key] = '';
|
|
98
98
|
}
|
|
99
99
|
listen(node, type, callback) {
|
|
100
|
-
|
|
100
|
+
const normalizedType = this.normalizedEventType(type);
|
|
101
|
+
node.addEventListener(normalizedType, callback);
|
|
101
102
|
}
|
|
102
103
|
unListen(node, type, callback) {
|
|
103
|
-
|
|
104
|
+
const normalizedType = this.normalizedEventType(type);
|
|
105
|
+
node.removeEventListener(normalizedType, callback);
|
|
104
106
|
}
|
|
105
107
|
syncTextContent(target, content) {
|
|
106
108
|
target.textContent = content;
|
|
107
109
|
}
|
|
110
|
+
normalizedEventType(type) {
|
|
111
|
+
return type.substring(2).toLowerCase();
|
|
112
|
+
}
|
|
108
113
|
insertBefore(newNode, ref) {
|
|
109
114
|
if (ref.parentNode) {
|
|
110
115
|
ref.parentNode.insertBefore(newNode, ref);
|
package/package.json
CHANGED
|
@@ -1,18 +1,20 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@viewfly/platform-browser",
|
|
3
|
-
"version": "1.0.0-alpha.
|
|
3
|
+
"version": "1.0.0-alpha.22",
|
|
4
4
|
"description": "This project is used to enable the Viewfly framework to run in a browser.",
|
|
5
5
|
"main": "./bundles/index.js",
|
|
6
6
|
"module": "./bundles/index.esm.js",
|
|
7
|
-
"typings": "./bundles/
|
|
7
|
+
"typings": "./bundles/index.d.ts",
|
|
8
8
|
"scripts": {
|
|
9
|
-
"build:lib": "rimraf bundles &&
|
|
9
|
+
"build:lib": "rimraf bundles && npm run build && npm run build-d",
|
|
10
|
+
"build": "rollup --config rollup.config.ts --configPlugin @rollup/plugin-typescript",
|
|
11
|
+
"build-d": "rollup --config rollup-d.config.ts --configPlugin @rollup/plugin-typescript",
|
|
10
12
|
"publish:lib": "npm run build:lib && npm publish --access=public"
|
|
11
13
|
},
|
|
12
14
|
"license": "MIT",
|
|
13
15
|
"keywords": [],
|
|
14
16
|
"dependencies": {
|
|
15
|
-
"@viewfly/core": "^1.0.0-alpha.
|
|
17
|
+
"@viewfly/core": "^1.0.0-alpha.22",
|
|
16
18
|
"csstype": "^3.1.2"
|
|
17
19
|
},
|
|
18
20
|
"devDependencies": {
|
|
@@ -20,6 +22,7 @@
|
|
|
20
22
|
"@rollup/plugin-typescript": "^11.1.2",
|
|
21
23
|
"rimraf": "^3.0.2",
|
|
22
24
|
"rollup": "^3.26.3",
|
|
25
|
+
"rollup-plugin-dts": "^6.1.1",
|
|
23
26
|
"tslib": "^2.6.0"
|
|
24
27
|
},
|
|
25
28
|
"author": {
|
|
@@ -33,5 +36,5 @@
|
|
|
33
36
|
"bugs": {
|
|
34
37
|
"url": "https://github.com/viewfly/viewfly.git/issues"
|
|
35
38
|
},
|
|
36
|
-
"gitHead": "
|
|
39
|
+
"gitHead": "b66ca589f7662cd518fc2e5955b3e3ff9de83f94"
|
|
37
40
|
}
|
package/bundles/create-app.d.ts
DELETED
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import { JSXNode, Application, Config, NativeNode } from '@viewfly/core';
|
|
2
|
-
/**
|
|
3
|
-
* 创建一个 Viewfly 实例
|
|
4
|
-
* @param root 应用根节点
|
|
5
|
-
* @param autoUpdate 是否自动更新视图,默认为 true,当值为 false 时,Viewfly
|
|
6
|
-
* 只会首次渲染,直到手动调用 app 的 render() 方法,这在单元测试中非常有用,
|
|
7
|
-
* 我们无需等待 Viewfly 默认的异步调度,实现同步更新视图
|
|
8
|
-
* ```tsx
|
|
9
|
-
* const app = createApp(<App/>, false).mount(document.getElementById('app'))
|
|
10
|
-
*
|
|
11
|
-
* // do something...
|
|
12
|
-
*
|
|
13
|
-
* app.render() // 手动更新视图
|
|
14
|
-
* ```
|
|
15
|
-
*/
|
|
16
|
-
export declare function createApp<T extends NativeNode>(root: JSXNode, autoUpdate?: boolean): Application<T>;
|
|
17
|
-
export declare function createApp<T extends NativeNode>(root: JSXNode, config?: Partial<Omit<Config, 'root'>>): Application<T>;
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import { JSXNode, NativeNode } from '@viewfly/core';
|
|
2
|
-
/**
|
|
3
|
-
* 用于创建脱离当前 DOM 树的子节点,常用于弹窗等
|
|
4
|
-
* @param childRender
|
|
5
|
-
* @param host
|
|
6
|
-
* @example
|
|
7
|
-
* ```tsx
|
|
8
|
-
* function App() {
|
|
9
|
-
* const number = createSignal(0)
|
|
10
|
-
*
|
|
11
|
-
* setInterval(() => {
|
|
12
|
-
* number.set(number() + 1)
|
|
13
|
-
* }, 1000)
|
|
14
|
-
*
|
|
15
|
-
* const ModalPortal = function (props) {
|
|
16
|
-
* return createPortal(() => {
|
|
17
|
-
* return <div class="modal">parent data is {props.text}</div>
|
|
18
|
-
* }, document.body)
|
|
19
|
-
* }
|
|
20
|
-
* return () => {
|
|
21
|
-
* return (
|
|
22
|
-
* <div>
|
|
23
|
-
* <div>data is {number()}</div>
|
|
24
|
-
* <ModalPortal text={number()}/>
|
|
25
|
-
* </div>
|
|
26
|
-
* )
|
|
27
|
-
* }
|
|
28
|
-
* }
|
|
29
|
-
* ```
|
|
30
|
-
*/
|
|
31
|
-
export declare function createPortal<T extends NativeNode>(childRender: () => JSXNode, host: T): {
|
|
32
|
-
$portalHost: T;
|
|
33
|
-
$render: () => JSXNode;
|
|
34
|
-
};
|
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
import { NativeRenderer } from '@viewfly/core';
|
|
2
|
-
export declare class DomRenderer extends NativeRenderer<HTMLElement, Text> {
|
|
3
|
-
static NAMESPACES: {
|
|
4
|
-
svg: string;
|
|
5
|
-
html: string;
|
|
6
|
-
xml: string;
|
|
7
|
-
xlink: string;
|
|
8
|
-
xmlns: string;
|
|
9
|
-
};
|
|
10
|
-
propMap: Record<string, Record<string, string>>;
|
|
11
|
-
createElement(name: string, isSvg: boolean): HTMLElement;
|
|
12
|
-
createTextNode(textContent: string): Text;
|
|
13
|
-
appendChild(parent: HTMLElement, newChild: any): void;
|
|
14
|
-
prependChild(parent: HTMLElement, newChild: HTMLElement | Text): void;
|
|
15
|
-
insertAfter(newNode: HTMLElement | Text, ref: HTMLElement | Text): void;
|
|
16
|
-
remove(node: HTMLElement | Text): void;
|
|
17
|
-
cleanChildren(node: HTMLElement): void;
|
|
18
|
-
setProperty(node: HTMLElement, key: string, value: any, isSvg: boolean): void;
|
|
19
|
-
removeProperty(node: HTMLElement, key: string, isSvg: boolean): void;
|
|
20
|
-
setClass(target: HTMLElement, className: string): void;
|
|
21
|
-
setStyle(target: HTMLElement, key: string, value: any): void;
|
|
22
|
-
removeStyle(target: HTMLElement, key: string): void;
|
|
23
|
-
listen<T = any>(node: HTMLElement, type: string, callback: (ev: T) => any): void;
|
|
24
|
-
unListen(node: HTMLElement, type: string, callback: (ev: any) => any): void;
|
|
25
|
-
syncTextContent(target: Text, content: string): void;
|
|
26
|
-
private insertBefore;
|
|
27
|
-
}
|
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
import { NativeRenderer } from '@viewfly/core';
|
|
2
|
-
export declare class VDOMNode {
|
|
3
|
-
parent: VDOMElement | null;
|
|
4
|
-
remove(): void;
|
|
5
|
-
}
|
|
6
|
-
export declare class VDOMElement extends VDOMNode {
|
|
7
|
-
name: string;
|
|
8
|
-
props: Map<string, any>;
|
|
9
|
-
children: Array<VDOMElement | VDOMText>;
|
|
10
|
-
style: Map<string, any>;
|
|
11
|
-
className: string;
|
|
12
|
-
constructor(name: string);
|
|
13
|
-
}
|
|
14
|
-
export declare class VDOMText extends VDOMNode {
|
|
15
|
-
text: string;
|
|
16
|
-
constructor(text: string);
|
|
17
|
-
}
|
|
18
|
-
/**
|
|
19
|
-
* 用于生成模拟轻量 DOM 节点的渲染器
|
|
20
|
-
*/
|
|
21
|
-
export declare class HTMLRenderer extends NativeRenderer<VDOMElement, VDOMText> {
|
|
22
|
-
createElement(name: string): VDOMElement;
|
|
23
|
-
createTextNode(textContent: string): VDOMText;
|
|
24
|
-
setProperty(node: VDOMElement, key: string, value: any): void;
|
|
25
|
-
appendChild(parent: VDOMElement, newChild: VDOMElement | VDOMText): void;
|
|
26
|
-
prependChild(parent: VDOMElement, newChild: VDOMElement | VDOMText): void;
|
|
27
|
-
removeProperty(node: VDOMElement, key: string): void;
|
|
28
|
-
setStyle(target: VDOMElement, key: string, value: any): void;
|
|
29
|
-
removeStyle(target: VDOMElement, key: string): void;
|
|
30
|
-
setClass(target: VDOMElement, value: string): void;
|
|
31
|
-
listen(): void;
|
|
32
|
-
unListen(): void;
|
|
33
|
-
remove(node: VDOMElement | VDOMText): void;
|
|
34
|
-
cleanChildren(node: VDOMElement): void;
|
|
35
|
-
syncTextContent(target: VDOMText, content: string): void;
|
|
36
|
-
insertAfter(newNode: VDOMElement | VDOMText, ref: VDOMElement | VDOMText): void;
|
|
37
|
-
}
|
|
38
|
-
/**
|
|
39
|
-
* 轻量 DOM 转换为 HTML 字符串的转换器
|
|
40
|
-
*/
|
|
41
|
-
export declare class OutputTranslator {
|
|
42
|
-
static singleTags: string[];
|
|
43
|
-
static simpleXSSFilter: {
|
|
44
|
-
text(text: string): string;
|
|
45
|
-
attrName(text: string): string;
|
|
46
|
-
attrValue(text: string): string;
|
|
47
|
-
};
|
|
48
|
-
private singleTagTest;
|
|
49
|
-
/**
|
|
50
|
-
* 将虚拟 DOM 转换为 HTML 字符串的方法
|
|
51
|
-
* @param vDom 虚拟 DOM 节点
|
|
52
|
-
*/
|
|
53
|
-
transform(vDom: VDOMElement): string;
|
|
54
|
-
private vDomToHTMLString;
|
|
55
|
-
private replaceEmpty;
|
|
56
|
-
}
|