@alveole/components 0.15.5 → 0.16.1

package/dist/core/Section/Section.d.ts

@@ -0,0 +1,7 @@
+import { BoxProps } from '../../core/Box/Box';
+export type SectionProps = BoxProps & {
+    size?: 'full' | 'md' | 'sm';
+    withPaddingY?: boolean;
+};
+export declare const Section: (props: SectionProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Section.d.ts.map

package/dist/core/Section/Section.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Section.d.ts","sourceRoot":"","sources":["../../../src/core/Section/Section.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAGnD,MAAM,MAAM,YAAY,GAAG,QAAQ,GAAG;IACpC,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,CAAC;IAC5B,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAC;AAEF,eAAO,MAAM,OAAO,GAAI,OAAO,YAAY,4CAwB1C,CAAC"}

package/dist/core/Section/Section.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Box } from '../../core/Box/Box';
+import { useStyles } from './Section.styles';
+export const Section = (props) => {
+    const { style, size, withPaddingY = false, ...boxProps } = props;
+    const styles = useStyles();
+    let sizeContainer = {};
+    sizeContainer = styles.sectionContainerMD;
+    if (size === 'full') {
+        sizeContainer = styles.sectionContainerFull;
+    }
+    if (size === 'md') {
+        sizeContainer = styles.sectionContainerMD;
+    }
+    if (size === 'sm') {
+        sizeContainer = styles.sectionContainerSM;
+    }
+    return (_jsx(Box, { tag: "section", style: [styles.section, style, withPaddingY && styles.sectionWithPaddingY], ...boxProps, children: _jsx(Box, { tag: "section-container", style: [style, styles.sectionContainer, sizeContainer], children: props.children }) }));
+};

package/dist/core/Section/Section.stories.d.ts

@@ -0,0 +1,40 @@
+declare const _default: {
+    title: string;
+    tags: ["Kit"];
+    experimental: true;
+    description: string;
+    component: (props: import("./Section").SectionProps) => import("react/jsx-runtime").JSX.Element;
+    styleFn: () => {
+        section: {
+            display: "flex";
+            flexDirection: "row";
+            gap: import("@alveole/theme").Spacing;
+            justifyContent: "center";
+            paddingLeft: import("@alveole/theme").Spacing;
+            paddingRight: import("@alveole/theme").Spacing;
+        };
+        sectionWithPaddingY: {
+            paddingTop: import("@alveole/theme").Spacing;
+            paddingBottom: import("@alveole/theme").Spacing;
+        };
+        sectionContainer: {
+            display: "flex";
+            flexDirection: "column";
+            width: "100%";
+        };
+        sectionContainerFull: {};
+        sectionContainerMD: {
+            maxWidth: number;
+        };
+        sectionContainerSM: {
+            maxWidth: number;
+        };
+    };
+};
+export default _default;
+export declare const Default: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithPaddingY: () => import("react/jsx-runtime").JSX.Element;
+export declare const WidthMdSize: () => import("react/jsx-runtime").JSX.Element;
+export declare const WidthFullSize: () => import("react/jsx-runtime").JSX.Element;
+export declare const WidthSmSize: () => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Section.stories.d.ts.map

package/dist/core/Section/Section.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Section.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Section/Section.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA,wBAQkB;AAKlB,eAAO,MAAM,OAAO,+CAMnB,CAAC;AAEF,eAAO,MAAM,YAAY,+CAMxB,CAAC;AAEF,eAAO,MAAM,WAAW,+CAMvB,CAAC;AAEF,eAAO,MAAM,aAAa,+CAMzB,CAAC;AAEF,eAAO,MAAM,WAAW,+CAMvB,CAAC"}

