fix folder component

This commit is contained in:
2025-06-26 10:29:22 +08:00
parent 33bee642a0
commit bff2a89903
16 changed files with 198 additions and 141 deletions

View File

@@ -0,0 +1,47 @@
// components/Button/Button.tsx
import React from "react";
import { Text, TouchableOpacity } from "react-native";
import buttonStyles from "./buttonStyles";
// Definisi props dengan TypeScript
interface ButtonProps {
onPress: () => void;
title?: string;
backgroundColor?: string;
textColor?: string;
radius?: number;
disabled?: boolean;
iconLeft?: React.ReactNode;
}
const ButtonCustom: React.FC<ButtonProps> = ({
onPress,
title = "Button",
backgroundColor = "#007AFF",
textColor = "#FFFFFF",
radius = 8,
disabled = false,
iconLeft,
}) => {
const styles = buttonStyles({
backgroundColor,
textColor,
borderRadius: radius,
});
return (
<TouchableOpacity
style={[styles.button, disabled && styles.disabled]}
onPress={onPress}
disabled={disabled}
activeOpacity={0.8}
>
{/* Render icon jika tersedia */}
{iconLeft && iconLeft}
<Text style={styles.buttonText}>{title}</Text>
</TouchableOpacity>
);
};
export default ButtonCustom;

View File

@@ -0,0 +1,31 @@
// components/Button/buttonStyles.js
import { MainColor } from "@/constants/color-palet";
import { StyleSheet } from "react-native";
export default function buttonStyles({
backgroundColor = "#007AFF",
textColor = "#FFFFFF",
borderRadius = 8,
}) {
return StyleSheet.create({
button: {
backgroundColor,
paddingVertical: 12,
paddingHorizontal: 20,
borderRadius,
flexDirection: "row", // 👈 Tambahkan baris ini
alignItems: "center",
justifyContent: "center",
gap: 8,
},
buttonText: {
color: textColor,
fontSize: 16,
fontWeight: "600",
},
disabled: {
backgroundColor: MainColor.disabled,
},
});
}