@viewfly/platform-browser 1.0.0-alpha.1 → 1.0.0-alpha.11

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.
@@ -1,5 +1,141 @@
1
+ import { NativeNode, JSXNode, Application, Config, NativeRenderer } from '@viewfly/core';
1
2
  import * as CSS from 'csstype';
2
- export interface CSSProperties extends CSS.Properties<string | number>, CSS.PropertiesHyphen<string | number> {
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: JSXNode, autoUpdate?: boolean): Application<T>;
19
+ declare function createApp<T extends NativeNode>(root: JSXNode, 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: () => JSXNode, host: T): {
51
+ $portalHost: T;
52
+ $render: () => JSXNode;
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 insertBefore;
136
+ }
137
+
138
+ interface CSSProperties extends CSS.Properties<string | number>, CSS.PropertiesHyphen<string | number> {
3
139
  /**
4
140
  * The index signature was removed to enable closed typing for style
5
141
  * using CSSType. You're able to use type assertion or module augmentation
@@ -198,8 +334,8 @@ interface AriaAttributes {
198
334
  /** Defines the human readable text alternative of aria-valuenow for a range widget. */
199
335
  'aria-valuetext'?: string;
200
336
  }
201
- export type StyleValue = string | CSSProperties | null;
202
- export interface HTMLAttributes<T> extends AriaAttributes, EventHandlers<Events>, JSXInternal.RefAttributes<T> {
337
+ type StyleValue = string | CSSProperties | null;
338
+ interface HTMLAttributes<T> extends AriaAttributes, EventHandlers<Events>, JSXInternal.RefAttributes<T> {
203
339
  innerHTML?: string;
204
340
  class?: JSXInternal.ClassNames;
205
341
  style?: StyleValue;
@@ -246,7 +382,7 @@ export interface HTMLAttributes<T> extends AriaAttributes, EventHandlers<Events>
246
382
  [k: string]: any;
247
383
  }
248
384
  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
- export interface AnchorHTMLAttributes<T> extends HTMLAttributes<T> {
385
+ interface AnchorHTMLAttributes<T> extends HTMLAttributes<T> {
250
386
  download?: any;
251
387
  href?: string;
252
388
  hreflang?: string;
@@ -257,7 +393,7 @@ export interface AnchorHTMLAttributes<T> extends HTMLAttributes<T> {
257
393
  type?: string;
258
394
  referrerpolicy?: HTMLAttributeReferrerPolicy;
259
395
  }
260
- export interface AreaHTMLAttributes<T> extends HTMLAttributes<T> {
396
+ interface AreaHTMLAttributes<T> extends HTMLAttributes<T> {
261
397
  alt?: string;
262
398
  coords?: string;
263
399
  download?: any;
@@ -269,16 +405,16 @@ export interface AreaHTMLAttributes<T> extends HTMLAttributes<T> {
269
405
  shape?: string;
270
406
  target?: string;
271
407
  }
272
- export interface AudioHTMLAttributes<T> extends MediaHTMLAttributes<T> {
408
+ interface AudioHTMLAttributes<T> extends MediaHTMLAttributes<T> {
273
409
  }
274
- export interface BaseHTMLAttributes<T> extends HTMLAttributes<T> {
410
+ interface BaseHTMLAttributes<T> extends HTMLAttributes<T> {
275
411
  href?: string;
276
412
  target?: string;
277
413
  }
278
- export interface BlockquoteHTMLAttributes<T> extends HTMLAttributes<T> {
414
+ interface BlockquoteHTMLAttributes<T> extends HTMLAttributes<T> {
279
415
  cite?: string;
280
416
  }
281
- export interface ButtonHTMLAttributes<T> extends HTMLAttributes<T> {
417
+ interface ButtonHTMLAttributes<T> extends HTMLAttributes<T> {
282
418
  autofocus?: Booleanish;
283
419
  disabled?: Booleanish;
284
420
  form?: string;
@@ -291,42 +427,42 @@ export interface ButtonHTMLAttributes<T> extends HTMLAttributes<T> {
291
427
  type?: 'submit' | 'reset' | 'button';
292
428
  value?: string | string[] | number;
293
429
  }
294
- export interface CanvasHTMLAttributes<T> extends HTMLAttributes<T> {
430
+ interface CanvasHTMLAttributes<T> extends HTMLAttributes<T> {
295
431
  height?: Numberish;
296
432
  width?: Numberish;
297
433
  }
298
- export interface ColHTMLAttributes<T> extends HTMLAttributes<T> {
434
+ interface ColHTMLAttributes<T> extends HTMLAttributes<T> {
299
435
  span?: Numberish;
300
436
  width?: Numberish;
301
437
  }
302
- export interface ColgroupHTMLAttributes<T> extends HTMLAttributes<T> {
438
+ interface ColgroupHTMLAttributes<T> extends HTMLAttributes<T> {
303
439
  span?: Numberish;
304
440
  }
305
- export interface DataHTMLAttributes<T> extends HTMLAttributes<T> {
441
+ interface DataHTMLAttributes<T> extends HTMLAttributes<T> {
306
442
  value?: string | string[] | number;
307
443
  }
308
- export interface DetailsHTMLAttributes<T> extends HTMLAttributes<T> {
444
+ interface DetailsHTMLAttributes<T> extends HTMLAttributes<T> {
309
445
  open?: Booleanish;
310
446
  }
311
- export interface DelHTMLAttributes<T> extends HTMLAttributes<T> {
447
+ interface DelHTMLAttributes<T> extends HTMLAttributes<T> {
312
448
  cite?: string;
313
449
  datetime?: string;
314
450
  }
315
- export interface DialogHTMLAttributes<T> extends HTMLAttributes<T> {
451
+ interface DialogHTMLAttributes<T> extends HTMLAttributes<T> {
316
452
  open?: Booleanish;
317
453
  }
318
- export interface EmbedHTMLAttributes<T> extends HTMLAttributes<T> {
454
+ interface EmbedHTMLAttributes<T> extends HTMLAttributes<T> {
319
455
  height?: Numberish;
320
456
  src?: string;
321
457
  type?: string;
322
458
  width?: Numberish;
323
459
  }
324
- export interface FieldsetHTMLAttributes<T> extends HTMLAttributes<T> {
460
+ interface FieldsetHTMLAttributes<T> extends HTMLAttributes<T> {
325
461
  disabled?: Booleanish;
326
462
  form?: string;
327
463
  name?: string;
328
464
  }
329
- export interface FormHTMLAttributes<T> extends HTMLAttributes<T> {
465
+ interface FormHTMLAttributes<T> extends HTMLAttributes<T> {
330
466
  acceptcharset?: string;
331
467
  action?: string;
332
468
  autocomplete?: string;
@@ -336,10 +472,10 @@ export interface FormHTMLAttributes<T> extends HTMLAttributes<T> {
336
472
  novalidate?: Booleanish;
337
473
  target?: string;
338
474
  }
339
- export interface HtmlHTMLAttributes<T> extends HTMLAttributes<T> {
475
+ interface HtmlHTMLAttributes<T> extends HTMLAttributes<T> {
340
476
  manifest?: string;
341
477
  }
342
- export interface IframeHTMLAttributes<T> extends HTMLAttributes<T> {
478
+ interface IframeHTMLAttributes<T> extends HTMLAttributes<T> {
343
479
  allow?: string;
344
480
  allowfullscreen?: Booleanish;
345
481
  allowtransparency?: Booleanish;
@@ -356,7 +492,7 @@ export interface IframeHTMLAttributes<T> extends HTMLAttributes<T> {
356
492
  srcdoc?: string;
357
493
  width?: Numberish;
358
494
  }
359
- export interface ImgHTMLAttributes<T> extends HTMLAttributes<T> {
495
+ interface ImgHTMLAttributes<T> extends HTMLAttributes<T> {
360
496
  alt?: string;
361
497
  crossorigin?: 'anonymous' | 'use-credentials' | '';
362
498
  decoding?: 'async' | 'auto' | 'sync';
@@ -368,11 +504,11 @@ export interface ImgHTMLAttributes<T> extends HTMLAttributes<T> {
368
504
  usemap?: string;
369
505
  width?: Numberish;
370
506
  }
371
- export interface InsHTMLAttributes<T> extends HTMLAttributes<T> {
507
+ interface InsHTMLAttributes<T> extends HTMLAttributes<T> {
372
508
  cite?: string;
373
509
  datetime?: string;
374
510
  }
375
- export interface InputHTMLAttributes<T> extends HTMLAttributes<T> {
511
+ interface InputHTMLAttributes<T> extends HTMLAttributes<T> {
376
512
  accept?: string;
377
513
  alt?: string;
378
514
  autocomplete?: string;
@@ -407,7 +543,7 @@ export interface InputHTMLAttributes<T> extends HTMLAttributes<T> {
407
543
  value?: any;
408
544
  width?: Numberish;
409
545
  }
410
- export interface KeygenHTMLAttributes<T> extends HTMLAttributes<T> {
546
+ interface KeygenHTMLAttributes<T> extends HTMLAttributes<T> {
411
547
  autofocus?: Booleanish;
412
548
  challenge?: string;
413
549
  disabled?: Booleanish;
@@ -416,14 +552,14 @@ export interface KeygenHTMLAttributes<T> extends HTMLAttributes<T> {
416
552
  keyparams?: string;
417
553
  name?: string;
418
554
  }
419
- export interface LabelHTMLAttributes<T> extends HTMLAttributes<T> {
555
+ interface LabelHTMLAttributes<T> extends HTMLAttributes<T> {
420
556
  for?: string;
421
557
  form?: string;
422
558
  }
423
- export interface LiHTMLAttributes<T> extends HTMLAttributes<T> {
559
+ interface LiHTMLAttributes<T> extends HTMLAttributes<T> {
424
560
  value?: string | string[] | number;
425
561
  }
426
- export interface LinkHTMLAttributes<T> extends HTMLAttributes<T> {
562
+ interface LinkHTMLAttributes<T> extends HTMLAttributes<T> {
427
563
  as?: string;
428
564
  crossorigin?: string;
429
565
  href?: string;
@@ -435,13 +571,13 @@ export interface LinkHTMLAttributes<T> extends HTMLAttributes<T> {
435
571
  sizes?: string;
436
572
  type?: string;
437
573
  }
438
- export interface MapHTMLAttributes<T> extends HTMLAttributes<T> {
574
+ interface MapHTMLAttributes<T> extends HTMLAttributes<T> {
439
575
  name?: string;
440
576
  }
441
- export interface MenuHTMLAttributes<T> extends HTMLAttributes<T> {
577
+ interface MenuHTMLAttributes<T> extends HTMLAttributes<T> {
442
578
  type?: string;
443
579
  }
444
- export interface MediaHTMLAttributes<T> extends HTMLAttributes<T> {
580
+ interface MediaHTMLAttributes<T> extends HTMLAttributes<T> {
445
581
  autoplay?: Booleanish;
446
582
  controls?: Booleanish;
447
583
  controlslist?: string;
@@ -453,13 +589,13 @@ export interface MediaHTMLAttributes<T> extends HTMLAttributes<T> {
453
589
  preload?: string;
454
590
  src?: string;
455
591
  }
456
- export interface MetaHTMLAttributes<T> extends HTMLAttributes<T> {
592
+ interface MetaHTMLAttributes<T> extends HTMLAttributes<T> {
457
593
  charset?: string;
458
594
  content?: string;
459
595
  httpequiv?: string;
460
596
  name?: string;
461
597
  }
462
- export interface MeterHTMLAttributes<T> extends HTMLAttributes<T> {
598
+ interface MeterHTMLAttributes<T> extends HTMLAttributes<T> {
463
599
  form?: string;
464
600
  high?: Numberish;
465
601
  low?: Numberish;
@@ -468,10 +604,10 @@ export interface MeterHTMLAttributes<T> extends HTMLAttributes<T> {
468
604
  optimum?: Numberish;
469
605
  value?: string | string[] | number;
470
606
  }
471
- export interface QuoteHTMLAttributes<T> extends HTMLAttributes<T> {
607
+ interface QuoteHTMLAttributes<T> extends HTMLAttributes<T> {
472
608
  cite?: string;
473
609
  }
474
- export interface ObjectHTMLAttributes<T> extends HTMLAttributes<T> {
610
+ interface ObjectHTMLAttributes<T> extends HTMLAttributes<T> {
475
611
  classid?: string;
476
612
  data?: string;
477
613
  form?: string;
@@ -482,35 +618,35 @@ export interface ObjectHTMLAttributes<T> extends HTMLAttributes<T> {
482
618
  width?: Numberish;
483
619
  wmode?: string;
484
620
  }
485
- export interface OlHTMLAttributes<T> extends HTMLAttributes<T> {
621
+ interface OlHTMLAttributes<T> extends HTMLAttributes<T> {
486
622
  reversed?: Booleanish;
487
623
  start?: Numberish;
488
624
  type?: '1' | 'a' | 'A' | 'i' | 'I';
489
625
  }
490
- export interface OptgroupHTMLAttributes<T> extends HTMLAttributes<T> {
626
+ interface OptgroupHTMLAttributes<T> extends HTMLAttributes<T> {
491
627
  disabled?: Booleanish;
492
628
  label?: string;
493
629
  }
494
- export interface OptionHTMLAttributes<T> extends HTMLAttributes<T> {
630
+ interface OptionHTMLAttributes<T> extends HTMLAttributes<T> {
495
631
  disabled?: Booleanish;
496
632
  label?: string;
497
633
  selected?: Booleanish;
498
634
  value?: string;
499
635
  }
500
- export interface OutputHTMLAttributes<T> extends HTMLAttributes<T> {
636
+ interface OutputHTMLAttributes<T> extends HTMLAttributes<T> {
501
637
  for?: string;
502
638
  form?: string;
503
639
  name?: string;
504
640
  }
505
- export interface ParamHTMLAttributes<T> extends HTMLAttributes<T> {
641
+ interface ParamHTMLAttributes<T> extends HTMLAttributes<T> {
506
642
  name?: string;
507
643
  value?: string | string[] | number;
508
644
  }
509
- export interface ProgressHTMLAttributes<T> extends HTMLAttributes<T> {
645
+ interface ProgressHTMLAttributes<T> extends HTMLAttributes<T> {
510
646
  max?: Numberish;
511
647
  value?: string | string[] | number;
512
648
  }
513
- export interface ScriptHTMLAttributes<T> extends HTMLAttributes<T> {
649
+ interface ScriptHTMLAttributes<T> extends HTMLAttributes<T> {
514
650
  async?: Booleanish;
515
651
  charset?: string;
516
652
  crossorigin?: string;
@@ -522,7 +658,7 @@ export interface ScriptHTMLAttributes<T> extends HTMLAttributes<T> {
522
658
  src?: string;
523
659
  type?: string;
524
660
  }
525
- export interface SelectHTMLAttributes<T> extends HTMLAttributes<T> {
661
+ interface SelectHTMLAttributes<T> extends HTMLAttributes<T> {
526
662
  autocomplete?: string;
527
663
  autofocus?: Booleanish;
528
664
  disabled?: Booleanish;
@@ -533,25 +669,25 @@ export interface SelectHTMLAttributes<T> extends HTMLAttributes<T> {
533
669
  size?: Numberish;
534
670
  value?: string;
535
671
  }
536
- export interface SourceHTMLAttributes<T> extends HTMLAttributes<T> {
672
+ interface SourceHTMLAttributes<T> extends HTMLAttributes<T> {
537
673
  media?: string;
538
674
  sizes?: string;
539
675
  src?: string;
540
676
  srcset?: string;
541
677
  type?: string;
542
678
  }
543
- export interface StyleHTMLAttributes<T> extends HTMLAttributes<T> {
679
+ interface StyleHTMLAttributes<T> extends HTMLAttributes<T> {
544
680
  media?: string;
545
681
  nonce?: string;
546
682
  scoped?: Booleanish;
547
683
  type?: string;
548
684
  }
549
- export interface TableHTMLAttributes<T> extends HTMLAttributes<T> {
685
+ interface TableHTMLAttributes<T> extends HTMLAttributes<T> {
550
686
  cellpadding?: Numberish;
551
687
  cellspacing?: Numberish;
552
688
  summary?: string;
553
689
  }
554
- export interface TextareaHTMLAttributes<T> extends HTMLAttributes<T> {
690
+ interface TextareaHTMLAttributes<T> extends HTMLAttributes<T> {
555
691
  autocomplete?: string;
556
692
  autofocus?: Booleanish;
557
693
  cols?: Numberish;
@@ -568,7 +704,7 @@ export interface TextareaHTMLAttributes<T> extends HTMLAttributes<T> {
568
704
  value?: string | string[] | number;
569
705
  wrap?: string;
570
706
  }
571
- export interface TdHTMLAttributes<T> extends HTMLAttributes<T> {
707
+ interface TdHTMLAttributes<T> extends HTMLAttributes<T> {
572
708
  align?: 'left' | 'center' | 'right' | 'justify' | 'char';
573
709
  colspan?: Numberish;
574
710
  headers?: string;
@@ -576,31 +712,31 @@ export interface TdHTMLAttributes<T> extends HTMLAttributes<T> {
576
712
  scope?: string;
577
713
  valign?: 'top' | 'middle' | 'bottom' | 'baseline';
578
714
  }
579
- export interface ThHTMLAttributes<T> extends HTMLAttributes<T> {
715
+ interface ThHTMLAttributes<T> extends HTMLAttributes<T> {
580
716
  align?: 'left' | 'center' | 'right' | 'justify' | 'char';
581
717
  colspan?: Numberish;
582
718
  headers?: string;
583
719
  rowspan?: Numberish;
584
720
  scope?: string;
585
721
  }
586
- export interface TimeHTMLAttributes<T> extends HTMLAttributes<T> {
722
+ interface TimeHTMLAttributes<T> extends HTMLAttributes<T> {
587
723
  datetime?: string;
588
724
  }
589
- export interface TrackHTMLAttributes<T> extends HTMLAttributes<T> {
725
+ interface TrackHTMLAttributes<T> extends HTMLAttributes<T> {
590
726
  default?: Booleanish;
591
727
  kind?: string;
592
728
  label?: string;
593
729
  src?: string;
594
730
  srclang?: string;
595
731
  }
596
- export interface VideoHTMLAttributes<T> extends MediaHTMLAttributes<T> {
732
+ interface VideoHTMLAttributes<T> extends MediaHTMLAttributes<T> {
597
733
  height?: Numberish;
598
734
  playsinline?: Booleanish;
599
735
  poster?: string;
600
736
  width?: Numberish;
601
737
  disablePictureInPicture?: Booleanish;
602
738
  }
603
- export interface WebViewHTMLAttributes<T> extends HTMLAttributes<T> {
739
+ interface WebViewHTMLAttributes<T> extends HTMLAttributes<T> {
604
740
  allowfullscreen?: Booleanish;
605
741
  allowpopups?: Booleanish;
606
742
  autoFocus?: Booleanish;
@@ -619,7 +755,7 @@ export interface WebViewHTMLAttributes<T> extends HTMLAttributes<T> {
619
755
  useragent?: string;
620
756
  webpreferences?: string;
621
757
  }
622
- export interface SVGAttributes<T> extends AriaAttributes, EventHandlers<Events>, JSXInternal.RefAttributes<T> {
758
+ interface SVGAttributes<T> extends AriaAttributes, EventHandlers<Events>, JSXInternal.RefAttributes<T> {
623
759
  innerHTML?: string;
624
760
  /**
625
761
  * SVG Styling Attributes
@@ -878,7 +1014,7 @@ export interface SVGAttributes<T> extends AriaAttributes, EventHandlers<Events>,
878
1014
  z?: Numberish;
879
1015
  zoomAndPan?: string;
880
1016
  }
881
- export interface DOMElements {
1017
+ interface DOMElements {
882
1018
  a: AnchorHTMLAttributes<HTMLAnchorElement>;
883
1019
  abbr: HTMLAttributes<HTMLElement>;
884
1020
  address: HTMLAttributes<HTMLElement>;
@@ -992,7 +1128,7 @@ export interface DOMElements {
992
1128
  wbr: HTMLAttributes<HTMLElement>;
993
1129
  webview: WebViewHTMLAttributes<HTMLElement>;
994
1130
  }
995
- export interface SVGElements {
1131
+ interface SVGElements {
996
1132
  svg: SVGAttributes<SVGElement>;
997
1133
  animate: SVGAttributes<SVGAnimateElement>;
998
1134
  animateMotion: SVGAttributes<SVGAnimateMotionElement>;
@@ -1052,9 +1188,9 @@ export interface SVGElements {
1052
1188
  use: SVGAttributes<SVGUseElement>;
1053
1189
  view: SVGAttributes<SVGViewElement>;
1054
1190
  }
1055
- export interface NativeElements extends DOMElements, SVGElements {
1191
+ interface NativeElements extends DOMElements, SVGElements {
1056
1192
  }
1057
- export interface Events {
1193
+ interface Events {
1058
1194
  onCopy: ClipboardEvent;
1059
1195
  onCut: ClipboardEvent;
1060
1196
  onPaste: ClipboardEvent;
@@ -1147,4 +1283,5 @@ declare global {
1147
1283
  }
1148
1284
  }
1149
1285
  }
1150
- export {};
1286
+
1287
+ 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 };
@@ -168,20 +168,34 @@ function createPortal(childRender, host) {
168
168
  };
169
169
  }
170
170
 
171
- class VDOMElement {
171
+ class VDOMNode {
172
+ constructor() {
173
+ this.parent = null;
174
+ }
175
+ remove() {
176
+ if (this.parent) {
177
+ const i = this.parent.children.indexOf(this);
178
+ if (i > -1) {
179
+ this.parent.children.splice(i, 1);
180
+ }
181
+ }
182
+ this.parent = null;
183
+ }
184
+ }
185
+ class VDOMElement extends VDOMNode {
172
186
  constructor(name) {
187
+ super();
173
188
  this.name = name;
174
189
  this.props = new Map();
175
190
  this.children = [];
176
191
  this.style = new Map();
177
192
  this.className = '';
178
- this.parent = null;
179
193
  }
180
194
  }
181
- class VDOMText {
195
+ class VDOMText extends VDOMNode {
182
196
  constructor(text) {
197
+ super();
183
198
  this.text = text;
184
- this.parent = null;
185
199
  }
186
200
  }
187
201
  /**
@@ -198,10 +212,12 @@ class HTMLRenderer extends NativeRenderer {
198
212
  node.props.set(key, value);
199
213
  }
200
214
  appendChild(parent, newChild) {
215
+ newChild.remove();
201
216
  parent.children.push(newChild);
202
217
  newChild.parent = parent;
203
218
  }
204
219
  prependChild(parent, newChild) {
220
+ newChild.remove();
205
221
  parent.children.unshift(newChild);
206
222
  newChild.parent = parent;
207
223
  }
@@ -224,21 +240,17 @@ class HTMLRenderer extends NativeRenderer {
224
240
  //
225
241
  }
226
242
  remove(node) {
227
- if (node.parent) {
228
- const i = node.parent.children.indexOf(node);
229
- if (i > -1) {
230
- node.parent.children.splice(i, 1);
231
- }
232
- }
233
- node.parent = null;
243
+ node.remove();
234
244
  }
235
245
  cleanChildren(node) {
246
+ node.children.forEach(i => i.parent = null);
236
247
  node.children = [];
237
248
  }
238
249
  syncTextContent(target, content) {
239
250
  target.text = content;
240
251
  }
241
252
  insertAfter(newNode, ref) {
253
+ newNode.remove();
242
254
  const parent = ref.parent;
243
255
  if (parent) {
244
256
  const i = parent.children.indexOf(ref);
@@ -284,7 +296,7 @@ class OutputTranslator {
284
296
  const attrs = Array.from(vDom.props.keys()).filter(key => key !== 'ref' && vDom.props.get(key) !== false).map(k => {
285
297
  const key = xssFilter.attrName(k);
286
298
  const value = vDom.props.get(k);
287
- return (value === true ? `${key}` : `${key}="${xssFilter.attrValue(`${value}`)}"`);
299
+ return (value === true && /^\w+$/.test(key) ? `${key}` : `${key}="${xssFilter.attrValue(`${value}`)}"`);
288
300
  });
289
301
  if (styles) {
290
302
  attrs.push(`style="${styles}"`);
@@ -346,4 +358,4 @@ OutputTranslator.simpleXSSFilter = {
346
358
  }
347
359
  };
348
360
 
349
- export { DomRenderer, HTMLRenderer, OutputTranslator, VDOMElement, VDOMText, createApp, createPortal };
361
+ export { DomRenderer, HTMLRenderer, OutputTranslator, VDOMElement, VDOMNode, VDOMText, createApp, createPortal };
package/bundles/index.js CHANGED
@@ -170,20 +170,34 @@ function createPortal(childRender, host) {
170
170
  };
171
171
  }
172
172
 
173
- class VDOMElement {
173
+ class VDOMNode {
174
+ constructor() {
175
+ this.parent = null;
176
+ }
177
+ remove() {
178
+ if (this.parent) {
179
+ const i = this.parent.children.indexOf(this);
180
+ if (i > -1) {
181
+ this.parent.children.splice(i, 1);
182
+ }
183
+ }
184
+ this.parent = null;
185
+ }
186
+ }
187
+ class VDOMElement extends VDOMNode {
174
188
  constructor(name) {
189
+ super();
175
190
  this.name = name;
176
191
  this.props = new Map();
177
192
  this.children = [];
178
193
  this.style = new Map();
179
194
  this.className = '';
180
- this.parent = null;
181
195
  }
182
196
  }
183
- class VDOMText {
197
+ class VDOMText extends VDOMNode {
184
198
  constructor(text) {
199
+ super();
185
200
  this.text = text;
186
- this.parent = null;
187
201
  }
188
202
  }
189
203
  /**
@@ -200,10 +214,12 @@ class HTMLRenderer extends core.NativeRenderer {
200
214
  node.props.set(key, value);
201
215
  }
202
216
  appendChild(parent, newChild) {
217
+ newChild.remove();
203
218
  parent.children.push(newChild);
204
219
  newChild.parent = parent;
205
220
  }
206
221
  prependChild(parent, newChild) {
222
+ newChild.remove();
207
223
  parent.children.unshift(newChild);
208
224
  newChild.parent = parent;
209
225
  }
@@ -226,21 +242,17 @@ class HTMLRenderer extends core.NativeRenderer {
226
242
  //
227
243
  }
228
244
  remove(node) {
229
- if (node.parent) {
230
- const i = node.parent.children.indexOf(node);
231
- if (i > -1) {
232
- node.parent.children.splice(i, 1);
233
- }
234
- }
235
- node.parent = null;
245
+ node.remove();
236
246
  }
237
247
  cleanChildren(node) {
248
+ node.children.forEach(i => i.parent = null);
238
249
  node.children = [];
239
250
  }
240
251
  syncTextContent(target, content) {
241
252
  target.text = content;
242
253
  }
243
254
  insertAfter(newNode, ref) {
255
+ newNode.remove();
244
256
  const parent = ref.parent;
245
257
  if (parent) {
246
258
  const i = parent.children.indexOf(ref);
@@ -286,7 +298,7 @@ class OutputTranslator {
286
298
  const attrs = Array.from(vDom.props.keys()).filter(key => key !== 'ref' && vDom.props.get(key) !== false).map(k => {
287
299
  const key = xssFilter.attrName(k);
288
300
  const value = vDom.props.get(k);
289
- return (value === true ? `${key}` : `${key}="${xssFilter.attrValue(`${value}`)}"`);
301
+ return (value === true && /^\w+$/.test(key) ? `${key}` : `${key}="${xssFilter.attrValue(`${value}`)}"`);
290
302
  });
291
303
  if (styles) {
292
304
  attrs.push(`style="${styles}"`);
@@ -352,6 +364,7 @@ exports.DomRenderer = DomRenderer;
352
364
  exports.HTMLRenderer = HTMLRenderer;
353
365
  exports.OutputTranslator = OutputTranslator;
354
366
  exports.VDOMElement = VDOMElement;
367
+ exports.VDOMNode = VDOMNode;
355
368
  exports.VDOMText = VDOMText;
356
369
  exports.createApp = createApp;
357
370
  exports.createPortal = createPortal;
package/package.json CHANGED
@@ -1,18 +1,20 @@
1
1
  {
2
2
  "name": "@viewfly/platform-browser",
3
- "version": "1.0.0-alpha.1",
3
+ "version": "1.0.0-alpha.11",
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/public-api.d.ts",
7
+ "typings": "./bundles/index.d.ts",
8
8
  "scripts": {
9
- "build:lib": "rimraf bundles && rollup --config rollup.config.ts --configPlugin @rollup/plugin-typescript",
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.1",
17
+ "@viewfly/core": "^1.0.0-alpha.11",
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": "8a25e6e350ba9cade6036506e7fe2aba4e4396ac"
39
+ "gitHead": "723da75a9e8e13e8addbe4646358667f476e06f3"
37
40
  }
@@ -0,0 +1,14 @@
1
+ import dts from 'rollup-plugin-dts'
2
+
3
+ export default {
4
+ input: 'src/public-api.ts',
5
+ output: [
6
+ {
7
+ file: './bundles/index.d.ts',
8
+ format: 'es'
9
+ }
10
+ ],
11
+ plugins: [
12
+ dts(),
13
+ ]
14
+ }
@@ -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,54 +0,0 @@
1
- import { NativeRenderer } from '@viewfly/core';
2
- export declare class VDOMElement {
3
- name: string;
4
- props: Map<string, any>;
5
- children: Array<VDOMElement | VDOMText>;
6
- style: Map<string, any>;
7
- className: string;
8
- parent: VDOMElement | null;
9
- constructor(name: string);
10
- }
11
- export declare class VDOMText {
12
- text: string;
13
- parent: VDOMElement | null;
14
- constructor(text: string);
15
- }
16
- /**
17
- * 用于生成模拟轻量 DOM 节点的渲染器
18
- */
19
- export declare class HTMLRenderer extends NativeRenderer<VDOMElement, VDOMText> {
20
- createElement(name: string): VDOMElement;
21
- createTextNode(textContent: string): VDOMText;
22
- setProperty(node: VDOMElement, key: string, value: any): void;
23
- appendChild(parent: VDOMElement, newChild: VDOMElement | VDOMText): void;
24
- prependChild(parent: VDOMElement, newChild: VDOMElement | VDOMText): void;
25
- removeProperty(node: VDOMElement, key: string): void;
26
- setStyle(target: VDOMElement, key: string, value: any): void;
27
- removeStyle(target: VDOMElement, key: string): void;
28
- setClass(target: VDOMElement, value: string): void;
29
- listen(): void;
30
- unListen(): void;
31
- remove(node: VDOMElement | VDOMText): void;
32
- cleanChildren(node: VDOMElement): void;
33
- syncTextContent(target: VDOMText, content: string): void;
34
- insertAfter(newNode: VDOMElement | VDOMText, ref: VDOMElement | VDOMText): void;
35
- }
36
- /**
37
- * 轻量 DOM 转换为 HTML 字符串的转换器
38
- */
39
- export declare class OutputTranslator {
40
- static singleTags: string[];
41
- static simpleXSSFilter: {
42
- text(text: string): string;
43
- attrName(text: string): string;
44
- attrValue(text: string): string;
45
- };
46
- private singleTagTest;
47
- /**
48
- * 将虚拟 DOM 转换为 HTML 字符串的方法
49
- * @param vDom 虚拟 DOM 节点
50
- */
51
- transform(vDom: VDOMElement): string;
52
- private vDomToHTMLString;
53
- private replaceEmpty;
54
- }
@@ -1,5 +0,0 @@
1
- export * from './create-app';
2
- export * from './create-portal';
3
- export * from './html-renderer';
4
- export * from './dom-renderer';
5
- export * from './jsx-dom';