@alveole/components 2.0.0-alpha → 2.0.0-alpha.2

package/dist/generated/version.d.ts

@@ -1,2 +1,2 @@
-export declare const ALVEOLE_COMPONENTS_VERSION: "2.0.0-alpha";
+export declare const ALVEOLE_COMPONENTS_VERSION: "2.0.0-alpha.2";
 //# sourceMappingURL=version.d.ts.map

package/dist/generated/version.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"version.d.ts","sourceRoot":"","sources":["../../src/generated/version.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,0BAA0B,EAAG,aAAsB,CAAC"}
+{"version":3,"file":"version.d.ts","sourceRoot":"","sources":["../../src/generated/version.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,0BAA0B,EAAG,eAAwB,CAAC"}

package/dist/generated/version.js

@@ -1 +1 @@
-export const ALVEOLE_COMPONENTS_VERSION = "2.0.0-alpha";
+export const ALVEOLE_COMPONENTS_VERSION = "2.0.0-alpha.2";

package/dist/stories/index.d.ts

@@ -31,9 +31,9 @@ export * as DataTableStory from '../ui/DataTable/DataTable.stories';
 export * as DateInputStory from '../ui/DateInput/DateInput.stories';
 export * as DividerStory from '../ui/Divider/Divider.stories';
 export * as DocumentViewerStory from '../ui/DocumentViewer/DocumentViewer.stories';
-export * as DragAndDropFileStory from '../ui/DragAndDropFile/DragAndDropFile.stories';
 export * as DurationInputStory from '../ui/DurationInput/DurationInput.stories';
 export * as EmptyStateStory from '../ui/EmptyState/EmptyState.stories';
+export * as FileDropZoneStory from '../ui/FileDropZone/FileDropZone.stories';
 export * as FilterDateStory from '../ui/FilterDate/FilterDate.stories';
 export * as FileInputStory from '../ui/FormControl/FileInput.stories';
 export * as FormControlStory from '../ui/FormControl/FormControl.stories';

package/dist/stories/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/stories/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/stories/index.ts"],"names":[],"mappings":"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"}

package/dist/stories/index.js

@@ -33,9 +33,9 @@ export * as DataTableStory from '../ui/DataTable/DataTable.stories';
 export * as DateInputStory from '../ui/DateInput/DateInput.stories';
 export * as DividerStory from '../ui/Divider/Divider.stories';
 export * as DocumentViewerStory from '../ui/DocumentViewer/DocumentViewer.stories';
-export * as DragAndDropFileStory from '../ui/DragAndDropFile/DragAndDropFile.stories';
 export * as DurationInputStory from '../ui/DurationInput/DurationInput.stories';
 export * as EmptyStateStory from '../ui/EmptyState/EmptyState.stories';
+export * as FileDropZoneStory from '../ui/FileDropZone/FileDropZone.stories';
 export * as FilterDateStory from '../ui/FilterDate/FilterDate.stories';
 export * as FileInputStory from '../ui/FormControl/FileInput.stories';
 export * as FormControlStory from '../ui/FormControl/FormControl.stories';

package/dist/ui/Button/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAa,IAAI,EAAE,MAAM,cAAc,CAAC;AAO/C,cAAc,gBAAgB,CAAC;AAE/B,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;8BAwDjB,CAAC"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.tsx"],"names":[],"mappings":"AACA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAChD,OAAO,EAAa,IAAI,EAAE,MAAM,cAAc,CAAC;AAO/C,cAAc,gBAAgB,CAAC;AAE/B,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;8BA0EjB,CAAC"}

package/dist/ui/Button/Button.js

@@ -1,13 +1,33 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { focusRingProps } from '@alveole/theme';
-import React from 'react';
+import React, { useRef, useState } from 'react';
 import { Pressable } from 'react-native';
 import { useStyles } from './Button.styles';
 import { etatDuBouton } from './Button.types';
 import { ButtonContent } from './ButtonContent';
 import { styleDuPressable } from './buttonStyling';
 export * from './Button.types';
