Skip to content

Commit 19d8b06

Browse files
clementdejoieclementdejoie
authored
Merge pull request #250 from ZeroGachis/SORD-564-Update-button
Sord 564 update button
2 parents aa306ab + a0e236e commit 19d8b06

File tree

3 files changed

+276
-96
lines changed

3 files changed

+276
-96
lines changed

‎Storybook/components/Button/Button.stories.tsx‎

Lines changed: 169 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -1,54 +1,187 @@
1-
import type { Meta, StoryObj } from '@storybook/react-native';
1+
import type { ComponentMeta, ComponentStory } from '@storybook/react-native';
22
import React from 'react';
3-
import { StyleSheet, View } from 'react-native';
3+
import { View } from 'react-native';
4+
import { Button } from '../../../src/components/buttons/Button';
45

5-
import { Button } from 'smartway-react-native-ui';
6+
type ButtonType = typeof Button;
67

78
export default {
89
title: 'components/Button',
910
component: Button,
10-
argTypes: {
11-
variant: {
12-
control: { type: 'radio' },
13-
options: ['filled', 'outlined', 'text'],
14-
},
15-
size: {
16-
control: { type: 'radio' },
17-
options: ['s', 'm', null],
18-
},
19-
status: {
20-
control: { type: 'radio' },
21-
options: ['primary', 'default', null],
22-
},
23-
onPress: { action: 'clicked' },
24-
},
2511
decorators: [
2612
(Story) => {
27-
const styles = StyleSheet.create({
28-
container: { alignItems: 'center', justifyContent: 'center', flex: 1 },
29-
});
3013
return (
31-
<View style={styles.container}>
14+
<View style={{ alignItems: 'center', justifyContent: 'center', flex: 1 }}>
3215
<Story />
3316
</View>
3417
);
3518
},
3619
],
37-
parameters: {
38-
notes: `
39-
# Button
40-
41-
A simple button.
20+
} as ComponentMeta<ButtonType>;
4221

43-
`,
22+
export const Default: ComponentStory<ButtonType> = (args) => {
23+
return <Button {...args}>Button</Button>;
24+
};
25+
Default.argTypes = {
26+
size: {
27+
control: { type: 'radio' },
28+
options: ['s', 'm'],
4429
},
45-
} as Meta<typeof Button>;
46-
47-
type Story = StoryObj<typeof Button>;
48-
49-
export const Default: Story = {
50-
args: {
51-
children: 'Button',
30+
variant: {
31+
control: { type: 'radio' },
32+
options: ['filled', 'outlined', 'text'],
33+
},
34+
status: {
35+
control: { type: 'radio' },
36+
options: ['default', 'primary', 'info', 'success', 'warning', 'error', 'inherit'],
5237
},
38+
disabled: {
39+
control: { type: 'boolean' },
40+
},
41+
onPress: { action: 'clicked' },
42+
};
43+
44+
export const Catalog: ComponentStory<ButtonType> = (args) => {
45+
return (
46+
<View style={{ gap: 8 }}>
47+
<View style={{ flexDirection: 'row', gap: 8 }}>
48+
<Button {...args} variant="filled" status="default">
49+
Button
50+
</Button>
51+
<Button {...args} variant="filled" status="primary">
52+
Button
53+
</Button>
54+
<Button {...args} variant="filled" status="info">
55+
Button
56+
</Button>
57+
<Button {...args} variant="filled" status="success">
58+
Button
59+
</Button>
60+
<Button {...args} variant="filled" status="warning">
61+
Button
62+
</Button>
63+
<Button {...args} variant="filled" status="error">
64+
Button
65+
</Button>
66+
<Button {...args} variant="filled" status="inherit">
67+
Button
68+
</Button>
69+
</View>
70+
<View style={{ flexDirection: 'row', gap: 8 }}>
71+
<Button {...args} variant="filled" status="default" disabled>
72+
Button
73+
</Button>
74+
<Button {...args} variant="filled" status="primary" disabled>
75+
Button
76+
</Button>
77+
<Button {...args} variant="filled" status="info" disabled>
78+
Button
79+
</Button>
80+
<Button {...args} variant="filled" status="success" disabled>
81+
Button
82+
</Button>
83+
<Button {...args} variant="filled" status="warning" disabled>
84+
Button
85+
</Button>
86+
<Button {...args} variant="filled" status="error" disabled>
87+
Button
88+
</Button>
89+
<Button {...args} variant="filled" status="inherit" disabled>
90+
Button
91+
</Button>
92+
</View>
93+
<View style={{ flexDirection: 'row', gap: 8 }}>
94+
<Button {...args} variant="outlined" status="default">
95+
Button
96+
</Button>
97+
<Button {...args} variant="outlined" status="primary">
98+
Button
99+
</Button>
100+
<Button {...args} variant="outlined" status="info">
101+
Button
102+
</Button>
103+
<Button {...args} variant="outlined" status="success">
104+
Button
105+
</Button>
106+
<Button {...args} variant="outlined" status="warning">
107+
Button
108+
</Button>
109+
<Button {...args} variant="outlined" status="error">
110+
Button
111+
</Button>
112+
<Button {...args} variant="outlined" status="inherit">
113+
Button
114+
</Button>
115+
</View>
116+
<View style={{ flexDirection: 'row', gap: 8 }}>
117+
<Button {...args} variant="outlined" status="default" disabled>
118+
Button
119+
</Button>
120+
<Button {...args} variant="outlined" status="primary" disabled>
121+
Button
122+
</Button>
123+
<Button {...args} variant="outlined" status="info" disabled>
124+
Button
125+
</Button>
126+
<Button {...args} variant="outlined" status="success" disabled>
127+
Button
128+
</Button>
129+
<Button {...args} variant="outlined" status="warning" disabled>
130+
Button
131+
</Button>
132+
<Button {...args} variant="outlined" status="error" disabled>
133+
Button
134+
</Button>
135+
<Button {...args} variant="outlined" status="inherit" disabled>
136+
Button
137+
</Button>
138+
</View>
139+
<View style={{ flexDirection: 'row', gap: 8 }}>
140+
<Button {...args} variant="text" status="default">
141+
Button
142+
</Button>
143+
<Button {...args} variant="text" status="primary">
144+
Button
145+
</Button>
146+
<Button {...args} variant="text" status="info">
147+
Button
148+
</Button>
149+
<Button {...args} variant="text" status="success">
150+
Button
151+
</Button>
152+
<Button {...args} variant="text" status="warning">
153+
Button
154+
</Button>
155+
<Button {...args} variant="text" status="error">
156+
Button
157+
</Button>
158+
<Button {...args} variant="text" status="inherit">
159+
Button
160+
</Button>
161+
</View>
162+
<View style={{ flexDirection: 'row', gap: 8 }}>
163+
<Button {...args} variant="text" status="default" disabled>
164+
Button
165+
</Button>
166+
<Button {...args} variant="text" status="primary" disabled>
167+
Button
168+
</Button>
169+
<Button {...args} variant="text" status="info" disabled>
170+
Button
171+
</Button>
172+
<Button {...args} variant="text" status="success" disabled>
173+
Button
174+
</Button>
175+
<Button {...args} variant="text" status="warning" disabled>
176+
Button
177+
</Button>
178+
<Button {...args} variant="text" status="error" disabled>
179+
Button
180+
</Button>
181+
<Button {...args} variant="text" status="inherit" disabled>
182+
Button
183+
</Button>
184+
</View>
185+
</View>
186+
);
53187
};
54-
Default.parameters = { noSafeArea: false };

‎src/components/alert/Alert.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,9 @@ const Alert = ({
4949
</View>
5050
<View style={styles.actionsContainer}>
5151
{onButtonPress && buttonText && (
52-
<Button onPress={onButtonPress}>{buttonText}</Button>
52+
<Button status={status} onPress={onButtonPress}>
53+
{buttonText}
54+
</Button>
5355
)}
5456
{onDismiss && (
5557
<Pressable

0 commit comments

Comments
 (0)