package/dist/core/Section/Section.stories.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Box, Typography } from '../../core';
+import { Section } from './Section';
+import { useStyles } from './Section.styles';
+export default {
+    title: 'Section',
+    tags: ['Kit'],
+    experimental: true,
+    description: 'Section de page. Permet de contenir une section dans un élément adapté aux différentes platformes. Composant de type Box.',
+    component: Section,
+    styleFn: useStyles,
+};
+const paddingColor = '#b9c47f';
+const innerBoxColor = '#88b2bd';
+export const Default = () => (_jsx(Section, { children: _jsx(Box, { children: _jsx(Typography, { children: "Section avec background" }) }) }));
+export const WithPaddingY = () => (_jsx(Section, { backgroundColor: paddingColor, withPaddingY: true, children: _jsx(Box, { backgroundColor: innerBoxColor, p: '050', children: _jsx(Typography, { children: "Section avec background et padding Y" }) }) }));
+export const WidthMdSize = () => (_jsx(Section, { backgroundColor: paddingColor, size: "md", children: _jsx(Box, { backgroundColor: innerBoxColor, p: '050', children: _jsx(Typography, { children: "Section avec background et size md" }) }) }));
+export const WidthFullSize = () => (_jsx(Section, { backgroundColor: paddingColor, size: "full", children: _jsx(Box, { backgroundColor: innerBoxColor, p: '050', children: _jsx(Typography, { children: "Section avec background et size full (taille par d\u00E9faut)" }) }) }));
+export const WidthSmSize = () => (_jsx(Section, { backgroundColor: paddingColor, size: "sm", children: _jsx(Box, { backgroundColor: innerBoxColor, p: '050', children: _jsx(Typography, { children: "Section avec background et size sm" }) }) }));

package/dist/core/Section/Section.styles.d.ts

@@ -0,0 +1,27 @@
+export declare const useStyles: () => {
+    section: {
+        display: "flex";
+        flexDirection: "row";
+        gap: import("@alveole/theme").Spacing;
+        justifyContent: "center";
+        paddingLeft: import("@alveole/theme").Spacing;
+        paddingRight: import("@alveole/theme").Spacing;
+    };
+    sectionWithPaddingY: {
+        paddingTop: import("@alveole/theme").Spacing;
+        paddingBottom: import("@alveole/theme").Spacing;
+    };
+    sectionContainer: {
+        display: "flex";
+        flexDirection: "column";
+        width: "100%";
+    };
+    sectionContainerFull: {};
+    sectionContainerMD: {
+        maxWidth: number;
+    };
+    sectionContainerSM: {
+        maxWidth: number;
+    };
+};
+//# sourceMappingURL=Section.styles.d.ts.map

package/dist/core/Section/Section.styles.d.ts.map

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

package/dist/core/Section/Section.styles.js

@@ -0,0 +1,30 @@
+import { makeStyles } from '@alveole/theme';
+export const useStyles = makeStyles(({ isVariant, spacing }) => {
+    const paddingValue = isVariant('mobile') ? spacing('100') : spacing('150');
+    return {
+        section: {
+            display: 'flex',
+            flexDirection: 'row',
+            gap: spacing('075'),
+            justifyContent: 'center',
+            paddingLeft: paddingValue,
+            paddingRight: paddingValue,
+        },
+        sectionWithPaddingY: {
+            paddingTop: paddingValue,
+            paddingBottom: paddingValue,
+        },
+        sectionContainer: {
+            display: 'flex',
+            flexDirection: 'column',
+            width: '100%',
+        },
+        sectionContainerFull: {},
+        sectionContainerMD: {
+            maxWidth: 1200,
+        },
+        sectionContainerSM: {
+            maxWidth: 600,
+        },
+    };
+});

package/dist/core/Section/index.d.ts

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

package/dist/core/Section/index.d.ts.map

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

package/dist/core/Section/index.js

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

package/dist/core/index.d.ts

@@ -1,6 +1,7 @@
 export * from './Box';
 export * from './Image';
 export * from './Metabase';
+export * from './Section';
 export * from './Typography';
 export * from './Version';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/core/index.ts"],"names":[],"mappings":"AAAA,cAAc,OAAO,CAAC;AACtB,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/core/index.ts"],"names":[],"mappings":"AAAA,cAAc,OAAO,CAAC;AACtB,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC"}

package/dist/core/index.js

@@ -1,5 +1,6 @@
 export * from './Box';
 export * from './Image';
 export * from './Metabase';
+export * from './Section';
 export * from './Typography';
 export * from './Version';

package/dist/stories/index.d.ts

@@ -1,11 +1,13 @@
 export * as BoxStory from '../core/Box/Box.stories';
 export * as ImageStory from '../core/Image/Image.stories';
 export * as MetabaseStory from '../core/Metabase/Metabase.stories';
