@alveole/components 1.0.1 → 1.1.0

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

@@ -1,6 +1,6 @@
 // This file is generated. Do not edit manually.
 // Source: src/ui/Toast/Toast.stories.tsx
-export const All = () => "export const All = () => {\n  const toast = useToast();\n\n  const defaultToast = () => toast.present('Default', 'Message');\n  const successToast = () => toast.present('Success', 'Message', { variant: 'success' });\n  const errorToast = () => toast.present('Error', 'Message beaucoup plus long', { variant: 'error' });\n  const infoToast = () => toast.present('Information', 'Message', { variant: 'info' });\n  const infoToastMultiLine = () =>\n    toast.present('Information', 'Message beaucoup plus long avec retour à la ligne.\\nDeuxième ligne', {\n      variant: 'info',\n    });\n  const warningToast = () => toast.present('Attention', 'Message', { variant: 'warning' });\n  const withoutMessageToast = () => toast.present('Sans message');\n  const withoutMessageToastError = () => toast.present('Sans message', undefined, { variant: 'error' });\n  const withCustomIcon = () => toast.present('Avec icon custom', undefined, { icon: 'Worm' });\n\n  return (\n    <Box display=\"flex\" flexDirection=\"column\" gap={8}>\n      <Box display=\"flex\" flexDirection=\"row\" gap={4} flexWrap=\"wrap\">\n        <Button title=\"Default toast\" variant=\"secondary\" onPress={defaultToast} />\n        <Button title=\"Success toast\" variant=\"secondary\" onPress={successToast} />\n        <Button title=\"Error toast\" variant=\"secondary\" onPress={errorToast} />\n        <Button title=\"Info toast\" variant=\"secondary\" onPress={infoToast} />\n        <Button title=\"Warning toast\" variant=\"secondary\" onPress={warningToast} />\n        <Button title=\"Message long\" variant=\"secondary\" onPress={infoToastMultiLine} />\n        <Button title=\"Without message toast\" variant=\"secondary\" onPress={withoutMessageToast} />\n        <Button title=\"Without message toast error\" variant=\"secondary\" onPress={withoutMessageToastError} />\n        <Button title=\"WithCustomIcon\" variant=\"secondary\" onPress={withCustomIcon} />\n      </Box>\n      <Box display=\"flex\" flexDirection=\"column\" gap={4}>\n        <Typography>{`Le fichier _layout.tsx doit inclure la balise <Toasts> pour fonctionner`}</Typography>\n        <Highlight language=\"tsx\">\n          {`\n            import { Toasts } from '@alveole/components';\n            import { ThemeProvider } from '@alveole/theme';\n            import { Stack } from 'expo-router';\n            import React from 'react';\n            import { TamaguiProvider } from 'tamagui';\n            import { tamaguiConfig } from '../tamagui.config';\n\n            export default function RootLayout() {\n              return (\n                <TamaguiProvider config={tamaguiConfig} defaultTheme=\"light\">\n                  <ThemeProvider loader={false}>\n                    <Toasts>\n                      <Stack screenOptions={{ headerShown: false }} />\n                    </Toasts>\n                  </ThemeProvider>\n                </TamaguiProvider>\n              );\n            }\n          `}\n        </Highlight>\n      </Box>\n    </Box>\n  );\n};";
+export const All = () => "export const All = () => {\n  const toast = useToast();\n\n  const defaultToast = () => toast.present('Default', 'Message');\n  const successToast = () => toast.present('Success', 'Message', { variant: 'success' });\n  const errorToast = () => toast.present('Error', 'Message beaucoup plus long', { variant: 'error' });\n  const infoToast = () => toast.present('Information', 'Message', { variant: 'info' });\n  const infoToastMultiLine = () =>\n    toast.present('Information', 'Message beaucoup plus long avec retour à la ligne.\\nDeuxième ligne', {\n      variant: 'info',\n    });\n  const warningToast = () => toast.present('Attention', 'Message', { variant: 'warning' });\n  const withoutMessageToast = () => toast.present('Sans message');\n  const withoutMessageToastError = () => toast.present('Sans message', undefined, { variant: 'error' });\n  const withCustomIcon = () => toast.present('Avec icon custom', undefined, { icon: 'Worm' });\n\n  return (\n    <Box display=\"flex\" flexDirection=\"column\" gap={8}>\n      <Box display=\"flex\" flexDirection=\"row\" gap={4} flexWrap=\"wrap\">\n        <Button title=\"Default toast\" variant=\"secondary\" onPress={defaultToast} />\n        <Button title=\"Success toast\" variant=\"secondary\" onPress={successToast} />\n        <Button title=\"Error toast\" variant=\"secondary\" onPress={errorToast} />\n        <Button title=\"Info toast\" variant=\"secondary\" onPress={infoToast} />\n        <Button title=\"Warning toast\" variant=\"secondary\" onPress={warningToast} />\n        <Button title=\"Message long\" variant=\"secondary\" onPress={infoToastMultiLine} />\n        <Button title=\"Without message toast\" variant=\"secondary\" onPress={withoutMessageToast} />\n        <Button title=\"Without message toast error\" variant=\"secondary\" onPress={withoutMessageToastError} />\n        <Button title=\"WithCustomIcon\" variant=\"secondary\" onPress={withCustomIcon} />\n      </Box>\n    </Box>\n  );\n};";
 export const PreviewInfo = () => "export const PreviewInfo = () => (\n  <ToastView variant=\"info\" title=\"Information\" message=\"Description additionnelle du toast.\" />\n);";
 export const PreviewSuccess = () => "export const PreviewSuccess = () => (\n  <ToastView variant=\"success\" title=\"Succès\" message=\"Description additionnelle du toast.\" />\n);";
 export const PreviewError = () => "export const PreviewError = () => (\n  <ToastView variant=\"error\" title=\"Erreur\" message=\"Description additionnelle du toast.\" />\n);";
