@alveole/components 0.43.2 → 1.0.0

package/dist/ui/Card/CardSection.styles.d.ts

@@ -16,7 +16,7 @@ export declare const useStyles: () => {
         alignItems: "center";
     };
     titleText: {
-        color: "#151617";
+        color: string;
         fontSize: 14;
         lineHeight: 20;
         letterSpacing: 0;
@@ -34,7 +34,7 @@ export declare const useStyles: () => {
         alignItems: "center";
     };
     descriptionText: {
-        color: "#373A3F";
+        color: string;
         fontSize: 14;
         lineHeight: 20;
         letterSpacing: 0;
@@ -42,7 +42,7 @@ export declare const useStyles: () => {
         fontWeight?: import("react-native").TextStyle["fontWeight"];
     };
     disabledText: {
-        color: "#8D97AC";
+        color: string;
     };
 };
 //# sourceMappingURL=CardSection.styles.d.ts.map

package/dist/ui/Checkbox/Checkbox.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { CheckboxContainerProps } from './CheckboxContainer';
+import { CheckboxIndicatorProps } from './CheckboxIndicator';
+import { CheckboxLabelProps } from './CheckboxLabel';
+export type CheckboxProps = CheckboxContainerProps & CheckboxIndicatorProps & CheckboxLabelProps;
+export declare const Checkbox: React.ForwardRefExoticComponent<import("tamagui").StackNonStyleProps & import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStyleBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStyleBase>> & import("@tamagui/web").WithPseudoProps<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStyleBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStyleBase>>> & import("@tamagui/web").WithMediaProps<import("@tamagui/web").WithThemeShorthandsAndPseudos<import("@tamagui/web").StackStyleBase, {}>> & import("@tamagui/checkbox-headless").CheckboxExtraProps & {
+    scaleIcon?: number;
+    scaleSize?: number;
+    sizeAdjust?: number;
+    native?: import("tamagui").NativeValue<"web">;
+} & {
+    size?: import("tamagui").SizeTokens;
+    unstyled?: boolean;
+} & {
+    variant?: "small" | "medium";
+    error?: string;
+    success?: string;
+} & CheckboxIndicatorProps & CheckboxLabelProps & React.RefAttributes<import("tamagui").TamaguiElement>>;
+//# sourceMappingURL=Checkbox.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/ui/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAgB,MAAM,OAAO,CAAC;AAErC,OAAO,EAAqB,sBAAsB,EAAmB,MAAM,qBAAqB,CAAC;AACjG,OAAO,EAAqB,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAChF,OAAO,EAAiB,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAEpE,MAAM,MAAM,aAAa,GAAG,sBAAsB,GAAG,sBAAsB,GAAG,kBAAkB,CAAC;AAEjG,eAAO,MAAM,QAAQ;;;;;;;;;;;;wGAuBnB,CAAC"}

package/dist/ui/Checkbox/Checkbox.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, FormControlCaption } from '@alveole/components';
+import { useTheme } from '@alveole/theme';
+import React, { useId } from 'react';
+import { useStyles } from './Checkbox.styles';
+import { CheckboxContainer } from './CheckboxContainer';
+import { CheckboxIndicator } from './CheckboxIndicator';
+import { CheckboxLabel } from './CheckboxLabel';
+export const Checkbox = React.forwardRef(function Checkbox(props, ref) {
+    const { variant, label, error, success, disabled, onCheckedChange } = props;
+    const baseProps = { variant, label, error, success, disabled, onCheckedChange };
+    const { spacing } = useTheme();
+    const styles = useStyles();
+    const uniqId = useId();
+    const id = `checkbox--${variant}--${uniqId}`;
+    return (_jsxs(Box, { tag: "check-box-container", gap: error || success ? spacing('050') : 0, style: styles.checkboxContainer, children: [_jsxs(Box, { tag: "check-box", style: styles.container, children: [_jsx(CheckboxContainer, { id: id, ref: ref, ...props, children: _jsx(CheckboxIndicator, { ...baseProps, indeterminate: props.checked === 'indeterminate' }) }), label && _jsx(CheckboxLabel, { htmlFor: id, ...baseProps })] }), (error ?? success) && _jsx(FormControlCaption, { error: error, success: success })] }));
+});

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

