react-native-checkbox / react-native-checkbox Goto Github PK
View Code? Open in Web Editor NEWCheckbox component for React Native
License: MIT License
Checkbox component for React Native
License: MIT License
Hi everyone,
I just installed that, it works well on android but I get an error on IOS.
Invariant Violation: requireNativeComponent: "RNCCheckbox" was not found in the UIManager.
here is My react native versions:
react: 16.8.3 => 16.8.3
react-native: 0.59.0 => 0.59.0
"@react-native-community/checkbox": "^0.5.7"
after I do pod install on ios folder, I get this:
npx : 1 installé(s) en 2.332s
Scanning for pods...
1.9.1
> pod install
Analyzing dependencies
[!] Unable to find a specification for `React-Core` depended upon by `RNCCheckbox`
You have either:
* out-of-date source repos which you can update with `pod repo update` or with `pod install --repo-update`.
* mistyped the name or version.
* not added the source repo that hosts the Podspec to your Podfile.
Aborting run
An unexpected error was encountered. Please report it as a bug:
{ CocoaPodsError: The command `pod install` failed
└─ Cause: Error: pod exited with non-zero code: 1
help please it's urgent. Thank you for you all!
I just checked new release for IOS.
Thank you.
Unfortunately, it doesn't work...
I wasted my time...
Hi,
Could I get an elaboration on how the TintColors prop works? using the object shape in the README throws errors. It could be a knowledge gap for me here Is there any example I can follow?
<CheckBox onValueChange={handleCheck} value={check} tintColors={true?: ?'blue, false?: ?'grey' } />
how im currently using it. I would just like to set the color of when its checked to blue
Thanks for all the help!
Appears when adding the the react-native-community/checkbox
to my project.
I've tried linking and unlinking (as I believe react-native ^0.60 autolinks anyway).
System:
OS: macOS 10.14.6
CPU: (4) x64 Intel(R) Core(TM) i5-7360U CPU @ 2.30GHz
Memory: 22.41 MB / 8.00 GB
Shell: 5.3 - /bin/zsh
Binaries:
Node: 12.4.0 - /usr/local/bin/node
npm: 6.9.0 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 12.4, macOS 10.14, tvOS 12.4, watchOS 5.3
Android SDK:
API Levels: 27, 28, 29
Build Tools: 28.0.3, 29.0.0
System Images: android-29 | Google APIs Intel x86 Atom
IDEs:
Android Studio: 3.4 AI-183.6156.11.34.5692245
Xcode: 10.3/10G8 - /usr/bin/xcodebuild
npmPackages:
react: ^16.8.3 => 16.8.3
react-native: ^0.60.4 => 0.60.4
npmGlobalPackages:
react-native-cli: 2.0.1
I tried to put it inside TouchableOpacity to handle changes and disable it and even then it ignores the disabled={true}
Hello,
I use "import CheckBox from '@react-native-community/checkbox';" for my checkbox on Android, and now that i look for my App on iOS, i cant see the checkbox, i have 0 error on my simulator.
I have followed the instruction : (im on RN > 0.60)
npm install @react-native-community/checkbox --save
and install cocoapods
npx pod-install
I see that for iOS you refered to BEMCheckBox so i check the README and i tried to add "pod 'BEMCheckBox' " to my podfile, but still dont work.
I tried with example code but still dont work here my code :
import CheckBox from '@react-native-community/checkbox';
(...)
Platform.OS === 'ios' ? (
<CheckBox
value={checked}
onChange={() => unCheckOtherExpiries(idExpiry)}
lineWidth={2}
hideBox={false}
boxType={'circle'}
tintColor={'#9E663C'}
onCheckColor={'#6F763F'}
onFillColor={'#4DABEC'}
onTintColor={'#F4DCF8'}
animationDuration={0.5}
disabled={false}
onAnimationType={'bounce'}
offAnimationType={'stroke'}
/>
) : (
<CheckBox
disabled={false}
value={checked}
onChange={() => unCheckOtherExpiries(idExpiry)}
/>
);
(...)
<View style={[contracts.infosView, contracts.flexRow]}>
{checkBoxIdExpiry}
<Text style={contracts.label}>{expiryName}</Text>
</View>```
Introducing typescript support for the repo.
With the increasing popularity in typescript, it would be nice to have typescript support or at least a type declaration for the repo.
Currently, this repo does not have a typescript definition in @types repo.
There are declaration files in @types/react-native
that can be extracted to this repository.
I believe there are two ways to approach this.
index.d.ts
file, extracted from @types/react-native
.tsx
and rewrite the modules in typescriptAny thoughts?
Suddenly I have a problem with this library , I don't know what happened but now it gets me this error when I do: react-native run-android
Task :@react-native-community_checkbox:compileDebugJavaWithJavac FAILED
FULL ERROR
> Configure project :@react-native-community_checkbox
WARNING: Configuration 'compile' is obsolete and has been replaced with 'implementation' and 'api'.
It will be removed soon. For more information see: http://d.android.com/r/tools/update-dependency-configurations.html
WARNING: The specified Android SDK Build Tools version (23.0.1) is ignored, as it is below the minimum supported version (28.0.3) for Android Gradle Plugin 3.5.2.
Android SDK Build Tools 28.0.3 will be used.
To suppress this warning, remove "buildToolsVersion '23.0.1'" from your build.gradle file, as each version of the Android Gradle Plugin now has a default version of the build tools.
> Task :@react-native-community_checkbox:compileDebugJavaWithJavac FAILED
9 actionable tasks: 1 executed, 8 up-to-date
FAILURE: Build failed with an exception.
* What went wrong:
Execution failed for task ':@react-native-community_checkbox:compileDebugJavaWithJavac'.
> Could not find tools.jar. Please check that C:\Program Files\Java\jre1.8.0_231 contains a valid JDK installation.
* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.
* Get more help at https://help.gradle.org
BUILD FAILED in 4s
error Failed to install the app. Make sure you have the Android development environment set up: https://facebook.github.io/react-native/docs/getting-started.html#android-development-environment. Run CLI with --verbose flag for more details.
Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081
FAILURE: Build failed with an exception.
* What went wrong:
Execution failed for task ':@react-native-community_checkbox:compileDebugJavaWithJavac'.
> Could not find tools.jar. Please check that C:\Program Files\Java\jre1.8.0_231 contains a valid JDK installation.
* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.
* Get more help at https://help.gradle.org
BUILD FAILED in 4s
My specs:
"@react-native-community/checkbox": "^0.2.1",
"react": "^16.10.2",
"react-native": "^0.61.2",
I am testing with react-native-testing-library and would like to interact with a couple of checkboxes I have in one of my components.
Using fireEvent.press(getByA11yLabel('Drivers bag'));
would throw error
No handler function found for event: "press"
I tried calling the onValueChange() like so getByA11yLabel('Drivers bag').props.onValueChange();
and that would throw error
TypeError: Cannot read property 'nativeEvent' of undefined
All I'm interested in testing is whether an effect would run when the user toggles the checkbox.
I was trying to use this lib and found that is has not been published yet
node_modules/@react-native-community/checkbox/dist/CheckBox.android.d.ts:2:21 - error TS2724: Module '"react-native"' has no exported member 'NativeComponent'. Did you mean 'TextComponent'?
2 import { ViewProps, NativeComponent, NativeSyntheticEvent } from 'react-native';
~~~~~~~~~~~~~~~
node_modules/@types/react-native/index.d.ts:933:15
933 declare class TextComponent extends React.Component<TextProps> {}
~~~~~~~~~~~~~
'TextComponent' is declared here.
node_modules/@react-native-community/checkbox/dist/CheckBox.android.d.ts:72:55 - error TS2694: Namespace '"/home/runner/work/rnapp/rnapp/node_modules/@types/react-native/index"' has no exported member 'NativeMethodsMixinStatic'.
72 forwardedRef?: ((instance: import("react-native").NativeMethodsMixinStatic | null) => void) | React.RefObject<import("react-native").NativeMethodsMixinStatic> | null | undefined;
~~~~~~~~~~~~~~~~~~~~~~~~
node_modules/@react-native-community/checkbox/dist/CheckBox.android.d.ts:72:138 - error TS2694: Namespace '"/home/runner/work/rnapp/rnapp/node_modules/@types/react-native/index"' has no exported member 'NativeMethodsMixinStatic'.
"@types/react-native": "^0.62.18",
Library version: v0.4.2
please fix this or use my implementation :
import CheckBox from '@react-native-community/checkbox';
import React, { useState } from 'react';
import { StyleSheet, Text, View } from 'react-native';
const app= () => {
const [toggleCheckBox, setToggleCheckBox] = useState(false);
return (
<View style={styles.container}>
<View style={styles.checkboxContainer}>
<CheckBox
disabled={false}
value={toggleCheckBox}
onValueChange={() => toggleCheckBox ? setToggleCheckBox(false) : setToggleCheckBox(true)}
/>
<Text style={styles.label}>Do you like React Native?</Text>
</View>
<Text>Is CheckBox selected: {toggleCheckBox ? "👍" : "👎"}</Text>
</View>
);
};
const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: "center",
justifyContent: "center",
},
checkboxContainer: {
flexDirection: "row",
marginBottom: 20,
},
checkbox: {
alignSelf: "center",
},
label: {
margin: 8,
},
});
export default app;
friends, I have problems using the checkbox.
I can only press it 1 time. When clicking on the checkbox (checked with a console.log) it only changes its value and returns the console log the first time it is pressed, since after that, the amounts that you press do absolutely nothing and do not change value.
This is my useState Hooks:
const [toggleCheckBox, setToggleCheckBox] = useState(false)
This is my CheckBox code:
<CheckBox
disabled={false}
value={toggleCheckBox}
onValueChange={(newValue) => setToggleCheckBox(newValue)}/>
I tried all the ways I found on the internet and with all of them it's the same.
Implement an option to set the dimensions for checkbox.
On iOS it is a little too big, and it would be good to be changeable.
In dist, set the dimensions to be set from props, if exists., for both iOS and Android.
rctCheckBox: {
height: 22,
width: 22,
},
Here should be changed.
please add support for android to add IOS like rounded checkbox, or please add support to add a custom icon support.
Section "Manual installation"
Gradle 5
Readme says that RN versions above 0.62 are not supported
I am on 0.63, is there a recommendation what to use instead ?
Or are there particular limitations that if not enabled, the checkbox would still work on 0.63+?
Thank you
checkbox onChange => works correctly, but when checkbox value default is true it's not works.
example: currentWork : boolean
<CheckBox
label=''
onChange={() => {setCurrentWork(!currentWork)}}
value={currentWork}
checkboxStyle={styles.checkbox}
checkedImage={CHECKED_ICON}
uncheckedImage={UNCHECKED_ICON}
/>
Should we support iOS?
The checkbox is a quite basic component that is commonly used in Application.
React-Native could be more universal by supporting iOS and Android both
As we know, there is no native implementation of Checkbox in iOS, how would it be like in iOS?
(However, there is a style Guideline about checkboxes in MacOS)
https://developer.apple.com/design/human-interface-guidelines/macos/buttons/checkboxes/
Thanks for your discussion, We decide to implement the IOS version from now:
I think it is a good idea to reference the awesome implementation of IOS checkbox:
onValueChange fired twice on iOS with latest SDK
react-native info
output:
System:
OS: macOS 10.15.6
CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
Memory: 148.44 MB / 16.00 GB
Shell: 5.7.1 - /bin/zsh
Binaries:
Node: 14.10.1 - /var/folders/5g/0l5grh8d0gggr4gvwdvfg3k40000gn/T/yarn--1600967244286-0.545828540744336/node
Yarn: 1.22.5 - /var/folders/5g/0l5grh8d0gggr4gvwdvfg3k40000gn/T/yarn--1600967244286-0.545828540744336/yarn
npm: 6.14.8 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
Managers:
CocoaPods: 1.9.3 - /usr/local/bin/pod
SDKs:
iOS SDK:
Platforms: iOS 14.0, DriverKit 19.0, macOS 10.15, tvOS 14.0, watchOS 7.0
Android SDK:
API Levels: 23, 28, 29, 30
Build Tools: 28.0.3, 29.0.2, 30.0.2
System Images: android-29 | Intel x86 Atom_64, android-30 | Google Play Intel x86 Atom
Android NDK: Not Found
IDEs:
Android Studio: 4.0 AI-193.6911.18.40.6626763
Xcode: 12.0/12A7209 - /usr/bin/xcodebuild
Languages:
Java: 1.8.0_265 - /usr/bin/javac
Python: 2.7.16 - /usr/bin/python
npmPackages:
@react-native-community/cli: Not Found
react: 16.13.1 => 16.13.1
react-native: 0.63.2 => 0.63.2
react-native-macos: Not Found
npmGlobalPackages:
react-native: Not Found
Library version: 0.5.3
Started by installing npm install @react-native-community/checkbox
and then updated npx pod-install
.
Imported it as import CheckBox from '@react-native-community/checkbox';
After that, I added the checkbox as:
<CheckBox disabled={false} value={isSelected} onValueChange={setSelection} />
<Text style={styles.label}>Do you like React Native?</Text>
Hi,
Are there currently any future plans to support an indeterminate checkbox state?
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/checkbox#htmlattrdefindeterminate
This has been supported on web for some time now, and it would be useful to be able to use this in React Native as well.
We have multiple checkboxes like following:
<CheckBox
disabled={false}
boxType="square"
animationDuration={0}
testID="checkbox"
/><CheckBox
disabled={false}
boxType="square"
animationDuration={0}
testID="checkbox"
/>
<CheckBox
disabled={false}
boxType="square"
animationDuration={0}
testID="checkbox"
/>
<CheckBox
disabled={false}
boxType="square"
animationDuration={0}
testID="checkbox"
/>
<CheckBox
disabled={false}
boxType="square"
animationDuration={0}
testID="checkbox"
/>
<CheckBox
disabled={false}
boxType="square"
animationDuration={0}
testID="checkbox"
/>
then press two or more boxes at the same time with multi touch, then app would crash after touch for a while.
in iPhone 6
I'm using ReactNative in my project. After run npm install
, cd android
, when I run ./gradlew clean
or ./gradlew assembleRelease
or cd .. && react-native run-android
, I always get the next error:
* Where:
Build file '/node_modules/@react-native-community/checkbox/android/build.gradle' line: 13
* What went wrong:
A problem occurred evaluating project ':@react-native-community_checkbox'.
> Uninitialized object exists on backward branch 45
Exception Details:
Location:
com/android/tools/build/jetifier/core/proguard/ProGuardTypesMap.<init>([Lkotlin/Pair;)V @101: goto
Reason:
Error exists in the bytecode
Bytecode:
0x0000000: 2b12 bfb8 008d 2a2b 4d3a 0d03 3e2c 3a04
0x0000010: bb00 2459 2cbe b700 2cc0 002e 3a05 0336
0x0000020: 0619 043a 0719 07be 3608 0336 0915 0915
0x0000030: 08a2 0037 1907 1509 323a 0a19 0519 0a3a
0x0000040: 0b3a 0e03 360c 190b b600 d419 0bb6 00d7
0x0000050: b800 b6b8 0065 3a0f 190e 190f b900 5902
0x0000060: 0057 8409 01a7 ffc8 1905 c000 5b3a 0e19
0x0000070: 0d19 0ec0 004e b800 6bb7 00b7 b1
Stackmap Table:
full_frame(@45,{UninitializedThis,Object[#220],Object[#220],Integer,Object[#220],Object[#46],Integer,Object[#220],Integer,Integer,Top,Top,Top,UninitializedThis},{})
same_frame(@104)
* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.
* Get more help at https://help.gradle.org
I found a solution but this one makes me some problems. I had to downgrade classpath('com.android.tools.build:gradle:3.6.3')
to classpath('com.android.tools.build:gradle:3.3.2')
, but this is a little bit frustrating. Why I can't use gradle:3.6.3?
react-native info
output:
System:
OS: macOS 10.15.2
CPU: (4) x64 Intel(R) Core(TM) i5-4258U CPU @ 2.40GHz
Memory: 105.25 MB / 8.00 GB
Shell: 5.7.1 - /bin/zsh
Binaries:
Node: 12.16.0 - /usr/local/bin/node
npm: 6.13.4 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 13.4, DriverKit 19.0, macOS 10.15, tvOS 13.4, watchOS 6.2
Android SDK:
API Levels: 28, 29
Build Tools: 28.0.3, 29.0.3, 30.0.0
System Images: android-29 | Google Play Intel x86 Atom
IDEs:
Android Studio: 3.6 AI-192.7142.36.36.6392135
Xcode: 11.4.1/11E503a - /usr/bin/xcodebuild
npmPackages:
react: 16.9.0 => 16.9.0
react-native: 0.61.5 => 0.61.5
npmGlobalPackages:
create-react-native-app: 3.1.1
react-native-cli: 2.0.1
Library version: 0.3.0
Thanks for your help
How can I access the 'value' property using React ref (useRef)?
const inputRef = useRef(null);
return (
<CheckBox
ref={inputRef}
/>
);
inputRef.current... ?????
Something like that!
When I run tsc -p .
I got
> tsc -p .
node_modules/@react-native-community/checkbox/typings/index.d.ts:3:37 - error TS2307: Cannot find module '../js/CheckBox.android' or its corresponding type declarations.
3 import {Props as AndroidProps} from '../js/CheckBox.android';
~~~~~~~~~~~~~~~~~~~~~~~~
node_modules/@react-native-community/checkbox/typings/index.d.ts:4:33 - error TS2307: Cannot find module '../js/CheckBox.ios' or its corresponding type declarations.
4 import {Props as IOSProps} from '../js/CheckBox.ios';
react-native info
output:
info Fetching system and libraries information...
System:
OS: Windows 10 10.0.19041
CPU: (8) x64 AMD Ryzen 5 3500U with Radeon Vega Mobile Gfx
Memory: 718.09 MB / 6.94 GB
Binaries:
Node: 14.6.0 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.4 - ~\AppData\Roaming\npm\yarn.CMD
npm: 6.14.6 - C:\Program Files\nodejs\npm.CMD
Watchman: Not Found
SDKs:
Android SDK:
API Levels: 28, 30
Build Tools: 28.0.3, 30.0.0
System Images: android-30 | Google Play Intel x86 Atom
Android NDK: Not Found
IDEs:
Android Studio: Version 4.0.0.0 AI-193.6911.18.40.6626763
Languages:
Java: 1.8.0_211 - C:\Program Files\Java\jdk1.8.0_211\bin\javac.EXE
Python: 3.8.5 - C:\tools\msys64\usr\bin\python.EXE
npmPackages:
@react-native-community/cli: Not Found
react: 16.11.0 => 16.11.0
react-native: 0.62.2 => 0.62.2
npmGlobalPackages:
*react-native*: Not Found
Library version: 0.4.2
tsc -p .
Describe what you expected to happen:
I'd like to change the box color (for my app color scheme, it would be better if the checked box was grey).
I tried to change tintColor, onCheckColor, onFillColor and onTintColor, I still had a green box.
An app may have a color scheme where this green doesn't it, and the user would want to change it.
Unfortunately, I never did native code, so I can't help with that :-(
Ideally, there'd be a prop "style" or "boxStyle" where we could change parameters
<CheckBox value={ true} boxStyle={ color: #ffffff } />
Hi, I can't get onStartShouldSetResponderCapture to work with this component.
<TouchableOpacity
onStartShouldSetResponderCapture={() => true}
onPress={() => console.log('test')}
>
<CheckBox onValueChange={this.onPress} value={this.props.checked} width={20} height={20} />
</TouchableOpacity>
In the example above I don't get the 'test' log as I expected. Is there a way to do it?
How to add a frame around a picker ?
In my example I try to make a frame around the picker to make it look nice but I am not success and it is not clear to me why. I'm running with Android and I can not see a frame around
import { Picker } from '@react-native-community/picker';
<Picker
mode="dropdown"
//pickerStyleType={}
selectedValue={selectedValue}
style={{
color: 'black',
placeholderTextColor: 'black',
borderColor: 'black',
borderWidth: 3,
height: 50,
width: 150,
justifyContent: 'flex-end',
}}
onValueChange={(itemValue, itemIndex) => setSelectedValue(itemValue)}
>
<Picker.Item label="1" value="1" />
<Picker.Item label="2" value="2" />
<Picker.Item label="3" value="3" />
</Picker>
const App = () => {
const [check] = useState(0);
return (
<>
<CheckBox value={check === 0} />
</>
);
};
Here when the checkbox is clicked the value changes which should not since check === 0
is always True
.
react-native info
output:
System:
OS: Linux 5.3 Ubuntu 18.04.4 LTS (Bionic Beaver)
CPU: (4) x64 Intel(R) Core(TM) i7-5500U CPU @ 2.40GHz
Memory: 620.03 MB / 7.69 GB
Shell: 4.4.20 - /bin/bash
Binaries:
Node: 10.16.3 - /usr/local/bin/node
Yarn: 1.22.4 - /usr/bin/yarn
npm: 6.13.0 - /usr/local/bin/npm
Watchman: Not Found
SDKs:
Android SDK: Not Found
IDEs:
Android Studio: Not Found
Languages:
Python: 2.7.17 - /usr/bin/python
npmPackages:
@react-native-community/cli: Not Found
react: 16.11.0 => 16.11.0
react-native: 0.62.0 => 0.62.0
npmGlobalPackages:
*react-native*: Not Found
Library version: 0.3.0
Is there any props to change the size of the checkbox? Because the size of the checkbox in ios is bigger as compared to android, and want to change the size of the checkbox.
Simplified version: On iOS, the checkbox ALWAYS changes state when clicked/tapped, even when an explicit value is set. This is only the case in iOS; on Android, the checkbox respects the value prop even when it does not change after a click/tap.
To reproduce (iOS):
<CheckBox disabled={ false } value={ true } onValueChange={(newValue) => console.log(newValue)} />
Now, try clicking/tapping the box. It will still become unchecked and "onValueChange" will still run" despite the value being explicitly set to true.
Currently when using VoiceOver on iOS its not possible to interact with the checkboxes.
With VoiceOver enabled, interactive elements (eg TouchableOpacity) can be pressed with a double tap, and 'tabbing' between elements (eg Text, TouchableOpacity) is done with swiping left and right, which brings them into focus and read aloud.
However neither of these accessibility controls are able to recognise the checkboxes.
It works great on Android's TalkBack though.
Hi,
After updating from 0.5.3 to 0.5.4, I have the following message when I run pod install
Errno::ENOENT - No such file or directory @ realpath_rec - /Users/mlecoq/work/archireport/dev/archireport_mobile/node_modules/@react-native-community/checkbox/ios/Pods/Headers/Private/BEMCheckBox/iOS
Going back to 0.5.3 solves the issue
When I run yarn run eslint .
, I'm running into the error below. In package.json
, there is this line "main":"dist/Checkbox"
; however, in the dist
folder of the module, there is no file that matches Checkbox
. If I manually change the package.json
file to match one of the files in the dist
folder, eslint does pass but this doesn't feel right. Any thoughts? #34 (comment) also addressed this issue.
Error: Cannot find module '.../node_modules/@react-native-community/checkbox/dist/CheckBox'. Please verify that the package.json has a valid "main" entry
This applies only to Windows. I've tried adding react-native-checkbox to my app by doing the following
1 run react-native init and generate a new project
2 run react-native-windows-init to add Windows support
3 yarn add @react-native-community/checkbox to the project
4 Manually add the checkbox vcxproj to the solution (as of version 62 we don't have auto-linking yet)
This is generating an error when importing the project:
D:\rngallery\node_modules@react-native-community\checkbox\windows\CheckboxWindows\CheckboxWindows.vcxproj : error : The imported project "D:\rngallery\node_modules@react-native-community\node_modules\react-native-windows\Microsoft.ReactNative.Cxx\Microsoft.ReactNative.Cxx.vcxitems" was not found. Confirm that the expression in the Import declaration "......\node_modules\react-native-windows\Microsoft.ReactNative.Cxx\Microsoft.ReactNative.Cxx.vcxitems" is correct, and that the file exists on disk. D:\rngallery\node_modules@react-native-community\checkbox\windows\CheckboxWindows\CheckboxWindows.vcxproj
I tracked this back to this line in the vcxproj for Windows:
https://github.com/react-native-community/react-native-checkbox/blob/756aabc9c37d07c9ed0fc93cf146d4231d8831c8/src/windows/CheckboxWindows/CheckboxWindows.vcxproj#L76
The problem here is the path to the shared project is using a relative path to ......\node_modules, which assumes react-native-windows is installed at the same directory as the community module, but this isn't the case when react-native-windows is hoisted up to the root.
I chatted with Igor about this, he understands the issue and will submit a fix.
This package should provide Web support.
A CheckBox component for the browser is built-in to React Native Web. But the React Native CheckBox is deprecated and will be removed at some time. So I think this package should also provide Web support, to have a all-in-one solution 🙂 Would be nice.
Maybe just move the code over here and deprecate it in React Native Web too @necolas 😄
I can't use it after install it with
npm install @react-native-community/checkbox --save
inside expo project
expo 3.0.4 windows user
1.install
2.Import
3.expo start
Hey. I've installed the checkbox lib like it says in the README.md.
But checkboxes can change their visual state only on a first tap (for each). I even tried some checkbox code from your example.
Then I tried a manual installation and on npx react-native run-android
got a failure:
(BTW later I 'uninstalled' the manual installation and it all went back to the first problem)
PS F:\Roma\prog\izigo> npx react-native run-android
info Running jetifier to migrate libraries to AndroidX. You can disable it using "--no-jetifier" flag.
Jetifier found 970 file(s) to forward-jetify. Using 4 workers...
info Starting JS server...
info Installing the app...
> Task :app:compileDebugJavaWithJavac
> Task :app:compileDebugJavaWithJavac FAILED
Deprecated Gradle features were used in this build, making it incompatible with Gradle 7.0.
Use '--warning-mode all' to show the individual deprecation warnings.
See https://docs.gradle.org/6.0.1/userguide/command_line_interface.html#sec:command_line_warnings
31 actionable tasks: 9 executed, 22 up-to-date
F:\Roma\prog\izigo\android\app\src\main\java\com\izigo\MainApplication.java:39: error: method does not override or implement a method from a supertype
@Override
^
F:\Roma\prog\izigo\android\app\src\main\java\com\izigo\MainApplication.java:42: error: cannot find symbol
new MainReactPackage(),
^
symbol: class MainReactPackage
location: class MainApplication
F:\Roma\prog\izigo\android\app\src\main\java\com\izigo\MainApplication.java:41: error: cannot find symbol
return Arrays.asList(
^
symbol: variable Arrays
location: class MainApplication
Note: F:\Roma\prog\izigo\android\app\src\debug\java\com\izigo\ReactNativeFlipper.java uses or overrides a deprecated
API.
Note: Recompile with -Xlint:deprecation for details.
3 errors
FAILURE: Build failed with an exception.
* What went wrong:
Execution failed for task ':app:compileDebugJavaWithJavac'.
> Compilation failed; see the compiler error output for details.
* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.
* Get more help at https://help.gradle.org
BUILD FAILED in 32s
error Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup. Run CLI with --verbose flag for more details.
Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081
F:\Roma\prog\izigo\android\app\src\main\java\com\izigo\MainApplication.java:39: error: method does not override or implement a method from a supertype
@Override
^
F:\Roma\prog\izigo\android\app\src\main\java\com\izigo\MainApplication.java:42: error: cannot find symbol
new MainReactPackage(),
^
symbol: class MainReactPackage
location: class MainApplication
F:\Roma\prog\izigo\android\app\src\main\java\com\izigo\MainApplication.java:41: error: cannot find symbol
return Arrays.asList(
^
symbol: variable Arrays
location: class MainApplication
Note: F:\Roma\prog\izigo\android\app\src\debug\java\com\izigo\ReactNativeFlipper.java uses or overrides a deprecated
API.
Note: Recompile with -Xlint:deprecation for details.
3 errors
FAILURE: Build failed with an exception.
* What went wrong:
Execution failed for task ':app:compileDebugJavaWithJavac'.
> Compilation failed; see the compiler error output for details.
* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.
* Get more help at https://help.gradle.org
BUILD FAILED in 32s
at makeError (F:\Roma\prog\izigo\node_modules\execa\index.js:174:9)
at F:\Roma\prog\izigo\node_modules\execa\index.js:278:16
at processTicksAndRejections (internal/process/task_queues.js:97:5)
at async runOnAllDevices (F:\Roma\prog\izigo\node_modules\@react-native-community\cli-platform-android\build\commands\runAndroid\runOnAllDevices.js:94:5)
at async Command.handleAction (F:\Roma\prog\izigo\node_modules\react-native\node_modules\@react-native-community\cli\build\index.js:186:9)
react-native info
output:
info Fetching system and libraries information...
System:
OS: Windows 10 10.0.17763
CPU: (4) x64 Intel(R) Core(TM) i3-3110M CPU @ 2.40GHz
Memory: 612.26 MB / 3.59 GB
Binaries:
Node: 12.16.3 - F:\Program Files\nodejs\node.EXE
Yarn: Not Found
npm: 6.14.4 - F:\Program Files\nodejs\npm.CMD
Watchman: Not Found
SDKs:
Android SDK:
API Levels: 28, 29
Build Tools: 28.0.3, 29.0.3
System Images: android-28 | Intel x86 Atom_64, android-29 | Google APIs Intel x86 Atom
Android NDK: Not Found
IDEs:
Android Studio: Version 3.6.0.0 AI-192.7142.36.36.6392135
Languages:
Java: Not Found
Python: 3.8.2
npmPackages:
@react-native-community/cli: Not Found
react: 16.11.0 => 16.11.0
react-native: 0.62.2 => 0.62.2
npmGlobalPackages:
*react-native*: Not Found
I'm new to react-native... Appreciate your help!
react-native info
output:
D:\rngallery>npx react-native info
info Fetching system and libraries information...
System:
OS: Windows 10 10.0.19041
CPU: (12) x64 Intel(R) Core(TM) i7-8700K CPU @ 3.70GHz
Memory: 16.22 GB / 31.85 GB
Binaries:
Node: 12.16.3 - C:\Program Files\nodejs\node.EXE
Yarn: 1.19.1 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
npm: 6.14.4 - C:\Program Files\nodejs\npm.CMD
Watchman: Not Found
SDKs:
Android SDK:
API Levels: 28, 29
Build Tools: 28.0.3, 29.0.2
System Images: android-28 | Intel x86 Atom_64, android-28 | Google APIs Intel x86 Atom, android-28 | Google Play Intel x86 Atom
Android NDK: 17.2.4988734
IDEs:
Android Studio: Version 3.6.0.0 AI-192.7142.36.36.6392135
Languages:
Java: Not Found
Python: 3.8.5 - C:\Python38\python.EXE
npmPackages:
@react-native-community/cli: Not Found
react: 16.11.0 => 16.11.0
react-native: ^0.62.0-0 => 0.62.2
npmGlobalPackages:
*react-native*: Not Found
Library version: x.x.x
yarn add @react-native-community/checkbox to an existing react-native project
Configure typescript using the standard tsconfig from RN website. See https://reactnative.dev/docs/typescript
yarn tsc
Describe what you expected to happen:
build should succeed
Instead you get some build errors:
node_modules/@react-native-community/checkbox/typings/index.d.ts:3:37 - error TS2307: Cannot find module '../js/CheckBox.android' or its corresponding type declarations.
3 import {Props as AndroidProps} from '../js/CheckBox.android';
~~~~~~~~~~~~~~~~~~~~~~~~
node_modules/@react-native-community/checkbox/typings/index.d.ts:4:33 - error TS2307: Cannot find module '../js/CheckBox.ios' or its corresponding type declarations.
4 import {Props as IOSProps} from '../js/CheckBox.ios';
~~~~~~~~~~~~~~~~~~~~
node_modules/@react-native-community/checkbox/typings/index.d.ts:5:37 - error TS2307: Cannot find module '../js/CheckBox.windows' or its corresponding type declarations.
5 import {Props as WindowsProps} from '../js/CheckBox.windows';
~~~~~~~~~~~~~~~~~~~~~~~~
Clone this repo and switch to the ts branch:
https://github.com/microsoft/RNGallery/tree/ts
Hello guys, thank you for maintaining this project.
Today after upgrading everything (macOS to Big Sur, Xcode and Android studio to latest), when trying to build a plain react-native app for android I get this gradle incompatibility error.
I had just started the app with npx react-native init MyApp
micaelmota@Micaels-MacBook-Pro ios % yarn android
yarn run v1.22.4
$ react-native run-android
info Running jetifier to migrate libraries to AndroidX. You can disable it using "--no-jetifier" flag.
Jetifier found 972 file(s) to forward-jetify. Using 12 workers...
info JS server already running.
* daemon not running; starting now at tcp:5037
* daemon started successfully
info Launching emulator...
info Successfully launched emulator.
info Installing the app...
Downloading https://services.gradle.org/distributions/gradle-6.2-all.zip
.............10%.............20%.............30%..............40%.............50%.............60%.............70%..............80%.............90%.............100%
Welcome to Gradle 6.2!
Here are the highlights of this release:
- Dependency checksum and signature verification
- Documentation links in deprecation messages
- Shareable read-only dependency cache
For more details see https://docs.gradle.org/6.2/release-notes.html
Starting a Gradle Daemon (subsequent builds will be faster)
> Task :react-native-community_checkbox:compileDebugJavaWithJavac FAILED
Deprecated Gradle features were used in this build, making it incompatible with Gradle 7.0.
Use '--warning-mode all' to show the individual deprecation warnings.
See https://docs.gradle.org/6.2/userguide/command_line_interface.html#sec:command_line_warnings
21 actionable tasks: 21 executed
FAILURE: Build failed with an exception.
* What went wrong:
Execution failed for task ':react-native-community_checkbox:compileDebugJavaWithJavac'.
> Could not find tools.jar. Please check that /Library/Internet Plug-Ins/JavaAppletPlugin.plugin/Contents/Home contains a valid JDK installation.
* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.
* Get more help at https://help.gradle.org
BUILD FAILED in 2m 51s
error Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup. Run CLI with --verbose flag for more details.
Error: Command failed: ./gradlew app:installDebug -PreactNativeDevServerPort=8081
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
I am getting this error Error: no suitable constructor found for Event(int)
while running the application this morning, it was running fine 2 days ago.
Complete stack trace. I am using android and latest react-native version 0.63
react-native run-android
info Running jetifier to migrate libraries to AndroidX. You can disable it using "--no-jetifier" flag.
Jetifier found 1316 file(s) to forward-jetify. Using 8 workers...
info Starting JS server...
info Installing the app...
> Configure project :app
registerResGeneratingTask is deprecated, use registerGeneratedResFolders(FileCollection)
registerResGeneratingTask is deprecated, use registerGeneratedResFolders(FileCollection)
> Configure project :react-native-firebase_app
:react-native-firebase_app package.json found at D:\Projects\ui-team-demos\clearview-mobile\node_modules\@react-native-firebase\app\package.json
:react-native-firebase_app:firebase.bom using default value: 25.3.1
:react-native-firebase_app package.json found at D:\Projects\ui-team-demos\clearview-mobile\node_modules\@react-native-firebase\app\package.json
:react-native-firebase_app:version set from package.json: 8.0.0 (8,0,0 - 8000000)
:react-native-firebase_app:android.compileSdk using custom value: 29
:react-native-firebase_app:android.targetSdk using custom value: 29
:react-native-firebase_app:android.minSdk using custom value: 16
:react-native-firebase_app:reactNativeAndroidDir D:\Projects\ui-team-demos\clearview-mobile\node_modules\react-native\android
> Configure project :react-native-firebase_messaging
:react-native-firebase_messaging package.json found at D:\Projects\ui-team-demos\clearview-mobile\node_modules\@react-native-firebase\messaging\package.json
:react-native-firebase_app package.json found at D:\Projects\ui-team-demos\clearview-mobile\node_modules\@react-native-firebase\app\package.json
:react-native-firebase_messaging:firebase.bom using default value: 25.3.1
:react-native-firebase_messaging package.json found at D:\Projects\ui-team-demos\clearview-mobile\node_modules\@react-native-firebase\messaging\package.json
:react-native-firebase_messaging:version set from package.json: 7.2.1 (7,2,1 - 7002001)
:react-native-firebase_messaging:android.compileSdk using custom value: 29
:react-native-firebase_messaging:android.targetSdk using custom value: 29
:react-native-firebase_messaging:android.minSdk using custom value: 16
:react-native-firebase_messaging:reactNativeAndroidDir D:\Projects\ui-team-demos\clearview-mobile\node_modules\react-native\android
> Task :react-native-community_checkbox:compileDebugJavaWithJavac FAILED
Deprecated Gradle features were used in this build, making it incompatible with Gradle 7.0.
Use '--warning-mode all' to show the individual deprecation warnings.
See https://docs.gradle.org/6.2/userguide/command_line_interface.html#sec:command_line_warnings
39 actionable tasks: 19 executed, 20 up-to-date
D:\Projects\ui-team-demos\clearview-mobile\node_modules\@react-native-community\checkbox\android\src\main\java\com\reactnativecommunity\checkbox\ReactCheckBoxEvent.java:22: error: no suitable constructor found for Event(int)
super(viewId);
^
constructor Event.Event() is not applicable
(actual and formal argument lists differ in length)
constructor Event.Event(int,long) is not applicable
(actual and formal argument lists differ in length)
1 error
FAILURE: Build failed with an exception.
* What went wrong:
Execution failed for task ':react-native-community_checkbox:compileDebugJavaWithJavac'.
> Compilation failed; see the compiler error output for details.
* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full
insights.
* Get more help at https://help.gradle.org
BUILD FAILED in 23s
error Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup. Run CLI with --verbose flag for more details.
Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081
D:\Projects\ui-team-demos\clearview-mobile\node_modules\@react-native-community\checkbox\android\src\main\java\com\reactnativecommunity\checkbox\ReactCheckBoxEvent.java:22: error: no suitable constructor found for Event(int)
Please add an onPress() event. This is especially useful in automating testing. I am having to jerry rig by wrapping TouchableOpacity element around checkbox just to make RTL (Jest) pass the test.
This seems like it's a controlled component since it takes value
and onValueChange
as props. But, if value changes outside of the checkbox, it doesn't update. To me, this makes it not a controlled component. Am I missing something here?
react-native info
output:
info Fetching system and libraries information...
System:
OS: macOS 11.0
CPU: (4) x64 Intel(R) Core(TM) i5-7267U CPU @ 3.10GHz
Memory: 189.56 MB / 16.00 GB
Shell: 5.8 - /usr/local/bin/zsh
Binaries:
Node: 14.7.0 - /private/var/folders/5w/5dc75xj91xx_mvq7prvkplx80000gn/T/xfs-46c4d0de/node
Yarn: 2.0.0-rc.36 - /private/var/folders/5w/5dc75xj91xx_mvq7prvkplx80000gn/T/xfs-46c4d0de/yarn
npm: 6.14.7 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
Managers:
CocoaPods: 1.9.3 - /usr/local/lib/ruby/gems/2.7.0/bin/pod
SDKs:
iOS SDK:
Platforms: iOS 14.0, DriverKit 20.0, macOS 11.0, tvOS 14.0, watchOS 7.0
Android SDK:
API Levels: 29
Build Tools: 29.0.2, 30.0.1
Android NDK: Not Found
IDEs:
Android Studio: 4.0 AI-193.6911.18.40.6514223
Xcode: 12.0/12A8179i - /usr/bin/xcodebuild
Languages:
Java: 14.0.1 - /usr/bin/javac
Python: 2.7.16 - /usr/bin/python
npmPackages:
@react-native-community/cli: Not Found
react: ^16.13.1 => 16.13.1
react-native: ^0.63.2 => 0.63.2
npmGlobalPackages:
*react-native*: Not Found
Library version: 0.4.2
useState
Describe what you expected to happen:
I expect the checkbox to match the value. If I change the value, it should check / uncheck accordingly.
const [toggleCheckBox, setToggleCheckBox] = useState(false)
return
<>
<CheckBox
disabled={false}
value={toggleCheckBox}
onValueChange={(newValue) => setToggleCheckBox(newValue)}
/>
<Button
onPress={() => {
Alert.alert(
'Alert Title',
'My Alert Msg',
[
{
text: 'Ask me later',
onPress: () => setToggleCheckBox(!toggleCheckBox),
},
{
text: 'No',
style: 'cancel',
},
],
{cancelable: false},
);
}}
title="toggle"
/>
</>
Flow throws about 60 errors related to this package. Is this expected? Maybe it's due to the fact that your flow config is not up to date?
An extract from the error logs:
$ flow --show-all-errors .
Error ┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈ node_modules/@react-native-community/checkbox/dist/CheckBox.ios.js:11:26
Property __extends is missing in global object [1].
8│ * @format
9│ */
10│ 'use strict';
[1] 11│ var __extends = (this && this.__extends) || (function () {
12│ var extendStatics = function (d, b) {
13│ extendStatics = Object.setPrototypeOf ||
14│ ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
Error ┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈ node_modules/@react-native-community/checkbox/dist/CheckBox.ios.js:14:27
Cannot use empty array literal [1] as a prototype. Expected an object or null.
11│ var __extends = (this && this.__extends) || (function () {
12│ var extendStatics = function (d, b) {
13│ extendStatics = Object.setPrototypeOf ||
[1] 14│ ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
15│ function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
16│ return extendStatics(d, b);
17│ };
Error ┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈ node_modules/@react-native-community/checkbox/dist/CheckBox.ios.js:14:70
Mutating this prototype is unsupported.
11│ var __extends = (this && this.__extends) || (function () {
12│ var extendStatics = function (d, b) {
13│ extendStatics = Object.setPrototypeOf ||
14│ ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
15│ function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
16│ return extendStatics(d, b);
17│ };
Error ┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈ node_modules/@react-native-community/checkbox/dist/CheckBox.ios.js:24:25
Property __assign is missing in global object [1].
[1] 11│ var __extends = (this && this.__extends) || (function () {
:
21│ d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
22│ };
23│ })();
24│ var __assign = (this && this.__assign) || function () {
25│ __assign = Object.assign || function(t) {
26│ for (var s, i = 1, n = arguments.length; i < n; i++) {
27│ s = arguments[i];
Error ┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈ node_modules/@react-native-community/checkbox/dist/CheckBox.ios.js:33:33
A spread argument is unsupported here.
30│ }
31│ return t;
32│ };
33│ return __assign.apply(this, arguments);
34│ };
35│ var __rest = (this && this.__rest) || function (s, e) {
36│ var t = {};
Error ┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈ node_modules/@react-native-community/checkbox/dist/CheckBox.ios.js:35:23
Property __rest is missing in global object [1].
[1] 11│ var __extends = (this && this.__extends) || (function () {
:
32│ };
33│ return __assign.apply(this, arguments);
34│ };
35│ var __rest = (this && this.__rest) || function (s, e) {
36│ var t = {};
37│ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
38│ t[p] = s[p];
Error ┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈ node_modules/@react-native-community/checkbox/dist/CheckBox.ios.js:42:19
Cannot assign computed property using Symbol [1].
node_modules/@react-native-community/checkbox/dist/CheckBox.ios.js
39│ if (s != null && typeof Object.getOwnPropertySymbols === "function")
40│ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
41│ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
42│ t[p[i]] = s[p[i]];
43│ }
44│ return t;
45│ };
/private/tmp/flow/flowlib_37553ac1/core.js
[1] 55│ static getOwnPropertySymbols(o: mixed): Symbol[];
Error ┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈ node_modules/@react-native-community/checkbox/dist/CheckBox.ios.js:46:32
Property __importDefault is missing in global object [1].
[1] 11│ var __extends = (this && this.__extends) || (function () {
:
43│ }
44│ return t;
45│ };
46│ var __importDefault = (this && this.__importDefault) || function (mod) {
47│ return (mod && mod.__esModule) ? mod : { "default": mod };
48│ };
49│ Object.defineProperty(exports, "__esModule", { value: true });
Error ┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈ node_modules/@react-native-community/checkbox/dist/CheckBox.ios.js:50:20
Cannot call __importDefault because:
• property __importDefault of unknown type [1] is not a function.
• a call signature declaring the expected parameter / return type is missing in global object [2].
[1] 46│ var __importDefault = (this && this.__importDefault) || function (mod) {
47│ return (mod && mod.__esModule) ? mod : { "default": mod };
48│ };
49│ Object.defineProperty(exports, "__esModule", { value: true });
[2] 50│ var nullthrows_1 = __importDefault(require("nullthrows"));
51│ var react_1 = __importDefault(require("react"));
52│ var react_native_1 = require("react-native");
53│ var IOSCheckBoxNativeComponent_1 = __importDefault(require("./IOSCheckBoxNativeComponent"));
Error ┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈ node_modules/@react-native-community/checkbox/dist/CheckBox.ios.js:51:15
Cannot call __importDefault because:
• property __importDefault of unknown type [1] is not a function.
• a call signature declaring the expected parameter / return type is missing in global object [2].
[1] 46│ var __importDefault = (this && this.__importDefault) || function (mod) {
47│ return (mod && mod.__esModule) ? mod : { "default": mod };
48│ };
49│ Object.defineProperty(exports, "__esModule", { value: true });
50│ var nullthrows_1 = __importDefault(require("nullthrows"));
[2] 51│ var react_1 = __importDefault(require("react"));
52│ var react_native_1 = require("react-native");
53│ var IOSCheckBoxNativeComponent_1 = __importDefault(require("./IOSCheckBoxNativeComponent"));
54│ // @ts-ignore setAndForwardRef type does not exist in @types/react-native
Error ┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈┈ node_modules/@react-native-community/checkbox/dist/CheckBox.ios.js:53:36
Cannot call __importDefault because:
• property __importDefault of unknown type [1] is not a function.
• a call signature declaring the expected parameter / return type is missing in global object [2].
[1] 46│ var __importDefault = (this && this.__importDefault) || function (mod) {
47│ return (mod && mod.__esModule) ? mod : { "default": mod };
48│ };
49│ Object.defineProperty(exports, "__esModule", { value: true });
50│ var nullthrows_1 = __importDefault(require("nullthrows"));
51│ var react_1 = __importDefault(require("react"));
52│ var react_native_1 = require("react-native");
[2] 53│ var IOSCheckBoxNativeComponent_1 = __importDefault(require("./IOSCheckBoxNativeComponent"));
54│ // @ts-ignore setAndForwardRef type does not exist in @types/react-native
55│ var setAndForwardRef_1 = __importDefault(require("react-native/Libraries/Utilities/setAndForwardRef"));
56│ var CheckBox = /** @class */ (function (_super) {
...
react-native info
output:
System:
OS: macOS Mojave 10.14.6
CPU: (8) x64 Intel(R) Core(TM) i5-8279U CPU @ 2.40GHz
Memory: 189.59 MB / 16.00 GB
Shell: 5.3 - /bin/zsh
Binaries:
Node: 10.14.2 - ~/.nvm/versions/node/v10.14.2/bin/node
Yarn: 1.22.4 - ~/.yarn/bin/yarn
npm: 6.4.1 - ~/.nvm/versions/node/v10.14.2/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 13.2, DriverKit 19.0, macOS 10.15, tvOS 13.2, watchOS 6.1
Android SDK:
API Levels: 23, 27, 28, 29
Build Tools: 27.0.3, 28.0.3, 29.0.2, 29.0.3
System Images: android-21 | Google APIs Intel x86 Atom_64, android-28 | Google APIs Intel x86 Atom, android-29 | Google APIs Intel x86 Atom
Android NDK: 21.0.6113669
IDEs:
Android Studio: 3.6 AI-192.7142.36.36.6392135
Xcode: 11.3.1/11C504 - /usr/bin/xcodebuild
npmPackages:
react: 16.8.6 => 16.8.6
react-native: 0.60.0 => 0.60.0
npmGlobalPackages:
react-native-cli: 2.0.1
Library version: 0.5.3
yarn flow
Describe what you expected to happen:
No flow errors should appear.
After run yarn add @react-native-community/checkbox
I had run pod install
inside the ios folder, but I'm getting this error:
[!] No podspec found for @react-native-community
in ../node_modules/@react-native-community/checkbox
React native info output:
System:
OS: macOS 10.14.6
CPU: (4) x64 Intel(R) Core(TM) i5-5257U CPU @ 2.70GHz
Memory: 47.00 MB / 8.00 GB
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 12.9.0 - /usr/local/bin/node
Yarn: 1.17.3 - /usr/local/bin/yarn
npm: 6.10.3 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 12.2, macOS 10.14, tvOS 12.2, watchOS 5.2
IDEs:
Android Studio: 3.5 AI-191.8026.42.35.5791312
Xcode: 10.2.1/10E1001 - /usr/bin/xcodebuild
npmPackages:
react: 16.8.6 => 16.8.6
react-native: 0.60.5 => 0.60.5
npmGlobalPackages:
react-native-cli: 2.0.1
Library version: ^0.2.0
yarn add @react-native-community/checkbox
Describe what you expected to happen:
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.