@alveole/components 1.9.0 → 1.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/generated/version.d.ts +1 -1
- package/dist/generated/version.d.ts.map +1 -1
- package/dist/generated/version.js +1 -1
- package/dist/stories/index.d.ts +1 -0
- package/dist/stories/index.d.ts.map +1 -1
- package/dist/stories/index.js +1 -0
- package/dist/ui/ActionMenu/ActionMenu.stories.d.ts +1 -0
- package/dist/ui/ActionMenu/ActionMenu.stories.d.ts.map +1 -1
- package/dist/ui/ActionMenu/ActionMenu.stories.js +2 -1
- package/dist/ui/Button/Button.d.ts +4 -2
- package/dist/ui/Button/Button.d.ts.map +1 -1
- package/dist/ui/Button/Button.js +19 -10
- package/dist/ui/Button/Button.stories.d.ts +6 -1
- package/dist/ui/Button/Button.stories.d.ts.map +1 -1
- package/dist/ui/Button/Button.stories.js +2 -0
- package/dist/ui/Button/Button.stories.sources.d.ts +2 -0
- package/dist/ui/Button/Button.stories.sources.d.ts.map +1 -1
- package/dist/ui/Button/Button.stories.sources.js +3 -0
- package/dist/ui/Button/Button.styles.d.ts +3 -0
- package/dist/ui/Button/Button.styles.d.ts.map +1 -1
- package/dist/ui/Button/Button.styles.js +3 -0
- package/dist/ui/Checkbox/Checkbox.d.ts +2 -1
- package/dist/ui/Checkbox/Checkbox.d.ts.map +1 -1
- package/dist/ui/Checkbox/Checkbox.js +3 -4
- package/dist/ui/Checkbox/Checkbox.stories.d.ts +3 -2
- package/dist/ui/Checkbox/Checkbox.stories.d.ts.map +1 -1
- package/dist/ui/Checkbox/Checkbox.stories.js +1 -1
- package/dist/ui/Checkbox/Checkbox.stories.sources.d.ts +2 -2
- package/dist/ui/Checkbox/Checkbox.stories.sources.d.ts.map +1 -1
- package/dist/ui/Checkbox/Checkbox.stories.sources.js +2 -2
- package/dist/ui/Checkbox/Checkbox.utils.d.ts +5 -0
- package/dist/ui/Checkbox/Checkbox.utils.d.ts.map +1 -0
- package/dist/ui/Checkbox/Checkbox.utils.js +7 -0
- package/dist/ui/Checkbox/CheckboxContainer.d.ts +7 -2
- package/dist/ui/Checkbox/CheckboxContainer.d.ts.map +1 -1
- package/dist/ui/Checkbox/CheckboxContainer.js +4 -2
- package/dist/ui/Checkbox/CheckboxIndicator.d.ts +4 -1
- package/dist/ui/Checkbox/CheckboxIndicator.d.ts.map +1 -1
- package/dist/ui/Checkbox/CheckboxIndicator.js +5 -3
- package/dist/ui/Checkbox/CheckboxLabel.d.ts +4 -1
- package/dist/ui/Checkbox/CheckboxLabel.d.ts.map +1 -1
- package/dist/ui/Checkbox/CheckboxLabel.js +4 -2
- package/dist/ui/DataTable/DataTable.d.ts +27 -0
- package/dist/ui/DataTable/DataTable.d.ts.map +1 -0
- package/dist/ui/DataTable/DataTable.js +58 -0
- package/dist/ui/DataTable/DataTable.stories.d.ts +205 -0
- package/dist/ui/DataTable/DataTable.stories.d.ts.map +1 -0
- package/dist/ui/DataTable/DataTable.stories.js +499 -0
- package/dist/ui/DataTable/DataTable.stories.sources.d.ts +25 -0
- package/dist/ui/DataTable/DataTable.stories.sources.d.ts.map +1 -0
- package/dist/ui/DataTable/DataTable.stories.sources.js +27 -0
- package/dist/ui/DataTable/DataTable.styles.d.ts +175 -0
- package/dist/ui/DataTable/DataTable.styles.d.ts.map +1 -0
- package/dist/ui/DataTable/DataTable.styles.js +163 -0
- package/dist/ui/DataTable/DataTable.types.d.ts +20 -0
- package/dist/ui/DataTable/DataTable.types.d.ts.map +1 -0
- package/dist/ui/DataTable/DataTable.types.js +1 -0
- package/dist/ui/DataTable/DataTableCell.d.ts +12 -0
- package/dist/ui/DataTable/DataTableCell.d.ts.map +1 -0
- package/dist/ui/DataTable/DataTableCell.js +18 -0
- package/dist/ui/DataTable/DataTableFooter.d.ts +8 -0
- package/dist/ui/DataTable/DataTableFooter.d.ts.map +1 -0
- package/dist/ui/DataTable/DataTableFooter.js +26 -0
- package/dist/ui/DataTable/DataTableHeaderCell.d.ts +9 -0
- package/dist/ui/DataTable/DataTableHeaderCell.d.ts.map +1 -0
- package/dist/ui/DataTable/DataTableHeaderCell.js +12 -0
- package/dist/ui/DataTable/DataTablePagination.d.ts +12 -0
- package/dist/ui/DataTable/DataTablePagination.d.ts.map +1 -0
- package/dist/ui/DataTable/DataTablePagination.js +78 -0
- package/dist/ui/DataTable/DataTableRow.d.ts +16 -0
- package/dist/ui/DataTable/DataTableRow.d.ts.map +1 -0
- package/dist/ui/DataTable/DataTableRow.js +26 -0
- package/dist/ui/DataTable/index.d.ts +5 -0
- package/dist/ui/DataTable/index.d.ts.map +1 -0
- package/dist/ui/DataTable/index.js +4 -0
- package/dist/ui/index.d.ts +1 -0
- package/dist/ui/index.d.ts.map +1 -1
- package/dist/ui/index.js +1 -0
- package/package.json +7 -7
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export declare const ALVEOLE_COMPONENTS_VERSION: "1.
|
|
1
|
+
export declare const ALVEOLE_COMPONENTS_VERSION: "1.10.0";
|
|
2
2
|
//# sourceMappingURL=version.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"version.d.ts","sourceRoot":"","sources":["../../src/generated/version.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,0BAA0B,EAAG,
|
|
1
|
+
{"version":3,"file":"version.d.ts","sourceRoot":"","sources":["../../src/generated/version.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,0BAA0B,EAAG,QAAiB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export const ALVEOLE_COMPONENTS_VERSION = "1.
|
|
1
|
+
export const ALVEOLE_COMPONENTS_VERSION = "1.10.0";
|
package/dist/stories/index.d.ts
CHANGED
|
@@ -28,6 +28,7 @@ export * as ButtonStory from '../ui/Button/Button.stories';
|
|
|
28
28
|
export * as CardStory from '../ui/Card/Card.stories';
|
|
29
29
|
export * as CheckboxStory from '../ui/Checkbox/Checkbox.stories';
|
|
30
30
|
export * as CounterStory from '../ui/Counter/Counter.stories';
|
|
31
|
+
export * as DataTableStory from '../ui/DataTable/DataTable.stories';
|
|
31
32
|
export * as DateInputStory from '../ui/DateInput/DateInput.stories';
|
|
32
33
|
export * as DividerStory from '../ui/Divider/Divider.stories';
|
|
33
34
|
export * as DocumentViewerStory from '../ui/DocumentViewer/DocumentViewer.stories';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/stories/index.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/stories/index.ts"],"names":[],"mappings":"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"}
|
package/dist/stories/index.js
CHANGED
|
@@ -30,6 +30,7 @@ export * as ButtonStory from '../ui/Button/Button.stories';
|
|
|
30
30
|
export * as CardStory from '../ui/Card/Card.stories';
|
|
31
31
|
export * as CheckboxStory from '../ui/Checkbox/Checkbox.stories';
|
|
32
32
|
export * as CounterStory from '../ui/Counter/Counter.stories';
|
|
33
|
+
export * as DataTableStory from '../ui/DataTable/DataTable.stories';
|
|
33
34
|
export * as DateInputStory from '../ui/DateInput/DateInput.stories';
|
|
34
35
|
export * as DividerStory from '../ui/Divider/Divider.stories';
|
|
35
36
|
export * as DocumentViewerStory from '../ui/DocumentViewer/DocumentViewer.stories';
|
|
@@ -5,6 +5,7 @@ declare const _default: {
|
|
|
5
5
|
experimental: false;
|
|
6
6
|
figmaURL: string;
|
|
7
7
|
description: string;
|
|
8
|
+
shortDescription: string;
|
|
8
9
|
component: ((props: import("./ActionMenu").ActionMenuProps) => React.JSX.Element) & {
|
|
9
10
|
Item: typeof import("./ActionMenuItem").ActionMenuItem;
|
|
10
11
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ActionMenu.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/ActionMenu/ActionMenu.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC
|
|
1
|
+
{"version":3,"file":"ActionMenu.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/ActionMenu/ActionMenu.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;;;;;;;;;AAQ1B,wBAWkB;AAElB,eAAO,MAAM,OAAO,yBAsCnB,CAAC;AAIF,eAAO,MAAM,OAAO,yBAqFnB,CAAC;AAEF,eAAO,MAAM,UAAU,yBA4BtB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,8BAA8B,CAAC"}
|
|
@@ -11,7 +11,8 @@ export default {
|
|
|
11
11
|
tags: ['ui'],
|
|
12
12
|
experimental: false,
|
|
13
13
|
figmaURL: 'https://www.figma.com/design/xJz8Z6vfrnZPKTtRbuT2W8/Composants?node-id=1002-547',
|
|
14
|
-
description: "Menu contextuel affichant une liste d'actions sous forme de liste de liens.",
|
|
14
|
+
description: "Menu contextuel affichant une liste d'actions sous forme de liste de liens. Utilise le composant [Popover](https://alveole.captive.fr/components/Popover) pour faire apparaître le menu.",
|
|
15
|
+
shortDescription: "Menu contextuel affichant une liste d'actions sous forme de liste de liens.",
|
|
15
16
|
component: ActionMenu,
|
|
16
17
|
webOnly: true,
|
|
17
18
|
styleFn: () => '',
|
|
@@ -3,7 +3,8 @@ import { PressableProps, View } from 'react-native';
|
|
|
3
3
|
import { BoxProps } from '../../core';
|
|
4
4
|
import { IconProps } from '../LucideIcon';
|
|
5
5
|
export type ButtonProps = Omit<PressableProps, 'children' | 'style'> & {
|
|
6
|
-
title
|
|
6
|
+
/** Sans `title`, le bouton passe en mode icône seule (nécessite `startIcon` ou `endIcon`). */
|
|
7
|
+
title?: string;
|
|
7
8
|
size?: 'xs' | 'sm' | 'md' | 'lg';
|
|
8
9
|
variant: 'primary' | 'secondary' | 'tertiary' | 'danger' | 'link';
|
|
9
10
|
startIcon?: IconProps['name'];
|
|
@@ -19,7 +20,8 @@ export type ButtonProps = Omit<PressableProps, 'children' | 'style'> & {
|
|
|
19
20
|
isLoading?: boolean;
|
|
20
21
|
};
|
|
21
22
|
export declare const Button: React.ForwardRefExoticComponent<Omit<PressableProps, "children" | "style"> & {
|
|
22
|
-
title
|
|
23
|
+
/** Sans `title`, le bouton passe en mode icône seule (nécessite `startIcon` ou `endIcon`). */
|
|
24
|
+
title?: string;
|
|
23
25
|
size?: "xs" | "sm" | "md" | "lg";
|
|
24
26
|
variant: "primary" | "secondary" | "tertiary" | "danger" | "link";
|
|
25
27
|
startIcon?: IconProps["name"];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAC7C,OAAO,EAAa,cAAc,EAA8B,IAAI,EAAE,MAAM,cAAc,CAAC;AAC3F,OAAO,EAAO,QAAQ,EAAc,MAAM,YAAY,CAAC;AACvD,OAAO,EAAE,SAAS,EAAc,MAAM,eAAe,CAAC;AAQtD,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,EAAE,UAAU,GAAG,OAAO,CAAC,GAAG;IACrE,KAAK,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAC7C,OAAO,EAAa,cAAc,EAA8B,IAAI,EAAE,MAAM,cAAc,CAAC;AAC3F,OAAO,EAAO,QAAQ,EAAc,MAAM,YAAY,CAAC;AACvD,OAAO,EAAE,SAAS,EAAc,MAAM,eAAe,CAAC;AAQtD,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,EAAE,UAAU,GAAG,OAAO,CAAC,GAAG;IACrE,8FAA8F;IAC9F,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACjC,OAAO,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,QAAQ,GAAG,MAAM,CAAC;IAClE,SAAS,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IAC9B,OAAO,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,cAAc,CAAC,EAAE,QAAQ,CAAC;IAC1B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC3B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,MAAM;IAjBjB,8FAA8F;YACtF,MAAM;WACP,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI;aACvB,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,QAAQ,GAAG,MAAM;gBACrD,SAAS,CAAC,MAAM,CAAC;cACnB,SAAS,CAAC,MAAM,CAAC;eAChB,OAAO;qBACD,QAAQ;gBACb,OAAO;gBACP,OAAO;iBACN,OAAO;gBACR,OAAO;WACZ,QAAQ,GAAG,QAAQ;aACjB,OAAO;gBACJ,OAAO;8BAgQnB,CAAC"}
|
package/dist/ui/Button/Button.js
CHANGED
|
@@ -9,26 +9,35 @@ export const Button = React.forwardRef(function Button(props, ref) {
|
|
|
9
9
|
const { title, type, size, variant, disabled, startIcon, endIcon, noPadding, borderNone, leftAlign, isLoading, selected, fullWidth = false, ContainerProps = {}, active = false, ...buttonProps } = props;
|
|
10
10
|
const { style, hoverStyle, ...containerProps } = ContainerProps;
|
|
11
11
|
const styles = useStyles();
|
|
12
|
-
const
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
? styles.
|
|
16
|
-
: size === '
|
|
17
|
-
? styles.
|
|
18
|
-
:
|
|
12
|
+
const isIconOnly = !title;
|
|
13
|
+
const containerSize = isIconOnly
|
|
14
|
+
? size === 'sm'
|
|
15
|
+
? styles.smContainerIconOnly
|
|
16
|
+
: size === 'lg'
|
|
17
|
+
? styles.lgContainerIconOnly
|
|
18
|
+
: size === 'xs'
|
|
19
|
+
? styles.xsContainerIconOnly
|
|
20
|
+
: styles.mdContainerIconOnly
|
|
21
|
+
: size === 'sm'
|
|
22
|
+
? styles.smContainer
|
|
23
|
+
: size === 'lg'
|
|
24
|
+
? styles.lgContainer
|
|
25
|
+
: size === 'xs'
|
|
26
|
+
? styles.xsContainer
|
|
27
|
+
: styles.mdContainer;
|
|
19
28
|
const titleSize = size === 'sm' ? styles.smTitle : size === 'lg' ? styles.lgTitle : size === 'xs' ? styles.xsTitle : styles.mdTitle;
|
|
20
29
|
const noPaddingStyle = { paddingTop: 0, paddingBottom: 0, paddingLeft: 0, paddingRight: 0 };
|
|
21
30
|
const buttonContainerStyle = (state) => {
|
|
22
31
|
let applicableStyles = {
|
|
23
32
|
...styles.container,
|
|
24
|
-
...(startIcon
|
|
33
|
+
...(startIcon && !isIconOnly
|
|
25
34
|
? size === 'sm'
|
|
26
35
|
? styles.smContainerStartIcon
|
|
27
36
|
: size === 'lg'
|
|
28
37
|
? styles.lgContainerStartIcon
|
|
29
38
|
: styles.mdContainerStartIcon
|
|
30
39
|
: {}),
|
|
31
|
-
...(endIcon
|
|
40
|
+
...(endIcon && !isIconOnly
|
|
32
41
|
? size === 'sm'
|
|
33
42
|
? styles.smContainerEndIcon
|
|
34
43
|
: size === 'lg'
|
|
@@ -238,5 +247,5 @@ export const Button = React.forwardRef(function Button(props, ref) {
|
|
|
238
247
|
...(fullWidth ? { width: '100%' } : {}),
|
|
239
248
|
};
|
|
240
249
|
};
|
|
241
|
-
return (_jsx(Pressable, { ref: ref, disabled: disabled, accessibilityRole: "button", ...(type === 'submit' ? { 'aria-selected': true } : {}), ...buttonProps, style: (state) => getPressableStyle(state), children: (state) => (_jsxs(Box, { style: [buttonContainerStyle({ pressed: state.pressed }), style], hoverStyle: { ...buttonContainerHoverStyle(), ...hoverStyle }, ...containerProps, children: [startIcon && _jsx(LucideIcon, { name: startIcon, ...iconStyle({ hovered: !!state.hovered }) }), _jsx(Typography, { "user-select": "false", style: textStyle({ hovered: !!state.hovered, pressed: !!state.pressed }), children: title }), isLoading ? (_jsx(Spinner, { size: "sm", delay: "long", style: styles.buttonLoader })) : (endIcon && _jsx(LucideIcon, { name: endIcon, ...iconStyle({ hovered: !!state.hovered }) }))] })) }));
|
|
250
|
+
return (_jsx(Pressable, { ref: ref, disabled: disabled, accessibilityRole: "button", ...(type === 'submit' ? { 'aria-selected': true } : {}), ...buttonProps, style: (state) => getPressableStyle(state), children: (state) => (_jsxs(Box, { style: [buttonContainerStyle({ pressed: state.pressed }), style], hoverStyle: { ...buttonContainerHoverStyle(), ...hoverStyle }, ...containerProps, children: [startIcon && _jsx(LucideIcon, { name: startIcon, ...iconStyle({ hovered: !!state.hovered }) }), !isIconOnly && (_jsx(Typography, { "user-select": "false", style: textStyle({ hovered: !!state.hovered, pressed: !!state.pressed }), children: title })), isLoading ? (_jsx(Spinner, { size: "sm", delay: "long", style: styles.buttonLoader })) : (endIcon && _jsx(LucideIcon, { name: endIcon, ...iconStyle({ hovered: !!state.hovered }) }))] })) }));
|
|
242
251
|
});
|
|
@@ -6,7 +6,7 @@ declare const _default: {
|
|
|
6
6
|
figmaURL: string;
|
|
7
7
|
description: string;
|
|
8
8
|
component: React.ForwardRefExoticComponent<Omit<import("react-native").PressableProps, "children" | "style"> & {
|
|
9
|
-
title
|
|
9
|
+
title?: string;
|
|
10
10
|
size?: "xs" | "sm" | "md" | "lg";
|
|
11
11
|
variant: "primary" | "secondary" | "tertiary" | "danger" | "link";
|
|
12
12
|
startIcon?: import("..").IconProps["name"];
|
|
@@ -173,6 +173,9 @@ declare const _default: {
|
|
|
173
173
|
paddingTop: string | number;
|
|
174
174
|
paddingBottom: string | number;
|
|
175
175
|
};
|
|
176
|
+
xsContainerIconOnly: {
|
|
177
|
+
padding: string | number;
|
|
178
|
+
};
|
|
176
179
|
smContainerIconOnly: {
|
|
177
180
|
padding: string | number;
|
|
178
181
|
};
|
|
@@ -313,6 +316,8 @@ export declare const Danger: () => React.JSX.Element;
|
|
|
313
316
|
/** @deprecated Préférer les variants `primary`, `secondary` ou `tertiary`. */
|
|
314
317
|
export declare const Link: () => React.JSX.Element;
|
|
315
318
|
export declare const Icons: () => React.JSX.Element;
|
|
319
|
+
/** Sans `title`, le bouton passe en mode icône seule (padding carré, pas de texte). */
|
|
320
|
+
export declare const IconOnly: () => React.JSX.Element;
|
|
316
321
|
export declare const FullWidth: () => React.JSX.Element;
|
|
317
322
|
export declare const Selected: () => React.JSX.Element;
|
|
318
323
|
/** Utilisé quand le bouton est actif (ex : quand un menu est ouvert). */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC
|
|
1
|
+
{"version":3,"file":"Button.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAO1B,wBAQkB;AAElB,eAAO,MAAM,KAAK,yBAMjB,CAAC;AAEF,eAAO,MAAM,OAAO,yBAKnB,CAAC;AAEF,eAAO,MAAM,SAAS,yBAKrB,CAAC;AAEF,eAAO,MAAM,QAAQ,yBAKpB,CAAC;AAEF,eAAO,MAAM,MAAM,yBAKlB,CAAC;AAEF,8EAA8E;AAC9E,eAAO,MAAM,IAAI,yBAMhB,CAAC;AAEF,eAAO,MAAM,KAAK,yBAQjB,CAAC;AAEF,uFAAuF;AACvF,eAAO,MAAM,QAAQ,yBAQpB,CAAC;AAEF,eAAO,MAAM,SAAS,yBAAkE,CAAC;AAEzF,eAAO,MAAM,QAAQ,yBAIpB,CAAC;AAEF,yEAAyE;AACzE,eAAO,MAAM,MAAM,yBAIlB,CAAC;AAEF;;;;;;;;GAQG;AACH,eAAO,MAAM,OAAO,yBASnB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,0BAA0B,CAAC"}
|
|
@@ -21,6 +21,8 @@ export const Danger = () => (_jsxs(Box, { display: "flex", flexDirection: "row",
|
|
|
21
21
|
/** @deprecated Préférer les variants `primary`, `secondary` ou `tertiary`. */
|
|
22
22
|
export const Link = () => (_jsxs(Box, { display: "flex", flexDirection: "row", gap: 4, children: [_jsx(Button, { variant: "link", title: "Bouton link" }), _jsx(Button, { variant: "link", title: "Disabled", disabled: true }), _jsx(Button, { variant: "link", title: "Disabled", disabled: true, startIcon: "Pen" })] }));
|
|
23
23
|
export const Icons = () => (_jsxs(Box, { display: "flex", flexDirection: "row", gap: 4, children: [_jsx(Button, { variant: "primary", title: "Start Icon", startIcon: "Plus" }), _jsx(Button, { variant: "primary", title: "End Icon", endIcon: "Plus" }), _jsx(Button, { variant: "primary", title: "End Icon", endIcon: "Plus" }), _jsx(ButtonIcon, { variant: "primary", icon: "CircleUser" }), _jsx(ButtonIcon, { variant: "primary", icon: "CircleUser" })] }));
|
|
24
|
+
/** Sans `title`, le bouton passe en mode icône seule (padding carré, pas de texte). */
|
|
25
|
+
export const IconOnly = () => (_jsxs(Box, { display: "flex", flexDirection: "row", gap: 4, style: { alignItems: 'center' }, children: [_jsx(Button, { variant: "tertiary", size: "sm", startIcon: "MoreHorizontal", accessibilityLabel: "Plus d'actions" }), _jsx(Button, { variant: "tertiary", size: "md", startIcon: "MoreHorizontal", accessibilityLabel: "Plus d'actions" }), _jsx(Button, { variant: "tertiary", size: "lg", startIcon: "MoreHorizontal", accessibilityLabel: "Plus d'actions" }), _jsx(Button, { variant: "secondary", size: "sm", startIcon: "Trash", accessibilityLabel: "Supprimer" }), _jsx(Button, { variant: "tertiary", size: "sm", startIcon: "MoreHorizontal", selected: true, accessibilityLabel: "Plus d'actions" })] }));
|
|
24
26
|
export const FullWidth = () => _jsx(Button, { variant: "primary", title: "Full Width", fullWidth: true });
|
|
25
27
|
export const Selected = () => (_jsx(Box, { display: "flex", flexDirection: "row", gap: 4, children: _jsx(Button, { variant: "secondary", title: "Selected", selected: true }) }));
|
|
26
28
|
/** Utilisé quand le bouton est actif (ex : quand un menu est ouvert). */
|
|
@@ -5,6 +5,7 @@ export declare const Tertiary: () => string;
|
|
|
5
5
|
export declare const Danger: () => string;
|
|
6
6
|
export declare const Link: () => string;
|
|
7
7
|
export declare const Icons: () => string;
|
|
8
|
+
export declare const IconOnly: () => string;
|
|
8
9
|
export declare const FullWidth: () => string;
|
|
9
10
|
export declare const Selected: () => string;
|
|
10
11
|
export declare const Active: () => string;
|
|
@@ -17,6 +18,7 @@ export declare const storySources: {
|
|
|
17
18
|
readonly Danger: () => string;
|
|
18
19
|
readonly Link: () => string;
|
|
19
20
|
readonly Icons: () => string;
|
|
21
|
+
readonly IconOnly: () => string;
|
|
20
22
|
readonly FullWidth: () => string;
|
|
21
23
|
readonly Selected: () => string;
|
|
22
24
|
readonly Active: () => string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,KAAK,cAAoW,CAAC;AAEvX,eAAO,MAAM,OAAO,cAA4O,CAAC;AAEjQ,eAAO,MAAM,SAAS,cAAoP,CAAC;AAE3Q,eAAO,MAAM,QAAQ,cAAgP,CAAC;AAEtQ,eAAO,MAAM,MAAM,cAAwO,CAAC;AAE5P,eAAO,MAAM,IAAI,cAA+S,CAAC;AAEjU,eAAO,MAAM,KAAK,cAAic,CAAC;AAEpd,eAAO,MAAM,SAAS,cAAwG,CAAC;AAE/H,eAAO,MAAM,QAAQ,cAAkL,CAAC;AAExM,eAAO,MAAM,MAAM,cAA+I,CAAC;AAEnK,eAAO,MAAM,OAAO,cAAyU,CAAC;AAE9V,eAAO,MAAM,YAAY
|
|
1
|
+
{"version":3,"file":"Button.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,KAAK,cAAoW,CAAC;AAEvX,eAAO,MAAM,OAAO,cAA4O,CAAC;AAEjQ,eAAO,MAAM,SAAS,cAAoP,CAAC;AAE3Q,eAAO,MAAM,QAAQ,cAAgP,CAAC;AAEtQ,eAAO,MAAM,MAAM,cAAwO,CAAC;AAE5P,eAAO,MAAM,IAAI,cAA+S,CAAC;AAEjU,eAAO,MAAM,KAAK,cAAic,CAAC;AAEpd,eAAO,MAAM,QAAQ,cAAitB,CAAC;AAEvuB,eAAO,MAAM,SAAS,cAAwG,CAAC;AAE/H,eAAO,MAAM,QAAQ,cAAkL,CAAC;AAExM,eAAO,MAAM,MAAM,cAA+I,CAAC;AAEnK,eAAO,MAAM,OAAO,cAAyU,CAAC;AAE9V,eAAO,MAAM,YAAY;;;;;;;;;;;;;CAaf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC;AAExD,eAAO,MAAM,iBAAiB,EAAE,OAAO,CAAC,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,CAKtE,CAAC"}
|
|
@@ -7,6 +7,7 @@ export const Tertiary = () => "export const Tertiary = () => (\n <Box display=\
|
|
|
7
7
|
export const Danger = () => "export const Danger = () => (\n <Box display=\"flex\" flexDirection=\"row\" gap={4}>\n <Button variant=\"danger\" title=\"Bouton danger\" />\n <Button variant=\"danger\" title=\"Disabled\" disabled />\n </Box>\n);";
|
|
8
8
|
export const Link = () => "export const Link = () => (\n <Box display=\"flex\" flexDirection=\"row\" gap={4}>\n <Button variant=\"link\" title=\"Bouton link\" />\n <Button variant=\"link\" title=\"Disabled\" disabled />\n <Button variant=\"link\" title=\"Disabled\" disabled startIcon=\"Pen\" />\n </Box>\n);";
|
|
9
9
|
export const Icons = () => "export const Icons = () => (\n <Box display=\"flex\" flexDirection=\"row\" gap={4}>\n <Button variant=\"primary\" title=\"Start Icon\" startIcon=\"Plus\" />\n <Button variant=\"primary\" title=\"End Icon\" endIcon=\"Plus\" />\n <Button variant=\"primary\" title=\"End Icon\" endIcon=\"Plus\" />\n <ButtonIcon variant=\"primary\" icon=\"CircleUser\" />\n <ButtonIcon variant=\"primary\" icon=\"CircleUser\" />\n </Box>\n);";
|
|
10
|
+
export const IconOnly = () => "export const IconOnly = () => (\n <Box display=\"flex\" flexDirection=\"row\" gap={4} style={{ alignItems: 'center' }}>\n <Button variant=\"tertiary\" size=\"sm\" startIcon=\"MoreHorizontal\" accessibilityLabel=\"Plus d'actions\" />\n <Button variant=\"tertiary\" size=\"md\" startIcon=\"MoreHorizontal\" accessibilityLabel=\"Plus d'actions\" />\n <Button variant=\"tertiary\" size=\"lg\" startIcon=\"MoreHorizontal\" accessibilityLabel=\"Plus d'actions\" />\n <Button variant=\"secondary\" size=\"sm\" startIcon=\"Trash\" accessibilityLabel=\"Supprimer\" />\n <Button variant=\"tertiary\" size=\"sm\" startIcon=\"MoreHorizontal\" selected accessibilityLabel=\"Plus d'actions\" />\n </Box>\n);";
|
|
10
11
|
export const FullWidth = () => "export const FullWidth = () => <Button variant=\"primary\" title=\"Full Width\" fullWidth />;";
|
|
11
12
|
export const Selected = () => "export const Selected = () => (\n <Box display=\"flex\" flexDirection=\"row\" gap={4}>\n <Button variant=\"secondary\" title=\"Selected\" selected />\n </Box>\n);";
|
|
12
13
|
export const Active = () => "export const Active = () => (\n <Box display=\"block\">\n <Button variant=\"secondary\" title=\"Active\" active />\n </Box>\n);";
|
|
@@ -19,6 +20,7 @@ export const storySources = {
|
|
|
19
20
|
Danger,
|
|
20
21
|
Link,
|
|
21
22
|
Icons,
|
|
23
|
+
IconOnly,
|
|
22
24
|
FullWidth,
|
|
23
25
|
Selected,
|
|
24
26
|
Active,
|
|
@@ -26,6 +28,7 @@ export const storySources = {
|
|
|
26
28
|
};
|
|
27
29
|
export const storyDescriptions = {
|
|
28
30
|
Link: "@deprecated Préférer les variants `primary`, `secondary` ou `tertiary`.",
|
|
31
|
+
IconOnly: "Sans `title`, le bouton passe en mode icône seule (padding carré, pas de texte).",
|
|
29
32
|
Active: "Utilisé quand le bouton est actif (ex : quand un menu est ouvert).",
|
|
30
33
|
Loading: "Le spinner n'apparaît qu'après **1 000 ms** (`delay=\"long\"`).\n\nCe délai évite un clignotement visuel quand l'opération se termine rapidement :\nsi le serveur répond en moins d'une seconde, l'utilisateur ne voit jamais le spinner.\nAu-delà, le spinner s'affiche pour signaler que l'attente va durer.\n\nAppuyez sur le bouton pour simuler une opération de 3 secondes.",
|
|
31
34
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.styles.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS
|
|
1
|
+
{"version":3,"file":"Button.styles.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoRnB,CAAC"}
|
|
@@ -153,6 +153,9 @@ export const useStyles = makeStyles(({ text, color, spacing, spacingValue, radiu
|
|
|
153
153
|
paddingTop: spacing('3V'),
|
|
154
154
|
paddingBottom: spacing('3V'),
|
|
155
155
|
},
|
|
156
|
+
xsContainerIconOnly: {
|
|
157
|
+
padding: spacing('050'),
|
|
158
|
+
},
|
|
156
159
|
smContainerIconOnly: {
|
|
157
160
|
padding: spacing('1W'),
|
|
158
161
|
},
|
|
@@ -12,7 +12,8 @@ export declare const Checkbox: React.ForwardRefExoticComponent<import("tamagui")
|
|
|
12
12
|
size?: import("tamagui").SizeTokens;
|
|
13
13
|
unstyled?: boolean;
|
|
14
14
|
} & {
|
|
15
|
-
|
|
15
|
+
size?: import("./Checkbox.utils").CheckboxSize;
|
|
16
|
+
variant?: import("./Checkbox.utils").CheckboxVariant;
|
|
16
17
|
error?: string;
|
|
17
18
|
success?: string;
|
|
18
19
|
} & CheckboxIndicatorProps & CheckboxLabelProps & React.RefAttributes<import("tamagui").TamaguiElement>>;
|
|
@@ -1 +1 @@
|
|
|
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
|
|
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;;;;;;;;;;;;;wGAsBnB,CAAC"}
|
|
@@ -7,11 +7,10 @@ import { CheckboxContainer } from './CheckboxContainer';
|
|
|
7
7
|
import { CheckboxIndicator } from './CheckboxIndicator';
|
|
8
8
|
import { CheckboxLabel } from './CheckboxLabel';
|
|
9
9
|
export const Checkbox = React.forwardRef(function Checkbox(props, ref) {
|
|
10
|
-
const { variant, label, error, success, disabled, onCheckedChange } = props;
|
|
11
|
-
const baseProps = { variant, label, error, success, disabled, onCheckedChange };
|
|
10
|
+
const { size, variant, label, error, success, disabled, onCheckedChange } = props;
|
|
11
|
+
const baseProps = { size, variant, label, error, success, disabled, onCheckedChange };
|
|
12
12
|
const { spacingValue } = useTheme();
|
|
13
13
|
const styles = useStyles();
|
|
14
|
-
const
|
|
15
|
-
const id = `checkbox--${variant}--${uniqId}`;
|
|
14
|
+
const id = useId();
|
|
16
15
|
return (_jsxs(Box, { tag: "check-box-container", gap: error || success ? spacingValue('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 })] }));
|
|
17
16
|
});
|
|
@@ -12,7 +12,8 @@ declare const _default: {
|
|
|
12
12
|
size?: import("tamagui").SizeTokens;
|
|
13
13
|
unstyled?: boolean;
|
|
14
14
|
} & {
|
|
15
|
-
|
|
15
|
+
size?: import("./Checkbox.utils").CheckboxSize;
|
|
16
|
+
variant?: import("./Checkbox.utils").CheckboxVariant;
|
|
16
17
|
error?: string;
|
|
17
18
|
success?: string;
|
|
18
19
|
} & import("./CheckboxIndicator").CheckboxIndicatorProps & import("./CheckboxLabel").CheckboxLabelProps & import("react").RefAttributes<import("tamagui").TamaguiElement>>;
|
|
@@ -88,6 +89,6 @@ declare const _default: {
|
|
|
88
89
|
};
|
|
89
90
|
export default _default;
|
|
90
91
|
export declare const Default: () => import("react").JSX.Element;
|
|
91
|
-
export declare const
|
|
92
|
+
export declare const Sizes: () => import("react").JSX.Element;
|
|
92
93
|
export * as Sources from './Checkbox.stories.sources';
|
|
93
94
|
//# sourceMappingURL=Checkbox.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Checkbox/Checkbox.stories.tsx"],"names":[],"mappings":"
|
|
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,KAAK,mCAKjB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,4BAA4B,CAAC"}
|
|
@@ -11,5 +11,5 @@ export default {
|
|
|
11
11
|
styleFn: useStyles,
|
|
12
12
|
};
|
|
13
13
|
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" })] }));
|
|
14
|
-
export const
|
|
14
|
+
export const Sizes = () => (_jsxs(Box, { display: "flex", flexDirection: "row", gap: 16, children: [_jsx(Checkbox, { label: "Size MD", size: "md" }), _jsx(Checkbox, { label: "Size SM", size: "sm" })] }));
|
|
15
15
|
export * as Sources from './Checkbox.stories.sources';
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
export declare const Default: () => string;
|
|
2
|
-
export declare const
|
|
2
|
+
export declare const Sizes: () => string;
|
|
3
3
|
export declare const storySources: {
|
|
4
4
|
readonly Default: () => string;
|
|
5
|
-
readonly
|
|
5
|
+
readonly Sizes: () => string;
|
|
6
6
|
};
|
|
7
7
|
export type StorySourceName = keyof typeof storySources;
|
|
8
8
|
//# sourceMappingURL=Checkbox.stories.sources.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
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,
|
|
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,KAAK,cAA8M,CAAC;AAEjO,eAAO,MAAM,YAAY;;;CAGf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
// This file is generated. Do not edit manually.
|
|
2
2
|
// Source: src/ui/Checkbox/Checkbox.stories.tsx
|
|
3
3
|
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);";
|
|
4
|
-
export const
|
|
4
|
+
export const Sizes = () => "export const Sizes = () => (\n <Box display=\"flex\" flexDirection=\"row\" gap={16}>\n <Checkbox label=\"Size MD\" size=\"md\" />\n <Checkbox label=\"Size SM\" size=\"sm\" />\n </Box>\n);";
|
|
5
5
|
export const storySources = {
|
|
6
6
|
Default,
|
|
7
|
-
|
|
7
|
+
Sizes,
|
|
8
8
|
};
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
export type CheckboxSize = 'sm' | 'md';
|
|
2
|
+
/** @deprecated use `size` ('sm' | 'md') instead */
|
|
3
|
+
export type CheckboxVariant = 'small' | 'medium';
|
|
4
|
+
export declare const resolveCheckboxSize: (size?: CheckboxSize, variant?: CheckboxVariant) => CheckboxSize;
|
|
5
|
+
//# sourceMappingURL=Checkbox.utils.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Checkbox.utils.d.ts","sourceRoot":"","sources":["../../../src/ui/Checkbox/Checkbox.utils.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG,IAAI,CAAC;AAEvC,mDAAmD;AACnD,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,QAAQ,CAAC;AAEjD,eAAO,MAAM,mBAAmB,GAAI,OAAO,YAAY,EAAE,UAAU,eAAe,KAAG,YAIpF,CAAC"}
|
|
@@ -1,8 +1,11 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { CheckboxProps as TamaguiCheckboxProps, TamaguiElement } from 'tamagui';
|
|
3
|
+
import { CheckboxSize, CheckboxVariant } from './Checkbox.utils';
|
|
3
4
|
export type CheckboxElement = TamaguiElement;
|
|
4
5
|
export type CheckboxContainerProps = TamaguiCheckboxProps & {
|
|
5
|
-
|
|
6
|
+
size?: CheckboxSize;
|
|
7
|
+
/** @deprecated use `size` ('sm' | 'md') instead */
|
|
8
|
+
variant?: CheckboxVariant;
|
|
6
9
|
error?: string;
|
|
7
10
|
success?: string;
|
|
8
11
|
};
|
|
@@ -15,7 +18,9 @@ export declare const CheckboxContainer: React.ForwardRefExoticComponent<import("
|
|
|
15
18
|
size?: import("tamagui").SizeTokens;
|
|
16
19
|
unstyled?: boolean;
|
|
17
20
|
} & {
|
|
18
|
-
|
|
21
|
+
size?: CheckboxSize;
|
|
22
|
+
/** @deprecated use `size` ('sm' | 'md') instead */
|
|
23
|
+
variant?: CheckboxVariant;
|
|
19
24
|
error?: string;
|
|
20
25
|
success?: string;
|
|
21
26
|
} & React.RefAttributes<TamaguiElement>>;
|
|
@@ -1 +1 @@
|
|
|
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;
|
|
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;AAE7G,OAAO,EAAE,YAAY,EAAE,eAAe,EAAuB,MAAM,kBAAkB,CAAC;AAEtF,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC;AAC7C,MAAM,MAAM,sBAAsB,GAAG,oBAAoB,GAAG;IAC1D,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,mDAAmD;IACnD,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,iBAAiB;;;;;;;;;WAPrB,YAAY;IACnB,mDAAmD;cACzC,eAAe;YACjB,MAAM;cACJ,MAAM;wCAqCjB,CAAC"}
|
|
@@ -2,10 +2,12 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import { Checkbox as TamaguiCheckbox } from 'tamagui';
|
|
4
4
|
import { useStyles } from './Checkbox.styles';
|
|
5
|
+
import { resolveCheckboxSize } from './Checkbox.utils';
|
|
5
6
|
export const CheckboxContainer = React.forwardRef(function Checkbox(props, ref) {
|
|
6
|
-
const { variant, error, success, disabled, ...checkboxProps } = props;
|
|
7
|
+
const { size, variant, error, success, disabled, ...checkboxProps } = props;
|
|
7
8
|
const styles = useStyles();
|
|
8
|
-
const
|
|
9
|
+
const resolvedSize = resolveCheckboxSize(size, variant);
|
|
10
|
+
const baseCheckboxStyles = { ...styles.checkbox, ...(resolvedSize === 'sm' ? styles.checkboxSm : {}) };
|
|
9
11
|
const checkboxStyles = {
|
|
10
12
|
...baseCheckboxStyles,
|
|
11
13
|
...(disabled ? styles.checkboxDisabled : {}),
|
|
@@ -1,5 +1,8 @@
|
|
|
1
|
+
import { CheckboxSize, CheckboxVariant } from './Checkbox.utils';
|
|
1
2
|
export type CheckboxIndicatorProps = {
|
|
2
|
-
|
|
3
|
+
size?: CheckboxSize;
|
|
4
|
+
/** @deprecated use `size` ('sm' | 'md') instead */
|
|
5
|
+
variant?: CheckboxVariant;
|
|
3
6
|
indeterminate?: boolean;
|
|
4
7
|
disabled?: boolean;
|
|
5
8
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxIndicator.d.ts","sourceRoot":"","sources":["../../../src/ui/Checkbox/CheckboxIndicator.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"CheckboxIndicator.d.ts","sourceRoot":"","sources":["../../../src/ui/Checkbox/CheckboxIndicator.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,YAAY,EAAE,eAAe,EAAuB,MAAM,kBAAkB,CAAC;AAEtF,MAAM,MAAM,sBAAsB,GAAG;IACnC,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,mDAAmD;IACnD,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,OAAO,sBAAsB,gCAwB9D,CAAC"}
|
|
@@ -3,13 +3,15 @@ import { LucideIcon } from '@alveole/components';
|
|
|
3
3
|
import { useTheme } from '@alveole/theme';
|
|
4
4
|
import { Checkbox as TamaguiCheckbox } from 'tamagui';
|
|
5
5
|
import { useStyles } from './Checkbox.styles';
|
|
6
|
+
import { resolveCheckboxSize } from './Checkbox.utils';
|
|
6
7
|
export const CheckboxIndicator = (props) => {
|
|
7
|
-
const { variant, disabled, indeterminate } = props;
|
|
8
|
+
const { size, variant, disabled, indeterminate } = props;
|
|
8
9
|
const { color } = useTheme();
|
|
9
10
|
const styles = useStyles();
|
|
11
|
+
const resolvedSize = resolveCheckboxSize(size, variant);
|
|
10
12
|
return (_jsx(TamaguiCheckbox.Indicator, { style: {
|
|
11
13
|
...styles.indicator,
|
|
12
|
-
...(
|
|
14
|
+
...(resolvedSize === 'sm' ? styles.checkboxSm : {}),
|
|
13
15
|
...(disabled ? styles.indicatorDisabled : {}),
|
|
14
|
-
}, children: _jsx(LucideIcon, { size:
|
|
16
|
+
}, children: _jsx(LucideIcon, { size: resolvedSize === 'sm' ? 'xs' : 'sm', name: indeterminate ? 'Minus' : 'Check', color: disabled ? color.text['default-grey'] : '#FFFFFF', style: { margin: 'auto' } }) }));
|
|
15
17
|
};
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
import { LabelProps } from 'tamagui';
|
|
2
|
+
import { CheckboxSize, CheckboxVariant } from './Checkbox.utils';
|
|
2
3
|
export type CheckboxLabelProps = {
|
|
3
|
-
|
|
4
|
+
size?: CheckboxSize;
|
|
5
|
+
/** @deprecated use `size` ('sm' | 'md') instead */
|
|
6
|
+
variant?: CheckboxVariant;
|
|
4
7
|
label?: string;
|
|
5
8
|
error?: string;
|
|
6
9
|
success?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxLabel.d.ts","sourceRoot":"","sources":["../../../src/ui/Checkbox/CheckboxLabel.tsx"],"names":[],"mappings":"AACA,OAAO,EAAS,UAAU,EAAE,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"CheckboxLabel.d.ts","sourceRoot":"","sources":["../../../src/ui/Checkbox/CheckboxLabel.tsx"],"names":[],"mappings":"AACA,OAAO,EAAS,UAAU,EAAE,MAAM,SAAS,CAAC;AAE5C,OAAO,EAAE,YAAY,EAAE,eAAe,EAAuB,MAAM,kBAAkB,CAAC;AAEtF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,mDAAmD;IACnD,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,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,gCAuBnE,CAAC"}
|
|
@@ -2,12 +2,14 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import { Typography } from '@alveole/components';
|
|
3
3
|
import { Label } from 'tamagui';
|
|
4
4
|
import { useStyles } from './Checkbox.styles';
|
|
5
|
+
import { resolveCheckboxSize } from './Checkbox.utils';
|
|
5
6
|
export const CheckboxLabel = (props) => {
|
|
6
|
-
const { variant, disabled, error, success, label, ...labelProps } = props;
|
|
7
|
+
const { size, variant, disabled, error, success, label, ...labelProps } = props;
|
|
7
8
|
const styles = useStyles();
|
|
9
|
+
const resolvedSize = resolveCheckboxSize(size, variant);
|
|
8
10
|
return (_jsx(Label, { unstyled: true, disabled: disabled, ...labelProps, width: '100%', children: _jsx(Typography, { style: {
|
|
9
11
|
...styles.label,
|
|
10
|
-
...(
|
|
12
|
+
...(resolvedSize === 'sm' ? styles.labelSm : {}),
|
|
11
13
|
...(disabled ? styles.labelDisabled : {}),
|
|
12
14
|
...(success ? styles.labelSuccess : {}),
|
|
13
15
|
...(error ? styles.labelError : {}),
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { DataTableColumn, DataTableSize, DataTableSort } from './DataTable.types';
|
|
3
|
+
export type DataTableProps<Row> = {
|
|
4
|
+
columns: DataTableColumn<Row>[];
|
|
5
|
+
data: Row[];
|
|
6
|
+
keyExtractor: (row: Row, index: number) => string;
|
|
7
|
+
/** Densité du tableau : influence les paddings des cellules. @default 'sm' */
|
|
8
|
+
size?: DataTableSize;
|
|
9
|
+
selectable?: boolean;
|
|
10
|
+
/** Contrôlé : clés des lignes sélectionnées. Sans valeur, la sélection est gérée en interne. */
|
|
11
|
+
selectedKeys?: string[];
|
|
12
|
+
onSelectionChange?: (keys: string[]) => void;
|
|
13
|
+
/** Contrôlé : colonne/direction de tri actives. Sans valeur, le tri est géré en interne (non appliqué aux données, voir `onSortChange`). */
|
|
14
|
+
sort?: DataTableSort | null;
|
|
15
|
+
onSortChange?: (sort: DataTableSort | null) => void;
|
|
16
|
+
onRowPress?: (row: Row, index: number) => void;
|
|
17
|
+
/**
|
|
18
|
+
* Masque la ligne d'en-têtes de colonnes (labels, icônes de tri, case "tout sélectionner").
|
|
19
|
+
* Le tri reste utilisable via `sort`/`onSortChange` piloté depuis l'extérieur (ex. un menu).
|
|
20
|
+
*/
|
|
21
|
+
hideHeader?: boolean;
|
|
22
|
+
renderNoContent?: () => React.ReactNode;
|
|
23
|
+
/** Rendu en bas du tableau, typiquement un <DataTableFooter/> avec compteur + <DataTablePagination/>. */
|
|
24
|
+
footer?: React.ReactNode;
|
|
25
|
+
};
|
|
26
|
+
export declare const DataTable: <Row>(props: DataTableProps<Row>) => React.JSX.Element;
|
|
27
|
+
//# sourceMappingURL=DataTable.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../src/ui/DataTable/DataTable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAE,eAAe,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAgBlF,MAAM,MAAM,cAAc,CAAC,GAAG,IAAI;IAChC,OAAO,EAAE,eAAe,CAAC,GAAG,CAAC,EAAE,CAAC;IAChC,IAAI,EAAE,GAAG,EAAE,CAAC;IACZ,YAAY,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAElD,8EAA8E;IAC9E,IAAI,CAAC,EAAE,aAAa,CAAC;IAErB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,gGAAgG;IAChG,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAE7C,4IAA4I;IAC5I,IAAI,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC;IAC5B,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,aAAa,GAAG,IAAI,KAAK,IAAI,CAAC;IAEpD,UAAU,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAE/C;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,eAAe,CAAC,EAAE,MAAM,KAAK,CAAC,SAAS,CAAC;IAExC,yGAAyG;IACzG,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,GAAG,EAAG,OAAO,cAAc,CAAC,GAAG,CAAC,sBAiHzD,CAAC"}
|