@@ -0,0 +1,93 @@
+declare const _default: {
+    title: string;
+    tags: "ui"[];
+    experimental: false;
+    description: string;
+    component: import("react").ForwardRefExoticComponent<import("tamagui").StackNonStyleProps & import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStyleBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStyleBase>> & import("@tamagui/web").WithPseudoProps<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStyleBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStyleBase>>> & import("@tamagui/web").WithMediaProps<import("@tamagui/web").WithThemeShorthandsAndPseudos<import("@tamagui/web").StackStyleBase, {}>> & import("@tamagui/checkbox-headless").CheckboxExtraProps & {
+        scaleIcon?: number;
+        scaleSize?: number;
+        sizeAdjust?: number;
+        native?: import("tamagui").NativeValue<"web">;
+    } & {
+        size?: import("tamagui").SizeTokens;
+        unstyled?: boolean;
+    } & {
+        variant?: "small" | "medium";
+        error?: string;
+        success?: string;
+    } & import("./CheckboxIndicator").CheckboxIndicatorProps & import("./CheckboxLabel").CheckboxLabelProps & import("react").RefAttributes<import("tamagui").TamaguiElement>>;
+    styleFn: () => {
+        checkboxContainer: {
+            display: "flex";
+            flexDirection: "column";
+        };
+        container: {
+            display: "flex";
+            flexDirection: "row";
+            gap: import("@alveole/theme").Spacing;
+        };
+        checkbox: {
+            height: import("@alveole/theme").Spacing;
+            width: import("@alveole/theme").Spacing;
+            backgroundColor: "transparent";
+            borderColor: string;
+            borderRadius: number;
+        };
+        checkboxSm: {
+            height: import("@alveole/theme").Spacing;
+            width: import("@alveole/theme").Spacing;
+            borderRadius: number;
+        };
+        checkboxDisabled: {
+            borderColor: string;
+            backgroundColor: "transparent";
+        };
+        checkboxError: {
+            borderColor: string;
+        };
+        checkboxSuccess: {
+            borderColor: string;
+        };
+        indicator: {
+            height: import("@alveole/theme").Spacing;
+            width: import("@alveole/theme").Spacing;
+            backgroundColor: string;
+            borderRadius: number;
+        };
+        indicatorDisabled: {
+            backgroundColor: string;
+        };
+        label: {
+            cursor: "pointer";
+            color: string;
+            fontSize: 16;
+            lineHeight: 24;
+            letterSpacing: 0;
+            fontFamily: string;
+            fontWeight?: import("react-native").TextStyle["fontWeight"];
+            width: "100%";
+        };
+        labelSm: {
+            fontSize: 14;
+            lineHeight: 20;
+            letterSpacing: 0;
+            fontFamily: string;
+            fontWeight?: import("react-native").TextStyle["fontWeight"];
+        };
+        labelDisabled: {
+            cursor: "not-allowed";
+            color: string;
+        };
+        labelError: {
+            color: string;
+        };
+        labelSuccess: {
+            color: string;
+        };
+    };
+};
+export default _default;
+export declare const Default: () => import("react").JSX.Element;
+export declare const Variants: () => import("react").JSX.Element;
+export * as Sources from './Checkbox.stories.sources';
+//# sourceMappingURL=Checkbox.stories.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Checkbox/Checkbox.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA,wBAOkB;AAElB,eAAO,MAAM,OAAO,mCASnB,CAAC;AAEF,eAAO,MAAM,QAAQ,mCAKpB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,4BAA4B,CAAC"}

