Skip to content

Commit 9fb56f1

Browse files
garronejgarronej
committed
Consitency work
1 parent e75c66b commit 9fb56f1

14 files changed

+123
-110
lines changed

‎stories/Alert.stories.tsx‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,10 @@
1-
import { Alert } from "../dist/Alert";
2-
import type { AlertProps } from "../dist/Alert";
1+
import { Alert, type AlertProps } from "../dist/Alert";
32
import { sectionName } from "./sectionName";
43
import { getStoryFactory, logCallbacks } from "./getStory";
54
import { assert } from "tsafe/assert";
65
import type { Equals } from "tsafe";
76

8-
const { meta, getStory } = getStoryFactory<AlertProps>({
7+
const { meta, getStory } = getStoryFactory({
98
sectionName,
109
"wrappedComponent": { Alert },
1110
"description": `

‎stories/Badge.stories.tsx‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,10 @@
1-
import { Badge } from "../dist/Badge";
2-
import type { BadgeProps } from "../dist/Badge";
1+
import { Badge, type BadgeProps } from "../dist/Badge";
32
import { sectionName } from "./sectionName";
43
import { getStoryFactory } from "./getStory";
54
import { assert } from "tsafe/assert";
65
import type { Equals } from "tsafe";
76

8-
const { meta, getStory } = getStoryFactory<BadgeProps>({
7+
const { meta, getStory } = getStoryFactory({
98
sectionName,
109
"wrappedComponent": { Badge },
1110
description: `

‎stories/Button.stories.tsx‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
1-
import { Button } from "../dist/Button";
2-
import type { ButtonProps } from "../dist/Button";
1+
import { Button, type ButtonProps } from "../dist/Button";
32
import { sectionName } from "./sectionName";
43
import { getStoryFactory, logCallbacks } from "./getStory";
54
import { assert } from "tsafe/assert";

‎stories/ButtonsGroup.stories.tsx‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
1-
import { ButtonsGroup } from "../dist/ButtonsGroup";
2-
import type { ButtonsGroupProps } from "../dist/ButtonsGroup";
1+
import { ButtonsGroup, type ButtonsGroupProps } from "../dist/ButtonsGroup";
32
import { sectionName } from "./sectionName";
43
import { getStoryFactory } from "./getStory";
54
import { assert } from "tsafe/assert";

‎stories/CallOut.stories.tsx‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
1-
import { CallOut } from "../dist/CallOut";
2-
import type { CallOutProps } from "../dist/CallOut";
1+
import { CallOut, type CallOutProps } from "../dist/CallOut";
32
import { sectionName } from "./sectionName";
43
import { getStoryFactory, logCallbacks } from "./getStory";
54
import { assert } from "tsafe/assert";

‎stories/Card.stories.tsx‎

Lines changed: 108 additions & 82 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React from "react";
2-
import { Card, CardProps } from "../dist/Card";
2+
import { Card, type CardProps } from "../dist/Card";
33
import { Badge } from "../dist/Badge";
44
import { sectionName } from "./sectionName";
55
import { getStoryFactory } from "./getStory";
@@ -47,211 +47,237 @@ const { meta, getStory } = getStoryFactory({
4747
export default meta;
4848

4949
const defaultProps = {
50-
enlargeLink: true,
51-
title: "Intitulé de la carte (sur lequel se trouve le lien)",
52-
linkProps: {
53-
href: "#"
50+
"enlargeLink": true as const,
51+
"title": "Intitulé de la carte (sur lequel se trouve le lien)",
52+
"linkProps": {
53+
"href": "#"
5454
},
55-
desc: "Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dolore magna aliqua. Vitae sapien pellentesque habitant morbi tristique senectus et",
56-
imageUrl: "https://www.systeme-de-design.gouv.fr/img/placeholder.16x9.png",
57-
imageAlt: "texte alternatif de l’image"
55+
"desc": "Lorem ipsum dolor sit amet, consectetur adipiscing, incididunt, ut labore et dolore magna aliqua. Vitae sapien pellentesque habitant morbi tristique senectus et",
56+
"imageUrl": "https://www.systeme-de-design.gouv.fr/img/placeholder.16x9.png",
57+
"imageAlt": "texte alternatif de l’image"
5858
};
5959

6060
export const Default = getStory({ ...defaultProps });
6161

6262
// todo: wrap with grid
6363
export const CardWithoutEnlargeLink = getStory(
64-
{ ...defaultProps, enlargeLink: false },
65-
{ description: "Carte sans lien étendu à la carte" }
64+
{ ...defaultProps, "enlargeLink": false },
65+
{ "description": "Carte sans lien étendu à la carte" }
6666
);
6767

6868
export const CardWithIcon = getStory(
69-
{ ...defaultProps, iconId: "fr-icon-warning-fill" },
70-
{ description: "Carte avec icône personnalisée" }
69+
{ ...defaultProps, "iconId": "fr-icon-warning-fill" },
70+
{ "description": "Carte avec icône personnalisée" }
7171
);
7272

7373
export const CardWithoutBorder = getStory(
74-
{ ...defaultProps, border: false },
75-
{ description: "Carte sans bordure" }
74+
{ ...defaultProps, "border": false },
75+
{ "description": "Carte sans bordure" }
7676
);
7777

7878
export const CardWithShadow = getStory(
79-
{ ...defaultProps, shadow: true },
80-
{ description: "Carte avec ombre portée" }
79+
{ ...defaultProps, "shadow": true },
80+
{ "description": "Carte avec ombre portée" }
8181
);
8282

8383
export const CardWithoutImage = getStory(
84-
{ ...defaultProps, imageUrl: undefined },
85-
{ description: "Carte sans image" }
84+
{ ...defaultProps, "imageUrl": undefined },
85+
{ "description": "Carte sans image" }
8686
);
8787

8888
export const CardWithImageRatio = getStory(
89-
{ ...defaultProps, classes: { imgTag: "fr-ratio-3x4" } },
90-
{ description: "Carte verticale avec image au ratio d'aspect 3x4" }
89+
{ ...defaultProps, "classes": { "imgTag": "fr-ratio-3x4" } },
90+
{ "description": "Carte verticale avec image au ratio d'aspect 3x4" }
9191
);
9292

9393
export const CardWithBadgeInTheHeader = getStory(
9494
{
9595
...defaultProps,
96-
badges: [<Badge label="LABEL BADGE" />, <Badge label="LABEL BADGE" severity="new" />]
96+
"badges": [<Badge>LABEL BADGE</Badge>, <Badge severity="new">LABEL BADGE</Badge>]
9797
},
98-
{ description: "Carte verticale avec badge dans l'image" }
98+
{ "description": "Carte verticale avec badge dans l'image" }
9999
);
100100

101101
export const CardWithBadgeInTheContent = getStory(
102102
{
103103
...defaultProps,
104-
detail: (
104+
"detail": (
105105
<ul className={fr.cx("fr-badges-group")}>
106-
<Badge label="LABEL BADGE" />
107-
<Badge label="LABEL BADGE" severity="new" />
106+
<Badge>LABEL BADGE</Badge>
107+
<Badge severity="new">LABEL BADGE</Badge>
108108
</ul>
109109
)
110110
},
111-
{ description: "Carte verticale avec badges dans le contenu" }
111+
{ "description": "Carte verticale avec badges dans le contenu" }
112112
);
113113

114114
export const CardWithDetail = getStory(
115115
{
116116
...defaultProps,
117-
detail: "détail(optionnel)"
117+
"detail": "détail(optionnel)"
118118
},
119-
{ description: "Carte verticale avec détail" }
119+
{ "description": "Carte verticale avec détail" }
120120
);
121121

122122
export const CardWithEndDetail = getStory(
123123
{
124124
...defaultProps,
125-
endDetail: "détail(optionnel)"
125+
"endDetail": "détail(optionnel)"
126126
},
127-
{ description: "Carte verticale avec détail en bas" }
127+
{ "description": "Carte verticale avec détail en bas" }
128128
);
129129

130130
export const CardWithActionLinks = getStory(
131131
{
132132
...defaultProps,
133-
enlargeLink: false,
134-
footer: (
135-
<ul className="fr-links-group">
133+
"enlargeLink": false,
134+
"footer": (
135+
<ul className={fr.cx("fr-links-group")}>
136136
<li>
137-
<a className="fr-link fr-icon-arrow-right-line fr-link--icon-right" href="#">
137+
<a
138+
className={fr.cx(
139+
"fr-link",
140+
"fr-icon-arrow-right-line",
141+
"fr-link--icon-right"
142+
)}
143+
href="#"
144+
>
138145
label
139146
</a>
140147
</li>
141148
<li>
142-
<a className="fr-link fr-icon-arrow-right-line fr-link--icon-right" href="#">
149+
<a
150+
className={fr.cx(
151+
"fr-link",
152+
"fr-icon-arrow-right-line",
153+
"fr-link--icon-right"
154+
)}
155+
href="#"
156+
>
143157
label
144158
</a>
145159
</li>
146160
</ul>
147161
)
148162
},
149-
{ description: "Carte verticale avec liens d'action" }
163+
{ "description": "Carte verticale avec liens d'action" }
150164
);
151165

152166
export const CardWithActionButtons = getStory(
153167
{
154168
...defaultProps,
155-
enlargeLink: false,
156-
footer: (
157-
<ul className="fr-btns-group fr-btns-group--inline-reverse fr-btns-group--inline-lg">
169+
"enlargeLink": false,
170+
"footer": (
171+
<ul
172+
className={fr.cx(
173+
"fr-btns-group",
174+
"fr-btns-group--inline-reverse",
175+
"fr-btns-group--inline-lg"
176+
)}
177+
>
158178
<li>
159-
<button className="fr-btn fr-btn--secondary">Label</button>
179+
<button className={fr.cx("fr-btn", "fr-btn--secondary")}>Label</button>
160180
</li>
161181
<li>
162-
<button className="fr-btn">Label</button>
182+
<button className={fr.cx("fr-btn")}>Label</button>
163183
</li>
164184
</ul>
165185
)
166186
},
167-
{ description: "Carte verticale avec buttons d'action" }
187+
{ "description": "Carte verticale avec buttons d'action" }
168188
);
169189

170-
export const CardHorizontale = getStory(
190+
export const CardHorizontal = getStory(
171191
{
172192
...defaultProps,
173-
horizontal: true
193+
"horizontal": true
174194
},
175-
{ description: "Carte horizontale", defaultContainerWidth: 700 }
195+
{ "description": "Carte horizontale", "defaultContainerWidth": 700 }
176196
);
177197

178-
export const CardHorizontaleSM = getStory(
198+
export const CardHorizontalSM = getStory(
179199
{
180200
...defaultProps,
181-
horizontal: true,
182-
size: "small"
201+
"horizontal": true,
202+
"size": "small"
183203
},
184-
{ description: "Carte horizontale", defaultContainerWidth: 500 }
204+
{ "description": "Carte horizontale", "defaultContainerWidth": 500 }
185205
);
186206

187207
export const CardHorizontaleLG = getStory(
188208
{
189209
...defaultProps,
190-
horizontal: true,
191-
size: "large"
210+
"horizontal": true,
211+
"size": "large"
192212
},
193-
{ description: "Carte horizontale", defaultContainerWidth: 900 }
213+
{ "description": "Carte horizontale", "defaultContainerWidth": 900 }
194214
);
195215

196-
export const CardHorizontaleWithoutImage = getStory(
216+
export const CardHorizontalWithoutImage = getStory(
197217
{
198218
...defaultProps,
199-
horizontal: true,
200-
size: "large",
201-
imageUrl: undefined,
202-
detail: (
219+
"horizontal": true,
220+
"size": "large",
221+
"imageUrl": undefined,
222+
"detail": (
203223
<ul className={fr.cx("fr-badges-group")}>
204-
<Badge label="LABEL BADGE" />
205-
<Badge label="LABEL BADGE" severity="new" />
224+
<Badge>LABEL BADGE</Badge>
225+
<Badge severity="new">LABEL BADGE</Badge>
206226
</ul>
207227
)
208228
},
209-
{ description: "Carte horizontale sans image", defaultContainerWidth: 900 }
229+
{ "description": "Carte horizontale sans image", "defaultContainerWidth": 900 }
210230
);
211231

212-
export const CardHorizontaleWithoutImageAndEnlargeLink = getStory(
232+
export const CardHorizontalWithoutImageAndEnlargeLink = getStory(
213233
{
214234
...defaultProps,
215-
horizontal: true,
216-
enlargeLink: false,
217-
size: "large",
218-
imageUrl: undefined
235+
"horizontal": true,
236+
"enlargeLink": false,
237+
"size": "large",
238+
"imageUrl": undefined
219239
},
220-
{ description: "Carte horizontale sans image", defaultContainerWidth: 900 }
240+
{ "description": "Carte horizontale sans image", "defaultContainerWidth": 900 }
221241
);
222242

223-
export const CardHorizontaleWithActions = getStory(
243+
export const CardHorizontalWithActions = getStory(
224244
{
225245
...defaultProps,
226-
enlargeLink: false,
227-
horizontal: true,
228-
size: "large",
229-
badges: [<Badge label="LABEL BADGE" />],
230-
detail: (
246+
"enlargeLink": false,
247+
"horizontal": true,
248+
"size": "large",
249+
"badges": [<Badge>LABEL BADGE</Badge>],
250+
"detail": (
231251
<ul className={fr.cx("fr-badges-group")}>
232-
<Badge label="LABEL BADGE" />
233-
<Badge label="LABEL BADGE" severity="new" />
252+
<Badge>LABEL BADGE</Badge>
253+
<Badge severity="new">LABEL BADGE</Badge>
234254
</ul>
235255
),
236-
footer: (
237-
<ul className="fr-btns-group fr-btns-group--inline-reverse fr-btns-group--inline-lg">
256+
"footer": (
257+
<ul
258+
className={fr.cx(
259+
"fr-btns-group",
260+
"fr-btns-group--inline-reverse",
261+
"fr-btns-group--inline-lg"
262+
)}
263+
>
238264
<li>
239-
<button className="fr-btn fr-btn--secondary">Label</button>
265+
<button className={fr.cx("fr-btn", "fr-btn--secondary")}>Label</button>
240266
</li>
241267
<li>
242-
<button className="fr-btn">Label</button>
268+
<button className={fr.cx("fr-btn")}>Label</button>
243269
</li>
244270
</ul>
245271
)
246272
},
247-
{ description: "Carte horizontale", defaultContainerWidth: 900 }
273+
{ "description": "Carte horizontale", "defaultContainerWidth": 900 }
248274
);
249275

250276
export const CardGrey = getStory(
251277
{
252278
...defaultProps,
253-
horizontal: true,
254-
grey: false
279+
"horizontal": true,
280+
"grey": false
255281
},
256-
{ description: "Carte horizontale grey", defaultContainerWidth: 900 }
282+
{ "description": "Carte horizontale grey", "defaultContainerWidth": 900 }
257283
);

‎stories/Footer.stories.tsx‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
import React from "react";
2-
import { Footer } from "../dist/Footer";
3-
import type { FooterProps } from "../dist/Footer";
2+
import { Footer, type FooterProps } from "../dist/Footer";
43
import { sectionName } from "./sectionName";
54
import { getStoryFactory } from "./getStory";
65
import { assert } from "tsafe/assert";

‎stories/Highlight.stories.tsx‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
1-
import { Highlight } from "../dist/Highlight";
2-
import type { HighlightProps } from "../dist/Highlight";
1+
import { Highlight, type HighlightProps } from "../dist/Highlight";
32
import { sectionName } from "./sectionName";
43
import { getStoryFactory } from "./getStory";
54
import { assert } from "tsafe/assert";

‎stories/Input.stories.tsx‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
1-
import { Input } from "../dist/Input";
2-
import type { InputProps } from "../dist/Input";
1+
import { Input, type InputProps } from "../dist/Input";
32
import { sectionName } from "./sectionName";
43
import { getStoryFactory } from "./getStory";
54
import { assert } from "tsafe/assert";

0 commit comments

Comments
 (0)