@ktortu/aaa 0.9.5 → 0.9.7

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 (37) hide show
  1. package/README.md +25 -1
  2. package/button/button-tokens.css +3 -1
  3. package/button/button.css +3 -3
  4. package/card/card-tokens.css +2 -1
  5. package/cdk/styles/foundation.css +19 -10
  6. package/dialog/dialog.css +8 -4
  7. package/fesm2022/ktortu-aaa-dialog.mjs +16 -16
  8. package/fesm2022/ktortu-aaa-dialog.mjs.map +1 -1
  9. package/fesm2022/ktortu-aaa-forms.mjs +71 -37
  10. package/fesm2022/ktortu-aaa-forms.mjs.map +1 -1
  11. package/fesm2022/ktortu-aaa-layout.mjs +286 -0
  12. package/fesm2022/ktortu-aaa-layout.mjs.map +1 -0
  13. package/fesm2022/ktortu-aaa.mjs +1 -0
  14. package/fesm2022/ktortu-aaa.mjs.map +1 -1
  15. package/forms/chips/chip-listbox.css +15 -0
  16. package/forms/field/field.css +3 -1
  17. package/forms/styles/select-panel.css +3 -3
  18. package/package.json +5 -1
  19. package/styles/layout.css +140 -0
  20. package/styles/styles.css +1 -0
  21. package/themes/theme-ant.css +21 -16
  22. package/themes/theme-architecte.css +28 -28
  23. package/themes/theme-aurora.css +23 -23
  24. package/themes/theme-bootstrap.css +19 -19
  25. package/themes/theme-carbon.css +18 -18
  26. package/themes/theme-catppuccin.css +27 -27
  27. package/themes/theme-cyberpunk.css +28 -28
  28. package/themes/theme-fluent.css +32 -19
  29. package/themes/theme-material-you.css +78 -27
  30. package/themes/theme-material.css +28 -19
  31. package/themes/theme-primer.css +24 -18
  32. package/themes/theme-vegetal.css +21 -21
  33. package/tooltip/tooltip.css +1 -0
  34. package/types/ktortu-aaa-dialog.d.ts +7 -7
  35. package/types/ktortu-aaa-forms.d.ts +24 -4
  36. package/types/ktortu-aaa-layout.d.ts +117 -0
  37. package/types/ktortu-aaa.d.ts +1 -0
@@ -18,15 +18,33 @@
18
18
  --myou-seed: #0b6e63; /* teal — essayez #7c4dff, #b3261e, #386a20… */
19
19
 
20
20
  /* ============ Socle (tons M3 figés, teinte du seed) ============ */
