@ktjs/core 0.18.3 → 0.18.6

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.
@@ -17,13 +17,991 @@ interface KTRef<T> {
17
17
  removeOnChange: (callback: ChangeHandler<T>) => void;
18
18
  }
19
19
 
20
- type Redraw = (props?: KTAttribute, ...args: any[]) => KTHTMLElement;
21
- type KTHTMLElement<El extends HTMLElement = HTMLElement, R extends Function = Redraw> = El & {
20
+ // Base events available to all HTML elements
21
+ type BaseAttr = {
22
+ [k: string]: any;
23
+
24
+ // # base attributes
25
+ class?: string;
26
+ className?: string;
27
+ style?: string;
28
+
29
+ // # Events
30
+ // Mouse events
31
+ 'on:click'?: (ev: MouseEvent) => void;
32
+ 'on:dblclick'?: (ev: MouseEvent) => void;
33
+ 'on:mousedown'?: (ev: MouseEvent) => void;
34
+ 'on:mouseup'?: (ev: MouseEvent) => void;
35
+ 'on:mousemove'?: (ev: MouseEvent) => void;
36
+ 'on:mouseenter'?: (ev: MouseEvent) => void;
37
+ 'on:mouseleave'?: (ev: MouseEvent) => void;
38
+ 'on:mouseover'?: (ev: MouseEvent) => void;
39
+ 'on:mouseout'?: (ev: MouseEvent) => void;
40
+ 'on:contextmenu'?: (ev: MouseEvent) => void;
41
+
42
+ // Keyboard events
43
+ 'on:keydown'?: (ev: KeyboardEvent) => void;
44
+ 'on:keyup'?: (ev: KeyboardEvent) => void;
45
+ 'on:keypress'?: (ev: KeyboardEvent) => void;
46
+
47
+ // Focus events
48
+ 'on:focus'?: (ev: FocusEvent) => void;
49
+ 'on:blur'?: (ev: FocusEvent) => void;
50
+ 'on:focusin'?: (ev: FocusEvent) => void;
51
+ 'on:focusout'?: (ev: FocusEvent) => void;
52
+
53
+ // Input events
54
+ 'on:input'?: (ev: Event) => void;
55
+ 'on:change'?: (ev: Event) => void;
56
+ 'on:beforeinput'?: (ev: InputEvent) => void;
57
+
58
+ // Drag events
59
+ 'on:drag'?: (ev: DragEvent) => void;
60
+ 'on:dragstart'?: (ev: DragEvent) => void;
61
+ 'on:dragend'?: (ev: DragEvent) => void;
62
+ 'on:dragenter'?: (ev: DragEvent) => void;
63
+ 'on:dragleave'?: (ev: DragEvent) => void;
64
+ 'on:dragover'?: (ev: DragEvent) => void;
65
+ 'on:drop'?: (ev: DragEvent) => void;
66
+
67
+ // Clipboard events
68
+ 'on:copy'?: (ev: ClipboardEvent) => void;
69
+ 'on:cut'?: (ev: ClipboardEvent) => void;
70
+ 'on:paste'?: (ev: ClipboardEvent) => void;
71
+
72
+ // Touch events
73
+ 'on:touchstart'?: (ev: TouchEvent) => void;
74
+ 'on:touchmove'?: (ev: TouchEvent) => void;
75
+ 'on:touchend'?: (ev: TouchEvent) => void;
76
+ 'on:touchcancel'?: (ev: TouchEvent) => void;
77
+
78
+ // Wheel event
79
+ 'on:wheel'?: (ev: WheelEvent) => void;
80
+
81
+ // Animation events
82
+ 'on:animationstart'?: (ev: AnimationEvent) => void;
83
+ 'on:animationend'?: (ev: AnimationEvent) => void;
84
+ 'on:animationiteration'?: (ev: AnimationEvent) => void;
85
+
86
+ // Transition events
87
+ 'on:transitionstart'?: (ev: TransitionEvent) => void;
88
+ 'on:transitionend'?: (ev: TransitionEvent) => void;
89
+ 'on:transitionrun'?: (ev: TransitionEvent) => void;
90
+ 'on:transitioncancel'?: (ev: TransitionEvent) => void;
91
+
92
+ // Pointer events
93
+ 'on:pointerdown'?: (ev: PointerEvent) => void;
94
+ 'on:pointerup'?: (ev: PointerEvent) => void;
95
+ 'on:pointermove'?: (ev: PointerEvent) => void;
96
+ 'on:pointerenter'?: (ev: PointerEvent) => void;
97
+ 'on:pointerleave'?: (ev: PointerEvent) => void;
98
+ 'on:pointerover'?: (ev: PointerEvent) => void;
99
+ 'on:pointerout'?: (ev: PointerEvent) => void;
100
+ 'on:pointercancel'?: (ev: PointerEvent) => void;
101
+ 'on:gotpointercapture'?: (ev: PointerEvent) => void;
102
+ 'on:lostpointercapture'?: (ev: PointerEvent) => void;
103
+
104
+ // Selection events
105
+ 'on:select'?: (ev: Event) => void;
106
+ 'on:selectstart'?: (ev: Event) => void;
107
+
108
+ // Scroll event
109
+ 'on:scroll'?: (ev: Event) => void;
110
+
111
+ // Resize event
112
+ 'on:resize'?: (ev: UIEvent) => void;
113
+ };
114
+
115
+ // Form-specific events
116
+ interface FormElementEvents {
117
+ 'on:submit'?: (ev: SubmitEvent) => void;
118
+ 'on:reset'?: (ev: Event) => void;
119
+ 'on:invalid'?: (ev: Event) => void;
120
+ }
121
+
122
+ // Media-specific events
123
+ interface MediaElementEvents {
124
+ 'on:play'?: (ev: Event) => void;
125
+ 'on:pause'?: (ev: Event) => void;
126
+ 'on:playing'?: (ev: Event) => void;
127
+ 'on:ended'?: (ev: Event) => void;
128
+ 'on:canplay'?: (ev: Event) => void;
129
+ 'on:canplaythrough'?: (ev: Event) => void;
130
+ 'on:durationchange'?: (ev: Event) => void;
131
+ 'on:emptied'?: (ev: Event) => void;
132
+ 'on:loadeddata'?: (ev: Event) => void;
133
+ 'on:loadedmetadata'?: (ev: Event) => void;
134
+ 'on:loadstart'?: (ev: Event) => void;
135
+ 'on:progress'?: (ev: ProgressEvent) => void;
136
+ 'on:ratechange'?: (ev: Event) => void;
137
+ 'on:seeked'?: (ev: Event) => void;
138
+ 'on:seeking'?: (ev: Event) => void;
139
+ 'on:stalled'?: (ev: Event) => void;
140
+ 'on:suspend'?: (ev: Event) => void;
141
+ 'on:timeupdate'?: (ev: Event) => void;
142
+ 'on:volumechange'?: (ev: Event) => void;
143
+ 'on:waiting'?: (ev: Event) => void;
144
+ 'on:abort'?: (ev: UIEvent) => void;
145
+ 'on:error'?: (ev: ErrorEvent) => void;
146
+ }
147
+
148
+ // Details-specific events
149
+ interface DetailsElementEvents {
150
+ 'on:toggle'?: (ev: Event) => void;
151
+ }
152
+
153
+ // Dialog-specific events
154
+ interface DialogElementEvents {
155
+ 'on:cancel'?: (ev: Event) => void;
156
+ 'on:close'?: (ev: Event) => void;
157
+ }
158
+
159
+ // Image-specific events
160
+ interface ImageElementEvents {
161
+ 'on:load'?: (ev: Event) => void;
162
+ 'on:error'?: (ev: ErrorEvent) => void;
163
+ }
164
+
165
+ interface AttributesMap {
166
+ // Anchor element
167
+ a: BaseAttr & {
168
+ download?: string;
169
+ href?: string;
170
+ hreflang?: string;
171
+ ping?: string;
172
+ referrerpolicy?:
173
+ | 'no-referrer'
174
+ | 'no-referrer-when-downgrade'
175
+ | 'origin'
176
+ | 'origin-when-cross-origin'
177
+ | 'same-origin'
178
+ | 'strict-origin'
179
+ | 'strict-origin-when-cross-origin'
180
+ | 'unsafe-url';
181
+ rel?: string;
182
+ target?: '_self' | '_blank' | '_parent' | '_top' | string;
183
+ type?: string;
184
+ };
185
+
186
+ // Area element
187
+ area: BaseAttr & {
188
+ alt?: string;
189
+ coords?: string;
190
+ download?: string;
191
+ href?: string;
192
+ ping?: string;
193
+ referrerpolicy?:
194
+ | 'no-referrer'
195
+ | 'no-referrer-when-downgrade'
196
+ | 'origin'
197
+ | 'origin-when-cross-origin'
198
+ | 'same-origin'
199
+ | 'strict-origin'
200
+ | 'strict-origin-when-cross-origin'
201
+ | 'unsafe-url';
202
+ rel?: string;
203
+ shape?: 'rect' | 'circle' | 'poly' | 'default';
204
+ target?: '_self' | '_blank' | '_parent' | '_top' | string;
205
+ };
206
+
207
+ // Audio element
208
+ audio: BaseAttr &
209
+ MediaElementEvents & {
210
+ autoplay?: boolean;
211
+ controls?: boolean;
212
+ crossorigin?: 'anonymous' | 'use-credentials' | '';
213
+ loop?: boolean;
214
+ muted?: boolean;
215
+ preload?: 'none' | 'metadata' | 'auto' | '';
216
+ src?: string;
217
+ };
218
+
219
+ // Base element
220
+ base: BaseAttr & {
221
+ href?: string;
222
+ target?: '_self' | '_blank' | '_parent' | '_top' | string;
223
+ };
224
+
225
+ // Body element
226
+ body: BaseAttr & {};
227
+
228
+ // BR element
229
+ br: BaseAttr & {};
230
+
231
+ // Button element
232
+ button: BaseAttr & {
233
+ disabled?: boolean;
234
+ form?: string;
235
+ formaction?: string;
236
+ formenctype?: 'application/x-www-form-urlencoded' | 'multipart/form-data' | 'text/plain';
237
+ formmethod?: 'get' | 'post' | 'dialog';
238
+ formnovalidate?: boolean;
239
+ formtarget?: '_self' | '_blank' | '_parent' | '_top' | string;
240
+ name?: string;
241
+ type?: 'submit' | 'reset' | 'button';
242
+ value?: string;
243
+ };
244
+
245
+ // Canvas element
246
+ canvas: BaseAttr & {
247
+ height?: number | string;
248
+ width?: number | string;
249
+ };
250
+
251
+ // Table caption element
252
+ caption: BaseAttr & {};
253
+
254
+ // Col element
255
+ col: BaseAttr & {
256
+ span?: number | string;
257
+ };
258
+
259
+ // Colgroup element
260
+ colgroup: BaseAttr & {
261
+ span?: number | string;
262
+ };
263
+
264
+ // Data element
265
+ data: BaseAttr & {
266
+ value?: string;
267
+ };
268
+
269
+ // Datalist element
270
+ datalist: BaseAttr & {};
271
+
272
+ // Del element
273
+ del: BaseAttr & {
274
+ cite?: string;
275
+ datetime?: string;
276
+ };
277
+
278
+ // Details element
279
+ details: BaseAttr &
280
+ DetailsElementEvents & {
281
+ open?: boolean;
282
+ };
283
+
284
+ // Dialog element
285
+ dialog: BaseAttr &
286
+ DialogElementEvents & {
287
+ open?: boolean;
288
+ };
289
+
290
+ // Embed element
291
+ embed: BaseAttr & {
292
+ height?: number | string;
293
+ src?: string;
294
+ type?: string;
295
+ width?: number | string;
296
+ };
297
+
298
+ // Fieldset element
299
+ fieldset: BaseAttr & {
300
+ disabled?: boolean;
301
+ form?: string;
302
+ name?: string;
303
+ };
304
+
305
+ // Form element
306
+ form: BaseAttr &
307
+ FormElementEvents & {
308
+ 'accept-charset'?: string;
309
+ action?: string;
310
+ autocomplete?: 'on' | 'off';
311
+ enctype?: 'application/x-www-form-urlencoded' | 'multipart/form-data' | 'text/plain';
312
+ method?: 'POST' | 'GET' | 'PUT' | 'DELETE' | 'PATCH' | 'HEAD' | 'OPTIONS' | 'CONNECT' | 'TRACE' | otherstring;
313
+
314
+ name?: string;
315
+ novalidate?: boolean;
316
+ target?: '_self' | '_blank' | '_parent' | '_top' | string;
317
+ };
318
+
319
+ // Head element
320
+ head: BaseAttr & {};
321
+
322
+ // HR element
323
+ hr: BaseAttr & {};
324
+
325
+ // HTML element
326
+ html: BaseAttr & {};
327
+
328
+ // IFrame element
329
+ iframe: BaseAttr &
330
+ ImageElementEvents & {
331
+ allow?: string;
332
+ allowfullscreen?: boolean;
333
+ allowpaymentrequest?: boolean;
334
+ height?: number | string;
335
+ loading?: 'eager' | 'lazy';
336
+ name?: string;
337
+ referrerpolicy?:
338
+ | 'no-referrer'
339
+ | 'no-referrer-when-downgrade'
340
+ | 'origin'
341
+ | 'origin-when-cross-origin'
342
+ | 'same-origin'
343
+ | 'strict-origin'
344
+ | 'strict-origin-when-cross-origin'
345
+ | 'unsafe-url';
346
+ sandbox?: string;
347
+ src?: string;
348
+ srcdoc?: string;
349
+ width?: number | string;
350
+ };
351
+
352
+ // Image element
353
+ img: BaseAttr &
354
+ ImageElementEvents & {
355
+ alt?: string;
356
+ crossorigin?: 'anonymous' | 'use-credentials' | '';
357
+ decoding?: 'sync' | 'async' | 'auto';
358
+ height?: number | string;
359
+ ismap?: boolean;
360
+ loading?: 'eager' | 'lazy';
361
+ referrerpolicy?:
362
+ | 'no-referrer'
363
+ | 'no-referrer-when-downgrade'
364
+ | 'origin'
365
+ | 'origin-when-cross-origin'
366
+ | 'same-origin'
367
+ | 'strict-origin'
368
+ | 'strict-origin-when-cross-origin'
369
+ | 'unsafe-url';
370
+ sizes?: string;
371
+ src?: string;
372
+ srcset?: string;
373
+ usemap?: string;
374
+ width?: number | string;
375
+ };
376
+
377
+ // Input element
378
+ input: BaseAttr & {
379
+ accept?: string;
380
+ alt?: string;
381
+ autocomplete?: string;
382
+ checked?: boolean;
383
+ dirname?: string;
384
+ disabled?: boolean;
385
+ form?: string;
386
+ formaction?: string;
387
+ formenctype?: 'application/x-www-form-urlencoded' | 'multipart/form-data' | 'text/plain';
388
+ formmethod?: 'get' | 'post';
389
+ formnovalidate?: boolean;
390
+ formtarget?: '_self' | '_blank' | '_parent' | '_top' | string;
391
+ height?: number | string;
392
+ list?: string;
393
+ max?: number | string;
394
+ maxlength?: number | string;
395
+ min?: number | string;
396
+ minlength?: number | string;
397
+ multiple?: boolean;
398
+ name?: string;
399
+ pattern?: string;
400
+ placeholder?: string;
401
+ readonly?: boolean;
402
+ required?: boolean;
403
+ size?: number | string;
404
+ src?: string;
405
+ step?: number | string;
406
+ type?:
407
+ | 'button'
408
+ | 'checkbox'
409
+ | 'color'
410
+ | 'date'
411
+ | 'datetime-local'
412
+ | 'email'
413
+ | 'file'
414
+ | 'hidden'
415
+ | 'image'
416
+ | 'month'
417
+ | 'number'
418
+ | 'password'
419
+ | 'radio'
420
+ | 'range'
421
+ | 'reset'
422
+ | 'search'
423
+ | 'submit'
424
+ | 'tel'
425
+ | 'text'
426
+ | 'time'
427
+ | 'url'
428
+ | 'week';
429
+ value?: string;
430
+ width?: number | string;
431
+ };
432
+
433
+ // Ins element
434
+ ins: BaseAttr & {
435
+ cite?: string;
436
+ datetime?: string;
437
+ };
438
+
439
+ // Label element
440
+ label: BaseAttr & {
441
+ for?: string;
442
+ };
443
+
444
+ // Legend element
445
+ legend: BaseAttr & {};
446
+
447
+ // LI element
448
+ li: BaseAttr & {
449
+ value?: number | string;
450
+ };
451
+
452
+ // Link element
453
+ link: BaseAttr &
454
+ ImageElementEvents & {
455
+ as?: string;
456
+ crossorigin?: 'anonymous' | 'use-credentials' | '';
457
+ disabled?: boolean;
458
+ href?: string;
459
+ hreflang?: string;
460
+ imagesizes?: string;
461
+ imagesrcset?: string;
462
+ integrity?: string;
463
+ media?: string;
464
+ referrerpolicy?:
465
+ | 'no-referrer'
466
+ | 'no-referrer-when-downgrade'
467
+ | 'origin'
468
+ | 'origin-when-cross-origin'
469
+ | 'same-origin'
470
+ | 'strict-origin'
471
+ | 'strict-origin-when-cross-origin'
472
+ | 'unsafe-url';
473
+ rel?: string;
474
+ sizes?: string;
475
+ type?: string;
476
+ };
477
+
478
+ // Map element
479
+ map: BaseAttr & {
480
+ name?: string;
481
+ };
482
+
483
+ // Menu element
484
+ menu: BaseAttr & {};
485
+
486
+ // Meta element
487
+ meta: BaseAttr & {
488
+ charset?: string;
489
+ content?: string;
490
+ 'http-equiv'?: 'content-security-policy' | 'content-type' | 'default-style' | 'refresh' | string;
491
+ name?: string;
492
+ };
493
+
494
+ // Meter element
495
+ meter: BaseAttr & {
496
+ form?: string;
497
+ high?: number | string;
498
+ low?: number | string;
499
+ max?: number | string;
500
+ min?: number | string;
501
+ optimum?: number | string;
502
+ value?: number | string;
503
+ };
504
+
505
+ // Object element
506
+ object: BaseAttr &
507
+ ImageElementEvents & {
508
+ data?: string;
509
+ form?: string;
510
+ height?: number | string;
511
+ name?: string;
512
+ type?: string;
513
+ usemap?: string;
514
+ width?: number | string;
515
+ };
516
+
517
+ // OL element
518
+ ol: BaseAttr & {
519
+ reversed?: boolean;
520
+ start?: number | string;
521
+ type?: '1' | 'a' | 'A' | 'i' | 'I';
522
+ };
523
+
524
+ // Optgroup element
525
+ optgroup: BaseAttr & {
526
+ disabled?: boolean;
527
+ label?: string;
528
+ };
529
+
530
+ // Option element
531
+ option: BaseAttr & {
532
+ disabled?: boolean;
533
+ label?: string;
534
+ selected?: boolean;
535
+ value?: string;
536
+ };
537
+
538
+ // Output element
539
+ output: BaseAttr & {
540
+ for?: string;
541
+ form?: string;
542
+ name?: string;
543
+ };
544
+
545
+ // Picture element
546
+ picture: BaseAttr & {};
547
+
548
+ // Pre element
549
+ pre: BaseAttr & {};
550
+
551
+ // Progress element
552
+ progress: BaseAttr & {
553
+ max?: number | string;
554
+ value?: number | string;
555
+ };
556
+
557
+ // Quote element (q and blockquote)
558
+ q: BaseAttr & {
559
+ cite?: string;
560
+ };
561
+
562
+ blockquote: BaseAttr & {
563
+ cite?: string;
564
+ };
565
+
566
+ // Script element
567
+ script: BaseAttr &
568
+ ImageElementEvents & {
569
+ async?: boolean;
570
+ crossorigin?: 'anonymous' | 'use-credentials' | '';
571
+ defer?: boolean;
572
+ integrity?: string;
573
+ nomodule?: boolean;
574
+ referrerpolicy?:
575
+ | 'no-referrer'
576
+ | 'no-referrer-when-downgrade'
577
+ | 'origin'
578
+ | 'origin-when-cross-origin'
579
+ | 'same-origin'
580
+ | 'strict-origin'
581
+ | 'strict-origin-when-cross-origin'
582
+ | 'unsafe-url';
583
+ src?: string;
584
+ type?: string;
585
+ };
586
+
587
+ // Select element
588
+ select: BaseAttr & {
589
+ autocomplete?: string;
590
+ disabled?: boolean;
591
+ form?: string;
592
+ multiple?: boolean;
593
+ name?: string;
594
+ required?: boolean;
595
+ size?: number | string;
596
+ };
597
+
598
+ // Slot element
599
+ slot: BaseAttr & {
600
+ name?: string;
601
+ };
602
+
603
+ // Source element
604
+ source: BaseAttr & {
605
+ height?: number | string;
606
+ media?: string;
607
+ sizes?: string;
608
+ src?: string;
609
+ srcset?: string;
610
+ type?: string;
611
+ width?: number | string;
612
+ };
613
+
614
+ // Style element
615
+ style: BaseAttr &
616
+ ImageElementEvents & {
617
+ media?: string;
618
+ };
619
+
620
+ // Table element
621
+ table: BaseAttr & {};
622
+
623
+ // Table body/footer/header elements
624
+ tbody: BaseAttr & {};
625
+
626
+ tfoot: BaseAttr & {};
627
+
628
+ thead: BaseAttr & {};
629
+
630
+ // Table cell elements
631
+ td: BaseAttr & {
632
+ colspan?: number | string;
633
+ headers?: string;
634
+ rowspan?: number | string;
635
+ };
636
+
637
+ th: BaseAttr & {
638
+ abbr?: string;
639
+ colspan?: number | string;
640
+ headers?: string;
641
+ rowspan?: number | string;
642
+ scope?: 'row' | 'col' | 'rowgroup' | 'colgroup';
643
+ };
644
+
645
+ // Template element
646
+ template: BaseAttr & {};
647
+
648
+ // Textarea element
649
+ textarea: BaseAttr & {
650
+ autocomplete?: string;
651
+ cols?: number | string;
652
+ dirname?: string;
653
+ disabled?: boolean;
654
+ form?: string;
655
+ maxlength?: number | string;
656
+ minlength?: number | string;
657
+ name?: string;
658
+ placeholder?: string;
659
+ readonly?: boolean;
660
+ required?: boolean;
661
+ rows?: number | string;
662
+ wrap?: 'hard' | 'soft' | 'off';
663
+ };
664
+
665
+ // Time element
666
+ time: BaseAttr & {
667
+ datetime?: string;
668
+ };
669
+
670
+ // Title element
671
+ title: BaseAttr & {};
672
+
673
+ // TR element
674
+ tr: BaseAttr & {};
675
+
676
+ // Track element
677
+ track: BaseAttr & {
678
+ default?: boolean;
679
+ kind?: 'subtitles' | 'captions' | 'descriptions' | 'chapters' | 'metadata';
680
+ label?: string;
681
+ src?: string;
682
+ srclang?: string;
683
+ };
684
+
685
+ // UL element
686
+ ul: BaseAttr & {};
687
+
688
+ // Video element
689
+ video: BaseAttr &
690
+ MediaElementEvents & {
691
+ autoplay?: boolean;
692
+ controls?: boolean;
693
+ crossorigin?: 'anonymous' | 'use-credentials' | '';
694
+ height?: number | string;
695
+ loop?: boolean;
696
+ muted?: boolean;
697
+ playsinline?: boolean;
698
+ poster?: string;
699
+ preload?: 'none' | 'metadata' | 'auto' | '';
700
+ src?: string;
701
+ width?: number | string;
702
+ };
703
+
704
+ // Generic HTMLElement (no specific attributes beyond BaseEvent)
705
+ abbr: BaseAttr & {};
706
+ address: BaseAttr & {};
707
+ article: BaseAttr & {};
708
+ aside: BaseAttr & {};
709
+ b: BaseAttr & {};
710
+ bdi: BaseAttr & {};
711
+ bdo: BaseAttr & {};
712
+ cite: BaseAttr & {};
713
+ code: BaseAttr & {};
714
+ dd: BaseAttr & {};
715
+ dfn: BaseAttr & {};
716
+ div: BaseAttr & {};
717
+ dl: BaseAttr & {};
718
+ dt: BaseAttr & {};
719
+ em: BaseAttr & {};
720
+ figcaption: BaseAttr & {};
721
+ figure: BaseAttr & {};
722
+ footer: BaseAttr & {};
723
+ h1: BaseAttr & {};
724
+ h2: BaseAttr & {};
725
+ h3: BaseAttr & {};
726
+ h4: BaseAttr & {};
727
+ h5: BaseAttr & {};
728
+ h6: BaseAttr & {};
729
+ header: BaseAttr & {};
730
+ hgroup: BaseAttr & {};
731
+ i: BaseAttr & {};
732
+ kbd: BaseAttr & {};
733
+ main: BaseAttr & {};
734
+ mark: BaseAttr & {};
735
+ nav: BaseAttr & {};
736
+ noscript: BaseAttr & {};
737
+ p: BaseAttr & {};
738
+ rp: BaseAttr & {};
739
+ rt: BaseAttr & {};
740
+ ruby: BaseAttr & {};
741
+ s: BaseAttr & {};
742
+ samp: BaseAttr & {};
743
+ search: BaseAttr & {};
744
+ section: BaseAttr & {};
745
+ small: BaseAttr & {};
746
+ span: BaseAttr & {};
747
+ strong: BaseAttr & {};
748
+ sub: BaseAttr & {};
749
+ summary: BaseAttr & {};
750
+ sup: BaseAttr & {};
751
+ u: BaseAttr & {};
752
+ var: BaseAttr & {};
753
+ wbr: BaseAttr & {};
754
+
755
+ svg: BaseAttr & {
756
+ class?: string;
757
+ style?: string;
758
+ width?: number | string;
759
+ height?: number | string;
760
+ viewBox?: string;
761
+ xmlns?: string;
762
+ fill?: string;
763
+ stroke?: string;
764
+ strokeWidth?: number | string;
765
+ strokeLinecap?: 'butt' | 'round' | 'square' | 'inherit';
766
+ strokeLinejoin?: 'miter' | 'round' | 'bevel' | 'inherit';
767
+ strokeDasharray?: string;
768
+ strokeDashoffset?: number | string;
769
+ opacity?: number | string;
770
+ preserveAspectRatio?: string;
771
+ transform?: string;
772
+ x?: number | string;
773
+ y?: number | string;
774
+ rx?: number | string;
775
+ ry?: number | string;
776
+ r?: number | string;
777
+ cx?: number | string;
778
+ cy?: number | string;
779
+ d?: string;
780
+ points?: string;
781
+ pathLength?: number | string;
782
+ viewbox?: string;
783
+ role?: string;
784
+ focusable?: boolean | 'true' | 'false';
785
+ xlinkHref?: string; // legacy xlink:href
786
+ };
787
+ }
788
+
789
+ interface SVGAttributesMap {
790
+ a: AttributesMap['svg'] & { href?: string; x?: number | string; y?: number | string };
791
+ animate: AttributesMap['svg'] & {
792
+ attributeName?: string;
793
+ from?: string | number;
794
+ to?: string | number;
795
+ dur?: string;
796
+ repeatCount?: string | number;
797
+ };
798
+ animateMotion: AttributesMap['svg'] & { path?: string; dur?: string; rotate?: string };
799
+ animateTransform: AttributesMap['svg'] & { type?: string; from?: string; to?: string; dur?: string };
800
+ circle: AttributesMap['svg'] & { cx?: number | string; cy?: number | string; r?: number | string };
801
+ clipPath: AttributesMap['svg'] & { clipPathUnits?: 'userSpaceOnUse' | 'objectBoundingBox' };
802
+ defs: AttributesMap['svg'];
803
+ desc: AttributesMap['svg'];
804
+ ellipse: AttributesMap['svg'] & {
805
+ cx?: number | string;
806
+ cy?: number | string;
807
+ rx?: number | string;
808
+ ry?: number | string;
809
+ };
810
+
811
+ // Filter primitives (provide common props)
812
+ feBlend: AttributesMap['svg'] & { in?: string; in2?: string; mode?: string };
813
+ feColorMatrix: AttributesMap['svg'] & {
814
+ type?: 'matrix' | 'saturate' | 'hueRotate' | 'luminanceToAlpha';
815
+ values?: string;
816
+ };
817
+ feComponentTransfer: AttributesMap['svg'] & {};
818
+ feComposite: AttributesMap['svg'] & {
819
+ in?: string;
820
+ in2?: string;
821
+ operator?: string;
822
+ k1?: number | string;
823
+ k2?: number | string;
824
+ k3?: number | string;
825
+ k4?: number | string;
826
+ };
827
+ feConvolveMatrix: AttributesMap['svg'] & {
828
+ order?: string | number;
829
+ kernelMatrix?: string;
830
+ divisor?: string | number;
831
+ bias?: string | number;
832
+ };
833
+ feDiffuseLighting: AttributesMap['svg'] & {};
834
+ feDisplacementMap: AttributesMap['svg'] & {
835
+ in?: string;
836
+ in2?: string;
837
+ scale?: number | string;
838
+ xChannelSelector?: string;
839
+ yChannelSelector?: string;
840
+ };
841
+ feDistantLight: AttributesMap['svg'] & { azimuth?: number | string; elevation?: number | string };
842
+ feDropShadow: AttributesMap['svg'] & {
843
+ dx?: number | string;
844
+ dy?: number | string;
845
+ stdDeviation?: number | string;
846
+ floodColor?: string;
847
+ floodOpacity?: number | string;
848
+ };
849
+ feFlood: AttributesMap['svg'] & { floodColor?: string; floodOpacity?: number | string };
850
+ feFuncA: AttributesMap['svg'] & {};
851
+ feFuncB: AttributesMap['svg'] & {};
852
+ feFuncG: AttributesMap['svg'] & {};
853
+ feFuncR: AttributesMap['svg'] & {};
854
+ feGaussianBlur: AttributesMap['svg'] & { stdDeviation?: number | string; edgeMode?: string };
855
+ feImage: AttributesMap['svg'] & { href?: string };
856
+ feMerge: AttributesMap['svg'] & {};
857
+ feMergeNode: AttributesMap['svg'] & { in?: string };
858
+ feMorphology: AttributesMap['svg'] & { operator?: 'erode' | 'dilate'; radius?: number | string };
859
+ feOffset: AttributesMap['svg'] & { dx?: number | string; dy?: number | string };
860
+ fePointLight: AttributesMap['svg'] & { x?: number | string; y?: number | string; z?: number | string };
861
+ feSpecularLighting: AttributesMap['svg'] & {
862
+ specularConstant?: number | string;
863
+ specularExponent?: number | string;
864
+ surfaceScale?: number | string;
865
+ };
866
+ feSpotLight: AttributesMap['svg'] & {
867
+ x?: number | string;
868
+ y?: number | string;
869
+ z?: number | string;
870
+ pointsAtX?: number | string;
871
+ pointsAtY?: number | string;
872
+ pointsAtZ?: number | string;
873
+ specularExponent?: number | string;
874
+ limitingConeAngle?: number | string;
875
+ };
876
+ feTile: AttributesMap['svg'] & {};
877
+ feTurbulence: AttributesMap['svg'] & {
878
+ baseFrequency?: number | string;
879
+ numOctaves?: number | string;
880
+ seed?: number | string;
881
+ stitchTiles?: string;
882
+ type?: 'fractalNoise' | 'turbulence';
883
+ };
884
+
885
+ filter: AttributesMap['svg'] & {
886
+ x?: number | string;
887
+ y?: number | string;
888
+ width?: number | string;
889
+ height?: number | string;
890
+ filterUnits?: string;
891
+ primitiveUnits?: string;
892
+ };
893
+ foreignObject: AttributesMap['svg'] & {
894
+ x?: number | string;
895
+ y?: number | string;
896
+ width?: number | string;
897
+ height?: number | string;
898
+ };
899
+ g: AttributesMap['svg'];
900
+ image: AttributesMap['svg'] & {
901
+ href?: string;
902
+ x?: number | string;
903
+ y?: number | string;
904
+ width?: number | string;
905
+ height?: number | string;
906
+ };
907
+ line: AttributesMap['svg'] & {
908
+ x1?: number | string;
909
+ y1?: number | string;
910
+ x2?: number | string;
911
+ y2?: number | string;
912
+ };
913
+ linearGradient: AttributesMap['svg'] & {
914
+ x1?: number | string;
915
+ y1?: number | string;
916
+ x2?: number | string;
917
+ y2?: number | string;
918
+ gradientUnits?: 'userSpaceOnUse' | 'objectBoundingBox';
919
+ gradientTransform?: string;
920
+ };
921
+ marker: AttributesMap['svg'] & {
922
+ markerUnits?: string;
923
+ markerWidth?: number | string;
924
+ markerHeight?: number | string;
925
+ refX?: number | string;
926
+ refY?: number | string;
927
+ orient?: string;
928
+ };
929
+ mask: AttributesMap['svg'] & {
930
+ maskUnits?: string;
931
+ maskContentUnits?: string;
932
+ x?: number | string;
933
+ y?: number | string;
934
+ width?: number | string;
935
+ height?: number | string;
936
+ };
937
+ metadata: AttributesMap['svg'];
938
+ mpath: AttributesMap['svg'] & { href?: string };
939
+ path: AttributesMap['svg'] & { d?: string; pathLength?: number | string };
940
+ pattern: AttributesMap['svg'] & {
941
+ patternUnits?: string;
942
+ patternContentUnits?: string;
943
+ width?: number | string;
944
+ height?: number | string;
945
+ x?: number | string;
946
+ y?: number | string;
947
+ };
948
+ polygon: AttributesMap['svg'] & { points?: string };
949
+ polyline: AttributesMap['svg'] & { points?: string };
950
+ radialGradient: AttributesMap['svg'] & {
951
+ cx?: number | string;
952
+ cy?: number | string;
953
+ r?: number | string;
954
+ fx?: number | string;
955
+ fy?: number | string;
956
+ gradientUnits?: 'userSpaceOnUse' | 'objectBoundingBox';
957
+ gradientTransform?: string;
958
+ };
959
+ rect: AttributesMap['svg'] & {
960
+ x?: number | string;
961
+ y?: number | string;
962
+ width?: number | string;
963
+ height?: number | string;
964
+ rx?: number | string;
965
+ ry?: number | string;
966
+ };
967
+ script: AttributesMap['svg'] & { href?: string; type?: string };
968
+ set: AttributesMap['svg'] & { attributeName?: string; to?: string | number; begin?: string; dur?: string };
969
+ stop: AttributesMap['svg'] & { offset?: number | string; stopColor?: string; stopOpacity?: number | string };
970
+ style: AttributesMap['svg'] & { media?: string };
971
+ svg: AttributesMap['svg'];
972
+ switch: AttributesMap['svg'];
973
+ symbol: AttributesMap['svg'] & { viewBox?: string; preserveAspectRatio?: string };
974
+ text: AttributesMap['svg'] & {
975
+ x?: number | string;
976
+ y?: number | string;
977
+ dx?: number | string;
978
+ dy?: number | string;
979
+ textLength?: number | string;
980
+ };
981
+ textPath: AttributesMap['svg'] & { href?: string; startOffset?: number | string };
982
+ title: AttributesMap['svg'];
983
+ tspan: AttributesMap['svg'] & {
984
+ x?: number | string;
985
+ y?: number | string;
986
+ dx?: number | string;
987
+ dy?: number | string;
988
+ };
989
+ use: AttributesMap['svg'] & {
990
+ href?: string;
991
+ x?: number | string;
992
+ y?: number | string;
993
+ width?: number | string;
994
+ height?: number | string;
995
+ };
996
+ view: AttributesMap['svg'] & { viewBox?: string; preserveAspectRatio?: string };
997
+ }
998
+
999
+ type KTHTMLElement<El extends HTMLElement = HTMLElement> = El & {
22
1000
  /**
23
1001
  * Automically generate a redraw function if it is not provided
24
1002
  * @param props
25
1003
  */
26
- redraw: R;
1004
+ redraw: (props?: KTAttribute, ...args: any[]) => KTHTMLElement;
27
1005
  };
28
1006
 
29
1007
  declare global {
@@ -31,13 +1009,181 @@ declare global {
31
1009
  type Element = KTHTMLElement;
32
1010
 
33
1011
  interface IntrinsicElements {
34
- [tag: string]: KTAttribute & { children?: KTRawContent };
1012
+ // Document-level & metadata
1013
+ html: AttributesMap['html'];
1014
+ head: AttributesMap['head'];
1015
+ title: AttributesMap['title'];
1016
+ base: AttributesMap['base'];
1017
+ link: AttributesMap['link'];
1018
+ meta: AttributesMap['meta'];
1019
+
1020
+ // Sectioning
1021
+ body: AttributesMap['body'];
1022
+ header: AttributesMap['header'];
1023
+ footer: AttributesMap['footer'];
1024
+ nav: AttributesMap['nav'];
1025
+ main: AttributesMap['main'];
1026
+ section: AttributesMap['section'];
1027
+ article: AttributesMap['article'];
1028
+ aside: AttributesMap['aside'];
1029
+
1030
+ // Headings
1031
+ h1: AttributesMap['h1'];
1032
+ h2: AttributesMap['h2'];
1033
+ h3: AttributesMap['h3'];
1034
+ h4: AttributesMap['h4'];
1035
+ h5: AttributesMap['h5'];
1036
+ h6: AttributesMap['h6'];
1037
+
1038
+ // Text content
1039
+ p: AttributesMap['p'];
1040
+ pre: AttributesMap['pre'];
1041
+ code: AttributesMap['code'];
1042
+ strong: AttributesMap['strong'];
1043
+ small: AttributesMap['small'];
1044
+ em: AttributesMap['em'];
1045
+ br: AttributesMap['br'];
1046
+ i: AttributesMap['i'];
1047
+
1048
+ // Lists
1049
+ ul: AttributesMap['ul'];
1050
+ ol: AttributesMap['ol'];
1051
+ li: AttributesMap['li'];
1052
+
1053
+ // Tables
1054
+ table: AttributesMap['table'];
1055
+ thead: AttributesMap['thead'];
1056
+ tbody: AttributesMap['tbody'];
1057
+ tfoot: AttributesMap['tfoot'];
1058
+ tr: AttributesMap['tr'];
1059
+ th: AttributesMap['th'];
1060
+ td: AttributesMap['td'];
1061
+
1062
+ // Forms
1063
+ form: AttributesMap['form'];
1064
+ label: AttributesMap['label'];
1065
+ input: AttributesMap['input'];
1066
+ textarea: AttributesMap['textarea'];
1067
+ select: AttributesMap['select'];
1068
+ option: AttributesMap['option'];
1069
+ optgroup: AttributesMap['optgroup'];
1070
+ button: AttributesMap['button'];
1071
+ fieldset: AttributesMap['fieldset'];
1072
+ legend: AttributesMap['legend'];
1073
+ datalist: AttributesMap['datalist'];
1074
+ output: AttributesMap['output'];
1075
+
1076
+ // Media & embedded
1077
+ img: AttributesMap['img'];
1078
+ picture: AttributesMap['picture'];
1079
+ source: AttributesMap['source'];
1080
+ audio: AttributesMap['audio'];
1081
+ video: AttributesMap['video'];
1082
+ track: AttributesMap['track'];
1083
+ iframe: AttributesMap['iframe'];
1084
+ embed: AttributesMap['embed'];
1085
+ object: AttributesMap['object'];
1086
+ canvas: AttributesMap['canvas'];
1087
+
1088
+ // Interactive & misc
1089
+ a: AttributesMap['a'] & SVGAttributesMap['a'];
1090
+ area: AttributesMap['area'];
1091
+ map: AttributesMap['map'];
1092
+ details: AttributesMap['details'];
1093
+ dialog: AttributesMap['dialog'];
1094
+ summary: AttributesMap['summary'];
1095
+ slot: AttributesMap['slot'];
1096
+
1097
+ // Scripting & styles
1098
+ script: AttributesMap['script'];
1099
+ style: AttributesMap['style'];
1100
+
1101
+ // Semantic & phrasing
1102
+ figure: AttributesMap['figure'];
1103
+ figcaption: AttributesMap['figcaption'];
1104
+ blockquote: AttributesMap['blockquote'];
1105
+ q: AttributesMap['q'];
1106
+
1107
+ // Generic elements
1108
+ div: AttributesMap['div'];
1109
+ span: AttributesMap['span'];
1110
+ address: AttributesMap['address'];
1111
+ abbr: AttributesMap['abbr'];
1112
+ b: AttributesMap['b'];
1113
+ cite: AttributesMap['cite'];
1114
+ dl: AttributesMap['dl'];
1115
+ dt: AttributesMap['dt'];
1116
+ dd: AttributesMap['dd'];
1117
+ hr: AttributesMap['hr'];
1118
+
1119
+ // SVG
1120
+ svg: AttributesMap['svg'];
1121
+ // a: SVGAttributesMap['a'];
1122
+ animate: SVGAttributesMap['animate'];
1123
+ animateMotion: SVGAttributesMap['animateMotion'];
1124
+ animateTransform: SVGAttributesMap['animateTransform'];
1125
+ circle: SVGAttributesMap['circle'];
1126
+ clipPath: SVGAttributesMap['clipPath'];
1127
+ defs: SVGAttributesMap['defs'];
1128
+ desc: SVGAttributesMap['desc'];
1129
+ ellipse: SVGAttributesMap['ellipse'];
1130
+ feBlend: SVGAttributesMap['feBlend'];
1131
+ feColorMatrix: SVGAttributesMap['feColorMatrix'];
1132
+ feComponentTransfer: SVGAttributesMap['feComponentTransfer'];
1133
+ feComposite: SVGAttributesMap['feComposite'];
1134
+ feConvolveMatrix: SVGAttributesMap['feConvolveMatrix'];
1135
+ feDiffuseLighting: SVGAttributesMap['feDiffuseLighting'];
1136
+ feDisplacementMap: SVGAttributesMap['feDisplacementMap'];
1137
+ feDistantLight: SVGAttributesMap['feDistantLight'];
1138
+ feDropShadow: SVGAttributesMap['feDropShadow'];
1139
+ feFlood: SVGAttributesMap['feFlood'];
1140
+ feFuncA: SVGAttributesMap['feFuncA'];
1141
+ feFuncB: SVGAttributesMap['feFuncB'];
1142
+ feFuncG: SVGAttributesMap['feFuncG'];
1143
+ feFuncR: SVGAttributesMap['feFuncR'];
1144
+ feGaussianBlur: SVGAttributesMap['feGaussianBlur'];
1145
+ feImage: SVGAttributesMap['feImage'];
1146
+ feMerge: SVGAttributesMap['feMerge'];
1147
+ feMergeNode: SVGAttributesMap['feMergeNode'];
1148
+ feMorphology: SVGAttributesMap['feMorphology'];
1149
+ feOffset: SVGAttributesMap['feOffset'];
1150
+ fePointLight: SVGAttributesMap['fePointLight'];
1151
+ feSpecularLighting: SVGAttributesMap['feSpecularLighting'];
1152
+ feSpotLight: SVGAttributesMap['feSpotLight'];
1153
+ feTile: SVGAttributesMap['feTile'];
1154
+ feTurbulence: SVGAttributesMap['feTurbulence'];
1155
+ filter: SVGAttributesMap['filter'];
1156
+ foreignObject: SVGAttributesMap['foreignObject'];
1157
+ g: SVGAttributesMap['g'];
1158
+ image: SVGAttributesMap['image'];
1159
+ line: SVGAttributesMap['line'];
1160
+ linearGradient: SVGAttributesMap['linearGradient'];
1161
+ marker: SVGAttributesMap['marker'];
1162
+ mask: SVGAttributesMap['mask'];
1163
+ metadata: SVGAttributesMap['metadata'];
1164
+ mpath: SVGAttributesMap['mpath'];
1165
+ path: SVGAttributesMap['path'];
1166
+ pattern: SVGAttributesMap['pattern'];
1167
+ polygon: SVGAttributesMap['polygon'];
1168
+ polyline: SVGAttributesMap['polyline'];
1169
+ radialGradient: SVGAttributesMap['radialGradient'];
1170
+ rect: SVGAttributesMap['rect'];
1171
+ set: SVGAttributesMap['set'];
1172
+ stop: SVGAttributesMap['stop'];
1173
+ switch: SVGAttributesMap['switch'];
1174
+ symbol: SVGAttributesMap['symbol'];
1175
+ text: SVGAttributesMap['text'];
1176
+ textPath: SVGAttributesMap['textPath'];
1177
+ tspan: SVGAttributesMap['tspan'];
1178
+ use: SVGAttributesMap['use'];
1179
+ view: SVGAttributesMap['view'];
35
1180
  }
36
1181
 
37
- // interface IntrinsicAttributes {
38
- // key?: string | number;
39
- // }
40
- type IntrinsicAttributes = KTAttribute;
1182
+ interface IntrinsicAttributes {
1183
+ ref?: KTRef<HTMLElement>;
1184
+ 'k-if'?: any;
1185
+ children?: KTRawContent;
1186
+ }
41
1187
 
42
1188
  interface ElementChildrenAttribute {
43
1189
  children: {};
@@ -117,35 +1263,7 @@ type KTPrefixedEventHandlers = {
117
1263
  [EventName in keyof HTMLElementEventMap as `on:${EventName}`]?: (ev: HTMLElementEventMap[EventName]) => void;
118
1264
  };
119
1265
 
120
- type KTSpecialEventHandlers = {
121
- /**
122
- * Directly extract `value` from the input element
123
- */
124
- 'on:ktchange'?: (value: string) => void;
125
- /**
126
- * Directly extract `value` and trim it
127
- */
128
- 'ontrim:ktchange'?: (value: string) => void;
129
- /**
130
- * Directly extract `value` and parse it to number
131
- */
132
- 'on:ktchangenumber'?: (value: number) => void;
133
-
134
- /**
135
- * Directly extract `value` from the input element
136
- */
137
- 'on:ktinput'?: (value: string) => void;
138
- /**
139
- * Directly extract `value` and trim it
140
- */
141
- 'ontrim:ktinput'?: (value: string) => void;
142
- /**
143
- * Directly extract `value` and parse it to number
144
- */
145
- 'on:ktinputnumber'?: (value: number) => void;
146
- };
147
-
148
- type KTAttribute = KTBaseAttribute & KTPrefixedEventHandlers & KTSpecialEventHandlers;
1266
+ type KTAttribute = KTBaseAttribute & KTPrefixedEventHandlers;
149
1267
 
150
1268
  type HTML<T extends (HTMLTag | SVGTag) & otherstring> = T extends SVGTag ? SVGElementTagNameMap[T] : T extends HTMLTag ? HTMLElementTagNameMap[T] : HTMLElement;
151
1269
  /**
@@ -158,7 +1276,7 @@ type HTML<T extends (HTMLTag | SVGTag) & otherstring> = T extends SVGTag ? SVGEl
158
1276
  * ## About
159
1277
  * @package @ktjs/core
160
1278
  * @author Kasukabe Tsumugi <futami16237@gmail.com>
161
- * @version 0.18.3 (Last Update: 2026.01.30 23:10:27.447)
1279
+ * @version 0.18.6 (Last Update: 2026.01.31 01:30:02.352)
162
1280
  * @license MIT
163
1281
  * @link https://github.com/baendlorel/kt.js
164
1282
  * @link https://baendlorel.github.io/ Welcome to my site!