@alveole/components 0.36.2 → 0.37.3

package/dist/ui/Toast/Toast.js

@@ -0,0 +1,48 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Toast as TamaguiToast, useToastController, useToastState } from '@tamagui/toast';
+import React from 'react';
+import { Pressable } from 'react-native';
+import { Box, Typography } from '../../core';
+import { LucideIcon } from '../LucideIcon';
+import { useStyles } from './Toast.styles';
+export function Toast() {
+    const toast = useToastState();
+    const controller = useToastController();
+    const styles = useStyles();
+    const variant = toast?.customData?.variant ?? 'default';
+    const icon = toast?.customData?.icon;
+    const iconColor = React.useMemo(() => {
+        switch (variant) {
+            case 'default':
+                return styles.iconDefault.color;
+            case 'success':
+                return styles.iconSuccess.color;
+            case 'error':
+                return styles.iconError.color;
+            case 'info':
+                return styles.iconInfo.color;
+            default:
+                ((_) => { })(variant);
+        }
+    }, [styles, variant]);
+    const iconName = React.useMemo(() => {
+        if (icon)
+            return icon;
+        switch (variant) {
+            case 'default':
+                return null;
+            case 'success':
+                return 'BadgeCheck';
+            case 'error':
+                return 'BadgeX';
+            case 'info':
+                return 'BadgeInfo';
+            default:
+                ((_) => { })(variant);
+        }
+        return null;
+    }, [icon, variant]);
+    if (!toast)
+        return null;
+    return (_jsxs(TamaguiToast, { style: styles.container, duration: toast.duration, enterStyle: { opacity: 0, y: 10, scale: 0.98 }, exitStyle: { opacity: 0, y: 10, scale: 0.98 }, viewportName: "app-toasts", children: [iconName && (_jsx(Box, { style: styles.icon, children: _jsx(LucideIcon, { color: iconColor, name: iconName, size: "sm" }) })), _jsxs(Box, { style: styles.contenu, children: [_jsxs(Box, { style: styles.titleContainer, children: [_jsx(Typography, { style: styles.title, children: toast.title }), _jsx(Pressable, { onPress: () => controller.hide(), children: _jsx(LucideIcon, { name: "X", size: "md" }) })] }), toast.message && (_jsx(Box, { children: _jsx(Typography, { style: styles.message, children: toast.message }) }))] })] }, toast.id));
+}

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

