Skip to content

Commit 3dcdfd6

Browse files
kuraydevkuraydev
committed
Re-structre of the library. All icons are able to disable now except main iocn
1 parent 84da8e1 commit 3dcdfd6

14 files changed

Lines changed: 174 additions & 154 deletions

File tree

lib/src/components/BottomBar.js renamed to lib/src/BottomBar.js

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
11
import React, { Component } from "react";
22
import { View } from "react-native";
3-
// Other Components
4-
import Shape from "./Shape";
5-
import BottomIcons from "./BottomIcons";
6-
// Styles
7-
import styles from "./styles/BottomBar.style";
3+
/**
4+
* ? Local Imports
5+
*/
6+
import styles from "./BottomBar.style";
7+
import Shape from "./components/Shape/Shape";
8+
import BottomIcons from "./components/BottomIcons/BottomIcons";
89

910
export default class BottomBar extends Component {
1011
renderTabBar = () => {
@@ -38,6 +39,7 @@ export default class BottomBar extends Component {
3839
secondIconComponent={secondIconComponent}
3940
thirdIconComponent={thirdIconComponent}
4041
fourthIconComponent={fourthIconComponent}
42+
{...this.props}
4143
/>
4244
</View>
4345
);

lib/src/components/styles/BottomBar.style.js renamed to lib/src/BottomBar.style.js

File renamed without changes.

‎lib/src/components/BottomIcons.js‎

Lines changed: 0 additions & 64 deletions
This file was deleted.

‎lib/src/components/BottomIcons/BottomIcons.js‎

Lines changed: 82 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
import React, { Component } from "react";
2+
import { View } from "react-native";
3+
/**
4+
* ? Local Imports
5+
*/
6+
import styles from "./BottomIcons.style";
7+
import MiniButton from "../MiniButton/MiniButton";
8+
import MainIconButtonStyle from "../MainIconButton/MainIconButton.style";
9+
import MainIconButton from "../MainIconButton/MainIconButton";
10+
11+
export default class BottomIcons extends Component {
12+
render() {
13+
const {
14+
mainIcon,
15+
mainIconColor,
16+
mainIconOnPress,
17+
mainIconGradient,
18+
disableFourthIcon,
19+
miniButtonsColor,
20+
disableFirstIcon,
21+
disableThirdIcon,
22+
disableSecondIcon,
23+
mainIconComponent,
24+
firstIconComponent,
25+
thirdIconComponent,
26+
fourthIconComponent,
27+
secondIconComponent
28+
} = this.props;
29+
30+
return (
31+
<View style={[styles.iconContainer]}>
32+
<View style={styles.iconStyles.main}>
33+
{!disableFirstIcon &&
34+
(firstIconComponent || (
35+
<MiniButton
36+
style={styles.iconStyles.firstIconStyle}
37+
color={miniButtonsColor}
38+
/>
39+
))}
40+
{!disableSecondIcon &&
41+
(secondIconComponent || (
42+
<MiniButton
43+
style={styles.iconStyles.secondIconStyle}
44+
color={miniButtonsColor}
45+
/>
46+
))}
47+
<View style={[MainIconButtonStyle.mainIconStyle.container]}>
48+
{mainIconComponent || (
49+
<MainIconButton
50+
mainIcon={mainIcon}
51+
mainIconColor={mainIconColor}
52+
mainIconGradient={mainIconGradient}
53+
mainIconOnPress={mainIconOnPress}
54+
/>
55+
)}
56+
</View>
57+
{!disableThirdIcon &&
58+
(thirdIconComponent || (
59+
<MiniButton
60+
style={styles.iconStyles.thirdIconStyle}
61+
color={miniButtonsColor}
62+
/>
63+
))}
64+
{!disableFourthIcon &&
65+
(fourthIconComponent || (
66+
<MiniButton
67+
style={styles.iconStyles.fourthIconStyle}
68+
color={miniButtonsColor}
69+
/>
70+
))}
71+
</View>
72+
</View>
73+
);
74+
}
75+
}
76+
77+
BottomIcons.defaultProps = {
78+
disableFirstIcon: false,
79+
disableSecondIcon: false,
80+
disableThirdIcon: false,
81+
disableFourthIcon: false
82+
};

lib/src/components/styles/BottomIcons.style.js renamed to lib/src/components/BottomIcons/BottomIcons.style.js

Lines changed: 2 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import { Dimensions, Platform } from "react-native";
2-
import colors from "./common/colors";
1+
import { Platform } from "react-native";
2+
import colors from "../styles/colors";
33
import {
44
isIPhoneXFamily,
55
ScreenWidth
@@ -85,45 +85,6 @@ export default {
8585
alignSelf: "flex-end"
8686
}
8787
})
88-
},
89-
mainIconStyle: {
90-
container: {
91-
...Platform.select({
92-
ios: {
93-
bottom: 15,
94-
alignItems: "center",
95-
justifyContent: "center"
96-
},
97-
android: {
98-
bottom: 5,
99-
alignItems: "center",
100-
justifyContent: "center"
101-
}
102-
})
103-
},
104-
button: {
105-
...Platform.select({
106-
ios: {
107-
width: 70,
108-
height: 70,
109-
borderRadius: 35,
110-
position: "absolute",
111-
shadowColor: colors.theme.light.shadowColor,
112-
shadowOffset: { width: 2, height: 3 },
113-
shadowOpacity: 0.3,
114-
shadowRadius: 3
115-
},
116-
android: {
117-
width: 70,
118-
height: 70,
119-
borderRadius: 35,
120-
position: "relative",
121-
alignItems: "center",
122-
justifyContent: "center",
123-
backgroundColor: colors.theme.light.primary
124-
}
125-
})
126-
}
12788
}
12889
}
12990
};