21
- --kt-surface: oklch(from var(--myou-seed) 0.985 0.008 h); /* tone ~98, teinté */
22
- --kt-on-surface: oklch(from var(--myou-seed) 0.22 0.02 h); /* tone ~10 */
23
- --kt-muted: oklch(from var(--myou-seed) 0.42 0.03 h); /* neutral-variant ~30 */
24
- --kt-outline: oklch(from var(--myou-seed) 0.55 0.03 h); /* tone ~50 (3:1 non-texte) */
25
- --kt-outline-strong: oklch(from var(--myou-seed) 0.45 0.04 h);
26
- --kt-primary: oklch(from var(--myou-seed) 0.46 0.09 h); /* tone ~40 : blanc ≥ 6:1 */
27
- --kt-danger: #b3261e; /* erreur M3 statique (non dérivée — fidèle à You) */
28
- --kt-neutral: oklch(from var(--myou-seed) 0.4 0.02 h); /* neutre teinté, blanc ≥ 7:1 */
29
- --kt-focus-ring-color: oklch(from var(--myou-seed) 0.46 0.09 h);
21
+ --kt-surface: light-dark(
22
+ oklch(from var(--myou-seed) 0.985 0.008 h),
23
+ oklch(from var(--myou-seed) 0.1 0.008 h)
24
+ ); /* tone ~98, teinté */
25
+ --kt-on-surface: light-dark(
26
+ oklch(from var(--myou-seed) 0.22 0.02 h),
27
+ oklch(from var(--myou-seed) 0.9 0.02 h)
28
+ ); /* tone ~10 */
29
+ --kt-muted: light-dark(
30
+ oklch(from var(--myou-seed) 0.42 0.03 h),
31
+ oklch(from var(--myou-seed) 0.7 0.03 h)
32
+ ); /* neutral-variant ~30 */
33
+ --kt-outline: light-dark(
34
+ oklch(from var(--myou-seed) 0.55 0.03 h),
35
+ oklch(from var(--myou-seed) 0.45 0.03 h)
36
+ ); /* tone ~50 (3:1 non-texte) */
37
+ --kt-outline-strong: light-dark(oklch(from var(--myou-seed) 0.45 0.04 h), oklch(from var(--myou-seed) 0.65 0.04 h));
38
+ --kt-primary: light-dark(
39
+ oklch(from var(--myou-seed) 0.46 0.09 h),
40
+ oklch(from var(--myou-seed) 0.8 0.09 h)
41
+ ); /* tone ~40 : blanc ≥ 6:1 */
42
+ --kt-danger: light-dark(#b3261e, #f2b8b5); /* erreur M3 statique (non dérivée — fidèle à You) */
43
+ --kt-neutral: light-dark(
44
+ oklch(from var(--myou-seed) 0.4 0.02 h),
45
+ oklch(from var(--myou-seed) 0.8 0.02 h)
46
+ ); /* neutre teinté, blanc ≥ 7:1 */
47
+ --kt-focus-ring-color: light-dark(oklch(from var(--myou-seed) 0.46 0.09 h), oklch(from var(--myou-seed) 0.8 0.09 h));
30
48
  --kt-font: 'Roboto', system-ui, sans-serif;
31
49
 
32
50
  /* ============ Géométrie : rondeurs expressives ============ */
@@ -35,40 +53,73 @@
35
53
  --kt-sheet-radius: 28px;
36
54
 
37
55
  /* ============ Champs : surface-container teintée (la signature You) ============ */
38
- --field-bg: oklch(from var(--myou-seed) 0.94 0.02 h); /* tone ~94 */
39
- --field-focus-ring: color-mix(in srgb, oklch(from var(--myou-seed) 0.46 0.09 h) 55%, transparent);
56
+ --field-bg: light-dark(
57
+ oklch(from var(--myou-seed) 0.94 0.02 h),
58
+ oklch(from var(--myou-seed) 0.15 0.02 h)
59
+ ); /* tone ~94 */
60
+ --field-focus-ring: light-dark(
61
+ color-mix(in srgb, oklch(from var(--myou-seed) 0.46 0.09 h) 55%, transparent),
62
+ color-mix(in srgb, oklch(from var(--myou-seed) 0.8 0.09 h) 55%, transparent)
63
+ );
40
64
  --field-transition: border-color 150ms ease;
41
65
 
42
66
  /* ============ Boutons : containers/fg dérivés par la lib depuis les 3 bases ============ */
43
67
  --btn-tonal-weight: 18%; /* containers un peu plus présents que le défaut */
44
68
  /* on-containers teintés par le seed (tone ~25 sur container ~90 : ≥ 8:1 par construction) —
45
69
  les défauts statiques de la lib resteraient AA mais d'une teinte étrangère au seed. */
46
- --btn-on-primary-container: oklch(from var(--myou-seed) 0.25 0.06 h);
47
- --btn-on-neutral-container: oklch(from var(--myou-seed) 0.25 0.02 h);
70
+ --btn-on-primary-container: light-dark(
71
+ oklch(from var(--myou-seed) 0.25 0.06 h),
72
+ oklch(from var(--myou-seed) 0.9 0.06 h)
73
+ );
74
+ --btn-on-neutral-container: light-dark(
75
+ oklch(from var(--myou-seed) 0.25 0.02 h),
76
+ oklch(from var(--myou-seed) 0.9 0.02 h)
77
+ );
48
78
 
49
79
  /* ============ Caret + sélection ============ */
50
- --field-caret-color: oklch(from var(--myou-seed) 0.46 0.09 h);
51
- --kt-selection-bg: oklch(from var(--myou-seed) 0.88 0.05 h); /* container ~tone 90 */
52
- --kt-selection-fg: oklch(from var(--myou-seed) 0.25 0.05 h);
80
+ --field-caret-color: light-dark(oklch(from var(--myou-seed) 0.46 0.09 h), oklch(from var(--myou-seed) 0.8 0.09 h));
81
+ --kt-selection-bg: light-dark(
82
+ oklch(from var(--myou-seed) 0.88 0.05 h),
83
+ oklch(from var(--myou-seed) 0.3 0.05 h)
84
+ ); /* container ~tone 90 */
85
+ --kt-selection-fg: light-dark(oklch(from var(--myou-seed) 0.25 0.05 h), oklch(from var(--myou-seed) 0.9 0.05 h));
53
86
 
54
87
  /* ============ Select / tooltip ============ */
55
- --select-popup-bg: oklch(from var(--myou-seed) 0.97 0.01 h);
56
- --select-popup-shadow: 0 4px 16px oklch(from var(--myou-seed) 0.3 0.04 h / 25%);
57
- --kt-sheet-scrim: oklch(from var(--myou-seed) 0.2 0.03 h / 50%);
58
- --kt-sheet-shadow: 0 -4px 16px oklch(from var(--myou-seed) 0.3 0.04 h / 22%); /* élévation M3 teintée */
59
- --tooltip-bg: oklch(from var(--myou-seed) 0.27 0.03 h);
60
- --tooltip-fg: oklch(from var(--myou-seed) 0.96 0.01 h);
88
+ --select-popup-bg: light-dark(oklch(from var(--myou-seed) 0.97 0.01 h), oklch(from var(--myou-seed) 0.12 0.01 h));
89
+ --select-popup-shadow: light-dark(
90
+ 0 4px 16px oklch(from var(--myou-seed) 0.3 0.04 h / 25%),
91
+ 0 0 0 1px rgba(255, 255, 255, 0.1)
92
+ );
93
+ --kt-sheet-scrim: light-dark(
94
+ oklch(from var(--myou-seed) 0.2 0.03 h / 50%),
95
+ oklch(from var(--myou-seed) 0.1 0.03 h / 60%)
96
+ );
97
+ --kt-sheet-shadow: light-dark(
98
+ 0 -4px 16px oklch(from var(--myou-seed) 0.3 0.04 h / 22%),
99
+ 0 -1px 0 rgba(255, 255, 255, 0.1)
100
+ ); /* élévation M3 teintée */
101
+ --tooltip-bg: light-dark(oklch(from var(--myou-seed) 0.27 0.03 h), oklch(from var(--myou-seed) 0.9 0.03 h));
102
+ --tooltip-fg: light-dark(oklch(from var(--myou-seed) 0.96 0.01 h), oklch(from var(--myou-seed) 0.1 0.01 h));
61
103
 
62
104
  /* ============ Dialog (M3 expressive : rayon hérité de la feuille, sans bord) ============ */
63
- --dialog-bg: oklch(from var(--myou-seed) 0.97 0.01 h); /* surface-container teinté */
105
+ --dialog-bg: light-dark(
106
+ oklch(from var(--myou-seed) 0.97 0.01 h),
107
+ oklch(from var(--myou-seed) 0.15 0.01 h)
108
+ ); /* surface-container teinté */
64
109
  --dialog-radius: 28px;
65
110
  --dialog-border-width: 0;
66
111
 
67
112
  /* ============ Card (M3 expressive : surfaces teintées du seed, rayon 16) ============ */
68
113
  --card-radius: 16px;
69
- --card-bg: oklch(from var(--myou-seed) 0.97 0.01 h);
70
- --card-filled-bg: oklch(from var(--myou-seed) 0.94 0.02 h);
71
- --card-shadow: 0 1px 3px oklch(from var(--myou-seed) 0.3 0.04 h / 20%);
72
- --card-shadow-hover: 0 2px 8px oklch(from var(--myou-seed) 0.3 0.04 h / 26%);
114
+ --card-bg: light-dark(oklch(from var(--myou-seed) 0.97 0.01 h), oklch(from var(--myou-seed) 0.12 0.01 h));
115
+ --card-filled-bg: light-dark(oklch(from var(--myou-seed) 0.94 0.02 h), oklch(from var(--myou-seed) 0.18 0.02 h));
116
+ --card-shadow: light-dark(
117
+ 0 1px 3px oklch(from var(--myou-seed) 0.3 0.04 h / 20%),
118
+ 0 0 0 1px rgba(255, 255, 255, 0.1)
119
+ );
120
+ --card-shadow-hover: light-dark(
121
+ 0 2px 8px oklch(from var(--myou-seed) 0.3 0.04 h / 26%),
122
+ 0 0 0 1px rgba(255, 255, 255, 0.2)
123
+ );
73
124
  --card-transition: box-shadow 150ms ease;
74
125
  }