+export * as SectionStory from '../core/Section/Section.stories';
 export * as TypographyStory from '../core/Typography/Typography.stories';
 export * as VersionStory from '../core/Version/Version.stories';
 export * as AvatarStory from '../ui/Avatar/Avatar.stories';
 export * as ButtonStory from '../ui/Button/Button.stories';
 export * as DividerStory from '../ui/Divider/Divider.stories';
+export * as EmptyStateStory from '../ui/EmptyState/EmptyState.stories';
 export * as ListItemStory from '../ui/ListItem/ListItem.stories';
 export * as LucideIconStory from '../ui/LucideIcon/LucideIcon.stories';
 export * as ResourceListStory from '../ui/ResourceList/ResourceList.stories';

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/stories/index.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,QAAQ,MAAM,yBAAyB,CAAC;AACpD,OAAO,KAAK,UAAU,MAAM,6BAA6B,CAAC;AAC1D,OAAO,KAAK,aAAa,MAAM,mCAAmC,CAAC;AACnE,OAAO,KAAK,eAAe,MAAM,uCAAuC,CAAC;AACzE,OAAO,KAAK,YAAY,MAAM,iCAAiC,CAAC;AAGhE,OAAO,KAAK,WAAW,MAAM,6BAA6B,CAAC;AAC3D,OAAO,KAAK,WAAW,MAAM,6BAA6B,CAAC;AAC3D,OAAO,KAAK,YAAY,MAAM,+BAA+B,CAAC;AAC9D,OAAO,KAAK,aAAa,MAAM,iCAAiC,CAAC;AACjE,OAAO,KAAK,eAAe,MAAM,qCAAqC,CAAC;AACvE,OAAO,KAAK,iBAAiB,MAAM,yCAAyC,CAAC;AAC7E,OAAO,KAAK,qBAAqB,MAAM,iDAAiD,CAAC;AACzF,OAAO,KAAK,eAAe,MAAM,qCAAqC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/stories/index.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,QAAQ,MAAM,yBAAyB,CAAC;AACpD,OAAO,KAAK,UAAU,MAAM,6BAA6B,CAAC;AAC1D,OAAO,KAAK,aAAa,MAAM,mCAAmC,CAAC;AACnE,OAAO,KAAK,YAAY,MAAM,iCAAiC,CAAC;AAChE,OAAO,KAAK,eAAe,MAAM,uCAAuC,CAAC;AACzE,OAAO,KAAK,YAAY,MAAM,iCAAiC,CAAC;AAGhE,OAAO,KAAK,WAAW,MAAM,6BAA6B,CAAC;AAC3D,OAAO,KAAK,WAAW,MAAM,6BAA6B,CAAC;AAC3D,OAAO,KAAK,YAAY,MAAM,+BAA+B,CAAC;AAC9D,OAAO,KAAK,eAAe,MAAM,qCAAqC,CAAC;AACvE,OAAO,KAAK,aAAa,MAAM,iCAAiC,CAAC;AACjE,OAAO,KAAK,eAAe,MAAM,qCAAqC,CAAC;AACvE,OAAO,KAAK,iBAAiB,MAAM,yCAAyC,CAAC;AAC7E,OAAO,KAAK,qBAAqB,MAAM,iDAAiD,CAAC;AACzF,OAAO,KAAK,eAAe,MAAM,qCAAqC,CAAC"}

package/dist/stories/index.js

@@ -2,12 +2,14 @@
 export * as BoxStory from '../core/Box/Box.stories';
 export * as ImageStory from '../core/Image/Image.stories';
 export * as MetabaseStory from '../core/Metabase/Metabase.stories';
+export * as SectionStory from '../core/Section/Section.stories';
 export * as TypographyStory from '../core/Typography/Typography.stories';
 export * as VersionStory from '../core/Version/Version.stories';
 // UI
 export * as AvatarStory from '../ui/Avatar/Avatar.stories';
 export * as ButtonStory from '../ui/Button/Button.stories';
 export * as DividerStory from '../ui/Divider/Divider.stories';
+export * as EmptyStateStory from '../ui/EmptyState/EmptyState.stories';
 export * as ListItemStory from '../ui/ListItem/ListItem.stories';
 export * as LucideIconStory from '../ui/LucideIcon/LucideIcon.stories';
 export * as ResourceListStory from '../ui/ResourceList/ResourceList.stories';

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

