@alveole/components 0.14.3 → 0.14.4
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/ui/Button/Button.d.ts +2 -0
- package/dist/ui/Button/Button.d.ts.map +1 -1
- package/dist/ui/Button/Button.js +2 -1
- package/dist/ui/Button/Button.stories.d.ts +2 -0
- package/dist/ui/Button/Button.stories.d.ts.map +1 -1
- package/dist/ui/Button/Button.stories.js +1 -0
- package/package.json +1 -1
|
@@ -9,6 +9,7 @@ export type ButtonProps = Omit<PressableProps, 'children' | 'style'> & {
|
|
|
9
9
|
startIcon?: IconProps['name'];
|
|
10
10
|
endIcon?: IconProps['name'];
|
|
11
11
|
ContainerProps?: BoxProps;
|
|
12
|
+
fullWidth?: boolean;
|
|
12
13
|
noPadding?: boolean;
|
|
13
14
|
borderNone?: boolean;
|
|
14
15
|
leftAlign?: boolean;
|
|
@@ -22,6 +23,7 @@ export declare const Button: React.ForwardRefExoticComponent<Omit<PressableProps
|
|
|
22
23
|
startIcon?: IconProps["name"];
|
|
23
24
|
endIcon?: IconProps["name"];
|
|
24
25
|
ContainerProps?: BoxProps;
|
|
26
|
+
fullWidth?: boolean;
|
|
25
27
|
noPadding?: boolean;
|
|
26
28
|
borderNone?: boolean;
|
|
27
29
|
leftAlign?: boolean;
|
|
@@ -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,EAAgC,cAAc,EAA8B,IAAI,EAAE,MAAM,cAAc,CAAC;AAC9G,OAAO,EAAO,QAAQ,EAAc,MAAM,YAAY,CAAC;AACvD,OAAO,EAAE,SAAS,EAAc,MAAM,eAAe,CAAC;AAOtD,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,EAAE,UAAU,GAAG,OAAO,CAAC,GAAG;IACrE,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACjC,OAAO,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,CAAC;IACvD,SAAS,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IAC9B,OAAO,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IAC5B,cAAc,CAAC,EAAE,QAAQ,CAAC;IAC1B,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,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,MAAM;
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAC7C,OAAO,EAAgC,cAAc,EAA8B,IAAI,EAAE,MAAM,cAAc,CAAC;AAC9G,OAAO,EAAO,QAAQ,EAAc,MAAM,YAAY,CAAC;AACvD,OAAO,EAAE,SAAS,EAAc,MAAM,eAAe,CAAC;AAOtD,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,EAAE,UAAU,GAAG,OAAO,CAAC,GAAG;IACrE,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACjC,OAAO,EAAE,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM,CAAC;IACvD,SAAS,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IAC9B,OAAO,CAAC,EAAE,SAAS,CAAC,MAAM,CAAC,CAAC;IAC5B,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,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,eAAO,MAAM,MAAM;WAdV,MAAM;WACN,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI;aACvB,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,MAAM;gBAC1C,SAAS,CAAC,MAAM,CAAC;cACnB,SAAS,CAAC,MAAM,CAAC;qBACV,QAAQ;gBACb,OAAO;gBACP,OAAO;iBACN,OAAO;gBACR,OAAO;WACZ,QAAQ,GAAG,QAAQ;gBACd,OAAO;8BA+JnB,CAAC"}
|
package/dist/ui/Button/Button.js
CHANGED
|
@@ -5,7 +5,7 @@ import { Box, Typography } from '../../core';
|
|
|
5
5
|
import { LucideIcon } from '../LucideIcon';
|
|
6
6
|
import { useStyles } from './Button.styles';
|
|
7
7
|
export const Button = React.forwardRef(function Button(props, ref) {
|
|
8
|
-
const { title, type, size, variant, disabled, startIcon, endIcon, noPadding, borderNone, leftAlign, isLoading, ContainerProps = {}, ...buttonProps } = props;
|
|
8
|
+
const { title, type, size, variant, disabled, startIcon, endIcon, noPadding, borderNone, leftAlign, isLoading, fullWidth = false, ContainerProps = {}, ...buttonProps } = props;
|
|
9
9
|
const { style, hoverStyle, ...containerProps } = ContainerProps;
|
|
10
10
|
const styles = useStyles();
|
|
11
11
|
const containerSize = size === 'sm'
|
|
@@ -58,6 +58,7 @@ export const Button = React.forwardRef(function Button(props, ref) {
|
|
|
58
58
|
return {
|
|
59
59
|
...applicableStyles,
|
|
60
60
|
...containerSize,
|
|
61
|
+
...(fullWidth ? { width: '100%' } : {}),
|
|
61
62
|
...(noPadding ? noPaddingStyle : {}),
|
|
62
63
|
...(borderNone ? { borderRadius: 0 } : {}),
|
|
63
64
|
...(leftAlign ? { justifyContent: 'left' } : {}),
|
|
@@ -11,6 +11,7 @@ declare const _default: {
|
|
|
11
11
|
startIcon?: import("..").IconProps["name"];
|
|
12
12
|
endIcon?: import("..").IconProps["name"];
|
|
13
13
|
ContainerProps?: import("../..").BoxProps;
|
|
14
|
+
fullWidth?: boolean;
|
|
14
15
|
noPadding?: boolean;
|
|
15
16
|
borderNone?: boolean;
|
|
16
17
|
leftAlign?: boolean;
|
|
@@ -246,4 +247,5 @@ export declare const Secondary: () => import("react/jsx-runtime").JSX.Element;
|
|
|
246
247
|
export declare const Tertiary: () => import("react/jsx-runtime").JSX.Element;
|
|
247
248
|
export declare const Link: () => import("react/jsx-runtime").JSX.Element;
|
|
248
249
|
export declare const Icons: () => import("react/jsx-runtime").JSX.Element;
|
|
250
|
+
export declare const FullWidth: () => import("react/jsx-runtime").JSX.Element;
|
|
249
251
|
//# sourceMappingURL=Button.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.stories.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Button.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Button/Button.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA,wBAQkB;AAElB,eAAO,MAAM,KAAK,+CAMjB,CAAC;AAEF,eAAO,MAAM,OAAO,+CAKnB,CAAC;AAEF,eAAO,MAAM,SAAS,+CAKrB,CAAC;AAEF,eAAO,MAAM,QAAQ,+CAKpB,CAAC;AAEF,eAAO,MAAM,IAAI,+CAKhB,CAAC;AAEF,eAAO,MAAM,KAAK,+CAQjB,CAAC;AAEF,eAAO,MAAM,SAAS,+CAIrB,CAAC"}
|
|
@@ -18,3 +18,4 @@ export const Secondary = () => (_jsxs(Box, { display: "flex", flexDirection: "ro
|
|
|
18
18
|
export const Tertiary = () => (_jsxs(Box, { display: "flex", flexDirection: "row", gap: 4, children: [_jsx(Button, { variant: "tertiary", title: "Bouton tertiary" }), _jsx(Button, { variant: "tertiary", title: "Disabled", disabled: true })] }));
|
|
19
19
|
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 })] }));
|
|
20
20
|
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" })] }));
|
|
21
|
+
export const FullWidth = () => (_jsx(Box, { display: "flex", flexDirection: "row", gap: 6, children: _jsx(Button, { variant: "primary", title: "Full Width", fullWidth: true }) }));
|