-export const Button = React.forwardRef(function Button(props, ref) {
+export const Button = React.forwardRef(function Button(propsDeLAppelant, ref) {
+    const verrou = useRef(false);
+    const [enCours, setEnCours] = useState(false);
+    // Un onPress qui rend une promesse (soumission de formulaire) verrouille le bouton jusqu'a sa
+    // fin. Le ref ferme la porte des le premier clic, avant que le state n'ait rafraichi le rendu :
+    // le second clic d'un double clic arrive sinon pendant que le bouton parait encore libre.
+    const onPress = event => {
+        if (verrou.current)
+            return;
+        const resultat = propsDeLAppelant.onPress?.(event);
+        if (!(resultat instanceof Promise))
+            return;
+        verrou.current = true;
+        setEnCours(true);
+        const liberer = () => {
+            verrou.current = false;
+            setEnCours(false);
+        };
+        resultat.then(liberer, liberer);
+    };
+    const props = { ...propsDeLAppelant, onPress, isLoading: propsDeLAppelant.isLoading || enCours };
     const { type, disabled, isLoading, active = false, expanded = false, ...buttonProps } = props;
     const styles = useStyles();
     const etat = etatDuBouton(props);

package/dist/ui/Button/Button.stories.d.ts

@@ -305,6 +305,18 @@ export declare const States: () => React.JSX.Element;
  * attendent le délai par défaut d'une seconde.
  */
 export declare const Loading: () => React.JSX.Element;
+/**
+ * Un `onPress` qui rend une promesse verrouille le bouton jusqu'à sa fin, résolue ou rejetée :
+ * c'est la protection contre la double soumission d'un formulaire. Le verrou est posé dès le
+ * premier clic, avant même le rafraîchissement : le second clic d'un double clic est ignoré.
+ * Pas besoin de gérer `isLoading` : le bouton charge seul, avec le même `loadingDelay`.
+ *
+ * Avec react-hook-form, `onPress={handleSubmit(...)}` suffit, `handleSubmit` rendant une promesse.
+ * Un `onPress` synchrone n'est pas verrouillé.
+ *
+ * Double-cliquez sur le bouton : l'envoi de 3 secondes n'est compté qu'une fois.
+ */
+export declare const OnPressAsynchrone: () => React.JSX.Element;
 /** `leading` place l’icône avant le libellé, `trailing` après. Les deux peuvent coexister. */
 export declare const Icons: () => React.JSX.Element;
 /**

package/dist/ui/Button/Button.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQ1B,wBAQkB;AAElB;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,QAAQ,yBAOpB,CAAC;AAEF,oGAAoG;AACpG,eAAO,MAAM,KAAK,yBAMjB,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,MAAM,yBAOlB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,OAAO,yBAenB,CAAC;AAEF,8FAA8F;AAC9F,eAAO,MAAM,KAAK,yBAMjB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,yBAK/B,CAAC;AAEF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,QAAQ,yBASpB,CAAC;AAEF,sFAAsF;AACtF,eAAO,MAAM,SAAS,yBAAkE,CAAC;AAEzF,OAAO,KAAK,OAAO,MAAM,0BAA0B,CAAC"}
+{"version":3,"file":"Button.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAS1B,wBAQkB;AAElB;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,QAAQ,yBAOpB,CAAC;AAEF,oGAAoG;AACpG,eAAO,MAAM,KAAK,yBAMjB,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,MAAM,yBAOlB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,OAAO,yBAenB,CAAC;AAEF;;;;;;;;;;GAUG;AACH,eAAO,MAAM,iBAAiB,yBAc7B,CAAC;AAEF,8FAA8F;AAC9F,eAAO,MAAM,KAAK,yBAMjB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,yBAK/B,CAAC;AAEF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,QAAQ,yBASpB,CAAC;AAEF,sFAAsF;AACtF,eAAO,MAAM,SAAS,yBAAkE,CAAC;AAEzF,OAAO,KAAK,OAAO,MAAM,0BAA0B,CAAC"}

package/dist/ui/Button/Button.stories.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { Box } from '../../core/Box';
+import { Typography } from '../../core/Typography';
 import { Avatar } from '../Avatar';
 import { Button } from './Button';
 import { useStyles } from './Button.styles';
@@ -72,6 +73,25 @@ export const Loading = () => {
     };
     return (_jsxs(Box, { display: "flex", flexDirection: "row", gap: 24, children: [_jsx(Button, { variant: "primary", title: "Enregistrer", isLoading: isLoading, onPress: handlePress }), _jsx(Button, { variant: "secondary", title: "Exporter", leading: "Download", isLoading: isLoading, onPress: handlePress }), _jsx(Button, { variant: "primary", title: "D\u00E9lai court", loadingDelay: "short", isLoading: isLoading, onPress: handlePress })] }));
 };
+/**
+ * Un `onPress` qui rend une promesse verrouille le bouton jusqu'à sa fin, résolue ou rejetée :
+ * c'est la protection contre la double soumission d'un formulaire. Le verrou est posé dès le
+ * premier clic, avant même le rafraîchissement : le second clic d'un double clic est ignoré.
+ * Pas besoin de gérer `isLoading` : le bouton charge seul, avec le même `loadingDelay`.
+ *
+ * Avec react-hook-form, `onPress={handleSubmit(...)}` suffit, `handleSubmit` rendant une promesse.
+ * Un `onPress` synchrone n'est pas verrouillé.
+ *
+ * Double-cliquez sur le bouton : l'envoi de 3 secondes n'est compté qu'une fois.
+ */
+export const OnPressAsynchrone = () => {
+    const [envois, setEnvois] = React.useState(0);
+    const envoyer = async () => {
+        setEnvois(n => n + 1);
+        await new Promise(resolve => setTimeout(resolve, 3000));
+    };
+    return (_jsxs(Box, { display: "flex", flexDirection: "row", gap: 24, style: { alignItems: 'center' }, children: [_jsx(Button, { variant: "primary", title: "Envoyer", loadingDelay: "short", onPress: envoyer }), _jsxs(Typography, { children: ["Envois : ", envois] })] }));
+};
 /** `leading` place l’icône avant le libellé, `trailing` après. Les deux peuvent coexister. */
 export const Icons = () => (_jsxs(Box, { display: "flex", flexDirection: "row", gap: 24, children: [_jsx(Button, { variant: "secondary", title: "Ajouter", leading: "Plus" }), _jsx(Button, { variant: "secondary", title: "Exporter", trailing: "Download" }), _jsx(Button, { variant: "secondary", title: "Filtres", leading: "Plus", trailing: "ChevronDown" })] }));
 /**

package/dist/ui/Button/Button.stories.sources.d.ts

@@ -2,6 +2,7 @@ export declare const Variants: () => string;
 export declare const Sizes: () => string;
 export declare const States: () => string;
 export declare const Loading: () => string;
+export declare const OnPressAsynchrone: () => string;
 export declare const Icons: () => string;
 export declare const TertiaireAvecAvatar: () => string;
 export declare const IconOnly: () => string;
@@ -11,6 +12,7 @@ export declare const storySources: {
     readonly Sizes: () => string;
     readonly States: () => string;
     readonly Loading: () => string;
+    readonly OnPressAsynchrone: () => string;
     readonly Icons: () => string;
     readonly TertiaireAvecAvatar: () => string;
     readonly IconOnly: () => string;

package/dist/ui/Button/Button.stories.sources.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,QAAQ,cAA6U,CAAC;AAEnW,eAAO,MAAM,KAAK,cAAiW,CAAC;AAEpX,eAAO,MAAM,MAAM,cAA4W,CAAC;AAEhY,eAAO,MAAM,OAAO,cAAypB,CAAC;AAE9qB,eAAO,MAAM,KAAK,cAAwW,CAAC;AAE3X,eAAO,MAAM,mBAAmB,cAAkW,CAAC;AAEnY,eAAO,MAAM,QAAQ,cAAizB,CAAC;AAEv0B,eAAO,MAAM,SAAS,cAAwG,CAAC;AAE/H,eAAO,MAAM,YAAY;;;;;;;;;CASf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC;AAExD,eAAO,MAAM,iBAAiB,EAAE,OAAO,CAAC,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,CAStE,CAAC"}
+{"version":3,"file":"Button.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,QAAQ,cAA6U,CAAC;AAEnW,eAAO,MAAM,KAAK,cAAiW,CAAC;AAEpX,eAAO,MAAM,MAAM,cAA4W,CAAC;AAEhY,eAAO,MAAM,OAAO,cAAypB,CAAC;AAE9qB,eAAO,MAAM,iBAAiB,cAA2f,CAAC;AAE1hB,eAAO,MAAM,KAAK,cAAwW,CAAC;AAE3X,eAAO,MAAM,mBAAmB,cAAkW,CAAC;AAEnY,eAAO,MAAM,QAAQ,cAAizB,CAAC;AAEv0B,eAAO,MAAM,SAAS,cAAwG,CAAC;AAE/H,eAAO,MAAM,YAAY;;;;;;;;;;CAUf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC;AAExD,eAAO,MAAM,iBAAiB,EAAE,OAAO,CAAC,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,CAUtE,CAAC"}

package/dist/ui/Button/Button.stories.sources.js

@@ -4,6 +4,7 @@ export const Variants = () => "export const Variants = () => (\n  <Box display=\
 export const Sizes = () => "export const Sizes = () => (\n  <Box display=\"flex\" flexDirection=\"row\" style={{ alignItems: 'center' }} gap={24}>\n    <Button variant=\"secondary\" size=\"sm\" title=\"Bouton sm\" />\n    <Button variant=\"secondary\" size=\"md\" title=\"Bouton md\" />\n    <Button variant=\"secondary\" size=\"lg\" title=\"Bouton lg\" />\n  </Box>\n);";
 export const States = () => "export const States = () => (\n  <Box display=\"flex\" flexDirection=\"row\" gap={24}>\n    <Button variant=\"secondary\" title=\"Normal\" />\n    <Button variant=\"secondary\" title=\"Disabled\" disabled />\n    <Button variant=\"secondary\" title=\"Selected\" selected />\n    <Button variant=\"secondary\" title=\"Expanded\" expanded />\n  </Box>\n);";
 export const Loading = () => "export const Loading = () => {\n  const [isLoading, setIsLoading] = React.useState(false);\n\n  const handlePress = () => {\n    setIsLoading(true);\n    setTimeout(() => setIsLoading(false), 3000);\n  };\n\n  return (\n    <Box display=\"flex\" flexDirection=\"row\" gap={24}>\n      <Button variant=\"primary\" title=\"Enregistrer\" isLoading={isLoading} onPress={handlePress} />\n      <Button variant=\"secondary\" title=\"Exporter\" leading=\"Download\" isLoading={isLoading} onPress={handlePress} />\n      <Button variant=\"primary\" title=\"Délai court\" loadingDelay=\"short\" isLoading={isLoading} onPress={handlePress} />\n    </Box>\n  );\n};";
+export const OnPressAsynchrone = () => "export const OnPressAsynchrone = () => {\n  const [envois, setEnvois] = React.useState(0);\n\n  const envoyer = async () => {\n    setEnvois(n => n + 1);\n    await new Promise(resolve => setTimeout(resolve, 3000));\n  };\n\n  return (\n    <Box display=\"flex\" flexDirection=\"row\" gap={24} style={{ alignItems: 'center' }}>\n      <Button variant=\"primary\" title=\"Envoyer\" loadingDelay=\"short\" onPress={envoyer} />\n      <Typography>Envois : {envois}</Typography>\n    </Box>\n  );\n};";
 export const Icons = () => "export const Icons = () => (\n  <Box display=\"flex\" flexDirection=\"row\" gap={24}>\n    <Button variant=\"secondary\" title=\"Ajouter\" leading=\"Plus\" />\n    <Button variant=\"secondary\" title=\"Exporter\" trailing=\"Download\" />\n    <Button variant=\"secondary\" title=\"Filtres\" leading=\"Plus\" trailing=\"ChevronDown\" />\n  </Box>\n);";
 export const TertiaireAvecAvatar = () => "export const TertiaireAvecAvatar = () => (\n  <Box display=\"flex\" flexDirection=\"row\" gap={24} style={{ alignItems: 'center' }}>\n    <Button variant=\"tertiary\" title=\"Marie Curie\" leading={<Avatar size=\"xs\" fallbackText=\"Marie Curie\" />} />\n    <Button variant=\"tertiary\" title=\"Marie Curie\" leading=\"User\" />\n  </Box>\n);";
 export const IconOnly = () => "export const IconOnly = () => (\n  <Box display=\"flex\" flexDirection=\"row\" gap={24} style={{ alignItems: 'center' }}>\n    <ButtonIcon variant=\"tertiary\" size=\"sm\" icon=\"MoreHorizontal\" accessibilityLabel=\"Plus d'actions\" />\n    <ButtonIcon variant=\"tertiary\" size=\"md\" icon=\"MoreHorizontal\" accessibilityLabel=\"Plus d'actions\" />\n    <ButtonIcon variant=\"tertiary\" size=\"lg\" icon=\"MoreHorizontal\" accessibilityLabel=\"Plus d'actions\" />\n    <ButtonIcon variant=\"secondary\" size=\"md\" icon=\"Trash\" accessibilityLabel=\"Supprimer\" />\n    <ButtonIcon variant=\"primary\" size=\"md\" icon=\"Plus\" accessibilityLabel=\"Ajouter\" />\n    <ButtonIcon variant=\"tertiary\" size=\"md\" icon=\"CircleUser\" iconSize=\"xs\" accessibilityLabel=\"Voir le profil\" />\n  </Box>\n);";
@@ -13,6 +14,7 @@ export const storySources = {
     Sizes,
     States,
     Loading,
+    OnPressAsynchrone,
     Icons,
     TertiaireAvecAvatar,
     IconOnly,
@@ -23,6 +25,7 @@ export const storyDescriptions = {
     Sizes: "`md` par défaut. `sm` pour les zones denses, `lg` pour une action qu'on veut mettre en avant.",
     States: "- `disabled` : l'action n'est pas disponible. Le bouton ne répond plus ni au clic ni au clavier.\n- `selected` : le bouton fait partie d'un groupe et c'est lui qui est choisi.\n- `expanded` : le bouton commande un menu ou un panneau actuellement déplié. Il pose aussi\n  l'état accessible correspondant, ce que `selected` ne fait pas.",
     Loading: "Le spinner n'apparaît qu'après un délai, réglé par `loadingDelay` : mêmes valeurs que la\nprop `delay` de `Spinner` (`false` / `true` / `'short'` (300 ms) / `'long'` / `number`).\nIl vaut `'long'` (1 000 ms) par défaut.\n\nCe délai évite un clignotement visuel quand l'opération se termine rapidement :\nsi le serveur répond en moins d'une seconde, l'utilisateur ne voit jamais le spinner.\nAu-delà, le spinner s'affiche pour signaler que l'attente va durer.\n\n**Le spinner prend la place de quelque chose, il ne s'ajoute jamais** : le bouton garde donc\nexactement sa largeur. S'il porte une icône, c'est elle que le spinner remplace, et le\nlibellé reste lisible. Sinon le spinner se centre et le libellé devient invisible sans\nquitter le flux, pour continuer d'imposer sa largeur.\n\nPendant toute l'attente - y compris avant que le spinner ne paraisse - le bouton cesse de\nrépondre : il sort du parcours au clavier et se déclare `aria-disabled`, pour qu'un second\nappui ne relance pas l'opération. Son apparence, elle, reste celle du repos.\n\nAppuyez sur un bouton pour simuler une opération de 3 secondes. Le troisième bouton, avec\n`loadingDelay=\"short\"`, montre son spinner dès 300 ms - avant les deux premiers, qui\nattendent le délai par défaut d'une seconde.",
+    OnPressAsynchrone: "Un `onPress` qui rend une promesse verrouille le bouton jusqu'à sa fin, résolue ou rejetée :\nc'est la protection contre la double soumission d'un formulaire. Le verrou est posé dès le\npremier clic, avant même le rafraîchissement : le second clic d'un double clic est ignoré.\nPas besoin de gérer `isLoading` : le bouton charge seul, avec le même `loadingDelay`.\n\nAvec react-hook-form, `onPress={handleSubmit(...)}` suffit, `handleSubmit` rendant une promesse.\nUn `onPress` synchrone n'est pas verrouillé.\n\nDouble-cliquez sur le bouton : l'envoi de 3 secondes n'est compté qu'une fois.",
     Icons: "`leading` place l’icône avant le libellé, `trailing` après. Les deux peuvent coexister.",
     TertiaireAvecAvatar: "`leading` et `trailing` acceptent aussi un élément : un avatar, un logo de réseau social.\nIl est posé dans un emplacement de la taille de l'icône, sans recevoir de couleur, si bien\nque le bouton garde sa hauteur et son alignement.",
     IconOnly: "`ButtonIcon` est la **seule** façon d'obtenir un bouton carré. `Button` exige un `title` :\nil ne bascule plus en mode icône seule quand on le lui retire.\n\nC'est la règle des trois références. Atlassian rend les `children` de son bouton par défaut\nobligatoires, si bien qu'un bouton-icône ne peut y être écrit qu'avec `IconButton`. Primer a\ndeux composants, et la géométrie carrée n'existe que sur la classe que pose `IconButton`.\nBase n'a qu'un composant, mais la forme s'y demande (`shape=\"square\"`), jamais ne se déduit.\n\nLa raison est mesurable : tant que l'absence de `title` suffisait, rien ne signalait un\nbouton muet. Deux des quatre appels de ce genre écrits dans les applications n'avaient aucun\n`accessibilityLabel`. `ButtonIcon` le rend obligatoire, et le compilateur fait le reste.\n\nIl accepte `primary`, `secondary` et `tertiary`, et `iconSize` pour dissocier la taille de\nl'icône de celle du bouton.",

package/dist/ui/Button/Button.types.d.ts

@@ -32,6 +32,10 @@ export type ButtonProps = Omit<PressableProps, 'children' | 'style'> & {
     active?: boolean;
     /** Le bouton commande un menu ou un panneau actuellement deplie. */
     expanded?: boolean;
+    /**
+     * Inutile pour un `onPress` qui rend une promesse : le bouton se verrouille et charge seul
+     * jusqu'a sa fin, ce qui empeche le double envoi d'un formulaire.
+     */
     isLoading?: boolean;
     /**
      * Retard avant que le spinner de `isLoading` ne paraisse. Memes valeurs que la prop `delay`

package/dist/ui/Button/Button.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.types.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAE/D,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,EAAE,UAAU,GAAG,OAAO,CAAC,GAAG;IACrE;;;;;;OAMG;IACH,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,OAAO,EAAE,aAAa,CAAC;IACvB,2EAA2E;IAC3E,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,4DAA4D;IAC5D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,YAAY,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,QAAQ,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC3B,4FAA4F;IAC5F,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,oEAAoE;IACpE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,YAAY,CAAC,EAAE,YAAY,CAAC;CAC7B,CAAC;AAEF;;;;GAIG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB,OAAO,EAAE,aAAa,CAAC;IACvB,MAAM,EAAE,YAAY,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,OAAO,WAAW,KAAG,YAMhD,CAAC"}
+{"version":3,"file":"Button.types.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAE/D,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,EAAE,UAAU,GAAG,OAAO,CAAC,GAAG;IACrE;;;;;;OAMG;IACH,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,OAAO,EAAE,aAAa,CAAC;IACvB,2EAA2E;IAC3E,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,4DAA4D;IAC5D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,YAAY,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,QAAQ,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC3B,4FAA4F;IAC5F,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,oEAAoE;IACpE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;OAIG;IACH,YAAY,CAAC,EAAE,YAAY,CAAC;CAC7B,CAAC;AAEF;;;;GAIG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB,OAAO,EAAE,aAAa,CAAC;IACvB,MAAM,EAAE,YAAY,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,OAAO,WAAW,KAAG,YAMhD,CAAC"}

package/dist/ui/Checkbox/Checkbox.js

@@ -8,8 +8,8 @@ import { CheckboxContainer } from './CheckboxContainer';
 import { CheckboxIndicator } from './CheckboxIndicator';
 import { CheckboxLabel } from './CheckboxLabel';
 export const Checkbox = React.forwardRef(function Checkbox(props, ref) {
-    const { size, variant, label, error, success, disabled, onCheckedChange } = props;
-    const baseProps = { size, variant, label, error, success, disabled, onCheckedChange };
+    const { size, variant, label, error, success, disabled } = props;
+    const baseProps = { size, variant, label, error, success, disabled };
     const { spacingValue } = useTheme();
     const styles = useStyles();
     const id = useId();

package/dist/ui/FileDropZone/FileDropZone.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { FileInputProps } from '../FormControl';
+export type FileDropZoneProps = Pick<FileInputProps, 'value' | 'onChange' | 'type' | 'multiple' | 'disabled'> & {
+    children: React.ReactNode;
+    /** Le texte de la surcouche pendant le survol. */
+    message?: string;
+};
+/** Le glisser-deposer de fichiers n'existe que sur le web : hors web, la zone rend ses enfants. */
+export declare const FileDropZone: ({ children }: FileDropZoneProps) => React.JSX.Element;
+//# sourceMappingURL=FileDropZone.d.ts.map

package/dist/ui/FileDropZone/FileDropZone.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileDropZone.d.ts","sourceRoot":"","sources":["../../../src/ui/FileDropZone/FileDropZone.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAEhD,MAAM,MAAM,iBAAiB,GAAG,IAAI,CAAC,cAAc,EAAE,OAAO,GAAG,UAAU,GAAG,MAAM,GAAG,UAAU,GAAG,UAAU,CAAC,GAAG;IAC9G,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,kDAAkD;IAClD,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,mGAAmG;AACnG,eAAO,MAAM,YAAY,GAAI,cAAc,iBAAiB,sBAAoB,CAAC"}

package/dist/ui/FileDropZone/FileDropZone.js

@@ -0,0 +1,3 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+/** Le glisser-deposer de fichiers n'existe que sur le web : hors web, la zone rend ses enfants. */
+export const FileDropZone = ({ children }) => _jsx(_Fragment, { children: children });

package/dist/ui/FileDropZone/FileDropZone.stories.d.ts

@@ -0,0 +1,50 @@
+declare const _default: {
+    title: string;
+    tags: "ui"[];
+    experimental: false;
+    webOnly: true;
+    description: string;
+    component: ({ children }: import("./FileDropZone").FileDropZoneProps) => import("react").JSX.Element;
+    styleFn: () => {
+        conteneur: {
+            position: "relative";
+        };
+        surcouche: {
+            position: "absolute";
+            top: number;
+            right: number;
+            bottom: number;
+            left: number;
+            borderWidth: number;
+            borderStyle: "dashed";
+            borderColor: string;
+            borderRadius: import("@alveole/theme").Radius;
+            backgroundColor: string;
+            alignItems: "center";
+            justifyContent: "center";
+            pointerEvents: "none";
+        };
+        pastille: {
+            backgroundColor: string;
+            borderRadius: import("@alveole/theme").Radius;
+            paddingLeft: string | number;
+            paddingRight: string | number;
+            paddingTop: string | number;
+            paddingBottom: string | number;
+        };
+        message: {
+            color: string;
+            fontSize: 16;
+            lineHeight: 24;
+            letterSpacing: 0;
+            fontFamily: string;
+            fontWeight?: import("react-native").TextStyle["fontWeight"];
+        };
+    };
+};
+export default _default;
+export declare const Formulaire: () => import("react").JSX.Element;
+export declare const Desactivee: () => import("react").JSX.Element;
+export declare const MessagePersonnalise: () => import("react").JSX.Element;
+export * as Sources from './FileDropZone.stories.sources';
+//# sourceMappingURL=FileDropZone.stories.d.ts.map

package/dist/ui/FileDropZone/FileDropZone.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileDropZone.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/FileDropZone/FileDropZone.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA,wBASkB;AAElB,eAAO,MAAM,UAAU,mCAetB,CAAC;AAEF,eAAO,MAAM,UAAU,mCAWtB,CAAC;AAEF,eAAO,MAAM,mBAAmB,mCAW/B,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,gCAAgC,CAAC"}

package/dist/ui/FileDropZone/FileDropZone.stories.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { Box } from '../../core/Box';
+import { FileInput, FormControl, TextInput } from '../FormControl';
+import { FileDropZone } from './FileDropZone';
+import { useStyles } from './FileDropZone.styles';
+export default {
+    title: 'FileDropZone',
+    tags: ['ui'],
+    experimental: false,
+    webOnly: true,
+    description: "Zone de dépôt : enveloppe une région (souvent tout un formulaire) sur laquelle on peut glisser-déposer des fichiers. Se branche sur le même état que le FileInput du formulaire. À réserver aux formulaires qui n'ont qu'un seul champ de fichier : avec plusieurs FileInput, l'utilisateur ne peut pas savoir lequel recevra le fichier déposé.",
+    component: FileDropZone,
+    styleFn: useStyles,
+};
+export const Formulaire = () => {
+    const [titre, setTitre] = useState('');
+    const [fichiers, setFichiers] = useState(null);
+    return (_jsx(FileDropZone, { value: fichiers, onChange: setFichiers, multiple: true, children: _jsxs(Box, { display: "flex", flexDirection: "column", gap: 16, p: 16, children: [_jsx(FormControl, { label: "Titre", children: _jsx(TextInput, { value: titre, onChangeText: setTitre }) }), _jsx(FormControl, { label: "Pi\u00E8ces jointes", hint: "Glissez des fichiers n'importe o\u00F9 sur le formulaire.", children: _jsx(FileInput, { value: fichiers, onChange: setFichiers, multiple: true }) })] }) }));
+};
+export const Desactivee = () => {
+    const [fichiers, setFichiers] = useState(null);
+    return (_jsx(FileDropZone, { value: fichiers, onChange: setFichiers, multiple: true, disabled: true, children: _jsx(Box, { p: 16, children: _jsx(FormControl, { label: "Pi\u00E8ces jointes", disabled: true, children: _jsx(FileInput, { value: fichiers, onChange: setFichiers, multiple: true, disabled: true }) }) }) }));
+};
+export const MessagePersonnalise = () => {
+    const [photo, setPhoto] = useState(null);
+    return (_jsx(FileDropZone, { value: photo, onChange: setPhoto, type: "image/*", message: "L\u00E2chez la photo pour l'ajouter", children: _jsx(Box, { p: 16, children: _jsx(FormControl, { label: "Photo", children: _jsx(FileInput, { value: photo, onChange: setPhoto, type: "image/*" }) }) }) }));
+};
+export * as Sources from './FileDropZone.stories.sources';

package/dist/ui/FileDropZone/FileDropZone.stories.sources.d.ts

@@ -0,0 +1,10 @@
+export declare const Formulaire: () => string;
+export declare const Desactivee: () => string;
+export declare const MessagePersonnalise: () => string;
+export declare const storySources: {
+    readonly Formulaire: () => string;
+    readonly Desactivee: () => string;
+    readonly MessagePersonnalise: () => string;
+};
+export type StorySourceName = keyof typeof storySources;
+//# sourceMappingURL=FileDropZone.stories.sources.d.ts.map

package/dist/ui/FileDropZone/FileDropZone.stories.sources.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileDropZone.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/FileDropZone/FileDropZone.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,UAAU,cAA6qB,CAAC;AAErsB,eAAO,MAAM,UAAU,cAA8a,CAAC;AAEtc,eAAO,MAAM,mBAAmB,cAA4b,CAAC;AAE7d,eAAO,MAAM,YAAY;;;;CAIf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}

package/dist/ui/FileDropZone/FileDropZone.stories.sources.js

@@ -0,0 +1,10 @@
+// This file is generated. Do not edit manually.
+// Source: src/ui/FileDropZone/FileDropZone.stories.tsx
+export const Formulaire = () => "export const Formulaire = () => {\n  const [titre, setTitre] = useState('');\n  const [fichiers, setFichiers] = useState<FileInputValue>(null);\n  return (\n    <FileDropZone value={fichiers} onChange={setFichiers} multiple>\n      <Box display=\"flex\" flexDirection=\"column\" gap={16} p={16}>\n        <FormControl label=\"Titre\">\n          <TextInput value={titre} onChangeText={setTitre} />\n        </FormControl>\n        <FormControl label=\"Pièces jointes\" hint=\"Glissez des fichiers n'importe où sur le formulaire.\">\n          <FileInput value={fichiers} onChange={setFichiers} multiple />\n        </FormControl>\n      </Box>\n    </FileDropZone>\n  );\n};";
+export const Desactivee = () => "export const Desactivee = () => {\n  const [fichiers, setFichiers] = useState<FileInputValue>(null);\n  return (\n    <FileDropZone value={fichiers} onChange={setFichiers} multiple disabled>\n      <Box p={16}>\n        <FormControl label=\"Pièces jointes\" disabled>\n          <FileInput value={fichiers} onChange={setFichiers} multiple disabled />\n        </FormControl>\n      </Box>\n    </FileDropZone>\n  );\n};";
+export const MessagePersonnalise = () => "export const MessagePersonnalise = () => {\n  const [photo, setPhoto] = useState<FileInputValue>(null);\n  return (\n    <FileDropZone value={photo} onChange={setPhoto} type=\"image/*\" message=\"Lâchez la photo pour l'ajouter\">\n      <Box p={16}>\n        <FormControl label=\"Photo\">\n          <FileInput value={photo} onChange={setPhoto} type=\"image/*\" />\n        </FormControl>\n      </Box>\n    </FileDropZone>\n  );\n};";
+export const storySources = {
+    Formulaire,
+    Desactivee,
+    MessagePersonnalise,
+};

package/dist/ui/FileDropZone/FileDropZone.styles.d.ts

@@ -0,0 +1,37 @@
+export declare const useStyles: () => {
+    conteneur: {
+        position: "relative";
+    };
+    surcouche: {
+        position: "absolute";
+        top: number;
+        right: number;
+        bottom: number;
+        left: number;
+        borderWidth: number;
+        borderStyle: "dashed";
+        borderColor: string;
+        borderRadius: import("@alveole/theme").Radius;
+        backgroundColor: string;
+        alignItems: "center";
+        justifyContent: "center";
+        pointerEvents: "none";
+    };
+    pastille: {
+        backgroundColor: string;
+        borderRadius: import("@alveole/theme").Radius;
+        paddingLeft: string | number;
+        paddingRight: string | number;
+        paddingTop: string | number;
+        paddingBottom: string | number;
+    };
+    message: {
+        color: string;
+        fontSize: 16;
+        lineHeight: 24;
+        letterSpacing: 0;
+        fontFamily: string;
+        fontWeight?: import("react-native").TextStyle["fontWeight"];
+    };
+};
+//# sourceMappingURL=FileDropZone.styles.d.ts.map

package/dist/ui/FileDropZone/FileDropZone.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileDropZone.styles.d.ts","sourceRoot":"","sources":["../../../src/ui/FileDropZone/FileDropZone.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiCnB,CAAC"}

package/dist/ui/FileDropZone/FileDropZone.styles.js

@@ -0,0 +1,35 @@
+import { makeStyles } from '@alveole/theme';
+export const useStyles = makeStyles(({ color, radius, spacing, text }) => ({
+    conteneur: {
+        position: 'relative',
+    },
+    // Posee sur le contenu sans le deplacer ni capter les clics : le formulaire reste lisible dessous.
+    surcouche: {
+        position: 'absolute',
+        top: 0,
+        right: 0,
+        bottom: 0,
+        left: 0,
+        borderWidth: 2,
+        borderStyle: 'dashed',
+        borderColor: color.light.border['plain-info'],
+        borderRadius: radius('lg'),
+        backgroundColor: color.alpha(color.light.background['flat-info'], 0.1),
+        alignItems: 'center',
+        justifyContent: 'center',
+        pointerEvents: 'none',
+    },
+    // Pastille opaque : le message reste lisible quel que soit le champ qu'il recouvre.
+    pastille: {
+        backgroundColor: color.light.background['default-grey'],
+        borderRadius: radius('lg'),
+        paddingLeft: spacing('2W'),
+        paddingRight: spacing('2W'),
+        paddingTop: spacing('1W'),
+        paddingBottom: spacing('1W'),
+    },
+    message: {
+        ...text['Corps de texte'].MD.Bold,
+        color: color.light.text['default-info'],
+    },
+}));

package/dist/ui/FileDropZone/FileDropZone.web.d.ts

@@ -0,0 +1,4 @@
+import { FileDropZoneProps } from './FileDropZone';
+export type { FileDropZoneProps } from './FileDropZone';
+export declare const FileDropZone: (props: FileDropZoneProps) => import("react").JSX.Element;
+//# sourceMappingURL=FileDropZone.web.d.ts.map

package/dist/ui/FileDropZone/FileDropZone.web.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileDropZone.web.d.ts","sourceRoot":"","sources":["../../../src/ui/FileDropZone/FileDropZone.web.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAInD,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAExD,eAAO,MAAM,YAAY,GAAI,OAAO,iBAAiB,gCAwBpD,CAAC"}

package/dist/ui/FileDropZone/FileDropZone.web.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box } from '../../core/Box';
+import { Typography } from '../../core/Typography';
+import { useStyles } from './FileDropZone.styles';
+import { useDepotFichier } from './useDepotFichier';
+export const FileDropZone = (props) => {
+    const { children, message = 'Déposez vos fichiers ici' } = props;
+    const styles = useStyles();
+    const depot = useDepotFichier(props);
+    return (_jsxs("div", { "data-testid": "file-drop-zone", style: styles.conteneur, onDragEnter: depot.onDragEnter, onDragOver: depot.onDragOver, onDragLeave: depot.onDragLeave, onDrop: depot.onDrop, children: [children, depot.actif && (_jsx(Box, { tag: "file-drop-zone-overlay", style: styles.surcouche, children: _jsx(Box, { tag: "file-drop-zone-message", style: styles.pastille, children: _jsx(Typography, { style: styles.message, children: message }) }) }))] }));
+};

package/dist/ui/FileDropZone/fichiersDuDataTransfer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fichiersDuDataTransfer.d.ts","sourceRoot":"","sources":["../../../src/ui/FileDropZone/fichiersDuDataTransfer.ts"],"names":[],"mappings":"AAAA,KAAK,UAAU,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,SAAS,IAAI,IAAI,GAAG,IAAI,CAAA;CAAE,CAAC;AAE7D;;;;;GAKG;AACH,KAAK,eAAe,GAAG;IAAE,KAAK,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,CAAC;IAAC,KAAK,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC,CAAA;CAAE,GAAG,IAAI,GAAG,SAAS,CAAC;AAQrG;;;;GAIG;AACH,eAAO,MAAM,sBAAsB,GAAI,IAAI,eAAe,KAAG,IAAI,EAIhE,CAAC"}

package/dist/ui/FileDropZone/index.d.ts

@@ -0,0 +1,2 @@
+export * from './FileDropZone';
+//# sourceMappingURL=index.d.ts.map

package/dist/ui/FileDropZone/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/FileDropZone/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC"}

package/dist/ui/FileDropZone/index.js

@@ -0,0 +1 @@
+export * from './FileDropZone';

package/dist/ui/FileDropZone/useDepotFichier.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { FileInputProps } from '../FormControl';
+type Options = Pick<FileInputProps, 'value' | 'type' | 'multiple' | 'onChange' | 'disabled'>;
+/**
+ * Le comportement de la zone de depot : s'allumer quand un glissement de fichiers la survole,
+ * convertir les fichiers lâches en valeurs du champ, et liberer les URL d'objet. Chaque
+ * evenement traite s'arrete a la zone : entre zones imbriquees, seule la plus proche reagit.
+ */
+export declare const useDepotFichier: ({ value, type, multiple, onChange, disabled }: Options) => {
+    actif: boolean;
+    onDragEnter: (e: React.DragEvent) => void;
+    onDragOver: (e: React.DragEvent) => void;
+    onDragLeave: (e: React.DragEvent) => void;
+    onDrop: (e: React.DragEvent) => void;
+};
+export {};
+//# sourceMappingURL=useDepotFichier.d.ts.map

package/dist/ui/FileDropZone/useDepotFichier.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDepotFichier.d.ts","sourceRoot":"","sources":["../../../src/ui/FileDropZone/useDepotFichier.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAqD,cAAc,EAAkB,MAAM,gBAAgB,CAAC;AAwBnH,KAAK,OAAO,GAAG,IAAI,CAAC,cAAc,EAAE,OAAO,GAAG,MAAM,GAAG,UAAU,GAAG,UAAU,GAAG,UAAU,CAAC,CAAC;AAE7F;;;;GAIG;AACH,eAAO,MAAM,eAAe,GAAI,+CAA+C,OAAO;;qBA4B5D,KAAK,CAAC,SAAS;oBAOhB,KAAK,CAAC,SAAS;qBAId,KAAK,CAAC,SAAS;gBAOpB,KAAK,CAAC,SAAS;CAsBnC,CAAC"}