@morlay/dsh-client-ui-primitives 0.0.2-alpha.6 → 0.0.2-alpha.8
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 +30 -4
- package/dist/client.cjs +1069 -399
- package/dist/client.d.cts +366 -9
- package/dist/client.d.mts +366 -9
- package/locale/en.json +6 -0
- package/locale/zh.json +6 -0
- package/package.json +9 -6
- package/src/client/index.ts +1 -0
- package/src/client/settings-form/SettingsForm.styles.ts +57 -0
- package/src/client/settings-form/SettingsForm.tsx +72 -0
- package/src/client/settings-form/fields.styles.ts +157 -0
- package/src/client/settings-form/fields.tsx +193 -0
- package/src/client/settings-form/form-model.ts +421 -0
- package/src/client/settings-form/index.ts +19 -0
- package/src/client/theme.generated.ts +748 -715
package/dist/client.cjs
CHANGED
|
@@ -17,8 +17,9 @@ window.__ModuleLoader__.load({
|
|
|
17
17
|
};
|
|
18
18
|
//#endregion
|
|
19
19
|
let react = require("react");
|
|
20
|
-
let
|
|
20
|
+
let _deepseek_ai_dsh_client_store = require("@deepseek-ai/dsh-client-store");
|
|
21
21
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
22
|
+
let _deepseek_ai_dsh_client_ui_primitives = require("@deepseek-ai/dsh-client-ui-primitives");
|
|
22
23
|
//#region src/client/styling/toolkit.ts
|
|
23
24
|
function isUndefined(value) {
|
|
24
25
|
return value === void 0;
|
|
@@ -323,526 +324,542 @@ window.__ModuleLoader__.load({
|
|
|
323
324
|
//#endregion
|
|
324
325
|
//#region src/client/theme.generated.ts
|
|
325
326
|
/**
|
|
326
|
-
* 官方主题的 `--dsw-*` token 全集（
|
|
327
|
+
* 官方主题的 `--dsw-*` token 全集（373 个），由 packages/client/ui-primitives/scripts/gen-design-tokens.mts 生成，勿手改。
|
|
327
328
|
*
|
|
328
329
|
* 叶子是该变量的**默认值**（官方 light 主题里首次出现的定义）：既是类型推导的来源，也可作 fallback。
|
|
329
330
|
* `"$"` 键出现在「自身也是 token 的分支」上（命名体系里有 40 个短名同时是长名前缀的 token）。
|
|
330
331
|
* 消费时只需树形状——`Token.vars()` 生成 `var(--dsw-…)`，不重新定义变量。
|
|
331
332
|
* 漂移、往返与默认值完整性由 src/__tests__/design-tokens.spec.ts 守卫。 */
|
|
332
333
|
const designTokens = {
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
334
|
+
alias: {
|
|
335
|
+
bg: {
|
|
336
|
+
base: "var(--dsw-static-neutral-bluish-00)",
|
|
337
|
+
document: { preview: "var(--dsw-static-neutral-bluish-750)" },
|
|
338
|
+
layer: {
|
|
338
339
|
"1": "var(--dsw-static-neutral-bluish-00)",
|
|
339
340
|
"2": "var(--dsw-static-neutral-bluish-00)",
|
|
340
341
|
"3": "var(--dsw-static-neutral-bluish-00)"
|
|
341
342
|
},
|
|
342
|
-
|
|
343
|
+
mask: {
|
|
343
344
|
"1": "rgba(0, 0, 0, 0.24)",
|
|
344
345
|
"2": "rgba(0, 0, 0, 0.12)",
|
|
345
346
|
"3": "rgba(0, 0, 0, 0.48)",
|
|
346
|
-
|
|
347
|
-
|
|
347
|
+
drop: "rgba(255, 255, 255, 0.7)",
|
|
348
|
+
photo: "rgba(0, 0, 0, 0.88)"
|
|
348
349
|
},
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
350
|
+
module: { platform: "var(--dsw-static-neutral-bluish-60)" },
|
|
351
|
+
multi: { select: "var(--dsw-static-neutral-bluish-60)" },
|
|
352
|
+
overlay: "var(--dsw-static-neutral-bluish-150)",
|
|
353
|
+
skeleton: "rgba(0, 0, 0, 0.04)"
|
|
353
354
|
},
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
355
|
+
border: {
|
|
356
|
+
inverted: "rgba(0, 0, 0, 0)",
|
|
357
|
+
inverted2: "rgba(0, 0, 0, 0)",
|
|
358
|
+
l1: "rgba(0, 0, 0, 0.04)",
|
|
359
|
+
l2: {
|
|
360
|
+
$: "rgba(0, 0, 0, 0.1)",
|
|
361
|
+
darkmode: { thin: "rgba(0, 0, 0, 0.1)" }
|
|
361
362
|
},
|
|
362
|
-
|
|
363
|
-
|
|
363
|
+
l3: "rgba(0, 0, 0, 0.12)",
|
|
364
|
+
l4: "rgba(0, 0, 0, 0.16)"
|
|
364
365
|
},
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
366
|
+
brand: {
|
|
367
|
+
primary: {
|
|
368
|
+
$: "var(--dsw-static-neutral-bluish-1000)",
|
|
369
|
+
invert: "var(--dsw-static-neutral-bluish-1000)",
|
|
370
|
+
new: { colorprimary: { new: { color: "rgb(65, 118, 230)" } } }
|
|
370
371
|
},
|
|
371
|
-
|
|
372
|
+
text: "var(--dsw-static-neutral-bluish-1000)"
|
|
372
373
|
},
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
374
|
+
button: {
|
|
375
|
+
contrast: { fill: "var(--dsw-static-neutral-bluish-700)" },
|
|
376
|
+
elevated: { fill: "var(--dsw-static-neutral-bluish-00)" },
|
|
377
|
+
floating: {
|
|
378
|
+
fill: "var(--dsw-static-neutral-bluish-00)",
|
|
379
|
+
hover: "var(--dsw-static-neutral-bluish-75)"
|
|
379
380
|
},
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
381
|
+
ghost: { active: {
|
|
382
|
+
border: "var(--dsw-static-neutral-bluish-500)",
|
|
383
|
+
fill: "var(--dsw-static-neutral-bluish-100)",
|
|
384
|
+
hover: "var(--dsw-static-neutral-bluish-150)"
|
|
384
385
|
} },
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
386
|
+
info: {
|
|
387
|
+
fill: "var(--dsw-static-deepseek-500)",
|
|
388
|
+
hover: "var(--dsw-static-deepseek-400)"
|
|
388
389
|
},
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
390
|
+
primary: {
|
|
391
|
+
dimmed: "var(--dsw-static-neutral-bluish-100)",
|
|
392
|
+
fill: "var(--dsw-alias-brand-primary)",
|
|
393
|
+
hover: "var(--dsw-static-neutral-bluish-750)"
|
|
393
394
|
},
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
395
|
+
tool: { bar: {
|
|
396
|
+
fill: {
|
|
397
|
+
$: "rgba(84, 85, 87, 0.5)",
|
|
398
|
+
invisible: "rgba(31, 31, 31, 0.36)"
|
|
398
399
|
},
|
|
399
|
-
|
|
400
|
+
hover: "rgba(84, 85, 87, 0.6)"
|
|
400
401
|
} }
|
|
401
402
|
},
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
"
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
403
|
+
code: { diff: {
|
|
404
|
+
added: "var(--dsw-static-green-500-a08)",
|
|
405
|
+
deleted: "var(--dsw-static-red-600-a08)"
|
|
406
|
+
} },
|
|
407
|
+
file: { diff: {
|
|
408
|
+
added: {
|
|
409
|
+
bg: "rgb(230, 244, 231)",
|
|
410
|
+
gutter: "rgb(237, 247, 237)",
|
|
411
|
+
marker: "rgb(1, 162, 65)"
|
|
412
|
+
},
|
|
413
|
+
deleted: {
|
|
414
|
+
bg: "rgb(252, 230, 226)",
|
|
415
|
+
gutter: "rgb(253, 236, 233)",
|
|
416
|
+
marker: "rgb(186, 39, 35)"
|
|
409
417
|
}
|
|
410
418
|
} },
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
419
|
+
interactive: { bg: {
|
|
420
|
+
active: "rgba(38, 49, 72, 0.1)",
|
|
421
|
+
hover: {
|
|
422
|
+
$: "rgba(38, 49, 72, 0.06)",
|
|
423
|
+
accent: "rgba(38, 49, 72, 0.14)",
|
|
424
|
+
danger: "rgba(236, 19, 19, 0.05)",
|
|
425
|
+
solid: "var(--dsw-static-neutral-bluish-75)"
|
|
426
|
+
}
|
|
427
|
+
} },
|
|
428
|
+
label: {
|
|
429
|
+
caption: "var(--dsw-static-neutral-bluish-400)",
|
|
430
|
+
dimmed: "var(--dsw-static-neutral-bluish-200)",
|
|
431
|
+
document: { preview: "var(--dsw-static-neutral-bluish-200)" },
|
|
432
|
+
primary: {
|
|
433
|
+
$: "var(--dsw-static-neutral-bluish-1000)",
|
|
434
|
+
bluish: "var(--dsw-static-blue-900)",
|
|
435
|
+
dimmed: "var(--dsw-static-neutral-bluish-950)",
|
|
436
|
+
foreground: "var(--dsw-static-neutral-bluish-00)",
|
|
437
|
+
inverted: "var(--dsw-static-neutral-bluish-00)"
|
|
421
438
|
},
|
|
422
|
-
|
|
423
|
-
|
|
439
|
+
secondary: "var(--dsw-static-neutral-bluish-700)",
|
|
440
|
+
tertiary: "var(--dsw-static-neutral-bluish-600)"
|
|
424
441
|
},
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
442
|
+
link: "var(--dsw-static-deepseek-500)",
|
|
443
|
+
markdown: {
|
|
444
|
+
citation: "var(--dsw-static-neutral-bluish-100)",
|
|
445
|
+
code: {
|
|
446
|
+
block: {
|
|
447
|
+
$: "var(--dsw-static-neutral-bluish-50)",
|
|
448
|
+
banner: "var(--dsw-static-neutral-bluish-50)"
|
|
432
449
|
},
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
450
|
+
segment: {
|
|
451
|
+
selected: "var(--dsw-static-neutral-bluish-00)",
|
|
452
|
+
unselected: "var(--dsw-static-neutral-bluish-75)"
|
|
436
453
|
}
|
|
437
454
|
},
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
455
|
+
inline: { code: "var(--dsw-static-neutral-50)" },
|
|
456
|
+
placeholder: "var(--dsw-static-neutral-bluish-60)",
|
|
457
|
+
tag: "var(--dsw-static-neutral-bluish-75)"
|
|
441
458
|
},
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
459
|
+
scrollbar: {
|
|
460
|
+
bg: {
|
|
461
|
+
l1: "var(--dsw-static-neutral-200)",
|
|
462
|
+
l2: "var(--dsw-static-neutral-200)"
|
|
446
463
|
},
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
464
|
+
hover: {
|
|
465
|
+
l1: "var(--dsw-static-neutral-300)",
|
|
466
|
+
l2: "var(--dsw-static-neutral-300)"
|
|
450
467
|
}
|
|
451
468
|
},
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
469
|
+
state: {
|
|
470
|
+
business: {
|
|
471
|
+
primary: "var(--dsw-static-deepseek-500)",
|
|
472
|
+
tertiary: "var(--dsw-static-deepseek-100)"
|
|
456
473
|
},
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
474
|
+
error: {
|
|
475
|
+
primary: "var(--dsw-static-red-600)",
|
|
476
|
+
secondary: "var(--dsw-static-red-400)"
|
|
460
477
|
},
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
478
|
+
idle: { primary: "var(--dsw-static-neutral-300)" },
|
|
479
|
+
success: {
|
|
480
|
+
primary: "var(--dsw-static-green-500)",
|
|
481
|
+
secondary: "var(--dsw-static-green-400)",
|
|
482
|
+
tertiary: "var(--dsw-static-green-100)"
|
|
466
483
|
},
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
484
|
+
warn: {
|
|
485
|
+
label: "var(--dsw-static-amber-600)",
|
|
486
|
+
primary: "var(--dsw-static-amber-500)",
|
|
487
|
+
secondary: "var(--dsw-static-amber-400)",
|
|
488
|
+
tertiary: "var(--dsw-static-amber-100)"
|
|
472
489
|
}
|
|
473
490
|
},
|
|
474
|
-
|
|
475
|
-
|
|
491
|
+
toast: { bg: "var(--dsw-static-neutral-bluish-800)" },
|
|
492
|
+
tooltip: { bg: "var(--dsw-static-neutral-bluish-850)" }
|
|
476
493
|
},
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
494
|
+
corner: { shape: "superellipse(1.5)" },
|
|
495
|
+
elevation: {
|
|
496
|
+
panel: "var(--dsw-elevation-stroke), 0 3px 8px 0 rgba(0, 0, 0, 0.03), 0 0 16px 0 rgba(0, 0, 0, 0.02)",
|
|
497
|
+
prominent: "var(--dsw-elevation-stroke), 0 3px 8px 0 rgba(0, 0, 0, 0.04), 0 0 20px 0 rgba(0, 0, 0, 0.05)",
|
|
498
|
+
soft: "var(--dsw-elevation-stroke), 0 4px 16px 0 rgba(0, 0, 0, 0.03), 0 0 24px 0 rgba(0, 0, 0, 0.03)",
|
|
499
|
+
stroke: {
|
|
500
|
+
$: "0 0 0 0.5px var(--dsw-elevation-stroke-color)",
|
|
501
|
+
color: "var(--dsw-alias-border-l4)"
|
|
485
502
|
}
|
|
486
503
|
},
|
|
487
|
-
|
|
488
|
-
|
|
504
|
+
font: {
|
|
505
|
+
base: {
|
|
489
506
|
"16": {
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
|
|
507
|
+
$: "16px/24px var(--dsw-font-family)",
|
|
508
|
+
font: {
|
|
509
|
+
family: "var(--dsw-font-family)",
|
|
510
|
+
size: "16px",
|
|
511
|
+
style: "normal",
|
|
512
|
+
weight: "400"
|
|
496
513
|
},
|
|
497
|
-
|
|
514
|
+
line: { height: "24px" }
|
|
498
515
|
},
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
516
|
+
strong: { "16": {
|
|
517
|
+
$: "500 16px/24px var(--dsw-font-family)",
|
|
518
|
+
font: {
|
|
519
|
+
family: "var(--dsw-font-family)",
|
|
520
|
+
size: "16px",
|
|
521
|
+
style: "normal",
|
|
522
|
+
weight: "500"
|
|
506
523
|
},
|
|
507
|
-
|
|
524
|
+
line: { height: "24px" }
|
|
508
525
|
} }
|
|
509
526
|
},
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
|
|
527
|
+
family: "-apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC',\n 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif",
|
|
528
|
+
l: { "20": {
|
|
529
|
+
$: "500 20px/28px var(--dsw-font-family)",
|
|
530
|
+
font: {
|
|
531
|
+
family: "var(--dsw-font-family)",
|
|
532
|
+
size: "20px",
|
|
533
|
+
style: "normal",
|
|
534
|
+
weight: "500"
|
|
518
535
|
},
|
|
519
|
-
|
|
536
|
+
line: { height: "28px" }
|
|
520
537
|
} },
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
538
|
+
m: { "18": {
|
|
539
|
+
$: "500 16px/28px var(--dsw-font-family)",
|
|
540
|
+
font: {
|
|
541
|
+
family: "var(--dsw-font-family)",
|
|
542
|
+
size: "16px",
|
|
543
|
+
style: "normal",
|
|
544
|
+
weight: "500"
|
|
528
545
|
},
|
|
529
|
-
|
|
546
|
+
line: { height: "28px" }
|
|
530
547
|
} },
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
548
|
+
markdown: {
|
|
549
|
+
base: {
|
|
550
|
+
$: "var(--dsh-content-font-size, 14px) / calc(24px + var(--dsh-content-font-delta)) var(--dsw-font-family)",
|
|
551
|
+
font: {
|
|
552
|
+
family: "var(--dsw-font-family)",
|
|
553
|
+
size: "var(--dsh-content-font-size, 14px)",
|
|
554
|
+
style: "normal",
|
|
555
|
+
weight: "400"
|
|
539
556
|
},
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
557
|
+
italic: {
|
|
558
|
+
$: "italic var(--dsh-content-font-size, 14px) / calc(24px + var(--dsh-content-font-delta)) var(--dsw-font-family)",
|
|
559
|
+
font: {
|
|
560
|
+
family: "var(--dsw-font-family)",
|
|
561
|
+
size: "var(--dsh-content-font-size, 14px)",
|
|
562
|
+
style: "italic",
|
|
563
|
+
weight: "400"
|
|
547
564
|
},
|
|
548
|
-
|
|
565
|
+
line: { height: "calc(24px + var(--dsh-content-font-delta))" }
|
|
549
566
|
},
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
|
|
567
|
+
line: { height: "calc(24px + var(--dsh-content-font-delta))" },
|
|
568
|
+
strong: {
|
|
569
|
+
$: "600 var(--dsh-content-font-size, 14px) / calc(24px + var(--dsh-content-font-delta)) var(--dsw-font-family)",
|
|
570
|
+
font: {
|
|
571
|
+
family: "var(--dsw-font-family)",
|
|
572
|
+
size: "var(--dsh-content-font-size, 14px)",
|
|
573
|
+
style: "normal",
|
|
574
|
+
weight: "600"
|
|
558
575
|
},
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
576
|
+
italic: {
|
|
577
|
+
$: "italic 600 var(--dsh-content-font-size, 14px) / calc(24px + var(--dsh-content-font-delta)) var(--dsw-font-family)",
|
|
578
|
+
font: {
|
|
579
|
+
family: "var(--dsw-font-family)",
|
|
580
|
+
size: "var(--dsh-content-font-size, 14px)",
|
|
581
|
+
style: "italic",
|
|
582
|
+
weight: "600"
|
|
566
583
|
},
|
|
567
|
-
|
|
584
|
+
line: { height: "calc(24px + var(--dsh-content-font-delta))" }
|
|
568
585
|
},
|
|
569
|
-
|
|
586
|
+
line: { height: "calc(24px + var(--dsh-content-font-delta))" }
|
|
570
587
|
}
|
|
571
588
|
},
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
589
|
+
code: {
|
|
590
|
+
$: "12px/19px var(--ds-font-family-code)",
|
|
591
|
+
block: {
|
|
592
|
+
$: "11px/19px var(--ds-font-family-code)",
|
|
593
|
+
font: {
|
|
594
|
+
family: "var(--ds-font-family-code)",
|
|
595
|
+
size: "11px",
|
|
596
|
+
style: "normal",
|
|
597
|
+
weight: "400"
|
|
581
598
|
},
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
599
|
+
line: { height: "19px" },
|
|
600
|
+
small: {
|
|
601
|
+
$: "11px/16px var(--ds-font-family-code)",
|
|
602
|
+
font: {
|
|
603
|
+
family: "var(--ds-font-family-code)",
|
|
604
|
+
size: "11px",
|
|
605
|
+
style: "normal",
|
|
606
|
+
weight: "400"
|
|
590
607
|
},
|
|
591
|
-
|
|
608
|
+
line: { height: "16px" }
|
|
592
609
|
}
|
|
593
610
|
},
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
611
|
+
font: {
|
|
612
|
+
family: "var(--ds-font-family-code)",
|
|
613
|
+
size: "12px",
|
|
614
|
+
style: "normal",
|
|
615
|
+
weight: "400"
|
|
599
616
|
},
|
|
600
|
-
|
|
617
|
+
line: { height: "19px" }
|
|
601
618
|
},
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
619
|
+
h1: {
|
|
620
|
+
$: "700 calc(21px + var(--dsh-content-font-delta)) / calc(30px + var(--dsh-content-font-delta)) var(--dsw-font-family)",
|
|
621
|
+
font: {
|
|
622
|
+
family: "var(--dsw-font-family)",
|
|
623
|
+
size: "calc(21px + var(--dsh-content-font-delta))",
|
|
624
|
+
style: "normal",
|
|
625
|
+
weight: "700"
|
|
609
626
|
},
|
|
610
|
-
|
|
627
|
+
line: { height: "calc(30px + var(--dsh-content-font-delta))" }
|
|
611
628
|
},
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
629
|
+
h2: {
|
|
630
|
+
$: "700 calc(19px + var(--dsh-content-font-delta)) / calc(28px + var(--dsh-content-font-delta)) var(--dsw-font-family)",
|
|
631
|
+
font: {
|
|
632
|
+
family: "var(--dsw-font-family)",
|
|
633
|
+
size: "calc(19px + var(--dsh-content-font-delta))",
|
|
634
|
+
style: "normal",
|
|
635
|
+
weight: "700"
|
|
619
636
|
},
|
|
620
|
-
|
|
637
|
+
line: { height: "calc(28px + var(--dsh-content-font-delta))" }
|
|
621
638
|
},
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
639
|
+
h3: {
|
|
640
|
+
$: "700 calc(18px + var(--dsh-content-font-delta)) / calc(26px + var(--dsh-content-font-delta)) var(--dsw-font-family)",
|
|
641
|
+
font: {
|
|
642
|
+
family: "var(--dsw-font-family)",
|
|
643
|
+
size: "calc(18px + var(--dsh-content-font-delta))",
|
|
644
|
+
style: "normal",
|
|
645
|
+
weight: "700"
|
|
629
646
|
},
|
|
630
|
-
|
|
647
|
+
line: { height: "calc(26px + var(--dsh-content-font-delta))" }
|
|
631
648
|
},
|
|
632
|
-
|
|
633
|
-
|
|
634
|
-
|
|
635
|
-
|
|
636
|
-
|
|
637
|
-
|
|
638
|
-
|
|
649
|
+
h4: {
|
|
650
|
+
$: "600 var(--dsh-content-font-size, 14px) / calc(24px + var(--dsh-content-font-delta)) var(--dsw-font-family)",
|
|
651
|
+
font: {
|
|
652
|
+
family: "var(--dsw-font-family)",
|
|
653
|
+
size: "var(--dsh-content-font-size, 14px)",
|
|
654
|
+
style: "normal",
|
|
655
|
+
weight: "600"
|
|
639
656
|
},
|
|
640
|
-
|
|
657
|
+
line: { height: "calc(24px + var(--dsh-content-font-delta))" }
|
|
641
658
|
},
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
|
|
659
|
+
small: {
|
|
660
|
+
$: "12px/20px var(--dsw-font-family)",
|
|
661
|
+
font: {
|
|
662
|
+
family: "var(--dsw-font-family)",
|
|
663
|
+
size: "12px",
|
|
664
|
+
style: "normal",
|
|
665
|
+
weight: "400"
|
|
649
666
|
},
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
667
|
+
italic: {
|
|
668
|
+
$: "italic 12px/20px var(--dsw-font-family)",
|
|
669
|
+
font: {
|
|
670
|
+
family: "var(--dsw-font-family)",
|
|
671
|
+
size: "12px",
|
|
672
|
+
style: "italic",
|
|
673
|
+
weight: "400"
|
|
657
674
|
},
|
|
658
|
-
|
|
675
|
+
line: { height: "20px" }
|
|
659
676
|
},
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
667
|
-
|
|
677
|
+
line: { height: "20px" },
|
|
678
|
+
strong: {
|
|
679
|
+
$: "600 12px/20px var(--dsw-font-family)",
|
|
680
|
+
font: {
|
|
681
|
+
family: "var(--dsw-font-family)",
|
|
682
|
+
size: "12px",
|
|
683
|
+
style: "normal",
|
|
684
|
+
weight: "600"
|
|
668
685
|
},
|
|
669
|
-
|
|
670
|
-
|
|
671
|
-
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
|
|
686
|
+
italic: {
|
|
687
|
+
$: "italic 600 12px/20px var(--dsw-font-family)",
|
|
688
|
+
font: {
|
|
689
|
+
family: "var(--dsw-font-family)",
|
|
690
|
+
size: "12px",
|
|
691
|
+
style: "italic",
|
|
692
|
+
weight: "600"
|
|
676
693
|
},
|
|
677
|
-
|
|
694
|
+
line: { height: "20px" }
|
|
678
695
|
},
|
|
679
|
-
|
|
696
|
+
line: { height: "20px" }
|
|
680
697
|
}
|
|
681
698
|
},
|
|
682
|
-
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
|
|
688
|
-
|
|
699
|
+
table: {
|
|
700
|
+
$: "var(--dsh-content-font-size-secondary, 13px)/calc(22px + var(--dsh-content-font-delta-secondary, 0px)) var(--dsw-font-family)",
|
|
701
|
+
font: {
|
|
702
|
+
family: "var(--dsw-font-family)",
|
|
703
|
+
size: "var(--dsh-content-font-size-secondary, 13px)",
|
|
704
|
+
style: "normal",
|
|
705
|
+
weight: "400"
|
|
689
706
|
},
|
|
690
|
-
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
|
|
707
|
+
head: {
|
|
708
|
+
$: "500 var(--dsh-content-font-size-secondary, 13px)/calc(22px + var(--dsh-content-font-delta-secondary, 0px)) var(--dsw-font-family)",
|
|
709
|
+
font: {
|
|
710
|
+
family: "var(--dsw-font-family)",
|
|
711
|
+
size: "var(--dsh-content-font-size-secondary, 13px)",
|
|
712
|
+
style: "normal",
|
|
713
|
+
weight: "500"
|
|
697
714
|
},
|
|
698
|
-
|
|
715
|
+
line: { height: "calc(22px + var(--dsh-content-font-delta-secondary, 0px))" }
|
|
699
716
|
},
|
|
700
|
-
|
|
717
|
+
line: { height: "calc(22px + var(--dsh-content-font-delta-secondary, 0px))" }
|
|
701
718
|
}
|
|
702
719
|
},
|
|
703
|
-
|
|
720
|
+
s: {
|
|
704
721
|
"14": {
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
722
|
+
$: "14px/22px var(--dsw-font-family)",
|
|
723
|
+
font: {
|
|
724
|
+
family: "var(--dsw-font-family)",
|
|
725
|
+
size: "14px",
|
|
726
|
+
style: "normal",
|
|
727
|
+
weight: "400"
|
|
711
728
|
},
|
|
712
|
-
|
|
729
|
+
line: { height: "22px" }
|
|
713
730
|
},
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
731
|
+
strong: { "14": {
|
|
732
|
+
$: "500 14px/22px var(--dsw-font-family)",
|
|
733
|
+
font: {
|
|
734
|
+
family: "var(--dsw-font-family)",
|
|
735
|
+
size: "14px",
|
|
736
|
+
style: "normal",
|
|
737
|
+
weight: "500"
|
|
721
738
|
},
|
|
722
|
-
|
|
739
|
+
line: { height: "22px" }
|
|
723
740
|
} }
|
|
724
741
|
},
|
|
725
|
-
|
|
726
|
-
|
|
727
|
-
|
|
728
|
-
|
|
729
|
-
|
|
730
|
-
|
|
731
|
-
|
|
742
|
+
xl: { "24": {
|
|
743
|
+
$: "600 24px/32px var(--dsw-font-family)",
|
|
744
|
+
font: {
|
|
745
|
+
family: "var(--dsw-font-family)",
|
|
746
|
+
size: "24px",
|
|
747
|
+
style: "normal",
|
|
748
|
+
weight: "600"
|
|
732
749
|
},
|
|
733
|
-
|
|
750
|
+
line: { height: "32px" }
|
|
734
751
|
} },
|
|
735
|
-
|
|
752
|
+
xs: {
|
|
736
753
|
"13": {
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
742
|
-
|
|
754
|
+
$: "13px/20px var(--dsw-font-family)",
|
|
755
|
+
font: {
|
|
756
|
+
family: "var(--dsw-font-family)",
|
|
757
|
+
size: "13px",
|
|
758
|
+
style: "normal",
|
|
759
|
+
weight: "400"
|
|
743
760
|
},
|
|
744
|
-
|
|
761
|
+
line: { height: "20px" }
|
|
745
762
|
},
|
|
746
|
-
|
|
747
|
-
|
|
748
|
-
|
|
749
|
-
|
|
750
|
-
|
|
751
|
-
|
|
752
|
-
|
|
763
|
+
strong: { "13": {
|
|
764
|
+
$: "500 13px/20px var(--dsw-font-family)",
|
|
765
|
+
font: {
|
|
766
|
+
family: "var(--dsw-font-family)",
|
|
767
|
+
size: "13px",
|
|
768
|
+
style: "normal",
|
|
769
|
+
weight: "500"
|
|
753
770
|
},
|
|
754
|
-
|
|
771
|
+
line: { height: "20px" }
|
|
755
772
|
} }
|
|
756
773
|
},
|
|
757
|
-
|
|
774
|
+
xxs: {
|
|
758
775
|
"12": {
|
|
759
|
-
|
|
760
|
-
|
|
761
|
-
|
|
762
|
-
|
|
763
|
-
|
|
764
|
-
|
|
776
|
+
$: "12px/18px var(--dsw-font-family)",
|
|
777
|
+
font: {
|
|
778
|
+
family: "var(--dsw-font-family)",
|
|
779
|
+
size: "12px",
|
|
780
|
+
style: "normal",
|
|
781
|
+
weight: "400"
|
|
765
782
|
},
|
|
766
|
-
|
|
783
|
+
line: { height: "18px" }
|
|
767
784
|
},
|
|
768
|
-
|
|
769
|
-
|
|
770
|
-
|
|
771
|
-
|
|
772
|
-
|
|
773
|
-
|
|
774
|
-
|
|
785
|
+
strong: { "12": {
|
|
786
|
+
$: "500 12px/18px var(--dsw-font-family)",
|
|
787
|
+
font: {
|
|
788
|
+
family: "var(--dsw-font-family)",
|
|
789
|
+
size: "12px",
|
|
790
|
+
style: "normal",
|
|
791
|
+
weight: "500"
|
|
775
792
|
},
|
|
776
|
-
|
|
793
|
+
line: { height: "18px" }
|
|
777
794
|
} }
|
|
778
795
|
},
|
|
779
|
-
|
|
796
|
+
xxxs: {
|
|
780
797
|
"11": {
|
|
781
|
-
|
|
782
|
-
|
|
783
|
-
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
|
|
798
|
+
$: "11px/14px var(--dsw-font-family)",
|
|
799
|
+
font: {
|
|
800
|
+
family: "var(--dsw-font-family)",
|
|
801
|
+
size: "11px",
|
|
802
|
+
style: "normal",
|
|
803
|
+
weight: "400"
|
|
787
804
|
},
|
|
788
|
-
|
|
805
|
+
line: { height: "14px" }
|
|
789
806
|
},
|
|
790
|
-
|
|
791
|
-
|
|
792
|
-
|
|
793
|
-
|
|
794
|
-
|
|
795
|
-
|
|
796
|
-
|
|
807
|
+
strong: { "11": {
|
|
808
|
+
$: "500 11px/14px var(--dsw-font-family)",
|
|
809
|
+
font: {
|
|
810
|
+
family: "var(--dsw-font-family)",
|
|
811
|
+
size: "11px",
|
|
812
|
+
style: "normal",
|
|
813
|
+
weight: "500"
|
|
797
814
|
},
|
|
798
|
-
|
|
815
|
+
line: { height: "14px" }
|
|
799
816
|
} }
|
|
800
817
|
}
|
|
801
818
|
},
|
|
802
|
-
|
|
803
|
-
|
|
804
|
-
|
|
819
|
+
linear: {
|
|
820
|
+
gradient: { think: "linear-gradient(180deg, #fff 20.19%, rgba(255, 255, 255, 0) 100%)" },
|
|
821
|
+
think: { select: "linear-gradient(180deg, #f5f6f7 20.19%, rgba(245, 246, 247, 0) 100%)" }
|
|
805
822
|
},
|
|
806
|
-
|
|
807
|
-
|
|
808
|
-
|
|
809
|
-
|
|
810
|
-
|
|
811
|
-
|
|
823
|
+
mask: { blur: "blur(2px)" },
|
|
824
|
+
menu: { backdrop: { filter: "blur(40px) saturate(150%)" } },
|
|
825
|
+
shadow: {
|
|
826
|
+
lv1: {
|
|
827
|
+
$: "0 2px 4px 0 rgba(0, 0, 0, 0.05)",
|
|
828
|
+
blur: "0 4px 12px 0 rgba(0, 0, 0, 0.02)"
|
|
812
829
|
},
|
|
813
|
-
|
|
814
|
-
|
|
830
|
+
lv2: "0 4px 12px 0 rgba(0, 0, 0, 0.02), 0 2px 8px 0 rgba(0, 0, 0, 0.04)",
|
|
831
|
+
lv3: "0 0 1px 0 rgba(0, 0, 0, 0.2), 0 0 4px 0 rgba(0, 0, 0, 0.02), 0 12px 32px 0 rgba(0, 0, 0, 0.08)"
|
|
815
832
|
},
|
|
816
|
-
|
|
817
|
-
|
|
818
|
-
|
|
819
|
-
|
|
833
|
+
specific: {
|
|
834
|
+
bubble: {
|
|
835
|
+
$: "var(--dsw-static-deepseek-50)",
|
|
836
|
+
highlight: "var(--dsw-static-deepseek-200)"
|
|
820
837
|
},
|
|
821
|
-
|
|
822
|
-
|
|
823
|
-
|
|
824
|
-
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
|
|
838
|
+
input: { major: "var(--dsw-static-neutral-bluish-00)" },
|
|
839
|
+
login: { input: "var(--dsw-static-neutral-bluish-50)" },
|
|
840
|
+
menu: "rgba(248, 249, 250, 0.58)",
|
|
841
|
+
selector: "var(--dsw-static-neutral-bluish-60)",
|
|
842
|
+
sidebar: {
|
|
843
|
+
fill: "var(--dsw-static-neutral-bluish-50)",
|
|
844
|
+
nav: { item: {
|
|
845
|
+
active: {
|
|
846
|
+
$: "var(--dsw-static-neutral-bluish-100)",
|
|
847
|
+
accent: "var(--dsw-static-deepseek-100)"
|
|
831
848
|
},
|
|
832
|
-
|
|
849
|
+
hover: "var(--dsw-static-neutral-bluish-75)"
|
|
833
850
|
} }
|
|
834
851
|
},
|
|
835
|
-
|
|
852
|
+
tip: "var(--dsw-static-neutral-bluish-60)"
|
|
836
853
|
},
|
|
837
|
-
|
|
838
|
-
|
|
854
|
+
static: {
|
|
855
|
+
amber: {
|
|
839
856
|
"100": "rgb(254, 245, 231)",
|
|
840
857
|
"400": "rgb(247, 173, 49)",
|
|
841
858
|
"500": "rgb(245, 158, 11)",
|
|
842
859
|
"600": "rgb(221, 134, 41)",
|
|
843
860
|
"900": "rgb(39, 36, 31)"
|
|
844
861
|
},
|
|
845
|
-
|
|
862
|
+
blue: {
|
|
846
863
|
"50": "rgb(239, 246, 255)",
|
|
847
864
|
"75": "rgb(229, 240, 255)",
|
|
848
865
|
"100": "rgb(219, 234, 254)",
|
|
@@ -856,7 +873,7 @@ window.__ModuleLoader__.load({
|
|
|
856
873
|
"950": "rgb(23, 37, 84)",
|
|
857
874
|
"50p": "rgb(234, 243, 255)"
|
|
858
875
|
},
|
|
859
|
-
|
|
876
|
+
deepseek: {
|
|
860
877
|
"50": "rgb(237, 243, 254)",
|
|
861
878
|
"100": "rgb(228, 237, 253)",
|
|
862
879
|
"200": "rgb(211, 226, 255)",
|
|
@@ -865,17 +882,21 @@ window.__ModuleLoader__.load({
|
|
|
865
882
|
"450": "rgb(86, 134, 254)",
|
|
866
883
|
"500": "rgb(65, 118, 230)",
|
|
867
884
|
"600": "rgb(72, 104, 178)",
|
|
868
|
-
"700": {
|
|
885
|
+
"700": { delete: "rgb(47, 76, 143)" },
|
|
869
886
|
"800": "rgb(52, 65, 91)",
|
|
870
887
|
"900": "rgb(40, 49, 66)"
|
|
871
888
|
},
|
|
872
|
-
|
|
889
|
+
green: {
|
|
873
890
|
"100": "rgb(230, 250, 237)",
|
|
874
891
|
"400": "rgb(78, 209, 126)",
|
|
875
|
-
"500":
|
|
892
|
+
"500": {
|
|
893
|
+
$: "rgb(34, 197, 94)",
|
|
894
|
+
a08: "rgb(34 197 94 / 8%)",
|
|
895
|
+
a12: "rgb(34 197 94 / 12%)"
|
|
896
|
+
},
|
|
876
897
|
"900": "rgb(35, 60, 44)"
|
|
877
898
|
},
|
|
878
|
-
|
|
899
|
+
neutral: {
|
|
879
900
|
"50": "rgb(250, 250, 250)",
|
|
880
901
|
"100": "rgb(245, 245, 245)",
|
|
881
902
|
"150": "rgb(237, 237, 237)",
|
|
@@ -892,7 +913,7 @@ window.__ModuleLoader__.load({
|
|
|
892
913
|
"900": "rgb(15, 15, 15)",
|
|
893
914
|
"1000": "rgb(0, 0, 0)",
|
|
894
915
|
"00": "rgb(255, 255, 255)",
|
|
895
|
-
|
|
916
|
+
bluish: {
|
|
896
917
|
"50": "rgb(249, 250, 251)",
|
|
897
918
|
"60": "rgb(245, 246, 247)",
|
|
898
919
|
"75": "rgb(241, 243, 245)",
|
|
@@ -914,12 +935,18 @@ window.__ModuleLoader__.load({
|
|
|
914
935
|
"00": "rgb(255, 255, 255)"
|
|
915
936
|
}
|
|
916
937
|
},
|
|
917
|
-
|
|
938
|
+
red: {
|
|
918
939
|
"50": "rgb(254, 242, 242)",
|
|
919
940
|
"100": "rgb(254, 226, 226)",
|
|
920
|
-
"400":
|
|
941
|
+
"400": {
|
|
942
|
+
$: "rgb(242, 90, 90)",
|
|
943
|
+
a12: "rgb(242 90 90 / 12%)"
|
|
944
|
+
},
|
|
921
945
|
"500": "rgb(239, 68, 68)",
|
|
922
|
-
"600":
|
|
946
|
+
"600": {
|
|
947
|
+
$: "rgb(236, 19, 19)",
|
|
948
|
+
a08: "rgb(236 19 19 / 8%)"
|
|
949
|
+
},
|
|
923
950
|
"900": "rgb(87, 12, 12)"
|
|
924
951
|
}
|
|
925
952
|
}
|
|
@@ -939,6 +966,643 @@ window.__ModuleLoader__.load({
|
|
|
939
966
|
};
|
|
940
967
|
}
|
|
941
968
|
//#endregion
|
|
969
|
+
//#region src/client/settings-form/form-model.ts
|
|
970
|
+
/**
|
|
971
|
+
* The staged form model behind a plugin's settings page.
|
|
972
|
+
*
|
|
973
|
+
* A card stages what the user types and writes it only when they save. Each
|
|
974
|
+
* settings write is a durable, revision-fenced document mutation, so a control
|
|
975
|
+
* that committed as it settled turned one edit into a write the user never
|
|
976
|
+
* asked for and could not preview; staged text makes what is on screen exactly
|
|
977
|
+
* what a save would store.
|
|
978
|
+
*
|
|
979
|
+
* A field shows its effective value — the user layer over the composition
|
|
980
|
+
* layer over the schema default — and whether the user layer carries it. That
|
|
981
|
+
* presence, not a value comparison, is what marks a field overridden: an
|
|
982
|
+
* override equal to the composition default is still an override.
|
|
983
|
+
*/
|
|
984
|
+
/**
|
|
985
|
+
* A whole-number field. An empty draft clears the field; any other draft that
|
|
986
|
+
* is not a finite number blocks the save.
|
|
987
|
+
* @param field - field name inside the namespace section.
|
|
988
|
+
* @returns the field's conversion spec.
|
|
989
|
+
*/
|
|
990
|
+
function settingsNumberField(field) {
|
|
991
|
+
return {
|
|
992
|
+
field,
|
|
993
|
+
format: (value) => typeof value === "number" ? String(value) : "",
|
|
994
|
+
parse: (text) => {
|
|
995
|
+
const trimmed = text.trim();
|
|
996
|
+
if (trimmed === "") return { kind: "clear" };
|
|
997
|
+
const parsed = Number(trimmed);
|
|
998
|
+
return Number.isFinite(parsed) ? {
|
|
999
|
+
kind: "set",
|
|
1000
|
+
value: parsed
|
|
1001
|
+
} : void 0;
|
|
1002
|
+
}
|
|
1003
|
+
};
|
|
1004
|
+
}
|
|
1005
|
+
/**
|
|
1006
|
+
* A free-text field. An empty draft clears the field, so emptying the control
|
|
1007
|
+
* and saving is the same gesture as resetting it.
|
|
1008
|
+
* @param field - field name inside the namespace section.
|
|
1009
|
+
* @returns the field's conversion spec.
|
|
1010
|
+
*/
|
|
1011
|
+
function settingsTextField(field) {
|
|
1012
|
+
return {
|
|
1013
|
+
field,
|
|
1014
|
+
format: (value) => typeof value === "string" ? value : "",
|
|
1015
|
+
parse: (text) => {
|
|
1016
|
+
const trimmed = text.trim();
|
|
1017
|
+
return trimmed === "" ? { kind: "clear" } : {
|
|
1018
|
+
kind: "set",
|
|
1019
|
+
value: trimmed
|
|
1020
|
+
};
|
|
1021
|
+
}
|
|
1022
|
+
};
|
|
1023
|
+
}
|
|
1024
|
+
/**
|
|
1025
|
+
* Stages one card's edits over one settings namespace and writes them on save.
|
|
1026
|
+
*
|
|
1027
|
+
* The form publishes through a snapshot store because slot components read
|
|
1028
|
+
* through a snapshot selector, while both the scope and the local drafts
|
|
1029
|
+
* change underneath; every projection is rebuilt from the two together.
|
|
1030
|
+
*/
|
|
1031
|
+
var SettingsFormModel = class {
|
|
1032
|
+
scope;
|
|
1033
|
+
specs;
|
|
1034
|
+
secretSpecs;
|
|
1035
|
+
staged = /* @__PURE__ */ new Map();
|
|
1036
|
+
listeners = /* @__PURE__ */ new Set();
|
|
1037
|
+
baseline;
|
|
1038
|
+
unsubscribe;
|
|
1039
|
+
saving = false;
|
|
1040
|
+
failed = false;
|
|
1041
|
+
/**
|
|
1042
|
+
* @param scope - the shared configuration form for this card's namespace.
|
|
1043
|
+
* @param specs - the section fields this card edits.
|
|
1044
|
+
* @param secrets - the card's write-only controls, written outside the section.
|
|
1045
|
+
*/
|
|
1046
|
+
constructor(scope, specs, secrets = []) {
|
|
1047
|
+
this.scope = scope;
|
|
1048
|
+
this.specs = new Map(specs.map((spec) => [spec.field, spec]));
|
|
1049
|
+
this.secretSpecs = new Map(secrets.map((spec) => [spec.field, spec]));
|
|
1050
|
+
this.unsubscribe = scope.subscribe(() => {
|
|
1051
|
+
this.publish();
|
|
1052
|
+
});
|
|
1053
|
+
}
|
|
1054
|
+
/**
|
|
1055
|
+
* Publish a projection of this form, rebuilt whenever the scope or a draft changes.
|
|
1056
|
+
* @param project - build the card's state from the form's current reads.
|
|
1057
|
+
* @returns the store the card's component reads through its bound selector.
|
|
1058
|
+
*/
|
|
1059
|
+
bind(project) {
|
|
1060
|
+
const store = (0, _deepseek_ai_dsh_client_store.createSnapshotStore)(project());
|
|
1061
|
+
this.listeners.add(() => {
|
|
1062
|
+
store.set(project());
|
|
1063
|
+
});
|
|
1064
|
+
return store;
|
|
1065
|
+
}
|
|
1066
|
+
/**
|
|
1067
|
+
* Read the card-level state: what the Host serves, and what a save would do.
|
|
1068
|
+
* @returns the form state every card shares.
|
|
1069
|
+
*/
|
|
1070
|
+
shell() {
|
|
1071
|
+
const snapshot = this.scope.getSnapshot();
|
|
1072
|
+
const plan = this.plan();
|
|
1073
|
+
return {
|
|
1074
|
+
available: snapshot.status === "ready",
|
|
1075
|
+
writable: snapshot.writable,
|
|
1076
|
+
dirty: plan.length > 0,
|
|
1077
|
+
invalid: plan.some((item) => item.run === void 0 && item.op === void 0),
|
|
1078
|
+
saving: this.saving,
|
|
1079
|
+
failed: this.failed
|
|
1080
|
+
};
|
|
1081
|
+
}
|
|
1082
|
+
/**
|
|
1083
|
+
* Read one control's state.
|
|
1084
|
+
* @param field - field name of a section field or of a write-only control.
|
|
1085
|
+
* @returns the draft text, whether a save would leave an override, and whether it is invalid.
|
|
1086
|
+
*/
|
|
1087
|
+
field(field) {
|
|
1088
|
+
const staged = this.staged.get(field);
|
|
1089
|
+
if (this.secretSpecs.has(field)) return {
|
|
1090
|
+
text: staged?.text ?? "",
|
|
1091
|
+
overridden: false,
|
|
1092
|
+
invalid: false
|
|
1093
|
+
};
|
|
1094
|
+
const spec = this.spec(field);
|
|
1095
|
+
if (staged === void 0) return {
|
|
1096
|
+
text: spec.format(this.sectionValue(field)),
|
|
1097
|
+
overridden: this.stored(field),
|
|
1098
|
+
invalid: false
|
|
1099
|
+
};
|
|
1100
|
+
const write = staged.clear ? { kind: "clear" } : spec.parse(staged.text);
|
|
1101
|
+
return {
|
|
1102
|
+
text: staged.text,
|
|
1103
|
+
overridden: write?.kind === "set",
|
|
1104
|
+
invalid: write === void 0
|
|
1105
|
+
};
|
|
1106
|
+
}
|
|
1107
|
+
/**
|
|
1108
|
+
* Build the edit, reset, save, and discard actions bound to this form.
|
|
1109
|
+
* @returns the actions a card's slot entry injects.
|
|
1110
|
+
*/
|
|
1111
|
+
actions() {
|
|
1112
|
+
return {
|
|
1113
|
+
edit: (field, text) => {
|
|
1114
|
+
this.stage(field, {
|
|
1115
|
+
text,
|
|
1116
|
+
clear: false
|
|
1117
|
+
});
|
|
1118
|
+
},
|
|
1119
|
+
resetField: (field) => {
|
|
1120
|
+
this.stage(field, {
|
|
1121
|
+
text: this.spec(field).format(this.baseValue(field)),
|
|
1122
|
+
clear: true
|
|
1123
|
+
});
|
|
1124
|
+
},
|
|
1125
|
+
save: () => {
|
|
1126
|
+
this.save();
|
|
1127
|
+
},
|
|
1128
|
+
discard: () => {
|
|
1129
|
+
if (this.staged.size === 0 && !this.failed) return;
|
|
1130
|
+
this.staged.clear();
|
|
1131
|
+
this.baseline = void 0;
|
|
1132
|
+
this.failed = false;
|
|
1133
|
+
this.publish();
|
|
1134
|
+
}
|
|
1135
|
+
};
|
|
1136
|
+
}
|
|
1137
|
+
/**
|
|
1138
|
+
* Write every staged edit, then re-seed from what the Host accepted.
|
|
1139
|
+
*
|
|
1140
|
+
* The Host is the only authority on whether a value was accepted — its
|
|
1141
|
+
* validators own the constraints no schema can express — so the outcome is
|
|
1142
|
+
* read back from the section rather than predicted here. A save that did not
|
|
1143
|
+
* land keeps its drafts, so the user can correct them instead of retyping.
|
|
1144
|
+
* @returns settlement after every write and the read-back.
|
|
1145
|
+
*/
|
|
1146
|
+
async save() {
|
|
1147
|
+
const plan = this.plan();
|
|
1148
|
+
if (!plan.length || this.saving || !this.scope.getSnapshot().writable || plan.some((item) => item.run === void 0 && item.op === void 0)) return;
|
|
1149
|
+
this.saving = true;
|
|
1150
|
+
this.failed = false;
|
|
1151
|
+
this.publish();
|
|
1152
|
+
try {
|
|
1153
|
+
const ops = plan.flatMap((item) => item.op === void 0 ? [] : [item.op]);
|
|
1154
|
+
let landed = !ops.length || await this.scope.mutate(ops, this.baseline?.revision);
|
|
1155
|
+
if (!landed) {
|
|
1156
|
+
this.failed = true;
|
|
1157
|
+
return;
|
|
1158
|
+
}
|
|
1159
|
+
for (const item of plan) if (item.run) landed = await item.run() && landed;
|
|
1160
|
+
if (landed) {
|
|
1161
|
+
this.staged.clear();
|
|
1162
|
+
this.baseline = void 0;
|
|
1163
|
+
}
|
|
1164
|
+
this.failed = !landed;
|
|
1165
|
+
} catch {
|
|
1166
|
+
this.failed = true;
|
|
1167
|
+
} finally {
|
|
1168
|
+
this.saving = false;
|
|
1169
|
+
this.publish();
|
|
1170
|
+
}
|
|
1171
|
+
}
|
|
1172
|
+
/** Release the form's accepted-value subscription. */
|
|
1173
|
+
dispose() {
|
|
1174
|
+
this.unsubscribe();
|
|
1175
|
+
this.listeners.clear();
|
|
1176
|
+
}
|
|
1177
|
+
/**
|
|
1178
|
+
* Every staged edit a save would write. An entry whose draft is not a value
|
|
1179
|
+
* its field accepts carries no write: the form is still dirty, and the save
|
|
1180
|
+
* refuses rather than dropping the edit.
|
|
1181
|
+
* @returns the planned writes, in the order the fields were staged.
|
|
1182
|
+
*/
|
|
1183
|
+
plan() {
|
|
1184
|
+
const plan = [];
|
|
1185
|
+
for (const [field, staged] of this.staged) {
|
|
1186
|
+
const secret = this.secretSpecs.get(field);
|
|
1187
|
+
if (secret !== void 0) {
|
|
1188
|
+
const value = staged.text.trim();
|
|
1189
|
+
if (value !== "") plan.push({
|
|
1190
|
+
field,
|
|
1191
|
+
run: () => secret.write(value)
|
|
1192
|
+
});
|
|
1193
|
+
continue;
|
|
1194
|
+
}
|
|
1195
|
+
const spec = this.spec(field);
|
|
1196
|
+
if (staged.clear) {
|
|
1197
|
+
if (this.stored(field)) plan.push({
|
|
1198
|
+
field,
|
|
1199
|
+
op: {
|
|
1200
|
+
op: "unset",
|
|
1201
|
+
path: [field]
|
|
1202
|
+
}
|
|
1203
|
+
});
|
|
1204
|
+
continue;
|
|
1205
|
+
}
|
|
1206
|
+
if (staged.text === spec.format(this.sectionValue(field))) continue;
|
|
1207
|
+
const write = spec.parse(staged.text);
|
|
1208
|
+
if (write === void 0) plan.push({ field });
|
|
1209
|
+
else if (write.kind === "clear") plan.push({
|
|
1210
|
+
field,
|
|
1211
|
+
op: {
|
|
1212
|
+
op: "unset",
|
|
1213
|
+
path: [field]
|
|
1214
|
+
}
|
|
1215
|
+
});
|
|
1216
|
+
else plan.push({
|
|
1217
|
+
field,
|
|
1218
|
+
op: {
|
|
1219
|
+
op: "set",
|
|
1220
|
+
path: [field],
|
|
1221
|
+
value: write.value
|
|
1222
|
+
}
|
|
1223
|
+
});
|
|
1224
|
+
}
|
|
1225
|
+
return plan;
|
|
1226
|
+
}
|
|
1227
|
+
stage(field, edit) {
|
|
1228
|
+
this.baseline ??= this.scope.getSnapshot();
|
|
1229
|
+
this.staged.set(field, edit);
|
|
1230
|
+
this.failed = false;
|
|
1231
|
+
this.publish();
|
|
1232
|
+
}
|
|
1233
|
+
spec(field) {
|
|
1234
|
+
const spec = this.specs.get(field);
|
|
1235
|
+
if (spec === void 0) throw new Error(`plugin card has no field ${field}`);
|
|
1236
|
+
return spec;
|
|
1237
|
+
}
|
|
1238
|
+
snapshotOf() {
|
|
1239
|
+
return this.scope.getSnapshot();
|
|
1240
|
+
}
|
|
1241
|
+
sectionValue(field) {
|
|
1242
|
+
return this.snapshotOf().value?.[field];
|
|
1243
|
+
}
|
|
1244
|
+
baseValue(field) {
|
|
1245
|
+
return this.snapshotOf().base?.[field];
|
|
1246
|
+
}
|
|
1247
|
+
userLayer() {
|
|
1248
|
+
return this.snapshotOf().user;
|
|
1249
|
+
}
|
|
1250
|
+
stored(field) {
|
|
1251
|
+
const user = this.userLayer();
|
|
1252
|
+
return user !== void 0 && Object.hasOwn(user, field);
|
|
1253
|
+
}
|
|
1254
|
+
publish() {
|
|
1255
|
+
for (const listener of this.listeners) listener();
|
|
1256
|
+
}
|
|
1257
|
+
};
|
|
1258
|
+
//#endregion
|
|
1259
|
+
//#region src/client/settings-form/fields.styles.ts
|
|
1260
|
+
const helpButtonHoverBackground = "var(--dsw-alias-bg-layer-4)";
|
|
1261
|
+
const styles$1 = {
|
|
1262
|
+
field: {
|
|
1263
|
+
display: "flex",
|
|
1264
|
+
flexDirection: "column",
|
|
1265
|
+
gap: "6px",
|
|
1266
|
+
padding: "12px 0",
|
|
1267
|
+
"& + &": { borderTop: `0.5px solid ${String(dsw.alias.border.l2)}` }
|
|
1268
|
+
},
|
|
1269
|
+
head: {
|
|
1270
|
+
display: "flex",
|
|
1271
|
+
alignItems: "center",
|
|
1272
|
+
gap: "8px"
|
|
1273
|
+
},
|
|
1274
|
+
label: {
|
|
1275
|
+
flex: 1,
|
|
1276
|
+
minWidth: 0,
|
|
1277
|
+
fontSize: "13px",
|
|
1278
|
+
fontWeight: 500,
|
|
1279
|
+
lineHeight: 1.5,
|
|
1280
|
+
color: dsw.alias.label.primary
|
|
1281
|
+
},
|
|
1282
|
+
groupLabel: { flex: "0 1 auto" },
|
|
1283
|
+
labelGroup: {
|
|
1284
|
+
display: "flex",
|
|
1285
|
+
alignItems: "center",
|
|
1286
|
+
gap: "4px",
|
|
1287
|
+
flex: 1,
|
|
1288
|
+
minWidth: 0
|
|
1289
|
+
},
|
|
1290
|
+
helpButton: {
|
|
1291
|
+
display: "inline-flex",
|
|
1292
|
+
alignItems: "center",
|
|
1293
|
+
justifyContent: "center",
|
|
1294
|
+
flex: "none",
|
|
1295
|
+
width: "24px",
|
|
1296
|
+
height: "24px",
|
|
1297
|
+
padding: 0,
|
|
1298
|
+
border: 0,
|
|
1299
|
+
borderRadius: "6px",
|
|
1300
|
+
background: "none",
|
|
1301
|
+
color: dsw.alias.label.tertiary,
|
|
1302
|
+
cursor: "pointer",
|
|
1303
|
+
"&:hover": {
|
|
1304
|
+
background: helpButtonHoverBackground,
|
|
1305
|
+
color: dsw.alias.label.secondary
|
|
1306
|
+
},
|
|
1307
|
+
"&[aria-expanded='true']": {
|
|
1308
|
+
background: helpButtonHoverBackground,
|
|
1309
|
+
color: dsw.alias.label.secondary
|
|
1310
|
+
},
|
|
1311
|
+
"&:focus-visible": {
|
|
1312
|
+
outline: `2px solid ${String(dsw.alias.brand.primary)}`,
|
|
1313
|
+
outlineOffset: "1px"
|
|
1314
|
+
}
|
|
1315
|
+
},
|
|
1316
|
+
help: {
|
|
1317
|
+
padding: "10px 0 0",
|
|
1318
|
+
fontSize: "12px",
|
|
1319
|
+
lineHeight: 1.6,
|
|
1320
|
+
color: dsw.alias.label.secondary,
|
|
1321
|
+
"& > p": { margin: 0 },
|
|
1322
|
+
"& > p + p": { marginTop: "8px" }
|
|
1323
|
+
},
|
|
1324
|
+
badges: {
|
|
1325
|
+
display: "inline-flex",
|
|
1326
|
+
alignItems: "center",
|
|
1327
|
+
gap: "8px"
|
|
1328
|
+
},
|
|
1329
|
+
badge: {
|
|
1330
|
+
display: "inline-flex",
|
|
1331
|
+
alignItems: "center",
|
|
1332
|
+
borderRadius: "999px",
|
|
1333
|
+
cornerShape: "round",
|
|
1334
|
+
padding: "1px 8px",
|
|
1335
|
+
fontSize: "11px",
|
|
1336
|
+
lineHeight: "17px",
|
|
1337
|
+
fontWeight: 500,
|
|
1338
|
+
whiteSpace: "nowrap"
|
|
1339
|
+
},
|
|
1340
|
+
badgeNeutral: {
|
|
1341
|
+
background: dsw.alias.bg.module.platform,
|
|
1342
|
+
color: dsw.alias.label.secondary
|
|
1343
|
+
},
|
|
1344
|
+
badgeQuiet: { color: dsw.alias.label.tertiary },
|
|
1345
|
+
reset: {
|
|
1346
|
+
border: "none",
|
|
1347
|
+
background: "none",
|
|
1348
|
+
padding: 0,
|
|
1349
|
+
font: "inherit",
|
|
1350
|
+
fontSize: "12px",
|
|
1351
|
+
lineHeight: 1.5,
|
|
1352
|
+
color: dsw.alias.label.secondary,
|
|
1353
|
+
cursor: "pointer",
|
|
1354
|
+
"&:hover:not(:disabled)": { color: dsw.alias.label.primary },
|
|
1355
|
+
"&:disabled": { cursor: "default" }
|
|
1356
|
+
},
|
|
1357
|
+
input: {
|
|
1358
|
+
height: "34px",
|
|
1359
|
+
padding: "0 12px",
|
|
1360
|
+
border: `0.5px solid ${String(dsw.alias.border.l4)}`,
|
|
1361
|
+
borderRadius: "8px",
|
|
1362
|
+
background: dsw.alias.bg.layer["3"],
|
|
1363
|
+
font: "inherit",
|
|
1364
|
+
fontSize: "13px",
|
|
1365
|
+
lineHeight: 1.5,
|
|
1366
|
+
color: dsw.alias.label.primary,
|
|
1367
|
+
"&:focus-visible": {
|
|
1368
|
+
outline: "none",
|
|
1369
|
+
borderColor: dsw.alias.brand.primary
|
|
1370
|
+
},
|
|
1371
|
+
"&:disabled": {
|
|
1372
|
+
color: dsw.alias.label.tertiary,
|
|
1373
|
+
cursor: "default"
|
|
1374
|
+
},
|
|
1375
|
+
"&[aria-invalid='true']": { borderColor: dsw.alias.state.error.primary }
|
|
1376
|
+
},
|
|
1377
|
+
invalid: {
|
|
1378
|
+
margin: 0,
|
|
1379
|
+
fontSize: "12px",
|
|
1380
|
+
lineHeight: 1.5,
|
|
1381
|
+
color: dsw.alias.state.error.primary
|
|
1382
|
+
},
|
|
1383
|
+
hint: {
|
|
1384
|
+
margin: 0,
|
|
1385
|
+
fontSize: "12px",
|
|
1386
|
+
lineHeight: 1.5,
|
|
1387
|
+
color: dsw.alias.label.tertiary
|
|
1388
|
+
}
|
|
1389
|
+
};
|
|
1390
|
+
//#endregion
|
|
1391
|
+
//#region src/client/settings-form/fields.tsx
|
|
1392
|
+
const Field = styled("div")(styles$1.field);
|
|
1393
|
+
const Head = styled("div")(styles$1.head);
|
|
1394
|
+
const LabelGroup = styled("div")(styles$1.labelGroup);
|
|
1395
|
+
const GroupLabel = styled("label")(styles$1.label, styles$1.groupLabel);
|
|
1396
|
+
const HeadLabel = styled("label")(styles$1.label);
|
|
1397
|
+
const HelpButton = styled("button")(styles$1.helpButton);
|
|
1398
|
+
const Help = styled("div")(styles$1.help);
|
|
1399
|
+
const Badges = styled("span")(styles$1.badges);
|
|
1400
|
+
const NeutralBadge = styled("span")(styles$1.badge, styles$1.badgeNeutral);
|
|
1401
|
+
const QuietBadge = styled("span")(styles$1.badge, styles$1.badgeQuiet);
|
|
1402
|
+
const Reset = styled("button")(styles$1.reset);
|
|
1403
|
+
const Input = styled("input")(styles$1.input);
|
|
1404
|
+
const Invalid = styled("p")(styles$1.invalid);
|
|
1405
|
+
const Hint = styled("p")(styles$1.hint);
|
|
1406
|
+
/** 上游 icons 里的 IconInfoOutlineRegular（fill-only 几何，整份图标表不搬）。 */
|
|
1407
|
+
function InfoGlyph({ size }) {
|
|
1408
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("svg", {
|
|
1409
|
+
width: size,
|
|
1410
|
+
height: size,
|
|
1411
|
+
viewBox: "0 0 14 14",
|
|
1412
|
+
fill: "none",
|
|
1413
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
1414
|
+
"aria-hidden": "true",
|
|
1415
|
+
children: [
|
|
1416
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
|
|
1417
|
+
d: "M12.5757 7.00012C12.5757 3.92085 10.0794 1.42463 7.00012 1.42456C3.9208 1.42456 1.42456 3.9208 1.42456 7.00012C1.42463 10.0794 3.92085 12.5757 7.00012 12.5757C10.0793 12.5756 12.5756 10.0793 12.5757 7.00012ZM13.8002 7.00012C13.8001 10.7559 10.7559 13.8001 7.00012 13.8002C3.2443 13.8002 0.199291 10.7559 0.199219 7.00012C0.199219 3.24426 3.24426 0.199219 7.00012 0.199219C10.7559 0.199291 13.8002 3.2443 13.8002 7.00012Z",
|
|
1418
|
+
fill: "currentColor"
|
|
1419
|
+
}),
|
|
1420
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
|
|
1421
|
+
d: "M7.6127 3.18921V4.55986H6.38735V3.18921H7.6127Z",
|
|
1422
|
+
fill: "currentColor"
|
|
1423
|
+
}),
|
|
1424
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsx)("path", {
|
|
1425
|
+
d: "M7.6127 5.68921V10.8109H6.38735V5.68921H7.6127Z",
|
|
1426
|
+
fill: "currentColor"
|
|
1427
|
+
})
|
|
1428
|
+
]
|
|
1429
|
+
});
|
|
1430
|
+
}
|
|
1431
|
+
/**
|
|
1432
|
+
* A staged value field. `numeric` only hints the keypad: which drafts a field
|
|
1433
|
+
* accepts is decided by its spec, so the control never silently rewrites what
|
|
1434
|
+
* the user typed.
|
|
1435
|
+
* @param props - the field's copy, its staged text, and the edit actions.
|
|
1436
|
+
* @returns the labelled control.
|
|
1437
|
+
*/
|
|
1438
|
+
function SettingsValueField(props) {
|
|
1439
|
+
const [helpOpen, setHelpOpen] = (0, react.useState)(false);
|
|
1440
|
+
const helpId = `${props.id}-help`;
|
|
1441
|
+
const messageId = `${props.id}-message`;
|
|
1442
|
+
const hasMessage = props.invalid || Boolean(props.hint);
|
|
1443
|
+
const description = [hasMessage ? messageId : "", helpOpen ? helpId : ""].filter(Boolean).join(" ");
|
|
1444
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Field, { children: [
|
|
1445
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Head, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(LabelGroup, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(GroupLabel, {
|
|
1446
|
+
htmlFor: props.id,
|
|
1447
|
+
children: props.label
|
|
1448
|
+
}), props.help !== void 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(HelpButton, {
|
|
1449
|
+
type: "button",
|
|
1450
|
+
"aria-label": props.help.label,
|
|
1451
|
+
"aria-expanded": helpOpen,
|
|
1452
|
+
"aria-controls": helpId,
|
|
1453
|
+
onClick: () => {
|
|
1454
|
+
setHelpOpen(!helpOpen);
|
|
1455
|
+
},
|
|
1456
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(InfoGlyph, { size: 12 })
|
|
1457
|
+
}) : null] }), props.overridden ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Badges, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(NeutralBadge, { children: props.overriddenLabel }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Reset, {
|
|
1458
|
+
type: "button",
|
|
1459
|
+
disabled: props.disabled,
|
|
1460
|
+
onClick: props.onReset,
|
|
1461
|
+
children: props.resetLabel
|
|
1462
|
+
})] }) : null] }),
|
|
1463
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Input, {
|
|
1464
|
+
id: props.id,
|
|
1465
|
+
type: "text",
|
|
1466
|
+
...props.numeric === true ? { inputMode: "numeric" } : {},
|
|
1467
|
+
...props.invalid ? { "aria-invalid": true } : {},
|
|
1468
|
+
"aria-describedby": description || void 0,
|
|
1469
|
+
value: props.text,
|
|
1470
|
+
placeholder: props.placeholder ?? "",
|
|
1471
|
+
disabled: props.disabled,
|
|
1472
|
+
onChange: (event) => {
|
|
1473
|
+
props.onEdit(event.target.value);
|
|
1474
|
+
}
|
|
1475
|
+
}),
|
|
1476
|
+
hasMessage ? props.invalid ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Invalid, {
|
|
1477
|
+
id: messageId,
|
|
1478
|
+
children: props.invalidLabel
|
|
1479
|
+
}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Hint, {
|
|
1480
|
+
id: messageId,
|
|
1481
|
+
children: props.hint
|
|
1482
|
+
}) : null,
|
|
1483
|
+
props.help !== void 0 && helpOpen ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Help, {
|
|
1484
|
+
id: helpId,
|
|
1485
|
+
role: "region",
|
|
1486
|
+
"aria-label": props.help.label,
|
|
1487
|
+
children: props.help.content
|
|
1488
|
+
}) : null
|
|
1489
|
+
] });
|
|
1490
|
+
}
|
|
1491
|
+
/**
|
|
1492
|
+
* A write-only credential control. The value never rides a response, so the
|
|
1493
|
+
* control reports only whether one is configured and starts blank; a blank
|
|
1494
|
+
* draft writes nothing, which keeps the stored key rather than clearing it.
|
|
1495
|
+
* @param props - the field's copy, its staged text, and the configured state.
|
|
1496
|
+
* @returns the labelled control.
|
|
1497
|
+
*/
|
|
1498
|
+
function SettingsSecretField(props) {
|
|
1499
|
+
const Badge = props.configured ? NeutralBadge : QuietBadge;
|
|
1500
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Field, { children: [
|
|
1501
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Head, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(HeadLabel, {
|
|
1502
|
+
htmlFor: props.id,
|
|
1503
|
+
children: props.label
|
|
1504
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Badges, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Badge, { children: props.stateLabel }) })] }),
|
|
1505
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Input, {
|
|
1506
|
+
id: props.id,
|
|
1507
|
+
type: "password",
|
|
1508
|
+
autoComplete: "off",
|
|
1509
|
+
value: props.text,
|
|
1510
|
+
disabled: props.disabled,
|
|
1511
|
+
onChange: (event) => {
|
|
1512
|
+
props.onEdit(event.target.value);
|
|
1513
|
+
}
|
|
1514
|
+
}),
|
|
1515
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(Hint, { children: props.hint })
|
|
1516
|
+
] });
|
|
1517
|
+
}
|
|
1518
|
+
const styles = {
|
|
1519
|
+
form: {
|
|
1520
|
+
display: "flex",
|
|
1521
|
+
flexDirection: "column"
|
|
1522
|
+
},
|
|
1523
|
+
notice: {
|
|
1524
|
+
margin: "0 0 12px",
|
|
1525
|
+
fontSize: "12px",
|
|
1526
|
+
lineHeight: 1.5,
|
|
1527
|
+
color: dsw.alias.label.tertiary
|
|
1528
|
+
},
|
|
1529
|
+
footer: {
|
|
1530
|
+
display: "flex",
|
|
1531
|
+
alignItems: "center",
|
|
1532
|
+
gap: "8px",
|
|
1533
|
+
paddingTop: "16px"
|
|
1534
|
+
},
|
|
1535
|
+
failed: {
|
|
1536
|
+
flex: 1,
|
|
1537
|
+
minWidth: 0,
|
|
1538
|
+
margin: 0,
|
|
1539
|
+
fontSize: "12px",
|
|
1540
|
+
lineHeight: 1.5,
|
|
1541
|
+
color: "var(--dsw-alias-label-error)"
|
|
1542
|
+
},
|
|
1543
|
+
save: {
|
|
1544
|
+
appearance: "none",
|
|
1545
|
+
border: "1px solid transparent",
|
|
1546
|
+
borderRadius: "8px",
|
|
1547
|
+
padding: "5px 14px",
|
|
1548
|
+
font: "inherit",
|
|
1549
|
+
fontSize: "13px",
|
|
1550
|
+
lineHeight: 1.5,
|
|
1551
|
+
cursor: "pointer",
|
|
1552
|
+
background: dsw.alias.label.primary,
|
|
1553
|
+
color: dsw.alias.bg.layer["3"],
|
|
1554
|
+
"&:disabled": {
|
|
1555
|
+
opacity: .4,
|
|
1556
|
+
cursor: "default"
|
|
1557
|
+
},
|
|
1558
|
+
"&:focus-visible": {
|
|
1559
|
+
outline: `2px solid ${String(dsw.alias.brand.primary)}`,
|
|
1560
|
+
outlineOffset: "1px"
|
|
1561
|
+
}
|
|
1562
|
+
}
|
|
1563
|
+
};
|
|
1564
|
+
//#endregion
|
|
1565
|
+
//#region src/client/settings-form/SettingsForm.tsx
|
|
1566
|
+
const Form = styled("div")(styles.form);
|
|
1567
|
+
const Notice = styled("p")(styles.notice);
|
|
1568
|
+
const Footer = styled("div")(styles.footer);
|
|
1569
|
+
const Failed = styled("p")(styles.failed);
|
|
1570
|
+
const Save = styled("button")(styles.save);
|
|
1571
|
+
/**
|
|
1572
|
+
* Render one plugin's settings form.
|
|
1573
|
+
* @param props - the form's copy and state, its controls, and the save and discard actions.
|
|
1574
|
+
* @returns the form, or the unavailable line while the namespace is not served.
|
|
1575
|
+
*/
|
|
1576
|
+
function SettingsForm(props) {
|
|
1577
|
+
const { state, labels } = props;
|
|
1578
|
+
const discard = (0, react.useRef)(props.onDiscard);
|
|
1579
|
+
discard.current = props.onDiscard;
|
|
1580
|
+
(0, react.useEffect)(() => () => {
|
|
1581
|
+
discard.current();
|
|
1582
|
+
}, []);
|
|
1583
|
+
if (!state.available) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Notice, {
|
|
1584
|
+
role: "status",
|
|
1585
|
+
children: labels.unavailable
|
|
1586
|
+
});
|
|
1587
|
+
const blocked = !state.dirty || state.invalid || state.saving;
|
|
1588
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Form, { children: [
|
|
1589
|
+
!state.writable ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Notice, {
|
|
1590
|
+
role: "status",
|
|
1591
|
+
children: labels.readOnly
|
|
1592
|
+
}) : null,
|
|
1593
|
+
props.children,
|
|
1594
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(Footer, { children: [state.failed ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Failed, {
|
|
1595
|
+
role: "status",
|
|
1596
|
+
children: labels.saveFailed
|
|
1597
|
+
}) : null, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Save, {
|
|
1598
|
+
type: "button",
|
|
1599
|
+
disabled: blocked,
|
|
1600
|
+
onClick: props.onSave,
|
|
1601
|
+
children: state.saving ? labels.saving : labels.save
|
|
1602
|
+
})] })
|
|
1603
|
+
] });
|
|
1604
|
+
}
|
|
1605
|
+
//#endregion
|
|
942
1606
|
//#region ../../../node_modules/.pnpm/mdast-util-to-string@4.0.0/node_modules/mdast-util-to-string/lib/index.js
|
|
943
1607
|
/**
|
|
944
1608
|
* @typedef {import('mdast').Nodes} Nodes
|
|
@@ -13738,6 +14402,10 @@ window.__ModuleLoader__.load({
|
|
|
13738
14402
|
function apply(_ctx) {}
|
|
13739
14403
|
//#endregion
|
|
13740
14404
|
exports.ReferenceMarkdown = ReferenceMarkdown;
|
|
14405
|
+
exports.SettingsForm = SettingsForm;
|
|
14406
|
+
exports.SettingsFormModel = SettingsFormModel;
|
|
14407
|
+
exports.SettingsSecretField = SettingsSecretField;
|
|
14408
|
+
exports.SettingsValueField = SettingsValueField;
|
|
13741
14409
|
exports.Styling = Styling;
|
|
13742
14410
|
exports.Token = Token;
|
|
13743
14411
|
exports.apply = apply;
|
|
@@ -13752,6 +14420,8 @@ window.__ModuleLoader__.load({
|
|
|
13752
14420
|
exports.parseReference = parseReference;
|
|
13753
14421
|
exports.parseReferenceToken = parseReferenceToken;
|
|
13754
14422
|
exports.referenceMentions = referenceMentions;
|
|
14423
|
+
exports.settingsNumberField = settingsNumberField;
|
|
14424
|
+
exports.settingsTextField = settingsTextField;
|
|
13755
14425
|
exports.styleOf = styleOf;
|
|
13756
14426
|
exports.styled = styled;
|
|
13757
14427
|
exports.styling = styling;
|