@@ -0,0 +1,94 @@
+import { Toast } from './Toast';
+declare const _default: {
+    title: string;
+    tags: "ui"[];
+    experimental: false;
+    figmaURL: string;
+    description: string;
+    component: typeof Toast;
+    styleFn: () => {
+        container: {
+            backgroundColor: "#FFFFFF";
+            width: number;
+            padding: import("@alveole/theme").Spacing;
+            borderRadius: import("@alveole/theme/dist/constants/Radius").Radius;
+            display: "flex";
+            flexDirection: "row";
+            gap: import("@alveole/theme").Spacing;
+            alignItems: "flex-start";
+        } | {
+            shadowColor: import("@alveole/theme").Color;
+            shadowOffset: {
+                width: number;
+                height: number;
+            };
+            shadowOpacity: number;
+            shadowRadius: number;
+            elevation: number;
+            backgroundColor: "#FFFFFF";
+            width: number;
+            padding: import("@alveole/theme").Spacing;
+            borderRadius: import("@alveole/theme/dist/constants/Radius").Radius;
+            display: "flex";
+            flexDirection: "row";
+            gap: import("@alveole/theme").Spacing;
+            alignItems: "flex-start";
+        } | {
+            boxShadow: string;
+            backgroundColor: "#FFFFFF";
+            width: number;
+            padding: import("@alveole/theme").Spacing;
+            borderRadius: import("@alveole/theme/dist/constants/Radius").Radius;
+            display: "flex";
+            flexDirection: "row";
+            gap: import("@alveole/theme").Spacing;
+            alignItems: "flex-start";
+        };
+        contenu: {
+            display: "flex";
+            flex: number;
+            flexDirection: "column";
+            gap: import("@alveole/theme").Spacing;
+        };
+        titleContainer: {
+            display: "flex";
+            flexDirection: "row";
+            alignItems: "center";
+            justifyContent: "space-between";
+            minHeight: import("@alveole/theme").Spacing;
+        };
+        title: {
+            color: "#151617";
+            fontFamily: "Barlow-Light" | "Barlow-Regular" | "Barlow-Medium" | "Barlow-SemiBold" | "Barlow-Bold" | "Inter-Light" | "Inter-Regular" | "Inter-Medium" | "Inter-SemiBold" | "Inter-Bold";
+            fontSize: 14;
+            lineHeight: 20;
+            letterSpacing: 0;
+        };
+        icon: {
+            paddingTop: import("@alveole/theme").Spacing;
+        };
+        iconDefault: {
+            color: "#373A3F";
+        };
+        iconInfo: {
+            color: "#373A3F";
+        };
+        iconSuccess: {
+            color: "#1B7440";
+        };
+        iconError: {
+            color: "#C62416";
+        };
+        message: {
+            color: "#373A3F";
+            fontFamily: "Barlow-Light" | "Barlow-Regular" | "Barlow-Medium" | "Barlow-SemiBold" | "Barlow-Bold" | "Inter-Light" | "Inter-Regular" | "Inter-Medium" | "Inter-SemiBold" | "Inter-Bold";
+            fontSize: 14;
+            lineHeight: 20;
+            letterSpacing: 0;
+        };
+    };
+};
+export default _default;
+export declare const All: () => import("react").JSX.Element;
+export * as Sources from './Toast.stories.sources';
+//# sourceMappingURL=Toast.stories.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Toast.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Toast/Toast.stories.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKhC,wBAQkB;AAElB,eAAO,MAAM,GAAG,mCAwDf,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,yBAAyB,CAAC"}

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

@@ -0,0 +1,51 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from '@alveole/components';
+import { Box, Highlight, Typography } from '../../core';
+import { Toast } from './Toast';
+import { useStyles } from './Toast.styles';
+import { defaultDuration } from './ToastBridge';
+import { useToast } from './index';
+export default {
+    title: 'Toast',
+    tags: ['ui'],
+    experimental: false,
+    figmaURL: 'https://www.figma.com/design/xJz8Z6vfrnZPKTtRbuT2W8/Alveole---Composants?node-id=2084-1372',
+    description: `Toaster Tamagui. Contient le provider global et le hook useToast. Par défaut un toast reste affiché pendant ${defaultDuration / 1000} secondes`,
+    component: Toast,
+    styleFn: useStyles,
+};
+export const All = () => {
+    const toast = useToast();
+    defaultDuration;
+    const defaultToast = () => toast.present('Default', 'Message');
+    const successToast = () => toast.present('Success', 'Message', { variant: 'success' });
+    const errorToast = () => toast.present('Error', 'Message beaucoup plus long', { variant: 'error' });
+    const infoToast = () => toast.present('Information', 'Message', { variant: 'info' });
+    const infoToastMultiLine = () => toast.present('Information', 'Message beaucoup plus long avec retour à la ligne.\nDeuxième ligne', {
+        variant: 'info',
+    });
+    const withoutMessageToast = () => toast.present('Sans message');
+    const withoutMessageToastError = () => toast.present('Sans message', undefined, { variant: 'error' });
+    const withCustomIcon = () => toast.present('Avec icon custom', undefined, { icon: 'Worm' });
+    return (_jsxs(Box, { display: "flex", flexDirection: "column", gap: 8, children: [_jsxs(Box, { display: "flex", flexDirection: "row", gap: 4, flexWrap: "wrap", children: [_jsx(Button, { title: "Default toast", variant: "secondary", onPress: defaultToast }), _jsx(Button, { title: "Success toast", variant: "secondary", onPress: successToast }), _jsx(Button, { title: "Error toast", variant: "secondary", onPress: errorToast }), _jsx(Button, { title: "Info toast", variant: "secondary", onPress: infoToast }), _jsx(Button, { title: "Message long", variant: "secondary", onPress: infoToastMultiLine }), _jsx(Button, { title: "Without message toast", variant: "secondary", onPress: withoutMessageToast }), _jsx(Button, { title: "Without message toast error", variant: "secondary", onPress: withoutMessageToastError }), _jsx(Button, { title: "WithCustomIcon", variant: "secondary", onPress: withCustomIcon })] }), _jsxs(Box, { display: "flex", flexDirection: "column", gap: 4, children: [_jsx(Typography, { children: `Le fichier _layout.tsx doit inclure la balise <Toasts> pour fonctionner` }), _jsx(Highlight, { language: "tsx", children: `
+            import { Toasts } from '@alveole/components';
+            import { ThemeProvider } from '@alveole/theme';
+            import { Stack } from 'expo-router';
+            import React from 'react';
+            import { TamaguiProvider } from 'tamagui';
+            import { tamaguiConfig } from '../tamagui.config';
+
+            export default function RootLayout() {
+              return (
+                <TamaguiProvider config={tamaguiConfig} defaultTheme="light">
+                  <ThemeProvider loader={false}>
+                    <Toasts>
+                      <Stack screenOptions={{ headerShown: false }} />
+                    </Toasts>
+                  </ThemeProvider>
+                </TamaguiProvider>
+              );
+            }
+          ` })] })] }));
+};
+export * as Sources from './Toast.stories.sources';

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"Toast.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/Toast/Toast.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,GAAG,cAA+zF,CAAC;AAEh1F,eAAO,MAAM,YAAY;;CAEf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}

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