lib/src/components/MainIconButton.js renamed to lib/src/components/MainIconButton/MainIconButton.js

Lines changed: 9 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,14 @@
11
import React, { Component } from "react";
2-
import { Platform, View, TouchableOpacity } from "react-native";
2+
import { View, TouchableOpacity } from "react-native";
33
import LinearGradient from "react-native-linear-gradient";
44
import Icon from "react-native-dynamic-vector-icons";
5-
import colors from "./styles/common/colors";
6-
import { defaultShadowStyle } from "./styles/common/shared.style";
7-
import BottomIconsStyle from "./styles/BottomIcons.style";
5+
/**
6+
* ? Local Imports
7+
*/
8+
import colors from "../styles/colors";
9+
import styles from "./MainIconButton.style";
10+
import { defaultShadowStyle } from "../styles/shared.style";
811

9-
const styles = {
10-
container: {
11-
position: "relative",
12-
alignItems: "center",
13-
justifyContent: "center",
14-
elevation: 5,
15-
shadowRadius: 3,
16-
shadowOpacity: 0.3,
17-
shadowColor: "#000",
18-
shadowOffset: { width: 0, height: 2 }
19-
},
20-
iconContainer: {
21-
alignItems: "center",
22-
justifyContent: "center",
23-
marginTop: Platform.OS === "ios" ? 15 : 0
24-
}
25-
};
2612
const blueGradient = ["rgba(156, 180, 249, 1.0)", "rgba(108, 136, 246, 1.0)"];
2713

