@burger-editor/frozen-patty 4.0.0-alpha.63 → 4.0.0-alpha.64
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 +18 -0
- package/dist/set-value.d.ts +6 -5
- package/dist/set-value.js +228 -440
- package/package.json +3 -3
package/README.md
CHANGED
|
@@ -584,6 +584,24 @@ HTML文字列に変換します。
|
|
|
584
584
|
|
|
585
585
|
DOM要素に変換します。
|
|
586
586
|
|
|
587
|
+
## サブモジュールエクスポート
|
|
588
|
+
|
|
589
|
+
メインの`frozenPatty`関数以外に、個別の機能をサブモジュールとしてインポートできます。
|
|
590
|
+
|
|
591
|
+
| エクスポートパス | 説明 |
|
|
592
|
+
| --------------------------------------- | -------------------------------------------------------------- |
|
|
593
|
+
| `@burger-editor/frozen-patty` | メインの `frozenPatty` 関数 |
|
|
594
|
+
| `@burger-editor/frozen-patty/get-value` | HTML要素からフィールド値を取得する `getValue` 関数 |
|
|
595
|
+
| `@burger-editor/frozen-patty/set-value` | HTML要素にフィールド値を設定する `setValue`, `setContent` 関数 |
|
|
596
|
+
| `@burger-editor/frozen-patty/utils` | HTML正規化、フィールドパースなどのユーティリティ |
|
|
597
|
+
| `@burger-editor/frozen-patty/types` | TypeScript型定義 |
|
|
598
|
+
|
|
599
|
+
```js
|
|
600
|
+
// サブモジュールの個別インポート例
|
|
601
|
+
import { setValue } from '@burger-editor/frozen-patty/set-value';
|
|
602
|
+
import { getValue } from '@burger-editor/frozen-patty/get-value';
|
|
603
|
+
```
|
|
604
|
+
|
|
587
605
|
## ライセンス
|
|
588
606
|
|
|
589
607
|
MIT
|
package/dist/set-value.d.ts
CHANGED
|
@@ -14,10 +14,11 @@ import type { Filter, PrimitiveDatum } from './types.js';
|
|
|
14
14
|
*/
|
|
15
15
|
export declare function setValue(el: Element, name: string, datum: PrimitiveDatum, attr?: string, filter?: Filter, xssSanitize?: boolean): void;
|
|
16
16
|
/**
|
|
17
|
-
*
|
|
18
|
-
*
|
|
19
|
-
* @param
|
|
20
|
-
* @param
|
|
21
|
-
* @param
|
|
17
|
+
* Set content value on a form element or general element.
|
|
18
|
+
* Handles checkbox/radio checked state, input values, and innerHTML/textContent.
|
|
19
|
+
* @param el - The target element
|
|
20
|
+
* @param datum - The value to set
|
|
21
|
+
* @param asHtml - Whether to set as innerHTML (true) or textContent (false)
|
|
22
|
+
* @param xssSanitize - Whether to sanitize HTML content for XSS protection
|
|
22
23
|
*/
|
|
23
24
|
export declare function setContent(el: Element, datum: PrimitiveDatum, asHtml?: boolean, xssSanitize?: boolean): void;
|
package/dist/set-value.js
CHANGED
|
@@ -25,7 +25,6 @@ export function setValue(el, name, datum, attr = 'field', filter, xssSanitize =
|
|
|
25
25
|
if (filter) {
|
|
26
26
|
datum = filter(datum);
|
|
27
27
|
}
|
|
28
|
-
// console.log({ name, field, fieldName, propName, datum, el: el.innerHTML });
|
|
29
28
|
if (!propName) {
|
|
30
29
|
setContent(el, datum, undefined, xssSanitize);
|
|
31
30
|
return;
|
|
@@ -74,6 +73,53 @@ export function setValue(el, name, datum, attr = 'field', filter, xssSanitize =
|
|
|
74
73
|
}
|
|
75
74
|
el.setAttribute(propName, `${datum}`);
|
|
76
75
|
}
|
|
76
|
+
/**
|
|
77
|
+
* Set a boolean attribute on an element via its DOM property.
|
|
78
|
+
* Empty string is treated as true (HTML boolean attribute convention).
|
|
79
|
+
* Falls back to setAttribute if the element doesn't match any of the expected types.
|
|
80
|
+
* @param el
|
|
81
|
+
* @param datum
|
|
82
|
+
* @param types
|
|
83
|
+
* @param prop
|
|
84
|
+
* @param emptyIsTrue
|
|
85
|
+
* @returns true if handled
|
|
86
|
+
*/
|
|
87
|
+
function setBooleanAttr(el, datum, types, prop, emptyIsTrue = true) {
|
|
88
|
+
if (types.some((T) => el instanceof T)) {
|
|
89
|
+
// SAFETY: prop is always a hardcoded string literal from setBooleanAttrByName
|
|
90
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
91
|
+
el[prop] = emptyIsTrue ? (datum === '' ? true : !!datum) : !!datum;
|
|
92
|
+
return true;
|
|
93
|
+
}
|
|
94
|
+
return false;
|
|
95
|
+
}
|
|
96
|
+
/**
|
|
97
|
+
* Set an integer attribute on an element via its DOM property.
|
|
98
|
+
* Removes the attribute if the parsed value is NaN.
|
|
99
|
+
* Falls back to setAttribute if the element doesn't match any of the expected types.
|
|
100
|
+
* @param el
|
|
101
|
+
* @param name
|
|
102
|
+
* @param datum
|
|
103
|
+
* @param types
|
|
104
|
+
* @param prop
|
|
105
|
+
* @param floor
|
|
106
|
+
* @returns true if handled
|
|
107
|
+
*/
|
|
108
|
+
function setIntegerAttr(el, name, datum, types, prop, floor = false) {
|
|
109
|
+
if (types.some((T) => el instanceof T)) {
|
|
110
|
+
const val = toInt(datum);
|
|
111
|
+
if (Number.isNaN(val)) {
|
|
112
|
+
el.removeAttribute(name);
|
|
113
|
+
}
|
|
114
|
+
else {
|
|
115
|
+
// SAFETY: prop is always a hardcoded string literal from setIntegerAttrByName
|
|
116
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
117
|
+
el[prop] = floor ? Math.floor(val) : val;
|
|
118
|
+
}
|
|
119
|
+
return true;
|
|
120
|
+
}
|
|
121
|
+
return false;
|
|
122
|
+
}
|
|
77
123
|
/**
|
|
78
124
|
*
|
|
79
125
|
* @param el
|
|
@@ -133,6 +179,25 @@ function set(el, prefix, name, datum, xssSanitize = true) {
|
|
|
133
179
|
}
|
|
134
180
|
return;
|
|
135
181
|
}
|
|
182
|
+
if (setSpecialAttr(el, name, datum)) {
|
|
183
|
+
return;
|
|
184
|
+
}
|
|
185
|
+
if (setBooleanAttrByName(el, name, datum)) {
|
|
186
|
+
return;
|
|
187
|
+
}
|
|
188
|
+
if (setIntegerAttrByName(el, name, datum)) {
|
|
189
|
+
return;
|
|
190
|
+
}
|
|
191
|
+
el.setAttribute(name, `${datum}`);
|
|
192
|
+
}
|
|
193
|
+
/**
|
|
194
|
+
* Handle attributes with unique logic that doesn't fit boolean/integer patterns.
|
|
195
|
+
* @param el
|
|
196
|
+
* @param name
|
|
197
|
+
* @param datum
|
|
198
|
+
* @returns true if handled
|
|
199
|
+
*/
|
|
200
|
+
function setSpecialAttr(el, name, datum) {
|
|
136
201
|
switch (name) {
|
|
137
202
|
case 'contenteditable': {
|
|
138
203
|
switch (datum) {
|
|
@@ -146,7 +211,7 @@ function set(el, prefix, name, datum, xssSanitize = true) {
|
|
|
146
211
|
el.removeAttribute(name);
|
|
147
212
|
}
|
|
148
213
|
}
|
|
149
|
-
return;
|
|
214
|
+
return true;
|
|
150
215
|
}
|
|
151
216
|
case 'dir': {
|
|
152
217
|
switch (datum) {
|
|
@@ -155,45 +220,45 @@ function set(el, prefix, name, datum, xssSanitize = true) {
|
|
|
155
220
|
el.dir = datum;
|
|
156
221
|
break;
|
|
157
222
|
}
|
|
158
|
-
// case 'auto':
|
|
159
223
|
default: {
|
|
160
224
|
el.removeAttribute(name);
|
|
161
225
|
}
|
|
162
226
|
}
|
|
163
|
-
return;
|
|
227
|
+
return true;
|
|
164
228
|
}
|
|
165
229
|
case 'draggable': {
|
|
166
230
|
if (typeof datum === 'boolean') {
|
|
167
231
|
el.draggable = datum;
|
|
168
|
-
break;
|
|
169
232
|
}
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
233
|
+
else {
|
|
234
|
+
switch (datum) {
|
|
235
|
+
case 'true': {
|
|
236
|
+
el.draggable = true;
|
|
237
|
+
break;
|
|
238
|
+
}
|
|
239
|
+
case 'false': {
|
|
240
|
+
el.draggable = false;
|
|
241
|
+
break;
|
|
242
|
+
}
|
|
243
|
+
default: {
|
|
244
|
+
el.removeAttribute(name);
|
|
245
|
+
}
|
|
182
246
|
}
|
|
183
247
|
}
|
|
184
|
-
return;
|
|
248
|
+
return true;
|
|
185
249
|
}
|
|
186
250
|
case 'hidden': {
|
|
187
251
|
if (datum === 'until-found') {
|
|
188
252
|
el.setAttribute(name, datum);
|
|
189
|
-
return;
|
|
190
253
|
}
|
|
191
|
-
|
|
192
|
-
|
|
254
|
+
else {
|
|
255
|
+
el.hidden = !!datum;
|
|
256
|
+
}
|
|
257
|
+
return true;
|
|
193
258
|
}
|
|
194
259
|
case 'spellcheck': {
|
|
195
260
|
el.spellcheck = !!datum;
|
|
196
|
-
return;
|
|
261
|
+
return true;
|
|
197
262
|
}
|
|
198
263
|
case 'tabindex': {
|
|
199
264
|
let i;
|
|
@@ -204,501 +269,224 @@ function set(el, prefix, name, datum, xssSanitize = true) {
|
|
|
204
269
|
i = Number.parseInt(datum, 10);
|
|
205
270
|
}
|
|
206
271
|
else {
|
|
207
|
-
i = datum;
|
|
272
|
+
i = datum ?? -1;
|
|
208
273
|
}
|
|
209
274
|
el.tabIndex = Number.isNaN(i) ? -1 : Math.floor(i);
|
|
210
|
-
return;
|
|
211
|
-
}
|
|
212
|
-
case 'async': {
|
|
213
|
-
if (el instanceof HTMLScriptElement) {
|
|
214
|
-
el.async = !!datum;
|
|
215
|
-
}
|
|
216
|
-
else {
|
|
217
|
-
el.setAttribute(name, `${datum}`);
|
|
218
|
-
}
|
|
219
|
-
return;
|
|
275
|
+
return true;
|
|
220
276
|
}
|
|
221
277
|
case 'autocomplete': {
|
|
222
278
|
if (el instanceof HTMLInputElement || el instanceof HTMLFormElement) {
|
|
223
|
-
|
|
224
|
-
el.autocomplete = datum ? `${datum}` : 'off';
|
|
279
|
+
el.setAttribute(name, datum ? `${datum}` : 'off');
|
|
225
280
|
}
|
|
226
281
|
else {
|
|
227
282
|
el.setAttribute(name, `${datum}`);
|
|
228
283
|
}
|
|
229
|
-
return;
|
|
284
|
+
return true;
|
|
230
285
|
}
|
|
231
|
-
case '
|
|
232
|
-
if (el instanceof
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
286
|
+
case 'download': {
|
|
287
|
+
if (el instanceof HTMLAnchorElement) {
|
|
288
|
+
if (datum || datum === '') {
|
|
289
|
+
el.download = `${datum}`;
|
|
290
|
+
}
|
|
291
|
+
else {
|
|
292
|
+
el.removeAttribute(name);
|
|
293
|
+
}
|
|
237
294
|
}
|
|
238
295
|
else {
|
|
239
296
|
el.setAttribute(name, `${datum}`);
|
|
240
297
|
}
|
|
241
|
-
return;
|
|
298
|
+
return true;
|
|
242
299
|
}
|
|
243
|
-
case '
|
|
300
|
+
case 'preload': {
|
|
244
301
|
if (el instanceof HTMLAudioElement || el instanceof HTMLVideoElement) {
|
|
245
|
-
|
|
302
|
+
switch (datum) {
|
|
303
|
+
case '':
|
|
304
|
+
case 'auto':
|
|
305
|
+
case 'metadata': {
|
|
306
|
+
el.preload = datum;
|
|
307
|
+
break;
|
|
308
|
+
}
|
|
309
|
+
default: {
|
|
310
|
+
el.preload = 'none';
|
|
311
|
+
}
|
|
312
|
+
}
|
|
246
313
|
}
|
|
247
314
|
else {
|
|
248
315
|
el.setAttribute(name, `${datum}`);
|
|
249
316
|
}
|
|
250
|
-
return;
|
|
317
|
+
return true;
|
|
251
318
|
}
|
|
252
|
-
case '
|
|
319
|
+
case 'step': {
|
|
253
320
|
if (el instanceof HTMLInputElement) {
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
else {
|
|
257
|
-
el.setAttribute(name, `${datum}`);
|
|
258
|
-
}
|
|
259
|
-
return;
|
|
260
|
-
}
|
|
261
|
-
case 'cols': {
|
|
262
|
-
if (el instanceof HTMLTextAreaElement) {
|
|
263
|
-
const cols = toInt(datum);
|
|
264
|
-
if (Number.isNaN(cols)) {
|
|
265
|
-
el.removeAttribute(name);
|
|
321
|
+
if (datum === 'any') {
|
|
322
|
+
el.step = datum;
|
|
266
323
|
}
|
|
267
324
|
else {
|
|
268
|
-
|
|
325
|
+
const step = toNum(datum);
|
|
326
|
+
if (Number.isNaN(step)) {
|
|
327
|
+
el.removeAttribute(name);
|
|
328
|
+
}
|
|
329
|
+
else {
|
|
330
|
+
el.step = step.toString(10);
|
|
331
|
+
}
|
|
269
332
|
}
|
|
270
333
|
}
|
|
271
334
|
else {
|
|
272
335
|
el.setAttribute(name, `${datum}`);
|
|
273
336
|
}
|
|
274
|
-
return;
|
|
337
|
+
return true;
|
|
275
338
|
}
|
|
276
|
-
case '
|
|
277
|
-
if (el instanceof
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
339
|
+
case 'target': {
|
|
340
|
+
if (el instanceof HTMLAnchorElement ||
|
|
341
|
+
el instanceof HTMLAreaElement ||
|
|
342
|
+
el instanceof HTMLFormElement) {
|
|
343
|
+
if (datum) {
|
|
344
|
+
el.target = `${datum}`;
|
|
281
345
|
}
|
|
282
346
|
else {
|
|
283
|
-
el.
|
|
347
|
+
el.removeAttribute(name);
|
|
284
348
|
}
|
|
285
349
|
}
|
|
286
350
|
else {
|
|
287
351
|
el.setAttribute(name, `${datum}`);
|
|
288
352
|
}
|
|
289
|
-
return;
|
|
353
|
+
return true;
|
|
354
|
+
}
|
|
355
|
+
default: {
|
|
356
|
+
return false;
|
|
357
|
+
}
|
|
358
|
+
}
|
|
359
|
+
}
|
|
360
|
+
/**
|
|
361
|
+
* Handle boolean HTML attributes via their DOM properties.
|
|
362
|
+
* @param el
|
|
363
|
+
* @param name
|
|
364
|
+
* @param datum
|
|
365
|
+
* @returns true if handled
|
|
366
|
+
*/
|
|
367
|
+
function setBooleanAttrByName(el, name, datum) {
|
|
368
|
+
switch (name) {
|
|
369
|
+
case 'async': {
|
|
370
|
+
return setBooleanAttr(el, datum, [HTMLScriptElement], 'async', false);
|
|
371
|
+
}
|
|
372
|
+
case 'autofocus': {
|
|
373
|
+
return setBooleanAttr(el, datum, [HTMLButtonElement, HTMLInputElement, HTMLSelectElement, HTMLTextAreaElement], 'autofocus');
|
|
374
|
+
}
|
|
375
|
+
case 'autoplay': {
|
|
376
|
+
return setBooleanAttr(el, datum, [HTMLAudioElement, HTMLVideoElement], 'autoplay');
|
|
377
|
+
}
|
|
378
|
+
case 'checked': {
|
|
379
|
+
return setBooleanAttr(el, datum, [HTMLInputElement], 'checked');
|
|
290
380
|
}
|
|
291
381
|
case 'controls': {
|
|
292
|
-
|
|
293
|
-
el.controls = datum === '' ? true : !!datum;
|
|
294
|
-
}
|
|
295
|
-
else {
|
|
296
|
-
el.setAttribute(name, `${datum}`);
|
|
297
|
-
}
|
|
298
|
-
return;
|
|
382
|
+
return setBooleanAttr(el, datum, [HTMLAudioElement, HTMLVideoElement], 'controls');
|
|
299
383
|
}
|
|
300
384
|
case 'default': {
|
|
301
|
-
|
|
302
|
-
el.default = datum === '' ? true : !!datum;
|
|
303
|
-
}
|
|
304
|
-
else {
|
|
305
|
-
el.setAttribute(name, `${datum}`);
|
|
306
|
-
}
|
|
307
|
-
return;
|
|
385
|
+
return setBooleanAttr(el, datum, [HTMLTrackElement], 'default');
|
|
308
386
|
}
|
|
309
387
|
case 'defer': {
|
|
310
|
-
|
|
311
|
-
el.defer = !!datum;
|
|
312
|
-
}
|
|
313
|
-
else {
|
|
314
|
-
el.setAttribute(name, `${datum}`);
|
|
315
|
-
}
|
|
316
|
-
return;
|
|
388
|
+
return setBooleanAttr(el, datum, [HTMLScriptElement], 'defer', false);
|
|
317
389
|
}
|
|
318
390
|
case 'disabled': {
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
else {
|
|
329
|
-
el.setAttribute(name, `${datum}`);
|
|
330
|
-
}
|
|
331
|
-
return;
|
|
332
|
-
}
|
|
333
|
-
case 'download': {
|
|
334
|
-
if (el instanceof HTMLAnchorElement) {
|
|
335
|
-
if (datum || datum === '') {
|
|
336
|
-
el.download = `${datum}`;
|
|
337
|
-
}
|
|
338
|
-
else {
|
|
339
|
-
el.removeAttribute(name);
|
|
340
|
-
}
|
|
341
|
-
}
|
|
342
|
-
else {
|
|
343
|
-
el.setAttribute(name, `${datum}`);
|
|
344
|
-
}
|
|
345
|
-
return;
|
|
346
|
-
}
|
|
347
|
-
case 'high': {
|
|
348
|
-
if (el instanceof HTMLMeterElement) {
|
|
349
|
-
const high = toInt(datum);
|
|
350
|
-
if (Number.isNaN(high)) {
|
|
351
|
-
el.removeAttribute(name);
|
|
352
|
-
}
|
|
353
|
-
else {
|
|
354
|
-
el.high = high;
|
|
355
|
-
}
|
|
356
|
-
}
|
|
357
|
-
else {
|
|
358
|
-
el.setAttribute(name, `${datum}`);
|
|
359
|
-
}
|
|
360
|
-
return;
|
|
391
|
+
return setBooleanAttr(el, datum, [
|
|
392
|
+
HTMLButtonElement,
|
|
393
|
+
HTMLFieldSetElement,
|
|
394
|
+
HTMLInputElement,
|
|
395
|
+
HTMLOptGroupElement,
|
|
396
|
+
HTMLOptionElement,
|
|
397
|
+
HTMLSelectElement,
|
|
398
|
+
HTMLTextAreaElement,
|
|
399
|
+
], 'disabled');
|
|
361
400
|
}
|
|
362
401
|
case 'ismap': {
|
|
363
|
-
|
|
364
|
-
el.isMap = datum === '' ? true : !!datum;
|
|
365
|
-
}
|
|
366
|
-
else {
|
|
367
|
-
el.setAttribute(name, `${datum}`);
|
|
368
|
-
}
|
|
369
|
-
return;
|
|
402
|
+
return setBooleanAttr(el, datum, [HTMLImageElement], 'isMap');
|
|
370
403
|
}
|
|
371
404
|
case 'loop': {
|
|
372
|
-
|
|
373
|
-
el.loop = datum === '' ? true : !!datum;
|
|
374
|
-
}
|
|
375
|
-
else {
|
|
376
|
-
el.setAttribute(name, `${datum}`);
|
|
377
|
-
}
|
|
378
|
-
return;
|
|
379
|
-
}
|
|
380
|
-
case 'low': {
|
|
381
|
-
if (el instanceof HTMLMeterElement) {
|
|
382
|
-
const low = toInt(datum);
|
|
383
|
-
if (Number.isNaN(low)) {
|
|
384
|
-
el.removeAttribute(name);
|
|
385
|
-
}
|
|
386
|
-
else {
|
|
387
|
-
el.low = low;
|
|
388
|
-
}
|
|
389
|
-
}
|
|
390
|
-
else {
|
|
391
|
-
el.setAttribute(name, `${datum}`);
|
|
392
|
-
}
|
|
393
|
-
return;
|
|
394
|
-
}
|
|
395
|
-
case 'max': {
|
|
396
|
-
if (el instanceof HTMLInputElement ||
|
|
397
|
-
el instanceof HTMLMeterElement ||
|
|
398
|
-
el instanceof HTMLProgressElement) {
|
|
399
|
-
const max = toInt(datum);
|
|
400
|
-
if (Number.isNaN(max)) {
|
|
401
|
-
el.removeAttribute(name);
|
|
402
|
-
}
|
|
403
|
-
else {
|
|
404
|
-
el.max = max;
|
|
405
|
-
}
|
|
406
|
-
}
|
|
407
|
-
else {
|
|
408
|
-
el.setAttribute(name, `${datum}`);
|
|
409
|
-
}
|
|
410
|
-
return;
|
|
411
|
-
}
|
|
412
|
-
case 'maxlength': {
|
|
413
|
-
if (el instanceof HTMLInputElement || el instanceof HTMLTextAreaElement) {
|
|
414
|
-
const maxLength = toInt(datum);
|
|
415
|
-
if (Number.isNaN(maxLength)) {
|
|
416
|
-
el.removeAttribute(name);
|
|
417
|
-
}
|
|
418
|
-
else {
|
|
419
|
-
el.maxLength = Math.floor(maxLength);
|
|
420
|
-
}
|
|
421
|
-
}
|
|
422
|
-
else {
|
|
423
|
-
el.setAttribute(name, `${datum}`);
|
|
424
|
-
}
|
|
425
|
-
return;
|
|
426
|
-
}
|
|
427
|
-
case 'min': {
|
|
428
|
-
if (el instanceof HTMLInputElement || el instanceof HTMLMeterElement) {
|
|
429
|
-
const min = toInt(datum);
|
|
430
|
-
if (Number.isNaN(min)) {
|
|
431
|
-
el.removeAttribute(name);
|
|
432
|
-
}
|
|
433
|
-
else {
|
|
434
|
-
el.min = min;
|
|
435
|
-
}
|
|
436
|
-
}
|
|
437
|
-
else {
|
|
438
|
-
el.setAttribute(name, `${datum}`);
|
|
439
|
-
}
|
|
440
|
-
return;
|
|
405
|
+
return setBooleanAttr(el, datum, [HTMLAudioElement, HTMLVideoElement], 'loop');
|
|
441
406
|
}
|
|
442
407
|
case 'multiple': {
|
|
443
|
-
|
|
444
|
-
el.multiple = datum === '' ? true : !!datum;
|
|
445
|
-
}
|
|
446
|
-
else {
|
|
447
|
-
el.setAttribute(name, `${datum}`);
|
|
448
|
-
}
|
|
449
|
-
return;
|
|
408
|
+
return setBooleanAttr(el, datum, [HTMLInputElement, HTMLSelectElement], 'multiple');
|
|
450
409
|
}
|
|
451
410
|
case 'novalidate': {
|
|
452
|
-
|
|
453
|
-
el.noValidate = datum === '' ? true : !!datum;
|
|
454
|
-
}
|
|
455
|
-
else {
|
|
456
|
-
el.setAttribute(name, `${datum}`);
|
|
457
|
-
}
|
|
458
|
-
return;
|
|
411
|
+
return setBooleanAttr(el, datum, [HTMLFormElement], 'noValidate');
|
|
459
412
|
}
|
|
460
413
|
case 'open': {
|
|
461
|
-
|
|
462
|
-
el.open = datum === '' ? true : !!datum;
|
|
463
|
-
}
|
|
464
|
-
else {
|
|
465
|
-
el.setAttribute(name, `${datum}`);
|
|
466
|
-
}
|
|
467
|
-
break;
|
|
468
|
-
}
|
|
469
|
-
case 'optimum': {
|
|
470
|
-
if (el instanceof HTMLMeterElement) {
|
|
471
|
-
const optimum = toInt(datum);
|
|
472
|
-
if (Number.isNaN(optimum)) {
|
|
473
|
-
el.removeAttribute(name);
|
|
474
|
-
}
|
|
475
|
-
else {
|
|
476
|
-
el.optimum = Math.floor(optimum);
|
|
477
|
-
}
|
|
478
|
-
}
|
|
479
|
-
else {
|
|
480
|
-
el.setAttribute(name, `${datum}`);
|
|
481
|
-
}
|
|
482
|
-
return;
|
|
483
|
-
}
|
|
484
|
-
case 'preload': {
|
|
485
|
-
if (el instanceof HTMLAudioElement || el instanceof HTMLVideoElement) {
|
|
486
|
-
switch (datum) {
|
|
487
|
-
case '':
|
|
488
|
-
case 'auto':
|
|
489
|
-
case 'metadata': {
|
|
490
|
-
el.preload = datum;
|
|
491
|
-
break;
|
|
492
|
-
}
|
|
493
|
-
default: {
|
|
494
|
-
el.preload = 'none';
|
|
495
|
-
}
|
|
496
|
-
}
|
|
497
|
-
}
|
|
498
|
-
else {
|
|
499
|
-
el.setAttribute(name, `${datum}`);
|
|
500
|
-
}
|
|
501
|
-
return;
|
|
414
|
+
return setBooleanAttr(el, datum, [HTMLDetailsElement], 'open');
|
|
502
415
|
}
|
|
503
416
|
case 'readonly': {
|
|
504
|
-
|
|
505
|
-
el.readOnly = datum === '' ? true : !!datum;
|
|
506
|
-
}
|
|
507
|
-
else {
|
|
508
|
-
el.setAttribute(name, `${datum}`);
|
|
509
|
-
}
|
|
510
|
-
return;
|
|
417
|
+
return setBooleanAttr(el, datum, [HTMLInputElement, HTMLTextAreaElement], 'readOnly');
|
|
511
418
|
}
|
|
512
419
|
case 'required': {
|
|
513
|
-
|
|
514
|
-
el instanceof HTMLSelectElement ||
|
|
515
|
-
el instanceof HTMLTextAreaElement) {
|
|
516
|
-
el.required = datum === '' ? true : !!datum;
|
|
517
|
-
}
|
|
518
|
-
else {
|
|
519
|
-
el.setAttribute(name, `${datum}`);
|
|
520
|
-
}
|
|
521
|
-
return;
|
|
420
|
+
return setBooleanAttr(el, datum, [HTMLInputElement, HTMLSelectElement, HTMLTextAreaElement], 'required');
|
|
522
421
|
}
|
|
523
422
|
case 'reversed': {
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
423
|
+
return setBooleanAttr(el, datum, [HTMLOListElement], 'reversed');
|
|
424
|
+
}
|
|
425
|
+
default: {
|
|
426
|
+
return false;
|
|
427
|
+
}
|
|
428
|
+
}
|
|
429
|
+
}
|
|
430
|
+
/**
|
|
431
|
+
* Handle integer HTML attributes via their DOM properties.
|
|
432
|
+
* @param el
|
|
433
|
+
* @param name
|
|
434
|
+
* @param datum
|
|
435
|
+
* @returns true if handled
|
|
436
|
+
*/
|
|
437
|
+
function setIntegerAttrByName(el, name, datum) {
|
|
438
|
+
switch (name) {
|
|
439
|
+
case 'cols': {
|
|
440
|
+
return setIntegerAttr(el, name, datum, [HTMLTextAreaElement], 'cols');
|
|
441
|
+
}
|
|
442
|
+
case 'colspan': {
|
|
443
|
+
return setIntegerAttr(el, name, datum, [HTMLTableCellElement], 'colSpan');
|
|
444
|
+
}
|
|
445
|
+
case 'high': {
|
|
446
|
+
return setIntegerAttr(el, name, datum, [HTMLMeterElement], 'high');
|
|
447
|
+
}
|
|
448
|
+
case 'low': {
|
|
449
|
+
return setIntegerAttr(el, name, datum, [HTMLMeterElement], 'low');
|
|
450
|
+
}
|
|
451
|
+
case 'max': {
|
|
452
|
+
return setIntegerAttr(el, name, datum, [HTMLInputElement, HTMLMeterElement, HTMLProgressElement], 'max');
|
|
453
|
+
}
|
|
454
|
+
case 'maxlength': {
|
|
455
|
+
return setIntegerAttr(el, name, datum, [HTMLInputElement, HTMLTextAreaElement], 'maxLength', true);
|
|
456
|
+
}
|
|
457
|
+
case 'min': {
|
|
458
|
+
return setIntegerAttr(el, name, datum, [HTMLInputElement, HTMLMeterElement], 'min');
|
|
459
|
+
}
|
|
460
|
+
case 'optimum': {
|
|
461
|
+
return setIntegerAttr(el, name, datum, [HTMLMeterElement], 'optimum', true);
|
|
531
462
|
}
|
|
532
463
|
case 'rows': {
|
|
533
|
-
|
|
534
|
-
const rows = toInt(datum);
|
|
535
|
-
if (Number.isNaN(rows)) {
|
|
536
|
-
el.removeAttribute(name);
|
|
537
|
-
}
|
|
538
|
-
else {
|
|
539
|
-
el.rows = Math.floor(rows);
|
|
540
|
-
}
|
|
541
|
-
}
|
|
542
|
-
else {
|
|
543
|
-
el.setAttribute(name, `${datum}`);
|
|
544
|
-
}
|
|
545
|
-
return;
|
|
464
|
+
return setIntegerAttr(el, name, datum, [HTMLTextAreaElement], 'rows', true);
|
|
546
465
|
}
|
|
547
466
|
case 'rowspan': {
|
|
548
|
-
|
|
549
|
-
const rowSpan = toInt(datum);
|
|
550
|
-
if (Number.isNaN(rowSpan)) {
|
|
551
|
-
el.removeAttribute(name);
|
|
552
|
-
}
|
|
553
|
-
else {
|
|
554
|
-
el.rowSpan = Math.floor(rowSpan);
|
|
555
|
-
}
|
|
556
|
-
}
|
|
557
|
-
else {
|
|
558
|
-
el.setAttribute(name, `${datum}`);
|
|
559
|
-
}
|
|
560
|
-
return;
|
|
467
|
+
return setIntegerAttr(el, name, datum, [HTMLTableCellElement], 'rowSpan', true);
|
|
561
468
|
}
|
|
562
469
|
case 'size': {
|
|
563
|
-
|
|
564
|
-
const size = toInt(datum);
|
|
565
|
-
if (Number.isNaN(size)) {
|
|
566
|
-
el.removeAttribute(name);
|
|
567
|
-
}
|
|
568
|
-
else {
|
|
569
|
-
el.size = size;
|
|
570
|
-
}
|
|
571
|
-
}
|
|
572
|
-
else {
|
|
573
|
-
el.setAttribute(name, `${datum}`);
|
|
574
|
-
}
|
|
575
|
-
return;
|
|
470
|
+
return setIntegerAttr(el, name, datum, [HTMLInputElement, HTMLSelectElement], 'size');
|
|
576
471
|
}
|
|
577
472
|
case 'span': {
|
|
578
|
-
|
|
579
|
-
const span = toInt(datum);
|
|
580
|
-
if (Number.isNaN(span)) {
|
|
581
|
-
el.removeAttribute(name);
|
|
582
|
-
}
|
|
583
|
-
else {
|
|
584
|
-
el.span = span;
|
|
585
|
-
}
|
|
586
|
-
}
|
|
587
|
-
else {
|
|
588
|
-
el.setAttribute(name, `${datum}`);
|
|
589
|
-
}
|
|
590
|
-
return;
|
|
473
|
+
return setIntegerAttr(el, name, datum, [HTMLTableColElement], 'span');
|
|
591
474
|
}
|
|
592
475
|
case 'start': {
|
|
593
|
-
|
|
594
|
-
const start = toInt(datum);
|
|
595
|
-
if (Number.isNaN(start)) {
|
|
596
|
-
el.removeAttribute(name);
|
|
597
|
-
}
|
|
598
|
-
else {
|
|
599
|
-
el.start = start;
|
|
600
|
-
}
|
|
601
|
-
}
|
|
602
|
-
else {
|
|
603
|
-
el.setAttribute(name, `${datum}`);
|
|
604
|
-
}
|
|
605
|
-
return;
|
|
476
|
+
return setIntegerAttr(el, name, datum, [HTMLOListElement], 'start');
|
|
606
477
|
}
|
|
607
|
-
case 'step': {
|
|
608
|
-
if (el instanceof HTMLInputElement) {
|
|
609
|
-
if (datum === 'any') {
|
|
610
|
-
el.step = datum;
|
|
611
|
-
break;
|
|
612
|
-
}
|
|
613
|
-
const step = toNum(datum);
|
|
614
|
-
if (Number.isNaN(step)) {
|
|
615
|
-
el.removeAttribute(name);
|
|
616
|
-
}
|
|
617
|
-
else {
|
|
618
|
-
el.step = step.toString(10);
|
|
619
|
-
}
|
|
620
|
-
}
|
|
621
|
-
else {
|
|
622
|
-
el.setAttribute(name, `${datum}`);
|
|
623
|
-
}
|
|
624
|
-
return;
|
|
625
|
-
}
|
|
626
|
-
case 'target': {
|
|
627
|
-
if (el instanceof HTMLAnchorElement ||
|
|
628
|
-
el instanceof HTMLAreaElement ||
|
|
629
|
-
el instanceof HTMLFormElement) {
|
|
630
|
-
if (datum) {
|
|
631
|
-
el.target = `${datum}`;
|
|
632
|
-
}
|
|
633
|
-
else {
|
|
634
|
-
el.removeAttribute(name);
|
|
635
|
-
}
|
|
636
|
-
}
|
|
637
|
-
else {
|
|
638
|
-
el.setAttribute(name, `${datum}`);
|
|
639
|
-
}
|
|
640
|
-
return;
|
|
641
|
-
}
|
|
642
|
-
// case 'accesskey':
|
|
643
|
-
// case 'class':
|
|
644
|
-
// case 'contextmenu':
|
|
645
|
-
// case 'dropzone': // breakable support
|
|
646
|
-
// case 'id':
|
|
647
|
-
// case 'itemid':
|
|
648
|
-
// case 'itemprop':
|
|
649
|
-
// case 'itemref':
|
|
650
|
-
// case 'itemscope':
|
|
651
|
-
// case 'itemtype':
|
|
652
|
-
// case 'lang':
|
|
653
|
-
// case 'slot': // breakable support
|
|
654
|
-
// case 'style':
|
|
655
|
-
// case 'title':
|
|
656
|
-
// case 'translate': // breakable support
|
|
657
|
-
// case 'accept':
|
|
658
|
-
// case 'accept-charset':
|
|
659
|
-
// case 'action':
|
|
660
|
-
// case 'align':
|
|
661
|
-
// case 'alt':
|
|
662
|
-
// case 'cite':
|
|
663
|
-
// case 'coords':
|
|
664
|
-
// case 'datetime':
|
|
665
|
-
// case 'enctype':
|
|
666
|
-
// case 'for':
|
|
667
|
-
// case 'headers':
|
|
668
|
-
// case 'href':
|
|
669
|
-
// case 'hreflang':
|
|
670
|
-
// case 'kind':
|
|
671
|
-
// case 'label':
|
|
672
|
-
// case 'list':
|
|
673
|
-
// case 'media':
|
|
674
|
-
// case 'method':
|
|
675
|
-
// case 'name':
|
|
676
|
-
// case 'pattern':
|
|
677
|
-
// case 'placeholder':
|
|
678
|
-
// case 'poster':
|
|
679
|
-
// case 'pubdate':
|
|
680
|
-
// case 'rel':
|
|
681
|
-
// case 'sandbox':
|
|
682
|
-
// case 'src':
|
|
683
|
-
// case 'srcdoc':
|
|
684
|
-
// case 'srclang':
|
|
685
|
-
// case 'summary':
|
|
686
|
-
// case 'type':
|
|
687
|
-
// case 'usemap':
|
|
688
|
-
// case 'value':
|
|
689
|
-
// case 'wrap':
|
|
690
|
-
// and Data-* attributes
|
|
691
478
|
default: {
|
|
692
|
-
|
|
479
|
+
return false;
|
|
693
480
|
}
|
|
694
481
|
}
|
|
695
482
|
}
|
|
696
483
|
/**
|
|
697
|
-
*
|
|
698
|
-
*
|
|
699
|
-
* @param
|
|
700
|
-
* @param
|
|
701
|
-
* @param
|
|
484
|
+
* Set content value on a form element or general element.
|
|
485
|
+
* Handles checkbox/radio checked state, input values, and innerHTML/textContent.
|
|
486
|
+
* @param el - The target element
|
|
487
|
+
* @param datum - The value to set
|
|
488
|
+
* @param asHtml - Whether to set as innerHTML (true) or textContent (false)
|
|
489
|
+
* @param xssSanitize - Whether to sanitize HTML content for XSS protection
|
|
702
490
|
*/
|
|
703
491
|
export function setContent(el, datum, asHtml = true, xssSanitize = true) {
|
|
704
492
|
if (el instanceof HTMLInputElement ||
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@burger-editor/frozen-patty",
|
|
3
|
-
"version": "4.0.0-alpha.
|
|
3
|
+
"version": "4.0.0-alpha.64",
|
|
4
4
|
"description": "Pure HTML to JSON converter that does not use a template engine.",
|
|
5
5
|
"author": "D-ZERO",
|
|
6
6
|
"license": "(MIT OR Apache-2.0)",
|
|
@@ -41,7 +41,7 @@
|
|
|
41
41
|
"clean": "tsc --build --clean"
|
|
42
42
|
},
|
|
43
43
|
"dependencies": {
|
|
44
|
-
"@burger-editor/utils": "4.0.0-alpha.
|
|
44
|
+
"@burger-editor/utils": "4.0.0-alpha.64"
|
|
45
45
|
},
|
|
46
|
-
"gitHead": "
|
|
46
|
+
"gitHead": "592b92577d2f1f9164e991bf2d16fdbd20f9e316"
|
|
47
47
|
}
|