package/dist/ui/Checkbox/Checkbox.stories.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box } from '../../core';
+import { Checkbox } from './Checkbox';
+import { useStyles } from './Checkbox.styles';
+export default {
+    title: 'Checkbox',
+    tags: ['ui'],
+    experimental: false,
+    description: 'Case à cocher avec label, gestion des états et variants de taille.',
+    component: Checkbox,
+    styleFn: useStyles,
+};
+export const Default = () => (_jsxs(Box, { display: "flex", flexDirection: "column", gap: 24, children: [_jsx(Checkbox, { label: "Non coch\u00E9" }), _jsx(Checkbox, { label: "Coch\u00E9", checked: true }), _jsx(Checkbox, { label: "D\u00E9sactiv\u00E9", disabled: true }), _jsx(Checkbox, { label: "Coch\u00E9 d\u00E9sactiv\u00E9", checked: true, disabled: true }), _jsx(Checkbox, { label: "Avec erreur", error: "Vous devez accepter les conditions" }), _jsx(Checkbox, { label: "Avec succ\u00E8s", success: "Valid\u00E9" })] }));
+export const Variants = () => (_jsxs(Box, { display: "flex", flexDirection: "row", gap: 16, children: [_jsx(Checkbox, { label: "Normal" }), _jsx(Checkbox, { label: "Small", variant: "small" })] }));
+export * as Sources from './Checkbox.stories.sources';

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/Checkbox/Checkbox.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,cAA+b,CAAC;AAEpd,eAAO,MAAM,QAAQ,cAAwM,CAAC;AAE9N,eAAO,MAAM,YAAY;;;CAGf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}

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

@@ -0,0 +1,8 @@
+// This file is generated. Do not edit manually.
+// Source: src/ui/Checkbox/Checkbox.stories.tsx
+export const Default = () => "export const Default = () => (\n  <Box display=\"flex\" flexDirection=\"column\" gap={24}>\n    <Checkbox label=\"Non coché\" />\n    <Checkbox label=\"Coché\" checked />\n    <Checkbox label=\"Désactivé\" disabled />\n    <Checkbox label=\"Coché désactivé\" checked disabled />\n    <Checkbox label=\"Avec erreur\" error=\"Vous devez accepter les conditions\" />\n    <Checkbox label=\"Avec succès\" success=\"Validé\" />\n  </Box>\n);";
+export const Variants = () => "export const Variants = () => (\n  <Box display=\"flex\" flexDirection=\"row\" gap={16}>\n    <Checkbox label=\"Normal\" />\n    <Checkbox label=\"Small\" variant=\"small\" />\n  </Box>\n);";
+export const storySources = {
+    Default,
+    Variants,
+};

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

@@ -0,0 +1,70 @@
+export declare const useStyles: () => {
+    checkboxContainer: {
+        display: "flex";
+        flexDirection: "column";
+    };
+    container: {
+        display: "flex";
+        flexDirection: "row";
+        gap: import("@alveole/theme").Spacing;
+    };
+    checkbox: {
+        height: import("@alveole/theme").Spacing;
+        width: import("@alveole/theme").Spacing;
+        backgroundColor: "transparent";
+        borderColor: string;
+        borderRadius: number;
+    };
+    checkboxSm: {
+        height: import("@alveole/theme").Spacing;
+        width: import("@alveole/theme").Spacing;
+        borderRadius: number;
+    };
+    checkboxDisabled: {
+        borderColor: string;
+        backgroundColor: "transparent";
+    };
+    checkboxError: {
+        borderColor: string;
+    };
+    checkboxSuccess: {
+        borderColor: string;
+    };
+    indicator: {
+        height: import("@alveole/theme").Spacing;
+        width: import("@alveole/theme").Spacing;
+        backgroundColor: string;
+        borderRadius: number;
+    };
+    indicatorDisabled: {
+        backgroundColor: string;
+    };
+    label: {
+        cursor: "pointer";
+        color: string;
+        fontSize: 16;
+        lineHeight: 24;
+        letterSpacing: 0;
+        fontFamily: string;
+        fontWeight?: import("react-native").TextStyle["fontWeight"];
+        width: "100%";
+    };
+    labelSm: {
+        fontSize: 14;
+        lineHeight: 20;
+        letterSpacing: 0;
+        fontFamily: string;
+        fontWeight?: import("react-native").TextStyle["fontWeight"];
+    };
+    labelDisabled: {
+        cursor: "not-allowed";
+        color: string;
+    };
+    labelError: {
+        color: string;
+    };
+    labelSuccess: {
+        color: string;
+    };
+};
+//# sourceMappingURL=Checkbox.styles.d.ts.map

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

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