2814
export default class MainIconButton extends Component {
@@ -39,13 +25,10 @@ export default class MainIconButton extends Component {
3925
return (
4026
<TouchableOpacity style={styles.container} onPress={mainIconOnPress}>
4127
<LinearGradient
42-
start={{ x: 0, y: 1 }}
4328
end={{ x: 1, y: 0 }}
29+
start={{ x: 0, y: 1 }}
4430
colors={mainIconGradient || blueGradient}
45-
style={[
46-
BottomIconsStyle.iconStyles.mainIconStyle.button,
47-
defaultShadowStyle
48-
]}
31+
style={[styles.mainIconStyle.button, defaultShadowStyle]}
4932
>
5033
<View style={[styles.iconContainer, defaultShadowStyle]}>
5134
{mainIcon || (

‎lib/src/components/MainIconButton/MainIconButton.style.js‎

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
import { Platform } from "react-native";
2+
import colors from "../styles/colors";
3+
4+
export default {
5+
mainIconStyle: {
6+
container: {
7+
...Platform.select({
8+
ios: {
9+
bottom: 15,
10+
alignItems: "center",
11+
justifyContent: "center"
12+
},
13+
android: {
14+
bottom: 5,
15+
alignItems: "center",
16+
justifyContent: "center"
17+
}
18+
})
19+
},
20+
button: {
21+
...Platform.select({
22+
ios: {
23+
width: 70,
24+
height: 70,
25+
borderRadius: 35,
26+
position: "absolute",
27+
shadowColor: colors.theme.light.shadowColor,
28+
shadowOffset: { width: 2, height: 3 },
29+
shadowOpacity: 0.3,
30+
shadowRadius: 3
31+
},
32+
android: {
33+
width: 70,
34+
height: 70,
35+
borderRadius: 35,
36+
position: "relative",
37+
alignItems: "center",
38+
justifyContent: "center",
39+
backgroundColor: colors.theme.light.primary
40+
}
41+
})
42+
}
43+
},
44+
container: {
45+
position: "relative",
46+
alignItems: "center",
47+
justifyContent: "center",
48+
elevation: 5,
49+
shadowRadius: 3,
50+
shadowOpacity: 0.3,
51+
shadowColor: "#000",
52+
shadowOffset: { width: 0, height: 2 }
53+
},
54+
iconContainer: {
55+
alignItems: "center",
56+
justifyContent: "center",
57+
marginTop: Platform.OS === "ios" ? 15 : 0
58+
}
59+
};

lib/src/components/MiniButton.js renamed to lib/src/components/MiniButton/MiniButton.js

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,12 @@
11
import React, { Component } from "react";
22
import { TouchableOpacity, View } from "react-native";
33
import Icon from "react-native-dynamic-vector-icons";
4-
import styles from "./styles/MiniButton.style";
5-
import colors from "./styles/common/colors";
6-
import { shadowStyle } from "./styles/common/shared.style";
4+
/**
5+
* ? Local Imports
6+
*/
7+
import colors from "../styles/colors";
8+
import styles from "./MiniButton.style";
9+
import { shadowStyle } from "../styles/shared.style";
710

811
export default class MiniButton extends Component {
912
render() {

lib/src/components/styles/MiniButton.style.js renamed to lib/src/components/MiniButton/MiniButton.style.js

File renamed without changes.

lib/src/components/Shape.js renamed to lib/src/components/Shape/Shape.js

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,18 @@
11
import React, { Component } from "react";
22
import PropTypes from "prop-types";
3-
import { View, Platform } from "react-native";
4-
import { _shapeStyle, _shadowStyle } from "./styles/Shape.style";
3+
import { View } from "react-native";
54
import Androw from "react-native-androw";
5+
/**
6+
* ? Local Imports
7+
*/
8+
import { _shapeStyle, _shadowStyle } from "./Shape.style";
69

710
class Shape extends Component {
811
render() {
912
const { shapeStyle, shapeColor, shapeShadowColor } = this.props;
1013
return (
1114
<Androw style={_shadowStyle(shapeShadowColor)}>
12-
<View
13-
style={[
14-
_shapeStyle(shapeColor),
15-
shapeStyle
16-
]}
17-
/>
15+
<View style={[_shapeStyle(shapeColor), shapeStyle]} />
1816
</Androw>
1917
);
2018
}

0 commit comments

Comments
 (0)