Skip to content

Commit 8bd9ce3

Browse files
authored
Merge pull request #610 from dnum-mi/develop
Develop
2 parents 1d93cc3 + 93ba531 commit 8bd9ce3

22 files changed

+2360
-5871
lines changed

.eslintrc.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,6 @@ module.exports = {
3939
{
4040
files: ['**/*.ts?(x)'],
4141
parser: '@typescript-eslint/parser',
42-
plugins: ['@typescript-eslint'],
4342
rules: {
4443
semi: ['error', 'never'],
4544
quotes: [2, 'single'],

.storybook/vue-dsfr-theme.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { create } from '@storybook/theming'
1+
import { create } from '@storybook/theming/create'
22
import brandImage from '../src/assets/icone-marianne-seule.png'
33

44
export default create({

package-lock.json

Lines changed: 2091 additions & 5678 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 27 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -77,13 +77,13 @@
7777
"vue": "^3.3.4"
7878
},
7979
"devDependencies": {
80-
"@babel/core": "^7.22.11",
81-
"@babel/eslint-parser": "^7.22.11",
80+
"@babel/core": "^7.22.15",
81+
"@babel/eslint-parser": "^7.22.15",
8282
"@babel/plugin-syntax-jsx": "^7.22.5",
83-
"@babel/preset-env": "^7.22.10",
84-
"@babel/preset-typescript": "^7.22.11",
85-
"@cypress/vite-dev-server": "^5.0.5",
86-
"@cypress/vue": "^5.0.5",
83+
"@babel/preset-env": "^7.22.15",
84+
"@babel/preset-typescript": "^7.22.15",
85+
"@cypress/vite-dev-server": "^5.0.6",
86+
"@cypress/vue": "^6.0.0",
8787
"@mdx-js/react": "^2.3.0",
8888
"@rollup/plugin-alias": "^5.0.0",
8989
"@rollup/plugin-babel": "^6.0.3",
@@ -92,29 +92,29 @@
9292
"@rollup/plugin-replace": "^5.0.2",
9393
"@rollup/plugin-url": "^8.0.1",
9494
"@rushstack/eslint-patch": "^1.3.3",
95-
"@storybook/addon-actions": "7.3.1",
96-
"@storybook/addon-docs": "7.3.1",
97-
"@storybook/addon-essentials": "7.3.1",
98-
"@storybook/addon-interactions": "7.3.1",
99-
"@storybook/addon-links": "7.3.1",
100-
"@storybook/addon-mdx-gfm": "7.3.1",
95+
"@storybook/addon-actions": "7.4.0",
96+
"@storybook/addon-docs": "7.4.0",
97+
"@storybook/addon-essentials": "7.4.0",
98+
"@storybook/addon-interactions": "7.4.0",
99+
"@storybook/addon-links": "7.4.0",
100+
"@storybook/addon-mdx-gfm": "7.4.0",
101101
"@storybook/addon-styling": "^1.3.7",
102-
"@storybook/client-api": "7.3.1",
103-
"@storybook/client-logger": "7.3.1",
104-
"@storybook/core-common": "7.3.1",
105-
"@storybook/jest": "^0.2.1",
102+
"@storybook/client-api": "7.4.0",
103+
"@storybook/client-logger": "7.4.0",
104+
"@storybook/core-common": "7.4.0",
105+
"@storybook/jest": "^0.2.2",
106106
"@storybook/testing-library": "^0.2.0",
107-
"@storybook/vue3": "7.3.1",
108-
"@storybook/vue3-vite": "7.3.1",
107+
"@storybook/vue3": "7.4.0",
108+
"@storybook/vue3-vite": "7.4.0",
109109
"@testing-library/jest-dom": "^6.1.2",
110110
"@testing-library/user-event": "^14.4.3",
111111
"@testing-library/vue": "^7.0.0",
112112
"@types/jest": "^29.5.4",
113113
"@types/jsdom": "^21.1.2",
114-
"@types/node": "^18.16.18",
115-
"@typescript-eslint/eslint-plugin": "^6.4.1",
116-
"@typescript-eslint/parser": "^6.4.1",
117-
"@vitejs/plugin-vue": "^4.3.3",
114+
"@types/node": "^18.17.14",
115+
"@typescript-eslint/eslint-plugin": "^6.5.0",
116+
"@typescript-eslint/parser": "^6.5.0",
117+
"@vitejs/plugin-vue": "^4.3.4",
118118
"@vitejs/plugin-vue-jsx": "^3.0.2",
119119
"@vue/compiler-sfc": "^3.3.4",
120120
"@vue/eslint-config-standard": "^8.0.1",
@@ -128,9 +128,9 @@
128128
"copyfiles": "^2.4.1",
129129
"core-js": "^3.32.1",
130130
"cross-env": "^7.0.3",
131-
"cypress": "^12.17.4",
131+
"cypress": "^13.1.0",
132132
"cypress-plugin-tab": "^1.0.5",
133-
"eslint": "^8.47.0",
133+
"eslint": "^8.48.0",
134134
"eslint-plugin-cypress": "^2.14.0",
135135
"eslint-plugin-html": "^7.1.0",
136136
"eslint-plugin-import": "^2.28.1",
@@ -145,12 +145,12 @@
145145
"mkdirp": "^3.0.1",
146146
"npm-run-all": "^4.1.5",
147147
"p-debounce": "^4.0.0",
148-
"postcss": "^8.4.28",
148+
"postcss": "^8.4.29",
149149
"postcss-csso": "^6.0.1",
150150
"postcss-flexbugs-fixes": "^5.0.2",
151151
"postcss-import": "^15.1.0",
152152
"postcss-nested": "^6.0.1",
153-
"postcss-preset-env": "^9.1.1",
153+
"postcss-preset-env": "^9.1.3",
154154
"postcss-url": "^10.1.3",
155155
"react": "^18.2.0",
156156
"react-dom": "^18.2.0",
@@ -164,7 +164,7 @@
164164
"rollup-plugin-vue": "^6.0.0",
165165
"semantic-release": "^21.1.1",
166166
"start-server-and-test": "^2.0.0",
167-
"storybook": "7.3.1",
167+
"storybook": "7.4.0",
168168
"tsd-jsdoc": "^2.5.0",
169169
"typescript": "^5.2.2",
170170
"vite": "^4.4.9",

src/components/DsfrCard/DsfrCard.stories.ts

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -56,6 +56,10 @@ export default {
5656
control: 'text',
5757
description: 'Permet de choisir la balise contenant le titre de la carte (h3 par défaut',
5858
},
59+
download: {
60+
control: 'boolean',
61+
description: 'Variante de carte indiquant que l’évènement de clic lancera un téléchargement',
62+
},
5963
},
6064
}
6165

@@ -77,6 +81,7 @@ export const Card = (args) => ({
7781
:title="title"
7882
:horizontal="horizontal"
7983
:no-arrow="noArrow"
84+
:download="download"
8085
:title-tag="titleTag"
8186
/>
8287
`,
@@ -92,6 +97,7 @@ Card.args = {
9297
titleTag: undefined,
9398
noArrow: false,
9499
horizontal: false,
100+
download: false,
95101
size: 'medium',
96102
buttons: [],
97103
linksGroup: [],
@@ -114,6 +120,7 @@ export const CardSansFleche = (args) => ({
114120
:size="size"
115121
:title="title"
116122
:horizontal="horizontal"
123+
:download="download",
117124
:no-arrow="noArrow"
118125
/>
119126
`,
@@ -128,6 +135,7 @@ CardSansFleche.args = {
128135
title: 'Qu’est-ce que le Pass Culture et comment l’obtenir ?',
129136
noArrow: true,
130137
horizontal: false,
138+
download: false,
131139
size: 'medium',
132140
buttons: [],
133141
linksGroup: [],
@@ -150,6 +158,7 @@ export const CardAvecBoutons = (args) => ({
150158
:size="size"
151159
:title="title"
152160
:horizontal="horizontal"
161+
:download="download",
153162
:no-arrow="noArrow"
154163
/>
155164
`,
@@ -164,6 +173,7 @@ CardAvecBoutons.args = {
164173
title: 'Qu’est-ce que le Pass Culture et comment l’obtenir ?',
165174
noArrow: true,
166175
horizontal: false,
176+
download: false,
167177
buttons: [
168178
{
169179
label: 'Télécharger',
@@ -194,6 +204,7 @@ export const CardAvecLiens = (args) => ({
194204
:size="size"
195205
:title="title"
196206
:horizontal="horizontal"
207+
:download="download",
197208
:no-arrow="noArrow"
198209
/>
199210
`,
@@ -208,6 +219,7 @@ CardAvecLiens.args = {
208219
title: 'Qu’est-ce que le Pass Culture et comment l’obtenir ?',
209220
noArrow: true,
210221
horizontal: false,
222+
download: false,
211223
linksGroup: [
212224
{
213225
label: 'Télécharger',
@@ -237,6 +249,7 @@ export const CardHorizontaleAvecBoutons = (args) => ({
237249
:size="size"
238250
:title="title"
239251
:horizontal="horizontal"
252+
:download="download",
240253
:no-arrow="noArrow"
241254
/>
242255
`,
@@ -251,6 +264,7 @@ CardHorizontaleAvecBoutons.args = {
251264
title: 'Qu’est-ce que le Pass Culture et comment l’obtenir ?',
252265
noArrow: true,
253266
horizontal: true,
267+
download: false,
254268
buttons: [
255269
{
256270
label: 'Télécharger',
@@ -281,6 +295,7 @@ export const CardHorizontaleEtSmallAvecLiens = (args) => ({
281295
:size="size"
282296
:title="title"
283297
:horizontal="horizontal"
298+
:download="download",
284299
:no-arrow="noArrow"
285300
/>
286301
`,
@@ -295,6 +310,7 @@ CardHorizontaleEtSmallAvecLiens.args = {
295310
title: 'Qu’est-ce que le Pass Culture et comment l’obtenir ?',
296311
noArrow: true,
297312
horizontal: true,
313+
download: false,
298314
size: 'small',
299315
linksGroup: [
300316
{

src/components/DsfrCard/DsfrCard.vue

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ const props = withDefaults(defineProps<{
1818
linksGroup?:({ label: string, to?: RouteLocationRaw, link?: string, href?: string })[]
1919
noArrow?: boolean
2020
horizontal?: boolean
21+
download?: boolean
2122
}>(), {
2223
imgSrc: undefined,
2324
link: undefined,
@@ -54,6 +55,7 @@ defineExpose({ goToTargetLink })
5455
'fr-enlarge-link': !noArrow,
5556
'fr-card--sm': sm,
5657
'fr-card--lg': lg,
58+
'fr-card--download': download,
5759
}"
5860
data-testid="fr-card"
5961
>

src/components/DsfrFileDownload/DsfrFileDownload.spec.ts

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,14 +3,12 @@ import { render } from '@testing-library/vue'
33
import DsfrFileDownload from './DsfrFileDownload.vue'
44

55
describe('DsfrFileDownload', () => {
6-
it('should render a download link block', async () => {
6+
it('should render a download link', async () => {
77
const title = 'Téléchargement du fichier 1'
88
const format = 'JPEG'
99
const size = '205 Ko'
1010
const href = '#'
1111
const download = 'document.txt'
12-
const block = true
13-
const description = 'Une chouette description'
1412

1513
const { getByText } = render(DsfrFileDownload, {
1614
props: {
@@ -19,13 +17,11 @@ describe('DsfrFileDownload', () => {
1917
size,
2018
href,
2119
download,
22-
block,
23-
description,
2420
},
2521
})
2622

2723
const downloadTitle = getByText(title)
2824

29-
expect((downloadTitle).parentNode.parentNode).toHaveClass('fr-download--card')
25+
expect((downloadTitle)).toHaveClass('fr-link--download')
3026
})
3127
})

src/components/DsfrFileDownload/DsfrFileDownload.stories.ts

Lines changed: 2 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -27,18 +27,10 @@ export default {
2727
control: 'text',
2828
description: 'Nom de la ressource à télécharger',
2929
},
30-
block: {
31-
control: 'boolean',
32-
description: 'Permet de basculer le lien de téléchargement en mode block',
33-
},
34-
description: {
35-
control: 'text',
36-
description: 'Une description associée au lien disponible en mode block',
37-
},
3830
},
3931
}
4032

41-
export const TelechargementDeFichier = (args) => ({
33+
export const LienDeTelechargement = (args) => ({
4234
components: {
4335
DsfrFileDownload,
4436
},
@@ -53,51 +45,15 @@ export const TelechargementDeFichier = (args) => ({
5345
:size="size"
5446
:href="href"
5547
:download="download"
56-
:block="block"
57-
:description="description"
5848
:title="title"
5949
/>
6050
`,
6151

6252
})
63-
TelechargementDeFichier.args = {
53+
LienDeTelechargement.args = {
6454
format: 'PDF',
6555
size: '250 Go',
6656
href: 'src/assets/icone-marianne-seule.png',
6757
download: 'marianne.png',
68-
block: false,
69-
description: 'Description du téléchargement',
70-
title: 'Titre du téléchargement',
71-
}
72-
73-
export const BlocDeTelechargement = (args) => ({
74-
components: {
75-
DsfrFileDownload,
76-
},
77-
data () {
78-
return {
79-
...args,
80-
}
81-
},
82-
template: `
83-
<DsfrFileDownload
84-
:format="format"
85-
:size="size"
86-
:href="href"
87-
:download="download"
88-
:block="block"
89-
:description="description"
90-
:title="title"
91-
/>
92-
`,
93-
94-
})
95-
BlocDeTelechargement.args = {
96-
format: 'JPEG',
97-
size: '1.2 To',
98-
href: 'src/assets/icone-marianne-seule.png',
99-
download: 'marianne.png',
100-
description: 'Description du téléchargement',
10158
title: 'Titre du téléchargement',
102-
block: true,
10359
}

src/components/DsfrFileDownload/DsfrFileDownload.vue

Lines changed: 9 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,6 @@ export type DsfrFileDownloadProps = {
55
size?: string
66
href?: string
77
download?: string
8-
description?: string
9-
block?: boolean
108
}
119
1210
withDefaults(defineProps<DsfrFileDownloadProps>(), {
@@ -15,31 +13,17 @@ withDefaults(defineProps<DsfrFileDownloadProps>(), {
1513
size: '250 Ko',
1614
href: '#',
1715
download: '',
18-
description: '',
1916
})
2017
</script>
2118

2219
<template>
23-
<div
24-
class="fr-download"
25-
:class="{ 'fr-enlarge-link fr-download--card': block }"
26-
>
27-
<p>
28-
<a
29-
:href="href"
30-
:download="download"
31-
class="fr-download__link"
32-
> {{ title }}
33-
<span class="fr-download__detail">
34-
{{ format }} – {{ size }}
35-
</span>
36-
</a>
37-
</p>
38-
<p
39-
v-if="block"
40-
class="fr-download__desc"
41-
>
42-
{{ description }}
43-
</p>
44-
</div>
20+
<a
21+
:href="href"
22+
:download="download"
23+
class="fr-link fr-link--download"
24+
> {{ title }}
25+
<span class="fr-link__detail">
26+
{{ format }} – {{ size }}
27+
</span>
28+
</a>
4529
</template>

0 commit comments

Comments
 (0)