@@ -0,0 +1,16 @@
+import React from 'react';
+import { BoxProps } from '../../core/Box/Box';
+import { LucideIconProps } from '../LucideIcon';
+export type EmptyStateProps = BoxProps & {
+    iconName?: LucideIconProps['name'];
+    title?: string;
+    description?: string;
+    /**
+     * @deprecated Utilisez `description` à la place.
+     */
+    text?: string;
+    illustration?: React.ReactNode;
+    actions?: React.ReactNode;
+};
+export declare const EmptyState: (props: EmptyStateProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=EmptyState.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../../src/ui/EmptyState/EmptyState.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAO,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACnD,OAAO,EAAgC,eAAe,EAAE,MAAM,eAAe,CAAC;AAG9E,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG;IACvC,QAAQ,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IACnC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,OAAO,eAAe,4CA8BhD,CAAC"}

package/dist/ui/EmptyState/EmptyState.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Typography } from '../../core';
+import { Box } from '../../core/Box/Box';
+import { isLucideIconName, LucideIcon } from '../LucideIcon';
+import { useStyles } from './EmptyState.styles';
+export const EmptyState = (props) => {
+    const { children, style, iconName, title, description, text, illustration, actions, ...boxProps } = props;
+    const styles = useStyles();
+    const descriptionToRender = description ?? text;
+    const footer = actions ?? children;
+    return (_jsxs(Box, { tag: "empty-state", style: [styles.container, style], ...boxProps, children: [_jsxs(Box, { tag: "empty-state-contenu", style: styles.contenu, children: [(illustration || iconName) && (_jsx(Box, { style: styles.media, children: illustration ? (illustration) : iconName && isLucideIconName(iconName) ? (_jsx(LucideIcon, { name: iconName, size: "lg" })) : null })), _jsxs(Box, { style: styles.messageEtDescription, children: [title && _jsx(Typography, { style: styles.title, children: title }), descriptionToRender && _jsx(Typography, { style: styles.description, children: descriptionToRender })] })] }), footer && _jsx(Box, { style: styles.footer, children: footer })] }));
+};

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

@@ -0,0 +1,73 @@
+declare const _default: {
+    title: string;
+    tags: ["Kit"];
+    experimental: false;
+    description: string;
+    figmaURL: string;
+    component: (props: import("./EmptyState").EmptyStateProps) => import("react/jsx-runtime").JSX.Element;
+    styleFn: () => {
+        container: {
+            display: "flex";
+            flexDirection: "column";
+            alignItems: "center";
+            justifyContent: "center";
+            gap: import("@alveole/theme").Spacing;
+            paddingTop: number;
+            paddingBottom: import("@alveole/theme").Spacing;
+            paddingLeft: import("@alveole/theme").Spacing;
+            paddingRight: import("@alveole/theme").Spacing;
+            textAlign: "center";
+            height: "100%";
+        };
+        contenu: {
+            display: "flex";
+            gap: import("@alveole/theme").Spacing;
+            alignItems: "center";
+            textAlign: "center";
+            flex: number;
+            justifyContent: "center";
+        };
+        media: {
+            display: "flex";
+            alignItems: "center";
+            justifyContent: "center";
+            color: "#002764";
+            backgroundColor: "#F2F9FF";
+            borderRadius: import("@alveole/theme/dist/constants/Radius").Radius;
+            padding: import("@alveole/theme").Spacing;
+        };
+        messageEtDescription: {
+            display: "flex";
+            flexDirection: "column";
+            gap: import("@alveole/theme").Spacing;
+        };
+        title: {
+            fontFamily: "Barlow-Light" | "Barlow-Regular" | "Barlow-Medium" | "Barlow-SemiBold" | "Barlow-Bold" | "Inter-Light" | "Inter-Regular" | "Inter-Medium" | "Inter-SemiBold" | "Inter-Bold";
+            fontSize: 18 | 20;
+            lineHeight: 24 | 28;
+            letterSpacing: 0;
+            color: "#151617";
+        };
+        description: {
+            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;
+            color: "#5F6571";
+        };
+        footer: {
+            width: "100%";
+            marginTop: import("@alveole/theme").Spacing;
+            display: "flex";
+            flexDirection: "column";
+            gap: import("@alveole/theme").Spacing;
+        };
+    };
+};
+export default _default;
+export declare const Default: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithIcon: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithActions: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithCustomChildren: () => import("react/jsx-runtime").JSX.Element;
+export declare const WithFixHeight: () => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=EmptyState.stories.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/EmptyState/EmptyState.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA,wBASkB;AAElB,eAAO,MAAM,OAAO,+CAOnB,CAAC;AAEF,eAAO,MAAM,QAAQ,+CAQpB,CAAC;AAEF,eAAO,MAAM,WAAW,+CAcvB,CAAC;AAEF,eAAO,MAAM,kBAAkB,+CAO9B,CAAC;AAEF,eAAO,MAAM,aAAa,+CAOzB,CAAC"}

