@zevra/ui 0.44.1 → 0.46.0
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/DECISIONS.md +63 -0
- package/dist/actions.d.ts +10 -3
- package/dist/actions.d.ts.map +1 -1
- package/dist/actions.js +8 -5
- package/dist/actions.js.map +1 -1
- package/dist/catalogue.d.ts.map +1 -1
- package/dist/catalogue.js +21 -3
- package/dist/catalogue.js.map +1 -1
- package/dist/content.d.ts +17 -1
- package/dist/content.d.ts.map +1 -1
- package/dist/content.js +11 -3
- package/dist/content.js.map +1 -1
- package/dist/css-inline.d.ts.map +1 -1
- package/dist/css-inline.js +1 -1
- package/dist/css-inline.js.map +1 -1
- package/dist/cx.d.ts +9 -0
- package/dist/cx.d.ts.map +1 -1
- package/dist/cx.js +4 -0
- package/dist/cx.js.map +1 -1
- package/dist/feedback.d.ts +9 -2
- package/dist/feedback.d.ts.map +1 -1
- package/dist/feedback.js +5 -5
- package/dist/feedback.js.map +1 -1
- package/dist/forms.d.ts +13 -3
- package/dist/forms.d.ts.map +1 -1
- package/dist/forms.js +7 -7
- package/dist/forms.js.map +1 -1
- package/dist/icon.d.ts +5 -1
- package/dist/icon.d.ts.map +1 -1
- package/dist/icon.js +3 -3
- package/dist/icon.js.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js.map +1 -1
- package/package.json +5 -5
- package/react/actions.tsx +15 -2
- package/react/catalogue.tsx +40 -2
- package/react/content.tsx +22 -1
- package/react/css-inline.ts +1 -1
- package/react/cx.ts +13 -0
- package/react/feedback.tsx +11 -2
- package/react/forms.tsx +16 -7
- package/react/icon.tsx +6 -2
- package/react/index.ts +1 -1
- package/src/components.css +20 -2
- package/src/data.css +10 -3
- package/src/feedback.css +3 -2
- package/src/forms.css +7 -4
- package/src/navigation.css +3 -3
- package/src/tokens.css +28 -0
package/dist/css-inline.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"css-inline.js","sourceRoot":"","sources":["../react/css-inline.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,0EAA0E;AAE1E;;;iEAGiE;AACjE,MAAM,CAAC,MAAM,WAAW,GAAW,
|
|
1
|
+
{"version":3,"file":"css-inline.js","sourceRoot":"","sources":["../react/css-inline.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,0EAA0E;AAE1E;;;iEAGiE;AACjE,MAAM,CAAC,MAAM,WAAW,GAAW,s/iTAAs/iT,CAAA;AAEzhjT;;;yBAGyB;AACzB,MAAM,CAAC,MAAM,WAAW,GAAW,y3BAAy3B,CAAA"}
|
package/dist/cx.d.ts
CHANGED
|
@@ -13,4 +13,13 @@ export declare function cx(...parts: (string | false | null | undefined)[]): str
|
|
|
13
13
|
* `mod('zv-btn', undefined)` → `''`
|
|
14
14
|
*/
|
|
15
15
|
export declare function mod(base: string, variante?: string | null): string;
|
|
16
|
+
/**
|
|
17
|
+
* Les angles d'un composant (DECISIONS.md, « Les angles arrondis, en
|
|
18
|
+
* option ») : `vifs` est le défaut de la charte, `arrondis` l'option. Sans
|
|
19
|
+
* valeur, le composant suit son conteneur : c'est ce qui laisse une app
|
|
20
|
+
* entière s'arrondir d'une seule enveloppe `Angles`.
|
|
21
|
+
*/
|
|
22
|
+
export type ChoixAngles = 'vifs' | 'arrondis';
|
|
23
|
+
/** La classe qui redéfinit les tokens de rayon, ou rien pour suivre le conteneur. */
|
|
24
|
+
export declare function classeAngles(angles?: ChoixAngles | null): string;
|
|
16
25
|
//# sourceMappingURL=cx.d.ts.map
|
package/dist/cx.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cx.d.ts","sourceRoot":"","sources":["../react/cx.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,wBAAgB,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC,MAAM,GAAG,KAAK,GAAG,IAAI,GAAG,SAAS,CAAC,EAAE,GAAG,MAAM,CAE1E;AAED;;;;;GAKG;AACH,wBAAgB,GAAG,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,CAElE"}
|
|
1
|
+
{"version":3,"file":"cx.d.ts","sourceRoot":"","sources":["../react/cx.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,wBAAgB,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC,MAAM,GAAG,KAAK,GAAG,IAAI,GAAG,SAAS,CAAC,EAAE,GAAG,MAAM,CAE1E;AAED;;;;;GAKG;AACH,wBAAgB,GAAG,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,CAElE;AAED;;;;;GAKG;AACH,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,UAAU,CAAA;AAE7C,qFAAqF;AACrF,wBAAgB,YAAY,CAAC,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,GAAG,MAAM,CAEhE"}
|
package/dist/cx.js
CHANGED
|
@@ -17,4 +17,8 @@ export function cx(...parts) {
|
|
|
17
17
|
export function mod(base, variante) {
|
|
18
18
|
return variante ? `${base}--${variante}` : '';
|
|
19
19
|
}
|
|
20
|
+
/** La classe qui redéfinit les tokens de rayon, ou rien pour suivre le conteneur. */
|
|
21
|
+
export function classeAngles(angles) {
|
|
22
|
+
return angles === 'arrondis' ? 'zv-arrondi' : angles === 'vifs' ? 'zv-vif' : '';
|
|
23
|
+
}
|
|
20
24
|
//# sourceMappingURL=cx.js.map
|
package/dist/cx.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cx.js","sourceRoot":"","sources":["../react/cx.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,MAAM,UAAU,EAAE,CAAC,GAAG,KAA4C;IAChE,OAAO,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;AACxC,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,GAAG,CAAC,IAAY,EAAE,QAAwB;IACxD,OAAO,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI,KAAK,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAA;AAC/C,CAAC"}
|
|
1
|
+
{"version":3,"file":"cx.js","sourceRoot":"","sources":["../react/cx.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,MAAM,UAAU,EAAE,CAAC,GAAG,KAA4C;IAChE,OAAO,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;AACxC,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,GAAG,CAAC,IAAY,EAAE,QAAwB;IACxD,OAAO,QAAQ,CAAC,CAAC,CAAC,GAAG,IAAI,KAAK,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAA;AAC/C,CAAC;AAUD,qFAAqF;AACrF,MAAM,UAAU,YAAY,CAAC,MAA2B;IACtD,OAAO,MAAM,KAAK,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAA;AACjF,CAAC"}
|
package/dist/feedback.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { HTMLAttributes, ReactNode } from 'react';
|
|
2
|
+
import { type ChoixAngles } from './cx.js';
|
|
2
3
|
type Div = Omit<HTMLAttributes<HTMLDivElement>, 'className'>;
|
|
3
4
|
type Span = Omit<HTMLAttributes<HTMLSpanElement>, 'className'>;
|
|
4
5
|
export type AlertTon = 'info' | 'ok' | 'warn' | 'err' | 'dash';
|
|
@@ -9,9 +10,12 @@ export interface AlertProps extends Div {
|
|
|
9
10
|
/** `sm` resserre, `lg` amplifie : ce dernier pour le message qui REMPLACE
|
|
10
11
|
* un contenu attendu (incident, réponse impossible). */
|
|
11
12
|
taille?: 'sm' | 'normal' | 'lg';
|
|
13
|
+
/** `arrondis` (option) ou `vifs` (défaut de la charte). Sans valeur, le
|
|
14
|
+
* composant suit son conteneur : voir `Angles`. */
|
|
15
|
+
angles?: ChoixAngles;
|
|
12
16
|
className?: string;
|
|
13
17
|
}
|
|
14
|
-
export declare function Alert({ ton, taille, className, ...reste }: AlertProps): import("react").JSX.Element;
|
|
18
|
+
export declare function Alert({ ton, taille, angles, className, ...reste }: AlertProps): import("react").JSX.Element;
|
|
15
19
|
export type BadgeTon = 'neutre' | 'accent' | 'ok' | 'warn' | 'err';
|
|
16
20
|
export interface BadgeProps extends Span {
|
|
17
21
|
ton?: BadgeTon;
|
|
@@ -20,12 +24,15 @@ export interface BadgeProps extends Span {
|
|
|
20
24
|
gabarit?: 'micro' | 'state';
|
|
21
25
|
/** Pastille en tête, de la couleur du texte. */
|
|
22
26
|
pastille?: boolean;
|
|
27
|
+
/** `arrondis` (option) ou `vifs` (défaut de la charte). Sans valeur, le
|
|
28
|
+
* composant suit son conteneur : voir `Angles`. */
|
|
29
|
+
angles?: ChoixAngles;
|
|
23
30
|
className?: string;
|
|
24
31
|
children?: ReactNode;
|
|
25
32
|
}
|
|
26
33
|
/** Le libellé s'écrit EN CAPITALES dans le contenu, pas en CSS : transformé
|
|
27
34
|
* par le navigateur, « INDEXÉ » se casse selon la locale. */
|
|
28
|
-
export declare function Badge({ ton, gabarit, pastille, className, children, ...reste }: BadgeProps): import("react").JSX.Element;
|
|
35
|
+
export declare function Badge({ ton, gabarit, pastille, angles, className, children, ...reste }: BadgeProps): import("react").JSX.Element;
|
|
29
36
|
export type DotEtat = 'recu' | 'ocr' | 'indexation' | 'indexe' | 'ok' | 'erreur';
|
|
30
37
|
export interface DotProps extends Span {
|
|
31
38
|
/** Sans état, la pastille reste GRISE : un statut inconnu (ajouté côté
|
package/dist/feedback.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"feedback.d.ts","sourceRoot":"","sources":["../react/feedback.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"feedback.d.ts","sourceRoot":"","sources":["../react/feedback.tsx"],"names":[],"mappings":"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"}
|
package/dist/feedback.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { cx } from './cx.js';
|
|
3
|
-
export function Alert({ ton, taille = 'normal', className, ...reste }) {
|
|
4
|
-
return (_jsx("div", { role: "alert", className: cx('zv-alert', `zv-alert--${ton}`, taille === 'sm' && 'zv-alert--sm', taille === 'lg' && 'zv-alert--lg', className), ...reste }));
|
|
2
|
+
import { classeAngles, cx } from './cx.js';
|
|
3
|
+
export function Alert({ ton, taille = 'normal', angles, className, ...reste }) {
|
|
4
|
+
return (_jsx("div", { role: "alert", className: cx('zv-alert', `zv-alert--${ton}`, taille === 'sm' && 'zv-alert--sm', taille === 'lg' && 'zv-alert--lg', classeAngles(angles), className), ...reste }));
|
|
5
5
|
}
|
|
6
6
|
/** Le libellé s'écrit EN CAPITALES dans le contenu, pas en CSS : transformé
|
|
7
7
|
* par le navigateur, « INDEXÉ » se casse selon la locale. */
|
|
8
|
-
export function Badge({ ton = 'neutre', gabarit, pastille, className, children, ...reste }) {
|
|
9
|
-
return (_jsxs("span", { className: cx('zv-badge', `zv-badge--${ton}`, gabarit === 'micro' && 'zv-badge--micro', gabarit === 'state' && 'zv-badge--state', pastille && 'zv-badge--dot', className), ...reste, children: [pastille && _jsx("span", { className: "zv-dot", "aria-hidden": "true" }), children] }));
|
|
8
|
+
export function Badge({ ton = 'neutre', gabarit, pastille, angles, className, children, ...reste }) {
|
|
9
|
+
return (_jsxs("span", { className: cx('zv-badge', `zv-badge--${ton}`, gabarit === 'micro' && 'zv-badge--micro', gabarit === 'state' && 'zv-badge--state', pastille && 'zv-badge--dot', classeAngles(angles), className), ...reste, children: [pastille && _jsx("span", { className: "zv-dot", "aria-hidden": "true" }), children] }));
|
|
10
10
|
}
|
|
11
11
|
export function Dot({ etat, taille = 'normal', carree, className, ...reste }) {
|
|
12
12
|
return (_jsx("span", { "aria-hidden": "true", className: cx('zv-dot', etat && `zv-dot--${etat}`, taille === 'sm' && 'zv-dot--sm', taille === 'lg' && 'zv-dot--lg', carree && 'zv-dot--square', className), ...reste }));
|
package/dist/feedback.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"feedback.js","sourceRoot":"","sources":["../react/feedback.tsx"],"names":[],"mappings":";AAWA,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAA;
|
|
1
|
+
{"version":3,"file":"feedback.js","sourceRoot":"","sources":["../react/feedback.tsx"],"names":[],"mappings":"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"}
|
package/dist/forms.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { ButtonHTMLAttributes, HTMLAttributes, InputHTMLAttributes, ReactNode, SelectHTMLAttributes, TextareaHTMLAttributes } from 'react';
|
|
2
|
+
import { type ChoixAngles } from './cx.js';
|
|
2
3
|
export interface FieldProps extends Omit<HTMLAttributes<HTMLDivElement>, 'className'> {
|
|
3
4
|
label?: ReactNode;
|
|
4
5
|
/** Identifiant du contrôle enveloppé : à répéter en `id` sur le contrôle. */
|
|
@@ -25,14 +26,20 @@ export interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>,
|
|
|
25
26
|
/** Pose `aria-invalid` : c'est lui qui rend l'erreur audible, et le CSS le
|
|
26
27
|
* suit autant que la classe. */
|
|
27
28
|
erreur?: boolean;
|
|
29
|
+
/** `arrondis` (option) ou `vifs` (défaut de la charte). Sans valeur, le
|
|
30
|
+
* composant suit son conteneur : voir `Angles`. */
|
|
31
|
+
angles?: ChoixAngles;
|
|
28
32
|
className?: string;
|
|
29
33
|
}
|
|
30
|
-
export declare function Input({ mono, nu, erreur, className, ...reste }: InputProps): import("react").JSX.Element;
|
|
34
|
+
export declare function Input({ mono, nu, erreur, angles, className, ...reste }: InputProps): import("react").JSX.Element;
|
|
31
35
|
export interface TextareaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'className'> {
|
|
32
36
|
erreur?: boolean;
|
|
37
|
+
/** `arrondis` (option) ou `vifs` (défaut de la charte). Sans valeur, le
|
|
38
|
+
* composant suit son conteneur : voir `Angles`. */
|
|
39
|
+
angles?: ChoixAngles;
|
|
33
40
|
className?: string;
|
|
34
41
|
}
|
|
35
|
-
export declare function Textarea({ erreur, className, ...reste }: TextareaProps): import("react").JSX.Element;
|
|
42
|
+
export declare function Textarea({ erreur, angles, className, ...reste }: TextareaProps): import("react").JSX.Element;
|
|
36
43
|
/** <select> NATIF habillé comme le champ : la flèche, l'ouverture au clavier
|
|
37
44
|
* et l'annonce viennent du navigateur. C'est le motif de choix par défaut :
|
|
38
45
|
* `SelectTrigger` est un menu maison, à réserver aux filtres. */
|
|
@@ -40,12 +47,15 @@ export declare function Select({ className, ...reste }: Omit<SelectHTMLAttribute
|
|
|
40
47
|
className?: string;
|
|
41
48
|
}): import("react").JSX.Element;
|
|
42
49
|
export interface SearchProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'className'> {
|
|
50
|
+
/** `arrondis` (option) ou `vifs` (défaut de la charte). Sans valeur, le
|
|
51
|
+
* composant suit son conteneur : voir `Angles`. */
|
|
52
|
+
angles?: ChoixAngles;
|
|
43
53
|
/** Enveloppe : c'est elle qui porte le cadre et la largeur. */
|
|
44
54
|
className?: string;
|
|
45
55
|
}
|
|
46
56
|
/** Cadre + loupe + champ nu. La loupe est dans le balisage (et non un fond
|
|
47
57
|
* CSS) pour suivre `currentColor` et rester nette en zoom. */
|
|
48
|
-
export declare function Search({ className, ...reste }: SearchProps): import("react").JSX.Element;
|
|
58
|
+
export declare function Search({ angles, className, ...reste }: SearchProps): import("react").JSX.Element;
|
|
49
59
|
export declare function SelectAnchor({ className, ...reste }: Omit<HTMLAttributes<HTMLDivElement>, 'className'> & {
|
|
50
60
|
className?: string;
|
|
51
61
|
}): import("react").JSX.Element;
|
package/dist/forms.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"forms.d.ts","sourceRoot":"","sources":["../react/forms.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EACV,oBAAoB,EAEpB,cAAc,EACd,mBAAmB,EACnB,SAAS,EACT,oBAAoB,EACpB,sBAAsB,EACvB,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"forms.d.ts","sourceRoot":"","sources":["../react/forms.tsx"],"names":[],"mappings":"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"}
|
package/dist/forms.js
CHANGED
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { cx } from './cx.js';
|
|
2
|
+
import { classeAngles, cx } from './cx.js';
|
|
3
3
|
import { Icon } from './icon.js';
|
|
4
4
|
export function Field({ label, htmlFor, action, help, erreur, className, children, ...reste }) {
|
|
5
5
|
return (_jsxs("div", { className: cx('zv-field', !!erreur && 'zv-field--err', className), ...reste, children: [(label || action) &&
|
|
6
6
|
(action ? (_jsxs("div", { className: "zv-field__head", children: [_jsx("label", { className: "zv-field__label", htmlFor: htmlFor, children: label }), action] })) : (_jsx("label", { className: "zv-field__label", htmlFor: htmlFor, children: label }))), children, erreur ? (_jsx("span", { className: "zv-field__err", id: htmlFor ? `${htmlFor}-err` : undefined, children: erreur })) : (help && _jsx("span", { className: "zv-field__help", children: help }))] }));
|
|
7
7
|
}
|
|
8
|
-
export function Input({ mono, nu, erreur, className, ...reste }) {
|
|
9
|
-
return (_jsx("input", { className: cx('zv-input', mono && 'zv-input--mono', nu && 'zv-input--bare', className), "aria-invalid": erreur || undefined, ...reste }));
|
|
8
|
+
export function Input({ mono, nu, erreur, angles, className, ...reste }) {
|
|
9
|
+
return (_jsx("input", { className: cx('zv-input', mono && 'zv-input--mono', nu && 'zv-input--bare', classeAngles(angles), className), "aria-invalid": erreur || undefined, ...reste }));
|
|
10
10
|
}
|
|
11
|
-
export function Textarea({ erreur, className, ...reste }) {
|
|
12
|
-
return (_jsx("textarea", { className: cx('zv-textarea', className), "aria-invalid": erreur || undefined, ...reste }));
|
|
11
|
+
export function Textarea({ erreur, angles, className, ...reste }) {
|
|
12
|
+
return (_jsx("textarea", { className: cx('zv-textarea', classeAngles(angles), className), "aria-invalid": erreur || undefined, ...reste }));
|
|
13
13
|
}
|
|
14
14
|
/** <select> NATIF habillé comme le champ : la flèche, l'ouverture au clavier
|
|
15
15
|
* et l'annonce viennent du navigateur. C'est le motif de choix par défaut :
|
|
@@ -19,8 +19,8 @@ export function Select({ className, ...reste }) {
|
|
|
19
19
|
}
|
|
20
20
|
/** Cadre + loupe + champ nu. La loupe est dans le balisage (et non un fond
|
|
21
21
|
* CSS) pour suivre `currentColor` et rester nette en zoom. */
|
|
22
|
-
export function Search({ className, ...reste }) {
|
|
23
|
-
return (_jsxs("div", { className: cx('zv-search', className), children: [_jsxs("svg", { className: "zv-search__icon", viewBox: "0 0 13 13", fill: "none", strokeWidth: "1.5", "aria-hidden": "true", children: [_jsx("circle", { cx: "5.5", cy: "5.5", r: "4" }), _jsx("line", { x1: "8.6", y1: "8.6", x2: "12", y2: "12" })] }), _jsx("input", { type: "search", className: "zv-search__input", ...reste })] }));
|
|
22
|
+
export function Search({ angles, className, ...reste }) {
|
|
23
|
+
return (_jsxs("div", { className: cx('zv-search', classeAngles(angles), className), children: [_jsxs("svg", { className: "zv-search__icon", viewBox: "0 0 13 13", fill: "none", strokeWidth: "1.5", "aria-hidden": "true", children: [_jsx("circle", { cx: "5.5", cy: "5.5", r: "4" }), _jsx("line", { x1: "8.6", y1: "8.6", x2: "12", y2: "12" })] }), _jsx("input", { type: "search", className: "zv-search__input", ...reste })] }));
|
|
24
24
|
}
|
|
25
25
|
/* ─── Déclencheur de sélection (menu maison) ───────────────────────── */
|
|
26
26
|
export function SelectAnchor({ className, ...reste }) {
|
package/dist/forms.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"forms.js","sourceRoot":"","sources":["../react/forms.tsx"],"names":[],"mappings":";AAsBA,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAA;
|
|
1
|
+
{"version":3,"file":"forms.js","sourceRoot":"","sources":["../react/forms.tsx"],"names":[],"mappings":"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"}
|
package/dist/icon.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { ButtonHTMLAttributes, HTMLAttributes, ReactNode, SVGAttributes } from 'react';
|
|
2
|
+
import { type ChoixAngles } from './cx.js';
|
|
2
3
|
import { NOMS, type IconId } from './icon-data.js';
|
|
3
4
|
export type { IconId };
|
|
4
5
|
export { NOMS as NOMS_ICONES };
|
|
@@ -26,10 +27,13 @@ export interface IconButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonEle
|
|
|
26
27
|
* (« Croix ») : c'est ce que le lecteur d'écran annonce. */
|
|
27
28
|
label: string;
|
|
28
29
|
taille?: IconProps['taille'];
|
|
30
|
+
/** `arrondis` (option) ou `vifs` (défaut de la charte). Sans valeur, le
|
|
31
|
+
* composant suit son conteneur : voir `Angles`. */
|
|
32
|
+
angles?: ChoixAngles;
|
|
29
33
|
className?: string;
|
|
30
34
|
children?: ReactNode;
|
|
31
35
|
}
|
|
32
|
-
export declare function IconButton({ icone, label, taille, className, children, type, ...reste }: IconButtonProps): import("react").JSX.Element;
|
|
36
|
+
export declare function IconButton({ icone, label, taille, angles, className, children, type, ...reste }: IconButtonProps): import("react").JSX.Element;
|
|
33
37
|
export interface IconTileProps extends Omit<HTMLAttributes<HTMLSpanElement>, 'className'> {
|
|
34
38
|
nom: IconId;
|
|
35
39
|
/** Titre accessible. Sans lui la tuile est DÉCORATIVE, le bon défaut :
|
package/dist/icon.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../react/icon.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,oBAAoB,EAAE,cAAc,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../react/icon.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,oBAAoB,EAAE,cAAc,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAC3F,OAAO,EAAoB,KAAK,WAAW,EAAE,MAAM,SAAS,CAAA;AAC5D,OAAO,EAAS,IAAI,EAAE,KAAK,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAEzD,YAAY,EAAE,MAAM,EAAE,CAAA;AACtB,OAAO,EAAE,IAAI,IAAI,WAAW,EAAE,CAAA;AAE9B,gFAAgF;AAChF,eAAO,MAAM,MAAM,EAAyB,MAAM,EAAE,CAAA;AAEpD,MAAM,WAAW,SACf,SAAQ,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC,EAAE,WAAW,GAAG,UAAU,CAAC;IACpE,GAAG,EAAE,MAAM,CAAA;IACX;kDAC8C;IAC9C,MAAM,CAAC,EAAE,IAAI,GAAG,QAAQ,GAAG,IAAI,GAAG,IAAI,CAAA;IACtC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;yDAEqD;IACrD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,wBAAgB,IAAI,CAAC,EAAE,GAAG,EAAE,MAAiB,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,SAAS,+BAiB9F;AAED,MAAM,WAAW,eACf,SAAQ,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,WAAW,CAAC;IAClE;2EACuE;IACvE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;iEAE6D;IAC7D,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,SAAS,CAAC,QAAQ,CAAC,CAAA;IAC5B;wDACoD;IACpD,MAAM,CAAC,EAAE,WAAW,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB;AAED,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,KAAK,EACL,MAAa,EACb,MAAM,EACN,SAAS,EACT,QAAQ,EACR,IAAe,EACf,GAAG,KAAK,EACT,EAAE,eAAe,+BAWjB;AAID,MAAM,WAAW,aACf,SAAQ,IAAI,CAAC,cAAc,CAAC,eAAe,CAAC,EAAE,WAAW,CAAC;IAC1D,GAAG,EAAE,MAAM,CAAA;IACX;wDACoD;IACpD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;0DAE0D;AAC1D,wBAAgB,QAAQ,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,+BAM1E"}
|
package/dist/icon.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { cx } from './cx.js';
|
|
2
|
+
import { classeAngles, cx } from './cx.js';
|
|
3
3
|
import { CORPS, NOMS } from './icon-data.js';
|
|
4
4
|
export { NOMS as NOMS_ICONES };
|
|
5
5
|
/** Les 73 identifiants, triés : pour construire une planche ou un sélecteur. */
|
|
@@ -7,8 +7,8 @@ export const ICONES = Object.keys(CORPS);
|
|
|
7
7
|
export function Icon({ nom, taille = 'normal', discret, titre, className, ...reste }) {
|
|
8
8
|
return (_jsx("svg", { viewBox: "0 0 24 24", role: titre ? 'img' : undefined, "aria-hidden": titre ? undefined : true, "aria-label": titre, className: cx('zv-icon', taille !== 'normal' && `zv-icon--${taille}`, discret && 'zv-icon--quiet', className), dangerouslySetInnerHTML: { __html: CORPS[nom] }, ...reste }));
|
|
9
9
|
}
|
|
10
|
-
export function IconButton({ icone, label, taille = 'lg', className, children, type = 'button', ...reste }) {
|
|
11
|
-
return (_jsx("button", { type: type, "aria-label": label, className: cx('zv-icon-btn', className), ...reste, children: icone ? _jsx(Icon, { nom: icone, taille: taille }) : children }));
|
|
10
|
+
export function IconButton({ icone, label, taille = 'lg', angles, className, children, type = 'button', ...reste }) {
|
|
11
|
+
return (_jsx("button", { type: type, "aria-label": label, className: cx('zv-icon-btn', classeAngles(angles), className), ...reste, children: icone ? _jsx(Icon, { nom: icone, taille: taille }) : children }));
|
|
12
12
|
}
|
|
13
13
|
/** La pastille carrée qui porte une icône devant un argument de la vitrine
|
|
14
14
|
* (liste de garanties, grille d'atouts). UNE par argument, jamais en décor
|
package/dist/icon.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon.js","sourceRoot":"","sources":["../react/icon.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,EAAE,EAAE,MAAM,SAAS,CAAA;
|
|
1
|
+
{"version":3,"file":"icon.js","sourceRoot":"","sources":["../react/icon.tsx"],"names":[],"mappings":";AAQA,OAAO,EAAE,YAAY,EAAE,EAAE,EAAoB,MAAM,SAAS,CAAA;AAC5D,OAAO,EAAE,KAAK,EAAE,IAAI,EAAe,MAAM,gBAAgB,CAAA;AAGzD,OAAO,EAAE,IAAI,IAAI,WAAW,EAAE,CAAA;AAE9B,gFAAgF;AAChF,MAAM,CAAC,MAAM,MAAM,GAAG,MAAM,CAAC,IAAI,CAAC,KAAK,CAAa,CAAA;AAgBpD,MAAM,UAAU,IAAI,CAAC,EAAE,GAAG,EAAE,MAAM,GAAG,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAa;IAC7F,OAAO,CACL,cACE,OAAO,EAAC,WAAW,EACnB,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,iBAClB,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,gBACzB,KAAK,EACjB,SAAS,EAAE,EAAE,CACX,SAAS,EACT,MAAM,KAAK,QAAQ,IAAI,YAAY,MAAM,EAAE,EAC3C,OAAO,IAAI,gBAAgB,EAC3B,SAAS,CACV,EACD,uBAAuB,EAAE,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG,CAAC,EAAE,KAC3C,KAAK,GACT,CACH,CAAA;AACH,CAAC;AAmBD,MAAM,UAAU,UAAU,CAAC,EACzB,KAAK,EACL,KAAK,EACL,MAAM,GAAG,IAAI,EACb,MAAM,EACN,SAAS,EACT,QAAQ,EACR,IAAI,GAAG,QAAQ,EACf,GAAG,KAAK,EACQ;IAChB,OAAO,CACL,iBACE,IAAI,EAAE,IAAI,gBACE,KAAK,EACjB,SAAS,EAAE,EAAE,CAAC,aAAa,EAAE,YAAY,CAAC,MAAM,CAAC,EAAE,SAAS,CAAC,KACzD,KAAK,YAER,KAAK,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,GAAI,CAAC,CAAC,CAAC,QAAQ,GACjD,CACV,CAAA;AACH,CAAC;AAaD;;0DAE0D;AAC1D,MAAM,UAAU,QAAQ,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAiB;IACzE,OAAO,CACL,eAAM,SAAS,EAAE,EAAE,CAAC,cAAc,EAAE,SAAS,CAAC,KAAM,KAAK,YACvD,KAAC,IAAI,IAAC,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,GAAI,GAC3B,CACR,CAAA;AACH,CAAC"}
|
package/dist/index.d.ts
CHANGED
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../react/index.ts"],"names":[],"mappings":"AA6BA,OAAO,EAAE,EAAE,EAAE,GAAG,EAAE,MAAM,SAAS,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../react/index.ts"],"names":[],"mappings":"AA6BA,OAAO,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK,WAAW,EAAE,MAAM,SAAS,CAAA;AAEnD,cAAc,cAAc,CAAA;AAC5B,cAAc,cAAc,CAAA;AAC5B,cAAc,WAAW,CAAA;AACzB,cAAc,eAAe,CAAA;AAC7B,cAAc,YAAY,CAAA;AAC1B,cAAc,WAAW,CAAA;AACzB,cAAc,aAAa,CAAA;AAC3B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,eAAe,CAAA;AAC7B,cAAc,kBAAkB,CAAA;AAChC,cAAc,eAAe,CAAA;AAC7B,cAAc,iBAAiB,CAAA"}
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../react/index.ts"],"names":[],"mappings":"AAAA,oFAAoF;AACpF,EAAE;AACF,8EAA8E;AAC9E,2EAA2E;AAC3E,8EAA8E;AAC9E,8EAA8E;AAC9E,+EAA+E;AAC/E,EAAE;AACF,6EAA6E;AAC7E,4DAA4D;AAC5D,EAAE;AACF,gDAAgD;AAChD,6EAA6E;AAC7E,gDAAgD;AAChD,uEAAuE;AACvE,oDAAoD;AACpD,EAAE;AACF,0EAA0E;AAC1E,4EAA4E;AAC5E,uEAAuE;AACvE,wEAAwE;AACxE,yEAAyE;AACzE,sBAAsB;AACtB,EAAE;AACF,4EAA4E;AAC5E,4EAA4E;AAC5E,yEAAyE;AACzE,yCAAyC;AAEzC,OAAO,EAAE,EAAE,EAAE,GAAG,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../react/index.ts"],"names":[],"mappings":"AAAA,oFAAoF;AACpF,EAAE;AACF,8EAA8E;AAC9E,2EAA2E;AAC3E,8EAA8E;AAC9E,8EAA8E;AAC9E,+EAA+E;AAC/E,EAAE;AACF,6EAA6E;AAC7E,4DAA4D;AAC5D,EAAE;AACF,gDAAgD;AAChD,6EAA6E;AAC7E,gDAAgD;AAChD,uEAAuE;AACvE,oDAAoD;AACpD,EAAE;AACF,0EAA0E;AAC1E,4EAA4E;AAC5E,uEAAuE;AACvE,wEAAwE;AACxE,yEAAyE;AACzE,sBAAsB;AACtB,EAAE;AACF,4EAA4E;AAC5E,4EAA4E;AAC5E,yEAAyE;AACzE,yCAAyC;AAEzC,OAAO,EAAE,EAAE,EAAE,GAAG,EAAoB,MAAM,SAAS,CAAA;AAEnD,cAAc,cAAc,CAAA;AAC5B,cAAc,cAAc,CAAA;AAC5B,cAAc,WAAW,CAAA;AACzB,cAAc,eAAe,CAAA;AAC7B,cAAc,YAAY,CAAA;AAC1B,cAAc,WAAW,CAAA;AACzB,cAAc,aAAa,CAAA;AAC3B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,eAAe,CAAA;AAC7B,cAAc,kBAAkB,CAAA;AAChC,cAAc,eAAe,CAAA;AAC7B,cAAc,iBAAiB,CAAA"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zevra/ui",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.46.0",
|
|
4
4
|
"description": "Design system Zevra « Encre & Papier » : tokens, CSS des composants et logos officiels.",
|
|
5
5
|
"license": "UNLICENSED",
|
|
6
6
|
"private": false,
|
|
@@ -99,17 +99,17 @@
|
|
|
99
99
|
"devDependencies": {
|
|
100
100
|
"@dnd-kit/core": "^6.3.1",
|
|
101
101
|
"@dnd-kit/sortable": "^10.0.0",
|
|
102
|
-
"@storybook/addon-docs": "^10.
|
|
102
|
+
"@storybook/addon-docs": "^10.6.3",
|
|
103
103
|
"@storybook/addon-mcp": "^0.7.0",
|
|
104
|
-
"@storybook/react-vite": "^10.
|
|
104
|
+
"@storybook/react-vite": "^10.6.3",
|
|
105
105
|
"@tanstack/react-table": "^8.21.3",
|
|
106
106
|
"@types/react": "^19.2.18",
|
|
107
107
|
"@types/react-dom": "^19.2.5",
|
|
108
108
|
"react": "^19.2.8",
|
|
109
109
|
"react-dom": "^19.2.8",
|
|
110
|
-
"storybook": "^10.
|
|
110
|
+
"storybook": "^10.6.3",
|
|
111
111
|
"typescript": "^7.0.2",
|
|
112
|
-
"vite": "^7.3.
|
|
112
|
+
"vite": "^7.3.7",
|
|
113
113
|
"vitest": "^3.2.4"
|
|
114
114
|
},
|
|
115
115
|
"keywords": [
|
package/react/actions.tsx
CHANGED
|
@@ -10,7 +10,7 @@ import type {
|
|
|
10
10
|
HTMLAttributes,
|
|
11
11
|
ReactNode,
|
|
12
12
|
} from 'react'
|
|
13
|
-
import { cx } from './cx.js'
|
|
13
|
+
import { classeAngles, cx, type ChoixAngles } from './cx.js'
|
|
14
14
|
import { Icon, type IconId } from './icon.js'
|
|
15
15
|
|
|
16
16
|
/** Variantes de bouton. Une seule pleine par écran, c'est la règle de
|
|
@@ -18,13 +18,16 @@ import { Icon, type IconId } from './icon.js'
|
|
|
18
18
|
* aplats, pas les couleurs. « danger » est réservée à l'action destructive
|
|
19
19
|
* (la confirmation d'une modale de suppression), jamais à une action
|
|
20
20
|
* simplement importante. */
|
|
21
|
-
export type BoutonVariante = 'plein' | 'fantome' | 'encre' | 'danger'
|
|
21
|
+
export type BoutonVariante = 'plein' | 'fantome' | 'encre' | 'danger' | 'fantome-danger'
|
|
22
22
|
|
|
23
23
|
const VARIANTE_BOUTON: Record<BoutonVariante, string> = {
|
|
24
24
|
plein: 'zv-btn',
|
|
25
25
|
fantome: 'zv-btn--ghost',
|
|
26
26
|
encre: 'zv-btn--ink',
|
|
27
27
|
danger: 'zv-btn--danger',
|
|
28
|
+
// Le fantôme qui DÉTRUIT : fantôme au repos, aplat --err au survol. Il
|
|
29
|
+
// compose la classe du fantôme, dont il garde le repos et l'inertie.
|
|
30
|
+
'fantome-danger': 'zv-btn--ghost zv-btn--ghost-danger',
|
|
28
31
|
}
|
|
29
32
|
|
|
30
33
|
export interface ButtonProps
|
|
@@ -54,6 +57,9 @@ export interface ButtonProps
|
|
|
54
57
|
/** Échappatoire assumée. À employer pour un ajustement de position, jamais
|
|
55
58
|
* pour redéfinir une couleur ou une taille : c'est par là que les apps
|
|
56
59
|
* recommencent à écrire leur propre charte. */
|
|
60
|
+
/** `arrondis` (option) ou `vifs` (défaut de la charte). Sans valeur, le
|
|
61
|
+
* composant suit son conteneur : voir `Angles`. */
|
|
62
|
+
angles?: ChoixAngles
|
|
57
63
|
className?: string
|
|
58
64
|
children?: ReactNode
|
|
59
65
|
}
|
|
@@ -66,6 +72,7 @@ export function Button({
|
|
|
66
72
|
iconeApres,
|
|
67
73
|
carre,
|
|
68
74
|
occupe,
|
|
75
|
+
angles,
|
|
69
76
|
className,
|
|
70
77
|
type = 'button',
|
|
71
78
|
disabled,
|
|
@@ -93,6 +100,7 @@ export function Button({
|
|
|
93
100
|
compact && 'zv-btn--sm',
|
|
94
101
|
bloc && 'zv-btn--block',
|
|
95
102
|
carre && 'zv-btn--carre',
|
|
103
|
+
classeAngles(angles),
|
|
96
104
|
className,
|
|
97
105
|
)}
|
|
98
106
|
{...reste}
|
|
@@ -113,6 +121,9 @@ export interface ButtonLinkProps
|
|
|
113
121
|
iconeApres?: IconId
|
|
114
122
|
/** ⚠️ Comme sur Button : aria-label OBLIGATOIRE, écrit pour l'ACTION. */
|
|
115
123
|
carre?: boolean
|
|
124
|
+
/** `arrondis` (option) ou `vifs` (défaut de la charte). Sans valeur, le
|
|
125
|
+
* composant suit son conteneur : voir `Angles`. */
|
|
126
|
+
angles?: ChoixAngles
|
|
116
127
|
className?: string
|
|
117
128
|
}
|
|
118
129
|
|
|
@@ -125,6 +136,7 @@ export function ButtonLink({
|
|
|
125
136
|
icone,
|
|
126
137
|
iconeApres,
|
|
127
138
|
carre,
|
|
139
|
+
angles,
|
|
128
140
|
className,
|
|
129
141
|
children,
|
|
130
142
|
...reste
|
|
@@ -136,6 +148,7 @@ export function ButtonLink({
|
|
|
136
148
|
compact && 'zv-btn--sm',
|
|
137
149
|
bloc && 'zv-btn--block',
|
|
138
150
|
carre && 'zv-btn--carre',
|
|
151
|
+
classeAngles(angles),
|
|
139
152
|
className,
|
|
140
153
|
)}
|
|
141
154
|
{...reste}
|
package/react/catalogue.tsx
CHANGED
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
import { useState, type ChangeEvent, type ReactNode } from 'react'
|
|
18
18
|
import { Button, ButtonLink, ButtonRow, LinkArrow } from './actions.js'
|
|
19
19
|
import {
|
|
20
|
-
Callout, Card, Check, Divider, Ent, EntText, Faq, FaqItem, Flow, FlowStep,
|
|
20
|
+
Angles, Callout, Card, Check, Divider, Ent, EntText, Faq, FaqItem, Flow, FlowStep,
|
|
21
21
|
LegalPage,
|
|
22
22
|
Glass, IndexItem, IndexList, Inset, Media, MediaCoin, MediaImg, MediaVoile, MiniStat,
|
|
23
23
|
MiniStatItem, PageErreur, Pill, Price,
|
|
@@ -606,6 +606,42 @@ export const CATALOGUE: GroupeCatalogue[] = [
|
|
|
606
606
|
</ButtonRow>
|
|
607
607
|
),
|
|
608
608
|
},
|
|
609
|
+
{
|
|
610
|
+
id: 'angles-arrondis',
|
|
611
|
+
nom: 'Angles arrondis (option)',
|
|
612
|
+
resume:
|
|
613
|
+
'HORS RELEVÉ : l’angle vif reste le défaut de la charte. `Angles` arrondit légèrement tout ce qu’elle enveloppe (boutons, champs, cartes, alertes, menus) ; la posée une fois, sur la coque de l’app. La prop `angles="arrondis" | "vifs"` règle un composant seul. Le rond de forme (pastille, radio, interrupteur) n’en dépend pas.',
|
|
614
|
+
code: `<Angles arrondis>
|
|
615
|
+
<Card padding="normal">
|
|
616
|
+
<Input placeholder="Rechercher un dossier" />
|
|
617
|
+
<ButtonRow>
|
|
618
|
+
<Button>Enregistrer</Button>
|
|
619
|
+
<Button variante="fantome">Annuler</Button>
|
|
620
|
+
</ButtonRow>
|
|
621
|
+
</Card>
|
|
622
|
+
</Angles>
|
|
623
|
+
|
|
624
|
+
<Button variante="fantome" angles="arrondis">Un seul bouton arrondi</Button>`,
|
|
625
|
+
rendu: (
|
|
626
|
+
<div style={{ display: 'grid', gap: 16 }}>
|
|
627
|
+
<Angles arrondis>
|
|
628
|
+
<Card padding="normal">
|
|
629
|
+
<div style={{ display: 'grid', gap: 12 }}>
|
|
630
|
+
<Input placeholder="Rechercher un dossier" aria-label="Rechercher un dossier" />
|
|
631
|
+
<ButtonRow>
|
|
632
|
+
<Button>Enregistrer</Button>
|
|
633
|
+
<Button variante="fantome">Annuler</Button>
|
|
634
|
+
</ButtonRow>
|
|
635
|
+
</div>
|
|
636
|
+
</Card>
|
|
637
|
+
</Angles>
|
|
638
|
+
<ButtonRow>
|
|
639
|
+
<Button variante="fantome" angles="arrondis">Un seul bouton arrondi</Button>
|
|
640
|
+
<Button variante="fantome">Angle vif, par défaut</Button>
|
|
641
|
+
</ButtonRow>
|
|
642
|
+
</div>
|
|
643
|
+
),
|
|
644
|
+
},
|
|
609
645
|
{
|
|
610
646
|
id: 'boutons-gabarits',
|
|
611
647
|
nom: 'Gabarits',
|
|
@@ -630,13 +666,15 @@ export const CATALOGUE: GroupeCatalogue[] = [
|
|
|
630
666
|
id: 'etats',
|
|
631
667
|
nom: 'États',
|
|
632
668
|
resume:
|
|
633
|
-
'« danger » COMPTE comme le bouton plein de la page : la règle compte les aplats, pas les couleurs ; à réserver à la confirmation destructive. « occupe » pose aria-busy et aria-disabled et AVALE le clic sans sortir le bouton du parcours clavier : le LIBELLÉ doit changer avec lui, l’estompement seul ne dit pas ce qu’on attend. Survol et appui sont dans le CSS, rien à câbler.',
|
|
669
|
+
'« danger » COMPTE comme le bouton plein de la page : la règle compte les aplats, pas les couleurs ; à réserver à la confirmation destructive. « fantome-danger » est son pendant discret : fantôme au repos, rouge au survol, pour un « Supprimer » posé à côté d’autres actions. « occupe » pose aria-busy et aria-disabled et AVALE le clic sans sortir le bouton du parcours clavier : le LIBELLÉ doit changer avec lui, l’estompement seul ne dit pas ce qu’on attend. Survol et appui sont dans le CSS, rien à câbler.',
|
|
634
670
|
code: `<Button variante="danger">Supprimer définitivement</Button>
|
|
671
|
+
<Button variante="fantome-danger" icone="corbeille">Supprimer</Button>
|
|
635
672
|
<Button occupe>Connexion…</Button>
|
|
636
673
|
<Button variante="fantome" disabled>Envoyer</Button>`,
|
|
637
674
|
rendu: (
|
|
638
675
|
<ButtonRow>
|
|
639
676
|
<Button variante="danger">Supprimer définitivement</Button>
|
|
677
|
+
<Button variante="fantome-danger" icone="corbeille">Supprimer</Button>
|
|
640
678
|
<Button occupe>Connexion…</Button>
|
|
641
679
|
<Button variante="fantome" disabled>
|
|
642
680
|
Envoyer
|
package/react/content.tsx
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
// « use client ».
|
|
3
3
|
|
|
4
4
|
import type { ElementType, HTMLAttributes, ReactNode } from 'react'
|
|
5
|
-
import { cx } from './cx.js'
|
|
5
|
+
import { classeAngles, cx, type ChoixAngles } from './cx.js'
|
|
6
6
|
|
|
7
7
|
type Div = Omit<HTMLAttributes<HTMLDivElement>, 'className'>
|
|
8
8
|
type Span = Omit<HTMLAttributes<HTMLSpanElement>, 'className'>
|
|
@@ -14,6 +14,9 @@ export interface CardProps extends Div {
|
|
|
14
14
|
etat?: 'ok' | 'err'
|
|
15
15
|
/** Ombre portée, pour une carte qui flotte au-dessus d'une scène. */
|
|
16
16
|
flottante?: boolean
|
|
17
|
+
/** `arrondis` (option) ou `vifs` (défaut de la charte). Sans valeur, le
|
|
18
|
+
* composant suit son conteneur : voir `Angles`. */
|
|
19
|
+
angles?: ChoixAngles
|
|
17
20
|
className?: string
|
|
18
21
|
}
|
|
19
22
|
|
|
@@ -21,6 +24,7 @@ export function Card({
|
|
|
21
24
|
padding = 'normal',
|
|
22
25
|
etat,
|
|
23
26
|
flottante,
|
|
27
|
+
angles,
|
|
24
28
|
className,
|
|
25
29
|
...reste
|
|
26
30
|
}: CardProps) {
|
|
@@ -33,6 +37,7 @@ export function Card({
|
|
|
33
37
|
etat === 'ok' && 'zv-card--ok',
|
|
34
38
|
etat === 'err' && 'zv-card--err',
|
|
35
39
|
flottante && 'zv-card--float',
|
|
40
|
+
classeAngles(angles),
|
|
36
41
|
className,
|
|
37
42
|
)}
|
|
38
43
|
{...reste}
|
|
@@ -40,6 +45,22 @@ export function Card({
|
|
|
40
45
|
)
|
|
41
46
|
}
|
|
42
47
|
|
|
48
|
+
export interface AnglesProps extends Div {
|
|
49
|
+
/** Arrondit tout ce qu'elle enveloppe. Sans, l'enveloppe remet ses enfants
|
|
50
|
+
* à l'angle vif (utile dans une zone déjà arrondie). */
|
|
51
|
+
arrondis?: boolean
|
|
52
|
+
className?: string
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
/** Les angles d'une app ou d'une zone entière (DECISIONS.md, « Les angles
|
|
56
|
+
* arrondis, en option ») : elle ne porte que les tokens de rayon, sans
|
|
57
|
+
* ajouter de boîte (`display: contents`). L'angle vif reste le défaut de la
|
|
58
|
+
* charte ; à employer au plus haut (la coque de l'app), pas écran par
|
|
59
|
+
* écran : deux écrans aux angles différents ne font plus une app. */
|
|
60
|
+
export function Angles({ arrondis, className, ...reste }: AnglesProps) {
|
|
61
|
+
return <div className={cx('zv-angles', arrondis ? 'zv-arrondi' : 'zv-vif', className)} {...reste} />
|
|
62
|
+
}
|
|
63
|
+
|
|
43
64
|
/** Surface semi-opaque. ⚠️ Ne fonctionne QUE devant un halo ou une scène :
|
|
44
65
|
* posée sur du papier nu, elle disparaît. */
|
|
45
66
|
export function Glass({ className, ...reste }: Div & { className?: string }) {
|