@ktjs/core 0.18.8 → 0.19.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.
- package/dist/index.d.ts +24 -17
- package/dist/index.iife.js +104 -89
- package/dist/index.legacy.js +103 -96
- package/dist/index.mjs +104 -90
- package/dist/jsx/index.d.ts +24 -17
- package/dist/jsx/index.mjs +100 -86
- package/dist/jsx/jsx-runtime.d.ts +21 -14
- package/dist/jsx/jsx-runtime.mjs +99 -85
- package/package.json +4 -1
package/dist/index.mjs
CHANGED
|
@@ -1,7 +1,53 @@
|
|
|
1
|
+
// Cached native methods for performance optimization
|
|
2
|
+
const $isArray = Array.isArray;
|
|
3
|
+
const $isThenable = (o) => typeof o === 'object' && o !== null && typeof o.then === 'function';
|
|
4
|
+
|
|
5
|
+
// Error handling utilities
|
|
1
6
|
const $throw = (message) => {
|
|
2
|
-
throw new Error('
|
|
7
|
+
throw new Error('@ktjs/shared: ' + message);
|
|
3
8
|
};
|
|
4
9
|
|
|
10
|
+
// DOM manipulation utilities
|
|
11
|
+
/**
|
|
12
|
+
* & Remove `bind` because it is shockingly slower than wrapper
|
|
13
|
+
* & `window.document` is safe because it is not configurable and its setter is undefined
|
|
14
|
+
*/
|
|
15
|
+
const $appendChild = HTMLElement.prototype.appendChild;
|
|
16
|
+
const originAppend = HTMLElement.prototype.append;
|
|
17
|
+
const $append = // for ie 9/10/11
|
|
18
|
+
typeof originAppend === 'function'
|
|
19
|
+
? originAppend
|
|
20
|
+
: function (...nodes) {
|
|
21
|
+
if (nodes.length < 50) {
|
|
22
|
+
for (let i = 0; i < nodes.length; i++) {
|
|
23
|
+
const node = nodes[i];
|
|
24
|
+
if (typeof node === 'string') {
|
|
25
|
+
$appendChild.call(this, document.createTextNode(node));
|
|
26
|
+
}
|
|
27
|
+
else {
|
|
28
|
+
$appendChild.call(this, node);
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
else {
|
|
33
|
+
const fragment = document.createDocumentFragment();
|
|
34
|
+
for (let i = 0; i < nodes.length; i++) {
|
|
35
|
+
const node = nodes[i];
|
|
36
|
+
if (typeof node === 'string') {
|
|
37
|
+
$appendChild.call(fragment, document.createTextNode(node));
|
|
38
|
+
}
|
|
39
|
+
else {
|
|
40
|
+
$appendChild.call(fragment, node);
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
$appendChild.call(this, fragment);
|
|
44
|
+
}
|
|
45
|
+
};
|
|
46
|
+
|
|
47
|
+
// Shared utilities and cached native methods for kt.js framework
|
|
48
|
+
// Re-export all utilities
|
|
49
|
+
Object.defineProperty(window, '@ktjs/shared', { value: '0.19.0' });
|
|
50
|
+
|
|
5
51
|
const booleanHandler = (element, key, value) => {
|
|
6
52
|
if (key in element) {
|
|
7
53
|
element[key] = !!value;
|
|
@@ -72,7 +118,7 @@ function attrIsObject(element, attr) {
|
|
|
72
118
|
const o = attr[key];
|
|
73
119
|
// normal event handler
|
|
74
120
|
if (key.startsWith('on:')) {
|
|
75
|
-
element.addEventListener(key.slice(3), o); // chop off the
|
|
121
|
+
element.addEventListener(key.slice(3), o); // chop off the `on:`
|
|
76
122
|
}
|
|
77
123
|
// normal attributes
|
|
78
124
|
else {
|
|
@@ -92,51 +138,6 @@ function applyAttr(element, attr) {
|
|
|
92
138
|
}
|
|
93
139
|
}
|
|
94
140
|
|
|
95
|
-
/**
|
|
96
|
-
* & Remove `bind` because it is shockingly slower than wrapper
|
|
97
|
-
* & `window.document` is safe because it is not configurable and its setter is undefined
|
|
98
|
-
*/
|
|
99
|
-
const $appendChild = HTMLElement.prototype.appendChild;
|
|
100
|
-
const originAppend = HTMLElement.prototype.append;
|
|
101
|
-
const $append = // for ie 9/10/11
|
|
102
|
-
typeof originAppend === 'function'
|
|
103
|
-
? function (...args) {
|
|
104
|
-
return originAppend.apply(this, args);
|
|
105
|
-
}
|
|
106
|
-
: function (...nodes) {
|
|
107
|
-
if (nodes.length < 50) {
|
|
108
|
-
for (let i = 0; i < nodes.length; i++) {
|
|
109
|
-
const node = nodes[i];
|
|
110
|
-
if (typeof node === 'string') {
|
|
111
|
-
$appendChild.call(this, document.createTextNode(node));
|
|
112
|
-
}
|
|
113
|
-
else {
|
|
114
|
-
$appendChild.call(this, node);
|
|
115
|
-
}
|
|
116
|
-
}
|
|
117
|
-
}
|
|
118
|
-
else {
|
|
119
|
-
const fragment = document.createDocumentFragment();
|
|
120
|
-
for (let i = 0; i < nodes.length; i++) {
|
|
121
|
-
const node = nodes[i];
|
|
122
|
-
if (typeof node === 'string') {
|
|
123
|
-
$appendChild.call(fragment, document.createTextNode(node));
|
|
124
|
-
}
|
|
125
|
-
else {
|
|
126
|
-
$appendChild.call(fragment, node);
|
|
127
|
-
}
|
|
128
|
-
}
|
|
129
|
-
$appendChild.call(this, fragment);
|
|
130
|
-
}
|
|
131
|
-
};
|
|
132
|
-
|
|
133
|
-
const $isArray = Array.isArray;
|
|
134
|
-
const emptyPromiseHandler = () => ({});
|
|
135
|
-
if (typeof Promise === 'undefined') {
|
|
136
|
-
window.Promise = { resolve: emptyPromiseHandler, reject: emptyPromiseHandler };
|
|
137
|
-
}
|
|
138
|
-
const $isThenable = (o) => typeof o === 'object' && o !== null && typeof o.then === 'function';
|
|
139
|
-
|
|
140
141
|
function apdSingle(element, c) {
|
|
141
142
|
// & JSX should ignore false, undefined, and null
|
|
142
143
|
if (c === false || c === undefined || c === null) {
|
|
@@ -199,7 +200,7 @@ const svgTempWrapper = document.createElement('div');
|
|
|
199
200
|
* ## About
|
|
200
201
|
* @package @ktjs/core
|
|
201
202
|
* @author Kasukabe Tsumugi <futami16237@gmail.com>
|
|
202
|
-
* @version 0.
|
|
203
|
+
* @version 0.19.0 (Last Update: 2026.01.31 22:50:55.987)
|
|
203
204
|
* @license MIT
|
|
204
205
|
* @link https://github.com/baendlorel/kt.js
|
|
205
206
|
* @link https://baendlorel.github.io/ Welcome to my site!
|
|
@@ -222,47 +223,60 @@ const h = (tag, attr, content) => {
|
|
|
222
223
|
return element;
|
|
223
224
|
};
|
|
224
225
|
|
|
226
|
+
class KTRef {
|
|
227
|
+
/**
|
|
228
|
+
* Indicates that this is a KTRef instance
|
|
229
|
+
*/
|
|
230
|
+
isKT = true;
|
|
231
|
+
_value;
|
|
232
|
+
_onChanges;
|
|
233
|
+
constructor(_value, _onChanges) {
|
|
234
|
+
this._value = _value;
|
|
235
|
+
this._onChanges = _onChanges;
|
|
236
|
+
}
|
|
237
|
+
/**
|
|
238
|
+
* If new value and old value are both nodes, the old one will be replaced in the DOM
|
|
239
|
+
*/
|
|
240
|
+
get value() {
|
|
241
|
+
return this._value;
|
|
242
|
+
}
|
|
243
|
+
set value(newValue) {
|
|
244
|
+
if (newValue === this._value) {
|
|
245
|
+
return;
|
|
246
|
+
}
|
|
247
|
+
// replace the old node with the new one in the DOM if both are nodes
|
|
248
|
+
if (this._value instanceof Node && newValue instanceof Node) {
|
|
249
|
+
if (newValue.contains(this._value)) {
|
|
250
|
+
this._value.remove();
|
|
251
|
+
}
|
|
252
|
+
this._value.replaceWith(newValue);
|
|
253
|
+
}
|
|
254
|
+
const oldValue = this._value;
|
|
255
|
+
this._value = newValue;
|
|
256
|
+
for (let i = 0; i < this._onChanges.length; i++) {
|
|
257
|
+
this._onChanges[i](newValue, oldValue);
|
|
258
|
+
}
|
|
259
|
+
}
|
|
260
|
+
addOnChange(callback) {
|
|
261
|
+
this._onChanges.push(callback);
|
|
262
|
+
}
|
|
263
|
+
removeOnChange(callback) {
|
|
264
|
+
for (let i = this._onChanges.length - 1; i >= 0; i--) {
|
|
265
|
+
if (this._onChanges[i] === callback) {
|
|
266
|
+
this._onChanges.splice(i, 1);
|
|
267
|
+
return true;
|
|
268
|
+
}
|
|
269
|
+
}
|
|
270
|
+
return false;
|
|
271
|
+
}
|
|
272
|
+
}
|
|
225
273
|
/**
|
|
226
274
|
* Reference to the created HTML element.
|
|
227
275
|
* - can alse be used to store normal values, but it is not reactive.
|
|
228
276
|
* @param value mostly an HTMLElement
|
|
229
277
|
*/
|
|
230
278
|
function ref(value, onChange) {
|
|
231
|
-
|
|
232
|
-
let _onChanges = onChange ? [onChange] : [];
|
|
233
|
-
return {
|
|
234
|
-
isKT: true,
|
|
235
|
-
get value() {
|
|
236
|
-
return _value;
|
|
237
|
-
},
|
|
238
|
-
set value(newValue) {
|
|
239
|
-
if (newValue === _value) {
|
|
240
|
-
return;
|
|
241
|
-
}
|
|
242
|
-
// replace the old node with the new one in the DOM if both are nodes
|
|
243
|
-
if (_value instanceof Node && newValue instanceof Node) {
|
|
244
|
-
if (newValue.contains(_value)) {
|
|
245
|
-
_value.remove();
|
|
246
|
-
}
|
|
247
|
-
_value.replaceWith(newValue);
|
|
248
|
-
}
|
|
249
|
-
const oldValue = _value;
|
|
250
|
-
_value = newValue;
|
|
251
|
-
for (let i = 0; i < _onChanges.length; i++) {
|
|
252
|
-
_onChanges[i](newValue, oldValue);
|
|
253
|
-
}
|
|
254
|
-
},
|
|
255
|
-
addOnChange: (callback) => _onChanges.push(callback),
|
|
256
|
-
removeOnChange: (callback) => {
|
|
257
|
-
for (let i = _onChanges.length - 1; i >= 0; i--) {
|
|
258
|
-
if (_onChanges[i] === callback) {
|
|
259
|
-
_onChanges.splice(i, 1);
|
|
260
|
-
return true;
|
|
261
|
-
}
|
|
262
|
-
}
|
|
263
|
-
return false;
|
|
264
|
-
},
|
|
265
|
-
};
|
|
279
|
+
return new KTRef(value, onChange ? [onChange] : []);
|
|
266
280
|
}
|
|
267
281
|
|
|
268
282
|
const dummyRef = { value: null };
|
|
@@ -277,13 +291,13 @@ function jsx(tag, props = {}) {
|
|
|
277
291
|
props = newProps ? { ...props, ...newProps } : props;
|
|
278
292
|
el = jsx(tag, props);
|
|
279
293
|
if (ref !== dummyRef) {
|
|
280
|
-
ref.value = el; // ref setter automatically replaces old element in DOM
|
|
294
|
+
ref.value = el; // & ref setter automatically replaces old element in DOM
|
|
281
295
|
}
|
|
282
296
|
return el;
|
|
283
297
|
};
|
|
284
298
|
if ('k-if' in props && !props['k-if']) {
|
|
285
299
|
el = document.createComment('k-if');
|
|
286
|
-
ref.value = el;
|
|
300
|
+
ref.value = el; // & ref setter automatically replaces old element in DOM
|
|
287
301
|
el.redraw = redraw;
|
|
288
302
|
return el;
|
|
289
303
|
}
|
|
@@ -429,10 +443,10 @@ function KTFor(props) {
|
|
|
429
443
|
// Attach elements array to anchor
|
|
430
444
|
anchor.__kt_for_list__ = elements;
|
|
431
445
|
// Redraw function for updates
|
|
432
|
-
anchor.redraw = (newProps
|
|
433
|
-
const newList = (newProps
|
|
434
|
-
const newKey = (newProps
|
|
435
|
-
const newMap = (newProps
|
|
446
|
+
anchor.redraw = (newProps) => {
|
|
447
|
+
const newList = (newProps?.list ?? currentList);
|
|
448
|
+
const newKey = (newProps?.key ?? currentKey);
|
|
449
|
+
const newMap = (newProps?.map ?? currentMap);
|
|
436
450
|
// Update stored values
|
|
437
451
|
currentList = newList;
|
|
438
452
|
currentKey = newKey;
|
|
@@ -614,4 +628,4 @@ function getSequence(arr) {
|
|
|
614
628
|
return result;
|
|
615
629
|
}
|
|
616
630
|
|
|
617
|
-
export { Fragment, KTAsync, KTFor, h as createElement, createRedrawable, createRedrawableNoref, h, jsx, jsxDEV, jsxs, ref };
|
|
631
|
+
export { Fragment, KTAsync, KTFor, KTRef, h as createElement, createRedrawable, createRedrawableNoref, h, jsx, jsxDEV, jsxs, ref };
|
package/dist/jsx/index.d.ts
CHANGED
|
@@ -6,25 +6,32 @@ type otherstring = string & {};
|
|
|
6
6
|
type HTMLTag = keyof HTMLElementTagNameMap;
|
|
7
7
|
type SVGTag = keyof SVGElementTagNameMap;
|
|
8
8
|
|
|
9
|
-
type
|
|
10
|
-
|
|
9
|
+
type RefChangeHandler<T> = (newValue: T, oldValue: T) => void;
|
|
10
|
+
declare class KTRef<T> {
|
|
11
|
+
/**
|
|
12
|
+
* Indicates that this is a KTRef instance
|
|
13
|
+
*/
|
|
14
|
+
isKT: boolean;
|
|
15
|
+
private _value;
|
|
16
|
+
private _onChanges;
|
|
17
|
+
constructor(_value: T, _onChanges: Array<RefChangeHandler<T>>);
|
|
11
18
|
/**
|
|
12
19
|
* If new value and old value are both nodes, the old one will be replaced in the DOM
|
|
13
20
|
*/
|
|
14
|
-
value: T;
|
|
15
|
-
|
|
16
|
-
addOnChange
|
|
17
|
-
removeOnChange
|
|
21
|
+
get value(): T;
|
|
22
|
+
set value(newValue: T);
|
|
23
|
+
addOnChange(callback: RefChangeHandler<T>): void;
|
|
24
|
+
removeOnChange(callback: RefChangeHandler<T>): boolean;
|
|
18
25
|
}
|
|
19
26
|
/**
|
|
20
27
|
* Reference to the created HTML element.
|
|
21
28
|
* - can alse be used to store normal values, but it is not reactive.
|
|
22
29
|
* @param value mostly an HTMLElement
|
|
23
30
|
*/
|
|
24
|
-
declare function ref<T = HTMLElement>(value?: T, onChange?:
|
|
31
|
+
declare function ref<T = HTMLElement>(value?: T, onChange?: RefChangeHandler<T>): KTRef<T>;
|
|
25
32
|
|
|
26
33
|
// Base events available to all HTML elements
|
|
27
|
-
|
|
34
|
+
interface BaseAttr {
|
|
28
35
|
[k: string]: any;
|
|
29
36
|
|
|
30
37
|
// # base attributes
|
|
@@ -43,7 +50,7 @@ type BaseAttr = {
|
|
|
43
50
|
'on:mouseleave'?: (ev: MouseEvent) => void;
|
|
44
51
|
'on:mouseover'?: (ev: MouseEvent) => void;
|
|
45
52
|
'on:mouseout'?: (ev: MouseEvent) => void;
|
|
46
|
-
'on:contextmenu'?: (ev:
|
|
53
|
+
'on:contextmenu'?: (ev: PointerEvent) => void;
|
|
47
54
|
|
|
48
55
|
// Keyboard events
|
|
49
56
|
'on:keydown'?: (ev: KeyboardEvent) => void;
|
|
@@ -116,7 +123,7 @@ type BaseAttr = {
|
|
|
116
123
|
|
|
117
124
|
// Resize event
|
|
118
125
|
'on:resize'?: (ev: UIEvent) => void;
|
|
119
|
-
}
|
|
126
|
+
}
|
|
120
127
|
|
|
121
128
|
// Form-specific events
|
|
122
129
|
interface FormElementEvents {
|
|
@@ -760,7 +767,7 @@ interface AttributesMap {
|
|
|
760
767
|
|
|
761
768
|
svg: BaseAttr & {
|
|
762
769
|
class?: string;
|
|
763
|
-
style?: string
|
|
770
|
+
style?: string | Partial<CSSStyleDeclaration>;
|
|
764
771
|
width?: number | string;
|
|
765
772
|
height?: number | string;
|
|
766
773
|
viewBox?: string;
|
|
@@ -1209,7 +1216,7 @@ interface KTBaseAttribute {
|
|
|
1209
1216
|
[k: string]: any;
|
|
1210
1217
|
|
|
1211
1218
|
// # kt-specific attributes
|
|
1212
|
-
ref?: KTRef<
|
|
1219
|
+
ref?: KTRef<KTHTMLElement>;
|
|
1213
1220
|
'k-if'?: any;
|
|
1214
1221
|
|
|
1215
1222
|
// # normal HTML attributes
|
|
@@ -1282,7 +1289,7 @@ type HTML<T extends (HTMLTag | SVGTag) & otherstring> = T extends SVGTag ? SVGEl
|
|
|
1282
1289
|
* ## About
|
|
1283
1290
|
* @package @ktjs/core
|
|
1284
1291
|
* @author Kasukabe Tsumugi <futami16237@gmail.com>
|
|
1285
|
-
* @version 0.
|
|
1292
|
+
* @version 0.19.0 (Last Update: 2026.01.31 22:50:55.987)
|
|
1286
1293
|
* @license MIT
|
|
1287
1294
|
* @link https://github.com/baendlorel/kt.js
|
|
1288
1295
|
* @link https://baendlorel.github.io/ Welcome to my site!
|
|
@@ -1328,7 +1335,7 @@ declare const jsxs: typeof jsx;
|
|
|
1328
1335
|
* @param creator a simple creator function that returns an element
|
|
1329
1336
|
* @returns created element
|
|
1330
1337
|
*/
|
|
1331
|
-
declare function createRedrawableNoref(creator: () =>
|
|
1338
|
+
declare function createRedrawableNoref<T extends KTHTMLElement>(creator: () => T): T;
|
|
1332
1339
|
/**
|
|
1333
1340
|
* A helper to create redrawable elements
|
|
1334
1341
|
* ```tsx
|
|
@@ -1343,7 +1350,7 @@ declare function createRedrawableNoref(creator: () => KTHTMLElement): KTHTMLElem
|
|
|
1343
1350
|
* @param creator a simple creator function that returns an element
|
|
1344
1351
|
* @returns created element's ref
|
|
1345
1352
|
*/
|
|
1346
|
-
declare function createRedrawable(creator: () =>
|
|
1353
|
+
declare function createRedrawable<T extends KTHTMLElement>(creator: () => T): KTRef<T>;
|
|
1347
1354
|
|
|
1348
|
-
export { Fragment, h as createElement, createRedrawable, createRedrawableNoref, jsx, jsxDEV, jsxs, ref };
|
|
1349
|
-
export type { KTHTMLElement
|
|
1355
|
+
export { Fragment, KTRef, h as createElement, createRedrawable, createRedrawableNoref, jsx, jsxDEV, jsxs, ref };
|
|
1356
|
+
export type { KTHTMLElement };
|
package/dist/jsx/index.mjs
CHANGED
|
@@ -1,7 +1,53 @@
|
|
|
1
|
+
// Cached native methods for performance optimization
|
|
2
|
+
const $isArray = Array.isArray;
|
|
3
|
+
const $isThenable = (o) => typeof o === 'object' && o !== null && typeof o.then === 'function';
|
|
4
|
+
|
|
5
|
+
// Error handling utilities
|
|
1
6
|
const $throw = (message) => {
|
|
2
|
-
throw new Error('
|
|
7
|
+
throw new Error('@ktjs/shared: ' + message);
|
|
3
8
|
};
|
|
4
9
|
|
|
10
|
+
// DOM manipulation utilities
|
|
11
|
+
/**
|
|
12
|
+
* & Remove `bind` because it is shockingly slower than wrapper
|
|
13
|
+
* & `window.document` is safe because it is not configurable and its setter is undefined
|
|
14
|
+
*/
|
|
15
|
+
const $appendChild = HTMLElement.prototype.appendChild;
|
|
16
|
+
const originAppend = HTMLElement.prototype.append;
|
|
17
|
+
const $append = // for ie 9/10/11
|
|
18
|
+
typeof originAppend === 'function'
|
|
19
|
+
? originAppend
|
|
20
|
+
: function (...nodes) {
|
|
21
|
+
if (nodes.length < 50) {
|
|
22
|
+
for (let i = 0; i < nodes.length; i++) {
|
|
23
|
+
const node = nodes[i];
|
|
24
|
+
if (typeof node === 'string') {
|
|
25
|
+
$appendChild.call(this, document.createTextNode(node));
|
|
26
|
+
}
|
|
27
|
+
else {
|
|
28
|
+
$appendChild.call(this, node);
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
else {
|
|
33
|
+
const fragment = document.createDocumentFragment();
|
|
34
|
+
for (let i = 0; i < nodes.length; i++) {
|
|
35
|
+
const node = nodes[i];
|
|
36
|
+
if (typeof node === 'string') {
|
|
37
|
+
$appendChild.call(fragment, document.createTextNode(node));
|
|
38
|
+
}
|
|
39
|
+
else {
|
|
40
|
+
$appendChild.call(fragment, node);
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
$appendChild.call(this, fragment);
|
|
44
|
+
}
|
|
45
|
+
};
|
|
46
|
+
|
|
47
|
+
// Shared utilities and cached native methods for kt.js framework
|
|
48
|
+
// Re-export all utilities
|
|
49
|
+
Object.defineProperty(window, '@ktjs/shared', { value: '0.19.0' });
|
|
50
|
+
|
|
5
51
|
const booleanHandler = (element, key, value) => {
|
|
6
52
|
if (key in element) {
|
|
7
53
|
element[key] = !!value;
|
|
@@ -72,7 +118,7 @@ function attrIsObject(element, attr) {
|
|
|
72
118
|
const o = attr[key];
|
|
73
119
|
// normal event handler
|
|
74
120
|
if (key.startsWith('on:')) {
|
|
75
|
-
element.addEventListener(key.slice(3), o); // chop off the
|
|
121
|
+
element.addEventListener(key.slice(3), o); // chop off the `on:`
|
|
76
122
|
}
|
|
77
123
|
// normal attributes
|
|
78
124
|
else {
|
|
@@ -92,51 +138,6 @@ function applyAttr(element, attr) {
|
|
|
92
138
|
}
|
|
93
139
|
}
|
|
94
140
|
|
|
95
|
-
/**
|
|
96
|
-
* & Remove `bind` because it is shockingly slower than wrapper
|
|
97
|
-
* & `window.document` is safe because it is not configurable and its setter is undefined
|
|
98
|
-
*/
|
|
99
|
-
const $appendChild = HTMLElement.prototype.appendChild;
|
|
100
|
-
const originAppend = HTMLElement.prototype.append;
|
|
101
|
-
const $append = // for ie 9/10/11
|
|
102
|
-
typeof originAppend === 'function'
|
|
103
|
-
? function (...args) {
|
|
104
|
-
return originAppend.apply(this, args);
|
|
105
|
-
}
|
|
106
|
-
: function (...nodes) {
|
|
107
|
-
if (nodes.length < 50) {
|
|
108
|
-
for (let i = 0; i < nodes.length; i++) {
|
|
109
|
-
const node = nodes[i];
|
|
110
|
-
if (typeof node === 'string') {
|
|
111
|
-
$appendChild.call(this, document.createTextNode(node));
|
|
112
|
-
}
|
|
113
|
-
else {
|
|
114
|
-
$appendChild.call(this, node);
|
|
115
|
-
}
|
|
116
|
-
}
|
|
117
|
-
}
|
|
118
|
-
else {
|
|
119
|
-
const fragment = document.createDocumentFragment();
|
|
120
|
-
for (let i = 0; i < nodes.length; i++) {
|
|
121
|
-
const node = nodes[i];
|
|
122
|
-
if (typeof node === 'string') {
|
|
123
|
-
$appendChild.call(fragment, document.createTextNode(node));
|
|
124
|
-
}
|
|
125
|
-
else {
|
|
126
|
-
$appendChild.call(fragment, node);
|
|
127
|
-
}
|
|
128
|
-
}
|
|
129
|
-
$appendChild.call(this, fragment);
|
|
130
|
-
}
|
|
131
|
-
};
|
|
132
|
-
|
|
133
|
-
const $isArray = Array.isArray;
|
|
134
|
-
const emptyPromiseHandler = () => ({});
|
|
135
|
-
if (typeof Promise === 'undefined') {
|
|
136
|
-
window.Promise = { resolve: emptyPromiseHandler, reject: emptyPromiseHandler };
|
|
137
|
-
}
|
|
138
|
-
const $isThenable = (o) => typeof o === 'object' && o !== null && typeof o.then === 'function';
|
|
139
|
-
|
|
140
141
|
function apdSingle(element, c) {
|
|
141
142
|
// & JSX should ignore false, undefined, and null
|
|
142
143
|
if (c === false || c === undefined || c === null) {
|
|
@@ -199,7 +200,7 @@ const svgTempWrapper = document.createElement('div');
|
|
|
199
200
|
* ## About
|
|
200
201
|
* @package @ktjs/core
|
|
201
202
|
* @author Kasukabe Tsumugi <futami16237@gmail.com>
|
|
202
|
-
* @version 0.
|
|
203
|
+
* @version 0.19.0 (Last Update: 2026.01.31 22:50:55.987)
|
|
203
204
|
* @license MIT
|
|
204
205
|
* @link https://github.com/baendlorel/kt.js
|
|
205
206
|
* @link https://baendlorel.github.io/ Welcome to my site!
|
|
@@ -222,47 +223,60 @@ const h = (tag, attr, content) => {
|
|
|
222
223
|
return element;
|
|
223
224
|
};
|
|
224
225
|
|
|
226
|
+
class KTRef {
|
|
227
|
+
/**
|
|
228
|
+
* Indicates that this is a KTRef instance
|
|
229
|
+
*/
|
|
230
|
+
isKT = true;
|
|
231
|
+
_value;
|
|
232
|
+
_onChanges;
|
|
233
|
+
constructor(_value, _onChanges) {
|
|
234
|
+
this._value = _value;
|
|
235
|
+
this._onChanges = _onChanges;
|
|
236
|
+
}
|
|
237
|
+
/**
|
|
238
|
+
* If new value and old value are both nodes, the old one will be replaced in the DOM
|
|
239
|
+
*/
|
|
240
|
+
get value() {
|
|
241
|
+
return this._value;
|
|
242
|
+
}
|
|
243
|
+
set value(newValue) {
|
|
244
|
+
if (newValue === this._value) {
|
|
245
|
+
return;
|
|
246
|
+
}
|
|
247
|
+
// replace the old node with the new one in the DOM if both are nodes
|
|
248
|
+
if (this._value instanceof Node && newValue instanceof Node) {
|
|
249
|
+
if (newValue.contains(this._value)) {
|
|
250
|
+
this._value.remove();
|
|
251
|
+
}
|
|
252
|
+
this._value.replaceWith(newValue);
|
|
253
|
+
}
|
|
254
|
+
const oldValue = this._value;
|
|
255
|
+
this._value = newValue;
|
|
256
|
+
for (let i = 0; i < this._onChanges.length; i++) {
|
|
257
|
+
this._onChanges[i](newValue, oldValue);
|
|
258
|
+
}
|
|
259
|
+
}
|
|
260
|
+
addOnChange(callback) {
|
|
261
|
+
this._onChanges.push(callback);
|
|
262
|
+
}
|
|
263
|
+
removeOnChange(callback) {
|
|
264
|
+
for (let i = this._onChanges.length - 1; i >= 0; i--) {
|
|
265
|
+
if (this._onChanges[i] === callback) {
|
|
266
|
+
this._onChanges.splice(i, 1);
|
|
267
|
+
return true;
|
|
268
|
+
}
|
|
269
|
+
}
|
|
270
|
+
return false;
|
|
271
|
+
}
|
|
272
|
+
}
|
|
225
273
|
/**
|
|
226
274
|
* Reference to the created HTML element.
|
|
227
275
|
* - can alse be used to store normal values, but it is not reactive.
|
|
228
276
|
* @param value mostly an HTMLElement
|
|
229
277
|
*/
|
|
230
278
|
function ref(value, onChange) {
|
|
231
|
-
|
|
232
|
-
let _onChanges = onChange ? [onChange] : [];
|
|
233
|
-
return {
|
|
234
|
-
isKT: true,
|
|
235
|
-
get value() {
|
|
236
|
-
return _value;
|
|
237
|
-
},
|
|
238
|
-
set value(newValue) {
|
|
239
|
-
if (newValue === _value) {
|
|
240
|
-
return;
|
|
241
|
-
}
|
|
242
|
-
// replace the old node with the new one in the DOM if both are nodes
|
|
243
|
-
if (_value instanceof Node && newValue instanceof Node) {
|
|
244
|
-
if (newValue.contains(_value)) {
|
|
245
|
-
_value.remove();
|
|
246
|
-
}
|
|
247
|
-
_value.replaceWith(newValue);
|
|
248
|
-
}
|
|
249
|
-
const oldValue = _value;
|
|
250
|
-
_value = newValue;
|
|
251
|
-
for (let i = 0; i < _onChanges.length; i++) {
|
|
252
|
-
_onChanges[i](newValue, oldValue);
|
|
253
|
-
}
|
|
254
|
-
},
|
|
255
|
-
addOnChange: (callback) => _onChanges.push(callback),
|
|
256
|
-
removeOnChange: (callback) => {
|
|
257
|
-
for (let i = _onChanges.length - 1; i >= 0; i--) {
|
|
258
|
-
if (_onChanges[i] === callback) {
|
|
259
|
-
_onChanges.splice(i, 1);
|
|
260
|
-
return true;
|
|
261
|
-
}
|
|
262
|
-
}
|
|
263
|
-
return false;
|
|
264
|
-
},
|
|
265
|
-
};
|
|
279
|
+
return new KTRef(value, onChange ? [onChange] : []);
|
|
266
280
|
}
|
|
267
281
|
|
|
268
282
|
const dummyRef = { value: null };
|
|
@@ -277,13 +291,13 @@ function jsx(tag, props = {}) {
|
|
|
277
291
|
props = newProps ? { ...props, ...newProps } : props;
|
|
278
292
|
el = jsx(tag, props);
|
|
279
293
|
if (ref !== dummyRef) {
|
|
280
|
-
ref.value = el; // ref setter automatically replaces old element in DOM
|
|
294
|
+
ref.value = el; // & ref setter automatically replaces old element in DOM
|
|
281
295
|
}
|
|
282
296
|
return el;
|
|
283
297
|
};
|
|
284
298
|
if ('k-if' in props && !props['k-if']) {
|
|
285
299
|
el = document.createComment('k-if');
|
|
286
|
-
ref.value = el;
|
|
300
|
+
ref.value = el; // & ref setter automatically replaces old element in DOM
|
|
287
301
|
el.redraw = redraw;
|
|
288
302
|
return el;
|
|
289
303
|
}
|
|
@@ -390,4 +404,4 @@ function createRedrawable(creator) {
|
|
|
390
404
|
return elRef;
|
|
391
405
|
}
|
|
392
406
|
|
|
393
|
-
export { Fragment, h as createElement, createRedrawable, createRedrawableNoref, jsx, jsxDEV, jsxs, ref };
|
|
407
|
+
export { Fragment, KTRef, h as createElement, createRedrawable, createRedrawableNoref, jsx, jsxDEV, jsxs, ref };
|
|
@@ -6,19 +6,26 @@ type otherstring = string & {};
|
|
|
6
6
|
type HTMLTag = keyof HTMLElementTagNameMap;
|
|
7
7
|
type SVGTag = keyof SVGElementTagNameMap;
|
|
8
8
|
|
|
9
|
-
type
|
|
10
|
-
|
|
9
|
+
type RefChangeHandler<T> = (newValue: T, oldValue: T) => void;
|
|
10
|
+
declare class KTRef<T> {
|
|
11
|
+
/**
|
|
12
|
+
* Indicates that this is a KTRef instance
|
|
13
|
+
*/
|
|
14
|
+
isKT: boolean;
|
|
15
|
+
private _value;
|
|
16
|
+
private _onChanges;
|
|
17
|
+
constructor(_value: T, _onChanges: Array<RefChangeHandler<T>>);
|
|
11
18
|
/**
|
|
12
19
|
* If new value and old value are both nodes, the old one will be replaced in the DOM
|
|
13
20
|
*/
|
|
14
|
-
value: T;
|
|
15
|
-
|
|
16
|
-
addOnChange
|
|
17
|
-
removeOnChange
|
|
21
|
+
get value(): T;
|
|
22
|
+
set value(newValue: T);
|
|
23
|
+
addOnChange(callback: RefChangeHandler<T>): void;
|
|
24
|
+
removeOnChange(callback: RefChangeHandler<T>): boolean;
|
|
18
25
|
}
|
|
19
26
|
|
|
20
27
|
// Base events available to all HTML elements
|
|
21
|
-
|
|
28
|
+
interface BaseAttr {
|
|
22
29
|
[k: string]: any;
|
|
23
30
|
|
|
24
31
|
// # base attributes
|
|
@@ -37,7 +44,7 @@ type BaseAttr = {
|
|
|
37
44
|
'on:mouseleave'?: (ev: MouseEvent) => void;
|
|
38
45
|
'on:mouseover'?: (ev: MouseEvent) => void;
|
|
39
46
|
'on:mouseout'?: (ev: MouseEvent) => void;
|
|
40
|
-
'on:contextmenu'?: (ev:
|
|
47
|
+
'on:contextmenu'?: (ev: PointerEvent) => void;
|
|
41
48
|
|
|
42
49
|
// Keyboard events
|
|
43
50
|
'on:keydown'?: (ev: KeyboardEvent) => void;
|
|
@@ -110,7 +117,7 @@ type BaseAttr = {
|
|
|
110
117
|
|
|
111
118
|
// Resize event
|
|
112
119
|
'on:resize'?: (ev: UIEvent) => void;
|
|
113
|
-
}
|
|
120
|
+
}
|
|
114
121
|
|
|
115
122
|
// Form-specific events
|
|
116
123
|
interface FormElementEvents {
|
|
@@ -754,7 +761,7 @@ interface AttributesMap {
|
|
|
754
761
|
|
|
755
762
|
svg: BaseAttr & {
|
|
756
763
|
class?: string;
|
|
757
|
-
style?: string
|
|
764
|
+
style?: string | Partial<CSSStyleDeclaration>;
|
|
758
765
|
width?: number | string;
|
|
759
766
|
height?: number | string;
|
|
760
767
|
viewBox?: string;
|
|
@@ -1203,7 +1210,7 @@ interface KTBaseAttribute {
|
|
|
1203
1210
|
[k: string]: any;
|
|
1204
1211
|
|
|
1205
1212
|
// # kt-specific attributes
|
|
1206
|
-
ref?: KTRef<
|
|
1213
|
+
ref?: KTRef<KTHTMLElement>;
|
|
1207
1214
|
'k-if'?: any;
|
|
1208
1215
|
|
|
1209
1216
|
// # normal HTML attributes
|
|
@@ -1276,7 +1283,7 @@ type HTML<T extends (HTMLTag | SVGTag) & otherstring> = T extends SVGTag ? SVGEl
|
|
|
1276
1283
|
* ## About
|
|
1277
1284
|
* @package @ktjs/core
|
|
1278
1285
|
* @author Kasukabe Tsumugi <futami16237@gmail.com>
|
|
1279
|
-
* @version 0.
|
|
1286
|
+
* @version 0.19.0 (Last Update: 2026.01.31 22:50:55.987)
|
|
1280
1287
|
* @license MIT
|
|
1281
1288
|
* @link https://github.com/baendlorel/kt.js
|
|
1282
1289
|
* @link https://baendlorel.github.io/ Welcome to my site!
|
|
@@ -1322,7 +1329,7 @@ declare const jsxs: typeof jsx;
|
|
|
1322
1329
|
* @param creator a simple creator function that returns an element
|
|
1323
1330
|
* @returns created element
|
|
1324
1331
|
*/
|
|
1325
|
-
declare function createRedrawableNoref(creator: () =>
|
|
1332
|
+
declare function createRedrawableNoref<T extends KTHTMLElement>(creator: () => T): T;
|
|
1326
1333
|
/**
|
|
1327
1334
|
* A helper to create redrawable elements
|
|
1328
1335
|
* ```tsx
|
|
@@ -1337,6 +1344,6 @@ declare function createRedrawableNoref(creator: () => KTHTMLElement): KTHTMLElem
|
|
|
1337
1344
|
* @param creator a simple creator function that returns an element
|
|
1338
1345
|
* @returns created element's ref
|
|
1339
1346
|
*/
|
|
1340
|
-
declare function createRedrawable(creator: () =>
|
|
1347
|
+
declare function createRedrawable<T extends KTHTMLElement>(creator: () => T): KTRef<T>;
|
|
1341
1348
|
|
|
1342
1349
|
export { Fragment, h as createElement, createRedrawable, createRedrawableNoref, h, jsx, jsxDEV, jsxs };
|