@alveole/components 2.0.0-alpha.16 → 2.0.0-alpha.18

package/dist/ui/DateInput/DateInput.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { TextInputProps } from '../FormControl';
+import { TextInputElement, TextInputProps } from '../FormControl';
 type MinuteInterval = 1 | 2 | 3 | 4 | 5 | 6 | 10 | 12 | 15 | 20 | 30;
 export type DateInputProps = Omit<TextInputProps, 'type' | 'onChange'> & {
     type?: 'date' | 'datetime' | 'month';
@@ -20,6 +20,6 @@ export declare const DateInput: React.ForwardRefExoticComponent<Omit<TextInputPr
     onChange?: (date: string) => void;
     is24Hour?: boolean;
     minuteInterval?: MinuteInterval;
-} & React.RefAttributes<import("react-native").TextInput>>;
+} & React.RefAttributes<TextInputElement>>;
 export {};
 //# sourceMappingURL=DateInput.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"DateInput.d.ts","sourceRoot":"","sources":["../../../src/ui/DateInput/DateInput.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAG9D,OAAO,EAA+B,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAE7E,KAAK,cAAc,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAErE,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,cAAc,EAAE,MAAM,GAAG,UAAU,CAAC,GAAG;IACvE,IAAI,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,OAAO,CAAC;IACrC,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,IAAI,CAAC;IACnB,WAAW,CAAC,EAAE,IAAI,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,cAAc,CAAC;CACjC,CAAC;AA+EF,eAAO,MAAM,SAAS;WAvFb,MAAM,GAAG,UAAU,GAAG,OAAO;cAC1B,SAAS,GAAG,SAAS;YACvB,MAAM;kBACA,IAAI;kBACJ,IAAI;eACP,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI;eACtB,OAAO;qBACD,cAAc;0DAkI/B,CAAC"}
+{"version":3,"file":"DateInput.d.ts","sourceRoot":"","sources":["../../../src/ui/DateInput/DateInput.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAG9D,OAAO,EAAa,gBAAgB,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAE7E,KAAK,cAAc,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAErE,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,cAAc,EAAE,MAAM,GAAG,UAAU,CAAC,GAAG;IACvE,IAAI,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,OAAO,CAAC;IACrC,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAChC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,IAAI,CAAC;IACnB,WAAW,CAAC,EAAE,IAAI,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,cAAc,CAAC;CACjC,CAAC;AA+EF,eAAO,MAAM,SAAS;WAvFb,MAAM,GAAG,UAAU,GAAG,OAAO;cAC1B,SAAS,GAAG,SAAS;YACvB,MAAM;kBACA,IAAI;kBACJ,IAAI;eACP,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI;eACtB,OAAO;qBACD,cAAc;0CAkI/B,CAAC"}

package/dist/ui/DateInput/DateInput.ios.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { TextInputElement } from '../FormControl';
 export declare const DateInput: React.ForwardRefExoticComponent<Omit<import("..").TextInputProps, "onChange" | "type"> & {
     type?: "date" | "datetime" | "month";
     display?: "default" | "spinner";
@@ -8,5 +9,5 @@ export declare const DateInput: React.ForwardRefExoticComponent<Omit<import(".."
     onChange?: (date: string) => void;
     is24Hour?: boolean;
     minuteInterval?: 2 | 1 | 4 | 6 | 12 | 3 | 5 | 10 | 20 | 15 | 30;
-} & React.RefAttributes<import("react-native").TextInput>>;
+} & React.RefAttributes<TextInputElement>>;
 //# sourceMappingURL=DateInput.ios.d.ts.map

package/dist/ui/DateInput/DateInput.ios.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DateInput.ios.d.ts","sourceRoot":"","sources":["../../../src/ui/DateInput/DateInput.ios.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAsB,MAAM,OAAO,CAAC;AA0D3C,eAAO,MAAM,SAAS;;;;;;;;;0DAoDpB,CAAC"}
+{"version":3,"file":"DateInput.ios.d.ts","sourceRoot":"","sources":["../../../src/ui/DateInput/DateInput.ios.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAG3C,OAAO,EAA+B,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAuD/E,eAAO,MAAM,SAAS;;;;;;;;;0CAoDpB,CAAC"}

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

@@ -13,7 +13,7 @@ declare const _default: {
         onChange?: (date: string) => void;
         is24Hour?: boolean;
         minuteInterval?: 2 | 1 | 4 | 6 | 12 | 3 | 5 | 10 | 20 | 15 | 30;
-    } & React.RefAttributes<import("react-native").TextInput>>;
+    } & React.RefAttributes<import("..").TextInputElement>>;
     styleFn: () => string;
 };
 export default _default;

package/dist/ui/DateInput/DateInput.stories.js

@@ -12,10 +12,10 @@ export default {
     component: DateInput,
     styleFn: () => 'Aucun style appliqué',
 };