package/dist/ui/EmptyState/EmptyState.stories.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from '../Button';
+import { EmptyState } from './EmptyState';
+import { useStyles } from './EmptyState.styles';
+export default {
+    title: 'Empty State',
+    tags: ['Kit'],
+    experimental: false,
+    description: "À utiliser quand une liste d'objet est vide",
+    figmaURL: 'https://www.figma.com/design/xJz8Z6vfrnZPKTtRbuT2W8/Alveole---Composants?node-id=1399-538&t=baZKFA9BpkeQGeZm-4',
+    component: EmptyState,
+    styleFn: useStyles,
+};
+export const Default = () => {
+    return (_jsx(EmptyState, { title: "Aucun \u00E9l\u00E9ment pour l\u2019instant", description: "Ajoutez un premier \u00E9l\u00E9ment pour commencer \u00E0 travailler sur cette section." }));
+};
+export const WithIcon = () => {
+    return (_jsx(EmptyState, { iconName: "ClipboardList", title: "Aucune donn\u00E9e", description: "Ajoutez un \u00E9l\u00E9ment pour remplir ce tableau." }));
+};
+export const WithActions = () => {
+    return (_jsx(EmptyState, { iconName: "FilePlus", title: "Vous n\u2019avez aucun document", description: "Cr\u00E9ez un premier document ou importez-en un depuis votre ordinateur.", actions: _jsxs(_Fragment, { children: [_jsx(Button, { title: "Cr\u00E9er un document", variant: "primary" }), _jsx(Button, { title: "Importer un fichier", variant: "secondary" })] }) }));
+};
+export const WithCustomChildren = () => {
+    return (_jsxs(EmptyState, { iconName: "File", description: 'Vous n’avez aucun item', children: [_jsx(Button, { title: 'Button', variant: 'primary', fullWidth: true }), _jsx(Button, { title: 'Secondary action link', variant: 'link' })] }));
+};
+export const WithFixHeight = () => {
+    return (_jsxs(EmptyState, { iconName: "File", description: 'Vous n’avez aucun item', style: { height: '600px' }, children: [_jsx(Button, { title: 'Button', variant: 'primary' }), _jsx(Button, { title: 'Secondary action link', variant: 'link' })] }));
+};

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

@@ -0,0 +1,59 @@
+export declare const useStyles: () => {
+    container: {
+        display: "flex";
+        flexDirection: "column";
+        alignItems: "center";
+        justifyContent: "center";
+        gap: import("@alveole/theme").Spacing;
+        paddingTop: number;
+        paddingBottom: import("@alveole/theme").Spacing;
+        paddingLeft: import("@alveole/theme").Spacing;
+        paddingRight: import("@alveole/theme").Spacing;
+        textAlign: "center";
+        height: "100%";
+    };
+    contenu: {
+        display: "flex";
+        gap: import("@alveole/theme").Spacing;
+        alignItems: "center";
+        textAlign: "center";
+        flex: number;
+        justifyContent: "center";
+    };
+    media: {
+        display: "flex";
+        alignItems: "center";
+        justifyContent: "center";
+        color: "#002764";
+        backgroundColor: "#F2F9FF";
+        borderRadius: import("@alveole/theme/dist/constants/Radius").Radius;
+        padding: import("@alveole/theme").Spacing;
+    };
+    messageEtDescription: {
+        display: "flex";
+        flexDirection: "column";
+        gap: import("@alveole/theme").Spacing;
+    };
+    title: {
+        fontFamily: "Barlow-Light" | "Barlow-Regular" | "Barlow-Medium" | "Barlow-SemiBold" | "Barlow-Bold" | "Inter-Light" | "Inter-Regular" | "Inter-Medium" | "Inter-SemiBold" | "Inter-Bold";
+        fontSize: 18 | 20;
+        lineHeight: 24 | 28;
+        letterSpacing: 0;
+        color: "#151617";
+    };
+    description: {
+        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;
+        color: "#5F6571";
+    };
+    footer: {
+        width: "100%";
+        marginTop: import("@alveole/theme").Spacing;
+        display: "flex";
+        flexDirection: "column";
+        gap: import("@alveole/theme").Spacing;
+    };
+};
+//# sourceMappingURL=EmptyState.styles.d.ts.map

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

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

