@salient-sys/react-native-infinite-picker
Version:
A simple, flexible, performant duration picker for React Native apps 🔥 Great for timers, alarms and duration inputs ⏰🕰️⏳ Includes iOS-style haptic and audio feedback 🍏
73 lines • 4.15 kB
JavaScript
import { StyleSheet } from "react-native";
const DARK_MODE_BACKGROUND_COLOR = "#232323";
const DARK_MODE_TEXT_COLOR = "#E9E9E9";
const LIGHT_MODE_BACKGROUND_COLOR = "#F1F1F1";
const LIGHT_MODE_TEXT_COLOR = "#1B1B1uB";
export const generateStyles = customStyles => {
var _customStyles$pickerL, _customStyles$text, _customStyles$pickerI, _customStyles$text2, _customStyles$pickerI2;
return StyleSheet.create({
pickerFlatListContainer: {
overflow: "visible",
...(customStyles === null || customStyles === void 0 ? void 0 : customStyles.pickerFlatListContainer),
backgroundColor: (customStyles === null || customStyles === void 0 ? void 0 : customStyles.backgroundColor) ?? ((customStyles === null || customStyles === void 0 ? void 0 : customStyles.theme) === "dark" ? DARK_MODE_BACKGROUND_COLOR : LIGHT_MODE_BACKGROUND_COLOR)
},
pickerFlatList: {
minWidth: 1,
width: "300%",
...(customStyles === null || customStyles === void 0 ? void 0 : customStyles.pickerFlatList)
},
pickerFlatListContentContainer: {
...(customStyles === null || customStyles === void 0 ? void 0 : customStyles.pickerFlatListContentContainer)
},
pickerLabelContainer: {
position: "absolute",
right: 4,
top: 0,
bottom: 0,
justifyContent: "center",
minWidth: ((customStyles === null || customStyles === void 0 || (_customStyles$pickerL = customStyles.pickerLabel) === null || _customStyles$pickerL === void 0 ? void 0 : _customStyles$pickerL.fontSize) ?? (customStyles === null || customStyles === void 0 || (_customStyles$text = customStyles.text) === null || _customStyles$text === void 0 ? void 0 : _customStyles$text.fontSize) ?? 25) * 0.65,
...(customStyles === null || customStyles === void 0 ? void 0 : customStyles.pickerLabelContainer)
},
pickerLabel: {
fontSize: 18,
fontWeight: "bold",
marginTop: ((customStyles === null || customStyles === void 0 || (_customStyles$pickerI = customStyles.pickerItem) === null || _customStyles$pickerI === void 0 ? void 0 : _customStyles$pickerI.fontSize) ?? (customStyles === null || customStyles === void 0 || (_customStyles$text2 = customStyles.text) === null || _customStyles$text2 === void 0 ? void 0 : _customStyles$text2.fontSize) ?? 25) / 6,
color: (customStyles === null || customStyles === void 0 ? void 0 : customStyles.theme) === "dark" ? DARK_MODE_TEXT_COLOR : LIGHT_MODE_TEXT_COLOR,
...(customStyles === null || customStyles === void 0 ? void 0 : customStyles.text),
...(customStyles === null || customStyles === void 0 ? void 0 : customStyles.pickerLabel)
},
pickerItemContainer: {
flexDirection: "row",
height: 50,
justifyContent: "center",
alignItems: "center",
width: ((customStyles === null || customStyles === void 0 || (_customStyles$pickerI2 = customStyles.pickerItem) === null || _customStyles$pickerI2 === void 0 ? void 0 : _customStyles$pickerI2.fontSize) ?? 25) * 3.6,
...(customStyles === null || customStyles === void 0 ? void 0 : customStyles.pickerItemContainer)
},
pickerItem: {
textAlignVertical: "center",
fontSize: 25,
color: (customStyles === null || customStyles === void 0 ? void 0 : customStyles.theme) === "dark" ? DARK_MODE_TEXT_COLOR : LIGHT_MODE_TEXT_COLOR,
...(customStyles === null || customStyles === void 0 ? void 0 : customStyles.text),
...(customStyles === null || customStyles === void 0 ? void 0 : customStyles.pickerItem)
},
disabledPickerContainer: {
opacity: 0.4,
...(customStyles === null || customStyles === void 0 ? void 0 : customStyles.disabledPickerContainer)
},
disabledPickerItem: {
opacity: 0.2,
...(customStyles === null || customStyles === void 0 ? void 0 : customStyles.disabledPickerItem)
},
maskedView: {
flex: 1
},
pickerGradientOverlay: {
position: "absolute",
width: "100%",
height: "100%",
...(customStyles === null || customStyles === void 0 ? void 0 : customStyles.pickerGradientOverlay)
}
});
};
//# sourceMappingURL=styles.js.map