package/dist/ui/Checkbox/Checkbox.styles.js

@@ -0,0 +1,62 @@
+import { makeStyles } from '@alveole/theme';
+export const useStyles = makeStyles(({ text, color, spacing }) => ({
+    checkboxContainer: {
+        display: 'flex',
+        flexDirection: 'column',
+    },
+    container: {
+        display: 'flex',
+        flexDirection: 'row',
+        gap: spacing('050'),
+    },
+    checkbox: {
+        height: spacing('150'),
+        width: spacing('150'),
+        backgroundColor: 'transparent',
+        borderColor: color.light.border['action-high-primary'],
+        borderRadius: 6,
+    },
+    checkboxSm: {
+        height: spacing('100'),
+        width: spacing('100'),
+        borderRadius: 4,
+    },
+    checkboxDisabled: {
+        borderColor: color.border['disabled-grey'],
+        backgroundColor: 'transparent',
+    },
+    checkboxError: {
+        borderColor: color.border['plain-error'],
+    },
+    checkboxSuccess: {
+        borderColor: color.border['plain-success'],
+    },
+    indicator: {
+        height: spacing('150'),
+        width: spacing('150'),
+        backgroundColor: color.light.background['action-high-primary'],
+        borderRadius: 6,
+    },
+    indicatorDisabled: {
+        backgroundColor: color.background['disabled-grey'],
+    },
+    label: {
+        width: '100%',
+        ...text['Corps de texte'].MD.Regular,
+        cursor: 'pointer',
+        color: color.text['label-grey'],
+    },
+    labelSm: {
+        ...text['Corps de texte'].SM.Regular,
+    },
+    labelDisabled: {
+        cursor: 'not-allowed',
+        color: color.text['disabled-grey'],
+    },
+    labelError: {
+        color: color.text['default-error'],
+    },
+    labelSuccess: {
+        color: color.text['default-success'],
+    },
+}));

package/dist/ui/Checkbox/CheckboxContainer.d.ts

@@ -0,0 +1,22 @@
+import React from 'react';
+import { CheckboxProps as TamaguiCheckboxProps, TamaguiElement } from 'tamagui';
+export type CheckboxElement = TamaguiElement;
+export type CheckboxContainerProps = TamaguiCheckboxProps & {
+    variant?: 'small' | 'medium';
+    error?: string;
+    success?: string;
+};
+export declare const CheckboxContainer: React.ForwardRefExoticComponent<import("tamagui").StackNonStyleProps & import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStyleBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStyleBase>> & import("@tamagui/web").WithPseudoProps<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStyleBase> & import("@tamagui/web").WithShorthands<import("@tamagui/web").WithThemeValues<import("@tamagui/web").StackStyleBase>>> & import("@tamagui/web").WithMediaProps<import("@tamagui/web").WithThemeShorthandsAndPseudos<import("@tamagui/web").StackStyleBase, {}>> & import("@tamagui/checkbox-headless").CheckboxExtraProps & {
+    scaleIcon?: number;
+    scaleSize?: number;
+    sizeAdjust?: number;
+    native?: import("tamagui").NativeValue<"web">;
+} & {
+    size?: import("tamagui").SizeTokens;
+    unstyled?: boolean;
+} & {
+    variant?: "small" | "medium";
+    error?: string;
+    success?: string;
+} & React.RefAttributes<TamaguiElement>>;
+//# sourceMappingURL=CheckboxContainer.d.ts.map