@@ -0,0 +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  defaultDuration;\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 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=\"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 storySources = {
+    All,
+};

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

@@ -0,0 +1,82 @@
+export declare const useStyles: () => {
+    container: {
+        backgroundColor: "#FFFFFF";
+        width: number;
+        padding: import("@alveole/theme").Spacing;
+        borderRadius: import("@alveole/theme/dist/constants/Radius").Radius;
+        display: "flex";
+        flexDirection: "row";
+        gap: import("@alveole/theme").Spacing;
+        alignItems: "flex-start";
+    } | {
+        shadowColor: import("@alveole/theme").Color;
+        shadowOffset: {
+            width: number;
+            height: number;
+        };
+        shadowOpacity: number;
+        shadowRadius: number;
+        elevation: number;
+        backgroundColor: "#FFFFFF";
+        width: number;
+        padding: import("@alveole/theme").Spacing;
+        borderRadius: import("@alveole/theme/dist/constants/Radius").Radius;
+        display: "flex";
+        flexDirection: "row";
+        gap: import("@alveole/theme").Spacing;
+        alignItems: "flex-start";
+    } | {
+        boxShadow: string;
+        backgroundColor: "#FFFFFF";
+        width: number;
+        padding: import("@alveole/theme").Spacing;
+        borderRadius: import("@alveole/theme/dist/constants/Radius").Radius;
+        display: "flex";
+        flexDirection: "row";
+        gap: import("@alveole/theme").Spacing;
+        alignItems: "flex-start";
+    };
+    contenu: {
+        display: "flex";
+        flex: number;
+        flexDirection: "column";
+        gap: import("@alveole/theme").Spacing;
+    };
+    titleContainer: {
+        display: "flex";
+        flexDirection: "row";
+        alignItems: "center";
+        justifyContent: "space-between";
+        minHeight: import("@alveole/theme").Spacing;
+    };
+    title: {
+        color: "#151617";
+        fontFamily: "Barlow-Light" | "Barlow-Regular" | "Barlow-Medium" | "Barlow-SemiBold" | "Barlow-Bold" | "Inter-Light" | "Inter-Regular" | "Inter-Medium" | "Inter-SemiBold" | "Inter-Bold";
+        fontSize: 14;
+        lineHeight: 20;
+        letterSpacing: 0;
+    };
+    icon: {
+        paddingTop: import("@alveole/theme").Spacing;
+    };
+    iconDefault: {
+        color: "#373A3F";
+    };
+    iconInfo: {
+        color: "#373A3F";
+    };
+    iconSuccess: {
+        color: "#1B7440";
+    };
+    iconError: {
+        color: "#C62416";
+    };
+    message: {
+        color: "#373A3F";
+        fontFamily: "Barlow-Light" | "Barlow-Regular" | "Barlow-Medium" | "Barlow-SemiBold" | "Barlow-Bold" | "Inter-Light" | "Inter-Regular" | "Inter-Medium" | "Inter-SemiBold" | "Inter-Bold";
+        fontSize: 14;
+        lineHeight: 20;
+        letterSpacing: 0;
+    };
+};
+//# sourceMappingURL=Toast.styles.d.ts.map

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

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