-export const Default = () => (_jsx(Box, { width: '100%', children: _jsxs(Grid, { gap: 8, children: [_jsx(Grid.Column, { size: { desktop: 6, mobile: 12 }, children: _jsx(FormControl, { label: "Default", children: _jsx(DateInput, { onChange: console.log }) }) }), _jsxs(Grid.Column, { size: { desktop: 6, mobile: 12 }, children: [_jsx(FormControl, { label: "Error", error: "Une erreur", children: _jsx(DateInput, { onChange: console.log, error: "Une erreur" }) }), _jsx(FormControl, { label: "Succ\u00E8s", success: "Date enregistr\u00E9e", children: _jsx(DateInput, { onChange: console.log, success: "Date enregistr\u00E9e" }) })] }), _jsx(Grid.Column, { size: { desktop: 6, mobile: 12 }, children: _jsx(FormControl, { label: "Disabled", disabled: true, children: _jsx(DateInput, { onChange: console.log, disabled: true }) }) })] }) }));
+export const Default = () => (_jsx(Box, { width: '100%', children: _jsxs(Grid, { gap: "1W", children: [_jsx(Grid.Column, { size: { desktop: 6, mobile: 12 }, children: _jsx(FormControl, { label: "Default", children: _jsx(DateInput, { onChange: console.log }) }) }), _jsxs(Grid.Column, { size: { desktop: 6, mobile: 12 }, children: [_jsx(FormControl, { label: "Error", error: "Une erreur", children: _jsx(DateInput, { onChange: console.log, error: "Une erreur" }) }), _jsx(FormControl, { label: "Succ\u00E8s", success: "Date enregistr\u00E9e", children: _jsx(DateInput, { onChange: console.log, success: "Date enregistr\u00E9e" }) })] }), _jsx(Grid.Column, { size: { desktop: 6, mobile: 12 }, children: _jsx(FormControl, { label: "Disabled", disabled: true, children: _jsx(DateInput, { onChange: console.log, disabled: true }) }) })] }) }));
 export const Types = () => {
     const [date, setDate] = React.useState();
     const [datetime, setDatetime] = React.useState();
-    return (_jsx(Box, { width: '100%', children: _jsxs(Grid, { gap: 8, children: [_jsx(Grid.Column, { size: { desktop: 6, mobile: 12 }, children: _jsx(FormControl, { label: "Date (default)", children: _jsx(DateInput, { value: date, onChange: e => setDate(e.toString()) }) }) }), _jsx(Grid.Column, { size: { desktop: 6, mobile: 12 }, children: _jsx(FormControl, { label: "Datetime", children: _jsx(DateInput, { value: datetime, type: "datetime", is24Hour: true, onChange: e => setDatetime(e.toString()) }) }) })] }) }));
+    return (_jsx(Box, { width: '100%', children: _jsxs(Grid, { gap: "1W", children: [_jsx(Grid.Column, { size: { desktop: 6, mobile: 12 }, children: _jsx(FormControl, { label: "Date (default)", children: _jsx(DateInput, { value: date, onChange: e => setDate(e.toString()) }) }) }), _jsx(Grid.Column, { size: { desktop: 6, mobile: 12 }, children: _jsx(FormControl, { label: "Datetime", children: _jsx(DateInput, { value: datetime, type: "datetime", is24Hour: true, onChange: e => setDatetime(e.toString()) }) }) })] }) }));
 };
 export * as Sources from './DateInput.stories.sources';

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