package/dist/ui/EmptyState/EmptyState.styles.js

@@ -0,0 +1,53 @@
+import { makeStyles } from '@alveole/theme';
+export const useStyles = makeStyles(({ text, color, spacing, radius }) => ({
+    container: {
+        display: 'flex',
+        flexDirection: 'column',
+        alignItems: 'center',
+        justifyContent: 'center',
+        gap: spacing('150'),
+        paddingTop: 0,
+        paddingBottom: spacing('2W'),
+        paddingLeft: spacing('2W'),
+        paddingRight: spacing('2W'),
+        textAlign: 'center',
+        height: '100%',
+    },
+    contenu: {
+        display: 'flex',
+        gap: spacing('2W'),
+        alignItems: 'center',
+        textAlign: 'center',
+        flex: 1,
+        justifyContent: 'center',
+    },
+    media: {
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        color: color.light.text['active-primary'],
+        backgroundColor: color.light.background['alt-primary'],
+        borderRadius: radius('full'),
+        padding: spacing('075'),
+    },
+    messageEtDescription: {
+        display: 'flex',
+        flexDirection: 'column',
+        gap: spacing('2W'),
+    },
+    title: {
+        color: color.light.text['title-grey'],
+        ...text.Titres['H6 - XXS'],
+    },
+    description: {
+        color: color.light.text['mention-grey'],
+        ...text['Corps de texte'].SM.Regular,
+    },
+    footer: {
+        width: '100%',
+        marginTop: spacing('100'),
+        display: 'flex',
+        flexDirection: 'column',
+        gap: spacing('100'),
+    },
+}));

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

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

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

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

package/dist/ui/EmptyState/index.js

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

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

@@ -29,7 +29,7 @@ declare const _default: {
         };
         compactLargeInformations: {
             paddingBottom: number;
-            height: number;
+            minHeight: number;
             justifyContent: "center";
         };
         titre: {

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

@@ -22,7 +22,7 @@ export declare const useStyles: () => {
     };
     compactLargeInformations: {
         paddingBottom: number;
-        height: number;
+        minHeight: number;
         justifyContent: "center";
     };
     titre: {

package/dist/ui/ToolbarTop/ToolbarTop.styles.js

@@ -23,7 +23,7 @@ export const useStyles = makeStyles(({ text, spacing, color }) => ({
     },
     compactLargeInformations: {
         paddingBottom: 0,
-        height: 60,
+        minHeight: 60,
         justifyContent: 'center',
     },
     titre: {

package/dist/ui/index.d.ts

@@ -1,6 +1,7 @@
 export * from './Avatar';
 export * from './Button';
 export * from './Divider';
+export * from './EmptyState';
 export * from './ListItem';
 export * from './LucideIcon';
 export * from './ResourceList';

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,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,oBAAoB,CAAC;AACnC,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ui/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,oBAAoB,CAAC;AACnC,cAAc,cAAc,CAAC"}

package/dist/ui/index.js

@@ -1,6 +1,7 @@
 export * from './Avatar';
 export * from './Button';
 export * from './Divider';
+export * from './EmptyState';
 export * from './ListItem';
 export * from './LucideIcon';
 export * from './ResourceList';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alveole/components",
-  "version": "0.15.5",
+  "version": "0.16.1",
   "description": "Shared UI components.",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",