package/dist/ui/Toast/Toast.styles.js

@@ -0,0 +1,54 @@
+import { makeStyles } from '@alveole/theme';
+export const useStyles = makeStyles(({ text, color, radius, spacing, shadows }) => ({
+    // Container
+    container: {
+        backgroundColor: '#FFFFFF',
+        width: 384,
+        padding: spacing('100'),
+        borderRadius: radius('sm'),
+        display: 'flex',
+        flexDirection: 'row',
+        gap: spacing('050'),
+        alignItems: 'flex-start',
+        ...shadows(3),
+    },
+    contenu: {
+        display: 'flex',
+        flex: 1,
+        flexDirection: 'column',
+        gap: spacing('050'),
+    },
+    titleContainer: {
+        display: 'flex',
+        flexDirection: 'row',
+        alignItems: 'center',
+        justifyContent: 'space-between',
+        minHeight: spacing('150'),
+    },
+    // Titre
+    title: {
+        ...text['Corps de texte'].SM.Bold,
+        color: color.text['title-grey'],
+    },
+    // Icon
+    icon: {
+        paddingTop: spacing('025'),
+    },
+    iconDefault: {
+        color: color.text['default-grey'],
+    },
+    iconInfo: {
+        color: color.text['default-grey'],
+    },
+    iconSuccess: {
+        color: color.text['default-success'],
+    },
+    iconError: {
+        color: color.text['default-error'],
+    },
+    // Message
+    message: {
+        ...text['Corps de texte'].SM.Regular,
+        color: color.text['default-grey'],
+    },
+}));

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

@@ -0,0 +1,11 @@
+import React from 'react';
+import { type ToastAPIOptions } from './ToastContext';
+export type ToastBridgeProps = React.PropsWithChildren<object>;
+export declare const defaultDuration = 8000;
+export declare function ToastBridge(props: ToastBridgeProps): React.JSX.Element;
+declare module '@tamagui/toast' {
+    interface CustomData extends ToastAPIOptions {
+        presentAt?: number;
+    }
+}
+//# sourceMappingURL=ToastBridge.d.ts.map

package/dist/ui/Toast/ToastBridge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToastBridge.d.ts","sourceRoot":"","sources":["../../../src/ui/Toast/ToastBridge.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAA+B,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEnF,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC;AAE/D,eAAO,MAAM,eAAe,OAAO,CAAC;AAEpC,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,qBAkBlD;AAED,OAAO,QAAQ,gBAAgB,CAAC;IAC9B,UAAU,UAAW,SAAQ,eAAe;QAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB;CACF"}

package/dist/ui/Toast/ToastBridge.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useToastController } from '@tamagui/toast';
+import React from 'react';
+import { ToastContext } from './ToastContext';
+export const defaultDuration = 8000;
+export function ToastBridge(props) {
+    const { children } = props;
+    const controller = useToastController();
+    const api = React.useMemo(() => ({
+        present: (title, message, opts) => {
+            controller.show(title, {
+                message,
+                duration: opts?.duration ?? defaultDuration,
+                customData: { ...opts, presentAt: Date.now() },
+            });
+        },
+    }), [controller]);
+    return _jsx(ToastContext.Provider, { value: api, children: children });
+}

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

@@ -0,0 +1,12 @@
+import React from 'react';
+import { LucideIconProps } from '../LucideIcon';
+export type ToastAPIOptions = {
+    icon?: LucideIconProps['name'];
+    duration?: number;
+    variant?: 'default' | 'success' | 'error' | 'info';
+};
+export type ToastAPI = {
+    present: (title: string, message?: string, opts?: ToastAPIOptions) => void;
+};
+export declare const ToastContext: React.Context<ToastAPI | null>;
+//# sourceMappingURL=ToastContext.d.ts.map

