rn-inkpad
Version:
<img src="https://res.cloudinary.com/fercloudinary/image/upload/v1715452841/packages/inkpad-banner_acl0xl.png" />
47 lines (46 loc) • 1.83 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.NavigationItem = void 0;
const react_1 = __importDefault(require("react"));
const react_native_1 = require("react-native");
const __1 = require("../");
const SelectedTab_1 = require("./SelectedTab");
const NavigationItem = ({ item, highlightedBgColor, iconColor, iconSize = 25, selected, selectedColor = '#DB504A', selectedheight, textColor, textStyle, onPress, }) => {
const { highlighted, icon, text } = item;
return (<react_native_1.Pressable onPress={onPress} style={styles.button}>
<react_native_1.View style={[
styles.button,
{ paddingTop: 10 },
highlighted && {
...styles.highlighted,
top: -(iconSize * 2),
backgroundColor: highlightedBgColor ?? selectedColor,
},
]}>
{!highlighted && selected && (<SelectedTab_1.SelectedTab height={selectedheight} color={selectedColor}/>)}
{icon && (<__1.Icon name={icon} size={highlighted ? iconSize + 5 : iconSize} color={iconColor}/>)}
{!highlighted && (<react_native_1.Text style={[
{ color: textColor ?? iconColor, paddingHorizontal: 3 },
textStyle,
]}>
{text}
</react_native_1.Text>)}
</react_native_1.View>
</react_native_1.Pressable>);
};
exports.NavigationItem = NavigationItem;
const styles = react_native_1.StyleSheet.create({
button: {
justifyContent: 'center',
alignItems: 'center',
flex: 1,
},
highlighted: {
padding: 10,
borderRadius: 50,
position: 'absolute',
},
});