package/dist/ui/Checkbox/CheckboxContainer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxContainer.d.ts","sourceRoot":"","sources":["../../../src/ui/Checkbox/CheckboxContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAA+B,aAAa,IAAI,oBAAoB,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAG7G,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC;AAC7C,MAAM,MAAM,sBAAsB,GAAG,oBAAoB,GAAG;IAC1D,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,iBAAiB;;;;;;;;;cALlB,OAAO,GAAG,QAAQ;YACpB,MAAM;cACJ,MAAM;wCAoCjB,CAAC"}

package/dist/ui/Checkbox/CheckboxContainer.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import React from 'react';
+import { Checkbox as TamaguiCheckbox } from 'tamagui';
+import { useStyles } from './Checkbox.styles';
+export const CheckboxContainer = React.forwardRef(function Checkbox(props, ref) {
+    const { variant, error, success, disabled, ...checkboxProps } = props;
+    const styles = useStyles();
+    const baseCheckboxStyles = { ...styles.checkbox, ...(variant === 'small' ? styles.checkboxSm : {}) };
+    const checkboxStyles = {
+        ...baseCheckboxStyles,
+        ...(disabled ? styles.checkboxDisabled : {}),
+        ...(success ? styles.checkboxSuccess : {}),
+        ...(error ? styles.checkboxError : {}),
+        marginTop: 'auto',
+        marginBottom: 'auto',
+    };
+    const checkboxHoverStyles = disabled ? styles.checkboxDisabled : baseCheckboxStyles;
+    const checkboxFocusStyles = disabled ? styles.checkboxDisabled : baseCheckboxStyles;
+    const checkboxPressStyles = disabled ? styles.checkboxDisabled : baseCheckboxStyles;
+    return (_jsx(TamaguiCheckbox, { ref: ref, disabled: disabled, style: checkboxStyles, focusStyle: checkboxFocusStyles, hoverStyle: checkboxHoverStyles, pressStyle: checkboxPressStyles, ...checkboxProps }));
+});

package/dist/ui/Checkbox/CheckboxIndicator.d.ts

@@ -0,0 +1,7 @@
+export type CheckboxIndicatorProps = {
+    variant?: 'small' | 'medium';
+    indeterminate?: boolean;
+    disabled?: boolean;
+};
+export declare const CheckboxIndicator: (props: CheckboxIndicatorProps) => import("react").JSX.Element;
+//# sourceMappingURL=CheckboxIndicator.d.ts.map

package/dist/ui/Checkbox/CheckboxIndicator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxIndicator.d.ts","sourceRoot":"","sources":["../../../src/ui/Checkbox/CheckboxIndicator.tsx"],"names":[],"mappings":"AAKA,MAAM,MAAM,sBAAsB,GAAG;IACnC,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC7B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,OAAO,sBAAsB,gCAsB9D,CAAC"}

package/dist/ui/Checkbox/CheckboxIndicator.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { LucideIcon } from '@alveole/components';
+import { useTheme } from '@alveole/theme';
+import { Checkbox as TamaguiCheckbox } from 'tamagui';
+import { useStyles } from './Checkbox.styles';
+export const CheckboxIndicator = (props) => {
+    const { variant, disabled, indeterminate } = props;
+    const { color } = useTheme();
+    const styles = useStyles();
+    return (_jsx(TamaguiCheckbox.Indicator, { style: {
+            ...styles.indicator,
+            ...(variant === 'small' ? styles.checkboxSm : {}),
+            ...(disabled ? styles.indicatorDisabled : {}),
+        }, children: _jsx(LucideIcon, { size: variant === 'small' ? 'xs' : 'sm', name: indeterminate ? 'Minus' : 'Check', color: disabled ? color.text['default-grey'] : '#FFFFFF', style: { margin: 'auto' } }) }));
+};

