haori 0.1.2 → 0.1.3

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.
Files changed (38) hide show
  1. package/LICENSE +21 -21
  2. package/README.ja.md +182 -167
  3. package/README.md +184 -169
  4. package/dist/haori.cjs.js +10 -9
  5. package/dist/haori.cjs.js.map +1 -1
  6. package/dist/haori.es.js +666 -569
  7. package/dist/haori.es.js.map +1 -1
  8. package/dist/haori.iife.js +10 -9
  9. package/dist/haori.iife.js.map +1 -1
  10. package/dist/index.d.ts +1 -1
  11. package/dist/package.json +1 -1
  12. package/dist/src/expression.d.ts +27 -3
  13. package/dist/src/expression.d.ts.map +1 -1
  14. package/dist/src/expression.js +97 -24
  15. package/dist/src/expression.js.map +1 -1
  16. package/dist/src/form.d.ts.map +1 -1
  17. package/dist/src/form.js +17 -3
  18. package/dist/src/form.js.map +1 -1
  19. package/dist/src/index.d.ts +1 -1
  20. package/dist/src/index.js +1 -1
  21. package/dist/src/procedure.d.ts.map +1 -1
  22. package/dist/src/procedure.js +37 -16
  23. package/dist/src/procedure.js.map +1 -1
  24. package/dist/tests/core.test.js +46 -46
  25. package/dist/tests/data-each-browserlike.test.js +10 -10
  26. package/dist/tests/data-each-fragment-debug.test.js +36 -36
  27. package/dist/tests/data-each-table.test.js +93 -10
  28. package/dist/tests/data-each-table.test.js.map +1 -1
  29. package/dist/tests/data-fetch-tbody-dom.test.js +12 -12
  30. package/dist/tests/expression.test.js +37 -21
  31. package/dist/tests/expression.test.js.map +1 -1
  32. package/dist/tests/form.test.js +241 -241
  33. package/dist/tests/import.test.js +34 -34
  34. package/dist/tests/procedure-action-operations.test.js +85 -0
  35. package/dist/tests/procedure-action-operations.test.js.map +1 -1
  36. package/dist/tests/row-move.test.js +67 -67
  37. package/dist/tests/row-operations.test.js +84 -84
  38. package/package.json +70 -70