@@ -20,3 +20,6 @@ export const storySources = {
     PreviewSuccessSansDescription,
     ToastsTypes,
 };
+export const storyDescriptions = {
+    All: "Le fichier `_layout.tsx` doit inclure la balise `<Toasts>` pour fonctionner.\n\n```tsx\nimport { Toasts } from '@alveole/components';\nimport { ThemeProvider } from '@alveole/theme';\nimport { Stack } from 'expo-router';\nimport { TamaguiProvider } from 'tamagui';\nimport { tamaguiConfig } from '../tamagui.config';\n\nexport default function RootLayout() {\n  return (\n    <TamaguiProvider config={tamaguiConfig} defaultTheme=\"light\">\n      <ThemeProvider loader={false}>\n        <Toasts>\n          <Stack screenOptions={{ headerShown: false }} />\n        </Toasts>\n      </ThemeProvider>\n    </TamaguiProvider>\n  );\n}\n```",
+};

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

@@ -5,7 +5,7 @@ export declare const useStyles: () => {
         borderRadius: import("@alveole/theme").Radius;
         display: "flex";
         flexDirection: "row";
-        gap: import("@alveole/theme").Spacing;
+        gap: string | number;
         overflow: "hidden";
         padding: number;
     } | {
@@ -22,7 +22,7 @@ export declare const useStyles: () => {
         borderRadius: import("@alveole/theme").Radius;
         display: "flex";
         flexDirection: "row";
-        gap: import("@alveole/theme").Spacing;
+        gap: string | number;
         overflow: "hidden";
         padding: number;
     } | {
@@ -32,7 +32,7 @@ export declare const useStyles: () => {
         borderRadius: import("@alveole/theme").Radius;
         display: "flex";
         flexDirection: "row";
-        gap: import("@alveole/theme").Spacing;
+        gap: string | number;
         overflow: "hidden";
         padding: number;
     };
@@ -40,8 +40,8 @@ export declare const useStyles: () => {
         display: "flex";
         flex: number;
         flexDirection: "column";
-        gap: import("@alveole/theme").Spacing;
-        padding: import("@alveole/theme").Spacing;
+        gap: string | number;
+        padding: string | number;
     };
     titleContainer: {
         display: "flex";
@@ -62,10 +62,10 @@ export declare const useStyles: () => {
         alignSelf: "stretch";
         justifyContent: "flex-start";
         alignItems: "center";
-        paddingLeft: import("@alveole/theme").Spacing;
-        paddingRight: import("@alveole/theme").Spacing;
-        paddingTop: import("@alveole/theme").Spacing;
-        paddingBottom: import("@alveole/theme").Spacing;
+        paddingLeft: string | number;
+        paddingRight: string | number;
+        paddingTop: string | number;
+        paddingBottom: string | number;
     };
     iconBlockDefault: {
         backgroundColor: string;

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

@@ -3,6 +3,7 @@ declare const _default: {
     tags: "ui"[];
     experimental: false;
     description: string;
+    shortDescription: string;
     figmaURL: string;
     component: any;
     styleFn: () => {
@@ -30,6 +31,22 @@ declare const _default: {
     };
 };
 export default _default;
-export declare const ExampleUsage: () => string;
+/**
+ * Exemple d'intégration dans un fichier `_layout.tsx`.
+ *
+ * ```tsx
+ * <ToolbarBottomNav>
+ *   <ToolbarBottomNav.Screen
+ *     name="home"
+ *     options={{ tabBarLabel: 'Home', tabBarIcon: ToolbarBottomNav.Icon('home') }}
+ *   />
+ *   <ToolbarBottomNav.Screen
+ *     name="list"
+ *     options={{ tabBarLabel: 'Liste', tabBarIcon: ToolbarBottomNav.Icon('all-inbox') }}
+ *   />
+ * </ToolbarBottomNav>
+ * ```
+ */
+export declare const ExampleUsage: () => null;
 export * as Sources from './ToolbarBottomNav.stories.sources';
 //# sourceMappingURL=ToolbarBottomNav.stories.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"ToolbarBottomNav.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/ToolbarBottomNav/ToolbarBottomNav.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,wBASkB;AASlB,eAAO,MAAM,YAAY,cAAoB,CAAC;AAE9C,OAAO,KAAK,OAAO,MAAM,oCAAoC,CAAC"}
+{"version":3,"file":"ToolbarBottomNav.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/ToolbarBottomNav/ToolbarBottomNav.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,wBAUkB;AAElB;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,YAAY,YAAa,CAAC;AAEvC,OAAO,KAAK,OAAO,MAAM,oCAAoC,CAAC"}

package/dist/ui/ToolbarBottomNav/ToolbarBottomNav.stories.js

@@ -4,16 +4,27 @@ export default {
     title: 'ToolbarBottomNav',
     tags: ['ui'],
     experimental: false,
-    description: 'Navigation bottom de type TabsExpo. A utiliser dans les _layout.',
+    description: 'Navigation bottom de type TabsExpo. A utiliser dans les `_layout`.',
+    shortDescription: 'Navigation bottom de type TabsExpo. À utiliser dans les layouts de navigation.',
     figmaURL: 'https://www.figma.com/design/xJz8Z6vfrnZPKTtRbuT2W8/Alveole---Composants?node-id=1880-852&t=baZKFA9BpkeQGeZm-4',
     component: ToolbarBottomNav,
     styleFn: useStyles,
 };
-const codeExample = `<ToolbarBottomNav>
-  // Vers index.tsx
-  <ToolbarBottomNav.Screen name="home" options={{ tabBarLabel: 'Home', tabBarIcon: ToolbarBottomNav.Icon('home') }} />
-  // Vers list.tsx
-  <ToolbarBottomNav.Screen name="list" options={{ tabBarLabel: 'Liste', tabBarIcon: ToolbarBottomNav.Icon('all-inbox') }} />
-</ToolbarBottomNav>`;
-export const ExampleUsage = () => codeExample;
+/**
+ * Exemple d'intégration dans un fichier `_layout.tsx`.
+ *
+ * ```tsx
+ * <ToolbarBottomNav>
+ *   <ToolbarBottomNav.Screen
+ *     name="home"
+ *     options={{ tabBarLabel: 'Home', tabBarIcon: ToolbarBottomNav.Icon('home') }}
+ *   />
+ *   <ToolbarBottomNav.Screen
+ *     name="list"
+ *     options={{ tabBarLabel: 'Liste', tabBarIcon: ToolbarBottomNav.Icon('all-inbox') }}
+ *   />
+ * </ToolbarBottomNav>
+ * ```
+ */
+export const ExampleUsage = () => null;
 export * as Sources from './ToolbarBottomNav.stories.sources';

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

@@ -3,4 +3,5 @@ export declare const storySources: {
     readonly ExampleUsage: () => string;
 };
 export type StorySourceName = keyof typeof storySources;
+export declare const storyDescriptions: Partial<Record<StorySourceName, string>>;
 //# sourceMappingURL=ToolbarBottomNav.stories.sources.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"ToolbarBottomNav.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/ToolbarBottomNav/ToolbarBottomNav.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,YAAY,cAAyD,CAAC;AAEnF,eAAO,MAAM,YAAY;;CAEf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}
+{"version":3,"file":"ToolbarBottomNav.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/ToolbarBottomNav/ToolbarBottomNav.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,YAAY,cAAkD,CAAC;AAE5E,eAAO,MAAM,YAAY;;CAEf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC;AAExD,eAAO,MAAM,iBAAiB,EAAE,OAAO,CAAC,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,CAEtE,CAAC"}

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

@@ -1,6 +1,9 @@
 // This file is generated. Do not edit manually.
 // Source: src/ui/ToolbarBottomNav/ToolbarBottomNav.stories.tsx
-export const ExampleUsage = () => "export const ExampleUsage = () => codeExample;";
+export const ExampleUsage = () => "export const ExampleUsage = () => null;";
 export const storySources = {
     ExampleUsage,
 };
+export const storyDescriptions = {
+    ExampleUsage: "Exemple d'intégration dans un fichier `_layout.tsx`.\n\n```tsx\n<ToolbarBottomNav>\n  <ToolbarBottomNav.Screen\n    name=\"home\"\n    options={{ tabBarLabel: 'Home', tabBarIcon: ToolbarBottomNav.Icon('home') }}\n  />\n  <ToolbarBottomNav.Screen\n    name=\"list\"\n    options={{ tabBarLabel: 'Liste', tabBarIcon: ToolbarBottomNav.Icon('all-inbox') }}\n  />\n</ToolbarBottomNav>\n```",
+};

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

@@ -12,16 +12,16 @@ declare const _default: {
             display: "flex";
             flexDirection: "row";
             alignItems: "center";
-            paddingLeft: import("@alveole/theme").Spacing;
-            paddingRight: import("@alveole/theme").Spacing;
-            paddingTop: import("@alveole/theme").Spacing;
-            paddingBottom: import("@alveole/theme").Spacing;
+            paddingLeft: string | number;
+            paddingRight: string | number;
+            paddingTop: string | number;
+            paddingBottom: string | number;
         };
         compactLargetoolbarContainer: {
-            paddingTop: import("@alveole/theme").Spacing;
-            paddingBottom: import("@alveole/theme").Spacing;
-            paddingLeft: import("@alveole/theme").Spacing;
-            paddingRight: import("@alveole/theme").Spacing;
+            paddingTop: string | number;
+            paddingBottom: string | number;
+            paddingLeft: string | number;
+            paddingRight: string | number;
         };
         largeToolbarContainer: {
             paddingTop: number;
@@ -42,13 +42,13 @@ declare const _default: {
         toolbarNavigation: {
             display: "flex";
             justifyContent: "center";
-            gap: import("@alveole/theme").Spacing;
+            gap: string | number;
         };
         toolbarInformation: {
             display: "flex";
             flexDirection: "row";
             alignItems: "center";
-            gap: import("@alveole/theme").Spacing;
+            gap: string | number;
             flex: number;
         };
         toolbarInformationTitle: {
@@ -115,6 +115,10 @@ export declare const AvecAvatarSansActions: () => import("react").JSX.Element;
 export declare const AvecAvatarEtActions: () => import("react").JSX.Element;
 export declare const AvecPlusieursActions: () => import("react").JSX.Element;
 export declare const AvecTitreEtSansSousTitre: () => import("react").JSX.Element;
+/**
+ * En règle générale, `withBorder` est appliqué dynamiquement au scroll :
+ * la bordure apparaît quand on a scrollé et disparaît en haut de la page.
+ */
 export declare const AvecBorder: () => import("react").JSX.Element;
 export declare const CompactLarge: () => import("react").JSX.Element;
 export declare const Large: () => import("react").JSX.Element;

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

@@ -1 +1 @@
-{"version":3,"file":"ToolbarTop.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/ToolbarTop/ToolbarTop.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA,wBAWkB;AAElB,eAAO,MAAM,OAAO,mCAA4D,CAAC;AAEjF,eAAO,MAAM,iBAAiB,mCAE7B,CAAC;AAEF,eAAO,MAAM,uBAAuB,mCAOnC,CAAC;AAEF,eAAO,MAAM,qBAAqB,mCAEjC,CAAC;AAEF,eAAO,MAAM,mBAAmB,mCAQ/B,CAAC;AAEF,eAAO,MAAM,oBAAoB,mCAahC,CAAC;AAEF,eAAO,MAAM,wBAAwB,mCAYpC,CAAC;AAEF,eAAO,MAAM,UAAU,mCAQtB,CAAC;AAEF,eAAO,MAAM,YAAY,mCAA0E,CAAC;AAEpG,eAAO,MAAM,KAAK,mCAEjB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,8BAA8B,CAAC"}
+{"version":3,"file":"ToolbarTop.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/ToolbarTop/ToolbarTop.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA,wBAWkB;AAElB,eAAO,MAAM,OAAO,mCAA4D,CAAC;AAEjF,eAAO,MAAM,iBAAiB,mCAE7B,CAAC;AAEF,eAAO,MAAM,uBAAuB,mCAOnC,CAAC;AAEF,eAAO,MAAM,qBAAqB,mCAEjC,CAAC;AAEF,eAAO,MAAM,mBAAmB,mCAQ/B,CAAC;AAEF,eAAO,MAAM,oBAAoB,mCAahC,CAAC;AAEF,eAAO,MAAM,wBAAwB,mCAYpC,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,UAAU,mCAAuE,CAAC;AAE/F,eAAO,MAAM,YAAY,mCAA0E,CAAC;AAEpG,eAAO,MAAM,KAAK,mCAEjB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,8BAA8B,CAAC"}

package/dist/ui/ToolbarTop/ToolbarTop.stories.js

@@ -1,6 +1,5 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { router } from 'expo-router';
-import { Typography } from '../../core';
 import { ButtonIcon } from '../Button/ButtonIcon';
 import { ToolbarTop } from './ToolbarTop';
 import { useStyles } from './ToolbarTop.styles';
@@ -21,7 +20,11 @@ export const AvecAvatarSansActions = () => (_jsx(ToolbarTop, { title: "Titre", s
 export const AvecAvatarEtActions = () => (_jsx(ToolbarTop, { title: "Titre", sousTitre: "Sous-titre", onNavigate: console.log, AvatarProps: { src: 'https://picsum.photos/100/200' }, actions: _jsx(ButtonIcon, { variant: "tertiary", size: "lg", iconSize: "md", icon: 'Plus', onPress: console.log }) }));
 export const AvecPlusieursActions = () => (_jsx(ToolbarTop, { title: "Titre", sousTitre: "Sous-titre", onNavigate: console.log, AvatarProps: { src: 'https://picsum.photos/100/200' }, actions: _jsxs(_Fragment, { children: [_jsx(ButtonIcon, { variant: "tertiary", size: "lg", iconSize: "md", icon: 'Plus', onPress: console.log }), _jsx(ButtonIcon, { variant: "tertiary", size: "lg", iconSize: "md", icon: 'Download', onPress: console.log })] }) }));
 export const AvecTitreEtSansSousTitre = () => (_jsx(ToolbarTop, { title: "Titre", onNavigate: console.log, AvatarProps: { src: 'https://picsum.photos/100/200' }, actions: _jsxs(_Fragment, { children: [_jsx(ButtonIcon, { variant: "tertiary", size: "lg", iconSize: "md", icon: 'Plus', onPress: console.log }), _jsx(ButtonIcon, { variant: "tertiary", size: "lg", iconSize: "md", icon: 'Download', onPress: console.log })] }) }));
-export const AvecBorder = () => (_jsxs(_Fragment, { children: [_jsx(Typography, { children: "En r\u00E8gle g\u00E9n\u00E9ral, on applique la propri\u00E9t\u00E9 `withBorder` sur la ToolbarTop pour ajouter une bordure seulement quand on a scroll dans la page. Si on retourne en haut de la page, la bordure dispara\u00EEt." }), _jsx(ToolbarTop, { title: "Titre", sousTitre: "Sous-titre", withBorder: true })] }));
+/**
+ * En règle générale, `withBorder` est appliqué dynamiquement au scroll :
+ * la bordure apparaît quand on a scrollé et disparaît en haut de la page.
+ */
+export const AvecBorder = () => _jsx(ToolbarTop, { title: "Titre", sousTitre: "Sous-titre", withBorder: true });
 export const CompactLarge = () => _jsx(ToolbarTop, { title: "Titre compact large", variant: "compactLarge" });
 export const Large = () => (_jsx(ToolbarTop, { title: "Titre large", variant: "large", onNavigate: console.log, sousTitre: "Sous-titre" }));
 export * as Sources from './ToolbarTop.stories.sources';

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

@@ -21,4 +21,5 @@ export declare const storySources: {
     readonly Large: () => string;
 };
 export type StorySourceName = keyof typeof storySources;
+export declare const storyDescriptions: Partial<Record<StorySourceName, string>>;
 //# sourceMappingURL=ToolbarTop.stories.sources.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"ToolbarTop.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/ToolbarTop/ToolbarTop.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,cAAgG,CAAC;AAErH,eAAO,MAAM,iBAAiB,cAAmJ,CAAC;AAElL,eAAO,MAAM,uBAAuB,cAAsR,CAAC;AAE3T,eAAO,MAAM,qBAAqB,cAA6K,CAAC;AAEhN,eAAO,MAAM,mBAAmB,cAA8U,CAAC;AAE/W,eAAO,MAAM,oBAAoB,cAAqe,CAAC;AAEvgB,eAAO,MAAM,wBAAwB,cAA2c,CAAC;AAEjf,eAAO,MAAM,UAAU,cAA8X,CAAC;AAEtZ,eAAO,MAAM,YAAY,cAAmH,CAAC;AAE7I,eAAO,MAAM,KAAK,cAAuJ,CAAC;AAE1K,eAAO,MAAM,YAAY;;;;;;;;;;;CAWf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}
+{"version":3,"file":"ToolbarTop.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/ToolbarTop/ToolbarTop.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,cAAgG,CAAC;AAErH,eAAO,MAAM,iBAAiB,cAAmJ,CAAC;AAElL,eAAO,MAAM,uBAAuB,cAAsR,CAAC;AAE3T,eAAO,MAAM,qBAAqB,cAA6K,CAAC;AAEhN,eAAO,MAAM,mBAAmB,cAA8U,CAAC;AAE/W,eAAO,MAAM,oBAAoB,cAAqe,CAAC;AAEvgB,eAAO,MAAM,wBAAwB,cAA2c,CAAC;AAEjf,eAAO,MAAM,UAAU,cAA8G,CAAC;AAEtI,eAAO,MAAM,YAAY,cAAmH,CAAC;AAE7I,eAAO,MAAM,KAAK,cAAuJ,CAAC;AAE1K,eAAO,MAAM,YAAY;;;;;;;;;;;CAWf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC;AAExD,eAAO,MAAM,iBAAiB,EAAE,OAAO,CAAC,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,CAEtE,CAAC"}

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

@@ -7,7 +7,7 @@ export const AvecAvatarSansActions = () => "export const AvecAvatarSansActions =
 export const AvecAvatarEtActions = () => "export const AvecAvatarEtActions = () => (\n  <ToolbarTop\n    title=\"Titre\"\n    sousTitre=\"Sous-titre\"\n    onNavigate={console.log}\n    AvatarProps={{ src: 'https://picsum.photos/100/200' }}\n    actions={<ButtonIcon variant=\"tertiary\" size=\"lg\" iconSize=\"md\" icon={'Plus'} onPress={console.log} />}\n  />\n);";
 export const AvecPlusieursActions = () => "export const AvecPlusieursActions = () => (\n  <ToolbarTop\n    title=\"Titre\"\n    sousTitre=\"Sous-titre\"\n    onNavigate={console.log}\n    AvatarProps={{ src: 'https://picsum.photos/100/200' }}\n    actions={\n      <>\n        <ButtonIcon variant=\"tertiary\" size=\"lg\" iconSize=\"md\" icon={'Plus'} onPress={console.log} />\n        <ButtonIcon variant=\"tertiary\" size=\"lg\" iconSize=\"md\" icon={'Download'} onPress={console.log} />\n      </>\n    }\n  />\n);";
 export const AvecTitreEtSansSousTitre = () => "export const AvecTitreEtSansSousTitre = () => (\n  <ToolbarTop\n    title=\"Titre\"\n    onNavigate={console.log}\n    AvatarProps={{ src: 'https://picsum.photos/100/200' }}\n    actions={\n      <>\n        <ButtonIcon variant=\"tertiary\" size=\"lg\" iconSize=\"md\" icon={'Plus'} onPress={console.log} />\n        <ButtonIcon variant=\"tertiary\" size=\"lg\" iconSize=\"md\" icon={'Download'} onPress={console.log} />\n      </>\n    }\n  />\n);";
-export const AvecBorder = () => "export const AvecBorder = () => (\n  <>\n    <Typography>\n      En règle général, on applique la propriété `withBorder` sur la ToolbarTop pour ajouter une bordure seulement quand\n      on a scroll dans la page. Si on retourne en haut de la page, la bordure disparaît.\n    </Typography>\n    <ToolbarTop title=\"Titre\" sousTitre=\"Sous-titre\" withBorder />\n  </>\n);";
+export const AvecBorder = () => "export const AvecBorder = () => <ToolbarTop title=\"Titre\" sousTitre=\"Sous-titre\" withBorder />;";
 export const CompactLarge = () => "export const CompactLarge = () => <ToolbarTop title=\"Titre compact large\" variant=\"compactLarge\" />;";
 export const Large = () => "export const Large = () => (\n  <ToolbarTop title=\"Titre large\" variant=\"large\" onNavigate={console.log} sousTitre=\"Sous-titre\" />\n);";
 export const storySources = {
@@ -22,3 +22,6 @@ export const storySources = {
     CompactLarge,
     Large,
 };
+export const storyDescriptions = {
+    AvecBorder: "En règle générale, `withBorder` est appliqué dynamiquement au scroll :\nla bordure apparaît quand on a scrollé et disparaît en haut de la page.",
+};

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

@@ -4,16 +4,16 @@ export declare const useStyles: () => {
         display: "flex";
         flexDirection: "row";
         alignItems: "center";
-        paddingLeft: import("@alveole/theme").Spacing;
-        paddingRight: import("@alveole/theme").Spacing;
-        paddingTop: import("@alveole/theme").Spacing;
-        paddingBottom: import("@alveole/theme").Spacing;
+        paddingLeft: string | number;
+        paddingRight: string | number;
+        paddingTop: string | number;
+        paddingBottom: string | number;
     };
     compactLargetoolbarContainer: {
-        paddingTop: import("@alveole/theme").Spacing;
-        paddingBottom: import("@alveole/theme").Spacing;
-        paddingLeft: import("@alveole/theme").Spacing;
-        paddingRight: import("@alveole/theme").Spacing;
+        paddingTop: string | number;
+        paddingBottom: string | number;
+        paddingLeft: string | number;
+        paddingRight: string | number;
     };
     largeToolbarContainer: {
         paddingTop: number;
@@ -34,13 +34,13 @@ export declare const useStyles: () => {
     toolbarNavigation: {
         display: "flex";
         justifyContent: "center";
-        gap: import("@alveole/theme").Spacing;
+        gap: string | number;
     };
     toolbarInformation: {
         display: "flex";
         flexDirection: "row";
         alignItems: "center";
-        gap: import("@alveole/theme").Spacing;
+        gap: string | number;
         flex: number;
     };
     toolbarInformationTitle: {

package/dist/ui/index.d.ts

@@ -9,14 +9,17 @@ export * from './Button';
 export * from './Card';
 export * from './Checkbox';
 export * from './Counter';
+export * from './DateInput';
 export * from './Divider';
 export * from './DocumentViewer';
 export * from './DragAndDropFile';
+export * from './DurationInput';
 export * from './EmailField';
 export * from './EmailInput';
 export * from './EmptyState';
 export * from './FileField';
 export * from './FormControl';
+export * from './Grid';
 export * from './Header';
 export * from './InputButtonAdornment';
 export * from './InputHeading';
@@ -44,6 +47,7 @@ export * from './TextareaField';
 export * from './TextareaInput';
 export * from './TextField';
 export * from './TextInputArray';
+export * from './TimeInput';
 export * from './Toast';
 export * from './ToolbarBottomNav';
 export * from './ToolbarTop';

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ui/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,uBAAuB,CAAC;AACtC,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,kBAAkB,CAAC;AACjC,cAAc,mBAAmB,CAAC;AAClC,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,wBAAwB,CAAC;AACvC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,kBAAkB,CAAC;AACjC,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC;AACjC,cAAc,SAAS,CAAC;AACxB,cAAc,oBAAoB,CAAC;AACnC,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ui/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,uBAAuB,CAAC;AACtC,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,kBAAkB,CAAC;AACjC,cAAc,mBAAmB,CAAC;AAClC,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC;AACzB,cAAc,wBAAwB,CAAC;AACvC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,kBAAkB,CAAC;AACjC,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC;AACjC,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,oBAAoB,CAAC;AACnC,cAAc,cAAc,CAAC"}

package/dist/ui/index.js

@@ -9,14 +9,17 @@ export * from './Button';
 export * from './Card';
 export * from './Checkbox';
 export * from './Counter';
+export * from './DateInput';
 export * from './Divider';
 export * from './DocumentViewer';
 export * from './DragAndDropFile';
+export * from './DurationInput';
 export * from './EmailField';
 export * from './EmailInput';
 export * from './EmptyState';
 export * from './FileField';
 export * from './FormControl';
+export * from './Grid';
 export * from './Header';
 export * from './InputButtonAdornment';
 export * from './InputHeading';
@@ -44,6 +47,7 @@ export * from './TextareaField';
 export * from './TextareaInput';
 export * from './TextField';
 export * from './TextInputArray';
+export * from './TimeInput';
 export * from './Toast';
 export * from './ToolbarBottomNav';
 export * from './ToolbarTop';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alveole/components",
-  "version": "1.0.1",
+  "version": "1.1.0",
   "description": "Shared UI components.",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -33,9 +33,10 @@
   "devDependencies": {
     "@alveole/eslint-config": "file:../eslint-config",
     "@lucide/lab": "0.1.2",
+    "@react-native-community/datetimepicker": "9.1.0",
     "@react-native-picker/picker": "2.11.4",
     "@react-native/jest-preset": "0.85.3",
-    "@shopify/flash-list": "2.3.2",
+    "@shopify/flash-list": "2.0.2",
     "@tamagui/config": "1.144.4",
     "@tamagui/core": "1.144.4",
     "@tamagui/toast": "1.144.4",
@@ -43,10 +44,11 @@
     "@types/react-syntax-highlighter": "15.5.13",
     "babel-preset-expo": "56.0.17",
     "eslint": "9.39.4",
-    "expo": "56.0.16",
-    "expo-asset": "56.0.20",
+    "expo": "56.0.17",
+    "expo-asset": "56.0.21",
     "expo-document-picker": "56.0.4",
-    "expo-router": "56.2.15",
+    "expo-router": "56.2.16",
+    "expo-modules-core": "56.0.22",
     "jest": "29.7.0",
     "jest-expo": "56.0.5",
     "lucide-react-native": "1.23.0",
@@ -55,7 +57,7 @@
     "react-dom": "19.2.3",
     "react-native": "0.85.3",
     "react-native-code-highlighter": "1.3.0",
-    "react-native-keyboard-controller": "1.22.0",
+    "react-native-keyboard-controller": "1.21.6",
     "react-native-otp-entry": "1.8.6",
     "react-select": "5.10.2",
     "react-syntax-highlighter": "16.1.1",
@@ -63,12 +65,15 @@
     "test-renderer": "1.2.0"
   },
   "dependencies": {
+    "react-markdown": "8.0.7",
+    "remark-gfm": "3.0.1",
     "zod": "4.4.3"
   },
   "peerDependencies": {
     "@alveole/core": "*",
     "@alveole/theme": "*",
     "@lottiefiles/dotlottie-react": "*",
+    "@react-native-community/datetimepicker": "*",
     "@lucide/lab": "*",
     "@react-native-picker/picker": ">=2",
     "@shopify/flash-list": ">=2",
@@ -96,6 +101,7 @@
     "lottie-react-native": "*",
     "lucide-react-native": ">=0.570.0",
     "pdfjs-dist": "^4.0.0 || ^5.0.0 || ^6.0.0",
+    "date-fns": "*",
     "react": "*",
     "react-native": "*",
     "react-native-code-highlighter": "*",