package/dist/ui/Checkbox/CheckboxLabel.d.ts

@@ -0,0 +1,9 @@
+import { LabelProps } from 'tamagui';
+export type CheckboxLabelProps = {
+    variant?: 'small' | 'medium';
+    label?: string;
+    error?: string;
+    success?: string;
+};
+export declare const CheckboxLabel: (props: CheckboxLabelProps & LabelProps) => import("react").JSX.Element;
+//# sourceMappingURL=CheckboxLabel.d.ts.map

package/dist/ui/Checkbox/CheckboxLabel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxLabel.d.ts","sourceRoot":"","sources":["../../../src/ui/Checkbox/CheckboxLabel.tsx"],"names":[],"mappings":"AACA,OAAO,EAAS,UAAU,EAAE,MAAM,SAAS,CAAC;AAG5C,MAAM,MAAM,kBAAkB,GAAG;IAC/B,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,OAAO,kBAAkB,GAAG,UAAU,gCAqBnE,CAAC"}

package/dist/ui/Checkbox/CheckboxLabel.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Typography } from '@alveole/components';
+import { Label } from 'tamagui';
+import { useStyles } from './Checkbox.styles';
+export const CheckboxLabel = (props) => {
+    const { variant, disabled, error, success, label, ...labelProps } = props;
+    const styles = useStyles();
+    return (_jsx(Label, { unstyled: true, disabled: disabled, ...labelProps, width: '100%', children: _jsx(Typography, { style: {
+                ...styles.label,
+                ...(variant === 'small' ? styles.labelSm : {}),
+                ...(disabled ? styles.labelDisabled : {}),
+                ...(success ? styles.labelSuccess : {}),
+                ...(error ? styles.labelError : {}),
+            }, tag: "check-box-label", children: label }) }));
+};

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

@@ -0,0 +1,5 @@
+export * from './Checkbox';
+export * from './CheckboxContainer';
+export * from './CheckboxIndicator';
+export * from './CheckboxLabel';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/ui/Checkbox/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC"}

package/dist/ui/Checkbox/index.js

@@ -0,0 +1,4 @@
+export * from './Checkbox';
+export * from './CheckboxContainer';
+export * from './CheckboxIndicator';
+export * from './CheckboxLabel';

package/dist/ui/Counter/Counter.d.ts

@@ -0,0 +1,6 @@
+export type CounterProps = {
+    variant: 'default' | 'primary';
+    count: number;
+};
+export declare const Counter: (props: CounterProps) => import("react").JSX.Element;
+//# sourceMappingURL=Counter.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Counter.d.ts","sourceRoot":"","sources":["../../../src/ui/Counter/Counter.tsx"],"names":[],"mappings":"AAGA,MAAM,MAAM,YAAY,GAAG;IACzB,OAAO,EAAE,SAAS,GAAG,SAAS,CAAC;IAC/B,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,eAAO,MAAM,OAAO,GAAI,OAAO,YAAY,gCAe1C,CAAC"}

package/dist/ui/Counter/Counter.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Typography } from '@alveole/components';
+import { useStyles } from './Counter.styles';
+export const Counter = (props) => {
+    const { variant, count } = props;
+    const styles = useStyles();
+    return (_jsx(Typography, { tag: "counter", style: {
+            ...styles.counter,
+            ...(variant === 'primary' ? styles.counterPrimary : {}),
+        }, children: count }));
+};

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

