@thi.ng/hiccup-html 2.7.49 → 2.7.51
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/README.md +70 -68
- package/package.json +6 -6
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<!-- This file is generated - DO NOT EDIT! -->
|
|
2
|
-
<!-- Please see: https://
|
|
3
|
-
# 
|
|
4
4
|
|
|
5
5
|
[](https://www.npmjs.com/package/@thi.ng/hiccup-html)
|
|
6
6
|
|
|
@@ -8,11 +8,12 @@
|
|
|
8
8
|
|
|
9
9
|
> [!NOTE]
|
|
10
10
|
> This is one of 214 standalone projects, maintained as part
|
|
11
|
-
> of the [@thi.ng/umbrella](https://
|
|
11
|
+
> of the [@thi.ng/umbrella](https://codeberg.org/thi.ng/umbrella/) ecosystem
|
|
12
12
|
> and anti-framework.
|
|
13
13
|
>
|
|
14
|
-
> 🚀 Please help me to work full-time on these projects by [sponsoring
|
|
15
|
-
>
|
|
14
|
+
> 🚀 Please help me to work full-time on these projects by [sponsoring
|
|
15
|
+
> me](https://codeberg.org/thi.ng/umbrella/src/branch/develop/CONTRIBUTING.md#donations).
|
|
16
|
+
> Thank you! ❤️
|
|
16
17
|
|
|
17
18
|
- [About](#about)
|
|
18
19
|
- [Supported elements](#supported-elements)
|
|
@@ -39,20 +40,20 @@
|
|
|
39
40
|
|
|
40
41
|
## About
|
|
41
42
|
|
|
42
|
-
100+ type-checked HTML5 element functions for [@thi.ng/hiccup](https://
|
|
43
|
+
100+ type-checked HTML5 element functions for [@thi.ng/hiccup](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hiccup) related infrastructure.
|
|
43
44
|
|
|
44
45
|
The following type-checked factory functions are provided **so far** and in most
|
|
45
46
|
cases include specialized type definitions for element-specific attributes,
|
|
46
47
|
incl. enumerated attrib values (where applicable/useful) and 420+ CSS property
|
|
47
48
|
names (for use with the `style` attrib). See type definitions in
|
|
48
|
-
[api.ts](https://
|
|
49
|
+
[api.ts](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hiccup-html/src/api.ts)
|
|
49
50
|
and [`defElement()`](#defelement) below for more details.
|
|
50
51
|
|
|
51
52
|
### Supported elements
|
|
52
53
|
|
|
53
54
|
#### Block content
|
|
54
55
|
|
|
55
|
-
[Source](https://
|
|
56
|
+
[Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hiccup-html/src/blocks.ts)
|
|
56
57
|
|
|
57
58
|
- `blockquote`
|
|
58
59
|
- `details`
|
|
@@ -70,7 +71,7 @@ and [`defElement()`](#defelement) below for more details.
|
|
|
70
71
|
|
|
71
72
|
#### Forms / inputs
|
|
72
73
|
|
|
73
|
-
[Source](https://
|
|
74
|
+
[Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hiccup-html/src/forms.ts)
|
|
74
75
|
|
|
75
76
|
- `button`
|
|
76
77
|
- `checkbox`
|
|
@@ -98,7 +99,7 @@ and [`defElement()`](#defelement) below for more details.
|
|
|
98
99
|
|
|
99
100
|
#### Head / metadata
|
|
100
101
|
|
|
101
|
-
[Source](https://
|
|
102
|
+
[Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hiccup-html/src/head.ts)
|
|
102
103
|
|
|
103
104
|
- `base`
|
|
104
105
|
- `head`
|
|
@@ -117,7 +118,7 @@ and [`defElement()`](#defelement) below for more details.
|
|
|
117
118
|
|
|
118
119
|
#### Inline
|
|
119
120
|
|
|
120
|
-
[Source](https://
|
|
121
|
+
[Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hiccup-html/src/inline.ts)
|
|
121
122
|
|
|
122
123
|
- `abbr`
|
|
123
124
|
- `anchor`
|
|
@@ -145,7 +146,7 @@ and [`defElement()`](#defelement) below for more details.
|
|
|
145
146
|
|
|
146
147
|
#### Lists
|
|
147
148
|
|
|
148
|
-
[Source](https://
|
|
149
|
+
[Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hiccup-html/src/lists.ts)
|
|
149
150
|
|
|
150
151
|
- `datalist`
|
|
151
152
|
- `dd`
|
|
@@ -158,7 +159,7 @@ and [`defElement()`](#defelement) below for more details.
|
|
|
158
159
|
|
|
159
160
|
#### Media
|
|
160
161
|
|
|
161
|
-
[Source](https://
|
|
162
|
+
[Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hiccup-html/src/media.ts)
|
|
162
163
|
|
|
163
164
|
- `audio`
|
|
164
165
|
- `canvas`
|
|
@@ -171,7 +172,7 @@ and [`defElement()`](#defelement) below for more details.
|
|
|
171
172
|
|
|
172
173
|
#### Sections
|
|
173
174
|
|
|
174
|
-
[Source](https://
|
|
175
|
+
[Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hiccup-html/src/sections.ts)
|
|
175
176
|
|
|
176
177
|
- `address`
|
|
177
178
|
- `article`
|
|
@@ -196,7 +197,7 @@ and [`defElement()`](#defelement) below for more details.
|
|
|
196
197
|
|
|
197
198
|
#### Tables
|
|
198
199
|
|
|
199
|
-
[Source](https://
|
|
200
|
+
[Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hiccup-html/src/table.ts)
|
|
200
201
|
|
|
201
202
|
- `caption`
|
|
202
203
|
- `col`
|
|
@@ -223,9 +224,9 @@ most there're compatible alternative ways of expressing the same data.
|
|
|
223
224
|
The table below provides an overview of the _current_ syntax feature
|
|
224
225
|
support by the relevant packages consuming hiccup:
|
|
225
226
|
|
|
226
|
-
- [@thi.ng/hiccup](https://
|
|
227
|
-
- [@thi.ng/hdom](https://
|
|
228
|
-
- [@thi.ng/rdom](https://
|
|
227
|
+
- [@thi.ng/hiccup](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hiccup)
|
|
228
|
+
- [@thi.ng/hdom](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hdom)
|
|
229
|
+
- [@thi.ng/rdom](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/rdom)
|
|
229
230
|
|
|
230
231
|
| Feature | Example and HTML equivalent/result | hiccup | hdom | rdom |
|
|
231
232
|
|----------------------------|------------------------------------------------------|--------|------|------|
|
|
@@ -251,17 +252,17 @@ packages.
|
|
|
251
252
|
of course, but will NOT be evaluated to obtain final attrib value
|
|
252
253
|
|
|
253
254
|
(2) The
|
|
254
|
-
[`IDeref`](https://
|
|
255
|
+
[`IDeref`](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/api/src/deref.ts)
|
|
255
256
|
interface is implemented by various data structures in the
|
|
256
257
|
thi.ng/umbrella eco system (most relevant:
|
|
257
|
-
[@thi.ng/rstream](https://
|
|
258
|
-
[@thi.ng/atom](https://
|
|
258
|
+
[@thi.ng/rstream](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/rstream),
|
|
259
|
+
[@thi.ng/atom](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/atom)).
|
|
259
260
|
|
|
260
261
|
## Status
|
|
261
262
|
|
|
262
263
|
**STABLE** - used in production
|
|
263
264
|
|
|
264
|
-
[Search or submit any issues for this package](https://
|
|
265
|
+
[Search or submit any issues for this package](https://codeberg.org/thi.ng/umbrella/issues?q=%5Bhiccup-html%5D)
|
|
265
266
|
|
|
266
267
|
The current aim is not necessarily to have wrappers for *each* possible
|
|
267
268
|
HTML5 element, but certainly to support the most commonly used ones. PRs
|
|
@@ -269,13 +270,13 @@ welcome!
|
|
|
269
270
|
|
|
270
271
|
## Support packages
|
|
271
272
|
|
|
272
|
-
- [@thi.ng/hiccup-html-parse](https://
|
|
273
|
+
- [@thi.ng/hiccup-html-parse](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hiccup-html-parse) - Well-formed HTML parsing and customizable transformation to nested JS arrays in [@thi.ng/hiccup](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hiccup) format
|
|
273
274
|
|
|
274
275
|
## Related packages
|
|
275
276
|
|
|
276
|
-
- [@thi.ng/hdom](https://
|
|
277
|
-
- [@thi.ng/rdom](https://
|
|
278
|
-
- [@thi.ng/hiccup-svg](https://
|
|
277
|
+
- [@thi.ng/hdom](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hdom) - Lightweight vanilla ES6 UI component trees with customizable branch-local behaviors
|
|
278
|
+
- [@thi.ng/rdom](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/rdom) - Lightweight, reactive, VDOM-less UI/DOM components with async lifecycle and [@thi.ng/hiccup](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hiccup) compatible
|
|
279
|
+
- [@thi.ng/hiccup-svg](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hiccup-svg) - SVG element functions for [@thi.ng/hiccup](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hiccup) & related tooling
|
|
279
280
|
|
|
280
281
|
## Installation
|
|
281
282
|
|
|
@@ -301,51 +302,52 @@ Package sizes (brotli'd, pre-treeshake): ESM: 1.63 KB
|
|
|
301
302
|
|
|
302
303
|
## Dependencies
|
|
303
304
|
|
|
304
|
-
- [@thi.ng/api](https://
|
|
305
|
+
- [@thi.ng/api](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/api)
|
|
305
306
|
|
|
306
307
|
Note: @thi.ng/api is in _most_ cases a type-only import (not used at runtime)
|
|
307
308
|
|
|
308
309
|
## Usage examples
|
|
309
310
|
|
|
310
|
-
|
|
311
|
-
[/examples](https://
|
|
311
|
+
34 projects in this repo's
|
|
312
|
+
[/examples](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples)
|
|
312
313
|
directory are using this package:
|
|
313
314
|
|
|
314
|
-
| Screenshot | Description | Live demo | Source
|
|
315
|
-
|
|
316
|
-
| <img src="https://
|
|
317
|
-
| <img src="https://
|
|
318
|
-
| <img src="https://
|
|
319
|
-
| <img src="https://
|
|
320
|
-
| <img src="https://
|
|
321
|
-
| <img src="https://
|
|
322
|
-
| <img src="https://
|
|
323
|
-
| <img src="https://
|
|
324
|
-
| <img src="https://
|
|
325
|
-
| <img src="https://
|
|
326
|
-
| <img src="https://
|
|
327
|
-
| <img src="https://
|
|
328
|
-
| <img src="https://
|
|
329
|
-
| <img src="https://
|
|
330
|
-
| <img src="https://
|
|
331
|
-
| <img src="https://
|
|
332
|
-
| <img src="https://
|
|
333
|
-
| <img src="https://
|
|
334
|
-
| <img src="https://
|
|
335
|
-
| <img src="https://
|
|
336
|
-
| <img src="https://
|
|
337
|
-
| <img src="https://
|
|
338
|
-
|
|
|
339
|
-
|
|
|
340
|
-
| <img src="https://
|
|
341
|
-
| <img src="https://
|
|
342
|
-
| <img src="https://
|
|
343
|
-
| <img src="https://
|
|
344
|
-
| <img src="https://
|
|
345
|
-
| <img src="https://
|
|
346
|
-
| <img src="https://
|
|
347
|
-
| <img src="https://
|
|
348
|
-
| <img src="https://
|
|
315
|
+
| Screenshot | Description | Live demo | Source |
|
|
316
|
+
|:----------------------------------------------------------------------------------------------------------------------------|:--------------------------------------------------------------------------------------------------------|:----------------------------------------------------------|:-----------------------------------------------------------------------------------------------|
|
|
317
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/big-font.png" width="240"/> | Large ASCII font text generator using @thi.ng/rdom | [Demo](https://demo.thi.ng/umbrella/big-font/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/big-font) |
|
|
318
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/bitmap-font.gif" width="240"/> | Figlet-style bitmap font creation with transducers | [Demo](https://demo.thi.ng/umbrella/bitmap-font/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/bitmap-font) |
|
|
319
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/blurhash.jpg" width="240"/> | Interactive & reactive image blurhash generator | [Demo](https://demo.thi.ng/umbrella/blurhash/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/blurhash) |
|
|
320
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/canvas-recorder.png" width="240"/> | Self-modifying, animated typographic grid with emergent complex patterns | [Demo](https://demo.thi.ng/umbrella/canvas-recorder/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/canvas-recorder) |
|
|
321
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/color-contrast.avif" width="240"/> | Tool to interactively compute & visualize color contrasts against WCAG threshold | [Demo](https://demo.thi.ng/umbrella/color-contrast/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/color-contrast) |
|
|
322
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/color-themes.png" width="240"/> | Probabilistic color theme generator | [Demo](https://demo.thi.ng/umbrella/color-themes/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/color-themes) |
|
|
323
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/csp-bus.png" width="240"/> | CSP channel-based event handling, async transducers & reactive UI components | [Demo](https://demo.thi.ng/umbrella/csp-bus/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/csp-bus) |
|
|
324
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/darkroom-calc.avif" width="240"/> | Useful small calculators for darkroom processing | [Demo](https://demo.thi.ng/umbrella/darkroom-calc/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/darkroom-calc) |
|
|
325
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/dominant-colors.png" width="240"/> | Color palette generation via dominant color extraction from uploaded images | [Demo](https://demo.thi.ng/umbrella/dominant-colors/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/dominant-colors) |
|
|
326
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/layout-gridgen.png" width="240"/> | Randomized space-filling, nested grid layout generator | [Demo](https://demo.thi.ng/umbrella/layout-gridgen/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/layout-gridgen) |
|
|
327
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/lispy-repl.png" width="240"/> | Browser REPL for a Lispy S-expression based mini language | [Demo](https://demo.thi.ng/umbrella/lispy-repl/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/lispy-repl) |
|
|
328
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/mastodon-feed.jpg" width="240"/> | Mastodon API feed reader with support for different media types, fullscreen media modal, HTML rewriting | [Demo](https://demo.thi.ng/umbrella/mastodon-feed/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/mastodon-feed) |
|
|
329
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/meta-css-basics.png" width="240"/> | Basic thi.ng/meta-css usage & testbed | [Demo](https://demo.thi.ng/umbrella/meta-css-basics/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/meta-css-basics) |
|
|
330
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/parse-playground.png" width="240"/> | Parser grammar livecoding editor/playground & codegen | [Demo](https://demo.thi.ng/umbrella/parse-playground/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/parse-playground) |
|
|
331
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/pixel-gradients.jpg" width="240"/> | Randomized 4-point 2D color gradient image generator | [Demo](https://demo.thi.ng/umbrella/pixel-gradients/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/pixel-gradients) |
|
|
332
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/pixel-sorting.png" width="240"/> | Interactive pixel sorting tool using thi.ng/color & thi.ng/pixel | [Demo](https://demo.thi.ng/umbrella/pixel-sorting/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/pixel-sorting) |
|
|
333
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/pixel-waveform.jpg" width="240"/> | RGB waveform image analysis | [Demo](https://demo.thi.ng/umbrella/pixel-waveform/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/pixel-waveform) |
|
|
334
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/procedural-text.jpg" width="240"/> | Procedural stochastic text generation via custom DSL, parse grammar & AST transformation | [Demo](https://demo.thi.ng/umbrella/procedural-text/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/procedural-text) |
|
|
335
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/rdom-dnd.png" width="240"/> | rdom drag & drop example | [Demo](https://demo.thi.ng/umbrella/rdom-dnd/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/rdom-dnd) |
|
|
336
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/rdom-formgen.jpg" width="240"/> | Basic usage of the declarative rdom-forms generator | [Demo](https://demo.thi.ng/umbrella/rdom-formgen/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/rdom-formgen) |
|
|
337
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/rdom-key-sequences.jpg" width="240"/> | rstream & transducer-based FSM for converting key event sequences into high-level commands | [Demo](https://demo.thi.ng/umbrella/rdom-key-sequences/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/rdom-key-sequences) |
|
|
338
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/rdom-lissajous.png" width="240"/> | rdom & hiccup-canvas interop test | [Demo](https://demo.thi.ng/umbrella/rdom-lissajous/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/rdom-lissajous) |
|
|
339
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/rdom-router.jpg" width="240"/> | Basic thi.ng/router usage with thi.ng/rdom components | [Demo](https://demo.thi.ng/umbrella/rdom-router/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/rdom-router) |
|
|
340
|
+
| | Full umbrella repo doc string search w/ paginated results | [Demo](https://demo.thi.ng/umbrella/rdom-search-docs/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/rdom-search-docs) |
|
|
341
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/rdom-web-components.png" width="240"/> | Defining & using basic Web Components (with shadow DOM) via @thi.ng/rdom & @thi.ng/meta-css | [Demo](https://demo.thi.ng/umbrella/rdom-web-components/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/rdom-web-components) |
|
|
342
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/related-images.jpg" width="240"/> | Responsive image gallery with tag-based Jaccard similarity ranking | [Demo](https://demo.thi.ng/umbrella/related-images/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/related-images) |
|
|
343
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/render-audio.png" width="240"/> | Generative audio synth offline renderer and WAV file export | [Demo](https://demo.thi.ng/umbrella/render-audio/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/render-audio) |
|
|
344
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/rstream-system-bus.png" width="240"/> | Declarative component-based system with central rstream-based pubsub event bus | [Demo](https://demo.thi.ng/umbrella/rstream-system-bus/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/rstream-system-bus) |
|
|
345
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/stacked-layout.png" width="240"/> | Responsive & reactively computed stacked column layout | [Demo](https://demo.thi.ng/umbrella/stacked-layout/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/stacked-layout) |
|
|
346
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/svg-resample.png" width="240"/> | SVG path parsing & dynamic resampling | [Demo](https://demo.thi.ng/umbrella/svg-resample/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/svg-resample) |
|
|
347
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/thing-browser.avif" width="240"/> | Tree-based UI to find & explore thi.ng projects via their associated keywords | [Demo](https://demo.thi.ng/umbrella/thing-browser/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/thing-browser) |
|
|
348
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/thing-packages-quiz.avif" width="240"/> | thi.ng/rdom & thi.ng/rstream based quiz to guess thi.ng package names | [Demo](https://demo.thi.ng/umbrella/thing-packages-quiz/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/thing-packages-quiz) |
|
|
349
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/trace-bitmap.jpg" width="240"/> | Multi-layer vectorization & dithering of bitmap images | [Demo](https://demo.thi.ng/umbrella/trace-bitmap/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/trace-bitmap) |
|
|
350
|
+
| <img src="https://codeberg.org/thi.ng/umbrella/media/branch/develop/assets/examples/webgl-channel-mixer.jpg" width="240"/> | rdom & WebGL-based image channel editor | [Demo](https://demo.thi.ng/umbrella/webgl-channel-mixer/) | [Source](https://codeberg.org/thi.ng/umbrella/src/branch/develop/examples/webgl-channel-mixer) |
|
|
349
351
|
|
|
350
352
|
## API
|
|
351
353
|
|
|
@@ -423,13 +425,13 @@ const div = defElement<Partial<Pick<Attribs, "class" | "style">>>("div");
|
|
|
423
425
|
The `Attribs` interface provides a common, fully typed base definition
|
|
424
426
|
of HTML attributes (incl. event listeners and enumerated attrib options)
|
|
425
427
|
and can be found in
|
|
426
|
-
[api.ts](https://
|
|
428
|
+
[api.ts](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hiccup-html/src/api.ts#L126).
|
|
427
429
|
|
|
428
430
|
The `AttribVal` type wrapper is used to allow for reactive attribute
|
|
429
431
|
values (in
|
|
430
|
-
[@thi.ng/rdom](https://
|
|
432
|
+
[@thi.ng/rdom](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/rdom))
|
|
431
433
|
and [`IDeref`
|
|
432
|
-
instances](https://
|
|
434
|
+
instances](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/api/src/deref.ts)
|
|
433
435
|
when later providing attribute values to an element.
|
|
434
436
|
|
|
435
437
|
#### Element creation
|
|
@@ -444,7 +446,7 @@ signatures](https://docs.thi.ng/umbrella/hiccup-html/functions/defElement.html):
|
|
|
444
446
|
```
|
|
445
447
|
|
|
446
448
|
The result of either form is a simple tuple, defining an HTML element in
|
|
447
|
-
[@thi.ng/hiccup](https://
|
|
449
|
+
[@thi.ng/hiccup](https://codeberg.org/thi.ng/umbrella/src/branch/develop/packages/hiccup)
|
|
448
450
|
syntax.
|
|
449
451
|
|
|
450
452
|
If the second call signature is used, the initial `emmet`-style string
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@thi.ng/hiccup-html",
|
|
3
|
-
"version": "2.7.
|
|
3
|
+
"version": "2.7.51",
|
|
4
4
|
"description": "100+ type-checked HTML5 element functions for @thi.ng/hiccup related infrastructure",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"module": "./index.js",
|
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
"sideEffects": false,
|
|
9
9
|
"repository": {
|
|
10
10
|
"type": "git",
|
|
11
|
-
"url": "git+https://
|
|
11
|
+
"url": "git+https://codeberg.org/thi.ng/umbrella.git",
|
|
12
12
|
"directory": "packages/hiccup-html"
|
|
13
13
|
},
|
|
14
14
|
"homepage": "https://thi.ng/hiccup-html",
|
|
@@ -40,11 +40,11 @@
|
|
|
40
40
|
"tool:tangle": "../../node_modules/.bin/tangle src/**/*.ts"
|
|
41
41
|
},
|
|
42
42
|
"dependencies": {
|
|
43
|
-
"@thi.ng/api": "^8.12.
|
|
43
|
+
"@thi.ng/api": "^8.12.19"
|
|
44
44
|
},
|
|
45
45
|
"devDependencies": {
|
|
46
|
-
"esbuild": "^0.
|
|
47
|
-
"typedoc": "^0.28.
|
|
46
|
+
"esbuild": "^0.28.0",
|
|
47
|
+
"typedoc": "^0.28.18",
|
|
48
48
|
"typescript": "^5.9.3"
|
|
49
49
|
},
|
|
50
50
|
"keywords": [
|
|
@@ -114,5 +114,5 @@
|
|
|
114
114
|
],
|
|
115
115
|
"year": 2020
|
|
116
116
|
},
|
|
117
|
-
"gitHead": "
|
|
117
|
+
"gitHead": "a780d4a5f6f5fc595c9d28527686f63534927d32"
|
|
118
118
|
}
|