package/README.md CHANGED
@@ -1,169 +1,184 @@
1
- # Haori.js
2
-
3
- Haori.js is a lightweight, HTML-first UI library that enables dynamic user interfaces primarily through HTML attributes. It lets you declare data bindings, conditional rendering, list rendering, form two-way binding, server fetches, and HTML imports without writing much JavaScript.
4
-
5
- Version: 0.1.2
6
-
7
- ---
8
-
9
- Contents
10
-
11
- - Overview
12
- - Installation
13
- - Quick start
14
- - Common attributes (summary)
15
- - Build & publish
16
- - License & contributing
17
- - Further documentation
18
-
19
- ---
20
-
21
- ## Overview
22
-
23
- - Design principle: HTML-first — declare UI behavior with HTML attributes
24
- - Key features:
25
- - Data binding via `data-bind`
26
- - Conditional rendering via `data-if`
27
- - List rendering via `data-each`
28
- - Two-way form binding (automatic binding based on `name` attributes)
29
- - Server fetches via `data-fetch`
30
- - HTML imports via `data-import`
31
- - Zero runtime dependencies (uses browser-native APIs)
32
-
33
- ## Installation
34
-
35
- Install from npm:
36
-
37
- ```bash
38
- npm install haori
39
- ```
40
-
41
- Via CDN:
42
-
43
- ```html
44
- <script src="https://cdn.jsdelivr.net/npm/haori/dist/haori.iife.js"></script>
45
- ```
46
-
47
- This CDN URL follows the latest published npm release.
48
-
49
- ES Module import:
50
-
51
- ```js
52
- import Haori from 'haori'
53
- ```
54
-
55
- ---
56
-
57
- ## Quick start
58
-
59
- You can use Haori with plain HTML. Minimal example:
60
-
61
- ```html
62
- <!DOCTYPE html>
63
- <html lang="en">
64
- <head>
65
- <meta charset="utf-8">
66
- <title>Haori Sample</title>
67
- <script src="https://cdn.jsdelivr.net/npm/haori/dist/haori.iife.js"></script>
68
- </head>
69
- <body>
70
- <div data-bind='{"name":"Taro"}'>
71
- <p>Hello, {{name}}</p>
72
- </div>
73
- </body>
74
- </html>
75
- ```
76
-
77
- Mounting from JavaScript:
78
-
79
- ```js
80
- import Haori from 'haori'
81
-
82
- Haori.mount(document.body, { items: [ { name: 'apple' }, { name: 'orange' } ] })
83
- ```
84
-
85
- ---
86
-
87
- ## Common attributes (summary)
88
-
89
- - `data-bind` — set binding data for an element (JSON or parameter format)
90
- - `{{ ... }}` — template expressions (evaluated and inserted)
91
- - `data-if` — show/hide an element based on a condition
92
- - `data-each` — repeat an element for items in an array (`data-each-key`, `data-each-arg`, `data-each-index`)
93
- - `data-fetch` — fetch data from a server and bind the result
94
- - `data-import` — load external HTML and insert it
95
- - `data-url-param` — import URL query parameters into bindings
96
-
97
- Template expressions support safe JavaScript-like syntax such as property access, bracket access with dynamic indexes, optional chaining, ternary expressions, and method chains including array `map`/`filter` with arrow functions and spread calls. Access to global objects, `eval` or `arguments`, and prototype escape paths such as `constructor`, `__proto__`, `prototype`, or `Reflect` is blocked.
98
-
99
- For detailed usage and many examples, see the official documentation.
100
-
101
- ---
102
-
103
- ## Build & publish (packaging)
104
-
105
- Basic local verification and release preparation steps:
106
-
107
- 1. Install dependencies
108
-
109
- ```bash
110
- npm install
111
- ```
112
-
113
- 2. Type-check and test
114
-
115
- ```bash
116
- npm run compile
117
- npm run test
118
- ```
119
-
120
- 3. Build release artifacts
121
-
122
- ```bash
123
- npm run build
124
- ```
125
-
126
- 4. Bump version
127
-
128
- ```bash
129
- npm version patch
130
- ```
131
-
132
- 5. Push the version update and create a GitHub Release for the new tag
133
-
134
- Publishing to npm is handled by GitHub Actions when a GitHub Release is published. This repository currently uses release workflows that trigger on `release.published`, build the package, publish it to npm with `NPM_TOKEN`, and upload `dist.zip` to the release artifacts.
135
-
136
- Required repository setup:
137
-
138
- - `NPM_TOKEN` must be configured in GitHub repository secrets.
139
- - The release must be published from the target version tag.
140
-
141
- Recommended pre-release checks:
142
-
143
- - `npm run test`
144
- - `npm run build`
145
- - `npm pack --dry-run`
146
-
147
- Make sure `package.json` fields `name`, `version`, `description`, `repository` and `license` are correct. Files published to npm are controlled by the `files` field in `package.json`.
148
-
149
- ---
150
-
151
- ## License & Contributing
152
-
153
- - License: MIT (see `LICENSE` in this repository)
154
-
155
- Contributions are welcome — please open issues or pull requests on the GitHub repository.
156
-
157
- ---
158
-
159
- ## Further documentation
160
-
161
- For more detailed usage, attribute specs, and internal design, see:
162
-
163
- - `docs/ja/guide.md` — User guide (many examples)
164
- - `docs/ja/specs.md` — Technical specifications (internal design, API)
165
-
166
- ---
167
-
168
- If you would like additional sections (API reference, diagrams, more examples), tell me what to include and I will expand the README.
169
-
1
+ # Haori.js
2
+
3
+ Haori.js is a lightweight, HTML-first UI library that enables dynamic user interfaces primarily through HTML attributes. It lets you declare data bindings, conditional rendering, list rendering, form two-way binding, server fetches, and HTML imports without writing much JavaScript.
4
+
5
+ Version: 0.1.3
6
+
7
+ ---
8
+
9
+ Contents
10
+
11
+ - Overview
12
+ - Installation
13
+ - Quick start
14
+ - Common attributes (summary)
15
+ - Build & publish
16
+ - License & contributing
17
+ - Further documentation
18
+
19
+ ---
20
+
21
+ ## Overview
22
+
23
+ - Design principle: HTML-first — declare UI behavior with HTML attributes
24
+ - Key features:
25
+ - Data binding via `data-bind`
26
+ - Conditional rendering via `data-if`
27
+ - List rendering via `data-each`
28
+ - Two-way form binding (automatic binding based on `name` attributes)
29
+ - Server fetches via `data-fetch`
30
+ - HTML imports via `data-import`
31
+ - Zero runtime dependencies (uses browser-native APIs)
32
+
33
+ ## Installation
34
+
35
+ Install from npm:
36
+
37
+ ```bash
38
+ npm install haori
39
+ ```
40
+
41
+ Via CDN:
42
+
43
+ ```html
44
+ <script src="https://cdn.jsdelivr.net/npm/haori/dist/haori.iife.js"></script>
45
+ ```
46
+
47
+ This CDN URL follows the latest published npm release.
48
+
49
+ ES Module import:
50
+
51
+ ```js
52
+ import Haori from 'haori'
53
+ ```
54
+
55
+ ---
56
+
57
+ ## Quick start
58
+
59
+ You can use Haori with plain HTML. Minimal example:
60
+
61
+ ```html
62
+ <!DOCTYPE html>
63
+ <html lang="en">
64
+ <head>
65
+ <meta charset="utf-8">
66
+ <title>Haori Sample</title>
67
+ <script src="https://cdn.jsdelivr.net/npm/haori/dist/haori.iife.js"></script>
68
+ </head>
69
+ <body>
70
+ <div data-bind='{"name":"Taro"}'>
71
+ <p>Hello, {{name}}</p>
72
+ </div>
73
+ </body>
74
+ </html>
75
+ ```
76
+
77
+ Mounting from JavaScript:
78
+
79
+ ```js
80
+ import Haori from 'haori'
81
+
82
+ Haori.mount(document.body, { items: [ { name: 'apple' }, { name: 'orange' } ] })
83
+ ```
84
+
85
+ ---
86
+
87
+ ## Common attributes (summary)
88
+
89
+ - `data-bind` — set binding data for an element (JSON or parameter format)
90
+ - `{{ ... }}` — template expressions (evaluated and inserted)
91
+ - `data-if` — show/hide an element based on a condition
92
+ - `data-each` — repeat an element for items in an array (`data-each-key`, `data-each-arg`, `data-each-index`)
93
+ - `data-fetch` — fetch data from a server and bind the result
94
+ - `data-import` — load external HTML and insert it
95
+ - `data-url-param` — import URL query parameters into bindings
96
+
97
+ Template expressions support safe JavaScript-like syntax such as property access, bracket access with dynamic indexes, optional chaining, ternary expressions, and method chains including array `map`/`filter` with arrow functions and spread calls. Access to global objects, `eval` or `arguments`, and prototype escape paths such as `constructor`, `__proto__`, `prototype`, or `Reflect` is blocked.
98
+
99
+ For detailed usage and many examples, see the official documentation.
100
+
101
+ ---
102
+
103
+ ## Build & publish (packaging)
104
+
105
+ Basic local verification and release preparation steps:
106
+
107
+ Quick release memo:
108
+
109
+ 1. Run `npm run test`, `npm run build`, and `npm pack --dry-run`.
110
+ 2. Bump the package version with `npm version patch` or the intended version command.
111
+ 3. Push `main` and tags with `git push origin main` and `git push origin --tags`.
112
+ 4. Publish a GitHub Release from the new version tag.
113
+ 5. Confirm npm, jsDelivr, and the GitHub Release assets reflect the new version.
114
+
115
+ 1. Install dependencies
116
+
117
+ ```bash
118
+ npm install
119
+ ```
120
+
121
+ 2. Type-check and test
122
+
123
+ ```bash
124
+ npm run compile
125
+ npm run test
126
+ ```
127
+
128
+ 3. Build release artifacts
129
+
130
+ ```bash
131
+ npm run build
132
+ ```
133
+
134
+ 4. Bump version
135
+
136
+ ```bash
137
+ npm version patch
138
+ ```
139
+
140
+ 5. Push the version update and tags
141
+
142
+ ```bash
143
+ git push origin main
144
+ git push origin --tags
145
+ ```
146
+
147
+ 6. Publish a GitHub Release from the new tag
148
+
149
+ Publishing to npm is handled by GitHub Actions when a GitHub Release is published. This repository uses release workflows that trigger on `release.published`, build the package, publish it to npm with `NPM_TOKEN` if that package version is not already published, and upload `dist.zip` to the release assets.
150
+
151
+ Required repository setup:
152
+
153
+ - `NPM_TOKEN` must be configured in GitHub Actions repository secrets.
154
+ - The release must be published from the target version tag.
155
+
156
+ Recommended pre-release checks:
157
+
158
+ - `npm run test`
159
+ - `npm run build`
160
+ - `npm pack --dry-run`
161
+
162
+ Make sure `package.json` fields `name`, `version`, `description`, `repository` and `license` are correct. Files published to npm are controlled by the `files` field in `package.json`.
163
+
164
+ ---
165
+
166
+ ## License & Contributing
167
+
168
+ - License: MIT (see `LICENSE` in this repository)
169
+
170
+ Contributions are welcome — please open issues or pull requests on the GitHub repository.
171
+
172
+ ---
173
+
174
+ ## Further documentation
175
+
176
+ For more detailed usage, attribute specs, and internal design, see:
177
+
178
+ - `docs/ja/guide.md` — User guide (many examples)
179
+ - `docs/ja/specs.md` — Technical specifications (internal design, API)
180
+
181
+ ---
182
+
183
+ If you would like additional sections (API reference, diagrams, more examples), tell me what to include and I will expand the README.
184
+