package/dist/ui/Toast/ToastContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToastContext.d.ts","sourceRoot":"","sources":["../../../src/ui/Toast/ToastContext.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAEhD,MAAM,MAAM,eAAe,GAAG;IAC5B,IAAI,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAC/B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;CACpD,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG;IACrB,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,eAAe,KAAK,IAAI,CAAC;CAC5E,CAAC;AAEF,eAAO,MAAM,YAAY,gCAA6C,CAAC"}

package/dist/ui/Toast/ToastContext.js

@@ -0,0 +1,2 @@
+import React from 'react';
+export const ToastContext = React.createContext(null);

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

@@ -0,0 +1,5 @@
+import React from 'react';
+export type ToastsProps = React.PropsWithChildren<object>;
+export declare function Toasts(props: ToastsProps): React.JSX.Element;
+export declare function useToast(): import("./ToastContext").ToastAPI;
+//# sourceMappingURL=Toasts.d.ts.map

package/dist/ui/Toast/Toasts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toasts.d.ts","sourceRoot":"","sources":["../../../src/ui/Toast/Toasts.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC;AAE1D,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,qBAYxC;AAED,wBAAgB,QAAQ,sCAIvB"}

package/dist/ui/Toast/Toasts.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ToastProvider, ToastViewport } from '@tamagui/toast';
+import React from 'react';
+import { Toast } from './Toast';
+import { ToastBridge } from './ToastBridge';
+import { ToastContext } from './ToastContext';
+export function Toasts(props) {
+    const { children } = props;
+    return (_jsx(ToastProvider, { swipeDirection: "horizontal", native: ['ios', 'android'], children: _jsxs(ToastBridge, { children: [_jsx(Toast, {}), _jsx(ToastViewport, { name: "app-toasts", multipleToasts: true, bottom: 32, left: 0, right: 0 }), children] }) }));
+}
+export function useToast() {
+    const ctx = React.useContext(ToastContext);
+    if (!ctx)
+        throw new Error('useToast must be used inside <Toasts> provider');
+    return ctx;
+}

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

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

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

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

package/dist/ui/Toast/index.js

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

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

@@ -2,5 +2,5 @@ import { Tabs as ExpoTabs } from 'expo-router';
 import React from 'react';
 export type ToolbarBottomNavProps = React.ComponentProps<typeof ExpoTabs>;
 export declare const TabItemHeight = 60;
