@jackens/nnn 2025.3.5 → 2025.5.16
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/nnn.d.ts +23 -27
- package/nnn.js +0 -7
- package/package.json +5 -5
- package/readme.md +55 -146
package/nnn.d.ts
CHANGED
|
@@ -7,7 +7,7 @@ export type CNode = {
|
|
|
7
7
|
/**
|
|
8
8
|
* The type of arguments of the `c` helper.
|
|
9
9
|
*/
|
|
10
|
-
export type CRoot =
|
|
10
|
+
export type CRoot = Record<PropertyKey, CNode>;
|
|
11
11
|
/**
|
|
12
12
|
* A simple JS-to-CSS (aka CSS-in-JS) helper.
|
|
13
13
|
*
|
|
@@ -28,17 +28,17 @@ export declare const c: (root: CRoot, splitter?: string) => string;
|
|
|
28
28
|
* - `separator`: field separator (default: `','`)
|
|
29
29
|
*/
|
|
30
30
|
export declare const csvParse: {
|
|
31
|
-
(text: string):
|
|
31
|
+
(text: string): Record<PropertyKey, string>[];
|
|
32
32
|
<HeaderTrue extends {
|
|
33
33
|
header: true;
|
|
34
|
-
}>(text: string, config: HeaderTrue):
|
|
34
|
+
}>(text: string, config: HeaderTrue): Record<PropertyKey, string>[];
|
|
35
35
|
<HeaderFalse extends {
|
|
36
36
|
header: false;
|
|
37
|
-
}>(text: string, config: HeaderFalse):
|
|
37
|
+
}>(text: string, config: HeaderFalse): string[][];
|
|
38
38
|
(text: string, config: Partial<{
|
|
39
39
|
header: boolean;
|
|
40
40
|
separator: string;
|
|
41
|
-
}>):
|
|
41
|
+
}>): Record<PropertyKey, string>[] | string[][];
|
|
42
42
|
};
|
|
43
43
|
/**
|
|
44
44
|
* The type of arguments of the `escapeValues` and `escape` helpers.
|
|
@@ -47,11 +47,11 @@ export type EscapeMap = Map<unknown, (value?: unknown) => string>;
|
|
|
47
47
|
/**
|
|
48
48
|
* A generic helper for escaping `values` by given `escapeMap`.
|
|
49
49
|
*/
|
|
50
|
-
export declare const escapeValues: (escapeMap: EscapeMap, values:
|
|
50
|
+
export declare const escapeValues: (escapeMap: EscapeMap, values: unknown[]) => string[];
|
|
51
51
|
/**
|
|
52
52
|
* A generic helper for escaping `values` by given `escapeMap` (in *TemplateStrings* flavor).
|
|
53
53
|
*/
|
|
54
|
-
export declare const escape: (escapeMap: EscapeMap, template: TemplateStringsArray, ...values:
|
|
54
|
+
export declare const escape: (escapeMap: EscapeMap, template: TemplateStringsArray, ...values: unknown[]) => string;
|
|
55
55
|
/**
|
|
56
56
|
* A helper that implements typographic corrections specific to Polish typography.
|
|
57
57
|
*/
|
|
@@ -59,7 +59,7 @@ export declare const fixTypography: (node: Node) => void;
|
|
|
59
59
|
/**
|
|
60
60
|
* The type of arguments of the `h` and `s` helpers.
|
|
61
61
|
*/
|
|
62
|
-
export type HArgs1 =
|
|
62
|
+
export type HArgs1 = Record<PropertyKey, unknown> | null | undefined | Node | string | number | HArgs;
|
|
63
63
|
/**
|
|
64
64
|
* The type of arguments of the `h` and `s` helpers.
|
|
65
65
|
*/
|
|
@@ -69,37 +69,37 @@ export type HArgs = [string | Node, ...HArgs1[]];
|
|
|
69
69
|
*
|
|
70
70
|
* - The first argument of type `string` specifies the tag of the element to be created.
|
|
71
71
|
* - The first argument of type `Node` specifies the element to be modified.
|
|
72
|
-
* - All other arguments of type `
|
|
72
|
+
* - All other arguments of type `Record<PropertyKey, unknown>` are mappings of attributes and properties. Keys starting with `$` specify *properties* (without the leading `$`) to be set on the element being created or modified. (Note that `$` is not a valid attribute name character.) All other keys specify *attributes* to be set by `setAttribute`. An attribute equal to `false` causes the attribute to be removed by `removeAttribute`.
|
|
73
73
|
* - All other arguments of type `null` or `undefined` are simply ignored.
|
|
74
74
|
* - All other arguments of type `Node` are appended to the element being created or modified.
|
|
75
75
|
* - All other arguments of type `string`/`number` are converted to `Text` nodes and appended to the element being created or modified.
|
|
76
76
|
* - All other arguments of type `HArgs` are passed to `h` and the results are appended to the element being created or modified.
|
|
77
77
|
*/
|
|
78
78
|
export declare const h: {
|
|
79
|
-
<T extends keyof HTMLElementTagNameMap>(tag: T, ...args1:
|
|
80
|
-
<N extends Node>(node: N, ...args1:
|
|
81
|
-
(tagOrNode: string | Node, ...args1:
|
|
79
|
+
<T extends keyof HTMLElementTagNameMap>(tag: T, ...args1: HArgs1[]): HTMLElementTagNameMap[T];
|
|
80
|
+
<N extends Node>(node: N, ...args1: HArgs1[]): N;
|
|
81
|
+
(tagOrNode: string | Node, ...args1: HArgs1[]): Node;
|
|
82
82
|
};
|
|
83
83
|
/**
|
|
84
84
|
* A lightweight [HyperScript](https://github.com/hyperhype/hyperscript)-style helper for creating and modifying `SVGElement`s (see also `h`).
|
|
85
85
|
*
|
|
86
86
|
* - The first argument of type `string` specifies the tag of the element to be created.
|
|
87
87
|
* - The first argument of type `Node` specifies the element to be modified.
|
|
88
|
-
* - All other arguments of type `
|
|
88
|
+
* - All other arguments of type `Record<PropertyKey, unknown>` are mappings of attributes and properties. Keys starting with `$` specify *properties* (without the leading `$`) to be set on the element being created or modified. (Note that `$` is not a valid attribute name character.) All other keys specify *attributes* to be set by `setAttributeNS`. An attribute equal to `false` causes the attribute to be removed by `removeAttributeNS`.
|
|
89
89
|
* - All other arguments of type `null` or `undefined` are simply ignored.
|
|
90
90
|
* - All other arguments of type `Node` are appended to the element being created or modified.
|
|
91
91
|
* - All other arguments of type `string`/`number` are converted to `Text` nodes and appended to the element being created or modified.
|
|
92
92
|
* - All other arguments of type `HArgs` are passed to `s` and the results are appended to the element being created or modified.
|
|
93
93
|
*/
|
|
94
94
|
export declare const s: {
|
|
95
|
-
<T extends keyof SVGElementTagNameMap>(tag: T, ...args1:
|
|
96
|
-
<N extends Node>(node: N, ...args1:
|
|
97
|
-
(tagOrNode: string | Node, ...args1:
|
|
95
|
+
<T extends keyof SVGElementTagNameMap>(tag: T, ...args1: HArgs1[]): SVGElementTagNameMap[T];
|
|
96
|
+
<N extends Node>(node: N, ...args1: HArgs1[]): N;
|
|
97
|
+
(tagOrNode: string | Node, ...args1: HArgs1[]): Node;
|
|
98
98
|
};
|
|
99
99
|
/**
|
|
100
100
|
* A convenient shortcut for `s('svg', ['use', { 'xlink:href': '#' + id }], ...args)`.
|
|
101
101
|
*/
|
|
102
|
-
export declare const svgUse: (id: string, ...args:
|
|
102
|
+
export declare const svgUse: (id: string, ...args: HArgs1[]) => SVGSVGElement;
|
|
103
103
|
/**
|
|
104
104
|
* A replacement for the `in` operator (not to be confused with the `for-in` loop) that works properly.
|
|
105
105
|
*/
|
|
@@ -113,9 +113,9 @@ export declare const isArray: (arg: any) => arg is any[];
|
|
|
113
113
|
*/
|
|
114
114
|
export declare const isNumber: (arg: any) => arg is number;
|
|
115
115
|
/**
|
|
116
|
-
* A helper that checks if the given argument is of type `
|
|
116
|
+
* A helper that checks if the given argument is of type `Record<PropertyKey, unknown>`.
|
|
117
117
|
*/
|
|
118
|
-
export declare const isRecord: (arg: any) => arg is
|
|
118
|
+
export declare const isRecord: (arg: any) => arg is Record<PropertyKey, unknown>;
|
|
119
119
|
/**
|
|
120
120
|
* A helper that checks if the given argument is of type `string`.
|
|
121
121
|
*/
|
|
@@ -135,15 +135,11 @@ export declare const isString: (arg: any) => arg is string;
|
|
|
135
135
|
* handlers['«handlerName»'](...«params»)
|
|
136
136
|
* ```
|
|
137
137
|
*/
|
|
138
|
-
export declare const jsOnParse: (handlers:
|
|
139
|
-
/**
|
|
140
|
-
* Language translations helper.
|
|
141
|
-
*/
|
|
142
|
-
export declare const locale: (map: Partial<Record<PropertyKey, Partial<Record<PropertyKey, string>>>>, defaultVersion: string) => (text: string, version?: string) => string;
|
|
138
|
+
export declare const jsOnParse: (handlers: Record<PropertyKey, Function>, text: string) => any;
|
|
143
139
|
/**
|
|
144
140
|
* A generic helper for syntax highlighting (see also `nanolightJs`).
|
|
145
141
|
*/
|
|
146
|
-
export declare const nanolight: (pattern: RegExp, highlighters:
|
|
142
|
+
export declare const nanolight: (pattern: RegExp, highlighters: ((chunk: string, index: number) => HArgs1)[], code: string) => HArgs1[];
|
|
147
143
|
/**
|
|
148
144
|
* A helper for highlighting JavaScript (see also `nanolight`).
|
|
149
145
|
*/
|
|
@@ -151,11 +147,11 @@ export declare const nanolightJs: (code: string) => HArgs1[];
|
|
|
151
147
|
/**
|
|
152
148
|
* A helper that implements TypeScript’s `Pick` utility type (see also `omit`).
|
|
153
149
|
*/
|
|
154
|
-
export declare const pick: <T extends
|
|
150
|
+
export declare const pick: <T extends Record<PropertyKey, unknown>, K extends (keyof T)[]>(obj: Record<PropertyKey, unknown>, keys: unknown[]) => Pick<T, K[number]>;
|
|
155
151
|
/**
|
|
156
152
|
* A helper that implements TypeScript’s `Omit` utility type (see also `pick`).
|
|
157
153
|
*/
|
|
158
|
-
export declare const omit: <T extends
|
|
154
|
+
export declare const omit: <T extends Record<PropertyKey, unknown>, K extends (keyof T)[]>(obj: Record<PropertyKey, unknown>, keys: unknown[]) => Omit<T, K[number]>;
|
|
159
155
|
/**
|
|
160
156
|
* A helper for choosing the correct singular and plural.
|
|
161
157
|
*/
|
package/nnn.js
CHANGED
|
@@ -189,12 +189,6 @@ var jsOnParse = (handlers, text) => JSON.parse(text, (key, value) => {
|
|
|
189
189
|
}
|
|
190
190
|
return value;
|
|
191
191
|
});
|
|
192
|
-
// src/nnn/locale.ts
|
|
193
|
-
var locale = (map, defaultVersion) => (text, version = defaultVersion) => {
|
|
194
|
-
const textV = map?.[version]?.[text];
|
|
195
|
-
const textD = map?.[defaultVersion]?.[text];
|
|
196
|
-
return isString(textV) ? textV : isString(textD) ? textD : text;
|
|
197
|
-
};
|
|
198
192
|
// src/nnn/nanolight.ts
|
|
199
193
|
var nanolight = (pattern, highlighters, code) => {
|
|
200
194
|
const result = [];
|
|
@@ -250,7 +244,6 @@ export {
|
|
|
250
244
|
omit,
|
|
251
245
|
nanolightJs,
|
|
252
246
|
nanolight,
|
|
253
|
-
locale,
|
|
254
247
|
jsOnParse,
|
|
255
248
|
isString,
|
|
256
249
|
isRecord,
|
package/package.json
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"author": "Jackens",
|
|
3
3
|
"description": "Jackens’ JavaScript helpers.",
|
|
4
|
-
"homepage": "https://jackens.github.io/nnn/doc/",
|
|
5
4
|
"keywords": [
|
|
6
5
|
"c",
|
|
7
6
|
"CSS-in-JS",
|
|
@@ -15,17 +14,18 @@
|
|
|
15
14
|
"HyperScript",
|
|
16
15
|
"in",
|
|
17
16
|
"is",
|
|
17
|
+
"isArray",
|
|
18
|
+
"isNumber",
|
|
19
|
+
"isRecord",
|
|
20
|
+
"isString",
|
|
18
21
|
"JS-to-CSS",
|
|
19
22
|
"JSON",
|
|
20
23
|
"jsOnParse",
|
|
21
|
-
"locale",
|
|
22
|
-
"localization",
|
|
23
24
|
"nanolight",
|
|
24
25
|
"nnn",
|
|
25
26
|
"omit",
|
|
26
27
|
"pick",
|
|
27
28
|
"SVG",
|
|
28
|
-
"translation",
|
|
29
29
|
"typography",
|
|
30
30
|
"uuid",
|
|
31
31
|
"uuid1",
|
|
@@ -36,5 +36,5 @@
|
|
|
36
36
|
"name": "@jackens/nnn",
|
|
37
37
|
"type": "module",
|
|
38
38
|
"types": "nnn.d.ts",
|
|
39
|
-
"version": "2025.
|
|
39
|
+
"version": "2025.5.16"
|
|
40
40
|
}
|
package/readme.md
CHANGED
|
@@ -2,14 +2,6 @@
|
|
|
2
2
|
|
|
3
3
|
Jackens’ JavaScript helpers.
|
|
4
4
|
|
|
5
|
-
<sub>Version: <code class="version">2025.3.5</code></sub>
|
|
6
|
-
|
|
7
|
-
* [Documentation](https://jackens.github.io/nnn/doc/)
|
|
8
|
-
* [Tests](https://jackens.github.io/nnn/test/)
|
|
9
|
-
* [Chessboard Demo](https://jackens.github.io/nnn/chessboard/)
|
|
10
|
-
* [Gantt Chart Demo](https://jackens.github.io/nnn/gantt/)
|
|
11
|
-
* [Responsive Web Design Demo](https://jackens.github.io/nnn/rwd/)
|
|
12
|
-
|
|
13
5
|
## Installation
|
|
14
6
|
|
|
15
7
|
```sh
|
|
@@ -34,12 +26,6 @@ or
|
|
|
34
26
|
import { «something» } from './node_modules/@jackens/nnn/nnn.js'
|
|
35
27
|
```
|
|
36
28
|
|
|
37
|
-
or
|
|
38
|
-
|
|
39
|
-
```js
|
|
40
|
-
import { «something» } from 'https://unpkg.com/@jackens/nnn@2025.3.5/nnn.js'
|
|
41
|
-
```
|
|
42
|
-
|
|
43
29
|
## Exports
|
|
44
30
|
|
|
45
31
|
- `CNode`: The type of arguments of the `c` helper.
|
|
@@ -56,10 +42,9 @@ import { «something» } from 'https://unpkg.com/@jackens/nnn@2025.3.5/nnn.js'
|
|
|
56
42
|
- `hasOwn`: A replacement for the `in` operator (not to be confused with the `for-in` loop) that works properly.
|
|
57
43
|
- `isArray`: A helper that checks if the given argument is of type `any[]`.
|
|
58
44
|
- `isNumber`: A helper that checks if the given argument is of type `number`.
|
|
59
|
-
- `isRecord`: A helper that checks if the given argument is of type `
|
|
45
|
+
- `isRecord`: A helper that checks if the given argument is of type `Record<PropertyKey, unknown>`.
|
|
60
46
|
- `isString`: A helper that checks if the given argument is of type `string`.
|
|
61
47
|
- `jsOnParse`: `JSON.parse` with “JavaScript turned on”.
|
|
62
|
-
- `locale`: Language translations helper.
|
|
63
48
|
- `nanolight`: A generic helper for syntax highlighting (see also `nanolightJs`).
|
|
64
49
|
- `nanolightJs`: A helper for highlighting JavaScript (see also `nanolight`).
|
|
65
50
|
- `omit`: A helper that implements TypeScript’s `Omit` utility type (see also `pick`).
|
|
@@ -83,7 +68,7 @@ The type of arguments of the `c` helper.
|
|
|
83
68
|
### CRoot
|
|
84
69
|
|
|
85
70
|
```ts
|
|
86
|
-
type CRoot =
|
|
71
|
+
type CRoot = Record<PropertyKey, CNode>;
|
|
87
72
|
```
|
|
88
73
|
|
|
89
74
|
The type of arguments of the `c` helper.
|
|
@@ -107,7 +92,7 @@ The type of arguments of the `h` and `s` helpers.
|
|
|
107
92
|
### HArgs1
|
|
108
93
|
|
|
109
94
|
```ts
|
|
110
|
-
type HArgs1 =
|
|
95
|
+
type HArgs1 = Record<PropertyKey, unknown> | null | undefined | Node | string | number | HArgs;
|
|
111
96
|
```
|
|
112
97
|
|
|
113
98
|
The type of arguments of the `h` and `s` helpers.
|
|
@@ -130,7 +115,7 @@ The `root` parameter provides a hierarchical description of CSS rules.
|
|
|
130
115
|
|
|
131
116
|
#### Usage Examples
|
|
132
117
|
|
|
133
|
-
```
|
|
118
|
+
```ts
|
|
134
119
|
const actual = c({
|
|
135
120
|
a: {
|
|
136
121
|
color: 'red',
|
|
@@ -156,7 +141,7 @@ a{
|
|
|
156
141
|
expect(actual).to.deep.equal(expected)
|
|
157
142
|
```
|
|
158
143
|
|
|
159
|
-
```
|
|
144
|
+
```ts
|
|
160
145
|
const actual = c({
|
|
161
146
|
a: {
|
|
162
147
|
'.b': {
|
|
@@ -184,7 +169,7 @@ a.b{
|
|
|
184
169
|
expect(actual).to.deep.equal(expected)
|
|
185
170
|
```
|
|
186
171
|
|
|
187
|
-
```
|
|
172
|
+
```ts
|
|
188
173
|
const actual = c({
|
|
189
174
|
'@font-face$$1': {
|
|
190
175
|
fontFamily: 'Jackens',
|
|
@@ -259,7 +244,7 @@ div.c2{
|
|
|
259
244
|
expect(actual).to.deep.equal(expected)
|
|
260
245
|
```
|
|
261
246
|
|
|
262
|
-
```
|
|
247
|
+
```ts
|
|
263
248
|
const actual = c({
|
|
264
249
|
a: {
|
|
265
250
|
'.b,.c': {
|
|
@@ -282,7 +267,7 @@ a.b.d,a.c.d{
|
|
|
282
267
|
expect(actual).to.deep.equal(expected)
|
|
283
268
|
```
|
|
284
269
|
|
|
285
|
-
```
|
|
270
|
+
```ts
|
|
286
271
|
const actual = c({
|
|
287
272
|
'.b,.c': {
|
|
288
273
|
margin: 1,
|
|
@@ -303,7 +288,7 @@ const expected = `
|
|
|
303
288
|
expect(actual).to.deep.equal(expected)
|
|
304
289
|
```
|
|
305
290
|
|
|
306
|
-
```
|
|
291
|
+
```ts
|
|
307
292
|
const actual = c({
|
|
308
293
|
'.a,.b': {
|
|
309
294
|
margin: 1,
|
|
@@ -328,17 +313,17 @@ expect(actual).to.deep.equal(expected)
|
|
|
328
313
|
|
|
329
314
|
```ts
|
|
330
315
|
const csvParse: {
|
|
331
|
-
(text: string):
|
|
316
|
+
(text: string): Record<PropertyKey, string>[];
|
|
332
317
|
<HeaderTrue extends {
|
|
333
318
|
header: true;
|
|
334
|
-
}>(text: string, config: HeaderTrue):
|
|
319
|
+
}>(text: string, config: HeaderTrue): Record<PropertyKey, string>[];
|
|
335
320
|
<HeaderFalse extends {
|
|
336
321
|
header: false;
|
|
337
|
-
}>(text: string, config: HeaderFalse):
|
|
322
|
+
}>(text: string, config: HeaderFalse): string[][];
|
|
338
323
|
(text: string, config: Partial<{
|
|
339
324
|
header: boolean;
|
|
340
325
|
separator: string;
|
|
341
|
-
}>):
|
|
326
|
+
}>): Record<PropertyKey, string>[] | string[][];
|
|
342
327
|
};
|
|
343
328
|
```
|
|
344
329
|
|
|
@@ -350,7 +335,7 @@ Options:
|
|
|
350
335
|
|
|
351
336
|
#### Usage Examples
|
|
352
337
|
|
|
353
|
-
```
|
|
338
|
+
```ts
|
|
354
339
|
const text = `"aaa
|
|
355
340
|
""aaa""
|
|
356
341
|
aaa",bbb, "ccc,ccc"
|
|
@@ -379,21 +364,21 @@ expect(csvParse(text)).to.deep.equal([{
|
|
|
379
364
|
### escape
|
|
380
365
|
|
|
381
366
|
```ts
|
|
382
|
-
const escape: (escapeMap: EscapeMap, template: TemplateStringsArray, ...values:
|
|
367
|
+
const escape: (escapeMap: EscapeMap, template: TemplateStringsArray, ...values: unknown[]) => string;
|
|
383
368
|
```
|
|
384
369
|
|
|
385
370
|
A generic helper for escaping `values` by given `escapeMap` (in *TemplateStrings* flavor).
|
|
386
371
|
|
|
387
372
|
#### Usage Examples
|
|
388
373
|
|
|
389
|
-
```
|
|
390
|
-
const
|
|
374
|
+
```ts
|
|
375
|
+
const escapeMap: EscapeMap = new Map([
|
|
391
376
|
[undefined, () => 'NULL'],
|
|
392
|
-
[Array, (
|
|
393
|
-
[Boolean, (
|
|
394
|
-
[Date, (
|
|
395
|
-
[Number, (
|
|
396
|
-
[String, (
|
|
377
|
+
[Array, (values: unknown[]) => escapeValues(escapeMap, values).join(', ')],
|
|
378
|
+
[Boolean, (value: boolean) => `b'${+value}'`],
|
|
379
|
+
[Date, (value: Date) => `'${value.toISOString().replace(/^(.+)T(.+)\..*$/, '$1 $2')}'`],
|
|
380
|
+
[Number, (value: number) => `${value}`],
|
|
381
|
+
[String, (value: string) => `'${value.replace(/'/g, "''")}'`]
|
|
397
382
|
])
|
|
398
383
|
|
|
399
384
|
const sql = escape.bind(null, escapeMap)
|
|
@@ -414,7 +399,7 @@ expect(actual).to.deep.equal(expected)
|
|
|
414
399
|
### escapeValues
|
|
415
400
|
|
|
416
401
|
```ts
|
|
417
|
-
const escapeValues: (escapeMap: EscapeMap, values:
|
|
402
|
+
const escapeValues: (escapeMap: EscapeMap, values: unknown[]) => string[];
|
|
418
403
|
```
|
|
419
404
|
|
|
420
405
|
A generic helper for escaping `values` by given `escapeMap`.
|
|
@@ -429,7 +414,7 @@ A helper that implements typographic corrections specific to Polish typography.
|
|
|
429
414
|
|
|
430
415
|
#### Usage Examples
|
|
431
416
|
|
|
432
|
-
```
|
|
417
|
+
```ts
|
|
433
418
|
const p = h('p', 'Pchnąć w tę łódź jeża lub ośm skrzyń fig (zob. https://pl.wikipedia.org/wiki/Pangram).')
|
|
434
419
|
|
|
435
420
|
fixTypography(p)
|
|
@@ -443,9 +428,9 @@ expect(p.innerHTML).to.deep.equal(
|
|
|
443
428
|
|
|
444
429
|
```ts
|
|
445
430
|
const h: {
|
|
446
|
-
<T extends keyof HTMLElementTagNameMap>(tag: T, ...args1:
|
|
447
|
-
<N extends Node>(node: N, ...args1:
|
|
448
|
-
(tagOrNode: string | Node, ...args1:
|
|
431
|
+
<T extends keyof HTMLElementTagNameMap>(tag: T, ...args1: HArgs1[]): HTMLElementTagNameMap[T];
|
|
432
|
+
<N extends Node>(node: N, ...args1: HArgs1[]): N;
|
|
433
|
+
(tagOrNode: string | Node, ...args1: HArgs1[]): Node;
|
|
449
434
|
};
|
|
450
435
|
```
|
|
451
436
|
|
|
@@ -453,7 +438,7 @@ A lightweight [HyperScript](https://github.com/hyperhype/hyperscript)-style help
|
|
|
453
438
|
|
|
454
439
|
- The first argument of type `string` specifies the tag of the element to be created.
|
|
455
440
|
- The first argument of type `Node` specifies the element to be modified.
|
|
456
|
-
- All other arguments of type `
|
|
441
|
+
- All other arguments of type `Record<PropertyKey, unknown>` are mappings of attributes and properties. Keys starting with `$` specify *properties* (without the leading `$`) to be set on the element being created or modified. (Note that `$` is not a valid attribute name character.) All other keys specify *attributes* to be set by `setAttribute`. An attribute equal to `false` causes the attribute to be removed by `removeAttribute`.
|
|
457
442
|
- All other arguments of type `null` or `undefined` are simply ignored.
|
|
458
443
|
- All other arguments of type `Node` are appended to the element being created or modified.
|
|
459
444
|
- All other arguments of type `string`/`number` are converted to `Text` nodes and appended to the element being created or modified.
|
|
@@ -461,7 +446,7 @@ A lightweight [HyperScript](https://github.com/hyperhype/hyperscript)-style help
|
|
|
461
446
|
|
|
462
447
|
#### Usage Examples
|
|
463
448
|
|
|
464
|
-
```
|
|
449
|
+
```ts
|
|
465
450
|
const b = h('b')
|
|
466
451
|
|
|
467
452
|
expect(b.outerHTML).to.deep.equal('<b></b>')
|
|
@@ -479,12 +464,12 @@ expect(i.outerHTML).to.deep.equal('<i class="some class">text</i>')
|
|
|
479
464
|
expect(b.outerHTML).to.deep.equal('<b><i class="some class">text</i></b>')
|
|
480
465
|
```
|
|
481
466
|
|
|
482
|
-
```
|
|
467
|
+
```ts
|
|
483
468
|
expect(h('span', 'text').outerHTML).to.deep.equal('<span>text</span>')
|
|
484
469
|
expect(h('span', { $innerText: 'text' }).outerHTML).to.deep.equal('<span>text</span>')
|
|
485
470
|
```
|
|
486
471
|
|
|
487
|
-
```
|
|
472
|
+
```ts
|
|
488
473
|
expect(h('div', { style: 'margin:0;padding:0' }).outerHTML)
|
|
489
474
|
.to.deep.equal('<div style="margin:0;padding:0"></div>')
|
|
490
475
|
expect(h('div', { $style: 'margin:0;padding:0' }).outerHTML)
|
|
@@ -493,7 +478,7 @@ expect(h('div', { $style: { margin: 0, padding: 0 } }).outerHTML)
|
|
|
493
478
|
.to.deep.equal('<div style="margin: 0px; padding: 0px;"></div>')
|
|
494
479
|
```
|
|
495
480
|
|
|
496
|
-
```
|
|
481
|
+
```ts
|
|
497
482
|
const input1 = h('input', { value: 42 })
|
|
498
483
|
const input2 = h('input', { $value: '42' })
|
|
499
484
|
|
|
@@ -513,7 +498,7 @@ expect(checkbox1.outerHTML).to.deep.equal('<input type="checkbox" checked="">')
|
|
|
513
498
|
expect(checkbox2.outerHTML).to.deep.equal('<input type="checkbox">')
|
|
514
499
|
```
|
|
515
500
|
|
|
516
|
-
```
|
|
501
|
+
```ts
|
|
517
502
|
const div = h('div')
|
|
518
503
|
|
|
519
504
|
expect(div.key).to.be.undefined
|
|
@@ -537,7 +522,7 @@ A replacement for the `in` operator (not to be confused with the `for-in` loop)
|
|
|
537
522
|
|
|
538
523
|
#### Usage Examples
|
|
539
524
|
|
|
540
|
-
```
|
|
525
|
+
```ts
|
|
541
526
|
const obj = { 42: null, null: 'k,e,y', 'k,e,y': 42 }
|
|
542
527
|
|
|
543
528
|
expect(42 in obj).to.be.true
|
|
@@ -587,10 +572,10 @@ A helper that checks if the given argument is of type `number`.
|
|
|
587
572
|
### isRecord
|
|
588
573
|
|
|
589
574
|
```ts
|
|
590
|
-
const isRecord: (arg: any) => arg is
|
|
575
|
+
const isRecord: (arg: any) => arg is Record<PropertyKey, unknown>;
|
|
591
576
|
```
|
|
592
577
|
|
|
593
|
-
A helper that checks if the given argument is of type `
|
|
578
|
+
A helper that checks if the given argument is of type `Record<PropertyKey, unknown>`.
|
|
594
579
|
|
|
595
580
|
### isString
|
|
596
581
|
|
|
@@ -603,7 +588,7 @@ A helper that checks if the given argument is of type `string`.
|
|
|
603
588
|
### jsOnParse
|
|
604
589
|
|
|
605
590
|
```ts
|
|
606
|
-
const jsOnParse: (handlers:
|
|
591
|
+
const jsOnParse: (handlers: Record<PropertyKey, Function>, text: string) => any;
|
|
607
592
|
```
|
|
608
593
|
|
|
609
594
|
`JSON.parse` with “JavaScript turned on”.
|
|
@@ -622,9 +607,9 @@ handlers['«handlerName»'](...«params»)
|
|
|
622
607
|
|
|
623
608
|
#### Usage Examples
|
|
624
609
|
|
|
625
|
-
```
|
|
610
|
+
```ts
|
|
626
611
|
const handlers = {
|
|
627
|
-
$hello: (
|
|
612
|
+
$hello: (name: string) => `Hello ${name}!`,
|
|
628
613
|
$foo: () => 'bar'
|
|
629
614
|
}
|
|
630
615
|
|
|
@@ -667,40 +652,10 @@ const expected = [
|
|
|
667
652
|
expect(actual).to.deep.equal(expected)
|
|
668
653
|
```
|
|
669
654
|
|
|
670
|
-
### locale
|
|
671
|
-
|
|
672
|
-
```ts
|
|
673
|
-
const locale: (map: Partial<Record<PropertyKey, Partial<Record<PropertyKey, string>>>>, defaultVersion: string) => (text: string, version?: string) => string;
|
|
674
|
-
```
|
|
675
|
-
|
|
676
|
-
Language translations helper.
|
|
677
|
-
|
|
678
|
-
#### Usage Examples
|
|
679
|
-
|
|
680
|
-
```js
|
|
681
|
-
const _ = locale({
|
|
682
|
-
default: { Password: 'Hasło' },
|
|
683
|
-
button: { Login: 'Zaloguj' }
|
|
684
|
-
}, 'default')
|
|
685
|
-
|
|
686
|
-
expect(_('Login')).to.deep.equal('Login')
|
|
687
|
-
expect(_('Password')).to.deep.equal('Hasło')
|
|
688
|
-
|
|
689
|
-
expect(_('Undefined text')).to.deep.equal('Undefined text')
|
|
690
|
-
|
|
691
|
-
expect(_('Login', 'button')).to.deep.equal('Zaloguj')
|
|
692
|
-
|
|
693
|
-
expect(_('Password', 'undefined_version')).to.deep.equal('Hasło')
|
|
694
|
-
expect(_('Undefined text', 'undefined_version')).to.deep.equal('Undefined text')
|
|
695
|
-
|
|
696
|
-
expect(_('toString')).to.deep.equal('toString')
|
|
697
|
-
expect(_('toString', 'undefined_version')).to.deep.equal('toString')
|
|
698
|
-
```
|
|
699
|
-
|
|
700
655
|
### nanolight
|
|
701
656
|
|
|
702
657
|
```ts
|
|
703
|
-
const nanolight: (pattern: RegExp, highlighters:
|
|
658
|
+
const nanolight: (pattern: RegExp, highlighters: ((chunk: string, index: number) => HArgs1)[], code: string) => HArgs1[];
|
|
704
659
|
```
|
|
705
660
|
|
|
706
661
|
A generic helper for syntax highlighting (see also `nanolightJs`).
|
|
@@ -715,7 +670,7 @@ A helper for highlighting JavaScript (see also `nanolight`).
|
|
|
715
670
|
|
|
716
671
|
#### Usage Examples
|
|
717
672
|
|
|
718
|
-
```
|
|
673
|
+
```ts
|
|
719
674
|
const codeJs = 'const answerToLifeTheUniverseAndEverything = 42'
|
|
720
675
|
|
|
721
676
|
expect(nanolightJs(codeJs)).to.deep.equal([
|
|
@@ -732,14 +687,14 @@ expect(nanolightJs(codeJs)).to.deep.equal([
|
|
|
732
687
|
### omit
|
|
733
688
|
|
|
734
689
|
```ts
|
|
735
|
-
const omit: <T extends
|
|
690
|
+
const omit: <T extends Record<PropertyKey, unknown>, K extends (keyof T)[]>(obj: Record<PropertyKey, unknown>, keys: unknown[]) => Omit<T, K[number]>;
|
|
736
691
|
```
|
|
737
692
|
|
|
738
693
|
A helper that implements TypeScript’s `Omit` utility type (see also `pick`).
|
|
739
694
|
|
|
740
695
|
#### Usage Examples
|
|
741
696
|
|
|
742
|
-
```
|
|
697
|
+
```ts
|
|
743
698
|
const obj = { a: 42, b: '42', c: 17 }
|
|
744
699
|
|
|
745
700
|
expect(omit(obj, ['c'])).to.deep.equal({ a: 42, b: '42' })
|
|
@@ -748,14 +703,14 @@ expect(omit(obj, ['c'])).to.deep.equal({ a: 42, b: '42' })
|
|
|
748
703
|
### pick
|
|
749
704
|
|
|
750
705
|
```ts
|
|
751
|
-
const pick: <T extends
|
|
706
|
+
const pick: <T extends Record<PropertyKey, unknown>, K extends (keyof T)[]>(obj: Record<PropertyKey, unknown>, keys: unknown[]) => Pick<T, K[number]>;
|
|
752
707
|
```
|
|
753
708
|
|
|
754
709
|
A helper that implements TypeScript’s `Pick` utility type (see also `omit`).
|
|
755
710
|
|
|
756
711
|
#### Usage Examples
|
|
757
712
|
|
|
758
|
-
```
|
|
713
|
+
```ts
|
|
759
714
|
const obj = { a: 42, b: '42', c: 17 }
|
|
760
715
|
|
|
761
716
|
expect(pick(obj, ['a', 'b'])).to.deep.equal({ a: 42, b: '42' })
|
|
@@ -771,7 +726,7 @@ A helper for choosing the correct singular and plural.
|
|
|
771
726
|
|
|
772
727
|
#### Usage Examples
|
|
773
728
|
|
|
774
|
-
```
|
|
729
|
+
```ts
|
|
775
730
|
const auto = plUral.bind(null, 'auto', 'auta', 'aut')
|
|
776
731
|
|
|
777
732
|
expect(auto(0)).to.deep.equal('aut')
|
|
@@ -798,7 +753,7 @@ object.
|
|
|
798
753
|
|
|
799
754
|
#### Usage Examples
|
|
800
755
|
|
|
801
|
-
```
|
|
756
|
+
```ts
|
|
802
757
|
const ref = {}
|
|
803
758
|
|
|
804
759
|
pro(ref).one.two[3][4] = 1234
|
|
@@ -830,9 +785,9 @@ expect(ref).to.deep.equal({ one: { two: { three: { four: 1234 } } } })
|
|
|
830
785
|
|
|
831
786
|
```ts
|
|
832
787
|
const s: {
|
|
833
|
-
<T extends keyof SVGElementTagNameMap>(tag: T, ...args1:
|
|
834
|
-
<N extends Node>(node: N, ...args1:
|
|
835
|
-
(tagOrNode: string | Node, ...args1:
|
|
788
|
+
<T extends keyof SVGElementTagNameMap>(tag: T, ...args1: HArgs1[]): SVGElementTagNameMap[T];
|
|
789
|
+
<N extends Node>(node: N, ...args1: HArgs1[]): N;
|
|
790
|
+
(tagOrNode: string | Node, ...args1: HArgs1[]): Node;
|
|
836
791
|
};
|
|
837
792
|
```
|
|
838
793
|
|
|
@@ -840,7 +795,7 @@ A lightweight [HyperScript](https://github.com/hyperhype/hyperscript)-style help
|
|
|
840
795
|
|
|
841
796
|
- The first argument of type `string` specifies the tag of the element to be created.
|
|
842
797
|
- The first argument of type `Node` specifies the element to be modified.
|
|
843
|
-
- All other arguments of type `
|
|
798
|
+
- All other arguments of type `Record<PropertyKey, unknown>` are mappings of attributes and properties. Keys starting with `$` specify *properties* (without the leading `$`) to be set on the element being created or modified. (Note that `$` is not a valid attribute name character.) All other keys specify *attributes* to be set by `setAttributeNS`. An attribute equal to `false` causes the attribute to be removed by `removeAttributeNS`.
|
|
844
799
|
- All other arguments of type `null` or `undefined` are simply ignored.
|
|
845
800
|
- All other arguments of type `Node` are appended to the element being created or modified.
|
|
846
801
|
- All other arguments of type `string`/`number` are converted to `Text` nodes and appended to the element being created or modified.
|
|
@@ -849,7 +804,7 @@ A lightweight [HyperScript](https://github.com/hyperhype/hyperscript)-style help
|
|
|
849
804
|
### svgUse
|
|
850
805
|
|
|
851
806
|
```ts
|
|
852
|
-
const svgUse: (id: string, ...args:
|
|
807
|
+
const svgUse: (id: string, ...args: HArgs1[]) => SVGSVGElement;
|
|
853
808
|
```
|
|
854
809
|
|
|
855
810
|
A convenient shortcut for `s('svg', ['use', { 'xlink:href': '#' + id }], ...args)`.
|
|
@@ -866,7 +821,7 @@ A helper that generates a UUID v1 identifier (with a creation timestamp).
|
|
|
866
821
|
|
|
867
822
|
#### Usage Examples
|
|
868
823
|
|
|
869
|
-
```
|
|
824
|
+
```ts
|
|
870
825
|
for (let i = 1; i <= 22136; ++i) {
|
|
871
826
|
const uuid = uuid1()
|
|
872
827
|
|
|
@@ -880,61 +835,15 @@ for (let i = 1; i <= 22136; ++i) {
|
|
|
880
835
|
}
|
|
881
836
|
```
|
|
882
837
|
|
|
883
|
-
```
|
|
838
|
+
```ts
|
|
884
839
|
expect(uuid1(new Date(), '000123456789abc').split('-')[4]).to.deep.equal('123456789abc')
|
|
885
840
|
expect(uuid1(new Date(), '123456789').split('-')[4]).to.deep.equal('000123456789')
|
|
886
841
|
```
|
|
887
842
|
|
|
888
|
-
```js
|
|
889
|
-
expect(uuid1(new Date(323325000000)).startsWith('c1399400-9a71-11bd')).to.be.true
|
|
890
|
-
```
|
|
891
|
-
|
|
892
|
-
## Why Partial\<Array\> and Partial\<Record\>
|
|
893
|
-
|
|
894
|
-
Consider the following code snippet:
|
|
895
|
-
|
|
896
|
-
```ts
|
|
897
|
-
const arr = ['one', 'two', 'three'] // type: string[]
|
|
898
|
-
const arrAt42 = arr[42] // type: string
|
|
899
|
-
|
|
900
|
-
arrAt42.toUpperCase() // 👎 allowed by TypeScript
|
|
901
|
-
```
|
|
902
|
-
|
|
903
|
-
TypeScript allows `arrAt42.toUpperCase()`,
|
|
904
|
-
which causes a <code class="log">TypeError: undefined is not an object</code>.
|
|
905
|
-
The variable `arr` should be of type `Partial<Array<string>>`:
|
|
906
|
-
|
|
907
843
|
```ts
|
|
908
|
-
|
|
909
|
-
const arrAt42 = arr[42] // type: string | undefined
|
|
910
|
-
|
|
911
|
-
arrAt42.toUpperCase() // 👍 forbidden by TypeScript
|
|
912
|
-
```
|
|
913
|
-
|
|
914
|
-
Now `arrAt42.toUpperCase()` is forbidden by TypeScript (<code class="log">'arrAt42' is possibly undefined</code>).
|
|
915
|
-
|
|
916
|
-
Similarly for the type `Record`:
|
|
917
|
-
|
|
918
|
-
```ts
|
|
919
|
-
const rec = Object.fromEntries(['one', 'two', 'three'].map((k, i) => [k, i])) // type: Record<string, number>
|
|
920
|
-
const { tree } = rec // type: number
|
|
921
|
-
|
|
922
|
-
tree.toFixed() // 👎 allowed by TypeScript
|
|
923
|
-
```
|
|
924
|
-
|
|
925
|
-
TypeScript allows `tree.toFixed()`, which causes a <code class="log">TypeError: undefined is not an object</code>.
|
|
926
|
-
The variable `rec` should be of type `Partial<Record<PropertyKey, number>>`:
|
|
927
|
-
|
|
928
|
-
```ts
|
|
929
|
-
const rec: Partial<Record<PropertyKey, number>> =
|
|
930
|
-
Object.fromEntries(['one', 'two', 'three'].map((k, i) => [k, i]))
|
|
931
|
-
const { tree } = rec // type: number | undefined
|
|
932
|
-
|
|
933
|
-
tree.toFixed() // 👍 forbidden by TypeScript
|
|
844
|
+
expect(uuid1(new Date(323325000000)).startsWith('c1399400-9a71-11bd')).to.be.true
|
|
934
845
|
```
|
|
935
846
|
|
|
936
|
-
Now `tree.toFixed()` is forbidden by TypeScript (<code class="log">'tree' is possibly undefined</code>).
|
|
937
|
-
|
|
938
847
|
## License
|
|
939
848
|
|
|
940
849
|
The MIT License (MIT)
|