@@ -0,0 +1,29 @@
+declare const _default: {
+    title: string;
+    tags: "ui"[];
+    experimental: false;
+    figmaURL: string;
+    description: string;
+    component: (props: import("@alveole/components").CounterProps) => import("react").JSX.Element;
+    styleFn: () => {
+        counter: {
+            fontSize: 12;
+            lineHeight: 20;
+            letterSpacing: 0;
+            fontFamily: string;
+            fontWeight?: import("react-native").TextStyle["fontWeight"];
+            paddingRight: import("@alveole/theme").Spacing;
+            paddingLeft: import("@alveole/theme").Spacing;
+            backgroundColor: string;
+            borderRadius: import("@alveole/theme/dist/constants/Radius").Radius;
+        };
+        counterPrimary: {
+            backgroundColor: string;
+            color: string;
+        };
+    };
+};
+export default _default;
+export declare const Default: () => import("react").JSX.Element;
+export * as Sources from './Counter.stories.sources';
+//# sourceMappingURL=Counter.stories.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Counter.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Counter/Counter.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAKA,wBASkB;AAElB,eAAO,MAAM,OAAO,mCAKnB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,2BAA2B,CAAC"}

package/dist/ui/Counter/Counter.stories.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box } from '@alveole/components';
+import { Counter } from './Counter';
+import { useStyles } from './Counter.styles';
+export default {
+    title: 'Counter',
+    tags: ['ui'],
+    experimental: false,
+    figmaURL: 'https://www.figma.com/design/xJz8Z6vfrnZPKTtRbuT2W8/Alveole---Composants?node-id=1871-3052&t=s1FT99TtCUvIPAfB-4',
+    description: 'Badge numérique indiquant un compteur. Utilisé dans les onglets.',
+    component: Counter,
+    styleFn: useStyles,
+};
+export const Default = () => (_jsxs(Box, { display: "flex", flexDirection: "row", gap: 8, style: { alignItems: 'center' }, children: [_jsx(Counter, { variant: "default", count: 20 }), _jsx(Counter, { variant: "primary", count: 20 })] }));
+export * as Sources from './Counter.stories.sources';

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

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

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

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

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

@@ -0,0 +1,6 @@
+// This file is generated. Do not edit manually.
+// Source: src/ui/Counter/Counter.stories.tsx
+export const Default = () => "export const Default = () => (\n  <Box display=\"flex\" flexDirection=\"row\" gap={8} style={{ alignItems: 'center' }}>\n    <Counter variant=\"default\" count={20} />\n    <Counter variant=\"primary\" count={20} />\n  </Box>\n);";
+export const storySources = {
+    Default,
+};

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

@@ -0,0 +1,18 @@
+export declare const useStyles: () => {
+    counter: {
+        fontSize: 12;
+        lineHeight: 20;
+        letterSpacing: 0;
+        fontFamily: string;
+        fontWeight?: import("react-native").TextStyle["fontWeight"];
+        paddingRight: import("@alveole/theme").Spacing;
+        paddingLeft: import("@alveole/theme").Spacing;
+        backgroundColor: string;
+        borderRadius: import("@alveole/theme/dist/constants/Radius").Radius;
+    };
+    counterPrimary: {
+        backgroundColor: string;
+        color: string;
+    };
+};
+//# sourceMappingURL=Counter.styles.d.ts.map

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

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

package/dist/ui/Counter/Counter.styles.js

@@ -0,0 +1,14 @@
+import { makeStyles } from '@alveole/theme';
+export const useStyles = makeStyles(({ color, spacing, text, radius }) => ({
+    counter: {
+        paddingRight: spacing('1,5V'),
+        paddingLeft: spacing('1,5V'),
+        backgroundColor: color.light.background['contrast-grey'],
+        borderRadius: radius('full'),
+        ...text['Corps de texte'].XS.Bold,
+    },
+    counterPrimary: {
+        backgroundColor: color.light.background['action-high-primary'],
+        color: color.light.text['inverted-primary'],
+    },
+}));

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

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

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

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

package/dist/ui/Counter/index.js

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

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

@@ -9,7 +9,7 @@ declare const _default: {
         divider: {
             width: "100%";
             height: number;
-            backgroundColor: "#DEE3EC";
+            backgroundColor: string;
         };
     };
 };

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

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