@cnamts/synapse 0.0.3-alpha → 0.0.4-alpha
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/dist/design-system-v3.d.ts +712 -27
- package/dist/design-system-v3.js +2715 -1485
- package/dist/design-system-v3.umd.cjs +10 -1
- package/dist/style.css +1 -1
- package/package.json +5 -2
- package/src/components/Alert/Alert.mdx +1 -1
- package/src/components/Alert/Alert.stories.ts +91 -1
- package/src/components/BackBtn/BackBtn.mdx +1 -1
- package/src/components/BackBtn/BackBtn.stories.ts +84 -1
- package/src/components/BackToTopBtn/BackToTopBtn.mdx +3 -3
- package/src/components/BackToTopBtn/BackToTopBtn.stories.ts +172 -11
- package/src/components/CollapsibleList/CollapsibleList.mdx +2 -2
- package/src/components/CollapsibleList/CollapsibleList.stories.ts +37 -1
- package/src/components/CopyBtn/CopyBtn.mdx +1 -1
- package/src/components/CopyBtn/CopyBtn.stories.ts +120 -1
- package/src/components/CopyBtn/CopyBtn.vue +1 -1
- package/src/components/Customs/CustomInputSelect/CustomInputSelect.mdx +6 -8
- package/src/components/Customs/CustomInputSelect/CustomInputSelect.stories.ts +270 -4
- package/src/components/Customs/CustomInputSelect/CustomInputSelect.vue +80 -53
- package/src/components/Customs/CustomInputSelect/config.ts +10 -0
- package/src/components/Customs/CustomSelect/CustomSelect.mdx +3 -3
- package/src/components/Customs/CustomSelect/CustomSelect.stories.ts +158 -2
- package/src/components/Customs/CustomSelect/CustomSelect.vue +25 -6
- package/src/components/Customs/CustomTextField/CustomTextField.mdx +44 -0
- package/src/components/Customs/CustomTextField/CustomTextField.stories.ts +403 -0
- package/src/components/Customs/CustomTextField/CustomTextField.vue +110 -0
- package/src/components/Customs/CustomTextField/tests/CustomTextField.spec.ts +93 -0
- package/src/components/Customs/CustomTextField/tests/__snapshots__/CustomTextField.spec.ts.snap +59 -0
- package/src/components/Customs/CustomTextField/types.d.ts +3 -0
- package/src/components/DataList/DataList.mdx +77 -0
- package/src/components/DataList/DataList.stories.ts +960 -0
- package/src/components/DataList/DataList.vue +140 -0
- package/src/components/DataList/DataListLoading/DataListLoading.vue +56 -0
- package/src/components/DataList/DataListLoading/tests/DataListLoading.spec.ts +23 -0
- package/src/components/DataList/locales.ts +3 -0
- package/src/components/DataList/tests/DataList.spec.ts +194 -0
- package/src/components/DataList/types.d.ts +23 -0
- package/src/components/DataListGroup/DataListGroup.mdx +77 -0
- package/src/components/DataListGroup/DataListGroup.stories.ts +987 -0
- package/src/components/DataListGroup/DataListGroup.vue +59 -0
- package/src/components/DataListGroup/tests/DataListGroup.spec.ts +54 -0
- package/src/components/DataListGroup/tests/data/dataListGroupItems.ts +41 -0
- package/src/components/DataListGroup/types.d.ts +15 -0
- package/src/components/DataListItem/DataListItem.vue +135 -0
- package/src/components/DataListItem/config.ts +17 -0
- package/src/components/DataListItem/locales.ts +3 -0
- package/src/components/DataListItem/tests/DataListItem.spec.ts +156 -0
- package/src/components/DataListItem/types.d.ts +23 -0
- package/src/components/DownloadBtn/Accessibilite.mdx +14 -0
- package/src/components/DownloadBtn/Accessibilite.stories.ts +166 -0
- package/src/components/DownloadBtn/AccessibiliteItems.ts +129 -0
- package/src/components/DownloadBtn/DownloadBtn.mdx +5 -6
- package/src/components/DownloadBtn/DownloadBtn.stories.ts +207 -2
- package/src/components/DownloadBtn/constants/ExpertiseLevelEnum.ts +4 -0
- package/src/components/FooterBar/FooterBar.mdx +2 -2
- package/src/components/FooterBar/FooterBar.stories.ts +1 -1
- package/src/components/FranceConnectBtn/FranceConnectBtn.mdx +1 -1
- package/src/components/FranceConnectBtn/FranceConnectBtn.stories.ts +58 -1
- package/src/components/HeaderBar/HeaderBar.mdx +164 -45
- package/src/components/HeaderBar/HeaderBar.stories.ts +559 -15
- package/src/components/HeaderBar/HeaderBar.vue +60 -22
- package/src/components/HeaderBar/HeaderBurgerMenu/HeaderBurgerMenu.mdx +433 -0
- package/src/components/HeaderBar/HeaderBurgerMenu/HeaderBurgerMenu.stories.ts +1089 -0
- package/src/components/HeaderBar/{HeaderComplexMenu/HeaderComplexMenu.vue → HeaderBurgerMenu/HeaderBurgerMenu.vue} +74 -45
- package/src/components/HeaderBar/HeaderBurgerMenu/HeaderMenuItem/HeaderMenuItem.mdx +38 -0
- package/src/components/HeaderBar/HeaderBurgerMenu/HeaderMenuItem/HeaderMenuItem.stories.ts +89 -0
- package/src/components/HeaderBar/{HeaderComplexMenu → HeaderBurgerMenu}/HeaderMenuItem/tests/__snapshots__/HeaderMenuItem.spec.ts.snap +1 -1
- package/src/components/HeaderBar/HeaderBurgerMenu/HeaderMenuSection/HeaderMenuSection.mdx +17 -0
- package/src/components/HeaderBar/HeaderBurgerMenu/HeaderMenuSection/HeaderMenuSection.stories.ts +121 -0
- package/src/components/HeaderBar/{HeaderComplexMenu → HeaderBurgerMenu}/HeaderMenuSection/HeaderMenuSection.vue +2 -2
- package/src/components/HeaderBar/{HeaderComplexMenu → HeaderBurgerMenu}/HeaderMenuSection/tests/HeaderMenuSection.spec.ts +1 -3
- package/src/components/HeaderBar/HeaderBurgerMenu/HeaderSubMenu/HeaderSubMenu.mdx +43 -0
- package/src/components/HeaderBar/HeaderBurgerMenu/HeaderSubMenu/HeaderSubMenu.stories.ts +261 -0
- package/src/components/HeaderBar/{HeaderComplexMenu → HeaderBurgerMenu}/HeaderSubMenu/HeaderSubMenu.vue +17 -3
- package/src/components/HeaderBar/{HeaderComplexMenu → HeaderBurgerMenu}/HeaderSubMenu/tests/HeaderSubMenu.spec.ts +1 -1
- package/src/components/HeaderBar/HeaderBurgerMenu/tests/HeaderBurgerMenu.spec.ts +180 -0
- package/src/components/HeaderBar/HeaderBurgerMenu/tests/__snapshots__/HeaderBurgerMenu.spec.ts.snap +13 -0
- package/src/components/HeaderBar/HeaderBurgerMenu/tests/__snapshots__/HeaderComplexMenu.spec.ts.snap +13 -0
- package/src/components/HeaderBar/HeaderLogo/HeaderLogo.vue +62 -25
- package/src/components/HeaderBar/HeaderLogo/tests/HeaderLogo.spec.ts +49 -1
- package/src/components/HeaderBar/HeaderMenuBtn/HeaderMenuBtn.vue +19 -23
- package/src/components/HeaderBar/HeaderMenuBtn/tests/HeaderMenuBtn.spec.ts +70 -0
- package/src/components/HeaderBar/Usages.mdx +85 -0
- package/src/components/HeaderBar/consts.scss +0 -1
- package/src/components/HeaderBar/tests/HeaderBar.spec.ts +8 -2
- package/src/components/HeaderBar/tests/__snapshots__/HeaderBar.spec.ts.snap +5 -10
- package/src/components/HeaderLoading/HeaderLoading.mdx +28 -0
- package/src/components/HeaderLoading/HeaderLoading.stories.ts +62 -0
- package/src/components/HeaderLoading/HeaderLoading.vue +45 -0
- package/src/components/HeaderLoading/tests/HeaderLoading.spec.ts +22 -0
- package/src/components/HeaderNavigationBar/HeaderNavigationBar.mdx +128 -0
- package/src/components/HeaderNavigationBar/HeaderNavigationBar.stories.ts +784 -0
- package/src/components/HeaderNavigationBar/HeaderNavigationBar.vue +194 -0
- package/src/components/HeaderNavigationBar/HorizontalNavbar/HorizontalNavbar.vue +74 -0
- package/src/components/HeaderNavigationBar/HorizontalNavbar/config.ts +18 -0
- package/src/components/HeaderNavigationBar/tests/HeaderNavigationBar.spec.ts +127 -0
- package/src/components/HeaderNavigationBar/types.ts +7 -0
- package/src/components/HeaderToolbar/HeaderToolbar.mdx +31 -0
- package/src/components/HeaderToolbar/HeaderToolbar.stories.ts +343 -0
- package/src/components/HeaderToolbar/HeaderToolbar.vue +487 -0
- package/src/components/HeaderToolbar/tests/HeaderToolbar.spec.ts +196 -0
- package/src/components/HeaderToolbar/types.d.ts +20 -0
- package/src/components/LangBtn/LangBtn.mdx +1 -1
- package/src/components/LangBtn/LangBtn.stories.ts +125 -8
- package/src/components/Logo/Logo.mdx +2 -2
- package/src/components/Logo/Logo.stories.ts +147 -1
- package/src/components/LogoBrandSection/LogoBrandSection.mdx +14 -0
- package/src/components/LogoBrandSection/LogoBrandSection.stories.ts +158 -0
- package/src/components/LogoBrandSection/LogoBrandSection.vue +312 -0
- package/src/components/LogoBrandSection/assets/ameli-pro.svg +1 -0
- package/src/components/LogoBrandSection/assets/ameli.svg +1 -0
- package/src/components/LogoBrandSection/assets/cnam.svg +1 -0
- package/src/components/LogoBrandSection/assets/compte-ameli.svg +1 -0
- package/src/components/LogoBrandSection/dividerDimensionsMapping.ts +14 -0
- package/src/components/LogoBrandSection/locales.ts +14 -0
- package/src/components/LogoBrandSection/secondaryLogoMapping.ts +24 -0
- package/src/components/LogoBrandSection/tests/LogoBrandSection.spec.ts +365 -0
- package/src/components/LogoBrandSection/tests/__snapshots__/LogoBrandSection.spec.ts.snap +14 -0
- package/src/components/LogoBrandSection/types.ts +8 -0
- package/src/components/NotificationBar/NotificationBar.mdx +6 -6
- package/src/components/NotificationBar/NotificationBar.stories.ts +1 -1
- package/src/components/NotificationBar/NotificationBar.vue +2 -2
- package/src/components/NotificationBar/tests/NotificationBar.spec.ts +1 -1
- package/src/components/PageContainer/PageContainer.mdx +1 -1
- package/src/components/PageContainer/PageContainer.stories.ts +86 -1
- package/src/components/PhoneField/PhoneField.mdx +49 -0
- package/src/components/PhoneField/PhoneField.stories.ts +869 -0
- package/src/components/PhoneField/PhoneField.vue +230 -0
- package/src/components/PhoneField/indicatifs.ts +104 -0
- package/src/components/PhoneField/locales.ts +4 -0
- package/src/components/PhoneField/tests/PhoneField.spec.ts +179 -0
- package/src/components/SkipLink/SkipLink.stories.ts +50 -1
- package/src/components/SocialMediaLinks/SocialMediaLinks.mdx +28 -1
- package/src/components/SocialMediaLinks/SocialMediaLinks.stories.ts +37 -1
- package/src/components/SubHeader/SubHeader.mdx +31 -0
- package/src/components/SubHeader/SubHeader.stories.ts +1032 -0
- package/src/components/SubHeader/SubHeader.vue +185 -0
- package/src/components/SubHeader/config.ts +12 -0
- package/src/components/SubHeader/locales.ts +3 -0
- package/src/components/SubHeader/tests/SubHeader.spec.ts +144 -0
- package/src/components/index.ts +24 -7
- package/src/composables/widthable/index.ts +29 -0
- package/src/composables/widthable/tests/widthable.spec.ts +52 -0
- package/src/designTokens/tokens/cnam/cnamLightTheme.ts +2 -2
- package/src/main.ts +1 -0
- package/src/modules.d.ts +4 -0
- package/src/services/index.ts +1 -0
- package/src/stories/Demarrer/Accueil.mdx +10 -0
- package/src/stories/Demarrer/Accueil.stories.ts +76 -0
- package/src/stories/Demarrer/PolitiqueDeConfidentialite.mdx +9 -0
- package/src/stories/Demarrer/PolitiqueDeConfidentialite.stories.ts +20 -0
- package/src/stories/Fondamentaux/Accessibilite/Accessibilite.mdx +1 -2
- package/src/stories/Fondamentaux/Accessibilite/Accessibilite.stories.ts +1 -1
- package/src/stories/Fondamentaux/EcoConception/Econception.stories.ts +1 -1
- package/src/stories/GuideDuDev/moduleDeNotification.mdx +52 -48
- package/src/stories/GuideDuDev/vuetifyOptions.mdx +31 -28
- package/src/stories/Guidelines/CustomisationEtThemes.mdx +1 -1
- package/src/utils/functions/throttleDisplayFn/tests/throttleDisplayFn.spec.ts +47 -0
- package/src/utils/functions/throttleDisplayFn/throttleDisplayFn.ts +26 -0
- package/src/utils/rules/exactLength/index.ts +33 -0
- package/src/utils/rules/exactLength/locales.ts +6 -0
- package/src/utils/rules/required/index.ts +25 -0
- package/src/utils/rules/required/locales.ts +5 -0
- package/src/utils/rules/required/ruleMessageHelper.ts +14 -0
- package/src/utils/rules/required/tests/index.spec.ts +47 -0
- package/src/utils/rules/required/tests/rulesMessageHelper.spec.ts +22 -0
- package/src/utils/rules/types.d.ts +15 -0
- package/src/components/Beta/beta.mdx +0 -5
- package/src/components/Deprecated/deprecated.mdx +0 -5
- package/src/components/HeaderBar/HeaderComplexMenu/HeaderComplexMenu.stories.ts +0 -272
- package/src/components/HeaderBar/HeaderComplexMenu/HeaderMenuItem/HeaderMenuItem.stories.ts +0 -49
- package/src/components/HeaderBar/HeaderComplexMenu/HeaderMenuSection/HeaderMenuSection.stories.ts +0 -56
- package/src/components/HeaderBar/HeaderComplexMenu/HeaderSubMenu/HeaderSubMenu.stories.ts +0 -137
- package/src/components/HeaderBar/HeaderComplexMenu/tests/HeaderComplexMenu.spec.ts +0 -129
- package/src/components/HeaderBar/HeaderComplexMenu/tests/__snapshots__/HeaderComplexMenu.spec.ts.snap +0 -18
- package/src/stories/Home/Accueil.mdx +0 -7
- package/src/stories/Home/PolitiqueDeConfidentialite.mdx +0 -4
- package/src/stories/Home/synapse.webp +0 -0
- /package/src/components/HeaderBar/{HeaderComplexMenu → HeaderBurgerMenu}/HeaderMenuItem/HeaderMenuItem.vue +0 -0
- /package/src/components/HeaderBar/{HeaderComplexMenu → HeaderBurgerMenu}/HeaderMenuItem/tests/HeaderMenuItem.spec.ts +0 -0
- /package/src/components/HeaderBar/{HeaderComplexMenu → HeaderBurgerMenu}/conts.ts +0 -0
- /package/src/components/HeaderBar/{HeaderComplexMenu → HeaderBurgerMenu}/locals.ts +0 -0
- /package/src/components/HeaderBar/{HeaderComplexMenu → HeaderBurgerMenu}/tests/useHandleSubMenus.spec.ts +0 -0
- /package/src/components/HeaderBar/{HeaderComplexMenu → HeaderBurgerMenu}/useHandleSubMenus.ts +0 -0
- /package/src/components/Logo/{types.d.ts → types.ts} +0 -0
|
@@ -1,272 +0,0 @@
|
|
|
1
|
-
import HeaderMenu from './HeaderComplexMenu.vue'
|
|
2
|
-
import HeaderBar from '../HeaderBar.vue'
|
|
3
|
-
import type { Meta, StoryObj } from '@storybook/vue3'
|
|
4
|
-
import HeaderMenuSection from './HeaderMenuSection/HeaderMenuSection.vue'
|
|
5
|
-
import HeaderSubMenu from './HeaderSubMenu/HeaderSubMenu.vue'
|
|
6
|
-
import HeaderMenuItem from './HeaderMenuItem/HeaderMenuItem.vue'
|
|
7
|
-
import { VBtn } from 'vuetify/components'
|
|
8
|
-
import { mdiMapMarker } from '@mdi/js'
|
|
9
|
-
|
|
10
|
-
const meta = {
|
|
11
|
-
title: 'Components/HeaderBar/HeaderComplexMenu',
|
|
12
|
-
component: HeaderMenu,
|
|
13
|
-
parameters: {
|
|
14
|
-
layout: 'fullscreen',
|
|
15
|
-
},
|
|
16
|
-
} satisfies Meta<typeof HeaderMenu>
|
|
17
|
-
|
|
18
|
-
export default meta
|
|
19
|
-
|
|
20
|
-
type Story = StoryObj<typeof meta>
|
|
21
|
-
|
|
22
|
-
export const Default: Story = {
|
|
23
|
-
args: {},
|
|
24
|
-
render: (args) => {
|
|
25
|
-
return {
|
|
26
|
-
components: { HeaderMenu, HeaderBar },
|
|
27
|
-
setup() {
|
|
28
|
-
return { args }
|
|
29
|
-
},
|
|
30
|
-
template: `
|
|
31
|
-
<HeaderBar>
|
|
32
|
-
<template #menu>
|
|
33
|
-
<HeaderMenu>
|
|
34
|
-
<p>lorem ipsum</p>
|
|
35
|
-
</HeaderMenu>
|
|
36
|
-
</template>
|
|
37
|
-
</HeaderBar>
|
|
38
|
-
`,
|
|
39
|
-
}
|
|
40
|
-
},
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
export const Populated: Story = {
|
|
44
|
-
args: {},
|
|
45
|
-
render: (args) => {
|
|
46
|
-
return {
|
|
47
|
-
components: { HeaderMenuItem, HeaderMenu, HeaderBar, HeaderSubMenu, HeaderMenuSection, VBtn },
|
|
48
|
-
setup() {
|
|
49
|
-
return { args }
|
|
50
|
-
},
|
|
51
|
-
template: `
|
|
52
|
-
<HeaderBar>
|
|
53
|
-
<template #menu>
|
|
54
|
-
<HeaderMenu>
|
|
55
|
-
<HeaderMenuSection title="section 1">
|
|
56
|
-
<HeaderMenuItem>
|
|
57
|
-
<a>Item 1</a>
|
|
58
|
-
</HeaderMenuItem>
|
|
59
|
-
<HeaderMenuItem>
|
|
60
|
-
<a>Item 2</a>
|
|
61
|
-
</HeaderMenuItem>
|
|
62
|
-
<headerMenuItem>
|
|
63
|
-
<HeaderSubMenu>
|
|
64
|
-
<template #title>
|
|
65
|
-
Menu de premier niveau 1
|
|
66
|
-
</template>
|
|
67
|
-
<HeaderMenuSection title="Section">
|
|
68
|
-
<HeaderMenuItem>
|
|
69
|
-
<a>Item</a>
|
|
70
|
-
</HeaderMenuItem>
|
|
71
|
-
<HeaderSubMenu>
|
|
72
|
-
<template #title>
|
|
73
|
-
Menu de deuxième niveau 1
|
|
74
|
-
</template>
|
|
75
|
-
<HeaderMenuItem>
|
|
76
|
-
<a>Item</a>
|
|
77
|
-
</HeaderMenuItem>
|
|
78
|
-
</HeaderSubMenu>
|
|
79
|
-
</HeaderMenuSection>
|
|
80
|
-
</HeaderSubMenu>
|
|
81
|
-
</headerMenuItem>
|
|
82
|
-
</HeaderMenuSection>
|
|
83
|
-
<HeaderMenuSection title="section 2">
|
|
84
|
-
<headerMenuItem>
|
|
85
|
-
<HeaderSubMenu>
|
|
86
|
-
<template #title>
|
|
87
|
-
Menu de premier niveau 2
|
|
88
|
-
</template>
|
|
89
|
-
<HeaderMenuItem>
|
|
90
|
-
<a>Item 1</a>
|
|
91
|
-
</HeaderMenuItem>
|
|
92
|
-
<HeaderMenuItem>
|
|
93
|
-
<HeaderSubMenu>
|
|
94
|
-
<template #title>
|
|
95
|
-
Menu de deuxième niveau 2
|
|
96
|
-
</template>
|
|
97
|
-
<HeaderMenuItem>
|
|
98
|
-
<a>Item 1</a>
|
|
99
|
-
</HeaderMenuItem>
|
|
100
|
-
</HeaderSubMenu>
|
|
101
|
-
</HeaderMenuItem>
|
|
102
|
-
<HeaderMenuItem>
|
|
103
|
-
<HeaderSubMenu>
|
|
104
|
-
<template #title>
|
|
105
|
-
Menu de deuxième niveau 3
|
|
106
|
-
</template>
|
|
107
|
-
<HeaderMenuSection title="section 1">
|
|
108
|
-
<HeaderMenuItem>
|
|
109
|
-
<a>Item 1</a>
|
|
110
|
-
</HeaderMenuItem>
|
|
111
|
-
</HeaderMenuSection>
|
|
112
|
-
</HeaderSubMenu>
|
|
113
|
-
</HeaderMenuItem>
|
|
114
|
-
</HeaderSubMenu>
|
|
115
|
-
</headerMenuItem>
|
|
116
|
-
<HeaderMenuItem>
|
|
117
|
-
<a>Item 3</a>
|
|
118
|
-
</HeaderMenuItem>
|
|
119
|
-
</HeaderMenuSection>
|
|
120
|
-
<div class="pa-4">
|
|
121
|
-
<p class="font-weight-bold">Veillez vous connecter</p>
|
|
122
|
-
<VBtn variant="tonal" class="mt-4 font-weight-medium" color="primary">Je me connecte</VBtn>
|
|
123
|
-
</div>
|
|
124
|
-
</HeaderMenu>
|
|
125
|
-
</template>
|
|
126
|
-
</HeaderBar>
|
|
127
|
-
`,
|
|
128
|
-
}
|
|
129
|
-
},
|
|
130
|
-
}
|
|
131
|
-
|
|
132
|
-
export const Generated: Story = {
|
|
133
|
-
args: {
|
|
134
|
-
},
|
|
135
|
-
render: (args) => {
|
|
136
|
-
return {
|
|
137
|
-
components: { HeaderMenu, HeaderBar, HeaderMenuSection, HeaderSubMenu, HeaderMenuItem },
|
|
138
|
-
setup() {
|
|
139
|
-
const menu = [
|
|
140
|
-
{
|
|
141
|
-
title: 'Vous informer',
|
|
142
|
-
items: [
|
|
143
|
-
{ title: 'Actualités', href: 'https://www.ameli.fr/assure/actualites' },
|
|
144
|
-
{
|
|
145
|
-
subMenuTitle: 'Droits et démarches',
|
|
146
|
-
subMenuSubtitle: 'selon votre situation',
|
|
147
|
-
sections: [
|
|
148
|
-
{
|
|
149
|
-
title: undefined,
|
|
150
|
-
items: [
|
|
151
|
-
{ title: 'Les essentiels de l’assuré', href: 'https://www.ameli.fr/assure/droits-demarches/principes' },
|
|
152
|
-
{ title: 'Parentalité, couple', href: 'https://www.ameli.fr/assure/droits-demarches/famille' },
|
|
153
|
-
{ title: 'Fin de vie, deuil', href: 'https://www.ameli.fr/assure/droits-demarches/fin-de-vie-deuil' },
|
|
154
|
-
{ title: 'Etudes et stages', href: 'https://www.ameli.fr/assure/droits-demarches/etudes-stages' },
|
|
155
|
-
{ title: 'Vie professionnelle, retraite', href: 'https://www.ameli.fr/assure/droits-demarches/vie-professionnelle-retraite' },
|
|
156
|
-
{ title: 'Difficultés d\'accès aux droits et aux soins', href: 'https://www.ameli.fr/assure/droits-demarches/difficultes-acces-droits-soins' },
|
|
157
|
-
{ title: 'Maladie, accident, hospitalisation', href: 'https://www.ameli.fr/assure/droits-demarches/maladie-accident-hospitalisation' },
|
|
158
|
-
{ title: 'invalidité, handicap', href: 'https://www.ameli.fr/assure/droits-demarches/invalidite-handicap' },
|
|
159
|
-
{ title: 'situations particumlières', href: 'https://www.ameli.fr/assure/droits-demarches/situations-particulieres' },
|
|
160
|
-
{ title: 'réclamation, médiation, recours', href: 'https://www.ameli.fr/assure/droits-demarches/reclamation-mediation-voies-de-recours' },
|
|
161
|
-
{ title: 'Europe, international', href: 'https://www.ameli.fr/assure/droits-demarches/europe-international' },
|
|
162
|
-
],
|
|
163
|
-
},
|
|
164
|
-
],
|
|
165
|
-
},
|
|
166
|
-
{
|
|
167
|
-
subMenuTitle: 'Remboursements',
|
|
168
|
-
subMenuSubtitle: 'prestations et aides',
|
|
169
|
-
sections: [
|
|
170
|
-
{
|
|
171
|
-
title: undefined,
|
|
172
|
-
items: [
|
|
173
|
-
{ title: 'Ce qui est remboursé', href: 'https://www.ameli.fr/assure/remboursements/rembourse' },
|
|
174
|
-
{ title: 'ce qui reste à votre charge', href: 'https://www.ameli.fr/assure/remboursements/reste-charge' },
|
|
175
|
-
{ title: 'Être bien remboursé', href: 'https://www.ameli.fr/assure/remboursements/etre-bien-rembourse' },
|
|
176
|
-
{ title: 'Indemnités journalières maladie, maternité, paternité', href: 'https://www.ameli.fr/assure/remboursements/indemnites-journalieres-maladie-maternite-paternite' },
|
|
177
|
-
{ title: 'Accident du travail : prise en charge et indemnités journalières', href: 'https://www.ameli.fr/assure/remboursements/accident-travail' },
|
|
178
|
-
{ title: 'Maladie professionnelle : prise en charge et indemnités journalières', href: 'https://www.ameli.fr/assure/remboursements/maladie-professionnelle' },
|
|
179
|
-
{ title: 'Pensions, allocations et rentes', href: 'https://www.ameli.fr/assure/remboursements/pensions-allocations-rentes' },
|
|
180
|
-
{ title: 'Incapacité permanente', href: 'https://www.ameli.fr/assure/remboursements/incapacite-permanente' },
|
|
181
|
-
{ title: 'Complémentaire santé solidaire : vous n\'avez rien à payer dans la plupart des cas ', href: 'https://www.ameli.fr/assure/remboursements/cmu-aides-financieres/complementaire-sante-solidaire' },
|
|
182
|
-
{ title: 'Aide médicale de l\'État et soins urgents', href: 'https://www.ameli.fr/assure/remboursements/aide-medicale-etat-soins-urgents' },
|
|
183
|
-
{ title: 'Compte ameli, mode d\'emploi', href: 'https://www.ameli.fr/assure/remboursements/suivre-remboursements' },
|
|
184
|
-
],
|
|
185
|
-
},
|
|
186
|
-
],
|
|
187
|
-
},
|
|
188
|
-
{
|
|
189
|
-
subMenuTitle: 'Maladies et prévention',
|
|
190
|
-
sections: [
|
|
191
|
-
{
|
|
192
|
-
title: undefined,
|
|
193
|
-
items: [
|
|
194
|
-
{ title: 'Tous les thèmes de santé', href: 'https://www.ameli.fr/assure/sante/themes' },
|
|
195
|
-
{ title: 'L\'Assurance Maladie vous accompagne', href: 'https://www.ameli.fr/assure/remboursements/reste-charge' },
|
|
196
|
-
{ title: 'Mon espace santé', href: 'https://www.ameli.fr/assure/sante/mon-espace-sante' },
|
|
197
|
-
{ title: 'Mon bilan prévention', href: 'https://www.ameli.fr/assure/sante/mon-bilan-prevention' },
|
|
198
|
-
{ title: 'Réagir en cas \'urgence ', href: 'https://www.ameli.fr/assure/sante/urgence' },
|
|
199
|
-
{ title: 'Accomplir les bons gestes ', href: 'https://www.ameli.fr/assure/sante/bons-gestes' },
|
|
200
|
-
{ title: 'Médicaments et vaccins', href: 'https://www.ameli.fr/assure/sante/medicaments' },
|
|
201
|
-
{ title: 'Déroulement d\'un examen', href: 'https://www.ameli.fr/assure/sante/examen' },
|
|
202
|
-
{ title: 'Certificat médical : dans quels cas et pour qui est-il obligatoire ?', href: 'https://www.ameli.fr/assure/sante/certificat-medical-quand-et-pour-qui' },
|
|
203
|
-
{ title: 'Devenir parent', href: 'https://www.ameli.fr/assure/sante/devenir-parent' },
|
|
204
|
-
{ title: 'Enfants', href: 'https://www.ameli.fr/assure/sante/enfants' },
|
|
205
|
-
{ title: 'Jeunes 16-25 ans', href: 'https://www.ameli.fr/assure/sante/jeunes-16-25-ans' },
|
|
206
|
-
{ title: 'Seniors', href: 'https://www.ameli.fr/assure/sante/seniors' },
|
|
207
|
-
{ title: 'Télésanté, la santé à distance', href: 'https://www.ameli.fr/assure/sante/telesante' },
|
|
208
|
-
],
|
|
209
|
-
},
|
|
210
|
-
],
|
|
211
|
-
},
|
|
212
|
-
],
|
|
213
|
-
},
|
|
214
|
-
{
|
|
215
|
-
title: 'Besoin d\'aide',
|
|
216
|
-
items: [
|
|
217
|
-
{
|
|
218
|
-
title: 'Contacter l\'Assurance Maladie',
|
|
219
|
-
subtitle: 'obtenir une attestation, envoyer une feuille de soins, contacter sa caisse, etc.',
|
|
220
|
-
href: 'https://www.ameli.fr/assure/adresses-contacts',
|
|
221
|
-
},
|
|
222
|
-
{
|
|
223
|
-
title: 'Trouver un professionnel de santé',
|
|
224
|
-
subtitle: 'médecins, infirmiers...',
|
|
225
|
-
href: 'https://www.ameli.fr/assure/adresses-contacts' },
|
|
226
|
-
{ title: 'Télécharger un formulaire (ex: cerfa)', href: 'https://www.ameli.fr/assure/droits-demarches/formulaires' },
|
|
227
|
-
{ title: 'Consulter le forum', href: 'https://forum-assures.ameli.fr/' },
|
|
228
|
-
{ title: 'Sourds et malentendants', href: 'https://elioz.fr/elioz-connect/annuaire/assurance-maladie-annuaire/' },
|
|
229
|
-
],
|
|
230
|
-
},
|
|
231
|
-
]
|
|
232
|
-
return { args, menu, marker: mdiMapMarker }
|
|
233
|
-
},
|
|
234
|
-
template: `
|
|
235
|
-
<HeaderBar>
|
|
236
|
-
<template #menu>
|
|
237
|
-
<HeaderMenu>
|
|
238
|
-
<HeaderMenuSection v-for="section in menu" :key="section.title" :title="section.title">
|
|
239
|
-
<HeaderMenuItem v-for="item in section.items" :key="item.title">
|
|
240
|
-
<HeaderSubMenu v-if="item.subMenuTitle">
|
|
241
|
-
<template #title>
|
|
242
|
-
{{ item.subMenuTitle }}
|
|
243
|
-
<em v-if="item.subMenuSubtitle" style="font-style: normal; color: #757777;">{{ item.subMenuSubtitle }}</em>
|
|
244
|
-
</template>
|
|
245
|
-
<HeaderMenuSection v-for="subSection in item.sections" :key="subSection.title" :title="subSection.title">
|
|
246
|
-
<HeaderMenuItem v-for="subItem in subSection.items" :key="subItem.title">
|
|
247
|
-
<a :href="subItem.href">{{ subItem.title }}</a>
|
|
248
|
-
</HeaderMenuItem>
|
|
249
|
-
</HeaderMenuSection>
|
|
250
|
-
</HeaderSubMenu>
|
|
251
|
-
<a v-else :href="item.href">
|
|
252
|
-
{{ item.title }}
|
|
253
|
-
<em v-if="item.subtitle" style="font-style: normal; color: #757777;">{{ item.subtitle }}</em>
|
|
254
|
-
</a>
|
|
255
|
-
</HeaderMenuItem>
|
|
256
|
-
</HeaderMenuSection>
|
|
257
|
-
<h2 class="border-b-sm mb-2" style="font-size: 1.1rem; padding: 40px 16px 8px 20px;">Votre caisse</h2>
|
|
258
|
-
<div style="padding: 16px 50px 16px 20px;">
|
|
259
|
-
<div class="d-flex align-center ga-2 font-weight-bold">
|
|
260
|
-
<VIcon aria-label="Localisation" role="img" aria-hidden="false" color="primary">{{marker}}</VIcon>
|
|
261
|
-
<p>Vous n'avez pas sélectionné votre caisse</p>
|
|
262
|
-
</div>
|
|
263
|
-
<VBtn class="mt-3 mb-4 font-weight-bold text-capitalize" base-color="primary" density="comfortable" flat height="37">Sélectionner</VBtn>
|
|
264
|
-
<p class="mb-8">Les pages d'ameli seront alors enrichies des informations locales de votre caisse (contacts, événements régionaux, etc.) </p>
|
|
265
|
-
</div>
|
|
266
|
-
</HeaderMenu>
|
|
267
|
-
</template>
|
|
268
|
-
</HeaderBar>
|
|
269
|
-
`,
|
|
270
|
-
}
|
|
271
|
-
},
|
|
272
|
-
}
|
|
@@ -1,49 +0,0 @@
|
|
|
1
|
-
import type { Meta, StoryObj } from '@storybook/vue3'
|
|
2
|
-
import HeaderMenuItem from './HeaderMenuItem.vue'
|
|
3
|
-
import HeaderMenu from '../HeaderComplexMenu.vue'
|
|
4
|
-
import HeaderBar from '../../HeaderBar.vue'
|
|
5
|
-
|
|
6
|
-
const meta = {
|
|
7
|
-
title: 'Components/HeaderBar/HeaderComplexMenu/HeaderMenuItem',
|
|
8
|
-
component: HeaderMenuItem,
|
|
9
|
-
parameters: {
|
|
10
|
-
layout: 'fullscreen',
|
|
11
|
-
},
|
|
12
|
-
} satisfies Meta<typeof HeaderMenuItem>
|
|
13
|
-
|
|
14
|
-
export default meta
|
|
15
|
-
|
|
16
|
-
type Story = StoryObj<typeof meta>
|
|
17
|
-
|
|
18
|
-
export const Default: Story = {
|
|
19
|
-
args: {
|
|
20
|
-
default: 'lorem ipsum',
|
|
21
|
-
},
|
|
22
|
-
render: (args) => {
|
|
23
|
-
return {
|
|
24
|
-
components: { HeaderMenuItem, HeaderMenu, HeaderBar },
|
|
25
|
-
setup() {
|
|
26
|
-
return { args }
|
|
27
|
-
},
|
|
28
|
-
template: `
|
|
29
|
-
<HeaderBar>
|
|
30
|
-
<template #menu>
|
|
31
|
-
<HeaderMenu>
|
|
32
|
-
<HeaderMenuSection>
|
|
33
|
-
<HeaderMenuItem>
|
|
34
|
-
<a>{{ args.default }}</a>
|
|
35
|
-
</HeaderMenuItem>
|
|
36
|
-
</HeaderMenuSection>
|
|
37
|
-
</HeaderMenu>
|
|
38
|
-
</template>
|
|
39
|
-
</HeaderBar>
|
|
40
|
-
`,
|
|
41
|
-
}
|
|
42
|
-
},
|
|
43
|
-
play: async ({ canvasElement }) => {
|
|
44
|
-
const menuBtn = canvasElement.querySelector('button')
|
|
45
|
-
setTimeout(() => {
|
|
46
|
-
menuBtn!.click()
|
|
47
|
-
}, 1000)
|
|
48
|
-
},
|
|
49
|
-
}
|
package/src/components/HeaderBar/HeaderComplexMenu/HeaderMenuSection/HeaderMenuSection.stories.ts
DELETED
|
@@ -1,56 +0,0 @@
|
|
|
1
|
-
import type { Meta, StoryObj } from '@storybook/vue3'
|
|
2
|
-
import HeaderMenuSection from './HeaderMenuSection.vue'
|
|
3
|
-
import HeaderMenuItem from '../HeaderMenuItem/HeaderMenuItem.vue'
|
|
4
|
-
import HeaderMenu from '../HeaderComplexMenu.vue'
|
|
5
|
-
import HeaderBar from '../../HeaderBar.vue'
|
|
6
|
-
|
|
7
|
-
const meta = {
|
|
8
|
-
title: 'Components/HeaderBar/HeaderComplexMenu/HeaderMenuSection',
|
|
9
|
-
component: HeaderMenuSection,
|
|
10
|
-
parameters: {
|
|
11
|
-
layout: 'fullscreen',
|
|
12
|
-
},
|
|
13
|
-
} satisfies Meta<typeof HeaderMenuSection>
|
|
14
|
-
|
|
15
|
-
export default meta
|
|
16
|
-
|
|
17
|
-
type Story = StoryObj<typeof meta>
|
|
18
|
-
|
|
19
|
-
export const Default: Story = {
|
|
20
|
-
args: {
|
|
21
|
-
title: 'section 1',
|
|
22
|
-
},
|
|
23
|
-
render: (args) => {
|
|
24
|
-
return {
|
|
25
|
-
components: { HeaderMenuItem, HeaderMenu, HeaderBar, HeaderMenuSection },
|
|
26
|
-
setup() {
|
|
27
|
-
return { args }
|
|
28
|
-
},
|
|
29
|
-
template: `
|
|
30
|
-
<HeaderBar>
|
|
31
|
-
<template #menu>
|
|
32
|
-
<HeaderMenu>
|
|
33
|
-
<HeaderMenuSection :title="args.title">
|
|
34
|
-
<HeaderMenuItem>
|
|
35
|
-
<a>lorem ipsum</a>
|
|
36
|
-
</HeaderMenuItem>
|
|
37
|
-
</HeaderMenuSection>
|
|
38
|
-
|
|
39
|
-
<HeaderMenuSection title="section 2">
|
|
40
|
-
<HeaderMenuItem>
|
|
41
|
-
<a>lorem ipsum</a>
|
|
42
|
-
</HeaderMenuItem>
|
|
43
|
-
</HeaderMenuSection>
|
|
44
|
-
</HeaderMenu>
|
|
45
|
-
</template>
|
|
46
|
-
</HeaderBar>
|
|
47
|
-
`,
|
|
48
|
-
}
|
|
49
|
-
},
|
|
50
|
-
play: async ({ canvasElement }) => {
|
|
51
|
-
const menuBtn = canvasElement.querySelector('button')
|
|
52
|
-
setTimeout(() => {
|
|
53
|
-
menuBtn!.click()
|
|
54
|
-
}, 1000)
|
|
55
|
-
},
|
|
56
|
-
}
|
|
@@ -1,137 +0,0 @@
|
|
|
1
|
-
import type { Meta, StoryObj } from '@storybook/vue3'
|
|
2
|
-
import HeaderBar from '../../HeaderBar.vue'
|
|
3
|
-
import HeaderMenu from '../HeaderComplexMenu.vue'
|
|
4
|
-
import HeaderMenuItem from '../HeaderMenuItem/HeaderMenuItem.vue'
|
|
5
|
-
import HeaderMenuSection from '../HeaderMenuSection/HeaderMenuSection.vue'
|
|
6
|
-
import HeaderSubMenu from './HeaderSubMenu.vue'
|
|
7
|
-
|
|
8
|
-
const meta = {
|
|
9
|
-
title: 'Components/HeaderBar/HeaderComplexMenu/HeaderSubMenu',
|
|
10
|
-
component: HeaderSubMenu,
|
|
11
|
-
parameters: {
|
|
12
|
-
layout: 'fullscreen',
|
|
13
|
-
},
|
|
14
|
-
} satisfies Meta<typeof HeaderSubMenu>
|
|
15
|
-
|
|
16
|
-
export default meta
|
|
17
|
-
|
|
18
|
-
type Story = StoryObj<typeof meta>
|
|
19
|
-
|
|
20
|
-
export const Default: Story = {
|
|
21
|
-
args: {
|
|
22
|
-
title: 'Menu de premier niveau',
|
|
23
|
-
},
|
|
24
|
-
render: (args) => {
|
|
25
|
-
return {
|
|
26
|
-
components: { HeaderMenuItem, HeaderMenu, HeaderBar, HeaderSubMenu, HeaderMenuSection },
|
|
27
|
-
setup() {
|
|
28
|
-
return { args }
|
|
29
|
-
},
|
|
30
|
-
template: `
|
|
31
|
-
<HeaderBar>
|
|
32
|
-
<template #menu>
|
|
33
|
-
<HeaderMenu>
|
|
34
|
-
<HeaderMenuSection>
|
|
35
|
-
<HeaderMenuItem>
|
|
36
|
-
<a>Item</a>
|
|
37
|
-
</HeaderMenuItem>
|
|
38
|
-
<HeaderMenuItem>
|
|
39
|
-
<a>Item</a>
|
|
40
|
-
</HeaderMenuItem>
|
|
41
|
-
<headerMenuItem>
|
|
42
|
-
<HeaderSubMenu>
|
|
43
|
-
<template #title>
|
|
44
|
-
{{ args.title }}
|
|
45
|
-
</template>
|
|
46
|
-
<HeaderMenuItem>
|
|
47
|
-
<a>Item</a>
|
|
48
|
-
</HeaderMenuItem>
|
|
49
|
-
</HeaderSubMenu>
|
|
50
|
-
</headerMenuItem>
|
|
51
|
-
<HeaderMenuItem>
|
|
52
|
-
<a>Item</a>
|
|
53
|
-
</HeaderMenuItem>
|
|
54
|
-
</HeaderMenuSection>
|
|
55
|
-
</HeaderMenu>
|
|
56
|
-
</template>
|
|
57
|
-
</HeaderBar>
|
|
58
|
-
`,
|
|
59
|
-
}
|
|
60
|
-
},
|
|
61
|
-
play: async ({ canvasElement }) => {
|
|
62
|
-
const menuBtn = canvasElement.querySelector('button')
|
|
63
|
-
setTimeout(() => {
|
|
64
|
-
menuBtn!.click()
|
|
65
|
-
}, 1000)
|
|
66
|
-
},
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
export const Deep: Story = {
|
|
70
|
-
args: {
|
|
71
|
-
title: 'Menu de deuxième niveau',
|
|
72
|
-
},
|
|
73
|
-
render: (args) => {
|
|
74
|
-
return {
|
|
75
|
-
components: { HeaderMenuItem, HeaderMenu, HeaderBar, HeaderSubMenu, HeaderMenuSection },
|
|
76
|
-
setup() {
|
|
77
|
-
return { args }
|
|
78
|
-
},
|
|
79
|
-
template: `
|
|
80
|
-
<HeaderBar>
|
|
81
|
-
<template #menu>
|
|
82
|
-
<HeaderMenu>
|
|
83
|
-
<HeaderMenuSection>
|
|
84
|
-
<HeaderMenuItem>
|
|
85
|
-
<a>Item 1</a>
|
|
86
|
-
</HeaderMenuItem>
|
|
87
|
-
<HeaderMenuItem>
|
|
88
|
-
<a>Item 2</a>
|
|
89
|
-
</HeaderMenuItem>
|
|
90
|
-
<headerMenuItem>
|
|
91
|
-
<HeaderSubMenu>
|
|
92
|
-
<template #title>
|
|
93
|
-
Menu de premier niveau
|
|
94
|
-
</template>
|
|
95
|
-
<HeaderMenuItem>
|
|
96
|
-
<a>Item 2.1</a>
|
|
97
|
-
</HeaderMenuItem>
|
|
98
|
-
<HeaderMenuItem>
|
|
99
|
-
<a>Item 2.2</a>
|
|
100
|
-
</HeaderMenuItem>
|
|
101
|
-
<HeaderMenuItem>
|
|
102
|
-
<HeaderSubMenu>
|
|
103
|
-
<template #title>
|
|
104
|
-
Menu de deuxième niveau
|
|
105
|
-
</template>
|
|
106
|
-
<HeaderMenuItem>
|
|
107
|
-
<a>Item 3.1</a>
|
|
108
|
-
</HeaderMenuItem>
|
|
109
|
-
<HeaderMenuItem>
|
|
110
|
-
<a>Item 3.2</a>
|
|
111
|
-
</HeaderMenuItem>
|
|
112
|
-
</HeaderSubMenu>
|
|
113
|
-
</HeaderMenuItem>
|
|
114
|
-
</HeaderSubMenu>
|
|
115
|
-
</headerMenuItem>
|
|
116
|
-
<HeaderMenuItem>
|
|
117
|
-
<a>Item 3</a>
|
|
118
|
-
</HeaderMenuItem>
|
|
119
|
-
</HeaderMenuSection>
|
|
120
|
-
</HeaderMenu>
|
|
121
|
-
</template>
|
|
122
|
-
</HeaderBar>
|
|
123
|
-
`,
|
|
124
|
-
}
|
|
125
|
-
},
|
|
126
|
-
play: async ({ canvasElement }) => {
|
|
127
|
-
const menuBtn = canvasElement.querySelector('button')
|
|
128
|
-
await new Promise(resolve => setTimeout(resolve, 1000))
|
|
129
|
-
await menuBtn!.click()
|
|
130
|
-
await new Promise(resolve => setTimeout(resolve, 500))
|
|
131
|
-
const subMenuBtn = canvasElement.querySelector<HTMLElement>('.sub-menu-btn')
|
|
132
|
-
await subMenuBtn!.click()
|
|
133
|
-
await new Promise(resolve => setTimeout(resolve, 500))
|
|
134
|
-
const subMenuBtn2 = canvasElement.querySelector<HTMLElement>('.sub-menu .sub-menu .sub-menu-btn')
|
|
135
|
-
await subMenuBtn2!.click()
|
|
136
|
-
},
|
|
137
|
-
}
|
|
@@ -1,129 +0,0 @@
|
|
|
1
|
-
import { vuetify } from '@tests/unit/setup'
|
|
2
|
-
import { mount } from '@vue/test-utils'
|
|
3
|
-
import { afterEach } from 'node:test'
|
|
4
|
-
import { describe, expect, it, vi } from 'vitest'
|
|
5
|
-
import { registerHeaderMenuKey } from '../../consts'
|
|
6
|
-
import HeaderComplexMenu from '../HeaderComplexMenu.vue'
|
|
7
|
-
|
|
8
|
-
describe('HeaderComplexMenu', () => {
|
|
9
|
-
const BtnTestComponent = {
|
|
10
|
-
setup() {
|
|
11
|
-
const props = defineProps({ modelValue: Boolean })
|
|
12
|
-
return { open: props.modelValue }
|
|
13
|
-
},
|
|
14
|
-
template: `<button @click="$emit('update:modelValue', !open)">Test</button>`,
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
afterEach(() => {
|
|
18
|
-
vi.resetAllMocks()
|
|
19
|
-
document.body.innerHTML = ''
|
|
20
|
-
})
|
|
21
|
-
|
|
22
|
-
it('should render the component', async () => {
|
|
23
|
-
const wrapper = mount(HeaderComplexMenu, {
|
|
24
|
-
global: {
|
|
25
|
-
plugins: [vuetify],
|
|
26
|
-
provide: {
|
|
27
|
-
[registerHeaderMenuKey]: () => {},
|
|
28
|
-
},
|
|
29
|
-
},
|
|
30
|
-
slots: {
|
|
31
|
-
default: '<div>Default slot</div>',
|
|
32
|
-
},
|
|
33
|
-
stubs: {
|
|
34
|
-
HeaderMenuBtn: BtnTestComponent,
|
|
35
|
-
},
|
|
36
|
-
})
|
|
37
|
-
|
|
38
|
-
expect(wrapper.html()).toMatchSnapshot()
|
|
39
|
-
|
|
40
|
-
const menu = wrapper.find('.overlay')
|
|
41
|
-
expect(menu.attributes('style')).toContain('display: none;')
|
|
42
|
-
|
|
43
|
-
const btn = wrapper.find('.header-menu-btn')
|
|
44
|
-
await btn.trigger('click')
|
|
45
|
-
expect(menu.attributes('style')).toBeUndefined()
|
|
46
|
-
})
|
|
47
|
-
|
|
48
|
-
it('should close the menu when clicking outside', async () => {
|
|
49
|
-
const wrapper = mount(HeaderComplexMenu, {
|
|
50
|
-
global: {
|
|
51
|
-
plugins: [vuetify],
|
|
52
|
-
provide: {
|
|
53
|
-
[registerHeaderMenuKey]: () => {},
|
|
54
|
-
},
|
|
55
|
-
},
|
|
56
|
-
stubs: {
|
|
57
|
-
HeaderMenuBtn: BtnTestComponent,
|
|
58
|
-
},
|
|
59
|
-
slots: {
|
|
60
|
-
default: '<div>Default slot</div>',
|
|
61
|
-
},
|
|
62
|
-
attachTo: document.body,
|
|
63
|
-
})
|
|
64
|
-
|
|
65
|
-
const overlay = wrapper.find('.overlay')
|
|
66
|
-
const btn = wrapper.find('.header-menu-btn')
|
|
67
|
-
|
|
68
|
-
await btn.trigger('click')
|
|
69
|
-
expect(overlay.attributes('style')).toBeUndefined()
|
|
70
|
-
|
|
71
|
-
await overlay.trigger('click')
|
|
72
|
-
expect(overlay.attributes('style')).toContain('display: none;')
|
|
73
|
-
|
|
74
|
-
wrapper.unmount()
|
|
75
|
-
})
|
|
76
|
-
|
|
77
|
-
it('should not close the menu when clicking inside', async () => {
|
|
78
|
-
const wrapper = mount(HeaderComplexMenu, {
|
|
79
|
-
global: {
|
|
80
|
-
plugins: [vuetify],
|
|
81
|
-
provide: {
|
|
82
|
-
[registerHeaderMenuKey]: () => {},
|
|
83
|
-
},
|
|
84
|
-
},
|
|
85
|
-
stubs: {
|
|
86
|
-
HeaderMenuBtn: BtnTestComponent,
|
|
87
|
-
},
|
|
88
|
-
slots: {
|
|
89
|
-
default: '<div>Default slot</div>',
|
|
90
|
-
},
|
|
91
|
-
attachTo: document.body,
|
|
92
|
-
})
|
|
93
|
-
|
|
94
|
-
const menu = wrapper.find('.overlay')
|
|
95
|
-
const btn = wrapper.find('button')
|
|
96
|
-
await btn.trigger('click')
|
|
97
|
-
expect(menu.attributes('style')).toBeUndefined()
|
|
98
|
-
|
|
99
|
-
await wrapper.find('.header-menu').trigger('click')
|
|
100
|
-
expect(menu.attributes('style')).toBeUndefined()
|
|
101
|
-
|
|
102
|
-
wrapper.unmount()
|
|
103
|
-
})
|
|
104
|
-
|
|
105
|
-
it('should listen to the button to open and close the menu', async () => {
|
|
106
|
-
const wrapper = mount(HeaderComplexMenu, {
|
|
107
|
-
global: {
|
|
108
|
-
plugins: [vuetify],
|
|
109
|
-
provide: {
|
|
110
|
-
[registerHeaderMenuKey]: () => {},
|
|
111
|
-
},
|
|
112
|
-
},
|
|
113
|
-
stubs: {
|
|
114
|
-
HeaderMenuBtn: BtnTestComponent,
|
|
115
|
-
},
|
|
116
|
-
slots: {
|
|
117
|
-
default: '<div>Default slot</div>',
|
|
118
|
-
},
|
|
119
|
-
})
|
|
120
|
-
|
|
121
|
-
const menu = wrapper.find('.overlay')
|
|
122
|
-
const btn = wrapper.find('button')
|
|
123
|
-
await btn.trigger('click')
|
|
124
|
-
expect(menu.attributes('style')).toBeUndefined()
|
|
125
|
-
|
|
126
|
-
await btn.trigger('click')
|
|
127
|
-
expect(menu.attributes('style')).toContain('display: none;')
|
|
128
|
-
})
|
|
129
|
-
})
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
|
2
|
-
|
|
3
|
-
exports[`HeaderComplexMenu > should render the component 1`] = `
|
|
4
|
-
"<div data-v-10d9bc74="" role="dialog" aria-modal="true" aria-label="Menu principal">
|
|
5
|
-
<div data-v-10d9bc74=""><button data-v-70557900="" data-v-10d9bc74="" class="header-menu-btn" style="background-color: #1867C0; color: #fff;" type="button" aria-label="Ouvrir le menu" title="Ouvrir le menu"><i data-v-70557900="" class="M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z mdi v-icon notranslate v-theme--light" style="font-size: 48px; height: 48px; width: 48px;" aria-hidden="true"></i><span data-v-70557900="" class="header-menu-btn__label">Menu</span></button></div>
|
|
6
|
-
<transition-stub data-v-10d9bc74="" name="menu" appear="false" persisted="true" css="true">
|
|
7
|
-
<div data-v-10d9bc74="" class="overlay" style="display: none;">
|
|
8
|
-
<div data-v-10d9bc74="" role="menu" class="menu-wrapper" style="left: 0px; top: 0px;"><button data-v-70557900="" data-v-10d9bc74="" class="header-menu-btn" style="background-color: #1867C0; color: #fff;" type="button" aria-label="Ouvrir le menu" title="Ouvrir le menu"><i data-v-70557900="" class="M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z mdi v-icon notranslate v-theme--light" style="font-size: 48px; height: 48px; width: 48px;" aria-hidden="true"></i><span data-v-70557900="" class="header-menu-btn__label">Menu</span></button>
|
|
9
|
-
<nav data-v-10d9bc74="" id="header-menu-wrapper" class="header-menu-wrapper" role="navigation" aria-label="Menu public">
|
|
10
|
-
<div data-v-10d9bc74="" class="header-menu">
|
|
11
|
-
<div>Default slot</div>
|
|
12
|
-
</div>
|
|
13
|
-
</nav>
|
|
14
|
-
</div>
|
|
15
|
-
</div>
|
|
16
|
-
</transition-stub>
|
|
17
|
-
</div>"
|
|
18
|
-
`;
|
|
Binary file
|
|
File without changes
|