Merge pull request #529 from dnum-mi/develop

Develop

Author: laruiss

ci/check-exports.mjs

@@ -1,4 +1,5 @@
 #!/usr/bin/env node
+import { fileURLToPath, URL } from 'url'
 import { readFile, writeFile } from 'fs/promises'
 import inquirer from 'inquirer'
 import chalk from 'chalk'
@@ -7,22 +8,25 @@ import path from 'path'
 
 const isCI = process.argv.includes('--ci')
 
-const __dirname = path.dirname(new URL(import.meta.url).pathname)
+const getNormalizedDir = (relativeDir) => fileURLToPath(new URL(relativeDir, import.meta.url))
 
-const sfcs = await globby([path.resolve(__dirname, '../src/components/**/*.vue')])
-const componentsDir = path.resolve(__dirname, '../src/components')
+// const sfcs = await globby(fileURLToPath(new URL('../src/components/**/*.vue', import.meta.url)))
+const sfcs = await globby('src/components/**/*.vue')
 
-const projectFn = component => 'export { default as ' + path.basename(component, '.vue') + ' } from \'' + component.replace(componentsDir, '.') + '\''
+const projectFn = component => 'export { default as ' + path.basename(component, '.vue') + ' } from \'' + component.replace('src/components', '.') + '\''
 
 const correctComponentList = sfcs.map(projectFn).sort()
 const correctString = correctComponentList.join('\n') + '\n'
 
