@alveole/components 0.43.2 → 1.0.0

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

@@ -21,7 +21,7 @@ declare const _default: {
             justifyContent: "space-between";
         };
         label: {
-            color: "#373A3F";
+            color: string;
             fontSize: 14;
             lineHeight: 20;
             letterSpacing: 0;
@@ -29,7 +29,7 @@ declare const _default: {
             fontWeight?: import("react-native").TextStyle["fontWeight"];
         };
         labelDisabled: {
-            color: "#8D97AC";
+            color: string;
         };
         hintContainer: {
             display: "flex";
@@ -37,7 +37,7 @@ declare const _default: {
             justifyContent: "space-between";
         };
         hint: {
-            color: "#5F6571";
+            color: string;
             fontSize: 12;
             lineHeight: 20;
             letterSpacing: 0;
@@ -45,7 +45,7 @@ declare const _default: {
             fontWeight?: import("react-native").TextStyle["fontWeight"];
         };
         hintDisabled: {
-            color: "#8D97AC";
+            color: string;
         };
         inputContainer: {
             width: "100%";
@@ -57,7 +57,7 @@ declare const _default: {
             padding: number;
             borderRadius: number;
             borderWidth: number;
-            borderColor: "#DEE3EC";
+            borderColor: string;
             backgroundColor: "#FFFFFF";
             overflow: "hidden";
             width: "100%";
@@ -67,7 +67,7 @@ declare const _default: {
             display: "flex";
             flexDirection: "row";
             outline: string;
-            color: "#373A3F";
+            color: string;
             fontFamily: string;
             fontSize: 14;
             marginTop: import("@alveole/theme").Spacing;
@@ -78,20 +78,20 @@ declare const _default: {
             flex: number;
         };
         inputError: {
-            borderColor: "#C62416";
+            borderColor: string;
         };
         inputSuccess: {
-            borderColor: "#1B7440";
+            borderColor: string;
         };
         inputDisabled: {
-            borderColor: "#E6EAF1";
+            borderColor: string;
         };
         inputFocused: {
             outlineStyle: "solid";
             outlineWidth: number;
-            outlineColor: "#0A76F6";
+            outlineColor: string;
             outlineOffset: number;
-            borderColor: "#0A76F6" | undefined;
+            borderColor: string | undefined;
         };
         inputFile: {
             margin: number;
@@ -102,7 +102,7 @@ declare const _default: {
             letterSpacing: 0;
             fontFamily: string;
             fontWeight?: import("react-native").TextStyle["fontWeight"];
-            color: "#373A3F";
+            color: string;
         };
         inputFileClear: {
             position: "absolute";
@@ -121,7 +121,7 @@ declare const _default: {
         };
         modalOverlay: {
             flex: number;
-            backgroundColor: `rgba${string}`;
+            backgroundColor: string;
         };
         modalSheet: {
             width: "100%";
@@ -159,12 +159,12 @@ declare const _default: {
         modalInputContainer: {
             borderRadius: number;
             borderWidth: number;
-            borderColor: "#DEE3EC";
+            borderColor: string;
             backgroundColor: "#FFFFFF";
             minHeight: number;
         };
         modalInput: {
-            color: "#373A3F";
+            color: string;
             paddingLeft: import("@alveole/theme").Spacing;
             paddingRight: import("@alveole/theme").Spacing;
             paddingTop: import("@alveole/theme").Spacing;
@@ -200,10 +200,10 @@ declare const _default: {
             fontWeight?: import("react-native").TextStyle["fontWeight"];
         };
         errorText: {
-            color: "#C62416";
+            color: string;
         };
         successText: {
-            color: "#1C7F54";
+            color: string;
         };
     };
 };

package/dist/ui/FormControl/FormControl.stories.js

@@ -30,9 +30,9 @@ export const MultilineWithModal = () => {
     const [text, setText] = useState('');
     return (_jsxs(FormControl, { children: [_jsx(InputHeading, { children: _jsx(FormControlLabel, { label: "Description" }) }), _jsx(TextInput, { value: text, onChangeText: setText, placeholder: "Taper pour ouvrir la modale de saisie...", multiline: true, openModal: true, modalSubmitLabel: "Confirmer" })] }));
 };
-export const Label = () => (_jsxs(Box, { display: "flex", flexDirection: "column", gap: 8, children: [_jsx(FormControlLabel, { label: "Label par defaut" }), _jsx(FormControlLabel, { label: "Desactive", disabled: true }), _jsx(FormControlLabel, { label: "Erreur", error: "Message erreur" }), _jsx(FormControlLabel, { label: "Succes", success: "Message succes" }), _jsx(FormControlLabel, { label: "Avec badge", labelRight: _jsx(Typography, { children: "Optionnel" }) })] }));
-export const Caption = () => (_jsxs(Box, { display: "flex", flexDirection: "column", gap: 8, children: [_jsx(FormControlCaption, { error: "Champ requis" }), _jsx(FormControlCaption, { success: "Valeur correcte" })] }));
-export const Hint = () => (_jsxs(Box, { display: "flex", flexDirection: "column", gap: 8, children: [_jsx(FormControlHint, { hint: "Texte descriptif du champ" }), _jsx(FormControlHint, { hint: "Texte desactive", disabled: true })] }));
+export const Label = () => (_jsxs(Box, { display: "flex", flexDirection: "column", gap: 24, children: [_jsx(FormControlLabel, { label: "Label par defaut" }), _jsx(FormControlLabel, { label: "Desactive", disabled: true }), _jsx(FormControlLabel, { label: "Erreur", error: "Message erreur" }), _jsx(FormControlLabel, { label: "Succes", success: "Message succes" }), _jsx(FormControlLabel, { label: "Avec badge", labelRight: _jsx(Typography, { children: "Optionnel" }) })] }));
+export const Caption = () => (_jsxs(Box, { display: "flex", flexDirection: "column", gap: 24, children: [_jsx(FormControlCaption, { error: "Champ requis" }), _jsx(FormControlCaption, { success: "Valeur correcte" })] }));
+export const Hint = () => (_jsxs(Box, { display: "flex", flexDirection: "column", gap: 24, children: [_jsx(FormControlHint, { hint: "Texte descriptif du champ" }), _jsx(FormControlHint, { hint: "Texte desactive", disabled: true })] }));
 export const Modal = () => {
     const [open, setOpen] = useState(false);
     return (_jsxs(Box, { children: [_jsx(Button, { variant: "secondary", title: "Ouvrir la modale", onPress: () => setOpen(true) }), _jsx(FormControlModal, { open: open, onClose: () => setOpen(false), submitLabel: "Valider", onSubmit: () => setOpen(false), children: _jsx(TextInput, { placeholder: "Saisir un texte...", multiline: true, numberOfLines: 6 }) })] }));

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

@@ -1 +1 @@
-{"version":3,"file":"FormControl.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/FormControl/FormControl.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,aAAa,cAAmU,CAAC;AAE9V,eAAO,MAAM,SAAS,cAAkT,CAAC;AAEzU,eAAO,MAAM,WAAW,cAAkT,CAAC;AAE3U,eAAO,MAAM,SAAS,cAAyP,CAAC;AAEhR,eAAO,MAAM,kBAAkB,cAA6d,CAAC;AAE7f,eAAO,MAAM,KAAK,cAAqc,CAAC;AAExd,eAAO,MAAM,OAAO,cAA6N,CAAC;AAElP,eAAO,MAAM,IAAI,cAAsO,CAAC;AAExP,eAAO,MAAM,KAAK,cAA2f,CAAC;AAE9gB,eAAO,MAAM,WAAW,cAA8sC,CAAC;AAEvuC,eAAO,MAAM,SAAS,cAA65B,CAAC;AAEp7B,eAAO,MAAM,SAAS,cAA+2B,CAAC;AAEt4B,eAAO,MAAM,QAAQ,cAAyZ,CAAC;AAE/a,eAAO,MAAM,YAAY;;;;;;;;;;;;;;CAcf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}
+{"version":3,"file":"FormControl.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/FormControl/FormControl.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,aAAa,cAAmU,CAAC;AAE9V,eAAO,MAAM,SAAS,cAAkT,CAAC;AAEzU,eAAO,MAAM,WAAW,cAAkT,CAAC;AAE3U,eAAO,MAAM,SAAS,cAAyP,CAAC;AAEhR,eAAO,MAAM,kBAAkB,cAA6d,CAAC;AAE7f,eAAO,MAAM,KAAK,cAAsc,CAAC;AAEzd,eAAO,MAAM,OAAO,cAA8N,CAAC;AAEnP,eAAO,MAAM,IAAI,cAAuO,CAAC;AAEzP,eAAO,MAAM,KAAK,cAA2f,CAAC;AAE9gB,eAAO,MAAM,WAAW,cAA8sC,CAAC;AAEvuC,eAAO,MAAM,SAAS,cAA65B,CAAC;AAEp7B,eAAO,MAAM,SAAS,cAA+2B,CAAC;AAEt4B,eAAO,MAAM,QAAQ,cAAyZ,CAAC;AAE/a,eAAO,MAAM,YAAY;;;;;;;;;;;;;;CAcf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}

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

@@ -5,9 +5,9 @@ export const WithError = () => "export const WithError = () => (\n  <FormControl
 export const WithSuccess = () => "export const WithSuccess = () => (\n  <FormControl>\n    <InputHeading>\n      <FormControlLabel label=\"Adresse email\" success=\"Email valide\" />\n    </InputHeading>\n    <TextInput placeholder=\"jean@exemple.fr\" />\n    <FormControlCaption success=\"Email valide\" />\n  </FormControl>\n);";
 export const Multiline = () => "export const Multiline = () => (\n  <FormControl>\n    <InputHeading>\n      <FormControlLabel label=\"Message\" />\n    </InputHeading>\n    <TextInput placeholder=\"Votre message...\" multiline numberOfLines={4} />\n  </FormControl>\n);";
 export const MultilineWithModal = () => "export const MultilineWithModal = () => {\n  const [text, setText] = useState('');\n  return (\n    <FormControl>\n      <InputHeading>\n        <FormControlLabel label=\"Description\" />\n      </InputHeading>\n      <TextInput\n        value={text}\n        onChangeText={setText}\n        placeholder=\"Taper pour ouvrir la modale de saisie...\"\n        multiline\n        openModal\n        modalSubmitLabel=\"Confirmer\"\n      />\n    </FormControl>\n  );\n};";
-export const Label = () => "export const Label = () => (\n  <Box display=\"flex\" flexDirection=\"column\" gap={8}>\n    <FormControlLabel label=\"Label par defaut\" />\n    <FormControlLabel label=\"Desactive\" disabled />\n    <FormControlLabel label=\"Erreur\" error=\"Message erreur\" />\n    <FormControlLabel label=\"Succes\" success=\"Message succes\" />\n    <FormControlLabel label=\"Avec badge\" labelRight={<Typography>Optionnel</Typography>} />\n  </Box>\n);";
-export const Caption = () => "export const Caption = () => (\n  <Box display=\"flex\" flexDirection=\"column\" gap={8}>\n    <FormControlCaption error=\"Champ requis\" />\n    <FormControlCaption success=\"Valeur correcte\" />\n  </Box>\n);";
-export const Hint = () => "export const Hint = () => (\n  <Box display=\"flex\" flexDirection=\"column\" gap={8}>\n    <FormControlHint hint=\"Texte descriptif du champ\" />\n    <FormControlHint hint=\"Texte desactive\" disabled />\n  </Box>\n);";
+export const Label = () => "export const Label = () => (\n  <Box display=\"flex\" flexDirection=\"column\" gap={24}>\n    <FormControlLabel label=\"Label par defaut\" />\n    <FormControlLabel label=\"Desactive\" disabled />\n    <FormControlLabel label=\"Erreur\" error=\"Message erreur\" />\n    <FormControlLabel label=\"Succes\" success=\"Message succes\" />\n    <FormControlLabel label=\"Avec badge\" labelRight={<Typography>Optionnel</Typography>} />\n  </Box>\n);";
+export const Caption = () => "export const Caption = () => (\n  <Box display=\"flex\" flexDirection=\"column\" gap={24}>\n    <FormControlCaption error=\"Champ requis\" />\n    <FormControlCaption success=\"Valeur correcte\" />\n  </Box>\n);";
+export const Hint = () => "export const Hint = () => (\n  <Box display=\"flex\" flexDirection=\"column\" gap={24}>\n    <FormControlHint hint=\"Texte descriptif du champ\" />\n    <FormControlHint hint=\"Texte desactive\" disabled />\n  </Box>\n);";
 export const Modal = () => "export const Modal = () => {\n  const [open, setOpen] = useState(false);\n  return (\n    <Box>\n      <Button variant=\"secondary\" title=\"Ouvrir la modale\" onPress={() => setOpen(true)} />\n      <FormControlModal\n        open={open}\n        onClose={() => setOpen(false)}\n        submitLabel=\"Valider\"\n        onSubmit={() => setOpen(false)}\n      >\n        <TextInput placeholder=\"Saisir un texte...\" multiline numberOfLines={6} />\n      </FormControlModal>\n    </Box>\n  );\n};";
 export const NumberInput = () => "export const NumberInput = () => {\n  const [value, setValue] = useState<number | null>(null);\n  return (\n    <Box display=\"flex\" flexDirection=\"column\" gap={12}>\n      <FormControl>\n        <InputHeading>\n          <FormControlLabel label=\"Montant\" />\n        </InputHeading>\n        <FormControlNumberInput value={value} onChange={setValue} placeholder=\"0\" />\n      </FormControl>\n      <FormControl>\n        <InputHeading>\n          <FormControlLabel label=\"Avec unites\" />\n        </InputHeading>\n        <FormControlNumberInput\n          value={value}\n          onChange={setValue}\n          startAdornment={\n            <Box style={{ paddingLeft: 8, paddingRight: 4 }}>\n              <Typography>€</Typography>\n            </Box>\n          }\n          endAdornment={\n            <Box style={{ paddingLeft: 4, paddingRight: 8 }}>\n              <Typography>TTC</Typography>\n            </Box>\n          }\n        />\n      </FormControl>\n      <FormControl>\n        <InputHeading>\n          <FormControlLabel label=\"Desactive\" />\n        </InputHeading>\n        <FormControlNumberInput value={42} onChange={() => {}} disabled />\n      </FormControl>\n    </Box>\n  );\n};";
 export const DateInput = () => "export const DateInput = () => {\n  const [date, setDate] = useState('');\n  const [time, setTime] = useState('');\n  const [month, setMonth] = useState('');\n  return (\n    <Box display=\"flex\" flexDirection=\"column\" gap={12}>\n      <FormControl>\n        <InputHeading>\n          <FormControlLabel label=\"Date\" />\n        </InputHeading>\n        <FormControlDateInput type=\"date\" value={date} onChange={setDate} />\n      </FormControl>\n      <FormControl>\n        <InputHeading>\n          <FormControlLabel label=\"Heure\" />\n        </InputHeading>\n        <FormControlDateInput type=\"time\" value={time} onChange={setTime} />\n      </FormControl>\n      <FormControl>\n        <InputHeading>\n          <FormControlLabel label=\"Mois\" />\n        </InputHeading>\n        <FormControlDateInput type=\"month\" value={month} onChange={setMonth} />\n      </FormControl>\n    </Box>\n  );\n};";

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

@@ -11,7 +11,7 @@ export declare const useStyles: () => {
         justifyContent: "space-between";
     };
     label: {
-        color: "#373A3F";
+        color: string;
         fontSize: 14;
         lineHeight: 20;
         letterSpacing: 0;
@@ -19,7 +19,7 @@ export declare const useStyles: () => {
         fontWeight?: import("react-native").TextStyle["fontWeight"];
     };
     labelDisabled: {
-        color: "#8D97AC";
+        color: string;
     };
     hintContainer: {
         display: "flex";
@@ -27,7 +27,7 @@ export declare const useStyles: () => {
         justifyContent: "space-between";
     };
     hint: {
-        color: "#5F6571";
+        color: string;
         fontSize: 12;
         lineHeight: 20;
         letterSpacing: 0;
@@ -35,7 +35,7 @@ export declare const useStyles: () => {
         fontWeight?: import("react-native").TextStyle["fontWeight"];
     };
     hintDisabled: {
-        color: "#8D97AC";
+        color: string;
     };
     inputContainer: {
         width: "100%";
@@ -47,7 +47,7 @@ export declare const useStyles: () => {
         padding: number;
         borderRadius: number;
         borderWidth: number;
-        borderColor: "#DEE3EC";
+        borderColor: string;
         backgroundColor: "#FFFFFF";
         overflow: "hidden";
         width: "100%";
@@ -57,7 +57,7 @@ export declare const useStyles: () => {
         display: "flex";
         flexDirection: "row";
         outline: string;
-        color: "#373A3F";
+        color: string;
         fontFamily: string;
         fontSize: 14;
         marginTop: import("@alveole/theme").Spacing;
@@ -68,20 +68,20 @@ export declare const useStyles: () => {
         flex: number;
     };
     inputError: {
-        borderColor: "#C62416";
+        borderColor: string;
     };
     inputSuccess: {
-        borderColor: "#1B7440";
+        borderColor: string;
     };
     inputDisabled: {
-        borderColor: "#E6EAF1";
+        borderColor: string;
     };
     inputFocused: {
         outlineStyle: "solid";
         outlineWidth: number;
-        outlineColor: "#0A76F6";
+        outlineColor: string;
         outlineOffset: number;
-        borderColor: "#0A76F6" | undefined;
+        borderColor: string | undefined;
     };
     inputFile: {
         margin: number;
@@ -92,7 +92,7 @@ export declare const useStyles: () => {
         letterSpacing: 0;
         fontFamily: string;
         fontWeight?: import("react-native").TextStyle["fontWeight"];
-        color: "#373A3F";
+        color: string;
     };
     inputFileClear: {
         position: "absolute";
@@ -111,7 +111,7 @@ export declare const useStyles: () => {
     };
     modalOverlay: {
         flex: number;
-        backgroundColor: `rgba${string}`;
+        backgroundColor: string;
     };
     modalSheet: {
         width: "100%";
@@ -149,12 +149,12 @@ export declare const useStyles: () => {
     modalInputContainer: {
         borderRadius: number;
         borderWidth: number;
-        borderColor: "#DEE3EC";
+        borderColor: string;
         backgroundColor: "#FFFFFF";
         minHeight: number;
     };
     modalInput: {
-        color: "#373A3F";
+        color: string;
         paddingLeft: import("@alveole/theme").Spacing;
         paddingRight: import("@alveole/theme").Spacing;
         paddingTop: import("@alveole/theme").Spacing;
@@ -190,10 +190,10 @@ export declare const useStyles: () => {
         fontWeight?: import("react-native").TextStyle["fontWeight"];
     };
     errorText: {
-        color: "#C62416";
+        color: string;
     };
     successText: {
-        color: "#1C7F54";
+        color: string;
     };
 };
 //# sourceMappingURL=FormControl.styles.d.ts.map

package/dist/ui/FormControl/FormControlFileInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FormControlFileInput.d.ts","sourceRoot":"","sources":["../../../src/ui/FormControl/FormControlFileInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,cAAc,MAAM,sBAAsB,CAAC;AACvD,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,MAAM,MAAM,yBAAyB,GACjC,cAAc,CAAC,mBAAmB,GAClC,cAAc,CAAC,mBAAmB,EAAE,GACpC,IAAI,CAAC;AAET,MAAM,MAAM,yBAAyB,GAAG;IACtC,KAAK,EAAE,yBAAyB,CAAC;IACjC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,cAAc,CAAC,qBAAqB,CAAC,MAAM,CAAC,CAAC;IACpD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,CAAC,KAAK,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACrD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAI,OAAO,yBAAyB,6BA6EpE,CAAC"}
+{"version":3,"file":"FormControlFileInput.d.ts","sourceRoot":"","sources":["../../../src/ui/FormControl/FormControlFileInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,cAAc,MAAM,sBAAsB,CAAC;AACvD,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,MAAM,MAAM,yBAAyB,GACnC,cAAc,CAAC,mBAAmB,GAAG,cAAc,CAAC,mBAAmB,EAAE,GAAG,IAAI,CAAC;AAEnF,MAAM,MAAM,yBAAyB,GAAG;IACtC,KAAK,EAAE,yBAAyB,CAAC;IACjC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,cAAc,CAAC,qBAAqB,CAAC,MAAM,CAAC,CAAC;IACpD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,CAAC,KAAK,EAAE,yBAAyB,KAAK,IAAI,CAAC;IACrD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAI,OAAO,yBAAyB,6BA6EpE,CAAC"}

package/dist/ui/FormControl/FormControlFileInput.styles.d.ts

@@ -7,8 +7,8 @@ export declare const useStyles: () => {
     };
     fileInputButton: {
         borderWidth: number;
-        borderColor: "#DEE3EC";
-        backgroundColor: "#F6F7F8";
+        borderColor: string;
+        backgroundColor: string;
         transition: "background-color 0.1s ease-in-out";
         display: "flex";
         alignItems: "center";
@@ -19,14 +19,14 @@ export declare const useStyles: () => {
         paddingBottom: import("@alveole/theme").Spacing;
     };
     fileInputButtonHovered: {
-        backgroundColor: "#E6EAF1";
+        backgroundColor: string;
     };
     fileInputButtonDisabled: {
         cursor: "not-allowed";
-        backgroundColor: "#E6EAF1";
+        backgroundColor: string;
     };
     inputFileText: {
-        color: "#373A3F";
+        color: string;
         fontSize: 12;
         lineHeight: 20;
         letterSpacing: 0;
@@ -34,7 +34,7 @@ export declare const useStyles: () => {
         fontWeight?: import("react-native").TextStyle["fontWeight"];
     };
     placeholderText: {
-        color: "#373A3F";
+        color: string;
         fontSize: 12;
         lineHeight: 20;
         letterSpacing: 0;

package/dist/ui/FormControl/TextInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../../src/ui/FormControl/TextInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAKL,SAAS,IAAI,oBAAoB,EACjC,cAAc,IAAI,yBAAyB,EAE5C,MAAM,cAAc,CAAC;AAQtB,MAAM,MAAM,gBAAgB,GAAG,oBAAoB,CAAC;AACpD,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,yBAAyB,EAAE,OAAO,CAAC,GAAG;IACtE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,SAAS;eART,OAAO;qBACD,KAAK,CAAC,SAAS;mBACjB,KAAK,CAAC,SAAS;gBAClB,OAAO;uBACA,MAAM;oBACT,MAAM,IAAI;8CAsN1B,CAAC"}
+{"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../../src/ui/FormControl/TextInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAML,SAAS,IAAI,oBAAoB,EACjC,cAAc,IAAI,yBAAyB,EAC5C,MAAM,cAAc,CAAC;AAKtB,MAAM,MAAM,gBAAgB,GAAG,oBAAoB,CAAC;AACpD,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,yBAAyB,EAAE,OAAO,CAAC,GAAG;IACtE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACjC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,SAAS;eART,OAAO;qBACD,KAAK,CAAC,SAAS;mBACjB,KAAK,CAAC,SAAS;gBAClB,OAAO;uBACA,MAAM;oBACT,MAAM,IAAI;8CAsN1B,CAAC"}

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

@@ -11,11 +11,13 @@ declare const _default: {
             position: "sticky";
             top: number;
             zIndex: number;
-            backgroundColor: "#FFFFFF" | "#F6F7F8";
+            width: "100%";
+            backgroundColor: string;
         } | {
             position: "sticky";
             top: number;
             zIndex: number;
+            width: "100%";
             shadowColor: import("@alveole/theme").Color;
             shadowOffset: {
                 width: number;
@@ -24,20 +26,22 @@ declare const _default: {
             shadowOpacity: number;
             shadowRadius: number;
             elevation: number;
-            backgroundColor: "#FFFFFF" | "#F6F7F8";
+            backgroundColor: string;
         } | {
             position: "sticky";
             top: number;
             zIndex: number;
+            width: "100%";
             boxShadow: string;
-            backgroundColor: "#FFFFFF" | "#F6F7F8";
+            backgroundColor: string;
         } | {
             position: "sticky";
             top: number;
             zIndex: number;
+            width: "100%";
             borderBottomWidth: number;
-            borderBottomColor: "#DEE3EC";
-            backgroundColor: "#FFFFFF" | "#F6F7F8";
+            borderBottomColor: string;
+            backgroundColor: string;
         };
         inner: {
             display: "flex";
@@ -57,7 +61,7 @@ declare const _default: {
             gap: import("@alveole/theme").Spacing;
         };
         titleText: {
-            color: "#151617";
+            color: string;
             display: "flex" | "none";
             fontSize: 14;
             lineHeight: 20;

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

@@ -1 +1 @@
-{"version":3,"file":"Header.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Header/Header.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA,wBAUkB;AAqBlB,eAAO,MAAM,OAAO,mCAYnB,CAAC;AAEF,eAAO,MAAM,iBAAiB,mCAAmE,CAAC;AAElG,eAAO,MAAM,YAAY,mCAExB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,0BAA0B,CAAC"}
+{"version":3,"file":"Header.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Header/Header.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA,wBAUkB;AAqBlB,eAAO,MAAM,OAAO,mCAYnB,CAAC;AAEF,eAAO,MAAM,iBAAiB,mCAAmE,CAAC;AAElG,eAAO,MAAM,YAAY,mCAExB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,0BAA0B,CAAC"}

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

@@ -3,11 +3,13 @@ export declare const useStyles: () => {
         position: "sticky";
         top: number;
         zIndex: number;
-        backgroundColor: "#FFFFFF" | "#F6F7F8";
+        width: "100%";
+        backgroundColor: string;
     } | {
         position: "sticky";
         top: number;
         zIndex: number;
+        width: "100%";
         shadowColor: import("@alveole/theme").Color;
         shadowOffset: {
             width: number;
@@ -16,20 +18,22 @@ export declare const useStyles: () => {
         shadowOpacity: number;
         shadowRadius: number;
         elevation: number;
-        backgroundColor: "#FFFFFF" | "#F6F7F8";
+        backgroundColor: string;
     } | {
         position: "sticky";
         top: number;
         zIndex: number;
+        width: "100%";
         boxShadow: string;
-        backgroundColor: "#FFFFFF" | "#F6F7F8";
+        backgroundColor: string;
     } | {
         position: "sticky";
         top: number;
         zIndex: number;
+        width: "100%";
         borderBottomWidth: number;
-        borderBottomColor: "#DEE3EC";
-        backgroundColor: "#FFFFFF" | "#F6F7F8";
+        borderBottomColor: string;
+        backgroundColor: string;
     };
     inner: {
         display: "flex";
@@ -49,7 +53,7 @@ export declare const useStyles: () => {
         gap: import("@alveole/theme").Spacing;
     };
     titleText: {
-        color: "#151617";
+        color: string;
         display: "flex" | "none";
         fontSize: 14;
         lineHeight: 20;

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

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

package/dist/ui/Header/Header.styles.js

@@ -8,6 +8,7 @@ export const useStyles = makeStyles(({ color, text, spacing, isVariant, shadows
         position: 'sticky',
         top: 0,
         zIndex: 100,
+        width: '100%',
     },
     inner: {
         display: 'flex',

package/dist/ui/InputButtonAdornment/InputButtonAdornment.d.ts

@@ -0,0 +1,9 @@
+import { IconProps } from '@alveole/components';
+export type InputButtonAdornmentProps = {
+    icon: IconProps['name'];
+    position: 'start' | 'end';
+    disabled?: boolean;
+    onPress?: () => void;
+};
+export declare const InputButtonAdornment: (props: InputButtonAdornmentProps) => import("react").JSX.Element;
+//# sourceMappingURL=InputButtonAdornment.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"InputButtonAdornment.d.ts","sourceRoot":"","sources":["../../../src/ui/InputButtonAdornment/InputButtonAdornment.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAmB,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAGjE,MAAM,MAAM,yBAAyB,GAAG;IACtC,IAAI,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IACxB,QAAQ,EAAE,OAAO,GAAG,KAAK,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAI,OAAO,yBAAyB,gCAqBpE,CAAC"}

package/dist/ui/InputButtonAdornment/InputButtonAdornment.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Box, ButtonIcon } from '@alveole/components';
+import { useStyles } from './InputButtonAdornment.styles';
+export const InputButtonAdornment = (props) => {
+    const { icon, position, disabled, onPress } = props;
+    const styles = useStyles();
+    return (_jsx(Box, { style: position === 'start' ? styles.controlStart : styles.controlEnd, children: _jsx(ButtonIcon, { variant: "tertiary", disabled: disabled, style: {
+                borderBottomLeftRadius: 0,
+                borderBottomRightRadius: 0,
+                borderTopLeftRadius: 0,
+                borderTopRightRadius: 0,
+            }, icon: icon, onPress: onPress }) }));
+};

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

@@ -0,0 +1,23 @@
+declare const _default: {
+    title: string;
+    tags: "ui"[];
+    experimental: false;
+    description: string;
+    component: (props: import("./InputButtonAdornment").InputButtonAdornmentProps) => import("react").JSX.Element;
+    styleFn: () => {
+        textInput: {};
+        controlStart: {
+            borderRightWidth: number;
+            borderColor: string;
+        };
+        controlEnd: {
+            borderColor: string;
+            borderLeftWidth: number;
+        };
+    };
+};
+export default _default;
+export declare const End: () => import("react").JSX.Element;
+export declare const Start: () => import("react").JSX.Element;
+export * as Sources from './InputButtonAdornment.stories.sources';
+//# sourceMappingURL=InputButtonAdornment.stories.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"InputButtonAdornment.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/InputButtonAdornment/InputButtonAdornment.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAMA,wBAOkB;AAElB,eAAO,MAAM,GAAG,mCASf,CAAC;AAEF,eAAO,MAAM,KAAK,mCAIjB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,wCAAwC,CAAC"}

package/dist/ui/InputButtonAdornment/InputButtonAdornment.stories.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box } from '../../core';
+import { FormControl } from '../FormControl';
+import { InputButtonAdornment } from './InputButtonAdornment';
+import { useStyles } from './InputButtonAdornment.styles';
+export default {
+    title: 'InputButtonAdornment',
+    tags: ['ui'],
+    experimental: false,
+    description: "Bouton icône avec bordure latérale, à placer en début ou fin d'input.",
+    component: InputButtonAdornment,
+    styleFn: useStyles,
+};
+export const End = () => (_jsxs(Box, { display: "flex", flexDirection: "column", gap: 24, children: [_jsx(FormControl, { children: _jsx(InputButtonAdornment, { icon: "Eye", position: "end", onPress: () => { } }) }), _jsx(FormControl, { children: _jsx(InputButtonAdornment, { icon: "X", position: "end", onPress: () => { } }) })] }));
+export const Start = () => (_jsx(FormControl, { children: _jsx(InputButtonAdornment, { icon: "Plus", position: "start", onPress: () => { } }) }));
+export * as Sources from './InputButtonAdornment.stories.sources';

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

@@ -0,0 +1,8 @@
+export declare const End: () => string;
+export declare const Start: () => string;
+export declare const storySources: {
+    readonly End: () => string;
+    readonly Start: () => string;
+};
+export type StorySourceName = keyof typeof storySources;
+//# sourceMappingURL=InputButtonAdornment.stories.sources.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"InputButtonAdornment.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/InputButtonAdornment/InputButtonAdornment.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,GAAG,cAA6V,CAAC;AAE9W,eAAO,MAAM,KAAK,cAAgK,CAAC;AAEnL,eAAO,MAAM,YAAY;;;CAGf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}

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

@@ -0,0 +1,8 @@
+// This file is generated. Do not edit manually.
+// Source: src/ui/InputButtonAdornment/InputButtonAdornment.stories.tsx
+export const End = () => "export const End = () => (\n  <Box display=\"flex\" flexDirection=\"column\" gap={24}>\n    <FormControl>\n      <InputButtonAdornment icon=\"Eye\" position=\"end\" onPress={() => {}} />\n    </FormControl>\n    <FormControl>\n      <InputButtonAdornment icon=\"X\" position=\"end\" onPress={() => {}} />\n    </FormControl>\n  </Box>\n);";
+export const Start = () => "export const Start = () => (\n  <FormControl>\n    <InputButtonAdornment icon=\"Plus\" position=\"start\" onPress={() => {}} />\n  </FormControl>\n);";
+export const storySources = {
+    End,
+    Start,
+};

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

@@ -0,0 +1,12 @@
+export declare const useStyles: () => {
+    textInput: {};
+    controlStart: {
+        borderRightWidth: number;
+        borderColor: string;
+    };
+    controlEnd: {
+        borderColor: string;
+        borderLeftWidth: number;
+    };
+};
+//# sourceMappingURL=InputButtonAdornment.styles.d.ts.map

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

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

package/dist/ui/InputButtonAdornment/InputButtonAdornment.styles.js

@@ -0,0 +1,12 @@
+import { makeStyles } from '@alveole/theme';
+export const useStyles = makeStyles(({ color }) => ({
+    textInput: {},
+    controlStart: {
+        borderRightWidth: 1,
+        borderColor: color.border['default-grey'],
+    },
+    controlEnd: {
+        borderColor: color.border['default-grey'],
+        borderLeftWidth: 1,
+    },
+}));

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

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

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

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

package/dist/ui/InputButtonAdornment/index.js

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