-export declare const ToolbarBottomNav: (props: ToolbarBottomNavProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ToolbarBottomNav: (props: ToolbarBottomNavProps) => React.JSX.Element;
 //# sourceMappingURL=ToolbarBottomNav.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"ToolbarBottomNav.d.ts","sourceRoot":"","sources":["../../../src/ui/ToolbarBottomNav/ToolbarBottomNav.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,IAAI,QAAQ,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,CAAC;AAC1E,eAAO,MAAM,aAAa,KAAK,CAAC;AAEhC,eAAO,MAAM,gBAAgB,GAAI,OAAO,qBAAqB,4CAuB5D,CAAC"}
+{"version":3,"file":"ToolbarBottomNav.d.ts","sourceRoot":"","sources":["../../../src/ui/ToolbarBottomNav/ToolbarBottomNav.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,IAAI,QAAQ,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,MAAM,MAAM,qBAAqB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,CAAC;AAC1E,eAAO,MAAM,aAAa,KAAK,CAAC;AAEhC,eAAO,MAAM,gBAAgB,GAAI,OAAO,qBAAqB,sBAuB5D,CAAC"}

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

@@ -1,6 +1,6 @@
 declare const _default: {
     title: string;
-    tags: "Kit"[];
+    tags: "ui"[];
     experimental: false;
     description: string;
     figmaURL: string;

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

@@ -2,7 +2,7 @@ import { ToolbarBottomNav } from './index';
 import { useStyles } from './ToolbarBottomNav.styles';
 export default {
     title: 'ToolbarBottomNav',
-    tags: ['Kit'],
+    tags: ['ui'],
     experimental: false,
     description: 'Navigation bottom de type TabsExpo. A utiliser dans les _layout.',
     figmaURL: 'https://www.figma.com/design/xJz8Z6vfrnZPKTtRbuT2W8/Alveole---Composants?node-id=1880-852&t=baZKFA9BpkeQGeZm-4',

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

@@ -5,5 +5,5 @@ export type ToolbarBottomNavIconProps = {
 };
 export declare const toolbarBottomNavIcon: (name: IconProps["name"]) => (props: {
     color: Color;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react").JSX.Element;
 //# sourceMappingURL=ToolbarBottomNavIcon.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"ToolbarBottomNavIcon.d.ts","sourceRoot":"","sources":["../../../src/ui/ToolbarBottomNav/ToolbarBottomNavIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AACvC,OAAO,EAAE,SAAS,EAAc,MAAM,eAAe,CAAC;AAEtD,MAAM,MAAM,yBAAyB,GAAG;IAAE,KAAK,EAAE,KAAK,CAAA;CAAE,CAAC;AACzD,eAAO,MAAM,oBAAoB,GAAI,MAAM,SAAS,CAAC,MAAM,CAAC,MAC5B,OAAO;IAAE,KAAK,EAAE,KAAK,CAAA;CAAE,4CAEpD,CAAC"}
+{"version":3,"file":"ToolbarBottomNavIcon.d.ts","sourceRoot":"","sources":["../../../src/ui/ToolbarBottomNav/ToolbarBottomNavIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AACvC,OAAO,EAAE,SAAS,EAAc,MAAM,eAAe,CAAC;AAEtD,MAAM,MAAM,yBAAyB,GAAG;IAAE,KAAK,EAAE,KAAK,CAAA;CAAE,CAAC;AACzD,eAAO,MAAM,oBAAoB,GAAI,MAAM,SAAS,CAAC,MAAM,CAAC,MAC5B,OAAO;IAAE,KAAK,EAAE,KAAK,CAAA;CAAE,gCAEpD,CAAC"}

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

@@ -15,5 +15,5 @@ export type ToolbarTopProps = BoxProps & {
     actions?: React.ReactNode;
     typographyStyle?: React.CSSProperties;
 };
-export declare const ToolbarTop: (props: ToolbarTopProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ToolbarTop: (props: ToolbarTopProps) => React.JSX.Element;
 //# sourceMappingURL=ToolbarTop.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"ToolbarTop.d.ts","sourceRoot":"","sources":["../../../src/ui/ToolbarTop/ToolbarTop.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAO,QAAQ,EAAc,MAAM,YAAY,CAAC;AACvD,OAAO,EAAU,WAAW,EAAE,MAAM,WAAW,CAAC;AAEhD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAG1C,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG;IACvC,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,cAAc,CAAC;IAC/C,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC;IACxC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,cAAc,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,WAAW,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IAChC,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,eAAe,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACvC,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,OAAO,eAAe,4CAwGhD,CAAC"}
+{"version":3,"file":"ToolbarTop.d.ts","sourceRoot":"","sources":["../../../src/ui/ToolbarTop/ToolbarTop.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAO,QAAQ,EAAc,MAAM,YAAY,CAAC;AACvD,OAAO,EAAU,WAAW,EAAE,MAAM,WAAW,CAAC;AAEhD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAG1C,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG;IACvC,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,cAAc,CAAC;IAC/C,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC;IACxC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,cAAc,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,WAAW,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IAChC,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,eAAe,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CACvC,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,OAAO,eAAe,sBAwGhD,CAAC"}

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

@@ -1,11 +1,11 @@
 declare const _default: {
     title: string;
-    tags: "Composant"[];
+    tags: "ui"[];
     experimental: false;
     figmaURL: string;
     description: string;
     mobileOnly: true;
-    component: (props: import("./ToolbarTop").ToolbarTopProps) => import("react/jsx-runtime").JSX.Element;
+    component: (props: import("./ToolbarTop").ToolbarTopProps) => import("react").JSX.Element;
     styleFn: () => {
         toolbarContainer: {
             backgroundColor: "white";
@@ -104,15 +104,15 @@ declare const _default: {
     };
 };
 export default _default;
-export declare const Default: () => import("react/jsx-runtime").JSX.Element;
-export declare const AvecRetourArriere: () => import("react/jsx-runtime").JSX.Element;
-export declare const SansAvatarEtAvecActions: () => import("react/jsx-runtime").JSX.Element;
-export declare const AvecAvatarSansActions: () => import("react/jsx-runtime").JSX.Element;
-export declare const AvecAvatarEtActions: () => import("react/jsx-runtime").JSX.Element;
-export declare const AvecPlusieursActions: () => import("react/jsx-runtime").JSX.Element;
-export declare const AvecTitreEtSansSousTitre: () => import("react/jsx-runtime").JSX.Element;
-export declare const AvecBorder: () => import("react/jsx-runtime").JSX.Element;
-export declare const CompactLarge: () => import("react/jsx-runtime").JSX.Element;
-export declare const Large: () => import("react/jsx-runtime").JSX.Element;
+export declare const Default: () => import("react").JSX.Element;
+export declare const AvecRetourArriere: () => import("react").JSX.Element;
+export declare const SansAvatarEtAvecActions: () => import("react").JSX.Element;
+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;
+export declare const AvecBorder: () => import("react").JSX.Element;
+export declare const CompactLarge: () => import("react").JSX.Element;
+export declare const Large: () => import("react").JSX.Element;
 export * as Sources from './ToolbarTop.stories.sources';
 //# sourceMappingURL=ToolbarTop.stories.d.ts.map

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,+CAA4D,CAAC;AAEjF,eAAO,MAAM,iBAAiB,+CAE7B,CAAC;AAEF,eAAO,MAAM,uBAAuB,+CAOnC,CAAC;AAEF,eAAO,MAAM,qBAAqB,+CAEjC,CAAC;AAEF,eAAO,MAAM,mBAAmB,+CAQ/B,CAAC;AAEF,eAAO,MAAM,oBAAoB,+CAahC,CAAC;AAEF,eAAO,MAAM,wBAAwB,+CAYpC,CAAC;AAEF,eAAO,MAAM,UAAU,+CAQtB,CAAC;AAEF,eAAO,MAAM,YAAY,+CAA0E,CAAC;AAEpG,eAAO,MAAM,KAAK,+CAEjB,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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;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"}

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

@@ -6,7 +6,7 @@ import { ToolbarTop } from './ToolbarTop';
 import { useStyles } from './ToolbarTop.styles';
 export default {
     title: 'ToolbarTop',
-    tags: ['Composant'],
+    tags: ['ui'],
     experimental: false,
     figmaURL: 'https://www.figma.com/design/xJz8Z6vfrnZPKTtRbuT2W8/Alveole---Composants?node-id=1749-4674&t=qyctNCnE5tT5rKRk-4',
     description: "La ToolbarTop est un composant de navigation et d'action. A utiliser uniquement sur Mobile. Elle dispose de 3 variantes : default, large et compactLarge.",

package/dist/ui/index.d.ts

@@ -14,8 +14,10 @@ export * from './Popover';
 export * from './ProgressBar';
 export * from './ResourceList';
 export * from './Sidebar';
+export * from './Signature';
 export * from './Tabs';
 export * from './Tag';
+export * from './Toast';
 export * from './ToolbarBottomNav';
 export * from './ToolbarTop';
 //# sourceMappingURL=index.d.ts.map

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,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,oBAAoB,CAAC;AACnC,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ui/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC;AACvB,cAAc,OAAO,CAAC;AACtB,cAAc,SAAS,CAAC;AACxB,cAAc,oBAAoB,CAAC;AACnC,cAAc,cAAc,CAAC"}

package/dist/ui/index.js

@@ -14,7 +14,9 @@ export * from './Popover';
 export * from './ProgressBar';
 export * from './ResourceList';
 export * from './Sidebar';
+export * from './Signature';
 export * from './Tabs';
 export * from './Tag';
+export * from './Toast';
 export * from './ToolbarBottomNav';
 export * from './ToolbarTop';