@@ -1 +1 @@
-{"version":3,"file":"DateInput.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/DateInput/DateInput.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,cAA+4B,CAAC;AAEp6B,eAAO,MAAM,KAAK,cAA+uB,CAAC;AAElwB,eAAO,MAAM,YAAY;;;CAGf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}
+{"version":3,"file":"DateInput.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/DateInput/DateInput.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,cAAk5B,CAAC;AAEv6B,eAAO,MAAM,KAAK,cAAkvB,CAAC;AAErwB,eAAO,MAAM,YAAY;;;CAGf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}

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

@@ -1,7 +1,7 @@
 // This file is generated. Do not edit manually.
 // Source: src/ui/DateInput/DateInput.stories.tsx
-export const Default = () => "export const Default = () => (\n  <Box width={'100%'}>\n    <Grid gap={8}>\n      <Grid.Column size={{ desktop: 6, mobile: 12 }}>\n        <FormControl label=\"Default\">\n          <DateInput onChange={console.log} />\n        </FormControl>\n      </Grid.Column>\n      <Grid.Column size={{ desktop: 6, mobile: 12 }}>\n        <FormControl label=\"Error\" error=\"Une erreur\">\n          <DateInput onChange={console.log} error=\"Une erreur\" />\n        </FormControl>\n        <FormControl label=\"Succès\" success=\"Date enregistrée\">\n          <DateInput onChange={console.log} success=\"Date enregistrée\" />\n        </FormControl>\n      </Grid.Column>\n      <Grid.Column size={{ desktop: 6, mobile: 12 }}>\n        <FormControl label=\"Disabled\" disabled>\n          <DateInput onChange={console.log} disabled />\n        </FormControl>\n      </Grid.Column>\n    </Grid>\n  </Box>\n);";
-export const Types = () => "export const Types = () => {\n  const [date, setDate] = React.useState<string>();\n  const [datetime, setDatetime] = React.useState<string>();\n\n  return (\n    <Box width={'100%'}>\n      <Grid gap={8}>\n        <Grid.Column size={{ desktop: 6, mobile: 12 }}>\n          <FormControl label=\"Date (default)\">\n            <DateInput value={date} onChange={e => setDate(e.toString())} />\n          </FormControl>\n        </Grid.Column>\n        <Grid.Column size={{ desktop: 6, mobile: 12 }}>\n          <FormControl label=\"Datetime\">\n            <DateInput value={datetime} type=\"datetime\" is24Hour onChange={e => setDatetime(e.toString())} />\n          </FormControl>\n        </Grid.Column>\n      </Grid>\n    </Box>\n  );\n};";
+export const Default = () => "export const Default = () => (\n  <Box width={'100%'}>\n    <Grid gap=\"1W\">\n      <Grid.Column size={{ desktop: 6, mobile: 12 }}>\n        <FormControl label=\"Default\">\n          <DateInput onChange={console.log} />\n        </FormControl>\n      </Grid.Column>\n      <Grid.Column size={{ desktop: 6, mobile: 12 }}>\n        <FormControl label=\"Error\" error=\"Une erreur\">\n          <DateInput onChange={console.log} error=\"Une erreur\" />\n        </FormControl>\n        <FormControl label=\"Succès\" success=\"Date enregistrée\">\n          <DateInput onChange={console.log} success=\"Date enregistrée\" />\n        </FormControl>\n      </Grid.Column>\n      <Grid.Column size={{ desktop: 6, mobile: 12 }}>\n        <FormControl label=\"Disabled\" disabled>\n          <DateInput onChange={console.log} disabled />\n        </FormControl>\n      </Grid.Column>\n    </Grid>\n  </Box>\n);";
+export const Types = () => "export const Types = () => {\n  const [date, setDate] = React.useState<string>();\n  const [datetime, setDatetime] = React.useState<string>();\n\n  return (\n    <Box width={'100%'}>\n      <Grid gap=\"1W\">\n        <Grid.Column size={{ desktop: 6, mobile: 12 }}>\n          <FormControl label=\"Date (default)\">\n            <DateInput value={date} onChange={e => setDate(e.toString())} />\n          </FormControl>\n        </Grid.Column>\n        <Grid.Column size={{ desktop: 6, mobile: 12 }}>\n          <FormControl label=\"Datetime\">\n            <DateInput value={datetime} type=\"datetime\" is24Hour onChange={e => setDatetime(e.toString())} />\n          </FormControl>\n        </Grid.Column>\n      </Grid>\n    </Box>\n  );\n};";
 export const storySources = {
     Default,
     Types,

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

@@ -10,7 +10,7 @@ declare const _default: {
         divider: {
             width: "100%";
             height: number;
-            backgroundColor: string;
+            backgroundColor: import("@alveole/theme").ThemeColor;
         };
     };
 };

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

@@ -1 +1 @@
-{"version":3,"file":"Divider.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Divider/Divider.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAIA,wBASkB;AAElB,eAAO,MAAM,OAAO,mCAAmC,CAAC;AAExD,OAAO,KAAK,OAAO,MAAM,2BAA2B,CAAC"}
+{"version":3,"file":"Divider.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Divider/Divider.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAIA,wBASkB;AAElB,eAAO,MAAM,OAAO,mCAAoC,CAAC;AAEzD,OAAO,KAAK,OAAO,MAAM,2BAA2B,CAAC"}

package/dist/ui/Divider/Divider.stories.js

@@ -11,5 +11,5 @@ export default {
     component: Divider,
     styleFn: useStyles,
 };
-export const Default = () => _jsx(Divider, { mt: 8, mb: 16 });
+export const Default = () => _jsx(Divider, { mt: "1W", mb: "2W" });
 export * as Sources from './Divider.stories.sources';

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

@@ -1 +1 @@
-{"version":3,"file":"Divider.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/Divider/Divider.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,cAAmE,CAAC;AAExF,eAAO,MAAM,YAAY;;CAEf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}
+{"version":3,"file":"Divider.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/Divider/Divider.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,cAAwE,CAAC;AAE7F,eAAO,MAAM,YAAY;;CAEf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}

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

@@ -1,6 +1,6 @@
 // This file is generated. Do not edit manually.
 // Source: src/ui/Divider/Divider.stories.tsx
-export const Default = () => "export const Default = () => <Divider mt={8} mb={16} />;";
+export const Default = () => "export const Default = () => <Divider mt=\"1W\" mb=\"2W\" />;";
 export const storySources = {
     Default,
 };

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

@@ -2,7 +2,7 @@ export declare const useStyles: () => {
     divider: {
         width: "100%";
         height: number;
-        backgroundColor: string;
+        backgroundColor: import("@alveole/theme").ThemeColor;
     };
 };
 //# sourceMappingURL=Divider.styles.d.ts.map

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

@@ -44,10 +44,10 @@ declare const _default: {
             display: "flex";
             alignItems: "center";
             justifyContent: "center";
-            backgroundColor: string;
+            backgroundColor: import("@alveole/theme").ThemeColor;
         };
         viewerPdfErrorLabel: {
-            color: string;
+            color: import("@alveole/theme").ThemeColor;
             userSelect: "none";
             textAlign: "center";
             fontSize: 14;
@@ -83,13 +83,13 @@ declare const _default: {
             flexDirection: "column";
             flex: number;
             padding: string | number;
-            borderColor: string;
+            borderColor: import("@alveole/theme").ThemeColor;
             borderWidth: number;
             borderStyle: "solid";
             borderTopWidth: number;
             borderBottomLeftRadius: import("@alveole/theme").Radius;
             borderBottomRightRadius: import("@alveole/theme").Radius;
-            backgroundColor: string;
+            backgroundColor: import("@alveole/theme").ThemeColor;
             overflow: "hidden";
         };
         children: {
@@ -101,23 +101,23 @@ declare const _default: {
             minWidth: number;
             flexShrink: number;
             position: "relative";
-            borderColor: string;
+            borderColor: import("@alveole/theme").ThemeColor;
             borderWidth: number;
             borderStyle: "solid";
             borderLeft: number;
             borderTopRightRadius: import("@alveole/theme").Radius;
             borderBottomRightRadius: import("@alveole/theme").Radius;
-            backgroundColor: string;
+            backgroundColor: import("@alveole/theme").ThemeColor;
             overflow: "auto";
         };
         toolbar: {
             padding: string | number;
-            borderColor: string;
+            borderColor: import("@alveole/theme").ThemeColor;
             borderWidth: number;
             borderStyle: "solid";
             borderTopLeftRadius: import("@alveole/theme").Radius;
             borderTopRightRadius: import("@alveole/theme").Radius;
-            backgroundColor: string;
+            backgroundColor: import("@alveole/theme").ThemeColor;
             display: "flex";
             flexDirection: "row";
             gap: string | number;
@@ -130,7 +130,7 @@ declare const _default: {
             justifyContent: "flex-end";
         };
         toolbarTitle: {
-            color: string;
+            color: import("@alveole/theme").ThemeColor;
             paddingLeft: string | number;
             marginTop: string;
             marginBottom: string;
@@ -142,7 +142,7 @@ declare const _default: {
             fontWeight?: import("react-native").TextStyle["fontWeight"];
         };
         toolbarState: {
-            color: string;
+            color: import("@alveole/theme").ThemeColor;
             userSelect: "none";
             fontVariant: "tabular-nums";
             fontSize: 14;
@@ -154,7 +154,7 @@ declare const _default: {
         toolbarDivider: {
             width: number;
             height: "50%";
-            backgroundColor: string;
+            backgroundColor: import("@alveole/theme").ThemeColor;
             marginTop: string;
             marginBottom: string;
         };

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

@@ -1 +1 @@
-{"version":3,"file":"DocumentViewer.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/DocumentViewer/DocumentViewer.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA,wBAQkB;AAElB,eAAO,MAAM,eAAe,mCAI3B,CAAC;AAEF,eAAO,MAAM,WAAW,mCASvB,CAAC;AAEF,eAAO,MAAM,gBAAgB,mCAS5B,CAAC;AAEF,eAAO,MAAM,YAAY,mCAaxB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,kCAAkC,CAAC"}
+{"version":3,"file":"DocumentViewer.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/DocumentViewer/DocumentViewer.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA,wBAQkB;AAElB,eAAO,MAAM,eAAe,mCAI3B,CAAC;AAEF,eAAO,MAAM,WAAW,mCAIvB,CAAC;AAEF,eAAO,MAAM,gBAAgB,mCAS5B,CAAC;AAEF,eAAO,MAAM,YAAY,mCAQxB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,kCAAkC,CAAC"}

package/dist/ui/DocumentViewer/DocumentViewer.stories.js

@@ -13,7 +13,7 @@ export default {
     styleFn: useStyles,
 };
 export const DocumentImageEx = () => (_jsx(Box, { width: "100%", maxW: 500, height: 500, children: _jsx(DocumentViewer, { title: "Document image", type: "image", source: "https://picsum.photos/1000/2000", height: "100%" }) }));
-export const DocumentPdf = () => (_jsx(Box, { width: "100%", height: 400, maxW: 500, children: _jsx(DocumentViewer, { title: "Document PDF", type: "pdf", source: "https://upload.wikimedia.org/wikipedia/commons/4/4e/Wikip%C3%A9dia.pdf", height: "100%" }) }));
+export const DocumentPdf = () => (_jsx(Box, { width: "100%", height: 400, maxW: 500, children: _jsx(DocumentViewer, { title: "Document PDF", type: "pdf", source: "/document-exemple.pdf", height: "100%" }) }));
 export const DocumentPdfError = () => (_jsx(Box, { width: "100%", height: 400, maxW: 500, children: _jsx(DocumentViewer, { title: "Document PDF en erreur", type: "pdf", source: "https://example.com/document-inexistant.pdf", height: "100%" }) }));
-export const WithChildren = () => (_jsx(Box, { width: "100%", height: 600, children: _jsx(DocumentViewer, { title: "Document PDF", type: "pdf", source: "https://upload.wikimedia.org/wikipedia/commons/4/4e/Wikip%C3%A9dia.pdf", height: "100%", children: _jsx(Box, { p: '2W', children: _jsx(Typography, { children: "Contenu enfant" }) }) }) }));
+export const WithChildren = () => (_jsx(Box, { width: "100%", height: 600, children: _jsx(DocumentViewer, { title: "Document PDF", type: "pdf", source: "/document-exemple.pdf", height: "100%", children: _jsx(Box, { p: '2W', children: _jsx(Typography, { children: "Contenu enfant" }) }) }) }));
 export * as Sources from './DocumentViewer.stories.sources';

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

@@ -1 +1 @@
-{"version":3,"file":"DocumentViewer.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/DocumentViewer/DocumentViewer.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,eAAe,cAA0O,CAAC;AAEvQ,eAAO,MAAM,WAAW,cAA0S,CAAC;AAEnU,eAAO,MAAM,gBAAgB,cAA8R,CAAC;AAE5T,eAAO,MAAM,YAAY,cAA2Y,CAAC;AAEra,eAAO,MAAM,YAAY;;;;;CAKf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}
+{"version":3,"file":"DocumentViewer.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/DocumentViewer/DocumentViewer.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,eAAe,cAA0O,CAAC;AAEvQ,eAAO,MAAM,WAAW,cAAwN,CAAC;AAEjP,eAAO,MAAM,gBAAgB,cAA8R,CAAC;AAE5T,eAAO,MAAM,YAAY,cAAwT,CAAC;AAElV,eAAO,MAAM,YAAY;;;;;CAKf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}

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

@@ -1,9 +1,9 @@
 // This file is generated. Do not edit manually.
 // Source: src/ui/DocumentViewer/DocumentViewer.stories.tsx
 export const DocumentImageEx = () => "export const DocumentImageEx = () => (\n  <Box width=\"100%\" maxW={500} height={500}>\n    <DocumentViewer title=\"Document image\" type=\"image\" source=\"https://picsum.photos/1000/2000\" height=\"100%\" />\n  </Box>\n);";
-export const DocumentPdf = () => "export const DocumentPdf = () => (\n  <Box width=\"100%\" height={400} maxW={500}>\n    <DocumentViewer\n      title=\"Document PDF\"\n      type=\"pdf\"\n      source=\"https://upload.wikimedia.org/wikipedia/commons/4/4e/Wikip%C3%A9dia.pdf\"\n      height=\"100%\"\n    />\n  </Box>\n);";
+export const DocumentPdf = () => "export const DocumentPdf = () => (\n  <Box width=\"100%\" height={400} maxW={500}>\n    <DocumentViewer title=\"Document PDF\" type=\"pdf\" source=\"/document-exemple.pdf\" height=\"100%\" />\n  </Box>\n);";
 export const DocumentPdfError = () => "export const DocumentPdfError = () => (\n  <Box width=\"100%\" height={400} maxW={500}>\n    <DocumentViewer\n      title=\"Document PDF en erreur\"\n      type=\"pdf\"\n      source=\"https://example.com/document-inexistant.pdf\"\n      height=\"100%\"\n    />\n  </Box>\n);";
-export const WithChildren = () => "export const WithChildren = () => (\n  <Box width=\"100%\" height={600}>\n    <DocumentViewer\n      title=\"Document PDF\"\n      type=\"pdf\"\n      source=\"https://upload.wikimedia.org/wikipedia/commons/4/4e/Wikip%C3%A9dia.pdf\"\n      height=\"100%\"\n    >\n      <Box p={'2W'}>\n        <Typography>Contenu enfant</Typography>\n      </Box>\n    </DocumentViewer>\n  </Box>\n);";
+export const WithChildren = () => "export const WithChildren = () => (\n  <Box width=\"100%\" height={600}>\n    <DocumentViewer title=\"Document PDF\" type=\"pdf\" source=\"/document-exemple.pdf\" height=\"100%\">\n      <Box p={'2W'}>\n        <Typography>Contenu enfant</Typography>\n      </Box>\n    </DocumentViewer>\n  </Box>\n);";
 export const storySources = {
     DocumentImageEx,
     DocumentPdf,

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

@@ -37,10 +37,10 @@ export declare const useStyles: () => {
         display: "flex";
         alignItems: "center";
         justifyContent: "center";
-        backgroundColor: string;
+        backgroundColor: import("@alveole/theme").ThemeColor;
     };
     viewerPdfErrorLabel: {
-        color: string;
+        color: import("@alveole/theme").ThemeColor;
         userSelect: "none";
         textAlign: "center";
         fontSize: 14;
@@ -76,13 +76,13 @@ export declare const useStyles: () => {
         flexDirection: "column";
         flex: number;
         padding: string | number;
-        borderColor: string;
+        borderColor: import("@alveole/theme").ThemeColor;
         borderWidth: number;
         borderStyle: "solid";
         borderTopWidth: number;
         borderBottomLeftRadius: import("@alveole/theme").Radius;
         borderBottomRightRadius: import("@alveole/theme").Radius;
-        backgroundColor: string;
+        backgroundColor: import("@alveole/theme").ThemeColor;
         overflow: "hidden";
     };
     children: {
@@ -94,23 +94,23 @@ export declare const useStyles: () => {
         minWidth: number;
         flexShrink: number;
         position: "relative";
-        borderColor: string;
+        borderColor: import("@alveole/theme").ThemeColor;
         borderWidth: number;
         borderStyle: "solid";
         borderLeft: number;
         borderTopRightRadius: import("@alveole/theme").Radius;
         borderBottomRightRadius: import("@alveole/theme").Radius;
-        backgroundColor: string;
+        backgroundColor: import("@alveole/theme").ThemeColor;
         overflow: "auto";
     };
     toolbar: {
         padding: string | number;
-        borderColor: string;
+        borderColor: import("@alveole/theme").ThemeColor;
         borderWidth: number;
         borderStyle: "solid";
         borderTopLeftRadius: import("@alveole/theme").Radius;
         borderTopRightRadius: import("@alveole/theme").Radius;
-        backgroundColor: string;
+        backgroundColor: import("@alveole/theme").ThemeColor;
         display: "flex";
         flexDirection: "row";
         gap: string | number;
@@ -123,7 +123,7 @@ export declare const useStyles: () => {
         justifyContent: "flex-end";
     };
     toolbarTitle: {
-        color: string;
+        color: import("@alveole/theme").ThemeColor;
         paddingLeft: string | number;
         marginTop: string;
         marginBottom: string;
@@ -135,7 +135,7 @@ export declare const useStyles: () => {
         fontWeight?: import("react-native").TextStyle["fontWeight"];
     };
     toolbarState: {
-        color: string;
+        color: import("@alveole/theme").ThemeColor;
         userSelect: "none";
         fontVariant: "tabular-nums";
         fontSize: 14;
@@ -147,7 +147,7 @@ export declare const useStyles: () => {
     toolbarDivider: {
         width: number;
         height: "50%";
-        backgroundColor: string;
+        backgroundColor: import("@alveole/theme").ThemeColor;
         marginTop: string;
         marginBottom: string;
     };

package/dist/ui/DocumentViewer/chargementDePdfJs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chargementDePdfJs.d.ts","sourceRoot":"","sources":["../../../src/ui/DocumentViewer/chargementDePdfJs.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,wBAAwB,CAAC;AAEhE,MAAM,MAAM,oBAAoB,GAAG;IACjC,OAAO,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACrC,OAAO,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC;QACjC,WAAW,EAAE,CAAC,OAAO,EAAE;YAAE,KAAK,EAAE,MAAM,CAAC;YAAC,QAAQ,EAAE,sBAAsB,CAAA;SAAE,KAAK;YAAE,KAAK,EAAE,MAAM,CAAC;YAAC,MAAM,EAAE,MAAM,CAAA;SAAE,CAAC;QACjH,MAAM,EAAE,CAAC,OAAO,EAAE;YAChB,aAAa,EAAE,wBAAwB,CAAC;YACxC,QAAQ,EAAE;gBAAE,KAAK,EAAE,MAAM,CAAC;gBAAC,MAAM,EAAE,MAAM,CAAA;aAAE,CAAC;YAC5C,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;SAC9D,KAAK;YAAE,OAAO,EAAE,OAAO,CAAC,IAAI,CAAC,CAAC;YAAC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;SAAE,GAAG,IAAI,CAAC;QAC7D,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;KACtB,CAAC,CAAC;IACH,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IACxB,mBAAmB,EAAE;QAAE,SAAS,EAAE,MAAM,CAAA;KAAE,CAAC;IAC3C,WAAW,EAAE,CAAC,MAAM,EAAE,MAAM,GAAG;QAAE,GAAG,EAAE,MAAM,CAAA;KAAE,KAAK;QACjD,OAAO,EAAE,OAAO,CAAC,oBAAoB,CAAC,CAAC;QACvC,OAAO,EAAE,MAAM,IAAI,CAAC;KACrB,CAAC;CACH,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,GAAI,UAAU,MAAM,EAAE,UAAU;IAAE,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,WAMxG,CAAC;AAcF,2FAA2F;AAC3F,eAAO,MAAM,aAAa,GAAI,QAAQ,OAAO,KAAG,WAK/C,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,SAAS,4BAoBlB,CAAC"}
+{"version":3,"file":"chargementDePdfJs.d.ts","sourceRoot":"","sources":["../../../src/ui/DocumentViewer/chargementDePdfJs.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,MAAM,wBAAwB,CAAC;AAEhE,MAAM,MAAM,oBAAoB,GAAG;IACjC,OAAO,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACrC,OAAO,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC;QACjC,WAAW,EAAE,CAAC,OAAO,EAAE;YAAE,KAAK,EAAE,MAAM,CAAC;YAAC,QAAQ,EAAE,sBAAsB,CAAA;SAAE,KAAK;YAAE,KAAK,EAAE,MAAM,CAAC;YAAC,MAAM,EAAE,MAAM,CAAA;SAAE,CAAC;QACjH,MAAM,EAAE,CAAC,OAAO,EAAE;YAChB,aAAa,EAAE,wBAAwB,CAAC;YACxC,QAAQ,EAAE;gBAAE,KAAK,EAAE,MAAM,CAAC;gBAAC,MAAM,EAAE,MAAM,CAAA;aAAE,CAAC;YAC5C,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;SAC9D,KAAK;YAAE,OAAO,EAAE,OAAO,CAAC,IAAI,CAAC,CAAC;YAAC,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;SAAE,GAAG,IAAI,CAAC;QAC7D,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;KACtB,CAAC,CAAC;IACH,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG;IACxB,mBAAmB,EAAE;QAAE,SAAS,EAAE,MAAM,CAAA;KAAE,CAAC;IAC3C,WAAW,EAAE,CAAC,MAAM,EAAE,MAAM,GAAG;QAAE,GAAG,EAAE,MAAM,CAAA;KAAE,KAAK;QACjD,OAAO,EAAE,OAAO,CAAC,oBAAoB,CAAC,CAAC;QACvC,OAAO,EAAE,MAAM,IAAI,CAAC;KACrB,CAAC;CACH,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,GAAI,UAAU,MAAM,EAAE,UAAU;IAAE,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,WAMxG,CAAC;AAiBF,2FAA2F;AAC3F,eAAO,MAAM,aAAa,GAAI,QAAQ,OAAO,KAAG,WAK/C,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,SAAS,4BAoBlB,CAAC"}

package/dist/ui/DocumentViewer/chargementDePdfJs.js

@@ -14,7 +14,9 @@ const getPdfJsAssetUrl = (filename) => {
     return urlDeLAssetPdfJs(filename, { scriptUrl: expoScript?.src ?? null, origin: window.location.origin });
 };
 const estUnObjet = (valeur) => typeof valeur === 'object' && valeur !== null;
-const estPdfJs = (valeur) => estUnObjet(valeur) && estUnObjet(valeur.GlobalWorkerOptions) && typeof valeur.getDocument === 'function';
+// Dans pdf.js 6 (la version embarquée), `GlobalWorkerOptions` est une classe, plus un objet
+const estDesOptionsDeWorker = (valeur) => estUnObjet(valeur) || typeof valeur === 'function';
+const estPdfJs = (valeur) => estUnObjet(valeur) && estDesOptionsDeWorker(valeur.GlobalWorkerOptions) && typeof valeur.getDocument === 'function';
 /** pdf.js tel que l'import dynamique le livre : un module que TypeScript n'a jamais vu. */
 export const pdfJsDuModule = (module) => {
     if (estUnObjet(module) && estPdfJs(module.default))

package/dist/ui/DurationInput/DurationInput.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { TextInputElement } from '../FormControl';
 import { ChampHHMMProps } from '../FormControl/ChampHHMM';
 export type DurationInputProps = ChampHHMMProps;
 export declare const DurationInput: React.ForwardRefExoticComponent<import("..").FormControlCaptionProps & {
@@ -6,5 +7,5 @@ export declare const DurationInput: React.ForwardRefExoticComponent<import("..")
     onChange?: (value: string) => void;
     onBlur?: () => void;
     disabled?: boolean;
-} & React.RefAttributes<import("react-native").TextInput>>;
+} & React.RefAttributes<TextInputElement>>;
 //# sourceMappingURL=DurationInput.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"DurationInput.d.ts","sourceRoot":"","sources":["../../../src/ui/DurationInput/DurationInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAa,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAErE,MAAM,MAAM,kBAAkB,GAAG,cAAc,CAAC;AAEhD,eAAO,MAAM,aAAa;;;;;0DAExB,CAAC"}
+{"version":3,"file":"DurationInput.d.ts","sourceRoot":"","sources":["../../../src/ui/DurationInput/DurationInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAgB,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAChE,OAAO,EAAa,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAErE,MAAM,MAAM,kBAAkB,GAAG,cAAc,CAAC;AAEhD,eAAO,MAAM,aAAa;;;;;0CAExB,CAAC"}

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

@@ -9,7 +9,7 @@ declare const _default: {
         onChange?: (value: string) => void;
         onBlur?: () => void;
         disabled?: boolean;
-    } & import("react").RefAttributes<import("react-native").TextInput>>;
+    } & import("react").RefAttributes<import("..").TextInputElement>>;
     styleFn: () => string;
 };
 export default _default;

package/dist/ui/DurationInput/DurationInput.stories.js

@@ -26,6 +26,6 @@ Le champ est nu : on le place dans un FormControl pour son libellé, son aide et
     component: DurationInput,
     styleFn: () => 'Aucun style appliqué',
 };
-export const Default = () => (_jsx(Box, { width: "100%", p: 8, children: _jsxs(Grid, { gap: 8, children: [_jsx(Grid.Column, { size: { mobile: 12, desktop: 4 }, children: _jsx(FormControl, { label: "Dur\u00E9e", children: _jsx(DurationInput, {}) }) }), _jsx(Grid.Column, { size: { mobile: 12, desktop: 4 }, children: _jsx(FormControl, { label: "Dur\u00E9e", children: _jsx(DurationInput, { value: "06:15" }) }) }), _jsx(Grid.Column, { size: { mobile: 12, desktop: 4 }, children: _jsx(FormControl, { label: "Dur\u00E9e", hint: "Temps pass\u00E9 sur le terrain", children: _jsx(DurationInput, { value: "01:30" }) }) })] }) }));
-export const States = () => (_jsx(Box, { width: "100%", p: 8, children: _jsxs(Grid, { gap: 8, children: [_jsx(Grid.Column, { size: { mobile: 12, desktop: 4 }, children: _jsx(FormControl, { label: "Erreur", error: "Heure invalide (minutes 00\u201359)", children: _jsx(DurationInput, { value: "25:70", error: "Heure invalide (minutes 00\u201359)" }) }) }), _jsx(Grid.Column, { size: { mobile: 12, desktop: 4 }, children: _jsx(FormControl, { label: "Succ\u00E8s", success: "Enregistr\u00E9", children: _jsx(DurationInput, { value: "06:15", success: "Enregistr\u00E9" }) }) }), _jsx(Grid.Column, { size: { mobile: 12, desktop: 4 }, children: _jsx(FormControl, { label: "D\u00E9sactiv\u00E9", disabled: true, children: _jsx(DurationInput, { value: "06:15", disabled: true }) }) })] }) }));
+export const Default = () => (_jsx(Box, { width: "100%", p: "1W", children: _jsxs(Grid, { gap: "1W", children: [_jsx(Grid.Column, { size: { mobile: 12, desktop: 4 }, children: _jsx(FormControl, { label: "Dur\u00E9e", children: _jsx(DurationInput, {}) }) }), _jsx(Grid.Column, { size: { mobile: 12, desktop: 4 }, children: _jsx(FormControl, { label: "Dur\u00E9e", children: _jsx(DurationInput, { value: "06:15" }) }) }), _jsx(Grid.Column, { size: { mobile: 12, desktop: 4 }, children: _jsx(FormControl, { label: "Dur\u00E9e", hint: "Temps pass\u00E9 sur le terrain", children: _jsx(DurationInput, { value: "01:30" }) }) })] }) }));
+export const States = () => (_jsx(Box, { width: "100%", p: "1W", children: _jsxs(Grid, { gap: "1W", children: [_jsx(Grid.Column, { size: { mobile: 12, desktop: 4 }, children: _jsx(FormControl, { label: "Erreur", error: "Heure invalide (minutes 00\u201359)", children: _jsx(DurationInput, { value: "25:70", error: "Heure invalide (minutes 00\u201359)" }) }) }), _jsx(Grid.Column, { size: { mobile: 12, desktop: 4 }, children: _jsx(FormControl, { label: "Succ\u00E8s", success: "Enregistr\u00E9", children: _jsx(DurationInput, { value: "06:15", success: "Enregistr\u00E9" }) }) }), _jsx(Grid.Column, { size: { mobile: 12, desktop: 4 }, children: _jsx(FormControl, { label: "D\u00E9sactiv\u00E9", disabled: true, children: _jsx(DurationInput, { value: "06:15", disabled: true }) }) })] }) }));
 export * as Sources from './DurationInput.stories.sources';

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

@@ -1 +1 @@
-{"version":3,"file":"DurationInput.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/DurationInput/DurationInput.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,cAAqrB,CAAC;AAE1sB,eAAO,MAAM,MAAM,cAAwzB,CAAC;AAE50B,eAAO,MAAM,YAAY;;;CAGf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}
+{"version":3,"file":"DurationInput.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/DurationInput/DurationInput.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,cAA2rB,CAAC;AAEhtB,eAAO,MAAM,MAAM,cAA8zB,CAAC;AAEl1B,eAAO,MAAM,YAAY;;;CAGf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}

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

@@ -1,7 +1,7 @@
 // This file is generated. Do not edit manually.
 // Source: src/ui/DurationInput/DurationInput.stories.tsx
-export const Default = () => "export const Default = () => (\n  <Box width=\"100%\" p={8}>\n    <Grid gap={8}>\n      <Grid.Column size={{ mobile: 12, desktop: 4 }}>\n        <FormControl label=\"Durée\">\n          <DurationInput />\n        </FormControl>\n      </Grid.Column>\n      <Grid.Column size={{ mobile: 12, desktop: 4 }}>\n        <FormControl label=\"Durée\">\n          <DurationInput value=\"06:15\" />\n        </FormControl>\n      </Grid.Column>\n      <Grid.Column size={{ mobile: 12, desktop: 4 }}>\n        <FormControl label=\"Durée\" hint=\"Temps passé sur le terrain\">\n          <DurationInput value=\"01:30\" />\n        </FormControl>\n      </Grid.Column>\n    </Grid>\n  </Box>\n);";
-export const States = () => "export const States = () => (\n  <Box width=\"100%\" p={8}>\n    <Grid gap={8}>\n      <Grid.Column size={{ mobile: 12, desktop: 4 }}>\n        <FormControl label=\"Erreur\" error=\"Heure invalide (minutes 00–59)\">\n          <DurationInput value=\"25:70\" error=\"Heure invalide (minutes 00–59)\" />\n        </FormControl>\n      </Grid.Column>\n      <Grid.Column size={{ mobile: 12, desktop: 4 }}>\n        <FormControl label=\"Succès\" success=\"Enregistré\">\n          <DurationInput value=\"06:15\" success=\"Enregistré\" />\n        </FormControl>\n      </Grid.Column>\n      <Grid.Column size={{ mobile: 12, desktop: 4 }}>\n        <FormControl label=\"Désactivé\" disabled>\n          <DurationInput value=\"06:15\" disabled />\n        </FormControl>\n      </Grid.Column>\n    </Grid>\n  </Box>\n);";
+export const Default = () => "export const Default = () => (\n  <Box width=\"100%\" p=\"1W\">\n    <Grid gap=\"1W\">\n      <Grid.Column size={{ mobile: 12, desktop: 4 }}>\n        <FormControl label=\"Durée\">\n          <DurationInput />\n        </FormControl>\n      </Grid.Column>\n      <Grid.Column size={{ mobile: 12, desktop: 4 }}>\n        <FormControl label=\"Durée\">\n          <DurationInput value=\"06:15\" />\n        </FormControl>\n      </Grid.Column>\n      <Grid.Column size={{ mobile: 12, desktop: 4 }}>\n        <FormControl label=\"Durée\" hint=\"Temps passé sur le terrain\">\n          <DurationInput value=\"01:30\" />\n        </FormControl>\n      </Grid.Column>\n    </Grid>\n  </Box>\n);";
+export const States = () => "export const States = () => (\n  <Box width=\"100%\" p=\"1W\">\n    <Grid gap=\"1W\">\n      <Grid.Column size={{ mobile: 12, desktop: 4 }}>\n        <FormControl label=\"Erreur\" error=\"Heure invalide (minutes 00–59)\">\n          <DurationInput value=\"25:70\" error=\"Heure invalide (minutes 00–59)\" />\n        </FormControl>\n      </Grid.Column>\n      <Grid.Column size={{ mobile: 12, desktop: 4 }}>\n        <FormControl label=\"Succès\" success=\"Enregistré\">\n          <DurationInput value=\"06:15\" success=\"Enregistré\" />\n        </FormControl>\n      </Grid.Column>\n      <Grid.Column size={{ mobile: 12, desktop: 4 }}>\n        <FormControl label=\"Désactivé\" disabled>\n          <DurationInput value=\"06:15\" disabled />\n        </FormControl>\n      </Grid.Column>\n    </Grid>\n  </Box>\n);";
 export const storySources = {
     Default,
     States,

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

@@ -32,8 +32,8 @@ declare const _default: {
             display: "flex";
             alignItems: "center";
             justifyContent: "center";
-            color: string;
-            backgroundColor: string;
+            color: import("@alveole/theme").ThemeColor;
+            backgroundColor: import("@alveole/theme").ThemeColor;
             borderRadius: import("@alveole/theme").Radius;
             padding: string | number;
         };
@@ -51,7 +51,7 @@ declare const _default: {
             letterSpacing: 0;
             fontFamily: string;
             fontWeight?: import("react-native").TextStyle["fontWeight"];
-            color: string;
+            color: import("@alveole/theme").ThemeColor;
         };
         description: {
             textAlign: "center";
@@ -60,7 +60,7 @@ declare const _default: {
             letterSpacing: 0;
             fontFamily: string;
             fontWeight?: import("react-native").TextStyle["fontWeight"];
-            color: string;
+            color: import("@alveole/theme").ThemeColor;
         };
         footer: {
             width: "100%" | undefined;

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

@@ -25,8 +25,8 @@ export declare const useStyles: () => {
         display: "flex";
         alignItems: "center";
         justifyContent: "center";
-        color: string;
-        backgroundColor: string;
+        color: import("@alveole/theme").ThemeColor;
+        backgroundColor: import("@alveole/theme").ThemeColor;
         borderRadius: import("@alveole/theme").Radius;
         padding: string | number;
     };
@@ -44,7 +44,7 @@ export declare const useStyles: () => {
         letterSpacing: 0;
         fontFamily: string;
         fontWeight?: import("react-native").TextStyle["fontWeight"];
-        color: string;
+        color: import("@alveole/theme").ThemeColor;
     };
     description: {
         textAlign: "center";
@@ -53,7 +53,7 @@ export declare const useStyles: () => {
         letterSpacing: 0;
         fontFamily: string;
         fontWeight?: import("react-native").TextStyle["fontWeight"];
-        color: string;
+        color: import("@alveole/theme").ThemeColor;
     };
     footer: {
         width: "100%" | undefined;

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

@@ -17,15 +17,15 @@ declare const _default: {
             left: number;
             borderWidth: number;
             borderStyle: "dashed";
-            borderColor: string;
+            borderColor: import("@alveole/theme").ThemeColor;
             borderRadius: import("@alveole/theme").Radius;
-            backgroundColor: string;
+            backgroundColor: import("@alveole/theme").ThemeColor;
             alignItems: "center";
             justifyContent: "center";
             pointerEvents: "none";
         };
         pastille: {
-            backgroundColor: string;
+            backgroundColor: import("@alveole/theme").ThemeColor;
             borderRadius: import("@alveole/theme").Radius;
             paddingLeft: string | number;
             paddingRight: string | number;
@@ -33,7 +33,7 @@ declare const _default: {
             paddingBottom: string | number;
         };
         message: {
-            color: string;
+            color: import("@alveole/theme").ThemeColor;
             fontSize: 16;
             lineHeight: 24;
             letterSpacing: 0;

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

@@ -16,14 +16,14 @@ export default {
 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 }) })] }) }));
+    return (_jsx(FileDropZone, { value: fichiers, onChange: setFichiers, multiple: true, children: _jsxs(Box, { display: "flex", flexDirection: "column", gap: "2W", p: "2W", 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 }) }) }) }));
+    return (_jsx(FileDropZone, { value: fichiers, onChange: setFichiers, multiple: true, disabled: true, children: _jsx(Box, { p: "2W", 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/*" }) }) }) }));
+    return (_jsx(FileDropZone, { value: photo, onChange: setPhoto, type: "image/*", message: "L\u00E2chez la photo pour l'ajouter", children: _jsx(Box, { p: "2W", 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.map

@@ -1 +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"}
+{"version":3,"file":"FileDropZone.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/FileDropZone/FileDropZone.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,UAAU,cAAirB,CAAC;AAEzsB,eAAO,MAAM,UAAU,cAAgb,CAAC;AAExc,eAAO,MAAM,mBAAmB,cAA8b,CAAC;AAE/d,eAAO,MAAM,YAAY;;;;CAIf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}

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

@@ -1,8 +1,8 @@
 // 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 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=\"2W\" p=\"2W\">\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=\"2W\">\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=\"2W\">\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,

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

@@ -10,15 +10,15 @@ export declare const useStyles: () => {
         left: number;
         borderWidth: number;
         borderStyle: "dashed";
-        borderColor: string;
+        borderColor: import("@alveole/theme").ThemeColor;
         borderRadius: import("@alveole/theme").Radius;
-        backgroundColor: string;
+        backgroundColor: import("@alveole/theme").ThemeColor;
         alignItems: "center";
         justifyContent: "center";
         pointerEvents: "none";
     };
     pastille: {
-        backgroundColor: string;
+        backgroundColor: import("@alveole/theme").ThemeColor;
         borderRadius: import("@alveole/theme").Radius;
         paddingLeft: string | number;
         paddingRight: string | number;
@@ -26,7 +26,7 @@ export declare const useStyles: () => {
         paddingBottom: string | number;
     };
     message: {
-        color: string;
+        color: import("@alveole/theme").ThemeColor;
         fontSize: 16;
         lineHeight: 24;
         letterSpacing: 0;