-const index = await readFile(path.resolve(__dirname, '../src/components/index.js'))
+const srcIndexFullpath = getNormalizedDir('../src/components') + path.sep + 'index.js'
+const typesIndexFullpath = getNormalizedDir('../types/components') + path.sep + 'index.d.ts'
+
+const index = await readFile(getNormalizedDir('../src/components') + '/index.js')
 const currentFileContent = index.toString()
 
 if (currentFileContent !== correctString) {
   if (process.argv.includes('--fix')) {
-    await writeFile(path.resolve(__dirname, '../src/components/index.js'), correctString)
+    await writeFile(srcIndexFullpath, correctString)
     console.log('Fixed')
     process.exit(0)
   }
@@ -51,14 +55,14 @@ if (currentFileContent !== correctString) {
   }
 
   if (onlyInCorrectList.length || onlyInCurrentFileList.length) {
-    console.log('dans ' + chalk.yellow.bold(path.resolve(__dirname, '../src/components/index.js')))
+    console.log('dans ' + chalk.yellow.bold(srcIndexFullpath))
   }
 
   if (!isCI) {
     await inquirer.prompt(questions).then(async answers => {
       if (answers.fix.toLocaleLowerCase() === 'y') {
-        await writeFile(path.resolve(__dirname, '../src/components/index.js'), correctString)
-        await writeFile(path.resolve(__dirname, '../types/components/index.d.ts'), correctString)
+        await writeFile(srcIndexFullpath, correctString)
+        await writeFile(typesIndexFullpath, correctString)
         console.log(chalk.green.bold('Fichier corrigé !'))
         process.exit(0)
       }

src/components/DsfrButton/DsfrButtonGroup.spec.js

@@ -3,7 +3,7 @@ import { fireEvent } from '@testing-library/dom'
 import { render } from '@testing-library/vue'
 
 // import '@gouvfr/dsfr/dist/core/core.module.js'
-import { spy } from '@/../tests/unit/test-utils.js'
+import { spy } from '@tests/unit/test-utils.js'
 
 import DsfrButtonGroup from './DsfrButtonGroup.vue'
 

src/components/DsfrCallout/DsfrCallout.spec.js

@@ -1,7 +1,7 @@
 import { OhVueIcon as VIcon } from 'oh-vue-icons'
 import { fireEvent, render } from '@testing-library/vue'
 
-import { spy } from '@/../tests/unit/test-utils.js'
+import { spy } from '@tests/unit/test-utils.js'
 
 // import '@gouvfr/dsfr/dist/core/core.module.js'
 

src/components/DsfrInput/DsfrInputGroup.stories.js

@@ -5,7 +5,7 @@ import DsfrInputGroup from './DsfrInputGroup.vue'
  * [Voir quand l’utiliser sur la documentation du DSFR](https://www.systeme-de-design.gouv.fr/elements-d-interface/composants/champ-de-saisie)
  */
 export default {
-  component: DsfrInput,
+  component: DsfrInputGroup,
   title: 'Composants/Champ de saisie/Champ avec message associé - DsfrInputGroup',
   argTypes: {
     id: {
@@ -42,7 +42,7 @@ export default {
     },
     disabled: {
       control: 'boolean',
-      description: 'Permet de désactiver le champ, la saisie sera impossible. Sera passé à DsfrInput si modelValue n’est pas `undefined`',
+      description: 'Permet de désactiver le champ, la saisie sera impossible. Sera passé à DsfrInput s’il n’y a pas d’utilisation du slot par défaut',
     },
     errorMessage: {
       control: 'text',
@@ -52,17 +52,50 @@ export default {
       control: 'text',
       description: 'Message de validation',
     },
-    isValid: {
-      control: 'boolean',
-      description: 'Signale si le champ est en état validé (`true`) ou non (`false`, par défaut)',
-    },
-    isInvalid: {
-      control: 'boolean',
-      description: 'Signale si le champ est en état d’erreur (`true`) ou non (`false`, par défaut)',
-    },
   },
 }
 
+export const GroupeDeChampAvecPersonnalisation = (args) => ({
+  components: {
+    DsfrInput,
+    DsfrInputGroup,
+  },
+  data () {
+    return {
+      ...args,
+    }
+  },
+  template: `
+    <DsfrInputGroup
+      :error-message="errorMessage"
+      :valid-message="validMessage"
+    >
+      <DsfrInput
+        :id="id"
+        :placeholder="placeholder"
+        :readonly="readonly !== ''"
+        :model-value="modelValue"
+        :label="label"
+        :type="type"
+        :hint="hint"
+        :label-visible="labelVisible"
+      />
+    </DsfrInputGroup>
+  `,
+})
+GroupeDeChampAvecPersonnalisation.args = {
+  type: 'text',
+  label: 'Label champ de saisie',
+  labelVisible: true,
+  placeholder: 'Yo',
+  modelValue: '',
+  validMessage: 'Message de validation',
+  errorMessage: '',
+  hint: 'Texte d’indice du champ',
+  id: '',
+  readonly: '',
+}
+
 export const ChampEnErreur = (args) => ({
   components: {
     DsfrInput,
@@ -87,7 +120,6 @@ export const ChampEnErreur = (args) => ({
       :is-invalid="isInvalid"
     />
   `,
-
 })
 ChampEnErreur.args = {
   label: 'Label champ de saisie',

src/components/DsfrInput/DsfrInputGroup.vue

@@ -34,7 +34,7 @@ export default defineComponent({
     labelVisible: Boolean,
     modelValue: {
       type: String,
-      default: '',
+      default: undefined,
     },
     placeholder: {
       type: String,
@@ -63,6 +63,11 @@ export default defineComponent({
       return this.errorMessage ? 'ri-alert-line' : 'ri-checkbox-circle-line'
     },
   },
+  watch: {
+    modelValue (nv, ov) {
+      console.log({ nv, ov })
+    },
+  },
 
 })
 </script>
@@ -75,9 +80,10 @@ export default defineComponent({
       'fr-input-group--valid': validMessage,
     }"
   >
+    <slot name="before-input" />
     <slot />
     <DsfrInput
-      v-if="modelValue !== undefined"
+      v-if="!$slots.default"
       v-bind="$attrs"
       :is-valid="!!validMessage"
       :is-invalid="!!errorMessage"

src/components/DsfrNavigation/DsfrNavigation.spec.js

@@ -4,7 +4,7 @@ import { render } from '@testing-library/vue'
 import { createRouter, createWebHistory } from 'vue-router'
 // import '@gouvfr/dsfr/dist/core/core.module.js'
 
-import { spy } from '@/../tests/unit/test-utils.js'
+import { spy } from '@tests/unit/test-utils.js'
 
 import DsfrNavigation from './DsfrNavigation.vue'
 

src/components/DsfrTable/DsfrTableCell.spec.js

@@ -4,7 +4,7 @@ import { fireEvent, render } from '@testing-library/vue'
 import DsfrTableCell from './DsfrTableCell.vue'
 import DsfrTag from '../DsfrTag/DsfrTag.vue'
 
-import { spy } from '@/../tests/unit/test-utils.js'
+import { spy } from '@tests/unit/test-utils.js'
 
 describe('DsfrTableCell', () => {
   it('should render simple cell', () => {

src/components/DsfrTable/DsfrTableHeader.spec.js

@@ -3,7 +3,7 @@ import { fireEvent, render } from '@testing-library/vue'
 
 import DsfrTableHeader from './DsfrTableHeader.vue'
 
-import { spy } from '@/../tests/unit/test-utils.js'
+import { spy } from '@tests/unit/test-utils.js'
 
 describe('DsfrTableHeader', () => {
   it('should render simple header cell', async () => {

src/components/DsfrTable/DsfrTableHeaders.spec.js

@@ -3,7 +3,7 @@ import { fireEvent, render } from '@testing-library/vue'
 
 import DsfrTableHeaders from './DsfrTableHeaders.vue'
 
-import { spy } from '@/../tests/unit/test-utils.js'
+import { spy } from '@tests/unit/test-utils.js'
 
 describe('DsfrTableHeaders', () => {
   it('should render simple header row', async () => {

src/components/DsfrTable/DsfrTableRow.spec.js

@@ -2,7 +2,7 @@ import { fireEvent, render } from '@testing-library/vue'
 
 import DsfrTableRow from './DsfrTableRow.vue'
 
-import { spy } from '@/../tests/unit/test-utils.js'
+import { spy } from '@tests/unit/test-utils.js'
 
 describe('DsfrTableRow', () => {
   it('should render simple row', () => {