@ktjs/core 0.28.1 → 0.29.0

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,1329 +0,0 @@
1
- import { otherstring, HTMLTag, SVGTag, MathMLTag } from '@ktjs/shared';
2
-
3
- type KTReactify<T> = T extends boolean ? KTReactive<boolean> : T extends any ? KTReactive<T> : never;
4
- type KTReactifyProps<T extends object> = {
5
- [K in keyof T]: KTReactify<Exclude<T[K], undefined>> | T[K];
6
- };
7
-
8
- declare const enum KTReactiveType {
9
- REF = 1,
10
- COMPUTED = 2
11
- }
12
-
13
- type ReactiveChangeHandler<T> = (newValue: T, oldValue: T) => void;
14
-
15
- declare class KTReactive<T> {
16
- /**
17
- * Indicates that this is a KTRef instance
18
- */
19
- isKT: boolean;
20
-
21
- ktType: KTReactiveType;
22
-
23
- /**
24
- * If new value and old value are both nodes, the old one will be replaced in the DOM
25
- */
26
- get value();
27
- set value(newValue: T);
28
-
29
- /**
30
- * Force all listeners to run even when reference identity has not changed.
31
- * Useful for in-place array/object mutations.
32
- */
33
- notify(): void;
34
-
35
- /**
36
- * Mutate current value in-place and notify listeners once.
37
- *
38
- * @example
39
- * const items = ref<number[]>([1, 2]);
40
- * items.mutate((list) => list.push(3));
41
- */
42
- mutate<R = void>(mutator: (currentValue: T) => R): R;
43
- /**
44
- * Register a callback when the value changes
45
- * @param callback (newValue, oldValue) => xxx
46
- */
47
- addOnChange(callback: ReactiveChangeHandler<T>): void;
48
- removeOnChange(callback: ReactiveChangeHandler<T>): void;
49
- }
50
-
51
- declare class KTRef<T> {
52
- /**
53
- * Indicates that this is a KTRef instance
54
- */
55
- isKT: true;
56
- ktType: KTReactiveType;
57
- constructor(_value: T, _onChanges: Array<ReactiveChangeHandler<T>>);
58
- /**
59
- * If new value and old value are both nodes, the old one will be replaced in the DOM
60
- */
61
- get value(): T;
62
- set value(newValue: T);
63
- /**
64
- * Force all listeners to run even when reference identity has not changed.
65
- * Useful for in-place array/object mutations.
66
- */
67
- notify(): void;
68
- /**
69
- * Mutate current value in-place and notify listeners once.
70
- *
71
- * @example
72
- * const items = ref<number[]>([1, 2]);
73
- * items.mutate((list) => list.push(3));
74
- */
75
- mutate<R = void>(mutator: (currentValue: T) => R): R;
76
- /**
77
- * Register a callback when the value changes
78
- * @param callback (newValue, oldValue) => xxx
79
- */
80
- addOnChange(callback: ReactiveChangeHandler<T>): void;
81
- removeOnChange(callback: ReactiveChangeHandler<T>): boolean;
82
- }
83
-
84
- type HTML<T extends (HTMLTag | SVGTag | MathMLTag) & otherstring> = T extends SVGTag
85
- ? SVGElementTagNameMap[T]
86
- : T extends HTMLTag
87
- ? HTMLElementTagNameMap[T]
88
- : T extends MathMLTag
89
- ? MathMLElementTagNameMap[T]
90
- : HTMLElement;
91
-
92
- type SingleContent = KTRef<any> | HTMLElement | Element | Node | string | number | boolean | null | undefined;
93
- type KTAvailableContent = SingleContent | KTAvailableContent[];
94
- type KTRawContent = KTAvailableContent | Promise<KTAvailableContent>;
95
- type KTRawAttr = KTAttribute | null | undefined | '' | false;
96
-
97
- /**
98
- * Used to create enhanced HTML elements
99
- */
100
- interface KTBaseAttribute {
101
- [k: string]: any;
102
-
103
- // # kt-specific attributes
104
- ref?: KTRef<JSX.Element>;
105
-
106
- /**
107
- * If a `KTRef` is bound, it will be reactive; otherwise, it will be static.
108
- */
109
- 'k-if'?: any;
110
-
111
- /**
112
- * Register two-way data binding between an input element and a KTRef.
113
- * - Default to regist `input` event and `value` property(`checked` for checkboxes and radios).
114
- */
115
- 'k-model'?: KTRef<any>;
116
-
117
- /**
118
- * Directly apply html string to `innerHTML`.
119
- * - Would be reactive if `KTRef` instance is provided
120
- */
121
- 'k-html'?: any;
122
-
123
- // # normal HTML attributes
124
- id?: string;
125
- class?: string;
126
- className?: string;
127
- style?: string | Partial<CSSStyleDeclaration>;
128
-
129
- type?:
130
- | 'text'
131
- | 'password'
132
- | 'email'
133
- | 'number'
134
- | 'tel'
135
- | 'url'
136
- | 'search'
137
- | 'date'
138
- | 'datetime-local'
139
- | 'time'
140
- | 'month'
141
- | 'week'
142
- | 'color'
143
- | 'range'
144
- | 'file'
145
- | 'checkbox'
146
- | 'radio'
147
- | 'hidden'
148
- | 'submit'
149
- | 'reset'
150
- | 'button'
151
- | 'image'
152
- | otherstring;
153
- for?: string;
154
-
155
- name?: string;
156
- title?: string;
157
- placeholder?: string;
158
- contenteditable?: boolean;
159
- value?: any;
160
- valueAsDate?: Date;
161
- valueAsNumber?: number;
162
- label?: string;
163
- disabled?: boolean;
164
-
165
- min?: string | number;
166
- max?: string | number;
167
- step?: string | number;
168
-
169
- selected?: boolean;
170
- checked?: boolean;
171
-
172
- action?: string;
173
- method?: 'POST' | 'GET' | 'PUT' | 'DELETE' | 'PATCH' | 'HEAD' | 'OPTIONS' | 'CONNECT' | 'TRACE' | otherstring;
174
- }
175
-
176
- type KTPrefixedEventAttribute = {
177
- [EventName in keyof HTMLElementEventMap as `on:${EventName}`]?: (ev: HTMLElementEventMap[EventName]) => void;
178
- };
179
-
180
- type KTAttribute = KTBaseAttribute & KTPrefixedEventAttribute;
181
-
182
- /**
183
- * Create an enhanced HTMLElement.
184
- * - Only supports HTMLElements, **NOT** SVGElements or other Elements.
185
- * @param tag tag of an `HTMLElement`
186
- * @param attr attribute object or className
187
- * @param content a string or an array of HTMLEnhancedElement as child nodes
188
- *
189
- * ## About
190
- * @package @ktjs/core
191
- * @author Kasukabe Tsumugi <futami16237@gmail.com>
192
- * @version 0.28.1 (Last Update: 2026.02.10 11:23:01.128)
193
- * @license MIT
194
- * @link https://github.com/baendlorel/kt.js
195
- * @link https://baendlorel.github.io/ Welcome to my site!
196
- * @description Core functionality for kt.js - DOM manipulation utilities with JSX/TSX support
197
- * @copyright Copyright (c) 2026 Kasukabe Tsumugi. All rights reserved.
198
- */
199
- declare const h: <T extends HTMLTag | SVGTag | MathMLTag>(tag: T, attr?: KTRawAttr, content?: KTRawContent) => HTML<T>;
200
-
201
- type JSXTag = HTMLTag | ((props?: any) => HTMLElement) | ((props?: any) => Promise<HTMLElement>);
202
- /**
203
- * @param tag html tag or function component
204
- * @param props properties/attributes
205
- */
206
- declare function jsx(tag: JSXTag, props: KTAttribute): JSX.Element;
207
- /**
208
- * Fragment support - returns an array of children
209
- * Enhanced Fragment component that manages arrays of elements
210
- */
211
- declare function Fragment(props: {
212
- children?: KTRawContent;
213
- }): JSX.Element;
214
- /**
215
- * JSX Development runtime - same as jsx but with additional dev checks
216
- */
217
- declare const jsxDEV: typeof jsx;
218
- /**
219
- * JSX runtime for React 17+ automatic runtime
220
- * This is called when using jsx: "react-jsx" or "react-jsxdev"
221
- */
222
- declare const jsxs: typeof jsx;
223
-
224
- /**
225
- * A helper to create redrawable elements
226
- * ```tsx
227
- * export function MyComponent() {
228
- * let aa = 10;
229
- * // ...
230
- * // aa might be changed
231
- * return createRedrawable(() => <div>{aa}</div>);
232
- * }
233
- * ```
234
- * Then the returned element has a `redraw` method to redraw itself with new values.
235
- * @param creator a simple creator function that returns an element
236
- * @returns created element's ref
237
- */
238
- declare function createRedrawable<T>(creator: () => T): KTRef<T> & {
239
- redraw: () => T;
240
- };
241
-
242
- // Base events available to all HTML elements
243
- type BaseAttr = KTPrefixedEventAttribute &
244
- KTReactifyProps<{
245
- [k: string]: any;
246
-
247
- // # base attributes
248
- class?: string;
249
- className?: string;
250
- style?: string | Partial<CSSStyleDeclaration>;
251
- }>;
252
-
253
- interface AttributesMap {
254
- // Anchor element
255
- a: BaseAttr &
256
- KTReactifyProps<{
257
- download?: string;
258
- href?: string;
259
- hreflang?: string;
260
- ping?: string;
261
- referrerpolicy?:
262
- | 'no-referrer'
263
- | 'no-referrer-when-downgrade'
264
- | 'origin'
265
- | 'origin-when-cross-origin'
266
- | 'same-origin'
267
- | 'strict-origin'
268
- | 'strict-origin-when-cross-origin'
269
- | 'unsafe-url';
270
- rel?: string;
271
- target?: '_self' | '_blank' | '_parent' | '_top' | string;
272
- type?: string;
273
- }>;
274
-
275
- // Area element
276
- area: BaseAttr &
277
- KTReactifyProps<{
278
- alt?: string;
279
- coords?: string;
280
- download?: string;
281
- href?: string;
282
- ping?: string;
283
- referrerpolicy?:
284
- | 'no-referrer'
285
- | 'no-referrer-when-downgrade'
286
- | 'origin'
287
- | 'origin-when-cross-origin'
288
- | 'same-origin'
289
- | 'strict-origin'
290
- | 'strict-origin-when-cross-origin'
291
- | 'unsafe-url';
292
- rel?: string;
293
- shape?: 'rect' | 'circle' | 'poly' | 'default';
294
- target?: '_self' | '_blank' | '_parent' | '_top' | string;
295
- }>;
296
-
297
- // Audio element
298
- audio: BaseAttr &
299
- KTReactifyProps<{
300
- autoplay?: boolean;
301
- controls?: boolean;
302
- crossorigin?: 'anonymous' | 'use-credentials' | '';
303
- loop?: boolean;
304
- muted?: boolean;
305
- preload?: 'none' | 'metadata' | 'auto' | '';
306
- src?: string;
307
- }>;
308
-
309
- // Base element
310
- base: BaseAttr &
311
- KTReactifyProps<{
312
- href?: string;
313
- target?: '_self' | '_blank' | '_parent' | '_top' | string;
314
- }>;
315
-
316
- // Body element
317
- body: BaseAttr & KTReactifyProps<{}>;
318
-
319
- // BR element
320
- br: BaseAttr & KTReactifyProps<{}>;
321
-
322
- // Button element
323
- button: BaseAttr &
324
- KTReactifyProps<{
325
- disabled?: boolean;
326
- form?: string;
327
- formaction?: string;
328
- formenctype?: 'application/x-www-form-urlencoded' | 'multipart/form-data' | 'text/plain';
329
- formmethod?: 'get' | 'post' | 'dialog';
330
- formnovalidate?: boolean;
331
- formtarget?: '_self' | '_blank' | '_parent' | '_top' | string;
332
- name?: string;
333
- type?: 'submit' | 'reset' | 'button';
334
- value?: string;
335
- }>;
336
-
337
- // Canvas element
338
- canvas: BaseAttr &
339
- KTReactifyProps<{
340
- height?: number | string;
341
- width?: number | string;
342
- }>;
343
-
344
- // Table caption element
345
- caption: BaseAttr & KTReactifyProps<{}>;
346
-
347
- // Col element
348
- col: BaseAttr &
349
- KTReactifyProps<{
350
- span?: number | string;
351
- }>;
352
-
353
- // Colgroup element
354
- colgroup: BaseAttr &
355
- KTReactifyProps<{
356
- span?: number | string;
357
- }>;
358
-
359
- // Data element
360
- data: BaseAttr &
361
- KTReactifyProps<{
362
- value?: string;
363
- }>;
364
-
365
- // Datalist element
366
- datalist: BaseAttr & KTReactifyProps<{}>;
367
-
368
- // Del element
369
- del: BaseAttr &
370
- KTReactifyProps<{
371
- cite?: string;
372
- datetime?: string;
373
- }>;
374
-
375
- // Details element
376
- details: BaseAttr &
377
- KTReactifyProps<{
378
- open?: boolean;
379
- }>;
380
-
381
- // Dialog element
382
- dialog: BaseAttr &
383
- KTReactifyProps<{
384
- open?: boolean;
385
- }>;
386
-
387
- // Embed element
388
- embed: BaseAttr &
389
- KTReactifyProps<{
390
- height?: number | string;
391
- src?: string;
392
- type?: string;
393
- width?: number | string;
394
- }>;
395
-
396
- // Fieldset element
397
- fieldset: BaseAttr &
398
- KTReactifyProps<{
399
- disabled?: boolean;
400
- form?: string;
401
- name?: string;
402
- }>;
403
-
404
- // Form element
405
- form: BaseAttr &
406
- KTReactifyProps<{
407
- 'accept-charset'?: string;
408
- action?: string;
409
- autocomplete?: 'on' | 'off';
410
- enctype?: 'application/x-www-form-urlencoded' | 'multipart/form-data' | 'text/plain';
411
- method?: 'POST' | 'GET' | 'PUT' | 'DELETE' | 'PATCH' | 'HEAD' | 'OPTIONS' | 'CONNECT' | 'TRACE' | otherstring;
412
-
413
- name?: string;
414
- novalidate?: boolean;
415
- target?: '_self' | '_blank' | '_parent' | '_top' | string;
416
- }>;
417
-
418
- // Head element
419
- head: BaseAttr & KTReactifyProps<{}>;
420
-
421
- // HR element
422
- hr: BaseAttr & KTReactifyProps<{}>;
423
-
424
- // HTML element
425
- html: BaseAttr & KTReactifyProps<{}>;
426
-
427
- // IFrame element
428
- iframe: BaseAttr &
429
- KTReactifyProps<{
430
- allow?: string;
431
- allowfullscreen?: boolean;
432
- allowpaymentrequest?: boolean;
433
- height?: number | string;
434
- loading?: 'eager' | 'lazy';
435
- name?: string;
436
- referrerpolicy?:
437
- | 'no-referrer'
438
- | 'no-referrer-when-downgrade'
439
- | 'origin'
440
- | 'origin-when-cross-origin'
441
- | 'same-origin'
442
- | 'strict-origin'
443
- | 'strict-origin-when-cross-origin'
444
- | 'unsafe-url';
445
- sandbox?: string;
446
- src?: string;
447
- srcdoc?: string;
448
- width?: number | string;
449
- }>;
450
-
451
- // Image element
452
- img: BaseAttr &
453
- KTReactifyProps<{
454
- alt?: string;
455
- crossorigin?: 'anonymous' | 'use-credentials' | '';
456
- decoding?: 'sync' | 'async' | 'auto';
457
- height?: number | string;
458
- ismap?: boolean;
459
- loading?: 'eager' | 'lazy';
460
- referrerpolicy?:
461
- | 'no-referrer'
462
- | 'no-referrer-when-downgrade'
463
- | 'origin'
464
- | 'origin-when-cross-origin'
465
- | 'same-origin'
466
- | 'strict-origin'
467
- | 'strict-origin-when-cross-origin'
468
- | 'unsafe-url';
469
- sizes?: string;
470
- src?: string;
471
- srcset?: string;
472
- usemap?: string;
473
- width?: number | string;
474
- }>;
475
-
476
- // Input element
477
- input: BaseAttr &
478
- KTReactifyProps<{
479
- accept?: string;
480
- alt?: string;
481
- autocomplete?: string;
482
- checked?: boolean;
483
- dirname?: string;
484
- disabled?: boolean;
485
- form?: string;
486
- formaction?: string;
487
- formenctype?: 'application/x-www-form-urlencoded' | 'multipart/form-data' | 'text/plain';
488
- formmethod?: 'get' | 'post';
489
- formnovalidate?: boolean;
490
- formtarget?: '_self' | '_blank' | '_parent' | '_top' | string;
491
- height?: number | string;
492
- list?: string;
493
- max?: number | string;
494
- maxlength?: number | string;
495
- min?: number | string;
496
- minlength?: number | string;
497
- multiple?: boolean;
498
- name?: string;
499
- pattern?: string;
500
- placeholder?: string;
501
- readonly?: boolean;
502
- required?: boolean;
503
- size?: number | string;
504
- src?: string;
505
- step?: number | string;
506
- type?:
507
- | 'button'
508
- | 'checkbox'
509
- | 'color'
510
- | 'date'
511
- | 'datetime-local'
512
- | 'email'
513
- | 'file'
514
- | 'hidden'
515
- | 'image'
516
- | 'month'
517
- | 'number'
518
- | 'password'
519
- | 'radio'
520
- | 'range'
521
- | 'reset'
522
- | 'search'
523
- | 'submit'
524
- | 'tel'
525
- | 'text'
526
- | 'time'
527
- | 'url'
528
- | 'week';
529
- value?: string;
530
- width?: number | string;
531
- }>;
532
-
533
- // Ins element
534
- ins: BaseAttr &
535
- KTReactifyProps<{
536
- cite?: string;
537
- datetime?: string;
538
- }>;
539
-
540
- // Label element
541
- label: BaseAttr &
542
- KTReactifyProps<{
543
- for?: string;
544
- }>;
545
-
546
- // Legend element
547
- legend: BaseAttr & KTReactifyProps<{}>;
548
-
549
- // LI element
550
- li: BaseAttr &
551
- KTReactifyProps<{
552
- value?: number | string;
553
- }>;
554
-
555
- // Link element
556
- link: BaseAttr &
557
- KTReactifyProps<{
558
- as?: string;
559
- crossorigin?: 'anonymous' | 'use-credentials' | '';
560
- disabled?: boolean;
561
- href?: string;
562
- hreflang?: string;
563
- imagesizes?: string;
564
- imagesrcset?: string;
565
- integrity?: string;
566
- media?: string;
567
- referrerpolicy?:
568
- | 'no-referrer'
569
- | 'no-referrer-when-downgrade'
570
- | 'origin'
571
- | 'origin-when-cross-origin'
572
- | 'same-origin'
573
- | 'strict-origin'
574
- | 'strict-origin-when-cross-origin'
575
- | 'unsafe-url';
576
- rel?: string;
577
- sizes?: string;
578
- type?: string;
579
- }>;
580
-
581
- // Map element
582
- map: BaseAttr &
583
- KTReactifyProps<{
584
- name?: string;
585
- }>;
586
-
587
- // Menu element
588
- menu: BaseAttr & KTReactifyProps<{}>;
589
-
590
- // Meta element
591
- meta: BaseAttr &
592
- KTReactifyProps<{
593
- charset?: string;
594
- content?: string;
595
- 'http-equiv'?: 'content-security-policy' | 'content-type' | 'default-style' | 'refresh' | string;
596
- name?: string;
597
- }>;
598
-
599
- // Meter element
600
- meter: BaseAttr &
601
- KTReactifyProps<{
602
- form?: string;
603
- high?: number | string;
604
- low?: number | string;
605
- max?: number | string;
606
- min?: number | string;
607
- optimum?: number | string;
608
- value?: number | string;
609
- }>;
610
-
611
- // Object element
612
- object: BaseAttr &
613
- KTReactifyProps<{
614
- data?: string;
615
- form?: string;
616
- height?: number | string;
617
- name?: string;
618
- type?: string;
619
- usemap?: string;
620
- width?: number | string;
621
- }>;
622
-
623
- // OL element
624
- ol: BaseAttr &
625
- KTReactifyProps<{
626
- reversed?: boolean;
627
- start?: number | string;
628
- type?: '1' | 'a' | 'A' | 'i' | 'I';
629
- }>;
630
-
631
- // Optgroup element
632
- optgroup: BaseAttr &
633
- KTReactifyProps<{
634
- disabled?: boolean;
635
- label?: string;
636
- }>;
637
-
638
- // Option element
639
- option: BaseAttr &
640
- KTReactifyProps<{
641
- disabled?: boolean;
642
- label?: string;
643
- selected?: boolean;
644
- value?: string;
645
- }>;
646
-
647
- // Output element
648
- output: BaseAttr &
649
- KTReactifyProps<{
650
- for?: string;
651
- form?: string;
652
- name?: string;
653
- }>;
654
-
655
- // Picture element
656
- picture: BaseAttr & KTReactifyProps<{}>;
657
-
658
- // Pre element
659
- pre: BaseAttr & KTReactifyProps<{}>;
660
-
661
- // Progress element
662
- progress: BaseAttr &
663
- KTReactifyProps<{
664
- max?: number | string;
665
- value?: number | string;
666
- }>;
667
-
668
- // Quote element (q and blockquote)
669
- q: BaseAttr &
670
- KTReactifyProps<{
671
- cite?: string;
672
- }>;
673
-
674
- blockquote: BaseAttr &
675
- KTReactifyProps<{
676
- cite?: string;
677
- }>;
678
-
679
- // Script element
680
- script: BaseAttr &
681
- KTReactifyProps<{
682
- async?: boolean;
683
- crossorigin?: 'anonymous' | 'use-credentials' | '';
684
- defer?: boolean;
685
- integrity?: string;
686
- nomodule?: boolean;
687
- referrerpolicy?:
688
- | 'no-referrer'
689
- | 'no-referrer-when-downgrade'
690
- | 'origin'
691
- | 'origin-when-cross-origin'
692
- | 'same-origin'
693
- | 'strict-origin'
694
- | 'strict-origin-when-cross-origin'
695
- | 'unsafe-url';
696
- src?: string;
697
- type?: string;
698
- }>;
699
-
700
- // Select element
701
- select: BaseAttr &
702
- KTReactifyProps<{
703
- autocomplete?: string;
704
- disabled?: boolean;
705
- form?: string;
706
- multiple?: boolean;
707
- name?: string;
708
- required?: boolean;
709
- size?: number | string;
710
- }>;
711
-
712
- // Slot element
713
- slot: BaseAttr &
714
- KTReactifyProps<{
715
- name?: string;
716
- }>;
717
-
718
- // Source element
719
- source: BaseAttr &
720
- KTReactifyProps<{
721
- height?: number | string;
722
- media?: string;
723
- sizes?: string;
724
- src?: string;
725
- srcset?: string;
726
- type?: string;
727
- width?: number | string;
728
- }>;
729
-
730
- // Style element
731
- style: BaseAttr &
732
- KTReactifyProps<{
733
- media?: string;
734
- }>;
735
-
736
- // Table element
737
- table: BaseAttr & KTReactifyProps<{}>;
738
-
739
- // Table body/footer/header elements
740
- tbody: BaseAttr & KTReactifyProps<{}>;
741
-
742
- tfoot: BaseAttr & KTReactifyProps<{}>;
743
-
744
- thead: BaseAttr & KTReactifyProps<{}>;
745
-
746
- // Table cell elements
747
- td: BaseAttr &
748
- KTReactifyProps<{
749
- colspan?: number | string;
750
- headers?: string;
751
- rowspan?: number | string;
752
- }>;
753
-
754
- th: BaseAttr &
755
- KTReactifyProps<{
756
- abbr?: string;
757
- colspan?: number | string;
758
- headers?: string;
759
- rowspan?: number | string;
760
- scope?: 'row' | 'col' | 'rowgroup' | 'colgroup';
761
- }>;
762
-
763
- // Template element
764
- template: BaseAttr & KTReactifyProps<{}>;
765
-
766
- // Textarea element
767
- textarea: BaseAttr &
768
- KTReactifyProps<{
769
- autocomplete?: string;
770
- cols?: number | string;
771
- dirname?: string;
772
- disabled?: boolean;
773
- form?: string;
774
- maxlength?: number | string;
775
- minlength?: number | string;
776
- name?: string;
777
- placeholder?: string;
778
- readonly?: boolean;
779
- required?: boolean;
780
- rows?: number | string;
781
- wrap?: 'hard' | 'soft' | 'off';
782
- }>;
783
-
784
- // Time element
785
- time: BaseAttr &
786
- KTReactifyProps<{
787
- datetime?: string;
788
- }>;
789
-
790
- // Title element
791
- title: BaseAttr & KTReactifyProps<{}>;
792
-
793
- // TR element
794
- tr: BaseAttr & KTReactifyProps<{}>;
795
-
796
- // Track element
797
- track: BaseAttr &
798
- KTReactifyProps<{
799
- default?: boolean;
800
- kind?: 'subtitles' | 'captions' | 'descriptions' | 'chapters' | 'metadata';
801
- label?: string;
802
- src?: string;
803
- srclang?: string;
804
- }>;
805
-
806
- // UL element
807
- ul: BaseAttr & KTReactifyProps<{}>;
808
-
809
- // Video element
810
- video: BaseAttr &
811
- KTReactifyProps<{
812
- autoplay?: boolean;
813
- controls?: boolean;
814
- crossorigin?: 'anonymous' | 'use-credentials' | '';
815
- height?: number | string;
816
- loop?: boolean;
817
- muted?: boolean;
818
- playsinline?: boolean;
819
- poster?: string;
820
- preload?: 'none' | 'metadata' | 'auto' | '';
821
- src?: string;
822
- width?: number | string;
823
- }>;
824
-
825
- // Generic HTMLElement (no specific attributes beyond BaseEvent)
826
- abbr: BaseAttr & KTReactifyProps<{}>;
827
- address: BaseAttr & KTReactifyProps<{}>;
828
- article: BaseAttr & KTReactifyProps<{}>;
829
- aside: BaseAttr & KTReactifyProps<{}>;
830
- b: BaseAttr & KTReactifyProps<{}>;
831
- bdi: BaseAttr & KTReactifyProps<{}>;
832
- bdo: BaseAttr & KTReactifyProps<{}>;
833
- cite: BaseAttr & KTReactifyProps<{}>;
834
- code: BaseAttr & KTReactifyProps<{}>;
835
- dd: BaseAttr & KTReactifyProps<{}>;
836
- dfn: BaseAttr & KTReactifyProps<{}>;
837
- div: BaseAttr & KTReactifyProps<{}>;
838
- dl: BaseAttr & KTReactifyProps<{}>;
839
- dt: BaseAttr & KTReactifyProps<{}>;
840
- em: BaseAttr & KTReactifyProps<{}>;
841
- figcaption: BaseAttr & KTReactifyProps<{}>;
842
- figure: BaseAttr & KTReactifyProps<{}>;
843
- footer: BaseAttr & KTReactifyProps<{}>;
844
- h1: BaseAttr & KTReactifyProps<{}>;
845
- h2: BaseAttr & KTReactifyProps<{}>;
846
- h3: BaseAttr & KTReactifyProps<{}>;
847
- h4: BaseAttr & KTReactifyProps<{}>;
848
- h5: BaseAttr & KTReactifyProps<{}>;
849
- h6: BaseAttr & KTReactifyProps<{}>;
850
- header: BaseAttr & KTReactifyProps<{}>;
851
- hgroup: BaseAttr & KTReactifyProps<{}>;
852
- i: BaseAttr & KTReactifyProps<{}>;
853
- kbd: BaseAttr & KTReactifyProps<{}>;
854
- main: BaseAttr & KTReactifyProps<{}>;
855
- mark: BaseAttr & KTReactifyProps<{}>;
856
- nav: BaseAttr & KTReactifyProps<{}>;
857
- noscript: BaseAttr & KTReactifyProps<{}>;
858
- p: BaseAttr & KTReactifyProps<{}>;
859
- rp: BaseAttr & KTReactifyProps<{}>;
860
- rt: BaseAttr & KTReactifyProps<{}>;
861
- ruby: BaseAttr & KTReactifyProps<{}>;
862
- s: BaseAttr & KTReactifyProps<{}>;
863
- samp: BaseAttr & KTReactifyProps<{}>;
864
- search: BaseAttr & KTReactifyProps<{}>;
865
- section: BaseAttr & KTReactifyProps<{}>;
866
- small: BaseAttr & KTReactifyProps<{}>;
867
- span: BaseAttr & KTReactifyProps<{}>;
868
- strong: BaseAttr & KTReactifyProps<{}>;
869
- sub: BaseAttr & KTReactifyProps<{}>;
870
- summary: BaseAttr & KTReactifyProps<{}>;
871
- sup: BaseAttr & KTReactifyProps<{}>;
872
- u: BaseAttr & KTReactifyProps<{}>;
873
- var: BaseAttr & KTReactifyProps<{}>;
874
- wbr: BaseAttr & KTReactifyProps<{}>;
875
-
876
- svg: BaseAttr & {
877
- class?: string;
878
- style?: string | Partial<CSSStyleDeclaration>;
879
- width?: number | string;
880
- height?: number | string;
881
- viewBox?: string;
882
- xmlns?: string;
883
- fill?: string;
884
- stroke?: string;
885
- strokeWidth?: number | string;
886
- strokeLinecap?: 'butt' | 'round' | 'square' | 'inherit';
887
- strokeLinejoin?: 'miter' | 'round' | 'bevel' | 'inherit';
888
- strokeDasharray?: string;
889
- strokeDashoffset?: number | string;
890
- opacity?: number | string;
891
- preserveAspectRatio?: string;
892
- transform?: string;
893
- x?: number | string;
894
- y?: number | string;
895
- rx?: number | string;
896
- ry?: number | string;
897
- r?: number | string;
898
- cx?: number | string;
899
- cy?: number | string;
900
- d?: string;
901
- points?: string;
902
- pathLength?: number | string;
903
- viewbox?: string;
904
- role?: string;
905
- focusable?: boolean | 'true' | 'false';
906
- xlinkHref?: string; // legacy xlink:href
907
- };
908
- }
909
-
910
- interface SVGAttributesMap {
911
- a: AttributesMap['svg'] & { href?: string; x?: number | string; y?: number | string };
912
- animate: AttributesMap['svg'] & {
913
- attributeName?: string;
914
- from?: string | number;
915
- to?: string | number;
916
- dur?: string;
917
- repeatCount?: string | number;
918
- };
919
- animateMotion: AttributesMap['svg'] & { path?: string; dur?: string; rotate?: string };
920
- animateTransform: AttributesMap['svg'] & { type?: string; from?: string; to?: string; dur?: string };
921
- circle: AttributesMap['svg'] & { cx?: number | string; cy?: number | string; r?: number | string };
922
- clipPath: AttributesMap['svg'] & { clipPathUnits?: 'userSpaceOnUse' | 'objectBoundingBox' };
923
- defs: AttributesMap['svg'];
924
- desc: AttributesMap['svg'];
925
- ellipse: AttributesMap['svg'] & {
926
- cx?: number | string;
927
- cy?: number | string;
928
- rx?: number | string;
929
- ry?: number | string;
930
- };
931
-
932
- // Filter primitives (provide common props)
933
- feBlend: AttributesMap['svg'] & { in?: string; in2?: string; mode?: string };
934
- feColorMatrix: AttributesMap['svg'] & {
935
- type?: 'matrix' | 'saturate' | 'hueRotate' | 'luminanceToAlpha';
936
- values?: string;
937
- };
938
- feComponentTransfer: AttributesMap['svg'] & {};
939
- feComposite: AttributesMap['svg'] & {
940
- in?: string;
941
- in2?: string;
942
- operator?: string;
943
- k1?: number | string;
944
- k2?: number | string;
945
- k3?: number | string;
946
- k4?: number | string;
947
- };
948
- feConvolveMatrix: AttributesMap['svg'] & {
949
- order?: string | number;
950
- kernelMatrix?: string;
951
- divisor?: string | number;
952
- bias?: string | number;
953
- };
954
- feDiffuseLighting: AttributesMap['svg'] & {};
955
- feDisplacementMap: AttributesMap['svg'] & {
956
- in?: string;
957
- in2?: string;
958
- scale?: number | string;
959
- xChannelSelector?: string;
960
- yChannelSelector?: string;
961
- };
962
- feDistantLight: AttributesMap['svg'] & { azimuth?: number | string; elevation?: number | string };
963
- feDropShadow: AttributesMap['svg'] & {
964
- dx?: number | string;
965
- dy?: number | string;
966
- stdDeviation?: number | string;
967
- floodColor?: string;
968
- floodOpacity?: number | string;
969
- };
970
- feFlood: AttributesMap['svg'] & { floodColor?: string; floodOpacity?: number | string };
971
- feFuncA: AttributesMap['svg'] & {};
972
- feFuncB: AttributesMap['svg'] & {};
973
- feFuncG: AttributesMap['svg'] & {};
974
- feFuncR: AttributesMap['svg'] & {};
975
- feGaussianBlur: AttributesMap['svg'] & { stdDeviation?: number | string; edgeMode?: string };
976
- feImage: AttributesMap['svg'] & { href?: string };
977
- feMerge: AttributesMap['svg'] & {};
978
- feMergeNode: AttributesMap['svg'] & { in?: string };
979
- feMorphology: AttributesMap['svg'] & { operator?: 'erode' | 'dilate'; radius?: number | string };
980
- feOffset: AttributesMap['svg'] & { dx?: number | string; dy?: number | string };
981
- fePointLight: AttributesMap['svg'] & { x?: number | string; y?: number | string; z?: number | string };
982
- feSpecularLighting: AttributesMap['svg'] & {
983
- specularConstant?: number | string;
984
- specularExponent?: number | string;
985
- surfaceScale?: number | string;
986
- };
987
- feSpotLight: AttributesMap['svg'] & {
988
- x?: number | string;
989
- y?: number | string;
990
- z?: number | string;
991
- pointsAtX?: number | string;
992
- pointsAtY?: number | string;
993
- pointsAtZ?: number | string;
994
- specularExponent?: number | string;
995
- limitingConeAngle?: number | string;
996
- };
997
- feTile: AttributesMap['svg'] & {};
998
- feTurbulence: AttributesMap['svg'] & {
999
- baseFrequency?: number | string;
1000
- numOctaves?: number | string;
1001
- seed?: number | string;
1002
- stitchTiles?: string;
1003
- type?: 'fractalNoise' | 'turbulence';
1004
- };
1005
-
1006
- filter: AttributesMap['svg'] & {
1007
- x?: number | string;
1008
- y?: number | string;
1009
- width?: number | string;
1010
- height?: number | string;
1011
- filterUnits?: string;
1012
- primitiveUnits?: string;
1013
- };
1014
- foreignObject: AttributesMap['svg'] & {
1015
- x?: number | string;
1016
- y?: number | string;
1017
- width?: number | string;
1018
- height?: number | string;
1019
- };
1020
- g: AttributesMap['svg'];
1021
- image: AttributesMap['svg'] & {
1022
- href?: string;
1023
- x?: number | string;
1024
- y?: number | string;
1025
- width?: number | string;
1026
- height?: number | string;
1027
- };
1028
- line: AttributesMap['svg'] & {
1029
- x1?: number | string;
1030
- y1?: number | string;
1031
- x2?: number | string;
1032
- y2?: number | string;
1033
- };
1034
- linearGradient: AttributesMap['svg'] & {
1035
- x1?: number | string;
1036
- y1?: number | string;
1037
- x2?: number | string;
1038
- y2?: number | string;
1039
- gradientUnits?: 'userSpaceOnUse' | 'objectBoundingBox';
1040
- gradientTransform?: string;
1041
- };
1042
- marker: AttributesMap['svg'] & {
1043
- markerUnits?: string;
1044
- markerWidth?: number | string;
1045
- markerHeight?: number | string;
1046
- refX?: number | string;
1047
- refY?: number | string;
1048
- orient?: string;
1049
- };
1050
- mask: AttributesMap['svg'] & {
1051
- maskUnits?: string;
1052
- maskContentUnits?: string;
1053
- x?: number | string;
1054
- y?: number | string;
1055
- width?: number | string;
1056
- height?: number | string;
1057
- };
1058
- metadata: AttributesMap['svg'];
1059
- mpath: AttributesMap['svg'] & { href?: string };
1060
- path: AttributesMap['svg'] & { d?: string; pathLength?: number | string };
1061
- pattern: AttributesMap['svg'] & {
1062
- patternUnits?: string;
1063
- patternContentUnits?: string;
1064
- width?: number | string;
1065
- height?: number | string;
1066
- x?: number | string;
1067
- y?: number | string;
1068
- };
1069
- polygon: AttributesMap['svg'] & { points?: string };
1070
- polyline: AttributesMap['svg'] & { points?: string };
1071
- radialGradient: AttributesMap['svg'] & {
1072
- cx?: number | string;
1073
- cy?: number | string;
1074
- r?: number | string;
1075
- fx?: number | string;
1076
- fy?: number | string;
1077
- gradientUnits?: 'userSpaceOnUse' | 'objectBoundingBox';
1078
- gradientTransform?: string;
1079
- };
1080
- rect: AttributesMap['svg'] & {
1081
- x?: number | string;
1082
- y?: number | string;
1083
- width?: number | string;
1084
- height?: number | string;
1085
- rx?: number | string;
1086
- ry?: number | string;
1087
- };
1088
- script: AttributesMap['svg'] & { href?: string; type?: string };
1089
- set: AttributesMap['svg'] & { attributeName?: string; to?: string | number; begin?: string; dur?: string };
1090
- stop: AttributesMap['svg'] & { offset?: number | string; stopColor?: string; stopOpacity?: number | string };
1091
- style: AttributesMap['svg'] & { media?: string };
1092
- svg: AttributesMap['svg'];
1093
- switch: AttributesMap['svg'];
1094
- symbol: AttributesMap['svg'] & { viewBox?: string; preserveAspectRatio?: string };
1095
- text: AttributesMap['svg'] & {
1096
- x?: number | string;
1097
- y?: number | string;
1098
- dx?: number | string;
1099
- dy?: number | string;
1100
- textLength?: number | string;
1101
- };
1102
- textPath: AttributesMap['svg'] & { href?: string; startOffset?: number | string };
1103
- title: AttributesMap['svg'];
1104
- tspan: AttributesMap['svg'] & {
1105
- x?: number | string;
1106
- y?: number | string;
1107
- dx?: number | string;
1108
- dy?: number | string;
1109
- };
1110
- use: AttributesMap['svg'] & {
1111
- href?: string;
1112
- x?: number | string;
1113
- y?: number | string;
1114
- width?: number | string;
1115
- height?: number | string;
1116
- };
1117
- view: AttributesMap['svg'] & { viewBox?: string; preserveAspectRatio?: string };
1118
- }
1119
-
1120
- declare global {
1121
- namespace JSX {
1122
- type Element = HTMLElementTagNameMap[keyof HTMLElementTagNameMap];
1123
-
1124
- interface IntrinsicElements {
1125
- [k: string]: AttributesMap['div']; // Allow any element with div attributes as fallback
1126
-
1127
- // Document-level & metadata
1128
- html: AttributesMap['html'];
1129
- head: AttributesMap['head'];
1130
- title: AttributesMap['title'];
1131
- base: AttributesMap['base'];
1132
- link: AttributesMap['link'];
1133
- meta: AttributesMap['meta'];
1134
-
1135
- // Sectioning
1136
- body: AttributesMap['body'];
1137
- header: AttributesMap['header'];
1138
- footer: AttributesMap['footer'];
1139
- nav: AttributesMap['nav'];
1140
- main: AttributesMap['main'];
1141
- section: AttributesMap['section'];
1142
- article: AttributesMap['article'];
1143
- aside: AttributesMap['aside'];
1144
-
1145
- // Headings
1146
- h1: AttributesMap['h1'];
1147
- h2: AttributesMap['h2'];
1148
- h3: AttributesMap['h3'];
1149
- h4: AttributesMap['h4'];
1150
- h5: AttributesMap['h5'];
1151
- h6: AttributesMap['h6'];
1152
-
1153
- // Text content
1154
- p: AttributesMap['p'];
1155
- pre: AttributesMap['pre'];
1156
- code: AttributesMap['code'];
1157
- strong: AttributesMap['strong'];
1158
- small: AttributesMap['small'];
1159
- em: AttributesMap['em'];
1160
- br: AttributesMap['br'];
1161
- i: AttributesMap['i'];
1162
-
1163
- // Lists
1164
- ul: AttributesMap['ul'];
1165
- ol: AttributesMap['ol'];
1166
- li: AttributesMap['li'];
1167
-
1168
- // Tables
1169
- table: AttributesMap['table'];
1170
- thead: AttributesMap['thead'];
1171
- tbody: AttributesMap['tbody'];
1172
- tfoot: AttributesMap['tfoot'];
1173
- tr: AttributesMap['tr'];
1174
- th: AttributesMap['th'];
1175
- td: AttributesMap['td'];
1176
-
1177
- // Forms
1178
- form: AttributesMap['form'];
1179
- label: AttributesMap['label'];
1180
- input: AttributesMap['input'];
1181
- textarea: AttributesMap['textarea'];
1182
- select: AttributesMap['select'];
1183
- option: AttributesMap['option'];
1184
- optgroup: AttributesMap['optgroup'];
1185
- button: AttributesMap['button'];
1186
- fieldset: AttributesMap['fieldset'];
1187
- legend: AttributesMap['legend'];
1188
- datalist: AttributesMap['datalist'];
1189
- output: AttributesMap['output'];
1190
-
1191
- // Media & embedded
1192
- img: AttributesMap['img'];
1193
- picture: AttributesMap['picture'];
1194
- source: AttributesMap['source'];
1195
- audio: AttributesMap['audio'];
1196
- video: AttributesMap['video'];
1197
- track: AttributesMap['track'];
1198
- iframe: AttributesMap['iframe'];
1199
- embed: AttributesMap['embed'];
1200
- object: AttributesMap['object'];
1201
- canvas: AttributesMap['canvas'];
1202
-
1203
- // Interactive & misc
1204
- a: AttributesMap['a'] & SVGAttributesMap['a'];
1205
- area: AttributesMap['area'];
1206
- map: AttributesMap['map'];
1207
- details: AttributesMap['details'];
1208
- dialog: AttributesMap['dialog'];
1209
- summary: AttributesMap['summary'];
1210
- slot: AttributesMap['slot'];
1211
-
1212
- // Scripting & styles
1213
- script: AttributesMap['script'];
1214
- style: AttributesMap['style'];
1215
-
1216
- // Semantic & phrasing
1217
- figure: AttributesMap['figure'];
1218
- figcaption: AttributesMap['figcaption'];
1219
- blockquote: AttributesMap['blockquote'];
1220
- q: AttributesMap['q'];
1221
-
1222
- // Generic elements
1223
- div: AttributesMap['div'];
1224
- span: AttributesMap['span'];
1225
- address: AttributesMap['address'];
1226
- abbr: AttributesMap['abbr'];
1227
- b: AttributesMap['b'];
1228
- cite: AttributesMap['cite'];
1229
- dl: AttributesMap['dl'];
1230
- dt: AttributesMap['dt'];
1231
- dd: AttributesMap['dd'];
1232
- hr: AttributesMap['hr'];
1233
-
1234
- // SVG
1235
- svg: AttributesMap['svg'];
1236
- // a: SVGAttributesMap['a'];
1237
- animate: SVGAttributesMap['animate'];
1238
- animateMotion: SVGAttributesMap['animateMotion'];
1239
- animateTransform: SVGAttributesMap['animateTransform'];
1240
- circle: SVGAttributesMap['circle'];
1241
- clipPath: SVGAttributesMap['clipPath'];
1242
- defs: SVGAttributesMap['defs'];
1243
- desc: SVGAttributesMap['desc'];
1244
- ellipse: SVGAttributesMap['ellipse'];
1245
- feBlend: SVGAttributesMap['feBlend'];
1246
- feColorMatrix: SVGAttributesMap['feColorMatrix'];
1247
- feComponentTransfer: SVGAttributesMap['feComponentTransfer'];
1248
- feComposite: SVGAttributesMap['feComposite'];
1249
- feConvolveMatrix: SVGAttributesMap['feConvolveMatrix'];
1250
- feDiffuseLighting: SVGAttributesMap['feDiffuseLighting'];
1251
- feDisplacementMap: SVGAttributesMap['feDisplacementMap'];
1252
- feDistantLight: SVGAttributesMap['feDistantLight'];
1253
- feDropShadow: SVGAttributesMap['feDropShadow'];
1254
- feFlood: SVGAttributesMap['feFlood'];
1255
- feFuncA: SVGAttributesMap['feFuncA'];
1256
- feFuncB: SVGAttributesMap['feFuncB'];
1257
- feFuncG: SVGAttributesMap['feFuncG'];
1258
- feFuncR: SVGAttributesMap['feFuncR'];
1259
- feGaussianBlur: SVGAttributesMap['feGaussianBlur'];
1260
- feImage: SVGAttributesMap['feImage'];
1261
- feMerge: SVGAttributesMap['feMerge'];
1262
- feMergeNode: SVGAttributesMap['feMergeNode'];
1263
- feMorphology: SVGAttributesMap['feMorphology'];
1264
- feOffset: SVGAttributesMap['feOffset'];
1265
- fePointLight: SVGAttributesMap['fePointLight'];
1266
- feSpecularLighting: SVGAttributesMap['feSpecularLighting'];
1267
- feSpotLight: SVGAttributesMap['feSpotLight'];
1268
- feTile: SVGAttributesMap['feTile'];
1269
- feTurbulence: SVGAttributesMap['feTurbulence'];
1270
- filter: SVGAttributesMap['filter'];
1271
- foreignObject: SVGAttributesMap['foreignObject'];
1272
- g: SVGAttributesMap['g'];
1273
- image: SVGAttributesMap['image'];
1274
- line: SVGAttributesMap['line'];
1275
- linearGradient: SVGAttributesMap['linearGradient'];
1276
- marker: SVGAttributesMap['marker'];
1277
- mask: SVGAttributesMap['mask'];
1278
- metadata: SVGAttributesMap['metadata'];
1279
- mpath: SVGAttributesMap['mpath'];
1280
- path: SVGAttributesMap['path'];
1281
- pattern: SVGAttributesMap['pattern'];
1282
- polygon: SVGAttributesMap['polygon'];
1283
- polyline: SVGAttributesMap['polyline'];
1284
- radialGradient: SVGAttributesMap['radialGradient'];
1285
- rect: SVGAttributesMap['rect'];
1286
- set: SVGAttributesMap['set'];
1287
- stop: SVGAttributesMap['stop'];
1288
- switch: SVGAttributesMap['switch'];
1289
- symbol: SVGAttributesMap['symbol'];
1290
- text: SVGAttributesMap['text'];
1291
- textPath: SVGAttributesMap['textPath'];
1292
- tspan: SVGAttributesMap['tspan'];
1293
- use: SVGAttributesMap['use'];
1294
- view: SVGAttributesMap['view'];
1295
- }
1296
-
1297
- type IntrinsicAttributes = {
1298
- /**
1299
- * Make a reference to the created element
1300
- */
1301
- ref?: KTRef<any>;
1302
-
1303
- /**
1304
- * Conditional rendering
1305
- * - Provide a `KTRef` to make it reactive
1306
- */
1307
- 'k-if'?: any;
1308
-
1309
- /**
1310
- * 2-way binding
1311
- * - Provide a `KTRef` to make it reactive
1312
- */
1313
- 'k-model'?: KTRef<any>;
1314
-
1315
- /**
1316
- * Raw html binding
1317
- * - Provide a `KTRef` to make it reactive
1318
- */
1319
- 'k-html'?: any;
1320
- children?: KTRawContent;
1321
- };
1322
-
1323
- interface ElementChildrenAttribute {
1324
- children: {};
1325
- }
1326
- }
1327
- }
1328
-
1329
- export { Fragment, h as createElement, createRedrawable, jsx, jsxDEV, jsxs };