@@ -3,14 +3,19 @@
3
3
  (bascule --btn-radius prévue par le contrat), surfaces teintées M3. */
4
4
  [data-theme='material'] {
5
5
  /* ============ Socle (rôles M3 baseline) ============ */
6
- --kt-primary: #6750a4; /* primary — on-primary blanc ~5.6:1 */
7
- --kt-neutral: #625b71; /* secondary — blanc ~6.9:1 */
8
- --kt-danger: #b3261e; /* error (= défaut lib, explicite) */
9
- --kt-surface: #fef7ff;
10
- --kt-on-surface: #1d1b20;
11
- --kt-muted: #49454f; /* on-surface-variant, ~9:1 */
12
- --kt-outline: #79747e;
13
- --kt-outline-strong: #49454f;
6
+ --kt-primary: light-dark(#463673, #d7c4fc); /* primary — on-primary blanc ~5.6:1 */
7
+ --kt-neutral: light-dark(#625b71, #ccc2dc); /* secondary — blanc ~6.9:1 */
8
+ --kt-danger: light-dark(#8c1d17, #f7c8c6); /* error (= défaut lib, explicite) */
9
+ --kt-surface: light-dark(#fef7ff, #141218);
10
+ --kt-surface-container-lowest: light-dark(#ffffff, #0f0d13);
11
+ --kt-surface-container-low: light-dark(#f7f2fa, #1d1b20);
12
+ --kt-surface-container: light-dark(#f3edf7, #211f26);
13
+ --kt-surface-container-high: light-dark(#ece6f0, #2b2930);
14
+ --kt-surface-container-highest: light-dark(#e6e0e9, #36343b);
15
+ --kt-on-surface: light-dark(#1d1b20, #e6e0e9);
16
+ --kt-muted: light-dark(#49454f, #cac4d0); /* on-surface-variant, ~9:1 */
17
+ --kt-outline: light-dark(#79747e, #938f99);
18
+ --kt-outline-strong: light-dark(#49454f, #cac4d0);
14
19
  --kt-font: 'Roboto', system-ui, sans-serif;
15
20
 
16
21
  /* ============ Géométrie ============ */
@@ -21,28 +26,32 @@
21
26
  /* ============ Boutons ============ */
22
27
  --btn-font-weight: 500; /* label-large M3 (rétrofit lot 6) */
23
28
  /* on-containers M3 sur les containers dérivés (≈ primary/secondary-container). */
24
- --btn-on-primary-container: #21005d;
25
- --btn-on-neutral-container: #1d192b;
29
+ --btn-on-primary-container: light-dark(#21005d, #eaddff);
30
+ --btn-on-neutral-container: light-dark(#1d192b, #e8def8);
26
31
 
27
32
  /* ============ Champs ============ */
28
33
  --field-transition: border-color 150ms ease; /* state transitions M3 (rétrofit lot 3) */
29
34
 
30
35
  /* ============ Select / tooltip ============ */
31
- --select-popup-bg: #f3edf7; /* surface-container */
32
- --tooltip-bg: #322f35; /* inverse-surface */
33
- --tooltip-fg: #f5eff7; /* inverse-on-surface */
36
+ --select-popup-bg: light-dark(#f3edf7, #211f26); /* surface-container */
37
+ --tooltip-bg: light-dark(#322f35, #e6e0e9); /* inverse-surface */
38
+ --tooltip-fg: light-dark(#f5eff7, #322f35); /* inverse-on-surface */
34
39
 
35
40
  /* ============ Dialog (M3 : grand rayon, élévation, sans bord) ============ */
36
- --dialog-bg: #f3edf7; /* surface-container-high */
41
+ --dialog-bg: light-dark(#f3edf7, #2b2930); /* surface-container-high */
37
42
  --dialog-radius: 28px;
38
43
  --dialog-border-width: 0;
39
- --dialog-shadow: 0 8px 24px rgb(29 27 32 / 22%);
44
+ --dialog-shadow: light-dark(0 8px 24px rgb(29 27 32 / 22%), 0 0 0 1px rgba(255, 255, 255, 0.1));
40
45
 
41
46
  /* ============ Card (M3 : surface-container, rayon 12, élévation douce) ============ */
42
47
  --card-radius: 12px;
43
- --card-bg: #f3edf7; /* surface-container */
44
- --card-filled-bg: #ece6f0; /* surface-container-high */
45
- --card-shadow: 0 1px 3px rgb(29 27 32 / 16%), 0 1px 2px rgb(29 27 32 / 12%);
46
- --card-shadow-hover: 0 2px 6px rgb(29 27 32 / 22%);
48
+ --card-bg: light-dark(#f3edf7, #211f26); /* surface-container */
49
+ --card-filled-bg: light-dark(#ece6f0, #2b2930); /* surface-container-high */
50
+ --card-shadow: light-dark(
51
+ 0 1px 3px rgb(29 27 32 / 16%),
52
+ 0 1px 2px rgb(29 27 32 / 12%),
53
+ 0 0 0 1px rgba(255, 255, 255, 0.1)
54
+ );
55
+ --card-shadow-hover: light-dark(0 2px 6px rgb(29 27 32 / 22%), 0 0 0 1px rgba(255, 255, 255, 0.2));
47
56
  --card-transition: box-shadow 150ms ease;
48
57
  }
@@ -5,15 +5,15 @@
5
5
  les 32px de Primer — exigence d'accessibilité du projet. */
6
6
  [data-theme='primer'] {
7
7
  /* ============ Socle ============ */
8
- --kt-primary: #0969da; /* accent.fg — blanc ~5.2:1 */
9
- --kt-danger: #cf222e; /* danger.fg */
10
- --kt-neutral: #57606a; /* fg.muted historique — blanc ~6.3:1 */
11
- --kt-surface: #ffffff;
12
- --kt-on-surface: #1f2328; /* fg.default */
13
- --kt-muted: #59636e; /* fg.muted, ~5.7:1 */
14
- --kt-outline: #d0d7de; /* border.default */
15
- --kt-outline-strong: #818b98;
16
- --kt-focus-ring-color: #0969da;
8
+ --kt-primary: light-dark(#185929, #3fb558); /* accent.fg — blanc ~5.2:1 */
9
+ --kt-danger: light-dark(#8f141d, #ff5754); /* danger.fg */
10
+ --kt-neutral: light-dark(#57606a, #8b949e); /* fg.muted historique — blanc ~6.3:1 */
11
+ --kt-surface: light-dark(#ffffff, #0d1117);
12
+ --kt-on-surface: light-dark(#1f2328, #e6edf3); /* fg.default */
13
+ --kt-muted: light-dark(#59636e, #7d8590); /* fg.muted, ~5.7:1 */
14
+ --kt-outline: light-dark(#d0d7de, #30363d); /* border.default */
15
+ --kt-outline-strong: light-dark(#818b98, #8b949e);
16
+ --kt-focus-ring-color: light-dark(#0969da, #58a6ff);
17
17
  /* Stack système GitHub authentique (le produit n'embarque pas de webfont). */
18
18
  --kt-font: -apple-system, 'Segoe UI', 'Noto Sans', Helvetica, Arial, sans-serif;
19
19
 
@@ -26,21 +26,27 @@
26
26
  --btn-font-weight: 500; /* les boutons GitHub sont en medium (rétrofit lot 6) */
27
27
 
28
28
  /* ============ Ombres ============ */
29
- --field-shadow: inset 0 1px 0 rgb(31 35 40 / 4%); /* inner shadow subtile des inputs Primer */
30
- --btn-shadow: 0 1px 0 rgb(31 35 40 / 4%); /* hérite vers hover/focus via le fallback chaîné */
31
- --select-popup-shadow: 0 8px 24px rgb(140 149 159 / 20%); /* shadow.medium */
29
+ --field-shadow: light-dark(
30
+ inset 0 1px 0 rgb(31 35 40 / 4%),
31
+ inset 0 1px 0 rgb(255 255 255 / 4%)
32
+ ); /* inner shadow subtile des inputs Primer */
33
+ --btn-shadow: light-dark(
34
+ 0 1px 0 rgb(31 35 40 / 4%),
35
+ 0 1px 0 rgb(255 255 255 / 4%)
36
+ ); /* hérite vers hover/focus via le fallback chaîné */
37
+ --select-popup-shadow: light-dark(0 8px 24px rgb(140 149 159 / 20%), 0 0 0 1px #30363d); /* shadow.medium */
32
38
 
33
39
  /* ============ Tooltip ============ */
34
- --tooltip-bg: #25292e;
35
- --tooltip-fg: #ffffff;
40
+ --tooltip-bg: light-dark(#25292e, #e6edf3);
41
+ --tooltip-fg: light-dark(#ffffff, #0d1117);
36
42
 
37
43
  /* ============ Dialog (GitHub : rayon 12, bord net) ============ */
38
44
  --dialog-radius: 12px;
39
- --dialog-border-color: #d0d7de;
45
+ --dialog-border-color: light-dark(#d0d7de, #30363d);
40
46
 
41
47
  /* ============ Card (GitHub Box : rayon 6, filet + ombre discrète) ============ */
42
48
  --card-radius: 6px;
43
- --card-border-color: #d0d7de;
44
- --card-filled-bg: #f6f8fa; /* canvas.subtle */
45
- --card-shadow: 0 1px 0 rgb(31 35 40 / 4%), 0 1px 3px rgb(31 35 40 / 6%);
49
+ --card-border-color: light-dark(#d0d7de, #30363d);
50
+ --card-filled-bg: light-dark(#f6f8fa, #161b22); /* canvas.subtle */
51
+ --card-shadow: light-dark(0 1px 0 rgb(31 35 40 / 4%), 0 1px 3px rgb(31 35 40 / 6%), 0 0 0 1px #30363d);
46
52
  }
@@ -5,15 +5,15 @@
5
5
  ombres douces vert-de-gris. Uniquement des redéclarations de tokens. */
6
6
  [data-theme='vegetal'] {
7
7
  /* ============ Socle ============ */
8
- --kt-primary: #36743f; /* vert feuille — blanc 5.6:1, texte sur crème 5.1:1 */
9
- --kt-danger: #b04a2e; /* terracotta — blanc 5.4:1 */
10
- --kt-neutral: #6b5d4a; /* brun écorce — blanc 6.4:1 */
11
- --kt-surface: #f5f3e8; /* crème lin */
12
- --kt-on-surface: #2a3326; /* vert mousse très foncé, ~12:1 */
13
- --kt-muted: #5b6a51; /* vert-de-gris, 5.2:1 */
14
- --kt-outline: #7d8a69; /* tige sèche (3.2:1 non-texte) */
15
- --kt-outline-strong: #5b6a51;
16
- --kt-focus-ring-color: #36743f;
8
+ --kt-primary: light-dark(#36743f, #84c48f); /* vert feuille — blanc 5.6:1, texte sur crème 5.1:1 */
9
+ --kt-danger: light-dark(#b04a2e, #e8866d); /* terracotta — blanc 5.4:1 */
10
+ --kt-neutral: light-dark(#6b5d4a, #b0a390); /* brun écorce — blanc 6.4:1 */
11
+ --kt-surface: light-dark(#f5f3e8, #182116); /* crème lin */
12
+ --kt-on-surface: light-dark(#2a3326, #e7e3d2); /* vert mousse très foncé, ~12:1 */
13
+ --kt-muted: light-dark(#5b6a51, #9aa88f); /* vert-de-gris, 5.2:1 */
14
+ --kt-outline: light-dark(#7d8a69, #3f4d38); /* tige sèche (3.2:1 non-texte) */
15
+ --kt-outline-strong: light-dark(#5b6a51, #7d8a69);
16
+ --kt-focus-ring-color: light-dark(#36743f, #84c48f);
17
17
  --kt-font: 'Quicksand', ui-rounded, 'Trebuchet MS', sans-serif; /* arrondie, organique */
18
18
 
19
19
  /* Gouttière organique : thumb tige sèche (outline) sur une rainure crème un ton sous le lin. */
@@ -27,21 +27,21 @@
27
27
  --kt-sheet-radius: 20px;
28
28
 
29
29
  /* ============ Champs ============ */
30
- --field-bg: #fdfcf5; /* papier clair, en relief sur le lin */
30
+ --field-bg: light-dark(#fdfcf5, #222b1e); /* papier clair, en relief sur le lin */
31
31
  /* Forme FEUILLE : radius par coin (haut-gauche/bas-droite ronds, les deux autres pincés).
32
32
  Possible depuis toujours — les tokens radius acceptent 4 valeurs (audit lot 6). */
33
33
  --field-radius: 16px 4px 16px 4px;
34
34
  --field-shadow-focus: 0 2px 10px rgb(54 116 63 / 22%); /* halo de sève discret */
35
35
  --field-transition: border-color 150ms ease, box-shadow 150ms ease; /* sève qui monte en douceur */
36
- --field-caret-color: #36743f;
37
- --kt-selection-bg: #36743f;
38
- --kt-selection-fg: #ffffff;
36
+ --field-caret-color: light-dark(#36743f, #84c48f);
37
+ --kt-selection-bg: light-dark(#36743f, #36743f);
38
+ --kt-selection-fg: light-dark(#ffffff, #ffffff);
39
39
 
40
40
  /* ============ Boutons ============ */
41
41
  --btn-tonal-weight: 18%; /* containers « jeune pousse » un peu présents */
42
- --btn-on-primary-container: #1f4a28;
43
- --btn-on-danger-container: #6e2a18;
44
- --btn-on-neutral-container: #3a3328;
42
+ --btn-on-primary-container: light-dark(#1f4a28, #b6eac1);
43
+ --btn-on-danger-container: light-dark(#6e2a18, #fcd0c5);
44
+ --btn-on-neutral-container: light-dark(#3a3328, #e0d5c3);
45
45
  --btn-shadow: 0 1px 3px rgb(42 51 38 / 14%); /* légère assise, comme posé sur la terre */
46
46
  --btn-shadow-hover: 0 4px 14px rgb(54 116 63 / 22%); /* halo de sève au survol */
47
47
  --btn-transition: transform 150ms ease, box-shadow 150ms ease;
@@ -49,12 +49,12 @@
49
49
  --btn-transform-active: scale(0.98);
50
50
 
51
51
  /* ============ Select / tooltip ============ */
52
- --select-popup-bg: #fdfcf5;
52
+ --select-popup-bg: light-dark(#fdfcf5, #222b1e);
53
53
  --select-popup-shadow: 0 8px 24px rgb(42 51 38 / 18%);
54
54
  --kt-sheet-scrim: rgb(42 51 38 / 40%);
55
55
  --kt-sheet-shadow: 0 -8px 24px rgb(42 51 38 / 18%); /* assise douce vert-de-gris */
56
- --tooltip-bg: #33402c; /* sous-bois */
57
- --tooltip-fg: #eef2e4;
56
+ --tooltip-bg: light-dark(#33402c, #e7e3d2); /* sous-bois */
57
+ --tooltip-fg: light-dark(#eef2e4, #182116);
58
58
 
59
59
  /* ============ Dialog (organique : feuille à l'échelle du dialog, ombre douce héritée) ============ */
60
60
  --dialog-radius: 24px 6px 24px 6px;
@@ -62,8 +62,8 @@
62
62
 
63
63
  /* ============ Card : FEUILLE organique (coins asymétriques, assise teintée sève, se déploie) ============ */
64
64
  --card-radius: 20px 6px 20px 6px;
65
- --card-bg: #fdfcf5;
66
- --card-filled-bg: #eef0e2;
65
+ --card-bg: light-dark(#fdfcf5, #222b1e);
66
+ --card-filled-bg: light-dark(#eef0e2, #2c3826);
67
67
  --card-shadow: 0 4px 16px rgb(54 116 63 / 14%), 0 1px 3px rgb(42 51 38 / 10%); /* assise + sève */
68
68
  --card-shadow-hover: 0 10px 26px rgb(54 116 63 / 20%), 0 2px 6px rgb(42 51 38 / 12%);
69
69
  --card-transition: transform 150ms ease, box-shadow 150ms ease;
@@ -23,6 +23,7 @@
23
23
  border-radius: var(--tooltip-radius);
24
24
  background: var(--tooltip-bg);
25
25
  color: var(--tooltip-fg);
26
+ backdrop-filter: var(--kt-backdrop-filter, none);
26
27
  font-size: 0.85rem;
27
28
  line-height: 1.35;
28
29
  white-space: pre-line; /* Interprète les \n et les sauts de ligne dans les chaînes de texte */
@@ -1,10 +1,10 @@
1
1
  import * as i0 from '@angular/core';
2
2
  import { OnInit, OnDestroy, Provider } from '@angular/core';
3
3
  import { DialogConfig, DialogRef, CdkDialogContainer } from '@angular/cdk/dialog';
4
+ import { ComponentType } from '@angular/cdk/portal';
4
5
  import * as _ktortu_aaa_dialog from '@ktortu/aaa/dialog';
5
6
  import { Observable } from 'rxjs';
6
7
  import { KtButtonColor } from '@ktortu/aaa/button';
7
- import { ComponentType } from '@angular/cdk/portal';
8
8
 
9
9
  /**
10
10
  * À poser sur le titre VISIBLE (idéalement un `<h2>`) du contenu d'un CDK Dialog.
@@ -370,6 +370,12 @@ declare class KtDialogContainer extends CdkDialogContainer {
370
370
  static ɵcmp: i0.ɵɵComponentDeclaration<KtDialogContainer, "kt-dialog-container", never, {}, {}, never, never, true, never>;
371
371
  }
372
372
 
373
+ /**
374
+ * Import ergonomique de toute la famille dialog en une fois :
375
+ * `imports: [KtDialogImports]` au lieu d'énumérer chaque directive structurelle.
376
+ */
377
+ declare const KtDialogImports: readonly [typeof KtDialogHeader, typeof KtDialogTitle, typeof KtDialogDescription, typeof KtDialogContent, typeof KtDialogActions, typeof KtDialogClose, typeof KtDialogFocusInitial, typeof KtDialogSheetHandle];
378
+
373
379
  /** Option de variante visuelle pour le dialogue d'alerte. */
374
380
  type KtAlertDialogVariant = 'neutral' | 'info' | 'success' | 'warning' | 'error';
375
381
  /**
@@ -515,11 +521,5 @@ declare class KtQuickDialog {
515
521
  static ɵprov: i0.ɵɵInjectableDeclaration<KtQuickDialog>;
516
522
  }
517
523
 
518
- /**
519
- * Import ergonomique de toute la famille dialog en une fois :
520
- * `imports: [KtDialogImports]` au lieu d'énumérer chaque directive structurelle.
521
- */
522
- declare const KtDialogImports: readonly [typeof KtDialogHeader, typeof KtDialogTitle, typeof KtDialogDescription, typeof KtDialogContent, typeof KtDialogActions, typeof KtDialogClose, typeof KtDialogFocusInitial, typeof KtDialogSheetHandle];
523
-
524
524
  export { KT_DIALOG_AAA_DEFAULTS, KtAlertDialog, KtConfirmDialog, KtDialogActions, KtDialogClose, KtDialogContainer, KtDialogContent, KtDialogDescription, KtDialogFocusInitial, KtDialogHeader, KtDialogImports, KtDialogSheetHandle, KtDialogTitle, KtQuickDialog, defineKtDialog, injectAlertDialog, injectConfirmDialog, injectKtDialogOpener, provideKtDialogDefaults, resolveKtDialogPanelClass };
525
525
  export type { KtAlertData, KtAlertDialogVariant, KtAlertOptions, KtConfirmConfig, KtConfirmResult, KtDecideConfig, KtDialogColor, KtDialogContract, KtDialogOpenerConfig, KtDialogPresentation };
@@ -66,6 +66,10 @@ interface KtFieldConfig {
66
66
  appearance: KtFieldAppearance;
67
67
  /** Politique du label flottant en `outline` (`auto` | `always`). Défaut : `'auto'`. */
68
68
  floatLabel: KtFloatLabel;
69
+ /** Masquer visuellement le label (tout en le gardant dans le DOM pour l'accessibilité). Défaut : `false`. */
70
+ hideLabel: boolean;
71
+ /** Masquer visuellement le bloc d'erreur (tout en le gardant dans le DOM pour l'accessibilité). Défaut : `false`. */
72
+ hideErrors: boolean;
69
73
  }
70
74
  declare const KT_FIELD_CONFIG: InjectionToken<Partial<KtFieldConfig>>;
71
75
  /**
@@ -153,6 +157,10 @@ declare class KtField implements KtFieldParent {
153
157
  readonly hideHintWhenInvalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
154
158
  /** Afficher toutes les erreurs au lieu de la première seule. @default KT_FIELD_CONFIG.showAllErrors ?? false */
155
159
  readonly showAllErrors: _angular_core.InputSignalWithTransform<boolean, unknown>;
160
+ /** Masquer visuellement le label. @default KT_FIELD_CONFIG.hideLabel ?? false */
161
+ readonly hideLabel: _angular_core.InputSignalWithTransform<boolean, unknown>;
162
+ /** Masquer visuellement le bloc d'erreur. @default KT_FIELD_CONFIG.hideErrors ?? false */
163
+ readonly hideErrors: _angular_core.InputSignalWithTransform<boolean, unknown>;
156
164
  /** Apparence du chrome : `fill` (label au-dessus) ou `outline` (bordure + label flottant, façon
157
165
  Material). Non fournie ⇒ valeur du `KT_FIELD_CONFIG`, sinon `'fill'`. @default undefined */
158
166
  readonly appearance: _angular_core.InputSignal<KtFieldAppearance | undefined>;
@@ -180,7 +188,7 @@ declare class KtField implements KtFieldParent {
180
188
  readonly describedBy: _angular_core.Signal<string | null>;
181
189
  protected onHelpClick(event: MouseEvent): void;
182
190
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<KtField, never>;
183
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<KtField, "kt-field", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "helpText": { "alias": "helpText"; "required": false; "isSignal": true; }; "helpLabel": { "alias": "helpLabel"; "required": false; "isSignal": true; }; "customDescribedBy": { "alias": "customDescribedBy"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "fieldId": { "alias": "fieldId"; "required": false; "isSignal": true; }; "hideHintWhenInvalid": { "alias": "hideHintWhenInvalid"; "required": false; "isSignal": true; }; "showAllErrors": { "alias": "showAllErrors"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "floatLabel": { "alias": "floatLabel"; "required": false; "isSignal": true; }; }, { "helpClick": "helpClick"; }, ["control"], ["[ktFieldHelp]", "*"], true, never>;
191
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<KtField, "kt-field", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "helpText": { "alias": "helpText"; "required": false; "isSignal": true; }; "helpLabel": { "alias": "helpLabel"; "required": false; "isSignal": true; }; "customDescribedBy": { "alias": "customDescribedBy"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "fieldId": { "alias": "fieldId"; "required": false; "isSignal": true; }; "hideHintWhenInvalid": { "alias": "hideHintWhenInvalid"; "required": false; "isSignal": true; }; "showAllErrors": { "alias": "showAllErrors"; "required": false; "isSignal": true; }; "hideLabel": { "alias": "hideLabel"; "required": false; "isSignal": true; }; "hideErrors": { "alias": "hideErrors"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "floatLabel": { "alias": "floatLabel"; "required": false; "isSignal": true; }; }, { "helpClick": "helpClick"; }, ["control"], ["[ktFieldHelp]", "*"], true, never>;
184
192
  }
185
193
 
186
194
  /** Marque le contrôle (natif ou custom) d'un champ pour que `Field` y câble l'a11y
@@ -328,6 +336,10 @@ declare abstract class KtBaseInputField<T> {
328
336
  /** Politique du label flottant en outline (`auto` | `always`) ; non fournie ⇒ `KT_FIELD_CONFIG.floatLabel`
329
337
  ?? `'auto'`. En `always`, le label reste en haut même vide et le placeholder s'affiche. @default undefined */
330
338
  readonly floatLabel: _angular_core.InputSignal<KtFloatLabel | undefined>;
339
+ /** Masquer visuellement le label. @default KT_FIELD_CONFIG.hideLabel ?? false */
340
+ readonly hideLabel: _angular_core.InputSignalWithTransform<boolean, unknown>;
341
+ /** Masquer visuellement le bloc d'erreur. @default KT_FIELD_CONFIG.hideErrors ?? false */
342
+ readonly hideErrors: _angular_core.InputSignalWithTransform<boolean, unknown>;
331
343
  protected readonly inputRef: _angular_core.Signal<ElementRef<HTMLInputElement | HTMLTextAreaElement> | undefined>;
332
344
  private readonly matcher;
333
345
  protected readonly showInvalid: _angular_core.Signal<boolean>;
@@ -362,7 +374,7 @@ declare abstract class KtBaseInputField<T> {
362
374
  /** La valeur est-elle vide (affichage du bouton d'effacement) ? */
363
375
  protected abstract isEmpty(value: T): boolean;
364
376
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<KtBaseInputField<any>, never>;
365
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<KtBaseInputField<any>, never, never, { "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "dirty": { "alias": "dirty"; "required": false; "isSignal": true; }; "pending": { "alias": "pending"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "helpText": { "alias": "helpText"; "required": false; "isSignal": true; }; "helpLabel": { "alias": "helpLabel"; "required": false; "isSignal": true; }; "customDescribedBy": { "alias": "customDescribedBy"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "prefix": { "alias": "prefix"; "required": false; "isSignal": true; }; "suffix": { "alias": "suffix"; "required": false; "isSignal": true; }; "clearLabel": { "alias": "clearLabel"; "required": false; "isSignal": true; }; "errorMatcher": { "alias": "errorMatcher"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "floatLabel": { "alias": "floatLabel"; "required": false; "isSignal": true; }; }, { "touched": "touchedChange"; "helpClick": "helpClick"; }, never, never, true, never>;
377
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<KtBaseInputField<any>, never, never, { "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "dirty": { "alias": "dirty"; "required": false; "isSignal": true; }; "pending": { "alias": "pending"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "helpText": { "alias": "helpText"; "required": false; "isSignal": true; }; "helpLabel": { "alias": "helpLabel"; "required": false; "isSignal": true; }; "customDescribedBy": { "alias": "customDescribedBy"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "prefix": { "alias": "prefix"; "required": false; "isSignal": true; }; "suffix": { "alias": "suffix"; "required": false; "isSignal": true; }; "clearLabel": { "alias": "clearLabel"; "required": false; "isSignal": true; }; "errorMatcher": { "alias": "errorMatcher"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "floatLabel": { "alias": "floatLabel"; "required": false; "isSignal": true; }; "hideLabel": { "alias": "hideLabel"; "required": false; "isSignal": true; }; "hideErrors": { "alias": "hideErrors"; "required": false; "isSignal": true; }; }, { "touched": "touchedChange"; "helpClick": "helpClick"; }, never, never, true, never>;
366
378
  }
367
379
 
368
380
  /** Suggestion d'un champ de saisie (rendu `<datalist>`) : soit la valeur seule, soit un couple
@@ -982,6 +994,10 @@ declare abstract class KtBaseSelect<T, V = T> {
982
994
  /** Politique du label flottant en outline (`auto` | `always`) ; non fournie ⇒ `KT_FIELD_CONFIG.floatLabel`
983
995
  ?? `'auto'`. @default undefined */
984
996
  readonly floatLabel: _angular_core.InputSignal<KtFloatLabel | undefined>;
997
+ /** Masquer visuellement le label. @default KT_FIELD_CONFIG.hideLabel ?? false */
998
+ readonly hideLabel: _angular_core.InputSignalWithTransform<boolean, unknown>;
999
+ /** Masquer visuellement le bloc d'erreur. @default KT_FIELD_CONFIG.hideErrors ?? false */
1000
+ readonly hideErrors: _angular_core.InputSignalWithTransform<boolean, unknown>;
985
1001
  /** Affiche un champ de recherche en tête du popup (desktop) / de la sheet (téléphone).
986
1002
  Pour les listes longues ; le texte tapé ne sert qu'à filtrer (réinitialisé à la fermeture). @default false */
987
1003
  readonly filterable: _angular_core.InputSignalWithTransform<boolean, unknown>;
@@ -1086,7 +1102,7 @@ declare abstract class KtBaseSelect<T, V = T> {
1086
1102
  protected onDragStart(event: PointerEvent): void;
1087
1103
  private animateAndCloseSelect;
1088
1104
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<KtBaseSelect<any, any>, never>;
1089
- static ɵdir: _angular_core.ɵɵDirectiveDeclaration<KtBaseSelect<any, any>, never, never, { "options": { "alias": "options"; "required": true; "isSignal": true; }; "optionLabel": { "alias": "optionLabel"; "required": false; "isSignal": true; }; "optionValue": { "alias": "optionValue"; "required": false; "isSignal": true; }; "optionDisabled": { "alias": "optionDisabled"; "required": false; "isSignal": true; }; "compareWith": { "alias": "compareWith"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "dirty": { "alias": "dirty"; "required": false; "isSignal": true; }; "pending": { "alias": "pending"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "helpText": { "alias": "helpText"; "required": false; "isSignal": true; }; "helpLabel": { "alias": "helpLabel"; "required": false; "isSignal": true; }; "customDescribedBy": { "alias": "customDescribedBy"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "errorMatcher": { "alias": "errorMatcher"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "floatLabel": { "alias": "floatLabel"; "required": false; "isSignal": true; }; "filterable": { "alias": "filterable"; "required": false; "isSignal": true; }; "filterPlaceholder": { "alias": "filterPlaceholder"; "required": false; "isSignal": true; }; "filterLabel": { "alias": "filterLabel"; "required": false; "isSignal": true; }; "filterFn": { "alias": "filterFn"; "required": false; "isSignal": true; }; "maxVisibleOptions": { "alias": "maxVisibleOptions"; "required": false; "isSignal": true; }; "truncatedResultsText": { "alias": "truncatedResultsText"; "required": false; "isSignal": true; }; "truncatedResultsAnnouncement": { "alias": "truncatedResultsAnnouncement"; "required": false; "isSignal": true; }; }, { "helpClick": "helpClick"; "touched": "touchedChange"; }, never, never, true, never>;
1105
+ static ɵdir: _angular_core.ɵɵDirectiveDeclaration<KtBaseSelect<any, any>, never, never, { "options": { "alias": "options"; "required": true; "isSignal": true; }; "optionLabel": { "alias": "optionLabel"; "required": false; "isSignal": true; }; "optionValue": { "alias": "optionValue"; "required": false; "isSignal": true; }; "optionDisabled": { "alias": "optionDisabled"; "required": false; "isSignal": true; }; "compareWith": { "alias": "compareWith"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "dirty": { "alias": "dirty"; "required": false; "isSignal": true; }; "pending": { "alias": "pending"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "helpText": { "alias": "helpText"; "required": false; "isSignal": true; }; "helpLabel": { "alias": "helpLabel"; "required": false; "isSignal": true; }; "customDescribedBy": { "alias": "customDescribedBy"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "errorMatcher": { "alias": "errorMatcher"; "required": false; "isSignal": true; }; "appearance": { "alias": "appearance"; "required": false; "isSignal": true; }; "floatLabel": { "alias": "floatLabel"; "required": false; "isSignal": true; }; "hideLabel": { "alias": "hideLabel"; "required": false; "isSignal": true; }; "hideErrors": { "alias": "hideErrors"; "required": false; "isSignal": true; }; "filterable": { "alias": "filterable"; "required": false; "isSignal": true; }; "filterPlaceholder": { "alias": "filterPlaceholder"; "required": false; "isSignal": true; }; "filterLabel": { "alias": "filterLabel"; "required": false; "isSignal": true; }; "filterFn": { "alias": "filterFn"; "required": false; "isSignal": true; }; "maxVisibleOptions": { "alias": "maxVisibleOptions"; "required": false; "isSignal": true; }; "truncatedResultsText": { "alias": "truncatedResultsText"; "required": false; "isSignal": true; }; "truncatedResultsAnnouncement": { "alias": "truncatedResultsAnnouncement"; "required": false; "isSignal": true; }; }, { "helpClick": "helpClick"; "touched": "touchedChange"; }, never, never, true, never>;
1090
1106
  }
1091
1107
 
1092
1108
  /** Contexte typé reçu par le template d'une option (`ktSelectOption`). */
@@ -1495,6 +1511,10 @@ declare class KtChipListbox<V> implements FormValueControl<V | V[] | null> {
1495
1511
  readonly hint: _angular_core.InputSignal<string | undefined>;
1496
1512
  /** Nom accessible (aria-label) quand label est absent. @default undefined */
1497
1513
  readonly ariaLabel: _angular_core.InputSignal<string | undefined>;
1514
+ /** Masquer visuellement le label. @default KT_FIELD_CONFIG.hideLabel ?? false */
1515
+ readonly hideLabel: _angular_core.InputSignalWithTransform<boolean, unknown>;
1516
+ /** Masquer visuellement le bloc d'erreur. @default KT_FIELD_CONFIG.hideErrors ?? false */
1517
+ readonly hideErrors: _angular_core.InputSignalWithTransform<boolean, unknown>;
1498
1518
  /** Stratégie d'affichage des erreurs. @default undefined */
1499
1519
  readonly errorMatcher: _angular_core.InputSignal<KtFieldErrorMatcher | undefined>;
1500
1520
  /** Afficher toutes les erreurs. @default false */
@@ -1528,7 +1548,7 @@ declare class KtChipListbox<V> implements FormValueControl<V | V[] | null> {
1528
1548
  /** Focus la première option active. */
1529
1549
  focus(options?: FocusOptions): void;
1530
1550
  static ɵfac: _angular_core.ɵɵFactoryDeclaration<KtChipListbox<any>, never>;
1531
- static ɵcmp: _angular_core.ɵɵComponentDeclaration<KtChipListbox<any>, "kt-chip-listbox", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "dirty": { "alias": "dirty"; "required": false; "isSignal": true; }; "pending": { "alias": "pending"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "errorMatcher": { "alias": "errorMatcher"; "required": false; "isSignal": true; }; "showAllErrors": { "alias": "showAllErrors"; "required": false; "isSignal": true; }; "compareWith": { "alias": "compareWith"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touched": "touchedChange"; }, never, ["*"], true, never>;
1551
+ static ɵcmp: _angular_core.ɵɵComponentDeclaration<KtChipListbox<any>, "kt-chip-listbox", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "touched": { "alias": "touched"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "dirty": { "alias": "dirty"; "required": false; "isSignal": true; }; "pending": { "alias": "pending"; "required": false; "isSignal": true; }; "errors": { "alias": "errors"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "id": { "alias": "id"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "hideLabel": { "alias": "hideLabel"; "required": false; "isSignal": true; }; "hideErrors": { "alias": "hideErrors"; "required": false; "isSignal": true; }; "errorMatcher": { "alias": "errorMatcher"; "required": false; "isSignal": true; }; "showAllErrors": { "alias": "showAllErrors"; "required": false; "isSignal": true; }; "compareWith": { "alias": "compareWith"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "touched": "touchedChange"; }, never, ["*"], true, never>;
1532
1552
  }
1533
1553
 
1534
1554
  /**