From 0c68fd7d63749674092ebadf17a500bc9adac1f5 Mon Sep 17 00:00:00 2001 From: skm112 <38988114+skm112@users.noreply.github.com> Date: Mon, 1 May 2023 18:23:46 +0530 Subject: [PATCH 1/3] Update package.json --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index e1406ec..d4f90d0 100755 --- a/package.json +++ b/package.json @@ -27,7 +27,7 @@ "url": "https://github.com/crazycodeboy/react-native-check-box/issues" }, "dependencies": { - "prop-types": "^15.5.7" + }, "peerDependencies": { "react-native": ">=0.20.0" From f2b0994c44190e0bb4bdde55be9c9b85120ed8c2 Mon Sep 17 00:00:00 2001 From: skm112 <38988114+skm112@users.noreply.github.com> Date: Mon, 1 May 2023 18:25:18 +0530 Subject: [PATCH 2/3] Create index.tsx --- index.tsx | 146 ++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 146 insertions(+) create mode 100644 index.tsx diff --git a/index.tsx b/index.tsx new file mode 100644 index 0000000..6d0aedf --- /dev/null +++ b/index.tsx @@ -0,0 +1,146 @@ + +import React, { Component } from 'react'; +import { + StyleSheet, + View, + Image, + Text, + TouchableHighlight, + ViewProps, + TextStyle, + GestureResponderEvent, + ViewStyle +} from 'react-native'; + +export interface CheckBoxStyle { + container: ViewStyle, + leftText: TextStyle, + rightText: TextStyle +} + +export interface CheckBoxProps extends ViewProps { + leftText?: string; + leftTextView?: unknown; + rightText?: string; + leftTextStyle: TextStyle; + rightTextView?: unknown; + rightTextStyle: TextStyle; + checkedImage?: unknown; + unCheckedImage?: unknown; + onClick: (e: GestureResponderEvent) => void; + isChecked: boolean; + isIndeterminate: boolean; + checkBoxColor?: string; + checkedCheckBoxColor?: string; + uncheckedCheckBoxColor?: string; + disabled?: boolean; + indeterminateImage?: any; +} + +export interface DefaultProps { + isChecked: boolean; + isIndeterminate: boolean; + leftTextStyle: TextStyle; + rightTextStyle: TextStyle; +} + +export default class CheckBox extends Component { + constructor(props: CheckBoxProps) { + super(props); + } + public static defaultProps: DefaultProps = { + isChecked: false, + isIndeterminate: false, + leftTextStyle: {}, + rightTextStyle: {} + } + + private onClick(e: GestureResponderEvent): void { + if (this.props.onClick) { + this.props.onClick(e); + } + } + + private _renderLeft(): JSX.Element | any { + if (this.props.leftTextView) return this.props.leftTextView; + if (!this.props.leftText) return null; + return ( + {this.props.leftText} + ); + } + + private _renderRight(): JSX.Element | any { + if (this.props.rightTextView) return this.props.rightTextView; + if (!this.props.rightText) return null; + return ( + {this.props.rightText} + ); + } + + private _renderImage(): any { + if (this.props.isIndeterminate) { + return this.props.indeterminateImage ? this.props.indeterminateImage : this.genCheckedImage(); + } + if (this.props.isChecked) { + return this.props.checkedImage ? this.props.checkedImage : this.genCheckedImage(); + } else { + return this.props.unCheckedImage ? this.props.unCheckedImage : this.genCheckedImage(); + } + } + + private _getCheckedCheckBoxColor(): string | undefined { + return this.props.checkedCheckBoxColor ? this.props.checkedCheckBoxColor : this.props.checkBoxColor + } + + private _getUncheckedCheckBoxColor(): string | undefined { + return this.props.uncheckedCheckBoxColor ? this.props.uncheckedCheckBoxColor : this.props.checkBoxColor + } + + private _getTintColor(): string | undefined { + return this.props.isChecked ? this._getCheckedCheckBoxColor() : this._getUncheckedCheckBoxColor() + } + + private genCheckedImage(): any { + let source; + if (this.props.isIndeterminate) { + source = require('./img/ic_indeterminate_check_box.png'); + } + else { + source = this.props.isChecked ? require('./img/ic_check_box.png') : require('./img/ic_check_box_outline_blank.png'); + } + + return ( + + ); + } + + public render(): JSX.Element { + return ( + this.onClick(e)} + underlayColor='transparent' + disabled={this.props.disabled} + > + + {this._renderLeft()} + {this._renderImage()} + {this._renderRight()} + + + ); + } +} +const styles: CheckBoxStyle = StyleSheet.create({ + container: { + flexDirection: 'row', + alignItems: 'center' + }, + leftText: { + flex: 1, + }, + rightText: { + flex: 1, + marginLeft: 10 + } +}); From 69ac993898043a7ea38ba36bc3dd567bd1c2914e Mon Sep 17 00:00:00 2001 From: skm112 <38988114+skm112@users.noreply.github.com> Date: Mon, 1 May 2023 18:25:31 +0530 Subject: [PATCH 3/3] Delete index.js --- index.js | 147 ------------------------------------------------------- 1 file changed, 147 deletions(-) delete mode 100755 index.js diff --git a/index.js b/index.js deleted file mode 100755 index 7fb0df3..0000000 --- a/index.js +++ /dev/null @@ -1,147 +0,0 @@ -/** - * react-native-check-box - * Checkbox component for react native, it works on iOS and Android - * https://github.com/crazycodeboy/react-native-check-box - * Email:crazycodeboy@gmail.com - * Blog:http://www.devio.org - * @flow - */ - -import React, {Component} from 'react'; -import { - StyleSheet, - View, - Image, - Text, - TouchableHighlight, - ViewPropTypes as RNViewPropTypes, -} from 'react-native'; -import PropTypes from 'prop-types'; - -const ViewPropTypes = RNViewPropTypes || View.propTypes; - -export default class CheckBox extends Component { - constructor(props) { - super(props); - } - - static propTypes = { - ...ViewPropTypes, - leftText: PropTypes.string, - leftTextView: PropTypes.element, - rightText: PropTypes.string, - leftTextStyle: PropTypes.oneOfType([ - PropTypes.string, - PropTypes.number, - PropTypes.object, - ]), - rightTextView: PropTypes.element, - rightTextStyle: PropTypes.oneOfType([ - PropTypes.string, - PropTypes.number, - PropTypes.object, - ]), - checkedImage: PropTypes.element, - unCheckedImage: PropTypes.element, - onClick: PropTypes.func.isRequired, - isChecked: PropTypes.bool.isRequired, - isIndeterminate: PropTypes.bool.isRequired, - checkBoxColor: PropTypes.string, - checkedCheckBoxColor: PropTypes.string, - uncheckedCheckBoxColor: PropTypes.string, - disabled: PropTypes.bool, - } - static defaultProps = { - isChecked: false, - isIndeterminate: false, - leftTextStyle: {}, - rightTextStyle: {} - } - - onClick() { - this.props.onClick(); - } - - _renderLeft() { - if (this.props.leftTextView) return this.props.leftTextView; - if (!this.props.leftText) return null; - return ( - {this.props.leftText} - ); - } - - _renderRight() { - if (this.props.rightTextView) return this.props.rightTextView; - if (!this.props.rightText) return null; - return ( - {this.props.rightText} - ); - } - - _renderImage() { - if (this.props.isIndeterminate) { - return this.props.indeterminateImage ? this.props.indeterminateImage : this.genCheckedImage(); - } - if (this.props.isChecked) { - return this.props.checkedImage ? this.props.checkedImage : this.genCheckedImage(); - } else { - return this.props.unCheckedImage ? this.props.unCheckedImage : this.genCheckedImage(); - } - } - - _getCheckedCheckBoxColor() { - return this.props.checkedCheckBoxColor ? this.props.checkedCheckBoxColor : this.props.checkBoxColor - } - - _getUncheckedCheckBoxColor() { - return this.props.uncheckedCheckBoxColor ? this.props.uncheckedCheckBoxColor : this.props.checkBoxColor - } - - _getTintColor() { - return this.props.isChecked ? this._getCheckedCheckBoxColor() : this._getUncheckedCheckBoxColor() - } - - genCheckedImage() { - let source; - if (this.props.isIndeterminate) { - source = require('./img/ic_indeterminate_check_box.png'); - } - else { - source = this.props.isChecked ? require('./img/ic_check_box.png') : require('./img/ic_check_box_outline_blank.png'); - } - - return ( - - ); - } - - render() { - return ( - this.onClick()} - underlayColor='transparent' - disabled={this.props.disabled} - > - - {this._renderLeft()} - {this._renderImage()} - {this._renderRight()} - - - ); - } -} -const styles = StyleSheet.create({ - container: { - flexDirection: 'row', - alignItems: 'center' - }, - leftText: { - flex: 1, - }, - rightText: { - flex: 1, - marginLeft: 10 - } -});